diff --git a/apps/showcase/CHANGELOG.md b/apps/showcase/CHANGELOG.md new file mode 100644 index 000000000..1cfa89c1f --- /dev/null +++ b/apps/showcase/CHANGELOG.md @@ -0,0 +1,3955 @@ +# Changelog + +## [4.0.0-beta.4](https://github.com/primefaces/primevue/tree/4.0.0-beta.4) (2024-05-30) + +[Full Changelog](https://github.com/primefaces/primevue/compare/4.0.0-beta.3...4.0.0-beta.4) + +**Deprecated:** + +- Deprecate inputStyle and add inputVariant [\#5786](https://github.com/primefaces/primevue/issues/5786) + +**Breaking Changes:** + +- Deprecated slots [\#5785](https://github.com/primefaces/primevue/issues/5785) +- Renamed properties [\#5784](https://github.com/primefaces/primevue/issues/5784) +- Add OverlayBadge component, deprecate Badge directive [\#5769](https://github.com/primefaces/primevue/issues/5769) +- Dialog: rtl removed [\#5763](https://github.com/primefaces/primevue/issues/5763) + +**Fixed bugs:** + +- Popover: Arrow offset uses wrong design token [\#5755](https://github.com/primefaces/primevue/issues/5755) +- InputNumber: Missing type declaration for buttons leads to form submit on button click [\#5700](https://github.com/primefaces/primevue/issues/5700) +- DatePicker: Focus blink on select [\#5676](https://github.com/primefaces/primevue/issues/5676) + +**Implemented New Features and Enhancements:** + +- Load primitive, semantic and global styles in styled mode [\#5789](https://github.com/primefaces/primevue/issues/5789) +- [All components]: TypeScript emits are in an incompatible format with defineEmits [\#5405](https://github.com/primefaces/primevue/issues/5405) + +## [4.0.0-beta.3](https://github.com/primefaces/primevue/tree/4.0.0-beta.3) (2024-05-15) + +[Full Changelog](https://github.com/primefaces/primevue/compare/4.0.0-beta.2...4.0.0-beta.3) + +**Deprecated:** + +- Deprecated: InputChips [\#5744](https://github.com/primefaces/primevue/issues/5744) + +**Breaking Changes:** + +- Removed Utility Classes [\#5727](https://github.com/primefaces/primevue/issues/5727) +- Fieldset: #legend updates [\#5719](https://github.com/primefaces/primevue/issues/5719) +- Table: remove responsiveLayout [\#5717](https://github.com/primefaces/primevue/issues/5717) +- FileUpload: basic mode button label & file label changes [\#5715](https://github.com/primefaces/primevue/issues/5715) +- Remove Drawer size [\#5714](https://github.com/primefaces/primevue/issues/5714) +- Deprecated emits [\#5721](https://github.com/primefaces/primevue/issues/5721) +- Deprecated properties [\#5683](https://github.com/primefaces/primevue/issues/5683) +- Deprecated slots [\#5682](https://github.com/primefaces/primevue/issues/5682) +- Key name changes for pt property [\#5681](https://github.com/primefaces/primevue/issues/5681) + +**Fixed bugs:** + +- Tabs: Ripple Position [\#5690](https://github.com/primefaces/primevue/issues/5690) +- [v4 beta1: InputMask] Placeholder attribute does not work [\#5664](https://github.com/primefaces/primevue/issues/5664) +- Accordion: "Invalid watch source: undefined" and "Failed to resolve directive: ripple" [\#5733](https://github.com/primefaces/primevue/issues/5733) +- v4: TypeError: Theme\_\_default.default.setPreset is not a function when configuring theme configuration using definePreset in vitest tests [\#5689](https://github.com/primefaces/primevue/issues/5689) + +**Implemented New Features and Enhancements:** + +- Remove PrimeVueStyled and PrimeVueUnstyled plugins [\#5728](https://github.com/primefaces/primevue/issues/5728) +- Small sized Badge [\#5729](https://github.com/primefaces/primevue/issues/5729) + +## [4.0.0-beta.2](https://github.com/primefaces/primevue/tree/4.0.0-beta.2) (2024-05-03) + +[Full Changelog](https://github.com/primefaces/primevue/compare/4.0.0-beta.1...4.0.0-beta.2) + +**Deprecated:** + +- Deprecated: TabView [\#5622](https://github.com/primefaces/primevue/issues/5622) + +**Breaking Changes:** + +- TreeTable CSS and responsive structure improvements [\#5678](https://github.com/primefaces/primevue/issues/5678) +- Deprecated properties [\#5662](https://github.com/primefaces/primevue/issues/5662) +- Deprecated slots [\#5661](https://github.com/primefaces/primevue/issues/5618) +- Legacy & New alternative components [\#5612](https://github.com/primefaces/primevue/issues/5612) +- Key name changes for pt property [\#5592](https://github.com/primefaces/primevue/issues/5592) +- Remove legacy CSS rules [\#5493](https://github.com/primefaces/primevue/issues/5493) +- warning property name changed as warn [\#5591](https://github.com/primefaces/primevue/issues/5591) +- Removed properties [\#5553](https://github.com/primefaces/primevue/issues/5553) +- Component Replacements [\#5548](https://github.com/primefaces/primevue/issues/5548) +- Remove iconPosition from IconField [\#5547](https://github.com/primefaces/primevue/issues/5547) + +**Fixed bugs:** + +- FileUpload v4: disabled property does not disable choose button (it only disables the choose functionality) [\#5529](https://github.com/primefaces/primevue/issues/5529) + +**Implemented New Features and Enhancements:** + +- Add sideEffects: false to nested package.json files on components [\#5668](https://github.com/primefaces/primevue/issues/5668) +- Remove base option from theme config [\#5667](https://github.com/primefaces/primevue/issues/5667) +- Reimplement: Accordion [\#5643](https://github.com/primefaces/primevue/issues/5643) +- New Component: Tabs [\#5621](https://github.com/primefaces/primevue/issues/5621) + +## [4.0.0-beta.1](https://github.com/primefaces/primevue/tree/4.0.0-beta.1) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.51.0...4.0.0-beta.1) + +**Breaking Changes:** + +- New Styled Mode Implementation [\#5501](https://github.com/primefaces/primevue/issues/5662) +- Remove changeTheme method from $primevue [\#5000](https://github.com/primefaces/primevue/issues/5000) +- Remove deprecated Tailwind Pass Through Object [\#5478](https://github.com/primefaces/primevue/issues/5478) +- Removed components [\#5476](https://github.com/primefaces/primevue/issues/5662) +- Remove primevue[.min].css from build [\#5481](https://github.com/primefaces/primevue/issues/5481) +- Remove themes folder from resources [\#5477](https://github.com/primefaces/primevue/issues/5477) +- Core behavior changes [\#5437](https://github.com/primefaces/primevue/issues/5437) +- Component Replacements [\#5426](https://github.com/primefaces/primevue/issues/5426) + +**Implemented New Features and Enhancements:** + +- Add dt props to all components and directives [\#5506](https://github.com/primefaces/primevue/issues/5506) +- Add PrimeVueStyled and PrimeVueUnstyled plugins [\#5502](https://github.com/primefaces/primevue/issues/5502) +- Checkbox: new indeterminate state [\#5479](https://github.com/primefaces/primevue/issues/5479) + +## [3.52.0](https://github.com/primefaces/primevue/tree/3.52.0) (2024-04-26) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.51.0...3.52.0) + +**Fixed bugs:** + +- InputOp: Digits only doesn't work on mobile [\#5635](https://github.com/primefaces/primevue/issues/5635) +- Calendar: Hours are set to 00 when clicking the "Today" button [\#5620](https://github.com/primefaces/primevue/issues/5620) +- Paginator: Responsive Templating showing multiple layouts on break points [\#5604](https://github.com/primefaces/primevue/issues/5604) +- InputNumber: The InputNumber is not working properly in the new version [\#5602](https://github.com/primefaces/primevue/issues/5602) +- Menu / Stepper: Pass Through Unstyled Mode [\#5599](https://github.com/primefaces/primevue/issues/5599) +- Hydration defects [\#5593](https://github.com/primefaces/primevue/issues/5593) +- InputNumber: Cannot input number 0 in Hungarian(QWERTZ) layout [\#5577](https://github.com/primefaces/primevue/issues/5577) +- Menu: support style property for submenuHeader item [\#5562](https://github.com/primefaces/primevue/issues/5562) +- InputNumber Not Working android [\#5545](https://github.com/primefaces/primevue/issues/5545) +- InputNumber: Cannot input numbers in AZERTY layout [\#5508](https://github.com/primefaces/primevue/issues/5508) +- DataTable: rowClass, rowStyle typing defects [\#5498](https://github.com/primefaces/primevue/issues/5498) +- DataTable: Modifying value of expendedRow is not reflected [\#5372](https://github.com/primefaces/primevue/issues/5372) +- InputNumber can't enter 0.0x using minFractionDigits/mode="currency" [\#5170](https://github.com/primefaces/primevue/issues/5170) +- Calendar: Input value is not updated when model is changed externally [\#4938](https://github.com/primefaces/primevue/issues/4938) + +**Implemented New Features and Enhancements:** + +- AutoComplete: Enter does not submit form [\#5618](https://github.com/primefaces/primevue/issues/5618) +- Knob: Added valueTemplate function support [\#5616](https://github.com/primefaces/primevue/issues/5616) +- Tree: Missing Passthrough Options [\#5574](https://github.com/primefaces/primevue/issues/5574) +- Sidebar: dismissable prop can't be changed dynamically [\#5563](https://github.com/primefaces/primevue/issues/5563) +- TreeTable: filterField ignored [\#5525](https://github.com/primefaces/primevue/issues/5525) +- ScrollPanel: Errors in moveBar() when xBar and yBar attributes don't exist [\#5518](https://github.com/primefaces/primevue/issues/5518) +- Toast: Race condition on remove [\#5225](https://github.com/primefaces/primevue/issues/5225) +- Dropdown: aria-label missing from inner ul element [\#5277](https://github.com/primefaces/primevue/issues/5277) + +## [3.51.0](https://github.com/primefaces/primevue/tree/3.51.0) (2024-04-04) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.50.0...3.51.0) + +**Fixed bugs:** + +- tree: loadingMode [\#5509](https://github.com/primefaces/primevue/issues/5509) +- Upload File doen'st show invalidFileSizeMessage [\#5497](https://github.com/primefaces/primevue/issues/5497) +- Stepper: changing step is making the StepperPanel a render [\#5495](https://github.com/primefaces/primevue/issues/5495) +- Multiselect - Filter - Duplicate keys on search. [\#5455](https://github.com/primefaces/primevue/issues/5455) +- Slider: Focus on slider on mouse click not working [\#5446](https://github.com/primefaces/primevue/issues/4833) +- Dropdown: throws error when grouped item is selected [\#5445](https://github.com/primefaces/primevue/issues/5445) +- Stepper: number element box-shadow defect [\#5442](https://github.com/primefaces/primevue/issues/5442) +- Autocomplete: isSelected(option) doesn't work correctly when 'multiple' is true [\#5435](https://github.com/primefaces/primevue/issues/5435) +- Carousel: Unable to scroll vertically on mobile [\#5320](https://github.com/primefaces/primevue/issues/5320) +- InputOtp: Unable to input integers in integerOnly [\#5422](https://github.com/primefaces/primevue/issues/5422) +- Menu components: Hidden Menu-Item can still be activated (focused) on Keyboard-Navigation [\#5318](https://github.com/primefaces/primevue/issues/5318) +- Slider: [Violation] Non-passive event [\#5213](https://github.com/primefaces/primevue/issues/5213) +- DataTable: improve globalFilterFields type [\#5212](https://github.com/primefaces/primevue/issues/5212) +- DataTable: resizableColumns and paginator bug [\#5210](https://github.com/primefaces/primevue/issues/5210) +- Calendar: no enter transition when used in inline mode inside HeadlessUI dialog [\#5294](https://github.com/primefaces/primevue/issues/5294) +- InputNumber: Cut or Paste via keyboard shortcuts in Safari doesn't work [\#3928](https://github.com/primefaces/primevue/issues/3928) +- Calendar: Invalid typings for modelValue. [\#3609](https://github.com/primefaces/primevue/issues/3609) + +**Implemented New Features and Enhancements:** + +- PrimeIcons: version 7 [\#5524](https://github.com/primefaces/primevue/issues/5524) +- Carousel Enhancement - Empty Slot [\#5474](https://github.com/primefaces/primevue/issues/5474) +- Dropdown Pass Through: item [\#5470](https://github.com/primefaces/primevue/issues/5470) +- Tree: Style Classes not passed to nodeicon slot [\#5452](https://github.com/primefaces/primevue/issues/5452) +- fix(types): augment GlobalComponent interface in vue module [\#5419](https://github.com/primefaces/primevue/pull/5419) +- Twice render if $attrs.id not defined [\#5412](https://github.com/primefaces/primevue/issues/5412) +- TieredMenu: Pressing Escape-Key in submenu moves focus to first menuitem [\#5327](https://github.com/primefaces/primevue/issues/5327) + +## [3.50.0](https://github.com/primefaces/primevue/tree/3.50.0) (2024-03-15) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.49.1...3.50.0) + +**Fixed bugs:** + +- InputOtp: typing defects [\#5421](https://github.com/primefaces/primevue/issues/5421) +- Multiselect: Wrong position of the panel with appendTo="self" [\#5411](https://github.com/primefaces/primevue/issues/5411) +- DataTable: tableStyle typing defect [\#5410](https://github.com/primefaces/primevue/issues/5410) +- Image: indicator slot is without function [\#5389](https://github.com/primefaces/primevue/issues/5389) +- InputOtp: wrong usage of inputmode[\#5382](https://github.com/primefaces/primevue/issues/5382) +- IconField: Wrong casing in Typescript module declaration file (.d.ts) [\#5376](https://github.com/primefaces/primevue/issues/5376) +- Terimnal: Doesn't work on mobile [\#5364](https://github.com/primefaces/primevue/issues/5364) +- Property 'disabled' does not exist on type 'SelectButtonContext'. [\#5354](https://github.com/primefaces/primevue/issues/5354) +- DataTable: rowStyle invalid Type: Got function expected object [\#5349](https://github.com/primefaces/primevue/issues/5349) +- DataTable: [Vue warn]: Invalid prop: type check failed for prop "rowClass". Expected String | Object, got Function [\#5341](https://github.com/primefaces/primevue/issues/5341) +- InputOtp: Length not working [\#5336](https://github.com/primefaces/primevue/issues/5336) +- inputOTP - integerOnly doesn't work with number pad [\#5329](https://github.com/primefaces/primevue/issues/5329) +- Table: Computed property "bodyStyle" is already defined in Props. [\#5243](https://github.com/primefaces/primevue/issues/5243) +- InputNumber: Bug deprecated KeyCode Usage [\#5008](https://github.com/primefaces/primevue/issues/5008) + +**Implemented New Features and Enhancements:** + +- Tree: Slot for icon property of value [\#4833](https://github.com/primefaces/primevue/issues/4833) + +## [3.49.1](https://github.com/primefaces/primevue/tree/3.49.1) (2024-02-26) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.49.0...3.49.1) + +**Fixed bugs:** + +- Stepper component style build is broken [\#5332](https://github.com/primefaces/primevue/issues/5332) + +## [3.49.0](https://github.com/primefaces/primevue/tree/3.49.0) (2024-02-23) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.48.1...3.49.0) + +**Fixed bugs:** + +- SplitterPanel: nested context hydration fixed [\#5322](https://github.com/primefaces/primevue/issues/5322) +- Password: after reset password meter not reset [\#5304](https://github.com/primefaces/primevue/issues/5304) +- DataTable: tableClass prop specifies String type, though Array also works [\#5297](https://github.com/primefaces/primevue/issues/5297) +- document.body.setAttribute('data-p-unselectable-text') missing second arguments. [\#5280](https://github.com/primefaces/primevue/issues/5280) +- Galleria animation defect [\#5279](https://github.com/primefaces/primevue/issues/5279) +- Menu components itemicon slot does not work expected [\#5276](https://github.com/primefaces/primevue/issues/5276) +- SelectButton: (accessibility) disabled mode focus defects [\#5274](https://github.com/primefaces/primevue/issues/5274) +- DataTable: "Ctrl + A" selects all rows even in selectionMode "single" [\#5271](https://github.com/primefaces/primevue/issues/5271) +- Galleria: fullscreen mode bug with thumbnails [\#5267](https://github.com/primefaces/primevue/issues/5267) +- TabView: previousicon slot doesn't work [\#5264](https://github.com/primefaces/primevue/issues/5264) +- Calendar: When entering the time by hand into timeOnly calendar, values switch to NaN:NaN [\#5254](https://github.com/primefaces/primevue/issues/5254) +- MeterGroup: Cutoff at the beginning when the first element is 0 [\#5252](https://github.com/primefaces/primevue/issues/5252) +- TabView: selectOnFocus mode defect [\#5245](https://github.com/primefaces/primevue/issues/5245) +- ConfirmDialog: Dragging dialog fires an error [\#5244](https://github.com/primefaces/primevue/issues/5244) +- Dialog: Error when clicking on header to drag [\#5240](https://github.com/primefaces/primevue/issues/5240) +- SelectButton: aria-disabled contains code instead of a boolean value [\#5235](https://github.com/primefaces/primevue/issues/5235) +- Tooltip: OutOfBounds alignment does not affect tooltip arrow position [\#5153](https://github.com/primefaces/primevue/issues/5153) +- Dropdown: esc keypress propagates and triggers close in dialogs [\#5138](https://github.com/primefaces/primevue/issues/5138) +- The arrow position is wrong after overlayPanel/confirmPopup is flipped[\#5091](https://github.com/primefaces/primevue/issues/5091) +- Listbox: issue with navigating through list items using tab and enter buttons [\#4906](https://github.com/primefaces/primevue/issues/4906) + +**Implemented New Features and Enhancements:** + +- New InputOtp component [\#5321](https://github.com/primefaces/primevue/issues/5321) +- MenuBar: Pressing Escape-Key in submenu moves focus to first menuitem [\#5316](https://github.com/primefaces/primevue/issues/5316) +- Calendar: pt.day missing disabled and selected attrs in options.context [\#5312](https://github.com/primefaces/primevue/issues/5312) +- InputSwitch: Aura invalid state updates [\#5311](https://github.com/primefaces/primevue/issues/5311) +- aria-invalid state added to Input components [\#5293](https://github.com/primefaces/primevue/issues/5293) +- New ButtonGroup component [\#5292](https://github.com/primefaces/primevue/issues/5292) +- CascadeSelect: second click should close the submenu [\#5289](https://github.com/primefaces/primevue/issues/5289) +- Menu components: track focus with also mousemove [\#5288](https://github.com/primefaces/primevue/issues/5288) +- InputIcon class support & InputField style updates [\#5273](https://github.com/primefaces/primevue/issues/5273) +- New Stepper component [\#5266](https://github.com/primefaces/primevue/issues/5266) +- Upload: Error showing when all the files are removed. [\#5260](https://github.com/primefaces/primevue/issues/5260) + +## [3.48.1](https://github.com/primefaces/primevue/tree/3.48.1) (2024-02-07) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.48.0...3.48.1) + +**Fixed bugs:** + +- Fix PrimeVuePTOptions.global.css (missing parenthesis) [\#5232](https://github.com/primefaces/primevue/issues/5232) +- Overwritten styles defect [\#5231](https://github.com/primefaces/primevue/issues/5231) +- Steps: Aura extension defect [\#5230](https://github.com/primefaces/primevue/issues/5230) +- Remove missed inputProps from InputSwitch [\#5227](https://github.com/primefaces/primevue/issues/5227) +- The scrollToIndex method on VirtualScroller does not scroll to the correct index when triggered twice. [\#5223](https://github.com/primefaces/primevue/issues/5223) +- Splitter: Fix keyboard repeat behavior [\#5219](https://github.com/primefaces/primevue/issues/5219) +- Dropdown / MultiSelect : Incorrect alignment on filtering [\#5215](https://github.com/primefaces/primevue/issues/5215) + +## [3.48.0](https://github.com/primefaces/primevue/tree/3.48.0) (2024-02-05) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.47.2...3.48.0) + +**Deprecated:** + +- Deprecate Legacy Themes [\#5201](https://github.com/primefaces/primevue/issues/5201) + +**Fixed bugs:** + +- SplitButton templating is broken [\#5199](https://github.com/primefaces/primevue/issues/5199) +- DataTable: Row selection styling defect [\#5196](https://github.com/primefaces/primevue/issues/5196) +- ColorPicker: parameter field in emit change event is incorrect [\#5188](https://github.com/primefaces/primevue/issues/5188) +- Hydration attribute mismatch on Icons [\#5187](https://github.com/primefaces/primevue/issues/5187) +- Calendar: 'view' property has no effect when changed after component initialization [\#5132](https://github.com/primefaces/primevue/issues/5132) +- TabView + Splitter: Navigation Buttons not showing [\#5111](https://github.com/primefaces/primevue/issues/5111) +- Knob: Problem with the step property when using the keyboard arrows [\#5097](https://github.com/primefaces/primevue/issues/5097) +- DataTable: VirtualScroller Resets Scroll Position to top on lazy load more data [\#5078](https://github.com/primefaces/primevue/issues/5078) +- Dropdown: autoSize works incorrectly with filter and not only [\#5073](https://github.com/primefaces/primevue/issues/5073) +- Calendar: 12h time picker changes from 12 am to 12 pm automatically [\#5108](https://github.com/primefaces/primevue/issues/5108) +- colorPicker: change event only shows old color value [\#5004](https://github.com/primefaces/primevue/issues/5004) +- Divider: Divider line doesn't show (Using the nuxt-primevue module) [\#5000](https://github.com/primefaces/primevue/issues/5000) +- Menubar, Megamenu, Contextmenu and etc.: Twice render if $attrs.id not defined [\#4953](https://github.com/primefaces/primevue/issues/4953) + +**Implemented New Features and Enhancements:** + +- Move core alignment styles to theme files [\#5214](https://github.com/primefaces/primevue/issues/5214) +- Update default dropdown filter icon [\#5208](https://github.com/primefaces/primevue/issues/5208) +- Refactor MeterGroup Component and Demos [\#5203](https://github.com/primefaces/primevue/issues/5203) +- Contrast and Secondary Variants for Badge/Tag/Message/Toast [\#5200](https://github.com/primefaces/primevue/issues/5200) +- Contrast variant for SplitButton [\#5198](https://github.com/primefaces/primevue/issues/5198) +- Add data-p-unselectable-text attribute on resizing and dragging phases [\#5194](https://github.com/primefaces/primevue/issues/5194) +- Improve data-pc- structure in components [\#5179](https://github.com/primefaces/primevue/issues/5179) +- New invalid and variant properties [\#5176](https://github.com/primefaces/primevue/issues/5176) +- New Components [\#5175](https://github.com/primefaces/primevue/issues/5175) +- Themes: end value has mixed support, consider using flex-end instead warning [\#5155](https://github.com/primefaces/primevue/issues/5155) +- Bug: Cannot override preset if using Tailwind important: true [\#5081](https://github.com/primefaces/primevue/issues/5081) +- TableBody: Render "BodyRow" binding dataKey of props to key attribute [\#5006](https://github.com/primefaces/primevue/issues/5006) +- PassThough new merging strategy with tailwind-merge to smartly merge classes [\#4707](https://github.com/primefaces/primevue/issues/4707) + +## [3.47.2](https://github.com/primefaces/primevue/tree/3.47.1) (2024-01-23) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.47.1...3.47.2) + +**Fixed bugs:** + +- OverlayPanel: RangeError: Maximum call stack size exceeded inside link [\#5146](https://github.com/primefaces/primevue/issues/5146) +- Align hover colors for MultipleSelect, AutoComplete and CascadeSelect [\#5150](https://github.com/primefaces/primevue/issues/5150) + +## [3.47.1](https://github.com/primefaces/primevue/tree/3.47.1) (2024-01-24) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.47.0...3.47.1) + +**Fixed bugs:** + +- Keyboard accessibility is not working on OrderList and PickList [\#5144](https://github.com/primefaces/primevue/issues/5144) + +## [3.47.0](https://github.com/primefaces/primevue/tree/3.47.0) (2024-01-24) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.46.0...3.47.0) + +**Breaking Changes:** + +- Change visual focus behavior for UI/UX enhancement on some components [\#5106](https://github.com/primefaces/primevue/issues/5106) +- Highlight state changes on Checkbox selection mode [\#5105](https://github.com/primefaces/primevue/issues/5105) +- autoOptionFocus property added to Input-like components [\#5099](https://github.com/primefaces/primevue/issues/5099) +- Improve the structure of some components to comply with standards [\#5071](https://github.com/primefaces/primevue/issues/5071) +- autoOptionFocus default type is changed as false [\#5096](https://github.com/primefaces/primevue/issues/5096) + +**Fixed bugs:** + +- Search with null/undefined values breaks rendering [\#5140](https://github.com/primefaces/primevue/issues/5140) +- The hideIcon property is not working on SpeedDial [\#5135](https://github.com/primefaces/primevue/issues/5135) +- Textarea: modelValue should accept Nullable as InputText does [\#5127](https://github.com/primefaces/primevue/issues/5127) +- Chips: Separator by new line doesn't work by pasting value [\#5103](https://github.com/primefaces/primevue/issues/5103) +- DataTable: Cannot read properties of null when editMode="cell" and selectionMode="single" [\#5100](https://github.com/primefaces/primevue/issues/5100) +- Unit tests in the master branch are failing [\#5095](https://github.com/primefaces/primevue/issues/5095) +- InputNumber: Home and End key defects [\#5094](https://github.com/primefaces/primevue/issues/5094) +- Float label demo is broken in mobile mode [\#5089](https://github.com/primefaces/primevue/issues/5089) +- [TabMenu] Router demo has the wrong code [\#5082](https://github.com/primefaces/primevue/issues/5082) +- Calendar: Incorrect interface "CalendarContext" for Calendar component [\#5077](https://github.com/primefaces/primevue/issues/5077) +- Tag: center icon when no label is present (icon-only mode) [\#5067](https://github.com/primefaces/primevue/issues/5067) +- DataTable: Uncaught TypeError: Cannot read properties of null (reading 'sortable') at Proxy.getColumnPT8 [\#5062](https://github.com/primefaces/primevue/issues/5062) +- Calendar: When use with Datatable filter, the calendar would show at the bottom of the page. [\#5055](https://github.com/primefaces/primevue/issues/5055) +- DataTable: persistent expandedRows with dataKey doesn't working properly [\#5057](https://github.com/primefaces/primevue/issues/5057) +- DataTable: Column with no props throws exception [\#5056](https://github.com/primefaces/primevue/issues/5056) +- DataTable: Empty column causes maximum recursive calls to be reached [\#5053](https://github.com/primefaces/primevue/issues/5053) +- ContextMenu: Cache duplication "focusedItemId" [\#5054](https://github.com/primefaces/primevue/issues/5054) +- Calendar: panel does not hide when pressing enter [\#5050](https://github.com/primefaces/primevue/issues/5050) +- Dialog: maximizable broken if dialog moved [\#5048](https://github.com/primefaces/primevue/issues/5048) +- DataTable: Hydration attribute mismatch with sortable columns [\#5046](https://github.com/primefaces/primevue/issues/5046) +- Can't paste a decimal value when there is a total value in the input. [\#5034](https://github.com/primefaces/primevue/issues/5034) +- Tooltip: Malfunction inside Links [\#5030](https://github.com/primefaces/primevue/issues/5030) +- SplitButton inherits CSS properties from DynamicDialog "footer" and disrupts the original design [\#5012](https://github.com/primefaces/primevue/issues/5012) +- Tooltip: missing nonce for inline styles [\#5010](https://github.com/primefaces/primevue/issues/5010) +- InputNumber: insert behavior defects [\#4539](https://github.com/primefaces/primevue/issues/4539) + +**Implemented New Features and Enhancements:** + +- New Aura Theme[\#5143](https://github.com/primefaces/primevue/issues/5143) +- Add itemGroupLabel, itemLabel, tickIcon and blankIcon options to pt in Dropdown [\#5142](https://github.com/primefaces/primevue/issues/5142) +- Add highlightOnSelect and checkmark props to Dropdown [\#5141](https://github.com/primefaces/primevue/issues/5141) +- Icon: BlankIcon [\#5139](https://github.com/primefaces/primevue/issues/5139) +- Add focusOnHover props to some components [\#5130](https://github.com/primefaces/primevue/issues/5130) +- DataTable: body template rowTogglerCallback callback option added [\#5123](https://github.com/primefaces/primevue/issues/5123) +- Dialog: no transition on open/close when dialog is maximized [\#5118](https://github.com/primefaces/primevue/issues/5118) +- Expose alignOverlay method in OverlayPanel [\#5075](https://github.com/primefaces/primevue/issues/5075) +- Message: 'life-end' emit [\#5070](https://github.com/primefaces/primevue/issues/5070) +- New MeterGroup component [\#5066](https://github.com/primefaces/primevue/issues/5066) +- Dropdown: After selecting an option, clearing the value using close icon should clear the filter input [\#5060](https://github.com/primefaces/primevue/issues/5060) + +## [3.46.0](https://github.com/primefaces/primevue/tree/3.46.0) (2024-01-08) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.45.0...3.46.0) + +**Fixed bugs:** + +- SVG clip path attribute should be clip-path and not clipPath [\#5036](https://github.com/primefaces/primevue/issues/5036) +- Tooltip arrow is broken [\#5033](https://github.com/primefaces/primevue/issues/5033) +- ConfirmDialog & ConfirmPopup: icon option class pt implementation defect [\#5028](https://github.com/primefaces/primevue/issues/5028) +- Sidebar: Escape key doesn't close the Slidebar [\#5016](https://github.com/primefaces/primevue/issues/5016) +- BodyRow: Cannot read propertie of null (reading 'forEach) [\#5005](https://github.com/primefaces/primevue/issues/5005) +- InputNumber: highlight on focus don't work on multiple inputs with the same value [\#5003](https://github.com/primefaces/primevue/issues/5003) +- TreeSelect: tab key control defect [\#4998](https://github.com/primefaces/primevue/issues/4998) +- bodyRow broken pt context options [\#4996](https://github.com/primefaces/primevue/issues/4996) +- VirtualScroller loading is not working on DataTable [\#4993](https://github.com/primefaces/primevue/issues/4993) +- added sortIcon property to type ColumnPassThroughOptionType [\#4992](https://github.com/primefaces/primevue/issues/4992) +- wrong type appendTo props [\#4905](https://github.com/primefaces/primevue/issues/4905) + +**Implemented New Features and Enhancements:** + +- Add caption option to passthrough options on Card [\#5020](https://github.com/primefaces/primevue/issues/5020) +- CascadeSelect: context options improvements for pt [\#4995](https://github.com/primefaces/primevue/issues/4995) + +## [3.45.0](https://github.com/primefaces/primevue/tree/3.45.0) (2023-12-22) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.44.0...3.45.0) + +**Breaking Changes:** + +- metaKeySelection default type is changed as false [\#4985](https://github.com/primefaces/primevue/issues/4985) + +**Fixed bugs:** + +- DataTable - sortable header with InputText [\#4988](https://github.com/primefaces/primevue/issues/4988) +- PickList: metaKeySelection does not work as expected [\#4984](https://github.com/primefaces/primevue/issues/4984) +- Datatable rowGroupMode: columns can't be hidden with setting hidden = true [\#4982](https://github.com/primefaces/primevue/issues/4982) +- Table: Sort icons are not showing correct amount directions [\#4981](https://github.com/primefaces/primevue/issues/4981) +- Lara Light Teal: $highlightBg implementation defect [\#4980](https://github.com/primefaces/primevue/issues/4980) +- Image: Preview popup closes on 2nd click of disabled zoomOut and zoomIn in preview [\#4968](https://github.com/primefaces/primevue/issues/4968) +- Knob: Chrome touchstart 'passive' warnings [\#4963](https://github.com/primefaces/primevue/issues/4963) +- Datatable: stripedRows do not work correctly with virtual scroll [\#4957](https://github.com/primefaces/primevue/issues/4957) +- Datatable: Column resize expand mode and Stateful loses scroll [\#4950](https://github.com/primefaces/primevue/issues/4950) +- DataTable or Column leak computed properties to their children through VirtualScroller [\#4924](https://github.com/primefaces/primevue/issues/4924) +- Datatable Slider filter: Filtering breaks after clearing filter when using slider in docs and elsewhere [\#4913](https://github.com/primefaces/primevue/issues/4913) +- DataTable: #loading templates broken with lazy virtual scroller [\#4723](https://github.com/primefaces/primevue/issues/4723) +- DataTable: VirtualScroller breaks when sort is applied [\#4434](https://github.com/primefaces/primevue/issues/4434) +- Treetable: InputText in body Slot does not allow space character [\#4045](https://github.com/primefaces/primevue/issues/4045) +- DataTable:When using ColumnGroup in a table with more than two frozen columns [\#3967](https://github.com/primefaces/primevue/issues/3967) +- DataTable: Pass sorted data on sort event Type: Bug [\#3818](https://github.com/primefaces/primevue/issues/3818) +- DataTable: dataKey Property not relevant for expanding rows [\#3718](https://github.com/primefaces/primevue/issues/3718) +- [DataTable with virtual scroll] Using primevue inside shadow-dom [\#3037](https://github.com/primefaces/primevue/issues/3037) +- DataTable Column Resizing incompatible with Column Reordering [\#2188](https://github.com/primefaces/primevue/issues/2188) + +**Implemented New Features and Enhancements:** + +- Image: Toolbar is hidden when the image is zoomed [\#4986](https://github.com/primefaces/primevue/issues/4986) +- Improve performance of row expansion feature on DataTable [\#4977](https://github.com/primefaces/primevue/issues/4977) +- InputNumber: Support roundingMode for the InputNumber [\#4945](https://github.com/primefaces/primevue/issues/4945) +- BaseIcon: p-icon and p-icon-spin classes in unstyled mode [\#4692](https://github.com/primefaces/primevue/issues/4692) +- Add custom wrapper support for helper components on DataTable and TreeTable [\#4646](https://github.com/primefaces/primevue/issues/4646) +- Component Styles: Remove use of !important now that @layer is used [\#4637](https://github.com/primefaces/primevue/issues/4637) +- DropDown: Labels unassociated from DropDown unless :editable="true" [\#4567](https://github.com/primefaces/primevue/issues/4567) +- TreeTable: Missing dataKey property [\#4273](https://github.com/primefaces/primevue/issues/4273) +- Keyboard support: Numpad enter [\#3602](https://github.com/primefaces/primevue/issues/3602) + +## [3.44.0](https://github.com/primefaces/primevue/tree/3.44.0) (2023-12-13) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.43.0...3.44.0) + +**Fixed bugs:** + +- Calendar: Time only mode does not work [\#4952](https://github.com/primefaces/primevue/issues/4952) +- Calendar PT: mask defect [\#4947](https://github.com/primefaces/primevue/issues/4947) +- CascadeSelect: optionGroupChildren doesn't work in string type [\#4944](https://github.com/primefaces/primevue/issues/4944) +- Dropdown: Overlapping Clear Icon while disabled [\#4923](https://github.com/primefaces/primevue/issues/4923) +- VirtualScroller: getRenderedRange viewport calculation is broken [\#4803](https://github.com/primefaces/primevue/issues/4803) +- Dropdown: Editable dropdown doesn't open when typing on a mobile device [\#4509](https://github.com/primefaces/primevue/issues/4509) +- DynamicDialog: passing pt when opening new dialogs [\#4443](https://github.com/primefaces/primevue/issues/4443) +- Data Table row checkboxes propagate click events when a checkbox is unchecked [\#4100](https://github.com/primefaces/primevue/issues/4100) +- AutoComplete: Duplicate Value [\#3379](https://github.com/primefaces/primevue/issues/3379) + +**Implemented New Features and Enhancements:** + +- Add attrs param to all pt functions [\#4951](https://github.com/primefaces/primevue/issues/4951) + +## [3.43.0](https://github.com/primefaces/primevue/tree/3.43.0) (2023-12-05) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.42.0...3.43.0) + +**Fixed bugs:** + +- Calendar: Overwrites date when in time-only mode [\#4901](https://github.com/primefaces/primevue/issues/4901) +- Binding and ordering pt options defect [\#4921](https://github.com/primefaces/primevue/issues/4921) +- Some icons are not displaying from PrimeIcons.js Api file [\#4897](https://github.com/primefaces/primevue/issues/4897) +- Treetable lazy load plus pagination toggler icon remain as open [\#4441](https://github.com/primefaces/primevue/issues/4441) + +**Implemented New Features and Enhancements:** + +- Add parent param to all pt method options [\#4929](https://github.com/primefaces/primevue/issues/4929) +- Media components Accessibility Improvements [\#4908](https://github.com/primefaces/primevue/issues/4908) +- Tree: Missing 'filter' event on search [\#4876](https://github.com/primefaces/primevue/issues/4876) + +## [3.42.0](https://github.com/primefaces/primevue/tree/3.42.0) (2023-11-28) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.41.1...3.42.0) + +**Breaking Changes:** + +- Menu components: width changed as min-width [\#4870](https://github.com/primefaces/primevue/issues/4870) + +**Fixed bugs:** + +- Splitter: aria-valuenow calculation defect [\#4889](https://github.com/primefaces/primevue/issues/4889) +- Listbox: select-on-focus causes a crash [\#4881](https://github.com/primefaces/primevue/issues/4881) +- Listbox: Tab key support defect when filter mode is on [\#4875](https://github.com/primefaces/primevue/issues/4875) +- Editor: Readonly prop does not react to any change [\#4872](https://github.com/primefaces/primevue/issues/4872) +- DataTable: Type definition doesn't match document [\#4662](https://github.com/primefaces/primevue/issues/4662) +- Wrong types issue with aria-label and aria-labelledby Props [\#4511](https://github.com/primefaces/primevue/issues/4511) + +**Implemented New Features and Enhancements:** + +- Tree / TreeTable: new loadingMode property [\#4886](https://github.com/primefaces/primevue/issues/4886) +- Improve InlineMessage Implementation for Accessibility [\#4880](https://github.com/primefaces/primevue/issues/4880) +- Calendar: new iconDisplay property [\#4871](https://github.com/primefaces/primevue/issues/4871) + +## [3.41.1](https://github.com/primefaces/primevue/tree/3.41.1) (2023-11-22) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.41.0...3.41.1) + +**Breaking Changes:** + +- StyleClass: deprecate enterClass/leaveClass use enterFromClass/leaveFromClass [\#4866](https://github.com/primefaces/primevue/issues/486&) +- Listbox: metaKeySelection default changed as true [\#4865](https://github.com/primefaces/primevue/issues/4865) + +**Fixed bugs:** + +- DataTable: restore state defect [\#4855](https://github.com/primefaces/primevue/issues/4855) +- PanelMenu: Menu items with no sub-items toggling border radius [\#4816](https://github.com/primefaces/primevue/issues/4816) +- Column: Missing typing for sorticon [\#4423](https://github.com/primefaces/primevue/issues/4423) + +**Implemented New Features and Enhancements:** + +- Button: new badgeSeverity property [\#4863](https://github.com/primefaces/primevue/issues/4863) +- MegaMenu / Menubar: menubutton templating [\#4862](https://github.com/primefaces/primevue/issues/4862) +- Calendar: Week Number customization [\#4669](https://github.com/primefaces/primevue/issues/4669) + +## [3.41.0](https://github.com/primefaces/primevue/tree/3.41.0) (2023-11-20) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.40.1...3.41.0) + +**Breaking Changes:** + +- Dialog: PT options rename [\#4848](https://github.com/primefaces/primevue/issues/4848) +- Sidebar: header templating updates [\#4845](https://github.com/primefaces/primevue/issues/4845) +- Remove primeflex dependency from DataView [\#4818](https://github.com/primefaces/primevue/issues/4818) +- Lara theme enhancements [\#4807](https://github.com/primefaces/primevue/issues/4807) + +**Fixed bugs:** + +- OrderList / PickList: defect on first tab focus [\#4839](https://github.com/primefaces/primevue/issues/4839) +- Inplace: console logs error on close [\#4824](https://github.com/primefaces/primevue/issues/4824) +- Menu: submenuheader slot options TypeScript defect [\#4809](https://github.com/primefaces/primevue/issues/4809) +- FileUpload: missing fileSizeTypes locale breaks the file select process [\#4808](https://github.com/primefaces/primevue/issues/4808) +- DataTable | cmd + A highlights page (Accessibility) [\#4804](https://github.com/primefaces/primevue/issues/4804) +- Splitter: stateString is undefined [\#4797](https://github.com/primefaces/primevue/issues/4797) +- BaseIcon: SpinnerIcon component isn't spinning. [\#4791](https://github.com/primefaces/primevue/issues/4791) +- OverlayPanel: wrongly typed slot prop [\#4774](https://github.com/primefaces/primevue/issues/4774) +- MultiSelect: loading spinner is not animated [\#4741](https://github.com/primefaces/primevue/issues/4741) +- AutoComplete: Primitive value 0 or reference value 0 does not display correctly [\#4749](https://github.com/primefaces/primevue/issues/4749) +- InputNumber: float label initially broken if allowEmpty = false [\#4516](https://github.com/primefaces/primevue/issues/4516) +- Paginator: Responsive Templating showing multiple layouts on break points [\#4458](https://github.com/primefaces/primevue/issues/4458) +- DataTable VirtualScroller: resizableColumns broken [\#4394](https://github.com/primefaces/primevue/issues/4394) + +**Implemented New Features and Enhancements:** + +- PickList OrderList | Keyboard Support Enhancements [\#4850](https://github.com/primefaces/primevue/issues/4850) +- TreeSelect: Accessibility Improvements [\#4841](https://github.com/primefaces/primevue/issues/4841) +- MegaMenu responsiveness updates [\#4819](https://github.com/primefaces/primevue/issues/4819) +- PanelMenu: new multiple property [\#4826](https://github.com/primefaces/primevue/issues/4826) +- Calendar responsiveness updates [\#4822](https://github.com/primefaces/primevue/issues/4822) +- Dock responsiveness updates [\#4821](https://github.com/primefaces/primevue/issues/4821) +- Menubar responsiveness updates [\#4820](https://github.com/primefaces/primevue/issues/4820) +- Chore: Duplicated Tailwind Classes [\#4806](https://github.com/primefaces/primevue/issues/4806) +- fix: import nuxt composables from #imports [\#4775](https://github.com/primefaces/primevue/issues/4775) +- Ovarlay / Dialog: Height is not working when use Tailwind [\#4653](https://github.com/primefaces/primevue/issues/4653) +- Media / Image : In preview mode toolbar is not showing when using tailwind unstyled [\#4650](https://github.com/primefaces/primevue/issues/4650) +- Splitter: blocked by content [\#4513](https://github.com/primefaces/primevue/issues/4513) + +## [3.40.1](https://github.com/primefaces/primevue/tree/3.40.1) (2023-11-09) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.40.0...3.40.1) + +**Fixed bugs:** + +- InputGroupAddon esm broken [\#4788](https://github.com/primefaces/primevue/issues/4788) + +## [3.40.0](https://github.com/primefaces/primevue/tree/3.40.0) (2023-11-09) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.39.0...3.40.0) + +**Breaking Changes:** + +- AccordionTab: isTabActive property is deprecated [\#4783](https://github.com/primefaces/primevue/issues/4783) +- Remove vue-router support from Menu components [\#4739](https://github.com/primefaces/primevue/issues/4739) +- Tooltip: escape should be false by default [\#4738](https://github.com/primefaces/primevue/issues/4738) + +**Fixed bugs:** + +- DataTable/TreeTable: Frozen column improvements [\#4786](https://github.com/primefaces/primevue/issues/4786) +- Table row is not highlighted with context menu [\#4785](https://github.com/primefaces/primevue/issues/4785) +- core: Error BaseStyle\_\_default.default is undefined [\#4648](https://github.com/primefaces/primevue/issues/4648) +- DataTable: editingRows watcher implementation defect [\#4757](https://github.com/primefaces/primevue/issues/4757) +- MultiSelect Name: prop overshadowing [\#4743](https://github.com/primefaces/primevue/issues/4743) +- SpeedDial: unstyled implementation defect breaks the calculations [\#4740](https://github.com/primefaces/primevue/issues/4740) +- Tooltip: autoHide does not work properly [\#4737](https://github.com/primefaces/primevue/issues/4737) +- Calendar: Console.Error/Crash when pressing Escape key using Inline Calendar [\#4732](https://github.com/primefaces/primevue/issues/4732) +- Calendar does not show the right month (for the minimal departure date) when it's dynamically set [\#4157](https://github.com/primefaces/primevue/issues/4157) + +**Implemented New Features and Enhancements:** + +- Collision Enhancements [\#4784](https://github.com/primefaces/primevue/issues/4784) +- TabMenu/Steps: active option for item templating [\#4780](https://github.com/primefaces/primevue/issues/4780) +- PanelMenu: root option for item templating [\#4779](https://github.com/primefaces/primevue/issues/4779) +- Steps: new activeStep property [\#4778](https://github.com/primefaces/primevue/issues/4778) +- ContextMenu: hasSubmenu options for item templating [\#4764](https://github.com/primefaces/primevue/issues/4764) +- TieredMenu: New start and end templating [\#4760](https://github.com/primefaces/primevue/issues/4760) +- PanelMenu: active options for item templating [\#4750](https://github.com/primefaces/primevue/issues/4750) +- New InputGroup Component [\#4742](https://github.com/primefaces/primevue/issues/4742) + +## [3.39.0](https://github.com/primefaces/primevue/tree/3.39.0) (2023-11-01) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.38.1...3.39.0) + +**Breaking Changes:** + +- Change slot parameter function name on* to *CallBack [\#4728](https://github.com/primefaces/primevue/issues/4728) + +**Fixed bugs:** + +- ConfirmPopup: arrow defect [\#4730](https://github.com/primefaces/primevue/issues/4730) +- Overlaypanel: Overlaypanel closes when any key is pressed [\#4712](https://github.com/primefaces/primevue/issues/4712) +- Steps: Property 'step' does not exist on type 'StepsRouterBindProps'. [\#4703](https://github.com/primefaces/primevue/issues/4703) +- Datatable: Cannot set properties of null (setting 'tabIndex') [\#4498](https://github.com/primefaces/primevue/issues/4498) +- Menubar: Custom locale config overwriting default untouched config properties [\#4270](https://github.com/primefaces/primevue/issues/4270) + +**Implemented New Features and Enhancements:** + +- SplitButton: new buttoncontent and item slots [\#4729](https://github.com/primefaces/primevue/issues/4729) +- Datatable: Lara Dark Theme Color Inconsistencies [\#4714](https://github.com/primefaces/primevue/issues/4714) + +## [3.38.1](https://github.com/primefaces/primevue/tree/3.38.1) (2023-10-26) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.38.0...3.38.1) + +**Fixed bugs:** + +- The package was not published correctly [\#4697](https://github.com/primefaces/primevue/issues/4697) + +## [3.38.0](https://github.com/primefaces/primevue/tree/3.38.0) (2023-10-26) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.37.0...3.38.0) + +**Breaking Changes:** + +- `Animate` directive renamed as `AnimateOnScroll` [\#4682](https://github.com/primefaces/primevue/issues/4682) + +**Implemented New Features and Enhancements:** + +- MegaMenu: separate `label` and `submenuLabel` pt options [\#4690](https://github.com/primefaces/primevue/issues/4690) +- Improve Lara dark colors [\#4687](https://github.com/primefaces/primevue/issues/4687) +- Accordion: new `expandicon` and `collapseicon` slots [\#4679](https://github.com/primefaces/primevue/issues/4679) +- SpeedDial: mask border-radius added [\#4674](https://github.com/primefaces/primevue/issues/4674) + +**Fixed bugs:** + +- OverlayPanel: closeOnEscape broken [\#4693](https://github.com/primefaces/primevue/issues/4693) +- ScrollPanel: TypeError: Cannot read properties of null \(reading 'scrollWidth'\) [\#4689](https://github.com/primefaces/primevue/issues/4689) +- Carousel: page attribute not updating carousel [\#4684](https://github.com/primefaces/primevue/issues/4684) +- Add empty option check to some components [\#4681](https://github.com/primefaces/primevue/issues/4681) +- PanelMenu: Error when using `#item` slot [\#4671](https://github.com/primefaces/primevue/issues/4671) +- FileUpload: Basic uploader click [\#4667](https://github.com/primefaces/primevue/issues/4667) +- ConfirmPopup: button classes implementation defects [\#4663](https://github.com/primefaces/primevue/issues/4663) +- Tooltip: Cursor flickers on hover [\#4655](https://github.com/primefaces/primevue/issues/4655) +- Splitter: minSize broken [\#4652](https://github.com/primefaces/primevue/issues/4652) + +## [3.37.0](https://github.com/primefaces/primevue/tree/3.37.0) (2023-10-18) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.36.0...3.37.0) + +**Implemented New Features and Enhancements:** + +- Lara Color Enhancements [\#4640](https://github.com/primefaces/primevue/issues/4640) +- Menu components pt context disabled updates [\#4632](https://github.com/primefaces/primevue/issues/4632) +- Overlaypanel: Overlay panel doesnot close on escape button click [\#4620](https://github.com/primefaces/primevue/issues/4620) +- New `animate` directive [\#4610](https://github.com/primefaces/primevue/issues/4610) +- Update Lara Themes [\#4592](https://github.com/primefaces/primevue/issues/4592) +- Tooltip: user interaction with tooltip content [\#3568](https://github.com/primefaces/primevue/issues/3568) + +**Fixed bugs:** + +- SelectButton: unselectable property defect [\#4631](https://github.com/primefaces/primevue/issues/4631) +- Slider: step defect [\#4625](https://github.com/primefaces/primevue/issues/4625) +- Menu: 'class' prop doesnt' work in submenuheader [\#4622](https://github.com/primefaces/primevue/issues/4622) +- Tailwind: typos in passthrough/tailwind [\#4617](https://github.com/primefaces/primevue/issues/4617) +- PanelMenu: top-level items lacking the label, props, hasSubmenu slot properties [\#4616](https://github.com/primefaces/primevue/issues/4616) +- Calendar: Can't navigate after selecting a date [\#4614](https://github.com/primefaces/primevue/issues/4614) +- Tree: Invalid typing of the default slot [\#4608](https://github.com/primefaces/primevue/issues/4608) +- locale "selectedItemsLabel" is broken on MultiSelect [\#4558](https://github.com/primefaces/primevue/issues/4558) +- Tree: Pass Through input options ignored [\#4478](https://github.com/primefaces/primevue/issues/4478) +- Picklist: Unexpected behavior on double click while holding control [\#4072](https://github.com/primefaces/primevue/issues/4072) + +## [3.36.0](https://github.com/primefaces/primevue/tree/3.36.0) (2023-10-11) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.35.0...3.36.0) + +**Implemented New Features and Enhancements:** + +- Improve block/unblockScroll architecture [\#4589](https://github.com/primefaces/primevue/issues/4589) +- Splitter: Add Resize event to Splitter component [\#4561](https://github.com/primefaces/primevue/issues/4561) +- Datatable: Sort mode multiple - undefined breaks order [\#4555](https://github.com/primefaces/primevue/issues/4555) +- InlineMessage: Icon shrinks as text grows larger [\#4550](https://github.com/primefaces/primevue/issues/4550) +- Export styles of all components [\#4530](https://github.com/primefaces/primevue/issues/4530) +- Add `modules` property to Editor [\#4450](https://github.com/primefaces/primevue/issues/4450) +- No styles injected on SSR resulting in Large Layout Shifts on load [\#4210](https://github.com/primefaces/primevue/issues/4210) +- MultiSelect: Filter does not work when options is an array of strings [\#4071](https://github.com/primefaces/primevue/issues/4071) +- Add `allowEmpty` property to SelectButton [\#3973](https://github.com/primefaces/primevue/issues/3973) +- Ability to close a specific toast message [\#1763](https://github.com/primefaces/primevue/issues/1763) + +**Fixed bugs:** + +- Dock Component MenuBar z-index issue [\#4584](https://github.com/primefaces/primevue/issues/4584) +- OrderList: Missing moveUpButtonProps [\#4581](https://github.com/primefaces/primevue/issues/4581) +- Config: Missing export definition in types [\#4579](https://github.com/primefaces/primevue/issues/4579) +- Cannot click to select min or max value when using slider with step property [\#4577](https://github.com/primefaces/primevue/issues/4577) +- Editor layer defect [\#4576](https://github.com/primefaces/primevue/issues/4576) +- Tailwind Datatable: Uncaught \(in promise\) TypeError: Cannot read properties of undefined \(reading 'frozen'\) [\#4566](https://github.com/primefaces/primevue/issues/4566) +- Using Tailwind setup - the Ripple data attributes get added automatically [\#4564](https://github.com/primefaces/primevue/issues/4564) +- Splitter: In the tailwind theme, double-clicking on a split line causes the element to move. [\#4562](https://github.com/primefaces/primevue/issues/4562) +- InputNumber: Buttons are not sorted correctly in TW theme if buttonLayout is horizontal [\#4560](https://github.com/primefaces/primevue/issues/4560) +- The `appearance` style is not working in Tailwind preset [\#4559](https://github.com/primefaces/primevue/issues/4559) +- Image: preview mode button spacing fixes [\#4554](https://github.com/primefaces/primevue/issues/4554) +- Image: toolbar unstyled mode fixes [\#4553](https://github.com/primefaces/primevue/issues/4553) +- Galleria: indicator list z-index defect [\#4545](https://github.com/primefaces/primevue/issues/4545) +- Column: headercheckboxicon slot not working [\#4543](https://github.com/primefaces/primevue/issues/4543) +- ContextMenu: global property is not working [\#4536](https://github.com/primefaces/primevue/issues/4536) +- InputText: Float labels bug out when page loads with form auto-filled \(webkit\) [\#4533](https://github.com/primefaces/primevue/issues/4533) +- Sidebar: autofocus cannot with other components [\#4532](https://github.com/primefaces/primevue/issues/4532) +- PanelMenu | Separator is not ignored when navigating with the arrow keys. [\#4522](https://github.com/primefaces/primevue/issues/4522) +- V-Tooltip, TailwindCSS: Styling not working when using pinia store [\#4505](https://github.com/primefaces/primevue/issues/4505) +- Calendar: Timepicker changes from `12 am` to `12 pm` automatically [\#4449](https://github.com/primefaces/primevue/issues/4449) +- Calendar: Multiple Month/Year selection mode not highlighting selected month [\#4418](https://github.com/primefaces/primevue/issues/4418) +- File Upload - Chrome/Windows input is triggered during any mouse click, not just left click [\#4144](https://github.com/primefaces/primevue/issues/4144) +- InputSwitch: Type Definition doesn't expose `disabled` [\#3985](https://github.com/primefaces/primevue/issues/3985) +- DataGrid: Invalid typing of slot props [\#3395](https://github.com/primefaces/primevue/issues/3395) + +**Deprecated:** + +- Remove FullCalendar theme support [\#4575](https://github.com/primefaces/primevue/issues/4575) + +## [3.35.0](https://github.com/primefaces/primevue/tree/3.35.0) (2023-09-26) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.34.1...3.35.0) + +**Implemented New Features and Enhancements:** + +- New `@layer` implementation [\#4504](https://github.com/primefaces/primevue/issues/4504) +- Theme updates: change `:focus` to `focus-visible` [\#4500](https://github.com/primefaces/primevue/issues/4500) +- Use Inter Var for Lara as the default theme [\#4483](https://github.com/primefaces/primevue/issues/4483) +- Calendar: focus state update [\#4474](https://github.com/primefaces/primevue/issues/4474) +- Add `ptOptions` option to PrimeVue config [\#4473](https://github.com/primefaces/primevue/issues/4473) +- Dialog: new `blockScroll` property [\#4463](https://github.com/primefaces/primevue/issues/4463) +- Container Slots for Overlay Components [\#4433](https://github.com/primefaces/primevue/issues/4433) +- Dialog component scrollbar shift [\#882](https://github.com/primefaces/primevue/issues/882) + +**Fixed bugs:** + +- Calendar | Disabled date is highlighted when it's in the range [\#4508](https://github.com/primefaces/primevue/issues/4508) +- ConfirmPopup: acceptClass and rejectClass is not working on unstyled mode [\#4506](https://github.com/primefaces/primevue/issues/4506) +- Column Filter: Missing type for new `applyFilter` method [\#4484](https://github.com/primefaces/primevue/issues/4484) +- Button: Buttonset with single button has wrong border radius [\#4467](https://github.com/primefaces/primevue/issues/4467) +- \[DataTable\] Reorder feature and rowreordericon slot problem. [\#4459](https://github.com/primefaces/primevue/issues/4459) +- ToastMessage: styleClass property is ignored [\#4454](https://github.com/primefaces/primevue/issues/4454) +- Bitwise operator used in passthorugh/tailwind/index.js instead of logical operator [\#4415](https://github.com/primefaces/primevue/issues/4415) +- Textarea autoResize with max-height doesn't show scrollbar [\#4269](https://github.com/primefaces/primevue/issues/4269) +- Calendar: manualInput property ignored [\#3523](https://github.com/primefaces/primevue/issues/3523) + +## [3.34.1](https://github.com/primefaces/primevue/tree/3.34.1) (2023-09-08) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.34.0...3.34.1) + +**Implemented New Features and Enhancements:** + +- DataTable: \(unstyled + Tailwind\) stripedRows styling applies in dark mode but not light mode [\#4406](https://github.com/primefaces/primevue/issues/4406) +- DataTable: Icon slots issues [\#4366](https://github.com/primefaces/primevue/issues/4366) +- Calendar: showMonthAfterYear IL8N setting \(from PrimeReact/PrimeFaces\) [\#4113](https://github.com/primefaces/primevue/issues/4113) +- DataTable and TreeTable: new Paginator dropdown icon slots [\#3921](https://github.com/primefaces/primevue/issues/3921) +- Column Filter: Expose 'applyFilter' method [\#3519](https://github.com/primefaces/primevue/issues/3519) + +**Fixed bugs:** + +- ConfirmDialog: acceptClass and rejectClass is not working on unstyled mode [\#4412](https://github.com/primefaces/primevue/issues/4412) +- Menubar - clicking outside of submenu should hide it [\#4405](https://github.com/primefaces/primevue/issues/4405) +- Image: Closing fullscreen image \(from preview\) breaks scrolling [\#4401](https://github.com/primefaces/primevue/issues/4401) +- The `ptOptions` property is not working with nested components [\#4400](https://github.com/primefaces/primevue/issues/4400) +- Breadcrumb: duplicate key warning [\#4399](https://github.com/primefaces/primevue/issues/4399) +- Column: rowtogglericon slot does not expose p-row-toggler-icon class [\#4398](https://github.com/primefaces/primevue/issues/4398) +- Calendar: dropdownicon class not being exposed [\#4370](https://github.com/primefaces/primevue/issues/4370) +- SplitButton: some preventDefault are missing [\#4223](https://github.com/primefaces/primevue/issues/4223) +- TreeTable: Custom Column's Toggler Icon [\#4170](https://github.com/primefaces/primevue/issues/4170) +- DataTable \(Virtual Scroll\): Cannot set properties of undefined \(setting 'tabIndex'\) [\#3888](https://github.com/primefaces/primevue/issues/3888) +- Tree: keyboard keys don't work in InputElement [\#3831](https://github.com/primefaces/primevue/issues/3831) + +## [3.34.0](https://github.com/primefaces/primevue/tree/3.34.0) (2023-09-05) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.33.0...3.34.0) + +**Breaking Changes:** + +- Rename PTOptions and DefaultPTOptions types with PassThrough and DefaultPassThrough types [\4389](https://github.com/primefaces/primevue/issues/4389) + +**Implemented New Features and Enhancements:** + +- Add ptOptions property to all components [\4384](https://github.com/primefaces/primevue/issues/4384) +- Improve the performance of resolveFieldData method in core [\4296](https://github.com/primefaces/primevue/issues/4296) +- Locale: Add fileSizeTypes [\4376](https://github.com/primefaces/primevue/issues/4376) +- AutoComplete: Empty Message never displayed [\3669](https://github.com/primefaces/primevue/issues/3669) + +**Fixed bugs:** + +- OrderList and PickList: Getting error when empty field [\4383](https://github.com/primefaces/primevue/issues/4383) +- MenuPassThrough: The PT option menu does not work [\4381](https://github.com/primefaces/primevue/issues/4381) +- Menu components: RouterBindProps typing [\4379](https://github.com/primefaces/primevue/issues/4379) +- TreeTable: aria-expanded attribute should not be on leaf nodes [\4368](https://github.com/primefaces/primevue/issues/4368) +- InputMask: Copy Paste not working [\3915](https://github.com/primefaces/primevue/issues/3915) +- DataTable: Selection and Row/Cell editing : Cannot input space character [\4120](https://github.com/primefaces/primevue/issues/4120) + +## [3.33.0](https://github.com/primefaces/primevue/tree/3.33.0) (2023-09-01) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.32.2...3.33.0) + +**Breaking Changes:** + +- Rename `merge` and `useMergeProps` options with `mergeSections` and `mergeProps` options on `usePassThrough` method [\#4342](https://github.com/primefaces/primevue/issues/4342) + +**Deprecated:** + +- `to` option deprecation of MenuModel for Menu components [\#4372](https://github.com/primefaces/primevue/issues/4372) +- Vue-Router deprecation in Menu components [\#4351](https://github.com/primefaces/primevue/issues/4351) + +**Implemented New Features and Enhancements:** + +- Menu: new `submenuheader` slot [\#4352](https://github.com/primefaces/primevue/issues/4352) +- SplitButton: MenuIcon [\#4201](https://github.com/primefaces/primevue/issues/4201) + +**Fixed bugs:** + +- FileUpload: drag over border implementation bug [\#4371](https://github.com/primefaces/primevue/issues/4371) +- Dialog: drag cannot work as expected [\#4367](https://github.com/primefaces/primevue/issues/4367) +- Testing components will throw a `Cannot read properties of undefined (reading 'unstyled')` error [\#4360](https://github.com/primefaces/primevue/issues/4360) +- VirtualScroller: Unstyled mode is removing needed classes for core functionality [\#4348](https://github.com/primefaces/primevue/issues/4348) +- Component Name: Splitter [\#4341](https://github.com/primefaces/primevue/issues/4341) +- DataTable: v-model:editingRows is not reactive when changed from outside [\#4337](https://github.com/primefaces/primevue/issues/4337) +- DataTable: PT Options missing for Expansion Row Cell [\#4306](https://github.com/primefaces/primevue/issues/4306) +- Calendar: Accessibility features broken when hour-format="12" [\#4287](https://github.com/primefaces/primevue/issues/4287) +- SplitButton: Not rendering icon slot without icon property [\#4200](https://github.com/primefaces/primevue/issues/4200) +- Dialog: Draggable fails if Dialog contains a TabView/TabPanel [\#4182](https://github.com/primefaces/primevue/issues/4182) + +## [3.32.2](https://github.com/primefaces/primevue/tree/3.32.2) (2023-08-23) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.32.1...3.32.2) + +**Implemented New Features and Enhancements:** + +- PassThrough: component option improvements [\#4322](https://github.com/primefaces/primevue/issues/4322) + +**Fixed bugs:** + +- \[AutoComplete\] wrong removetokenicon pt implementation [\#4320](https://github.com/primefaces/primevue/issues/4320) +- \[Editor\] - Tailwind theme is not working. Structure needs adjustments [\#4317](https://github.com/primefaces/primevue/issues/4317) +- Dialog: Uncaught TypeError: getComputedStyle is not a function [\#4312](https://github.com/primefaces/primevue/issues/4312) +- Toast message content overflows the toast border [\#4309](https://github.com/primefaces/primevue/issues/4309) +- Column: `colspan` only applied to `thead>tr>td` but should be applied to `tbody>tr>td` [\#4307](https://github.com/primefaces/primevue/issues/4307) +- Calendar: Icon classes not being correctly exposed [\#4305](https://github.com/primefaces/primevue/issues/4305) +- Listbox: Typing filtericon slot does not expose class [\#4304](https://github.com/primefaces/primevue/issues/4304) +- Sidebar: Icon classes not being correctly exposed [\#4303](https://github.com/primefaces/primevue/issues/4303) +- Toast: Icon classes not being correctly exposed [\#4302](https://github.com/primefaces/primevue/issues/4302) +- Dialog: Draggable Fails [\#4298](https://github.com/primefaces/primevue/issues/4298) +- Datatable Cell Edit: Numpad Enter not saving new data on InputNumber [\#4292](https://github.com/primefaces/primevue/issues/4292) + +## [3.32.1](https://github.com/primefaces/primevue/tree/3.32.1) (2023-08-18) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.32.0...3.32.1) + +**Implemented New Features and Enhancements:** + +- Improve `usePassThrough` method [\#4289](https://github.com/primefaces/primevue/issues/4289) +- SelectButton: passthrough option [\#4286](https://github.com/primefaces/primevue/issues/4286) +- Locale performance updates with large datasets [\#4285](https://github.com/primefaces/primevue/issues/4285) +- Baseicon: Content Security Policy \(CSP\) violation [\#4271](https://github.com/primefaces/primevue/issues/4271) +- FileUpload: Class .p-fileupload-highlight is missing [\#4129](https://github.com/primefaces/primevue/issues/4129) +- DataTable: Slow filter and sort performance with large datasets [\#4007](https://github.com/primefaces/primevue/issues/4007) +- Dropdown: Show Clear Keyboard Binding [\#3834](https://github.com/primefaces/primevue/issues/3834) + +**Fixed bugs:** + +- Sidebar: using unstyled mode and Tailwind theme, the :modal="false" doesn't work. Can't disable the modal layer. [\#4288](https://github.com/primefaces/primevue/issues/4288) +- Unstyled Mode: Tailwind - only refers to a type [\#4280](https://github.com/primefaces/primevue/issues/4280) +- Disabled prop on Password component not working [\#4279](https://github.com/primefaces/primevue/issues/4279) +- usePassThrough: Components with function as their value doesn't seem to work properly [\#4278](https://github.com/primefaces/primevue/issues/4278) +- DataTable in expand mode resizing problem [\#4277](https://github.com/primefaces/primevue/issues/4277) +- Slot function options .d.ts typing fixes [\#4274](https://github.com/primefaces/primevue/issues/4274) +- Sidebar: Tailwind transitions do not work for all positions [\#4272](https://github.com/primefaces/primevue/issues/4272) +- Datatable: Menu Filter Icon Click Causes Column to Sort [\#4268](https://github.com/primefaces/primevue/issues/4268) +- Button: iconClass is not assigned when component is unstyled [\#4265](https://github.com/primefaces/primevue/issues/4265) +- Dropdown: Invalid slot typings [\#4263](https://github.com/primefaces/primevue/issues/4263) +- Unexpected behavior of the ConfirmDialog component during dragging process [\#4251](https://github.com/primefaces/primevue/issues/4251) +- ColorPicker: baseZIndex is unused [\#4228](https://github.com/primefaces/primevue/issues/4228) +- Calendar: increment minute [\#4207](https://github.com/primefaces/primevue/issues/4207) +- Message: Icon shrinks when text in message wraps to new lines. [\#3966](https://github.com/primefaces/primevue/issues/3966) +- Dialog, Sidebar: Not working if v-model:visible is changed quickly [\#3940](https://github.com/primefaces/primevue/issues/3940) +- DataTable: Grouping with Pagination is Broken [\#3896](https://github.com/primefaces/primevue/issues/3896) +- rowGroup feature is not working with paginator in PrimeVue's DataTable [\#3858](https://github.com/primefaces/primevue/issues/3858) +- Image: want set preview to fullscreen [\#2947](https://github.com/primefaces/primevue/issues/2947) +- Buttongroup with outlined buttons [\#2238](https://github.com/primefaces/primevue/issues/2238) + +## [3.32.0](https://github.com/primefaces/primevue/tree/3.32.0) (2023-08-11) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.31.0...3.32.0) + +**Breaking Changes:** + +- Update `Tailwind` package in core [\#4255](https://github.com/primefaces/primevue/issues/4255) + +**Implemented New Features and Enhancements:** + +- Add `usePassThrough` method to customize default PT objects [\#4257](https://github.com/primefaces/primevue/issues/4257) +- AutoComplete: loading state [\#4253](https://github.com/primefaces/primevue/issues/4253) +- Add `Content Security Policy (CSP)` config [\#4241](https://github.com/primefaces/primevue/issues/4241) +- Core unstyled mode updates [\#4235](https://github.com/primefaces/primevue/issues/4235) +- Datatable: Cell Edit Numpad Enter not working [\#4232](https://github.com/primefaces/primevue/issues/4232) +- Add `transition` option to Pass Through\(PT\) of components [\#4231](https://github.com/primefaces/primevue/issues/4231) +- Add custom `global.css` option to Pass Through\(PT\) [\#4230](https://github.com/primefaces/primevue/issues/4230) +- Avatar: Return target in error event callback [\#4222](https://github.com/primefaces/primevue/issues/4222) +- Password: add "@change" event [\#4219](https://github.com/primefaces/primevue/issues/4219) +- PT context improvemens [\#4211](https://github.com/primefaces/primevue/issues/4211) + +**Fixed bugs:** + +- Dropdown: Click on icon line is ignored [\#4259](https://github.com/primefaces/primevue/issues/4259) +- Vue Tooltip: Flickering Issue [\#4256](https://github.com/primefaces/primevue/issues/4256) +- Image: preview button is missing `type="button"` and submits forms by default [\#4249](https://github.com/primefaces/primevue/issues/4249) +- SpeedDial: tooltip not working on speed dial [\#4238](https://github.com/primefaces/primevue/issues/4238) +- Dialog: unstyled mode pointer-event defects [\#4237](https://github.com/primefaces/primevue/issues/4237) +- Toast: Toast Icon is too small [\#4234](https://github.com/primefaces/primevue/issues/4234) +- Datatable: Filtering with grouping not working [\#4229](https://github.com/primefaces/primevue/issues/4229) +- Dropdown: Incorrect prop declaration [\#4225](https://github.com/primefaces/primevue/issues/4225) +- RadioButton: pt prop has incorrect type [\#4202](https://github.com/primefaces/primevue/issues/4202) +- TreeSelect: p-treeselect-items-wrapper is missing [\#4145](https://github.com/primefaces/primevue/issues/4145) +- SplitButton: menu icon not visible in large size [\#4028](https://github.com/primefaces/primevue/issues/4028) +- DataTable and TreeTable: Column sorting not working correctly when using custom header template [\#3702](https://github.com/primefaces/primevue/issues/3702) + +## [3.31.0](https://github.com/primefaces/primevue/tree/3.31.0) (2023-07-25) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.30.2...3.31.0) + +**Implemented New Features and Enhancements:** + +- Tailwind Theme for Unstyled Mode [\#4205](https://github.com/primefaces/primevue/issues/4205) +- PT context improvements [\#4196](https://github.com/primefaces/primevue/issues/4196) +- Add item parameter to menuitem options for pt property [\#4190](https://github.com/primefaces/primevue/issues/4190) + +**Fixed bugs:** + +- Bootstrap: Breadcrumb icon fix [\#4195](https://github.com/primefaces/primevue/issues/4195) +- CascadeSelect unstyled mode defect [\#4192](https://github.com/primefaces/primevue/issues/4192) +- InputSwitch: pt prop has incorrect type [\#4187](https://github.com/primefaces/primevue/issues/4187) +- TabView: ID used in aria-controls does not exist on panel content div [\#4181](https://github.com/primefaces/primevue/issues/4181) +- Dropdown: default optionLabel and default optionValue are null \(but doc say, default to label and value\) [\#4174](https://github.com/primefaces/primevue/issues/4174) +- Image: Preview not closing on escape click [\#4089](https://github.com/primefaces/primevue/issues/4089) + +## [3.30.2](https://github.com/primefaces/primevue/tree/3.30.2) (2023-07-20) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.30.1...3.30.2) + +**Implemented New Features and Enhancements:** + +- Rename `button` and `buttonIcon` pt options with `closeButton` and `closeIcon` options in Message and Toast [\#4159](https://github.com/primefaces/primevue/issues/4159) +- DataTable & TreeTable: new `size` property [\#4156](https://github.com/primefaces/primevue/issues/4156) +- Improve `pt` syntax for 'class' definitions [\#4150](https://github.com/primefaces/primevue/issues/4150) +- PT context improvements [\#4149](https://github.com/primefaces/primevue/issues/4149) + +**Fixed bugs:** + +- TabMenu: disabled item defect & accessibility improvements [\#4169](https://github.com/primefaces/primevue/issues/4169) +- OverlayPanel: Toggle on list of focusable elements forces screen jump [\#4167](https://github.com/primefaces/primevue/issues/4167) +- Global pt implementation defects [\#4163](https://github.com/primefaces/primevue/issues/4163) +- Multiselect: Custom checkbox render issue [\#4152](https://github.com/primefaces/primevue/issues/4152) + +## [3.30.1](https://github.com/primefaces/primevue/tree/3.30.1) (2023-07-14) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.30.0...3.30.1) + +**Implemented New Features and Enhancements:** + +- Button: remove margin from default style [\#4139](https://github.com/primefaces/primevue/issues/4139) +- Improve `pt` options on components that use helper component [\#4136](https://github.com/primefaces/primevue/issues/4136) +- Pass Through Props: Syntactic improvement suggestion [\#4125](https://github.com/primefaces/primevue/issues/4125) +- PT context improvements [\#4124](https://github.com/primefaces/primevue/issues/4124) + +**Fixed bugs:** + +- TreeTable: Sorting does not work when clicking at the header title [\#4138](https://github.com/primefaces/primevue/issues/4138) +- Selection\(multiple and single\) not working in TreeTable [\#4133](https://github.com/primefaces/primevue/issues/4133) +- The types in PrimeVue config are not accessible [\#4122](https://github.com/primefaces/primevue/issues/4122) +- Browser CDN mode is not working as expected [\#4121](https://github.com/primefaces/primevue/issues/4121) +- TypeScript: changeTheme is not declared [\#4118](https://github.com/primefaces/primevue/issues/4118) +- Panel: Wrong prop type in `header` slot [\#4086](https://github.com/primefaces/primevue/issues/4086) + +## [3.30.0](https://github.com/primefaces/primevue/tree/3.30.0) (2023-07-10) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.29.2...3.30.0) + +**Implemented New Features and Enhancements:** + +- InputText: `size` property [\#4106](https://github.com/primefaces/primevue/issues/4106) +- Add `hooks` keyword to `pt` options to access all lifecycle methods on components and directives [\#4103](https://github.com/primefaces/primevue/issues/4103) +- Pass all emits to templates on DynamicDialog [\#4102](https://github.com/primefaces/primevue/issues/4102) +- Improve `pt` options on components that use helper component [\#3983](https://github.com/primefaces/primevue/issues/3983) +- Add `unstyled` mode for all components [\#3965](https://github.com/primefaces/primevue/issues/3965) + +**Fixed bugs:** + +- Button: Button width is to small when have a icon and a badge only [\#4083](https://github.com/primefaces/primevue/issues/4083) +- SplitButton: aria-expanded not set correctly [\#4065](https://github.com/primefaces/primevue/issues/4065) +- Toast: Crashing when no severity value is provided [\#4063](https://github.com/primefaces/primevue/issues/4063) +- Positioning defect PrimeVue Button with icon slot [\#4042](https://github.com/primefaces/primevue/issues/4042) +- Tooltip: showDelay still triggers Tooltip when original element is removed [\#4029](https://github.com/primefaces/primevue/issues/4029) +- tooltip: hideDelay is not defined [\#4025](https://github.com/primefaces/primevue/issues/4025) +- `pt` implementation defects [\#4024](https://github.com/primefaces/primevue/issues/4024) +- FocusTrap.js writes to read-only property `classList` which causes test failures under happy-dom [\#4015](https://github.com/primefaces/primevue/issues/4015) +- The `getScrollableParents` method throws a exception in shadow dom [\#4014](https://github.com/primefaces/primevue/issues/4014) +- TreeTable: event propagation issue [\#4010](https://github.com/primefaces/primevue/issues/4010) +- Dynamic clipPath support for icons [\#3959](https://github.com/primefaces/primevue/issues/3959) +- Accordion: pt options for root applied twice [\#3955](https://github.com/primefaces/primevue/issues/3955) +- InputNumber: Incorrect formatting when in decimal mode with a suffix \(maybe all the time\) [\#3382](https://github.com/primefaces/primevue/issues/3382) + +**Deprecated:** + +- The `primevue[.min].css` has been deprecated [\#4110](https://github.com/primefaces/primevue/issues/4110) + +## [3.29.2](https://github.com/primefaces/primevue/tree/3.29.2) (2023-05-31) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.29.1...3.29.2) + +**Fixed bugs:** + +- Datatable: Custom checkbox render issue [\#4003](https://github.com/primefaces/primevue/issues/4003) + +## [3.29.1](https://github.com/primefaces/primevue/tree/3.29.1) (2023-05-15) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.29.0...3.29.1) + +**Fixed bugs:** + +- SpeedDial: Mask and SpeedDial itself prevent pointer events and speedDial does not close using item slot [\#3945](https://github.com/primefaces/primevue/issues/3945) +- DataTable: Selection and focus loss when no custom ContextMenu is defined [\#3927](https://github.com/primefaces/primevue/issues/3927) +- TabMenu: Accessibility issue in TabMenu with hidden tabs [\#3910](https://github.com/primefaces/primevue/issues/3910) +- Steps: text overflow [\#3631](https://github.com/primefaces/primevue/issues/3631) + +## [3.29.0](https://github.com/primefaces/primevue/tree/3.29.0) (2023-05-11) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.28.0...3.29.0) + +**Implemented New Features and Enhancements:** + +- New passthrough\(pt\) property implementation for Data Components [\#3924](https://github.com/primefaces/primevue/issues/3924) +- New passthrough\(pt\) property implementation for Form Components [\#3922](https://github.com/primefaces/primevue/issues/3922) +- New passthrough\(pt\) property implementation for Media Components [\#3918](https://github.com/primefaces/primevue/issues/3918) +- Image: New `image` and `preview` slots [\#3864](https://github.com/primefaces/primevue/issues/3864) +- Tooltip Delay option [\#3764](https://github.com/primefaces/primevue/issues/3764) +- Image: Handling of disabled zoomOut and zoomIn in preview [\#2948](https://github.com/primefaces/primevue/issues/2948) + +**Fixed bugs:** + +- Calendar: showOnFocus=false does not work [\#3923](https://github.com/primefaces/primevue/issues/3923) +- OrderList: TypeError with empty list [\#3870](https://github.com/primefaces/primevue/issues/3870) + +## [3.28.0](https://github.com/primefaces/primevue/tree/3.28.0) (2023-05-02) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.27.0...3.28.0) + +**Implemented New Features and Enhancements:** + +- New passthrough\(pt\) property implementation for Chart & FileUpload & Message Components [\#3911](https://github.com/primefaces/primevue/issues/3911) +- New passthrough\(pt\) property implementation for Menu Components [\#3907](https://github.com/primefaces/primevue/issues/3907) +- Button: No label [\#3905](https://github.com/primefaces/primevue/issues/3905) +- Add global `pt` option to PrimeVue config [\#3902](https://github.com/primefaces/primevue/issues/3902) +- New passthrough\(pt\) property implementation for Button Components [\#3889](https://github.com/primefaces/primevue/issues/3889) +- New passthrough\(pt\) property implementation for Overlay Components [\#3885](https://github.com/primefaces/primevue/issues/3885) +- New passthrough\(pt\) property implementation for Misc Components [\#3879](https://github.com/primefaces/primevue/issues/3879) + +**Fixed bugs:** + +- Message: wrong close icon size [\#3908](https://github.com/primefaces/primevue/issues/3908) +- Panel: Header accessibility issue [\#3904](https://github.com/primefaces/primevue/issues/3904) +- Calendar: Material theme icons not visible [\#3903](https://github.com/primefaces/primevue/issues/3903) +- Password: Incorrect onClick property as scope for custom icons [\#3900](https://github.com/primefaces/primevue/issues/3900) +- AutoComplete: class style and click event refactor on `removetokenicon` scoped slot [\#3899](https://github.com/primefaces/primevue/issues/3899) +- Dropdown: Selection is not working correctly with falsy values [\#3891](https://github.com/primefaces/primevue/issues/3891) + +## [3.27.0](https://github.com/primefaces/primevue/tree/3.27.0) (2023-04-19) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.26.1...3.27.0) + +**Implemented New Features and Enhancements:** + +- Add icon templating support to components [\#3833](https://github.com/primefaces/primevue/issues/3833) +- Improve icon implementation in core [\#3832](https://github.com/primefaces/primevue/issues/3832) +- Add new Icon components [\#3829](https://github.com/primefaces/primevue/issues/3829) +- Panel: Footer Templating [\#3820](https://github.com/primefaces/primevue/issues/3820) +- AutoComplete: NumpadEnter is not recognised [\#3816](https://github.com/primefaces/primevue/issues/3816) +- Calendar: Emit year-change event via navBackward and navForward [\#3811](https://github.com/primefaces/primevue/issues/3811) +- New passthrough\(pt\) property implementation for Panel Components [\#3797](https://github.com/primefaces/primevue/issues/3797) +- Galleria: Play and Pause [\#3619](https://github.com/primefaces/primevue/issues/3619) + +**Fixed bugs:** + +- TabView: Scrollable Starting/Ending Nav Arrow Blocks First/Last Tab [\#3849](https://github.com/primefaces/primevue/issues/3849) +- DataTable Filter with Calendar is not showing in proper location [\#3632](https://github.com/primefaces/primevue/issues/3632) + +**Deprecated:** + +- Deprecated `indicator` slot [\#3871](https://github.com/primefaces/primevue/issues/3871) +- FullCalendar: Deprecated component [\#3827](https://github.com/primefaces/primevue/issues/3827) + +## [3.26.1](https://github.com/primefaces/primevue/tree/3.26.1) (2023-03-27) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.26.0...3.26.1) + +**Implemented New Features and Enhancements:** + +- Improve folder structure for nuxt configurations [\#3802](https://github.com/primefaces/primevue/issues/3802) +- Image: Add Additional Toolbar Buttons To Preview [\#3771](https://github.com/primefaces/primevue/issues/3771) +- Image: indicator icon property[\#3492](https://github.com/primefaces/primevue/issues/3492) + +**Fixed bugs:** + +- The esm builds throw an exception due to optional chaining [\#3809](https://github.com/primefaces/primevue/issues/3809) +- Filtering: doesn't respect optionGroupChildren [\#3807](https://github.com/primefaces/primevue/issues/3807) +- Api: Typing mismatch [\#3806](https://github.com/primefaces/primevue/issues/3806) +- DataTable: Row edits when enabled doesn't work with pagination [\#3801](https://github.com/primefaces/primevue/issues/3801) +- Calendar: Page scrolls to top when clicked on calendar icon [\#3791](https://github.com/primefaces/primevue/issues/3791) +- Splitter: a couple of errors related to aria-\* attributes [\#3783](https://github.com/primefaces/primevue/issues/3783) +- DataTable: Group Rows do not span all Columns with Selection Mode set and group-by not in the Column list [\#3781](https://github.com/primefaces/primevue/issues/3781) +- DataTable: the table disappears when using scrollHeight="flex" and virtual scrolling [\#3772](https://github.com/primefaces/primevue/issues/3772) + +## [3.26.0](https://github.com/primefaces/primevue/tree/3.26.0) (2023-03-20) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.25.0...3.26.0) + +**Implemented New Features and Enhancements:** + +- TriStateCheckbox: case of modelValue undefined [\#3762](https://github.com/primefaces/primevue/issues/3762) +- Inplace: FocusTrap support [\#3760](https://github.com/primefaces/primevue/issues/3760) +- ConfirmDialog: Add draggable property [\#3753](https://github.com/primefaces/primevue/issues/3753) +- Inplace editing does not focus on input element as expected [\#2348](https://github.com/primefaces/primevue/issues/2348) + +**Fixed bugs:** + +- Slider: Accessibility issue [\#3768](https://github.com/primefaces/primevue/issues/3768) +- TreeTable: Column Resizing defect [\#3754](https://github.com/primefaces/primevue/issues/3754) +- Api: Typing mismatch [\#3751](https://github.com/primefaces/primevue/issues/3751) +- SplitButton/OverlayPanel: OverlayPanel won't open from default call by SplitButton [\#3750](https://github.com/primefaces/primevue/issues/3750) +- Slider: Focus on slider on mouse click [\#3748](https://github.com/primefaces/primevue/issues/3748) +- Dropdown preselected disabled option is not shown [\#3541](https://github.com/primefaces/primevue/issues/3541) + +## [3.25.0](https://github.com/primefaces/primevue/tree/3.25.0) (2023-03-13) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.24.0...3.25.0) + +**Breaking Changes:** + +- SelectButton: inverse `unselectable` behaviour [\#3708](https://github.com/primefaces/primevue/issues/3708) + +**Implemented New Features and Enhancements:** + +- DynamicDialog: Improve `templates` option to use dynamic components in header and footer templates. [\#3736](https://github.com/primefaces/primevue/issues/3736) +- Api: Type mismatch [\#3727](https://github.com/primefaces/primevue/issues/3727) +- DynamicDialog: Add `emits` option to handle events emitted by the child component [\#3726](https://github.com/primefaces/primevue/issues/3726) + +**Fixed bugs:** + +- DataTable: rowStyle function doesn't work [\#3738](https://github.com/primefaces/primevue/issues/3738) +- Dialog: header buttons autofocus defect [\#3729](https://github.com/primefaces/primevue/issues/3729) +- Class and Style properties type definition defects [\#3707](https://github.com/primefaces/primevue/issues/3707) +- InputMask: Dynamic mask change issue [\#3698](https://github.com/primefaces/primevue/issues/3698) +- Tooltip: cannot unbind events when tooltip value is cleared [\#3645](https://github.com/primefaces/primevue/issues/3645) +- Calendar: Disable year and month when set minDate or maxDate [\#3589](https://github.com/primefaces/primevue/issues/3589) +- DataTable frozen columns in footer not freezing [\#3190](https://github.com/primefaces/primevue/issues/3190) +- ConfirmPopup: page scrolls up when the button is clicked a second time [\#3516](https://github.com/primefaces/primevue/issues/3516) + +## [3.24.0](https://github.com/primefaces/primevue/tree/3.24.0) (2023-03-07) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.23.0...3.24.0) + +**Breaking Changes:** + +- Removed TypeScript types [\#3696](https://github.com/primefaces/primevue/issues/3696) +- DataTable CSS and responsive structure improvements [\#3682](https://github.com/primefaces/primevue/issues/3682) + +**Implemented New Features and Enhancements:** + +- SplitButton: New Styling properties [\#3697](https://github.com/primefaces/primevue/issues/3697) +- Button: New Styling Properties [\#3695](https://github.com/primefaces/primevue/issues/3695) +- Add appendOnly and inline properties to VirtualScroller [\#3683](https://github.com/primefaces/primevue/issues/3683) +- Avatar - Image Alt text Accessibility [\#3593](https://github.com/primefaces/primevue/issues/3593) +- Tab Menu: Add role to ink bar [\#3583](https://github.com/primefaces/primevue/issues/3583) +- Toast: new `close` and `life-end` methods [\#2989](https://github.com/primefaces/primevue/issues/2989) + +**Fixed bugs:** + +- Dropdown: editable mode add change event [\#3692](https://github.com/primefaces/primevue/issues/3692) +- DataTable: cannot uncheck when click the checkbox in column [\#3691](https://github.com/primefaces/primevue/issues/3691) +- Checkbox: has an attribute that is not supported by input checkboxes. [\#3678](https://github.com/primefaces/primevue/issues/3678) +- Badge: do not render Zero correctly [\#3649](https://github.com/primefaces/primevue/issues/3649) +- InputSwitch: invalid state defect [\#3646](https://github.com/primefaces/primevue/issues/3646) +- MegaMenu templating defect [\#3621](https://github.com/primefaces/primevue/issues/3621) + +## [3.23.0](https://github.com/primefaces/primevue/tree/3.23.0) (2023-01-30) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.22.4...3.23.0) + +**Implemented New Features and Enhancements:** + +- Menu: `start` and `end` templating [\#3599](https://github.com/primefaces/primevue/issues/3599) +- Intro 6 New Free Themes [\#3597](https://github.com/primefaces/primevue/issues/3597) +- DataTable: exportData exclude column footers [\#3328](https://github.com/primefaces/primevue/issues/3328) + +**Fixed bugs:** + +- Breadcrumb: Home item not using item slot [\#3604](https://github.com/primefaces/primevue/issues/3604) +- Locale: `endsWith` typing error on d.ts [\#3595](https://github.com/primefaces/primevue/issues/3595) +- Tag: Duplicate class names [\#3584](https://github.com/primefaces/primevue/issues/3584) +- DataTable: tabbing error with row select and expanded rows enabled [\#3571](https://github.com/primefaces/primevue/issues/3571) +- Dialog: dismissableMask not working when closable false [\#3560](https://github.com/primefaces/primevue/issues/3560) +- DataTable: Paginator should be below DataTable Footer templating [\#3540](https://github.com/primefaces/primevue/issues/3540) +- Datatable: RowReorder fails in case of pagination on page other than first & last [\#3443](https://github.com/primefaces/primevue/issues/3443) +- Calendar: maxDate with 12-hour-format does not allow minute and second value modification [\#3356](https://github.com/primefaces/primevue/issues/3356) + +## [3.22.4](https://github.com/primefaces/primevue/tree/3.22.4) (2023-01-23) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.22.3...3.22.4) + +**Fixed bugs:** + +- Breadcrumb: when home is not defined, first separator should not be rendered [\#3570](https://github.com/primefaces/primevue/issues/3570) +- PanelMenu header action color update [\#3561](https://github.com/primefaces/primevue/issues/3561) +- Unique values created in components are set incorrectly. [\#3558](https://github.com/primefaces/primevue/issues/3558) +- ZIndexUtils: Dropdown inside Dialog doesn't work [\#3554](https://github.com/primefaces/primevue/issues/3554) +- PanelMenu: Link items can't be opened with a keyboard \(slot issue\) [\#3553](https://github.com/primefaces/primevue/issues/3553) +- Material Calendar: Invalid State defect [\#3547](https://github.com/primefaces/primevue/issues/3547) +- Textarea : Label colour do not changes to primary colour when floating above [\#3530](https://github.com/primefaces/primevue/issues/3530) +- Calendar: Regression. Incorrect calendar pop-up positioning when used as editor in DataTable [\#3526](https://github.com/primefaces/primevue/issues/3526) + +## [3.22.3](https://github.com/primefaces/primevue/tree/3.22.3) (2023-01-17) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.22.2...3.22.3) + +**Fixed bugs:** + +- ZIndexUtils is not working as expected on the overlays [\#3549](https://github.com/primefaces/primevue/issues/3549) + +## [3.22.2](https://github.com/primefaces/primevue/tree/3.22.2) (2023-01-16) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.22.1...3.22.2) + +**Implemented New Features and Enhancements:** + +- Sidebar: transition class update and adding `after-hide` event [\#3535](https://github.com/primefaces/primevue/issues/3535) + +**Fixed bugs:** + +- Divider: dotted vertical divider is not working [\#3534](https://github.com/primefaces/primevue/issues/3534) +- RadioButton and Rating causes scroll [\#3533](https://github.com/primefaces/primevue/issues/3533) +- Sidebar: Mask container should be removed from DOM [\#3531](https://github.com/primefaces/primevue/issues/3531) +- Menu: TypeError with only disabled menuitems [\#3513](https://github.com/primefaces/primevue/issues/3513) +- DataTable/Paginator: JumpToInput not working. Incrementing page not changing input value [\#3538](https://github.com/primefaces/primevue/issues/3538) + +## [3.22.1](https://github.com/primefaces/primevue/tree/3.22.1) (2023-01-12) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.22.0...3.22.1) + +- Sidebar: Extraneous non-props attributes warnings [\#3524](https://github.com/primefaces/primevue/issues/3524) + +**Fixed bugs:** + +## [3.22.0](https://github.com/primefaces/primevue/tree/3.22.0) (2023-01-11) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.21.0...3.22.0) + +**Implemented New Features and Enhancements:** + +- ProgressSpinner| color updates [\#3511](https://github.com/primefaces/primevue/issues/3511) +- Reimplement Sidebar [\#3474](https://github.com/primefaces/primevue/issues/3474) +- Pass props to SplitButton MenuButton [\#3394](https://github.com/primefaces/primevue/issues/3394) +- TabMenu: index of menu item must be accessible in slot [\#3393](https://github.com/primefaces/primevue/issues/3393) +- `empty` slot for Autocomplete [\#2525](https://github.com/primefaces/primevue/issues/2525) + +**Fixed bugs:** + +- DropdownMenu: Disabled dropdown can still be opened with screen reader [\#3512](https://github.com/primefaces/primevue/issues/3512) +- SpeedDial: Overlapping Issue [\#3504](https://github.com/primefaces/primevue/issues/3504) +- Breadcrumb: Using template the Home icon is not appearing [\#3503](https://github.com/primefaces/primevue/issues/3503) +- SplitButton: unexpected call of default action [\#3467](https://github.com/primefaces/primevue/issues/3467) +- Calendar: inline mode accepts focus [\#3452](https://github.com/primefaces/primevue/issues/3452) +- Data Table: groupRowsBy, prop type error [\#3450](https://github.com/primefaces/primevue/issues/3450) +- The focus styling is always set to the first element in List components [\#3447](https://github.com/primefaces/primevue/issues/3447) +- Panel: typo on toggle button props [\#3436](https://github.com/primefaces/primevue/issues/3436) +- MultiSelect: mark text with shift+Home does not work [\#3435](https://github.com/primefaces/primevue/issues/3435) +- PanelMenu: open/close events flipped [\#3434](https://github.com/primefaces/primevue/issues/3434) +- ConfirmPopup: page scrolls up when push the button [\#3432](https://github.com/primefaces/primevue/issues/3432) +- ConfirmDialog: icon element still rendering even when icon property is null [\#3431](https://github.com/primefaces/primevue/issues/3431) +- DataTable/Paginator: Double event fire in JumpToPageInput [\#3409](https://github.com/primefaces/primevue/issues/3409) +- Checkbox: inputClass and inputStyle properties does not apply correctly [\#3406](https://github.com/primefaces/primevue/issues/3406) +- DataTable: Invalid typing for DataTableSortFieldType [\#3403](https://github.com/primefaces/primevue/issues/3403) +- Calendar: Invalid TypeScript definitions for modelValue [\#3400](https://github.com/primefaces/primevue/issues/3400) +- Calendar: Time input doesn't allow PM when typed in [\#3398](https://github.com/primefaces/primevue/issues/3398) +- FileUpload Missing TypeDefinitions for Callbacks in \#content slot [\#3396](https://github.com/primefaces/primevue/issues/3396) +- TieredMenu: Menu commands in the TieredMenu don't receive any arguments [\#3391](https://github.com/primefaces/primevue/issues/3391) +- PanelMenu: passing computed value as a model prop [\#3166](https://github.com/primefaces/primevue/issues/3166) +- Editor: Can not click change color text and background color in Editor [\#3097](https://github.com/primefaces/primevue/issues/3097) +- Sidebar overlay not removed after changing position [\#1823](https://github.com/primefaces/primevue/issues/1823) + +## [3.21.0](https://github.com/primefaces/primevue/tree/3.21.0) (2022-12-08) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.20.0...3.21.0) + +**Implemented New Features and Enhancements:** + +- MultiSelect: Very long selection time due to Chips [\#3380](https://github.com/primefaces/primevue/issues/3380) +- Improve Message Implementation for Accessibility [\#3370](https://github.com/primefaces/primevue/issues/3370) +- Improve Toast Implementation for Accessibility [\#3369](https://github.com/primefaces/primevue/issues/3369) +- Add gap when Toolbar wraps [\#3366](https://github.com/primefaces/primevue/issues/3366) +- Center content to Toolbar [\#3365](https://github.com/primefaces/primevue/issues/3365) +- Deprecate Toolbar CSS classes [\#3364](https://github.com/primefaces/primevue/issues/3364) +- Improve Tree Implementation for Accessibility [\#3360](https://github.com/primefaces/primevue/issues/3360) +- Calendar: Chrome autocomplete list is overlaying the data picker model [\#3355](https://github.com/primefaces/primevue/issues/3355) +- Improve SpeedDial Implementation for Accessibility [\#3353](https://github.com/primefaces/primevue/issues/3353) +- When clicking any menuitem in the Menu components, it always focuses on the first menuitem [\#3352](https://github.com/primefaces/primevue/issues/3352) +- Improve Image Implementation for Accessibility [\#3351](https://github.com/primefaces/primevue/issues/3351) +- AutoComplete: new `dropdownClass` prop [\#3350](https://github.com/primefaces/primevue/issues/3350) +- Improve Galleria Implementation for Accessibility [\#3349](https://github.com/primefaces/primevue/issues/3349) +- Improve Carousel Implementation for Accessibility [\#3348](https://github.com/primefaces/primevue/issues/3348) +- Improve SplitButton Implementation for Accessibility [\#3344](https://github.com/primefaces/primevue/issues/3344) +- Improve search operation on PanelMenu [\#3342](https://github.com/primefaces/primevue/issues/3342) +- Improve Chart Component Implementation for Accessibility [\#3333](https://github.com/primefaces/primevue/issues/3333) +- Improve DataTable Implementation for Accessibility [\#3330](https://github.com/primefaces/primevue/issues/3330) +- Improve PickList Implementation for Accessibility [\#3323](https://github.com/primefaces/primevue/issues/3323) +- Improve OrderList Implementation for Accessibility [\#3321](https://github.com/primefaces/primevue/issues/3321) +- Improve TreeTable Implementation for Accessibility [\#3319](https://github.com/primefaces/primevue/issues/3319) +- Improve DataView Implementation for Accessibility [\#3310](https://github.com/primefaces/primevue/issues/3310) +- Improve Paginator Implementation for Accessibility [\#3304](https://github.com/primefaces/primevue/issues/3304) +- Improve OrganizationChart Implementation for Accessibility [\#3302](https://github.com/primefaces/primevue/issues/3302) +- Improve Timeline Implementation for Accessibility [\#3296](https://github.com/primefaces/primevue/issues/3296) +- Dropdown: add keyboard support for Numpad Enter [\#3257](https://github.com/primefaces/primevue/issues/3257) +- Calendar: Accessibility for Material themes [\#2900](https://github.com/primefaces/primevue/issues/2900) + +**Fixed bugs:** + +- Password: Eye icon problem in MS Edge and IE [\#3372](https://github.com/primefaces/primevue/issues/3372) +- Menubar: No items property fails to compile [\#3359](https://github.com/primefaces/primevue/issues/3359) +- TabMenu: we can not use tab-change event with menuitem templating [\#3357](https://github.com/primefaces/primevue/issues/3357) +- FileUpload Missing TypeDefinitions for Slots [\#3335](https://github.com/primefaces/primevue/issues/3335) +- Multiselect Uncaught TypeError [\#3329](https://github.com/primefaces/primevue/issues/3329) +- AutoComplete: the forceSelection property causes inconsistent behavior when the value is removed [\#3161](https://github.com/primefaces/primevue/issues/3161) +- Dropdown: Long list causes the page to have a long scroll bar [\#3031](https://github.com/primefaces/primevue/issues/3031) + +## [3.20.0](https://github.com/primefaces/primevue/tree/3.20.0) (2022-11-18) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.19.0...3.20.0) + +**Implemented New Features and Enhancements:** + +- OverlayPanel: deprecate `ariaCloseLabel` prop [\#3287](https://github.com/primefaces/primevue/issues/3287) +- Improve Inplace Implementation for Accessibility [\#3286](https://github.com/primefaces/primevue/issues/3286) +- Improve ProgressBar Implementation for Accessibility [\#3284](https://github.com/primefaces/primevue/issues/3284) +- Improve Chip Implementation for Accessibility [\#3282](https://github.com/primefaces/primevue/issues/3282) +- Improve BlockUI Implementation for Accessibility [\#3280](https://github.com/primefaces/primevue/issues/3280) +- Improve Badge Implementation for Accessibility [\#3278](https://github.com/primefaces/primevue/issues/3278) +- Improve Tag Implementation for Accessibility [\#3277](https://github.com/primefaces/primevue/issues/3277) +- Improve Ripple Implementation for Accessibility [\#3276](https://github.com/primefaces/primevue/issues/3276) +- Improve Skeleton Implementation for Accessibility [\#3275](https://github.com/primefaces/primevue/issues/3275) +- Improve Avatar Implementation for Accessibility [\#3273](https://github.com/primefaces/primevue/issues/3273) +- Improve ProgressSpinner Implementation for Accessibility [\#3272](https://github.com/primefaces/primevue/issues/3272) +- Improve Terminal Implementation for Accessibility [\#3271](https://github.com/primefaces/primevue/issues/3271) +- Improve ScrollTop Implementation for Accessibility [\#3270](https://github.com/primefaces/primevue/issues/3270) + +**Fixed bugs:** + +- PrimeIcons missing type definition [\#3292](https://github.com/primefaces/primevue/issues/3292) +- Panel: `toggleButtonProps` prop defect [\#3289](https://github.com/primefaces/primevue/issues/3289) +- Fieldset: `toggleButtonProps` prop defect [\#3288](https://github.com/primefaces/primevue/issues/3288) +- Calendar: maxDate with 12-hour formatting restricts values incorrectly [\#3253](https://github.com/primefaces/primevue/issues/3253) + +## [3.19.0](https://github.com/primefaces/primevue/tree/3.19.0) (2022-11-16) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.18.1...3.19.0) + +**Implemented New Features and Enhancements:** + +- Update PrimeFlex 3.3.0 [\#3261](https://github.com/primefaces/primevue/issues/3261) +- Improve OverlayPanel Implementation for Accessibility [\#3254](https://github.com/primefaces/primevue/issues/3254) +- Improve Tooltip Implementation for Accessibility [\#3248](https://github.com/primefaces/primevue/issues/3248) +- Chips | Allow multiple seperators [\#3240](https://github.com/primefaces/primevue/issues/3240) +- Improve ConfirmPopup implementation for Accessibility [\#3236](https://github.com/primefaces/primevue/issues/3236) +- Improve Sidebar implementation for Accessibility [\#3233](https://github.com/primefaces/primevue/issues/3233) +- Improve ConfirmDialog implementation for Accessibility [\#3232](https://github.com/primefaces/primevue/issues/3232) +- Improve Dialog implementation for Accessibility [\#3231](https://github.com/primefaces/primevue/issues/3231) +- FocusTrap Directive [\#3225](https://github.com/primefaces/primevue/issues/3225) +- Splitter: Emit Resize Start event [\#3203](https://github.com/primefaces/primevue/issues/3203) + +**Fixed bugs:** + +- PrimeVue Radiobutton - Mobile - scroll to top [\#3266](https://github.com/primefaces/primevue/issues/3266) +- Calendar: Inline Calendar is jumping when selected mode is range and number of months is more then 1 [\#3247](https://github.com/primefaces/primevue/issues/3247) +- Slider: Range feature not working correctly [\#3238](https://github.com/primefaces/primevue/issues/3238) +- Chips | Cannot remove p-focus [\#3237](https://github.com/primefaces/primevue/issues/3237) +- Menubar: should accept empty items [\#3224](https://github.com/primefaces/primevue/issues/3224) +- Menu: TypeError with only disabled menuitems [\#3223](https://github.com/primefaces/primevue/issues/3223) +- Menubar: Menu Icon in mobile view problem [\#3221](https://github.com/primefaces/primevue/issues/3221) +- DataTable: groupRowsBy has wrong type [\#3219](https://github.com/primefaces/primevue/issues/3219) +- TieredMenu \(and SplitButton\): Jumps to the top of the page [\#3212](https://github.com/primefaces/primevue/issues/3212) + +## [3.18.1](https://github.com/primefaces/primevue/tree/3.18.1) (2022-10-31) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.18.0...3.18.1) + +**Implemented New Features and Enhancements:** + +- Dialog: Allow custom icons for maximizing [\#3192](https://github.com/primefaces/primevue/issues/3192) +- InputNumber: `highlightOnFocus` property [\#3179](https://github.com/primefaces/primevue/issues/3179) +- Inplace: Allow custom icons [\#3134](https://github.com/primefaces/primevue/issues/3134) +- Slider: Range slider can not be dragged to the left when both thumbs overlap [\#3104](https://github.com/primefaces/primevue/issues/3104) +- Calendar: Allow custom icons [\#3081](https://github.com/primefaces/primevue/issues/3081) +- Toast: Allow custom icons [\#3061](https://github.com/primefaces/primevue/issues/3061) +- Message: Allow custom icons [\#3059](https://github.com/primefaces/primevue/issues/3059) +- Sidebar: Allow custom icons [\#3057](https://github.com/primefaces/primevue/issues/3057) +- Dialog: Allow custom icons [\#3054](https://github.com/primefaces/primevue/issues/3054) +- Chips: Allow custom icons [\#3052](https://github.com/primefaces/primevue/issues/3052) + +**Fixed bugs:** + +- PanelMenu: Can't resolve DomHandler [\#3198](https://github.com/primefaces/primevue/issues/3198) +- ContextMenu: attributes could not be automatically inherited [\#3197](https://github.com/primefaces/primevue/issues/3197) +- DataTable: the table is broken in 3.18.0 [\#3189](https://github.com/primefaces/primevue/issues/3189) +- Menubar: \#item slot is never called [\#3177](https://github.com/primefaces/primevue/issues/3177) +- OverlayPanel: Missing type defination [\#3168](https://github.com/primefaces/primevue/issues/3168) +- Tooltip: loose reactivity when the content is empty [\#3163](https://github.com/primefaces/primevue/issues/3163) +- ContextMenu | does not close when left click outside of menu [\#3158](https://github.com/primefaces/primevue/issues/3158) +- Breadcrumb: SSR Error window is not defined [\#3156](https://github.com/primefaces/primevue/issues/3156) +- Calendar | set readonly prop to readonly attribute [\#3155](https://github.com/primefaces/primevue/issues/3155) +- FileUpload: Failed to resolve the Badge and Button components [\#3154](https://github.com/primefaces/primevue/issues/3154) +- Menu.vue: seperatorClass is not a function [\#3151](https://github.com/primefaces/primevue/issues/3151) +- AutoComplete: mark text with shift+Home does not work. [\#3140](https://github.com/primefaces/primevue/issues/3140) +- Calendar in inline : Cannot read properties of undefined \(reading 'focus'\) [\#3108](https://github.com/primefaces/primevue/issues/3108) +- Can select disabled options in multiselect [\#3094](https://github.com/primefaces/primevue/issues/3094) +- Dropdown: OptionGroup disappear with filter [\#3078](https://github.com/primefaces/primevue/issues/3078) +- MultiSelect group labels disappear when filtering [\#3068](https://github.com/primefaces/primevue/issues/3068) +- Calendar: locale am & pm not work on time picker panel [\#2952](https://github.com/primefaces/primevue/issues/2952) +- ScrollPanel Bars visible with Browser Zoom [\#2137](https://github.com/primefaces/primevue/issues/2137) + +## [3.18.0](https://github.com/primefaces/primevue/tree/3.18.0) (2022-10-24) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.17.0...3.18.0) + +**Implemented New Features and Enhancements:** + +- Update primeicons dependency on build [\#3139](https://github.com/primefaces/primevue/issues/3139) +- Improve MegaMenu implementation for Accessibility [\#3125](https://github.com/primefaces/primevue/issues/3125) +- FileUpload: Templating for advance upload [\#3111](https://github.com/primefaces/primevue/issues/3111) +- Paginator: Responsive breakpoints [\#3110](https://github.com/primefaces/primevue/issues/3110) +- Improve TieredMenu implementation for Accessibility [\#3100](https://github.com/primefaces/primevue/issues/3100) +- Improve PanelMenu implementation for Accessibility [\#3099](https://github.com/primefaces/primevue/issues/3099) +- Improve Dock implementation for Accessibility [\#3092](https://github.com/primefaces/primevue/issues/3092) +- Improve Menu implementation for Accessibility [\#3085](https://github.com/primefaces/primevue/issues/3085) +- InputNumber : pass formattedValue to input event [\#3047](https://github.com/primefaces/primevue/issues/3047) +- Improve TabMenu implementation for Accessibility [\#3043](https://github.com/primefaces/primevue/issues/3043) +- Improve Steps implementation for Accessibility [\#3026](https://github.com/primefaces/primevue/issues/3026) +- Improve ContextMenu implementation for Accessibility [\#3021](https://github.com/primefaces/primevue/issues/3021) +- Improve Menubar implementation for Accessibility [\#3020](https://github.com/primefaces/primevue/issues/3020) +- CascadeSelect: input-text class [\#3013](https://github.com/primefaces/primevue/issues/3013) +- Multiselect: Allow custom icons [\#3008](https://github.com/primefaces/primevue/issues/3008) +- Listbox: Allow custom icons [\#3006](https://github.com/primefaces/primevue/issues/3006) +- AutoComplete: Allow custom icons [\#3004](https://github.com/primefaces/primevue/issues/3004) +- Update PrimeIcons v6.0.1 [\#3003](https://github.com/primefaces/primevue/issues/3003) +- CascadeSelect: Allow custom icons [\#3000](https://github.com/primefaces/primevue/issues/3000) +- Dropdown: Allow custom icons [\#2998](https://github.com/primefaces/primevue/issues/2998) +- Improve Breadcrumb implementation for Accessibility [\#2977](https://github.com/primefaces/primevue/issues/2977) +- FileUpload | new `content` slot [\#2974](https://github.com/primefaces/primevue/issues/2974) + +**Fixed bugs:** + +- Speeddial items visible even if MenuItem object property "visible" is false [\#3131](https://github.com/primefaces/primevue/issues/3131) +- Tree: Missing types for tree node [\#3106](https://github.com/primefaces/primevue/issues/3106) +- InputNumber: support highlight on focus property [\#3067](https://github.com/primefaces/primevue/issues/3067) +- Toast z-index is removed before toast animation is done [\#3050](https://github.com/primefaces/primevue/issues/3050) +- Calendar: keyboard support bug when there is a disable date next to the focused date [\#3032](https://github.com/primefaces/primevue/issues/3032) +- Dropdown: Long list causes the page to have a long scroll bar [\#3031](https://github.com/primefaces/primevue/issues/3031) +- Galleria: Using touch to move to the next image will allow to go further than the last image [\#3028](https://github.com/primefaces/primevue/issues/3028) +- InputText: Floating label with placeholder [\#3018](https://github.com/primefaces/primevue/issues/3018) +- Ripple: not properly destroyed cases [\#3015](https://github.com/primefaces/primevue/issues/3015) +- ToggleButton: focus-visible not triggered by keyboard navigation [\#2997](https://github.com/primefaces/primevue/issues/2997) +- Calendar| overlay not visible on second click unless user clicks away first [\#2990](https://github.com/primefaces/primevue/issues/2990) +- TabView: Next button is not disabled when all the tabs are visible [\#2987](https://github.com/primefaces/primevue/issues/2987) +- Password: disabled property not working [\#2958](https://github.com/primefaces/primevue/issues/2958) +- MultiSelect: Scroll to focused item on select [\#2957](https://github.com/primefaces/primevue/issues/2957) +- Toast: Close button resizes on longer text [\#2949](https://github.com/primefaces/primevue/issues/2949) + +## [3.17.0](https://github.com/primefaces/primevue/tree/3.17.0) (2022-09-08) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.16.2...3.17.0) + +**Implemented New Features and Enhancements:** + +- Add prettier to standardize formatting [\#2939](https://github.com/primefaces/primevue/issues/2939) +- Carousel: Navigators and indicators control props [\#2928](https://github.com/primefaces/primevue/issues/2928) +- Password | missing `required` property [\#2921](https://github.com/primefaces/primevue/issues/2921) +- Improve ScrollPanel implementation for Accessibility [\#2920](https://github.com/primefaces/primevue/issues/2920) +- Improve focus method to Components [\#2918](https://github.com/primefaces/primevue/issues/2918) +- Add `autoFilterFocus` property to Dropdown and MultiSelect [\#2916](https://github.com/primefaces/primevue/issues/2916) +- Improve Splitter implementation for Accessibility [\#2913](https://github.com/primefaces/primevue/issues/2913) +- New `iconClass` property for Button component [\#2911](https://github.com/primefaces/primevue/issues/2911) +- Improve Toolbar implementation for Accessibility [\#2909](https://github.com/primefaces/primevue/issues/2909) +- Improve Panel implementation for Accessibility [\#2908](https://github.com/primefaces/primevue/issues/2908) +- Improve Fieldset implementation for Accessibility [\#2907](https://github.com/primefaces/primevue/issues/2907) +- Improve Divider implementation for Accessibility [\#2906](https://github.com/primefaces/primevue/issues/2906) +- Improve Deferred Content implementation for Accessibility [\#2905](https://github.com/primefaces/primevue/issues/2905) +- Improve Card implementation for Accessibility [\#2904](https://github.com/primefaces/primevue/issues/2904) +- Add `selectOnFocus` property to Overlay components [\#2902](https://github.com/primefaces/primevue/issues/2902) +- Improve TabView implementation for Accessibility [\#2896](https://github.com/primefaces/primevue/issues/2896) +- Improve Accordion implementation for Accessibility [\#2895](https://github.com/primefaces/primevue/issues/2895) +- Dropdown: Prevent show of overlay when pressing meta key [\#2886](https://github.com/primefaces/primevue/issues/2886) +- ConfirmDialog : Add support for "Message" slot template, similar to ConfirmPopup [\#2884](https://github.com/primefaces/primevue/issues/2884) +- Add resetFilterOnHide property to Dropdown [\#2846](https://github.com/primefaces/primevue/issues/2846) +- Add icon templating to Rating [\#2834](https://github.com/primefaces/primevue/issues/2834) +- Add `modules` property to Editor [\#2498](https://github.com/primefaces/primevue/issues/2498) + +**Fixed bugs:** + +- Calendar | input disabled does not work [\#2935](https://github.com/primefaces/primevue/issues/2935) +- Update for props typing in .vue files [\#2926](https://github.com/primefaces/primevue/issues/2926) +- Textarea: resize height when window resized if autoResize is true [\#2919](https://github.com/primefaces/primevue/issues/2919) +- Tooltip: add type/empty check for its value [\#2903](https://github.com/primefaces/primevue/issues/2903) +- MultiSelect: filtering causes labels of currently selected values to display "null" [\#2901](https://github.com/primefaces/primevue/issues/2901) +- The type of inputProps prop requires every possible attribute for HTMLInputElement type [\#2891](https://github.com/primefaces/primevue/issues/2891) +- SpeedDial: Cannot use Scoped Slot to customize items [\#2889](https://github.com/primefaces/primevue/issues/2889) +- Password: When its value is dynamically set, the strength indicator is not updated [\#2885](https://github.com/primefaces/primevue/issues/2885) +- AutoComplete: setTimeout\(\) in hide-function sometimes causes NULL-Pointer Exception [\#2881](https://github.com/primefaces/primevue/issues/2881) +- Password: Unable to add invalid event listener after 3.16 [\#2880](https://github.com/primefaces/primevue/issues/2880) +- Editor Quill: SSR error document is not defined [\#2842](https://github.com/primefaces/primevue/issues/2842) +- ConfirmDialog won't the reject event be triggered when closing things? [\#2821](https://github.com/primefaces/primevue/issues/2821) +- Calendar: inline calendar force scroll into viewport when disabledDates changed [\#2803](https://github.com/primefaces/primevue/issues/2803) + +## [3.16.2](https://github.com/primefaces/primevue/tree/3.16.2) (2022-08-23) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.16.1...3.16.2) + +**Fixed bugs:** + +- Dropdown: UpArrow triggers "Uncaught TypeError: this.visibleOptions.slice\(...\).findLastIndex is not a function" Firefox, Nuxt 3 [\#2872](https://github.com/primefaces/primevue/issues/2872) +- OverlayPanel: Doesn't work in SSR [\#2871](https://github.com/primefaces/primevue/issues/2871) +- Tooltip: `escape`, `disabled` and `fitContent` properties should not accept string as a value [\#2868](https://github.com/primefaces/primevue/issues/2868) +- AutoComplete: Typescript compilation error due to a typo in the t.ds definition file [\#2866](https://github.com/primefaces/primevue/issues/2866) +- InputNumber: disabled prop is not passed to input text [\#2864](https://github.com/primefaces/primevue/issues/2864) +- InputNumber: invalid 'placeholder' prop type \(TS only\) [\#2863](https://github.com/primefaces/primevue/issues/2863) +- Calendar: showOtherMonths - does not match the description in the documentation [\#2810](https://github.com/primefaces/primevue/issues/2810) +- Datatable rows are not the full width in scroll both mode [\#2622](https://github.com/primefaces/primevue/issues/2622) + +## [3.16.1](https://github.com/primefaces/primevue/tree/3.16.1) (2022-08-17) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.16.0...3.16.1) + +**Fixed bugs:** + +- Header checkbox is not styled as expected in Material themes. [\#2856](https://github.com/primefaces/primevue/issues/2856) +- Types: Missing types in PrimeVueLocaleOptions [\#2855](https://github.com/primefaces/primevue/issues/2855) +- Overlay components don't work with SSR [\#2853](https://github.com/primefaces/primevue/issues/2853) +- Editor | selection-change typing error [\#2852](https://github.com/primefaces/primevue/issues/2852) +- InputNumber : incrementButtonClass does not working [\#2850](https://github.com/primefaces/primevue/issues/2850) +- Dropdown: Cannot read properties of undefined \(reading 'replaceAll'\) [\#2848](https://github.com/primefaces/primevue/issues/2848) +- Dropdown and MultiSelect: TS2322 compilcation error [\#2845](https://github.com/primefaces/primevue/issues/2845) +- CDN Script fails [\#2844](https://github.com/primefaces/primevue/issues/2844) +- AutoComplete: completeOnFocus with keyboard navigation [\#2824](https://github.com/primefaces/primevue/issues/2824) + +## [3.16.0](https://github.com/primefaces/primevue/tree/3.16.0) (2022-08-15) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.15.0...3.16.0) + +**Breaking Changes:** + +- Accessibility for Form Components [\#2838](https://github.com/primefaces/primevue/issues/2838) +- Improve CascadeSelect implementation for Accessibility [\#2831](https://github.com/primefaces/primevue/issues/2831) +- Improve AutoComplete implementation for Accessibility [\#2822](https://github.com/primefaces/primevue/issues/2822) +- Improve Listbox implementation for Accessibility [\#2819](https://github.com/primefaces/primevue/issues/2819) +- Improve MultiSelect implementation for Accessibility [\#2814](https://github.com/primefaces/primevue/issues/2814) +- Improve Dropdown implementation for Accessibility [\#2811](https://github.com/primefaces/primevue/issues/2811) + +**Implemented New Features and Enhancements:** + +- Editor | new `selection-change` event [\#2829](https://github.com/primefaces/primevue/issues/2829) +- SelectButton | new `unselectable` property [\#2826](https://github.com/primefaces/primevue/issues/2826) +- Add tabindex property to VirtualScroller [\#2813](https://github.com/primefaces/primevue/issues/2813) +- Add new message options to PrimeVue API [\#2812](https://github.com/primefaces/primevue/issues/2812) +- New inputClass and inputStyle properties [\#2801](https://github.com/primefaces/primevue/issues/2801) +- Timeline: new item and index slot props for connector slot [\#2771](https://github.com/primefaces/primevue/issues/2771) +- Add getVirtualScrollerRef method to DataTable to access virtualScroller's reference [\#2756](https://github.com/primefaces/primevue/issues/2756) +- The scrollToIndex method doesn't work as expected [\#2755](https://github.com/primefaces/primevue/issues/2755) +- Slider: key support [\#2735](https://github.com/primefaces/primevue/issues/2735) +- Add color-scheme style to Themes [\#2730](https://github.com/primefaces/primevue/issues/2730) +- PickList: Disable show source and target buttons [\#2697](https://github.com/primefaces/primevue/issues/2697) +- Add hideOnRangeSelection property to Calendar [\#2684](https://github.com/primefaces/primevue/issues/2684) +- ConfirmDialog: closeOnEscape support [\#2675](https://github.com/primefaces/primevue/issues/2675) +- OverlayPanel's dismissable prop can't be changed dynamically [\#2540](https://github.com/primefaces/primevue/issues/2540) +- New `exportFooter` property for Exportable DataTable [\#2395](https://github.com/primefaces/primevue/issues/2395) + +**Fixed bugs:** + +- Tooltip : Displays empty value [\#2788](https://github.com/primefaces/primevue/issues/2788) +- appendTo prop TypeScript typing disallows usage of HTML elements [\#2780](https://github.com/primefaces/primevue/issues/2780) +- DataTable v3: Cannot use the editorCancelCallBack / editorSaveCallback while editing in cell mode [\#2754](https://github.com/primefaces/primevue/issues/2754) +- Dropdown: with template and no placeholder shows p-emptylabel as placeholder [\#2751](https://github.com/primefaces/primevue/issues/2751) +- Checkbox, RadioButton: should not pointer cursor when is disabled [\#2745](https://github.com/primefaces/primevue/issues/2745) +- Paginator: slot typescript error [\#2738](https://github.com/primefaces/primevue/issues/2738) +- DataTable: No onLazyLoad property in virtualScrollerOptions props [\#2729](https://github.com/primefaces/primevue/issues/2729) +- DropDown: Filter with Virtual Scroll does not work as expected [\#2715](https://github.com/primefaces/primevue/issues/2715) +- Component: Type error for InputNumber's class [\#2712](https://github.com/primefaces/primevue/issues/2712) +- Calendar: Incorrect TypeScript typing of date slot [\#2703](https://github.com/primefaces/primevue/issues/2703) +- Dynamic Dialog : style property TypeScript error [\#2699](https://github.com/primefaces/primevue/issues/2699) +- Component: Calendar @month-change returns 0-11 and 1-12 [\#2696](https://github.com/primefaces/primevue/issues/2696) +- Menu, Menubar, ContextMenu, TieredMenu: Extra spacing when no icon [\#2695](https://github.com/primefaces/primevue/issues/2695) +- Calendar: wrong overlay position [\#2689](https://github.com/primefaces/primevue/issues/2689) +- Splitter: mobile resize fails [\#2513](https://github.com/primefaces/primevue/issues/2513) +- Carousel autoplay not working with static data [\#2356](https://github.com/primefaces/primevue/issues/2356) + +## [3.15.0](https://github.com/primefaces/primevue/tree/3.15.0) (2022-06-15) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.13.1...3.15.0) + +**Implemented New Features and Enhancements:** + +- Avatar | New error event [\#2670](https://github.com/primefaces/primevue/issues/2670) +- MultiSelect | resetFilterOnHide property [\#2664](https://github.com/primefaces/primevue/issues/2664) +- Add after-hide event to Dialog [\#2662](https://github.com/primefaces/primevue/issues/2662) +- New Image error event [\#2661](https://github.com/primefaces/primevue/issues/2661) +- New Component: DynamicDialog [\#2653](https://github.com/primefaces/primevue/issues/2653) + +**Fixed bugs:** + +- Dialog bottom has no border radius when footer does not exist [\#2673](https://github.com/primefaces/primevue/issues/2673) +- ColorPicker: inline mode doesn't work [\#2656](https://github.com/primefaces/primevue/issues/2656) +- Tooltip: ZIndex is cleared on wrong element [\#2649](https://github.com/primefaces/primevue/issues/2649) +- DataTable: when using v-model:selection the checkbox appears checked when the table has no items [\#2637](https://github.com/primefaces/primevue/issues/2637) +- DTHeaderCheckbox: browser displays the "pointer" cursor when disabled [\#2635](https://github.com/primefaces/primevue/issues/2635) +- DataTable: Header columns and row columns doesn't resize together with Virtual Scroller and resizable columns [\#2630](https://github.com/primefaces/primevue/issues/2630) + +## [3.13.1](https://github.com/primefaces/primevue/tree/3.13.1) (2022-06-07) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.13.0...3.13.1) + +**Fixed bugs:** + +- Script: CDN Script Fail [\#2642](https://github.com/primefaces/primevue/issues/2642) + +## [3.13.0](https://github.com/primefaces/primevue/tree/3.13.0) (2022-06-06) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.12.6...3.13.0) + +**Implemented New Features and Enhancements:** + +- DataTable | new 'p-reorderable-column' class and reorderable columns cursor update [\#2620](https://github.com/primefaces/primevue/issues/2620) +- Add a param to the show\(\) method to focus Dropdown component [\#2619](https://github.com/primefaces/primevue/issues/2619) +- The overlay elements automatically close on mobile devices [\#2618](https://github.com/primefaces/primevue/issues/2618) +- Add Nuxt3 support for components using teleport [\#2602](https://github.com/primefaces/primevue/issues/2602) +- DataTable: support passing a function to the dataKey prop [\#2589](https://github.com/primefaces/primevue/issues/2589) +- Autocomplete | new loadingIcon property [\#2542](https://github.com/primefaces/primevue/issues/2542) +- Tooltip new fitContent property [\#2536](https://github.com/primefaces/primevue/issues/2536) +- Arrow for OverlayPanel doesn't have borders in Lara Light Blue theme [\#2390](https://github.com/primefaces/primevue/issues/2390) +- 'tab' key support on Input Number [\#1518](https://github.com/primefaces/primevue/issues/1518) + +**Fixed bugs:** + +- The maxSelectedLabels props is not working with 0 value on MultiSelect [\#2617](https://github.com/primefaces/primevue/issues/2617) +- Calendar | Could not edit end date with time picker properly [\#2588](https://github.com/primefaces/primevue/issues/2588) +- PanelMenu animation issue [\#2583](https://github.com/primefaces/primevue/issues/2583) +- Add null types to InputText and Password [\#2576](https://github.com/primefaces/primevue/issues/2576) +- Step tabs not highlighted correctly for named routes [\#2568](https://github.com/primefaces/primevue/issues/2568) +- DataTable | column reorder is broken with hidden column [\#2562](https://github.com/primefaces/primevue/issues/2562) +- Column node declaration TypeScript error [\#2553](https://github.com/primefaces/primevue/issues/2553) +- DataTable \#loading overridden template is not always rendered [\#2547](https://github.com/primefaces/primevue/issues/2547) +- Dropdown duplicates options key [\#2545](https://github.com/primefaces/primevue/issues/2545) +- Header elements in DataTable with virtualScroller are not in the correct position on the scroll. [\#2534](https://github.com/primefaces/primevue/issues/2534) +- Sub-items in PanelMenu does not receive the `router-link-active` class [\#2528](https://github.com/primefaces/primevue/issues/2528) +- InputText and Textarea duplicating custom class\(es\) in DOM element [\#2522](https://github.com/primefaces/primevue/issues/2522) +- Carousel: Display issues when loading less items that the allocated slots [\#2516](https://github.com/primefaces/primevue/issues/2516) +- Missing invalid float label color [\#2510](https://github.com/primefaces/primevue/issues/2510) +- Calendar resize listener bug [\#2509](https://github.com/primefaces/primevue/issues/2509) +- The default severity of the InlineMessage is info, but in the code the default severity is 'error'. [\#2507](https://github.com/primefaces/primevue/issues/2507) +- \[BUG\] DataTable column reorder in wrong order [\#2225](https://github.com/primefaces/primevue/issues/2225) +- \[BUG\] Range slider cannot be set to \[min, min\] [\#2104](https://github.com/primefaces/primevue/issues/2104) + +## [3.12.6](https://github.com/primefaces/primevue/tree/3.12.5) (2022-04-27) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.12.5...3.12.6) + +**Implemented New Features and Enhancements:** + +- InputNumber new readonly attribute [\#2469](https://github.com/primefaces/primevue/issues/2469) +- New Primary Color [\#2462](https://github.com/primefaces/primevue/issues/2462) +- FileUpload | Customizable Icons [\#2401](https://github.com/primefaces/primevue/issues/2401) +- Extend TreeNode API with expandedIcon & collapsedIcon [\#2108](https://github.com/primefaces/primevue/issues/2108) +- Sidebar new header templating [\#1939](https://github.com/primefaces/primevue/issues/1939) + +**Fixed bugs:** + +- Error in console when Password component get prop "inputClass" with Object type [\#2487](https://github.com/primefaces/primevue/issues/2487) + +## [3.12.5](https://github.com/primefaces/primevue/tree/3.12.5) (2022-04-13) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.12.4...3.12.5) + +**Fixed bugs:** + +- Toast | z-index shouldn't removed when other toasts are shown [\#2434](https://github.com/primefaces/primevue/issues/2434) +- ConfirmDialog: 'position' TypeScript errors [\#2381](https://github.com/primefaces/primevue/issues/2381) +- TreeTable and DataTable | Typescript Definition Bug for global Filters [\#2378](https://github.com/primefaces/primevue/issues/2378) +- Timeline component: type TimelineVerticalAlignType lack of enum value of 'alternate' [\#2367](https://github.com/primefaces/primevue/issues/2367) +- Menu | disabled property as a function is not working with command prop [\#2365](https://github.com/primefaces/primevue/issues/2365) + +## [3.12.4](https://github.com/primefaces/primevue/tree/3.12.4) (2022-03-31) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.12.3...3.12.4) + +**Fixed bugs:** + +- StyleClass may fail to enter the element defect [\#2382](https://github.com/primefaces/primevue/issues/2382) + +## [3.12.3](https://github.com/primefaces/primevue/tree/3.12.3) (2022-03-30) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.12.2...3.12.3) + +**Implemented New Features and Enhancements:** + +- Accordion | New expandIcon and collapseIcon properties [\#2373](https://github.com/primefaces/primevue/issues/2373) +- Tooltip | Escape Support [\#2363](https://github.com/primefaces/primevue/issues/2363) +- DataView new dataKey property [\#2361](https://github.com/primefaces/primevue/issues/2361) +- Numpad comma separator support for Chips [\#2349](https://github.com/primefaces/primevue/issues/2349) + +**Fixed bugs:** + +- StyleClass may fail to enter the element [\#2371](https://github.com/primefaces/primevue/issues/2371) +- Calendar | Loses alignment when positioned at the top of the input and the user clicks in the year/month [\#2369](https://github.com/primefaces/primevue/issues/2369) +- The v-ripple directive breaks the behavior of list components in Firefox [\#2333](https://github.com/primefaces/primevue/issues/2333) +- Align overlay not working correctly in ConfirmPopup [\#2038](https://github.com/primefaces/primevue/issues/2038) + +## [3.12.2](https://github.com/primefaces/primevue/tree/3.12.2) (2022-03-16) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.12.1...3.12.2) + +**Implemented New Features and Enhancements:** + +- New DataTable editor callbacks [\#2312](https://github.com/primefaces/primevue/issues/2312) + +**Fixed bugs:** + +- Type declaration and export bug on ConfirmationService [\#2266](https://github.com/primefaces/primevue/issues/2266) +- The type declaration for global property $primevue is not woking in Vue3 [\#2315](https://github.com/primefaces/primevue/issues/2315) +- Colspan defect with hidden Columns [\#2310](https://github.com/primefaces/primevue/issues/2310) +- DataTable with edit, sort and filter options does not work as expected [\#2271](https://github.com/primefaces/primevue/issues/2271) +- InputSwitch TypeScript modelValue error [\#2262](https://github.com/primefaces/primevue/issues/2262) +- Data Table row checkboxes propagate click events leading to double-handling of row select/unselect [\#2259](https://github.com/primefaces/primevue/issues/2259) +- Pressing Enter/Return key submits form when there is a single MultiSelect and it has focus [\#2241](https://github.com/primefaces/primevue/issues/2241) +- Multiselect with Grouped Data, select all options [\#2168](https://github.com/primefaces/primevue/issues/2168) +- filterMatchMode option is ignored in MultiSelect [\#2162](https://github.com/primefaces/primevue/issues/2162) +- Range slider get stuck when both handle on max value [\#2074](https://github.com/primefaces/primevue/issues/2074) +- Bug: Tooltip shown at wrong place [\#1976](https://github.com/primefaces/primevue/issues/1976) +- FileUpload: Custom upload bug on clear list [\#1723](https://github.com/primefaces/primevue/issues/1723) + +## [3.12.1](https://github.com/primefaces/primevue/tree/3.12.1) (2022-03-02) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.12.0...3.12.1) + +**Implemented New Features and Enhancements:** + +- Added InputNumber focus and blur events [\#2235](https://github.com/primefaces/primevue/issues/2235) +- Add p-button-\* class support to SplitButton [\#2230](https://github.com/primefaces/primevue/issues/2230) +- Calendar keydown event [\#2219](https://github.com/primefaces/primevue/issues/2219) +- Calendar input value added blur event [\#2186](https://github.com/primefaces/primevue/issues/2186) +- PanelMenu keyboard navigation [\#2181](https://github.com/primefaces/primevue/issues/2181) +- Change lara to use system font [\#2180](https://github.com/primefaces/primevue/issues/2180) +- Red Color Palette [\#1944](https://github.com/primefaces/primevue/issues/1944) + +**Fixed bugs:** + +- Galleria containerStyle and containerClass TypeScript error [\#2245](https://github.com/primefaces/primevue/issues/2245) +- Material Calendar | Disabled Calendar getting opacity twice [\#2239](https://github.com/primefaces/primevue/issues/2239) +- DataView DataViewLayoutType TypeScript error [\#2228](https://github.com/primefaces/primevue/issues/2228) +- Material DataTable extension border typo fix [\#2227](https://github.com/primefaces/primevue/issues/2227) +- Inline calendar adds autofocus [\#2212](https://github.com/primefaces/primevue/issues/2212) +- Bug on Dark Themes related with fixed columns [\#2210](https://github.com/primefaces/primevue/issues/2210) +- Lara Light Blue | Primary Button Hover is not Changing [\#2209](https://github.com/primefaces/primevue/issues/2209) +- DataTableFilterMeta TypeScript error [\#2196](https://github.com/primefaces/primevue/issues/2196) +- Toast: add missing 'top-right' ToastPositionType causing Typescript compilation errors [\#2176](https://github.com/primefaces/primevue/issues/2176) +- \[BUG\] Advanced FileUploader in Dialog in IOS [\#2167](https://github.com/primefaces/primevue/issues/2167) +- DataTable row-select and row-unselect index is always undefined [\#2068](https://github.com/primefaces/primevue/issues/2068) +- Dropdown search don't work with Gboard [\#1389](https://github.com/primefaces/primevue/issues/1389) + +## [3.12.0](https://github.com/primefaces/primevue/tree/3.12.0) (2022-02-15) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.11.0...3.12.0) + +**Implemented New Features and Enhancements:** + +- New Calendar focus and blur events [\#2160](https://github.com/primefaces/primevue/issues/2160) +- Calendar | hide timepicker on month/year select [\#2156](https://github.com/primefaces/primevue/issues/2156) +- New stripedRows property for OrderList and PickList [\#2154](https://github.com/primefaces/primevue/issues/2154) +- New input event for Calendar [\#2152](https://github.com/primefaces/primevue/issues/2152) +- MultiSelect | Filter autocomplete attribute support [\#2145](https://github.com/primefaces/primevue/issues/2145) +- Custom Table CSV Export Headers [\#2141](https://github.com/primefaces/primevue/issues/2141) +- Knob | replace surface letters with new surface variables [\#2132](https://github.com/primefaces/primevue/issues/2132) +- Replace surface letters with new surface variables [\#2129](https://github.com/primefaces/primevue/issues/2129) + +**Fixed bugs:** + +- Scrollable TabView forwardIsDisabled defect [\#2169](https://github.com/primefaces/primevue/issues/2169) +- Lara scrollable Tabview highlight defect [\#2165](https://github.com/primefaces/primevue/issues/2165) +- MultiSelect virtual scroll with selected item [\#2158](https://github.com/primefaces/primevue/issues/2158) +- TreeTable Typescript - 'checkbox' missing in TreeTableSelectionModeType [\#2148](https://github.com/primefaces/primevue/issues/2148) +- FullCalendar | Bootstrap background highlight is wrong [\#2143](https://github.com/primefaces/primevue/issues/2143) +- Wrong property name "col" in Treetable/FooterCell [\#2134](https://github.com/primefaces/primevue/issues/2134) +- Multiple SplitterPanels created using v-for directive [\#2120](https://github.com/primefaces/primevue/issues/2120) +- Dropdown virtual scroll and lazy load dropdown with selected item [\#2114](https://github.com/primefaces/primevue/issues/2114) +- Incomplete prop types specified in Column [\#2097](https://github.com/primefaces/primevue/issues/2097) +- OrganizationChart: "value" property improperly defined as "OrganizationChartNode\[\]" in OrganizationChartProps [\#2069](https://github.com/primefaces/primevue/issues/2069) +- ConfirmDialog: 'defaultFocus' property missing from ConfirmationOptions.d.ts, causing TypeScript errors [\#2058](https://github.com/primefaces/primevue/issues/2058) + +## [3.11.1](https://github.com/primefaces/primevue/tree/3.11.1) (2022-01-31) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.11.0...3.11.1) + +**Implemented New Features and Enhancements:** + +- Update themes for datatable list shadow style [\#2025](https://github.com/primefaces/primevue/issues/2025) + +**Fixed bugs:** + +- contentStyle defect on VirtualScroller [\#2064](https://github.com/primefaces/primevue/issues/2064) +- Sidebar: ripple appears in the wrong place [\#2039](https://github.com/primefaces/primevue/issues/2039) +- tailwind theme - wrong styles [\#2023](https://github.com/primefaces/primevue/issues/2023) +- TreeTable | More than 2 Frozen Columns not Compatible with Table Scroll [\#2019](https://github.com/primefaces/primevue/issues/2019) +- TreeTable | ColResize Expand Mode not Compatible with Table Scroll and Frozen [\#1989](https://github.com/primefaces/primevue/issues/1989) +- DataTable Dynamic Row defect [\#1932](https://github.com/primefaces/primevue/issues/1932) + +## [3.11.0](https://github.com/primefaces/primevue/tree/3.11.0) (2022-01-18) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.10.0...3.11.0) + +**Implemented New Features and Enhancements:** + +- Move PrimeFlex v2 Docs to Github [\#2017](https://github.com/primefaces/primevue/issues/2017) +- Update themes for list shadow style [\#2008](https://github.com/primefaces/primevue/issues/2008) +- Improve resizable structure on DataTable [\#2001](https://github.com/primefaces/primevue/issues/2001) +- PrimeFlex 3 update for PrimeVue showcase [\#1977](https://github.com/primefaces/primevue/issues/1977) +- Dialog: close button cannot receive focus [\#1975](https://github.com/primefaces/primevue/issues/1975) +- New Color Scheme for Lara Dark [\#1919](https://github.com/primefaces/primevue/issues/1919) +- Templating for SplitButton [\#1795](https://github.com/primefaces/primevue/issues/1795) + +**Fixed bugs:** + +- Tooltip import defect [\#2013](https://github.com/primefaces/primevue/issues/2013) +- Tree node toggler button is shrunk until not visible if label starts to not fit the node [\#2011](https://github.com/primefaces/primevue/issues/2011) +- DataTable | Footer is not align when resize mode is enable [\#2003](https://github.com/primefaces/primevue/issues/2003) +- Dropdown doesn't display empty string [\#1995](https://github.com/primefaces/primevue/issues/1995) +- Tag doesn't show icon when slot is used instead of "value" attribute [\#1993](https://github.com/primefaces/primevue/issues/1993) +- Dropdown | filled background problem [\#1980](https://github.com/primefaces/primevue/issues/1980) +- DataTable | ColResize Expand Mode not Compatible with Table Scroll [\#1970](https://github.com/primefaces/primevue/issues/1970) +- DataTable, TreeTable | Checkbox and RadioButton Focus Missing on Material [\#1967](https://github.com/primefaces/primevue/issues/1967) +- Datatable: Inline filterMenuStyle doesn't add css properties [\#1966](https://github.com/primefaces/primevue/issues/1966) +- Update type checking for class properties [\#1959](https://github.com/primefaces/primevue/issues/1959) +- Cannot dynamically set Toast severity [\#1955](https://github.com/primefaces/primevue/issues/1955) +- tooltip type error in SpeedDial.d.ts and Dock.d.ts [\#1945](https://github.com/primefaces/primevue/issues/1945) +- Type definition for 'header' slot missing in TabPanel component [\#1943](https://github.com/primefaces/primevue/issues/1943) +- Calendar: the Year is incorrect for Multiple Months mode [\#1942](https://github.com/primefaces/primevue/issues/1942) +- DataTable: sticky column header doesn't stay fixed [\#1938](https://github.com/primefaces/primevue/issues/1938) +- MenuItem: type of `to` should be `RouteLocationRaw` [\#1933](https://github.com/primefaces/primevue/issues/1933) +- Calendar: the Year is incorrect for Multiple Months mode [\#1924](https://github.com/primefaces/primevue/issues/1924) +- Error while dynamic remove SplitterPanel component. [\#1914](https://github.com/primefaces/primevue/issues/1914) +- DataTable - Paginator doesn't reset on Lazy sort [\#1905](https://github.com/primefaces/primevue/issues/1905) +- header option is missing from confirmoption [\#1902](https://github.com/primefaces/primevue/issues/1902) +- ConfirmationService: require is not defined [\#1897](https://github.com/primefaces/primevue/issues/1897) +- Toast: Production Typescript Build Error: Type detail [\#1856](https://github.com/primefaces/primevue/issues/1856) +- Missing props in ConfirmationOptions.d.ts [\#1852](https://github.com/primefaces/primevue/issues/1852) + +## [3.10.0](https://github.com/primefaces/primevue/tree/3.10.0) (2021-12-07) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.7.0...3.10.0) + +**Implemented New Features and Enhancements:** + +- Calendar | Escape Support For Month and Year Picker [\#1847](https://github.com/primefaces/primevue/issues/1847) +- Add data param to exportCSV method on DataTable [\#1845](https://github.com/primefaces/primevue/issues/1845) +- Improve VirtualScroller implementation for Data components [\#1844](https://github.com/primefaces/primevue/issues/1844) +- Add virtualScroller feature to DataTable [\#1843](https://github.com/primefaces/primevue/issues/1843) +- DataTable component does not work correctly "Checkbox selection" together with "lazy" [\#1841](https://github.com/primefaces/primevue/issues/1841) +- Provide chartjs object when Chart component is totally instantiated [\#1840](https://github.com/primefaces/primevue/issues/1840) +- Improve TypeScript Definitions on all components [\#1836](https://github.com/primefaces/primevue/issues/1836) + +**Fixed bugs:** + +- Calendar | Year Picker and Month Picker empty when using Range and Multiple options [\#1848](https://github.com/primefaces/primevue/issues/1848) +- Calendar manual input doesn't work [\#1825](https://github.com/primefaces/primevue/issues/1825) +- PanelMenu does not use unique IDs [\#1791](https://github.com/primefaces/primevue/issues/1791) + +**Deprecated:** + +- Deprecate keepInvalid of Calendar [\#1849](https://github.com/primefaces/primevue/issues/1849) + +## [3.9.1](https://github.com/primefaces/primevue/tree/3.9.1) (2021-11-18) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.9.0...3.9.1) + +**Breaking Changes:** + +- Rename slots for toolbar [\#1761](https://github.com/primefaces/primevue/issues/1761) + +## [3.9.0](https://github.com/primefaces/primevue/tree/3.9.0) (2021-11-18) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.8.1...3.9.0) + +**Implemented New Features and Enhancements:** + +- Improve table row reorder highlight [\#1777](https://github.com/primefaces/primevue/issues/1777) +- PickList slots before and after the buttons [\#1758](https://github.com/primefaces/primevue/issues/1758) +- OrderList slots before and after the buttons [\#1757](https://github.com/primefaces/primevue/issues/1757) +- Add responsiveOptions property to Calendar [\#1750](https://github.com/primefaces/primevue/issues/1750) +- New change event for SelectButton [\#1748](https://github.com/primefaces/primevue/issues/1748) +- Year Picker for Calendar [\#1744](https://github.com/primefaces/primevue/issues/1744) +- New Lara Theme Family as the Default Theme [\#1742](https://github.com/primefaces/primevue/issues/1742) +- TreeSelect should automatically scroll to show the selected option [\#1735](https://github.com/primefaces/primevue/issues/1735) +- New rowStyle prop for DataTable [\#1734](https://github.com/primefaces/primevue/issues/1734) +- Update PrimeIcons v5.0.0 [\#1733](https://github.com/primefaces/primevue/issues/1733) +- Material | Use box-shadow for outlined Buttons [\#1729](https://github.com/primefaces/primevue/issues/1729) +- Material Focus Improvements [\#1728](https://github.com/primefaces/primevue/issues/1728) +- ColorPicker: events [\#1719](https://github.com/primefaces/primevue/issues/1719) +- Templating Support for ConfirmPopup [\#1685](https://github.com/primefaces/primevue/issues/1685) +- Default focus button should be configurable for ConfirmDialog [\#1663](https://github.com/primefaces/primevue/issues/1663) +- \[Feature Request\] Disable +- Button on InputNumber when value reach min, max [\#1621](https://github.com/primefaces/primevue/issues/1621) +- Enhanced UI for month and year picker for Calendar [\#1580](https://github.com/primefaces/primevue/issues/1580) +- Dynamic labels for Menu components [\#449](https://github.com/primefaces/primevue/issues/449) + +**Breaking Changes:** + +- Rename slot names for paginatorLeft and paginatorRight [\#1760](https://github.com/primefaces/primevue/issues/1760) +- Lowercase slot names for PickList sourceHeader-targetHeader [\#1759](https://github.com/primefaces/primevue/issues/1759) + +**Fixed bugs:** + +- Cannot select date in calendar in small viewports [\#1775](https://github.com/primefaces/primevue/issues/1775) +- Disabled not working for SelectButton [\#1773](https://github.com/primefaces/primevue/issues/1773) +- Formatting is not applied when keepInvalid is on [\#1772](https://github.com/primefaces/primevue/issues/1772) +- DataTable Focus Row Rectangle on Safari [\#1768](https://github.com/primefaces/primevue/issues/1768) +- DataTable lazy loading paginator defect [\#1766](https://github.com/primefaces/primevue/issues/1766) +- ProgressBar: color text accessibility issue [\#1752](https://github.com/primefaces/primevue/issues/1752) +- Cell editing without editor templating defect [\#1745](https://github.com/primefaces/primevue/issues/1745) +- Missing InputText events [\#1738](https://github.com/primefaces/primevue/issues/1738) +- \[Bug\] PanelMenu template prop type issue [\#1732](https://github.com/primefaces/primevue/issues/1732) +- BUG: Autocomplete \#header slot with autoHighlight option [\#1720](https://github.com/primefaces/primevue/issues/1720) +- Calendar in timeonly mode ignores minDate, maxDate [\#1716](https://github.com/primefaces/primevue/issues/1716) +- DataTable wrong TypeScript definition for row click events [\#1715](https://github.com/primefaces/primevue/issues/1715) +- Calendar manual input 1st digit does not appear [\#1713](https://github.com/primefaces/primevue/issues/1713) +- Calendar manual input not working properly [\#1712](https://github.com/primefaces/primevue/issues/1712) +- optionDisabled prop on Dropdown wrongly typed [\#1705](https://github.com/primefaces/primevue/issues/1705) +- TS Typings for TerminalService are incorrect [\#1701](https://github.com/primefaces/primevue/issues/1701) +- Panel \#icons template causes vue-tsc compile error [\#1698](https://github.com/primefaces/primevue/issues/1698) +- Cannot create dynamic ColumnGroup columns in DataTable [\#1630](https://github.com/primefaces/primevue/issues/1630) +- keyboard navigation is broken in AutoComplete with VirtualScroller [\#1597](https://github.com/primefaces/primevue/issues/1597) +- Carousel swipe function is broken on iOS devices [\#1584](https://github.com/primefaces/primevue/issues/1584) +- DataTable with selectionMode 'multiple' select with shift [\#1562](https://github.com/primefaces/primevue/issues/1562) +- bug ConfirmDialog \(async accept\reject\) [\#1454](https://github.com/primefaces/primevue/issues/1454) + +**Deprecated:** + +- Deprecated props in Calendar [\#1743](https://github.com/primefaces/primevue/issues/1743) + +## [3.8.2](https://github.com/primefaces/primevue/tree/3.8.2) (2021-10-25) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.8.1...3.8.2) + +**Implemented New Features and Enhancements:** + +- Nuxt3 integration [\#1660](https://github.com/primefaces/primevue/issues/1660) +- Update all .d.ts files for events and slots [\#1695](https://github.com/primefaces/primevue/issues/1695) +- Add tableStyle and tableClass to Table [\#1696](https://github.com/primefaces/primevue/issues/1696) +- VirtualScroll update d.ts [\#1687](https://github.com/primefaces/primevue/issues/1687) +- Dropdown should automatically scroll to show the selected option [\#1657](https://github.com/primefaces/primevue/issues/1657) +- BlockUI not working with div as child component [\#1625](https://github.com/primefaces/primevue/issues/1625) +- Accessibility issue with Accordion keyboard navigation [\#1616](https://github.com/primefaces/primevue/issues/1616) + +**Fixed bugs:** + +- Flicker on non-modal Dialogs [\#1697](https://github.com/primefaces/primevue/issues/1697) +- ToastSeverity added .d.ts [\#1690](https://github.com/primefaces/primevue/issues/1690) +- ContextMenu "template" prop type error [\#1688](https://github.com/primefaces/primevue/issues/1688) +- Dragging a Dialog breaks "maximize" feature [\#1684](https://github.com/primefaces/primevue/issues/1684) +- MegaMenu templating not work [\#1679](https://github.com/primefaces/primevue/issues/1679) +- Wrong TypeScript-types for InputText component [\#1674](https://github.com/primefaces/primevue/issues/1674) +- inputNumber class prop type defect [\#1661](https://github.com/primefaces/primevue/issues/1661) +- Menubar templating error [\#1526](https://github.com/primefaces/primevue/issues/1526) + +## [3.8.1](https://github.com/primefaces/primevue/tree/3.8.1) (2021-10-13) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.8.0...3.8.1) + +**Implemented New Features and Enhancements:** + +- Script tag with CDN samples [\#1662](https://github.com/primefaces/primevue/issues/1662) +- disabled props for Inplace [\#1651](https://github.com/primefaces/primevue/issues/1651) + +**Fixed bugs:** + +- Menu Model icon defect for Dock [\#1658](https://github.com/primefaces/primevue/issues/1658) +- Ripple added Dock [\#1652](https://github.com/primefaces/primevue/issues/1652) +- Kebab-case properties are not working on DataTable and TreeTable [\#1646](https://github.com/primefaces/primevue/issues/1646) +- The virtualscroller component is missing in core.min.js [\#1642](https://github.com/primefaces/primevue/issues/1642) +- VirtualScroller.scrollToIndex programming error [\#1610](https://github.com/primefaces/primevue/issues/1610) + +## [3.8.0](https://github.com/primefaces/primevue/tree/3.8.0) (2021-10-05) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.7.2...3.8.0) + +**Breaking Changes:** + +- Support for Filtering and Sorting on Editable DataTable [\#1273](https://github.com/primefaces/primevue/issues/1273) + +**Implemented New Features and Enhancements:** + +- Kebab-case is not supported in some components like DataTable [\#1263](https://github.com/primefaces/primevue/issues/1263) +- Improve sorting performance on DataTable [\#1633](https://github.com/primefaces/primevue/issues/1633) +- Improve accessibility on Editable DataTable [\#1632](https://github.com/primefaces/primevue/issues/1632) +- Add type definition for Utils modules [\#1622](https://github.com/primefaces/primevue/issues/1622) +- Improve scrollbar style on BreadCrumb and TabMenu [\#1620](https://github.com/primefaces/primevue/issues/1620) +- Tailwind theme location typing mistake in Setup docs [\#1614](https://github.com/primefaces/primevue/issues/1614) +- Add class option to Tooltip directive [\#1612](https://github.com/primefaces/primevue/issues/1612) + +**Fixed bugs:** + +- Tiered Menu with Templating throw 'type check failed for prop "template" [\#1638](https://github.com/primefaces/primevue/issues/1638) +- The editingRows property is not working with initial value on DataTable [\#1631](https://github.com/primefaces/primevue/issues/1631) +- The DataTable.d.ts file is missing the 'expansion' field in the $slots class field. [\#1629](https://github.com/primefaces/primevue/issues/1629) +- Paginator's Inputnumber displays index instead of current page [\#1602](https://github.com/primefaces/primevue/issues/1602) +- Vite build with Typescript Module '"vue"' has no exported member 'PluginFunction'. in `ConfirmationService.d.ts` and `ToastService.d.ts` [\#1596](https://github.com/primefaces/primevue/issues/1596) +- InputSwitch - trueValue-falseValue features causes warning [\#1586](https://github.com/primefaces/primevue/issues/1586) +- SpeedDial :hideOnClickOutside="false" is not working [\#1545](https://github.com/primefaces/primevue/issues/1545) + +## [3.7.2](https://github.com/primefaces/primevue/tree/3.7.2) (2021-09-15) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.7.1...3.7.2) + +**Implemented New Features and Enhancements:** + +- Incorrect Sizing due to filter input width of dropdown [\#1519](https://github.com/primefaces/primevue/issues/1519) +- Tooltip: word wrap [\#1512](https://github.com/primefaces/primevue/issues/1512) +- Add getFormatter method to InputNumber [\#1509](https://github.com/primefaces/primevue/issues/1509) +- \[Feature Request\] Add autoHighlight property to AutoComplete [\#1362](https://github.com/primefaces/primevue/issues/1362) + +**Fixed bugs:** + +- InputNumber: setting "min" to anything greater than 0 implies "required" [\#1542](https://github.com/primefaces/primevue/issues/1542) +- BlockUI doesn't get rid of div [\#1537](https://github.com/primefaces/primevue/issues/1537) +- PanelMenu subItems 'to' route configuration breaks menu rendering [\#1536](https://github.com/primefaces/primevue/issues/1536) +- Checkbox causes layout issues when used inside an overflow: auto div [\#1534](https://github.com/primefaces/primevue/issues/1534) +- DataTable - The showClearButton literally doesn't do anything [\#1532](https://github.com/primefaces/primevue/issues/1532) +- DataTable - RowGrouping Breaks Filter Row Column Widths [\#1531](https://github.com/primefaces/primevue/issues/1531) +- Overlay panel hide when clicking on a label inside of it [\#1528](https://github.com/primefaces/primevue/issues/1528) +- Thumbnails are not displayed correctly on Galleria if numVisible is greater than the length of value [\#1523](https://github.com/primefaces/primevue/issues/1523) +- InputNumber: issues with decimal separator for some locales, 0s are added to input [\#1522](https://github.com/primefaces/primevue/issues/1522) +- DataTable doesn't work as expected when the container is resized. [\#1521](https://github.com/primefaces/primevue/issues/1521) +- Extra space between Dropdown and filter list [\#1520](https://github.com/primefaces/primevue/issues/1520) +- Dropdown with filter bug selecting with arrow keys [\#1516](https://github.com/primefaces/primevue/issues/1516) +- Negative sign in front of number is not possible for Finnish or Swedish locale [\#1515](https://github.com/primefaces/primevue/issues/1515) +- Input number caret issue with negatives [\#1513](https://github.com/primefaces/primevue/issues/1513) +- Tooltip: crash when empty\null [\#1511](https://github.com/primefaces/primevue/issues/1511) +- inputnumber : both prefix and currency Input error [\#1510](https://github.com/primefaces/primevue/issues/1510) +- DataTable: Dialog and table problem \(column expansion\) [\#1508](https://github.com/primefaces/primevue/issues/1508) +- DataTable State broken with resizableColumns [\#1505](https://github.com/primefaces/primevue/issues/1505) + +## [3.7.1](https://github.com/primefaces/primevue/tree/3.7.1) (2021-09-06) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.7.0...3.7.1) + +**Implemented New Features and Enhancements:** + +- Add allowEmpty property to InputNumber [\#1502](https://github.com/primefaces/primevue/issues/1502) +- Tailwind Theme [\#1500](https://github.com/primefaces/primevue/issues/1500) + +**Fixed bugs:** + +- Dropdown scrolls top after reopened [\#1501](https://github.com/primefaces/primevue/issues/1501) +- When inputnumber has fractionDigits and suffix, a number cannot be entered into it. [\#1498](https://github.com/primefaces/primevue/issues/1498) +- filterMatchMode option is ignored in Dropdown [\#1496](https://github.com/primefaces/primevue/issues/1496) + +## [3.7.0](https://github.com/primefaces/primevue/tree/3.7.0) (2021-09-01) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.6.4...3.7.0) + +**Implemented New Features and Enhancements:** + +- Change button/maskClassName properties with button/maskClass properties on SpeedDial [\#1495](https://github.com/primefaces/primevue/issues/1495) +- Modal layer enter-leave transition [\#1491](https://github.com/primefaces/primevue/issues/1491) +- Add tooltipOptions property to Dock [\#1490](https://github.com/primefaces/primevue/issues/1490) +- Add tooltipOptions property to SpeedDial [\#1489](https://github.com/primefaces/primevue/issues/1489) +- activeIndex for TabMenu [\#1488](https://github.com/primefaces/primevue/issues/1488) +- Improve responsive behavior of TabView component [\#1486](https://github.com/primefaces/primevue/issues/1486) +- Add appendTo property to Dialog [\#1483](https://github.com/primefaces/primevue/issues/1483) +- start and end slots for MegaMenu, remove default slot [\#1482](https://github.com/primefaces/primevue/issues/1482) +- Image Component [\#1481](https://github.com/primefaces/primevue/issues/1481) +- Add keepInvalid property to Calendar [\#1477](https://github.com/primefaces/primevue/issues/1477) +- Add input event Checkbox [\#1471](https://github.com/primefaces/primevue/issues/1471) +- Add trueValue-falseValue to InputSwitch [\#1470](https://github.com/primefaces/primevue/issues/1470) +- Dropdown, MultiSelect, CascadeSelect, TreeSelect slot for indicator [\#1459](https://github.com/primefaces/primevue/issues/1459) +- Add maxSelectedLabels, selectedItemsLabel and selectAll properties to MultiSelect [\#1455](https://github.com/primefaces/primevue/issues/1455) +- VirtualScroller for Select Components [\#1451](https://github.com/primefaces/primevue/issues/1451) +- Set Paginator Page from InputNumber [\#1447](https://github.com/primefaces/primevue/issues/1447) +- Scrollable Tabs [\#1446](https://github.com/primefaces/primevue/issues/1446) +- InputNumber behaves odd when trying to insert fracitonal digits [\#1441](https://github.com/primefaces/primevue/issues/1441) +- \[feature request\]Please add event while menu/overlay is dismissed. [\#1428](https://github.com/primefaces/primevue/issues/1428) +- Make Dock component mobile friendly [\#1398](https://github.com/primefaces/primevue/issues/1398) +- Checkbox true-value / false-value does not work [\#1320](https://github.com/primefaces/primevue/issues/1320) +- MenuModel - disabled should be a function to support dynamic behavior [\#1293](https://github.com/primefaces/primevue/issues/1293) +- Add router-link-active and router-link-active-exact to menu components [\#1275](https://github.com/primefaces/primevue/issues/1275) +- Add input event for InputSwitch [\#1234](https://github.com/primefaces/primevue/issues/1234) +- Vite support for FullCalendar [\#1211](https://github.com/primefaces/primevue/issues/1211) +- Constants for Toast severities [\#1187](https://github.com/primefaces/primevue/issues/1187) +- InputNumber - Ability to add or remove fraction digits when min-fraction-digits is not set [\#1136](https://github.com/primefaces/primevue/issues/1136) + +**Fixed bugs:** + +- The maskStyle property doesn't work as expected in SpeedDial [\#1494](https://github.com/primefaces/primevue/issues/1494) +- DomHandler imports from wrong module path in SpeedDial component [\#1493](https://github.com/primefaces/primevue/issues/1493) +- Router support for Dock [\#1484](https://github.com/primefaces/primevue/issues/1484) +- CurrentPageReport displays wrong value [\#1475](https://github.com/primefaces/primevue/issues/1475) +- Alignment issue with multiple frozen columns on DataTable [\#1473](https://github.com/primefaces/primevue/issues/1473) +- Dropdown does not correctly handle empty label strings [\#1468](https://github.com/primefaces/primevue/issues/1468) +- Table Header Checkbox not working when lazy loading enabled [\#1467](https://github.com/primefaces/primevue/issues/1467) +- Material themes secondary text color issue [\#1465](https://github.com/primefaces/primevue/issues/1465) +- When Chart component is updated, it throws an exception [\#1463](https://github.com/primefaces/primevue/issues/1463) +- pFrozenColumn is moving when position set to left [\#1461](https://github.com/primefaces/primevue/issues/1461) +- Slotname message is unrecognized in toast template [\#1448](https://github.com/primefaces/primevue/issues/1448) +- Unnecessary horizontal scrollbar displayed with rowgrouping [\#1443](https://github.com/primefaces/primevue/issues/1443) +- Filtered Dropdown unusable on Windows Tablet [\#1411](https://github.com/primefaces/primevue/issues/1411) +- FileUpload Invalid File messages not displaying on repeat attempts [\#1399](https://github.com/primefaces/primevue/issues/1399) +- Calendar WCAG Accessibility Issue with Keyboard Navigation [\#1393](https://github.com/primefaces/primevue/issues/1393) +- Datatable date filter throws uncaught error when invalid date string is entered [\#1392](https://github.com/primefaces/primevue/issues/1392) +- Dropdown onkeydown item search not working properly [\#1390](https://github.com/primefaces/primevue/issues/1390) +- Auto ZIndex Issue with Toast and Sidebar [\#1381](https://github.com/primefaces/primevue/issues/1381) +- DataTable row group and sortable columns are not working together [\#1345](https://github.com/primefaces/primevue/issues/1345) +- input mask - mask affecting dirty state [\#1337](https://github.com/primefaces/primevue/issues/1337) +- DataTable State: columnwidths are not restored correctly when using scrollable and resizableColumns props [\#1311](https://github.com/primefaces/primevue/issues/1311) +- FullCalendar does not use option "backgroundColor" for each events [\#1119](https://github.com/primefaces/primevue/issues/1119) + +## [3.6.4](https://github.com/primefaces/primevue/tree/3.6.4) (2021-08-10) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.6.3...3.6.4) + +**Fixed bugs:** + +- Vue < 3.2 Compatibility [\#1437](https://github.com/primefaces/primevue/issues/1437) + +## [3.6.3](https://github.com/primefaces/primevue/tree/3.6.3) (2021-08-10) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.6.2...3.6.3) + +**Fixed bugs:** + +- Support for scrolling and column groups [\#1314](https://github.com/primefaces/primevue/issues/1314) +- StyleClass does not open overlay when source is clicked again [\#1436](https://github.com/primefaces/primevue/issues/1436) + +## [3.6.2](https://github.com/primefaces/primevue/tree/3.6.2) (2021-08-06) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.6.1...3.6.2) + +**Fixed bugs:** + +- Toast does not clear hide timeout on unmount [\#1415](https://github.com/primefaces/primevue/issues/1415) + +## [3.6.1](https://github.com/primefaces/primevue/tree/3.6.1) (2021-08-05) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.6.0...3.6.1) + +**Implemented New Features and Enhancements:** + +- style and class props for FileUpload [\#1407](https://github.com/primefaces/primevue/issues/1407) +- New v-styleclass directive [\#1405](https://github.com/primefaces/primevue/issues/1405) +- value and disabled props for Tooltip [\#1404](https://github.com/primefaces/primevue/issues/1404) +- New styleClass and contentStyleClass props for Toast [\#1403](https://github.com/primefaces/primevue/issues/1403) + +## [3.6.0](https://github.com/primefaces/primevue/tree/3.6.0) (2021-07-27) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.5.1...3.6.0) + +**Implemented New Features and Enhancements:** + +- New Dock Component [\#1386](https://github.com/primefaces/primevue/issues/1386) +- Gray palette for themes [\#1385](https://github.com/primefaces/primevue/issues/1385) +- New Speed Dial Component [\#1384](https://github.com/primefaces/primevue/issues/1384) +- Responsive Toast [\#1354](https://github.com/primefaces/primevue/issues/1354) +- Responsive TabMenu and Breadcrumb [\#1353](https://github.com/primefaces/primevue/issues/1353) +- Update FullCalendar to 5.7.2 [\#1351](https://github.com/primefaces/primevue/issues/1351) +- Update Chart.js to 3.3.2 [\#1348](https://github.com/primefaces/primevue/issues/1348) +- Row double click for DataTable [\#1347](https://github.com/primefaces/primevue/issues/1347) +- New SplitButton with TieredMenu [\#1313](https://github.com/primefaces/primevue/issues/1313) +- Feature Request: Templating for Toast component [\#1249](https://github.com/primefaces/primevue/issues/1249) +- Custom target for OverlayPanel [\#942](https://github.com/primefaces/primevue/issues/942) +- VirtualScroller Component [\#692](https://github.com/primefaces/primevue/issues/692) + +**Fixed bugs:** + +- Comments in ColumnGroup rows are rendered as \ elements [\#1368](https://github.com/primefaces/primevue/issues/1368) +- Overlay aligning calculation defect [\#1358](https://github.com/primefaces/primevue/issues/1358) +- DataTable cell editing regression [\#1357](https://github.com/primefaces/primevue/issues/1357) +- DataTable row group and resizable column not working together [\#1355](https://github.com/primefaces/primevue/issues/1355) +- Filtering non existing item in dropdown \[filter=true, group=true\] and pressing key down generates error [\#1342](https://github.com/primefaces/primevue/issues/1342) +- Accordion tab-open and tab-close events [\#1329](https://github.com/primefaces/primevue/issues/1329) +- Missing `class` prop on Button component fails Typescript complier [\#1319](https://github.com/primefaces/primevue/issues/1319) +- Tooltips closed on window resize after system keyboard appears on mobile devices [\#1318](https://github.com/primefaces/primevue/issues/1318) +- ProgressBar does not show zero percent [\#1272](https://github.com/primefaces/primevue/issues/1272) + +## [3.5.1](https://github.com/primefaces/primevue/tree/3.5.1) (2021-06-11) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.5.0...3.5.1) + +**Implemented New Features and Enhancements:** + +- Chip templating support for AutoComplete and MultiSelect [\#1341](https://github.com/primefaces/primevue/issues/1341) +- TreeSelect and CascadeSelect material theming improvements [\#1321](https://github.com/primefaces/primevue/issues/1321) +- Toast center positioning enhancement [\#1315](https://github.com/primefaces/primevue/issues/1315) +- Remove button in Chips template [\#1300](https://github.com/primefaces/primevue/issues/1300) +- The TreeSelect shouldn't scroll the Browser when trying to open it with the keyboard [\#1298](https://github.com/primefaces/primevue/issues/1298) + +**Fixed bugs:** + +- AccordionTab error with v-if="false" [\#1339](https://github.com/primefaces/primevue/issues/1339) +- Dynamic columns not showing in Datatable with vue 3.1.1 [\#1323](https://github.com/primefaces/primevue/issues/1323) +- Programmatic PanelMenu header link needs click twice to toggle itself [\#1310](https://github.com/primefaces/primevue/issues/1310) +- Datatable event @value-change return undefined when filtering [\#1308](https://github.com/primefaces/primevue/issues/1308) +- JumpToPageDropdown are numbered from 0 instead of 1 [\#1306](https://github.com/primefaces/primevue/issues/1306) +- Upload button disable on FileUpload [\#1294](https://github.com/primefaces/primevue/issues/1294) +- DataTable slotProps.index mismatch [\#1274](https://github.com/primefaces/primevue/issues/1274) +- DataTable does not honor initial selection [\#1269](https://github.com/primefaces/primevue/issues/1269) + +## [3.5.0](https://github.com/primefaces/primevue/tree/3.5.0) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.4.0...3.5.0) + +**Implemented New Features and Enhancements:** + +- Add lazy option to TabView and Accordion [\#1268](https://github.com/primefaces/primevue/issues/1268) +- Add responsiveLayout property to TreeTable [\#1261](https://github.com/primefaces/primevue/issues/1261) +- FileUpload invalidFileTypeMessage props and upload button [\#1252](https://github.com/primefaces/primevue/issues/1252) +- Add showToggleAll to MultiSelect [\#1251](https://github.com/primefaces/primevue/issues/1251) +- Add inputStyle to PrimeVue Config [\#1246](https://github.com/primefaces/primevue/issues/1246) +- Templating for Menus [\#1244](https://github.com/primefaces/primevue/issues/1244) +- Add selectionLimit to MultiSelect [\#1239](https://github.com/primefaces/primevue/issues/1239) +- Missing documentation for menu separator [\#1217](https://github.com/primefaces/primevue/issues/1217) +- Slot support for Badge component [\#1207](https://github.com/primefaces/primevue/issues/1207) +- Support moving the item in PickList with double-click [\#1206](https://github.com/primefaces/primevue/issues/1206) +- Add metadata as web-types for better developing experience using Jetbrains Webstorm/Intellij IDEA [\#1138](https://github.com/primefaces/primevue/issues/1138) +- Add loading prop to Dropdown, Multiselect, CascadeSelect [\#1132](https://github.com/primefaces/primevue/issues/1132) +- ScrollPanel pushes content to the left in order to show scrollbar [\#1131](https://github.com/primefaces/primevue/issues/1131) +- Filter Event for Lazy Loading [\#1105](https://github.com/primefaces/primevue/issues/1105) +- Column Reorder and Toggle support for Table [\#1098](https://github.com/primefaces/primevue/issues/1098) +- Anonymous Component in vue-devtools [\#1093](https://github.com/primefaces/primevue/issues/1093) +- DataTable global filter is reset when applying other filters [\#1087](https://github.com/primefaces/primevue/issues/1087) +- Row double click for Table [\#1075](https://github.com/primefaces/primevue/issues/1075) +- Feature Request: Show active tab in TabMenu with different Route-Defintion [\#1051](https://github.com/primefaces/primevue/issues/1051) +- Resize support for Scrollable Tables [\#1018](https://github.com/primefaces/primevue/issues/1018) +- Event for file remove in FileUpload [\#1013](https://github.com/primefaces/primevue/issues/1013) +- Add vetur component data to improve developer experience [\#962](https://github.com/primefaces/primevue/issues/962) +- Possibility to define column visibility [\#956](https://github.com/primefaces/primevue/issues/956) +- Router support for PanelMenu headers [\#949](https://github.com/primefaces/primevue/issues/949) +- Customizing the line of Timeline component [\#931](https://github.com/primefaces/primevue/issues/931) +- Improve active route detection in TabMenu [\#830](https://github.com/primefaces/primevue/issues/830) +- Named routes support for Menu Components [\#594](https://github.com/primefaces/primevue/issues/594) +- Edit and Sort combination support for Table [\#508](https://github.com/primefaces/primevue/issues/508) +- Scrollable Tree [\#396](https://github.com/primefaces/primevue/issues/396) +- Ability to activate PanelMenu item declaratively or programmatically [\#367](https://github.com/primefaces/primevue/issues/367) +- AutoComplete completeOnFocus like PrimeNG [\#354](https://github.com/primefaces/primevue/issues/354) +- Scrollable TreeTable [\#338](https://github.com/primefaces/primevue/issues/338) +- Add JumpToPageDropdown to paginator template [\#247](https://github.com/primefaces/primevue/issues/247) +- New Component: GMap [\#210](https://github.com/primefaces/primevue/issues/210) +- Draggable Dialog [\#85](https://github.com/primefaces/primevue/issues/85) + +**Fixed bugs:** + +- FilterContent overlaps on frozen columns [\#1266](https://github.com/primefaces/primevue/issues/1266) +- showGridlines display 2px borders on ScrollableTable [\#1265](https://github.com/primefaces/primevue/issues/1265) +- TreeTable does not add column and style props [\#1260](https://github.com/primefaces/primevue/issues/1260) +- Filter column is not frozen [\#1259](https://github.com/primefaces/primevue/issues/1259) +- Chip - allow removable property while template is defined [\#1256](https://github.com/primefaces/primevue/issues/1256) +- Dropdown filter is incorrect when grouped and optionGroupChildren not named "items" [\#1255](https://github.com/primefaces/primevue/issues/1255) +- InputStyle and Ripple config do not work on components that are attached to body [\#1248](https://github.com/primefaces/primevue/issues/1248) +- RowGroup scroll problem on smaller screens [\#1247](https://github.com/primefaces/primevue/issues/1247) +- Calendar view property description error in documentation [\#1236](https://github.com/primefaces/primevue/issues/1236) +- FileUpload - long filename [\#1210](https://github.com/primefaces/primevue/issues/1210) +- AutoComplete forceSelection with Multiple overwrites selection [\#1205](https://github.com/primefaces/primevue/issues/1205) +- Carousel cannot render when value.length === 0 && numVisible !== numScroll [\#1201](https://github.com/primefaces/primevue/issues/1201) +- Disabled options do not get disabled [\#1192](https://github.com/primefaces/primevue/issues/1192) +- Checkbox typings insufficient [\#1191](https://github.com/primefaces/primevue/issues/1191) +- Error when hidding tab panel using v-if [\#1186](https://github.com/primefaces/primevue/issues/1186) +- Dropdown and Multiselect with filter fails in Android [\#1180](https://github.com/primefaces/primevue/issues/1180) +- DataTable state restoring seems broken for columnOrder and columnWidths [\#1178](https://github.com/primefaces/primevue/issues/1178) +- Sidebar content overflows its container [\#1175](https://github.com/primefaces/primevue/issues/1175) +- FullCalendar can't display on a hiden TabView-\> TabPanel [\#1151](https://github.com/primefaces/primevue/issues/1151) +- On Row Expansion Nested Data Table Column Headers No Longer work [\#1096](https://github.com/primefaces/primevue/issues/1096) +- Bad type for column field when fn is used [\#1078](https://github.com/primefaces/primevue/issues/1078) +- Scrollpanel - Cannot read property classList [\#1077](https://github.com/primefaces/primevue/issues/1077) +- OverlayPanel with input closes when typing on mobile [\#984](https://github.com/primefaces/primevue/issues/984) +- Decimal value for Slider step does not work [\#967](https://github.com/primefaces/primevue/issues/967) +- Chart.js gives Chart is not a contructor [\#955](https://github.com/primefaces/primevue/issues/955) +- Dropdown component does not fire focus or blur events [\#944](https://github.com/primefaces/primevue/issues/944) +- \[BUG\] FileUpload accepts any type of file despite configuring at Component Level [\#878](https://github.com/primefaces/primevue/issues/878) +- Conditonally rendering columns in DataTable with v-if is throwing error [\#719](https://github.com/primefaces/primevue/issues/719) + +## [3.4.0](https://github.com/primefaces/primevue/tree/3.4.0) (2021-04-16) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.3.5...3.4.0) + +**Implemented New Features and Enhancements:** + +- Support "self" as an appendTo target [\#1185](https://github.com/primefaces/primevue/issues/1185) +- Reimplement EventBus [\#1181](https://github.com/primefaces/primevue/issues/1181) +- Color Picker Touch Support [\#1173](https://github.com/primefaces/primevue/issues/1173) +- Customizable ZIndex Layering [\#1169](https://github.com/primefaces/primevue/issues/1169) +- \[Feature-Request\] Add "loading" prop to Buttons [\#1160](https://github.com/primefaces/primevue/issues/1160) +- New Component: TreeSelect [\#1159](https://github.com/primefaces/primevue/issues/1159) +- Allow Adding Classes to Dialog Content [\#1146](https://github.com/primefaces/primevue/issues/1146) +- Add maximize event to Dialog [\#1108](https://github.com/primefaces/primevue/issues/1108) +- Add panelClass to overlay components [\#1083](https://github.com/primefaces/primevue/issues/1083) + +**Fixed bugs:** + +- AutoComplete scroll defect at demo [\#1183](https://github.com/primefaces/primevue/issues/1183) +- primevue/config: TypeScript error due to unexported type [\#1164](https://github.com/primefaces/primevue/issues/1164) +- documentation: Wrong CSS variable name for secondary text color [\#1162](https://github.com/primefaces/primevue/issues/1162) +- Datatable - Subheader Grouping with button, button comes over the subheader [\#1158](https://github.com/primefaces/primevue/issues/1158) +- primevue/api: TypeScript compilation errors due to wrong declarations [\#1154](https://github.com/primefaces/primevue/issues/1154) +- Switching between OverlayPanels [\#1153](https://github.com/primefaces/primevue/issues/1153) +- DataTable : Selection multiple with checkbox didn't appear with filter row [\#1150](https://github.com/primefaces/primevue/issues/1150) +- DataTable: Filter Menu error [\#1133](https://github.com/primefaces/primevue/issues/1133) +- Circle shape is broken for Avatar [\#1114](https://github.com/primefaces/primevue/issues/1114) +- Animation "none" not working for Skeleton [\#1103](https://github.com/primefaces/primevue/issues/1103) +- DataTable Filter Menu insertBefore defect [\#1076](https://github.com/primefaces/primevue/issues/1076) +- Calendar showOtherMonths = false does not hide neighbour months` [\#1071](https://github.com/primefaces/primevue/issues/1071) +- Dropdown optionDisabled is not working [\#1037](https://github.com/primefaces/primevue/issues/1037) + +## [3.3.5](https://github.com/primefaces/primevue/tree/3.3.5) (2021-03-10) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.3.4...3.3.5) + +**Implemented New Features and Enhancements:** + +- \[Enhancement\] - For editor component [\#1050](https://github.com/primefaces/primevue/issues/1050) + +**Fixed bugs:** + +- Inline Calendar Teleport defect [\#1060](https://github.com/primefaces/primevue/issues/1060) +- Filter Popup window closes when clicking / choosing option in table filter menu [\#1049](https://github.com/primefaces/primevue/issues/1049) +- Date Filter Error on DataTable [\#1048](https://github.com/primefaces/primevue/issues/1048) +- DataTable "select all checkbox" and "export csv" exclude frozen rows [\#1042](https://github.com/primefaces/primevue/issues/1042) + +## [3.3.4](https://github.com/primefaces/primevue/tree/3.3.4) (2021-03-03) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.3.3...3.3.4) + +**Fixed bugs:** + +- CDN builds are broken [\#1046](https://github.com/primefaces/primevue/issues/1046) + +## [3.3.3](https://github.com/primefaces/primevue/tree/3.3.3) (2021-03-02) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.3.2...3.3.3) + +**Implemented New Features and Enhancements:** + +- Improve the interaction of nested overlays [\#1041](https://github.com/primefaces/primevue/issues/1041) +- Remove mitt event bus [\#1040](https://github.com/primefaces/primevue/issues/1040) +- Breakpoints to OverlayPanel [\#1039](https://github.com/primefaces/primevue/issues/1039) +- Migrate appendTo use Teleport [\#1028](https://github.com/primefaces/primevue/issues/1028) +- Set appendTo as body by default [\#993](https://github.com/primefaces/primevue/issues/993) + +**Fixed bugs:** + +- Galleria thumbnail animation jumps [\#1038](https://github.com/primefaces/primevue/issues/1038) +- TreeTable filter demo not working [\#1036](https://github.com/primefaces/primevue/issues/1036) +- AutoComplete component is broken [\#1033](https://github.com/primefaces/primevue/issues/1033) + +## [3.3.2](https://github.com/primefaces/primevue/tree/3.3.2) (2021-02-27) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.3.1...3.3.2) + +**Fixed bugs:** + +- Menubar, ContextMenu, TieredMenu warning [\#1029](https://github.com/primefaces/primevue/issues/1029) + +## [3.3.1](https://github.com/primefaces/primevue/tree/3.3.1) (2021-02-26) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.3.0...3.3.1) + +**Implemented New Features and Enhancements:** + +- Add showGridlines and stripedRows props to DataTable [\#1024](https://github.com/primefaces/primevue/issues/1024) +- Add responsive and breakpoint props to OrderList and PickList [\#1023](https://github.com/primefaces/primevue/issues/1023) +- New Table Responsive layout [\#1022](https://github.com/primefaces/primevue/issues/1022) +- Feature Request: Add "tab-click" to Event from TabView [\#1015](https://github.com/primefaces/primevue/issues/1015) +- Refactor surface color[\#1008](https://github.com/primefaces/primevue/issues/1008) + +**Fixed bugs:** + +- PrimeVue 3.3.0: Dropdown's select item logic is broken [\#1026](https://github.com/primefaces/primevue/issues/1026) +- DataTable error while using stateStorage with date filter [\#1020](https://github.com/primefaces/primevue/issues/1020) +- DataTable Column's header text does not align in v.3.3.0 [\#1016](https://github.com/primefaces/primevue/issues/1016) + +## [3.3.0](https://github.com/primefaces/primevue/tree/3.3.0) (2021-02-23) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.3.0-rc.1...3.3.0) + +**Implemented New Features and Enhancements:** + +- Color Palettes for Each Theme [\#1004](https://github.com/primefaces/primevue/issues/1004) +- breakpoints for Dialog and ConfirmDialog [\#992](https://github.com/primefaces/primevue/issues/992) + +**Fixed bugs:** + +- Calendar seconds are locked when min/max set [\#998](https://github.com/primefaces/primevue/issues/998) +- FileUpload callback 'Select' little adjust. [\#990](https://github.com/primefaces/primevue/issues/990) +- DataTable Column header slot does not work [\#987](https://github.com/primefaces/primevue/issues/987) + +## [3.3.0-rc.1](https://github.com/primefaces/primevue/tree/3.3.0-rc.1) (2021-02-18) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.2.4...3.3.0-rc.1) + +**Breaking Changes:** + +- Disable VirtualScroll Table [\#981](https://github.com/primefaces/primevue/issues/981) + +**Implemented New Features and Enhancements:** + +- Add Search to Showcase [\#985](https://github.com/primefaces/primevue/issues/985) +- Constants for PrimeIcons [\#982](https://github.com/primefaces/primevue/issues/982) +- Touch support for ColorPicker [\#980](https://github.com/primefaces/primevue/issues/980) +- FilterService Utility [\#979](https://github.com/primefaces/primevue/issues/979) +- AutoComplete Enhancements [\#976](https://github.com/primefaces/primevue/issues/976) +- Dropdown Enhancements [\#974](https://github.com/primefaces/primevue/issues/974) +- Listbox Enhancements [\#972](https://github.com/primefaces/primevue/issues/972) +- Reimplement DataTable Scrolling [\#960](https://github.com/primefaces/primevue/issues/960) +- Add keys to template v-for [\#959](https://github.com/primefaces/primevue/issues/959) +- Advanced Filtering for DataTable [\#718](https://github.com/primefaces/primevue/issues/718) + +**Fixed bugs:** + +- Space key support for row radio and checkbox [\#986](https://github.com/primefaces/primevue/issues/986) +- PrimeVue DataTable bug [\#977](https://github.com/primefaces/primevue/issues/977) +- ScrollTop props have wrong type definitions [\#963](https://github.com/primefaces/primevue/issues/963) +- Error when removing InputNumbers from DOM tree [\#950](https://github.com/primefaces/primevue/issues/950) + +## [3.2.4](https://github.com/primefaces/primevue/tree/3.2.4) (2021-02-10) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.2.3...3.2.4) + +**Fixed bugs:** + +- Minified iife builds are broken [\#964](https://github.com/primefaces/primevue/issues/964) + +## [3.2.3](https://github.com/primefaces/primevue/tree/3.2.3) (2021-02-10) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.2.2...3.2.3) + +**Fixed bugs:** + +- Improve TypeScript definitions [\#957](https://github.com/primefaces/primevue/issues/957) +- useToast.d.ts missing api method definitions [\#958](https://github.com/primefaces/primevue/issues/958) +- Compile Problem with Directives( Typescript and 3.2.0-rc.1) [\#877](https://github.com/primefaces/primevue/issues/877) + +## [3.2.2](https://github.com/primefaces/primevue/tree/3.2.2) (2021-02-04) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.2.1...3.2.2) + +**Fixed bugs:** + +- DataTable, exportCSV failed: TypeError: Cannot read property 'type' of undefined [\#941](https://github.com/primefaces/primevue/issues/941) +- Calendar component throws error on blur if popup is not visible [\#940](https://github.com/primefaces/primevue/issues/940) +- Optional chaining not working for TreeTable in version 3.2.1 [\#939](https://github.com/primefaces/primevue/issues/939) +- Casing error in primevue/terminalservice/package.json [\#937](https://github.com/primefaces/primevue/issues/937) + +## [3.2.1](https://github.com/primefaces/primevue/tree/3.2.1) (2021-02-03) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.2.0...3.2.1) + +**Fixed bugs:** + +- password-meter.png missing in resources/images in v3.2.0 [\#935](https://github.com/primefaces/primevue/issues/935) + +## [3.2.0](https://github.com/primefaces/primevue/tree/3.2.0) (2021-02-03) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.2.0-rc.1...3.2.0) + +**Implemented New Features and Enhancements:** + +- InputStyle and InputClass for AutoComplete, Calendar and Password [\#933](https://github.com/primefaces/primevue/issues/933) +- Reimplement password strength ui [\#932](https://github.com/primefaces/primevue/issues/932) +- Reset page on filter [\#928](https://github.com/primefaces/primevue/issues/928) +- show password feature [\#892](https://github.com/primefaces/primevue/issues/892) +- forceSelection for AutoComplete [\#872](https://github.com/primefaces/primevue/issues/872) + +**Fixed bugs:** + +- Vue 3 + TS: fix for config.globalProperties services [\#880](https://github.com/primefaces/primevue/issues/880) +- Tooltip focus fails with some input components [\#915](https://github.com/primefaces/primevue/issues/915) +- v3.2.0-rc.1 webpack babel errors with optional chaining operator [\#913](https://github.com/primefaces/primevue/issues/913) +- DataTable sort not working with boolean shorthand [\#912](https://github.com/primefaces/primevue/issues/912) +- datatable headerStyle is applied to body and footer colgroups. headerClass is not. [\#888](https://github.com/primefaces/primevue/issues/888) +- \[Bug\] Selecting all elements results in scrolling to table bottom [\#887](https://github.com/primefaces/primevue/issues/887) +- Strange behavior using context menu on Safari [\#885](https://github.com/primefaces/primevue/issues/885) + +## [3.2.0-rc.1](https://github.com/primefaces/primevue/tree/3.2.0-rc.1) (2021-01-20) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.1.2...3.2.0-rc.1) + +**Implemented New Features and Enhancements:** + +- New Lazy DataTable Demo with Remote Source [\#862](https://github.com/primefaces/primevue/issues/862) +- state-save and state-restore events for Table [\#850](https://github.com/primefaces/primevue/issues/850) +- File Upload cant disable and hide Upload & Cancel [\#821](https://github.com/primefaces/primevue/issues/821) +- Vite Compatibility [\#581](https://github.com/primefaces/primevue/issues/581) + +**Fixed bugs:** + +- Improve float label support in overlay selects [\#871](https://github.com/primefaces/primevue/issues/871) +- Sidebar Mask not being removed from DOM on close [\#869](https://github.com/primefaces/primevue/issues/869) +- "Clear" button in Calendar wrongly labeled [\#863](https://github.com/primefaces/primevue/issues/863) +- ConfirmPopup : useConfirm define target is missing in ts [\#859](https://github.com/primefaces/primevue/issues/859) +- Autocomplete crashes when "field" property is a function [\#858](https://github.com/primefaces/primevue/issues/858) +- p-button-link not visible in Material Design themes [\#852](https://github.com/primefaces/primevue/issues/852) +- Textarea autoresize does not respect its border [\#847](https://github.com/primefaces/primevue/issues/847) +- Calender monthNavigator error monthNames [\#845](https://github.com/primefaces/primevue/issues/845) +- Knob replaceAll causes issue with nuxt SSR [\#844](https://github.com/primefaces/primevue/issues/844) +- Slider incorrectly positions handle when using mixed-sign min/max [\#826](https://github.com/primefaces/primevue/issues/826) +- MenuItem: class does not apply to separator item [\#814](https://github.com/primefaces/primevue/issues/814) +- \[Bug\] Error import ScrollTop component [\#799](https://github.com/primefaces/primevue/issues/799) +- PrimeVue 3 getting started script tag example not working [\#732](https://github.com/primefaces/primevue/issues/732) + +## [3.1.2](https://github.com/primefaces/primevue/tree/3.1.2) (2021-01-13) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.1.1...3.1.2) + +**Implemented New Features and Enhancements:** + +- New Viva Theme [\#856](https://github.com/primefaces/primevue/issues/856) +- Improve invalid validation visuals on material themes [\#855](https://github.com/primefaces/primevue/issues/855) +- New Lazy DataTable Demo with Remote Source [\#841](https://github.com/primefaces/primevue/issues/841) +- Touch support for Slider [\#757](https://github.com/primefaces/primevue/issues/757) + +**Fixed bugs:** + +- primevue/useconfirm not found [\#839](https://github.com/primefaces/primevue/issues/839) +- usetoast.d.ts casing issue [\#825](https://github.com/primefaces/primevue/issues/825) +- exports files for Chip component [\#781](https://github.com/primefaces/primevue/issues/781) +- Slider has incorrect aria-\* variable values [\#775](https://github.com/primefaces/primevue/issues/775) +- Safari issue with Skeleton [\#755](https://github.com/primefaces/primevue/issues/755) + +## [3.1.1](https://github.com/primefaces/primevue/tree/3.1.1) (2020-12-10) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.10....3.1.1) + +**Fixed bugs:** + +- CascadeSelect fails with Vue 3.0.3 [\#753](https://github.com/primefaces/primevue/issues/753) + +## [3.1.0](https://github.com/primefaces/primevue/tree/3.1.0) (2020-12-10) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.0.2...3.1.0) + +**Breaking Changes:** + +- Setup Requirement [\#748](https://github.com/primefaces/primevue/issues/748) +- Remove locale from Calendar [\#747](https://github.com/primefaces/primevue/issues/747) + +**Implemented New Features and Enhancements:** + +- Implement Badge as a directive alternative [\#753](https://github.com/primefaces/primevue/issues/753) +- Chip Component [\#740](https://github.com/primefaces/primevue/issues/740) +- Close event for Message component [\#739](https://github.com/primefaces/primevue/issues/739) +- Splitter Component [\#737](https://github.com/primefaces/primevue/issues/737) +- Component for Tag [\#717](https://github.com/primefaces/primevue/issues/717) +- Locale API [\#716](https://github.com/primefaces/primevue/issues/716) +- Component for Badge [\#715](https://github.com/primefaces/primevue/issues/715) +- Dot mode for Badge [\#695](https://github.com/primefaces/primevue/issues/695) +- Knob Component [\#693](https://github.com/primefaces/primevue/issues/693) +- ScrollTop Component [\#691](https://github.com/primefaces/primevue/issues/691) +- \[FEATURE REQUEST\] - Divider/Separator Component [\#690](https://github.com/primefaces/primevue/issues/690) +- Skeleton Component [\#689](https://github.com/primefaces/primevue/issues/689) +- CascadeSelect Component [\#686](https://github.com/primefaces/primevue/issues/686) +- \[FEATURE REQUEST\] - Avatar Component [\#684](https://github.com/primefaces/primevue/issues/684) +- New ConfirmPopup Component [\#679](https://github.com/primefaces/primevue/issues/679) +- New ConfirmDialog Component [\#678](https://github.com/primefaces/primevue/issues/678) +- Update to FullCalendar 5 [\#540](https://github.com/primefaces/primevue/issues/540) + +**Fixed bugs:** + +- DataTable throws error when there are no columns [\#749](https://github.com/primefaces/primevue/issues/749) +- Textarea does not auto resize its height when created [\#733](https://github.com/primefaces/primevue/issues/733) +- Calendar navigation \(next, prev month\) inside DataTable or OverlayPanel not working [\#729](https://github.com/primefaces/primevue/issues/729) +- Keyboard support problem for AutoComplete [\#723](https://github.com/primefaces/primevue/issues/723) +- InputMask with unmask doesn't work as expected [\#714](https://github.com/primefaces/primevue/issues/714) +- display prop of MultiSelect is not documented [\#713](https://github.com/primefaces/primevue/issues/713) +- Invalid "sortField" property type in Vue and type definition files [\#681](https://github.com/primefaces/primevue/issues/681) +- TreeTable emit warns [\#750](https://github.com/primefaces/primevue/issues/750) +- Fixed use of MenuModel's "class" property in PanelMenuSub [\#746](https://github.com/primefaces/primevue/issues/746) + +## [3.0.2](https://github.com/primefaces/primevue/tree/3.0.2) (2020-11-26) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.0.1...3.0.2) + +**Implemented New Features and Enhancements:** + +- Add the 'enter' key support to InputNumber [\#675](https://github.com/primefaces/primevue/issues/675) +- Chips mode for MultiSelect [\#673](https://github.com/primefaces/primevue/issues/673) +- New Timeline Component [\#672](https://github.com/primefaces/primevue/issues/672) +- Toolbar requires slot attribute which is deprecated in Vue.js 3 [\#639](https://github.com/primefaces/primevue/issues/639) +- SelectButton should allow a mode to ensure an options is always selected [\#494](https://github.com/primefaces/primevue/issues/494) + +**Fixed bugs:** + +- SplitButton: after selecting the default command, the command menu does not close. [\#660](https://github.com/primefaces/primevue/issues/660) +- Multiselect/Dropdown: when the menu open upwards style broken [\#659](https://github.com/primefaces/primevue/issues/659) +- Autocomplete: when the menu open upwards style broken [\#658](https://github.com/primefaces/primevue/issues/658) +- DataTable global filter bug [\#655](https://github.com/primefaces/primevue/issues/655) +- Closing message and reopening it does not work [\#653](https://github.com/primefaces/primevue/issues/653) +- Password element does not inherit attributes [\#651](https://github.com/primefaces/primevue/issues/651) +- DataTable sortField allows a function, but the prop type is only a string [\#647](https://github.com/primefaces/primevue/issues/647) +- Missing .d.ts file for usetoast [\#645](https://github.com/primefaces/primevue/issues/645) +- InputNumber's onInputBlur fails when component gets destroyed [\#633](https://github.com/primefaces/primevue/issues/633) +- missing type definition for toast/useToast.js [\#630](https://github.com/primefaces/primevue/issues/630) +- Sidebar not visible on mount [\#627](https://github.com/primefaces/primevue/issues/627) +- Accordion does not support dynamic tabs [\#622](https://github.com/primefaces/primevue/issues/622) +- TabView does not support dynamic tabs [\#616](https://github.com/primefaces/primevue/issues/616) +- PrimeVue FileUpload FileLimit [\#610](https://github.com/primefaces/primevue/issues/610) +- DataTable multiple click RadioButton focus previous row [\#606](https://github.com/primefaces/primevue/issues/606) +- FileUpload Preview columns become misaligned when both image and non-image files are uploaded [\#585](https://github.com/primefaces/primevue/issues/585) +- Error with empty objects [\#556](https://github.com/primefaces/primevue/issues/556) +- OverlayPanel :before "indicator" needs dynamic placement [\#490](https://github.com/primefaces/primevue/issues/490) + +## [3.0.1](https://github.com/primefaces/primevue/tree/3.0.1) (2020-10-22) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.2.0...3.0.1) + +**Implemented New Features and Enhancements:** + +- Do not hide overlays on body scroll [\#591](https://github.com/primefaces/primevue/issues/591) +- Add inputStyle and inputClass properties to InputNumber [\#551](https://github.com/primefaces/primevue/issues/551) +- Declare events in "emits" section of every component [\#549](https://github.com/primefaces/primevue/issues/549) + +**Fixed bugs:** + +- Overriding ProgressSpinner colors doc error [\#589](https://github.com/primefaces/primevue/issues/589) +- Property "disabled" was accessed during render but is not defined on instance. [\#587](https://github.com/primefaces/primevue/issues/587) +- Dropdown inside datable using showClear causing: Cannot read property 'classList' of null [\#586](https://github.com/primefaces/primevue/issues/586) +- DataTable crashes with a "Cannot read property 'xxx' of null" for nested objects [\#555](https://github.com/primefaces/primevue/issues/555) +- pRipple works even when disabled\(etc menuitem\) [\#550](https://github.com/primefaces/primevue/issues/550) +- Website / Documentation - Fix third-party dependencies documentation [\#546](https://github.com/primefaces/primevue/issues/546) +- Menu components with web router refresh the whole page [\#536](https://github.com/primefaces/primevue/issues/536) + +## [3.0.0](https://github.com/primefaces/primevue/tree/3.0.0) (2020-10-11) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.1.0...3.0.0) + +**Implemented New Features and Enhancements:** + +- Galleria and Carousel highlight item visual improvement on PrimeOne Themes [\#545](https://github.com/primefaces/primevue/issues/545) +- Soho Theme [\#539](https://github.com/primefaces/primevue/issues/539) +- Fluent UI Theme [\#538](https://github.com/primefaces/primevue/issues/538) +- ToastService $toast is not accessible using Composition API [\#535](https://github.com/primefaces/primevue/issues/535) +- Tooltip doesn't close in scrollable containers [\#523](https://github.com/primefaces/primevue/issues/523) +- Lighter Highlight Color for PrimeOne Themes [\#520](https://github.com/primefaces/primevue/issues/520) +- Add indentation property to TreeTable [\#495](https://github.com/primefaces/primevue/issues/495) +- Accordion rounded border minor visual issue [\#384](https://github.com/primefaces/primevue/issues/384) + +**Fixed bugs:** + +- Tree selection is broken when ripple is enabled [\#543](https://github.com/primefaces/primevue/issues/543) +- Tree toggler icon hover color is wrong in bootstrap theme [\#542](https://github.com/primefaces/primevue/issues/542) +- The 'disabled' option has no effect on InputNumber [\#537](https://github.com/primefaces/primevue/issues/537) +- InputNumber cannot set value when format property is false [\#533](https://github.com/primefaces/primevue/issues/533) +- InputNumber with spinner mode throws a JS exception [\#532](https://github.com/primefaces/primevue/issues/532) +- inputNumber with numeric prefix is not working as expected [\#531](https://github.com/primefaces/primevue/issues/531) +- Problems when typing or pasting numbers into InputNumber [\#530](https://github.com/primefaces/primevue/issues/530) +- Can't close MultiSelect or Select when inside Dialog component [\#524](https://github.com/primefaces/primevue/issues/524) +- TouchUI modal gets stuck if input tabs out [\#519](https://github.com/primefaces/primevue/issues/519) +- TriStateCheckbox doesn't show correct icon when value is false when using material themes [\#517](https://github.com/primefaces/primevue/issues/517) + +## [3.0.0-rc.2](https://github.com/primefaces/primevue/tree/3.0.0-rc.2) (2020-09-29) + +[Full Changelog](https://github.com/primefaces/primevue/compare/3.0.0-rc1...3.0.0-rc.2) + +**Fixed bugs:** + +- 3.0.0-rc.1 npm package includes a node_modules [\#511](https://github.com/primefaces/primevue/issues/511) +- Dialog component VNode [\#510](https://github.com/primefaces/primevue/issues/510) + +## [3.0.0-rc.1](https://github.com/primefaces/primevue/tree/3.0.0-rc.1) (2020-09-28) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.0.9...3.0.0-rc.1) + +**Breaking Changes:** + +- Accessing column props in Slots [\#498](https://github.com/primefaces/primevue/issues/498) +- activeIndex for TabView and Accordion [\#497](https://github.com/primefaces/primevue/issues/497) + +**Implemented New Features and Enhancements:** + +- Vue 3 Compatibility [\#491](https://github.com/primefaces/primevue/issues/491) +- Improvement in behavior of components that have overlay panels in scrollable containers [\#500](https://github.com/primefaces/primevue/issues/500) +- Improve calendar tabbing behavior [\#507](https://github.com/primefaces/primevue/issues/507) +- Add input event to InputNumber [\#506](https://github.com/primefaces/primevue/issues/506) + +**Fixed bugs:** + +- Scrollable Table alignment improvement [\#482](https://github.com/primefaces/primevue/issues/482) +- Button not registered in FileUpload [\#478](https://github.com/primefaces/primevue/issues/478) +- BlockUI documentation indicates "show" event whereas the actual event is "unblock" [\#485](https://github.com/primefaces/primevue/issues/485) + +## [2.10.4](https://github.com/primefaces/primevue/tree/2.10.4) (2023-12-06) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.10.3...2.10.4) + +**Fixed bugs:** + +- v2 DataTable: Frozen column table left and right calculation defects [\#4890](https://github.com/primefaces/primevue/issues/4890) + +## [2.10.3](https://github.com/primefaces/primevue/tree/2.10.3) (2023-11-22) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.10.2...2.10.3) + +**Implemented New Features and Enhancements:** + +- v2 DataTable: Frozen column improvements [\#4795](https://github.com/primefaces/primevue/issues/4795) +- TreeTable: Add custom header for column [\#2941](https://github.com/primefaces/primevue/issues/2941) + +**Fixed bugs:** + +- OrderList: order of selection reversed when moving multiple items to top or bottom [\#4700](https://github.com/primefaces/primevue/issues/4700) +- Calendar: Crashes when Tab pressed and calendar overlay is not showing [\#4586](https://github.com/primefaces/primevue/issues/4586) +- Calendar: Months are not highlighted with selection-mode="multiple" [\#3988](https://github.com/primefaces/primevue/issues/3988) + +## [2.10.2](https://github.com/primefaces/primevue/tree/2.10.2) (2023-08-16) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.10.1...2.10.2) + +**Implemented New Features and Enhancements:** + +- Password: id props is passed to container [\#4143](https://github.com/primefaces/primevue/issues/4143) +- OverlayPanel: Backport events to v2.x [\#3733](https://github.com/primefaces/primevue/issues/3733) + +**Fixed bugs:** + +- Calendar: updateFocus called on unmounted instance [\#3962](https://github.com/primefaces/primevue/issues/3962) +- DataTable: row group header colspan doesn't span full row when table has selection column [\#3685](https://github.com/primefaces/primevue/issues/3685) +- \[2.\] Tooltip: "escape" option is always false when tooltip is updated [\#3529](https://github.com/primefaces/primevue/issues/3529) +- CascadeSelect: "TypeError: Cannot set properties of undefined \(setting 'minWidth'\)" when using appendTo=body [\#3479](https://github.com/primefaces/primevue/issues/3479) +- TabMenu: First tab is always highlighted even when selected other tabs [\#3368](https://github.com/primefaces/primevue/issues/3368) + +## [2.10.1](https://github.com/primefaces/primevue/tree/2.10.1) (2022-11-18) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.10.0...2.10.1) + +**Implemented New Features and Enhancements:** + +- PrimeFlex & PrimeIcons version update v2 [\#3291](https://github.com/primefaces/primevue/issues/3291) +- Sidebar v2: Add slot to header [\#3217](https://github.com/primefaces/primevue/issues/3217) + +**Fixed bugs:** + +- Slider v2: onDragStart\(\) -\> this.modelValue is undefined [\#3251](https://github.com/primefaces/primevue/issues/3251) +- Slider v2: range does not work [\#2986](https://github.com/primefaces/primevue/issues/2986) +- InputNumber v2: Component with Horizontal with step down disabled [\#2980](https://github.com/primefaces/primevue/issues/2980) +- Password v2: Initial value is not displayed [\#2894](https://github.com/primefaces/primevue/issues/2894) +- Textarea v2: resize height when window resized if autoResize is true [\#2919](https://github.com/primefaces/primevue/issues/2919) +- SpeedDial v2: Cannot use Scoped Slot to customize items [\#2889](https://github.com/primefaces/primevue/issues/2889) + +## [2.10.0](https://github.com/primefaces/primevue/tree/2.10.0) (2022-08-23) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.9.2...2.10.0) + +**Implemented New Features and Enhancements:** + +- Button: Bring the loading prop from primevue3 to primevue2 [\#2655](https://github.com/primefaces/primevue/issues/2655) +- Password: Missing change and blur events [\#2610](https://github.com/primefaces/primevue/issues/2610) +- v2 PrimeVue @keyup.enter event does not work on InputNumber component [\#2336](https://github.com/primefaces/primevue/issues/2336) + +**Fixed bugs:** + +- Calendar: Inconsistent @select-month values [\#2859](https://github.com/primefaces/primevue/issues/2859) +- MegaMenu subItems 'to' route ' is not working [\#2501](https://github.com/primefaces/primevue/issues/2501) +- Datatable column order state is not saved [\#2346](https://github.com/primefaces/primevue/issues/2346) +- DataTable SelectAll checkbox stay focused after deselecting [\#2329](https://github.com/primefaces/primevue/issues/2329) +- Cannot use the editorCancelCallBack / editorSaveCallback while editing in cell mode [\#2598](https://github.com/primefaces/primevue/issues/2598) +- v2 Calendar - Could not edit end date with time picker properly [\#2546](https://github.com/primefaces/primevue/issues/2546) + +## [2.9.2](https://github.com/primefaces/primevue/tree/2.9.2) (2022-04-13) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.9.1...2.9.2) + +**Implemented New Features and Enhancements:** + +- Tooltip v2 | Escape Support [\#2432](https://github.com/primefaces/primevue/issues/2432) +- Accordion v2 | New expandIcon and collapseIcon properties [\#2418](https://github.com/primefaces/primevue/issues/2418) + +**Fixed bugs:** + +- Ripple v2 directive breaks the behavior of list components in Firefox [\#2430](https://github.com/primefaces/primevue/issues/2430) +- Calendar | Loses alignment when positioned at the top of the input and the user clicks in the year/month [\#2422](https://github.com/primefaces/primevue/issues/2422) +- StyleClass v2 may fail to enter the element [\#2420](https://github.com/primefaces/primevue/issues/2420) +- Tooltip v2 shown at wrong place [\#2416](https://github.com/primefaces/primevue/issues/2416) +- Slider v2 | Range slider get stuck when both handle on max value [\#2414](https://github.com/primefaces/primevue/issues/2414) +- FileUpload v2: Custom upload bug on clear list [\#2412](https://github.com/primefaces/primevue/issues/2412) +- DataTable v2 | Colspan defect with hidden Columns [\#2410](https://github.com/primefaces/primevue/issues/2410) + +## [2.9.1](https://github.com/primefaces/primevue/tree/2.9.1) (2022-03-16) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.9.0...2.9.1) + +**Implemented New Features and Enhancements:** + +- v2 Add p-button-\* class support to SplitButton [\#2300](https://github.com/primefaces/primevue/issues/2300) +- Calendar v2 | hide timepicker on month/year select [\#2290](https://github.com/primefaces/primevue/issues/2290) +- v2 New stripedRows property for OrderList and PickList [\#2288](https://github.com/primefaces/primevue/issues/2288) +- MultiSelect v2 | Filter autocomplete attribute support [\#2286](https://github.com/primefaces/primevue/issues/2286) +- v2 Custom Table CSV Export Headers [\#2284](https://github.com/primefaces/primevue/issues/2284) +- Knob v2 | replace surface letters with new surface variables [\#2282](https://github.com/primefaces/primevue/issues/2282) +- v2 Replace surface letters with new surface variables [\#2280](https://github.com/primefaces/primevue/issues/2280) +- DataTable v2 editor templating [\#2277](https://github.com/primefaces/primevue/issues/2277) +- InputNumber v2 | Emit focus and blur events added [\#1795](https://github.com/primefaces/primevue/issues/1935) + +**Fixed bugs:** + +- v2 Dropdown search don't work with Gboard [\#2297](https://github.com/primefaces/primevue/issues/2297) +- v2 DataTable row-select and row-unselect index is always undefined [\#2295](https://github.com/primefaces/primevue/issues/2295) +- v2 Scrollable TabView forwardIsDisabled defect [\#2292](https://github.com/primefaces/primevue/issues/2292) +- Row editing does not work as expected in DataTable [\#2270](https://github.com/primefaces/primevue/issues/2270) +- v2 DataTable ColGroup in footer/header: Cannot read properties of undefined \(reading 'tag'\) [\#2163](https://github.com/primefaces/primevue/issues/2163) + +## [2.9.0](https://github.com/primefaces/primevue/tree/2.9.0) (2022-02-07) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.8.0...2.9.0) + +**Implemented New Features and Enhancements:** + +- New v2 TreeTable showGridlines property [\#2115](https://github.com/primefaces/primevue/issues/2115) +- v2 DataTable component does not work correctly "Checkbox selection" together with "lazy" [\#2109](https://github.com/primefaces/primevue/issues/2109) +- Dialog v2: close button cannot receive focus [\#2087](https://github.com/primefaces/primevue/issues/2087) +- PrimeFlex 3 update for PrimeVue 2 showcase [\#2085](https://github.com/primefaces/primevue/issues/2085) +- v2 Update themes for datatable list shadow style [\#2072](https://github.com/primefaces/primevue/issues/2072) +- v2 New Color Scheme for Lara Dark [\#2070](https://github.com/primefaces/primevue/issues/2070) +- New Dialog v2 containerStyle prop and modal leave defect [\#1957](https://github.com/primefaces/primevue/issues/1957) + +**Fixed bugs:** + +- Sidebar v2: ripple appears in the wrong place [\#2105](https://github.com/primefaces/primevue/issues/2105) +- TreeTable v2 | ColResize Expand Mode not Compatible with Table Scroll and Frozen [\#2101](https://github.com/primefaces/primevue/issues/2101) +- v2 Dropdown doesn't display empty string [\#2095](https://github.com/primefaces/primevue/issues/2095) +- v2 Tree node toggler button is shrunk until not visible if label starts to not fit the node [\#2093](https://github.com/primefaces/primevue/issues/2093) +- Tag v2 doesn't show icon when slot is used instead of "value" attribute [\#2091](https://github.com/primefaces/primevue/issues/2091) +- DataTable v2: Inline filterMenuStyle doesn't add css properties [\#2089](https://github.com/primefaces/primevue/issues/2089) +- DataTable v2 | ColResize Expand Mode not Compatible with Table Scroll [\#2080](https://github.com/primefaces/primevue/issues/2080) +- v2 DataTable, TreeTable | Checkbox and RadioButton Focus Missing on Material [\#2078](https://github.com/primefaces/primevue/issues/2078) +- Calendar v2: the Year is incorrect for Multiple Months mode [\#2076](https://github.com/primefaces/primevue/issues/2076) +- v2 Tailwind theme - wrong styles [\#2071](https://github.com/primefaces/primevue/issues/2071) +- bugfix panelMenuSub isActive bug in 2.8.0 [\#1986](https://github.com/primefaces/primevue/issues/1986) + +## [2.8.0](https://github.com/primefaces/primevue/tree/2.8.0) (2021-12-14) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.7.0...2.8.0) + +**Implemented New Features and Enhancements:** + +- Provide chartjs object v2 [\#1887](https://github.com/primefaces/primevue/issues/1887) +- Calendar v2 | Escape Support For Month and Year Picker [\#1879](https://github.com/primefaces/primevue/issues/1879) +- Constants for Toast [\#1874](https://github.com/primefaces/primevue/issues/1874) +- Constants for PrimeIcons [\#1873](https://github.com/primefaces/primevue/issues/1873) +- Add inputStyle to PrimeVue Config v2 [\#1871](https://github.com/primefaces/primevue/issues/1871) +- responsiveLayout for TreeTable v2 [\#1870](https://github.com/primefaces/primevue/issues/1870) +- Reimplemented TreeTable with new FilterService [\#1869](https://github.com/primefaces/primevue/issues/1869) +- New Utils module [\#1867](https://github.com/primefaces/primevue/issues/1867) +- New OverlayEventBus [\#1866](https://github.com/primefaces/primevue/issues/1866) +- New FilterService Utility [\#1865](https://github.com/primefaces/primevue/issues/1865) +- Reimplemented DataTable v2 [\#1864](https://github.com/primefaces/primevue/issues/1864) + +**Fixed bugs:** + +- Slider range with min/max bug [\#1882](https://github.com/primefaces/primevue/issues/1882) +- Calendar v2 | Year Picker and Month Picker empty when using Range and Multiple options [\#1880](https://github.com/primefaces/primevue/issues/1880) +- Calendar v2 manual input doesn't work [\#1878](https://github.com/primefaces/primevue/issues/1878) +- Dropdown v2 positioning issue [\#1868](https://github.com/primefaces/primevue/issues/1868) + +**Deprecated:** + +- Disable VirtualScroll DataTable v2 [\#1863](https://github.com/primefaces/primevue/issues/1863) + +## [2.7.0](https://github.com/primefaces/primevue/tree/2.7.0) (2021-11-25) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.6.0...2.7.0) + +**Implemented New Features and Enhancements:** + +- Remove mitt event bus [\#1826](https://github.com/primefaces/primevue/issues/1826) +- New calendar styple props for v2 [\#1824](https://github.com/primefaces/primevue/issues/1824) +- Dynamic labels for Menu components v2 [\#1821](https://github.com/primefaces/primevue/issues/1821) +- Update Chart to trigger on any change to object data - v2 [\#1813](https://github.com/primefaces/primevue/issues/1813) +- Vue as peer dependency [\#1812](https://github.com/primefaces/primevue/issues/1812) +- icon templating for Message v2 [\#1811](https://github.com/primefaces/primevue/issues/1811) +- PickList v2 slots before and after the buttons [\#1806](https://github.com/primefaces/primevue/issues/1806) +- OrderList v2 slots before and after the buttons [\#1805](https://github.com/primefaces/primevue/issues/1805) +- Add responsiveOptions property to Calendar v2 [\#1803](https://github.com/primefaces/primevue/issues/1803) +- Year Picker for Calendar v2 [\#1802](https://github.com/primefaces/primevue/issues/1802) +- Enhanced UI for month and year picker for Calendar v2 [\#1801](https://github.com/primefaces/primevue/issues/1801) +- Default focus button should be configurable for ConfirmDialog v2 [\#1797](https://github.com/primefaces/primevue/issues/1797) +- New rowStyle prop for DataTable v2 [\#1790](https://github.com/primefaces/primevue/issues/1790) +- Disabled buttons on InputNumber v2 when value reach min, max [\#1789](https://github.com/primefaces/primevue/issues/1789) +- Templating Support for ConfirmPopup v2 [\#1787](https://github.com/primefaces/primevue/issues/1787) +- Update PrimeIcons v5 [\#1785](https://github.com/primefaces/primevue/issues/1785) +- Update Themes and add New Lara Theme [\#1784](https://github.com/primefaces/primevue/issues/1784) + +**Fixed bugs:** + +- Carousel swipe function is broken on iOS devices v2 [\#1822](https://github.com/primefaces/primevue/issues/1822) +- Disabled not working for SelectButton v2 [\#1819](https://github.com/primefaces/primevue/issues/1819) +- Calendar in timeonly mode ignores minDate, maxDate - v2 [\#1818](https://github.com/primefaces/primevue/issues/1818) +- Fix TypeScript definitions for selects - v2 [\#1816](https://github.com/primefaces/primevue/issues/1816) +- optionDisabled wrongly typed [\#1815](https://github.com/primefaces/primevue/issues/1815) +- DataTable lazy loading paginator defect - v2 [\#1814](https://github.com/primefaces/primevue/issues/1814) +- ProgressBar: color text accessibility issue - v2 [\#1810](https://github.com/primefaces/primevue/issues/1810) +- Cell editing without editor templating defect for DataTable v2 [\#1804](https://github.com/primefaces/primevue/issues/1804) +- DataTable v2 events wrong TypeScript definitions [\#1788](https://github.com/primefaces/primevue/issues/1788) +- Panel missing icon template in d.ts [\#1786](https://github.com/primefaces/primevue/issues/1786) +- MenuModel 'to' is not working as routerlink - refreshing the whole app [\#1749](https://github.com/primefaces/primevue/issues/1749) + +**Breaking Changes:** + +- Rename slots for toolbar - v2 [\#1809](https://github.com/primefaces/primevue/issues/1809) +- Rename slot names for paginatorLeft and paginatorRight - v2 [\#1808](https://github.com/primefaces/primevue/issues/1808) +- Lowercase slot names for PickList sourceHeader-targetHeader v2 [\#1807](https://github.com/primefaces/primevue/issues/1807) + +**Deprecated:** + +- Deprecated props in Calendar v2 [\#1798](https://github.com/primefaces/primevue/issues/1798) + +## [2.6.0](https://github.com/primefaces/primevue/tree/2.6.0) (2021-09-29) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.5.1...2.6.0) + +**Implemented New Features and Enhancements:** + +- Add JumpToPageDropdown and JumpToPageInput template to Paginator v2 [\#1605](https://github.com/primefaces/primevue/issues/1605) +- Scrollable Tabs for v2 [\#1604](https://github.com/primefaces/primevue/issues/1604) +- Reimplemented InputNumber v2 [\#1600](https://github.com/primefaces/primevue/issues/1600) +- Modal layer enter-leave transition v2 [\#1599](https://github.com/primefaces/primevue/issues/1599) +- Add autoHighlight to AutoComplete v2 [\#1589](https://github.com/primefaces/primevue/issues/1589) +- function disabled for MenuModel v2 [\#1587](https://github.com/primefaces/primevue/issues/1587) +- Upgrade v2 to Gulp 4 [\#1585](https://github.com/primefaces/primevue/issues/1585) +- Add trueValue-falseValue to Checkbox v2 [\#1583](https://github.com/primefaces/primevue/issues/1583) +- Add trueValue-falseValue to InputSwitch v2 [\#1582](https://github.com/primefaces/primevue/issues/1582) +- Add router-link-active and router-link-active-exact to all menu components v2 [\#1575](https://github.com/primefaces/primevue/issues/1575) +- New Image Preview component v2 [\#1574](https://github.com/primefaces/primevue/issues/1574) +- Responsive Dock v2 [\#1568](https://github.com/primefaces/primevue/issues/1568) +- start and end slots for MegaMenu v2 [\#1566](https://github.com/primefaces/primevue/issues/1566) +- Add indicator slot [\#1565](https://github.com/primefaces/primevue/issues/1565) +- Add tooltipOptions property to Dock v2 [\#1564](https://github.com/primefaces/primevue/issues/1564) +- Add appendTo property to Dialog v2 [\#1561](https://github.com/primefaces/primevue/issues/1561) +- Add tooltipOptions property to SpeedDial v2 [\#1560](https://github.com/primefaces/primevue/issues/1560) +- new activeIndex props for TabMenu v2 [\#1553](https://github.com/primefaces/primevue/issues/1553) +- Change button/maskClassName properties with button/maskClass properties on SpeedDial v2 [\#1551](https://github.com/primefaces/primevue/issues/1551) +- Tailwind theme v2 [\#1549](https://github.com/primefaces/primevue/issues/1549) +- Dropdown v2 doesn't scroll when navigating with keyboard [\#1535](https://github.com/primefaces/primevue/issues/1535) +- Scrollable Tabs [\#364](https://github.com/primefaces/primevue/issues/364) + +**Fixed bugs:** + +- Thumbnails are not displayed correctly on Galleria if numVisible is greater than the length of value for v2 [\#1594](https://github.com/primefaces/primevue/issues/1594) +- Checkbox v2 causes layout issues when used inside an overflow: auto div [\#1593](https://github.com/primefaces/primevue/issues/1593) +- Tooltip v2 word wrap [\#1592](https://github.com/primefaces/primevue/issues/1592) +- BlockUI v2 doesn't get rid of div [\#1591](https://github.com/primefaces/primevue/issues/1591) +- extra space between Dropdown/MultiSelect and filter list [\#1590](https://github.com/primefaces/primevue/issues/1590) +- Chart update throws an exception v2 [\#1588](https://github.com/primefaces/primevue/issues/1588) +- input mask - mask affecting dirty state v2 [\#1581](https://github.com/primefaces/primevue/issues/1581) +- Filtered Dropdown for Windows Tablet [\#1577](https://github.com/primefaces/primevue/issues/1577) +- Calendar WCAG Accessibility Issue with Keyboard Navigation for v2 [\#1576](https://github.com/primefaces/primevue/issues/1576) +- Dropdown onkeydown item search [\#1570](https://github.com/primefaces/primevue/issues/1570) +- Router support for v2 Dock [\#1567](https://github.com/primefaces/primevue/issues/1567) +- FileUpload Invalid File messages [\#1563](https://github.com/primefaces/primevue/issues/1563) +- CurrentPageReport displays wrong value v2 [\#1554](https://github.com/primefaces/primevue/issues/1554) +- The maskStyle property doesn't work as expected in SpeedDial v2 [\#1552](https://github.com/primefaces/primevue/issues/1552) +- DataTable does not assign colspan correctly when working with filters [\#1456](https://github.com/primefaces/primevue/issues/1456) +- DataTable: Pagination stops working when a column filter is applied [\#1388](https://github.com/primefaces/primevue/issues/1388) +- Input components inside DataTable break when upgrading from PrimeVue 1 to PrimeVue 2 [\#1330](https://github.com/primefaces/primevue/issues/1330) + +## [2.5.1](https://github.com/primefaces/primevue/tree/2.5.1) (2021-08-10) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.5.0...2.5.1) + +**Fixed bugs:** + +- Scrollable Table alignment improvement [\#1438](https://github.com/primefaces/primevue/issues/1438) +- PrimeFlex 3 support for DataView [\#1435](https://github.com/primefaces/primevue/issues/1435) + +## [2.5.0](https://github.com/primefaces/primevue/tree/2.5.0) (2021-08-10) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.4.2...2.5.0) + +**Implemented New Features and Enhancements:** + +- Dock component v2 [\#1434](https://github.com/primefaces/primevue/issues/1434) +- Chart.js version update [\#1432](https://github.com/primefaces/primevue/issues/1432) +- Speed Dial component v2 [\#1431](https://github.com/primefaces/primevue/issues/1431) +- FullCalendar-Vue theme update [\#1430](https://github.com/primefaces/primevue/issues/1430) +- Responsive TabMenu and Breadcrumb v2 [\#1424](https://github.com/primefaces/primevue/issues/1424) +- breakpoints prop for Responsive Toast [\#1423](https://github.com/primefaces/primevue/issues/1423) +- Center positioning Toast [\#1422](https://github.com/primefaces/primevue/issues/1422) +- Templating for Toast component [\#1421](https://github.com/primefaces/primevue/issues/1421) +- v-styleclass directive for v2 [\#1417](https://github.com/primefaces/primevue/issues/1417) +- style and class props for FileUpload component [\#1416](https://github.com/primefaces/primevue/issues/1416) +- value and disabled props for Tooltip component [\#1414](https://github.com/primefaces/primevue/issues/1414) +- styleClass and contentStyleClass props for Toast component [\#1413](https://github.com/primefaces/primevue/issues/1413) +- Row double click for DataTable [\#1347](https://github.com/primefaces/primevue/issues/1347) +- CascadeSelect material theming improvements [\#1324](https://github.com/primefaces/primevue/issues/1324) + +**Fixed bugs:** + +- ProgressBar does not show 0 percent [\#1420](https://github.com/primefaces/primevue/issues/1420) +- Toast does not clear hide timeout on beforeDestroy [\#1418](https://github.com/primefaces/primevue/issues/1418) +- Accordion tab-open and tab-close events [\#1329](https://github.com/primefaces/primevue/issues/1329) + +## [2.4.2](https://github.com/primefaces/primevue/tree/2.4.2) (2021-06-07) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.4.1...2.4.2) + +**Implemented New Features and Enhancements:** + +- Chips remove button for templating [\#1307](https://github.com/primefaces/primevue/issues/1307) +- IDE support [\#1296](https://github.com/primefaces/primevue/issues/1296) +- MultiSelect selectionLimit showToggleAll [\#1288](https://github.com/primefaces/primevue/issues/1288) +- FileUpload long filename [\#1287](https://github.com/primefaces/primevue/issues/1287) +- hideIcon and showIcon for Password [\#1286](https://github.com/primefaces/primevue/issues/1286) + +**Fixed bugs:** + +- DataTable multi selection with meta key [\#1305](https://github.com/primefaces/primevue/issues/1305) +- Sidebar content overflows [\#1295](https://github.com/primefaces/primevue/issues/1295) +- FileUpload accepts any type of file [\#1291](https://github.com/primefaces/primevue/issues/1291) +- AutoComplete forceSelection with Multiple [\#1289](https://github.com/primefaces/primevue/issues/1289) +- Decimal value for Slider [\#1285](https://github.com/primefaces/primevue/issues/1285) +- Panel closes itself when typing on mobile [\#1284](https://github.com/primefaces/primevue/issues/1284) +- DataTable state restore broken for columnOrder and columnWidths [\#1283](https://github.com/primefaces/primevue/issues/1283) +- Multiselect doesn't set focus to the multiselect filter when dropdown is expanded [\#1243](https://github.com/primefaces/primevue/issues/1243) +- Error when navigating to a component including TabView with active index \> 0 [\#1221](https://github.com/primefaces/primevue/issues/1221) +- Calendar.vue property panelClass is not used. [\#1213](https://github.com/primefaces/primevue/issues/1213) +- Multiple Form Components Break Inside TabView [\#1209](https://github.com/primefaces/primevue/issues/1209) +- Primevue 2.4 TabView and Accordeon throw errow on npm build [\#1019](https://github.com/primefaces/primevue/issues/1019) + +## [2.4.1](https://github.com/primefaces/primevue/tree/2.4.1) (2021-04-22) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.4.0...2.4.1) + +**Implemented New Features and Enhancements:** + +- Reset page on filter [\#1121](https://github.com/primefaces/primevue/issues/1121) +- forceSelection for AutoComplete [\#1120](https://github.com/primefaces/primevue/issues/1120) + +**Fixed bugs:** + +- Circle shape is broken for Avatar [\#1116](https://github.com/primefaces/primevue/issues/1116) +- Animation "none" not working for Skeleton [\#1115](https://github.com/primefaces/primevue/issues/1115) +- Calendar: prop showOtherMonths = false does not hide neighbour months` dates [\#875](https://github.com/primefaces/primevue/issues/875) +- FileUpload throws error on build [\#1017](https://github.com/primefaces/primevue/issues/1017) +- autocomplete input no response [\#1010](https://github.com/primefaces/primevue/issues/1010) + +## [2.4.0](https://github.com/primefaces/primevue/tree/2.4.0) (2021-02-22) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.3.0...2.4.0) + +**Implemented New Features and Enhancements:** + +- Touch support for ColorPicker [\#1003](https://github.com/primefaces/primevue/issues/1003) +- Error when removing InputNumbers from DOM tree [\#1001](https://github.com/primefaces/primevue/issues/1001) +- FileUpload callback 'Select' little adjust. [\#1000](https://github.com/primefaces/primevue/issues/1000) +- Add activeIndex to Tabview [\#927](https://github.com/primefaces/primevue/issues/927) +- Add activeIndex to Accordion [\#924](https://github.com/primefaces/primevue/issues/924) +- Update material theming and add invalid field demo [\#920](https://github.com/primefaces/primevue/issues/920) +- Upgrade PrimeIcons 4.1.0 [\#914](https://github.com/primefaces/primevue/issues/914) +- \[FileUpload\] when :fileLimit is exceeded, Upload button should not be active [\#909](https://github.com/primefaces/primevue/issues/909) +- state-save and state-restore events for Table [\#901](https://github.com/primefaces/primevue/issues/901) +- File Upload cant disable and hide Upload & Cancel [\#897](https://github.com/primefaces/primevue/issues/897) +- New Lazy DataTable Demo with Remote Source [\#862](https://github.com/primefaces/primevue/issues/862) + +**Fixed bugs:** + +- Space key support for row radio [\#1002](https://github.com/primefaces/primevue/issues/1002) +- Calendar seconds are locked when min/max set [\#923](https://github.com/primefaces/primevue/issues/923) +- Improve float label support in overlay selects [\#907](https://github.com/primefaces/primevue/issues/907) +- Sidebar Mask not being removed from DOM on close [\#906](https://github.com/primefaces/primevue/issues/906) +- "Clear" button in Calendar wrongly labeled [\#905](https://github.com/primefaces/primevue/issues/905) +- Autocomplete crashes when "field" property is a function [\#903](https://github.com/primefaces/primevue/issues/903) +- p-button-link not visible in Material Design themes [\#902](https://github.com/primefaces/primevue/issues/902) +- Textarea autoresize does not respect its border [\#900](https://github.com/primefaces/primevue/issues/900) +- Knob replaceAll causes issue with nuxt SSR [\#898](https://github.com/primefaces/primevue/issues/898) +- \[Bug\] Error import ScrollTop component [\#896](https://github.com/primefaces/primevue/issues/896) +- MenuItem: class does not apply to separator item [\#895](https://github.com/primefaces/primevue/issues/895) +- Slider incorrectly positions handle when using mixed-sign min/max [\#893](https://github.com/primefaces/primevue/issues/893) +- Strange behavior using context menu on Safari [\#886](https://github.com/primefaces/primevue/issues/886) +- Calendar fails with prop monthNavigator = true [\#876](https://github.com/primefaces/primevue/issues/876) +- Calendar component doesn't respect dateFormat config value [\#870](https://github.com/primefaces/primevue/issues/870) +- Multiselect: selected values are not shown without placeholder [\#868](https://github.com/primefaces/primevue/issues/868) +- primevue/fieldset not found [\#860](https://github.com/primefaces/primevue/issues/860) + +## [2.3.0](https://github.com/primefaces/primevue/tree/2.3.0) (2021-01-06) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.2.3...2.3.0) + +**Breaking Changes:** + +- Remove locale from Calendar [\#824](https://github.com/primefaces/primevue/issues/824) +- Setup Requirement [\#823](https://github.com/primefaces/primevue/issues/823) + +**Implemented New Features and Enhancements:** + +- Touch support for Slider [\#757](https://github.com/primefaces/primevue/issues/757) +- Nuxt Module [\#819](https://github.com/primefaces/primevue/issues/819) +- Refactor Build [\#818](https://github.com/primefaces/primevue/issues/818) +- Locale API [\#817](https://github.com/primefaces/primevue/issues/817) +- ConfirmPopup Component [\#791](https://github.com/primefaces/primevue/issues/791) +- ConfirmDialog Component [\#790](https://github.com/primefaces/primevue/issues/790) +- Splitter Component [\#789](https://github.com/primefaces/primevue/issues/789) +- ScrollTop Component [\#788](https://github.com/primefaces/primevue/issues/788) +- Skeleton Component [\#787](https://github.com/primefaces/primevue/issues/787) +- Divider Component [\#786](https://github.com/primefaces/primevue/issues/786) +- Knob Component [\#785](https://github.com/primefaces/primevue/issues/785) +- CascadeSelect Component [\#784](https://github.com/primefaces/primevue/issues/784) +- Avatar Component [\#783](https://github.com/primefaces/primevue/issues/783) +- Badge Component [\#782](https://github.com/primefaces/primevue/issues/782) +- Tag Component [\#779](https://github.com/primefaces/primevue/issues/779) +- Chip Component [\#778](https://github.com/primefaces/primevue/issues/778) + +**Fixed bugs:** + +- Vertical Slider [\#780](https://github.com/primefaces/primevue/issues/780) + +## [2.2.3](https://github.com/primefaces/primevue/tree/2.2.3) (2020-12-14) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.2.2...2.2.3) + +**Implemented New Features and Enhancements:** + +- Chip component cosmetics [\#777](https://github.com/primefaces/primevue/issues/777) +- Update to FullCalendar 5 [\#776](https://github.com/primefaces/primevue/issues/776) +- Close event for Message component [\#761](https://github.com/primefaces/primevue/issues/761) +- Touch support for Slider [\#758](https://github.com/primefaces/primevue/issues/758) + +**Fixed bugs:** + +- Slider has incorrect aria-\* variable values [\#774](https://github.com/primefaces/primevue/issues/774) +- Invalid "sortField" property type in Vue and type definition files [\#764](https://github.com/primefaces/primevue/issues/764) +- Keyboard support problem for AutoComplete [\#763](https://github.com/primefaces/primevue/issues/763) +- Textarea does not auto resize its height when created [\#762](https://github.com/primefaces/primevue/issues/762) +- Calendar navigation \(next, prev month\) inside DataTable or OverlayPanel not working [\#759](https://github.com/primefaces/primevue/issues/759) +- Primevue 2 dismissableMask=true not working when clicking outside the modal [\#741](https://github.com/primefaces/primevue/issues/741) +- FileUpload with fileLimit problem [\#677](https://github.com/primefaces/primevue/issues/677) + +## [2.2.2](https://github.com/primefaces/primevue/tree/2.2.2) (2020-11-30) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.2.1...2.2.2) + +**Implemented New Features and Enhancements:** + +- New Timeline Component [\#712](https://github.com/primefaces/primevue/issues/712) +- Chips mode for MultiSelect [\#711](https://github.com/primefaces/primevue/issues/711) +- SelectButton should allow a mode to ensure an options is always selected [\#698](https://github.com/primefaces/primevue/issues/698) +- OverlayPanel :before "indicator" needs dynamic placement [\#697](https://github.com/primefaces/primevue/issues/697) +- Improve typescript definitions [\#696](https://github.com/primefaces/primevue/issues/696) +- Add the 'enter' key support to InputNumber [\#676](https://github.com/primefaces/primevue/issues/676) + +**Fixed bugs:** + +- SplitButton: after selecting the default command, the command menu does not close. [\#710](https://github.com/primefaces/primevue/issues/710) +- Autocomplete: when the menu open upwards style broken [\#709](https://github.com/primefaces/primevue/issues/709) +- Multiselect/Dropdown: when the menu open upwards style broken [\#708](https://github.com/primefaces/primevue/issues/708) +- DataTable global filter bug [\#707](https://github.com/primefaces/primevue/issues/707) +- InputNumber's onInputBlur fails when component gets destroyed [\#705](https://github.com/primefaces/primevue/issues/705) +- Sidebar not visible on mount [\#704](https://github.com/primefaces/primevue/issues/704) +- PrimeVue FileUpload FileLimit [\#703](https://github.com/primefaces/primevue/issues/703) +- DataTable multiple click RadioButton focus previous row [\#702](https://github.com/primefaces/primevue/issues/702) +- FileUpload Preview columns become misaligned when both image and non-image files are uploaded [\#701](https://github.com/primefaces/primevue/issues/701) +- Error with empty objects [\#700](https://github.com/primefaces/primevue/issues/700) +- ColorPicker overlay input does not reflect to hue section changes [\#699](https://github.com/primefaces/primevue/issues/699) +- Multiselect dropdown closes after selecting one option [\#602](https://github.com/primefaces/primevue/issues/602) +- PrimeVue 2 InputMask with unmask problem [\#577](https://github.com/primefaces/primevue/issues/577) + +## [2.2.1](https://github.com/primefaces/primevue/tree/2.2.1) (2020-11-23) + +**Implemented New Features and Enhancements:** + +- Do not hide overlays on body scroll [\#661](https://github.com/primefaces/primevue/issues/661) + +**Fixed bugs:** + +- Overriding ProgressSpinner colors doc error [\#662](https://github.com/primefaces/primevue/issues/662) +- Dropdown inside datable using showClear causing: Cannot read property 'classList' of null [\#664](https://github.com/primefaces/primevue/issues/664) +- DataTable crashes with a "Cannot read property 'xxx' of null" for nested objects [\#665](https://github.com/primefaces/primevue/issues/665) + +## [2.2.0](https://github.com/primefaces/primevue/tree/2.2.0) (2020-10-14) + +**Implemented New Features and Enhancements:** + +- Add inputStyle and inputClass properties to InputNumber [\#573](https://github.com/primefaces/primevue/issues/573) +- Accordion rounded border minor visual issue [\#572](https://github.com/primefaces/primevue/issues/572) +- Add indentation property to TreeTable [\#571](https://github.com/primefaces/primevue/issues/571) +- Lighter Highlight Color for PrimeOne Themes [\#568](https://github.com/primefaces/primevue/issues/568) +- Fluent UI Theme [\#561](https://github.com/primefaces/primevue/issues/561) +- Soho Theme [\#560](https://github.com/primefaces/primevue/issues/560) +- Galleria and Carousel highlight item visual improvement on PrimeOne Themes [\#557](https://github.com/primefaces/primevue/issues/557) +- Tooltip doesn't close in scrollable containers [\#526](https://github.com/primefaces/primevue/issues/526) + +**Fixed bugs:** + +- pRipple working when disabled\(etc menuitem\) [\#574](https://github.com/primefaces/primevue/issues/574) +- TriStateCheckbox doesn't show correct icon when value is false when using material themes [\#570](https://github.com/primefaces/primevue/issues/570) +- TouchUI modal gets stuck if input tabs out [\#569](https://github.com/primefaces/primevue/issues/569) +- Can't close MultiSelect or Select when inside Dialog component [\#567](https://github.com/primefaces/primevue/issues/567) +- Problems when typing or pasting numbers into InputNumber [\#566](https://github.com/primefaces/primevue/issues/566) +- inputNumber with numeric prefix is not working as expected [\#565](https://github.com/primefaces/primevue/issues/565) +- InputNumber with spinner mode throws a JS exception [\#564](https://github.com/primefaces/primevue/issues/564) +- InputNumber cannot set value when format property is false [\#563](https://github.com/primefaces/primevue/issues/563) +- The 'disabled' option has no effect on InputNumber [\#562](https://github.com/primefaces/primevue/issues/562) +- Tree toggler icon hover color is wrong in bootstrap theme [\#559](https://github.com/primefaces/primevue/issues/559) +- Tree selection is broken when ripple is enabled [\#558](https://github.com/primefaces/primevue/issues/558) + +## [2.1.0](https://github.com/primefaces/primevue/tree/2.1.0) (2020-09-29) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.0.9...2.1.0) + +**Implemented New Features and Enhancements:** + +- Improvement in behavior of components that have overlay panels in scrollable containers [\#514](https://github.com/primefaces/primevue/issues/514) +- Scrollable Table alignment improvement [\#513](https://github.com/primefaces/primevue/issues/513) +- Improve calendar tabbing behavior [\#512](https://github.com/primefaces/primevue/issues/512) + +**Fixed bugs:** + +- TouchUI modal gets stuck if input tabs out [\#518](https://github.com/primefaces/primevue/issues/518) +- Button not registered in FileUpload [\#516](https://github.com/primefaces/primevue/issues/516) +- BlockUI documentation indicates "show" event whereas the actual event is "unblock" [\#515](https://github.com/primefaces/primevue/issues/515) + +## [2.0.9](https://github.com/primefaces/primevue/tree/2.0.9) (2020-09-09) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.0.8...2.0.9) + +**Implemented New Features and Enhancements:** + +- InputGroup support for input components with wrappers [\#471](https://github.com/primefaces/primevue/issues/471) +- Update PrimeFlex documentation to 2.0.0 [\#464](https://github.com/primefaces/primevue/issues/464) +- Scrollable Table alignment improvement [\#462](https://github.com/primefaces/primevue/issues/462) +- emptyFilterMessage for Dropdown, MultiSelect and Listbox filter [\#459](https://github.com/primefaces/primevue/issues/459) +- Negative sign with InputNumber [\#458](https://github.com/primefaces/primevue/issues/458) +- InputNumber Currency not working as expected [\#330](https://github.com/primefaces/primevue/issues/330) + +**Fixed bugs:** + +- Dialog with Long Content does not scroll in IE11 [\#473](https://github.com/primefaces/primevue/issues/473) +- Click on Dropdown's filter text box closes items list [\#465](https://github.com/primefaces/primevue/issues/465) +- Calendar misplaced layout if more than one month is shown [\#461](https://github.com/primefaces/primevue/issues/461) +- inputNumber cannot set value bigger than 99.999 for an ES locale [\#460](https://github.com/primefaces/primevue/issues/460) +- Items in PanelMenu are highlighted wrongly with Material dark themes [\#456](https://github.com/primefaces/primevue/issues/456) +- InputNumber with dynamic fraction digits doesn't work as expected [\#455](https://github.com/primefaces/primevue/issues/455) + +## [2.0.8](https://github.com/primefaces/primevue/tree/2.0.8) (2020-08-27) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.0.7...2.0.8) + +**Implemented New Features and Enhancements:** + +- Add Del key support to InputNumber [\#452](https://github.com/primefaces/primevue/issues/452) +- Documentation for primeflex setup [\#434](https://github.com/primefaces/primevue/issues/434) +- InputNumber with decimals should support entering comma/decimal point [\#432](https://github.com/primefaces/primevue/issues/432) +- dismissableMask and closeOnEscape for Dialog [\#372](https://github.com/primefaces/primevue/issues/372) + +**Fixed bugs:** + +- Can't type - as first symbol into an Inputnumber [\#453](https://github.com/primefaces/primevue/issues/453) +- When autocomplete is bound to an object, float label overlaps in some circumstances [\#450](https://github.com/primefaces/primevue/issues/450) +- TreeTable template always render field value [\#445](https://github.com/primefaces/primevue/issues/445) +- Setting placeholder text for Editor / Quill component doesn't work [\#433](https://github.com/primefaces/primevue/issues/433) +- InputNumber with stacked Buttons is broken [\#431](https://github.com/primefaces/primevue/issues/431) +- Doc error on InputNumber [\#430](https://github.com/primefaces/primevue/issues/430) +- InputNumber throws error if emptied [\#429](https://github.com/primefaces/primevue/issues/429) +- Pill Text not centered [\#428](https://github.com/primefaces/primevue/issues/428) + +## [2.0.7](https://github.com/primefaces/primevue/tree/2.0.7) (2020-08-05) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.0.6...2.0.7) + +**Fixed bugs:** + +- Global filter is not working with invalid values on TreeTable [\#427](https://github.com/primefaces/primevue/issues/427) +- Global filter throws error in TreeTable[\#425](https://github.com/primefaces/primevue/issues/425) +- Duplicate keys in TreeTable [\#424](https://github.com/primefaces/primevue/issues/424) + +## [2.0.6](https://github.com/primefaces/primevue/tree/2.0.6) (2020-08-04) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.0.5...2.0.6) + +**Implemented New Features and Enhancements:** + +- Improve connected overlay positioning [\#418](https://github.com/primefaces/primevue/issues/418) +- TabMenu should include subpaths in active tab detection [\#417](https://github.com/primefaces/primevue/issues/417) +- Rename toast message title class [\#420](https://github.com/primefaces/primevue/issues/420) + +**Fixed bugs:** + +- TabMenu error when no route matches one of the menu paths [\#416](https://github.com/primefaces/primevue/issues/416) +- DataTable row reorder demo not working [\#419](https://github.com/primefaces/primevue/issues/419) +- DataTable: Exporting an empty DataTable throws TypeError [\#413](https://github.com/primefaces/primevue/issues/413) +- Duplicate keys in TreeTable [\#424](https://github.com/primefaces/primevue/issues/424) +- Fixed typo in ProgressBarDoc.vue [\#414](https://github.com/primefaces/primevue/issues/414) +- Paginator is displayed over table loading overlay [\#422](https://github.com/primefaces/primevue/issues/422) +- p-error, p-invalid styling missing on some form elements [\#421](https://github.com/primefaces/primevue/issues/421) + +## [2.0.5](https://github.com/primefaces/primevue/tree/2.0.5) (2020-07-24) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.0.4...2.0.5) + +**Implemented New Features and Enhancements:** + +- SideBar p-sidebar-mask div is not removed automatically [\#329](https://github.com/primefaces/primevue/issues/329) +- Block UI mask remove automatically [\#409](https://github.com/primefaces/primevue/issues/409) + +**Fixed bugs:** + +- Calendar mask animation [\#408](https://github.com/primefaces/primevue/issues/408) + +## [2.0.4](https://github.com/primefaces/primevue/tree/2.0.4) (2020-07-23) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.0.3...2.0.4) + +**Implemented New Features and Enhancements:** + +- MultiSelect close icon spacing issue [\#405](https://github.com/primefaces/primevue/issues/405) +- Refactor OrderList and PickList header style classes [\#403](https://github.com/primefaces/primevue/issues/403) +- Improve Dialog padding [\#404](https://github.com/primefaces/primevue/issues/404) +- Refactor selectbutton focus visuals [\#406](https://github.com/primefaces/primevue/issues/406) + +**Fixed bugs:** + +- Alignment issue on left and right contents of Toolbar [\#400](https://github.com/primefaces/primevue/issues/400) +- Remove default text-decoration style from the header links on Fieldset [\#399](https://github.com/primefaces/primevue/issues/399) + +## [2.0.3](https://github.com/primefaces/primevue/tree/2.0.3) (2020-07-18) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.0.2...2.0.3) + +**Breaking changes:** + +- Improve Toast CSS structure and Add new positions [\#391](https://github.com/primefaces/primevue/issues/391) + +**Implemented New Features and Enhancements:** + +- Add p-button-plain add-on for text button [\#398](https://github.com/primefaces/primevue/issues/398) +- Sort the icons alphabetically in the documentation [\#385](https://github.com/primefaces/primevue/issues/385) +- Button slot [\#388](https://github.com/primefaces/primevue/pull/388) +- Rename p-datatable-row to p-selectable-row [\#397](https://github.com/primefaces/primevue/issues/397) +- Cleanup FullCalendar CSS [\#392](https://github.com/primefaces/primevue/issues/392) + +**Fixed bugs:** + +- Alignment issue on tree [\#395](https://github.com/primefaces/primevue/issues/395) +- Add type="button" to buttons to avoid form submission [\#394](https://github.com/primefaces/primevue/issues/394) +- Wrong class name at FileUpload [\#390](https://github.com/primefaces/primevue/issues/390) + +## [2.0.2](https://github.com/primefaces/primevue/tree/2.0.2) (2020-07-12) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.0.1...2.0.2) + +**Implemented New Features and Enhancements:** + +- OverlayPanel padding visual problem [\#382](https://github.com/primefaces/primevue/issues/382) +- Improved active state for dark themes [\#383](https://github.com/primefaces/primevue/issues/383) + +## [2.0.1](https://github.com/primefaces/primevue/tree/2.0.1) (2020-07-10) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.0.0...2.0.1) + +**Implemented New Features and Enhancements:** + +- Ability to programmatically show or hide Dropdown/MultiSelect [\#368](https://github.com/primefaces/primevue/issues/368) +- Ability to add scaling inputs by group [\#373](https://github.com/primefaces/primevue/issues/373) +- Support for left and right icons for Input [\#379](https://github.com/primefaces/primevue/issues/379) + +**Fixed bugs:** + +- Datatable with RowGroup and Scroll scrollbar misplaced [\#380](https://github.com/primefaces/primevue/issues/380) +- InlineMessage typescript declaration is not available at package root [\#366](https://github.com/primefaces/primevue/issues/366) +- Editor readonly not working due to typo [\#369](https://github.com/primefaces/primevue/issues/369) +- Message error with Ripple [\#378](https://github.com/primefaces/primevue/issues/378) +- Separator problem with Menu [\#377](https://github.com/primefaces/primevue/issues/377) + +## [2.0.0](https://github.com/primefaces/primevue/tree/2.0.0) (2020-07-06) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.0.0-rc.3...2.0.0) + +## [2.0.0-rc.3](https://github.com/primefaces/primevue/tree/2.0.0-rc.3) (2020-07-04) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.0.0-rc.2...2.0.0-rc.3) + +**Implemented New Features and Enhancements:** + +- FileLimit for FileUpload [\#361](https://github.com/primefaces/primevue/issues/361) +- Custom Upload for FileUpload [\#360](https://github.com/primefaces/primevue/issues/360) +- Filter event for Listbox, Dropdown and MultiSelect [\#359](https://github.com/primefaces/primevue/issues/359) +- DataView should reset paginator on sort [\#356](https://github.com/primefaces/primevue/issues/356) + +**Fixed bugs:** + +- Usage of header slot produces JavaScript error when beeing combined with ColumnGroups [\#349](https://github.com/primefaces/primevue/issues/349) +- Messages are not visible in simple uploader [\#343](https://github.com/primefaces/primevue/issues/343) +- Accordion breaks input components inside [\#342](https://github.com/primefaces/primevue/issues/342) +- Picklist 'move-all-to-source' event argument e.items is empty [\#341](https://github.com/primefaces/primevue/issues/341) +- datatable filter not work in some firefox [\#325](https://github.com/primefaces/primevue/issues/325) +- DataTable : \(row\) editing + selection column - focus issues [\#315](https://github.com/primefaces/primevue/issues/315) +- Datatable scrollable mode doesn't load Loading Template [\#296](https://github.com/primefaces/primevue/issues/296) + +## [2.0.0-rc.2](https://github.com/primefaces/primevue/tree/2.0.0-rc.2) (2020-07-02) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.0.0-rc.1...2.0.0-rc.2) + +**Implemented New Features and Enhancements:** + +- Material Theme [\#363](https://github.com/primefaces/primevue/issues/363) +- Bootstrap Theme [\#362](https://github.com/primefaces/primevue/issues/362) +- Improve Galleria animation on FullScreen mode [\#346](https://github.com/primefaces/primevue/issues/346) + +**Fixed bugs:** + +- Item content in Carousel does not expand according to the wrapper element [\#348](https://github.com/primefaces/primevue/issues/348) +- InputNumber prevents min key number [\#337](https://github.com/primefaces/primevue/issues/337) + +## [2.0.0-rc.1](https://github.com/primefaces/primevue/tree/2.0.0-rc.1) (2020-05-28) + +[Full Changelog](https://github.com/primefaces/primevue/compare/2.0.0-beta.1...2.0.0-rc.1) + +**Implemented New Features and Enhancements:** + +- Disable virtual keyboard in calendar [\#334](https://github.com/primefaces/primevue/issues/334) +- Rename dialog titlebar class to dialog header [\#333](https://github.com/primefaces/primevue/issues/333) +- Flex Scroll height for DataTable [\#328](https://github.com/primefaces/primevue/issues/328) +- New Component: ScrollPanel [\#322](https://github.com/primefaces/primevue/issues/322) +- Refactor p-panel-titlebar to p-panel-header [\#321](https://github.com/primefaces/primevue/issues/321) +- Terminal should scroll to bottom after command [\#319](https://github.com/primefaces/primevue/issues/319) +- Rename Nova Themes [\#318](https://github.com/primefaces/primevue/issues/318) +- Datatable coltoggle changes columns order. [\#311](https://github.com/primefaces/primevue/issues/311) + +**Fixed bugs:** + +- Table loader is not visible in scrollable table [\#332](https://github.com/primefaces/primevue/issues/332) +- Alignment issue on Galleria with left and right thumbnail position [\#327](https://github.com/primefaces/primevue/issues/327) +- InputNumber Up Down buttons send form on submit [\#313](https://github.com/primefaces/primevue/issues/313) +- Slider handle moves on click [\#298](https://github.com/primefaces/primevue/issues/298) + +## [2.0.0-beta.1](https://github.com/primefaces/primevue/tree/2.0.0-beta.1) (2020-05-15) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.3.2...2.0.0-beta.1) + +**Implemented New Features and Enhancements:** + +- Modernize CSS [\#263](https://github.com/primefaces/primevue/issues/263) +- Responsive Menubar [\#316](https://github.com/primefaces/primevue/issues/316) +- Top and Bottom icon positioning for button [\#309](https://github.com/primefaces/primevue/issues/309) +- Badges and Tags [\#308](https://github.com/primefaces/primevue/issues/308) +- Saga and Vela Themes [\#307](https://github.com/primefaces/primevue/issues/307) +- Add link button [\#306](https://github.com/primefaces/primevue/issues/306) +- Icons inside InputText [\#305](https://github.com/primefaces/primevue/issues/305) +- Add inputId to Dropdown and MultiSelect [\#303](https://github.com/primefaces/primevue/issues/303) +- ToggleButton refactor [\#297](https://github.com/primefaces/primevue/issues/297) +- Decouple MegaMenu from PrimeFlex [\#295](https://github.com/primefaces/primevue/issues/295) + +**Breaking Changes:** + +- Remove Spinner [\#287](https://github.com/primefaces/primevue/issues/287) +- Rename ValidationMessage to InlineMessage [\#301](https://github.com/primefaces/primevue/issues/301) +- Refactor Messages css naming [\#302](https://github.com/primefaces/primevue/issues/302) + +## [1.3.2](https://github.com/primefaces/primevue/tree/1.3.2) (2020-04-24) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.3.1...1.3.2) + +**Fixed bugs:** + +- Context Menu throw error after update to 1.3.1 [\#291](https://github.com/primefaces/primevue/issues/291) +- InputMask somehow clears the initial value to empty string [\#290](https://github.com/primefaces/primevue/issues/290) + +## [1.3.1](https://github.com/primefaces/primevue/tree/1.3.1) (2020-04-23) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.3.0...1.3.1) + +**Implemented New Features and Enhancements:** + +- FilterPlaceholder for Listbox [\#284](https://github.com/primefaces/primevue/issues/284) +- Function support for MenuModel visible prop [\#286](https://github.com/primefaces/primevue/issues/286) + +**Fixed bugs:** + +- Group Header Broken without Footer Template [\#288](https://github.com/primefaces/primevue/issues/288) +- SplitButton is misaligned [\#289](https://github.com/primefaces/primevue/issues/289) + +## [1.3.0](https://github.com/primefaces/primevue/tree/1.3.0) (2020-04-20) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.1.0...1.3.0) + +**Implemented New Features and Enhancements:** + +- Add empty template to FileUpload [\#265](https://github.com/primefaces/primevue/issues/265) +- DragDrop support for FileUpload [\#262](https://github.com/primefaces/primevue/issues/262) +- Improve DataTable ContextMenu Styling [\#253](https://github.com/primefaces/primevue/issues/253) +- Separator, addOnBlur and allowDuplicate for Chips [\#252](https://github.com/primefaces/primevue/issues/252) +- Add id property to Steps [\#251](https://github.com/primefaces/primevue/issues/251) +- ReImplemented Steps styles [\#250](https://github.com/primefaces/primevue/issues/250) +- Improve autocomplete css by using flex [\#249](https://github.com/primefaces/primevue/issues/249) +- Add menubar-left and menubar-right slots to Menubar [\#246](https://github.com/primefaces/primevue/issues/246) +- New Component: Galleria [\#212](https://github.com/primefaces/primevue/issues/212) +- Ability to disable PanelMenu items [\#171](https://github.com/primefaces/primevue/issues/171) +- TreeTable should pass more information on page-sort-filter events [\#282](https://github.com/primefaces/primevue/issues/282) +- filterLocale for components with filtering [\#279](https://github.com/primefaces/primevue/issues/279) +- Update sort icons [\#278](https://github.com/primefaces/primevue/issues/278) +- Placeholder for Chips [\#277](https://github.com/primefaces/primevue/issues/277) +- New Component: InputNumber [\#275](https://github.com/primefaces/primevue/issues/275) +- Value slot for Dropdown [\#271](https://github.com/primefaces/primevue/issues/271) +- Removable sort on DataTable - TreeTable [\#235](https://github.com/primefaces/primevue/issues/235) +- Order indicators for Multi column sorting [\#189](https://github.com/primefaces/primevue/issues/189) + +**Fixed bugs:** + +- Calendar.vue: Poor handling of user input [\#70](https://github.com/primefaces/primevue/issues/70) +- Carousel - Button inside carousel-item is not clickable in mobile phones [\#264](https://github.com/primefaces/primevue/issues/264) +- Popup menu does not appear where it should [\#258](https://github.com/primefaces/primevue/issues/258) +- FileUpload Multiple: Error when deleting file before upload [\#257](https://github.com/primefaces/primevue/issues/257) +- FileUpload in auto mode sends two post requests in IE11 [\#254](https://github.com/primefaces/primevue/issues/254) +- TreeTable global filtering fails [\#283](https://github.com/primefaces/primevue/issues/283) +- Loop on treetable sort [\#281](https://github.com/primefaces/primevue/issues/281) +- Datatable Group footer doesn't work [\#276](https://github.com/primefaces/primevue/issues/276) +- Textarea with autoResize true not displayed correctly when initially hidden [\#274](https://github.com/primefaces/primevue/issues/274) +- Calendar is not empty when the v-model is null [\#270](https://github.com/primefaces/primevue/issues/270) + +## [1.2.0](https://github.com/primefaces/primevue/tree/1.2.0) (2020-04-17) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.0.6...1.1.0) + +**Implemented New Features and Enhancements:** + +- Improve autocomplete css by using flex [\#249](https://github.com/primefaces/primevue/issues/249) +- Improve DataTable ContextMenu Styling [\#253](https://github.com/primefaces/primevue/issues/253) +- DragDrop support for FileUpload [\#262](https://github.com/primefaces/primevue/issues/262) +- Add empty template to FileUpload [\#265](https://github.com/primefaces/primevue/issues/265) +- Separator, addOnBlur and allowDuplicate for Chips [\#252](https://github.com/primefaces/primevue/issues/252) +- Add menubar-left and menubar-right slots to Menubar [\#246](https://github.com/primefaces/primevue/issues/246) +- Ability to disable PanelMenu items [\#171](https://github.com/primefaces/primevue/issues/171) +- Add id property to Steps [\#251](https://github.com/primefaces/primevue/issues/251) +- ReImplemented Steps styles [\#250](https://github.com/primefaces/primevue/issues/250) +- ReImplemented Steps styles [\#250](https://github.com/primefaces/primevue/issues/250) + +**Fixed bugs:** + +- Carousel - Button inside carousel-item is not clickable in mobile phones [\#264](https://github.com/primefaces/primevue/issues/264) +- FileUpload Multiple: Error when deleting file before upload [\#257](https://github.com/primefaces/primevue/issues/257) +- Popup menu does not appear where it should [\#258](https://github.com/primefaces/primevue/issues/258) +- FileUpload in auto mode sends two post requests in IE11 [\#254](https://github.com/primefaces/primevue/issues/254) + +**Deprecated:** + +- Deprecate menubar custom slot [\#260](https://github.com/primefaces/primevue/issues/260) + +## [1.1.0](https://github.com/primefaces/primevue/tree/1.1.0) (2020-03-17) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.0.6...1.1.0) + +**Implemented New Features and Enhancements:** + +- Move column filters to their own row [\#226](https://github.com/primefaces/primevue/issues/226) +- Loading template for DataTable [\#244](https://github.com/primefaces/primevue/issues/244) +- Move TreeTable filters to their own header row [\#241](https://github.com/primefaces/primevue/issues/241) +- Add filterHeaderStyle and filterHeaderClass to Column [\#240](https://github.com/primefaces/primevue/issues/240) +- Unify placeholder colors [\#239](https://github.com/primefaces/primevue/issues/239) +- Opacity Animation for Modals [\#237](https://github.com/primefaces/primevue/issues/237) +- Remove Responsive DataTable [\#232](https://github.com/primefaces/primevue/issues/232) +- Display issues with Chips [\#231](https://github.com/primefaces/primevue/issues/231) +- More options for currentPageReportTemplate [\#230](https://github.com/primefaces/primevue/issues/230) +- New Component: Terminal [\#229](https://github.com/primefaces/primevue/issues/229) +- New Component: BlockUI [\#211](https://github.com/primefaces/primevue/issues/211) +- Ability to disable TabMenu items [\#172](https://github.com/primefaces/primevue/issues/172) +- Ability to disable MegaMenu items [\#170](https://github.com/primefaces/primevue/issues/170) + +**Fixed bugs:** + +- Disabled menuitems with routerLink integration are still functional [\#243](https://github.com/primefaces/primevue/issues/243) +- Disabled menuitems opacity is doubled in MenuBar, TieredMenu and ContextMenu [\#242](https://github.com/primefaces/primevue/issues/242) +- MultiSelect label size grows on items select [\#238](https://github.com/primefaces/primevue/issues/238) +- DataTable scrollHeight doesn't calculate correctly with frozen columns and percentages [\#234](https://github.com/primefaces/primevue/issues/234) +- Select components may throw non-primitive key error [\#233](https://github.com/primefaces/primevue/issues/233) + +## [1.0.6](https://github.com/primefaces/primevue/tree/1.0.6) (2020-03-04) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.0.5...1.0.6) + +**Implemented New Features and Enhancements:** + +- Add appendTo to components with Overlays [\#224](https://github.com/primefaces/primevue/issues/224) +- Add filterField to column [\#223](https://github.com/primefaces/primevue/issues/223) +- Accents support in Table filtering [\#220](https://github.com/primefaces/primevue/issues/220) +- Date support in table filtering [\#219](https://github.com/primefaces/primevue/issues/219) +- New filtering modes for Table [\#217](https://github.com/primefaces/primevue/issues/217) + +**Fixed bugs:** + +- CurrentPageReport is initially wrong [\#222](https://github.com/primefaces/primevue/issues/222) +- Primitive values support in Select components [\#221](https://github.com/primefaces/primevue/issues/221) +- sortField of column is ignored [\#216](https://github.com/primefaces/primevue/issues/216) +- DataTable Column Group Sort Bug [\#214](https://github.com/primefaces/primevue/issues/214) + +## [1.0.5](https://github.com/primefaces/primevue/tree/1.0.5) (2020-02-27) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.0.4...1.0.5) + +**Implemented New Features and Enhancements:** + +- Tooltip Component missing typescript declaration file [\#202](https://github.com/primefaces/primevue/issues/202) + +**Fixed bugs:** + +- Tooltip reactive text [\#206](https://github.com/primefaces/primevue/issues/206) +- Editor infinite loop with some specific values [\#204](https://github.com/primefaces/primevue/issues/204) +- DataTable \> Missing `custom` filterMatchMode [\#200](https://github.com/primefaces/primevue/issues/200) +- Top\* and Bottom\* animation are not working correctly on Dialog with 'position' property [\#190](https://github.com/primefaces/primevue/issues/190) + +## [1.0.4](https://github.com/primefaces/primevue/tree/1.0.4) (2020-02-08) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.0.3...1.0.4) + +**Fixed bugs:** + +- Dialog positions regressions [\#191](https://github.com/primefaces/primevue/issues/191) + +## [1.0.3](https://github.com/primefaces/primevue/tree/1.0.3) (2020-02-07) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.0.2...1.0.3) + +**Implemented New Features and Enhancements:** + +- Add position property to Dialog [\#184](https://github.com/primefaces/primevue/issues/184) +- Add maximizable property to Dialog [\#183](https://github.com/primefaces/primevue/issues/183) +- DataTable "$event" argument on page/sort events does not contains filterSearchMode. [\#181](https://github.com/primefaces/primevue/issues/181) +- Dialog header not visible [\#179](https://github.com/primefaces/primevue/issues/179) +- Ability to disable TieredMenu items [\#173](https://github.com/primefaces/primevue/issues/173) +- Ability to disable ContextMenu items [\#169](https://github.com/primefaces/primevue/issues/169) +- Ability to disable Menubar items [\#168](https://github.com/primefaces/primevue/issues/168) + +**Fixed bugs:** + +- Chart.vue : Error in v-on handler: "TypeError: this.emit is not a function" [\#188](https://github.com/primefaces/primevue/issues/188) +- OverlayPanel dismissable does not work [\#187](https://github.com/primefaces/primevue/issues/187) +- Could not find module './components/row/Row' [\#185](https://github.com/primefaces/primevue/issues/185) +- Style classes are not rendered correctly on Dialog [\#182](https://github.com/primefaces/primevue/issues/182) + +## [1.0.2](https://github.com/primefaces/primevue/tree/1.0.2) (2020-01-30) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.0.0...1.0.2) + +**Implemented New Features and Enhancements:** + +- Align focus visuals with the theme [\#177](https://github.com/primefaces/primevue/issues/177) +- Refactor SplitButton to use Menu [\#174](https://github.com/primefaces/primevue/issues/174) +- DataTable onPage event fires without sort and filter information [\#163](https://github.com/primefaces/primevue/issues/163) +- Ability to disable SplitButton or Menu items [\#161](https://github.com/primefaces/primevue/issues/161) +- Enter key should select a PickList item [\#156](https://github.com/primefaces/primevue/issues/156) +- Dialog in mobile view [\#153](https://github.com/primefaces/primevue/issues/153) +- Dropdown and MultiSelect on expand event [\#150](https://github.com/primefaces/primevue/issues/150) + +**Fixed bugs:** + +- Editable Dropdown loses focus [\#149](https://github.com/primefaces/primevue/issues/149) +- Rename select event with \*-select [\#148](https://github.com/primefaces/primevue/issues/148) +- Dialog block UI removes page scroll [\#145](https://github.com/primefaces/primevue/issues/145) +- Calendar select event has no value [\#144](https://github.com/primefaces/primevue/issues/144) +- Calendar manual input fails [\#143](https://github.com/primefaces/primevue/issues/143) +- Calendar giving focus to today when disabled [\#141](https://github.com/primefaces/primevue/issues/141) +- optionValue and dataKey combination is broken is Select Components [\#90](https://github.com/primefaces/primevue/issues/90) +- DataTable column headers always receive focus [\#176](https://github.com/primefaces/primevue/issues/176) +- Disabled button should remove pointer cursor [\#175](https://github.com/primefaces/primevue/issues/175) +- Dialog visuals broken when initially displayed [\#167](https://github.com/primefaces/primevue/issues/167) +- Dialog animation leave does not work [\#166](https://github.com/primefaces/primevue/issues/166) +- rowsPerPageOptions dropdown is not coming in Paginator [\#159](https://github.com/primefaces/primevue/issues/159) +- Calendar today button TypeError: Cannot read property 'currentTarget' of null [\#158](https://github.com/primefaces/primevue/issues/158) +- Row edit save not working properly in data table [\#151](https://github.com/primefaces/primevue/issues/151) + +## [1.0.0](https://github.com/primefaces/primevue/tree/1.0.0) (2020-01-13) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.0.0-rc.6...1.0.0) + +**Implemented New Features and Enhancements:** + +- New Component: ColorPicker [\#139](https://github.com/primefaces/primevue/issues/139) +- Enhance Dialog Positioning [\#136](https://github.com/primefaces/primevue/issues/136) + +**Fixed bugs:** + +- Error: Do not access Object.prototype method [\#138](https://github.com/primefaces/primevue/issues/138) +- The slot \#empty of DataTable not working [\#137](https://github.com/primefaces/primevue/issues/137) +- Sidebar showCloseIcon not working [\#135](https://github.com/primefaces/primevue/issues/135) +- Error with calendar year navigator [\#134](https://github.com/primefaces/primevue/issues/134) + +## [1.0.0-rc.6](https://github.com/primefaces/primevue/tree/1.0.0-rc.6) (2019-12-30) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.0.0-rc.5...1.0.0-rc.6) + +**Fixed bugs:** + +- Keydown causes sort on sortable header [\#130](https://github.com/primefaces/primevue/issues/130) + +## [1.0.0-rc.5](https://github.com/primefaces/primevue/tree/1.0.0-rc.5) (2019-12-30) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.0.0-rc.4...1.0.0-rc.5) + +**Implemented New Features and Enhancements:** + +- TimePicker buttons should trap focus [\#128](https://github.com/primefaces/primevue/issues/128) + +**Fixed bugs:** + +- RadioButton throws error [\#129](https://github.com/primefaces/primevue/issues/129) + +## [1.0.0-rc.4](https://github.com/primefaces/primevue/tree/1.0.0-rc.4) (2019-12-30) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.0.0-rc.3...1.0.0-rc.4) + +**Implemented New Features and Enhancements:** + +- Inplace focus visuals not themed [\#123](https://github.com/primefaces/primevue/issues/123) +- New Component: Tooltip [\#122](https://github.com/primefaces/primevue/issues/122) +- Keyboard accessibility for Calendar [\#109](https://github.com/primefaces/primevue/issues/109) +- Enhance ARIA roles and attributes for the components [\#108](https://github.com/primefaces/primevue/issues/108) + +**Fixed bugs:** + +- Error in datatable keyboard navigation [\#127](https://github.com/primefaces/primevue/issues/127) +- Scroll+Paginator fails [\#126](https://github.com/primefaces/primevue/issues/126) + +## [1.0.0-rc.3](https://github.com/primefaces/primevue/tree/1.0.0-rc.3) (2019-12-23) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.0.0-rc.2...1.0.0-rc.3) + +**Fixed bugs:** + +- DataView Grid should have nogutter [\#121](https://github.com/primefaces/primevue/issues/121) +- Menu should prevent default action when there is none [\#120](https://github.com/primefaces/primevue/issues/120) +- Range slider goes out of bounds [\#119](https://github.com/primefaces/primevue/issues/119) + +## [1.0.0-rc.2](https://github.com/primefaces/primevue/tree/1.0.0-rc.2) (2019-12-20) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.0.0-rc.1...1.0.0-rc.2) + +**Implemented New Features and Enhancements:** + +- Add p-placeholder class to Multiselect label [\#111](https://github.com/primefaces/primevue/issues/111) + +**Fixed bugs:** + +- ContextMenu fails in global mode [\#118](https://github.com/primefaces/primevue/issues/118) +- ProgressBar showValue prop is ignored [\#117](https://github.com/primefaces/primevue/issues/117) +- Calendar icon button submitting form [\#114](https://github.com/primefaces/primevue/issues/114) +- Message icon correction [\#112](https://github.com/primefaces/primevue/issues/112) +- Disabled Dropdown still picking values [\#110](https://github.com/primefaces/primevue/issues/110) +- Calendar clear button does not reset the input field [\#107](https://github.com/primefaces/primevue/issues/107) + +## [1.0.0-rc.1](https://github.com/primefaces/primevue/tree/1.0.0-rc.1) (2019-12-10) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.0.0-beta.14...1.0.0-rc.1) + +**Implemented New Features and Enhancements:** + +- New Component: Steps [\#103](https://github.com/primefaces/primevue/issues/103) +- New Component: PanelMenu [\#102](https://github.com/primefaces/primevue/issues/102) +- New Component: ContextMenu [\#101](https://github.com/primefaces/primevue/issues/101) +- New Component: MegaMenu [\#100](https://github.com/primefaces/primevue/issues/100) +- New Component: TabMenu [\#99](https://github.com/primefaces/primevue/issues/99) +- New Component: Menubar [\#98](https://github.com/primefaces/primevue/issues/98) +- New Component: TieredMenu [\#97](https://github.com/primefaces/primevue/issues/97) +- New Component: Breadcrumb [\#96](https://github.com/primefaces/primevue/issues/96) +- Add default focus on searchable dropdowns [\#95](https://github.com/primefaces/primevue/issues/95) +- Nuxt integration [\#86](https://github.com/primefaces/primevue/issues/86) + +**Fixed bugs:** + +- Paginator should go to last page if current page has no data [\#106](https://github.com/primefaces/primevue/issues/106) +- TreeNode is not toggled with left and right arrow keys [\#105](https://github.com/primefaces/primevue/issues/105) +- Dialog is not modal when v-if used [\#94](https://github.com/primefaces/primevue/issues/94) +- DataTable rowClick returns a dom event with no data property [\#91](https://github.com/primefaces/primevue/issues/91) + +## [1.0.0-beta.14](https://github.com/primefaces/primevue/tree/1.0.0-beta.14) (2019-11-20) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.0.0-beta.13...1.0.0-beta.14) + +**Implemented New Features and Enhancements:** + +- Scrollable DataTable [\#87](https://github.com/primefaces/primevue/issues/87) +- Add p-placeholder to Dropdown label [\#84](https://github.com/primefaces/primevue/issues/84) +- Add row-click event to Table [\#82](https://github.com/primefaces/primevue/issues/82) + +## [1.0.0-beta.13](https://github.com/primefaces/primevue/tree/1.0.0-beta.13) (2019-11-01) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.0.0-beta.12...1.0.0-beta.13) + +**Implemented New Features and Enhancements:** + +- Ability to style certain rows and cells in Table [\#81](https://github.com/primefaces/primevue/issues/81) +- Menu Component a11y issue [\#78](https://github.com/primefaces/primevue/issues/78) +- Modal dialog not blocking background [\#77](https://github.com/primefaces/primevue/issues/77) + +**Fixed bugs:** + +- Modal dialog is not destroyed properly [\#80](https://github.com/primefaces/primevue/issues/80) + +## [1.0.0-beta.12](https://github.com/primefaces/primevue/tree/1.0.0-beta.12) (2019-10-22) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.0.0-beta.11...1.0.0-beta.12) + +**Implemented New Features and Enhancements:** + +- New Carousel Component [\#73](https://github.com/primefaces/primevue/issues/73) +- Expandable Rows for DataTable [\#72](https://github.com/primefaces/primevue/issues/72) +- TableState for DataTable [\#68](https://github.com/primefaces/primevue/issues/68) +- Row Grouping for DataTable [\#65](https://github.com/primefaces/primevue/issues/65) + +**Fixed bugs:** + +- Time buttons select a date on mouseout event on Calendar with showTime property [\#75](https://github.com/primefaces/primevue/issues/75) +- Clicking column header resets paginator [\#74](https://github.com/primefaces/primevue/issues/74) +- Calendar.vue: "close on blur" not working properly [\#71](https://github.com/primefaces/primevue/issues/71) + +## [1.0.0-beta.11](https://github.com/primefaces/primevue/tree/1.0.0-beta.11) (2019-10-18) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.0.0-beta.10...1.0.0-beta.11) + +**Implemented New Features and Enhancements:** + +- Row Reordering with DragDrop [\#69](https://github.com/primefaces/primevue/issues/69) +- Improve component styles on Luna and Nova Themes [\#66](https://github.com/primefaces/primevue/issues/66) +- Column Reordering with DragDrop [\#64](https://github.com/primefaces/primevue/issues/64) +- ColumnGroups for DataTable [\#63](https://github.com/primefaces/primevue/issues/63) + +**Fixed bugs:** + +- Accordion and TabView do not sync children changes [\#67](https://github.com/primefaces/primevue/issues/67) +- Accordion and TabView create empty tabs [\#59](https://github.com/primefaces/primevue/issues/59) + +## [1.0.0-beta.10](https://github.com/primefaces/primevue/tree/1.0.0-beta.10) (2019-10-15) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.0.0-beta.9...1.0.0-beta.10) + +**Implemented New Features and Enhancements:** + +- New Component: Carousel [\#61](https://github.com/primefaces/primevue/issues/61) + +**Fixed bugs:** + +- Menu and OverlayPanel target position miscalculated [\#62](https://github.com/primefaces/primevue/issues/62) +- Dataview paginator gets out of sync [\#60](https://github.com/primefaces/primevue/issues/60) + +## [1.0.0-beta.9](https://github.com/primefaces/primevue/tree/1.0.0-beta.9) (2019-10-01) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.0.0-beta.8...1.0.0-beta.9) + +**Implemented New Features and Enhancements:** + +- Remove empty spaces with Lint [\#58](https://github.com/primefaces/primevue/issues/58) +- Reimplement Accordion with Templating [\#56](https://github.com/primefaces/primevue/issues/56) +- Reimplement TabView with Templating [\#51](https://github.com/primefaces/primevue/issues/51) + +**Fixed bugs:** + +- MultiSelect filter cannot be turned off [\#57](https://github.com/primefaces/primevue/issues/57) +- DataTable sortField cannot be synced [\#55](https://github.com/primefaces/primevue/issues/55) +- Duplicate key issue in menu component [\#52](https://github.com/primefaces/primevue/issues/52) +- Calendar.vue: when the value is updated, the component partially updates itself [\#47](https://github.com/primefaces/primevue/issues/47) +- MultiSelect.vue: error on onToggleAll and bad default placeholder [\#45](https://github.com/primefaces/primevue/issues/45) +- Calendar clear button does not reset the input field [\#42](https://github.com/primefaces/primevue/issues/42) +- Time does not stop spinning in Calendar [\#40](https://github.com/primefaces/primevue/issues/40) + +## [1.0.0-beta.8](https://github.com/primefaces/primevue/tree/1.0.0-beta.8) (2019-08-21) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.0.0-beta.7...1.0.0-beta.8) + +**Fixed bugs:** + +- Cannot delete date from calendar once it's selected [\#38](https://github.com/primefaces/primevue/issues/38) +- Dropdown click icon gives error on Firefox [\#37](https://github.com/primefaces/primevue/issues/37) +- TreeTable single sort broken [\#35](https://github.com/primefaces/primevue/issues/35) +- TreeTable highlights unsorted columns [\#34](https://github.com/primefaces/primevue/issues/34) +- InputMask pressing enter [\#33](https://github.com/primefaces/primevue/issues/33) +- Column component registration fails with Typescript [\#29](https://github.com/primefaces/primevue/issues/29) + +## [1.0.0-beta.7](https://github.com/primefaces/primevue/tree/1.0.0-beta.7) (2019-08-15) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.0.0-beta.6...1.0.0-beta.7) + +**Implemented New Features and Enhancements:** + +- New Component: TreeTable [\#31](https://github.com/primefaces/primevue/issues/31) +- Resizable Columns for DataTable [\#30](https://github.com/primefaces/primevue/issues/30) +- New Component: InputMask [\#26](https://github.com/primefaces/primevue/issues/26) + +## [1.0.0-beta.6](https://github.com/primefaces/primevue/tree/1.0.0-beta.6) (2019-08-05) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.0.0-beta.5...1.0.0-beta.6) + +**Implemented New Features and Enhancements:** + +- New Component: Tree [\#28](https://github.com/primefaces/primevue/issues/28) + +## [1.0.0-beta.5](https://github.com/primefaces/primevue/tree/1.0.0-beta.5) (2019-07-29) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.0.0-beta.3...1.0.0-beta.5) + +**Implemented New Features and Enhancements:** + +- New Component: DataTable [\#23](https://github.com/primefaces/primevue/issues/23) +- Convert emptyMessage to a template for DataView [\#10](https://github.com/primefaces/primevue/issues/10) +- Auto z-index layering for Toast [\#9](https://github.com/primefaces/primevue/issues/9) +- Reset DataTable page after sort [\#27](https://github.com/primefaces/primevue/issues/27) +- New Component: ProgressSpinner [\#24](https://github.com/primefaces/primevue/issues/24) +- New Component: DeferredContent [\#20](https://github.com/primefaces/primevue/issues/20) +- New Component: Inplace [\#19](https://github.com/primefaces/primevue/issues/19) +- New Component: PickList [\#18](https://github.com/primefaces/primevue/issues/18) +- New Component: OrderList [\#17](https://github.com/primefaces/primevue/issues/17) +- New Component: OrganizationChart [\#16](https://github.com/primefaces/primevue/issues/16) + +**Fixed bugs:** + +- Calendar today button throws an error [\#22](https://github.com/primefaces/primevue/issues/22) +- DataView paginator is always displayed [\#21](https://github.com/primefaces/primevue/issues/21) +- Dropdown ignores false or 0 values [\#11](https://github.com/primefaces/primevue/issues/11) + +## [1.0.0-beta.3](https://github.com/primefaces/primevue/tree/1.0.0-beta.3) (2019-05-30) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.0.0-beta.2...1.0.0-beta.3) + +## [1.0.0-beta.2](https://github.com/primefaces/primevue/tree/1.0.0-beta.2) (2019-05-28) + +[Full Changelog](https://github.com/primefaces/primevue/compare/1.0.0-beta.1...1.0.0-beta.2) + +## [1.0.0-beta.1](https://github.com/primefaces/primevue/tree/1.0.0-beta.1) (2019-05-27) + +[Full Changelog](https://github.com/primefaces/primevue/compare/9d2c525d528c9bd6f306c6f550e3f0eef7879054...1.0.0-beta.1) + +\* _This Changelog was automatically generated by [github_changelog_generator](https://github.com/github-changelog-generator/github-changelog-generator)_ diff --git a/apps/showcase/api-generator/build-api.js b/apps/showcase/api-generator/build-api.js new file mode 100644 index 000000000..efdaf83d0 --- /dev/null +++ b/apps/showcase/api-generator/build-api.js @@ -0,0 +1,175 @@ +const fs = require('fs'); +const path = require('path'); + +const rootDir = path.resolve(__dirname, '../'); +const distDir = path.resolve(rootDir, 'dist'); +const componentPath = path.join(__dirname, './components'); + +// Import project `package.json` +const pkg = require(path.resolve(rootDir, 'package.json')); +const libraryName = 'PrimeVue'; +const libraryVersion = pkg.version; + +const showcaseURL = 'https://primevue.org/'; + +const fileModules = {}, + veturTags = {}, + veturAttributes = {}; + +const files = fs.readdirSync(componentPath); + +files.forEach((file) => { + const { name } = path.parse(file); + + fileModules[name] = require(`./components//${name}`); +}); + +const webTypes = { + $schema: 'https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json', + framework: 'vue', + name: libraryName, + version: libraryVersion, + contributions: { + html: { + 'types-syntax': 'typescript', + 'description-markup': 'markdown', + tags: [], + attributes: [] + } + } +}; + +const addURL = (attr, url, value) => { + const newArray = []; + + attr.forEach((att) => { + const newObj = {}; + + Object.keys(att).forEach((key) => { + newObj[key] = att[key]; + if (key === value) newObj['doc-url'] = url; + }); + + newArray.push(newObj); + }); + + return newArray; +}; + +const createWebTypes = (component) => { + const url = showcaseURL + `${component['doc-url'] ? component['doc-url'] : component.name.toLowerCase()}`; + + // components + const tag = { + name: component.name, + source: { + module: libraryName, + symbol: component.name + }, + 'doc-url': url, + description: component.description + }; + + // directives + const attribute = { + name: component.name, + source: { + module: libraryName, + symbol: component.name + }, + description: component.description, + 'doc-url': url, + value: { + kind: 'expression', + type: 'function' + } + }; + + if (component.props) { + tag.attributes = addURL(component.props, url, 'default'); + tag.attributes.forEach((k) => { + k['value'] = { + kind: 'expression', + type: k['type'] + }; + + delete k['type']; + }); + } + + if (component.events) { + tag.events = addURL(component.events, url, 'name'); + tag.events.forEach((k) => { + if (k.arguments) { + k.arguments = addURL(k.arguments, url, 'name'); + } + }); + } + + if (component.slots) { + tag.slots = addURL(component.slots, url, 'name'); + } + + if (component['vue-modifiers']) { + attribute.required = false; + attribute['vue-modifiers'] = addURL(component['vue-modifiers'], url, 'name'); + + if (attribute['vue-modifiers'].length < 1) delete attribute['vue-modifiers']; + + webTypes.contributions.html.attributes.push(attribute); + } + + webTypes.contributions.html.tags.push(tag); +}; + +const createVeturTags = (component) => { + const attributes = []; + + if (component.props) { + component.props.forEach((comp) => { + attributes.push(comp.name); + }); + } + + if (attributes.length > 0) { + veturTags[component.name] = { + description: component.description, + attributes + }; + } +}; + +const createVeturAttributes = (component) => { + if (component.props) { + component.props.forEach((comp) => { + veturAttributes[component.name.toLowerCase() + `/${comp.name}`] = { + description: comp.description, + type: comp.type + }; + }); + } +}; + +Object.keys(fileModules).forEach((p) => { + const component = fileModules[p][p]; + + if (component) { + createWebTypes(component); + createVeturTags(component); + createVeturAttributes(component); + } +}); + +!fs.existsSync(distDir) && fs.mkdirSync(distDir); + +const webTypesJson = JSON.stringify(webTypes, null, 2); + +fs.writeFileSync(path.resolve(distDir, 'web-types.json'), webTypesJson); + +const veturTagsJson = JSON.stringify(veturTags, null, 2); + +fs.writeFileSync(path.resolve(distDir, 'vetur-tags.json'), veturTagsJson); + +const veturAttributesJson = JSON.stringify(veturAttributes, null, 2); + +fs.writeFileSync(path.resolve(distDir, 'vetur-attributes.json'), veturAttributesJson); diff --git a/apps/showcase/api-generator/build-apidoc.js b/apps/showcase/api-generator/build-apidoc.js new file mode 100644 index 000000000..70c27572e --- /dev/null +++ b/apps/showcase/api-generator/build-apidoc.js @@ -0,0 +1,760 @@ +const TypeDoc = require('typedoc'); +const path = require('path'); +const fs = require('fs'); + +const rootDir = path.resolve(__dirname, '../'); +const outputPath = path.resolve(rootDir, 'doc/common/apidoc'); + +const staticMessages = { + methods: "Defines methods that can be accessed by the component's reference.", + emits: 'Defines emit that determine the behavior of the component based on a given condition or report the actions that the component takes.', + slots: 'Defines the slots used by the component.', + functions: 'Defines the custom functions used by the module.', + events: "Defines the custom events used by the component's emit.", + interfaces: 'Defines the custom interfaces used by the module.', + types: 'Defines the custom types used by the module.', + tokens: 'Define design tokens used by the component.' +}; + +const app = new TypeDoc.Application(); + +// If you want TypeDoc to load tsconfig.json / typedoc.json files +app.options.addReader(new TypeDoc.TSConfigReader()); +app.options.addReader(new TypeDoc.TypeDocReader()); + +app.bootstrap({ + // typedoc options here + name: 'PrimeVue', + entryPoints: [`components/lib/`], + entryPointStrategy: 'expand', + hideGenerator: true, + excludeExternals: true, + includeVersion: true, + searchInComments: true, + disableSources: true, + logLevel: 'Error', + sort: ['source-order'], + exclude: ['node_modules', 'components/lib/**/*.js'] +}); + +const project = app.convert(); + +if (project) { + const doc = {}; + + const parseText = (text) => { + return text.replace(/{/g, '{').replace(/}/g, '}'); + }; + + project.children.forEach((module) => { + const { name, comment } = module; + + const description = comment && comment.summary.map((s) => s.text || '').join(' '); + + doc[name] = { + description + }; + + const module_component_group = module.groups?.find((g) => g.title === 'Component'); + let methods = { + description: staticMessages['methods'], + values: [] + }; + + module_component_group && + module_component_group.children.forEach((component) => { + const description = + component.comment && + component.comment.summary + .map((s) => { + const text = s.text || ''; + const splittedText = text.split('_'); + + return splittedText[1] ? splittedText[1] : text; + }) + .join(' '); + + !doc[name]['components'] && (doc[name]['components'] = {}); + + const component_method_group = component.groups && component.groups.find((g) => g.title === 'Methods'); + + component_method_group && + component_method_group.children.forEach((method) => { + const signature = method.getAllSignatures()[0]; + + methods.values.push({ + name: signature.name, + parameters: signature.parameters.map((param) => { + return { + name: param.name, + type: param.type.toString(), + description: param.comment && param.comment.summary.map((s) => s.text || '').join(' ') + }; + }), + returnType: signature.type.toString(), + description: signature.comment && signature.comment.summary.map((s) => s.text || '').join(' ') + }); + }); + + const component_props_id = component.extendedTypes && component.extendedTypes[0].typeArguments && component.extendedTypes[0].typeArguments[0] && component.extendedTypes[0].typeArguments[0]._target; + const module_properties_group = module.groups.find((g) => g.title === 'Properties'); + const component_props = module_properties_group && module_properties_group.children.find((c) => (component_props_id ? c.id === component_props_id : true)); + + const props = { + description: '', + values: [] + }; + const emit = { + description: staticMessages['emit'], + values: [] + }; + + if (component_props) { + props.description = component_props.comment ? component_props.comment.summary.map((s) => parseText(s.text || '')).join(' ') : ''; + + const component_props_group = component_props.groups && component_props.groups.find((g) => g.title === 'Properties'); + + component_props_group && + component_props_group.children.forEach((prop) => { + if (!prop.inheritedFrom || (prop.inheritedFrom && !prop.inheritedFrom.toString().startsWith('Omit.data-pr-'))) { + props.values.push({ + name: prop.name, + optional: prop.flags.isOptional, + readonly: prop.flags.isReadonly, + type: prop.type.toString(), + default: prop.comment && prop.comment.getTag('@defaultValue') ? parseText(prop.comment.getTag('@defaultValue').content[0]?.text || '') : '', // TODO: Check + description: prop.comment && prop.comment.summary.map((s) => parseText(s.text || '')).join(' '), + deprecated: prop.comment && prop.comment.getTag('@deprecated') ? parseText(prop.comment.getTag('@deprecated').content[0]?.text) : undefined + }); + } + }); + + const component_props_methods_group = component_props.groups && component_props.groups.find((g) => g.title === 'Methods'); + + component_props_methods_group && + component_props_methods_group.children.forEach((method) => { + const signature = method.getAllSignatures()[0]; + + methods.values.push({ + name: signature.name, + parameters: signature.parameters.map((param) => { + return { + name: param.name, + optional: param.flags.isOptional, + type: param.type.toString(), + description: param.comment && param.comment.summary.map((s) => parseText(s.text || '')).join(' ') + }; + }), + returnType: signature.type.toString(), + description: signature.comment.summary.map((s) => parseText(s.text || '')).join(' ') + }); + }); + } + + doc[name]['components'][component.name] = { + description, + methods + }; + }); + + const module_model_group = module.groups?.find((g) => g.title === 'Model'); + + module_model_group && + module_model_group.children.forEach((model) => { + const event_props_description = model.comment && model.comment.summary.map((s) => s.text || '').join(' '); + + !doc[name]['model'] && (doc[name]['model'] = {}); + + const props = { + description: '', + values: [] + }; + + const methods = { + description: '', + values: [] + }; + const model_props_group = model.groups.find((g) => g.title === 'Properties'); + + model_props_group && + model_props_group.children.forEach((prop) => { + props.values.push({ + name: prop.name, + optional: prop.flags.isOptional, + readonly: prop.flags.isReadonly, + type: prop.type.toString(), + default: prop.comment && prop.comment.getTag('@defaultValue') ? prop.comment.getTag('@defaultValue').content[0]?.text || '' : '', // TODO: Check + description: prop.comment && prop.comment.summary.map((s) => s.text || '').join(' ') + }); + }); + + const model_methods_group = model.groups.find((g) => g.title === 'Methods'); + + model_methods_group && + model_methods_group.children.forEach((method) => { + const signature = method.getAllSignatures()[0]; + const isSlot = model.name.includes('Slots'); + + methods.values.push({ + name: signature.name, + parameters: signature.parameters.map((param) => { + let type = param.type.toString(); + + if (param.type.declaration && isSlot) { + type = ''; + + if (param.type.declaration.children) { + param.type.declaration.children.forEach((child) => { + if (child.signatures) { + const childSinature = child.signatures[0]; + const parameters = childSinature.parameters.reduce((acc, { name, type }, index) => (index === 0 ? `${name}: ${type.name}` : `${acc}, ${name}: ${type.name}`), ''); + + type += ` \t ${childSinature.name}(${parameters}): ${childSinature.type?.name}, // ${childSinature.comment?.summary[0]?.text}\n `; + } else { + const childType = child.type.elementType ? child.type.elementType.name : child.type.name; + + type += ` \t ${child.name}: ${childType}, // ${child.comment?.summary[0]?.text}\n `; + } + }); + } + + type = `{\n ${type} }`; + } + + return { + name: param.name, + optional: param.flags.isOptional, + type: type, + description: param.comment && param.comment.summary.map((s) => parseText(s.text || '')).join(' ') + }; + }), + returnType: signature.type.toString(), + description: signature.comment && signature.comment.summary.map((s) => parseText(s.text || '')).join(' '), + deprecated: signature.comment && signature.comment.getTag('@deprecated') ? parseText(signature.comment.getTag('@deprecated').content[0]?.text) : undefined + }); + }); + + doc[name]['model'][model.name] = { + description: event_props_description, + props, + methods + }; + }); + + const module_functions_group = module.groups?.find((g) => g.title === 'Functions'); + + module_functions_group && + module_functions_group.children.forEach((method) => { + !doc[name]['functions'] && + (doc[name]['functions'] = { + description: staticMessages['functions'], + values: {} + }); + + const signatures = method.getAllSignatures(); + + if (signatures && signatures.length > 0) { + const signature = signatures[0]; + + doc[name]['functions'].values[method.name] = { + name: signature.name, + parameters: signature.parameters.map((param) => { + return { + name: param.name, + type: param.type.toString(), + description: param.comment && param.comment.summary.map((s) => s.text || '').join(' ') + }; + }), + returnType: signature.type.toString(), + description: signature.comment && signature.comment.summary.map((s) => s.text || '').join(' ') + }; + } + }); + + const module_events_group = module.groups?.find((g) => g.title === 'Events'); + + module_events_group && + module_events_group.children.forEach((event) => { + const event_props_description = event.comment && event.comment.summary.map((s) => s.text || '').join(' '); + const component_prop = event.comment && event.comment.getTag('@see') ? event.comment.getTag('@see').content[0]?.text || '' : ''; // TODO: Check + const event_extendedBy = event.extendedBy && event.extendedBy.toString(); + + !doc[name]['events'] && + (doc[name]['events'] = { + description: staticMessages['events'], + values: {} + }); + + const props = []; + const event_props_group = event.groups.find((g) => g.title === 'Properties'); + + event_props_group && + event_props_group.children.forEach((prop) => { + props.push({ + name: prop.name, + optional: prop.flags.isOptional, + readonly: prop.flags.isReadonly, + type: prop.type.toString(), + //default: prop.comment && prop.comment.getTag('@defaultValue') ? prop.comment.getTag('@defaultValue').content[0].text : '', // TODO: Check + description: prop.comment && prop.comment.summary.map((s) => s.text || '').join(' ') + }); + }); + + doc[name]['events'].values[event.name] = { + description: event_props_description, + relatedProp: component_prop, + props, + extendedBy: event_extendedBy + }; + }); + + const module_interfaces_group = module.groups?.find((g) => g.title === 'Interfaces'); + + module_interfaces_group && + module_interfaces_group.children.forEach((event) => { + const event_props_description = event.comment && event.comment.summary.map((s) => s.text || '').join(' '); + let component_prop = ''; + + if (event.comment && event.comment.getTag('@see')) { + const tag = event.comment.getTag('@see'); + const content = tag.content[0]; + + if (content.text.includes("['")) { + component_prop = `${content.target.name}${content.text}`; + } else { + component_prop = `${content.text === content.target?.name ? content.target.parent.name : content.target?.name}.${content.text}`; + } + } + + const event_extendedBy = event.extendedBy && event.extendedBy.toString(); + const event_extendedTypes = event.extendedTypes && event.extendedTypes.toString(); + + !doc[name]['interfaces'] && + (doc[name]['interfaces'] = { + description: staticMessages['interfaces'], + eventDescription: staticMessages['events'], + methodDescription: staticMessages['methods'], + typeDescription: staticMessages['types'], + + values: {} + }); + + const props = []; + const methods = []; + + if (event.groups) { + const event_props_group = event.groups.find((g) => g.title === 'Properties'); + + event_props_group && + event_props_group.children.forEach((prop) => { + props.push({ + name: prop.name, + optional: prop.flags.isOptional, + readonly: prop.flags.isReadonly, + type: prop.type.toString(), + default: prop.comment && prop.comment.getTag('@defaultValue') ? prop.comment.getTag('@defaultValue').content[0]?.text || '' : '', // TODO: Check + description: + prop.comment && + prop.comment.summary + .map((s) => { + if (s.text.indexOf('[here]') > -1) { + return `${s.text.slice(0, s.text.indexOf('[here]'))} here ${s.text.slice(s.text.indexOf(')') + 1)}`; + } + + return s.text || ''; + }) + .join(' '), + deprecated: prop.comment && prop.comment.getTag('@deprecated') ? parseText(prop.comment.getTag('@deprecated').content[0]?.text) : undefined + }); + }); + + const event_methods_group = event.groups.find((g) => g.title === 'Methods'); + + event_methods_group && + event_methods_group.children.forEach((method) => { + const signature = method.getAllSignatures()[0]; + const isSlot = event.name.includes('Slots'); + + methods.push({ + name: signature.name, + parameters: signature.parameters.map((param) => { + let type = param.type.toString(); + + if (param.type.declaration && isSlot) { + type = ''; + + if (param.type.declaration.children) { + param.type.declaration.children.forEach((child) => { + if (child.signatures) { + const childSinature = child.signatures[0]; + const parameters = childSinature.parameters.reduce((acc, { name, type }, index) => (index === 0 ? `${name}: ${type.name}` : `${acc}, ${name}: ${type.name}`), ''); + + type += ` \t ${childSinature.name}(${parameters}): ${childSinature.type?.name}, // ${childSinature.comment?.summary[0]?.text}\n `; + } else { + if (child.type?.declaration?.signatures) { + let functionParameters = ''; + + child.type?.declaration?.signatures[0]?.parameters.map((param, index) => { + if (index !== 0) functionParameters += `, `; + functionParameters += `${param.name}: ${param.type?.name}`; + }); + + if (child.type?.declaration?.signatures[0]?.comment?.getTag('@deprecated')?.content[0]?.text) { + type += `\t ${child.name}: (${functionParameters}) ⇒ ${child.type?.declaration?.signatures[0]?.type?.name}, // ${child.type?.declaration?.signatures[0]?.comment.summary[0]?.text}\n`; + } else { + type += `\t ${child.name}: (${functionParameters}) ⇒ ${child.type?.declaration?.signatures[0]?.type?.name}, // ${child.type?.declaration?.signatures[0]?.comment.summary[0]?.text}\n`; + } + } else { + const childType = child.type.elementType ? child.type.elementType.name : child.type.name; + + type += ` \t ${child.name}: ${childType}, // ${child.comment?.summary[0]?.text}\n `; + } + } + }); + } + + type = `{\n ${type}}`; + } + + return { + name: param.name, + optional: param.flags.isOptional, + type: type, + description: param.comment && param.comment.summary.map((s) => parseText(s.text || '')).join(' ') + }; + }), + returnType: signature.type.toString(), + description: signature.comment && signature.comment.summary.map((s) => parseText(s.text || '')).join(' '), + deprecated: signature.comment && signature.comment.getTag('@deprecated') ? parseText(signature.comment.getTag('@deprecated').content[0]?.text) : undefined + }); + }); + } + + const signature = event.getAllSignatures(); + + if (signature && signature.length > 0) { + const parameter = signature[0].parameters[0]; + + props.push({ + name: `[${parameter.name}: ${parameter.type.toString()}]`, + optional: parameter.flags.isOptional, + readonly: parameter.flags.isReadonly, + type: signature[0].type.toString(), + //default: prop.comment && prop.comment.getTag('@defaultValue') ? prop.comment.getTag('@defaultValue').content[0].text : '', // TODO: Check + description: signature[0].comment && signature[0].comment.summary.map((s) => s.text || '').join(' ') + }); + } + + doc[name]['interfaces'].values[event.name] = { + description: event_props_description, + relatedProp: component_prop, + props, + methods, + extendedBy: event_extendedBy, + extendedTypes: event_extendedTypes + }; + + !doc[name]['tokens'] && + (doc[name]['tokens'] = { + description: staticMessages['tokens'], + values: {} + }); + + const tokens = []; + + const setTokens = (_declaration, _name) => { + if (_declaration?.groups) { + const event_props_group = _declaration.groups.find((g) => g.title === 'Properties'); + + event_props_group && + event_props_group.children.forEach((prop) => { + if (prop.type?.declaration) { + setTokens(prop.type?.declaration, prop.name); + } else if (prop.comment?.getTag('@designToken')) { + tokens.push({ + name: _name ? `${_name}.${prop.name}` : prop.name, + token: prop.comment.getTag('@designToken').content[0]?.text || '', + optional: prop.flags.isOptional, + readonly: prop.flags.isReadonly, + type: prop.type.toString(), + default: prop.comment && prop.comment.getTag('@defaultValue') ? prop.comment.getTag('@defaultValue').content[0]?.text || '' : '', // TODO: Check + description: + prop.comment && + prop.comment.summary + .map((s) => { + if (s.text.indexOf('[here]') > -1) { + return `${s.text.slice(0, s.text.indexOf('[here]'))} here ${s.text.slice(s.text.indexOf(')') + 1)}`; + } + + return s.text || ''; + }) + .join(' '), + deprecated: prop.comment && prop.comment.getTag('@deprecated') ? parseText(prop.comment.getTag('@deprecated').content[0]?.text) : undefined + }); + } + }); + } + }; + + setTokens(event); + + doc[name]['tokens'].values[event.name] = { + description: event_props_description, + props: tokens + }; + }); + + const module_enumerations_group = module.groups?.find((g) => g.title === 'Enumerations'); + + module_enumerations_group && + module_enumerations_group.children.forEach((event) => { + const event_props_description = event.comment && event.comment.summary.map((s) => s.text || '').join(' '); + + !doc[name]['enumerations'] && + (doc[name]['enumerations'] = { + description: staticMessages['enumerations'], + + values: {} + }); + + const members = []; + + if (event.groups) { + const event_members_group = event.groups.find((g) => g.title === 'Enumeration Members'); + + event_members_group && + event_members_group.children.forEach((prop) => { + members.push({ + name: prop.name, + optional: prop.flags.isOptional, + readonly: prop.flags.isReadonly, + value: prop.type.toString(), + description: + prop.comment && + prop.comment.summary + .map((s) => { + if (s.text.indexOf('[here]') > -1) { + return `${s.text.slice(0, s.text.indexOf('[here]'))} here ${s.text.slice(s.text.indexOf(')') + 1)}`; + } + + return s.text || ''; + }) + .join(' '), + deprecated: prop.comment && prop.comment.getTag('@deprecated') ? parseText(prop.comment.getTag('@deprecated').content[0]?.text) : undefined + }); + }); + } + + doc[name]['enumerations'].values[event.name] = { + description: event_props_description, + members + }; + }); + + const module_types_group = module.groups?.find((g) => g.title === 'Type Aliases'); + + module_types_group && + module_types_group.children.forEach((event) => { + const event_props_description = event.comment && event.comment.summary.map((s) => s.text || '').join(' '); + + !doc[name]['types'] && + (doc[name]['types'] = { + description: staticMessages['types'], + values: {} + }); + + let values = event.type.toString(); + + if (values.includes('Function') && event.type.types) { + values = ''; + + for (const [i, type] of event.type.types.entries()) { + if (type.declaration && type.declaration.signatures) { + const signature = type.declaration.signatures[0]; + const parameters = signature.parameters.reduce((acc, { name, type }, index) => (index === 0 ? `${name}: ${type.name}` : `${acc}, ${name}: ${type.name}`), ''); + + values += i === 0 ? `(${parameters}) => ${signature.type?.name}` : ` | (${parameters}) => ${signature.type?.name}`; + } else { + const typeName = type.name || type.value; + + values += i === 0 ? `${typeName}` : ` | ${typeName}`; + } + } + } + + const declaration = event.type.declaration; + + if (declaration) { + const groups = declaration.groups && declaration.groups.find((g) => g.title === 'Properties'); + + const map = {}; + + groups && + groups.children.forEach((prop) => { + const description = prop.comment && prop.comment.summary.map((s) => s.text || '').join(' '); + + map[`${prop.name}${prop.flags.isOptional ? '?' : ''}`] = `${prop.type.toString()}, ${description ? '// ' + description : ''}`; + }); + + values = JSON.stringify(map, null, 4); + } + + doc[name]['types'].values[event.name] = { + values, + description: event_props_description + }; + }); + + const module_namespaces_group = module.groups?.find((g) => g.title === 'Namespaces'); + + module_namespaces_group && + module_namespaces_group.children.forEach((pevent) => { + const module_interfaces_group = pevent?.groups?.find((g) => g.title === 'Interfaces'); + + module_interfaces_group && + module_interfaces_group.children.forEach((event) => { + const event_props_description = event.comment && event.comment.summary.map((s) => s.text || '').join(' '); + let component_prop = ''; + + if (event.comment && event.comment.getTag('@see')) { + const tag = event.comment.getTag('@see'); + const content = tag.content[0]; + + if (content.text.includes("['")) { + component_prop = `${content.target.name}${content.text}`; + } else { + component_prop = `${content.text === content.target?.name ? content.target.parent.name : content.target?.name}.${content.text}`; + } + } + + !doc[name]['tokens'] && + (doc[name]['tokens'] = { + description: staticMessages['tokens'], + values: {} + }); + + const props = []; + + const setProps = (_declaration, _name) => { + if (_declaration?.groups) { + const event_props_group = _declaration.groups.find((g) => g.title === 'Properties'); + + event_props_group && + event_props_group.children.forEach((prop) => { + if (prop.type?.declaration) { + setProps(prop.type?.declaration, prop.name); + } else if (prop.comment?.getTag('@designToken')) { + props.push({ + name: _name ? `${_name}.${prop.name}` : prop.name, + token: prop.comment.getTag('@designToken').content[0]?.text || '', + optional: prop.flags.isOptional, + readonly: prop.flags.isReadonly, + type: prop.type.toString(), + default: prop.comment && prop.comment.getTag('@defaultValue') ? prop.comment.getTag('@defaultValue').content[0]?.text || '' : '', // TODO: Check + description: + prop.comment && + prop.comment.summary + .map((s) => { + if (s.text.indexOf('[here]') > -1) { + return `${s.text.slice(0, s.text.indexOf('[here]'))} here ${s.text.slice( + s.text.indexOf(')') + 1 + )}`; + } + + return s.text || ''; + }) + .join(' '), + deprecated: prop.comment && prop.comment.getTag('@deprecated') ? parseText(prop.comment.getTag('@deprecated').content[0]?.text) : undefined + }); + } + }); + } + }; + + setProps(event); + + doc[name]['tokens'].values[event.name] = { + description: event_props_description, + props + }; + }); + }); + + const module_designtokens_group = module.groups?.find((g) => g.title === 'DesignTokens'); + + module_designtokens_group && + module_designtokens_group.children.forEach((event) => { + const event_props_description = event.comment && event.comment.summary.map((s) => s.text || '').join(' '); + let component_prop = ''; + + if (event.comment && event.comment.getTag('@see')) { + const tag = event.comment.getTag('@see'); + const content = tag.content[0]; + + if (content.text.includes("['")) { + component_prop = `${content.target.name}${content.text}`; + } else { + component_prop = `${content.text === content.target?.name ? content.target.parent.name : content.target?.name}.${content.text}`; + } + } + + !doc[name]['tokens'] && + (doc[name]['tokens'] = { + description: staticMessages['tokens'], + values: {} + }); + + const props = []; + + const setProps = (_declaration, _name) => { + if (_declaration?.groups) { + const event_props_group = _declaration.groups.find((g) => g.title === 'Properties'); + + event_props_group && + event_props_group.children.forEach((prop) => { + if (prop.type?.declaration) { + setProps(prop.type?.declaration, prop.name); + } else if (prop.comment?.getTag('@designToken')) { + props.push({ + name: _name ? `${_name}.${prop.name}` : prop.name, + token: prop.comment.getTag('@designToken').content[0]?.text || '', + optional: prop.flags.isOptional, + readonly: prop.flags.isReadonly, + type: prop.type.toString(), + default: prop.comment && prop.comment.getTag('@defaultValue') ? prop.comment.getTag('@defaultValue').content[0]?.text || '' : '', // TODO: Check + description: + prop.comment && + prop.comment.summary + .map((s) => { + if (s.text.indexOf('[here]') > -1) { + return `${s.text.slice(0, s.text.indexOf('[here]'))} here ${s.text.slice(s.text.indexOf(')') + 1)}`; + } + + return s.text || ''; + }) + .join(' '), + deprecated: prop.comment && prop.comment.getTag('@deprecated') ? parseText(prop.comment.getTag('@deprecated').content[0]?.text) : undefined + }); + } + }); + } + }; + + setProps(event); + + doc[name]['tokens'].values[event.name] = { + description: event_props_description, + props + }; + }); + + // app.generateJson(module, `./api-generator/module-typedoc.json`); + }); + + const typedocJSON = JSON.stringify(doc, null, 4); + + !fs.existsSync(outputPath) && fs.mkdirSync(outputPath); + fs.writeFileSync(path.resolve(outputPath, 'index.json'), typedocJSON); + + // app.generateJson(project, `./api-generator/typedoc.json`); +} diff --git a/apps/showcase/api-generator/build-tokens.js b/apps/showcase/api-generator/build-tokens.js new file mode 100644 index 000000000..0ff8551e4 --- /dev/null +++ b/apps/showcase/api-generator/build-tokens.js @@ -0,0 +1,165 @@ +const fs = require('fs'); +const path = require('path'); + +// prettier-ignore +const THEME_COMPONENTS = ['Accordion','AutoComplete','Avatar','Badge','BlockUI','Breadcrumb','Button','Card','Carousel','CascadeSelect','Checkbox','Chip','ColorPicker','ConfirmDialog','ConfirmPopup','ContextMenu','DataTable','DataView','DatePicker','Dialog','Divider','Dock','Drawer','Editor','Fieldset','FileUpload','FloatLabel','Galleria','IconField','Image','InlineMessage','Inplace','InputChips','InputGroup','InputNumber','InputText','Knob','Listbox','MegaMenu','Menu','Menubar','Message','MeterGroup','MultiSelect','OrderList','OrganizationChart','OverlayBadge','Paginator','Panel','PanelMenu','Password','PickList','Popover','ProgressBar','ProgressSpinner','RadioButton','Rating','Ripple','ScrollPanel','Select','SelectButton','Skeleton','Slider','SpeedDial','SplitButton','Splitter','Stepper','Steps','Tabmenu','Tabs','TabView','Tag','Terminal','Textarea','TieredMenu','Timeline','Toast','ToggleButton','ToggleSwitch','Toolbar','Tooltip','Tree','TreeSelect','TreeTable']; + +const themeName = 'aura'; +const rootDir = path.resolve(__dirname, '../'); +const overwrittenDirPath = path.resolve(rootDir, 'components/lib/themes/types/overwritten'); + +try { + !fs.existsSync(overwrittenDirPath) && fs.mkdirSync(overwrittenDirPath, { recursive: true }); +} catch (err) { + console.error(err); +} + +THEME_COMPONENTS.forEach((comp) => { + const data = fs.readFileSync(path.resolve(rootDir, `components/lib/themes/${themeName}/${comp.toLowerCase()}/index.js`), { encoding: 'utf8', flag: 'r' }); + let theme = data.replace('export default', 'module.exports = '); + + try { + fs.writeFileSync(path.resolve(rootDir, `components/lib/themes/types/overwritten/${comp.toLowerCase()}.js`), theme); + + const component = require(path.resolve(rootDir, `components/lib/themes/types/overwritten/${comp.toLowerCase()}.js`)); + const filePath = path.resolve(rootDir, `components/lib/themes/types/${comp.toLowerCase()}`); + let outputFile = path.resolve(filePath, `index.d.ts`); + let defaultText = ''; + + !fs.existsSync(filePath) && fs.mkdirSync(filePath); + + const splitTokenName = (text) => { + return text.split(/(?=[A-Z])/).map((part) => part.toLowerCase()); + }; + + const createSubTokens = (tokenKeys, tokenValue) => { + let subTokens = ''; + + Object.entries(tokenValue).forEach(([tokenKey, tokenSubValue]) => { + if (typeof tokenSubValue === 'string') { + subTokens += createToken([...tokenKeys, tokenKey]); + } else { + subTokens += createNestedToken([...tokenKeys, tokenKey], tokenSubValue); + } + }); + + return subTokens; + }; + + const createDescription = (tokenKeys) => { + let description = ''; + + tokenKeys.forEach((tokenPart, i) => { + if (i !== 0) description += `${splitTokenName(tokenPart).join(' ')} `; + }); + description = description.charAt(0).toUpperCase() + description.slice(1); + + return `${description}of ${splitTokenName(tokenKeys[0]).join(' ')}`; + }; + + const createToken = (tokenKey) => { + let tokenName = tokenKey[tokenKey.length - 1]; + let designTokenName = `${comp.toLowerCase()}`; + let tokenDescription = createDescription(tokenKey); + + tokenKey.forEach((t) => { + if (t !== 'root') { + designTokenName += `.${splitTokenName(t).join('.')}`; + } + + if (tokenName.indexOf('.') > -1 && tokenName.indexOf("'")) { + tokenName = `'${tokenName}'`; + } + }); + + return ` + /** + * ${tokenDescription} + * + * @designToken ${designTokenName} + */ + ${tokenName}?: string;`; + }; + + const createNestedToken = (tokenKeys, tokenValue) => { + let tokenName = tokenKeys[tokenKeys.length - 1]; + let tokenDescription = createDescription(tokenKeys); + + return ` + /** + * ${tokenDescription} + */ + ${tokenName}?: { + ${createSubTokens(tokenKeys, tokenValue)} + };`; + }; + + const generateTokens = (tokenKey, tokenValue) => { + let subTokens = ''; + + Object.entries(tokenValue).forEach(([subTokenKey, subTokenValue]) => { + if (typeof subTokenValue === 'string') { + subTokens += createToken([tokenKey, subTokenKey]); + } else { + subTokens += createNestedToken([tokenKey, subTokenKey], subTokenValue); + } + }); + + defaultText += ` + /** + * Used to pass tokens of the ${splitTokenName(tokenKey).join(' ')} section + */ + ${tokenKey}?: { + ${subTokens} + }`; + }; + + Object.entries(component).forEach(([tname, tvalue]) => { + if (tname !== 'colorScheme') { + if (Object.keys(component).includes('colorScheme')) { + if (Object.keys(component['colorScheme']['light']).includes(tname)) { + tvalue = { ...tvalue, ...component['colorScheme']['light'][tname] }; + } + } + + generateTokens(tname, tvalue); + } else { + Object.entries(tvalue['light']).forEach(([subtname, subtvalue]) => { + if (!Object.keys(component).includes(subtname)) { + generateTokens(subtname, subtvalue); + } + }); + } + }); + + let text = ` +/** + * + * ${comp} Design Tokens + * + * [Live Demo](https://www.primevue.org/${comp.toLowerCase()}/) + * + * @module themes/${comp.toLowerCase()} + * + */ + +import { ColorSchemeDesignToken } from '..'; + +export interface ${comp}DesignTokens extends ColorSchemeDesignToken<${comp}DesignTokens> { +${defaultText} +} +`; + + fs.writeFileSync(outputFile, text, 'utf8'); + } catch (err) { + console.error(err); + } +}); + +try { + if (fs.existsSync(overwrittenDirPath)) { + fs.rmSync(overwrittenDirPath, { recursive: true, force: true }); + } +} catch (err) { + console.error(err); +} diff --git a/apps/showcase/api-generator/components/accordion.js b/apps/showcase/api-generator/components/accordion.js new file mode 100644 index 000000000..12faee510 --- /dev/null +++ b/apps/showcase/api-generator/components/accordion.js @@ -0,0 +1,132 @@ +const AccordionProps = [ + { + name: 'multiple', + type: 'boolean', + default: 'false', + description: 'When enabled, multiple tabs can be activated at the same time.' + }, + { + name: 'activeIndex', + type: 'number|array', + default: 'null', + description: 'Index of the active tab or an array of indexes in multiple mode.' + }, + { + name: 'lazy', + type: 'boolean', + default: 'false', + description: 'When enabled, hidden tabs are not rendered at all. Defaults to false that hides tabs with css.' + }, + { + name: 'expandIcon', + type: 'string', + default: 'null', + description: 'Icon of a collapsed tab.' + }, + { + name: 'collapseIcon', + type: 'string', + default: 'null', + description: 'Icon of a expanded tab.' + }, + { + name: 'tabindex', + type: 'number', + default: '0', + description: 'Index of the element in tabbing order.' + }, + { + name: 'selectOnFocus', + type: 'boolean', + default: 'false', + description: 'When enabled, the focused tab is activated.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const AccordionEvents = [ + { + name: 'tab-open', + description: 'Callback to invoke when a tab gets expanded.', + arguments: [ + { + name: 'originalEvent', + type: 'object', + description: 'Original event' + }, + { + name: 'index', + type: 'number', + description: 'Opened tab index' + } + ] + }, + { + name: 'tab-close', + description: 'Callback to invoke when an active tab is collapsed by clicking on the header.', + arguments: [ + { + name: 'originalEvent', + type: 'object', + description: 'Original event' + }, + { + name: 'index', + type: 'number', + description: 'Closed tab index' + } + ] + }, + { + name: 'tab-click', + description: 'Callback to invoke when an active tab is clicked.', + arguments: [ + { + name: 'originalEvent', + type: 'object', + description: 'Original event' + }, + { + name: 'index', + type: 'number', + description: 'Index of the clicked tab' + } + ] + } +]; + +const AccordioneSlots = [ + { + name: 'default', + description: 'Custom template.' + }, + { + name: 'collapseicon', + description: 'Custom collapse icon template.' + }, + { + name: 'expandicon', + description: 'Custom expand icon template.' + } +]; + +module.exports = { + accordion: { + name: 'Accordion', + description: 'Accordion groups a collection of contents in tabs.', + props: AccordionProps, + events: AccordionEvents, + slots: AccordioneSlots + } +}; diff --git a/apps/showcase/api-generator/components/accordiontab.js b/apps/showcase/api-generator/components/accordiontab.js new file mode 100644 index 000000000..368346f8d --- /dev/null +++ b/apps/showcase/api-generator/components/accordiontab.js @@ -0,0 +1,82 @@ +const AccordionTabProps = [ + { + name: 'header', + type: 'string', + default: 'null', + description: 'Orientation of tab headers.' + }, + { + name: 'headerStyle', + type: 'any', + default: 'null', + description: 'Inline style of the tab header.' + }, + { + name: 'headerClass', + type: 'any', + default: 'null', + description: 'Style class of the tab header.' + }, + { + name: 'headerProps', + type: 'any', + default: 'null', + description: 'Used to pass all properties of the HTMLDivElement to the tab header.' + }, + { + name: 'headerActionProps', + type: 'any', + default: 'null', + description: 'Used to pass all properties of the HTMLAnchorElement to the focusable anchor element inside the tab header.' + }, + { + name: 'contentStyle', + type: 'any', + default: 'null', + description: 'Inline style of the tab content.' + }, + { + name: 'contentClass', + type: 'any', + default: 'null', + description: 'Style class of the tab content.' + }, + { + name: 'contentProps', + type: 'any', + default: 'null', + description: 'Used to pass all properties of the HTMLDivElement to the tab content.' + }, + { + name: 'disabled', + type: 'boolean', + default: 'false', + description: 'Whether the tab is disabled.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + } +]; + +const AccordionTabSlots = [ + { + name: 'header', + description: 'Custom content for the title section of a AccordionTab is defined using the header template.' + }, + { + name: 'headericon', + description: 'Custom icon for the header section of a AccordionTab is defined using the headericon template.' + } +]; + +module.exports = { + accordiontab: { + name: 'AccordionTab', + description: 'Accordion element consists of one or more AccordionTab elements.', + props: AccordionTabProps, + slots: AccordionTabSlots + } +}; diff --git a/apps/showcase/api-generator/components/autocomplete.js b/apps/showcase/api-generator/components/autocomplete.js new file mode 100644 index 000000000..1e1720043 --- /dev/null +++ b/apps/showcase/api-generator/components/autocomplete.js @@ -0,0 +1,470 @@ +const AutoCompleteProps = [ + { + name: 'modelValue', + type: 'any', + default: 'null', + description: 'Value of the component.' + }, + { + name: 'suggestions', + type: 'array', + default: 'null', + description: 'An array of suggestions to display.' + }, + { + name: 'field', + type: 'any', + default: 'null', + description: 'Property name or getter function of a suggested object to resolve and display.' + }, + { + name: 'optionLabel', + type: 'string | function', + default: 'null', + description: 'Property name or getter function to use as the label of an option.' + }, + { + name: 'optionDisabled', + type: 'boolean', + default: 'null', + description: 'Property name or getter function to use as the disabled flag of an option, defaults to false when not defined.' + }, + { + name: 'optionGroupLabel', + type: 'string', + default: 'null', + description: 'Property name or getter function to use as the label of an option group.' + }, + { + name: 'optionGroupChildren', + type: 'string', + default: 'null', + description: 'Property name or getter function that refers to the children options of option group.' + }, + { + name: 'scrollHeight', + type: 'string', + default: '200px', + description: 'Maximum height of the suggestions panel.' + }, + { + name: 'dropdown', + type: 'boolean', + default: 'false', + description: 'Displays a button next to the input field when enabled.' + }, + { + name: 'dropdownMode', + type: 'string', + default: 'blank', + description: 'Specifies the behavior dropdown button. Default "blank" mode sends an empty string and "current" mode sends the input value.' + }, + { + name: 'autoHighlight', + type: 'boolean', + default: false, + description: 'Highlights automatically the first item of the dropdown to be selected.' + }, + { + name: 'multiple', + type: 'boolean', + default: 'false', + description: 'Specifies if multiple values can be selected.' + }, + { + name: 'placeholder', + type: 'string', + default: 'null', + description: 'Default text to display when no option is selected.' + }, + { + name: 'loading', + type: 'boolean', + default: 'false', + description: 'Whether the multiselect is in loading state.' + }, + { + name: 'disabled', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should be disabled.' + }, + { + name: 'invalid', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should have invalid state style.' + }, + { + name: 'variant', + type: 'string', + default: 'null', + description: 'Specifies the input variant of the component.' + }, + { + name: 'dataKey', + type: 'string', + default: 'null', + description: 'A property to uniquely identify an option.' + }, + { + name: 'minLength', + type: 'number', + default: '1', + description: 'Minimum number of characters to initiate a search.' + }, + { + name: 'delay', + type: 'number', + default: '300', + description: 'Delay between keystrokes to wait before sending a query.' + }, + { + name: 'appendTo', + type: 'string', + default: 'body', + description: 'A valid query selector or an HTMLElement to specify where the overlay gets attached. Special keywords are "body" for document body and "self" for the element itself.' + }, + { + name: 'forceSelection', + type: 'boolean', + default: 'false', + description: 'When present, autocomplete clears the manual input if it does not match of the suggestions to force only accepting values from the suggestions.' + }, + { + name: 'completeOnFocus', + type: 'boolean', + default: 'false', + description: 'Whether to run a query when input receives focus.' + }, + { + name: 'inputId', + type: 'string', + default: 'null', + description: 'Identifier of the underlying input element.' + }, + { + name: 'inputStyle', + type: 'object', + default: 'null', + description: 'Inline style of the input field.' + }, + { + name: 'inputClass', + type: 'string | object', + default: 'null', + description: 'Style class of the input field.' + }, + { + name: 'inputProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLInputElement/HTMLSpanElement to the focusable input element inside the component.' + }, + { + name: 'panelStyle', + type: 'object', + default: 'null', + description: 'Inline style of the overlay panel.' + }, + { + name: 'panelClass', + type: 'string | object', + default: 'null', + description: 'Style class of the overlay panel.' + }, + { + name: 'panelProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLDivElement to the overlay panel inside the component.' + }, + { + name: 'dropdownIcon', + type: 'string', + default: 'null', + description: 'Icon to display in the dropdown.' + }, + { + name: 'dropdownClass', + type: 'string', + default: 'null', + description: 'Style class of the dropdown button.' + }, + { + name: 'loadingIcon', + type: 'string', + default: 'null', + description: 'Icon to display in loading state.' + }, + { + name: 'removeTokenIcon', + type: 'string', + default: 'null', + description: 'Icon to display in chip remove action.' + }, + { + name: 'virtualScrollerOptions', + type: 'object', + default: 'null', + description: 'Whether to use the virtualScroller feature. The properties of VirtualScroller component can be used like an object in it.' + }, + { + name: 'autoOptionFocus', + type: 'boolean', + default: 'false', + description: 'Whether to focus on the first visible or selected element when the overlay panel is shown.' + }, + { + name: 'selectOnFocus', + type: 'boolean', + default: 'false', + description: 'When enabled, the focused option is selected.' + }, + { + name: 'searchLocale', + type: 'string', + default: 'undefined', + description: "Locale to use in searching. The default locale is the host environment's current locale." + }, + { + name: 'searchMessage', + type: 'string', + default: '{0} results are available', + description: 'Text to be displayed in hidden accessible field when filtering returns any results. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'selectionMessage', + type: 'string', + default: '{0} items selected', + description: 'Text to be displayed in hidden accessible field when options are selected. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'emptySelectionMessage', + type: 'string', + default: 'No selected item', + description: 'Text to be displayed in hidden accessible field when any option is not selected. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'emptySearchMessage', + type: 'string', + default: 'No results found', + description: 'Text to display when filtering does not return any results. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'tabindex', + type: 'number', + default: '0', + description: 'Index of the element in tabbing order.' + }, + { + name: 'aria-label', + type: 'string', + default: 'null', + description: 'Defines a string value that labels an interactive element.' + }, + { + name: 'aria-labelledby', + type: 'string', + default: 'null', + description: 'Identifier of the underlying input element.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const AutoCompleteEvents = [ + { + name: 'change', + description: 'Callback to invoke on value change.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.value', + type: 'string', + description: 'Selected option value' + } + ] + }, + { + name: 'focus', + description: 'Callback to invoke when component receives focus.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Browser event' + } + ] + }, + { + name: 'blur', + description: 'Callback to invoke when component loses focus.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Browser event' + } + ] + }, + { + name: 'item-select', + description: 'Callback to invoke when a suggestion is selected.', + arguments: [ + { + name: 'originalEvent', + type: 'object', + description: 'Original event' + }, + { + name: 'value', + type: 'object', + description: 'Selected item' + } + ] + }, + { + name: 'item-unselect', + description: 'Callback to invoke when a selected value is removed.', + arguments: [ + { + name: 'originalEvent', + type: 'object', + description: 'Original event' + }, + { + name: 'value', + type: 'object', + description: 'Unselected item' + } + ] + }, + { + name: 'dropdown-click', + description: 'Callback to invoke to when dropdown button is clicked.', + arguments: [ + { + name: 'originalEvent', + type: 'object', + description: 'Original event' + }, + { + name: 'query', + type: 'string', + description: 'Current value of the input field' + } + ] + }, + { + name: 'clear', + description: 'Callback to invoke when input is cleared by the user.' + }, + { + name: 'complete', + description: 'Callback to invoke to search for suggestions.', + arguments: [ + { + name: 'originalEvent', + type: 'object', + description: 'Original event' + }, + { + name: 'query', + type: 'string', + description: 'Value to search with' + } + ] + }, + { + name: 'before-show', + description: 'Callback to invoke before the overlay is shown.' + }, + { + name: 'before-hide', + description: 'Callback to invoke before the overlay is hidden.' + }, + { + name: 'show', + description: 'Callback to invoke when the overlay is shown.' + }, + { + name: 'hide', + description: 'Callback to invoke when the overlay is hidden.' + } +]; + +const AutoCompleteSlots = [ + { + name: 'chip', + description: 'Custom content for the chip display.' + }, + { + name: 'header', + description: 'Custom content for the component header.' + }, + { + name: 'footer', + description: 'Custom content for the component footer.' + }, + { + name: 'item', + description: 'Custom content for the item.' + }, + { + name: 'option', + description: 'Custom content for the item.' + }, + { + name: 'optiongroup', + description: 'Custom content for the optiongroup item.' + }, + { + name: 'content', + description: 'Custom content for the virtual scroller.' + }, + { + name: 'loader', + description: 'Custom content for the virtual scroller loader items.' + }, + { + name: 'empty', + description: 'Custom empty template when there is no data to display.' + }, + { + name: 'dropdownicon', + description: 'Custom dropdown icon template.' + }, + { + name: 'removetokenicon', + description: 'Custom remove token icon template.' + }, + { + name: 'loadingicon', + description: 'Custom loading icon template.' + } +]; + +module.exports = { + autocomplete: { + name: 'AutoComplete', + description: 'AutoComplete is an input component that provides real-time suggestions when being typed.', + props: AutoCompleteProps, + events: AutoCompleteEvents, + slots: AutoCompleteSlots + } +}; diff --git a/apps/showcase/api-generator/components/avatar.js b/apps/showcase/api-generator/components/avatar.js new file mode 100644 index 000000000..396e4b681 --- /dev/null +++ b/apps/showcase/api-generator/components/avatar.js @@ -0,0 +1,75 @@ +const AvatarProps = [ + { + name: 'label', + type: 'string', + default: 'null', + description: 'Defines the text to display.' + }, + { + name: 'icon', + type: 'string', + default: 'null', + description: 'Defines the icon to display.' + }, + { + name: 'image', + type: 'string', + default: 'null', + description: 'Defines the image to display.' + }, + { + name: 'size', + type: 'string', + default: 'null', + description: 'Size of the element, valid options are "large" and "xlarge".' + }, + { + name: 'shape', + type: 'string', + default: 'square', + description: 'Shape of the element, valid options are "square" and "circle".' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const AvatarSlots = [ + { + name: 'icon', + description: 'Custom icon template.' + } +]; + +const AvatarEvents = [ + { + name: 'error', + description: 'Triggered when an error occurs while loading an image file.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Browser event' + } + ] + } +]; + +module.exports = { + avatar: { + name: 'Avatar', + description: 'Avatar represents people using icons, labels and images.', + props: AvatarProps, + slots: AvatarSlots, + events: AvatarEvents + } +}; diff --git a/apps/showcase/api-generator/components/avatargroup.js b/apps/showcase/api-generator/components/avatargroup.js new file mode 100644 index 000000000..3370038ca --- /dev/null +++ b/apps/showcase/api-generator/components/avatargroup.js @@ -0,0 +1,53 @@ +const AvatarGroupProps = [ + { + name: 'label', + type: 'string', + default: 'null', + description: 'Defines the text to display.' + }, + { + name: 'icon', + type: 'string', + default: 'null', + description: 'Defines the icon to display.' + }, + { + name: 'image', + type: 'string', + default: 'null', + description: 'Defines the image to display.' + }, + { + name: 'size', + type: 'string', + default: 'null', + description: 'Size of the element, valid options are "large" and "xlarge".' + }, + { + name: 'shape', + type: 'string', + default: 'square', + description: 'Shape of the element, valid options are "square" and "circle".' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +module.exports = { + avatargroup: { + name: 'AvatarGroup', + 'doc-url': 'avatar', + description: 'A set of Avatars can be displayed together using the AvatarGroup component.', + props: AvatarGroupProps + } +}; diff --git a/apps/showcase/api-generator/components/badge.js b/apps/showcase/api-generator/components/badge.js new file mode 100644 index 000000000..2eb0a0151 --- /dev/null +++ b/apps/showcase/api-generator/components/badge.js @@ -0,0 +1,40 @@ +const BadgeProps = [ + { + name: 'value', + type: 'string | number', + default: 'null', + description: 'Value to display inside the badge.' + }, + { + name: 'severity', + type: 'string', + default: 'null', + description: 'Severity type of the badge. Valid severities are "secondary", "success", "info", "warn", "danger" and "contrast".' + }, + { + name: 'size', + type: 'string', + default: 'null', + description: 'Size of the badge, valid options are "large" and "xlarge".' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +module.exports = { + badge: { + name: 'Badge', + description: 'Badge is a small status indicator for another element.', + props: BadgeProps + } +}; diff --git a/apps/showcase/api-generator/components/badgedirective.js b/apps/showcase/api-generator/components/badgedirective.js new file mode 100644 index 000000000..07dbe6d48 --- /dev/null +++ b/apps/showcase/api-generator/components/badgedirective.js @@ -0,0 +1,26 @@ +const BadgeDirectiveModifiers = [ + { + name: 'success', + description: 'Overrides default severity color' + }, + { + name: 'info', + description: 'Default color for severity levels' + }, + { + name: 'warn', + description: 'Overrides default severity color' + }, + { + name: 'danger', + description: 'Overrides default severity color' + } +]; + +module.exports = { + badgedirective: { + name: 'BadgeDirective', + description: 'When Badge used as a directive, badge needs to be configured at the application with a name of your choice.', + 'vue-modifiers': BadgeDirectiveModifiers + } +}; diff --git a/apps/showcase/api-generator/components/blockui.js b/apps/showcase/api-generator/components/blockui.js new file mode 100644 index 000000000..640559f8b --- /dev/null +++ b/apps/showcase/api-generator/components/blockui.js @@ -0,0 +1,58 @@ +const BlockUIProps = [ + { + name: 'blocked', + type: 'array', + default: 'null', + description: 'Controls the blocked state.' + }, + { + name: 'fullscreen', + type: 'menuitem', + default: 'null', + description: 'When enabled, the whole document gets blocked.' + }, + { + name: 'baseZIndex', + type: 'number', + default: '0', + description: 'Base zIndex value to use in layering.' + }, + { + name: 'autoZIndex', + type: 'boolean', + default: 'true', + description: 'Whether to automatically manage layering.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const BlockUIEvents = [ + { + name: 'block', + description: 'Fired when the element gets blocked.' + }, + { + name: 'unblock', + description: 'Fired when the element gets unblocked.' + } +]; + +module.exports = { + blockui: { + name: 'BlockUI', + description: 'BlockUI can either block other components or the whole page.', + props: BlockUIProps, + events: BlockUIEvents + } +}; diff --git a/apps/showcase/api-generator/components/breadcrumb.js b/apps/showcase/api-generator/components/breadcrumb.js new file mode 100644 index 000000000..84e1c106f --- /dev/null +++ b/apps/showcase/api-generator/components/breadcrumb.js @@ -0,0 +1,50 @@ +const BreadcrumbProps = [ + { + name: 'model', + type: 'array', + default: 'null', + description: 'An array of menuitems.' + }, + { + name: 'home', + type: 'menuitem', + default: 'null', + description: 'Configuration for the home icon.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const BreadcrumbSlots = [ + { + name: 'item', + description: 'Custom item template.' + }, + { + name: 'separator', + description: 'Custom separator template.' + }, + { + name: 'itemicon', + description: 'Custom item icon template.' + } +]; + +module.exports = { + breadcrumb: { + name: 'Breadcrumb', + description: 'Breadcrumb provides contextual information about page hierarchy.', + props: BreadcrumbProps, + slots: BreadcrumbSlots + } +}; diff --git a/apps/showcase/api-generator/components/button.js b/apps/showcase/api-generator/components/button.js new file mode 100644 index 000000000..87f1b0437 --- /dev/null +++ b/apps/showcase/api-generator/components/button.js @@ -0,0 +1,133 @@ +const ButtonProps = [ + { + name: 'label', + type: 'string', + default: 'null', + description: 'Text of the button.' + }, + { + name: 'icon', + type: 'string', + default: 'null', + description: 'Name of the icon.' + }, + { + name: 'iconPos', + type: 'string', + default: 'left', + description: 'Position of the icon, valid values are "left", "right", "bottom" and "top".' + }, + { + name: 'iconClass', + type: 'string', + default: 'null', + description: 'Style class of the icon.' + }, + { + name: 'badge', + type: 'string', + default: 'null', + description: 'Value of the badge.' + }, + { + name: 'badgeClass', + type: 'string', + default: 'null', + description: 'Style class of the badge.' + }, + { + name: 'loading', + type: 'boolean', + default: 'false', + description: 'Whether the button is in loading state.' + }, + { + name: 'loadingIcon', + type: 'string', + default: 'pi pi-spinner pi-spin', + description: 'Icon to display in loading state.' + }, + { + name: 'link', + type: 'boolean', + default: 'false', + description: 'Add a link style to the button.' + }, + { + name: 'severity', + type: 'string', + default: 'null', + description: 'Defines the style of the button, valid values are "secondary", "success", "info", "warn", "help", "danger", "contrast".' + }, + { + name: 'raised', + type: 'boolean', + default: 'false', + description: 'Add a shadow to indicate elevation.' + }, + { + name: 'rounded', + type: 'boolean', + default: 'false', + description: 'Add a circular border radius to the button.' + }, + { + name: 'text', + type: 'boolean', + default: 'false', + description: 'Add a textual class to the button without a background initially.' + }, + { + name: 'outlined', + type: 'boolean', + default: 'false', + description: 'Add a border class without a background initially.' + }, + { + name: 'size', + type: 'string', + default: 'null', + description: 'Defines the size of the button, valid values are "small" and "large".' + }, + { + name: 'plain', + type: 'boolean', + default: 'false', + description: 'Add a plain textual class to the button without a background initially.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const ButtonEvents = []; + +const ButtonSlots = [ + { + name: 'icon', + description: 'Custom icon template.' + }, + { + name: 'loadingicon', + description: 'Custom loading icon template.' + } +]; + +module.exports = { + button: { + name: 'Button', + description: 'Button is an extension to standard button element with icons and theming.', + props: ButtonProps, + events: ButtonEvents, + slots: ButtonSlots + } +}; diff --git a/apps/showcase/api-generator/components/calendar.js b/apps/showcase/api-generator/components/calendar.js new file mode 100644 index 000000000..9e5f3acbe --- /dev/null +++ b/apps/showcase/api-generator/components/calendar.js @@ -0,0 +1,512 @@ +const CalendarProps = [ + { + name: 'modelValue', + type: 'any', + default: 'null', + description: 'Value of the component.' + }, + { + name: 'selectionMode', + type: 'string', + default: 'single', + description: 'Defines the quantity of the selection, valid values are "single", "multiple" and "range".' + }, + { + name: 'dateFormat', + type: 'string', + default: 'null', + description: 'Format of the date. Defaults to PrimeVue Locale configuration.' + }, + { + name: 'inline', + type: 'boolean', + default: 'false', + description: 'When enabled, displays the calendar as inline instead of an overlay.' + }, + { + name: 'showOtherMonths', + type: 'boolean', + default: 'true', + description: 'Whether to display dates in other months (non-selectable) at the start or end of the current month. To make these days selectable use the selectOtherMonths option.' + }, + { + name: 'selectOtherMonths', + type: 'boolean', + default: 'false', + description: 'Whether days in other months shown before or after the current month are selectable. This only applies if the showOtherMonths option is set to true.' + }, + { + name: 'showIcon', + type: 'boolean', + default: 'false', + description: 'When enabled, displays a button with icon next to input.' + }, + { + name: 'icon', + type: 'string', + default: 'null', + description: 'Icon of the calendar button.' + }, + { + name: 'prevIcon', + type: 'string', + default: 'null', + description: 'Icon to show in the previous button.' + }, + { + name: 'nextIcon', + type: 'string', + default: 'null', + description: 'Icon to show in the next button.' + }, + { + name: 'incrementIcon', + type: 'string', + default: 'null', + description: 'Icon to show in each of the increment buttons.' + }, + { + name: 'decrementIcon', + type: 'string', + default: 'null', + description: 'Icon to show in each of the decrement buttons.' + }, + { + name: 'numberOfMonths', + type: 'number', + default: '1', + description: 'Number of months to display.' + }, + { + name: 'view', + type: 'string', + default: 'date', + description: 'Type of view to display, valid valids are "date" for datepicker and "month" for month picker.' + }, + { + name: 'monthNavigator', + type: 'boolean', + default: 'false', + description: 'Whether the month should be rendered as a dropdown instead of text.' + }, + { + name: 'yearNavigator', + type: 'boolean', + default: 'false', + description: 'Whether the year should be rendered as a dropdown instead of text.' + }, + { + name: 'yearRange', + type: 'string', + default: 'null', + description: 'The range of years displayed in the year drop-down in (nnnn:nnnn) format such as (2000:2020).' + }, + { + name: 'panelClass', + type: 'string', + default: 'null', + description: 'Style class of the datetimepicker panel.' + }, + { + name: 'minDate', + type: 'Date', + default: 'null', + description: 'The minimum selectable date.' + }, + { + name: 'maxDate', + type: 'Date', + default: 'null', + description: 'The maximum selectable date.' + }, + { + name: 'disabledDates', + type: 'array', + default: 'null', + description: 'Array with dates to disable.' + }, + { + name: 'disabledDays', + type: 'array', + default: 'null', + description: 'Array with disabled weekday numbers.' + }, + { + name: 'maxDateCount', + type: 'number', + default: 'null', + description: 'Maximum number of selectable dates in multiple mode.' + }, + { + name: 'showOnFocus', + type: 'boolean', + default: 'true', + description: 'When disabled, datepicker will not be visible with input focus.' + }, + { + name: 'autoZIndex', + type: 'boolean', + default: 'true', + description: 'Whether to automatically manage layering.' + }, + { + name: 'baseZIndex', + type: 'number', + default: '0', + description: 'Base zIndex value to use in layering.' + }, + { + name: 'showButtonBar', + type: 'boolean', + default: 'false', + description: 'Whether to display today and clear buttons at the footer' + }, + { + name: 'shortYearCutoff', + type: 'string', + default: '+10', + description: 'The cutoff year for determining the century for a date.' + }, + { + name: 'showTime', + type: 'boolean', + default: 'false', + description: 'Whether to display timepicker.' + }, + { + name: 'timeOnly', + type: 'boolean', + default: 'false', + description: 'Whether to display timepicker only.' + }, + { + name: 'hourFormat', + type: 'string', + default: '24', + description: 'Specifies 12 or 24 hour format.' + }, + { + name: 'stepHour', + type: 'number', + default: '1', + description: 'Hours to change per step.' + }, + { + name: 'stepMinute', + type: 'number', + default: '1', + description: 'Minutes to change per step.' + }, + { + name: 'stepSeconds', + type: 'number', + default: '1', + description: 'Seconds to change per step.' + }, + { + name: 'showSeconds', + type: 'boolean', + default: 'false', + description: 'Whether to show the seconds in time picker.' + }, + { + name: 'hideOnDateTimeSelect', + type: 'boolean', + default: 'false', + description: 'Whether to hide the overlay on date selection when showTime is enabled.' + }, + { + name: 'hideOnRangeSelection', + type: 'boolean', + default: 'false', + description: 'Whether to hide the overlay on date selection is completed when selectionMode is range.' + }, + { + name: 'timeSeparator', + type: 'string', + default: ':', + description: 'Separator of time selector.' + }, + { + name: 'showWeek', + type: 'boolean', + default: 'false', + description: 'When enabled, calendar will show week numbers.' + }, + { + name: 'manualInput', + type: 'boolean', + default: 'true', + description: 'Whether to allow entering the date manually via typing.' + }, + { + name: 'appendTo', + type: 'string', + default: 'body', + description: 'A valid query selector or an HTMLElement to specify where the overlay gets attached. Special keywords are "body" for document body and "self" for the element itself.' + }, + { + name: 'disabled', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the element should be disabled.' + }, + { + name: 'invalid', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should have invalid state style.' + }, + { + name: 'variant', + type: 'string', + default: 'null', + description: 'Specifies the input variant of the component.' + }, + { + name: 'readonly', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that an input field is read-only.' + }, + { + name: 'placeholder', + type: 'string', + default: 'null', + description: 'Placeholder text for the input.' + }, + { + name: 'id', + type: 'string', + default: 'null', + description: 'Identifier of the element.' + }, + { + name: 'inputId', + type: 'string', + default: 'null', + description: 'Identifier of the underlying input element.' + }, + { + name: 'inputClass', + type: 'string | object', + default: 'null', + description: 'Style class of the input field.' + }, + { + name: 'inputStyle', + type: 'object', + default: 'null', + description: 'Inline style of the input field.' + }, + { + name: 'inputProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLInputElement to the focusable input element inside the component.' + }, + { + name: 'panelClass', + type: 'string | object', + default: 'null', + description: 'Style class of the overlay panel.' + }, + { + name: 'panelStyle', + type: 'object', + default: 'null', + description: 'Inline style of the overlay panel.' + }, + { + name: 'panelProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLDivElement to the overlay panel inside the component.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const CalendarEvents = [ + { + name: 'input', + description: 'Callback to invoke when input field is being typed.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'New date' + } + ] + }, + { + name: 'date-select', + description: 'Callback to invoke when a date is selected.', + arguments: [ + { + name: 'value', + type: 'Date', + description: 'Selected value' + } + ] + }, + { + name: 'show', + description: 'Callback to invoke when datepicker panel is shown.' + }, + { + name: 'hide', + description: 'Callback to invoke when datepicker panel is hidden.' + }, + { + name: 'today-click', + description: 'Callback to invoke when today button is clicked.', + arguments: [ + { + name: 'date', + type: 'Date', + description: 'Today as a date instance' + } + ] + }, + { + name: 'clear-click', + description: 'Callback to invoke when clear button is clicked.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Click event' + } + ] + }, + { + name: 'month-change', + description: 'Callback to invoke when a month is changed using the navigators.', + arguments: [ + { + name: 'event.month', + type: 'number', + description: 'New month' + }, + { + name: 'event.year', + type: 'number', + description: 'New year' + } + ] + }, + { + name: 'year-change', + description: 'Callback to invoke when a year is changed using the navigators.', + arguments: [ + { + name: 'event.month', + type: 'number', + description: 'New month' + }, + { + name: 'event.year', + type: 'number', + description: 'New year' + } + ] + }, + { + name: 'focus', + description: 'Callback to invoke on focus of input field.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Focus event' + } + ] + }, + { + name: 'blur', + description: 'Callback to invoke on blur of input field.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.value', + type: 'string', + description: 'Input value' + } + ] + }, + { + name: 'keydown', + description: 'Callback to invoke when a key is pressed.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Keydown event' + } + ] + } +]; + +const CalendarSlots = [ + { + name: 'header', + description: 'Custom content for the component header.' + }, + { + name: 'footer', + description: 'Custom content for the component footer.' + }, + { + name: 'date', + description: 'Custom content for the calendar cell.' + }, + { + name: 'decade', + description: 'Custom content for the calendar decade.' + }, + { + name: 'dropdownicon', + description: 'Custom dropdown icon template.' + }, + { + name: 'prevIcon', + description: 'Custom previous icon template.' + }, + { + name: 'nexticon', + description: 'Custom next icon template.' + }, + { + name: 'incrementicon', + description: 'Custom increment icon template.' + }, + { + name: 'decrementicon', + description: 'Custom decrement icon template.' + } +]; + +module.exports = { + calendar: { + name: 'Calendar', + description: 'Calendar is an input component to select a date.', + props: CalendarProps, + events: CalendarEvents, + slots: CalendarSlots + } +}; diff --git a/apps/showcase/api-generator/components/card.js b/apps/showcase/api-generator/components/card.js new file mode 100644 index 000000000..bfbb4700d --- /dev/null +++ b/apps/showcase/api-generator/components/card.js @@ -0,0 +1,46 @@ +const CardProps = [ + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const CardSlots = [ + { + name: 'header', + description: 'Custom content for the component header.' + }, + { + name: 'title', + description: 'Custom content for the component title.' + }, + { + name: 'subtitle', + description: 'Custom content for the component subtitle.' + }, + { + name: 'content', + description: 'Custom content for the component content.' + }, + { + name: 'footer', + description: 'Custom content for the component footer.' + } +]; + +module.exports = { + card: { + name: 'Card', + description: 'Card is a flexible container component.', + props: CardProps, + slots: CardSlots + } +}; diff --git a/apps/showcase/api-generator/components/carousel.js b/apps/showcase/api-generator/components/carousel.js new file mode 100644 index 000000000..8ba6a7c39 --- /dev/null +++ b/apps/showcase/api-generator/components/carousel.js @@ -0,0 +1,138 @@ +const CarouselProps = [ + { + name: 'value', + type: 'array', + default: 'null', + description: 'An array of objects to display.' + }, + { + name: 'page', + type: 'number', + default: 'null', + description: 'Index of the first item.' + }, + { + name: 'circular', + type: 'boolean', + default: 'false', + description: 'Defines if scrolling would be infinite.' + }, + { + name: 'autoplayInterval', + type: 'number', + default: 'null', + description: 'Time in milliseconds to scroll items automatically.' + }, + { + name: 'numVisible', + type: 'number', + default: '1', + description: 'Number of items per page.' + }, + { + name: 'numScroll', + type: 'number', + default: '1', + description: 'Number of items to scroll.' + }, + { + name: 'responsiveOptions', + type: 'any', + default: 'null', + description: 'An array of options for responsive design.' + }, + { + name: 'orientation', + type: 'string', + default: 'horizontal', + description: 'Specifies the layout of the component, valid values are "horizontal" and "vertical".' + }, + { + name: 'verticalViewPortHeight', + type: 'string', + default: '300px', + description: 'Height of the viewport in vertical layout.' + }, + { + name: 'contentClass', + type: 'string', + default: 'null', + description: 'Style class of main content.' + }, + { + name: 'containerClass', + type: 'string', + default: 'null', + description: 'Style class of the viewport container.' + }, + { + name: 'indicatorsContentClass', + type: 'string', + default: 'null', + description: 'Style class of the indicator items.' + }, + { + name: 'showNavigators', + type: 'boolean', + default: 'true', + description: 'Whether to display navigation buttons in container.' + }, + { + name: 'showIndicators', + type: 'boolean', + default: 'true', + description: 'Whether to display indicator container.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const CarouselSlots = [ + { + name: 'header', + description: 'Custom content for the component header.' + }, + { + name: 'header', + description: 'Custom content for the component header.' + }, + { + name: 'footer', + description: 'Custom content for the component footer.' + }, + { + name: 'item', + description: 'Custom content for the component item.' + }, + { + name: 'previcon', + description: 'Custom previous icon template.' + }, + { + name: 'nexticon', + description: 'Custom next icon template.' + }, + { + name: 'empty', + description: 'Custom content when there is no data to display.' + } +]; + +module.exports = { + carousel: { + name: 'Carousel', + description: 'Carousel is a content slider featuring various customization options.', + props: CarouselProps, + slots: CarouselSlots + } +}; diff --git a/apps/showcase/api-generator/components/cascadeselect.js b/apps/showcase/api-generator/components/cascadeselect.js new file mode 100644 index 000000000..4a870edb4 --- /dev/null +++ b/apps/showcase/api-generator/components/cascadeselect.js @@ -0,0 +1,333 @@ +const CascadeSelectProps = [ + { + name: 'modelValue', + type: 'any', + default: 'null', + description: 'Value of the component.' + }, + { + name: 'options', + type: 'array', + default: 'null', + description: 'An array of selectitems to display as the available options.' + }, + { + name: 'optionLabel', + type: 'string | function', + default: 'null', + description: 'Property name or getter function to use as the label of an option.' + }, + { + name: 'optionValue', + type: 'string | function', + default: 'null', + description: 'Property name or getter function to use as the value of an option, defaults to the option itself when not defined.' + }, + { + name: 'optionDisabled', + type: 'boolean', + default: 'null', + description: 'Property name or getter function to use as the disabled flag of an option, defaults to false when not defined.' + }, + { + name: 'optionGroupLabel', + type: 'string | function', + default: 'null', + description: 'Property name or getter function to use as the label of an option group.' + }, + { + name: 'optionGroupChildren', + type: 'array | function', + default: 'null', + description: 'Property name or getter function to retrieve the items of a group.' + }, + { + name: 'placeholder', + type: 'string', + default: 'null', + description: 'Default text to display when no option is selected.' + }, + { + name: 'disabled', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should be disabled.' + }, + { + name: 'invalid', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should have invalid state style.' + }, + { + name: 'variant', + type: 'string', + default: 'null', + description: 'Specifies the input variant of the component.' + }, + { + name: 'dataKey', + type: 'string', + default: 'null', + description: 'A property to uniquely identify an option.' + }, + { + name: 'inputStyle', + type: 'object', + default: 'null', + description: 'Inline style of the input field.' + }, + { + name: 'inputClass', + type: 'string | object', + default: 'null', + description: 'Style class of the input field.' + }, + { + name: 'inputProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLInputElement/HTMLSpanElement to the focusable input element inside the component.' + }, + { + name: 'panelStyle', + type: 'object', + default: 'null', + description: 'Inline style of the overlay panel.' + }, + { + name: 'panelClass', + type: 'string | object', + default: 'null', + description: 'Style class of the overlay panel.' + }, + { + name: 'panelProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLDivElement to the overlay panel inside the component.' + }, + { + name: 'appendTo', + type: 'string', + default: 'body', + description: 'A valid query selector or an HTMLElement to specify where the overlay gets attached. Special keywords are "body" for document body and "self" for the element itself.' + }, + { + name: 'loading', + type: 'boolean', + default: 'false', + description: 'Whether the multiselect is in loading state.' + }, + { + name: 'dropdownIcon', + type: 'string', + default: 'null', + description: 'Icon to display in the dropdown.' + }, + { + name: 'loadingIcon', + type: 'string', + default: 'null', + description: 'Icon to display in loading state.' + }, + { + name: 'optionGroupIcon', + type: 'string', + default: 'null', + description: 'Icon to display in the option group.' + }, + { + name: 'autoOptionFocus', + type: 'boolean', + default: 'false', + description: 'Whether to focus on the first visible or selected element when the overlay panel is shown.' + }, + { + name: 'selectOnFocus', + type: 'boolean', + default: 'false', + description: 'When enabled, the focused option is selected/opened.' + }, + { + name: 'searchLocale', + type: 'string', + default: 'undefined', + description: "Locale to use in searching. The default locale is the host environment's current locale." + }, + { + name: 'searchMessage', + type: 'string', + default: '{0} results are available', + description: 'Text to be displayed in hidden accessible field when filtering returns any results. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'selectionMessage', + type: 'string', + default: '{0} items selected', + description: 'Text to be displayed in hidden accessible field when options are selected. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'emptySelectionMessage', + type: 'string', + default: 'No selected item', + description: 'Text to be displayed in hidden accessible field when any option is not selected. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'emptySearchMessage', + type: 'string', + default: 'No results found', + description: 'Text to display when filtering does not return any results. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'tabindex', + type: 'number', + default: '0', + description: 'Index of the element in tabbing order.' + }, + { + name: 'aria-label', + type: 'string', + default: 'null', + description: 'Defines a string value that labels an interactive element.' + }, + { + name: 'aria-labelledby', + type: 'string', + default: 'null', + description: 'Identifier of the underlying input element.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const CascadeSelectEvents = [ + { + name: 'change', + description: 'Callback to invoke on value change.', + arguments: [ + { + name: 'originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'value', + type: 'object', + description: 'Selected option value' + } + ] + }, + { + name: 'focus', + description: 'Callback to invoke when component receives focus.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Browser event' + } + ] + }, + { + name: 'blur', + description: 'Callback to invoke when component loses focus.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Browser event' + } + ] + }, + { + name: 'click', + description: 'Callback to invoke on click.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Browser event' + } + ] + }, + { + name: 'group-change', + description: 'Callback to invoke when a group changes.', + arguments: [ + { + name: 'originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'value', + type: 'object', + description: 'Selected option value' + } + ] + }, + { + name: 'before-show', + description: 'Callback to invoke before the overlay is shown.' + }, + { + name: 'before-hide', + description: 'Callback to invoke before the overlay is hidden.' + }, + { + name: 'show', + description: 'Callback to invoke when the overlay is shown.' + }, + { + name: 'hide', + description: 'Callback to invoke when the overlay is hidden.' + } +]; + +const CascadeSelectSlots = [ + { + name: 'value', + description: "Custom content for the item's value." + }, + { + name: 'option', + description: "Custom content for the item's option." + }, + { + name: 'indicator', + description: 'Custom content for the dropdown indicator.' + }, + { + name: 'dropdownicon', + description: 'Custom dropdown icon template.' + }, + { + name: 'loadingicon', + description: 'Custom loading icon template.' + }, + { + name: 'optiongroupicon', + description: 'Custom content for the option group icon.' + } +]; + +module.exports = { + cascadeselect: { + name: 'CascadeSelect', + description: 'CascadeSelect displays a nested structure of options.', + props: CascadeSelectProps, + events: CascadeSelectEvents, + slots: CascadeSelectSlots + } +}; diff --git a/apps/showcase/api-generator/components/chart.js b/apps/showcase/api-generator/components/chart.js new file mode 100644 index 000000000..f76d90f73 --- /dev/null +++ b/apps/showcase/api-generator/components/chart.js @@ -0,0 +1,104 @@ +const ChartProps = [ + { + name: 'type', + type: 'string', + default: 'null', + description: 'Type of the chart.' + }, + { + name: 'data', + type: 'any', + default: 'null', + description: 'Data to display.' + }, + { + name: 'options', + type: 'any', + default: 'null', + description: 'Options to customize the chart.' + }, + { + name: 'plugins', + type: 'any', + default: 'null', + description: 'Used to custom plugins of the chart.' + }, + { + name: 'width', + type: 'number', + default: '300', + description: 'Width of the chart in non-responsive mode.' + }, + { + name: 'height', + type: 'number', + default: '150', + description: 'Height of the chart in non-responsive mode.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const ChartEvents = [ + { + name: 'select', + description: 'Callback to invoke when a tab gets expanded.', + arguments: [ + { + name: 'originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'dataset', + type: 'object', + description: 'Selected dataset' + }, + { + name: 'element', + type: 'object', + description: 'Selected element' + }, + { + name: 'element._datasetIndex', + type: 'number', + description: 'Index of the dataset in data' + }, + { + name: 'element._index', + type: 'number', + description: 'Index of the data in dataset' + } + ] + }, + { + name: 'loaded', + description: 'Callback to invoke when chart is loaded.', + arguments: [ + { + name: 'chart', + type: 'object', + description: 'Chart instance.' + } + ] + } +]; + +module.exports = { + chart: { + name: 'Chart', + description: 'Chart components are based on Charts.js, an open source HTML5 based charting library.', + props: ChartProps, + events: ChartEvents + } +}; diff --git a/apps/showcase/api-generator/components/checkbox.js b/apps/showcase/api-generator/components/checkbox.js new file mode 100644 index 000000000..fc05fa217 --- /dev/null +++ b/apps/showcase/api-generator/components/checkbox.js @@ -0,0 +1,148 @@ +const CheckboxProps = [ + { + name: 'value', + type: 'any', + default: 'null', + description: 'Value of the checkbox.' + }, + { + name: 'modelValue', + type: 'any', + default: 'null', + description: 'Value binding of the checkbox.' + }, + { + name: 'binary', + type: 'boolean', + default: 'false', + description: 'Allows to select a boolean value instead of multiple values.' + }, + { + name: 'disabled', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the element should be disabled.' + }, + { + name: 'invalid', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should have invalid state style.' + }, + { + name: 'variant', + type: 'string', + default: 'null', + description: 'Specifies the input variant of the component.' + }, + { + name: 'readonly', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that an input field is read-only.' + }, + { + name: 'required', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the element is required.' + }, + { + name: 'tabindex', + type: 'number', + default: 'null', + description: 'Index of the element in tabbing order.' + }, + { + name: 'trueValue', + type: 'any', + default: 'null', + description: 'Value in checked state.' + }, + { + name: 'falseValue', + type: 'any', + default: 'null', + description: 'Value in unchecked state.' + }, + { + name: 'inputId', + type: 'string', + default: 'null', + description: 'Identifier of the underlying input element.' + }, + { + name: 'inputClass', + type: 'string | object', + default: 'null', + description: 'Style class of the input field.' + }, + { + name: 'inputStyle', + type: 'object', + default: 'null', + description: 'Inline style of the input field.' + }, + { + name: 'inputProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLInputElement to the focusable input element inside the component.' + }, + { + name: 'aria-labelledby', + type: 'string', + default: 'null', + description: 'Establishes relationships between the component and label(s) where its value should be one or more element IDs.' + }, + { + name: 'aria-label', + type: 'string', + default: 'null', + description: 'Used to define a string that labels the element.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const CheckboxEvents = [ + { + name: 'click', + description: 'Callback to invoke on value click.' + }, + { + name: 'change', + description: 'Callback to invoke on value change.' + }, + { + name: 'input', + description: 'Callback to invoke on value change.' + } +]; + +const CheckboxSlots = [ + { + name: 'icon', + description: 'Custom icon template.' + } +]; + +module.exports = { + checkbox: { + name: 'Checkbox', + description: 'Checkbox is an extension to standard checkbox element with theming.', + props: CheckboxProps, + events: CheckboxEvents, + slots: CheckboxSlots + } +}; diff --git a/apps/showcase/api-generator/components/chip.js b/apps/showcase/api-generator/components/chip.js new file mode 100644 index 000000000..e0b6f170f --- /dev/null +++ b/apps/showcase/api-generator/components/chip.js @@ -0,0 +1,79 @@ +const ChipProps = [ + { + name: 'label', + type: 'string', + default: 'null', + description: 'Defines the text to display.' + }, + { + name: 'icon', + type: 'string', + default: 'null', + description: 'Defines the icon to display.' + }, + { + name: 'image', + type: 'string', + default: 'null', + description: 'Defines the image to display.' + }, + { + name: 'removable', + type: 'boolean', + default: 'false', + description: 'Whether to display a remove icon.' + }, + { + name: 'removeIconClass', + type: 'string', + default: 'pi pi-times-circle', + description: 'Icon of the remove element.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const ChipEvents = [ + { + name: 'remove', + description: 'Callback to invoke when a chip is removed.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Browser event' + } + ] + } +]; + +const ChipSlots = [ + { + name: 'icon', + description: 'Custom icon template of chip component.' + }, + { + name: 'removeicon', + description: 'Custom remove icon template of chip component.' + } +]; + +module.exports = { + chip: { + name: 'Chip', + description: 'Chip represents entities using icons, labels and images', + props: ChipProps, + events: ChipEvents, + slots: ChipSlots + } +}; diff --git a/apps/showcase/api-generator/components/chips.js b/apps/showcase/api-generator/components/chips.js new file mode 100644 index 000000000..84235776e --- /dev/null +++ b/apps/showcase/api-generator/components/chips.js @@ -0,0 +1,148 @@ +const ChipsProps = [ + { + name: 'modelValue', + type: 'array', + default: 'null', + description: 'Value of the component.' + }, + { + name: 'max', + type: 'number', + default: 'null', + description: 'Maximum number of entries allowed.' + }, + { + name: 'separator', + type: 'string', + default: 'null', + description: 'Separator char to add an item when pressed in addition to the enter key. Currently only possible value is ","' + }, + { + name: 'addOnBlur', + type: 'boolean', + default: 'false', + description: 'Whether to add an item when the input loses focus.' + }, + { + name: 'allowDuplicate', + type: 'boolean', + default: 'false', + description: 'Whether to allow duplicate values or not.' + }, + { + name: 'disabled', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the element should be disabled.' + }, + { + name: 'invalid', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should have invalid state style.' + }, + { + name: 'variant', + type: 'string', + default: 'null', + description: 'Specifies the input variant of the component.' + }, + { + name: 'placeholder', + type: 'string', + default: 'null', + description: 'Placeholder text for the input.' + }, + { + name: 'inputId', + type: 'string', + default: 'null', + description: 'Identifier of the focus input to match a label defined for the chips.' + }, + { + name: 'inputClass', + type: 'string | object', + default: 'null', + description: 'Style class of the input field.' + }, + { + name: 'inputStyle', + type: 'object', + default: 'null', + description: 'Inline style of the input field.' + }, + { + name: 'inputProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLInputElement to the focusable input element inside the component.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const ChipsEvents = [ + { + name: 'add', + description: 'Callback to invoke when a chip is added.', + arguments: [ + { + name: 'originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'value', + type: 'array', + description: 'Added item value' + } + ] + }, + { + name: 'remove', + description: 'Callback to invoke when a chip is removed.', + arguments: [ + { + name: 'originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'value', + type: 'array', + description: 'Removed item value' + } + ] + } +]; + +const ChipsSlots = [ + { + name: 'chips', + description: 'Custom content for the chips' + }, + { + name: 'removetokenicon', + description: 'Custom remove token icon template.' + } +]; + +module.exports = { + chips: { + name: 'chips', + description: 'Chips is used to enter multiple values on an input field.', + props: ChipsProps, + events: ChipsEvents, + slots: ChipsSlots + } +}; diff --git a/apps/showcase/api-generator/components/colorpicker.js b/apps/showcase/api-generator/components/colorpicker.js new file mode 100644 index 000000000..c03ac406c --- /dev/null +++ b/apps/showcase/api-generator/components/colorpicker.js @@ -0,0 +1,122 @@ +const ColorPickerProps = [ + { + name: 'modelValue', + type: 'string', + default: 'null', + description: 'Value of the component.' + }, + { + name: 'defaultColor', + type: 'string', + default: 'ff0000', + description: 'Initial color to display when value is not defined.' + }, + { + name: 'inline', + type: 'boolean', + default: 'false', + description: 'Whether to display as an overlay or not.' + }, + { + name: 'format', + type: 'string', + default: 'hex', + description: 'Format to use in value binding, supported formats are "hex", "rgb" and "hsb".' + }, + { + name: 'disabled', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should be disabled.' + }, + { + name: 'tabindex', + type: 'string', + default: 'null', + description: 'Index of the element in tabbing order.' + }, + { + name: 'baseZIndex', + type: 'number', + default: '0', + description: 'Base zIndex value to use in layering.' + }, + { + name: 'autoZIndex', + type: 'boolean', + default: 'true', + description: 'Whether to automatically manage layering.' + }, + { + name: 'panelClass', + type: 'string', + default: 'null', + description: 'Style class of the overlay panel.' + }, + { + name: 'appendTo', + type: 'string', + default: 'body', + description: 'A valid query selector or an HTMLElement to specify where the overlay gets attached. Special keywords are "body" for document body and "self" for the element itself.' + }, + { + name: 'aria-labelledby', + type: 'string', + default: 'null', + description: 'Establishes relationships between the component and label(s) where its value should be one or more element IDs.' + }, + { + name: 'aria-label', + type: 'string', + default: 'null', + description: 'Used to define a string that labels the element.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const ColorPickerEvents = [ + { + name: 'change', + description: 'Callback to invoke when a color is selected.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Original event' + }, + { + name: 'event.value', + type: 'any', + description: 'Selected color' + } + ] + }, + { + name: 'show', + description: 'Callback to invoke when popup is shown.' + }, + { + name: 'hide', + description: 'Callback to invoke when popup is hidden.' + } +]; + +module.exports = { + colorpicker: { + name: 'ColorPicker', + description: 'ColorPicker is an input component to select a color.', + props: ColorPickerProps, + events: ColorPickerEvents + } +}; diff --git a/apps/showcase/api-generator/components/column.js b/apps/showcase/api-generator/components/column.js new file mode 100644 index 000000000..7018f8ae5 --- /dev/null +++ b/apps/showcase/api-generator/components/column.js @@ -0,0 +1,361 @@ +const ColumnProps = [ + { + name: 'columnKey', + type: 'any', + default: 'null', + description: 'Identifier of a column if field property is not defined.' + }, + { + name: 'field', + type: 'string', + default: 'null', + description: 'Property represented by the column.' + }, + { + name: 'sortField', + type: 'string', + default: 'null', + description: 'Property name to use in sorting, defaults to field.' + }, + { + name: 'filterField', + type: 'string', + default: 'null', + description: 'Property name to use in filtering, defaults to field.' + }, + { + name: 'sortable', + type: 'any', + default: 'false', + description: 'Defines if a column is sortable.' + }, + { + name: 'header', + type: 'any', + default: 'null', + description: 'Header content of the column.' + }, + { + name: 'footer', + type: 'any', + default: 'null', + description: 'Footer content of the column.' + }, + { + name: 'style', + type: 'object', + default: 'null', + description: 'Inline style of header, body and footer cells.' + }, + { + name: 'class', + type: 'string', + default: 'null', + description: 'Style class of header, body and footer cells.' + }, + { + name: 'headerStyle', + type: 'object', + default: 'null', + description: 'Inline style of the column header.' + }, + { + name: 'headerClass', + type: 'string', + default: 'null', + description: 'Style class of the column header.' + }, + { + name: 'bodyStyle', + type: 'object', + default: 'null', + description: 'Inline style of the column body.' + }, + { + name: 'bodyClass', + type: 'string', + default: 'null', + description: 'Style class of the column body.' + }, + { + name: 'footerStyle', + type: 'object', + default: 'null', + description: 'Inline style of the column footer.' + }, + { + name: 'footerClass', + type: 'string', + default: 'null', + description: 'Style class of the footer body.' + }, + { + name: 'showFilterMenu', + type: 'boolean', + default: 'true', + description: 'Whether to display the filter overlay.' + }, + { + name: 'showFilterOperator', + type: 'boolean', + default: 'true', + description: 'When enabled, match all and match any operator selector is displayed.' + }, + { + name: 'showClearButton', + type: 'boolean', + default: 'true', + description: 'Displays a button to clear the column filtering.' + }, + { + name: 'showApplyButton', + type: 'boolean', + default: 'true', + description: 'Displays a button to apply the column filtering.' + }, + { + name: 'showFilterMatchModes', + type: 'boolean', + default: 'true', + description: 'Whether to show the match modes selector.' + }, + { + name: 'showAddButton', + type: 'boolean', + default: 'true', + description: 'When enabled, a button is displayed to add more rules.' + }, + { + name: 'filterMatchModeOptions', + type: 'array', + default: 'null', + description: 'An array of label-value pairs to override the global match mode options.' + }, + { + name: 'maxConstraints', + type: 'number', + default: '2', + description: 'Maximum number of constraints for a column filter.' + }, + { + name: 'excludeGlobalFilter', + type: 'boolean', + default: 'false', + description: 'Whether to exclude from global filtering or not.' + }, + { + name: 'filterHeaderStyle', + type: 'object', + default: 'null', + description: 'Inline style of the column filter header in row filter display.' + }, + { + name: 'filterHeaderClass', + type: 'string', + default: 'null', + description: 'Style class of the column filter header in row filter display.' + }, + { + name: 'filterMenuStyle', + type: 'object', + default: 'null', + description: 'Inline style of the column filter overlay.' + }, + { + name: 'filterMenuClass', + type: 'string', + default: 'null', + description: 'Style class of the column filter overlay.' + }, + { + name: 'selectionMode', + type: 'string', + default: 'null', + description: 'Defines column based selection mode, options are "single" and "multiple".' + }, + { + name: 'expander', + type: 'boolean', + default: 'false', + description: 'Displays an icon to toggle row expansion.' + }, + { + name: 'colspan', + type: 'number', + default: 'null', + description: 'Number of columns to span for grouping.' + }, + { + name: 'rowspan', + type: 'number', + default: 'null', + description: 'Number of rows to span for grouping.' + }, + { + name: 'rowReorder', + type: 'boolean', + default: 'false', + description: 'Whether this column displays an icon to reorder the rows.' + }, + { + name: 'rowReorderIcon', + type: 'string', + default: 'pi pi-bars', + description: 'Icon of the drag handle to reorder rows.' + }, + { + name: 'reorderableColumn', + type: 'boolean', + default: 'true', + description: 'Defines if the column itself can be reordered with dragging.' + }, + { + name: 'rowEditor', + type: 'boolean', + default: 'false', + description: 'When enabled, column displays row editor controls.' + }, + { + name: 'frozen', + type: 'boolean', + default: 'false', + description: 'Whether the column is fixed in horizontal scrolling.' + }, + { + name: 'alignFrozen', + type: 'string', + default: 'left', + description: 'Position of a frozen column, valid values are left and right.' + }, + { + name: 'exportable', + type: 'boolean', + default: 'true', + description: 'Whether the column is included in data export.' + }, + { + name: 'exportHeader', + type: 'string', + default: 'null', + description: 'Custom export header of the column to be exported as CSV.' + }, + { + name: 'exportFooter', + type: 'string', + default: 'null', + description: 'Custom export footer of the column to be exported as CSV.' + }, + { + name: 'hidden', + type: 'boolean', + default: 'false', + description: 'Whether the column is rendered.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + } +]; + +const ColumnSlots = [ + { + name: 'header', + description: "Custom content for the component's header" + }, + { + name: 'body', + description: "Custom content for the component's body" + }, + { + name: 'footer', + description: "Custom content for the component's footer" + }, + { + name: 'editor', + description: 'Custom content for the editing cell' + }, + { + name: 'filter', + description: 'Custom content for the filtering items' + }, + { + name: 'filterheader', + description: "Custom content for the filter menu's header" + }, + { + name: 'filterfooter', + description: "Custom content for the filter menu's footer" + }, + { + name: 'filterclear', + description: "Custom content for the filter menu's clear section" + }, + { + name: 'filterapply', + description: "Custom content for the filter menu's apply section" + }, + { + name: 'loading', + description: 'Custom loading template.' + }, + { + name: 'rowtoggleicon', + description: 'Custom row toggler icon template.' + }, + { + name: 'rowcheckboxicon', + description: 'Custom row checkbox icon template.' + }, + { + name: 'roweditoriniticon', + description: 'Custom row editor init icon template.' + }, + { + name: 'roweditorsaveicon', + description: 'Custom row editor save icon template.' + }, + { + name: 'roweditorcancelicon', + description: 'Custom row editor cancel icon template.' + }, + { + name: 'filtericon', + description: 'Custom filter icon template.' + }, + { + name: 'filterclearicon', + description: 'Custom filter clear icon template.' + }, + { + name: 'filterremoveicon', + description: 'Custom filter remove icon template.' + }, + { + name: 'filteraddicon', + description: 'Custom filter add icon template.' + }, + { + name: 'sorticon', + description: 'Custom sort icon template.' + }, + { + name: 'headercheckboxicon', + description: 'Custom header checkbox icon template.' + }, + { + name: 'rowreordericon', + description: 'Custom row reorder icon template.' + } +]; + +module.exports = { + column: { + name: 'Column', + description: 'DataTable requires a value as an array of objects and columns defined with Column component.', + 'doc-url': 'datatable', + props: ColumnProps, + slots: ColumnSlots + } +}; diff --git a/apps/showcase/api-generator/components/columngroup.js b/apps/showcase/api-generator/components/columngroup.js new file mode 100644 index 000000000..49410fc15 --- /dev/null +++ b/apps/showcase/api-generator/components/columngroup.js @@ -0,0 +1,23 @@ +const ColumnGroupProps = [ + { + name: 'type', + type: 'string', + default: 'null', + description: 'Defines the type of the group.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + } +]; + +module.exports = { + columngroup: { + name: 'ColumnGroup', + description: 'Columns can be grouped at header and footer sections by defining a ColumnGroup with nested rows and columns', + 'doc-url': 'datatable', + props: ColumnGroupProps + } +}; diff --git a/apps/showcase/api-generator/components/confirmdialog.js b/apps/showcase/api-generator/components/confirmdialog.js new file mode 100644 index 000000000..1dcd29cc0 --- /dev/null +++ b/apps/showcase/api-generator/components/confirmdialog.js @@ -0,0 +1,64 @@ +const ConfirmDialogProps = [ + { + name: 'group', + type: 'string', + default: 'null', + description: 'Optional key to match the key of the confirmation, useful to target a specific confirm dialog instance.' + }, + { + name: 'breakpoints', + type: 'object', + default: 'null', + description: 'Object literal to define widths per screen size.' + }, + { + name: 'draggable', + type: 'boolean', + default: 'true', + description: 'Whether the dialog can be relocated by dragging.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const ConfirmDialogSlots = [ + { + name: 'message', + description: 'Custom icon template.' + }, + { + name: 'icon', + description: 'Custom icon template.' + }, + { + name: 'accepticon', + description: 'Custom accept icon template.' + }, + { + name: 'rejecticon', + description: 'Custom reject icon template.' + }, + { + name: 'container', + description: 'Custom container template.' + } +]; + +module.exports = { + confirmdialog: { + name: 'ConfirmDialog', + description: 'ConfirmDialog uses a Dialog UI that is integrated with the Confirmation API.', + props: ConfirmDialogProps, + slots: ConfirmDialogSlots + } +}; diff --git a/apps/showcase/api-generator/components/confirmpopup.js b/apps/showcase/api-generator/components/confirmpopup.js new file mode 100644 index 000000000..cded48cc0 --- /dev/null +++ b/apps/showcase/api-generator/components/confirmpopup.js @@ -0,0 +1,52 @@ +const ConfirmPopupProps = [ + { + name: 'group', + type: 'string', + default: 'null', + description: 'Optional key to match the key of the confirmation, useful to target a specific confirm dialog instance.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const ConfirmPopupSlots = [ + { + name: 'message', + description: 'Custom content for the component.' + }, + { + name: 'icon', + description: 'Custom icon template.' + }, + { + name: 'accepticon', + description: 'Custom accept icon template.' + }, + { + name: 'rejecticon', + description: 'Custom reject icon template.' + }, + { + name: 'container', + description: 'Custom container template.' + } +]; + +module.exports = { + confirmpopup: { + name: 'ConfirmPopup', + description: 'ConfirmPopup displays a confirmation overlay displayed relatively to its target.', + props: ConfirmPopupProps, + slots: ConfirmPopupSlots + } +}; diff --git a/apps/showcase/api-generator/components/contextmenu.js b/apps/showcase/api-generator/components/contextmenu.js new file mode 100644 index 000000000..b4cb01189 --- /dev/null +++ b/apps/showcase/api-generator/components/contextmenu.js @@ -0,0 +1,68 @@ +const ContextMenuProps = [ + { + name: 'model', + type: 'array', + default: 'null', + description: 'An array of menuitems.' + }, + { + name: 'appendTo', + type: 'string', + default: 'body', + description: 'A valid query selector or an HTMLElement to specify where the overlay gets attached.' + }, + { + name: 'baseZIndex', + type: 'number', + default: '0', + description: 'Base zIndex value to use in layering.' + }, + { + name: 'autoZIndex', + type: 'boolean', + default: 'true', + description: 'Whether to automatically manage layering.' + }, + { + name: 'global', + type: 'boolean', + default: 'false', + description: 'Attaches the menu to document instead of a particular item.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const ContextMenuSlots = [ + { + name: 'item', + description: 'Custom item template.' + }, + { + name: 'submenuicon', + description: 'Custom submenu icon template.' + }, + { + name: 'itemicon', + description: 'Custom item icon template.' + } +]; + +module.exports = { + contextmenu: { + name: 'ContextMenu', + description: 'ContextMenu displays an overlay menu on right click of its target.', + props: ContextMenuProps, + slots: ContextMenuSlots + } +}; diff --git a/apps/showcase/api-generator/components/datatable.js b/apps/showcase/api-generator/components/datatable.js new file mode 100644 index 000000000..d9396113c --- /dev/null +++ b/apps/showcase/api-generator/components/datatable.js @@ -0,0 +1,1213 @@ +const DataTableProps = [ + { + name: 'value', + type: 'array', + default: 'null', + description: 'An array of objects to display.' + }, + { + name: 'dataKey', + type: 'string|function', + default: 'null', + description: 'Name of the field that uniquely identifies the a record in the data.' + }, + { + name: 'rows', + type: 'number', + default: 'null', + description: 'Number of rows to display per page.' + }, + { + name: 'first', + type: 'number', + default: '0', + description: 'Index of the first row to be displayed.' + }, + { + name: 'totalRecords', + type: 'number', + default: 'null', + description: 'Number of total records, defaults to length of value when not defined.' + }, + { + name: 'paginator', + type: 'boolean', + default: 'false', + description: 'When specified as true, enables the pagination.' + }, + { + name: 'paginatorPosition', + type: 'string', + default: 'bottom', + description: 'Position of the paginator, options are "top","bottom" or "both".' + }, + { + name: 'alwaysShowPaginator', + type: 'boolean', + default: 'true', + description: 'Whether to show it even there is only one page.' + }, + { + name: 'paginatorTemplate', + type: 'string', + default: 'FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink CurrentPageReport RowsPerPageDropdown', + description: 'emplate of the paginator.' + }, + { + name: 'pageLinkSize', + type: 'number', + default: '5', + description: 'Number of page links to display.' + }, + { + name: 'rowsPerPageOptions', + type: 'array', + default: 'null', + description: 'Array of integer values to display inside rows per page dropdown.' + }, + { + name: 'currentPageReportTemplate', + type: 'string', + default: '({currentPage} of {totalPages})', + description: 'Template of the current page report element.' + }, + { + name: 'lazy', + type: 'boolean', + default: 'false', + description: 'Defines if data is loaded and interacted with in lazy manner.' + }, + { + name: 'loading', + type: 'boolean', + default: 'false', + description: 'Displays a loader to indicate data load is in progress.' + }, + { + name: 'loadingIcon', + type: 'string', + default: 'pi pi-spinner', + description: 'The icon to show while indicating data load is in progress.' + }, + { + name: 'sortField', + type: 'string', + default: 'null', + description: 'Property name or a getter function of a row data used for sorting by default' + }, + { + name: 'sortOrder', + type: 'number', + default: 'null', + description: 'Order to sort the data by default.' + }, + { + name: 'defaultSortOrder', + type: 'number', + default: '1', + description: 'Default sort order of an unsorted column.' + }, + { + name: 'multiSortMeta', + type: 'array', + default: 'null', + description: 'An array of SortMeta objects to sort the data by default in multiple sort mode.' + }, + { + name: 'sortMode', + type: 'string', + default: 'single', + description: 'Defines whether sorting works on single column or on multiple columns.' + }, + { + name: 'removableSort', + type: 'boolean', + default: 'false', + description: 'When enabled, columns can have an un-sorted state.' + }, + { + name: 'filters', + type: 'object', + default: 'null', + description: 'Filters object with key-value pairs to define the filters.' + }, + { + name: 'filterDisplay', + type: 'string', + default: 'null', + description: 'Layout of the filter elements, valid values are "row" and "menu".' + }, + { + name: 'filterLocale', + type: 'string', + default: 'undefined', + description: "Locale to use in filtering. The default locale is the host environment's current locale." + }, + { + name: 'selection', + type: 'any', + default: 'null', + description: 'Selected row in single mode or an array of values in multiple mode.' + }, + { + name: 'selectionMode', + type: 'string', + default: 'null', + description: 'Specifies the selection mode, valid values are "single" and "multiple".' + }, + { + name: 'compareSelectionBy', + type: 'string', + default: 'deepEquals', + description: 'Algorithm to define if a row is selected, valid values are "equals" that compares by reference and "deepEquals" that compares all fields.' + }, + { + name: 'metaKeySelection', + type: 'boolean', + default: 'true', + description: + 'Defines whether metaKey is requred or not for the selection. When true metaKey needs to be pressed to select or unselect an item and when set to false selection of each item can be toggled individually. On touch enabled devices, metaKeySelection is turned off automatically.' + }, + { + name: 'contextMenu', + type: 'boolean', + default: 'false', + description: 'Enables context menu integration.' + }, + { + name: 'contextMenuSelection', + type: 'object', + default: 'null', + description: 'Selected row instance with the ContextMenu.' + }, + { + name: 'rowHover', + type: 'boolean', + default: 'false', + description: 'When enabled, background of the rows change on hover.' + }, + { + name: 'selectAll', + type: 'boolean', + default: 'null', + description: 'Whether all data is selected.' + }, + { + name: 'csvSeparator', + type: 'string', + default: ',', + description: 'Character to use as the csv separator.' + }, + { + name: 'exportFilename', + type: 'string', + default: 'download', + description: 'Name of the exported file.' + }, + { + name: 'exportFunction', + type: 'function', + default: 'null', + description: 'Custom function to export data.' + }, + { + name: 'autoLayout', + type: 'boolean', + default: 'false', + description: 'Whether the cell widths scale according to their content or not. Does not apply to scrollable tables.' + }, + { + name: 'resizableColumns', + type: 'boolean', + default: 'false', + description: 'When enabled, columns can be resized using drag and drop.' + }, + { + name: 'columnResizeMode', + type: 'string', + default: 'fit', + description: 'Defines whether the overall table width should change on column resize, valid values are "fit" and "expand".' + }, + { + name: 'reorderableColumns', + type: 'boolean', + default: 'false', + description: 'When enabled, columns can be reordered using drag and drop.' + }, + { + name: 'expandedRows', + type: 'array', + default: 'null', + description: 'A collection of row data display as expanded.' + }, + { + name: 'expandedRowIcon', + type: 'string', + default: 'pi-chevron-down', + description: 'Icon of the row toggler to display the row as expanded.' + }, + { + name: 'collapsedRowIcon', + type: 'string', + default: 'pi pi-chevron-right', + description: 'Icon of the row toggler to display the row as collapsed.' + }, + { + name: 'rowGroupMode', + type: 'string', + default: 'null', + description: 'Defines the row group mode, valid options are "subheader" and "rowspan".' + }, + { + name: 'groupRowsBy', + type: 'string|array', + default: 'null', + description: 'One or more field names to use in row grouping.' + }, + { + name: 'expandableRowGroups', + type: 'boolean', + default: 'false', + description: 'Whether the row groups can be expandable.' + }, + { + name: 'expandedRowGroups', + type: 'array', + default: 'null', + description: 'An array of group field values whose groups would be rendered as expanded.' + }, + { + name: 'stateStorage', + type: 'string', + default: 'session', + description: 'Defines where a stateful table keeps its state, valid values are "session" for sessionStorage and "local" for localStorage.' + }, + { + name: 'stateKey', + type: 'string', + default: 'null', + description: 'Unique identifier of a stateful table to use in state storage.' + }, + { + name: 'editMode', + type: 'string', + default: 'null', + description: 'Defines the incell editing mode, valid options are "cell" and "row".' + }, + { + name: 'editingRows', + type: 'array', + default: 'null', + description: 'A collection of rows to represent the current editing data in row edit mode.' + }, + { + name: 'rowClass', + type: 'function', + default: 'null', + description: 'A function that takes the row data and returns a string to apply a particular class for the row.' + }, + { + name: 'rowStyle', + type: 'object', + default: 'null', + description: 'A function that takes the row data as a parameter and returns the inline style for the corresponding row.' + }, + { + name: 'scrollable', + type: 'boolean', + default: 'false', + description: 'When specified, enables horizontal and/or vertical scrolling.' + }, + { + name: 'scrollDirection', + type: 'string', + default: 'vertical', + description: 'Orientation of the scrolling, options are "vertical", "horizontal" and "both".' + }, + { + name: 'scrollHeight', + type: 'string', + default: 'null', + description: 'Height of the scroll viewport in fixed units or the "flex" keyword for a dynamic size.' + }, + { + name: 'virtualScrollerOptions', + type: 'object', + default: 'null', + description: 'Whether to use the virtualScroller feature. The properties of VirtualScroller component can be used like an object in it. Note: Currently only vertical orientation mode is supported.' + }, + { + name: 'frozenValue', + type: 'array', + default: 'null', + description: 'Items of the frozen part in scrollable DataTable.' + }, + { + name: 'breakpoint', + type: 'string', + default: '960px', + description: 'The breakpoint to define the maximum width boundary when using stack responsive layout.' + }, + { + name: 'showGridlines', + type: 'boolean', + default: 'false', + description: 'Whether to show grid lines between cells.' + }, + { + name: 'stripedRows', + type: 'boolean', + default: 'false', + description: 'Whether to displays rows with alternating colors.' + }, + { + name: 'highlightOnSelect', + type: 'boolean', + default: 'false', + description: 'Highlights automatically the first item.' + }, + { + name: 'size', + type: 'string', + default: 'null', + description: 'Defines the size of the table.' + }, + { + name: 'tableStyle', + type: 'object', + default: 'null', + description: 'Inline style of the table element.' + }, + { + name: 'tableClass', + type: 'string', + default: 'null', + description: 'Style class of the table element.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const DataTableEvents = [ + { + name: 'page', + description: 'Callback to invoke on pagination. Sort and Filter information is also available for lazy loading implementation.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Original event' + }, + { + name: 'event.page', + type: 'number', + description: 'New page number' + }, + { + name: 'event.pageCount', + type: 'number', + description: 'Total page count' + }, + { + name: 'event.first', + type: 'number', + description: 'Index of first record' + }, + { + name: 'event.rows', + type: 'number', + description: 'Number of rows to display in new page' + }, + { + name: 'event.sortField', + type: 'object', + description: 'Field to sort against' + }, + { + name: 'event.sortOrder', + type: 'number', + description: 'Sort order as integer' + }, + { + name: 'event.multiSortMeta', + type: 'object', + description: 'MultiSort metadata' + }, + { + name: 'event.filters', + type: 'object', + description: 'Collection of active filters' + }, + { + name: 'event.filterMatchModes', + type: 'object', + description: 'Match modes per field' + } + ] + }, + { + name: 'sort', + description: 'Callback to invoke on sort. Page and Filter information is also available for lazy loading implementation.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Original event' + }, + { + name: 'event.first', + type: 'number', + description: 'Index of first record' + }, + { + name: 'event.rows', + type: 'number', + description: 'Number of rows to display in new page' + }, + { + name: 'event.sortField', + type: 'object', + description: 'Field to sort against' + }, + { + name: 'event.sortOrder', + type: 'number', + description: 'Sort order as integer' + }, + { + name: 'event.multiSortMeta', + type: 'object', + description: 'MultiSort metadata' + }, + { + name: 'event.filters', + type: 'object', + description: 'Collection of active filters' + }, + { + name: 'event.filterMatchModes', + type: 'object', + description: 'Match modes per field' + } + ] + }, + { + name: 'filter', + description: 'Event to emit after filtering, not triggered in lazy mode.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Original event' + }, + { + name: 'event.first', + type: 'number', + description: 'Index of first record' + }, + { + name: 'event.rows', + type: 'number', + description: 'Number of rows to display in new page' + }, + { + name: 'event.sortField', + type: 'object', + description: 'Field to sort against' + }, + { + name: 'event.sortOrder', + type: 'number', + description: 'Sort order as integer' + }, + { + name: 'event.multiSortMeta', + type: 'object', + description: 'MultiSort metadata' + }, + { + name: 'event.filters', + type: 'object', + description: 'Collection of active filters' + }, + { + name: 'event.filteredValue', + type: 'string', + description: 'Filtered collection' + }, + { + name: 'event.filterMatchModes', + type: 'object', + description: 'Match modes per field' + } + ] + }, + { + name: 'value-change', + description: 'Invoked after filtering, sorting, pagination and cell editing to pass the rendered value.', + arguments: [ + { + name: 'value', + type: 'array', + description: 'Value displayed by the table.' + } + ] + }, + { + name: 'row-click', + description: 'Callback to invoke when a row is clicked.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event.' + }, + { + name: 'event.data', + type: 'object', + description: 'Selected row data.' + }, + { + name: 'event.index', + type: 'number', + description: 'Row index' + } + ] + }, + { + name: 'row-contextmenu', + description: 'Callback to invoke when a row is selected with a ContextMenu', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event.' + }, + { + name: 'event.data', + type: 'object', + description: 'Selected row data.' + }, + { + name: 'event.index', + type: 'number', + description: 'Row index' + } + ] + }, + { + name: 'row-select', + description: 'Callback to invoke when a row is selected.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event.' + }, + { + name: 'event.data', + type: 'object', + description: 'Selected row data.' + }, + { + name: 'event.index', + type: 'number', + description: 'Row index' + }, + { + name: 'event.type', + type: 'string', + description: 'Type of the selection, valid values are "row", "radio" or "checkbox".' + } + ] + }, + { + name: 'row-unselect', + description: 'Callback to invoke when a row is unselected.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event.' + }, + { + name: 'event.data', + type: 'object', + description: 'Selected row data.' + }, + { + name: 'event.index', + type: 'number', + description: 'Row index' + }, + { + name: 'event.type', + type: 'string', + description: 'Type of the selection, valid values are "row", "radio" or "checkbox".' + } + ] + }, + { + name: 'select-all-change', + description: 'Callback to invoke when all data is selected.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event.' + }, + { + name: 'event.checked', + type: 'object', + description: 'Whether all data is selected.' + } + ] + }, + { + name: 'column-resize-end', + description: 'Callback to invoke when a column is resized.', + arguments: [ + { + name: 'event.element', + type: 'object', + description: 'DOM element of the resized column.' + }, + { + name: 'event.delta', + type: 'number', + description: 'Change in column width' + } + ] + }, + { + name: 'column-reorder', + description: 'Callback to invoke when a column is reordered.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.dragIndex', + type: 'number', + description: 'Index of the dragged column' + }, + { + name: 'event.dropIndex', + type: 'number', + description: 'Index of the dropped column' + } + ] + }, + { + name: 'row-reorder', + description: 'Callback to invoke when a row is reordered.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.dragIndex', + type: 'number', + description: 'Index of the dragged row' + }, + { + name: 'event.dropIndex', + type: 'number', + description: 'Index of the dropped row' + }, + { + name: 'value', + type: 'array', + description: 'Reordered value' + } + ] + }, + { + name: 'row-expand', + description: 'Callback to invoke when a row is expanded.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.data', + type: 'object', + description: 'Expanded row data.' + } + ] + }, + { + name: 'row-collapse', + description: 'Callback to invoke when a row is collapsed.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.data', + type: 'object', + description: 'Collapsed row data.' + } + ] + }, + { + name: 'rowgroup-expand', + description: 'Callback to invoke when a row group is expanded.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.data', + type: 'object', + description: 'Expanded group value.' + } + ] + }, + { + name: 'rowgroup-collapse', + description: 'Callback to invoke when a row group is collapsed.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.data', + type: 'object', + description: 'Collapsed group value.' + } + ] + }, + { + name: 'cell-edit-init', + description: 'Callback to invoke when cell edit is initiated.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.data', + type: 'object', + description: 'Row data to edit.' + }, + { + name: 'event.field', + type: 'string', + description: 'Field name of the row data.' + }, + { + name: 'event.index', + type: 'number', + description: 'Index of the row data to edit.' + } + ] + }, + { + name: 'cell-edit-complete', + description: 'Callback to invoke when cell edit is completed.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.data', + type: 'object', + description: 'Row data to edit.' + }, + { + name: 'event.newData', + type: 'object', + description: 'New row data after editing.' + }, + { + name: 'event.value', + type: 'object', + description: 'Field value of row data to edit.' + }, + { + name: 'event.newValue', + type: 'object', + description: 'Field value of new row data after editing' + }, + { + name: 'event.field', + type: 'string', + description: 'Field name of the row data.' + }, + { + name: 'event.index', + type: 'number', + description: 'Index of the row data to edit.' + }, + { + name: 'event.type', + type: 'string', + description: 'Type of completion such as "enter", "outside" or "tab".' + } + ] + }, + { + name: 'cell-edit-cancel', + description: 'Callback to invoke when cell edit is cancelled with escape key.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.data', + type: 'object', + description: 'Row data to edit.' + }, + { + name: 'event.field', + type: 'string', + description: 'Field name of the row data.' + }, + { + name: 'event.index', + type: 'number', + description: 'Index of the row data to edit.' + } + ] + }, + { + name: 'row-edit-init', + description: 'Callback to invoke when row edit is initiated.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.data', + type: 'object', + description: 'Row data to edit.' + }, + { + name: 'event.newData', + type: 'object', + description: 'New row data after editing.' + }, + { + name: 'event.field', + type: 'string', + description: 'Field name of the row data.' + }, + { + name: 'event.index', + type: 'number', + description: 'Index of the row data to edit.' + } + ] + }, + { + name: 'row-edit-save', + description: 'Callback to invoke when row edit is saved.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.data', + type: 'object', + description: 'Row data to edit.' + }, + { + name: 'event.newData', + type: 'object', + description: 'New row data after editing.' + }, + { + name: 'event.field', + type: 'string', + description: 'Field name of the row data.' + }, + { + name: 'event.index', + type: 'number', + description: 'Index of the row data to edit.' + } + ] + }, + { + name: 'row-edit-cancel', + description: 'Callback to invoke when row edit is cancelled.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.data', + type: 'object', + description: 'Row data to edit.' + }, + { + name: 'event.newData', + type: 'object', + description: 'New row data after editing.' + }, + { + name: 'event.field', + type: 'string', + description: 'Field name of the row data.' + }, + { + name: 'event.index', + type: 'number', + description: 'Index of the row data to edit.' + } + ] + }, + { + name: 'state-save', + description: 'Invoked when a stateful table saves the state.', + arguments: [ + { + name: 'event.first', + type: 'number', + description: 'Index of first record' + }, + { + name: 'event.rows', + type: 'number', + description: 'Number of rows to display in new page' + }, + { + name: 'event.sortField', + type: 'object', + description: 'Field to sort against' + }, + { + name: 'event.sortOrder', + type: 'number', + description: 'Sort order as integer' + }, + { + name: 'event.multiSortMeta', + type: 'number', + description: 'MultiSort metadata' + }, + { + name: 'event.filters', + type: 'object', + description: 'Collection of active filters' + }, + { + name: 'event.columnWidths', + type: 'number', + description: 'Comma separated list of column widths' + }, + { + name: 'event.columnOrder', + type: 'number', + description: 'Order of the columns' + }, + { + name: 'event.expandedRows', + type: 'array', + description: 'Instances of rows in expanded state' + }, + { + name: 'event.expandedRowKeys', + type: 'array', + description: 'Keys of rows in expanded state' + }, + { + name: 'event.expandedRowGroups', + type: 'array', + description: 'Instances of row groups in expanded state' + }, + { + name: 'event.selection', + type: 'object', + description: 'Selected rows' + }, + { + name: 'event.selectionKeys', + type: 'object', + description: 'Keys of selected rows' + } + ] + }, + { + name: 'state-restore', + description: 'Invoked when a stateful table restores the state.', + arguments: [ + { + name: 'event.first', + type: 'number', + description: 'Index of first record' + }, + { + name: 'event.rows', + type: 'number', + description: 'Number of rows to display in new page' + }, + { + name: 'event.sortField', + type: 'object', + description: 'Field to sort against' + }, + { + name: 'event.sortOrder', + type: 'number', + description: 'Sort order as integer' + }, + { + name: 'event.multiSortMeta', + type: 'number', + description: 'MultiSort metadata' + }, + { + name: 'event.filters', + type: 'object', + description: 'Collection of active filters' + }, + { + name: 'event.columnWidths', + type: 'number', + description: 'Comma separated list of column widths' + }, + { + name: 'event.columnOrder', + type: 'number', + description: 'Order of the columns' + }, + { + name: 'event.expandedRows', + type: 'array', + description: 'Instances of rows in expanded state' + }, + { + name: 'event.expandedRowKeys', + type: 'array', + description: 'Keys of rows in expanded state' + }, + { + name: 'event.expandedRowGroups', + type: 'array', + description: 'Instances of row groups in expanded state' + }, + { + name: 'event.selection', + type: 'object', + description: 'Selected rows' + }, + { + name: 'event.selectionKeys', + type: 'object', + description: 'Keys of selected rows' + } + ] + } +]; + +const DataTableSlots = [ + { + name: 'header', + description: "Custom content for the component's header." + }, + { + name: 'paginatorstart', + description: "Custom content for the component paginator's left side." + }, + { + name: 'paginatorend', + description: "Custom content for the component paginator's right side." + }, + { + name: 'footer', + description: "Custom content for the component's footer." + }, + { + name: 'groupheader', + description: "Custom content for the component's subgroup header." + }, + { + name: 'groupfooter', + description: "Custom content for the component's subgroup footer." + }, + { + name: 'loading', + description: 'Custom loading template.' + }, + { + name: 'loadingicon', + description: 'Custom loading icon template.' + }, + { + name: 'reorderindicatorupicon', + description: 'Custom reorder indicator up icon template.' + }, + { + name: 'reorderindicatordownicon', + description: 'Custom reorder indicator down icon template.' + }, + { + name: 'rowgrouptoggleicon', + description: 'Custom rowgroup toggler icon template.' + }, + { + name: 'paginatorfirstpagelinkicon', + description: 'Custom paginator first page link icon template.' + }, + { + name: 'paginatorprevpagelinkicon', + description: 'Custom paginator prev page link icon template.' + }, + { + name: 'paginatornextpagelinkicon', + description: 'Custom paginator next page link icon template.' + }, + { + name: 'paginatorlastpagelinkicon', + description: 'Custom paginator last page link icon template.' + }, + { + name: 'empty', + description: 'Custom empty template.' + } +]; + +module.exports = { + datatable: { + name: 'DataTable', + description: 'DataTable displays data in tabular format.', + props: DataTableProps, + events: DataTableEvents, + slots: DataTableSlots + } +}; diff --git a/apps/showcase/api-generator/components/dataview.js b/apps/showcase/api-generator/components/dataview.js new file mode 100644 index 000000000..1e18ac17d --- /dev/null +++ b/apps/showcase/api-generator/components/dataview.js @@ -0,0 +1,180 @@ +const DataViewProps = [ + { + name: 'value', + type: 'array', + default: 'null', + description: 'An array of objects to display.' + }, + { + name: 'layout', + type: 'string', + default: 'list', + description: 'Layout of the items, valid values are "list" and "grid".' + }, + { + name: 'rows', + type: 'number', + default: '0', + description: 'Number of rows to display per page.' + }, + { + name: 'first', + type: 'number', + default: '0', + description: 'ndex of the first record to render.' + }, + { + name: 'totalRecords', + type: 'number', + default: 'null', + description: 'Number of total records, defaults to length of value when not defined.' + }, + { + name: 'paginator', + type: 'boolean', + default: 'false', + description: 'When specified as true, enables the pagination.' + }, + { + name: 'paginatorPosition', + type: 'string', + default: 'bottom', + description: 'Position of the paginator, options are "top","bottom" or "both".' + }, + { + name: 'alwaysShowPaginator', + type: 'boolean', + default: 'true', + description: 'Whether to show it even there is only one page.' + }, + { + name: 'paginatorTemplate', + type: 'string', + default: 'FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink RowsPerPageDropdown', + description: 'Template of the paginator.' + }, + { + name: 'pageLinkSize', + type: 'number', + default: '5', + description: 'Number of page links to display.' + }, + { + name: 'rowsPerPageOptions', + type: 'array', + default: 'null', + description: 'Array of integer values to display inside rows per page dropdown.' + }, + { + name: 'currentPageReportTemplate', + type: 'string', + default: '({currentPage} of {totalPages})', + description: 'Template of the current page report element.' + }, + { + name: 'sortField', + type: 'string', + default: 'null', + description: 'Property name or a getter function of data to use in sorting by default.' + }, + { + name: 'sortOrder', + type: 'number', + default: 'null', + description: 'Order to sort the data by default.' + }, + { + name: 'lazy', + type: 'boolean', + default: 'false', + description: 'Defines if data is loaded and interacted with in lazy manner.' + }, + { + name: 'dataKey', + type: 'string', + default: 'null', + description: 'Name of the data that uniquely identifies the a record in the data.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const DataViewEvents = [ + { + name: 'page', + description: 'Callback to invoke when page changes, the event object contains information about the new state.', + arguments: [ + { + name: 'event.page', + type: 'number', + description: 'New page number' + }, + { + name: 'event.first', + type: 'number', + description: 'Index of first record' + }, + { + name: 'event.rows', + type: 'number', + description: 'Number of rows to display in new page' + }, + { + name: 'event.pageCount', + type: 'number', + description: 'Total number of pages' + } + ] + } +]; + +const DataViewSlots = [ + { + name: 'header', + description: "Custom content for the component's header" + }, + { + name: 'paginatorstart', + description: "Custom content for the component paginator's left side" + }, + { + name: 'paginatorend', + description: "Custom content for the component paginator's right side" + }, + { + name: 'list', + description: 'Content for the list layout' + }, + { + name: 'grid', + description: 'Content for the grid layout' + }, + { + name: 'empty', + description: 'Custom content when there is no data to display' + }, + { + name: 'footer', + description: "Custom content for the component's footer" + } +]; + +module.exports = { + dataview: { + name: 'DataView', + description: 'DataView displays data in grid or list layout with pagination and sorting features.', + props: DataViewProps, + events: DataViewEvents, + slots: DataViewSlots + } +}; diff --git a/apps/showcase/api-generator/components/datepicker.js b/apps/showcase/api-generator/components/datepicker.js new file mode 100644 index 000000000..92762462b --- /dev/null +++ b/apps/showcase/api-generator/components/datepicker.js @@ -0,0 +1,512 @@ +const DatePickerProps = [ + { + name: 'modelValue', + type: 'any', + default: 'null', + description: 'Value of the component.' + }, + { + name: 'selectionMode', + type: 'string', + default: 'single', + description: 'Defines the quantity of the selection, valid values are "single", "multiple" and "range".' + }, + { + name: 'dateFormat', + type: 'string', + default: 'null', + description: 'Format of the date. Defaults to PrimeVue Locale configuration.' + }, + { + name: 'inline', + type: 'boolean', + default: 'false', + description: 'When enabled, displays the calendar as inline instead of an overlay.' + }, + { + name: 'showOtherMonths', + type: 'boolean', + default: 'true', + description: 'Whether to display dates in other months (non-selectable) at the start or end of the current month. To make these days selectable use the selectOtherMonths option.' + }, + { + name: 'selectOtherMonths', + type: 'boolean', + default: 'false', + description: 'Whether days in other months shown before or after the current month are selectable. This only applies if the showOtherMonths option is set to true.' + }, + { + name: 'showIcon', + type: 'boolean', + default: 'false', + description: 'When enabled, displays a button with icon next to input.' + }, + { + name: 'icon', + type: 'string', + default: 'null', + description: 'Icon of the calendar button.' + }, + { + name: 'previcon', + type: 'string', + default: 'null', + description: 'Icon to show in the previous button.' + }, + { + name: 'nextIcon', + type: 'string', + default: 'null', + description: 'Icon to show in the next button.' + }, + { + name: 'incrementIcon', + type: 'string', + default: 'null', + description: 'Icon to show in each of the increment buttons.' + }, + { + name: 'decrementIcon', + type: 'string', + default: 'null', + description: 'Icon to show in each of the decrement buttons.' + }, + { + name: 'numberOfMonths', + type: 'number', + default: '1', + description: 'Number of months to display.' + }, + { + name: 'view', + type: 'string', + default: 'date', + description: 'Type of view to display, valid valids are "date" for datepicker and "month" for month picker.' + }, + { + name: 'monthNavigator', + type: 'boolean', + default: 'false', + description: 'Whether the month should be rendered as a dropdown instead of text.' + }, + { + name: 'yearNavigator', + type: 'boolean', + default: 'false', + description: 'Whether the year should be rendered as a dropdown instead of text.' + }, + { + name: 'yearRange', + type: 'string', + default: 'null', + description: 'The range of years displayed in the year drop-down in (nnnn:nnnn) format such as (2000:2020).' + }, + { + name: 'panelClass', + type: 'string', + default: 'null', + description: 'Style class of the datetimepicker panel.' + }, + { + name: 'minDate', + type: 'Date', + default: 'null', + description: 'The minimum selectable date.' + }, + { + name: 'maxDate', + type: 'Date', + default: 'null', + description: 'The maximum selectable date.' + }, + { + name: 'disabledDates', + type: 'array', + default: 'null', + description: 'Array with dates to disable.' + }, + { + name: 'disabledDays', + type: 'array', + default: 'null', + description: 'Array with disabled weekday numbers.' + }, + { + name: 'maxDateCount', + type: 'number', + default: 'null', + description: 'Maximum number of selectable dates in multiple mode.' + }, + { + name: 'showOnFocus', + type: 'boolean', + default: 'true', + description: 'When disabled, datepicker will not be visible with input focus.' + }, + { + name: 'autoZIndex', + type: 'boolean', + default: 'true', + description: 'Whether to automatically manage layering.' + }, + { + name: 'baseZIndex', + type: 'number', + default: '0', + description: 'Base zIndex value to use in layering.' + }, + { + name: 'showButtonBar', + type: 'boolean', + default: 'false', + description: 'Whether to display today and clear buttons at the footer' + }, + { + name: 'shortYearCutoff', + type: 'string', + default: '+10', + description: 'The cutoff year for determining the century for a date.' + }, + { + name: 'showTime', + type: 'boolean', + default: 'false', + description: 'Whether to display timepicker.' + }, + { + name: 'timeOnly', + type: 'boolean', + default: 'false', + description: 'Whether to display timepicker only.' + }, + { + name: 'hourFormat', + type: 'string', + default: '24', + description: 'Specifies 12 or 24 hour format.' + }, + { + name: 'stepHour', + type: 'number', + default: '1', + description: 'Hours to change per step.' + }, + { + name: 'stepMinute', + type: 'number', + default: '1', + description: 'Minutes to change per step.' + }, + { + name: 'stepSeconds', + type: 'number', + default: '1', + description: 'Seconds to change per step.' + }, + { + name: 'showSeconds', + type: 'boolean', + default: 'false', + description: 'Whether to show the seconds in time picker.' + }, + { + name: 'hideOnDateTimeSelect', + type: 'boolean', + default: 'false', + description: 'Whether to hide the overlay on date selection when showTime is enabled.' + }, + { + name: 'hideOnRangeSelection', + type: 'boolean', + default: 'false', + description: 'Whether to hide the overlay on date selection is completed when selectionMode is range.' + }, + { + name: 'timeSeparator', + type: 'string', + default: ':', + description: 'Separator of time selector.' + }, + { + name: 'showWeek', + type: 'boolean', + default: 'false', + description: 'When enabled, calendar will show week numbers.' + }, + { + name: 'manualInput', + type: 'boolean', + default: 'true', + description: 'Whether to allow entering the date manually via typing.' + }, + { + name: 'appendTo', + type: 'string', + default: 'body', + description: 'A valid query selector or an HTMLElement to specify where the overlay gets attached. Special keywords are "body" for document body and "self" for the element itself.' + }, + { + name: 'disabled', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the element should be disabled.' + }, + { + name: 'invalid', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should have invalid state style.' + }, + { + name: 'variant', + type: 'string', + default: 'null', + description: 'Specifies the input variant of the component.' + }, + { + name: 'readonly', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that an input field is read-only.' + }, + { + name: 'placeholder', + type: 'string', + default: 'null', + description: 'Placeholder text for the input.' + }, + { + name: 'id', + type: 'string', + default: 'null', + description: 'Identifier of the element.' + }, + { + name: 'inputId', + type: 'string', + default: 'null', + description: 'Identifier of the underlying input element.' + }, + { + name: 'inputClass', + type: 'string | object', + default: 'null', + description: 'Style class of the input field.' + }, + { + name: 'inputStyle', + type: 'object', + default: 'null', + description: 'Inline style of the input field.' + }, + { + name: 'inputProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLInputElement to the focusable input element inside the component.' + }, + { + name: 'panelClass', + type: 'string | object', + default: 'null', + description: 'Style class of the overlay panel.' + }, + { + name: 'panelStyle', + type: 'object', + default: 'null', + description: 'Inline style of the overlay panel.' + }, + { + name: 'panelProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLDivElement to the overlay panel inside the component.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const DatePickerEvents = [ + { + name: 'input', + description: 'Callback to invoke when input field is being typed.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'New date' + } + ] + }, + { + name: 'date-select', + description: 'Callback to invoke when a date is selected.', + arguments: [ + { + name: 'value', + type: 'Date', + description: 'Selected value' + } + ] + }, + { + name: 'show', + description: 'Callback to invoke when datepicker panel is shown.' + }, + { + name: 'hide', + description: 'Callback to invoke when datepicker panel is hidden.' + }, + { + name: 'today-click', + description: 'Callback to invoke when today button is clicked.', + arguments: [ + { + name: 'date', + type: 'Date', + description: 'Today as a date instance' + } + ] + }, + { + name: 'clear-click', + description: 'Callback to invoke when clear button is clicked.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Click event' + } + ] + }, + { + name: 'month-change', + description: 'Callback to invoke when a month is changed using the navigators.', + arguments: [ + { + name: 'event.month', + type: 'number', + description: 'New month' + }, + { + name: 'event.year', + type: 'number', + description: 'New year' + } + ] + }, + { + name: 'year-change', + description: 'Callback to invoke when a year is changed using the navigators.', + arguments: [ + { + name: 'event.month', + type: 'number', + description: 'New month' + }, + { + name: 'event.year', + type: 'number', + description: 'New year' + } + ] + }, + { + name: 'focus', + description: 'Callback to invoke on focus of input field.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Focus event' + } + ] + }, + { + name: 'blur', + description: 'Callback to invoke on blur of input field.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.value', + type: 'string', + description: 'Input value' + } + ] + }, + { + name: 'keydown', + description: 'Callback to invoke when a key is pressed.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Keydown event' + } + ] + } +]; + +const DatePickerSlots = [ + { + name: 'header', + description: 'Custom content for the component header.' + }, + { + name: 'footer', + description: 'Custom content for the component footer.' + }, + { + name: 'date', + description: 'Custom content for the calendar cell.' + }, + { + name: 'decade', + description: 'Custom content for the calendar decade.' + }, + { + name: 'dropdownicon', + description: 'Custom dropdown icon template.' + }, + { + name: 'previcon', + description: 'Custom previous icon template.' + }, + { + name: 'nexticon', + description: 'Custom next icon template.' + }, + { + name: 'incrementicon', + description: 'Custom increment icon template.' + }, + { + name: 'decrementicon', + description: 'Custom decrement icon template.' + } +]; + +module.exports = { + calendar: { + name: 'DatePicker', + description: 'DatePicker is an input component to select a date.', + props: DatePickerProps, + events: DatePickerEvents, + slots: DatePickerSlots + } +}; diff --git a/apps/showcase/api-generator/components/deferredcontent.js b/apps/showcase/api-generator/components/deferredcontent.js new file mode 100644 index 000000000..2870fb984 --- /dev/null +++ b/apps/showcase/api-generator/components/deferredcontent.js @@ -0,0 +1,37 @@ +const DeferredContentProps = [ + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const DeferredContentEvents = [ + { + name: 'load', + description: 'Callback to invoke when deferred content is loaded..', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Event object' + } + ] + } +]; + +module.exports = { + deferredcontent: { + name: 'DeferredContent', + description: 'DeferredContent postpones the loading the content that is initially not in the viewport until it becomes visible on scroll.', + props: DeferredContentProps, + events: DeferredContentEvents + } +}; diff --git a/apps/showcase/api-generator/components/dialog.js b/apps/showcase/api-generator/components/dialog.js new file mode 100644 index 000000000..e7e737c6b --- /dev/null +++ b/apps/showcase/api-generator/components/dialog.js @@ -0,0 +1,227 @@ +const DialogProps = [ + { + name: 'header', + type: 'any', + default: 'null', + description: 'Title content of the dialog.' + }, + { + name: 'footer', + type: 'any', + default: 'null', + description: 'Footer content of the dialog.' + }, + { + name: 'visible', + type: 'boolean', + default: 'false', + description: 'Specifies the visibility of the dialog.' + }, + { + name: 'modal', + type: 'boolean', + default: 'null', + description: 'Defines if background should be blocked when dialog is displayed.' + }, + { + name: 'closeOnEscape', + type: 'boolean', + default: 'true', + description: 'Specifies if pressing escape key should hide the dialog.' + }, + { + name: 'dismissableMask', + type: 'boolean', + default: 'false', + description: 'Specifies if clicking the modal background should hide the dialog.' + }, + { + name: 'position', + type: 'string', + default: 'center', + description: 'Position of the dialog, options are "center", "top", "bottom", "left", "right", "topleft", "topright", "bottomleft" or "bottomright".' + }, + { + name: 'contentStyle', + type: 'object', + default: 'null', + description: 'Style of the content section.' + }, + { + name: 'contentClass', + type: 'string', + default: 'null', + description: 'Style class of the content section.' + }, + { + name: 'closable', + type: 'boolean', + default: 'true', + description: 'Adds a close icon to the header to hide the dialog.' + }, + { + name: 'showHeader', + type: 'boolean', + default: 'true', + description: 'Whether to show the header or not.' + }, + { + name: 'blockScroll', + type: 'boolean', + default: 'false', + description: 'Whether background scroll should be blocked when dialog is visible.' + }, + { + name: 'baseZIndex', + type: 'number', + default: '0', + description: 'Base zIndex value to use in layering.' + }, + { + name: 'autoZIndex', + type: 'boolean', + default: 'true', + description: 'Whether to automatically manage layering.' + }, + { + name: 'ariaCloseLabel', + type: 'string', + default: 'close', + description: 'Aria label of the close icon.' + }, + { + name: 'maximizable', + type: 'boolean', + default: 'false', + description: 'Whether the dialog can be displayed full screen.' + }, + { + name: 'breakpoints', + type: 'object', + default: 'null', + description: 'Object literal to define widths per screen size.' + }, + { + name: 'draggable', + type: 'boolean', + default: 'true', + description: 'Whether the dialog can be relocated by dragging.' + }, + { + name: 'minX', + type: 'number', + default: '0', + description: 'Minimum value for the left coordinate of dialog in dragging.' + }, + { + name: 'minY', + type: 'number', + default: '0', + description: 'Minimum value for the top coordinate of dialog in dragging.' + }, + { + name: 'keepInViewport', + type: 'boolean', + default: 'true', + description: 'Keeps dialog in the viewport when dragging.' + }, + { + name: 'appendTo', + type: 'string', + default: 'body', + description: 'A valid query selector or an HTMLElement to specify where the dialog gets attached. Special keywords are "body" for document body and "self" for the element itself.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const DialogEvents = [ + { + name: 'hide', + description: 'Callback to invoke when dialog is hidden.' + }, + { + name: 'after-hide', + description: 'Callback to invoke after dialog is hidden.' + }, + { + name: 'show', + description: 'Callback to invoke when dialog is showed.' + }, + { + name: 'maximize', + description: 'Fired when a dialog gets maximized.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Event Object' + } + ] + }, + { + name: 'unmaximize', + description: 'Fired when a dialog gets unmaximized.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Event Object' + } + ] + }, + { + name: 'dragend', + description: 'Fired when a dialog drag completes.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Event Object' + } + ] + } +]; + +const DialogSlots = [ + { + name: 'header', + description: "Custom content for the component's header" + }, + { + name: 'footer', + description: "Custom content for the component's footer" + }, + { + name: 'closeicon', + description: 'Custom close icon template.' + }, + { + name: 'maximizeicon', + description: 'Custom maximizeicon icon template of dialog.' + }, + { + name: 'container', + description: 'Custom container template.' + } +]; + +module.exports = { + dialog: { + name: 'Dialog', + description: 'Dialog is a container to display content in an overlay window.', + props: DialogProps, + events: DialogEvents, + slots: DialogSlots + } +}; diff --git a/apps/showcase/api-generator/components/divider.js b/apps/showcase/api-generator/components/divider.js new file mode 100644 index 000000000..3a88946f9 --- /dev/null +++ b/apps/showcase/api-generator/components/divider.js @@ -0,0 +1,40 @@ +const DividerProps = [ + { + name: 'align', + type: 'string', + default: 'null', + description: 'Alignment of the content, options are "left", "center", "right" for horizontal layout and "top", "center", "bottom" for vertical.' + }, + { + name: 'layout', + type: 'string', + default: 'horizontal', + description: 'Specifies the orientation, valid values are "horizontal" and "vertical".' + }, + { + name: 'type', + type: 'string', + default: 'solid', + description: 'Border style type, default is "solid" and other options are "dashed" and "dotted".' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +module.exports = { + divider: { + name: 'Divider', + description: 'Divider is used to separate contents.', + props: DividerProps + } +}; diff --git a/apps/showcase/api-generator/components/dock.js b/apps/showcase/api-generator/components/dock.js new file mode 100644 index 000000000..9d4b79c9d --- /dev/null +++ b/apps/showcase/api-generator/components/dock.js @@ -0,0 +1,64 @@ +const DockProps = [ + { + name: 'model', + type: 'object', + default: 'null', + description: 'MenuModel instance to define the action items.' + }, + { + name: 'position', + type: 'string', + default: 'bottom', + description: "Position of element. Valid values are 'bottom', 'top', 'left' and 'right'." + }, + { + name: 'class', + type: 'string', + default: 'null', + description: 'Style class of the element.' + }, + { + name: 'style', + type: 'object', + default: 'null', + description: 'Inline style of the element.' + }, + { + name: 'tooltipOptions', + type: 'object', + default: 'null', + description: "Whether to display the tooltip on items. The modifiers of tooltip can be used like an object in it. Valid keys are 'event' and 'position'." + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const DockSlots = [ + { + name: 'item', + description: 'Custom content for the item.' + }, + { + name: 'icon', + description: 'Custom content for the icon.' + } +]; + +module.exports = { + dock: { + name: 'Dock', + description: 'Dock is a navigation component consisting of menuitems.', + props: DockProps, + slots: DockSlots + } +}; diff --git a/apps/showcase/api-generator/components/drawer.js b/apps/showcase/api-generator/components/drawer.js new file mode 100644 index 000000000..986e790df --- /dev/null +++ b/apps/showcase/api-generator/components/drawer.js @@ -0,0 +1,114 @@ +const DrawerProps = [ + { + name: 'visible', + type: 'boolean', + default: 'false', + description: 'Specifies the visibility of the dialog.' + }, + { + name: 'position', + type: 'string', + default: 'left', + description: 'Specifies the position of the sidebar, valid values are "left", "right", "top", "bottom" and "full".' + }, + { + name: 'baseZIndex', + type: 'number', + default: '0', + description: 'Base zIndex value to use in layering.' + }, + { + name: 'autoZIndex', + type: 'boolean', + default: 'true', + description: 'Whether to automatically manage layering.' + }, + { + name: 'dismissable', + type: 'boolean', + default: 'true', + description: 'Whether clicking outside closes the panel.' + }, + { + name: 'showCloseIcon', + type: 'boolean', + default: 'true', + description: 'Whether to display a close icon inside the panel.' + }, + { + name: 'modal', + type: 'boolean', + default: 'true', + description: 'Whether to a modal layer behind the sidebar.' + }, + { + name: 'ariaCloseLabel', + type: 'string', + default: 'close', + description: 'Aria label of the close icon.' + }, + { + name: 'blockScroll', + type: 'boolean', + default: 'false', + description: 'Whether background scroll should be blocked when sidebar is visible.' + }, + { + name: 'closeIcon', + type: 'string', + default: 'undefined', + description: 'Icon to display in the sidebar close button.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const DrawerEvents = [ + { + name: 'hide', + description: 'Callback to invoke when sidebar gets hidden.' + }, + { + name: 'show', + description: 'Callback to invoke when sidebar gets shown.' + }, + { + name: 'closeicon', + description: 'Custom close icon template.' + } +]; + +const DrawerSlots = [ + { + name: 'header', + description: 'Custom content for the component header.' + }, + { + name: 'closeicon', + description: 'Custom close icon template.' + }, + { + name: 'container', + description: 'Custom container template.' + } +]; + +module.exports = { + sidebar: { + name: 'Drawer', + description: 'Drawer is a panel component displayed as an overlay at the edges of the screen.', + props: DrawerProps, + events: DrawerEvents, + slots: DrawerSlots + } +}; diff --git a/apps/showcase/api-generator/components/dropdown.js b/apps/showcase/api-generator/components/dropdown.js new file mode 100644 index 000000000..a57c8011d --- /dev/null +++ b/apps/showcase/api-generator/components/dropdown.js @@ -0,0 +1,432 @@ +const DropdownProps = [ + { + name: 'modelValue', + type: 'any', + default: 'null', + description: 'Value of the component.' + }, + { + name: 'options', + type: 'array', + default: 'null', + description: 'An array of selectitems to display as the available options.' + }, + { + name: 'optionLabel', + type: 'string | function', + default: 'null', + description: 'Property name or getter function to use as the label of an option.' + }, + { + name: 'optionValue', + type: 'string | function', + default: 'null', + description: 'Property name or getter function to use as the value of an option, defaults to the option itself when not defined.' + }, + { + name: 'optionDisabled', + type: 'boolean', + default: 'null', + description: 'Property name or getter function to use as the disabled flag of an option, defaults to false when not defined.' + }, + { + name: 'optionGroupLabel', + type: 'string | function', + default: 'null', + description: 'Property name or getter function to use as the label of an option group.' + }, + { + name: 'optionGroupChildren', + type: 'string | function', + default: 'null', + description: 'Property name or getter function that refers to the children options of option group.' + }, + { + name: 'scrollHeight', + type: 'string', + default: '200px', + description: 'Height of the viewport, a scrollbar is defined if height of list exceeds this value.' + }, + { + name: 'filter', + type: 'boolean', + default: 'false', + description: 'When specified, displays a filter input at header.' + }, + { + name: 'filterPlaceholder', + type: 'string', + default: 'null', + description: 'Placeholder text to show when filter input is empty.' + }, + { + name: 'filterLocale', + type: 'string', + default: 'undefined', + description: "Locale to use in filtering. The default locale is the host environment's current locale." + }, + { + name: 'filterMatchMode', + type: 'string', + default: 'contains', + description: 'Defines the filtering algorithm to use when searching the options. Valid values are "contains" (default), "startsWith" and "endsWith"' + }, + { + name: 'filterFields', + type: 'array', + default: 'null', + description: 'Fields used when filtering the options, defaults to optionLabel.' + }, + { + name: 'editable', + type: 'boolean', + default: 'false', + description: 'When present, custom value instead of predefined options can be entered using the editable input field.' + }, + { + name: 'placeholder', + type: 'string', + default: 'null', + description: 'Default text to display when no option is selected.' + }, + { + name: 'disabled', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should be disabled.' + }, + { + name: 'invalid', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should have invalid state style.' + }, + { + name: 'variant', + type: 'string', + default: 'null', + description: 'Specifies the input variant of the component.' + }, + { + name: 'dataKey', + type: 'string', + default: 'null', + description: 'A property to uniquely identify an option.' + }, + { + name: 'showClear', + type: 'boolean', + default: 'false', + description: 'When enabled, a clear icon is displayed to clear the value.' + }, + { + name: 'inputId', + type: 'string', + default: 'null', + description: 'Identifier of the underlying input element.' + }, + { + name: 'inputStyle', + type: 'object', + default: 'null', + description: 'Inline style of the input field.' + }, + { + name: 'inputClass', + type: 'string | object', + default: 'null', + description: 'Style class of the input field.' + }, + { + name: 'inputProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLInputElement/HTMLSpanElement to the focusable input element inside the component.' + }, + { + name: 'panelStyle', + type: 'object', + default: 'null', + description: 'Inline style of the overlay panel.' + }, + { + name: 'panelClass', + type: 'string', + default: 'null', + description: 'Style class of the overlay panel.' + }, + { + name: 'panelProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLDivElement to the overlay panel inside the component.' + }, + { + name: 'filterInputProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLInputElement to the filter input inside the component.' + }, + { + name: 'clearIconProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLElement to the clear icon inside the component.' + }, + { + name: 'appendTo', + type: 'string', + default: 'body', + description: "A valid query selector or an HTMLElement to specify where the overlay gets attached. Special keywords are 'body' for document body and 'self' for the element itself." + }, + { + name: 'loading', + type: 'boolean', + default: 'false', + description: 'Whether the multiselect is in loading state.' + }, + { + name: 'loadingIcon', + type: 'string', + default: 'pi pi-spinner pi-spin', + description: 'Icon to display in loading state.' + }, + { + name: 'resetFilterOnHide', + type: 'boolean', + default: 'false', + description: 'Clears the filter value when hiding the dropdown.' + }, + { + name: 'resetFilterOnClear', + type: 'boolean', + default: 'false', + description: 'Clears the filter value when clicking on the clear icon.' + }, + { + name: 'virtualScrollerOptions', + type: 'object', + default: 'null', + description: 'Whether to use the virtualScroller feature. The properties of VirtualScroller component can be used like an object in it.' + }, + { + name: 'autoOptionFocus', + type: 'boolean', + default: 'false', + description: 'Whether to focus on the first visible or selected element when the overlay panel is shown.' + }, + { + name: 'autoFilterFocus', + type: 'boolean', + default: 'false', + description: 'Whether to focus on the filter element when the overlay panel is shown.' + }, + { + name: 'selectOnFocus', + type: 'boolean', + default: 'false', + description: 'When enabled, the focused option is selected.' + }, + { + name: 'filterMessage', + type: 'string', + default: '{0} results are available', + description: 'Text to be displayed in hidden accessible field when filtering returns any results. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'selectionMessage', + type: 'string', + default: '{0} items selected', + description: 'Text to be displayed in hidden accessible field when options are selected. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'emptySelectionMessage', + type: 'string', + default: 'No selected item', + description: 'Text to be displayed in hidden accessible field when any option is not selected. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'emptyFilterMessage', + type: 'string', + default: 'No results found', + description: 'Text to display when filtering does not return any results. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'emptyMessage', + type: 'string', + default: 'No results found', + description: 'Text to display when there are no options available. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'tabindex', + type: 'number', + default: '0', + description: 'Index of the element in tabbing order.' + }, + { + name: 'aria-label', + type: 'string', + default: 'null', + description: 'Defines a string value that labels an interactive element.' + }, + { + name: 'aria-labelledby', + type: 'string', + default: 'null', + description: 'Identifier of the underlying input element.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const DropdownEvents = [ + { + name: 'change', + description: 'Callback to invoke on value change.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.value', + type: 'string', + description: 'Selected option value' + } + ] + }, + { + name: 'focus', + description: 'Callback to invoke when component receives focus.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Browser event' + } + ] + }, + { + name: 'blur', + description: 'Callback to invoke when component loses focus.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Browser event' + } + ] + }, + { + name: 'before-show', + description: 'Callback to invoke before the overlay is shown.' + }, + { + name: 'before-hide', + description: 'Callback to invoke before the overlay is hidden.' + }, + { + name: 'show', + description: 'Callback to invoke when the overlay is shown.' + }, + { + name: 'hide', + description: 'Callback to invoke when the overlay is hidden.' + }, + { + name: 'filter', + description: 'Callback to invoke when the overlay is shown.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.value', + type: 'string', + description: 'Filter value' + } + ] + } +]; + +const DropdownSlots = [ + { + name: 'value', + description: "Custom content for the item's value" + }, + { + name: 'indicator', + description: 'Custom content for the dropdown indicator' + }, + { + name: 'header', + description: "Custom content for the component's header" + }, + { + name: 'footer', + description: "Custom content for the component's footer" + }, + { + name: 'option', + description: "Custom content for the item's option" + }, + { + name: 'optiongroup', + description: "Custom content for the item's optiongroup" + }, + { + name: 'emptyfilter', + description: 'Custom content when there is no filtered data to display' + }, + { + name: 'empty', + description: 'Custom content when there is no data to display' + }, + { + name: 'content', + description: 'Custom content for the virtual scroller' + }, + { + name: 'loader', + description: 'Custom content for the virtual scroller loader items' + }, + { + name: 'clearicon', + description: 'Custom clear icon template.' + }, + { + name: 'dropdownicon', + description: 'Custom dropdown icon template.' + }, + { + name: 'loadingicon', + description: 'Custom loading icon template.' + }, + { + name: 'filtericon', + description: 'Custom filter icon template.' + } +]; + +module.exports = { + dropdown: { + name: 'Dropdown', + description: 'Dropdown is used to select an item from a list of options.', + props: DropdownProps, + events: DropdownEvents, + slots: DropdownSlots + } +}; diff --git a/apps/showcase/api-generator/components/dynamicdialog.js b/apps/showcase/api-generator/components/dynamicdialog.js new file mode 100644 index 000000000..9f2069dea --- /dev/null +++ b/apps/showcase/api-generator/components/dynamicdialog.js @@ -0,0 +1,15 @@ +const DynamicDialogProps = []; + +const DynamicDialogEvents = []; + +const DynamicDialogSlots = []; + +module.exports = { + dynamicdialog: { + name: 'DynamicDialog', + description: 'Dialogs can be created dynamically with any component as the content using a DialogService.', + props: DynamicDialogProps, + events: DynamicDialogEvents, + slots: DynamicDialogSlots + } +}; diff --git a/apps/showcase/api-generator/components/editor.js b/apps/showcase/api-generator/components/editor.js new file mode 100644 index 000000000..3b915ff96 --- /dev/null +++ b/apps/showcase/api-generator/components/editor.js @@ -0,0 +1,148 @@ +const EditorProps = [ + { + name: 'modelValue', + type: 'string', + default: 'null', + description: 'Value of the content.' + }, + { + name: 'placeholder', + type: 'string', + default: 'null', + description: 'Placeholder text to show when editor is empty.' + }, + { + name: 'readonly', + type: 'boolean', + default: 'false', + description: 'Whether to instantiate the editor to readonly mode.' + }, + { + name: 'formats', + type: 'string[]', + default: 'null', + description: 'Whitelist of formats to display.' + }, + { + name: 'editorStyle', + type: 'any', + default: 'null', + description: 'Inline style of the container.' + }, + { + name: 'modules', + type: 'object', + default: 'null', + description: 'Modules configuration, see here for available options.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const EditorEvents = [ + { + name: 'text-change', + description: 'Callback to invoke when text of editor changes.', + arguments: [ + { + name: 'event.delta', + type: 'object', + description: 'Representation of the change.' + }, + { + name: 'event.source', + type: 'string', + description: 'Source of change. Will be either "user" or "api".' + }, + { + name: 'event.htmlValue', + type: 'string', + description: 'Current value as html.' + }, + { + name: 'event.textValue', + type: 'string', + description: 'Current value as text.' + }, + { + name: 'event.instance', + type: 'object', + description: 'Text editor instance.' + } + ] + }, + { + name: 'selection-change', + description: 'Callback to invoke when selection of the text changes.', + arguments: [ + { + name: 'event.range', + type: 'object', + description: 'Representation of the selection boundaries.' + }, + { + name: 'event.oldRange', + type: 'string', + description: 'Representation of the previous selection boundaries.' + }, + { + name: 'event.source', + type: 'string', + description: 'Source of change. Will be either "user" or "api".' + }, + { + name: 'event.htmlValue', + type: 'string', + description: 'Current value as html.' + }, + { + name: 'event.textValue', + type: 'string', + description: 'Current value as text.' + }, + { + name: 'event.instance', + type: 'object', + description: 'Text editor instance.' + } + ] + }, + { + name: 'load', + description: 'Callback to invoke when the quill modules are loaded.', + arguments: [ + { + name: 'event.instance', + type: 'any', + description: 'Quill instance' + } + ] + } +]; + +const EditorSlots = [ + { + name: 'toolbar', + description: "Custom content for the component's toolbar" + } +]; + +module.exports = { + editor: { + name: 'Editor', + description: 'Editor is rich text editor component based on Quill.', + props: EditorProps, + events: EditorEvents, + slots: EditorSlots + } +}; diff --git a/apps/showcase/api-generator/components/fieldset.js b/apps/showcase/api-generator/components/fieldset.js new file mode 100644 index 000000000..a15a03b05 --- /dev/null +++ b/apps/showcase/api-generator/components/fieldset.js @@ -0,0 +1,78 @@ +const FieldsetProps = [ + { + name: 'legend', + type: 'string', + default: 'null', + description: 'Header text of the fieldset.' + }, + { + name: 'toggleable', + type: 'boolean', + default: 'null', + description: 'When specified, content can toggled by clicking the legend.' + }, + { + name: 'collapsed', + type: 'boolean', + default: 'true', + description: 'Defines the default visibility state of the content.' + }, + { + name: 'toggleButtonProps', + type: 'string', + default: 'null', + description: 'Used to pass the custom value to read for the AnchorHTMLAttributes inside the component.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const FieldsetEvents = [ + { + name: 'toggle', + description: 'Callback to invoke when a tab gets expanded or collapsed.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.value', + type: 'boolean', + description: 'collapsed state as a boolean' + } + ] + } +]; + +const FieldsetSlots = [ + { + name: 'legend', + description: 'Custom legend template.' + }, + { + name: 'toggleicon', + description: 'Custom toggler icon template.' + } +]; + +module.exports = { + fieldset: { + name: 'Fieldset', + description: 'Fieldset is a grouping component with the optional content toggle feature.', + props: FieldsetProps, + events: FieldsetEvents, + slots: FieldsetSlots + } +}; diff --git a/apps/showcase/api-generator/components/fileupload.js b/apps/showcase/api-generator/components/fileupload.js new file mode 100644 index 000000000..47b238553 --- /dev/null +++ b/apps/showcase/api-generator/components/fileupload.js @@ -0,0 +1,329 @@ +const FileUploadProps = [ + { + name: 'name', + type: 'string', + default: 'null', + description: 'Name of the request parameter to identify the files at backend.' + }, + { + name: 'url', + type: 'string', + default: 'null', + description: 'Remote url to upload the files.' + }, + { + name: 'mode', + type: 'string', + default: 'advanced', + description: 'Defines the UI of the component, possible values are "advanced" and "basic".' + }, + { + name: 'multiple', + type: 'boolean', + default: 'false', + description: 'Used to select multiple files at once from file dialog.' + }, + { + name: 'accept', + type: 'string', + default: 'null', + description: 'Pattern to restrict the allowed file types such as "image/*".' + }, + { + name: 'disabled', + type: 'boolean', + default: 'false', + description: 'Disables the upload functionality.' + }, + { + name: 'auto', + type: 'boolean', + default: 'false', + description: 'When enabled, upload begins automatically after selection is completed.' + }, + { + name: 'maxFileSize', + type: 'number', + default: 'null', + description: 'Maximum file size allowed in bytes.' + }, + { + name: 'invalidFileSizeMessage', + type: 'string', + default: '"{0}: Invalid file size, file size should be smaller than {1}."', + description: 'Message of the invalid fize size.' + }, + { + name: 'invalidFileLimitMessage', + type: 'string', + default: 'Maximum number of files exceeded, limit is {0} at most.', + description: 'Message to display when number of files to be uploaded exceeeds the limit.' + }, + { + name: 'fileLimit', + type: 'number', + default: 'null', + description: 'Maximum number of files that can be uploaded.' + }, + { + name: 'withCredentials', + type: 'boolean', + default: 'false', + description: 'Cross-site Access-Control requests should be made using credentials such as cookies, authorization headers or TLS client certificates.' + }, + { + name: 'previewWidth', + type: 'number', + default: '50', + description: 'Width of the image thumbnail in pixels.' + }, + { + name: 'chooseLabel', + type: 'string', + default: 'null', + description: 'Label of the choose button. Defaults to PrimeVue Locale configuration.' + }, + { + name: 'uploadLabel', + type: 'string', + default: 'Upoad', + description: 'Label of the upload button. Defaults to PrimeVue Locale configuration.' + }, + { + name: 'cancelLabel', + type: 'string', + default: 'Cancel', + description: 'Label of the cancel button. Defaults to PrimeVue Locale configuration.' + }, + { + name: 'customUpload', + type: 'boolean', + default: 'false', + description: 'Whether to use the default upload or a manual implementation defined in uploadHandler callback.' + }, + { + name: 'showUploadButton', + type: 'boolean', + default: 'true', + description: 'Whether to show the upload button.' + }, + { + name: 'showCancelButton', + type: 'boolean', + default: 'true', + description: 'Whether to cancel the upload button.' + }, + { + name: 'chooseIcon', + type: 'string', + default: 'pi pi-plus', + description: 'Icon of the choose button.' + }, + { + name: 'uploadIcon', + type: 'string', + default: 'pi pi-upload', + description: 'Icon of the upload button.' + }, + { + name: 'cancelIcon', + type: 'string', + default: 'pi pi-times', + description: 'Icon of the cancel button.' + }, + { + name: 'style', + type: 'any', + default: 'null', + description: 'Inline style of the component.' + }, + { + name: 'class', + type: 'string', + default: 'null', + description: 'Style class of the component.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const FileUploadEvents = [ + { + name: 'before-upload', + description: 'Callback to invoke before file upload begins to customize the request such as post parameters before the files.', + arguments: [ + { + name: 'event.xhr', + type: 'object', + description: 'XmlHttpRequest instance.' + }, + { + name: 'event.formData', + type: 'object', + description: 'FormData object.' + } + ] + }, + { + name: 'before-send', + description: 'Callback to invoke before file send begins to customize the request such as adding headers.', + arguments: [ + { + name: 'event.xhr', + type: 'object', + description: 'XmlHttpRequest instance.' + }, + { + name: 'event.formData', + type: 'object', + description: 'FormData object.' + } + ] + }, + { + name: 'upload', + description: 'Callback to invoke when file upload is complete.', + arguments: [ + { + name: 'event.xhr', + type: 'object', + description: 'XmlHttpRequest instance.' + }, + { + name: 'event.files', + type: 'object', + description: 'Uploaded files.' + } + ] + }, + { + name: 'error', + description: 'Callback to invoke if file upload fails.', + arguments: [ + { + name: 'event.xhr', + type: 'object', + description: 'XmlHttpRequest instance.' + }, + { + name: 'event.files', + type: 'object', + description: 'Files that are not uploaded.' + } + ] + }, + { + name: 'clear', + description: 'Callback to invoke when files in queue are removed without uploading.' + }, + { + name: 'select', + description: 'Callback to invoke when file upload is complete.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Original browser event.' + }, + { + name: 'event.files', + type: 'object', + description: 'List of selected files.' + } + ] + }, + { + name: 'progress', + description: 'Callback to invoke when files are selected.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Original browser event.' + }, + { + name: 'event.progress', + type: 'number', + description: 'Calculated progress value.' + } + ] + }, + { + name: 'uploader', + description: 'Callback to invoke to implement a custom upload.', + arguments: [ + { + name: 'event.files', + type: 'object', + description: 'List of selected files.' + } + ] + }, + { + name: 'remove', + description: 'Callback to invoke when a singe file is removed from the list.', + arguments: [ + { + name: 'event.file', + type: 'object', + description: 'Removed file.' + }, + { + name: 'event.files', + type: 'object', + description: 'Remaining files to be uploaded.' + } + ] + } +]; + +const FileUploadSlots = [ + { + name: 'header', + description: 'Custom header template.' + }, + { + name: 'content', + description: 'Custom content template.' + }, + { + name: 'empty', + description: 'Custom content when there is no selected file' + }, + { + name: 'chooseicon', + description: 'Custom choose icon template.' + }, + { + name: 'uploadicon', + description: 'Custom upload icon template.' + }, + { + name: 'cancelicon', + description: 'Custom cancel icon template.' + }, + { + name: 'fileremoveicon', + description: 'Custom remove icon template for each file.' + } +]; + +module.exports = { + fileupload: { + name: 'FileUpload', + description: 'FileUpload is an advanced uploader with dragdrop support, multi file uploads, auto uploading, progress tracking and validations.', + props: FileUploadProps, + events: FileUploadEvents, + slots: FileUploadSlots + } +}; diff --git a/apps/showcase/api-generator/components/galleria.js b/apps/showcase/api-generator/components/galleria.js new file mode 100644 index 000000000..0505c577a --- /dev/null +++ b/apps/showcase/api-generator/components/galleria.js @@ -0,0 +1,214 @@ +const GalleriaProps = [ + { + name: 'id', + type: 'string', + default: 'null', + description: 'Unique identifier of the element.' + }, + { + name: 'value', + type: 'array', + default: 'null', + description: 'An array of objects to display.' + }, + { + name: 'activeIndex', + type: 'number', + default: '0', + description: 'Index of the first item.' + }, + { + name: 'fullscreen', + type: 'boolean', + default: 'false', + description: 'Whether to display the component on fullscreen.' + }, + { + name: 'visible', + type: 'boolean', + default: 'false', + description: 'Specifies the visibility of the mask on fullscreen mode.' + }, + { + name: 'numVisible', + type: 'number', + default: '3', + description: 'Number of items per page.' + }, + { + name: 'responsiveOptions', + type: 'any', + default: 'null', + description: 'An array of options for responsive design.' + }, + { + name: 'showItemNavigators', + type: 'boolean', + default: 'false', + description: 'Whether to display navigation buttons in item section.' + }, + { + name: 'showThumbnailNavigators', + type: 'boolean', + default: 'true', + description: 'Whether to display navigation buttons in thumbnail container.' + }, + { + name: 'showItemNavigatorsOnHover', + type: 'boolean', + default: 'false', + description: 'Whether to display navigation buttons on item hover.' + }, + { + name: 'changeItemOnIndicatorHover', + type: 'boolean', + default: 'false', + description: 'When enabled, item is changed on indicator hover.' + }, + { + name: 'circular', + type: 'boolean', + default: 'false', + description: 'Defines if scrolling would be infinite.' + }, + { + name: 'autoPlay', + type: 'boolean', + default: 'false', + description: 'Items are displayed with a slideshow in autoPlay mode.' + }, + { + name: 'transitionInterval', + type: 'number', + default: '4000', + description: 'Time in milliseconds to scroll items.' + }, + { + name: 'showThumbnails', + type: 'boolean', + default: 'true', + description: 'Whether to display thumbnail container.' + }, + { + name: 'thumbnailsPosition', + type: 'string', + default: 'bottom', + description: 'Position of thumbnails. Valid values are "bottom", "top", "left" and "right".' + }, + { + name: 'verticalThumbnailViewPortHeight', + type: 'string', + default: '300px', + description: 'Height of the viewport in vertical thumbnail.' + }, + { + name: 'showIndicators', + type: 'boolean', + default: 'false', + description: 'Whether to display indicator container.' + }, + { + name: 'showIndicatorsOnItem', + type: 'boolean', + default: 'false', + description: 'When enabled, indicator container is displayed on item container.' + }, + { + name: 'indicatorsPosition', + type: 'string', + default: 'bottom', + description: 'Position of indicators. Valid values are "bottom", "top", "left" and "right".' + }, + { + name: 'baseZIndex', + type: 'number', + default: '0', + description: 'ase zIndex value to use in layering.' + }, + { + name: 'maskClass', + type: 'string', + default: 'null', + description: 'Style class of the mask on fullscreen mode.' + }, + { + name: 'containerStyle', + type: 'any', + default: 'null', + description: "Inline style of the component on fullscreen mode. Otherwise, the 'style' property can be used." + }, + { + name: 'containerClass', + type: 'any', + default: 'null', + description: "Style class of the component on fullscreen mode. Otherwise, the 'class' property can be used." + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const GalleriaSlots = [ + { + name: 'header', + description: "Custom content for the component's header." + }, + { + name: 'footer', + description: "Custom content for the component's footer." + }, + { + name: 'item', + description: 'Custom content for the item.' + }, + { + name: 'caption', + description: 'Custom caption content.' + }, + { + name: 'thumbnail', + description: 'Custom thumbnail content.' + }, + { + name: 'indicator', + description: 'Custom indicator content.' + }, + { + name: 'closeicon', + description: 'Custom close icon template.' + }, + { + name: 'previousitemicon', + description: 'Custom navigator previous item icon template.' + }, + { + name: 'nextitemicon', + description: 'Custom navigator next item icon template.' + }, + { + name: 'previousthumbnailicon', + description: 'Custom thumbnail previous icon template.' + }, + { + name: 'nextthumbnailicon', + description: 'Custom thumbnail next icon template.' + } +]; + +module.exports = { + galleria: { + name: 'Galleria', + description: 'Galleria is an advanced content gallery component.', + props: GalleriaProps, + slots: GalleriaSlots + } +}; diff --git a/apps/showcase/api-generator/components/image.js b/apps/showcase/api-generator/components/image.js new file mode 100644 index 000000000..e723e96b8 --- /dev/null +++ b/apps/showcase/api-generator/components/image.js @@ -0,0 +1,98 @@ +const ImageProps = [ + { + name: 'preview', + type: 'boolean', + default: 'false', + description: 'Controls the preview functionality.' + }, + { + name: 'indicatorIcon', + type: 'string', + default: 'pi pi-eye', + description: 'Custom indicator icon.' + }, + { + name: 'zoomInDisabled', + type: 'boolean', + default: 'false', + description: 'Disable the zoom-in button' + }, + { + name: 'zoomOutDisabled', + type: 'boolean', + default: 'false', + description: 'Disable the zoom-out button' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const ImageEvents = [ + { + name: 'show', + description: 'Triggered when the preview overlay is shown.' + }, + { + name: 'hide', + description: 'Triggered when the preview overlay is hidden.' + }, + { + name: 'error', + description: 'Triggered when an error occurs while loading an image file.' + } +]; + +const ImageSlots = [ + { + name: 'indicator', + description: 'Custom content for the preview indicator.' + }, + { + name: 'refresh', + description: 'Custom content for the component refresh.' + }, + { + name: 'undo', + description: 'Custom content for the component undo.' + }, + { + name: 'zoomout', + description: 'Custom content for the component zoomout.' + }, + { + name: 'zoomin', + description: 'Custom content for the component zoomin.' + }, + { + name: 'close', + description: 'Custom content for the component close.' + }, + { + name: 'image', + description: 'Custom content for the component image.' + }, + { + name: 'preview', + description: 'Custom content for the component preview.' + } +]; + +module.exports = { + image: { + name: 'Image', + description: 'Displays an image with preview and tranformation options.', + props: ImageProps, + events: ImageEvents, + slots: ImageSlots + } +}; diff --git a/apps/showcase/api-generator/components/inlinemessage.js b/apps/showcase/api-generator/components/inlinemessage.js new file mode 100644 index 000000000..34fdd0c4b --- /dev/null +++ b/apps/showcase/api-generator/components/inlinemessage.js @@ -0,0 +1,43 @@ +const InlineMessageProps = [ + { + name: 'severity', + type: 'string', + default: 'error', + description: 'Severity level of the message. Valid severities are "success", "info", "warn", "error", "secondary" and "contrast".' + }, + { + name: 'icon', + type: 'string', + default: 'undefined', + description: 'Display a custom icon for the message.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const MessageSlots = [ + { + name: 'icon', + description: 'Custom icon template.' + } +]; + +module.exports = { + inlinemessage: { + name: 'InlineMessage', + description: 'InlineMessage component is useful in cases where a single message needs to be displayed related to an element such as forms', + 'doc-url': 'message', + props: InlineMessageProps, + slots: MessageSlots + } +}; diff --git a/apps/showcase/api-generator/components/inplace.js b/apps/showcase/api-generator/components/inplace.js new file mode 100644 index 000000000..07e8d3316 --- /dev/null +++ b/apps/showcase/api-generator/components/inplace.js @@ -0,0 +1,72 @@ +const InplaceProps = [ + { + name: 'active', + type: 'boolean', + default: 'false', + description: 'Whether the content is displayed or not.' + }, + { + name: 'disabled', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the element should be disabled.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const InplaceEvents = [ + { + name: 'open', + description: 'Callback to invoke when inplace is opened.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Browser event' + } + ] + }, + { + name: 'close', + description: 'Callback to invoke when inplace is closed.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Browser event' + } + ] + } +]; + +const InplaceSlots = [ + { + name: 'display', + description: 'Custom display template.' + }, + { + name: 'content', + description: 'Custom content template.' + } +]; + +module.exports = { + inplace: { + name: 'Inplace', + description: 'Inplace provides an easy to do editing and display at the same time where clicking the output displays the actual content.', + props: InplaceProps, + events: InplaceEvents, + slots: InplaceSlots + } +}; diff --git a/apps/showcase/api-generator/components/inputchips.js b/apps/showcase/api-generator/components/inputchips.js new file mode 100644 index 000000000..1602667fa --- /dev/null +++ b/apps/showcase/api-generator/components/inputchips.js @@ -0,0 +1,148 @@ +const InputChipsProps = [ + { + name: 'modelValue', + type: 'array', + default: 'null', + description: 'Value of the component.' + }, + { + name: 'max', + type: 'number', + default: 'null', + description: 'Maximum number of entries allowed.' + }, + { + name: 'separator', + type: 'string', + default: 'null', + description: 'Separator char to add an item when pressed in addition to the enter key. Currently only possible value is ","' + }, + { + name: 'addOnBlur', + type: 'boolean', + default: 'false', + description: 'Whether to add an item when the input loses focus.' + }, + { + name: 'allowDuplicate', + type: 'boolean', + default: 'false', + description: 'Whether to allow duplicate values or not.' + }, + { + name: 'disabled', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the element should be disabled.' + }, + { + name: 'invalid', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should have invalid state style.' + }, + { + name: 'variant', + type: 'string', + default: 'null', + description: 'Specifies the input variant of the component.' + }, + { + name: 'placeholder', + type: 'string', + default: 'null', + description: 'Placeholder text for the input.' + }, + { + name: 'inputId', + type: 'string', + default: 'null', + description: 'Identifier of the focus input to match a label defined for the chips.' + }, + { + name: 'inputClass', + type: 'string | object', + default: 'null', + description: 'Style class of the input field.' + }, + { + name: 'inputStyle', + type: 'object', + default: 'null', + description: 'Inline style of the input field.' + }, + { + name: 'inputProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLInputElement to the focusable input element inside the component.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const InputChipsEvents = [ + { + name: 'add', + description: 'Callback to invoke when a chip is added.', + arguments: [ + { + name: 'originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'value', + type: 'array', + description: 'Added item value' + } + ] + }, + { + name: 'remove', + description: 'Callback to invoke when a chip is removed.', + arguments: [ + { + name: 'originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'value', + type: 'array', + description: 'Removed item value' + } + ] + } +]; + +const InputChipsSlots = [ + { + name: 'chips', + description: 'Custom content for the chips' + }, + { + name: 'removetokenicon', + description: 'Custom remove token icon template.' + } +]; + +module.exports = { + chips: { + name: 'InputChips', + description: 'InputChips is used to enter multiple values on an input field.', + props: InputChipsProps, + events: InputChipsEvents, + slots: InputChipsSlots + } +}; diff --git a/apps/showcase/api-generator/components/inputmask.js b/apps/showcase/api-generator/components/inputmask.js new file mode 100644 index 000000000..2c8087e09 --- /dev/null +++ b/apps/showcase/api-generator/components/inputmask.js @@ -0,0 +1,64 @@ +const InputMaskProps = [ + { + name: 'modelValue', + type: 'any', + default: 'null', + description: 'Value of the component.' + }, + { + name: 'mask', + type: 'string', + default: 'null', + description: 'Mask pattern.' + }, + { + name: 'slotChar', + type: 'string', + default: '-', + description: 'Placeholder character in mask, default is underscore.' + }, + { + name: 'autoClear', + type: 'boolean', + default: 'true', + description: 'Clears the incomplete value on blur.' + }, + { + name: 'unmask', + type: 'boolean', + default: 'false', + description: 'Defines if model sets the raw unmasked value to bound value or the formatted mask value.' + }, + { + name: 'invalid', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should have invalid state style.' + }, + { + name: 'variant', + type: 'string', + default: 'null', + description: 'Specifies the input variant of the component.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +module.exports = { + inputmask: { + name: 'InputMask', + description: 'InputMask component is used to enter input in a certain format such as numeric, date, currency, email and phone.', + props: InputMaskProps + } +}; diff --git a/apps/showcase/api-generator/components/inputnumber.js b/apps/showcase/api-generator/components/inputnumber.js new file mode 100644 index 000000000..cab3dffe0 --- /dev/null +++ b/apps/showcase/api-generator/components/inputnumber.js @@ -0,0 +1,277 @@ +const InputNumberProps = [ + { + name: 'modelValue', + type: 'number', + default: 'null', + description: 'Value of the component.' + }, + { + name: 'format', + type: 'boolean', + default: 'true', + description: 'Whether to format the value.' + }, + { + name: 'showButtons', + type: 'boolean', + default: 'false', + description: 'Displays spinner buttons.' + }, + { + name: 'buttonLayout', + type: 'string', + default: 'stacked', + description: 'Layout of the buttons, valid values are "stacked" (default), "horizontal" and "vertical".' + }, + { + name: 'incrementButtonClass', + type: 'string', + default: 'null', + description: 'Style class of the increment button.' + }, + { + name: 'decrementButtonClass', + type: 'string', + default: 'null', + description: 'Style class of the decrement button.' + }, + { + name: 'incrementButtonIcon', + type: 'string', + default: 'pi pi-angle-up', + description: 'Style class of the increment button.' + }, + { + name: 'decrementButtonIcon', + type: 'string', + default: 'pi pi-angle-down', + description: 'Style class of the decrement button.' + }, + { + name: 'locale', + type: 'string', + default: 'null', + description: 'Locale to be used in formatting.' + }, + { + name: 'localeMatcher', + type: 'string', + default: 'best fit', + description: 'The locale matching algorithm to use. Possible values are "lookup" and "best fit".' + }, + { + name: 'mode', + type: 'string', + default: 'decimal', + description: 'Defines the behavior of the component, valid values are "decimal" and "currency".' + }, + { + name: 'prefix', + type: 'string', + default: 'null', + description: 'Text to display before the value.' + }, + { + name: 'suffix', + type: 'string', + default: 'decimal', + description: 'Text to display after the value.' + }, + { + name: 'currency', + type: 'string', + default: 'null', + description: + 'The currency to use in currency formatting. Possible values are the ISO 4217 currency codes, such as "USD" for the US dollar, "EUR" for the euro, or "CNY" for the Chinese RMB. There is no default value; if the style is "currency", the currency property must be provided.' + }, + { + name: 'currencyDisplay', + type: 'string', + default: 'symbol', + description: + 'How to display the currency in currency formatting. Possible values are "symbol" to use a localized currency symbol such as €, "code" to use the ISO currency code, "name" to use a localized currency name such as "dollar"; the default is "symbol".' + }, + { + name: 'useGrouping', + type: 'boolean', + default: 'true', + description: 'Whether to use grouping separators, such as thousands separators or thousand/lakh/crore separators.' + }, + { + name: 'minFractionDigits', + type: 'number', + default: 'null', + description: + "The minimum number of fraction digits to use. Possible values are from 0 to 20; the default for plain number and percent formatting is 0; the default for currency formatting is the number of minor unit digits provided by the ISO 4217 currency code list (2 if the list doesn't provide that information)." + }, + { + name: 'maxFractionDigits', + type: 'number', + default: 'null', + description: + "The maximum number of fraction digits to use. Possible values are from 0 to 20; the default for plain number formatting is the larger of minimumFractionDigits and 3; the default for currency formatting is the larger of minimumFractionDigits and the number of minor unit digits provided by the ISO 4217 currency code list (2 if the list doesn't provide that information)." + }, + { + name: 'min', + type: 'number', + default: 'null', + description: 'Mininum boundary value.' + }, + { + name: 'max', + type: 'number', + default: 'null', + description: 'Maximum boundary value.' + }, + { + name: 'step', + type: 'number', + default: '1', + description: 'Step factor to increment/decrement the value.' + }, + { + name: 'allowEmpty', + type: 'boolean', + default: 'true', + description: 'Determines whether the input field is empty.' + }, + { + name: 'readonly', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that an input field is read-only.' + }, + { + name: 'placeholder', + type: 'string', + default: 'null', + description: 'Placeholder text for the input.' + }, + { + name: 'invalid', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should have invalid state style.' + }, + { + name: 'variant', + type: 'string', + default: 'null', + description: 'Specifies the input variant of the component.' + }, + { + name: 'inputId', + type: 'string', + default: 'null', + description: 'Identifier of the underlying input element.' + }, + { + name: 'inputStyle', + type: 'object', + default: 'null', + description: 'Inline style of the input field.' + }, + { + name: 'inputClass', + type: 'string | object', + default: 'null', + description: 'Style class of the input field.' + }, + { + name: 'inputProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLInputElement to the focusable input element inside the component.' + }, + { + name: 'incrementButtonProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLButtonElement to increment button inside the component.' + }, + { + name: 'decrementButtonProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLButtonElement to decrement button inside the component.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const InputNumberEvents = [ + { + name: 'input', + description: 'Callback to invoke when the value is entered.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.value', + type: 'number', + description: 'New value' + } + ] + }, + { + name: 'focus', + description: 'Callback to invoke on focus of input field.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Focus event' + } + ] + }, + { + name: 'blur', + description: 'Callback to invoke on blur of input field.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.value', + type: 'string', + description: 'Input value' + } + ] + } +]; + +const InputNumberSlots = [ + { + name: 'incrementbuttonicon', + description: 'Custom increment button icon template.' + }, + { + name: 'decrementbuttonicon', + description: 'Custom decrement button icon template.' + } +]; + +module.exports = { + inputnumber: { + name: 'InputNumber', + description: 'InputNumber is an input component to provide numerical input.', + props: InputNumberProps, + events: InputNumberEvents, + slots: InputNumberSlots + } +}; diff --git a/apps/showcase/api-generator/components/inputotp.js b/apps/showcase/api-generator/components/inputotp.js new file mode 100644 index 000000000..6c74db25d --- /dev/null +++ b/apps/showcase/api-generator/components/inputotp.js @@ -0,0 +1,80 @@ +const InputOtpProps = [ + { + name: 'modelValue', + type: 'boolean', + default: 'null', + description: 'Specifies whether a inputOtp should be checked or not.' + }, + { + name: 'trueValue', + type: 'any', + default: 'null', + description: 'Value in checked state.' + }, + { + name: 'falseValue', + type: 'any', + default: 'null', + description: 'Value in unchecked state.' + }, + { + name: 'inputId', + type: 'string', + default: 'null', + description: 'Identifier of the underlying input element.' + }, + { + name: 'inputStyle', + type: 'object', + default: 'null', + description: 'Inline style of the input field.' + }, + { + name: 'inputClass', + type: 'string | object', + default: 'null', + description: 'Style class of the input field.' + }, + { + name: 'inputProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLInputElement to the focusable input element inside the component.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const InputOtpEvents = [ + { + name: 'click', + description: 'Callback to invoke on click.' + }, + { + name: 'change', + description: 'Callback to invoke on value change.' + }, + { + name: 'input', + description: 'Callback to invoke on value change.' + } +]; + +module.exports = { + inputotp: { + name: 'InputOtp', + description: 'InputOtp is used to enter one time passwords.', + props: InputOtpProps, + events: InputOtpEvents + } +}; diff --git a/apps/showcase/api-generator/components/inputswitch.js b/apps/showcase/api-generator/components/inputswitch.js new file mode 100644 index 000000000..c4a86f705 --- /dev/null +++ b/apps/showcase/api-generator/components/inputswitch.js @@ -0,0 +1,80 @@ +const InputSwitchProps = [ + { + name: 'modelValue', + type: 'boolean', + default: 'null', + description: 'Specifies whether a inputswitch should be checked or not.' + }, + { + name: 'trueValue', + type: 'any', + default: 'null', + description: 'Value in checked state.' + }, + { + name: 'falseValue', + type: 'any', + default: 'null', + description: 'Value in unchecked state.' + }, + { + name: 'inputId', + type: 'string', + default: 'null', + description: 'Identifier of the underlying input element.' + }, + { + name: 'inputStyle', + type: 'object', + default: 'null', + description: 'Inline style of the input field.' + }, + { + name: 'inputClass', + type: 'string | object', + default: 'null', + description: 'Style class of the input field.' + }, + { + name: 'inputProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLInputElement to the focusable input element inside the component.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const InputSwitchEvents = [ + { + name: 'click', + description: 'Callback to invoke on click.' + }, + { + name: 'change', + description: 'Callback to invoke on value change.' + }, + { + name: 'input', + description: 'Callback to invoke on value change.' + } +]; + +module.exports = { + inputswitch: { + name: 'InputSwitch', + description: 'InputSwitch is used to select a boolean value.', + props: InputSwitchProps, + events: InputSwitchEvents + } +}; diff --git a/apps/showcase/api-generator/components/inputtext.js b/apps/showcase/api-generator/components/inputtext.js new file mode 100644 index 000000000..439213ce3 --- /dev/null +++ b/apps/showcase/api-generator/components/inputtext.js @@ -0,0 +1,46 @@ +const InputTextProps = [ + { + name: 'modelValue', + type: 'any', + default: 'null', + description: 'Value of the component.' + }, + { + name: 'size', + type: 'string', + default: 'null', + description: 'Defines the size of the component, valid values are "small" and "large".' + }, + { + name: 'invalid', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should have invalid state style.' + }, + { + name: 'variant', + type: 'string', + default: 'null', + description: 'Specifies the input variant of the component.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +module.exports = { + inputtext: { + name: 'InputText', + description: 'InputText renders a text field to enter data.', + props: InputTextProps + } +}; diff --git a/apps/showcase/api-generator/components/knob.js b/apps/showcase/api-generator/components/knob.js new file mode 100644 index 000000000..7c3302292 --- /dev/null +++ b/apps/showcase/api-generator/components/knob.js @@ -0,0 +1,133 @@ +const KnobProps = [ + { + name: 'modelValue', + type: 'number', + default: 'null', + description: 'Value of the component.' + }, + { + name: 'size', + type: 'number', + default: '100', + description: 'Size of the component in pixels.' + }, + { + name: 'disabled', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should be disabled.' + }, + { + name: 'readonly', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component value cannot be edited.' + }, + { + name: 'step', + type: 'number', + default: 'null', + description: 'Step factor to increment/decrement the value.' + }, + { + name: 'min', + type: 'number', + default: '0', + description: 'Mininum boundary value.' + }, + { + name: 'max', + type: 'number', + default: '100', + description: 'Maximum boundary value.' + }, + { + name: 'valueColor', + type: 'string', + default: 'null', + description: 'Background of the value.' + }, + { + name: 'rangeColor', + type: 'string', + default: 'null', + description: 'Background color of the range.' + }, + { + name: 'textColor', + type: 'string', + default: 'null', + description: 'Color of the value text.' + }, + { + name: 'strokeWidth', + type: 'number', + default: '14', + description: 'Width of the knob stroke.' + }, + { + name: 'showValue', + type: 'boolean', + default: 'true', + description: 'Whether the show the value inside the knob.' + }, + { + name: 'valueTemplate', + type: 'function | string', + default: '{value}', + description: 'Template of the value.' + }, + { + name: 'tabindex', + type: 'number', + default: 'null', + description: 'Index of the element in tabbing order.' + }, + { + name: 'aria-labelledby', + type: 'string', + default: 'null', + description: 'Establishes relationships between the component and label(s) where its value should be one or more element IDs.' + }, + { + name: 'aria-label', + type: 'string', + default: 'null', + description: 'Used to define a string that labels the element.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const KnobEvents = [ + { + name: 'change', + description: 'Callback to invoke when the value changes.', + arguments: [ + { + name: 'value', + type: 'number', + description: 'New value' + } + ] + } +]; + +module.exports = { + knob: { + name: 'Knob', + description: 'Knob is a form component to define number inputs with a dial.', + props: KnobProps, + events: KnobEvents + } +}; diff --git a/apps/showcase/api-generator/components/listbox.js b/apps/showcase/api-generator/components/listbox.js new file mode 100644 index 000000000..006761e9c --- /dev/null +++ b/apps/showcase/api-generator/components/listbox.js @@ -0,0 +1,301 @@ +const ListboxProps = [ + { + name: 'modelValue', + type: 'any', + default: 'null', + description: 'Value of the component.' + }, + { + name: 'options', + type: 'array', + default: 'null', + description: 'An array of selectitems to display as the available options.' + }, + { + name: 'optionLabel', + type: 'string | function', + default: 'null', + description: 'Property name or getter function to use as the label of an option.' + }, + { + name: 'optionValue', + type: 'string | function', + default: 'null', + description: 'Property name or getter function to use as the value of an option, defaults to the option itself when not defined.' + }, + { + name: 'optionDisabled', + type: 'boolean | function', + default: 'null', + description: 'Property name or getter function to use as the disabled flag of an option, defaults to false when not defined.' + }, + { + name: 'optionGroupLabel', + type: 'string | function', + default: 'null', + description: 'Property name or getter function to use as the label of an option group.' + }, + { + name: 'optionGroupChildren', + type: 'string | function', + default: 'null', + description: 'Property name or getter function that refers to the children options of option group.' + }, + { + name: 'listStyle', + type: 'string', + default: 'null', + description: 'Inline style of inner list element.' + }, + { + name: 'disabled', + type: 'boolean', + default: 'false', + description: 'When specified, disables the component.' + }, + { + name: 'invalid', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should have invalid state style.' + }, + { + name: 'dataKey', + type: 'string', + default: 'null', + description: 'A property to uniquely identify an option.' + }, + { + name: 'multiple', + type: 'boolean', + default: 'false', + description: 'When specified, allows selecting multiple values.' + }, + { + name: 'metaKeySelection', + type: 'boolean', + default: 'true', + description: + 'Defines how multiple items can be selected, when true metaKey needs to be pressed to select or unselect an item and when set to false selection of each item can be toggled individually. On touch enabled devices, metaKeySelection is turned off automatically.' + }, + { + name: 'filter', + type: 'boolean', + default: 'false', + description: 'When specified, displays a filter input at header.' + }, + { + name: 'filterPlaceholder', + type: 'string', + default: 'null', + description: 'Placeholder text to show when filter input is empty.' + }, + { + name: 'filterLocale', + type: 'string', + default: 'undefined', + description: "Locale to use in filtering. The default locale is the host environment's current locale." + }, + { + name: 'filterMatchMode', + type: 'string', + default: 'contains', + description: 'Defines the filtering algorithm to use when searching the options. Valid values are "contains" (default), "startsWith" and "endsWith"' + }, + { + name: 'filterFields', + type: 'array', + default: 'null', + description: 'Fields used when filtering the options, defaults to optionLabel.' + }, + { + name: 'filterInputProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLInputElement to the filter input inside the component.' + }, + { + name: 'virtualScrollerOptions', + type: 'object', + default: 'null', + description: 'Whether to use the virtualScroller feature. The properties of VirtualScroller component can be used like an object in it.' + }, + { + name: 'autoOptionFocus', + type: 'boolean', + default: 'false', + description: 'Whether to focus on the first visible or selected element.' + }, + { + name: 'selectOnFocus', + type: 'boolean', + default: 'false', + description: 'When enabled, the focused option is selected.' + }, + { + name: 'filterMessage', + type: 'string', + default: '{0} results are available', + description: 'Text to be displayed in hidden accessible field when filtering returns any results. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'selectionMessage', + type: 'string', + default: '{0} items selected', + description: 'Text to be displayed in hidden accessible field when options are selected. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'emptySelectionMessage', + type: 'string', + default: 'No selected item', + description: 'Text to be displayed in hidden accessible field when any option is not selected. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'emptyFilterMessage', + type: 'string', + default: 'No results found', + description: 'Text to display when filtering does not return any results. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'emptyMessage', + type: 'string', + default: 'No results found', + description: 'Text to display when there are no options available. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'tabindex', + type: 'number', + default: '0', + description: 'Index of the element in tabbing order.' + }, + { + name: 'aria-label', + type: 'string', + default: 'null', + description: 'Defines a string value that labels an interactive element.' + }, + { + name: 'aria-labelledby', + type: 'string', + default: 'null', + description: 'Identifier of the underlying input element.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const ListboxEvents = [ + { + name: 'change', + description: 'Callback to invoke on value change.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.value', + type: 'object', + description: 'Selected option value' + } + ] + }, + { + name: 'focus', + description: 'Callback to invoke when component receives focus.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Browser event' + } + ] + }, + { + name: 'blur', + description: 'Callback to invoke when component loses focus.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Browser event' + } + ] + }, + { + name: 'filter', + description: 'Callback to invoke on filter input.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.value', + type: 'string', + description: 'Filter value' + } + ] + } +]; + +const ListboxSlots = [ + { + name: 'option', + description: "Custom content for the item's option." + }, + { + name: 'optiongroup', + description: "Custom content for the item's optiongroup." + }, + { + name: 'header', + description: "Custom content for the component's header." + }, + { + name: 'footer', + description: "Custom content for the component's footer." + }, + { + name: 'emptyfilter', + description: 'Custom content when there is no filtered data to display.' + }, + { + name: 'empty', + description: 'Custom content when there is no data to display.' + }, + { + name: 'content', + description: 'Custom content for the virtual scroller.' + }, + { + name: 'loader', + description: 'Custom content for the virtual scroller loader items.' + }, + { + name: 'filtericon', + description: 'Custom filter icon template.' + } +]; + +module.exports = { + listbox: { + name: 'Listbox', + description: 'Listbox is used to select one or more values from a list of items.', + props: ListboxProps, + events: ListboxEvents, + slots: ListboxSlots + } +}; diff --git a/apps/showcase/api-generator/components/megamenu.js b/apps/showcase/api-generator/components/megamenu.js new file mode 100644 index 000000000..f65e14042 --- /dev/null +++ b/apps/showcase/api-generator/components/megamenu.js @@ -0,0 +1,58 @@ +const MegaMenuProps = [ + { + name: 'modelValue', + type: 'array', + default: 'null', + description: 'An array of menuitems.' + }, + { + name: 'orientation', + type: 'string', + default: 'horizontal', + description: 'Defines the orientation, valid values are horizontal and vertical.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const MegaMenuSlots = [ + { + name: 'start', + description: 'Custom content before the content' + }, + { + name: 'end', + description: 'Custom content after the content' + }, + { + name: 'item', + description: 'Custom item template.' + }, + { + name: 'submenuicon', + description: 'Custom submenu icon template.' + }, + { + name: 'itemicon', + description: 'Custom item icon template.' + } +]; + +module.exports = { + megamenu: { + name: 'MegaMenu', + description: 'MegaMenu is navigation component that displays submenus together.', + props: MegaMenuProps, + slots: MegaMenuSlots + } +}; diff --git a/apps/showcase/api-generator/components/menu.js b/apps/showcase/api-generator/components/menu.js new file mode 100644 index 000000000..d657acac3 --- /dev/null +++ b/apps/showcase/api-generator/components/menu.js @@ -0,0 +1,88 @@ +const MenuProps = [ + { + name: 'modelValue', + type: 'array', + default: 'null', + description: 'An array of menuitems.' + }, + { + name: 'popup', + type: 'boolean', + default: 'false', + description: 'Defines if menu would displayed as a popup.' + }, + { + name: 'appendTo', + type: 'string', + default: 'body', + description: 'A valid query selector or an HTMLElement to specify where the overlay gets attached.' + }, + { + name: 'baseZIndex', + type: 'number', + default: '0', + description: 'Base zIndex value to use in layering.' + }, + { + name: 'autoZIndex', + type: 'boolean', + default: 'true', + description: 'Whether to automatically manage layering.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const MenuEvents = [ + { + name: 'show', + description: 'Callback to invoke when the overlay is shown.' + }, + { + name: 'hide', + description: 'Callback to invoke when the overlay is hidden.' + } +]; + +const MenuSlots = [ + { + name: 'start', + description: 'Custom start content.' + }, + { + name: 'end', + description: 'Custom end content.' + }, + { + name: 'item', + description: 'Custom item template.' + }, + { + name: 'itemicon', + description: 'Custom item icon template.' + }, + { + name: 'submenuheader', + description: 'Custom submenu header template.' + } +]; + +module.exports = { + menu: { + name: 'Menu', + description: 'Menu is a navigation / command component that supports dynamic and static positioning.', + props: MenuProps, + events: MenuEvents, + slots: MenuSlots + } +}; diff --git a/apps/showcase/api-generator/components/menubar.js b/apps/showcase/api-generator/components/menubar.js new file mode 100644 index 000000000..446760098 --- /dev/null +++ b/apps/showcase/api-generator/components/menubar.js @@ -0,0 +1,56 @@ +const MenubarProps = [ + { + name: 'modelValue', + type: 'array', + default: 'null', + description: 'An array of menuitems.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const MenubarSlots = [ + { + name: 'start', + description: 'Custom content before the content.' + }, + { + name: 'end', + description: 'Custom content after the content.' + }, + { + name: 'item', + description: 'Custom menuitem template.' + }, + { + name: 'baricon', + description: 'Custom bar icon template.' + }, + { + name: 'submenuicon', + description: 'Custom submenu icon template.' + }, + { + name: 'itemicon', + description: 'Custom item icon template.' + } +]; + +module.exports = { + menubar: { + name: 'Menubar', + description: 'Menubar is a horizontal menu component.', + props: MenubarProps, + slots: MenubarSlots + } +}; diff --git a/apps/showcase/api-generator/components/message.js b/apps/showcase/api-generator/components/message.js new file mode 100644 index 000000000..3adab35fe --- /dev/null +++ b/apps/showcase/api-generator/components/message.js @@ -0,0 +1,93 @@ +const MessageProps = [ + { + name: 'severity', + type: 'string', + default: 'info', + description: 'Severity level of the message. Valid severities are "success", "info", "warn", "error", "secondary" and "contrast".' + }, + { + name: 'closable', + type: 'boolean', + default: 'true', + description: 'Whether the message can be closed manually using the close icon.' + }, + { + name: 'sticky', + type: 'boolean', + default: 'null', + description: 'When enabled, message is not removed automatically.' + }, + { + name: 'life', + type: 'number', + default: '300', + description: 'Delay in milliseconds to close the message automatically.' + }, + { + name: 'icon', + type: 'string', + default: 'undefined', + description: 'Display a custom icon for the message.' + }, + { + name: 'closeIcon', + type: 'string', + default: 'undefined', + description: 'Display a custom close icon for the message.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const MessageSlots = [ + { + name: 'messageicon', + description: 'Custom message icon template.' + }, + { + name: 'closeicon', + description: 'Custom close icon template.' + }, + { + name: 'container', + description: 'Custom container template.' + } +]; + +const MessageEvents = [ + { + name: 'close', + description: 'Callback to invoke when a message is closed.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Browser event' + } + ] + }, + { + name: 'life-end', + description: "Callback to invoke when the message's timeout is over." + } +]; + +module.exports = { + message: { + name: 'Message', + description: 'Messages is used to display inline messages with various severities.', + props: MessageProps, + slots: MessageSlots, + events: MessageEvents + } +}; diff --git a/apps/showcase/api-generator/components/multiselect.js b/apps/showcase/api-generator/components/multiselect.js new file mode 100644 index 000000000..35ef21230 --- /dev/null +++ b/apps/showcase/api-generator/components/multiselect.js @@ -0,0 +1,500 @@ +const MultiSelectProps = [ + { + name: 'modelValue', + type: 'any', + default: 'null', + description: 'Value of the component.' + }, + { + name: 'options', + type: 'array', + default: 'null', + description: 'An array of selectitems to display as the available options.' + }, + { + name: 'optionLabel', + type: 'string', + default: 'null', + description: 'Property name or getter function to use as the label of an option.' + }, + { + name: 'optionValue', + type: 'string | function', + default: 'null', + description: 'Property name or getter function to use as the value of an option, defaults to the option itself when not defined.' + }, + { + name: 'optionDisabled', + type: 'boolean | function', + default: 'null', + description: 'Property name or getter function to use as the disabled flag of an option, defaults to false when not defined.' + }, + { + name: 'optionGroupLabel', + type: 'string | function', + default: 'null', + description: 'Property name or getter function to use as the label of an option group.' + }, + { + name: 'optionGroupChildren', + type: 'string | function', + default: 'null', + description: 'Property name or getter function that refers to the children options of option group.' + }, + { + name: 'scrollHeight', + type: 'string', + default: '200px', + description: 'Height of the viewport, a scrollbar is defined if height of list exceeds this value.' + }, + { + name: 'placeholder', + type: 'string', + default: 'null', + description: 'Label to display when there are no selections.' + }, + { + name: 'disabled', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should be disabled.' + }, + { + name: 'invalid', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should have invalid state style.' + }, + { + name: 'variant', + type: 'string', + default: 'null', + description: 'Specifies the input variant of the component.' + }, + { + name: 'inputId', + type: 'string', + default: 'null', + description: 'Identifier of the underlying input element.' + }, + { + name: 'inputProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLInputElement to the focusable input element inside the component.' + }, + { + name: 'panelStyle', + type: 'object', + default: 'null', + description: 'Inline style of the overlay panel.' + }, + { + name: 'panelClass', + type: 'string', + default: 'null', + description: 'Style class of the overlay panel.' + }, + { + name: 'panelProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLDivElement to the overlay panel.' + }, + { + name: 'filterInputProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLInputElement to the filter input inside the overlay panel.' + }, + { + name: 'closeButtonProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLButtonElement to the close button inside the overlay panel.' + }, + { + name: 'dataKey', + type: 'string', + default: 'null', + description: 'A property to uniquely identify an option.' + }, + { + name: 'filter', + type: 'boolean', + default: 'false', + description: 'When specified, displays a filter input at header.' + }, + { + name: 'filterPlaceholder', + type: 'string', + default: 'null', + description: 'Placeholder text to show when filter input is empty.' + }, + { + name: 'filterLocale', + type: 'string', + default: 'undefined', + description: "Locale to use in filtering. The default locale is the host environment's current locale." + }, + { + name: 'filterMatchMode', + type: 'string', + default: 'contains', + description: 'Defines the filtering algorithm to use when searching the options. Valid values are "contains" (default), "startsWith" and "endsWith"' + }, + { + name: 'filterFields', + type: 'array', + default: 'null', + description: 'Fields used when filtering the options, defaults to optionLabel.' + }, + { + name: 'appendTo', + type: 'string', + default: 'body', + description: "A valid query selector or an HTMLElement to specify where the overlay gets attached. Special keywords are 'body' for document body and 'self' for the element itself." + }, + { + name: 'display', + type: 'string', + default: 'comma', + description: 'Defines how the selected items are displayed, valid values are "comma" and "chip".' + }, + { + name: 'selectedItemsLabel', + type: 'string', + default: '{0} items selected', + description: 'Label to display after exceeding max selected labels.' + }, + { + name: 'maxSelectedLabels', + type: 'number', + default: 'null', + description: 'Decides how many selected item labels to show at most.' + }, + { + name: 'selectionLimit', + type: 'number', + default: 'null', + description: 'Maximum number of selectable items.' + }, + { + name: 'showToggleAll', + type: 'boolean', + default: 'false', + description: 'Whether to show the header checkbox to toggle the selection of all items at once.' + }, + { + name: 'loading', + type: 'boolean', + default: 'false', + description: 'Whether the multiselect is in loading state.' + }, + { + name: 'loadingIcon', + type: 'string', + default: 'null', + description: 'Icon to display in loading state.' + }, + { + name: 'checkboxIcon', + type: 'string', + default: 'null', + description: 'Icon to display in the checkboxes.' + }, + { + name: 'closeIcon', + type: 'string', + default: 'null', + description: 'Icon to display in the dropdown close button.' + }, + { + name: 'dropdownIcon', + type: 'string', + default: 'null', + description: 'Icon to display in the dropdown.' + }, + { + name: 'filterIcon', + type: 'string', + default: 'null', + description: 'Icon to display in filter input.' + }, + { + name: 'removeTokenIcon', + type: 'string', + default: 'null', + description: 'Icon to display in chip remove action.' + }, + { + name: 'selectAll', + type: 'boolean', + default: 'false', + description: 'Whether all data is selected.' + }, + { + name: 'resetFilterOnHide', + type: 'boolean', + default: 'false', + description: 'Clears the filter value when hiding the dropdown.' + }, + { + name: 'virtualScrollerOptions', + type: 'object', + default: 'null', + description: 'Whether to use the virtualScroller feature. The properties of VirtualScroller component can be used like an object in it.' + }, + { + name: 'autoOptionFocus', + type: 'boolean', + default: 'false', + description: 'Whether to focus on the first visible or selected element when the overlay panel is shown.' + }, + { + name: 'autoFilterFocus', + type: 'boolean', + default: 'false', + description: 'Whether to focus on the filter element when the overlay panel is shown.' + }, + { + name: 'highlightOnSelect', + type: 'boolean', + default: 'false', + description: 'Highlights automatically the first item.' + }, + { + name: 'filterMessage', + type: 'string', + default: '{0} results are available', + description: 'Text to be displayed in hidden accessible field when filtering returns any results. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'selectionMessage', + type: 'string', + default: '{0} items selected', + description: 'Text to be displayed in hidden accessible field when options are selected. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'emptySelectionMessage', + type: 'string', + default: 'No selected item', + description: 'Text to be displayed in hidden accessible field when any option is not selected. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'emptyFilterMessage', + type: 'string', + default: 'No results found', + description: 'Text to display when filtering does not return any results. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'emptyMessage', + type: 'string', + default: 'No results found', + description: 'Text to display when there are no options available. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'tabindex', + type: 'number', + default: '0', + description: 'Index of the element in tabbing order.' + }, + { + name: 'aria-label', + type: 'string', + default: 'null', + description: 'Defines a string value that labels an interactive element.' + }, + { + name: 'aria-labelledby', + type: 'string', + default: 'null', + description: 'Identifier of the underlying input element.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const MultiSelectEvents = [ + { + name: 'change', + description: 'Callback to invoke on value change.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.value', + type: 'array', + description: 'Selected option value' + } + ] + }, + { + name: 'focus', + description: 'Callback to invoke when component receives focus.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Browser event' + } + ] + }, + { + name: 'blur', + description: 'Callback to invoke when component loses focus.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Browser event' + } + ] + }, + { + name: 'before-show', + description: 'Callback to invoke before the overlay is shown.' + }, + { + name: 'before-hide', + description: 'Callback to invoke before the overlay is hidden.' + }, + { + name: 'show', + description: 'Callback to invoke when the overlay is shown.' + }, + { + name: 'hide', + description: 'Callback to invoke when the overlay is hidden.' + }, + { + name: 'filter', + description: 'Callback to invoke on filter input.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.value', + type: 'string', + description: 'Filter value' + } + ] + }, + { + name: 'selectall-change', + description: 'Callback to invoke when all data is selected.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.checked', + type: 'boolean', + description: 'Whether all data is selected.' + } + ] + } +]; + +const MultiSelectSlots = [ + { + name: 'value', + description: 'Custom content for the item value.' + }, + { + name: 'chip', + description: 'Custom content for the chip display.' + }, + { + name: 'indicator', + description: 'Custom content for the dropdown indicator.' + }, + { + name: 'header', + description: "Custom content for the component's header." + }, + { + name: 'footer', + description: "Custom content for the component's footer." + }, + { + name: 'option', + description: "Custom content for the item's option." + }, + { + name: 'optiongroup', + description: "Custom content for the item's optiongroup." + }, + { + name: 'emptyfilter', + description: 'Custom content when there is no filtered data to display.' + }, + { + name: 'empty', + description: 'Custom content when there is no data to display.' + }, + { + name: 'content', + description: 'Custom content for the virtual scroller.' + }, + { + name: 'loader', + description: 'Custom content for the virtual scroller loader items.' + }, + { + name: 'removetokenicon', + description: 'Custom remove token icon template.' + }, + { + name: 'headercheckboxicon', + description: 'Custom header checkbox icon template.' + }, + { + name: 'filtericon', + description: 'Custom filter icon template.' + }, + { + name: 'closeicon', + description: 'Custom close icon template.' + }, + { + name: 'itemcheckboxicon', + description: 'Custom item checkbox icon template.' + }, + { + name: 'loadingicon', + description: 'Custom loading icon template.' + }, + { + name: 'dropdownicon', + description: 'Custom dropdown icon template.' + } +]; + +module.exports = { + multiselect: { + name: 'MultiSelect', + description: 'MultiSelect is used to multiple values from a list of options.', + props: MultiSelectProps, + events: MultiSelectEvents, + slots: MultiSelectSlots + } +}; diff --git a/apps/showcase/api-generator/components/orderlist.js b/apps/showcase/api-generator/components/orderlist.js new file mode 100644 index 000000000..881470644 --- /dev/null +++ b/apps/showcase/api-generator/components/orderlist.js @@ -0,0 +1,154 @@ +const OrderListProps = [ + { + name: 'modelValue', + type: 'array', + default: 'null', + description: 'Value of the component.' + }, + { + name: 'selection', + type: 'any', + default: 'null', + description: 'Selected items in the list.' + }, + { + name: 'metaKeySelection', + type: 'boolean', + default: 'true', + description: + 'Defines whether metaKey is requred or not for the selection. When true metaKey needs to be pressed to select or unselect an item and when set to false selection of each item can be toggled individually. On touch enabled devices, metaKeySelection is turned off automatically.' + }, + { + name: 'autoOptionFocus', + type: 'boolean', + default: 'false', + description: 'Whether to focus on the first visible or selected element when the overlay panel is shown.' + }, + { + name: 'dataKey', + type: 'string', + default: 'null', + description: 'Name of the field that uniquely identifies the a record in the data.' + }, + { + name: 'listStyle', + type: 'object', + default: 'null', + description: 'Inline style of the the list element.' + }, + { + name: 'responsive', + type: 'boolean', + default: 'true', + description: 'Whether the list optimizes layout based on screen size.' + }, + { + name: 'breakpoint', + type: 'string', + default: '960px', + description: 'The breakpoint to define the maximum width boundary when responsiveness is enabled.' + }, + { + name: 'striped', + type: 'boolean', + default: 'false', + description: 'Whether to displays rows with alternating colors.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const OrderListEvents = [ + { + name: 'reorder', + description: 'Callback to invoke when the list is reordered.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.value', + type: 'array', + description: 'Ordered list' + }, + { + name: 'event.direction', + type: 'string', + description: 'Direction of the change; "up", "down", "bottom", "top"' + } + ] + }, + { + name: 'selection-change', + description: 'Callback to invoke when selection changes.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.value', + type: 'array', + description: 'Ordered list' + } + ] + } +]; + +const OrderListSlots = [ + { + name: 'header', + description: "Custom content for the component's header." + }, + { + name: 'item', + description: 'Custom content for the item.' + }, + { + name: 'controlsstart', + description: 'Custom content before the buttons.' + }, + { + name: 'controlsend', + description: 'Custom content after the buttons.' + }, + { + name: 'movetopicon', + description: 'Custom move top icon template.' + }, + { + name: 'moveupicon', + description: 'Custom move up icon template.' + }, + { + name: 'movedownicon', + description: 'Custom move down icon template.' + }, + { + name: 'movebottomicon', + description: 'Custom move bottom icon template.' + } +]; + +module.exports = { + orderlist: { + name: 'OrderList', + description: 'OrderList is used to managed the order of a collection.', + props: OrderListProps, + events: OrderListEvents, + slots: OrderListSlots + } +}; diff --git a/apps/showcase/api-generator/components/organizationchart.js b/apps/showcase/api-generator/components/organizationchart.js new file mode 100644 index 000000000..696712895 --- /dev/null +++ b/apps/showcase/api-generator/components/organizationchart.js @@ -0,0 +1,108 @@ +const OrganizationChartProps = [ + { + name: 'value', + type: 'any', + default: 'null', + description: 'Value of the component.' + }, + { + name: 'selectionKeys', + type: 'object', + default: 'null', + description: 'A map instance of key-value pairs to represented the selected nodes.' + }, + { + name: 'selectionMode', + type: 'string', + default: 'null', + description: 'Type of the selection, valid values are "single" and "multiple".' + }, + { + name: 'collapsible', + type: 'boolean', + default: 'false', + description: 'Whether the nodes can be expanded or toggled.' + }, + { + name: 'collapsedKeys', + type: 'object', + default: 'null', + description: 'A map instance of key-value pairs to represented the collapsed nodes.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const OrganizationChartEvents = [ + { + name: 'node-select', + description: 'Callback to invoke when a node is selected.', + arguments: [ + { + name: 'node', + type: 'object', + description: 'Node instance' + } + ] + }, + { + name: 'node-unselect', + description: 'Callback to invoke when a node is unselected.', + arguments: [ + { + name: 'node', + type: 'object', + description: 'Node instance' + } + ] + }, + { + name: 'node-expand', + description: 'Callback to invoke when a node is expanded.', + arguments: [ + { + name: 'node', + type: 'object', + description: 'Node instance' + } + ] + }, + { + name: 'node-collapse', + description: 'Callback to invoke when a node is collapsed.', + arguments: [ + { + name: 'node', + type: 'object', + description: 'Node instance' + } + ] + } +]; + +const OrganizationChartSlots = [ + { + name: 'toggleicon', + description: 'Custom toggler icon template.' + } +]; + +module.exports = { + organizationchart: { + name: 'OrganizationChart', + description: 'OrganizationChart visualizes hierarchical organization data.', + props: OrganizationChartProps, + events: OrganizationChartEvents, + slots: OrganizationChartSlots + } +}; diff --git a/apps/showcase/api-generator/components/overlaypanel.js b/apps/showcase/api-generator/components/overlaypanel.js new file mode 100644 index 000000000..f9b0af4d0 --- /dev/null +++ b/apps/showcase/api-generator/components/overlaypanel.js @@ -0,0 +1,100 @@ +const OverlayPanelProps = [ + { + name: 'dismissable', + type: 'boolean', + default: 'true', + description: 'Enables to hide the overlay when outside is clicked.' + }, + { + name: 'showCloseIcon', + type: 'boolean', + default: 'false', + description: 'When enabled, displays a close icon at top right corner.' + }, + { + name: 'appendTo', + type: 'string', + default: 'body', + description: 'A valid query selector or an HTMLElement to specify where the overlay gets attached.' + }, + { + name: 'baseZIndex', + type: 'number', + default: '0', + description: 'Base zIndex value to use in layering.' + }, + { + name: 'autoZIndex', + type: 'boolean', + default: 'true', + description: 'Whether to automatically manage layering.' + }, + { + name: 'ariaCloseLabel', + type: 'string', + default: 'close', + description: 'Aria label of the close icon.' + }, + { + name: 'breakpoints', + type: 'object', + default: 'null', + description: 'Object literal to define widths per screen size.' + }, + { + name: 'closeIcon', + type: 'string', + default: 'undefined', + description: 'Display a custom close icon for the message.' + }, + { + name: 'closeOnEscape', + type: 'boolean', + default: 'true', + description: 'Specifies if pressing escape key should hide the dialog.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const OverlayPanelSlots = [ + { + name: 'closeicon', + description: 'Custom close icon template.' + } +]; + +const OverlayPanelEvents = [ + { + name: 'show', + description: 'Callback to invoke before the overlay is shown.' + }, + { + name: 'hide', + description: 'Callback to invoke before the overlay is hidden.' + }, + { + name: 'container', + description: 'Custom container template.' + } +]; + +module.exports = { + overlaypanel: { + name: 'OverlayPanel', + description: 'OverlayPanel is a container component positioned as connected to its target.', + props: OverlayPanelProps, + slots: OverlayPanelSlots, + events: OverlayPanelEvents + } +}; diff --git a/apps/showcase/api-generator/components/paginator.js b/apps/showcase/api-generator/components/paginator.js new file mode 100644 index 000000000..0cc4c1d23 --- /dev/null +++ b/apps/showcase/api-generator/components/paginator.js @@ -0,0 +1,128 @@ +const PaginatorProps = [ + { + name: 'totalRecords', + type: 'number', + default: '0', + description: 'Number of total records.' + }, + { + name: 'rows', + type: 'number', + default: '0', + description: 'Data count to display per page.' + }, + { + name: 'first', + type: 'number', + default: '0', + description: 'Zero-relative number of the first row to be displayed.' + }, + { + name: 'pageLinkSize', + type: 'number', + default: '5', + description: 'Number of page links to display.' + }, + { + name: 'rowsPerPageOptions', + type: 'array', + default: 'null', + description: 'Array of integer values to display inside rows per page dropdown.' + }, + { + name: 'template', + type: 'string', + default: 'FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink RowsPerPageDropdown', + description: 'Template of the paginator.' + }, + { + name: 'currentPageReportTemplate', + type: 'string', + default: '({currentPage} of {totalPages})', + description: 'Template of the current page report element. Available placeholders are {currentPage},{totalPages},{rows},{first},{last} and {totalRecords}' + }, + { + name: 'alwaysShow', + type: 'boolean', + default: 'true', + description: 'Whether to show the paginator even there is only one page.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const PaginatorEvents = [ + { + name: 'page', + description: 'Callback to invoke when page changes, the event object contains information about the new state.', + arguments: [ + { + name: 'event.page', + type: 'number', + description: 'New page number' + }, + { + name: 'event.first', + type: 'number', + description: 'Index of first record' + }, + { + name: 'event.rows', + type: 'number', + description: 'Number of rows to display in new page' + }, + { + name: 'event.pageCount', + type: 'number', + description: 'Total number of pages' + } + ] + } +]; + +const PaginatorSlots = [ + { + name: 'start', + description: "Custom content for the component's left side." + }, + { + name: 'end', + description: "Custom content for the component's right side." + }, + { + name: 'firstpagelinkicon', + description: 'Custom first page link icon template.' + }, + { + name: 'prevpagelinkicon', + description: 'Custom previous page link icon template.' + }, + { + name: 'nextpagelinkicon', + description: 'Custom next page link icon template.' + }, + { + name: 'lastpagelinkicon', + description: 'Custom last page link icon template.' + } +]; + +module.exports = { + paginator: { + name: 'Paginator', + description: 'Paginator is a generic component to display content in paged format.', + props: PaginatorProps, + events: PaginatorEvents, + slots: PaginatorSlots + } +}; diff --git a/apps/showcase/api-generator/components/panel.js b/apps/showcase/api-generator/components/panel.js new file mode 100644 index 000000000..f49cb01b4 --- /dev/null +++ b/apps/showcase/api-generator/components/panel.js @@ -0,0 +1,86 @@ +const PanelProps = [ + { + name: 'header', + type: 'string', + default: 'null', + description: 'Header text of the panel.' + }, + { + name: 'toggleable', + type: 'boolean', + default: 'null', + description: 'Defines if content of panel can be expanded and collapsed.' + }, + { + name: 'collapsed', + type: 'boolean', + default: 'null', + description: 'Defines the initial state of panel content.' + }, + { + name: 'toggleButtonProps', + type: 'string', + default: 'null', + description: 'Used to pass the custom value to read for the anchor inside the component.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const PanelEvents = [ + { + name: 'toggle', + description: 'Callback to invoke when a tab toggle.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.value', + type: 'boolean', + description: 'collapsed state as a boolean' + } + ] + } +]; + +const PanelSlots = [ + { + name: 'header', + description: "Custom content for the component's header." + }, + { + name: 'icons', + description: "Custom content for the header's icon." + }, + { + name: 'toggleicon', + description: "Custom content for the component's toggler icon." + }, + { + name: 'footer', + description: "Custom content for the component's footer." + } +]; + +module.exports = { + panel: { + name: 'Panel', + description: 'Panel is a container with the optional content toggle feature.', + props: PanelProps, + events: PanelEvents, + slots: PanelSlots + } +}; diff --git a/apps/showcase/api-generator/components/panelmenu.js b/apps/showcase/api-generator/components/panelmenu.js new file mode 100644 index 000000000..d1a2c8863 --- /dev/null +++ b/apps/showcase/api-generator/components/panelmenu.js @@ -0,0 +1,54 @@ +const PanelMenuProps = [ + { + name: 'model', + type: 'array', + default: 'null', + description: 'An array of menuitems.' + }, + { + name: 'expandedKeys', + type: 'object', + default: 'null', + description: 'A map of keys to represent the expansion state in controlled mode.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const PanelMenuSlots = [ + { + name: 'item', + description: 'Custom item template.' + }, + { + name: 'submenuicon', + description: 'Custom submenu icon template.' + }, + { + name: 'headericon', + description: 'Custom header icon template.' + }, + { + name: 'itemicon', + description: 'Custom item icon template.' + } +]; + +module.exports = { + panelmenu: { + name: 'PanelMenu', + description: 'PanelMenu is a hybrid of Accordion and Tree components', + props: PanelMenuProps, + slots: PanelMenuSlots + } +}; diff --git a/apps/showcase/api-generator/components/password.js b/apps/showcase/api-generator/components/password.js new file mode 100644 index 000000000..19011e585 --- /dev/null +++ b/apps/showcase/api-generator/components/password.js @@ -0,0 +1,211 @@ +const PasswordProps = [ + { + name: 'modelValue', + type: 'any', + default: 'null', + description: 'Value of the component.' + }, + { + name: 'inputId', + type: 'string', + default: 'null', + description: 'Identifier of the underlying input element.' + }, + { + name: 'promptLabel', + type: 'string', + default: 'null', + description: 'Text to prompt password entry. Defaults to PrimeVue Locale configuration.' + }, + { + name: 'mediumRegex', + type: 'string', + default: '^(((?=.*[a-z])(?=.*[A-Z]))|((?=.*[a-z])(?=.*[0-9]))|((?=.*[A-Z])(?=.*[0-9])))(?=.{6,})', + description: 'Regex for a medium level password.' + }, + { + name: 'strongRegex', + type: 'string', + default: '^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.{8,})', + description: 'Regex for a strong level password.' + }, + { + name: 'weakLabel', + type: 'string', + default: 'null', + description: 'Text for a weak password. Defaults to PrimeVue Locale configuration.' + }, + { + name: 'mediumLabel', + type: 'string', + default: 'null', + description: 'Text for a medium password. Defaults to PrimeVue Locale configuration.' + }, + { + name: 'strongLabel', + type: 'string', + default: 'null', + description: 'Text for a strong password. Defaults to PrimeVue Locale configuration.' + }, + { + name: 'feedback', + type: 'boolean', + default: 'true', + description: 'Whether to show the strength indicator or not.' + }, + { + name: 'toogleMask', + type: 'boolean', + default: 'false', + description: 'Whether to show an icon to display the password as plain text.' + }, + { + name: 'appendTo', + type: 'string', + default: 'body', + description: 'A valid query selector or an HTMLElement to specify where the overlay gets attached. Special keywords are "body" for document body and "self" for the element itself.' + }, + { + name: 'hideIcon', + type: 'string', + default: 'null', + description: 'Icon to hide displaying the password as plain text.' + }, + { + name: 'showIcon', + type: 'string', + default: 'null', + description: 'Icon to show displaying the password as plain text.' + }, + { + name: 'placeholder', + type: 'string', + default: 'null', + description: 'Placeholder text for the input.' + }, + { + name: 'invalid', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should have invalid state style.' + }, + { + name: 'variant', + type: 'string', + default: 'null', + description: 'Specifies the input variant of the component.' + }, + { + name: 'required', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that an input field must be filled out before submitting the form.' + }, + { + name: 'inputId', + type: 'string', + default: 'null', + description: 'Identifier of the underlying input element.' + }, + { + name: 'inputStyle', + type: 'object', + default: 'null', + description: 'Inline style of the input field.' + }, + { + name: 'inputClass', + type: 'string | object', + default: 'null', + description: 'Style class of the input field.' + }, + { + name: 'inputProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLInputElement to the focusable input element inside the component.' + }, + { + name: 'panelId', + type: 'string', + default: 'null', + description: 'Identifier of the underlying overlay panel element.' + }, + { + name: 'panelClass', + type: 'string | object', + default: 'null', + description: 'Style class of the overlay panel.' + }, + { + name: 'panelStyle', + type: 'object', + default: 'null', + description: 'Inline style of the overlay panel.' + }, + { + name: 'panelProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLDivElement to the overlay panel inside the component.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const PasswordSlots = [ + { + name: 'header', + description: "Custom content for the component's header." + }, + { + name: 'content', + description: 'Custom content for the component.' + }, + { + name: 'footer', + description: "Custom content for the component's footer." + }, + { + name: 'hideicon', + description: 'Custom content for the hide icon.' + }, + { + name: 'showicon', + description: 'Custom content for the show icon.' + } +]; + +const PasswordEmits = [ + { + name: 'change', + description: 'Callback to invoke on value change.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Browser event' + } + ] + } +]; + +module.exports = { + password: { + name: 'Password', + description: 'Password displays strength indicator for password fields.', + props: PasswordProps, + slots: PasswordSlots, + events: PasswordEmits + } +}; diff --git a/apps/showcase/api-generator/components/picklist.js b/apps/showcase/api-generator/components/picklist.js new file mode 100644 index 000000000..2638f17c5 --- /dev/null +++ b/apps/showcase/api-generator/components/picklist.js @@ -0,0 +1,275 @@ +const PickListProps = [ + { + name: 'modelValue', + type: 'array', + default: 'null', + description: 'Value of the component as a multidimensional array.' + }, + { + name: 'selection', + type: 'array', + default: 'null', + description: 'Selected items in the list as a multidimensional array.' + }, + { + name: 'metaKeySelection', + type: 'boolean', + default: 'true', + description: + 'Defines whether metaKey is requred or not for the selection. When true metaKey needs to be pressed to select or unselect an item and when set to false selection of each item can be toggled individually. On touch enabled devices, metaKeySelection is turned off automatically.' + }, + { + name: 'autoOptionFocus', + type: 'boolean', + default: 'false', + description: 'Whether to focus on the first visible or selected element when the overlay panel is shown.' + }, + { + name: 'dataKey', + type: 'string', + default: 'null', + description: 'Name of the field that uniquely identifies the a record in the data.' + }, + { + name: 'listStyle', + type: 'object', + default: 'null', + description: 'Inline style of the the list element.' + }, + { + name: 'responsive', + type: 'boolean', + default: 'true', + description: 'Whether the list optimizes layout based on screen size.' + }, + { + name: 'breakpoint', + type: 'string', + default: '960px', + description: 'The breakpoint to define the maximum width boundary when responsiveness is enabled.' + }, + { + name: 'striped', + type: 'boolean', + default: 'false', + description: 'Whether to displays rows with alternating colors.' + }, + { + name: 'showSourceControls', + type: 'boolean', + default: 'true', + description: 'Whether to show buttons of source list.' + }, + { + name: 'showTargetControls', + type: 'boolean', + default: 'true', + description: 'Whether to show buttons of target list.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const PickListEvents = [ + { + name: 'reorder', + description: 'Callback to invoke when the list is reordered.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.value', + type: 'array', + description: 'Ordered list' + }, + { + name: 'event.direction', + type: 'string', + description: 'Direction of the change; "up", "down", "bottom", "top"' + }, + { + name: 'event.listIndex', + type: 'number', + description: 'Index of the list that is ordered, 0 represents the source and 1 represents the target list.' + } + ] + }, + { + name: 'move-to-target', + description: 'Callback to invoke when one or more items are moved to the target list.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.items', + type: 'object', + description: 'Moved items' + } + ] + }, + { + name: 'move-all-to-target', + description: 'Callback to invoke when all items are moved to the target list.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.items', + type: 'object', + description: 'Moved items' + } + ] + }, + { + name: 'move-to-source', + description: 'Callback to invoke when one or more items are moved to the source list.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.items', + type: 'object', + description: 'Moved items' + } + ] + }, + { + name: 'move-all-to-source', + description: 'Callback to invoke when all items are moved to the source list.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.items', + type: 'object', + description: 'Moved items' + } + ] + }, + { + name: 'selection-change', + description: 'Callback to invoke when one or more items are moved to the other list.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.value', + type: 'array', + description: 'Selected items' + } + ] + } +]; + +const PickListSlots = [ + { + name: 'header', + description: 'Custom header template.' + }, + { + name: 'sourceheader', + description: "Custom content for the component's source header." + }, + { + name: 'item', + description: 'Custom content for the item.' + }, + { + name: 'targetheader', + description: "Custom content for the component's target header." + }, + { + name: 'sourcecontrolsstart', + description: 'Custom content before source control buttons.' + }, + { + name: 'sourcecontrolsend', + description: 'Custom content after source control buttons.' + }, + { + name: 'movecontrolsstart', + description: 'Custom content before move buttons.' + }, + { + name: 'movecontrolsend', + description: 'Custom content after move buttons.' + }, + { + name: 'targetcontrolsstart', + description: 'Custom content before target control buttons.' + }, + { + name: 'targetcontrolsend', + description: 'Custom content after target control buttons.' + }, + { + name: 'moveupicon', + description: 'Custom move up icon template.' + }, + { + name: 'movetopicon', + description: 'Custom move top icon template.' + }, + { + name: 'movedownicon', + description: 'Custom move down icon template.' + }, + { + name: 'movebottomicon', + description: 'Custom move bottom icon template.' + }, + { + name: 'movetotargeticon', + description: 'Custom move to target icon template.' + }, + { + name: 'movealltotargeticon', + description: 'Custom move all to target icon template.' + }, + { + name: 'movetosourceicon', + description: 'Custom move to source icon template.' + }, + { + name: 'movealltosourceicon', + description: 'Custom move all to source icon template.' + } +]; + +module.exports = { + picklist: { + name: 'PickList', + description: 'PickList is used to reorder items between different lists.', + props: PickListProps, + events: PickListEvents, + slots: PickListSlots + } +}; diff --git a/apps/showcase/api-generator/components/popover.js b/apps/showcase/api-generator/components/popover.js new file mode 100644 index 000000000..87cb7c5af --- /dev/null +++ b/apps/showcase/api-generator/components/popover.js @@ -0,0 +1,100 @@ +const PopoverProps = [ + { + name: 'dismissable', + type: 'boolean', + default: 'true', + description: 'Enables to hide the overlay when outside is clicked.' + }, + { + name: 'showCloseIcon', + type: 'boolean', + default: 'false', + description: 'When enabled, displays a close icon at top right corner.' + }, + { + name: 'appendTo', + type: 'string', + default: 'body', + description: 'A valid query selector or an HTMLElement to specify where the overlay gets attached.' + }, + { + name: 'baseZIndex', + type: 'number', + default: '0', + description: 'Base zIndex value to use in layering.' + }, + { + name: 'autoZIndex', + type: 'boolean', + default: 'true', + description: 'Whether to automatically manage layering.' + }, + { + name: 'ariaCloseLabel', + type: 'string', + default: 'close', + description: 'Aria label of the close icon.' + }, + { + name: 'breakpoints', + type: 'object', + default: 'null', + description: 'Object literal to define widths per screen size.' + }, + { + name: 'closeIcon', + type: 'string', + default: 'undefined', + description: 'Display a custom close icon for the message.' + }, + { + name: 'closeOnEscape', + type: 'boolean', + default: 'true', + description: 'Specifies if pressing escape key should hide the dialog.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const PopoverSlots = [ + { + name: 'closeicon', + description: 'Custom close icon template.' + } +]; + +const PopoverEvents = [ + { + name: 'show', + description: 'Callback to invoke before the overlay is shown.' + }, + { + name: 'hide', + description: 'Callback to invoke before the overlay is hidden.' + }, + { + name: 'container', + description: 'Custom container template.' + } +]; + +module.exports = { + overlaypanel: { + name: 'Popover', + description: 'Popover is a container component positioned as connected to its target.', + props: PopoverProps, + slots: PopoverSlots, + events: PopoverEvents + } +}; diff --git a/apps/showcase/api-generator/components/portal.js b/apps/showcase/api-generator/components/portal.js new file mode 100644 index 000000000..f0dd3166e --- /dev/null +++ b/apps/showcase/api-generator/components/portal.js @@ -0,0 +1,28 @@ +const PortalProps = [ + { + name: 'appendTo', + type: 'string', + default: 'body', + description: 'A valid query selector or an HTMLElement to specify where the dialog gets attached. Special keywords are "body" for document body and "self" for the element itself.' + }, + { + name: 'disabled', + type: 'boolean', + default: 'false', + description: 'If disabled, the Portal feature is eliminated and the content is displayed directly.' + } +]; + +const PortalEvents = []; + +const PortalSlots = []; + +module.exports = { + portal: { + name: 'Portal', + description: 'Portal moves its container to a specific location based on target elements. Basically it uses in the background.', + props: PortalProps, + events: PortalEvents, + slots: PortalSlots + } +}; diff --git a/apps/showcase/api-generator/components/progressbar.js b/apps/showcase/api-generator/components/progressbar.js new file mode 100644 index 000000000..8ac15386b --- /dev/null +++ b/apps/showcase/api-generator/components/progressbar.js @@ -0,0 +1,40 @@ +const ProgressbarProps = [ + { + name: 'value', + type: 'number', + default: 'null', + description: 'Current value of the progress.' + }, + { + name: 'mode', + type: 'string', + default: 'determinate', + description: 'Defines the mode of the progress, valid values are "determinate" and "indeterminate".' + }, + { + name: 'showValue', + type: 'boolean', + default: 'true', + description: 'Whether to display the progress bar value.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +module.exports = { + progressbar: { + name: 'ProgressBar', + description: 'ProgressBar is a process status indicator.', + props: ProgressbarProps + } +}; diff --git a/apps/showcase/api-generator/components/progressspinner.js b/apps/showcase/api-generator/components/progressspinner.js new file mode 100644 index 000000000..4a492e057 --- /dev/null +++ b/apps/showcase/api-generator/components/progressspinner.js @@ -0,0 +1,40 @@ +const ProgressSpinnerProps = [ + { + name: 'strokeWidth', + type: 'string', + default: '2', + description: 'Width of the circle stroke.' + }, + { + name: 'fill', + type: 'string', + default: 'null', + description: 'Color for the background of the circle.' + }, + { + name: 'animationDuration', + type: 'string', + default: '2s', + description: 'Duration of the rotate animation.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +module.exports = { + progressspinner: { + name: 'ProgressSpinner', + description: 'ProgressSpinner is a process status indicator', + props: ProgressSpinnerProps + } +}; diff --git a/apps/showcase/api-generator/components/radiobutton.js b/apps/showcase/api-generator/components/radiobutton.js new file mode 100644 index 000000000..b843d753f --- /dev/null +++ b/apps/showcase/api-generator/components/radiobutton.js @@ -0,0 +1,120 @@ +const RadioButtonProps = [ + { + name: 'value', + type: 'any', + default: 'null', + description: 'Value of the checkbox.' + }, + { + name: 'modelValue', + type: 'any', + default: 'null', + description: 'Value binding of the checkbox.' + }, + { + name: 'name', + type: 'string', + default: 'null', + description: 'Name of the input element.' + }, + { + name: 'disabled', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the element should be disabled.' + }, + { + name: 'invalid', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should have invalid state style.' + }, + { + name: 'variant', + type: 'string', + default: 'null', + description: 'Specifies the input variant of the component.' + }, + { + name: 'inputId', + type: 'string', + default: 'null', + description: 'Identifier of the underlying input element.' + }, + { + name: 'inputClass', + type: 'string | object', + default: 'null', + description: 'Style class of the input field.' + }, + { + name: 'inputStyle', + type: 'object', + default: 'null', + description: 'Inline style of the input field.' + }, + { + name: 'inputProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLInputElement to the focusable input element inside the component.' + }, + { + name: 'aria-labelledby', + type: 'string', + default: 'null', + description: 'Establishes relationships between the component and label(s) where its value should be one or more element IDs.' + }, + { + name: 'aria-label', + type: 'string', + default: 'null', + description: 'Used to define a string that labels the element.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const RadioButtonEvents = [ + { + name: 'click', + description: 'Callback to invoke on radio button click.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Browser event' + } + ] + }, + { + name: 'change', + description: 'Callback to invoke on radio button value change.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Browser event' + } + ] + } +]; + +module.exports = { + radiobutton: { + name: 'RadioButton', + description: 'RadioButton is an extension to standard radio button element with theming.', + props: RadioButtonProps, + events: RadioButtonEvents + } +}; diff --git a/apps/showcase/api-generator/components/rating.js b/apps/showcase/api-generator/components/rating.js new file mode 100644 index 000000000..92d845af9 --- /dev/null +++ b/apps/showcase/api-generator/components/rating.js @@ -0,0 +1,90 @@ +const RatingProps = [ + { + name: 'modelValue', + type: 'number', + default: 'null', + description: 'Value of the rating.' + }, + { + name: 'disabled', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the element should be disabled.' + }, + { + name: 'readonly', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that component is read-only.' + }, + { + name: 'stars', + type: 'number', + default: '5', + description: 'Number of stars.' + }, + { + name: 'onIcon', + type: 'string', + default: 'null', + description: 'Icon for the on state.' + }, + { + name: 'offIcon', + type: 'string', + default: 'null', + description: 'Icon for the off state.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const RatingSlots = [ + { + name: 'onicon', + description: 'Custom on icon template.' + }, + { + name: 'officon', + description: 'Custom off icon template.' + } +]; + +const RatingEvents = [ + { + name: 'change', + description: 'Callback to invoke on value change.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.value', + type: 'number', + description: 'Selected option value' + } + ] + } +]; + +module.exports = { + rating: { + name: 'rating', + description: 'Rating component is a star based selection input.', + props: RatingProps, + slots: RatingSlots, + events: RatingEvents + } +}; diff --git a/apps/showcase/api-generator/components/ripple.js b/apps/showcase/api-generator/components/ripple.js new file mode 100644 index 000000000..48b5a6339 --- /dev/null +++ b/apps/showcase/api-generator/components/ripple.js @@ -0,0 +1,7 @@ +module.exports = { + ripple: { + name: 'Ripple', + description: 'Ripple directive adds ripple effect to the host element.', + 'vue-modifiers': [] + } +}; diff --git a/apps/showcase/api-generator/components/row.js b/apps/showcase/api-generator/components/row.js new file mode 100644 index 000000000..7f0dbea33 --- /dev/null +++ b/apps/showcase/api-generator/components/row.js @@ -0,0 +1,23 @@ +const RowProps = [ + { + name: 'type', + type: 'string', + default: 'null', + description: 'Defines the type of the group.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + } +]; + +module.exports = { + row: { + name: 'Row', + description: 'DataTable can be grouped by defining a Row component with nested columns', + 'doc-url': 'datatable', + props: RowProps + } +}; diff --git a/apps/showcase/api-generator/components/scrollpanel.js b/apps/showcase/api-generator/components/scrollpanel.js new file mode 100644 index 000000000..fcaf7837f --- /dev/null +++ b/apps/showcase/api-generator/components/scrollpanel.js @@ -0,0 +1,28 @@ +const ScrollPanelProps = [ + { + name: 'step', + type: 'number', + default: '5', + description: 'Step factor to scroll the content while pressing the arrow keys.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +module.exports = { + scrollpanel: { + name: 'ScrollPanel', + description: 'ScrollPanel is a cross browser, lightweight and themable alternative to native browser scrollbar.', + props: ScrollPanelProps + } +}; diff --git a/apps/showcase/api-generator/components/scrolltop.js b/apps/showcase/api-generator/components/scrolltop.js new file mode 100644 index 000000000..9a86d471f --- /dev/null +++ b/apps/showcase/api-generator/components/scrolltop.js @@ -0,0 +1,54 @@ +const ScrollTopProps = [ + { + name: 'target', + type: 'string', + default: 'window', + description: 'Target of the ScrollTop, valid values are "window" and "parent".' + }, + { + name: 'threshold', + type: 'number', + default: '400', + description: 'Defines the threshold value of the vertical scroll position of the target to toggle the visibility.' + }, + { + name: 'icon', + type: 'string', + default: 'undefined', + description: 'Icon to display.' + }, + { + name: 'behavior', + type: 'string', + default: 'smooth', + description: 'Defines the scrolling behavi, "smooth" adds an animation and "auto" scrolls with a jump.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const ScrollTopSlots = [ + { + name: 'icon', + description: 'Custom scrolltop icon template.' + } +]; + +module.exports = { + scrolltop: { + name: 'ScrollTop', + description: 'ScrollTop gets displayed after a certain scroll position and used to navigates to the top of the page quickly.', + props: ScrollTopProps, + slots: ScrollTopSlots + } +}; diff --git a/apps/showcase/api-generator/components/select.js b/apps/showcase/api-generator/components/select.js new file mode 100644 index 000000000..3c7686755 --- /dev/null +++ b/apps/showcase/api-generator/components/select.js @@ -0,0 +1,432 @@ +const SelectProps = [ + { + name: 'modelValue', + type: 'any', + default: 'null', + description: 'Value of the component.' + }, + { + name: 'options', + type: 'array', + default: 'null', + description: 'An array of selectitems to display as the available options.' + }, + { + name: 'optionLabel', + type: 'string | function', + default: 'null', + description: 'Property name or getter function to use as the label of an option.' + }, + { + name: 'optionValue', + type: 'string | function', + default: 'null', + description: 'Property name or getter function to use as the value of an option, defaults to the option itself when not defined.' + }, + { + name: 'optionDisabled', + type: 'boolean', + default: 'null', + description: 'Property name or getter function to use as the disabled flag of an option, defaults to false when not defined.' + }, + { + name: 'optionGroupLabel', + type: 'string | function', + default: 'null', + description: 'Property name or getter function to use as the label of an option group.' + }, + { + name: 'optionGroupChildren', + type: 'string | function', + default: 'null', + description: 'Property name or getter function that refers to the children options of option group.' + }, + { + name: 'scrollHeight', + type: 'string', + default: '200px', + description: 'Height of the viewport, a scrollbar is defined if height of list exceeds this value.' + }, + { + name: 'filter', + type: 'boolean', + default: 'false', + description: 'When specified, displays a filter input at header.' + }, + { + name: 'filterPlaceholder', + type: 'string', + default: 'null', + description: 'Placeholder text to show when filter input is empty.' + }, + { + name: 'filterLocale', + type: 'string', + default: 'undefined', + description: "Locale to use in filtering. The default locale is the host environment's current locale." + }, + { + name: 'filterMatchMode', + type: 'string', + default: 'contains', + description: 'Defines the filtering algorithm to use when searching the options. Valid values are "contains" (default), "startsWith" and "endsWith"' + }, + { + name: 'filterFields', + type: 'array', + default: 'null', + description: 'Fields used when filtering the options, defaults to optionLabel.' + }, + { + name: 'editable', + type: 'boolean', + default: 'false', + description: 'When present, custom value instead of predefined options can be entered using the editable input field.' + }, + { + name: 'placeholder', + type: 'string', + default: 'null', + description: 'Default text to display when no option is selected.' + }, + { + name: 'disabled', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should be disabled.' + }, + { + name: 'invalid', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should have invalid state style.' + }, + { + name: 'variant', + type: 'string', + default: 'null', + description: 'Specifies the input variant of the component.' + }, + { + name: 'dataKey', + type: 'string', + default: 'null', + description: 'A property to uniquely identify an option.' + }, + { + name: 'showClear', + type: 'boolean', + default: 'false', + description: 'When enabled, a clear icon is displayed to clear the value.' + }, + { + name: 'inputId', + type: 'string', + default: 'null', + description: 'Identifier of the underlying input element.' + }, + { + name: 'inputStyle', + type: 'object', + default: 'null', + description: 'Inline style of the input field.' + }, + { + name: 'inputClass', + type: 'string | object', + default: 'null', + description: 'Style class of the input field.' + }, + { + name: 'inputProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLInputElement/HTMLSpanElement to the focusable input element inside the component.' + }, + { + name: 'panelStyle', + type: 'object', + default: 'null', + description: 'Inline style of the overlay panel.' + }, + { + name: 'panelClass', + type: 'string', + default: 'null', + description: 'Style class of the overlay panel.' + }, + { + name: 'panelProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLDivElement to the overlay panel inside the component.' + }, + { + name: 'filterInputProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLInputElement to the filter input inside the component.' + }, + { + name: 'clearIconProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLElement to the clear icon inside the component.' + }, + { + name: 'appendTo', + type: 'string', + default: 'body', + description: "A valid query selector or an HTMLElement to specify where the overlay gets attached. Special keywords are 'body' for document body and 'self' for the element itself." + }, + { + name: 'loading', + type: 'boolean', + default: 'false', + description: 'Whether the multiselect is in loading state.' + }, + { + name: 'loadingIcon', + type: 'string', + default: 'pi pi-spinner pi-spin', + description: 'Icon to display in loading state.' + }, + { + name: 'resetFilterOnHide', + type: 'boolean', + default: 'false', + description: 'Clears the filter value when hiding the dropdown.' + }, + { + name: 'resetFilterOnClear', + type: 'boolean', + default: 'false', + description: 'Clears the filter value when clicking on the clear icon.' + }, + { + name: 'virtualScrollerOptions', + type: 'object', + default: 'null', + description: 'Whether to use the virtualScroller feature. The properties of VirtualScroller component can be used like an object in it.' + }, + { + name: 'autoOptionFocus', + type: 'boolean', + default: 'false', + description: 'Whether to focus on the first visible or selected element when the overlay panel is shown.' + }, + { + name: 'autoFilterFocus', + type: 'boolean', + default: 'false', + description: 'Whether to focus on the filter element when the overlay panel is shown.' + }, + { + name: 'selectOnFocus', + type: 'boolean', + default: 'false', + description: 'When enabled, the focused option is selected.' + }, + { + name: 'filterMessage', + type: 'string', + default: '{0} results are available', + description: 'Text to be displayed in hidden accessible field when filtering returns any results. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'selectionMessage', + type: 'string', + default: '{0} items selected', + description: 'Text to be displayed in hidden accessible field when options are selected. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'emptySelectionMessage', + type: 'string', + default: 'No selected item', + description: 'Text to be displayed in hidden accessible field when any option is not selected. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'emptyFilterMessage', + type: 'string', + default: 'No results found', + description: 'Text to display when filtering does not return any results. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'emptyMessage', + type: 'string', + default: 'No results found', + description: 'Text to display when there are no options available. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'tabindex', + type: 'number', + default: '0', + description: 'Index of the element in tabbing order.' + }, + { + name: 'aria-label', + type: 'string', + default: 'null', + description: 'Defines a string value that labels an interactive element.' + }, + { + name: 'aria-labelledby', + type: 'string', + default: 'null', + description: 'Identifier of the underlying input element.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const SelectEvents = [ + { + name: 'change', + description: 'Callback to invoke on value change.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.value', + type: 'string', + description: 'Selected option value' + } + ] + }, + { + name: 'focus', + description: 'Callback to invoke when component receives focus.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Browser event' + } + ] + }, + { + name: 'blur', + description: 'Callback to invoke when component loses focus.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Browser event' + } + ] + }, + { + name: 'before-show', + description: 'Callback to invoke before the overlay is shown.' + }, + { + name: 'before-hide', + description: 'Callback to invoke before the overlay is hidden.' + }, + { + name: 'show', + description: 'Callback to invoke when the overlay is shown.' + }, + { + name: 'hide', + description: 'Callback to invoke when the overlay is hidden.' + }, + { + name: 'filter', + description: 'Callback to invoke when the overlay is shown.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.value', + type: 'string', + description: 'Filter value' + } + ] + } +]; + +const SelectSlots = [ + { + name: 'value', + description: "Custom content for the item's value" + }, + { + name: 'indicator', + description: 'Custom content for the dropdown indicator' + }, + { + name: 'header', + description: "Custom content for the component's header" + }, + { + name: 'footer', + description: "Custom content for the component's footer" + }, + { + name: 'option', + description: "Custom content for the item's option" + }, + { + name: 'optiongroup', + description: "Custom content for the item's optiongroup" + }, + { + name: 'emptyfilter', + description: 'Custom content when there is no filtered data to display' + }, + { + name: 'empty', + description: 'Custom content when there is no data to display' + }, + { + name: 'content', + description: 'Custom content for the virtual scroller' + }, + { + name: 'loader', + description: 'Custom content for the virtual scroller loader items' + }, + { + name: 'clearicon', + description: 'Custom clear icon template.' + }, + { + name: 'dropdownicon', + description: 'Custom dropdown icon template.' + }, + { + name: 'loadingicon', + description: 'Custom loading icon template.' + }, + { + name: 'filtericon', + description: 'Custom filter icon template.' + } +]; + +module.exports = { + dropdown: { + name: 'Select', + description: 'Select is used to select an item from a list of options.', + props: SelectProps, + events: SelectEvents, + slots: SelectSlots + } +}; diff --git a/apps/showcase/api-generator/components/selectbutton.js b/apps/showcase/api-generator/components/selectbutton.js new file mode 100644 index 000000000..30659dd50 --- /dev/null +++ b/apps/showcase/api-generator/components/selectbutton.js @@ -0,0 +1,144 @@ +const SelectButtonProps = [ + { + name: 'modelValue', + type: 'any', + default: 'null', + description: 'Value of the component.' + }, + { + name: 'options', + type: 'array', + default: 'null', + description: 'An array of selectitems to display as the available options.' + }, + { + name: 'optionLabel', + type: 'string', + default: 'null', + description: 'Property name or getter function to use as the label of an option.' + }, + { + name: 'optionValue', + type: 'string', + default: 'null', + description: 'Property name or getter function to use as the value of an option, defaults to the option itself when not defined.' + }, + { + name: 'optionDisabled', + type: 'boolean', + default: 'null', + description: 'Property name or getter function to use as the disabled flag of an option, defaults to false when not defined.' + }, + { + name: 'multiple', + type: 'boolean', + default: 'false', + description: 'When specified, allows selecting multiple values.' + }, + { + name: 'disabled', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the element should be disabled.' + }, + { + name: 'invalid', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should have invalid state style.' + }, + { + name: 'dataKey', + type: 'string', + default: 'null', + description: 'A property to uniquely identify an option.' + }, + { + name: 'unselectable', + type: 'boolean', + default: 'false', + description: 'Whether selection can not be cleared.' + }, + { + name: 'allowEmpty', + type: 'boolean', + default: 'true', + description: 'Whether selection can be cleared.' + }, + { + name: 'aria-labelledby', + type: 'string', + default: 'null', + description: 'Identifier of the underlying element.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const SelectButtonEvents = [ + { + name: 'change', + description: 'Callback to invoke on value change.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.value', + type: 'any', + description: 'Single value or an array of values that are selected.' + } + ] + }, + { + name: 'focus', + description: 'Callback to invoke on focus.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Browser event' + } + ] + }, + { + name: 'blur', + description: 'Callback to invoke on blur.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Browser event' + } + ] + } +]; + +const SelectButtonSlots = [ + { + name: 'option', + description: "Custom content for the item's option" + } +]; + +module.exports = { + selectbutton: { + name: 'SelectButton', + description: 'SelectButton is a form component to choose a value from a list of options using button elements.', + props: SelectButtonProps, + events: SelectButtonEvents, + slots: SelectButtonSlots + } +}; diff --git a/apps/showcase/api-generator/components/sidebar.js b/apps/showcase/api-generator/components/sidebar.js new file mode 100644 index 000000000..d942aa12d --- /dev/null +++ b/apps/showcase/api-generator/components/sidebar.js @@ -0,0 +1,114 @@ +const SidebarProps = [ + { + name: 'visible', + type: 'boolean', + default: 'false', + description: 'Specifies the visibility of the dialog.' + }, + { + name: 'position', + type: 'string', + default: 'left', + description: 'Specifies the position of the sidebar, valid values are "left", "right", "top", "bottom" and "full".' + }, + { + name: 'baseZIndex', + type: 'number', + default: '0', + description: 'Base zIndex value to use in layering.' + }, + { + name: 'autoZIndex', + type: 'boolean', + default: 'true', + description: 'Whether to automatically manage layering.' + }, + { + name: 'dismissable', + type: 'boolean', + default: 'true', + description: 'Whether clicking outside closes the panel.' + }, + { + name: 'showCloseIcon', + type: 'boolean', + default: 'true', + description: 'Whether to display a close icon inside the panel.' + }, + { + name: 'modal', + type: 'boolean', + default: 'true', + description: 'Whether to a modal layer behind the sidebar.' + }, + { + name: 'ariaCloseLabel', + type: 'string', + default: 'close', + description: 'Aria label of the close icon.' + }, + { + name: 'blockScroll', + type: 'boolean', + default: 'false', + description: 'Whether background scroll should be blocked when sidebar is visible.' + }, + { + name: 'closeIcon', + type: 'string', + default: 'undefined', + description: 'Icon to display in the sidebar close button.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const SidebarEvents = [ + { + name: 'hide', + description: 'Callback to invoke when sidebar gets hidden.' + }, + { + name: 'show', + description: 'Callback to invoke when sidebar gets shown.' + }, + { + name: 'closeicon', + description: 'Custom close icon template.' + } +]; + +const SidebarSlots = [ + { + name: 'header', + description: 'Custom content for the component header.' + }, + { + name: 'closeicon', + description: 'Custom close icon template.' + }, + { + name: 'container', + description: 'Custom container template.' + } +]; + +module.exports = { + sidebar: { + name: 'Sidebar', + description: 'Sidebar is a panel component displayed as an overlay at the edges of the screen.', + props: SidebarProps, + events: SidebarEvents, + slots: SidebarSlots + } +}; diff --git a/apps/showcase/api-generator/components/skeleton.js b/apps/showcase/api-generator/components/skeleton.js new file mode 100644 index 000000000..e7cd9a22e --- /dev/null +++ b/apps/showcase/api-generator/components/skeleton.js @@ -0,0 +1,58 @@ +const SkeletonProps = [ + { + name: 'shape', + type: 'string', + default: 'rectangle', + description: 'Shape of the element, options are "rectangle" and "circle".' + }, + { + name: 'size', + type: 'string', + default: 'null', + description: 'Size of the Circle or Square.' + }, + { + name: 'width', + type: 'string', + default: '100%', + description: 'Width of the element.' + }, + { + name: 'height', + type: 'string', + default: '1rem', + description: 'Height of the element.' + }, + { + name: 'borderRadius', + type: 'string', + default: 'null', + description: 'Border radius of the element, defaults to value from theme.' + }, + { + name: 'animation', + type: 'string', + default: 'wave', + description: 'Type of the animation, valid options are "wave" and "none".' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +module.exports = { + skeleton: { + name: 'Skeleton', + description: 'Skeleton is a placeholder to display instead of the actual content.', + props: SkeletonProps + } +}; diff --git a/apps/showcase/api-generator/components/slider.js b/apps/showcase/api-generator/components/slider.js new file mode 100644 index 000000000..9c6286866 --- /dev/null +++ b/apps/showcase/api-generator/components/slider.js @@ -0,0 +1,113 @@ +const SliderProps = [ + { + name: 'modelValue', + type: 'number', + default: '0', + description: 'Value of the component.' + }, + { + name: 'min', + type: 'number', + default: '0', + description: 'Mininum boundary value.' + }, + { + name: 'max', + type: 'number', + default: '100', + description: 'Maximum boundary value.' + }, + { + name: 'orientation', + type: 'string', + default: 'horizontal', + description: 'Orientation of the slider, valid values are horizontal and vertical.' + }, + { + name: 'step', + type: 'number', + default: '1', + description: 'Step factor to increment/decrement the value.' + }, + { + name: 'range', + type: 'boolean', + default: 'false', + description: 'When speficed, allows two boundary values to be picked.' + }, + { + name: 'disabled', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should be disabled.' + }, + { + name: 'tabindex', + type: 'number', + default: 'null', + description: 'Index of the element in tabbing order.' + }, + { + name: 'aria-labelledby', + type: 'string', + default: 'null', + description: 'Establishes relationships between the component and label(s) where its value should be one or more element IDs.' + }, + { + name: 'aria-label', + type: 'string', + default: 'null', + description: 'Used to define a string that labels the element.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const SliderEvents = [ + { + name: 'change', + description: 'Callback to invoke on value change.', + arguments: [ + { + name: 'value', + type: 'number', + description: 'Selected option value' + } + ] + }, + { + name: 'slideend', + description: 'Callback to invoke when slide ends.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.value', + type: 'number', + description: 'New value.' + } + ] + } +]; + +module.exports = { + slider: { + name: 'Slider', + description: 'Slider is an input component to provide a numerical input', + props: SliderProps, + events: SliderEvents + } +}; diff --git a/apps/showcase/api-generator/components/speeddial.js b/apps/showcase/api-generator/components/speeddial.js new file mode 100644 index 000000000..ace496815 --- /dev/null +++ b/apps/showcase/api-generator/components/speeddial.js @@ -0,0 +1,169 @@ +const SpeedDialProps = [ + { + name: 'model', + type: 'object', + default: 'any', + description: 'MenuModel instance to define the action items.' + }, + { + name: 'visible', + type: 'boolean', + default: 'false', + description: 'Specifies the visibility of the overlay.' + }, + { + name: 'direction', + type: 'string', + default: 'up', + description: "Specifies the opening direction of actions. Valid values are 'up', 'down', 'left', 'right', 'up-left', 'up-right', 'down-left' and 'down-right'" + }, + { + name: 'transitionDelay', + type: 'number', + default: '30', + description: 'Transition delay step for each action item.' + }, + { + name: 'type', + type: 'string', + default: 'linear', + description: 'Specifies the opening type of actions.' + }, + { + name: 'radius', + type: 'number', + default: '0', + description: 'Radius for *circle types.' + }, + { + name: 'mask', + type: 'boolean', + default: 'false', + description: 'Whether to show a mask element behind the speeddial' + }, + { + name: 'disabled', + type: 'boolean', + default: 'false', + description: 'Whether the component is disabled.' + }, + { + name: 'hideOnClickOutside', + type: 'boolean', + default: 'true', + description: 'Whether the actions close when clicked outside.' + }, + { + name: 'buttonClass', + type: 'string', + default: 'null', + description: 'Style class of the button element.' + }, + { + name: 'maskClass', + type: 'string', + default: 'null', + description: 'Style class of the mask element.' + }, + { + name: 'maskStyle', + type: 'object', + default: 'null', + description: 'Inline style of the mask element.' + }, + { + name: 'showIcon', + type: 'string', + default: 'pi pi-plus', + description: 'Show icon of the button element.' + }, + { + name: 'hideIcon', + type: 'string', + default: 'null', + description: ' Hide icon of the button element.' + }, + { + name: 'rotateAnimation', + type: 'boolean', + default: 'true', + description: 'Defined to rotate showIcon when hideIcon is not present.' + }, + { + name: 'class', + type: 'object', + default: 'null', + description: 'Style class of the element.' + }, + { + name: 'style', + type: 'any', + default: 'null', + description: 'Style class of the element.' + }, + { + name: 'tooltipOptions', + type: 'object', + default: 'null', + description: "Whether to display the tooltip on items. The modifiers of tooltip can be used like an object in it. Valid keys are 'event' and 'position'." + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const SpeedDialEvents = [ + { + name: 'click', + description: 'Fired when the button element clicked.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Browser event' + } + ] + }, + { + name: 'show', + description: 'Fired when the actions are visible.' + }, + { + name: 'hide', + description: 'Fired when the actions are hidden.' + } +]; + +const SpeedDialSlots = [ + { + name: 'item', + description: 'Custom content for the item' + }, + { + name: 'button', + description: 'Custom button template.' + }, + { + name: 'icon', + description: 'Custom icon template.' + } +]; + +module.exports = { + speeddial: { + name: 'SpeedDial', + description: 'When pressed, a floating action button can display multiple primary actions that can be performed on a page.', + props: SpeedDialProps, + events: SpeedDialEvents, + slots: SpeedDialSlots + } +}; diff --git a/apps/showcase/api-generator/components/splitbutton.js b/apps/showcase/api-generator/components/splitbutton.js new file mode 100644 index 000000000..78f9333e5 --- /dev/null +++ b/apps/showcase/api-generator/components/splitbutton.js @@ -0,0 +1,155 @@ +const SplitButtonProps = [ + { + name: 'label', + type: 'string', + default: 'null', + description: 'Text of the button.' + }, + { + name: 'icon', + type: 'string', + default: 'null', + description: 'Name of the icon.' + }, + { + name: 'model', + type: 'object', + default: 'null', + description: 'MenuModel instance to define the overlay items.' + }, + { + name: 'autoZIndex', + type: 'boolean', + default: 'true', + description: 'Whether to automatically manage layering.' + }, + { + name: 'baseZIndex', + type: 'number', + default: '0', + description: 'Base zIndex value to use in layering.' + }, + { + name: 'appendTo', + type: 'string', + default: 'body', + description: 'A valid query selector or an HTMLElement to specify where the overlay gets attached.' + }, + { + name: 'disabled', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the element should be disabled.' + }, + { + name: 'class', + type: 'string', + default: 'null', + description: 'Style class of the component.' + }, + { + name: 'style', + type: 'any', + default: 'null', + description: 'Inline of the component.' + }, + { + name: 'menuButtonIcon', + type: 'string', + default: 'null', + description: 'Name of the menu button icon.' + }, + { + name: 'severity', + type: 'string', + default: 'null', + description: 'Defines the style of the button, valid values are "secondary", "success", "info", "warn", "help", "danger", "contrast".' + }, + { + name: 'raised', + type: 'boolean', + default: 'false', + description: 'Add a shadow to indicate elevation.' + }, + { + name: 'rounded', + type: 'boolean', + default: 'false', + description: 'Add a circular border radius to the button.' + }, + { + name: 'text', + type: 'boolean', + default: 'false', + description: 'Add a textual class to the button without a background initially.' + }, + { + name: 'outlined', + type: 'boolean', + default: 'false', + description: 'Add a border class without a background initially.' + }, + { + name: 'size', + type: 'string', + default: 'null', + description: 'Defines the size of the button, valid values are "small" and "large".' + }, + { + name: 'plain', + type: 'boolean', + default: 'false', + description: 'Add a plain textual class to the button without a background initially.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const SplitButtonEvents = [ + { + name: 'click', + description: 'Callback to invoke when main button is clicked.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Browser event' + } + ] + } +]; + +const SplitButtonSlots = [ + { + name: 'icon', + description: 'Custom icon template.' + }, + { + name: 'menubuttonicon', + description: 'Custom menu button icon template.' + }, + { + name: 'menuitemicon', + description: 'Custom menu item icon template.' + } +]; + +module.exports = { + splitbutton: { + name: 'SplitButton', + description: 'SplitButton groups a set of commands in an overlay with a default command.', + props: SplitButtonProps, + events: SplitButtonEvents, + slots: SplitButtonSlots + } +}; diff --git a/apps/showcase/api-generator/components/splitter.js b/apps/showcase/api-generator/components/splitter.js new file mode 100644 index 000000000..445f929e8 --- /dev/null +++ b/apps/showcase/api-generator/components/splitter.js @@ -0,0 +1,72 @@ +const SplitterProps = [ + { + name: 'layout', + type: 'string', + default: 'horizontal', + description: 'Orientation of the panels, valid values are "horizontal" and "vertical".' + }, + { + name: 'gutterSize', + type: 'number', + default: '4', + description: 'Size of the divider in pixels.' + }, + { + name: 'stateKey', + type: 'string', + default: 'null', + description: 'Storage identifier of a stateful Splitter.' + }, + { + name: 'stateStorage', + type: 'string', + default: 'storage', + description: 'Defines where a stateful splitter keeps its state, valid values are "session" for sessionStorage and "local" for localStorage.' + }, + { + name: 'step', + type: 'number', + default: '5', + description: 'Step factor to increment/decrement the size of the panels while pressing the arrow keys.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const SplitterEvents = [ + { + name: 'resizened', + description: 'Callback to invoke when resize ends.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Browser event' + }, + { + name: 'event.sizes', + type: 'array', + description: 'Sizes of the panels as an array' + } + ] + } +]; + +module.exports = { + splitter: { + name: 'Splitter', + description: 'Splitter is utilized to separate and resize panels', + props: SplitterProps, + events: SplitterEvents + } +}; diff --git a/apps/showcase/api-generator/components/splitterpanel.js b/apps/showcase/api-generator/components/splitterpanel.js new file mode 100644 index 000000000..f60231fa9 --- /dev/null +++ b/apps/showcase/api-generator/components/splitterpanel.js @@ -0,0 +1,29 @@ +const SplitterPanelProps = [ + { + name: 'size', + type: 'number', + default: 'null', + description: 'Size of the element relative to 100%.' + }, + { + name: 'minSize', + type: 'number', + default: 'null', + description: 'Minimum size of the element relative to 100%.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + } +]; + +module.exports = { + splitterpanel: { + name: 'SplitterPanel', + description: 'Splitter requires two SplitterPanel components to wrap.', + 'doc-url': 'splitter', + props: SplitterPanelProps + } +}; diff --git a/apps/showcase/api-generator/components/steps.js b/apps/showcase/api-generator/components/steps.js new file mode 100644 index 000000000..f1db20305 --- /dev/null +++ b/apps/showcase/api-generator/components/steps.js @@ -0,0 +1,54 @@ +const StepsProps = [ + { + name: 'id', + type: 'string', + default: 'null', + description: 'Unique identifier of the element.' + }, + { + name: 'model', + type: 'array', + default: 'null', + description: 'An array of menuitems.' + }, + { + name: 'activeStep', + type: 'number', + default: '0', + description: 'Active step index of menuitem.' + }, + { + name: 'readonly', + type: 'boolean', + default: 'true', + description: 'Whether the items are clickable or not.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const StepsSlots = [ + { + name: 'item', + description: 'Template of a menuitem.' + } +]; + +module.exports = { + steps: { + name: 'steps', + description: 'Steps components is an indicator for the steps in a wizard workflow.', + props: StepsProps, + slots: StepsSlots + } +}; diff --git a/apps/showcase/api-generator/components/styleclass.js b/apps/showcase/api-generator/components/styleclass.js new file mode 100644 index 000000000..f0e2e8dcc --- /dev/null +++ b/apps/showcase/api-generator/components/styleclass.js @@ -0,0 +1,7 @@ +module.exports = { + styleclass: { + name: 'StyleClass', + description: 'StyleClass manages css classes declaratively to during enter/leave animations or just to toggle classes on an element.', + 'vue-modifiers': [] + } +}; diff --git a/apps/showcase/api-generator/components/tabmenu.js b/apps/showcase/api-generator/components/tabmenu.js new file mode 100644 index 000000000..8a114e519 --- /dev/null +++ b/apps/showcase/api-generator/components/tabmenu.js @@ -0,0 +1,66 @@ +const TabMenuProps = [ + { + name: 'model', + type: 'array', + default: 'null', + description: 'An array of menuitems.' + }, + { + name: 'activeIndex', + type: 'number', + default: '0', + description: 'Active index of menuitem.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const TabMenuEvents = [ + { + name: 'tab-change', + description: 'Callback to invoke when an active tab is changed.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Original event' + }, + { + name: 'event.index', + type: 'number', + description: 'Index of the selected tab' + } + ] + } +]; + +const TabMenuSlots = [ + { + name: 'item', + description: 'Template of a menuitem.' + }, + { + name: 'itemicon', + description: 'Custom item icon template.' + } +]; + +module.exports = { + tabmenu: { + name: 'TabMenu', + description: 'TabMenu is a navigation component that displays items as tab headers.', + props: TabMenuProps, + events: TabMenuEvents, + slots: TabMenuSlots + } +}; diff --git a/apps/showcase/api-generator/components/tabpanel.js b/apps/showcase/api-generator/components/tabpanel.js new file mode 100644 index 000000000..182d9fe20 --- /dev/null +++ b/apps/showcase/api-generator/components/tabpanel.js @@ -0,0 +1,107 @@ +const TabPanelProps = [ + { + name: 'header', + type: 'string', + default: 'null', + description: 'Orientation of tab headers.' + }, + { + name: 'headerStyle', + type: 'any', + default: 'null', + description: 'Inline style of the tab header.' + }, + { + name: 'headerClass', + type: 'any', + default: 'null', + description: 'Style class of the tab header.' + }, + { + name: 'headerProps', + type: 'any', + default: 'null', + description: 'Used to pass all properties of the HTMLLiElement to the tab header.' + }, + { + name: 'headerActionProps', + type: 'any', + default: 'null', + description: 'Used to pass all properties of the HTMLAnchorElement to the focusable anchor element inside the tab header.' + }, + { + name: 'contentStyle', + type: 'any', + default: 'null', + description: 'Inline style of the tab content.' + }, + { + name: 'contentClass', + type: 'any', + default: 'null', + description: 'Style class of the tab content.' + }, + { + name: 'contentProps', + type: 'any', + default: 'null', + description: 'Used to pass all properties of the HTMLDivElement to the tab content.' + }, + { + name: 'disabled', + type: 'boolean', + default: 'null', + description: 'Whether the tab is disabled.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + } +]; + +const TabPanelEvents = [ + { + name: 'tab-change', + description: 'Callback to invoke when an active tab is changed.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Original event' + }, + { + name: 'event.index', + type: 'number', + description: 'Index of the selected tab' + } + ] + }, + { + name: 'tab-click', + description: 'Callback to invoke when an active tab is clicked.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Original event' + }, + { + name: 'event.index', + type: 'number', + description: 'Index of the selected tab' + } + ] + } +]; + +module.exports = { + tabpanel: { + name: 'TabPanel', + description: 'TabView element consists of one or more TabPanel elements.', + 'doc-url': 'tabview', + props: TabPanelProps, + events: TabPanelEvents + } +}; diff --git a/apps/showcase/api-generator/components/tabview.js b/apps/showcase/api-generator/components/tabview.js new file mode 100644 index 000000000..ce8196f48 --- /dev/null +++ b/apps/showcase/api-generator/components/tabview.js @@ -0,0 +1,128 @@ +const TabViewProps = [ + { + name: 'activeIndex', + type: 'number', + default: '0', + description: 'Index of the active tab.' + }, + { + name: 'lazy', + type: 'boolean', + default: 'false', + description: 'When enabled, hidden tabs are not rendered at all. Defaults to false that hides tabs with css.' + }, + { + name: 'scrollable', + type: 'boolean', + default: 'false', + description: 'When enabled displays buttons at each side of the tab headers to scroll the tab list.' + }, + { + name: 'tabindex', + type: 'number', + default: '0', + description: 'Index of the element in tabbing order.' + }, + { + name: 'selectOnFocus', + type: 'boolean', + default: 'false', + description: 'When enabled, the focused tab is activated.' + }, + { + name: 'prevButtonProps', + type: 'any', + default: 'null', + description: 'Used to pass all properties of the HTMLButtonElement to the previous button.' + }, + { + name: 'nextButtonProps', + type: 'any', + default: 'null', + description: 'Used to pass all properties of the HTMLButtonElement to the next button.' + }, + { + name: 'prevIcon', + type: 'string', + default: 'null', + description: 'Prev icon of the scrollable tabview.' + }, + { + name: 'nextIcon', + type: 'string', + default: 'null', + description: 'Next icon of the scrollable tabview.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const TabViewEvents = [ + { + name: 'tab-change', + description: 'Callback to invoke when an active tab is changed.', + arguments: [ + { + name: 'originalEvent', + type: 'object', + description: 'Original event' + }, + { + name: 'index', + type: 'number', + description: 'Index of the selected tab' + } + ] + }, + { + name: 'tab-click', + description: 'Callback to invoke when an active tab is clicked.', + arguments: [ + { + name: 'originalEvent', + type: 'object', + description: 'Original event' + }, + { + name: 'index', + type: 'number', + description: 'Index of the clicked tab' + } + ] + } +]; + +const TabViewSlots = [ + { + name: 'default', + description: 'Default slot to detect TabPanel components.' + }, + { + name: 'previcon', + description: 'Previous button icon template for the scrollable component.' + }, + { + name: 'nexticon', + description: 'Next button icon template for the scrollable component.' + } +]; + +module.exports = { + tabview: { + name: 'TabView', + description: 'TabView is a container component to group content with tabs.', + props: TabViewProps, + event: TabViewEvents, + slots: TabViewSlots + } +}; diff --git a/apps/showcase/api-generator/components/tag.js b/apps/showcase/api-generator/components/tag.js new file mode 100644 index 000000000..9487a9b2c --- /dev/null +++ b/apps/showcase/api-generator/components/tag.js @@ -0,0 +1,54 @@ +const TagProps = [ + { + name: 'value', + type: 'any', + default: 'null', + description: 'Value to display inside the tag.' + }, + { + name: 'severity', + type: 'string', + default: 'null', + description: 'Severity type of the tag. Valid severities are "secondary", "success", "info", "warn", "danger" and "contrast".' + }, + { + name: 'rounded', + type: 'boolean', + default: 'false', + description: 'Whether the corners of the tag are rounded.' + }, + { + name: 'icon', + type: 'string', + default: 'null', + description: 'Icon of the tag to display next to the value.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const TagSlots = [ + { + name: 'icon', + description: 'custom icon template.' + } +]; + +module.exports = { + tag: { + name: 'Tag', + description: 'Tag component is used to categorize content.', + props: TagProps, + slots: TagSlots + } +}; diff --git a/apps/showcase/api-generator/components/terminal.js b/apps/showcase/api-generator/components/terminal.js new file mode 100644 index 000000000..8f5878a85 --- /dev/null +++ b/apps/showcase/api-generator/components/terminal.js @@ -0,0 +1,34 @@ +const TerminalProps = [ + { + name: 'welcomeMessage', + type: 'string', + default: 'null', + description: 'Initial text to display on terminal.' + }, + { + name: 'prompt', + type: 'string', + default: 'null', + description: 'Prompt text for each command.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +module.exports = { + terminal: { + name: 'Terminal', + description: 'Terminal is a text based user interface.', + props: TerminalProps + } +}; diff --git a/apps/showcase/api-generator/components/textarea.js b/apps/showcase/api-generator/components/textarea.js new file mode 100644 index 000000000..e8f06aad3 --- /dev/null +++ b/apps/showcase/api-generator/components/textarea.js @@ -0,0 +1,46 @@ +const TextareaProps = [ + { + name: 'modelValue', + type: 'any', + default: 'null', + description: 'Value of the component.' + }, + { + name: 'autoResize', + type: 'boolean', + default: 'false', + description: 'When present, height of textarea changes as being typed.' + }, + { + name: 'invalid', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should have invalid state style.' + }, + { + name: 'variant', + type: 'string', + default: 'null', + description: 'Specifies the input variant of the component.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +module.exports = { + textarea: { + name: 'Textarea', + description: 'Textarea is a multi-line text input element.', + props: TextareaProps + } +}; diff --git a/apps/showcase/api-generator/components/tieredmenu.js b/apps/showcase/api-generator/components/tieredmenu.js new file mode 100644 index 000000000..3aced9452 --- /dev/null +++ b/apps/showcase/api-generator/components/tieredmenu.js @@ -0,0 +1,76 @@ +const TieredMenuProps = [ + { + name: 'model', + type: 'array', + default: 'null', + description: 'An array of menuitems.' + }, + { + name: 'popup', + type: 'boolean', + default: 'false', + description: 'Defines if menu would displayed as a popup.' + }, + { + name: 'appendTo', + type: 'string', + default: 'body', + description: 'A valid query selector or an HTMLElement to specify where the overlay gets attached.' + }, + { + name: 'baseZIndex', + type: 'number', + default: '0', + description: 'Base zIndex value to use in layering.' + }, + { + name: 'autoZIndex', + type: 'boolean', + default: 'true', + description: 'Whether to automatically manage layering.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const TieredMenuSlots = [ + { + name: 'start', + description: 'Custom start content.' + }, + { + name: 'end', + description: 'Custom end content.' + }, + { + name: 'item', + description: 'Template of a menuitem.' + }, + { + name: 'submenuicon', + description: 'Custom submenu icon template.' + }, + { + name: 'itemicon', + description: 'Custom item icon template.' + } +]; + +module.exports = { + tieredmenu: { + name: 'TieredMenu', + description: 'TieredMenu displays submenus in nested overlays.', + props: TieredMenuProps, + slots: TieredMenuSlots + } +}; diff --git a/apps/showcase/api-generator/components/timeline.js b/apps/showcase/api-generator/components/timeline.js new file mode 100644 index 000000000..639bb9268 --- /dev/null +++ b/apps/showcase/api-generator/components/timeline.js @@ -0,0 +1,66 @@ +const TimelineProps = [ + { + name: 'value', + type: 'array', + default: 'null', + description: 'An array of events to display.' + }, + { + name: 'align', + type: 'string', + default: 'left', + description: 'Position of the timeline bar relative to the content. Valid values are "left", "right" and "alternate" for vertical layout and "top", "bottom" for horizontal layout.' + }, + { + name: 'layout', + type: 'string', + default: 'vertical', + description: 'Orientation of the timeline, valid values are "vertical" and "horizontal".' + }, + { + name: 'dataKey', + type: 'string', + default: 'null', + description: 'Name of the field that uniquely identifies the a record in the data.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const TimelineSlots = [ + { + name: 'opposite', + description: 'Custom content for the content to be placed at the other side of the bar' + }, + { + name: 'marker', + description: 'Custom content for the marker' + }, + { + name: 'content', + description: 'Custom content' + }, + { + name: 'connector', + description: 'Connector element' + } +]; + +module.exports = { + timeline: { + name: 'Timeline', + description: 'Timeline visualizes a series of chained events.', + props: TimelineProps, + slots: TimelineSlots + } +}; diff --git a/apps/showcase/api-generator/components/toast.js b/apps/showcase/api-generator/components/toast.js new file mode 100644 index 000000000..679266540 --- /dev/null +++ b/apps/showcase/api-generator/components/toast.js @@ -0,0 +1,98 @@ +const ToastProps = [ + { + name: 'group', + type: 'string', + default: 'null', + description: 'Unique identifier of a message group.' + }, + { + name: 'position', + type: 'string', + default: 'top-right', + description: 'Position of the toast in viewport. Other valid values are "top-left", "top-center", "bottom-left", "bottom-center", "bottom-right" and "center".' + }, + { + name: 'autoZIndex', + type: 'boolean', + default: 'true', + description: 'Whether to automatically manage layering.' + }, + { + name: 'baseZIndex', + type: 'number', + default: '0', + description: 'Base zIndex value to use in layering.' + }, + { + name: 'breakpoints', + type: 'object', + default: 'null', + description: 'Object literal to define widths per screen size.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const ToastEvents = [ + { + name: 'close', + description: 'Callback to invoke when the toast is closed.', + arguments: [ + { + name: 'message', + type: 'any', + description: 'Message of toast.' + } + ] + }, + { + name: 'life-end', + description: 'Callback to invoke when the toast timeout is over.', + arguments: [ + { + name: 'message', + type: 'any', + description: 'Message of toast.' + } + ] + } +]; + +const ToastSlots = [ + { + name: 'message', + description: 'Custom content for the toast message' + }, + { + name: 'icon', + description: 'Custom icon template.' + }, + { + name: 'closeicon', + description: 'Custom close icon template.' + }, + { + name: 'container', + description: 'Custom container template.' + } +]; + +module.exports = { + toast: { + name: 'Toast', + description: 'Toast is used to display messages in an overlay.', + props: ToastProps, + events: ToastEvents, + slots: ToastSlots + } +}; diff --git a/apps/showcase/api-generator/components/togglebutton.js b/apps/showcase/api-generator/components/togglebutton.js new file mode 100644 index 000000000..1f4d6a3ef --- /dev/null +++ b/apps/showcase/api-generator/components/togglebutton.js @@ -0,0 +1,145 @@ +const ToggleButtonProps = [ + { + name: 'modelValue', + type: 'any', + default: 'null', + description: 'Value of the component.' + }, + { + name: 'onIcon', + type: 'string', + default: 'null', + description: 'Icon for the on state.' + }, + { + name: 'offIcon', + type: 'string', + default: 'null', + description: 'Icon for the off state.' + }, + { + name: 'onLabel', + type: 'string', + default: 'yes', + description: 'Label for the on state.' + }, + { + name: 'offLabel', + type: 'string', + default: 'no', + description: 'Label for the off state.' + }, + { + name: 'iconPos', + type: 'string', + default: 'left', + description: 'Position of the icon, valid values are "left" and "right".' + }, + { + name: 'tabindex', + type: 'number', + default: 'null', + description: 'Index of the element in tabbing order.' + }, + { + name: 'disabled', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the element should be disabled.' + }, + { + name: 'invalid', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should have invalid state style.' + }, + { + name: 'inputId', + type: 'string', + default: 'null', + description: 'Identifier of the focus input to match a label defined for the chips.' + }, + { + name: 'inputClass', + type: 'string | object', + default: 'null', + description: 'Style class of the input field.' + }, + { + name: 'inputStyle', + type: 'object', + default: 'null', + description: 'Inline style of the input field.' + }, + { + name: 'inputProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLInputElement to the focusable input element inside the component.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const ToggleButtonEvents = [ + { + name: 'change', + description: 'Callback to invoke on value change.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Browser event' + } + ] + }, + { + name: 'focus', + description: 'Callback to invoke when the component receives focus.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Browser event' + } + ] + }, + { + name: 'blur', + description: 'Callback to invoke when the component loses focus.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Browser event' + } + ] + } +]; + +const ToggleButtonSlots = [ + { + name: 'icon', + description: 'custom icon template.' + } +]; + +module.exports = { + togglebutton: { + name: 'ToggleButton', + description: 'ToggleButton is used to select a boolean value using a button.', + props: ToggleButtonProps, + slots: ToggleButtonSlots, + events: ToggleButtonEvents + } +}; diff --git a/apps/showcase/api-generator/components/toggleswitch.js b/apps/showcase/api-generator/components/toggleswitch.js new file mode 100644 index 000000000..490d93992 --- /dev/null +++ b/apps/showcase/api-generator/components/toggleswitch.js @@ -0,0 +1,80 @@ +const ToggleSwitchProps = [ + { + name: 'modelValue', + type: 'boolean', + default: 'null', + description: 'Specifies whether a inputswitch should be checked or not.' + }, + { + name: 'trueValue', + type: 'any', + default: 'null', + description: 'Value in checked state.' + }, + { + name: 'falseValue', + type: 'any', + default: 'null', + description: 'Value in unchecked state.' + }, + { + name: 'inputId', + type: 'string', + default: 'null', + description: 'Identifier of the underlying input element.' + }, + { + name: 'inputStyle', + type: 'object', + default: 'null', + description: 'Inline style of the input field.' + }, + { + name: 'inputClass', + type: 'string | object', + default: 'null', + description: 'Style class of the input field.' + }, + { + name: 'inputProps', + type: 'object', + default: 'null', + description: 'Used to pass all properties of the HTMLInputElement to the focusable input element inside the component.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const ToggleSwitchEvents = [ + { + name: 'click', + description: 'Callback to invoke on click.' + }, + { + name: 'change', + description: 'Callback to invoke on value change.' + }, + { + name: 'input', + description: 'Callback to invoke on value change.' + } +]; + +module.exports = { + inputswitch: { + name: 'ToggleSwitch', + description: 'ToggleSwitch is used to select a boolean value.', + props: ToggleSwitchProps, + events: ToggleSwitchEvents + } +}; diff --git a/apps/showcase/api-generator/components/toolbar.js b/apps/showcase/api-generator/components/toolbar.js new file mode 100644 index 000000000..18fbf7ab8 --- /dev/null +++ b/apps/showcase/api-generator/components/toolbar.js @@ -0,0 +1,44 @@ +const ToolbarProps = [ + { + name: 'aria-labelledby', + type: 'string', + default: 'null', + description: 'Defines a string value that labels an interactive element.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const ToolbarSlots = [ + { + name: 'start', + description: "Custom content for the component's left side" + }, + { + name: 'end', + description: "Custom content for the component's right side" + }, + { + name: 'center', + description: "Custom content for the component's center" + } +]; + +module.exports = { + toolbar: { + name: 'Toolbar', + description: 'Toolbar is a grouping component for buttons and other content.', + props: ToolbarProps, + slots: ToolbarSlots + } +}; diff --git a/apps/showcase/api-generator/components/tooltip.js b/apps/showcase/api-generator/components/tooltip.js new file mode 100644 index 000000000..519b9fc07 --- /dev/null +++ b/apps/showcase/api-generator/components/tooltip.js @@ -0,0 +1,34 @@ +const TooltipModifiers = [ + { + name: 'right', + description: 'Positions the tooltip on the right of the trigger element (default)' + }, + { + name: 'top', + description: 'Positions the tooltip on the top of the trigger element' + }, + { + name: 'bottom', + description: 'Positions the tooltip on the bottom of the trigger element' + }, + { + name: 'left', + description: 'Positions the tooltip on the left of the trigger element' + }, + { + name: 'focus', + description: 'Focus on the trigger element' + }, + { + name: 'blur', + description: 'Blur the trigger element' + } +]; + +module.exports = { + tooltip: { + name: 'Tooltip', + description: 'Tooltip directive provides advisory information for a component.', + 'vue-modifiers': TooltipModifiers + } +}; diff --git a/apps/showcase/api-generator/components/tree.js b/apps/showcase/api-generator/components/tree.js new file mode 100644 index 000000000..f0cba052c --- /dev/null +++ b/apps/showcase/api-generator/components/tree.js @@ -0,0 +1,175 @@ +const TreeProps = [ + { + name: 'value', + type: 'any', + default: 'null', + description: 'An array of treenodes.' + }, + { + name: 'expandedKeys', + type: 'array', + default: 'null', + description: 'A map of keys to represent the expansion state in controlled mode.' + }, + { + name: 'selectionMode', + type: 'string', + default: 'null', + description: 'Defines the selection mode, valid values "single", "multiple", and "checkbox".' + }, + { + name: 'selectionKeys', + type: 'any', + default: 'null', + description: 'A map of keys to control the selection state.' + }, + { + name: 'metaKeySelection', + type: 'boolean', + default: 'true', + description: + 'Defines how multiple items can be selected, when true metaKey needs to be pressed to select or unselect an item and when set to false selection of each item can be toggled individually. On touch enabled devices, metaKeySelection is turned off automatically.' + }, + { + name: 'loading', + type: 'boolean', + default: 'false', + description: 'Whether to display loading indicator.' + }, + { + name: 'loadingIcon', + type: 'string', + default: 'pi pi-spin', + description: 'Icon to display when tree is loading.' + }, + { + name: 'filter', + type: 'boolean', + default: 'false', + description: 'When specified, displays an input field to filter the items.' + }, + { + name: 'filterBy', + type: 'string', + default: 'label', + description: 'When filtering is enabled, filterBy decides which field or fields (comma separated) to search against.' + }, + { + name: 'filterMode', + type: 'string', + default: 'lenient', + description: 'Mode for filtering valid values are "lenient" and "strict". Default is lenient.' + }, + { + name: 'filterPlaceholder', + type: 'string', + default: 'null', + description: 'Placeholder text to show when filter input is empty.' + }, + { + name: 'filterLocale', + type: 'string', + default: 'undefined', + description: "Locale to use in filtering. The default locale is the host environment's current locale." + }, + { + name: 'highlightOnSelect', + type: 'boolean', + default: 'false', + description: 'Highlights automatically the first item.' + }, + { + name: 'scrollHeight', + type: 'string', + default: 'null', + description: 'Height of the scroll viewport in fixed units or the "flex" keyword for a dynamic size.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const TreeEvents = [ + { + name: 'node-select', + description: 'Callback to invoke when a node is selected.', + arguments: [ + { + name: 'node', + type: 'object', + description: 'Node instance' + } + ] + }, + { + name: 'node-unselect', + description: 'Callback to invoke when a node is unselected.', + arguments: [ + { + name: 'node', + type: 'object', + description: 'Node instance' + } + ] + }, + { + name: 'node-expand', + description: 'Callback to invoke when a node is expanded.', + arguments: [ + { + name: 'node', + type: 'object', + description: 'Node instance' + } + ] + }, + { + name: 'node-collapse', + description: 'Callback to invoke when a node is collapsed.', + arguments: [ + { + name: 'node', + type: 'object', + description: 'Node instance' + } + ] + } +]; + +const TreeSlots = [ + { + name: 'loadingicon', + description: 'Custom loading icon template.' + }, + { + name: 'searchicon', + description: 'Custom search icon template.' + }, + { + name: 'toggleicon', + description: 'Custom toggler icon template.' + }, + { + name: 'checkboxicon', + description: 'Custom checkbox icon template.' + } +]; + +module.exports = { + tree: { + name: 'Tree', + description: 'Tree is used to display hierarchical data.', + props: TreeProps, + events: TreeEvents, + slots: TreeSlots + } +}; diff --git a/apps/showcase/api-generator/components/treeselect.js b/apps/showcase/api-generator/components/treeselect.js new file mode 100644 index 000000000..3a210341b --- /dev/null +++ b/apps/showcase/api-generator/components/treeselect.js @@ -0,0 +1,244 @@ +const TreeSelectProps = [ + { + name: 'modelValue', + type: 'any', + default: 'null', + description: 'Value of the component.' + }, + { + name: 'options', + type: 'array', + default: 'null', + description: 'An array of treenodes.' + }, + { + name: 'scrollHeight', + type: 'string', + default: '200px', + description: 'Height of the viewport, a scrollbar is defined if height of list exceeds this value.' + }, + { + name: 'placeholder', + type: 'string', + default: 'null', + description: 'Label to display when there are no selections.' + }, + { + name: 'disabled', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should be disabled.' + }, + { + name: 'invalid', + type: 'boolean', + default: 'false', + description: 'When present, it specifies that the component should have invalid state style.' + }, + { + name: 'variant', + type: 'string', + default: 'null', + description: 'Specifies the input variant of the component.' + }, + { + name: 'tabindex', + type: 'string', + default: 'null', + description: 'Index of the element in tabbing order.' + }, + { + name: 'inputId', + type: 'string', + default: 'null', + description: 'Identifier of the underlying input element.' + }, + { + name: 'inputStyle', + type: 'object', + default: 'null', + description: 'Inline style of the input field.' + }, + { + name: 'inputClass', + type: 'string | object', + default: 'null', + description: 'Style class of the input field.' + }, + { + name: 'selectionMode', + type: 'string', + default: 'null', + description: 'Defines the selection mode, valid values "single", "multiple", and "checkbox".' + }, + { + name: 'panelClass', + type: 'string | object', + default: 'null', + description: 'Style class of the overlay panel.' + }, + { + name: 'appendTo', + type: 'string', + default: 'body', + description: 'A valid query selector or an HTMLElement to specify where the overlay gets attached. Special keywords are "body" for document body and "self" for the element itself.' + }, + { + name: 'emptyMessage', + type: 'string', + default: 'No results found', + description: 'Text to display when there are no options available. Defaults to value from PrimeVue locale configuration.' + }, + { + name: 'display', + type: 'string', + default: 'comma', + description: 'Defines how the selected items are displayed, valid values are "comma" and "chip".' + }, + { + name: 'metaKeySelection', + type: 'boolean', + default: 'true', + description: + 'Defines how multiple items can be selected, when true metaKey needs to be pressed to select or unselect an item and when set to false selection of each item can be toggled individually. On touch enabled devices, metaKeySelection is turned off automatically.' + }, + { + name: 'aria-labelledby', + type: 'string', + default: 'null', + description: 'Establishes relationships between the component and label(s) where its value should be one or more element IDs.' + }, + { + name: 'aria-label', + type: 'string', + default: 'null', + description: 'Used to define a string that labels the element.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const TreeSelectEvents = [ + { + name: 'change', + description: 'Callback to invoke on value change.', + arguments: [ + { + name: 'event', + type: 'object', + description: 'Selected node keys' + } + ] + }, + { + name: 'before-show', + description: 'Callback to invoke before the overlay is shown.' + }, + { + name: 'before-hide', + description: 'Callback to invoke before the overlay is hidden.' + }, + { + name: 'show', + description: 'Callback to invoke when the overlay is shown.' + }, + { + name: 'hide', + description: 'Callback to invoke when the overlay is hidden.' + }, + { + name: 'node-select', + description: 'Callback to invoke when a node is selected.', + arguments: [ + { + name: 'node', + type: 'object', + description: 'Node instance' + } + ] + }, + { + name: 'node-unselect', + description: 'Callback to invoke when a node is unselected.', + arguments: [ + { + name: 'node', + type: 'object', + description: 'Node instance' + } + ] + }, + { + name: 'node-expand', + description: 'Callback to invoke when a node is expanded.', + arguments: [ + { + name: 'node', + type: 'object', + description: 'Node instance' + } + ] + }, + { + name: 'node-collapse', + description: 'Callback to invoke when a node is collapsed.', + arguments: [ + { + name: 'node', + type: 'object', + description: 'Node instance' + } + ] + } +]; + +const TreeSelectSlots = [ + { + name: 'value', + description: "Custom content for the item's value" + }, + { + name: 'header', + description: "Custom content for the component's header" + }, + { + name: 'footer', + description: "Custom content for the component's footer" + }, + { + name: 'empty', + description: 'Custom content when there is no data to display' + }, + { + name: 'triggericon', + description: 'Custom content for the dropdown indicator' + }, + { + name: 'itemtoggleicon', + description: 'Custom item toggler icon template.' + }, + { + name: 'itemcheckboxicon', + description: 'Custom item checkbox icon template.' + } +]; + +module.exports = { + treeselect: { + name: 'TreeSelect', + description: 'TreeSelect is a form component to choose from hierarchical data.', + props: TreeSelectProps, + events: TreeSelectEvents, + slots: TreeSelectSlots + } +}; diff --git a/apps/showcase/api-generator/components/treetable.js b/apps/showcase/api-generator/components/treetable.js new file mode 100644 index 000000000..0f1c6d42b --- /dev/null +++ b/apps/showcase/api-generator/components/treetable.js @@ -0,0 +1,518 @@ +const TreeTableProps = [ + { + name: 'value', + type: 'array', + default: 'null', + description: 'An array of treenodes.' + }, + { + name: 'dataKey', + type: 'string|function', + default: 'null', + description: 'Name of the field that uniquely identifies the a record in the data.' + }, + { + name: 'expandedKeys', + type: 'array', + default: 'null', + description: 'A map of keys to represent the state of the tree expansion state in controlled mode.' + }, + { + name: 'selectionKeys', + type: 'any', + default: 'null', + description: 'A map of keys to control the selection state.' + }, + { + name: 'selectionMode', + type: 'string', + default: 'null', + description: 'Defines the selection mode, valid values "single", "multiple", and "checkbox".' + }, + { + name: 'metaKeySelection', + type: 'boolean', + default: 'true', + description: + 'Defines how multiple items can be selected, when true metaKey needs to be pressed to select or unselect an item and when set to false selection of each item can be toggled individually. On touch enabled devices, metaKeySelection is turned off automatically.' + }, + { + name: 'rows', + type: 'number', + default: 'null', + description: 'Number of rows to display per page.' + }, + { + name: 'first', + type: 'number', + default: '0', + description: 'Index of the first row to be displayed.' + }, + { + name: 'totalRecords', + type: 'number', + default: 'null', + description: 'Number of total records, defaults to length of value when not defined.' + }, + { + name: 'paginator', + type: 'boolean', + default: 'false', + description: 'When specified as true, enables the pagination.' + }, + { + name: 'paginatorPosition', + type: 'string', + default: 'bottom', + description: 'Position of the paginator, options are "top", "bottom" or "both".' + }, + { + name: 'alwaysShowPaginator', + type: 'boolean', + default: 'true', + description: 'Whether to show it even there is only one page.' + }, + { + name: 'paginatorTemplate', + type: 'string', + default: 'FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink RowsPerPageDropdown', + description: 'Template of the paginator.' + }, + { + name: 'pageLinkSize', + type: 'number', + default: '5', + description: 'Number of page links to display.' + }, + { + name: 'rowsPerPageOptions', + type: 'array', + default: 'null', + description: 'Array of integer values to display inside rows per page dropdown.' + }, + { + name: 'currentPageReportTemplate', + type: 'string', + default: '({currentPage} of {totalPages})', + description: 'Template of the current page report element.' + }, + { + name: 'lazy', + type: 'boolean', + default: 'false', + description: 'Defines if data is loaded and interacted with in lazy manner.' + }, + { + name: 'loading', + type: 'boolean', + default: 'false', + description: 'Displays a loader to indicate data load is in progress.' + }, + { + name: 'loadingIcon', + type: 'string', + default: 'pi pi-spinner', + description: 'The icon to show while indicating data load is in progress.' + }, + { + name: 'rowHover', + type: 'boolean', + default: 'false', + description: 'When enabled, background of the rows change on hover.' + }, + { + name: 'autoLayout', + type: 'boolean', + default: 'false', + description: 'Whether the cell widths scale according to their content or not.' + }, + { + name: 'sortField', + type: 'string', + default: 'null', + description: 'Property name or a getter function of a row data used for sorting by default.' + }, + { + name: 'sortOrder', + type: 'number', + default: 'null', + description: 'Order to sort the data by default.' + }, + { + name: 'defaultSortOrder', + type: 'number', + default: '1', + description: 'Default sort order of an unsorted column.' + }, + { + name: 'multiSortMeta', + type: 'array', + default: 'null', + description: 'An array of SortMeta objects to sort the data by default in multiple sort mode.' + }, + { + name: 'sortMode', + type: 'string', + default: 'single', + description: 'Defines whether sorting works on single column or on multiple columns.' + }, + { + name: 'removableSort', + type: 'boolean', + default: 'false', + description: 'When enabled, columns can have an un-sorted state.' + }, + { + name: 'filters', + type: 'object', + default: 'null', + description: 'Filters object with key-value pairs to define the filters.' + }, + { + name: 'filterMode', + type: 'string', + default: 'lenient', + description: 'Mode for filtering valid values are "lenient" and "strict". Default is lenient.' + }, + { + name: 'filterLocale', + type: 'string', + default: 'undefined', + description: "Locale to use in filtering. The default locale is the host environment's current locale." + }, + { + name: 'resizableColumns', + type: 'boolean', + default: 'false', + description: 'When enabled, columns can be resized using drag and drop.' + }, + { + name: 'columnResizeMode', + type: 'string', + default: 'fit', + description: 'Defines whether the overall table width should change on column resize, valid values are "fit" and "expand".' + }, + { + name: 'indentation', + type: 'number', + default: '1', + description: 'Indentation factor as rem value for children nodes. Defaults to 1rem.' + }, + { + name: 'showGridlines', + type: 'boolean', + default: 'false', + description: 'Whether to show grid lines between cells.' + }, + { + name: 'scrollable', + type: 'boolean', + default: 'false', + description: 'When specified, enables horizontal and/or vertical scrolling.' + }, + { + name: 'scrollHeight', + type: 'string', + default: 'null', + description: 'Height of the scroll viewport in fixed units or the "flex" keyword for a dynamic size.' + }, + { + name: 'size', + type: 'string', + default: 'null', + description: 'Defines the size of the table.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + }, + { + name: 'unstyled', + type: 'boolean', + default: 'false', + description: 'When enabled, it removes component related styles in the core.' + } +]; + +const TreeTableEvents = [ + { + name: 'page', + description: 'Callback to invoke on pagination. Sort and Filter information is also available for lazy loading implementation.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Original event' + }, + { + name: 'event.page', + type: 'number', + description: 'New page number' + }, + { + name: 'event.pageCount', + type: 'number', + description: 'Total page count' + }, + { + name: 'event.first', + type: 'number', + description: 'Index of first record' + }, + { + name: 'event.rows', + type: 'number', + description: 'Number of rows to display in new page' + }, + { + name: 'event.sortField', + type: 'object', + description: 'Field to sort against' + }, + { + name: 'event.sortOrder', + type: 'number', + description: 'Sort order as integer' + }, + { + name: 'event.multiSortMeta', + type: 'object', + description: 'MultiSort metadata' + }, + { + name: 'event.filters', + type: 'object', + description: 'Collection of active filters' + }, + { + name: 'event.filterMatchModes', + type: 'object', + description: 'Match modes per field' + } + ] + }, + { + name: 'sort', + description: 'Callback to invoke on sort. Page and Filter information is also available for lazy loading implementation.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Original event' + }, + { + name: 'event.first', + type: 'number', + description: 'Index of first record' + }, + { + name: 'event.rows', + type: 'number', + description: 'Number of rows to display in new page' + }, + { + name: 'event.sortField', + type: 'object', + description: 'Field to sort against' + }, + { + name: 'event.sortOrder', + type: 'number', + description: 'Sort order as integer' + }, + { + name: 'event.multiSortMeta', + type: 'object', + description: 'MultiSort metadata' + }, + { + name: 'event.filters', + type: 'object', + description: 'Collection of active filters' + }, + { + name: 'event.filterMatchModes', + type: 'object', + description: 'Match modes per field' + } + ] + }, + { + name: 'filter', + description: 'Event to emit after filtering, not triggered in lazy mode.', + arguments: [ + { + name: 'event.originalEvent', + type: 'object', + description: 'Original event' + }, + { + name: 'event.first', + type: 'number', + description: 'Index of first record' + }, + { + name: 'event.rows', + type: 'number', + description: 'Number of rows to display in new page' + }, + { + name: 'event.sortField', + type: 'object', + description: 'Field to sort against' + }, + { + name: 'event.sortOrder', + type: 'number', + description: 'Sort order as integer' + }, + { + name: 'event.multiSortMeta', + type: 'object', + description: 'MultiSort metadata' + }, + { + name: 'event.filters', + type: 'object', + description: 'Collection of active filters' + }, + { + name: 'event.filteredValue', + type: 'string', + description: 'Filtered collection' + }, + { + name: 'event.filterMatchModes', + type: 'object', + description: 'Match modes per field' + } + ] + }, + { + name: 'node-select', + description: 'Callback to invoke when a node is selected.', + arguments: [ + { + name: 'node', + type: 'object', + description: 'Node instance' + } + ] + }, + { + name: 'node-unselect', + description: 'Callback to invoke when a node is unselected.', + arguments: [ + { + name: 'node', + type: 'object', + description: 'Node instance' + } + ] + }, + { + name: 'node-expand', + description: 'Callback to invoke when a node is expanded.', + arguments: [ + { + name: 'node', + type: 'object', + description: 'Node instance' + } + ] + }, + { + name: 'node-collapse', + description: 'Callback to invoke when a node is collapsed.', + arguments: [ + { + name: 'node', + type: 'object', + description: 'Node instance' + } + ] + }, + { + name: 'column-resize-end', + description: 'Callback to invoke when a column is resized.', + arguments: [ + { + name: 'event.element', + type: 'object', + description: 'DOM element of the resized column.' + }, + { + name: 'event.delta', + type: 'number', + description: 'Change in column width' + } + ] + } +]; + +const TreeTableSlots = [ + { + name: 'header', + description: "Custom content for the component's header." + }, + { + name: 'paginatorstart', + description: "Custom content for the component paginator's left side." + }, + { + name: 'paginatorend', + description: "Custom content for the component paginator's right side." + }, + { + name: 'empty', + description: 'Custom content when there is no data to display.' + }, + { + name: 'footer', + description: "Custom content for the component's footer." + }, + { + name: 'loadingicon', + description: 'Custom loading icon template.' + }, + { + name: 'toggleicon', + description: 'Custom toggler icon template.' + }, + { + name: 'checkboxicon', + description: 'Custom checkbox icon template.' + }, + { + name: 'sorticon', + description: 'Custom sort icon template.' + }, + { + name: 'paginatorfirstpagelinkicon', + description: 'Custom paginator first page link icon template.' + }, + { + name: 'paginatorprevpagelinkicon', + description: 'Custom paginator prev page link icon template.' + }, + { + name: 'paginatornextpagelinkicon', + description: 'Custom paginator next page link icon template.' + }, + { + name: 'paginatorlastpagelinkicon', + description: 'Custom paginator last page link icon template.' + } +]; + +module.exports = { + treetable: { + name: 'TreeTable', + description: 'TreeTable is used to display hierarchical data in tabular format.', + props: TreeTableProps, + events: TreeTableEvents, + slots: TreeTableSlots + } +}; diff --git a/apps/showcase/api-generator/components/virtualscroller.js b/apps/showcase/api-generator/components/virtualscroller.js new file mode 100644 index 000000000..a0a7b72fc --- /dev/null +++ b/apps/showcase/api-generator/components/virtualscroller.js @@ -0,0 +1,186 @@ +const VirtualScrollerProps = [ + { + name: 'id', + type: 'string', + default: 'null', + description: 'Unique identifier of the element.' + }, + { + name: 'style', + type: 'any', + default: 'null', + description: 'Inline style of the component.' + }, + { + name: 'class', + type: 'string', + default: 'null', + description: 'Style class of the component.' + }, + { + name: 'items', + type: 'array', + default: 'null', + description: 'An array of objects to display.' + }, + { + name: 'itemSize', + type: 'number|array', + default: 'null', + description: 'The height/width of item according to orientation.' + }, + { + name: 'scrollHeight', + type: 'string', + default: 'null', + description: 'Height of the scroll viewport.' + }, + { + name: 'scrollWidth', + type: 'string', + default: 'null', + description: 'Width of the scroll viewport.' + }, + { + name: 'orientation', + type: 'string', + default: 'vertical', + description: "The orientation of scrollbar, valid values are 'vertical', 'horizontal' and 'both'." + }, + { + name: 'numToleratedItems', + type: 'number', + default: 'null', + description: + 'Determines how many additional elements to add to the DOM outside of the view. According to the scrolls made up and down, extra items are added in a certain algorithm in the form of multiples of this number. Default value is half the number of items shown in the view.' + }, + { + name: 'delay', + type: 'number', + default: '0', + description: 'Delay in scroll before new data is loaded.' + }, + { + name: 'lazy', + type: 'boolean', + default: 'false', + description: 'Defines if data is loaded and interacted with in lazy manner.' + }, + { + name: 'disabled', + type: 'boolean', + default: 'false', + description: 'If disabled, the VirtualScroller feature is eliminated and the content is displayed directly.' + }, + { + name: 'loaderDisabled', + type: 'boolean', + default: 'false', + description: 'Used to implement a custom loader instead of using the loader feature in the VirtualScroller.' + }, + { + name: 'loading', + type: 'boolean', + default: 'false', + description: 'Whether the data is loaded.' + }, + { + name: 'showSpacer', + type: 'boolean', + default: 'true', + description: 'Used to implement a custom spacer instead of using the spacer feature in the VirtualScroller.' + }, + { + name: 'showLoader', + type: 'boolean', + default: 'false', + description: 'Whether to show loader.' + }, + { + name: 'tabindex', + type: 'number|string', + default: '0', + description: 'Index of the element in tabbing order.' + }, + { + name: 'pt', + type: 'any', + default: 'null', + description: 'Used to pass attributes to DOM elements inside the component.' + } +]; + +const VirtualScrollerEvents = [ + { + name: 'scroll', + description: 'Callback to invoke when scroll position changes.', + arguments: [ + { + name: 'event', + type: 'any', + description: 'Browser event.' + } + ] + }, + { + name: 'scroll-index-change', + description: "Callback to invoke when scroll position and item's range in view changes.", + arguments: [ + { + name: 'event.first', + type: 'number', + description: 'First index of the new data range to be loaded.' + }, + { + name: 'event.last', + type: 'number', + description: 'Last index of the new data range to be loaded.' + } + ] + }, + { + name: 'lazy-load', + description: 'Callback to invoke in lazy mode to load new data.', + arguments: [ + { + name: 'event.first', + type: 'number', + description: 'First index of the new data range to be loaded.' + }, + { + name: 'event.last', + type: 'number', + description: 'Last index of the new data range to be loaded.' + } + ] + } +]; + +const VirtualScrollerSlots = [ + { + name: 'item', + description: 'Content for the item.' + }, + { + name: 'content', + description: 'Custom content for the component.' + }, + { + name: 'loader', + description: 'Custom content for the loader items.' + }, + { + name: 'loadingicon', + description: 'Custom loading icon template.' + } +]; + +module.exports = { + virtualscroller: { + name: 'VirtualScroller', + description: 'VirtualScroller is a performant approach to handle huge data efficiently.', + props: VirtualScrollerProps, + events: VirtualScrollerEvents, + slots: VirtualScrollerSlots + } +}; diff --git a/apps/showcase/error-backup.vue b/apps/showcase/error-backup.vue new file mode 100644 index 000000000..bca565851 --- /dev/null +++ b/apps/showcase/error-backup.vue @@ -0,0 +1,15 @@ + diff --git a/apps/showcase/package.json b/apps/showcase/package.json index 06b62821c..02e676c16 100644 --- a/apps/showcase/package.json +++ b/apps/showcase/package.json @@ -19,9 +19,21 @@ "generate": "nuxt generate", "preview": "nuxt preview", "postinstall": "nuxt prepare", + "build:lib": "NODE_ENV=production INPUT_DIR=components/lib/ OUTPUT_DIR=dist/ npm run build:package", + "build:package": "npm run build:api && npm run build:check && rollup -c && node build-meta", + "build:check": "npm run format:check && npm run security:check", + "build:api": "node ./api-generator/build-api.js && npm run themedoc && npm run apidoc && npm run format", + "build:prebuild": "node ./scripts/prebuild.js", + "security:check": "npm audit --production --audit-level high", + "format": "prettier --write \"**/*.{js,vue,d.ts}\" --cache", + "format:check": "prettier --check \"**/*.{js,vue,d.ts}\"", "test:unit": "vitest run", "test:unit:watch": "vitest watch", - "test:coverage": "vitest run --coverage" + "test:coverage": "vitest run --coverage", + "lint": "eslint --ext \".js,.vue\" --ignore-path .gitignore . --cache", + "lint:fix": "eslint --fix --ext \".js,.vue\" --ignore-path .gitignore .", + "apidoc": "node ./api-generator/build-apidoc.js", + "themedoc": "node ./api-generator/build-tokens.js" }, "keywords": [ "primevue", @@ -39,17 +51,29 @@ "passthrough" ], "devDependencies": { + "@babel/eslint-parser": "^7.18.9", + "@babel/preset-env": "^7.21.5", + "@rollup/plugin-babel": "^6.0.3", + "@rollup/plugin-alias": "^5.1.0", "@stackblitz/sdk": "^1.8.2", "@vitejs/plugin-vue": "4.1.0", "@vitest/coverage-istanbul": "^0.29.8", "@vue/test-utils": "^2.0.0", "autoprefixer": "^10.4.16", "chart.js": "3.3.2", + "eslint": "^8.30.0", + "eslint-config-prettier": "^8.5.0", + "eslint-plugin-nuxt": "^4.0.0", + "eslint-plugin-prettier": "^4.2.1", + "eslint-plugin-vue": "^9.4.0", "jsdom": "^19.0.0", "nuxt": "3.3.2", "postcss": "^8.4.31", + "prettier": "2.7.1", "primeicons": "^7.0.0", "quill": "^1.3.7", + "rollup-plugin-postcss": "^4.0.0", + "rollup-plugin-vue": "^6.0.0-beta.9", "sass": "^1.45.0", "sass-loader": "^8.0.2", "tailwindcss": "^3.4.1", @@ -63,9 +87,10 @@ }, "dependencies": { "@docsearch/js": "^3.3.3", - "nuxt-gtag": "^0.6.2" + "nuxt-gtag": "^0.6.2", + "vee-validate": "^4.8.2" }, "engines": { "node": ">=12.11.0" } -} +} \ No newline at end of file diff --git a/apps/showcase/rollup.config.js b/apps/showcase/rollup.config.js new file mode 100644 index 000000000..2cec3b670 --- /dev/null +++ b/apps/showcase/rollup.config.js @@ -0,0 +1,296 @@ +import alias from '@rollup/plugin-alias'; +import { babel } from '@rollup/plugin-babel'; +import terser from '@rollup/plugin-terser'; +import postcss from 'rollup-plugin-postcss'; +import vue from 'rollup-plugin-vue'; + +import fs from 'fs-extra'; +import path from 'path'; + +import viteConfig, { THEME_PRESETS } from './nuxt-vite.config.js'; +import pkg from './package.json'; + +// globals +const GLOBALS = { + vue: 'Vue' +}; + +// externals +const GLOBAL_EXTERNALS = ['vue', 'chart.js/auto', 'quill']; +const INLINE_EXTERNALS = Object.keys(viteConfig.resolve.alias); +const EXTERNALS = [...GLOBAL_EXTERNALS, ...INLINE_EXTERNALS]; + +// alias +const ALIAS_ENTRIES = Object.entries(viteConfig.resolve.alias).map(([key, value]) => ({ find: key, replacement: value })); + +// plugins +const BABEL_PLUGIN_OPTIONS = { + extensions: ['.js', '.vue'], + exclude: 'node_modules/**', + presets: ['@babel/preset-env'], + plugins: [], + skipPreflightCheck: true, + babelHelpers: 'runtime', + babelrc: false +}; + +const ALIAS_PLUGIN_OPTIONS = { + entries: ALIAS_ENTRIES +}; + +const POSTCSS_PLUGIN_OPTIONS = { + sourceMap: false +}; + +const TERSER_PLUGIN_OPTIONS = { + compress: { + keep_infinity: true, + pure_getters: true, + reduce_funcs: true + }, + mangle: { + reserved: ['theme', 'css'] + } +}; + +const PLUGINS = [vue(), postcss(POSTCSS_PLUGIN_OPTIONS), babel(BABEL_PLUGIN_OPTIONS)]; + +const ENTRY = { + entries: [], + onwarn(warning) { + if (warning.code === 'CIRCULAR_DEPENDENCY') { + //console.error(`(!) ${warning.message}`); + return; + } + }, + format: { + cjs_es(options) { + return ENTRY.format.cjs(options).es(options); + }, + cjs({ input, output, minify }) { + ENTRY.entries.push({ + onwarn: ENTRY.onwarn, + input, + plugins: [...PLUGINS, minify && terser(TERSER_PLUGIN_OPTIONS)], + external: EXTERNALS, + inlineDynamicImports: true, + output: [ + { + format: 'cjs', + file: `${output}${minify ? '.min' : ''}.cjs`, + sourcemap: true, + exports: 'auto' + } + ] + }); + + return ENTRY.format; + }, + es({ input, output, minify }) { + ENTRY.entries.push({ + onwarn: ENTRY.onwarn, + input, + plugins: [...PLUGINS, minify && terser(TERSER_PLUGIN_OPTIONS)], + external: EXTERNALS, + inlineDynamicImports: true, + output: [ + { + format: 'es', + file: `${output}${minify ? '.min' : ''}.mjs`, + sourcemap: true, + exports: 'auto' + } + ] + }); + + return ENTRY.format; + }, + umd({ name, input, output, minify }) { + ENTRY.entries.push({ + onwarn: ENTRY.onwarn, + input, + plugins: [alias(ALIAS_PLUGIN_OPTIONS), ...PLUGINS, minify && terser(TERSER_PLUGIN_OPTIONS)], + external: GLOBAL_EXTERNALS, + inlineDynamicImports: true, + output: [ + { + format: 'umd', + name: name ?? 'PrimeVue', + file: `${output}${minify ? '.min' : ''}.js`, + globals: GLOBALS, + exports: 'auto' + } + ] + }); + + return ENTRY.format; + } + } +}; + +function addFile() { + fs.readdirSync(path.resolve(__dirname, process.env.INPUT_DIR), { withFileTypes: true }) + .filter((dir) => dir.isDirectory()) + .forEach(({ name: folderName }) => { + fs.readdirSync(path.resolve(__dirname, process.env.INPUT_DIR + folderName)).forEach((file) => { + let name = file.split(/(.vue)$|(.js)$/)[0].toLowerCase(); + + if (name === folderName) { + const input = process.env.INPUT_DIR + folderName + '/' + file; + const output = process.env.OUTPUT_DIR + folderName + '/' + name; + + ENTRY.format.es({ input, output }); + } + }); + }); +} + +function addIcon() { + const iconDir = path.resolve(__dirname, process.env.INPUT_DIR + 'icons'); + + fs.readdirSync(path.resolve(__dirname, iconDir), { withFileTypes: true }) + .filter((dir) => dir.isDirectory()) + .forEach(({ name: folderName }) => { + fs.readdirSync(path.resolve(__dirname, iconDir + '/' + folderName)).forEach((file) => { + if (/\.vue$/.test(file)) { + const name = file.split(/(.vue)$/)[0].toLowerCase(); + const input = process.env.INPUT_DIR + 'icons/' + folderName + '/' + file; + const output = process.env.OUTPUT_DIR + 'icons/' + folderName + '/' + name; + + ENTRY.format.es({ input, output }); + } + }); + }); +} + +function addStyle() { + fs.readdirSync(path.resolve(__dirname, process.env.INPUT_DIR), { withFileTypes: true }) + .filter((dir) => dir.isDirectory()) + .forEach(({ name: folderName }) => { + try { + fs.readdirSync(path.resolve(__dirname, process.env.INPUT_DIR + folderName + '/style')).forEach((file) => { + if (/\.js$/.test(file)) { + const name = file.split(/(.js)$/)[0].toLowerCase(); + const input = process.env.INPUT_DIR + folderName + '/style/' + file; + const output = process.env.OUTPUT_DIR + folderName + '/style/' + name; + + ENTRY.format.es({ input, output }); + } + }); + } catch {} + }); +} + +function traverseDir(dir, condition, callback) { + try { + const files = fs.readdirSync(dir); + + files.forEach((file) => { + const filePath = path.join(dir, file); + const fileStat = fs.statSync(filePath); + + if (fileStat.isDirectory()) { + traverseDir(filePath, condition, callback); + } else if (condition?.(file) && fileStat.isFile()) { + callback?.(file, filePath, dir); + } + }); + } catch {} +} + +function addThemes() { + traverseDir( + path.resolve(__dirname, process.env.INPUT_DIR + 'themes'), + (file) => file === 'index.js', + (file, filePath, folderPath) => { + const searchFolder = '/' + process.env.INPUT_DIR; + const folderName = folderPath.substring(folderPath.indexOf(searchFolder) + searchFolder.length); + const input = process.env.INPUT_DIR + folderName + '/' + file; + const output = process.env.OUTPUT_DIR + folderName + '/' + 'index'; + + ENTRY.format.es({ input, output }); + } + ); +} + +function addCore() { + ENTRY.format.es({ input: process.env.INPUT_DIR + 'config/PrimeVue.js', output: process.env.OUTPUT_DIR + 'config/config' }); + ENTRY.format.es({ input: process.env.INPUT_DIR + 'service/PrimeVueService.js', output: process.env.OUTPUT_DIR + 'service/primevueservice' }); +} + +function addPassThrough() { + ENTRY.format.es({ input: process.env.INPUT_DIR + 'passthrough/index.js', output: process.env.OUTPUT_DIR + 'passthrough/index' }); +} + +function addLibrary() { + THEME_PRESETS?.forEach((preset) => { + ENTRY.format.umd({ name: `PrimeVue.Themes.${preset[0].toUpperCase() + preset.slice(1)}`, input: process.env.INPUT_DIR + `themes/${preset}/index.js`, output: process.env.OUTPUT_DIR + `umd/themes/${preset}`, minify: true }); + }); + + ENTRY.format.umd({ name: 'PrimeVue', input: process.env.INPUT_DIR + 'primevue.js', output: process.env.OUTPUT_DIR + 'umd/primevue', minify: true }); +} + +function addPackageJson() { + const outputDir = path.resolve(__dirname, process.env.OUTPUT_DIR); + const packageJson = `{ + "name": "primevue", + "version": "${pkg.version}", + "private": "false", + "author": "PrimeTek Informatics", + "description": "PrimeVue is an open source UI library for Vue featuring a rich set of 80+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with PrimeBlock, which has 370+ ready to use UI blocks to build spectacular applications in no time.", + "homepage": "https://primevue.org/", + "repository": { + "type": "git", + "url": "https://github.com/primefaces/primevue.git" + }, + "license": "MIT", + "bugs": { + "url": "https://github.com/primefaces/primevue/issues" + }, + "keywords": [ + "primevue", + "vue", + "vue.js", + "vue2", + "vue3", + "ui library", + "component library", + "material", + "bootstrap", + "fluent", + "tailwind", + "unstyled", + "passthrough" + ], + "unpkg": "umd/primevue.min.js", + "jsdelivr": "umd/primevue.min.js", + "web-types": "./web-types.json", + "vetur": { + "tags": "./vetur-tags.json", + "attributes": "./vetur-attributes.json" + }, + "sideEffects": [ + "*.vue" + ], + "peerDependencies": { + "vue": "^3.0.0" + }, + "engines": { + "node": ">=12.11.0" + } +}`; + + !fs.existsSync(outputDir) && fs.mkdirSync(outputDir); + fs.writeFileSync(path.resolve(outputDir, 'package.json'), packageJson); +} + +addCore(); +addStyle(); +addThemes(); +addIcon(); +addFile(); +addPassThrough(); +addLibrary(); +addPackageJson(); + +export default ENTRY.entries;