@paperless/core 2.0.1-beta.33 → 2.0.1-beta.35

package/dist/collection/components/atoms/segment-item/segment-item.component.js

@@ -26,10 +26,10 @@ export class SegmentItem {
         this.iconRotate = undefined;
     }
     render() {
-        return (h(Host, { key: 'af7456be3e588b691ccd3b1adda951e04adf5ba2', class: segmentItem({
+        return (h(Host, { key: 'b038e9d37e1ed6fef2c26b526f756d5b4d3969c8', class: segmentItem({
                 active: this.active,
                 iconOnly: this.iconOnly,
-            }) }, this.icon && (h("p-icon", { key: 'dc5df1291d42c311a2c24c7a6fd89ce03f716e46', variant: this.icon, flip: this.iconFlip, rotate: this.iconRotate })), h("slot", { key: '65c6decbb477758300ce389a7a07f0ac174867f8' })));
+            }) }, this.icon && (h("p-icon", { key: '01ad5164e37f166395422a6a5ffe38499a42b26b', variant: this.icon, flip: this.iconFlip, rotate: this.iconRotate })), h("slot", { key: '0b8d0661e1f774422008fc22e3c96e64c8388ac4' })));
     }
     static get is() { return "p-segment-item"; }
     static get originalStyleUrls() {
@@ -89,7 +89,7 @@ export class SegmentItem {
                 "mutable": false,
                 "complexType": {
                     "original": "IconVariant",
-                    "resolved": "\"caret\" | \"double-caret\" | \"arrow\" | \"double-arrow\" | \"bell\" | \"chat\" | \"check-circle\" | \"cross-circle\" | \"error-circle\" | \"info-circle\" | \"phone\" | \"question-circle\" | \"headset\" | \"warning\" | \"attachment\" | \"description\" | \"document\" | \"folder\" | \"pdf\" | \"xls\" | \"bank\" | \"bread\" | \"cake\" | \"calculator\" | \"camera\" | \"car\" | \"certified\" | \"chair\" | \"checkmark\" | \"city\" | \"companies\" | \"company\" | \"credit-card\" | \"cutlery\" | \"department\" | \"diamond\" | \"docter\" | \"download\" | \"envelope\" | \"euro\" | \"exam\" | \"filter\" | \"flower\" | \"globe\" | \"globe-2\" | \"hash\" | \"hat\" | \"home\" | \"integration\" | \"language\" | \"laptop\" | \"location\" | \"mail\" | \"medal\" | \"menu\" | \"menu-arrow\" | \"minus\" | \"more\" | \"negative\" | \"other\" | \"pay\" | \"pencil\" | \"percent\" | \"pie-chart\" | \"placeholder\" | \"plus\" | \"power\" | \"receipt\" | \"reset\" | \"search\" | \"send\" | \"settings\" | \"shuffle\" | \"sick\" | \"signature\" | \"sparkle\" | \"star\" | \"stroller\" | \"tag\" | \"tasks\" | \"tools\" | \"tooth\" | \"train\" | \"trash\" | \"upload\" | \"wave\" | \"zipcode\" | \"eye\" | \"eye-closed\" | \"key\" | \"lock\" | \"unlocked\" | \"alarm\" | \"calendar\" | \"calendar-multi\" | \"calendar-free\" | \"calendar-not-free\" | \"clock\" | \"female\" | \"id\" | \"id-two\" | \"male\" | \"user\" | \"users\"",
+                    "resolved": "\"caret\" | \"double-caret\" | \"arrow\" | \"double-arrow\" | \"bell\" | \"chat\" | \"check-circle\" | \"cross-circle\" | \"error-circle\" | \"info-circle\" | \"phone\" | \"question-circle\" | \"headset\" | \"warning\" | \"attachment\" | \"description\" | \"document\" | \"folder\" | \"pdf\" | \"xls\" | \"bank\" | \"bread\" | \"cake\" | \"calculator\" | \"camera\" | \"car\" | \"certified\" | \"chair\" | \"checkmark\" | \"city\" | \"companies\" | \"company\" | \"credit-card\" | \"cutlery\" | \"department\" | \"diamond\" | \"docter\" | \"download\" | \"envelope\" | \"euro\" | \"exam\" | \"filter\" | \"flower\" | \"globe\" | \"globe-2\" | \"hash\" | \"hat\" | \"home\" | \"integration\" | \"language\" | \"laptop\" | \"location\" | \"mail\" | \"medal\" | \"menu\" | \"menu-arrow\" | \"minus\" | \"more\" | \"negative\" | \"other\" | \"pay\" | \"pencil\" | \"percent\" | \"pie-chart\" | \"placeholder\" | \"plus\" | \"power\" | \"receipt\" | \"reset\" | \"search\" | \"send\" | \"settings\" | \"shuffle\" | \"sick\" | \"signature\" | \"sparkle\" | \"star\" | \"stroller\" | \"tag\" | \"tasks\" | \"tools\" | \"tooth\" | \"train\" | \"trash\" | \"upload\" | \"wave\" | \"zipcode\" | \"eye\" | \"eye-closed\" | \"key\" | \"lock\" | \"unlocked\" | \"alarm\" | \"calendar\" | \"calendar-multi\" | \"calendar-free\" | \"calendar-not-free\" | \"clock\" | \"female\" | \"id\" | \"id-two\" | \"male\" | \"user\" | \"users\" | \"checkmarkThick\"",
                     "references": {
                         "IconVariant": {
                             "location": "import",

package/dist/collection/components/atoms/slider-indicator/slider-indicator.component.js

@@ -4,7 +4,7 @@ export class SliderIndicator {
         this.active = false;
     }
     render() {
-        return (h(Host, { key: '3fea5f2ed9499de58de65a9d313a9b84813af48c', class: `p-slider-indicator ${this.active && 'active'}` }));
+        return (h(Host, { key: 'b4a76296cb2107ee168a257a89fcf4cd75a724dc', class: `p-slider-indicator ${this.active && 'active'}` }));
     }
     static get is() { return "p-slider-indicator"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/atoms/status/status.component.js

@@ -7,8 +7,8 @@ export class Status {
         this.iconRotate = undefined;
     }
     render() {
-        return (h(Host, { key: 'bc0d4df80dd57789f44a87f8b54c4b23947229aa', class: `p-status variant-${this.variant}
-                }` }, this._getIcon(), h("slot", { key: '2275a7e8b94d3a2dc43b584d5d889114c5e978c2' })));
+        return (h(Host, { key: 'e7ee3ba3c0b6e4b8b72f666f4e8d17eed22a588a', class: `p-status variant-${this.variant}
+                }` }, this._getIcon(), h("slot", { key: '485021196c8b4bac9a05021699b5796b7073d86f' })));
     }
     _getIcon() {
         const icon = this.icon || this._getVariantIcon();
@@ -73,7 +73,7 @@ export class Status {
                 "mutable": false,
                 "complexType": {
                     "original": "IconVariant",
-                    "resolved": "\"caret\" | \"double-caret\" | \"arrow\" | \"double-arrow\" | \"bell\" | \"chat\" | \"check-circle\" | \"cross-circle\" | \"error-circle\" | \"info-circle\" | \"phone\" | \"question-circle\" | \"headset\" | \"warning\" | \"attachment\" | \"description\" | \"document\" | \"folder\" | \"pdf\" | \"xls\" | \"bank\" | \"bread\" | \"cake\" | \"calculator\" | \"camera\" | \"car\" | \"certified\" | \"chair\" | \"checkmark\" | \"city\" | \"companies\" | \"company\" | \"credit-card\" | \"cutlery\" | \"department\" | \"diamond\" | \"docter\" | \"download\" | \"envelope\" | \"euro\" | \"exam\" | \"filter\" | \"flower\" | \"globe\" | \"globe-2\" | \"hash\" | \"hat\" | \"home\" | \"integration\" | \"language\" | \"laptop\" | \"location\" | \"mail\" | \"medal\" | \"menu\" | \"menu-arrow\" | \"minus\" | \"more\" | \"negative\" | \"other\" | \"pay\" | \"pencil\" | \"percent\" | \"pie-chart\" | \"placeholder\" | \"plus\" | \"power\" | \"receipt\" | \"reset\" | \"search\" | \"send\" | \"settings\" | \"shuffle\" | \"sick\" | \"signature\" | \"sparkle\" | \"star\" | \"stroller\" | \"tag\" | \"tasks\" | \"tools\" | \"tooth\" | \"train\" | \"trash\" | \"upload\" | \"wave\" | \"zipcode\" | \"eye\" | \"eye-closed\" | \"key\" | \"lock\" | \"unlocked\" | \"alarm\" | \"calendar\" | \"calendar-multi\" | \"calendar-free\" | \"calendar-not-free\" | \"clock\" | \"female\" | \"id\" | \"id-two\" | \"male\" | \"user\" | \"users\"",
+                    "resolved": "\"caret\" | \"double-caret\" | \"arrow\" | \"double-arrow\" | \"bell\" | \"chat\" | \"check-circle\" | \"cross-circle\" | \"error-circle\" | \"info-circle\" | \"phone\" | \"question-circle\" | \"headset\" | \"warning\" | \"attachment\" | \"description\" | \"document\" | \"folder\" | \"pdf\" | \"xls\" | \"bank\" | \"bread\" | \"cake\" | \"calculator\" | \"camera\" | \"car\" | \"certified\" | \"chair\" | \"checkmark\" | \"city\" | \"companies\" | \"company\" | \"credit-card\" | \"cutlery\" | \"department\" | \"diamond\" | \"docter\" | \"download\" | \"envelope\" | \"euro\" | \"exam\" | \"filter\" | \"flower\" | \"globe\" | \"globe-2\" | \"hash\" | \"hat\" | \"home\" | \"integration\" | \"language\" | \"laptop\" | \"location\" | \"mail\" | \"medal\" | \"menu\" | \"menu-arrow\" | \"minus\" | \"more\" | \"negative\" | \"other\" | \"pay\" | \"pencil\" | \"percent\" | \"pie-chart\" | \"placeholder\" | \"plus\" | \"power\" | \"receipt\" | \"reset\" | \"search\" | \"send\" | \"settings\" | \"shuffle\" | \"sick\" | \"signature\" | \"sparkle\" | \"star\" | \"stroller\" | \"tag\" | \"tasks\" | \"tools\" | \"tooth\" | \"train\" | \"trash\" | \"upload\" | \"wave\" | \"zipcode\" | \"eye\" | \"eye-closed\" | \"key\" | \"lock\" | \"unlocked\" | \"alarm\" | \"calendar\" | \"calendar-multi\" | \"calendar-free\" | \"calendar-not-free\" | \"clock\" | \"female\" | \"id\" | \"id-two\" | \"male\" | \"user\" | \"users\" | \"checkmarkThick\"",
                     "references": {
                         "IconVariant": {
                             "location": "import",

package/dist/collection/components/atoms/stepper-item/stepper-item.component.js

@@ -8,7 +8,7 @@ export class StepperItem {
         this.active = false;
     }
     render() {
-        return (h(Host, { key: '5b5c0a4e500578e55b5d7c55a913cea70e9fbb23', class: "p-stepper-item" }, h("div", { key: '0f6311a964269c5a03c915feb1abcd425552cf59', class: "circle" }, this.finished && h("p-icon", { key: '789a03346900f7b7e52b7336d3f2ed25b41502f8', variant: "checkmark" })), h("div", { key: '7eae0631b8f7d20b010e808dc9e2309f15b1b6a3', class: "content" }, h("slot", { key: '4bccba5c636b8a7e649aea2141b5c87c149a98cd', name: "content" }))));
+        return (h(Host, { key: '3d485ab1326327a11f843a10a06976dbfaa5e69e', class: "p-stepper-item" }, h("div", { key: '77778ae9a704c43da71e62455e5ba6c00c9e575f', class: "circle" }, this.finished && h("p-icon", { key: 'ba5127ed6b27595d9e730ce72a7842e3a4aae60e', variant: "checkmark" })), h("div", { key: 'dd5ea1dd939440735e0fb32c981054ff6bd78966', class: "content" }, h("slot", { key: 'c1c73ee1f7d719d8f8da88dda286a01875ee9032', name: "content" }))));
     }
     static get is() { return "p-stepper-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/atoms/stepper-line/stepper-line.component.js

@@ -5,7 +5,7 @@ export class StepperLine {
         this.direction = 'horizontal';
     }
     render() {
-        return h(Host, { key: 'a92797d409afb13452d2e973fc0ad35e7d5e6dee', class: "p-stepper-line" });
+        return h(Host, { key: '1f10907cd345fbd5beda9a9d022426dbeb1d769d', class: "p-stepper-line" });
     }
     static get is() { return "p-stepper-line"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/atoms/tab-group/tab-group.component.js

@@ -1,7 +1,7 @@
 import { h, Host } from "@stencil/core";
 export class TabGroup {
     render() {
-        return (h(Host, { key: '4c7116038f4e902779bcc675b8c1b4c393a8bf9b', class: "p-tab-group relative flex w-full flex-col" }, h("div", { key: 'f6f23c1137257a186fe344d1bc3107759628cb3f', class: "scrollbar-hide z-10 flex w-full gap-5 overflow-x-auto" }, h("slot", { key: 'f4060cd466b9672bbdc827e644e7c73f5051ecc2' })), h("p-divider", { key: 'fbb9c916923ed562dff16233405f17a17e2f3839', class: "absolute bottom-0 left-0 m-0 w-full" })));
+        return (h(Host, { key: '0196a50b1603687c6966ddfe57f93f5163d8a53f', class: "p-tab-group relative flex w-full flex-col" }, h("div", { key: '0c5412d0724d086fc4ef2a7ad8dc306e9769d130', class: "scrollbar-hide z-10 flex w-full gap-5 overflow-x-auto" }, h("slot", { key: '31bb8480ea930c664473c8b77f9cb97276b5af16' })), h("p-divider", { key: '8e4668bc349afae1e1772a1b1f5bb3f3476a5aaf', class: "absolute bottom-0 left-0 m-0 w-full" })));
     }
     static get is() { return "p-tab-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/atoms/tab-item/tab-item.component.js

@@ -4,7 +4,7 @@ export class TabItem {
         this.active = false;
     }
     render() {
-        return (h(Host, { key: '089d3d7d47eacf3257b0e242fcf1646f3c3a7306', class: `p-tab-item ${this.active && 'active'}` }, h("slot", { key: '29e458fd3167121bddb9b35fa0e236a201745fd9' })));
+        return (h(Host, { key: '8ede23aa9899c3bdea0191542b007fa77dd54fe8', class: `p-tab-item ${this.active && 'active'}` }, h("slot", { key: 'd6ecbb51b03ab4791f3153bdf6c7c98623bdd0b1' })));
     }
     static get is() { return "p-tab-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/atoms/table-container/table-container.component.js

@@ -4,7 +4,7 @@ export class TableContainer {
         this.shadow = true;
     }
     render() {
-        return (h(Host, { key: '73eb4897c9a50ca1f673eff5d331d180462d3b5d', class: `p-table-container ${!this.shadow && 'no-shadow'}` }, h("slot", { key: 'ee29b6fd875e4e170343caf2e1c04e6177779425' })));
+        return (h(Host, { key: 'f9b97958a4f0e448258e16b116fe42a81b014eb8', class: `p-table-container ${!this.shadow && 'no-shadow'}` }, h("slot", { key: 'dfb4247a6e6a80479c44ae9481d620666fad2a55' })));
     }
     static get is() { return "p-table-container"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/atoms/toast-container/toast-container.component.js

@@ -4,7 +4,7 @@ export class ToastContainer {
         this.placement = 'top-end';
     }
     render() {
-        return (h(Host, { key: '08003fba3c68efb062495f15641c6e762dfb40b0', class: `p-toast-container placement-${this.placement}` }, h("slot", { key: '121b4bca4f1f1db6bc9e5da976175bb496d4e61c' })));
+        return (h(Host, { key: '084f8ee6efb5f3d4d28cd74ccdda9120e3cf67b6', class: `p-toast-container placement-${this.placement}` }, h("slot", { key: '2bbc0227bfb59635caf0853773e6b573babf8e49' })));
     }
     static get is() { return "p-toast-container"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/atoms/toggle/toggle.component.js

@@ -94,13 +94,13 @@ export class Toggle {
      */
     indeterminateChange;
     render() {
-        return (h(Host, { key: '7e7322642bd2ae209f3693d86f7d206ba48e32aa', class: 'p-checkbox' }, h("label", { key: '6bcb61ef0326e9ae1df59c88c3fc8a1c09aa6c59', htmlFor: this.id ?? this._nonce, class: 'flex items-center justify-start gap-2 text-black-teal' }, h("div", { key: 'a4993dac0cf2193aab80749460615d1da97f91cc', class: 'group relative flex flex-shrink-0 items-center' }, h("input", { key: '9225f841e623b436930c116ddd6767a55e335001', class: checkbox({
+        return (h(Host, { key: '40efaf95a6ccc2c3d1207e1c2aee5aa42928847f', class: 'p-checkbox' }, h("label", { key: 'd0b47d2414464689189c04fd1087fa4e2670471b', htmlFor: this.id ?? this._nonce, class: 'flex items-center justify-start gap-2 text-black-teal' }, h("div", { key: 'bea89d82418991b598ca015d8916f31fb3240be4', class: 'group relative flex flex-shrink-0 items-center' }, h("input", { key: '69830e728c7093fd2b269e341678bf95caa2705d', class: checkbox({
                 size: this.size,
                 disabled: this.disabled,
-            }), type: 'checkbox', id: this.id ?? this._nonce, name: this.name, required: this.required, checked: !!this.checked, indeterminate: this.indeterminate, disabled: this.disabled, onChange: ev => this._onChange(ev) }), h("div", { key: '4c6f3a78c1c9c483bb655ccb5555615fcdf338b3', class: circle({
+            }), type: 'checkbox', id: this.id ?? this._nonce, name: this.name, required: this.required, checked: !!this.checked, indeterminate: this.indeterminate, disabled: this.disabled, onChange: ev => this._onChange(ev) }), h("div", { key: '89f8610d0e9ccb0daafeb325fdf89fafdf8afd00', class: circle({
                 size: this.size,
                 disabled: this.disabled,
-            }) })), h("slot", { key: '25d9c3ce61d0ae9442092fe02b17fdd31a5b912b' }))));
+            }) })), h("slot", { key: '5d202099b2fd82d6174bb31fa9ce7ba95b8a355a' }))));
     }
     _onChange(ev) {
         if (this.disabled) {

package/dist/collection/components/atoms/tooltip/tooltip.component.js

@@ -83,19 +83,19 @@ export class Tooltip {
             ref: el => this._load(el),
         };
         let tooltip;
-        const tooltipElement = (h("div", { key: 'dffb30b5a876eea1666df8277d032a1f245d9998', class: popover({
+        const tooltipElement = (h("div", { key: '6f9c3f17c03fd05f38542ae9c7c0bcbd974a5bbb', class: popover({
                 variant: this.variant,
                 strategy: this.usePortal ? 'none' : this.strategy,
-            }), ...(this.usePortal ? {} : tooltipProps) }, h("div", { key: 'dadc96e74bd8b69a4dfef0f5a247a20690d8f31d', class: 'flex gap-2' }, this.variant === 'error' && (h("div", { key: '94a267c1c89cae726db52160a9b6c08b66689426', class: 'w-[2px] bg-negative-red' })), this.content ? this.content : h("slot", { name: 'content' }))));
+            }), ...(this.usePortal ? {} : tooltipProps) }, h("div", { key: '24a0b7be9128f683c5b97b025c127ccc099a350d', class: 'flex gap-2' }, this.variant === 'error' && (h("div", { key: 'bdef4cbe31d0642f4db9134e8b1dac420476f662', class: 'w-[2px] bg-negative-red' })), this.content ? this.content : h("slot", { name: 'content' }))));
         if (this.usePortal) {
-            tooltip = (h("p-portal", { key: 'ea7f1b8bc46937a4cb3caa32f8fa905ea4c246a5', class: portal({
+            tooltip = (h("p-portal", { key: '261fa01590875e3b7b89e1071340a28e1a9c0026', class: portal({
                     strategy: this.strategy,
                 }), ...tooltipProps }, tooltipElement));
         }
         else {
             tooltip = tooltipElement;
         }
-        return (h(Host, { key: 'db9de49ecbb2b080d3a44bf0931bc3b3df38bb17', class: 'p-popover flex cursor-pointer' }, h("div", { key: '1e774544a922ce477a0006a4c86e3e1f28c5c9a7', class: 'relative h-inherit w-inherit' }, h("slot", { key: '5ec39f84d2e3c6ac8131e1f147c72ec778a51241', name: 'trigger' }), tooltip)));
+        return (h(Host, { key: '5bc62f68bb9f49ce77f5e50f3713ad8a9b68e350', class: 'p-popover flex cursor-pointer' }, h("div", { key: '3792040756275f17dde8dad661af0cec0c40192b', class: 'relative h-inherit w-inherit' }, h("slot", { key: '7426bd33a80902bd576168c6dff9cfcfc70c128f', name: 'trigger' }), tooltip)));
     }
     clickHandler() {
         if (this.variant === 'hover' || !this.enableUserInput) {

package/dist/collection/components/helpers/table-row-action/table-row-action.component.js

@@ -42,7 +42,7 @@ export class TableRowAction {
                 "mutable": false,
                 "complexType": {
                     "original": "IconVariant",
-                    "resolved": "\"caret\" | \"double-caret\" | \"arrow\" | \"double-arrow\" | \"bell\" | \"chat\" | \"check-circle\" | \"cross-circle\" | \"error-circle\" | \"info-circle\" | \"phone\" | \"question-circle\" | \"headset\" | \"warning\" | \"attachment\" | \"description\" | \"document\" | \"folder\" | \"pdf\" | \"xls\" | \"bank\" | \"bread\" | \"cake\" | \"calculator\" | \"camera\" | \"car\" | \"certified\" | \"chair\" | \"checkmark\" | \"city\" | \"companies\" | \"company\" | \"credit-card\" | \"cutlery\" | \"department\" | \"diamond\" | \"docter\" | \"download\" | \"envelope\" | \"euro\" | \"exam\" | \"filter\" | \"flower\" | \"globe\" | \"globe-2\" | \"hash\" | \"hat\" | \"home\" | \"integration\" | \"language\" | \"laptop\" | \"location\" | \"mail\" | \"medal\" | \"menu\" | \"menu-arrow\" | \"minus\" | \"more\" | \"negative\" | \"other\" | \"pay\" | \"pencil\" | \"percent\" | \"pie-chart\" | \"placeholder\" | \"plus\" | \"power\" | \"receipt\" | \"reset\" | \"search\" | \"send\" | \"settings\" | \"shuffle\" | \"sick\" | \"signature\" | \"sparkle\" | \"star\" | \"stroller\" | \"tag\" | \"tasks\" | \"tools\" | \"tooth\" | \"train\" | \"trash\" | \"upload\" | \"wave\" | \"zipcode\" | \"eye\" | \"eye-closed\" | \"key\" | \"lock\" | \"unlocked\" | \"alarm\" | \"calendar\" | \"calendar-multi\" | \"calendar-free\" | \"calendar-not-free\" | \"clock\" | \"female\" | \"id\" | \"id-two\" | \"male\" | \"user\" | \"users\"",
+                    "resolved": "\"caret\" | \"double-caret\" | \"arrow\" | \"double-arrow\" | \"bell\" | \"chat\" | \"check-circle\" | \"cross-circle\" | \"error-circle\" | \"info-circle\" | \"phone\" | \"question-circle\" | \"headset\" | \"warning\" | \"attachment\" | \"description\" | \"document\" | \"folder\" | \"pdf\" | \"xls\" | \"bank\" | \"bread\" | \"cake\" | \"calculator\" | \"camera\" | \"car\" | \"certified\" | \"chair\" | \"checkmark\" | \"city\" | \"companies\" | \"company\" | \"credit-card\" | \"cutlery\" | \"department\" | \"diamond\" | \"docter\" | \"download\" | \"envelope\" | \"euro\" | \"exam\" | \"filter\" | \"flower\" | \"globe\" | \"globe-2\" | \"hash\" | \"hat\" | \"home\" | \"integration\" | \"language\" | \"laptop\" | \"location\" | \"mail\" | \"medal\" | \"menu\" | \"menu-arrow\" | \"minus\" | \"more\" | \"negative\" | \"other\" | \"pay\" | \"pencil\" | \"percent\" | \"pie-chart\" | \"placeholder\" | \"plus\" | \"power\" | \"receipt\" | \"reset\" | \"search\" | \"send\" | \"settings\" | \"shuffle\" | \"sick\" | \"signature\" | \"sparkle\" | \"star\" | \"stroller\" | \"tag\" | \"tasks\" | \"tools\" | \"tooth\" | \"train\" | \"trash\" | \"upload\" | \"wave\" | \"zipcode\" | \"eye\" | \"eye-closed\" | \"key\" | \"lock\" | \"unlocked\" | \"alarm\" | \"calendar\" | \"calendar-multi\" | \"calendar-free\" | \"calendar-not-free\" | \"clock\" | \"female\" | \"id\" | \"id-two\" | \"male\" | \"user\" | \"users\" | \"checkmarkThick\"",
                     "references": {
                         "IconVariant": {
                             "location": "import",

package/dist/collection/components/molecules/accordion/accordion.component.js

@@ -11,7 +11,7 @@ export class Accordion {
      */
     isOpen;
     render() {
-        return (h(Host, { key: '3ea0f730d30fa84c650810e933043027fc34b343', class: 'p-accordion' }, h("div", { key: '43387e553a9eb9df2f250143481a041b1ac0c841', class: 'flex cursor-pointer items-center gap-3 text-storm-vague', onClick: () => this._onClick() }, h("p-icon", { key: '910319f48fb18fd4390028a61a13db0815d9b816', class: 'flex', variant: 'caret', rotate: this.open ? 0 : -90 }), h("p", { key: '8b10150fcc7e71a89f6e0847e7abc3f006ff3dd4', class: 'm-0 whitespace-nowrap text-lg font-medium' }, this.header), h("p-divider", { key: '43404b50cf318453d54984217c2efdbbde13f590' })), this.open && (h("div", { key: 'dd4afc515752f393c1f4f59d5aeb2d225951be6b', class: 'mt-6' }, h("slot", { key: '5cfe1feb25f29583d5d49c2a32e42124a17075e8' })))));
+        return (h(Host, { key: '6b30beeb39140eef55eda07436aba6d094478d8e', class: 'p-accordion' }, h("div", { key: '90d90727c847283d23de3475a3a573fc28efd8f2', class: 'flex cursor-pointer items-center gap-3 text-storm-vague', onClick: () => this._onClick() }, h("p-icon", { key: '20159b0bfe718c63b7167854830a72aa17912309', class: 'flex', variant: 'caret', rotate: this.open ? 0 : -90 }), h("p", { key: 'a7f261c699a41fa1df17476415afda93bafb5a43', class: 'm-0 whitespace-nowrap text-lg font-medium' }, this.header), h("p-divider", { key: '336839c9e8f18f7179c9d43d1907a67c246d8c32' })), this.open && (h("div", { key: '1530c39de3496b7bb88318f78aa945690717e037', class: 'mt-6' }, h("slot", { key: 'de231dd491494a9b49ff6fca97fb805e9b91427b' })))));
     }
     _onClick() {
         if (!this.closeable && this.open) {

package/dist/collection/components/molecules/attachment/attachment.component.js

@@ -15,14 +15,14 @@ export class Attachment {
      */
     delete;
     render() {
-        let prefix = h("p-icon", { key: '6bdeeb5e89aac0c189ef407bc382801943e9c6d0', variant: 'attachment' });
+        let prefix = h("p-icon", { key: 'c09bb42c3b2468e6f9641b049143ba33bcf227ed', variant: 'attachment' });
         if (this.loading) {
-            prefix = h("p-loader", { key: '002c9cb2433286ae1d877e7d863d102d891be229' });
+            prefix = h("p-loader", { key: '4a47c764c8634c41a006cbcef0819ac495383d45' });
         }
         if (this.error) {
-            prefix = (h("p-icon", { key: 'e0ab65310a5f34eb989f036f9cd8bcd3ac18adc9', variant: 'warning', class: 'text-negative' }));
+            prefix = (h("p-icon", { key: 'b68414ca0c360344b803cb503bc97375c145cf26', variant: 'warning', class: 'text-negative' }));
         }
-        return (h(Host, { key: '2863cec631d05b9a55b340aa6c7e4bb0504c7684', class: 'p-attachment flex items-start gap-4' }, h("div", { key: '32a0f979edb284dc1ccedff199b7e6190a5bfa6b', class: `flex h-8 min-w-0 flex-1 items-center justify-start gap-2 rounded-lg bg-mystic px-2 ${this.error?.length ? 'text-negative' : 'text-storm-medium'}` }, prefix, h("span", { key: '593dbca1f9fbb4afd792f688a6487d2c384abfce', class: 'min-w-0 flex-1 overflow-hidden text-ellipsis whitespace-nowrap' }, h("slot", { key: '3c40a0a4328d7dbb810e07195cddd0b590db1589' })), this.error?.length && h("p-input-error", { key: '04a6a4c13343f21578e0a8a0d703aff8defcb855', error: this.error })), h("p-button", { key: '263cbeb5aa0fa297c4497e23c201a93cf4bf4aef', variant: 'secondary', iconOnly: true, icon: this.mode === 'read' ? 'download' : 'trash', disabled: this.loading, loading: this.mode === 'read' && this.downloading, size: 'sm', onOnClick: () => (this.mode === 'read' ? this.download : this.delete).emit() })));
+        return (h(Host, { key: '7c2fb4622615da771f0542b46137376f353d3324', class: 'p-attachment flex items-start gap-4' }, h("div", { key: 'c26642043d15b3a16d689974f9f572f5fbd01f04', class: `flex h-8 min-w-0 flex-1 items-center justify-start gap-2 rounded-lg bg-mystic px-2 ${this.error?.length ? 'text-negative' : 'text-storm-medium'}` }, prefix, h("span", { key: '7200149af956d76267b0c85d0ab9f00baae900ce', class: 'min-w-0 flex-1 overflow-hidden text-ellipsis whitespace-nowrap' }, h("slot", { key: '7d8c8e660f0c1ee9ffc8bbd446a3c1a0e709858b' })), this.error?.length && h("p-input-error", { key: '9f1d61eaa43ddf2bf31413e9b87c4be05479fcfe', error: this.error })), h("p-button", { key: 'c74fc5e26a2864ba561a9d0ece1bbbf4f10fa465', variant: 'secondary', iconOnly: true, icon: this.mode === 'read' ? 'download' : 'trash', disabled: this.loading, loading: this.mode === 'read' && this.downloading, size: 'sm', onOnClick: () => (this.mode === 'read' ? this.download : this.delete).emit() })));
     }
     static get is() { return "p-attachment"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/molecules/button/button.component.js

@@ -289,7 +289,7 @@ export class Button {
             ? 'a'
             : 'button';
         const active = this.active || this.class?.includes('active');
-        return (h(Host, { key: 'f44310bde78beef37e12c41d3ecd7aa3d60fa625', class: 'p-button block' }, h(VariableTag, { key: '79226854728c982ce5b91cf7c249b4495f8f7e1e', disabled: this.disabled, href: this.href, type: this.variant !== 'text' ? this.type : undefined, target: this.target, class: button({
+        return (h(Host, { key: 'bd323911aa83659e1ceacc78f7383498ac49ee3f', class: 'p-button block' }, h(VariableTag, { key: '24836397d30809a719796ba3488a2b59a0e7fcd7', disabled: this.disabled, href: this.href, type: this.variant !== 'text' ? this.type : undefined, target: this.target, class: button({
                 variant: this.variant,
                 size: this.size,
                 underline: this.underline,
@@ -298,14 +298,14 @@ export class Button {
                 buttonGroupPosition: this.buttonGroupPosition,
                 iconOnly: this.iconOnly,
                 active,
-            }) }, this.chevron && this.chevronPosition === 'start' && (h("p-icon", { key: 'ab1d82abb255cd309702f60165e6088d0a78b5e3', variant: 'caret', rotate: this.chevron === 'up' ? 180 : 0 })), this.icon &&
+            }) }, this.chevron && this.chevronPosition === 'start' && (h("p-icon", { key: '1d2c9857b333ce860e88cedd867a2d4e921202bd', variant: 'caret', rotate: this.chevron === 'up' ? 180 : 0 })), this.icon &&
             this.iconPosition === 'start' &&
             !(this.iconOnly && this.loading) &&
-            this._getIcon(), h("slot", { key: 'a489631670f0fb6bc834c35e74384f4182c24134' }), this.icon &&
+            this._getIcon(), h("slot", { key: 'f0406ef28f558774f9952e942cefb11b75ee8f5f' }), this.icon &&
             this.iconPosition === 'end' &&
             !this.loading &&
             !this.chevron &&
-            this._getIcon(), this.chevron && !this.loading && this.chevronPosition === 'end' && (h("p-icon", { key: 'eb0d01980d697321090fdc0193fd5326c8670ae9', variant: 'caret', rotate: this.chevron === 'up' ? 180 : 0 })), this.loading && h("p-loader", { key: 'e3df3be330bf1ffd6b43108077a3f1a7b46822a6', color: loaderColor }))));
+            this._getIcon(), this.chevron && !this.loading && this.chevronPosition === 'end' && (h("p-icon", { key: 'd3ccba3bad624c75b28562b0503d5804dad462b0', variant: 'caret', rotate: this.chevron === 'up' ? 180 : 0 })), this.loading && h("p-loader", { key: '2de6facd444171e293fea2bc6aa3888b13bd079f', color: loaderColor }))));
     }
     handleClick(ev) {
         if (this.loading || this.disabled) {
@@ -581,7 +581,7 @@ export class Button {
                 "mutable": false,
                 "complexType": {
                     "original": "IconVariant",
-                    "resolved": "\"caret\" | \"double-caret\" | \"arrow\" | \"double-arrow\" | \"bell\" | \"chat\" | \"check-circle\" | \"cross-circle\" | \"error-circle\" | \"info-circle\" | \"phone\" | \"question-circle\" | \"headset\" | \"warning\" | \"attachment\" | \"description\" | \"document\" | \"folder\" | \"pdf\" | \"xls\" | \"bank\" | \"bread\" | \"cake\" | \"calculator\" | \"camera\" | \"car\" | \"certified\" | \"chair\" | \"checkmark\" | \"city\" | \"companies\" | \"company\" | \"credit-card\" | \"cutlery\" | \"department\" | \"diamond\" | \"docter\" | \"download\" | \"envelope\" | \"euro\" | \"exam\" | \"filter\" | \"flower\" | \"globe\" | \"globe-2\" | \"hash\" | \"hat\" | \"home\" | \"integration\" | \"language\" | \"laptop\" | \"location\" | \"mail\" | \"medal\" | \"menu\" | \"menu-arrow\" | \"minus\" | \"more\" | \"negative\" | \"other\" | \"pay\" | \"pencil\" | \"percent\" | \"pie-chart\" | \"placeholder\" | \"plus\" | \"power\" | \"receipt\" | \"reset\" | \"search\" | \"send\" | \"settings\" | \"shuffle\" | \"sick\" | \"signature\" | \"sparkle\" | \"star\" | \"stroller\" | \"tag\" | \"tasks\" | \"tools\" | \"tooth\" | \"train\" | \"trash\" | \"upload\" | \"wave\" | \"zipcode\" | \"eye\" | \"eye-closed\" | \"key\" | \"lock\" | \"unlocked\" | \"alarm\" | \"calendar\" | \"calendar-multi\" | \"calendar-free\" | \"calendar-not-free\" | \"clock\" | \"female\" | \"id\" | \"id-two\" | \"male\" | \"user\" | \"users\"",
+                    "resolved": "\"caret\" | \"double-caret\" | \"arrow\" | \"double-arrow\" | \"bell\" | \"chat\" | \"check-circle\" | \"cross-circle\" | \"error-circle\" | \"info-circle\" | \"phone\" | \"question-circle\" | \"headset\" | \"warning\" | \"attachment\" | \"description\" | \"document\" | \"folder\" | \"pdf\" | \"xls\" | \"bank\" | \"bread\" | \"cake\" | \"calculator\" | \"camera\" | \"car\" | \"certified\" | \"chair\" | \"checkmark\" | \"city\" | \"companies\" | \"company\" | \"credit-card\" | \"cutlery\" | \"department\" | \"diamond\" | \"docter\" | \"download\" | \"envelope\" | \"euro\" | \"exam\" | \"filter\" | \"flower\" | \"globe\" | \"globe-2\" | \"hash\" | \"hat\" | \"home\" | \"integration\" | \"language\" | \"laptop\" | \"location\" | \"mail\" | \"medal\" | \"menu\" | \"menu-arrow\" | \"minus\" | \"more\" | \"negative\" | \"other\" | \"pay\" | \"pencil\" | \"percent\" | \"pie-chart\" | \"placeholder\" | \"plus\" | \"power\" | \"receipt\" | \"reset\" | \"search\" | \"send\" | \"settings\" | \"shuffle\" | \"sick\" | \"signature\" | \"sparkle\" | \"star\" | \"stroller\" | \"tag\" | \"tasks\" | \"tools\" | \"tooth\" | \"train\" | \"trash\" | \"upload\" | \"wave\" | \"zipcode\" | \"eye\" | \"eye-closed\" | \"key\" | \"lock\" | \"unlocked\" | \"alarm\" | \"calendar\" | \"calendar-multi\" | \"calendar-free\" | \"calendar-not-free\" | \"clock\" | \"female\" | \"id\" | \"id-two\" | \"male\" | \"user\" | \"users\" | \"checkmarkThick\"",
                     "references": {
                         "IconVariant": {
                             "location": "import",

package/dist/collection/components/molecules/button-group/button-group.component.js

@@ -11,7 +11,7 @@ export class ButtonGroup {
         this._checkButtons();
     }
     render() {
-        return (h(Host, { key: 'b5406570950fd5f7e039c4def1356c96b6f6732e', class: 'p-button-group flex items-center' }, h("slot", { key: '4b1458756053af8648712f4ae82a69e32ca54342' })));
+        return (h(Host, { key: '0647722609a39d03bb20c84b52a9ddd35d96f582', class: 'p-button-group flex items-center' }, h("slot", { key: 'b29b73fc742655442576b7f85d0de2ec37af8c1d' })));
     }
     slotchange() {
         this._checkButtons();

package/dist/collection/components/molecules/calendar/calendar.component.js

@@ -135,7 +135,7 @@ export class Calendar {
             .filter(date => isValid(date));
     }
     render() {
-        return (h(Host, { key: 'ec824de4f89afcaa43007351ced2a8f8822869e5', class: calendar({ variant: this.variant }) }, this._getView()));
+        return (h(Host, { key: 'fe8fe4bdd71db351a46b4ee502a5b99d5cc9998b', class: calendar({ variant: this.variant }) }, this._getView()));
     }
     _getView() {
         if (this._view === 'year') {

package/dist/collection/components/molecules/content-slider/content-slider.component.js

@@ -39,9 +39,9 @@ export class ContentSlider {
         }
     }
     render() {
-        return (h(Host, { key: '32c284ee7901017eefbe8124029e1b1252cfa202', class: "p-content-slider" }, h("div", { key: 'a75ed8e3e600d0e19f71247e3fb1c9d97a9437b9', class: `slider ${!this.disableDrag && 'draggable'} ${this._dragging && 'dragging'}`, style: {
+        return (h(Host, { key: '8eb11bf3cc0a423f409e4be422bc6317da9781d3', class: "p-content-slider" }, h("div", { key: 'f8f2b83337877d30e99288c5dfe39fdd3c0d4836', class: `slider ${!this.disableDrag && 'draggable'} ${this._dragging && 'dragging'}`, 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) }, h("div", { key: 'f6b5f3d9ef0f188c8a47afeb4ef026fa8d6499ac', class: "inner-slider", ref: (ref) => this._setInnerSliderReft(ref), onTransitionEnd: () => this._transitionEndHandler() }, h("slot", { key: '365f3783b6a163ea40d72b645650c32c4c249c71' }))), h("div", { key: '994a8ed5c19b7c3dbb0ea210d69bee2c5c78dcd3', class: `indicator ${this.hideMobileIndicator && 'hidden'}` }, this._items.map((_, i) => (h("div", { onClick: () => this._scrollTo(i, true), class: `item ${!this.disableIndicatorClick && 'cursor-pointer'}` }, h("p-slider-indicator", { active: i === this._visibleIndex })))))));
+            }, 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) }, h("div", { key: 'a59469a94a13cca80542a65bed22c404b99b3ecb', class: "inner-slider", ref: (ref) => this._setInnerSliderReft(ref), onTransitionEnd: () => this._transitionEndHandler() }, h("slot", { key: '5e00f801555b5df3b9246854d59ed1876286ebe5' }))), h("div", { key: '01cf555792aca6f36bec72acf123b0e398901cd6', class: `indicator ${this.hideMobileIndicator && 'hidden'}` }, this._items.map((_, i) => (h("div", { onClick: () => this._scrollTo(i, true), class: `item ${!this.disableIndicatorClick && 'cursor-pointer'}` }, h("p-slider-indicator", { active: i === this._visibleIndex })))))));
     }
     _mouseDownHandler(e) {
         if (this.disableDrag || this._dragging) {

package/dist/collection/components/molecules/cropper/cropper.component.js

@@ -34,10 +34,10 @@ export class Cropper {
         }, 200);
     }
     render() {
-        return (h(Host, { key: '3e5aae3ee38ef7916782f0ef6b798a2e1c7bcb1f', class: 'p-cropper' }, this._loaded && (h("cropper-canvas", { key: 'c6a1cda7ae28e331b54cdd28b41048493f433a73', class: 'h-[17.5rem] w-full border-0 border-b border-solid border-mystic-medium bg-white', onAction: () => this._onAction() }, h("cropper-image", { key: '02e38a00de7a94ae9c0a9455204d4c552850c5f3', src: this.value, alt: 'Picture', ref: ref => this._setImageRef(ref), scalable: true, crossorigin: 'anonymous' }), h("cropper-shade", { key: '12001865905af4564b2cf5d0ef32a31e7dbbcd36', class: clsx({
+        return (h(Host, { key: 'c7ca3f48d21b7925b17f42ef5efeb66ceb814884', class: 'p-cropper' }, this._loaded && (h("cropper-canvas", { key: 'adf2a4302c2c7170924c5b433b8841964360f3ea', class: 'h-[17.5rem] w-full border-0 border-b border-solid border-mystic-medium bg-white', onAction: () => this._onAction() }, h("cropper-image", { key: 'd74a8a67b80699f6ffc16bb69ff55728bada0528', src: this.value, alt: 'Picture', ref: ref => this._setImageRef(ref), scalable: true, crossorigin: 'anonymous' }), h("cropper-shade", { key: '6a5b34376058b7e086e3061c5473da98f7ef64e9', class: clsx({
                 'rounded-round': this.variant === 'user',
                 rounded: this.variant === 'company',
-            }), "theme-color": 'rgba(255, 255, 255, 0.5)', hidden: true }), h("cropper-selection", { key: '1cc692662a02f29bccc67b9cbd9e2cb83c53880a', "initial-coverage": '0.7', "aspect-ratio": '1', ref: ref => (this._selectionRef = ref) }), h("cropper-handle", { key: 'a782e50ae9a931de6ccd70591310092cc8d01e4b', action: 'move', plain: true }))), h("div", { key: 'd88de6e6012701e12fd7ffa0b856db55a27e1a5d', class: 'flex w-full items-center gap-2 px-14 text-storm-vague tablet:max-w-xs tablet:px-1' }, h("p-icon", { key: '3a0fa3ac2d8e44022370a25fff6c64ce9f09c523', variant: 'minus' }), h("input", { key: '0d4f8e6d028c44af3ee9e68b8bb90f4d5f6b20e9', class: 'p-input w-full', type: 'range', min: '0', max: '100', value: this._currentScale, onInput: ev => this._onInput(ev.target.value), step: '0.5' }), h("p-icon", { key: '04f4ccffda0c52298d6e85cd3ec1093a3b1bccfd', variant: 'plus' }))));
+            }), "theme-color": 'rgba(255, 255, 255, 0.5)', hidden: true }), h("cropper-selection", { key: '0f9d377be79c0077dfa219f129cc063d9ab50356', "initial-coverage": '0.7', "aspect-ratio": '1', ref: ref => (this._selectionRef = ref) }), h("cropper-handle", { key: 'a58b78d26eb5ef59af523d9a656b96353d35011d', action: 'move', plain: true }))), h("div", { key: 'b3875252e85fa6c03f3b37b506a2671d08716046', class: 'flex w-full items-center gap-2 px-14 text-storm-vague tablet:max-w-xs tablet:px-1' }, h("p-icon", { key: 'ee09baf9f32e2740e7edab92b52a36c7d1ea34a3', variant: 'minus' }), h("input", { key: 'f02aeb58fec43835d116750c919bc320d5c55bbf', class: 'p-input w-full', type: 'range', min: '0', max: '100', value: this._currentScale, onInput: ev => this._onInput(ev.target.value), step: '0.5' }), h("p-icon", { key: '653559c8eaeaa0ae0a677d1c3756b1439e45fcd9', variant: 'plus' }))));
     }
     _setImageRef(ref) {
         if (this._imageRef) {

package/dist/collection/components/molecules/datepicker/datepicker.component.js

@@ -116,9 +116,9 @@ export class Datepicker {
         this.parseValue(this.value);
     }
     render() {
-        return (h(Host, { key: 'd8072759e5110df91f88b5433ed1abd37b7a957b', class: 'p-datepicker' }, h("p-dropdown", { key: '389b7ecebd6d34c14a128d4e25a6262ed4b471d6', strategy: this.strategy, placement: this.placement, disableTriggerClick: true, applyMaxWidth: false, applyFullWidth: false, insideClick: true, show: this._showDropdown }, h("p-field", { key: 'ebc5b5fe902c5fa5e26fd821bafa0d0314f2fbab', slot: 'trigger', icon: this.hideIconWhenFilled && !!this._value ? null : 'calendar-multi', iconPosition: 'start', size: this.size, prefix: this.prefix, label: this.label, helper: this.helper, required: this.required, error: this.error, disabled: this.disabled, focused: this._showDropdown, value: this._getFormattedDate(), placeholder: this.placeholder, onFocus: () => this._onFocus(), onBlur: () => this._onBlur(), onValueChange: ev => this._onValueChange(ev.detail), onInputRefChange: ev => (this._inputRef = ev.detail) }), this.enableNativePicker && this._isMobileBrowser && (h("input", { key: '0696f58898874fd807758cf6745cb675e9d56071', slot: 'trigger', type: this.mode === 'day' ? 'date' : 'month', class: 'h-0 overflow-hidden' // we use h-0 here so location dependent pickers can correctly place itself
+        return (h(Host, { key: '53cefbcd435b31a304c14bcdf254981992f0300a', class: 'p-datepicker' }, h("p-dropdown", { key: 'd76542b017edc53f22a438d5258d7af31f58554a', strategy: this.strategy, placement: this.placement, disableTriggerClick: true, applyMaxWidth: false, applyFullWidth: false, insideClick: true, show: this._showDropdown }, h("p-field", { key: '610e312ff7b0cfe15b9181e10cb4e6e1eedb0020', slot: 'trigger', icon: this.hideIconWhenFilled && !!this._value ? null : 'calendar-multi', iconPosition: 'start', size: this.size, prefix: this.prefix, label: this.label, helper: this.helper, required: this.required, error: this.error, disabled: this.disabled, focused: this._showDropdown, value: this._getFormattedDate(), placeholder: this.placeholder, onFocus: () => this._onFocus(), onBlur: () => this._onBlur(), onValueChange: ev => this._onValueChange(ev.detail), onInputRefChange: ev => (this._inputRef = ev.detail) }), this.enableNativePicker && this._isMobileBrowser && (h("input", { key: '13223eded6fa5a099413ce69c12b2a5e6bc18b76', slot: 'trigger', type: this.mode === 'day' ? 'date' : 'month', class: 'h-0 overflow-hidden' // we use h-0 here so location dependent pickers can correctly place itself
             ,
-            onInput: ev => this._onNativeInput(ev), ref: ref => (this._dateInputRef = ref), value: this._value && format(this._value, 'yyyy-MM-dd'), min: this.minDate && format(new Date(this.minDate), 'yyyy-MM-dd'), max: this.maxDate && format(new Date(this.maxDate), 'yyyy-MM-dd') })), h("div", { key: '42e5c115c7512321ee84a2b5e0c963d227c82889', slot: 'items' }, h("p-calendar", { key: 'f11987a548b1322752747c8aaa6fab55af740d95', 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, mode: this.mode })))));
+            onInput: ev => this._onNativeInput(ev), ref: ref => (this._dateInputRef = ref), value: this._value && format(this._value, 'yyyy-MM-dd'), min: this.minDate && format(new Date(this.minDate), 'yyyy-MM-dd'), max: this.maxDate && format(new Date(this.maxDate), 'yyyy-MM-dd') })), h("div", { key: 'e9e200360461dc61f401c4bea89714a70964b6a5', slot: 'items' }, h("p-calendar", { key: '47460a7acb1369d29b325bb92f9d464f2504905e', 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, mode: this.mode })))));
     }
     documentClickHandler({ target }) {
         if (!this._showDropdown || childOf(target, this._el)) {

package/dist/collection/components/molecules/dropdown/dropdown.component.css

@@ -1 +1 @@
-*{box-sizing:border-box}.visible{visibility:visible!important}.static{position:static!important}.fixed{position:fixed!important}.absolute{position:absolute!important}.relative{position:relative!important}.z-dropdown{z-index:200!important}.flex{display:flex!important}.hidden{display:none!important}
+*{box-sizing:border-box}.visible{visibility:visible!important}.static{position:static!important}.fixed{position:fixed!important}.absolute{position:absolute!important}.relative{position:relative!important}.z-dropdown{z-index:200!important}.block{display:block!important}.hidden{display:none!important}

package/dist/collection/components/molecules/dropdown/dropdown.component.js

@@ -12,6 +12,7 @@ const dropdownContainerClass = cva(['z-dropdown hidden'], {
 });
 export class Dropdown {
     constructor() {
+        this.variant = 'default';
         this.placement = 'bottom-start';
         this.offset = 8;
         this.strategy = 'absolute';
@@ -55,6 +56,7 @@ export class Dropdown {
     }
     componentDidRender() {
         this._checkButtons();
+        this._checkItems();
     }
     render() {
         const dropdownContainerProps = {
@@ -69,12 +71,12 @@ export class Dropdown {
         };
         let dropdownContainer;
         if (this.usePortal) {
-            dropdownContainer = (h("p-portal", { key: '4ce9951ba9df565f0a3b482a34cb18e10ffa7dd3', ...dropdownContainerProps }, h("p-dropdown-menu-container", { key: '1b487d02d0a819f8cf41373e229361c7a0bbb6c0', maxWidth: !this.calculateWidth && this.applyMaxWidth, fullWidth: this.applyFullWidth && !this.applyMaxWidth, allowOverflow: this.allowOverflow, scrollable: this.scrollable }, h("slot", { key: '06aea6630be099ec81c99221aa13f637c5c4145b', name: 'items' }))));
+            dropdownContainer = (h("p-portal", { key: '2ef190e2cd48e5bb2c11ebb14dee78a2f00a10e9', ...dropdownContainerProps }, h("p-dropdown-menu-container", { key: '32a25346708daf087c4f63c3f3f8d68e2a3320f9', variant: this.variant, maxWidth: !this.calculateWidth && this.applyMaxWidth, fullWidth: this.applyFullWidth && !this.applyMaxWidth, allowOverflow: this.allowOverflow, scrollable: this.scrollable }, h("slot", { key: '165b0919ff2cae9b8f040d972b7fcae245341568', name: 'items' }))));
         }
         else {
-            dropdownContainer = (h("p-dropdown-menu-container", { key: 'a6c09ab73d9fecbf256c25a51bfd8f84649ac6ca', maxWidth: !this.calculateWidth && this.applyMaxWidth, fullWidth: this.applyFullWidth && !this.applyMaxWidth, allowOverflow: this.allowOverflow, scrollable: this.scrollable, ...dropdownContainerProps }, h("slot", { key: '00176ba6c4cccac8d18a35d50aa570da68b2c680', name: 'items' })));
+            dropdownContainer = (h("p-dropdown-menu-container", { key: '06169533cac303c1ad14f3eedd084120d0bc285d', variant: this.variant, maxWidth: !this.calculateWidth && this.applyMaxWidth, fullWidth: this.applyFullWidth && !this.applyMaxWidth, allowOverflow: this.allowOverflow, scrollable: this.scrollable, ...dropdownContainerProps }, h("slot", { key: 'f5e194cb30b783e4eacab149508adff0ed3a298e', name: 'items' })));
         }
-        return (h(Host, { key: '7e22ef22fc226b3e6d4981b71f782804de1d25d6', class: 'p-dropdown relative' }, h("div", { key: '46f0f7999a1a4581ee3e82be7d53c61adccb6874', class: 'trigger', ref: ref => (this._trigger = ref), onClick: () => this._triggerClickHandler() }, h("slot", { key: '745a38cf876df9da4198aa906b5f813ed14c3b4f', name: 'trigger' })), dropdownContainer));
+        return (h(Host, { key: 'a0a1de42bd08376b659cff117b25c43f417fd36e', class: 'p-dropdown relative' }, h("div", { key: 'ed7e4461a36af81c2e3928c9f8b243444782c793', class: 'trigger', ref: ref => (this._trigger = ref), onClick: () => this._triggerClickHandler() }, h("slot", { key: '26dd3a15c60b860c3cfe7dbac3c09976b62242c0', name: 'trigger' })), dropdownContainer));
     }
     _checkButtons(active = false) {
         if (!this.applyChevron) {
@@ -92,6 +94,12 @@ export class Dropdown {
             button.active = active;
         }
     }
+    _checkItems() {
+        const items = this._el.querySelectorAll('p-dropdown-menu-item');
+        for (let item of [...items]) {
+            item.variant = this.variant;
+        }
+    }
     onShowChange(show) {
         if (!this._loaded) {
             return;
@@ -147,7 +155,7 @@ export class Dropdown {
         this._cleanup = autoUpdate(this._el, this._menu, () => this._update());
         this._menu.setAttribute('data-show', '');
         this._menu.classList.remove('hidden');
-        this._menu.classList.add('flex');
+        this._menu.classList.add('block');
         this.isOpen.emit(true);
         this._checkButtons(true);
     }
@@ -161,7 +169,7 @@ export class Dropdown {
         }
         // Hide the popover
         this._menu.removeAttribute('data-show');
-        this._menu.classList.remove('flex');
+        this._menu.classList.remove('block');
         this._menu.classList.add('hidden');
         this.isOpen.emit(false);
         this._checkButtons(false);
@@ -195,6 +203,26 @@ export class Dropdown {
     }
     static get properties() {
         return {
+            "variant": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'default' | 'dark-teal'",
+                    "resolved": "\"dark-teal\" | \"default\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The variant of the dropdown"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "variant",
+                "reflect": false,
+                "defaultValue": "'default'"
+            },
             "placement": {
                 "type": "string",
                 "mutable": false,

package/dist/collection/components/molecules/dropdown/dropdown.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown.component.js","sourceRoot":"","sources":["../../../../src/components/molecules/dropdown/dropdown.component.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n\tautoUpdate,\n\tcomputePosition,\n\tflip,\n\toffset,\n\tPlacement,\n\tshift,\n\tStrategy,\n} from '@floating-ui/dom';\nimport {\n\tComponent,\n\tElement,\n\tEvent,\n\tEventEmitter,\n\th,\n\tHost,\n\tListen,\n\tProp,\n\tWatch,\n} from '@stencil/core';\nimport { cva } from 'class-variance-authority';\nimport { childOf } from '../../../utils/child-of';\n\nconst dropdownContainerClass = cva(['z-dropdown hidden'], {\n\tvariants: {\n\t\tstrategy: {\n\t\t\tabsolute: 'absolute',\n\t\t\tfixed: 'fixed',\n\t\t},\n\t},\n});\n\n@Component({\n\ttag: 'p-dropdown',\n\tstyleUrl: 'dropdown.component.css',\n})\nexport class Dropdown {\n\t/**\n\t * The content of the dropdown menu\n\t */\n\t@Prop({ reflect: true }) placement: Placement = 'bottom-start';\n\n\t/**\n\t * The offset of the dropdown menu\n\t */\n\t@Prop() offset: number = 8;\n\n\t/**\n\t * The strategy of the dropdown placement\n\t */\n\t@Prop() strategy: Strategy = 'absolute';\n\n\t/**\n\t * Wether to show the dropdown menu\n\t */\n\t@Prop() show: boolean = false;\n\n\t/**\n\t * Wether to use a portal for the dropdown container\n\t */\n\t@Prop() usePortal: boolean = false;\n\n\t/**\n\t * Wether to automatically calculate the width of the menu based on the trigger\n\t */\n\t@Prop() calculateWidth: boolean = false;\n\n\t/**\n\t * Wether to apply the max width\n\t */\n\t@Prop() applyMaxWidth: boolean = true;\n\n\t/**\n\t * Wether to apply the full width\n\t */\n\t@Prop() applyFullWidth: boolean = true;\n\n\t/**\n\t * Wether to allow overflow in the container\n\t */\n\t@Prop() allowOverflow: boolean = false;\n\n\t/**\n\t * Wether the dropdown container should be scrollable when the threshold is met.\n\t */\n\t@Prop() scrollable: boolean | 'default' | 'large' = false;\n\n\t/**\n\t * Wether to automatically close the dropdown menu after clicking inside\n\t */\n\t@Prop() insideClick: boolean = false;\n\n\t/**\n\t * Wether to automatically close the dropdown menu after clicking inside\n\t */\n\t@Prop() disableTriggerClick: boolean = false;\n\n\t/**\n\t * Wether to apply chevron automatically\n\t */\n\t@Prop() applyChevron: boolean = true;\n\n\t/**\n\t * Chevron position\n\t */\n\t@Prop() chevronPosition: 'start' | 'end' = 'end';\n\n\t/**\n\t * Chevron direction\n\t */\n\t@Prop() chevronDirection: 'up' | 'down';\n\n\t/**\n\t * The host element\n\t */\n\t@Element() private _el: HTMLElement;\n\n\t/**\n\t * Open change event\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tisOpen: EventEmitter<boolean>;\n\n\tprivate _loaded = false;\n\tprivate _trigger: HTMLElement;\n\tprivate _menu: HTMLElement;\n\tprivate _cleanup: () => void;\n\n\tcomponentShouldUpdate() {\n\t\tthis._update();\n\t}\n\n\tcomponentDidLoad() {\n\t\tthis._checkButtons();\n\t}\n\n\tdisconnectedCallback() {\n\t\tif (this._cleanup) {\n\t\t\tthis._cleanup();\n\t\t\tthis._cleanup = null;\n\t\t}\n\n\t\tthis._menu.remove();\n\t}\n\n\tcomponentDidRender() {\n\t\tthis._checkButtons();\n\t}\n\n\trender() {\n\t\tconst dropdownContainerProps = {\n\t\t\tclass: dropdownContainerClass({\n\t\t\t\tstrategy: this.strategy,\n\t\t\t}),\n\t\t\tref: el => this._load(el),\n\t\t\tonClick: () => this._containerClickHandler(),\n\t\t\trole: 'popover',\n\t\t\t'data-placement': this.placement,\n\t\t\t'data-strategy': this.strategy,\n\t\t};\n\n\t\tlet dropdownContainer: HTMLElement;\n\n\t\tif (this.usePortal) {\n\t\t\tdropdownContainer = (\n\t\t\t\t<p-portal {...dropdownContainerProps}>\n\t\t\t\t\t<p-dropdown-menu-container\n\t\t\t\t\t\tmaxWidth={!this.calculateWidth && this.applyMaxWidth}\n\t\t\t\t\t\tfullWidth={this.applyFullWidth && !this.applyMaxWidth}\n\t\t\t\t\t\tallowOverflow={this.allowOverflow}\n\t\t\t\t\t\tscrollable={this.scrollable}\n\t\t\t\t\t>\n\t\t\t\t\t\t<slot name='items' />\n\t\t\t\t\t</p-dropdown-menu-container>\n\t\t\t\t</p-portal>\n\t\t\t);\n\t\t} else {\n\t\t\tdropdownContainer = (\n\t\t\t\t<p-dropdown-menu-container\n\t\t\t\t\tmaxWidth={!this.calculateWidth && this.applyMaxWidth}\n\t\t\t\t\tfullWidth={this.applyFullWidth && !this.applyMaxWidth}\n\t\t\t\t\tallowOverflow={this.allowOverflow}\n\t\t\t\t\tscrollable={this.scrollable}\n\t\t\t\t\t{...dropdownContainerProps}\n\t\t\t\t>\n\t\t\t\t\t<slot name='items' />\n\t\t\t\t</p-dropdown-menu-container>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<Host class='p-dropdown relative'>\n\t\t\t\t<div\n\t\t\t\t\tclass='trigger'\n\t\t\t\t\tref={ref => (this._trigger = ref)}\n\t\t\t\t\tonClick={() => this._triggerClickHandler()}\n\t\t\t\t>\n\t\t\t\t\t<slot name='trigger' />\n\t\t\t\t</div>\n\t\t\t\t{dropdownContainer}\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate _checkButtons(active: boolean = false) {\n\t\tif (!this.applyChevron) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst buttons = this._el.querySelectorAll<HTMLPButtonElement>(\n\t\t\t'p-button[slot=\"trigger\"]'\n\t\t);\n\n\t\tfor (let button of [...buttons]) {\n\t\t\tbutton.chevronPosition = this.chevronPosition;\n\t\t\tbutton.chevron = this.chevronDirection\n\t\t\t\t? this.chevronDirection\n\t\t\t\t: this.placement.indexOf('top') >= 0\n\t\t\t\t? 'up'\n\t\t\t\t: 'down';\n\t\t\tbutton.disabled = this.disableTriggerClick;\n\t\t\tbutton.active = active;\n\t\t}\n\t}\n\n\t@Watch('show')\n\tprotected onShowChange(show) {\n\t\tif (!this._loaded) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (!show) {\n\t\t\tthis._hide();\n\t\t\treturn;\n\t\t}\n\n\t\tthis._show();\n\t}\n\n\t@Listen('click', { target: 'document', capture: true })\n\tprotected documentClickHandler({ target }) {\n\t\tif (!this._menu.hasAttribute('data-show') || childOf(target, this._menu)) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._hide();\n\t}\n\n\tprivate _containerClickHandler() {\n\t\tif (this.insideClick) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (this._menu.hasAttribute('data-show')) {\n\t\t\tthis._hide();\n\t\t}\n\t}\n\n\tprivate _triggerClickHandler() {\n\t\tif (this.disableTriggerClick) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (this._menu.hasAttribute('data-show')) {\n\t\t\tthis._hide();\n\t\t\treturn;\n\t\t}\n\n\t\tthis._show();\n\t}\n\n\tprivate _load(popover: HTMLElement) {\n\t\tthis._menu = popover;\n\t\tif (popover) {\n\t\t\tthis._update();\n\t\t\tthis._loaded = true;\n\n\t\t\tif (this.show) {\n\t\t\t\tsetTimeout(() => this._show(), 100);\n\t\t\t}\n\t\t}\n\t}\n\n\tprivate _show() {\n\t\tif (!this._loaded) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Make the popover visible\n\t\tif (this.calculateWidth) {\n\t\t\tthis._menu.style.width = `${this._trigger.clientWidth}px`;\n\t\t}\n\n\t\tthis._cleanup = autoUpdate(this._el, this._menu, () => this._update());\n\n\t\tthis._menu.setAttribute('data-show', '');\n\t\tthis._menu.classList.remove('hidden');\n\t\tthis._menu.classList.add('flex');\n\n\t\tthis.isOpen.emit(true);\n\t\tthis._checkButtons(true);\n\t}\n\n\tprivate _hide() {\n\t\tif (!this._loaded || this.show) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (this._cleanup) {\n\t\t\tthis._cleanup();\n\t\t\tthis._cleanup = null;\n\t\t}\n\n\t\t// Hide the popover\n\t\tthis._menu.removeAttribute('data-show');\n\t\tthis._menu.classList.remove('flex');\n\t\tthis._menu.classList.add('hidden');\n\n\t\tthis.isOpen.emit(false);\n\t\tthis._checkButtons(false);\n\t}\n\n\tprivate _update() {\n\t\tif (!this._menu) {\n\t\t\treturn;\n\t\t}\n\n\t\tcomputePosition(this._el, this._menu, {\n\t\t\tplacement: this.placement,\n\t\t\tstrategy: this.strategy,\n\t\t\tmiddleware: [offset(this.offset), flip(), shift()],\n\t\t}).then(({ x, y, placement }) => {\n\t\t\tthis._menu.dataset.placement = placement;\n\t\t\tObject.assign(this._menu.style, {\n\t\t\t\ttop: `${y}px`,\n\t\t\t\tleft: `${x}px`,\n\t\t\t});\n\t\t});\n\t}\n}\n"]}
+{"version":3,"file":"dropdown.component.js","sourceRoot":"","sources":["../../../../src/components/molecules/dropdown/dropdown.component.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n\tautoUpdate,\n\tcomputePosition,\n\tflip,\n\toffset,\n\tPlacement,\n\tshift,\n\tStrategy,\n} from '@floating-ui/dom';\nimport {\n\tComponent,\n\tElement,\n\tEvent,\n\tEventEmitter,\n\th,\n\tHost,\n\tListen,\n\tProp,\n\tWatch,\n} from '@stencil/core';\nimport { cva } from 'class-variance-authority';\nimport { childOf } from '../../../utils/child-of';\n\nconst dropdownContainerClass = cva(['z-dropdown hidden'], {\n\tvariants: {\n\t\tstrategy: {\n\t\t\tabsolute: 'absolute',\n\t\t\tfixed: 'fixed',\n\t\t},\n\t},\n});\n\n@Component({\n\ttag: 'p-dropdown',\n\tstyleUrl: 'dropdown.component.css',\n})\nexport class Dropdown {\n\t/**\n\t * The variant of the dropdown\n\t */\n\t@Prop() variant: 'default' | 'dark-teal' = 'default';\n\n\t/**\n\t * The content of the dropdown menu\n\t */\n\t@Prop({ reflect: true }) placement: Placement = 'bottom-start';\n\n\t/**\n\t * The offset of the dropdown menu\n\t */\n\t@Prop() offset: number = 8;\n\n\t/**\n\t * The strategy of the dropdown placement\n\t */\n\t@Prop() strategy: Strategy = 'absolute';\n\n\t/**\n\t * Wether to show the dropdown menu\n\t */\n\t@Prop() show: boolean = false;\n\n\t/**\n\t * Wether to use a portal for the dropdown container\n\t */\n\t@Prop() usePortal: boolean = false;\n\n\t/**\n\t * Wether to automatically calculate the width of the menu based on the trigger\n\t */\n\t@Prop() calculateWidth: boolean = false;\n\n\t/**\n\t * Wether to apply the max width\n\t */\n\t@Prop() applyMaxWidth: boolean = true;\n\n\t/**\n\t * Wether to apply the full width\n\t */\n\t@Prop() applyFullWidth: boolean = true;\n\n\t/**\n\t * Wether to allow overflow in the container\n\t */\n\t@Prop() allowOverflow: boolean = false;\n\n\t/**\n\t * Wether the dropdown container should be scrollable when the threshold is met.\n\t */\n\t@Prop() scrollable: boolean | 'default' | 'large' = false;\n\n\t/**\n\t * Wether to automatically close the dropdown menu after clicking inside\n\t */\n\t@Prop() insideClick: boolean = false;\n\n\t/**\n\t * Wether to automatically close the dropdown menu after clicking inside\n\t */\n\t@Prop() disableTriggerClick: boolean = false;\n\n\t/**\n\t * Wether to apply chevron automatically\n\t */\n\t@Prop() applyChevron: boolean = true;\n\n\t/**\n\t * Chevron position\n\t */\n\t@Prop() chevronPosition: 'start' | 'end' = 'end';\n\n\t/**\n\t * Chevron direction\n\t */\n\t@Prop() chevronDirection: 'up' | 'down';\n\n\t/**\n\t * The host element\n\t */\n\t@Element() private _el: HTMLElement;\n\n\t/**\n\t * Open change event\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tisOpen: EventEmitter<boolean>;\n\n\tprivate _loaded = false;\n\tprivate _trigger: HTMLElement;\n\tprivate _menu: HTMLElement;\n\tprivate _cleanup: () => void;\n\n\tcomponentShouldUpdate() {\n\t\tthis._update();\n\t}\n\n\tcomponentDidLoad() {\n\t\tthis._checkButtons();\n\t}\n\n\tdisconnectedCallback() {\n\t\tif (this._cleanup) {\n\t\t\tthis._cleanup();\n\t\t\tthis._cleanup = null;\n\t\t}\n\n\t\tthis._menu.remove();\n\t}\n\n\tcomponentDidRender() {\n\t\tthis._checkButtons();\n\t\tthis._checkItems();\n\t}\n\n\trender() {\n\t\tconst dropdownContainerProps = {\n\t\t\tclass: dropdownContainerClass({\n\t\t\t\tstrategy: this.strategy,\n\t\t\t}),\n\t\t\tref: el => this._load(el),\n\t\t\tonClick: () => this._containerClickHandler(),\n\t\t\trole: 'popover',\n\t\t\t'data-placement': this.placement,\n\t\t\t'data-strategy': this.strategy,\n\t\t};\n\n\t\tlet dropdownContainer: HTMLElement;\n\n\t\tif (this.usePortal) {\n\t\t\tdropdownContainer = (\n\t\t\t\t<p-portal {...dropdownContainerProps}>\n\t\t\t\t\t<p-dropdown-menu-container\n\t\t\t\t\t\tvariant={this.variant}\n\t\t\t\t\t\tmaxWidth={!this.calculateWidth && this.applyMaxWidth}\n\t\t\t\t\t\tfullWidth={this.applyFullWidth && !this.applyMaxWidth}\n\t\t\t\t\t\tallowOverflow={this.allowOverflow}\n\t\t\t\t\t\tscrollable={this.scrollable}\n\t\t\t\t\t>\n\t\t\t\t\t\t<slot name='items' />\n\t\t\t\t\t</p-dropdown-menu-container>\n\t\t\t\t</p-portal>\n\t\t\t);\n\t\t} else {\n\t\t\tdropdownContainer = (\n\t\t\t\t<p-dropdown-menu-container\n\t\t\t\t\tvariant={this.variant}\n\t\t\t\t\tmaxWidth={!this.calculateWidth && this.applyMaxWidth}\n\t\t\t\t\tfullWidth={this.applyFullWidth && !this.applyMaxWidth}\n\t\t\t\t\tallowOverflow={this.allowOverflow}\n\t\t\t\t\tscrollable={this.scrollable}\n\t\t\t\t\t{...dropdownContainerProps}\n\t\t\t\t>\n\t\t\t\t\t<slot name='items' />\n\t\t\t\t</p-dropdown-menu-container>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<Host class='p-dropdown relative'>\n\t\t\t\t<div\n\t\t\t\t\tclass='trigger'\n\t\t\t\t\tref={ref => (this._trigger = ref)}\n\t\t\t\t\tonClick={() => this._triggerClickHandler()}\n\t\t\t\t>\n\t\t\t\t\t<slot name='trigger' />\n\t\t\t\t</div>\n\t\t\t\t{dropdownContainer}\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate _checkButtons(active: boolean = false) {\n\t\tif (!this.applyChevron) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst buttons = this._el.querySelectorAll<HTMLPButtonElement>(\n\t\t\t'p-button[slot=\"trigger\"]'\n\t\t);\n\n\t\tfor (let button of [...buttons]) {\n\t\t\tbutton.chevronPosition = this.chevronPosition;\n\t\t\tbutton.chevron = this.chevronDirection\n\t\t\t\t? this.chevronDirection\n\t\t\t\t: this.placement.indexOf('top') >= 0\n\t\t\t\t? 'up'\n\t\t\t\t: 'down';\n\t\t\tbutton.disabled = this.disableTriggerClick;\n\t\t\tbutton.active = active;\n\t\t}\n\t}\n\n\tprivate _checkItems() {\n\t\tconst items = this._el.querySelectorAll<HTMLPDropdownMenuItemElement>(\n\t\t\t'p-dropdown-menu-item'\n\t\t);\n\n\t\tfor (let item of [...items]) {\n\t\t\titem.variant = this.variant;\n\t\t}\n\t}\n\n\t@Watch('show')\n\tprotected onShowChange(show) {\n\t\tif (!this._loaded) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (!show) {\n\t\t\tthis._hide();\n\t\t\treturn;\n\t\t}\n\n\t\tthis._show();\n\t}\n\n\t@Listen('click', { target: 'document', capture: true })\n\tprotected documentClickHandler({ target }) {\n\t\tif (!this._menu.hasAttribute('data-show') || childOf(target, this._menu)) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._hide();\n\t}\n\n\tprivate _containerClickHandler() {\n\t\tif (this.insideClick) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (this._menu.hasAttribute('data-show')) {\n\t\t\tthis._hide();\n\t\t}\n\t}\n\n\tprivate _triggerClickHandler() {\n\t\tif (this.disableTriggerClick) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (this._menu.hasAttribute('data-show')) {\n\t\t\tthis._hide();\n\t\t\treturn;\n\t\t}\n\n\t\tthis._show();\n\t}\n\n\tprivate _load(popover: HTMLElement) {\n\t\tthis._menu = popover;\n\t\tif (popover) {\n\t\t\tthis._update();\n\t\t\tthis._loaded = true;\n\n\t\t\tif (this.show) {\n\t\t\t\tsetTimeout(() => this._show(), 100);\n\t\t\t}\n\t\t}\n\t}\n\n\tprivate _show() {\n\t\tif (!this._loaded) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Make the popover visible\n\t\tif (this.calculateWidth) {\n\t\t\tthis._menu.style.width = `${this._trigger.clientWidth}px`;\n\t\t}\n\n\t\tthis._cleanup = autoUpdate(this._el, this._menu, () => this._update());\n\n\t\tthis._menu.setAttribute('data-show', '');\n\t\tthis._menu.classList.remove('hidden');\n\t\tthis._menu.classList.add('block');\n\n\t\tthis.isOpen.emit(true);\n\t\tthis._checkButtons(true);\n\t}\n\n\tprivate _hide() {\n\t\tif (!this._loaded || this.show) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (this._cleanup) {\n\t\t\tthis._cleanup();\n\t\t\tthis._cleanup = null;\n\t\t}\n\n\t\t// Hide the popover\n\t\tthis._menu.removeAttribute('data-show');\n\t\tthis._menu.classList.remove('block');\n\t\tthis._menu.classList.add('hidden');\n\n\t\tthis.isOpen.emit(false);\n\t\tthis._checkButtons(false);\n\t}\n\n\tprivate _update() {\n\t\tif (!this._menu) {\n\t\t\treturn;\n\t\t}\n\n\t\tcomputePosition(this._el, this._menu, {\n\t\t\tplacement: this.placement,\n\t\t\tstrategy: this.strategy,\n\t\t\tmiddleware: [offset(this.offset), flip(), shift()],\n\t\t}).then(({ x, y, placement }) => {\n\t\t\tthis._menu.dataset.placement = placement;\n\t\t\tObject.assign(this._menu.style, {\n\t\t\t\ttop: `${y}px`,\n\t\t\t\tleft: `${x}px`,\n\t\t\t});\n\t\t});\n\t}\n}\n"]}