diff --git a/.github/workflows/generate_api_doc.yml b/.github/workflows/generate_api_doc.yml index 56def89a6..ca537bbc9 100644 --- a/.github/workflows/generate_api_doc.yml +++ b/.github/workflows/generate_api_doc.yml @@ -1,42 +1,45 @@ name: Generate API DOC on: - push: - branches: [ master ] - paths: - - '**/**/*.d.ts' - - '/api-generator/build-apidoc.js' + push: + branches: [master] + paths: + - '**/**/*.d.ts' + - '/api-generator/build-apidoc.js' permissions: - contents: write + contents: write jobs: - build: - if: github.repository == 'primefaces/primevue' && github.ref == 'refs/heads/master' - runs-on: ubuntu-latest + build: + if: github.repository == 'primefaces/primevue' && github.ref == 'refs/heads/master' + runs-on: ubuntu-latest - strategy: - matrix: - node-version: [16.x] + strategy: + matrix: + node-version: [16.x] - steps: - - uses: actions/checkout@v3 + steps: + - uses: actions/checkout@v3 - - name: Use Node.js ${{ matrix.node-version }} - uses: actions/setup-node@v3 - with: - node-version: ${{ matrix.node-version }} - cache: 'npm' + - name: Use Node.js ${{ matrix.node-version }} + uses: actions/setup-node@v3 + with: + node-version: ${{ matrix.node-version }} + cache: 'npm' - - name: Install node packages - run: npm install + - name: Install node packages + run: npm install - - name: Generate api doc - run: npm run apidoc + - name: Generate api doc + run: npm run apidoc - - name: Commit doc - run: | - git config user.name "GitHub Actions Bot" - git config user.email "<>" - git commit -a -m "Update API doc" - git push + - name: Code Format + run: npm run format + + - name: Commit doc + run: | + git config user.name "GitHub Actions Bot" + git config user.email "<>" + git commit -a -m "Update API doc" + git push diff --git a/CHANGELOG.md b/CHANGELOG.md index cac8abb1f..4bb3a093d 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,53 @@ # Changelog +## [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) diff --git a/api-generator/build-apidoc.js b/api-generator/build-apidoc.js index ecbc066b7..00d5490d4 100644 --- a/api-generator/build-apidoc.js +++ b/api-generator/build-apidoc.js @@ -352,7 +352,17 @@ if (project) { 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(' '), + 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 }); }); diff --git a/api-generator/components/selectbutton.js b/api-generator/components/selectbutton.js index 93a2641ea..6dd55ad81 100644 --- a/api-generator/components/selectbutton.js +++ b/api-generator/components/selectbutton.js @@ -51,6 +51,12 @@ const SelectButtonProps = [ 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.' }, { diff --git a/components/doc/DocApiTable.vue b/components/doc/DocApiTable.vue index b1a2246b0..f67f62a6c 100644 --- a/components/doc/DocApiTable.vue +++ b/components/doc/DocApiTable.vue @@ -59,7 +59,10 @@ {{ v }} - {{ v }} + diff --git a/components/doc/codeeditor/templates.js b/components/doc/codeeditor/templates.js index 0597cd8a2..2cdb86e6c 100644 --- a/components/doc/codeeditor/templates.js +++ b/components/doc/codeeditor/templates.js @@ -2,7 +2,7 @@ import pkg from '../../../package.json'; import { services } from './services'; const PrimeVue = { - version: '^3.35.0', + version: '^3.36.0', 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 400+ ready to use UI blocks to build spectacular applications in no time.' }; diff --git a/components/lib/api/FilterService.js b/components/lib/api/FilterService.js index 8185a41f4..1fb8b05cc 100644 --- a/components/lib/api/FilterService.js +++ b/components/lib/api/FilterService.js @@ -4,10 +4,19 @@ const FilterService = { filter(value, fields, filterValue, filterMatchMode, filterLocale) { let filteredItems = []; - if (value) { - for (let item of value) { - for (let field of fields) { - let fieldValue = ObjectUtils.resolveFieldData(item, field); + if (!value) { + return filteredItems; + } + + for (const item of value) { + if (typeof item === 'string') { + if (this.filters[filterMatchMode](item, filterValue, filterLocale)) { + filteredItems.push(item); + continue; + } + } else { + for (const field of fields) { + const fieldValue = ObjectUtils.resolveFieldData(item, field); if (this.filters[filterMatchMode](fieldValue, filterValue, filterLocale)) { filteredItems.push(item); diff --git a/components/lib/badgedirective/BadgeDirective.js b/components/lib/badgedirective/BadgeDirective.js index b032fb191..3a8930cb6 100644 --- a/components/lib/badgedirective/BadgeDirective.js +++ b/components/lib/badgedirective/BadgeDirective.js @@ -5,11 +5,9 @@ const BadgeDirective = BaseBadgeDirective.extend('badge', { mounted(el, binding) { const id = UniqueComponentId() + '_badge'; - el.unstyled = binding.instance.$primevue?.config?.unstyled || binding.value?.unstyled || false; - const badge = DomHandler.createElement('span', { id, - class: !el.unstyled && this.cx('root'), + class: !this.isUnstyled() && this.cx('root'), 'p-bind': this.ptm('root', { context: { ...binding.modifiers, @@ -22,7 +20,7 @@ const BadgeDirective = BaseBadgeDirective.extend('badge', { el.$_pbadgeId = badge.getAttribute('id'); for (let modifier in binding.modifiers) { - !el.unstyled && DomHandler.addClass(badge, 'p-badge-' + modifier); + !this.isUnstyled() && DomHandler.addClass(badge, 'p-badge-' + modifier); } if (binding.value != null) { @@ -30,22 +28,22 @@ const BadgeDirective = BaseBadgeDirective.extend('badge', { else el.$_badgeValue = binding.value; badge.appendChild(document.createTextNode(el.$_badgeValue)); - if (String(el.$_badgeValue).length === 1 && !el.unstyled) { - !el.unstyled && DomHandler.addClass(badge, 'p-badge-no-gutter'); + if (String(el.$_badgeValue).length === 1 && !this.isUnstyled()) { + !this.isUnstyled() && DomHandler.addClass(badge, 'p-badge-no-gutter'); } } else { - !el.unstyled && DomHandler.addClass(badge, 'p-badge-dot'); + !this.isUnstyled() && DomHandler.addClass(badge, 'p-badge-dot'); } el.setAttribute('data-pd-badge', true); - !el.unstyled && DomHandler.addClass(el, 'p-overlay-badge'); + !this.isUnstyled() && DomHandler.addClass(el, 'p-overlay-badge'); el.setAttribute('data-p-overlay-badge', 'true'); el.appendChild(badge); this.$el = badge; }, updated(el, binding) { - !el.unstyled && DomHandler.addClass(el, 'p-overlay-badge'); + !this.isUnstyled() && DomHandler.addClass(el, 'p-overlay-badge'); el.setAttribute('data-p-overlay-badge', 'true'); if (binding.oldValue !== binding.value) { @@ -54,7 +52,7 @@ const BadgeDirective = BaseBadgeDirective.extend('badge', { if (typeof binding.value === 'object') el.$_badgeValue = binding.value.value; else el.$_badgeValue = binding.value; - if (!el.unstyled) { + if (!this.isUnstyled()) { if (el.$_badgeValue) { if (DomHandler.hasClass(badge, 'p-badge-dot')) DomHandler.removeClass(badge, 'p-badge-dot'); diff --git a/components/lib/basedirective/BaseDirective.js b/components/lib/basedirective/BaseDirective.js index 3784e4e2d..fb51257f3 100644 --- a/components/lib/basedirective/BaseDirective.js +++ b/components/lib/basedirective/BaseDirective.js @@ -4,6 +4,7 @@ import { mergeProps } from 'vue'; const BaseDirective = { _getMeta: (...args) => [ObjectUtils.isObject(args[0]) ? undefined : args[0], ObjectUtils.getItemValue(ObjectUtils.isObject(args[0]) ? args[0] : args[1])], + _getConfig: (binding, vnode) => (binding?.instance?.$primevue || vnode?.ctx?.appContext?.config?.globalProperties?.$primevue)?.config, _getOptionValue: (options, key = '', params = {}) => { const fKeys = ObjectUtils.toFlatCase(key).split('.'); const fKey = fKeys.shift(); @@ -23,7 +24,7 @@ const BaseDirective = { const datasetPrefix = 'data-pc-'; const { mergeSections = true, mergeProps: useMergeProps = false } = instance.binding?.value?.ptOptions || instance.$config?.ptOptions || {}; - const global = searchInDefaultPT ? BaseDirective._useDefaultPT(instance, instance.defaultPT, getValue, key, params) : undefined; + const global = searchInDefaultPT ? BaseDirective._useDefaultPT(instance, instance.defaultPT(), getValue, key, params) : undefined; const self = BaseDirective._usePT(instance, BaseDirective._getPT(obj, instance.$name), getValue, key, { ...params, global: global || {} }); const datasets = { ...(key === 'root' && { [`${datasetPrefix}name`]: ObjectUtils.toFlatCase(instance.$name) }), @@ -70,7 +71,7 @@ const BaseDirective = { }, _hook: (directiveName, hookName, el, binding, vnode, prevVnode) => { const name = `on${ObjectUtils.toCapitalCase(hookName)}`; - const config = binding?.instance?.$primevue?.config; + const config = BaseDirective._getConfig(binding, vnode); const instance = el?.$instance; const selfHook = BaseDirective._usePT(instance, BaseDirective._getPT(binding?.value?.pt, directiveName), BaseDirective._getOptionValue, `hooks.${name}`); const defaultHook = BaseDirective._useDefaultPT(instance, config?.pt?.directives?.[directiveName], BaseDirective._getOptionValue, `hooks.${name}`); @@ -83,7 +84,7 @@ const BaseDirective = { const handleHook = (hook, el, binding, vnode, prevVnode) => { el._$instances = el._$instances || {}; - const config = binding?.instance?.$primevue?.config; + const config = BaseDirective._getConfig(binding, vnode); const $prevInstance = el._$instances[name] || {}; const $options = ObjectUtils.isEmpty($prevInstance) ? { ...options, ...options?.methods } : {}; @@ -97,12 +98,12 @@ const BaseDirective = { $style: { classes: undefined, inlineStyles: undefined, loadStyle: () => {}, ...options?.style }, $config: config, /* computed instance variables */ - defaultPT: BaseDirective._getPT(config?.pt, undefined, (value) => value?.directives?.[name]), - isUnstyled: el.unstyled !== undefined ? el.unstyled : config?.unstyled, + defaultPT: () => BaseDirective._getPT(config?.pt, undefined, (value) => value?.directives?.[name]), + isUnstyled: () => (el.$instance?.$binding?.value?.unstyled !== undefined ? el.$instance?.$binding?.value?.unstyled : config?.unstyled), /* instance's methods */ ptm: (key = '', params = {}) => BaseDirective._getPTValue(el.$instance, el.$instance?.$binding?.value?.pt, key, { ...params }), ptmo: (obj = {}, key = '', params = {}) => BaseDirective._getPTValue(el.$instance, obj, key, params, false), - cx: (key = '', params = {}) => (!el.$instance?.isUnstyled ? BaseDirective._getOptionValue(el.$instance?.$style?.classes, key, { ...params }) : undefined), + cx: (key = '', params = {}) => (!el.$instance?.isUnstyled() ? BaseDirective._getOptionValue(el.$instance?.$style?.classes, key, { ...params }) : undefined), sx: (key = '', when = true, params = {}) => (when ? BaseDirective._getOptionValue(el.$instance?.$style?.inlineStyles, key, { ...params }) : undefined), ...$options }; @@ -117,10 +118,10 @@ const BaseDirective = { handleHook('created', el, binding, vnode, prevVnode); }, beforeMount: (el, binding, vnode, prevVnode) => { - const config = binding?.instance?.$primevue?.config; + const config = BaseDirective._getConfig(binding, vnode); BaseStyle.loadStyle(undefined, { nonce: config?.csp?.nonce }); - !el.$instance?.isUnstyled && el.$instance?.$style?.loadStyle(undefined, { nonce: config?.csp?.nonce }); + !el.$instance?.isUnstyled() && el.$instance?.$style?.loadStyle(undefined, { nonce: config?.csp?.nonce }); handleHook('beforeMount', el, binding, vnode, prevVnode); }, mounted: (el, binding, vnode, prevVnode) => { diff --git a/components/lib/blockui/BlockUI.vue b/components/lib/blockui/BlockUI.vue index 1dfb4d8c7..0464f271d 100755 --- a/components/lib/blockui/BlockUI.vue +++ b/components/lib/blockui/BlockUI.vue @@ -50,8 +50,7 @@ export default { }); document.body.appendChild(this.mask); - DomHandler.addClass(document.body, 'p-overflow-hidden'); - document.body.style.setProperty('--scrollbar-width', DomHandler.calculateScrollbarWidth() + 'px'); + DomHandler.blockBodyScroll(); document.activeElement.blur(); } else { this.mask = DomHandler.createElement('div', { @@ -92,8 +91,7 @@ export default { if (this.fullScreen) { document.body.removeChild(this.mask); - DomHandler.removeClass(document.body, 'p-overflow-hidden'); - document.body.style.removeProperty('--scrollbar-width'); + DomHandler.unblockBodyScroll(); } else { this.$refs.container.removeChild(this.mask); } diff --git a/components/lib/calendar/Calendar.vue b/components/lib/calendar/Calendar.vue index 34c714399..05c176303 100755 --- a/components/lib/calendar/Calendar.vue +++ b/components/lib/calendar/Calendar.vue @@ -1656,8 +1656,7 @@ export default { this.mask.addEventListener('click', this.maskClickListener); document.body.appendChild(this.mask); - DomHandler.addClass(document.body, 'p-overflow-hidden'); - document.body.style.setProperty('--scrollbar-width', DomHandler.calculateScrollbarWidth() + 'px'); + DomHandler.blockBodyScroll(); } }, disableModality() { @@ -1691,8 +1690,7 @@ export default { } if (!hasBlockerMasks) { - DomHandler.removeClass(document.body, 'p-overflow-hidden'); - document.body.style.removeProperty('--scrollbar-width'); + DomHandler.unblockBodyScroll(); } }, updateCurrentMetaData() { @@ -2671,7 +2669,7 @@ export default { let innerHTML = ''; if (this.responsiveOptions) { - const comparer = new Intl.Collator(undefined, { numeric: true }).compare; + const comparer = ObjectUtils.localeComparator(); let responsiveOptions = [...this.responsiveOptions].filter((o) => !!(o.breakpoint && o.numMonths)).sort((o1, o2) => -1 * comparer(o1.breakpoint, o2.breakpoint)); for (let i = 0; i < responsiveOptions.length; i++) { diff --git a/components/lib/calendar/style/CalendarStyle.js b/components/lib/calendar/style/CalendarStyle.js index b5c95014c..b35ad376e 100644 --- a/components/lib/calendar/style/CalendarStyle.js +++ b/components/lib/calendar/style/CalendarStyle.js @@ -210,8 +210,6 @@ const classes = { decrementButton: 'p-link', separatorContainer: 'p-separator', minutePicker: 'p-minute-picker', - incrementButton: 'p-link', - decrementButton: 'p-link', secondPicker: 'p-second-picker', ampmPicker: 'p-ampm-picker', buttonbar: 'p-datepicker-buttonbar', diff --git a/components/lib/carousel/Carousel.vue b/components/lib/carousel/Carousel.vue index fb1685e81..cd189b170 100755 --- a/components/lib/carousel/Carousel.vue +++ b/components/lib/carousel/Carousel.vue @@ -101,7 +101,7 @@ import ChevronLeftIcon from 'primevue/icons/chevronleft'; import ChevronRightIcon from 'primevue/icons/chevronright'; import ChevronUpIcon from 'primevue/icons/chevronup'; import Ripple from 'primevue/ripple'; -import { DomHandler, UniqueComponentId } from 'primevue/utils'; +import { DomHandler, UniqueComponentId, ObjectUtils } from 'primevue/utils'; import BaseCarousel from './BaseCarousel.vue'; export default { @@ -548,20 +548,13 @@ export default { if (this.responsiveOptions && !this.isUnstyled) { let _responsiveOptions = [...this.responsiveOptions]; - const comparer = new Intl.Collator(undefined, { numeric: true }).compare; + const comparer = ObjectUtils.localeComparator(); _responsiveOptions.sort((data1, data2) => { const value1 = data1.breakpoint; const value2 = data2.breakpoint; - let result = null; - if (value1 == null && value2 != null) result = -1; - else if (value1 != null && value2 == null) result = 1; - else if (value1 == null && value2 == null) result = 0; - else if (typeof value1 === 'string' && typeof value2 === 'string') result = comparer(value1, value2); - else result = value1 < value2 ? -1 : value1 > value2 ? 1 : 0; - - return -1 * result; + return ObjectUtils.sort(value1, value2, -1, comparer); }); for (let i = 0; i < _responsiveOptions.length; i++) { diff --git a/components/lib/config/PrimeVue.d.ts b/components/lib/config/PrimeVue.d.ts index c46016675..5aeb5a5d8 100644 --- a/components/lib/config/PrimeVue.d.ts +++ b/components/lib/config/PrimeVue.d.ts @@ -108,6 +108,8 @@ export interface PrimeVueConfiguration { csp?: PrimeVueCSPOptions; } +export declare const defaultOptions: PrimeVueConfiguration; + export interface PrimeVueZIndexOptions { modal?: number; overlay?: number; diff --git a/components/lib/datatable/BaseDataTable.vue b/components/lib/datatable/BaseDataTable.vue index 51015d0c7..d307f759b 100644 --- a/components/lib/datatable/BaseDataTable.vue +++ b/components/lib/datatable/BaseDataTable.vue @@ -78,6 +78,10 @@ export default { type: Number, default: 1 }, + nullSortOrder: { + type: Number, + default: 1 + }, multiSortMeta: { type: Array, default: null diff --git a/components/lib/datatable/DataTable.d.ts b/components/lib/datatable/DataTable.d.ts index 61275bdb5..84d063cc2 100755 --- a/components/lib/datatable/DataTable.d.ts +++ b/components/lib/datatable/DataTable.d.ts @@ -887,6 +887,11 @@ export interface DataTableProps { * Order to sort the data by default. */ sortOrder?: number | undefined; + /** + * Determines how null values are sorted. + * @defaultValue 1 + */ + nullSortOrder?: number; /** * Default sort order of an unsorted column. * @defaultValue 1 diff --git a/components/lib/datatable/DataTable.vue b/components/lib/datatable/DataTable.vue index 8ee20b53d..931878a38 100755 --- a/components/lib/datatable/DataTable.vue +++ b/components/lib/datatable/DataTable.vue @@ -341,6 +341,7 @@ export default { d_rows: this.rows, d_sortField: this.sortField, d_sortOrder: this.sortOrder, + d_nullSortOrder: this.nullSortOrder, d_multiSortMeta: this.multiSortMeta ? [...this.multiSortMeta] : [], d_groupRowsSortMeta: null, d_selectionKeys: null, @@ -381,6 +382,9 @@ export default { sortOrder(newValue) { this.d_sortOrder = newValue; }, + nullSortOrder(newValue) { + this.d_nullSortOrder = newValue; + }, multiSortMeta(newValue) { this.d_multiSortMeta = newValue; }, @@ -530,27 +534,19 @@ export default { } let data = [...value]; - let resolvedFieldDatas = new Map(); + let resolvedFieldData = new Map(); for (let item of data) { - resolvedFieldDatas.set(item, ObjectUtils.resolveFieldData(item, this.d_sortField)); + resolvedFieldData.set(item, ObjectUtils.resolveFieldData(item, this.d_sortField)); } - const comparer = new Intl.Collator(undefined, { numeric: true }).compare; + const comparer = ObjectUtils.localeComparator(); data.sort((data1, data2) => { - let value1 = resolvedFieldDatas.get(data1); - let value2 = resolvedFieldDatas.get(data2); + let value1 = resolvedFieldData.get(data1); + let value2 = resolvedFieldData.get(data2); - let result = null; - - if (value1 == null && value2 != null) result = -1; - else if (value1 != null && value2 == null) result = 1; - else if (value1 == null && value2 == null) result = 0; - else if (typeof value1 === 'string' && typeof value2 === 'string') result = comparer(value1, value2); - else result = value1 < value2 ? -1 : value1 > value2 ? 1 : 0; - - return this.d_sortOrder * result; + return ObjectUtils.sort(value1, value2, this.d_sortOrder, comparer, this.d_nullSortOrder); }); return data; @@ -579,23 +575,13 @@ export default { multisortField(data1, data2, index) { const value1 = ObjectUtils.resolveFieldData(data1, this.d_multiSortMeta[index].field); const value2 = ObjectUtils.resolveFieldData(data2, this.d_multiSortMeta[index].field); - let result = null; - - if (typeof value1 === 'string' || value1 instanceof String) { - if (value1.localeCompare && value1 !== value2) { - const comparer = new Intl.Collator(undefined, { numeric: true }).compare; - - return this.d_multiSortMeta[index].order * comparer(value1, value2); - } - } else { - result = value1 < value2 ? -1 : 1; - } + const comparer = ObjectUtils.localeComparator(); if (value1 === value2) { return this.d_multiSortMeta.length - 1 > index ? this.multisortField(data1, data2, index + 1) : 0; } - return this.d_multiSortMeta[index].order * result; + return ObjectUtils.sort(value1, value2, this.d_multiSortMeta[index].order, comparer, this.d_nullSortOrder); }, addMultiSortField(field) { let index = this.d_multiSortMeta.findIndex((meta) => meta.field === field); diff --git a/components/lib/dataview/DataView.vue b/components/lib/dataview/DataView.vue index 4cc5d8854..b1e14fc3e 100755 --- a/components/lib/dataview/DataView.vue +++ b/components/lib/dataview/DataView.vue @@ -110,20 +110,13 @@ export default { sort() { if (this.value) { const value = [...this.value]; - const comparer = new Intl.Collator(undefined, { numeric: true }).compare; + const comparer = ObjectUtils.localeComparator(); value.sort((data1, data2) => { let value1 = ObjectUtils.resolveFieldData(data1, this.sortField); let value2 = ObjectUtils.resolveFieldData(data2, this.sortField); - let result = null; - if (value1 == null && value2 != null) result = -1; - else if (value1 != null && value2 == null) result = 1; - else if (value1 == null && value2 == null) result = 0; - else if (typeof value1 === 'string' && typeof value2 === 'string') result = comparer(value1, value2); - else result = value1 < value2 ? -1 : value1 > value2 ? 1 : 0; - - return this.sortOrder * result; + return ObjectUtils.sort(value1, value2, this.sortOrder, comparer); }); return value; diff --git a/components/lib/dialog/Dialog.vue b/components/lib/dialog/Dialog.vue index 9587f5f08..253cab11c 100755 --- a/components/lib/dialog/Dialog.vue +++ b/components/lib/dialog/Dialog.vue @@ -203,25 +203,17 @@ export default { } if (!this.modal) { - if (this.maximized) { - DomHandler.addClass(document.body, 'p-overflow-hidden'); - document.body.style.setProperty('--scrollbar-width', DomHandler.calculateScrollbarWidth() + 'px'); - } else { - DomHandler.removeClass(document.body, 'p-overflow-hidden'); - document.body.style.removeProperty('--scrollbar-width'); - } + this.maximized ? DomHandler.blockBodyScroll() : DomHandler.unblockBodyScroll(); } }, enableDocumentSettings() { if (this.modal || (!this.modal && this.blockScroll) || (this.maximizable && this.maximized)) { - DomHandler.addClass(document.body, 'p-overflow-hidden'); - document.body.style.setProperty('--scrollbar-width', DomHandler.calculateScrollbarWidth() + 'px'); + DomHandler.blockBodyScroll(); } }, unbindDocumentState() { if (this.modal || (!this.modal && this.blockScroll) || (this.maximizable && this.maximized)) { - DomHandler.removeClass(document.body, 'p-overflow-hidden'); - document.body.style.removeProperty('--scrollbar-width'); + DomHandler.unblockBodyScroll(); } }, onKeyDown(event) { diff --git a/components/lib/editor/style/EditorStyle.js b/components/lib/editor/style/EditorStyle.js index 412c95d8f..17d69891b 100644 --- a/components/lib/editor/style/EditorStyle.js +++ b/components/lib/editor/style/EditorStyle.js @@ -2,11 +2,11 @@ import BaseStyle from 'primevue/base/style'; const quillCSS = ` /*! - * Quill Editor v1.3.3 - * https://quilljs.com/ - * Copyright (c) 2014, Jason Chen - * Copyright (c) 2013, salesforce.com - */ +* Quill Editor v1.3.3 +* https://quilljs.com/ +* Copyright (c) 2014, Jason Chen +* Copyright (c) 2013, salesforce.com +*/ .ql-container { box-sizing: border-box; font-family: Helvetica, Arial, sans-serif; diff --git a/components/lib/fieldset/style/FieldsetStyle.js b/components/lib/fieldset/style/FieldsetStyle.js index 32d7522f8..ab61bb36f 100644 --- a/components/lib/fieldset/style/FieldsetStyle.js +++ b/components/lib/fieldset/style/FieldsetStyle.js @@ -33,7 +33,6 @@ const classes = { legend: 'p-fieldset-legend', legendtitle: 'p-fieldset-legend-text', togglericon: 'p-fieldset-toggler', - legendtitle: 'p-fieldset-legend-text', toggleablecontent: 'p-toggleable-content', content: 'p-fieldset-content' }; diff --git a/components/lib/galleria/Galleria.vue b/components/lib/galleria/Galleria.vue index d8aaa4675..39c39c5d4 100755 --- a/components/lib/galleria/Galleria.vue +++ b/components/lib/galleria/Galleria.vue @@ -35,8 +35,7 @@ export default { }, beforeUnmount() { if (this.fullScreen) { - DomHandler.removeClass(document.body, 'p-overflow-hidden'); - document.body.style.removeProperty('--scrollbar-width'); + DomHandler.unblockBodyScroll(); } this.mask = null; @@ -52,8 +51,7 @@ export default { }, onEnter(el) { this.mask.style.zIndex = String(parseInt(el.style.zIndex, 10) - 1); - DomHandler.addClass(document.body, 'p-overflow-hidden'); - document.body.style.setProperty('--scrollbar-width', DomHandler.calculateScrollbarWidth() + 'px'); + DomHandler.blockBodyScroll(); this.focus(); }, onBeforeLeave() { @@ -62,8 +60,7 @@ export default { onAfterLeave(el) { ZIndexUtils.clear(el); this.containerVisible = false; - DomHandler.removeClass(document.body, 'p-overflow-hidden'); - document.body.style.removeProperty('--scrollbar-width'); + DomHandler.unblockBodyScroll(); }, onActiveItemChange(index) { if (this.activeIndex !== index) { diff --git a/components/lib/galleria/GalleriaThumbnails.vue b/components/lib/galleria/GalleriaThumbnails.vue index acd89e8d0..5df896fad 100755 --- a/components/lib/galleria/GalleriaThumbnails.vue +++ b/components/lib/galleria/GalleriaThumbnails.vue @@ -68,7 +68,7 @@ import ChevronLeftIcon from 'primevue/icons/chevronleft'; import ChevronRightIcon from 'primevue/icons/chevronright'; import ChevronUpIcon from 'primevue/icons/chevronup'; import Ripple from 'primevue/ripple'; -import { DomHandler } from 'primevue/utils'; +import { DomHandler, ObjectUtils } from 'primevue/utils'; export default { name: 'GalleriaThumbnails', @@ -438,20 +438,13 @@ export default { if (this.responsiveOptions && !this.isUnstyled) { this.sortedResponsiveOptions = [...this.responsiveOptions]; - const comparer = new Intl.Collator(undefined, { numeric: true }).compare; + const comparer = ObjectUtils.localeComparator(); this.sortedResponsiveOptions.sort((data1, data2) => { const value1 = data1.breakpoint; const value2 = data2.breakpoint; - let result = null; - if (value1 == null && value2 != null) result = -1; - else if (value1 != null && value2 == null) result = 1; - else if (value1 == null && value2 == null) result = 0; - else if (typeof value1 === 'string' && typeof value2 === 'string') result = comparer(value1, value2); - else result = value1 < value2 ? -1 : value1 > value2 ? 1 : 0; - - return -1 * result; + return ObjectUtils.sort(value1, value2, -1, comparer); }); for (let i = 0; i < this.sortedResponsiveOptions.length; i++) { diff --git a/components/lib/image/Image.vue b/components/lib/image/Image.vue index 0eca4a757..5abdfa650 100644 --- a/components/lib/image/Image.vue +++ b/components/lib/image/Image.vue @@ -93,8 +93,7 @@ export default { }, onImageClick() { if (this.preview) { - DomHandler.addClass(document.body, 'p-overflow-hidden'); - document.body.style.setProperty('--scrollbar-width', DomHandler.calculateScrollbarWidth() + 'px'); + DomHandler.blockBodyScroll(); this.maskVisible = true; setTimeout(() => { this.previewVisible = true; @@ -164,8 +163,7 @@ export default { !this.isUnstyled && DomHandler.addClass(this.mask, 'p-component-overlay-leave'); }, onLeave() { - DomHandler.removeClass(document.body, 'p-overflow-hidden'); - document.body.style.removeProperty('--scrollbar-width'); + DomHandler.unblockBodyScroll(); this.$emit('hide'); }, onAfterLeave(el) { @@ -183,8 +181,7 @@ export default { this.previewVisible = false; this.rotate = 0; this.scale = 1; - DomHandler.removeClass(document.body, 'p-overflow-hidden'); - document.body.style.removeProperty('--scrollbar-width'); + DomHandler.unblockBodyScroll(); } }, computed: { diff --git a/components/lib/orderlist/OrderList.vue b/components/lib/orderlist/OrderList.vue index ffc153a15..74804a56b 100755 --- a/components/lib/orderlist/OrderList.vue +++ b/components/lib/orderlist/OrderList.vue @@ -2,28 +2,28 @@
- + - + - + - +