@paperless/core 2.22.0-alpha.32 → 2.22.0-alpha.33

package/dist/cjs/p-button_3.cjs.entry.js

@@ -525,7 +525,7 @@ const Button = class {
             : 'button';
         const hostClass = cn.cn('p-button inline-block', this.class);
         const active = asBoolean.asBoolean(this.active) || hostClass?.includes('active');
-        return (index.h(themedHost_component.ThemedHost, { key: '7452fa765b24901c77a8ed76278994150ba11acf', class: hostClass }, index.h(VariableTag, { key: '9f0d18fb8068bb01f0dd5d844aa322c1effccb9b', disabled: asBoolean.asBoolean(this.disabled), href: this.href, type: this.variant === 'text' ? undefined : this.type, target: this.target, tabIndex: this.tabIndex, class: button({
+        return (index.h(themedHost_component.ThemedHost, { key: '7452fa765b24901c77a8ed76278994150ba11acf', class: hostClass }, index.h(VariableTag, { key: '9f0d18fb8068bb01f0dd5d844aa322c1effccb9b', class: button({
                 variant: this.variant,
                 size: this.size,
                 loading: asBoolean.asBoolean(this.loading),
@@ -535,14 +535,14 @@ const Button = class {
                 active,
                 error: asBoolean.asBoolean(this.error),
                 underline: asBoolean.asBoolean(this.underline) && VariableTag === 'a',
-            }) }, this.chevron && this.chevronPosition === 'start' && (index.h("p-icon", { key: 'c838235c3411be17231b10e8fcca992f62d89afe', variant: 'caret', rotate: this.chevron === 'up' ? 180 : 0 })), this.icon &&
+            }), disabled: asBoolean.asBoolean(this.disabled), href: this.href, tabIndex: this.tabIndex, target: this.target, type: this.variant === 'text' ? undefined : this.type }, this.chevron && this.chevronPosition === 'start' && (index.h("p-icon", { key: 'c838235c3411be17231b10e8fcca992f62d89afe', rotate: this.chevron === 'up' ? 180 : 0, variant: 'caret' })), this.icon &&
             this.iconPosition === 'start' &&
             !(this.iconOnly && this.loading) &&
             this._getIcon(), this.label ?? index.h("slot", { key: '96401595325aecdfb14c77b5dce103a67d4d8da8' }), this.icon &&
             this.iconPosition === 'end' &&
             !this.loading &&
             !this.chevron &&
-            this._getIcon(), this.chevron && !this.loading && this.chevronPosition === 'end' && (index.h("p-icon", { key: 'b543d3ca7e0253c71e93d6736a1a99a69d156fe0', variant: 'caret', rotate: this.chevron === 'up' ? 180 : 0 })), this.loading && index.h("p-loader", { key: 'f655d54d167b02f7e546962f182e61b3cec77ccc', color: loaderColor }))));
+            this._getIcon(), this.chevron && !this.loading && this.chevronPosition === 'end' && (index.h("p-icon", { key: 'b543d3ca7e0253c71e93d6736a1a99a69d156fe0', rotate: this.chevron === 'up' ? 180 : 0, variant: 'caret' })), this.loading && index.h("p-loader", { key: 'f655d54d167b02f7e546962f182e61b3cec77ccc', color: loaderColor }))));
     }
     handleClick(ev) {
         if (this.loading || this.disabled) {
@@ -565,7 +565,7 @@ const Button = class {
                 active: asBoolean.asBoolean(this.active),
                 error: asBoolean.asBoolean(this.error),
                 iconOnly: asBoolean.asBoolean(this.iconOnly),
-            }), this.iconClass ?? ''), variant: this.icon, flip: this.iconFlip, rotate: this.iconRotate }));
+            }), this.iconClass ?? ''), flip: this.iconFlip, rotate: this.iconRotate, variant: this.icon }));
     }
 };
 Button.style = buttonComponentCss();
@@ -631,9 +631,9 @@ const Icon = class {
                 flip: this.flip,
                 size: hasTextSizeClass ? 'auto' : this.size,
                 transform: this.flip !== 'none' || this.rotate > 0 || this.rotate < 0,
-            }), style: {
+            }), innerHTML: svg, style: {
                 '--tw-rotate': `${this.rotate}deg`,
-            }, title: this.variant, innerHTML: svg }));
+            }, title: this.variant }));
     }
 };
 Icon.style = iconComponentCss();

package/dist/cjs/p-calendar.cjs.entry.js

@@ -228,7 +228,7 @@ const Calendar = class {
         const daysInMonth = this._generateDaysInMonth();
         return (index.h("div", { class: view({ view: 'day' }) }, this._getHeader('day'), index.h("div", { class: 'grid grid-cols-7 justify-between gap-1' }, this._weekDays.map(weekday => (index.h("span", { class: 'w-8 text-center text-xs text-storm-200' }, locale.dateFnsExports.format(locale.dateFnsExports.addDays(new Date(2022, 7, 1), weekday), state.state.locale === 'nl' ? 'EEEEEE' : 'eee', {
             locale: state.state.locale === 'nl' ? locale.localeExports.nl : locale.localeExports.enUS,
-        })))), daysInMonth.map(day => day.active ? (index.h("p-button", { variant: 'primary', tabIndex: -1, class: cn.cn('w-8', `col-start-${day.offset}`), onClick: () => this._setValue(day.date) }, day.day)) : (index.h("time", { class: cn.cn('normal flex items-center justify-center rounded-lg', 'h-8 w-8 text-sm font-semibold', 'text-storm-300', 'dark:bg-white/15', {
+        })))), daysInMonth.map(day => day.active ? (index.h("p-button", { class: cn.cn('w-8', `col-start-${day.offset}`), tabIndex: -1, variant: 'primary', onClick: () => this._setValue(day.date) }, day.day)) : (index.h("time", { class: cn.cn('normal flex items-center justify-center rounded-lg', 'h-8 w-8 text-sm font-semibold', 'text-storm-300', 'dark:bg-white/15', {
                 'cursor-pointer hover:bg-white-600 hover:text-storm-500 dark:text-white dark:hover:bg-hurricane-300 dark:hover:text-white': !day.disabled,
                 'dark:text-hurricane-200': day.disabled,
             }, `col-start-${day.offset}`, { 'cursor-not-allowed opacity-60': day.disabled }, {
@@ -237,13 +237,13 @@ const Calendar = class {
     }
     _getMonthView() {
         const months = this._generateMonths();
-        return (index.h("div", { class: view({ view: 'month' }) }, this._getHeader('month'), index.h("div", { class: 'flex flex-wrap items-start gap-2' }, months.map(month => (index.h("p-button", { variant: month.active ? 'primary' : 'secondary', tabIndex: -1, disabled: month.disabled, onClick: () => this._setMonth(month.month) }, locale.dateFnsExports.format(locale.dateFnsExports.setMonth(new Date(), month.month), 'MMMM', {
+        return (index.h("div", { class: view({ view: 'month' }) }, this._getHeader('month'), index.h("div", { class: 'flex flex-wrap items-start gap-2' }, months.map(month => (index.h("p-button", { disabled: month.disabled, tabIndex: -1, variant: month.active ? 'primary' : 'secondary', onClick: () => this._setMonth(month.month) }, locale.dateFnsExports.format(locale.dateFnsExports.setMonth(new Date(), month.month), 'MMMM', {
             locale: state.state.locale === 'nl' ? locale.localeExports.nl : locale.localeExports.enUS,
         })))))));
     }
     _getYearView() {
         const years = this._generateYears();
-        return (index.h("div", { class: view({ view: 'year' }) }, this._getHeader('year'), index.h("div", { class: 'grid h-full grid-cols-4 gap-2 overflow-scroll', ref: ref => (this._yearItemsRef = ref) }, years.map(year => (index.h("p-button", { class: 'w-full', variant: year.active ? 'primary' : 'secondary', tabIndex: -1, onClick: () => this._setYear(year.year), "data-active": year.active, "data-current": year.current }, year.year))))));
+        return (index.h("div", { class: view({ view: 'year' }) }, this._getHeader('year'), index.h("div", { class: 'grid h-full grid-cols-4 gap-2 overflow-scroll', ref: ref => (this._yearItemsRef = ref) }, years.map(year => (index.h("p-button", { class: 'w-full', "data-active": year.active, "data-current": year.current, tabIndex: -1, variant: year.active ? 'primary' : 'secondary', onClick: () => this._setYear(year.year) }, year.year))))));
     }
     _getHeader(type = 'day') {
         let nextFn = num => this._changeMonth(num);
@@ -252,11 +252,11 @@ const Calendar = class {
             nextFn = num => this._changeYear(num);
             nextType = 'year';
         }
-        return (index.h("div", { class: header({ type: this.mode }) }, this.mode !== 'year' && (index.h("p-button", { variant: 'secondary', iconOnly: true, icon: 'caret', iconRotate: 90, tabIndex: -1, size: 'sm', onClick: () => nextFn(-1), disabled: !this._canSetAmount(nextType, -1) || this._view === 'year' })), index.h("div", { class: cn.cn('flex gap-2', {
+        return (index.h("div", { class: header({ type: this.mode }) }, this.mode !== 'year' && (index.h("p-button", { disabled: !this._canSetAmount(nextType, -1) || this._view === 'year', icon: 'caret', iconRotate: 90, size: 'sm', tabIndex: -1, variant: 'secondary', iconOnly: true, onClick: () => nextFn(-1) })), index.h("div", { class: cn.cn('flex gap-2', {
                 'flex-1': this._enableToday,
-            }) }, this.mode !== 'year' && (index.h("p-button", { variant: 'secondary', size: 'sm', tabIndex: -1, onClick: () => this._changeView('month'), disabled: !this._canChangeView('month'), active: this._view === 'month' && this.mode !== 'month' }, locale.dateFnsExports.format(this._viewDate, 'MMMM', {
+            }) }, this.mode !== 'year' && (index.h("p-button", { active: this._view === 'month' && this.mode !== 'month', disabled: !this._canChangeView('month'), size: 'sm', tabIndex: -1, variant: 'secondary', onClick: () => this._changeView('month') }, locale.dateFnsExports.format(this._viewDate, 'MMMM', {
             locale: state.state.locale === 'nl' ? locale.localeExports.nl : locale.localeExports.enUS,
-        }))), index.h("p-button", { variant: 'secondary', size: 'sm', tabIndex: -1, onClick: () => this._changeView('year'), disabled: !this._canChangeView('year'), active: this._view === 'year' && this.mode !== 'year' }, locale.dateFnsExports.getYear(this._viewDate)), this._enableToday && (index.h("p-tooltip", { class: 'ml-auto', content: this.todayText }, index.h("p-button", { variant: 'secondary', size: 'sm', icon: 'calendar', slot: 'trigger', tabIndex: -1, iconOnly: true, onClick: () => this._setToday() })))), this.mode !== 'year' && (index.h("p-button", { variant: 'secondary', iconOnly: true, icon: 'caret', iconRotate: -90, tabIndex: -1, size: 'sm', onClick: () => nextFn(1), disabled: !this._canSetAmount(nextType, 1) || this._view == 'year' }))));
+        }))), index.h("p-button", { active: this._view === 'year' && this.mode !== 'year', disabled: !this._canChangeView('year'), size: 'sm', tabIndex: -1, variant: 'secondary', onClick: () => this._changeView('year') }, locale.dateFnsExports.getYear(this._viewDate)), this._enableToday && (index.h("p-tooltip", { class: 'ml-auto', content: this.todayText }, index.h("p-button", { icon: 'calendar', iconOnly: true, size: 'sm', slot: 'trigger', tabIndex: -1, variant: 'secondary', onClick: () => this._setToday() })))), this.mode !== 'year' && (index.h("p-button", { disabled: !this._canSetAmount(nextType, 1) || this._view == 'year', icon: 'caret', iconRotate: -90, size: 'sm', tabIndex: -1, variant: 'secondary', iconOnly: true, onClick: () => nextFn(1) }))));
     }
     _setYear(year) {
         const date = locale.dateFnsExports.setYear(this._viewDate, year);

package/dist/cjs/p-card-header.cjs.entry.js

@@ -59,7 +59,7 @@ const CardHeader = class {
                 variant: this.variant,
             }) }, index.h("div", { key: '3d56078ea79fdcb81461437dd3b8c66f712a5cef', class: content({
                 variant: this.variant,
-            }) }, this.icon ? (index.h("p-icon", { class: 'text-storm-300 dark:text-hurricane-200', variant: this.icon, flip: this.iconFlip, rotate: this.iconRotate })) : (index.h("slot", { name: 'prefix' })), index.h("div", { key: 'e22fd58249b94c1824bfa82cb367bf780a5b99b7', class: title() }, index.h("span", { key: '5de7e320dd84436f9de735f503cae3cbab37b1d7', class: 'max-w-full overflow-hidden text-ellipsis' }, this.header?.length ? this.header : index.h("slot", null)), index.h("slot", { key: 'eb9e59d3d09f5e7488128d2ddb33d40f3724252e', name: 'content-suffix' })), index.h("div", { key: '934928145118a42aeef1008317c88a503bd58fe8', class: 'ml-auto flex items-center justify-end gap-4 empty:hidden' }, index.h("slot", { key: '915ac41cb6bf6e56bde59d61b8a9601e2c402094', name: 'suffix' }))), this.variant === 'default' ? (asBoolean.asBoolean(this.divider) && (index.h("p-divider", { class: 'text-off-white-700 dark:text-white/15' }))) : (index.h("div", { class: 'pointer-events-none absolute left-0 top-0 z-[-1] h-full w-full overflow-hidden rounded-t-2xl' }, index.h("p-smile", { class: 'dark:text-hurricane-400', variant: 'card' }))))));
+            }) }, this.icon ? (index.h("p-icon", { class: 'text-storm-300 dark:text-hurricane-200', flip: this.iconFlip, rotate: this.iconRotate, variant: this.icon })) : (index.h("slot", { name: 'prefix' })), index.h("div", { key: 'e22fd58249b94c1824bfa82cb367bf780a5b99b7', class: title() }, index.h("span", { key: '5de7e320dd84436f9de735f503cae3cbab37b1d7', class: 'max-w-full overflow-hidden text-ellipsis' }, this.header?.length ? this.header : index.h("slot", null)), index.h("slot", { key: 'eb9e59d3d09f5e7488128d2ddb33d40f3724252e', name: 'content-suffix' })), index.h("div", { key: '934928145118a42aeef1008317c88a503bd58fe8', class: 'ml-auto flex items-center justify-end gap-4 empty:hidden' }, index.h("slot", { key: '915ac41cb6bf6e56bde59d61b8a9601e2c402094', name: 'suffix' }))), this.variant === 'default' ? (asBoolean.asBoolean(this.divider) && (index.h("p-divider", { class: 'text-off-white-700 dark:text-white/15' }))) : (index.h("div", { class: 'pointer-events-none absolute left-0 top-0 z-[-1] h-full w-full overflow-hidden rounded-t-2xl' }, index.h("p-smile", { class: 'dark:text-hurricane-400', variant: 'card' }))))));
     }
 };
 CardHeader.style = cardHeaderComponentCss();

package/dist/cjs/p-checkbox_3.cjs.entry.js

@@ -116,9 +116,9 @@ const Checkbox = class {
     }
     render() {
         const id = this.id?.length ? this.id : this._nonce;
-        return (index.h(themedHost_component.ThemedHost, { key: '03c9bf5aa440371b96bec78c7485c3e6269e3912' }, index.h("label", { key: '2b6622d4b6fa53b9b655408f6f5f309437ac0a51', htmlFor: id, class: 'group/p-checkbox flex items-center justify-start gap-2' }, index.h("div", { key: '0302b3c44cef3973eba59676a4fbafc8ffe7ec30', class: 'relative flex flex-shrink-0 items-center' }, index.h("input", { key: 'ce840a43c8406e09930e5b64d9c7953f2e6834d6', class: checkbox({
+        return (index.h(themedHost_component.ThemedHost, { key: '03c9bf5aa440371b96bec78c7485c3e6269e3912' }, index.h("label", { key: '2b6622d4b6fa53b9b655408f6f5f309437ac0a51', class: 'group/p-checkbox flex items-center justify-start gap-2', htmlFor: id }, index.h("div", { key: '0302b3c44cef3973eba59676a4fbafc8ffe7ec30', class: 'relative flex flex-shrink-0 items-center' }, index.h("input", { key: 'ce840a43c8406e09930e5b64d9c7953f2e6834d6', checked: asBoolean.asBoolean(this.checked), class: checkbox({
                 disabled: asBoolean.asBoolean(this.disabled),
-            }), type: 'checkbox', id: id, name: this.name, required: asBoolean.asBoolean(this.required), checked: asBoolean.asBoolean(this.checked), indeterminate: asBoolean.asBoolean(this.indeterminate), disabled: asBoolean.asBoolean(this.disabled), onChange: ev => this._onChange(ev) }), index.h("div", { key: '85129e843c23d91173f748031191e33f96c08491', class: iconContainer({
+            }), disabled: asBoolean.asBoolean(this.disabled), id: id, indeterminate: asBoolean.asBoolean(this.indeterminate), name: this.name, required: asBoolean.asBoolean(this.required), type: 'checkbox', onChange: ev => this._onChange(ev) }), index.h("div", { key: '85129e843c23d91173f748031191e33f96c08491', class: iconContainer({
                 disabled: asBoolean.asBoolean(this.disabled),
             }) }, index.h("p-icon", { key: 'c649d245d7184a33c235b65aaa2cc282cb5d3b56', class: icon({
                 disabled: asBoolean.asBoolean(this.disabled),
@@ -272,12 +272,12 @@ const Dropdown = class {
         this._checkItems();
     }
     render() {
-        return (index.h(index.Host, { key: 'a4b635c184cc8a58c74f1ba5dbb5f455df1a7b86', class: 'relative' }, index.h("div", { key: 'd0d1a3f05d117bb2b3a28022e8737fae2f25fcb3', class: 'trigger', onClick: () => this._triggerClickHandler() }, index.h("slot", { key: '5697825e61fb1c07139663c6c5ac400c48da998a', name: 'trigger' })), index.h("div", { key: '815b60a51d6b074e878eab047cac77cce5a3e337', class: 'relative w-full' }, index.h("p-dropdown-menu-container", { key: '60bf00e8beb6e42e7629b57283d317bfe0a2b40a', variant: this.variant, maxWidth: this.applyMaxWidth, fullWidth: this.applyFullWidth && !this.applyMaxWidth, allowOverflow: this.allowOverflow, scrollable: this.scrollable, class: cn.cn(dropdownContainerClass({
+        return (index.h(index.Host, { key: 'a4b635c184cc8a58c74f1ba5dbb5f455df1a7b86', class: 'relative' }, index.h("div", { key: 'd0d1a3f05d117bb2b3a28022e8737fae2f25fcb3', class: 'trigger', onClick: () => this._triggerClickHandler() }, index.h("slot", { key: '5697825e61fb1c07139663c6c5ac400c48da998a', name: 'trigger' })), index.h("div", { key: '815b60a51d6b074e878eab047cac77cce5a3e337', class: 'relative w-full' }, index.h("p-dropdown-menu-container", { key: '60bf00e8beb6e42e7629b57283d317bfe0a2b40a', allowOverflow: this.allowOverflow, class: cn.cn(dropdownContainerClass({
                 strategy: this.strategy,
                 maxWidth: this.applyMaxWidth,
                 fullWidth: this.applyFullWidth && !this.applyMaxWidth,
                 isDatepicker: this.isDatepicker,
-            }), this.containerClass), ref: el => this._load(el), onClick: () => this._containerClickHandler(), role: 'popover', "data-placement": this.placement, "data-strategy": this.strategy }, index.h("slot", { key: '34a4da54cb7e3949a494b028b6188b9655b294c2', name: 'items' })))));
+            }), this.containerClass), "data-placement": this.placement, "data-strategy": this.strategy, fullWidth: this.applyFullWidth && !this.applyMaxWidth, maxWidth: this.applyMaxWidth, ref: el => this._load(el), role: 'popover', scrollable: this.scrollable, variant: this.variant, onClick: () => this._containerClickHandler() }, index.h("slot", { key: '34a4da54cb7e3949a494b028b6188b9655b294c2', name: 'items' })))));
     }
     _checkButtons(active = false) {
         if (!this.applyChevron) {

package/dist/cjs/p-content-slider.cjs.entry.js

@@ -53,9 +53,9 @@ const ContentSlider = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '82853208f8862b3485a5a00b0c9c4f6986ea92ea', class: 'p-content-slider' }, index.h("div", { key: '3250c367ac25464a769c43d4093df28dbff8085d', class: `slider ${!this.disableDrag && 'draggable'} ${this._dragging && 'dragging'}`, style: {
+        return (index.h(index.Host, { key: '82853208f8862b3485a5a00b0c9c4f6986ea92ea', class: 'p-content-slider' }, index.h("div", { key: '3250c367ac25464a769c43d4093df28dbff8085d', class: `slider ${!this.disableDrag && 'draggable'} ${this._dragging && 'dragging'}`, ref: el => (this._sliderRef = el), style: {
                 height: `${this._outerHeight}px`,
-            }, ref: el => (this._sliderRef = el), onMouseDown: e => this._mouseDownHandler(e), onTouchStart: e => this._mouseDownHandler(e), onMouseMove: e => this._mouseMoveHandler(e), onTouchMove: e => this._mouseMoveHandler(e) }, index.h("div", { key: 'cb82eacdfc02898e9eeaff865b5e7fa7da69a2f9', class: 'inner-slider', ref: ref => this._setInnerSliderReft(ref), onTransitionEnd: () => this._transitionEndHandler() }, index.h("slot", { key: 'e6e5636ba8ed11665e0d623bcffb8a53bba03908', onSlotchange: () => this._slotChange() }))), index.h("div", { key: '9d596407cda3aaa5cbae5c0a0a19209623627edd', class: `indicator ${this.hideMobileIndicator && 'hidden'}` }, this._filteredItems.map((_, i) => (index.h("div", { onClick: () => this._scrollTo(i, true), class: `item ${!this.disableIndicatorClick && 'cursor-pointer'}` }, index.h("div", { class: cn.cn('block h-2 w-2 rounded-full', {
+            }, onMouseDown: e => this._mouseDownHandler(e), onMouseMove: e => this._mouseMoveHandler(e), onTouchMove: e => this._mouseMoveHandler(e), onTouchStart: e => this._mouseDownHandler(e) }, index.h("div", { key: 'cb82eacdfc02898e9eeaff865b5e7fa7da69a2f9', class: 'inner-slider', ref: ref => this._setInnerSliderReft(ref), onTransitionEnd: () => this._transitionEndHandler() }, index.h("slot", { key: 'e6e5636ba8ed11665e0d623bcffb8a53bba03908', onSlotchange: () => this._slotChange() }))), index.h("div", { key: '9d596407cda3aaa5cbae5c0a0a19209623627edd', class: `indicator ${this.hideMobileIndicator && 'hidden'}` }, this._filteredItems.map((_, i) => (index.h("div", { class: `item ${!this.disableIndicatorClick && 'cursor-pointer'}`, onClick: () => this._scrollTo(i, true) }, index.h("div", { class: cn.cn('block h-2 w-2 rounded-full', {
                 'bg-indigo-600': i === this._visibleIndex,
                 'bg-indigo-300': i !== this._visibleIndex,
             }) })))))));

package/dist/cjs/p-cropper.cjs.entry.js

@@ -2848,7 +2848,7 @@ const Cropper = class {
         const themeColor = state.state.theme === 'dark'
             ? 'rgba(70, 75, 84, 0.5)'
             : 'rgba(255, 255, 255, 0.5)';
-        return (index.h(themedHost_component.ThemedHost, { key: 'dd4ea15cbdfbac6e25202bd1a4871d9635fd33a7' }, this._loaded && (index.h("cropper-canvas", { key: 'cb359d80b35eae4aa2e58c75bed8ccd5a15b2df2', class: 'h-[17.5rem] w-full border-0 border-b border-solid border-off-white-700 bg-white dark:border-hurricane-200', onAction: () => this._onAction() }, index.h("cropper-image", { key: '8a96ad1f1f11adc4a8291a1376f329af52c3d920', src: this.value, alt: 'Picture', ref: ref => this._setImageRef(ref), scalable: true, translatable: true, crossorigin: 'anonymous' }), index.h("cropper-shade", { key: '1b375fe73b98ec31776ba4762e10781a1c33117b', class: 'aspect-branding rounded-full', "theme-color": themeColor, hidden: true }), index.h("cropper-selection", { key: 'ae41c83bf91f714beb89b79998c2636ffe837f51', "initial-coverage": '0.7', "aspect-ratio": '1', ref: ref => (this._selectionRef = ref) }), index.h("cropper-handle", { key: '45148a814f6b3d1f04e94c0a8ee756b31d6dc7cb', action: 'move', plain: true }))), index.h("p-range", { key: 'b215e5dfc3aea8cae98d85dc590436a52c667c28', class: 'w-full px-14 tablet:max-w-xs tablet:px-1', value: this._currentScale, onValueChange: ev => this._onInput(ev.detail) })));
+        return (index.h(themedHost_component.ThemedHost, { key: 'dd4ea15cbdfbac6e25202bd1a4871d9635fd33a7' }, this._loaded && (index.h("cropper-canvas", { key: 'cb359d80b35eae4aa2e58c75bed8ccd5a15b2df2', class: 'h-[17.5rem] w-full border-0 border-b border-solid border-off-white-700 bg-white dark:border-hurricane-200', onAction: () => this._onAction() }, index.h("cropper-image", { key: '8a96ad1f1f11adc4a8291a1376f329af52c3d920', alt: 'Picture', crossorigin: 'anonymous', ref: ref => this._setImageRef(ref), src: this.value, scalable: true, translatable: true }), index.h("cropper-shade", { key: '1b375fe73b98ec31776ba4762e10781a1c33117b', class: 'aspect-branding rounded-full', "theme-color": themeColor, hidden: true }), index.h("cropper-selection", { key: 'ae41c83bf91f714beb89b79998c2636ffe837f51', "aspect-ratio": '1', "initial-coverage": '0.7', ref: ref => (this._selectionRef = ref) }), index.h("cropper-handle", { key: '45148a814f6b3d1f04e94c0a8ee756b31d6dc7cb', action: 'move', plain: true }))), index.h("p-range", { key: 'b215e5dfc3aea8cae98d85dc590436a52c667c28', class: 'w-full px-14 tablet:max-w-xs tablet:px-1', value: this._currentScale, onValueChange: ev => this._onInput(ev.detail) })));
     }
     _setImageRef(ref) {
         if (this._imageRef || !ref) {

package/dist/cjs/p-datepicker.cjs.entry.js

@@ -221,16 +221,16 @@ const Datepicker = class {
         this.parseValue(this.value);
     }
     render() {
-        return (index.h("p-dropdown", { key: 'c65daeff45afabeefa654b8d033a40d9fda5b4e2', allowOverflow: true, strategy: this.strategy, placement: this.placement, disableTriggerClick: true, applyMaxWidth: false, applyFullWidth: false, insideClick: true, show: this._showDropdown, isDatepicker: true }, index.h("p-field", { key: '09aaa8a320e9a1852171aa59054a9b269667addb', slot: 'trigger', icon: this.hideIconWhenFilled && !!this._value ? null : 'calendar-multi', iconPosition: 'start', size: this.size, prefix: this.prefix, label: this.label, loading: this.loading, helper: this.helper, required: asBoolean.asBoolean(this.required), showOptional: asBoolean.asBoolean(this.showOptional), error: this.error, forceShowTooltip: !!this.error?.length && !this._showDropdown, autoShowError: false, disabled: asBoolean.asBoolean(this.disabled), focused: this._showDropdown, value: this._getFormattedDate(), placeholder: this.placeholder, onFocus: () => this._onFocus(), onBlur: (ev) => this._onBlur(ev), onValueChange: ev => this._onValueChange(ev.detail), onInputRefChange: ev => (this._inputRef = ev.detail) }), this.enableNativePicker && this._isMobileBrowser && (index.h("input", { key: 'f63ca80f15e52a5824a51e997f7b45664104a196', slot: 'trigger', type: this.mode === 'day' ? 'date' : 'month', class: 'pointer-events-none absolute left-0 top-0 z-[-10] overflow-hidden opacity-0', onInput: ev => this._onNativeInput(ev), ref: ref => (this._dateInputRef = ref), value: this._value &&
-                locale.dateFnsExports.format(this._value, 'yyyy-MM-dd', {
+        return (index.h("p-dropdown", { key: 'c65daeff45afabeefa654b8d033a40d9fda5b4e2', allowOverflow: true, applyFullWidth: false, applyMaxWidth: false, disableTriggerClick: true, insideClick: true, isDatepicker: true, placement: this.placement, show: this._showDropdown, strategy: this.strategy }, index.h("p-field", { key: '09aaa8a320e9a1852171aa59054a9b269667addb', autoShowError: false, disabled: asBoolean.asBoolean(this.disabled), error: this.error, focused: this._showDropdown, forceShowTooltip: !!this.error?.length && !this._showDropdown, helper: this.helper, icon: this.hideIconWhenFilled && !!this._value ? null : 'calendar-multi', iconPosition: 'start', label: this.label, loading: this.loading, placeholder: this.placeholder, prefix: this.prefix, required: asBoolean.asBoolean(this.required), showOptional: asBoolean.asBoolean(this.showOptional), size: this.size, slot: 'trigger', value: this._getFormattedDate(), onBlur: (ev) => this._onBlur(ev), onFocus: () => this._onFocus(), onInputRefChange: ev => (this._inputRef = ev.detail), onValueChange: ev => this._onValueChange(ev.detail) }), this.enableNativePicker && this._isMobileBrowser && (index.h("input", { key: 'f63ca80f15e52a5824a51e997f7b45664104a196', class: 'pointer-events-none absolute left-0 top-0 z-[-10] overflow-hidden opacity-0', max: this.maxDate &&
+                locale.dateFnsExports.format(new Date(this.maxDate), 'yyyy-MM-dd', {
                     locale: state.state.locale === 'nl' ? locale.localeExports.nl : locale.localeExports.enUS,
                 }), min: this._minDate &&
                 locale.dateFnsExports.format(new Date(this._minDate), 'yyyy-MM-dd', {
                     locale: state.state.locale === 'nl' ? locale.localeExports.nl : locale.localeExports.enUS,
-                }), max: this.maxDate &&
-                locale.dateFnsExports.format(new Date(this.maxDate), 'yyyy-MM-dd', {
+                }), ref: ref => (this._dateInputRef = ref), slot: 'trigger', type: this.mode === 'day' ? 'date' : 'month', value: this._value &&
+                locale.dateFnsExports.format(this._value, 'yyyy-MM-dd', {
                     locale: state.state.locale === 'nl' ? locale.localeExports.nl : locale.localeExports.enUS,
-                }) })), index.h("div", { key: 'f57a7045507cc0bf0bb2ae070258c0d4ed1af81f', tabIndex: -1, slot: 'items' }, index.h("p-calendar", { key: '469d4b2a4c2972a0bfb621d85a67fb3d8c3c3e83', variant: 'embedded', value: this._value, onValueChange: ({ detail }) => (this.value = detail), preselectToday: this.preselectToday, disabledDates: this.disabledDates, minDate: this.minDate, maxDate: this.maxDate, disableWeekends: this.disableWeekends, enableToday: this.enableToday, todayText: this.todayText, mode: this.mode }))));
+                }), onInput: ev => this._onNativeInput(ev) })), index.h("div", { key: 'f57a7045507cc0bf0bb2ae070258c0d4ed1af81f', slot: 'items', tabIndex: -1 }, index.h("p-calendar", { key: '469d4b2a4c2972a0bfb621d85a67fb3d8c3c3e83', disableWeekends: this.disableWeekends, disabledDates: this.disabledDates, enableToday: this.enableToday, maxDate: this.maxDate, minDate: this.minDate, mode: this.mode, preselectToday: this.preselectToday, todayText: this.todayText, value: this._value, variant: 'embedded', onValueChange: ({ detail }) => (this.value = detail) }))));
     }
     documentClickHandler({ target }) {
         if (!this._showDropdown || childOf.childOf(target, this._el)) {

package/dist/cjs/p-drawer-body_3.cjs.entry.js

@@ -77,7 +77,7 @@ const DrawerHeader = class {
      */
     close;
     render() {
-        return (index.h(themedHost_component.ThemedHost, { key: '22b70fd5ecc48cca0e7889bf5fa8167f6063b471' }, index.h("div", { key: 'b19d3cce208759e68446ade1baa02a95286aaf51', class: header() }, index.h("div", { key: 'b5a28ec7d297cb8d9c71ebfb5bf7f652434a438b', class: content() }, this.showClose && (index.h("p-button", { key: '9e1d4d71e3f1c4efd65d5639d388f72e628ec81c', variant: 'secondary', icon: 'negative', iconOnly: true, onClick: ev => this.close.emit(ev) })), index.h("div", { key: '6906eb28f9fd9f63b49921da0f3b49c20b9ab665', class: title() }, index.h("slot", { key: '62d673dae21712e3e2919618e518869172f82db2' })), this.showClose && index.h("div", { key: '451411cc086c5b6c366313d38bfb277cafebe138', class: 'size-8' })), index.h("p-smile", { key: 'd1d4ae0aa65e5d9d91819da89bbaf7598d145ca3', class: 'dark:text-hurricane-400' }))));
+        return (index.h(themedHost_component.ThemedHost, { key: '22b70fd5ecc48cca0e7889bf5fa8167f6063b471' }, index.h("div", { key: 'b19d3cce208759e68446ade1baa02a95286aaf51', class: header() }, index.h("div", { key: 'b5a28ec7d297cb8d9c71ebfb5bf7f652434a438b', class: content() }, this.showClose && (index.h("p-button", { key: '9e1d4d71e3f1c4efd65d5639d388f72e628ec81c', icon: 'negative', iconOnly: true, variant: 'secondary', onClick: ev => this.close.emit(ev) })), index.h("div", { key: '6906eb28f9fd9f63b49921da0f3b49c20b9ab665', class: title() }, index.h("slot", { key: '62d673dae21712e3e2919618e518869172f82db2' })), this.showClose && index.h("div", { key: '451411cc086c5b6c366313d38bfb277cafebe138', class: 'size-8' })), index.h("p-smile", { key: 'd1d4ae0aa65e5d9d91819da89bbaf7598d145ca3', class: 'dark:text-hurricane-400' }))));
     }
 };
 DrawerHeader.style = drawerHeaderComponentCss();

package/dist/cjs/p-drawer.cjs.entry.js

@@ -58,7 +58,7 @@ const Drawer = class {
         }
         const headerContent = index.h("slot", { name: 'header' });
         const bodyContent = index.h("slot", { name: 'content' });
-        return (index.h("p-backdrop", { variant: 'drawer', applyBlur: this.applyBlur, onClicked: ev => this._backdropClick(ev.detail), closing: this._closing, scrollLock: this.scrollLock }, index.h("p-drawer-container", { closing: this._closing }, (this.header?.length || this._hasHeaderSlot) && (index.h("p-drawer-header", { "show-close": this.showClose, onClose: ev => this.close(ev.detail, 'close') }, this._hasHeaderSlot ? headerContent : this.header)), index.h("p-drawer-body", null, bodyContent))));
+        return (index.h("p-backdrop", { applyBlur: this.applyBlur, closing: this._closing, scrollLock: this.scrollLock, variant: 'drawer', onClicked: ev => this._backdropClick(ev.detail) }, index.h("p-drawer-container", { closing: this._closing }, (this.header?.length || this._hasHeaderSlot) && (index.h("p-drawer-header", { "show-close": this.showClose, onClose: ev => this.close(ev.detail, 'close') }, this._hasHeaderSlot ? headerContent : this.header)), index.h("p-drawer-body", null, bodyContent))));
     }
     _backdropClick(ev) {
         if (!this.backdropClickClose) {

package/dist/cjs/p-empty-state_8.cjs.entry.js

@@ -148,7 +148,7 @@ const FloatingMenuContainer = class {
     render() {
         return (index.h(themedHost_component.ThemedHost, { key: 'b68d74e35de85f5b14b30d1c6649f4a2449c7b04' }, index.h("div", { key: '1cdae9d4705acc85650b593a8f200e8b6e791261', class: container$1({
                 enableAmountSelected: this.enableAmountSelected,
-            }) }, this.enableAmountSelected && (index.h(index.Fragment, { key: '4fb6df02b5af8b38ce42f6af67846f88de9ea47b' }, index.h("p", { key: 'faf5b2587318c74afaa210f845f5e171323bb56d', class: amountSelected() }, this.amountSelectedTemplate(this.amount)), index.h("p-divider", { key: '1c0ecb274c5ff16476be4422f3bc90f9b26e1a22', class: 'mx-0 h-4 text-storm-400', variant: 'vertical' }))), index.h("div", { key: 'ca40fbbbf5cb4b0293f06e9dcb75680474009cf5', class: 'flex items-center' }, this.usedInTable ? index.h("slot", { name: 'floating-menu-item' }) : index.h("slot", null), this.enableClose && (index.h("p-floating-menu-item", { key: 'c8716fd6671726b5afe2b9d045c65495ae22e01b', onClick: ev => this.close.emit(ev), icon: 'negative' }))))));
+            }) }, this.enableAmountSelected && (index.h(index.Fragment, { key: '4fb6df02b5af8b38ce42f6af67846f88de9ea47b' }, index.h("p", { key: 'faf5b2587318c74afaa210f845f5e171323bb56d', class: amountSelected() }, this.amountSelectedTemplate(this.amount)), index.h("p-divider", { key: '1c0ecb274c5ff16476be4422f3bc90f9b26e1a22', class: 'mx-0 h-4 text-storm-400', variant: 'vertical' }))), index.h("div", { key: 'ca40fbbbf5cb4b0293f06e9dcb75680474009cf5', class: 'flex items-center' }, this.usedInTable ? index.h("slot", { name: 'floating-menu-item' }) : index.h("slot", null), this.enableClose && (index.h("p-floating-menu-item", { key: 'c8716fd6671726b5afe2b9d045c65495ae22e01b', icon: 'negative', onClick: ev => this.close.emit(ev) }))))));
     }
     async _setLocales() {
         this._locales = await localization.getLocaleComponentStrings(this._el);
@@ -218,7 +218,7 @@ const TableCell = class {
     }
     _getContent() {
         if (this.variant === 'loading') {
-            return (index.h("p-loader", { variant: 'ghost', class: 'h-6 w-[calc(100%-1rem)] flex-1 rounded' }));
+            return (index.h("p-loader", { class: 'h-6 w-[calc(100%-1rem)] flex-1 rounded', variant: 'ghost' }));
         }
         const align = this.variant === 'header'
             ? (this.definition.headerAlign ?? this.definition.align)
@@ -360,7 +360,7 @@ const TableFooter = class {
                 hidden: this._hidden,
                 tableHeaderHasAction: this.tableHeaderHasAction,
             }) }, (this.enablePaginationPages || this.enablePaginationSize) &&
-            this.total > 0 && (index.h("p-pagination", { key: '9bbe8d8de8dce310f2799829469b6826642aa295', class: 'z-[2]', enablePaginationSize: this.enablePaginationSize, enablePaginationPages: this.enablePaginationPages, pageSize: this.pageSize, pageSizeOptions: this.pageSizeOptions, onPageSizeChange: ({ detail }) => this._changePageSize(detail), page: this.page, hideOnSinglePage: this.hideOnSinglePage, onPageChange: ({ detail }) => this.pageChange.emit(detail), total: this.total, onPagesChange: ({ detail }) => (this._hasPaginationPages = detail > 1) })))));
+            this.total > 0 && (index.h("p-pagination", { key: '9bbe8d8de8dce310f2799829469b6826642aa295', class: 'z-[2]', enablePaginationPages: this.enablePaginationPages, enablePaginationSize: this.enablePaginationSize, hideOnSinglePage: this.hideOnSinglePage, page: this.page, pageSize: this.pageSize, pageSizeOptions: this.pageSizeOptions, total: this.total, onPageChange: ({ detail }) => this.pageChange.emit(detail), onPageSizeChange: ({ detail }) => this._changePageSize(detail), onPagesChange: ({ detail }) => (this._hasPaginationPages = detail > 1) })))));
     }
     _changePageSize(s) {
         if (!s) {
@@ -9982,21 +9982,21 @@ const TableHeader = class {
         const mobileTotal = (this.selectedFiltersAmount || 0) + (activeQuickFilter?.default ? 0 : 1);
         const hasCustomFilterSlot = !!this._el.querySelector(':scope > [slot="custom-filter"]');
         const hasCustomActionsSlot = !!this._el.querySelector(':scope > [slot="custom-actions"]');
-        return (index.h(themedHost_component.ThemedHost, { key: 'dcf65ce62e7dc90f0c45e7748fd23872f21e7fad' }, index.h("div", { key: '3082ccae779f57c8812afc4b2400b20c87dd22a0', class: header() }, this.loading && (index.h("p-loader", { key: 'cbcf94e4afb27f7ee22b4adfbcadd9d72db2a189', variant: 'ghost', class: 'hidden h-8 w-3/4 rounded desktop-xs:flex' })), !this.loading &&
+        return (index.h(themedHost_component.ThemedHost, { key: 'dcf65ce62e7dc90f0c45e7748fd23872f21e7fad' }, index.h("div", { key: '3082ccae779f57c8812afc4b2400b20c87dd22a0', class: header() }, this.loading && (index.h("p-loader", { key: 'cbcf94e4afb27f7ee22b4adfbcadd9d72db2a189', class: 'hidden h-8 w-3/4 rounded desktop-xs:flex', variant: 'ghost' })), !this.loading &&
             (hasCustomFilterSlot || quickFilters.length > 0) && (index.h("div", { key: '04c40b4406a49b0faf09c1e72ffe0d3b64e54548', class: 'flex flex-col justify-start gap-4 justify-self-start desktop-xs:flex-row' }, hasCustomFilterSlot && index.h("slot", { key: '409423868e33814d87381c29d41cfede57deead0', name: 'custom-filter' }), quickFilters.length > 0 && (index.h("p-segment-container", { key: '51c257a5ad8c65e84dac192b86c2cb291435884e', class: 'hidden desktop-xs:flex' }, quickFilters.map(item => (index.h("p-segment-item", { active: item.identifier === this.activeQuickFilterIdentifier, onClick: () => this.quickFilter.emit(item) }, typeof item.text === 'string'
             ? item.text
-            : item.text(), ' ', item?.count >= 0 ? `(${item.count})` : ''))))))), index.h("div", { key: '6f8295a5c359b799f2f03d82e65d4f9e4acb5109', class: 'flex flex-col justify-end gap-2 desktop-xs:ml-auto desktop-xs:flex-row desktop-xs:items-center' }, this.enableSearch && (index.h("p-field", { key: 'e52e1dbe939f318c711e0f5ae25e8c667f6fcf31', icon: 'search', class: 'desktop-xs:max-w-60', placeholder: 'Zoeken...', value: this.query, onValueChange: ev => this._queryObserver.next(ev.detail) })), index.h("div", { key: 'b914ffa439de0484c5528fa9c02b4a32dc853c27', class: 'flex items-center gap-2' }, this.enableFilter && (index.h("p-button", { key: '5ea25448415e1b54883dc86059192b065cb23093', icon: 'filter', variant: 'secondary', class: `w-full ${this.enableFilterDesktop
+            : item.text(), ' ', item?.count >= 0 ? `(${item.count})` : ''))))))), index.h("div", { key: '6f8295a5c359b799f2f03d82e65d4f9e4acb5109', class: 'flex flex-col justify-end gap-2 desktop-xs:ml-auto desktop-xs:flex-row desktop-xs:items-center' }, this.enableSearch && (index.h("p-field", { key: 'e52e1dbe939f318c711e0f5ae25e8c667f6fcf31', class: 'desktop-xs:max-w-60', icon: 'search', placeholder: 'Zoeken...', value: this.query, onValueChange: ev => this._queryObserver.next(ev.detail) })), index.h("div", { key: 'b914ffa439de0484c5528fa9c02b4a32dc853c27', class: 'flex items-center gap-2' }, this.enableFilter && (index.h("p-button", { key: '5ea25448415e1b54883dc86059192b065cb23093', class: `w-full ${this.enableFilterDesktop
                 ? 'desktop-xs:w-auto'
-                : 'desktop-xs:hidden'}`, onOnClick: () => this.filter.emit() }, this.filterButtonTemplate
+                : 'desktop-xs:hidden'}`, icon: 'filter', variant: 'secondary', onOnClick: () => this.filter.emit() }, this.filterButtonTemplate
             ? this.filterButtonTemplate()
             : this._defaultFilterButtonTemplate(), this.selectedFiltersAmount &&
-            this._getLabel(this.selectedFiltersAmount), mobileTotal > 0 && this._getLabel(mobileTotal, 'mobile'))), !this.loading && this.enableExport && this.enableFilter && (index.h("p-divider", { key: '38dc1a4aa1902f41b4b3e3cb85da7d442fc98fd0', variant: 'vertical', class: 'hidden h-4 tablet:flex dark:text-white/15' })), !this.loading && this.enableExport && (index.h("p-button", { key: 'f8180ecb38e763dc2cf045c3c8e33ed276d591ab', variant: 'secondary', icon: 'upload', class: 'desktop-xs:auto w-full', onOnClick: () => this.export.emit() }, localization.formatTranslation(this._locales.export)))), this.enableAction && this._buttonTemplate(), hasCustomActionsSlot && index.h("slot", { key: '24b7bee12f89bb16e4e4d690ee03564fcd106638', name: 'custom-actions' })), this.enableAction && this.canUseAction && (index.h("div", { key: '6c3739a262107b564f6418a605ba6e16943c2c36', class: 'fixed bottom-0 left-0 z-[2] block w-full border border-solid border-transparent bg-white p-4 desktop-xs:hidden dark:border-t-hurricane-400 dark:bg-hurricane-500' }, this._buttonTemplate(true))))));
+            this._getLabel(this.selectedFiltersAmount), mobileTotal > 0 && this._getLabel(mobileTotal, 'mobile'))), !this.loading && this.enableExport && this.enableFilter && (index.h("p-divider", { key: '38dc1a4aa1902f41b4b3e3cb85da7d442fc98fd0', class: 'hidden h-4 tablet:flex dark:text-white/15', variant: 'vertical' })), !this.loading && this.enableExport && (index.h("p-button", { key: 'f8180ecb38e763dc2cf045c3c8e33ed276d591ab', class: 'desktop-xs:auto w-full', icon: 'upload', variant: 'secondary', onOnClick: () => this.export.emit() }, localization.formatTranslation(this._locales.export)))), this.enableAction && this._buttonTemplate(), hasCustomActionsSlot && index.h("slot", { key: '24b7bee12f89bb16e4e4d690ee03564fcd106638', name: 'custom-actions' })), this.enableAction && this.canUseAction && (index.h("div", { key: '6c3739a262107b564f6418a605ba6e16943c2c36', class: 'fixed bottom-0 left-0 z-[2] block w-full border border-solid border-transparent bg-white p-4 desktop-xs:hidden dark:border-t-hurricane-400 dark:bg-hurricane-500' }, this._buttonTemplate(true))))));
     }
     async _setLocales() {
         this._locales = await localization.getLocaleComponentStrings(this._el);
     }
     _buttonTemplate(mobile = false) {
-        return (index.h("p-button", { class: mobile ? 'w-full' : 'hidden desktop-xs:flex', icon: this.actionIcon, disabled: !this.canUseAction, onOnClick: () => this.action.emit(), loading: this.actionLoading }, this.actionButtonTemplate
+        return (index.h("p-button", { class: mobile ? 'w-full' : 'hidden desktop-xs:flex', disabled: !this.canUseAction, icon: this.actionIcon, loading: this.actionLoading, onOnClick: () => this.action.emit() }, this.actionButtonTemplate
             ? this.actionButtonTemplate(mobile ? this.itemsSelectedAmount : 0)
             : this._defaultActionButtonTemplate(mobile ? this.itemsSelectedAmount : 0)));
     }

package/dist/cjs/p-field_3.cjs.entry.js

@@ -348,17 +348,17 @@ const Field = class {
     }
     render() {
         const { id, prefix, suffix, hasHeaderSlot, hasLabelSlot, hasHelperSlot, hasErrorSlot, hasValueSlot, } = this._getSlotInfo();
-        return (index.h(themedHost_component.ThemedHost, { key: '09b8254690a1603271faac4d9653c90a582a4766' }, index.h("p-field-container", { key: '776ed3812a980004c1cdc1b6c5b79df5908b383e', forceShowTooltip: (!!this.error?.length && !this._focused && this.autoShowError) ||
-                (!!this.error?.length && this.forceShowTooltip), id: id, label: this.label, align: this.align, loading: this.loading, loadingSize: this.size, helper: this.helper, error: this.error, required: this.required, showOptional: this.showOptional, variant: this.variant }, hasLabelSlot && (index.h("slot", { key: '597e07f1227421eb34575f2c35a5f752f60a66a3', name: 'label', slot: 'label' })), hasHeaderSlot && (index.h("slot", { key: '0ec1fd3a079f51c605b593e90d8514119ae0ffa3', name: 'header', slot: 'header' })), hasHelperSlot && (index.h("slot", { key: 'c71b52f8f6f8fc374e9d7e0c2ed4f838c9f9cb86', name: 'helper', slot: 'helper' })), hasErrorSlot && (index.h("slot", { key: 'd62e1c5f5592540dacbb2e18cf5cc560efbbc5a4', name: 'error', slot: 'error' })), index.h("div", { key: '7d30604708a80bd509b5d739e46d82b5fa23b464', class: field({
+        return (index.h(themedHost_component.ThemedHost, { key: '09b8254690a1603271faac4d9653c90a582a4766' }, index.h("p-field-container", { key: '776ed3812a980004c1cdc1b6c5b79df5908b383e', align: this.align, error: this.error, forceShowTooltip: (!!this.error?.length && !this._focused && this.autoShowError) ||
+                (!!this.error?.length && this.forceShowTooltip), helper: this.helper, id: id, label: this.label, loading: this.loading, loadingSize: this.size, required: this.required, showOptional: this.showOptional, variant: this.variant }, hasLabelSlot && (index.h("slot", { key: '597e07f1227421eb34575f2c35a5f752f60a66a3', name: 'label', slot: 'label' })), hasHeaderSlot && (index.h("slot", { key: '0ec1fd3a079f51c605b593e90d8514119ae0ffa3', name: 'header', slot: 'header' })), hasHelperSlot && (index.h("slot", { key: 'c71b52f8f6f8fc374e9d7e0c2ed4f838c9f9cb86', name: 'helper', slot: 'helper' })), hasErrorSlot && (index.h("slot", { key: 'd62e1c5f5592540dacbb2e18cf5cc560efbbc5a4', name: 'error', slot: 'error' })), index.h("div", { key: '7d30604708a80bd509b5d739e46d82b5fa23b464', class: field({
                 error: !!this.error?.length,
                 disabled: asBoolean.asBoolean(this.disabled),
                 focused: asBoolean.asBoolean(this.focused) || this._focused,
                 size: this.size,
                 variant: this.variant,
                 isTextarea: this.type === 'textarea',
-            }), title: this.variant === 'read' && !hasValueSlot
+            }), slot: 'content', title: this.variant === 'read' && !hasValueSlot
                 ? `${this.value}`
-                : undefined, slot: 'content' }, (this.error?.length ||
+                : undefined }, (this.error?.length ||
             prefix ||
             (this.icon && this.iconPosition === 'start')) && (index.h("div", { key: 'b4b203ba8f20620b2d7f368d2c6367bdadea9878', class: prefixAndSuffix({
                 variant: this.variant,
@@ -370,7 +370,7 @@ const Field = class {
             }), onClick: () => this._focusInput() }, (this.icon && this.iconPosition === 'start') ||
             this.error?.length ? (index.h("p-icon", { class: cn.cn('flex', {
                 'mt-1': this.variant === 'read' && this.size === 'base',
-            }), variant: this.error?.length ? 'warning' : this.icon, rotate: this.iconRotate, flip: this.iconFlip })) : (prefix))), this._getContent(hasValueSlot, id), (suffix || (this.icon && this.iconPosition === 'end')) && (index.h("div", { key: '5fe27dcdc61d7ba5646ecd6e062ad51f808dc4dd', class: prefixAndSuffix({
+            }), flip: this.iconFlip, rotate: this.iconRotate, variant: this.error?.length ? 'warning' : this.icon })) : (prefix))), this._getContent(hasValueSlot, id), (suffix || (this.icon && this.iconPosition === 'end')) && (index.h("div", { key: '5fe27dcdc61d7ba5646ecd6e062ad51f808dc4dd', class: prefixAndSuffix({
                 variant: this.variant,
                 error: !!this.error?.length,
                 disabled: asBoolean.asBoolean(this.disabled),
@@ -379,7 +379,7 @@ const Field = class {
                 isTextarea: this.type === 'textarea',
             }), onClick: () => this._focusInput() }, this.icon && this.iconPosition === 'end' ? (index.h("p-icon", { class: cn.cn('flex', {
                 'mt-1': this.variant === 'read' && this.size === 'base',
-            }), variant: this.icon, rotate: this.iconRotate, flip: this.iconFlip })) : (suffix)))))));
+            }), flip: this.iconFlip, rotate: this.iconRotate, variant: this.icon })) : (suffix)))))));
     }
     watchvalue(value) {
         if (!this._inputRef) {
@@ -454,7 +454,7 @@ const Field = class {
     }
     _getContent(hasValueSlot = false, id) {
         if (this.variant === 'read') {
-            return hasValueSlot ? (index.h("slot", { name: 'value' })) : !!this.value && `${this.value}`.length > 0 ? (this.value) : this.showAddOnEmpty ? (index.h("p-button", { variant: 'text', icon: 'plus', size: 'sm', onClick: () => this.add.emit() }, this.addText)) : ('—');
+            return hasValueSlot ? (index.h("slot", { name: 'value' })) : !!this.value && `${this.value}`.length > 0 ? (this.value) : this.showAddOnEmpty ? (index.h("p-button", { icon: 'plus', size: 'sm', variant: 'text', onClick: () => this.add.emit() }, this.addText)) : ('—');
         }
         if (this.type === 'slot') {
             return index.h("slot", { name: 'input' });
@@ -478,7 +478,7 @@ const Field = class {
         if (this.type === 'textarea') {
             return (index.h("textarea", { ref: ref => this._setInputRef(ref), ...props, ...properties }));
         }
-        return (index.h("input", { type: this.type, ref: ref => this._setInputRef(ref), ...props, ...properties }));
+        return (index.h("input", { ref: ref => this._setInputRef(ref), type: this.type, ...props, ...properties }));
     }
     _setInputRef(ref) {
         this._inputRef = ref;
@@ -631,13 +631,13 @@ const FieldContainer = class {
     }
     render() {
         const { hasHeaderSlot, hasErrorSlot, helper, label, errorAndErrorIsNotBoolean, } = this._getSlotInfo();
-        let contentSlot = (index.h("slot", { key: 'e795f4695850003f41a5bfb815893affee00e8de', slot: 'trigger', name: 'content' }));
+        let contentSlot = (index.h("slot", { key: 'e795f4695850003f41a5bfb815893affee00e8de', name: 'content', slot: 'trigger' }));
         if (this.loading) {
-            contentSlot = (index.h("p-loader", { key: '1f65c3ca60cefbf0740c9d7235a18a3e69f1c788', variant: 'ghost', class: loader({ variant: this.variant, size: this.loadingSize }), slot: 'trigger' }));
+            contentSlot = (index.h("p-loader", { key: '1f65c3ca60cefbf0740c9d7235a18a3e69f1c788', class: loader({ variant: this.variant, size: this.loadingSize }), slot: 'trigger', variant: 'ghost' }));
         }
-        return (index.h(themedHost_component.ThemedHost, { key: '9b4ab7a1d59cead07a2065b0d6bc72be41d24287' }, index.h("label", { key: 'ac31d16bdd75b4b236479638efd367f4771627d1', htmlFor: this.id, class: cn.cn('flex w-inherit flex-col gap-1', {
+        return (index.h(themedHost_component.ThemedHost, { key: '9b4ab7a1d59cead07a2065b0d6bc72be41d24287' }, index.h("label", { key: 'ac31d16bdd75b4b236479638efd367f4771627d1', class: cn.cn('flex w-inherit flex-col gap-1', {
                 'cursor-auto': this.variant === 'read',
-            }) }, index.h("div", { key: '06a0c419582c71df7323bc3b0deb2d8a98541ca7', class: cn.cn('flex items-end justify-between gap-1 empty:hidden', {
+            }), htmlFor: this.id }, index.h("div", { key: '06a0c419582c71df7323bc3b0deb2d8a98541ca7', class: cn.cn('flex items-end justify-between gap-1 empty:hidden', {
                 'flex-row-reverse': this.align === 'end',
             }) }, (!!label?.length || !!helper?.length) && (index.h("div", { key: '97d2b33bb04145650b000dde1859015361855fa3', class: 'flex min-w-0 gap-2', onClick: () => this.focus.emit() }, index.h("span", { key: '4a2fc2b62dba4fc7d4a5f816944996333cff2ca3', class: 'min-w-0 overflow-hidden text-ellipsis text-xs font-medium text-storm-300 dark:text-hurricane-200' }, label), helper && (index.h("p-helper", { key: '1638bb0c6c3683bd2bd0836b9f4fd0ca07561baf', class: 'flex flex-shrink-0', placement: 'top' }, helper)))), ((!asBoolean.asBoolean(this.required) && asBoolean.asBoolean(this.showOptional)) ||
             hasHeaderSlot) && (index.h("div", { key: '4f9f56fc0951dab62bd75c4cc7ea724e17ec05aa', class: 'flex items-center gap-1' }, !asBoolean.asBoolean(this.required) &&
@@ -647,8 +647,8 @@ const FieldContainer = class {
                 'ml-auto': this.align === 'end',
                 'font-normal': this.variant === 'read',
                 'text-storm-500 dark:text-white': this.variant === 'read',
-            }), variant: 'error', content: this.error, show: errorAndErrorIsNotBoolean &&
-                asBoolean.asBoolean(this.forceShowTooltip, false), enableUserInput: false, placement: this.errorPlacement }, hasErrorSlot && (index.h("slot", { key: '3670780d5e0907d655e282fbea6c43dcceea7e00', name: 'error', slot: 'content' })), contentSlot))));
+            }), content: this.error, enableUserInput: false, placement: this.errorPlacement, show: errorAndErrorIsNotBoolean &&
+                asBoolean.asBoolean(this.forceShowTooltip, false), variant: 'error' }, hasErrorSlot && (index.h("slot", { key: '3670780d5e0907d655e282fbea6c43dcceea7e00', name: 'error', slot: 'content' })), contentSlot))));
     }
     async _setLocales() {
         this._locales = await localization.getLocaleComponentStrings(this._el);
@@ -690,7 +690,7 @@ const Helper = class {
      */
     placement = 'top';
     render() {
-        return (index.h(themedHost_component.ThemedHost, { key: 'd7f07b4f232bb43ce0988ea8533353a8d193e7bf' }, index.h("p-tooltip", { key: 'df76c8696c9621a6ea5431c5d256eded55de0b57', class: 'flex', placement: this.placement, strategy: this.strategy }, index.h("p-icon", { key: 'e7c4d59174ec46413381af510485a890fcab91f8', size: 'sm', class: 'cursor-pointer text-storm-300 hover:text-storm-500 dark:text-hurricane-300 dark:hover:text-hurricane-200', variant: 'question-circle', slot: 'trigger' }), index.h("div", { key: '1173d658220d127af6982fb2939f7493a84cf52d', slot: 'content' }, index.h("slot", { key: '53d7d9c9c9c919ba312dc57f92d68fdc5f6b385c' })))));
+        return (index.h(themedHost_component.ThemedHost, { key: 'd7f07b4f232bb43ce0988ea8533353a8d193e7bf' }, index.h("p-tooltip", { key: 'df76c8696c9621a6ea5431c5d256eded55de0b57', class: 'flex', placement: this.placement, strategy: this.strategy }, index.h("p-icon", { key: 'e7c4d59174ec46413381af510485a890fcab91f8', class: 'cursor-pointer text-storm-300 hover:text-storm-500 dark:text-hurricane-300 dark:hover:text-hurricane-200', size: 'sm', slot: 'trigger', variant: 'question-circle' }), index.h("div", { key: '1173d658220d127af6982fb2939f7493a84cf52d', slot: 'content' }, index.h("slot", { key: '53d7d9c9c9c919ba312dc57f92d68fdc5f6b385c' })))));
     }
 };
 Helper.style = helperComponentCss();

package/dist/cjs/p-floating-menu-item.cjs.entry.js

@@ -106,7 +106,7 @@ const FloatingMenuItem = class {
         return (index.h("p-icon", { class: icon({
                 hover: asBoolean.asBoolean(this.hover),
                 disabled: asBoolean.asBoolean(this.disabled),
-            }), variant: this.icon, flip: this.iconFlip, rotate: this.iconRotate }));
+            }), flip: this.iconFlip, rotate: this.iconRotate, variant: this.icon }));
     }
 };
 FloatingMenuItem.style = floatingMenuItemComponentCss();

package/dist/cjs/p-label.cjs.entry.js

@@ -83,7 +83,7 @@ const Label = class {
                 variant: this.variant,
                 iconOnly: this.iconOnly,
                 keepMobileContent: this.keepMobileContent,
-            }) }, this.icon && (index.h("p-icon", { key: '24ec81f74dfeea24990a76edac38ccdc79490e88', class: 'flex-shrink-0', variant: this.icon, flip: this.iconFlip, rotate: this.iconRotate })), !this.iconOnly && (index.h("div", { key: 'd0b89fc24b7304a8e61e5157bcf4bdae3bdb26ca', class: cn.cn('flex-1 overflow-hidden text-ellipsis whitespace-nowrap text-sm font-medium', {
+            }) }, this.icon && (index.h("p-icon", { key: '24ec81f74dfeea24990a76edac38ccdc79490e88', class: 'flex-shrink-0', flip: this.iconFlip, rotate: this.iconRotate, variant: this.icon })), !this.iconOnly && (index.h("div", { key: 'd0b89fc24b7304a8e61e5157bcf4bdae3bdb26ca', class: cn.cn('flex-1 overflow-hidden text-ellipsis whitespace-nowrap text-sm font-medium', {
                 hidden: !this.keepMobileContent,
                 'desktop-xs:block': !this.keepMobileContent,
             }) }, index.h("slot", { key: 'ad87aa170cc6f7980678a1cfc25f5dbdf510127e' }))))));

package/dist/cjs/p-modal-body_4.cjs.entry.js

@@ -126,7 +126,7 @@ const ModalHeader = class {
      */
     close;
     render() {
-        return (index.h(themedHost_component.ThemedHost, { key: '61310ca15062863fa75788e8621c845829835a83' }, index.h("div", { key: '45d347c0906fb178470a22ee073f78d2c83a625d', class: header() }, index.h("div", { key: 'cd7903f26712a92149166a9016f397701c216ee3', class: content() }, index.h("div", { key: 'e1aa409159b2c19f97682ba5de0ebcdbca799e7a', class: title() }, index.h("slot", { key: '605016d68fa57dde900543c0cee048f078613fa7' })), this.showClose && (index.h("p-button", { key: '885ebd89b2f63609e658debad4137df0dfb03b8c', variant: 'secondary', icon: 'negative', iconOnly: true, onClick: ev => this.close.emit(ev) }))), index.h("p-smile", { key: 'f461107c6a15c7c58e5944b0b19e54ff0ce88305', class: 'dark:text-hurricane-400' }))));
+        return (index.h(themedHost_component.ThemedHost, { key: '61310ca15062863fa75788e8621c845829835a83' }, index.h("div", { key: '45d347c0906fb178470a22ee073f78d2c83a625d', class: header() }, index.h("div", { key: 'cd7903f26712a92149166a9016f397701c216ee3', class: content() }, index.h("div", { key: 'e1aa409159b2c19f97682ba5de0ebcdbca799e7a', class: title() }, index.h("slot", { key: '605016d68fa57dde900543c0cee048f078613fa7' })), this.showClose && (index.h("p-button", { key: '885ebd89b2f63609e658debad4137df0dfb03b8c', icon: 'negative', iconOnly: true, variant: 'secondary', onClick: ev => this.close.emit(ev) }))), index.h("p-smile", { key: 'f461107c6a15c7c58e5944b0b19e54ff0ce88305', class: 'dark:text-hurricane-400' }))));
     }
 };
 ModalHeader.style = modalHeaderComponentCss();

package/dist/cjs/p-modal.cjs.entry.js

@@ -63,7 +63,7 @@ const Modal = class {
         const headerContent = index.h("slot", { name: 'header' });
         const bodyContent = index.h("slot", { name: 'content' });
         const footerContent = index.h("slot", { name: 'footer' });
-        return (index.h("p-backdrop", { applyBlur: this.applyBlur, onClicked: ev => this._backdropClick(ev.detail), closing: this._closing, scrollLock: this.scrollLock }, index.h("p-modal-container", { size: this.size, closing: this._closing }, (this.header?.length || this._hasHeaderSlot) && (index.h("p-modal-header", { showClose: this.showClose, onClose: ev => this.close('button', ev.detail) }, this._hasHeaderSlot ? headerContent : this.header)), index.h("p-modal-body", { roundedBottom: !this._hasFooterSlot, roundedTop: !this._hasHeaderSlot && !this.header?.length }, bodyContent), this._hasFooterSlot && (index.h("p-modal-footer", null, footerContent)))));
+        return (index.h("p-backdrop", { applyBlur: this.applyBlur, closing: this._closing, scrollLock: this.scrollLock, onClicked: ev => this._backdropClick(ev.detail) }, index.h("p-modal-container", { closing: this._closing, size: this.size }, (this.header?.length || this._hasHeaderSlot) && (index.h("p-modal-header", { showClose: this.showClose, onClose: ev => this.close('button', ev.detail) }, this._hasHeaderSlot ? headerContent : this.header)), index.h("p-modal-body", { roundedBottom: !this._hasFooterSlot, roundedTop: !this._hasHeaderSlot && !this.header?.length }, bodyContent), this._hasFooterSlot && (index.h("p-modal-footer", null, footerContent)))));
     }
     _backdropClick(ev) {
         if (!this.backdropClickClose) {

package/dist/cjs/p-navbar.cjs.entry.js

@@ -54,7 +54,7 @@ const Navbar = class {
     }
     _show = false;
     render() {
-        return (index.h(themedHost_component.ThemedHost, { key: 'ee599d3472ef0a332d17353d8e7f559e36d5529b' }, index.h("p-backdrop", { key: 'aa5b71247881e2a23998bab23f194ff6f58a6662', class: backdrop({ show: this._show }), scrollLock: this._show, onClicked: () => (this._show = false) }), index.h("div", { key: '121da670f6b7dbbfbce4a018c56b56ac1352c212', class: sidebar({ class: sidebarAndTopbar(), show: this._show }) }, index.h("div", { key: 'e789b6c904b4715c271e03324d8e8643acd5d8a8', class: 'flex w-full items-center justify-end layout-1280:hidden' }, index.h("p-button", { key: '9d6f49157fc731f91ff34bc7e37aebe40c5d0612', variant: 'secondary', icon: 'menu-arrow', iconFlip: 'horizontal', iconOnly: true, onClick: () => (this._show = false) })), index.h("div", { key: 'c88909335eed7df5a93b32a65d24b1a8ff2a3f19', class: 'flex w-full flex-shrink-0 flex-col items-stretch' }, index.h("slot", { key: 'e09b2eaefb99e51502f3629c377728d298b0e8d9', name: 'company' })), index.h("div", { key: '2ce82f037a53e8529d834958812d74f3cdd25ef2', class: 'flex w-full flex-1 flex-col gap-6 overflow-y-auto' }, index.h("slot", { key: 'eaf615dd6f9d5b8fb260fe5a10c43b1e0b6f52c0', name: 'content' })), index.h("div", { key: '9b8bedc34ab2bcbe8935426007b6fd8c2d33c177', class: 'mt-auto hidden w-full flex-shrink-0 flex-col layout-1280:flex' }, index.h("slot", { key: '7a4889a2554cad25f9e8be122863fb5c2783376d', name: 'user' }))), index.h("div", { key: 'e9d88767781757f7fc81c772fbe750a15a03fa6c', class: topbar({ class: sidebarAndTopbar() }) }, index.h("p-button", { key: '3517c55339958c4461f20b190c220358658a71cf', variant: 'secondary', iconOnly: true, icon: 'menu-arrow', onClick: () => (this._show = true) }), index.h("slot", { key: 'b89f63dfbeba643e3f46f72e6862944ba75f1213', name: 'topbar' }))));
+        return (index.h(themedHost_component.ThemedHost, { key: 'ee599d3472ef0a332d17353d8e7f559e36d5529b' }, index.h("p-backdrop", { key: 'aa5b71247881e2a23998bab23f194ff6f58a6662', class: backdrop({ show: this._show }), scrollLock: this._show, onClicked: () => (this._show = false) }), index.h("div", { key: '121da670f6b7dbbfbce4a018c56b56ac1352c212', class: sidebar({ class: sidebarAndTopbar(), show: this._show }) }, index.h("div", { key: 'e789b6c904b4715c271e03324d8e8643acd5d8a8', class: 'flex w-full items-center justify-end layout-1280:hidden' }, index.h("p-button", { key: '9d6f49157fc731f91ff34bc7e37aebe40c5d0612', icon: 'menu-arrow', iconFlip: 'horizontal', iconOnly: true, variant: 'secondary', onClick: () => (this._show = false) })), index.h("div", { key: 'c88909335eed7df5a93b32a65d24b1a8ff2a3f19', class: 'flex w-full flex-shrink-0 flex-col items-stretch' }, index.h("slot", { key: 'e09b2eaefb99e51502f3629c377728d298b0e8d9', name: 'company' })), index.h("div", { key: '2ce82f037a53e8529d834958812d74f3cdd25ef2', class: 'flex w-full flex-1 flex-col gap-6 overflow-y-auto' }, index.h("slot", { key: 'eaf615dd6f9d5b8fb260fe5a10c43b1e0b6f52c0', name: 'content' })), index.h("div", { key: '9b8bedc34ab2bcbe8935426007b6fd8c2d33c177', class: 'mt-auto hidden w-full flex-shrink-0 flex-col layout-1280:flex' }, index.h("slot", { key: '7a4889a2554cad25f9e8be122863fb5c2783376d', name: 'user' }))), index.h("div", { key: 'e9d88767781757f7fc81c772fbe750a15a03fa6c', class: topbar({ class: sidebarAndTopbar() }) }, index.h("p-button", { key: '3517c55339958c4461f20b190c220358658a71cf', icon: 'menu-arrow', iconOnly: true, variant: 'secondary', onClick: () => (this._show = true) }), index.h("slot", { key: 'b89f63dfbeba643e3f46f72e6862944ba75f1213', name: 'topbar' }))));
     }
     handleCloseNavbar() {
         this._show = false;

package/dist/cjs/p-pagination_3.cjs.entry.js

@@ -83,7 +83,7 @@ const Pagination = class {
                     (!this.enablePaginationSize && !this.enablePaginationPages),
             }) }, this.enablePaginationPages && this.enablePaginationSize && (index.h(index.Fragment, { key: '5812bfaaee47936e0f1d910c4da0421589e5cf9b' }, index.h("p-pagination-size", { key: '2fe1f8e733d96ef2843d184f17c02b2db44b3fb5', hidden: hidePageSizeSelect, size: this.pageSize, sizeOptions: this.pageSizeOptions, onSizeChange: ({ detail }) => this._changePageSize(detail) }), !hidePageSizeSelect &&
             this.hideOnSinglePage &&
-            this._hasPaginationPages && (index.h("p-divider", { key: 'fa14cc1d718604f931f95ee9d2accd28b1bf43e7', variant: 'vertical', class: 'mx-0 h-4 text-off-white-700 dark:text-hurricane-400' })))), this.enablePaginationPages && (index.h("p-pagination-pages", { key: '265840dfb523c4330e5c44a00fe28d9397f7b45c', pageSize: this.pageSize, total: this.total, page: this.page, hideOnSinglePage: this.hideOnSinglePage, onPageChange: ({ detail }) => this.pageChange.emit(detail), onPagesChange: ({ detail }) => {
+            this._hasPaginationPages && (index.h("p-divider", { key: 'fa14cc1d718604f931f95ee9d2accd28b1bf43e7', class: 'mx-0 h-4 text-off-white-700 dark:text-hurricane-400', variant: 'vertical' })))), this.enablePaginationPages && (index.h("p-pagination-pages", { key: '265840dfb523c4330e5c44a00fe28d9397f7b45c', hideOnSinglePage: this.hideOnSinglePage, page: this.page, pageSize: this.pageSize, total: this.total, onPageChange: ({ detail }) => this.pageChange.emit(detail), onPagesChange: ({ detail }) => {
                 this._hasPaginationPages = detail > 1;
                 this.pagesChange.emit(detail);
             } })))));
@@ -163,19 +163,19 @@ const PaginationPages = class {
                 hidden: this.hideOnSinglePage && this._set?.length === 3,
             }) }, this._set?.map(p => {
             if (p.type === 'previous' || p.type === 'next') {
-                return (index.h("p-pagination-pages-item", { variant: 'carousel', disabled: this._carouselDisabled(p.type), onClick: () => p.type === 'previous'
+                return (index.h("p-pagination-pages-item", { disabled: this._carouselDisabled(p.type), variant: 'carousel', onClick: () => p.type === 'previous'
                         ? this._previousClick()
                         : this._nextClick() }, p.value));
             }
             if (p.type === 'ellipsis') {
-                return (index.h("p-dropdown", { placement: 'top', applyChevron: false, insideClick: true, show: this._showDropdown[p.dropdownIndex], onIsOpen: ({ detail }) => this._onShowDropdown(detail, p.dropdownIndex), ref: el => (this._dropdowns[p.dropdownIndex] = el) }, index.h("p-pagination-pages-item", { slot: 'trigger' }, "..."), p.options?.slice(0, 5).map(v => (index.h("p-dropdown-menu-item", { variant: 'pagination', autoHeight: true, onClick: () => this._pageClick(v), slot: 'items' }, this.dropdownPageTemplate
+                return (index.h("p-dropdown", { applyChevron: false, insideClick: true, placement: 'top', ref: el => (this._dropdowns[p.dropdownIndex] = el), show: this._showDropdown[p.dropdownIndex], onIsOpen: ({ detail }) => this._onShowDropdown(detail, p.dropdownIndex) }, index.h("p-pagination-pages-item", { slot: 'trigger' }, "..."), p.options?.slice(0, 5).map(v => (index.h("p-dropdown-menu-item", { autoHeight: true, slot: 'items', variant: 'pagination', onClick: () => this._pageClick(v) }, this.dropdownPageTemplate
                     ? this.dropdownPageTemplate(v)
                     : this._defaultDropdownPageTemplate(v)))), p.options?.length > 5 &&
-                    this._showDropdown[p.dropdownIndex] && (index.h("p-field", { class: 'mt-2 w-28', size: 'sm', icon: 'enter-key', iconPosition: 'end', type: 'number', properties: {
+                    this._showDropdown[p.dropdownIndex] && (index.h("p-field", { autoFocus: true, class: 'mt-2 w-28', icon: 'enter-key', iconPosition: 'end', properties: {
                         min: 1,
                         max: this._pages.length,
                         step: 1,
-                    }, autoFocus: true, onEnter: ({ detail }) => this._enterPress(detail), slot: 'items' }))));
+                    }, size: 'sm', slot: 'items', type: 'number', onEnter: ({ detail }) => this._enterPress(detail) }))));
             }
             return (index.h("p-pagination-pages-item", { active: p.value === this.page, onClick: () => this._pageClick(p.value) }, p.value));
         }))));
@@ -288,11 +288,11 @@ const PaginationPages = class {
         const set = [];
         const previous = {
             type: 'previous',
-            value: (index.h("p-icon", { variant: 'caret', size: 'sm', rotate: 90 })),
+            value: (index.h("p-icon", { rotate: 90, size: 'sm', variant: 'caret' })),
         };
         const next = {
             type: 'next',
-            value: (index.h("p-icon", { variant: 'caret', size: 'sm', rotate: -90 })),
+            value: (index.h("p-icon", { rotate: -90, size: 'sm', variant: 'caret' })),
         };
         // Disable page range, display all the pages
         if (range === null) {
@@ -440,7 +440,7 @@ const PaginationSize = class {
         this._setLocales();
     }
     render() {
-        return (index.h(themedHost_component.ThemedHost, { key: '1062e4a018038b23e5514a50f9fa658b6fae7010', class: paginationSize({ hidden: asBoolean.asBoolean(this.hidden) }) }, index.h("p-dropdown", { key: '521979380d535dcd911c26b881338ddaaf3e7344', applyFullWidth: true, applyMaxWidth: false, placement: 'top-start', chevronDirection: 'down', onIsOpen: ({ detail }) => (this.dropdownIsOpen = detail) }, index.h("div", { key: '81cdccac14a27636661d30889d5894a9fb5d7ce6', class: trigger({
+        return (index.h(themedHost_component.ThemedHost, { key: '1062e4a018038b23e5514a50f9fa658b6fae7010', class: paginationSize({ hidden: asBoolean.asBoolean(this.hidden) }) }, index.h("p-dropdown", { key: '521979380d535dcd911c26b881338ddaaf3e7344', applyFullWidth: true, applyMaxWidth: false, chevronDirection: 'down', placement: 'top-start', onIsOpen: ({ detail }) => (this.dropdownIsOpen = detail) }, index.h("div", { key: '81cdccac14a27636661d30889d5894a9fb5d7ce6', class: trigger({
                 active: this.dropdownIsOpen,
             }), slot: 'trigger' }, index.h("p", { key: '3477755b3365205fef5a3e3f8f465f0d1d41ddd1', class: 'min-w-0 flex-1 overflow-hidden text-ellipsis text-nowrap' }, this.itemTemplate
             ? this.itemTemplate(this.size)
@@ -451,7 +451,7 @@ const PaginationSize = class {
             ], {
                 'text-storm-300 dark:text-hurricane-200': !this.dropdownIsOpen,
                 'text-storm-500 dark:text-white': !!this.dropdownIsOpen,
-            }), variant: 'double-caret', size: 'sm' })), index.h("slot", { key: '4ac113bf401a0a3019c6430a58f5cfd8a153e5c4', slot: 'items' }, this.sizeOptions.map(option => (index.h("p-dropdown-menu-item", { active: option === this.size, onClick: () => this._changeSize(option) }, this.itemTemplate
+            }), size: 'sm', variant: 'double-caret' })), index.h("slot", { key: '4ac113bf401a0a3019c6430a58f5cfd8a153e5c4', slot: 'items' }, this.sizeOptions.map(option => (index.h("p-dropdown-menu-item", { active: option === this.size, onClick: () => this._changeSize(option) }, this.itemTemplate
             ? this.itemTemplate(option)
             : this._defaultItemTemplate(option))))))));
     }

package/dist/cjs/p-profile.cjs.entry.js

@@ -35,7 +35,7 @@ const Profile = class {
     }
     render() {
         const content = this._getContent();
-        return (index.h(themedHost_component.ThemedHost, { key: 'd8b3c59997be743df436a92d272715015d2e876d' }, this._hasDropdownSlot ? (index.h("p-dropdown", { strategy: 'absolute', placement: this.dropdownLocation, applyFullWidth: true, applyMaxWidth: false, onIsOpen: ev => (this._dropdownOpen = ev.detail) }, index.h("p-button", { variant: 'dropdown', chevron: this._dropdownOpen ? 'up' : 'down', active: this._dropdownOpen, slot: 'trigger', size: 'lg', class: 'w-full' }, content), index.h("div", { slot: 'items' }, index.h("slot", { name: 'dropdown', onSlotchange: () => this._checkDropdownSlot() })))) : (content)));
+        return (index.h(themedHost_component.ThemedHost, { key: 'd8b3c59997be743df436a92d272715015d2e876d' }, this._hasDropdownSlot ? (index.h("p-dropdown", { applyChevron: false, applyFullWidth: true, applyMaxWidth: false, placement: this.dropdownLocation, strategy: 'absolute', onIsOpen: ev => (this._dropdownOpen = ev.detail) }, index.h("p-button", { active: this._dropdownOpen, chevron: this._dropdownOpen ? 'up' : 'down', class: 'w-full', size: 'lg', slot: 'trigger', variant: 'dropdown' }, content), index.h("div", { slot: 'items' }, index.h("slot", { name: 'dropdown', onSlotchange: () => this._checkDropdownSlot() })))) : (content)));
     }
     slotchange() {
         this._checkDropdownSlot();