@paperless/core 0.1.0-alpha.420 → 0.1.0-alpha.422

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

@@ -1,11 +1,11 @@
-import { createPopper } from '@popperjs/core';
+import { autoUpdate, computePosition, flip, offset, shift, } from '@floating-ui/dom';
 import { h, Host, } from '@stencil/core';
 import { childOf } from '../../../utils/child-of';
 export class Dropdown {
   constructor() {
     this._loaded = false;
     this.placement = 'bottom-start';
-    this.strategy = 'absolute';
+    this.strategy = 'fixed';
     this.show = false;
     this.calculateWidth = false;
     this.applyMaxWidth = true;
@@ -16,10 +16,16 @@ export class Dropdown {
     this.chevronDirection = undefined;
   }
   componentShouldUpdate() {
-    this._setOptions();
+    this._update();
+  }
+  disconnectedCallback() {
+    if (this._cleanup) {
+      this._cleanup();
+      this._cleanup = null;
+    }
   }
   render() {
-    return (h(Host, { class: "p-dropdown" }, h("div", { class: "trigger", ref: (ref) => (this._trigger = ref), onClick: () => this._triggerClickHandler() }, h("slot", { onSlotchange: (ev) => this._checkButton(ev), name: "trigger" })), h("p-dropdown-menu-container", { role: "popover", maxWidth: !this.calculateWidth && this.applyMaxWidth, fullWidth: this.applyFullWidth && !this.applyMaxWidth, ref: (el) => this._load(el), onClick: () => this._containerClickHandler() }, h("slot", { name: "items" }))));
+    return (h(Host, { class: "p-dropdown" }, h("div", { class: "trigger", ref: (ref) => (this._trigger = ref), onClick: () => this._triggerClickHandler() }, h("slot", { onSlotchange: (ev) => this._checkButton(ev), name: "trigger" })), h("p-dropdown-menu-container", { role: "popover", maxWidth: !this.calculateWidth && this.applyMaxWidth, fullWidth: this.applyFullWidth && !this.applyMaxWidth, ref: (el) => this._load(el), "data-placement": this.placement, "data-strategy": this.strategy, onClick: () => this._containerClickHandler() }, h("slot", { name: "items" }))));
   }
   _checkButton({ target }) {
     const slot = target;
@@ -73,32 +79,13 @@ export class Dropdown {
   _load(popover) {
     this._menu = popover;
     if (popover) {
-      this._popper = createPopper(this._el, popover, {
-        strategy: this.strategy,
-      });
-      this._setOptions();
+      this._update();
       this._loaded = true;
       if (this.show) {
         setTimeout(() => this._show(), 100);
       }
     }
   }
-  _setOptions() {
-    if (!this._popper) {
-      return;
-    }
-    this._popper.setOptions({
-      placement: this.placement,
-      modifiers: [
-        {
-          name: 'offset',
-          options: {
-            offset: [0, 8],
-          },
-        },
-      ],
-    });
-  }
   _show() {
     if (!this._loaded) {
       return;
@@ -107,28 +94,39 @@ export class Dropdown {
     if (this.calculateWidth) {
       this._menu.style.width = `${this._trigger.clientWidth}px`;
     }
+    this._cleanup = autoUpdate(this._el, this._menu, () => this._update());
     this._menu.setAttribute('data-show', '');
     this.isOpen.emit(true);
-    // Enable the event listeners
-    this._popper.setOptions((options) => (Object.assign(Object.assign({}, options), { modifiers: [
-        ...options.modifiers,
-        { name: 'eventListeners', enabled: true },
-      ] })));
-    // Update its position
-    this._popper.update();
   }
   _hide() {
     if (!this._loaded || this.show) {
       return;
     }
+    if (this._cleanup) {
+      this._cleanup();
+      this._cleanup = null;
+    }
     // Hide the popover
     this._menu.removeAttribute('data-show');
     this.isOpen.emit(false);
-    // Disable the event listeners
-    this._popper.setOptions((options) => (Object.assign(Object.assign({}, options), { modifiers: [
-        ...options.modifiers,
-        { name: 'eventListeners', enabled: false },
-      ] })));
+  }
+  _update() {
+    if (!this._menu) {
+      return;
+    }
+    computePosition(this._el, this._menu, {
+      placement: this.placement,
+      strategy: this.strategy,
+      // Try removing the arrow middleware. The arrow will no
+      // longer be centered to the reference element.
+      middleware: [offset(8), flip(), shift()],
+    }).then(({ x, y, placement }) => {
+      this._menu.dataset.placement = placement;
+      Object.assign(this._menu.style, {
+        top: `${y}px`,
+        left: `${x}px`,
+      });
+    });
   }
   static get is() { return "p-dropdown"; }
   static get encapsulation() { return "shadow"; }
@@ -149,11 +147,11 @@ export class Dropdown {
         "mutable": false,
         "complexType": {
           "original": "Placement",
-          "resolved": "\"auto\" | \"auto-end\" | \"auto-start\" | \"bottom\" | \"bottom-end\" | \"bottom-start\" | \"left\" | \"left-end\" | \"left-start\" | \"right\" | \"right-end\" | \"right-start\" | \"top\" | \"top-end\" | \"top-start\"",
+          "resolved": "\"bottom\" | \"bottom-end\" | \"bottom-start\" | \"left\" | \"left-end\" | \"left-start\" | \"right\" | \"right-end\" | \"right-start\" | \"top\" | \"top-end\" | \"top-start\"",
           "references": {
             "Placement": {
               "location": "import",
-              "path": "@popperjs/core"
+              "path": "@floating-ui/dom"
             }
           }
         },
@@ -171,12 +169,12 @@ export class Dropdown {
         "type": "string",
         "mutable": false,
         "complexType": {
-          "original": "PositioningStrategy",
+          "original": "Strategy",
           "resolved": "\"absolute\" | \"fixed\"",
           "references": {
-            "PositioningStrategy": {
+            "Strategy": {
               "location": "import",
-              "path": "@popperjs/core"
+              "path": "@floating-ui/dom"
             }
           }
         },
@@ -188,7 +186,7 @@ export class Dropdown {
         },
         "attribute": "strategy",
         "reflect": false,
-        "defaultValue": "'absolute'"
+        "defaultValue": "'fixed'"
       },
       "show": {
         "type": "boolean",

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 { createPopper, Placement, PositioningStrategy } from '@popperjs/core';\nimport {\n    Component,\n    Element,\n    Event,\n    EventEmitter,\n    h,\n    Host,\n    Listen,\n    Prop,\n    Watch,\n} from '@stencil/core';\nimport { childOf } from '../../../utils/child-of';\n\n@Component({\n    tag: 'p-dropdown',\n    styleUrl: 'dropdown.component.scss',\n    shadow: true,\n})\nexport class Dropdown {\n    /**\n     * The content of the dropdown menu\n     */\n    @Prop({ reflect: true }) placement: Placement = 'bottom-start';\n\n    /**\n     * The strategy of the popover placement\n     */\n    @Prop() strategy: PositioningStrategy = 'absolute';\n\n    /**\n     * Wether to show the dropdown menu\n     */\n    @Prop() show: boolean = false;\n\n    /**\n     * Wether to automatically calculate the width of the menu based on the trigger\n     */\n    @Prop() calculateWidth: boolean = false;\n\n    /**\n     * Wether to apply the max width\n     */\n    @Prop() applyMaxWidth: boolean = true;\n\n    /**\n     * Wether to apply the full width\n     */\n    @Prop() applyFullWidth: boolean = true;\n\n    /**\n     * Wether to automatically close the dropdown menu after clicking inside\n     */\n    @Prop() insideClick: boolean = false;\n\n    /**\n     * Wether to automatically close the dropdown menu after clicking inside\n     */\n    @Prop() disableTriggerClick: boolean = false;\n\n    /**\n     * Chevron position\n     */\n    @Prop() chevronPosition: 'start' | 'end' = 'end';\n\n    /**\n     * Chevron direction\n     */\n    @Prop() chevronDirection: 'up' | 'down';\n\n    /**\n     * The host element\n     */\n    @Element() private _el: HTMLElement;\n\n    /**\n     * Open change event\n     */\n    @Event() isOpen: EventEmitter<boolean>;\n\n    private _loaded = false;\n    private _popper: any;\n    private _trigger: HTMLElement;\n    private _menu: HTMLElement;\n\n    componentShouldUpdate() {\n        this._setOptions();\n    }\n\n    render() {\n        return (\n            <Host class=\"p-dropdown\">\n                <div\n                    class=\"trigger\"\n                    ref={(ref) => (this._trigger = ref)}\n                    onClick={() => this._triggerClickHandler()}\n                >\n                    <slot\n                        onSlotchange={(ev) => this._checkButton(ev)}\n                        name=\"trigger\"\n                    />\n                </div>\n                <p-dropdown-menu-container\n                    role=\"popover\"\n                    maxWidth={!this.calculateWidth && this.applyMaxWidth}\n                    fullWidth={this.applyFullWidth && !this.applyMaxWidth}\n                    ref={(el) => this._load(el)}\n                    onClick={() => this._containerClickHandler()}\n                >\n                    <slot name=\"items\" />\n                </p-dropdown-menu-container>\n            </Host>\n        );\n    }\n\n    private _checkButton({ target }: Event) {\n        const slot = target as HTMLSlotElement;\n        const children = slot.assignedElements();\n\n        for (let child of children) {\n            if (child.nodeName === 'P-BUTTON') {\n                (child as any).chevronPosition = this.chevronPosition;\n                (child as any).chevron = this.chevronDirection\n                    ? this.chevronDirection\n                    : this.placement.indexOf('top') >= 0\n                    ? 'up'\n                    : 'down';\n            }\n        }\n    }\n\n    @Watch('show')\n    protected onShowChange(show) {\n        if (!this._loaded) {\n            return;\n        }\n\n        if (!show) {\n            this._hide();\n            return;\n        }\n\n        this._show();\n    }\n\n    @Listen('click', { target: 'document', capture: true })\n    protected documentClickHandler({ target }) {\n        if (\n            !this._menu.hasAttribute('data-show') ||\n            childOf(target, this._el)\n        ) {\n            return;\n        }\n\n        this._hide();\n    }\n\n    private _containerClickHandler() {\n        if (this.insideClick) {\n            return;\n        }\n\n        if (this._menu.hasAttribute('data-show')) {\n            this._hide();\n        }\n    }\n\n    private _triggerClickHandler() {\n        if (this.disableTriggerClick) {\n            return;\n        }\n\n        if (this._menu.hasAttribute('data-show')) {\n            this._hide();\n            return;\n        }\n\n        this._show();\n    }\n\n    private _load(popover: HTMLElement) {\n        this._menu = popover;\n        if (popover) {\n            this._popper = createPopper(this._el, popover, {\n                strategy: this.strategy,\n            });\n\n            this._setOptions();\n            this._loaded = true;\n\n            if (this.show) {\n                setTimeout(() => this._show(), 100);\n            }\n        }\n    }\n\n    private _setOptions() {\n        if (!this._popper) {\n            return;\n        }\n\n        this._popper.setOptions({\n            placement: this.placement,\n            modifiers: [\n                {\n                    name: 'offset',\n                    options: {\n                        offset: [0, 8],\n                    },\n                },\n            ],\n        });\n    }\n\n    private _show() {\n        if (!this._loaded) {\n            return;\n        }\n\n        // Make the popover visible\n        if (this.calculateWidth) {\n            this._menu.style.width = `${this._trigger.clientWidth}px`;\n        }\n\n        this._menu.setAttribute('data-show', '');\n        this.isOpen.emit(true);\n\n        // Enable the event listeners\n        this._popper.setOptions((options) => ({\n            ...options,\n            modifiers: [\n                ...options.modifiers,\n                { name: 'eventListeners', enabled: true },\n            ],\n        }));\n\n        // Update its position\n        this._popper.update();\n    }\n\n    private _hide() {\n        if (!this._loaded || this.show) {\n            return;\n        }\n\n        // Hide the popover\n        this._menu.removeAttribute('data-show');\n        this.isOpen.emit(false);\n\n        // Disable the event listeners\n        this._popper.setOptions((options) => ({\n            ...options,\n            modifiers: [\n                ...options.modifiers,\n                { name: 'eventListeners', enabled: false },\n            ],\n        }));\n    }\n}\n"]}
+{"version":3,"file":"dropdown.component.js","sourceRoot":"","sources":["../../../../src/components/molecules/dropdown/dropdown.component.tsx"],"names":[],"mappings":"AAAA,OAAO,EACH,UAAU,EACV,eAAe,EACf,IAAI,EACJ,MAAM,EAEN,KAAK,GAER,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EACH,SAAS,EACT,OAAO,EACP,KAAK,EAEL,CAAC,EACD,IAAI,EACJ,MAAM,EACN,IAAI,EACJ,KAAK,GACR,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAOlD,MAAM,OAAO,QAAQ;;IA6DT,YAAO,GAAG,KAAK,CAAC;qBAzDwB,cAAc;oBAKjC,OAAO;gBAKZ,KAAK;0BAKK,KAAK;yBAKN,IAAI;0BAKH,IAAI;uBAKP,KAAK;+BAKG,KAAK;2BAKD,KAAK;;;EAsBhD,qBAAqB;IACjB,IAAI,CAAC,OAAO,EAAE,CAAC;EACnB,CAAC;EAED,oBAAoB;IAChB,IAAI,IAAI,CAAC,QAAQ,EAAE;MACf,IAAI,CAAC,QAAQ,EAAE,CAAC;MAChB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;KACxB;EACL,CAAC;EAED,MAAM;IACF,OAAO,CACH,EAAC,IAAI,IAAC,KAAK,EAAC,YAAY;MACpB,WACI,KAAK,EAAC,SAAS,EACf,GAAG,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,GAAG,GAAG,CAAC,EACnC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,oBAAoB,EAAE;QAE1C,YACI,YAAY,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,EAAE,CAAC,EAC3C,IAAI,EAAC,SAAS,GAChB,CACA;MACN,iCACI,IAAI,EAAC,SAAS,EACd,QAAQ,EAAE,CAAC,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,aAAa,EACpD,SAAS,EAAE,IAAI,CAAC,cAAc,IAAI,CAAC,IAAI,CAAC,aAAa,EACrD,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,oBACX,IAAI,CAAC,SAAS,mBACf,IAAI,CAAC,QAAQ,EAC5B,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,sBAAsB,EAAE;QAE5C,YAAM,IAAI,EAAC,OAAO,GAAG,CACG,CACzB,CACV,CAAC;EACN,CAAC;EAEO,YAAY,CAAC,EAAE,MAAM,EAAS;IAClC,MAAM,IAAI,GAAG,MAAyB,CAAC;IACvC,MAAM,QAAQ,GAAG,IAAI,CAAC,gBAAgB,EAAE,CAAC;IAEzC,KAAK,IAAI,KAAK,IAAI,QAAQ,EAAE;MACxB,IAAI,KAAK,CAAC,QAAQ,KAAK,UAAU,EAAE;QAC9B,KAAa,CAAC,eAAe,GAAG,IAAI,CAAC,eAAe,CAAC;QACrD,KAAa,CAAC,OAAO,GAAG,IAAI,CAAC,gBAAgB;UAC1C,CAAC,CAAC,IAAI,CAAC,gBAAgB;UACvB,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC;YACpC,CAAC,CAAC,IAAI;YACN,CAAC,CAAC,MAAM,CAAC;OAChB;KACJ;EACL,CAAC;EAGS,YAAY,CAAC,IAAI;IACvB,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE;MACf,OAAO;KACV;IAED,IAAI,CAAC,IAAI,EAAE;MACP,IAAI,CAAC,KAAK,EAAE,CAAC;MACb,OAAO;KACV;IAED,IAAI,CAAC,KAAK,EAAE,CAAC;EACjB,CAAC;EAGS,oBAAoB,CAAC,EAAE,MAAM,EAAE;IACrC,IACI,CAAC,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,WAAW,CAAC;MACrC,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC,GAAG,CAAC,EAC3B;MACE,OAAO;KACV;IAED,IAAI,CAAC,KAAK,EAAE,CAAC;EACjB,CAAC;EAEO,sBAAsB;IAC1B,IAAI,IAAI,CAAC,WAAW,EAAE;MAClB,OAAO;KACV;IAED,IAAI,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,WAAW,CAAC,EAAE;MACtC,IAAI,CAAC,KAAK,EAAE,CAAC;KAChB;EACL,CAAC;EAEO,oBAAoB;IACxB,IAAI,IAAI,CAAC,mBAAmB,EAAE;MAC1B,OAAO;KACV;IAED,IAAI,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,WAAW,CAAC,EAAE;MACtC,IAAI,CAAC,KAAK,EAAE,CAAC;MACb,OAAO;KACV;IAED,IAAI,CAAC,KAAK,EAAE,CAAC;EACjB,CAAC;EAEO,KAAK,CAAC,OAAoB;IAC9B,IAAI,CAAC,KAAK,GAAG,OAAO,CAAC;IACrB,IAAI,OAAO,EAAE;MACT,IAAI,CAAC,OAAO,EAAE,CAAC;MACf,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;MAEpB,IAAI,IAAI,CAAC,IAAI,EAAE;QACX,UAAU,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK,EAAE,EAAE,GAAG,CAAC,CAAC;OACvC;KACJ;EACL,CAAC;EAEO,KAAK;IACT,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE;MACf,OAAO;KACV;IAED,2BAA2B;IAC3B,IAAI,IAAI,CAAC,cAAc,EAAE;MACrB,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,GAAG,GAAG,IAAI,CAAC,QAAQ,CAAC,WAAW,IAAI,CAAC;KAC7D;IAED,IAAI,CAAC,QAAQ,GAAG,UAAU,CAAC,IAAI,CAAC,GAAG,EAAE,IAAI,CAAC,KAAK,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,OAAO,EAAE,CAAC,CAAC;IAEvE,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,WAAW,EAAE,EAAE,CAAC,CAAC;IACzC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;EAC3B,CAAC;EAEO,KAAK;IACT,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,IAAI,EAAE;MAC5B,OAAO;KACV;IAED,IAAI,IAAI,CAAC,QAAQ,EAAE;MACf,IAAI,CAAC,QAAQ,EAAE,CAAC;MAChB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;KACxB;IAED,mBAAmB;IACnB,IAAI,CAAC,KAAK,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;IACxC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;EAC5B,CAAC;EAEO,OAAO;IACX,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;MACb,OAAO;KACV;IAED,eAAe,CAAC,IAAI,CAAC,GAAG,EAAE,IAAI,CAAC,KAAK,EAAE;MAClC,SAAS,EAAE,IAAI,CAAC,SAAS;MACzB,QAAQ,EAAE,IAAI,CAAC,QAAQ;MACvB,uDAAuD;MACvD,+CAA+C;MAC/C,UAAU,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,EAAE,KAAK,EAAE,CAAC;KAC3C,CAAC,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,SAAS,EAAE,EAAE,EAAE;MAC5B,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,SAAS,GAAG,SAAS,CAAC;MACzC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE;QAC5B,GAAG,EAAE,GAAG,CAAC,IAAI;QACb,IAAI,EAAE,GAAG,CAAC,IAAI;OACjB,CAAC,CAAC;IACP,CAAC,CAAC,CAAC;EACP,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import {\n    autoUpdate,\n    computePosition,\n    flip,\n    offset,\n    Placement,\n    shift,\n    Strategy,\n} from '@floating-ui/dom';\nimport {\n    Component,\n    Element,\n    Event,\n    EventEmitter,\n    h,\n    Host,\n    Listen,\n    Prop,\n    Watch,\n} from '@stencil/core';\nimport { childOf } from '../../../utils/child-of';\n\n@Component({\n    tag: 'p-dropdown',\n    styleUrl: 'dropdown.component.scss',\n    shadow: true,\n})\nexport class Dropdown {\n    /**\n     * The content of the dropdown menu\n     */\n    @Prop({ reflect: true }) placement: Placement = 'bottom-start';\n\n    /**\n     * The strategy of the popover placement\n     */\n    @Prop() strategy: Strategy = 'fixed';\n\n    /**\n     * Wether to show the dropdown menu\n     */\n    @Prop() show: boolean = false;\n\n    /**\n     * Wether to automatically calculate the width of the menu based on the trigger\n     */\n    @Prop() calculateWidth: boolean = false;\n\n    /**\n     * Wether to apply the max width\n     */\n    @Prop() applyMaxWidth: boolean = true;\n\n    /**\n     * Wether to apply the full width\n     */\n    @Prop() applyFullWidth: boolean = true;\n\n    /**\n     * Wether to automatically close the dropdown menu after clicking inside\n     */\n    @Prop() insideClick: boolean = false;\n\n    /**\n     * Wether to automatically close the dropdown menu after clicking inside\n     */\n    @Prop() disableTriggerClick: boolean = false;\n\n    /**\n     * Chevron position\n     */\n    @Prop() chevronPosition: 'start' | 'end' = 'end';\n\n    /**\n     * Chevron direction\n     */\n    @Prop() chevronDirection: 'up' | 'down';\n\n    /**\n     * The host element\n     */\n    @Element() private _el: HTMLElement;\n\n    /**\n     * Open change event\n     */\n    @Event() isOpen: EventEmitter<boolean>;\n\n    private _loaded = false;\n    private _trigger: HTMLElement;\n    private _menu: HTMLElement;\n    private _cleanup: () => void;\n\n    componentShouldUpdate() {\n        this._update();\n    }\n\n    disconnectedCallback() {\n        if (this._cleanup) {\n            this._cleanup();\n            this._cleanup = null;\n        }\n    }\n\n    render() {\n        return (\n            <Host class=\"p-dropdown\">\n                <div\n                    class=\"trigger\"\n                    ref={(ref) => (this._trigger = ref)}\n                    onClick={() => this._triggerClickHandler()}\n                >\n                    <slot\n                        onSlotchange={(ev) => this._checkButton(ev)}\n                        name=\"trigger\"\n                    />\n                </div>\n                <p-dropdown-menu-container\n                    role=\"popover\"\n                    maxWidth={!this.calculateWidth && this.applyMaxWidth}\n                    fullWidth={this.applyFullWidth && !this.applyMaxWidth}\n                    ref={(el) => this._load(el)}\n                    data-placement={this.placement}\n                    data-strategy={this.strategy}\n                    onClick={() => this._containerClickHandler()}\n                >\n                    <slot name=\"items\" />\n                </p-dropdown-menu-container>\n            </Host>\n        );\n    }\n\n    private _checkButton({ target }: Event) {\n        const slot = target as HTMLSlotElement;\n        const children = slot.assignedElements();\n\n        for (let child of children) {\n            if (child.nodeName === 'P-BUTTON') {\n                (child as any).chevronPosition = this.chevronPosition;\n                (child as any).chevron = this.chevronDirection\n                    ? this.chevronDirection\n                    : this.placement.indexOf('top') >= 0\n                    ? 'up'\n                    : 'down';\n            }\n        }\n    }\n\n    @Watch('show')\n    protected onShowChange(show) {\n        if (!this._loaded) {\n            return;\n        }\n\n        if (!show) {\n            this._hide();\n            return;\n        }\n\n        this._show();\n    }\n\n    @Listen('click', { target: 'document', capture: true })\n    protected documentClickHandler({ target }) {\n        if (\n            !this._menu.hasAttribute('data-show') ||\n            childOf(target, this._el)\n        ) {\n            return;\n        }\n\n        this._hide();\n    }\n\n    private _containerClickHandler() {\n        if (this.insideClick) {\n            return;\n        }\n\n        if (this._menu.hasAttribute('data-show')) {\n            this._hide();\n        }\n    }\n\n    private _triggerClickHandler() {\n        if (this.disableTriggerClick) {\n            return;\n        }\n\n        if (this._menu.hasAttribute('data-show')) {\n            this._hide();\n            return;\n        }\n\n        this._show();\n    }\n\n    private _load(popover: HTMLElement) {\n        this._menu = popover;\n        if (popover) {\n            this._update();\n            this._loaded = true;\n\n            if (this.show) {\n                setTimeout(() => this._show(), 100);\n            }\n        }\n    }\n\n    private _show() {\n        if (!this._loaded) {\n            return;\n        }\n\n        // Make the popover visible\n        if (this.calculateWidth) {\n            this._menu.style.width = `${this._trigger.clientWidth}px`;\n        }\n\n        this._cleanup = autoUpdate(this._el, this._menu, () => this._update());\n\n        this._menu.setAttribute('data-show', '');\n        this.isOpen.emit(true);\n    }\n\n    private _hide() {\n        if (!this._loaded || this.show) {\n            return;\n        }\n\n        if (this._cleanup) {\n            this._cleanup();\n            this._cleanup = null;\n        }\n\n        // Hide the popover\n        this._menu.removeAttribute('data-show');\n        this.isOpen.emit(false);\n    }\n\n    private _update() {\n        if (!this._menu) {\n            return;\n        }\n\n        computePosition(this._el, this._menu, {\n            placement: this.placement,\n            strategy: this.strategy,\n            // Try removing the arrow middleware. The arrow will no\n            // longer be centered to the reference element.\n            middleware: [offset(8), flip(), shift()],\n        }).then(({ x, y, placement }) => {\n            this._menu.dataset.placement = placement;\n            Object.assign(this._menu.style, {\n                top: `${y}px`,\n                left: `${x}px`,\n            });\n        });\n    }\n}\n"]}

package/dist/collection/components/molecules/input-group/input-group.component.css

@@ -1 +1 @@
-.mb-\[2px\]{margin-bottom:2px!important}.flex{display:flex!important}.h-10{height:2.5rem!important}.h-8{height:2rem!important}.w-full{width:100%!important}.flex-1{flex:1 1 0%!important}.flex-col{flex-direction:column!important}.items-end{align-items:flex-end!important}.items-center{align-items:center!important}.gap-2{gap:.5rem!important}.rounded-bl-none{border-bottom-left-radius:0!important}.rounded-br-none{border-bottom-right-radius:0!important}.rounded-tl-none{border-top-left-radius:0!important}.rounded-tr-none{border-top-right-radius:0!important}.border-b{border-bottom-width:1px!important}.border-l-0{border-left-width:0!important}.border-r{border-right-width:1px!important}.border-r-0{border-right-width:0!important}.border-t{border-top-width:1px!important}.border-solid{border-style:solid!important}.border-indigo{--tw-border-opacity:1!important;border-color:rgb(82 138 250/var(--tw-border-opacity))!important}.border-mystic-dark{--tw-border-opacity:1!important;border-color:rgb(218 230 240/var(--tw-border-opacity))!important}.border-negative{--tw-border-opacity:1!important;border-color:rgb(185 30 40/var(--tw-border-opacity))!important}.bg-white{--tw-bg-opacity:1!important;background-color:rgb(255 255 255/var(--tw-bg-opacity))!important}.pl-0{padding-left:0!important}.pr-0{padding-right:0!important}.text-base{font-size:1rem!important;line-height:1.5rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.font-semibold{font-weight:600!important}.uppercase{text-transform:uppercase!important}.tracking-wider{letter-spacing:.05em!important}.text-storm{--tw-text-opacity:1!important;color:rgb(81 83 107/var(--tw-text-opacity))!important}.text-storm-vague{--tw-text-opacity:1!important;color:rgb(152 154 183/var(--tw-text-opacity))!important}.outline-none{outline:2px solid transparent!important;outline-offset:2px!important}*{box-sizing:border-box}:host{display:flex;flex-direction:column;outline:2px solid transparent!important;outline-offset:2px!important;width:100%}:host .input-label{--tw-text-opacity:1;color:rgb(152 154 183/var(--tw-text-opacity));font-size:.75rem;font-weight:600;letter-spacing:.05em;line-height:1rem;margin-bottom:2px;text-transform:uppercase}:host .input-header{align-items:flex-end;display:flex;gap:.5rem;margin-bottom:2px}:host .content{display:flex}:host .content .prefix,:host .content .suffix{--tw-bg-opacity:1;--tw-border-opacity:1!important;--tw-text-opacity:1;align-items:center;background-color:rgb(255 255 255/var(--tw-bg-opacity));border-color:rgb(218 230 240/var(--tw-border-opacity))!important;border-radius:.375rem;border-style:solid!important;border-width:1px;box-sizing:border-box;color:rgb(39 40 56/var(--tw-text-opacity));color:rgb(81 83 107/var(--tw-text-opacity));display:flex;flex:1 1 0%;font-size:1rem;height:2.5rem;justify-content:flex-start;line-height:1.5rem;outline:2px solid transparent!important;outline-offset:2px!important;padding-left:1rem;padding-right:1rem;width:100%}:host .content .prefix::-moz-placeholder,:host .content .suffix::-moz-placeholder{--tw-text-opacity:1;color:rgb(128 130 158/var(--tw-text-opacity));font-size:1rem;line-height:1.5rem}:host .content .prefix::placeholder,:host .content .suffix::placeholder{--tw-text-opacity:1;color:rgb(128 130 158/var(--tw-text-opacity));font-size:1rem;line-height:1.5rem}:host .content .prefix.active,:host .content .prefix.focus,:host .content .prefix:focus,:host .content .prefix:focus-visible,:host .content .prefix:focus-within,:host .content .prefix[active],:host .content .suffix.active,:host .content .suffix.focus,:host .content .suffix:focus,:host .content .suffix:focus-visible,:host .content .suffix:focus-within,:host .content .suffix[active]{--tw-border-opacity:1!important;border-color:rgb(82 138 250/var(--tw-border-opacity))!important;outline:2px solid transparent!important;outline-offset:2px!important}:host .content .prefix.size-small,:host .content .suffix.size-small{font-size:.875rem;height:2rem;line-height:1.25rem}:host .content .prefix{border-bottom-right-radius:0;border-right-width:0!important;border-top-right-radius:0;order:1;padding-right:.5rem}:host .content .suffix{border-bottom-left-radius:0;border-left-width:0!important;border-top-left-radius:0;order:3;padding-left:.5rem}:host .content ::slotted(input[type=date].p-input),:host .content ::slotted(input[type=datetime-local].p-input),:host .content ::slotted(input[type=email].p-input),:host .content ::slotted(input[type=month].p-input),:host .content ::slotted(input[type=number].p-input),:host .content ::slotted(input[type=password].p-input),:host .content ::slotted(input[type=tel].p-input),:host .content ::slotted(input[type=text].p-input),:host .content ::slotted(input[type=time].p-input){--tw-text-opacity:1;--tw-bg-opacity:1;--tw-border-opacity:1!important;align-items:center;background-color:rgb(255 255 255/var(--tw-bg-opacity));border-color:rgb(218 230 240/var(--tw-border-opacity))!important;border-radius:.375rem;border-style:solid!important;border-width:1px;color:rgb(39 40 56/var(--tw-text-opacity));display:flex;font-size:1rem;height:2.5rem;justify-content:flex-start;line-height:1.5rem;order:2;outline:2px solid transparent!important;outline-offset:2px!important;padding-left:1rem;padding-right:1rem;width:100%}:host .content ::slotted(input[type=date].p-input)::-moz-placeholder,:host .content ::slotted(input[type=datetime-local].p-input)::-moz-placeholder,:host .content ::slotted(input[type=email].p-input)::-moz-placeholder,:host .content ::slotted(input[type=month].p-input)::-moz-placeholder,:host .content ::slotted(input[type=number].p-input)::-moz-placeholder,:host .content ::slotted(input[type=password].p-input)::-moz-placeholder,:host .content ::slotted(input[type=tel].p-input)::-moz-placeholder,:host .content ::slotted(input[type=text].p-input)::-moz-placeholder,:host .content ::slotted(input[type=time].p-input)::-moz-placeholder{--tw-text-opacity:1;color:rgb(128 130 158/var(--tw-text-opacity));font-size:1rem;line-height:1.5rem}:host .content ::slotted(input[type=date].p-input)::placeholder,:host .content ::slotted(input[type=datetime-local].p-input)::placeholder,:host .content ::slotted(input[type=email].p-input)::placeholder,:host .content ::slotted(input[type=month].p-input)::placeholder,:host .content ::slotted(input[type=number].p-input)::placeholder,:host .content ::slotted(input[type=password].p-input)::placeholder,:host .content ::slotted(input[type=tel].p-input)::placeholder,:host .content ::slotted(input[type=text].p-input)::placeholder,:host .content ::slotted(input[type=time].p-input)::placeholder{--tw-text-opacity:1;color:rgb(128 130 158/var(--tw-text-opacity));font-size:1rem;line-height:1.5rem}:host .content .active::slotted(input[type=date].p-input),:host .content .active::slotted(input[type=datetime-local].p-input),:host .content .active::slotted(input[type=email].p-input),:host .content .active::slotted(input[type=month].p-input),:host .content .active::slotted(input[type=number].p-input),:host .content .active::slotted(input[type=password].p-input),:host .content .active::slotted(input[type=tel].p-input),:host .content .active::slotted(input[type=text].p-input),:host .content .active::slotted(input[type=time].p-input),:host .content .focus::slotted(input[type=date].p-input),:host .content .focus::slotted(input[type=datetime-local].p-input),:host .content .focus::slotted(input[type=email].p-input),:host .content .focus::slotted(input[type=month].p-input),:host .content .focus::slotted(input[type=number].p-input),:host .content .focus::slotted(input[type=password].p-input),:host .content .focus::slotted(input[type=tel].p-input),:host .content .focus::slotted(input[type=text].p-input),:host .content .focus::slotted(input[type=time].p-input),:host .content :focus-visible::slotted(input[type=date].p-input),:host .content :focus-visible::slotted(input[type=datetime-local].p-input),:host .content :focus-visible::slotted(input[type=email].p-input),:host .content :focus-visible::slotted(input[type=month].p-input),:host .content :focus-visible::slotted(input[type=number].p-input),:host .content :focus-visible::slotted(input[type=password].p-input),:host .content :focus-visible::slotted(input[type=tel].p-input),:host .content :focus-visible::slotted(input[type=text].p-input),:host .content :focus-visible::slotted(input[type=time].p-input),:host .content :focus-within::slotted(input[type=date].p-input),:host .content :focus-within::slotted(input[type=datetime-local].p-input),:host .content :focus-within::slotted(input[type=email].p-input),:host .content :focus-within::slotted(input[type=month].p-input),:host .content :focus-within::slotted(input[type=number].p-input),:host .content :focus-within::slotted(input[type=password].p-input),:host .content :focus-within::slotted(input[type=tel].p-input),:host .content :focus-within::slotted(input[type=text].p-input),:host .content :focus-within::slotted(input[type=time].p-input),:host .content :focus::slotted(input[type=date].p-input),:host .content :focus::slotted(input[type=datetime-local].p-input),:host .content :focus::slotted(input[type=email].p-input),:host .content :focus::slotted(input[type=month].p-input),:host .content :focus::slotted(input[type=number].p-input),:host .content :focus::slotted(input[type=password].p-input),:host .content :focus::slotted(input[type=tel].p-input),:host .content :focus::slotted(input[type=text].p-input),:host .content :focus::slotted(input[type=time].p-input),:host .content [active]::slotted(input[type=date].p-input),:host .content [active]::slotted(input[type=datetime-local].p-input),:host .content [active]::slotted(input[type=email].p-input),:host .content [active]::slotted(input[type=month].p-input),:host .content [active]::slotted(input[type=number].p-input),:host .content [active]::slotted(input[type=password].p-input),:host .content [active]::slotted(input[type=tel].p-input),:host .content [active]::slotted(input[type=text].p-input),:host .content [active]::slotted(input[type=time].p-input){--tw-border-opacity:1!important;border-color:rgb(82 138 250/var(--tw-border-opacity))!important;outline:2px solid transparent!important;outline-offset:2px!important}:host .content .size-small::slotted(input[type=date].p-input),:host .content .size-small::slotted(input[type=datetime-local].p-input),:host .content .size-small::slotted(input[type=email].p-input),:host .content .size-small::slotted(input[type=month].p-input),:host .content .size-small::slotted(input[type=number].p-input),:host .content .size-small::slotted(input[type=password].p-input),:host .content .size-small::slotted(input[type=tel].p-input),:host .content .size-small::slotted(input[type=text].p-input),:host .content .size-small::slotted(input[type=time].p-input){font-size:.875rem;height:2rem;line-height:1.25rem}:host .content .prefix+::slotted(input[type=date].p-input),:host .content .prefix+::slotted(input[type=datetime-local].p-input),:host .content .prefix+::slotted(input[type=email].p-input),:host .content .prefix+::slotted(input[type=month].p-input),:host .content .prefix+::slotted(input[type=number].p-input),:host .content .prefix+::slotted(input[type=password].p-input),:host .content .prefix+::slotted(input[type=tel].p-input),:host .content .prefix+::slotted(input[type=text].p-input),:host .content .prefix+::slotted(input[type=time].p-input){border-bottom-left-radius:0!important;border-left-width:0!important;border-top-left-radius:0!important;flex:1 1 auto;padding-left:0!important}:host .content .suffix+::slotted(input[type=date].p-input),:host .content .suffix+::slotted(input[type=datetime-local].p-input),:host .content .suffix+::slotted(input[type=email].p-input),:host .content .suffix+::slotted(input[type=month].p-input),:host .content .suffix+::slotted(input[type=number].p-input),:host .content .suffix+::slotted(input[type=password].p-input),:host .content .suffix+::slotted(input[type=tel].p-input),:host .content .suffix+::slotted(input[type=text].p-input),:host .content .suffix+::slotted(input[type=time].p-input){border-bottom-right-radius:0!important;border-right-width:0!important;border-top-right-radius:0!important;flex:1 1 auto;padding-right:0!important}:host(.focused),:host(:focus),:host(:focus-within),:host([focused]){outline:2px solid transparent!important;outline-offset:2px!important}:host(.focused) .prefix,:host(.focused) .suffix,:host(:focus) .prefix,:host(:focus) .suffix,:host(:focus-within) .prefix,:host(:focus-within) .suffix,:host([focused]) .prefix,:host([focused]) .suffix{--tw-border-opacity:1!important;--tw-text-opacity:1;border-color:rgb(82 138 250/var(--tw-border-opacity))!important;color:rgb(82 138 250/var(--tw-text-opacity));outline:2px solid transparent!important;outline-offset:2px!important}:host(.focused) ::slotted(input[type=date].p-input),:host(.focused) ::slotted(input[type=datetime-local].p-input),:host(.focused) ::slotted(input[type=email].p-input),:host(.focused) ::slotted(input[type=month].p-input),:host(.focused) ::slotted(input[type=number].p-input),:host(.focused) ::slotted(input[type=password].p-input),:host(.focused) ::slotted(input[type=tel].p-input),:host(.focused) ::slotted(input[type=text].p-input),:host(.focused) ::slotted(input[type=time].p-input),:host(:focus) ::slotted(input[type=date].p-input),:host(:focus) ::slotted(input[type=datetime-local].p-input),:host(:focus) ::slotted(input[type=email].p-input),:host(:focus) ::slotted(input[type=month].p-input),:host(:focus) ::slotted(input[type=number].p-input),:host(:focus) ::slotted(input[type=password].p-input),:host(:focus) ::slotted(input[type=tel].p-input),:host(:focus) ::slotted(input[type=text].p-input),:host(:focus) ::slotted(input[type=time].p-input),:host(:focus-within) ::slotted(input[type=date].p-input),:host(:focus-within) ::slotted(input[type=datetime-local].p-input),:host(:focus-within) ::slotted(input[type=email].p-input),:host(:focus-within) ::slotted(input[type=month].p-input),:host(:focus-within) ::slotted(input[type=number].p-input),:host(:focus-within) ::slotted(input[type=password].p-input),:host(:focus-within) ::slotted(input[type=tel].p-input),:host(:focus-within) ::slotted(input[type=text].p-input),:host(:focus-within) ::slotted(input[type=time].p-input),:host([focused]) ::slotted(input[type=date].p-input),:host([focused]) ::slotted(input[type=datetime-local].p-input),:host([focused]) ::slotted(input[type=email].p-input),:host([focused]) ::slotted(input[type=month].p-input),:host([focused]) ::slotted(input[type=number].p-input),:host([focused]) ::slotted(input[type=password].p-input),:host([focused]) ::slotted(input[type=tel].p-input),:host([focused]) ::slotted(input[type=text].p-input),:host([focused]) ::slotted(input[type=time].p-input){--tw-border-opacity:1!important;border-color:rgb(82 138 250/var(--tw-border-opacity))!important;outline:2px solid transparent!important;outline-offset:2px!important}:host(.error) .prefix,:host(.error) .suffix,:host([error]) .prefix,:host([error]) .suffix{--tw-border-opacity:1!important;--tw-text-opacity:1;border-color:rgb(185 30 40/var(--tw-border-opacity))!important;color:rgb(138 15 29/var(--tw-text-opacity));color:rgb(185 30 40/var(--tw-text-opacity))}:host(.error) .prefix::-moz-placeholder,:host(.error) .suffix::-moz-placeholder,:host([error]) .prefix::-moz-placeholder,:host([error]) .suffix::-moz-placeholder{--tw-text-opacity:1;color:rgb(255 204 211/var(--tw-text-opacity))}:host(.error) .prefix::placeholder,:host(.error) .suffix::placeholder,:host([error]) .prefix::placeholder,:host([error]) .suffix::placeholder{--tw-text-opacity:1;color:rgb(255 204 211/var(--tw-text-opacity))}:host(.error) ::slotted(input[type=date].p-input),:host(.error) ::slotted(input[type=datetime-local].p-input),:host(.error) ::slotted(input[type=email].p-input),:host(.error) ::slotted(input[type=month].p-input),:host(.error) ::slotted(input[type=number].p-input),:host(.error) ::slotted(input[type=password].p-input),:host(.error) ::slotted(input[type=tel].p-input),:host(.error) ::slotted(input[type=text].p-input),:host(.error) ::slotted(input[type=time].p-input),:host([error]) ::slotted(input[type=date].p-input),:host([error]) ::slotted(input[type=datetime-local].p-input),:host([error]) ::slotted(input[type=email].p-input),:host([error]) ::slotted(input[type=month].p-input),:host([error]) ::slotted(input[type=number].p-input),:host([error]) ::slotted(input[type=password].p-input),:host([error]) ::slotted(input[type=tel].p-input),:host([error]) ::slotted(input[type=text].p-input),:host([error]) ::slotted(input[type=time].p-input){--tw-text-opacity:1;--tw-border-opacity:1!important;border-color:rgb(185 30 40/var(--tw-border-opacity))!important;color:rgb(138 15 29/var(--tw-text-opacity))}:host(.error) ::slotted(input[type=date].p-input)::-moz-placeholder,:host(.error) ::slotted(input[type=datetime-local].p-input)::-moz-placeholder,:host(.error) ::slotted(input[type=email].p-input)::-moz-placeholder,:host(.error) ::slotted(input[type=month].p-input)::-moz-placeholder,:host(.error) ::slotted(input[type=number].p-input)::-moz-placeholder,:host(.error) ::slotted(input[type=password].p-input)::-moz-placeholder,:host(.error) ::slotted(input[type=tel].p-input)::-moz-placeholder,:host(.error) ::slotted(input[type=text].p-input)::-moz-placeholder,:host(.error) ::slotted(input[type=time].p-input)::-moz-placeholder,:host([error]) ::slotted(input[type=date].p-input)::-moz-placeholder,:host([error]) ::slotted(input[type=datetime-local].p-input)::-moz-placeholder,:host([error]) ::slotted(input[type=email].p-input)::-moz-placeholder,:host([error]) ::slotted(input[type=month].p-input)::-moz-placeholder,:host([error]) ::slotted(input[type=number].p-input)::-moz-placeholder,:host([error]) ::slotted(input[type=password].p-input)::-moz-placeholder,:host([error]) ::slotted(input[type=tel].p-input)::-moz-placeholder,:host([error]) ::slotted(input[type=text].p-input)::-moz-placeholder,:host([error]) ::slotted(input[type=time].p-input)::-moz-placeholder{--tw-text-opacity:1;color:rgb(255 204 211/var(--tw-text-opacity))}:host(.error) ::slotted(input[type=date].p-input)::placeholder,:host(.error) ::slotted(input[type=datetime-local].p-input)::placeholder,:host(.error) ::slotted(input[type=email].p-input)::placeholder,:host(.error) ::slotted(input[type=month].p-input)::placeholder,:host(.error) ::slotted(input[type=number].p-input)::placeholder,:host(.error) ::slotted(input[type=password].p-input)::placeholder,:host(.error) ::slotted(input[type=tel].p-input)::placeholder,:host(.error) ::slotted(input[type=text].p-input)::placeholder,:host(.error) ::slotted(input[type=time].p-input)::placeholder,:host([error]) ::slotted(input[type=date].p-input)::placeholder,:host([error]) ::slotted(input[type=datetime-local].p-input)::placeholder,:host([error]) ::slotted(input[type=email].p-input)::placeholder,:host([error]) ::slotted(input[type=month].p-input)::placeholder,:host([error]) ::slotted(input[type=number].p-input)::placeholder,:host([error]) ::slotted(input[type=password].p-input)::placeholder,:host([error]) ::slotted(input[type=tel].p-input)::placeholder,:host([error]) ::slotted(input[type=text].p-input)::placeholder,:host([error]) ::slotted(input[type=time].p-input)::placeholder{--tw-text-opacity:1;color:rgb(255 204 211/var(--tw-text-opacity))}:host(.disabled) .prefix,:host(.disabled) .suffix,:host([disabled]) .prefix,:host([disabled]) .suffix{opacity:.4}:host(.disabled) ::slotted(input[type=date].p-input),:host(.disabled) ::slotted(input[type=datetime-local].p-input),:host(.disabled) ::slotted(input[type=email].p-input),:host(.disabled) ::slotted(input[type=month].p-input),:host(.disabled) ::slotted(input[type=number].p-input),:host(.disabled) ::slotted(input[type=password].p-input),:host(.disabled) ::slotted(input[type=tel].p-input),:host(.disabled) ::slotted(input[type=text].p-input),:host(.disabled) ::slotted(input[type=time].p-input),:host([disabled]) ::slotted(input[type=date].p-input),:host([disabled]) ::slotted(input[type=datetime-local].p-input),:host([disabled]) ::slotted(input[type=email].p-input),:host([disabled]) ::slotted(input[type=month].p-input),:host([disabled]) ::slotted(input[type=number].p-input),:host([disabled]) ::slotted(input[type=password].p-input),:host([disabled]) ::slotted(input[type=tel].p-input),:host([disabled]) ::slotted(input[type=text].p-input),:host([disabled]) ::slotted(input[type=time].p-input){opacity:.4;pointer-events:none}:host(.size-small) ::slotted(input[type=date].p-input),:host(.size-small) ::slotted(input[type=datetime-local].p-input),:host(.size-small) ::slotted(input[type=email].p-input),:host(.size-small) ::slotted(input[type=month].p-input),:host(.size-small) ::slotted(input[type=number].p-input),:host(.size-small) ::slotted(input[type=password].p-input),:host(.size-small) ::slotted(input[type=tel].p-input),:host(.size-small) ::slotted(input[type=text].p-input),:host(.size-small) ::slotted(input[type=time].p-input){font-size:.875rem;height:2rem;line-height:1.25rem}.static{position:static!important}.cursor-pointer{cursor:pointer!important}.blur{--tw-blur:blur(8px)!important}.blur,.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}.visible{visibility:visible!important}.absolute{position:absolute!important}.-rotate-0{--tw-rotate:-0deg!important}.-rotate-0,.-rotate-135{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-135{--tw-rotate:-135deg!important}.-rotate-180{--tw-rotate:-180deg!important}.-rotate-180,.-rotate-225{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-225{--tw-rotate:-225deg!important}.-rotate-25{--tw-rotate:-25deg!important}.-rotate-25,.-rotate-270{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-270{--tw-rotate:-270deg!important}.-rotate-315{--tw-rotate:-315deg!important}.-rotate-315,.-rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-45{--tw-rotate:-45deg!important}.-rotate-90{--tw-rotate:-90deg!important}.-rotate-90,.rotate-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-0{--tw-rotate:0deg!important}.rotate-135{--tw-rotate:135deg!important}.rotate-135,.rotate-180{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-180{--tw-rotate:180deg!important}.rotate-225{--tw-rotate:225deg!important}.rotate-225,.rotate-25{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-25{--tw-rotate:25deg!important}.rotate-270{--tw-rotate:270deg!important}.rotate-270,.rotate-315{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-315{--tw-rotate:315deg!important}.rotate-45{--tw-rotate:45deg!important}.rotate-45,.rotate-90{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-90{--tw-rotate:90deg!important}.scale-x-flip{--tw-scale-x:-1!important}.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.scale-y-flip{--tw-scale-y:-1!important}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.text-2xl{font-size:1.5rem!important;line-height:2rem!important}.text-3xl{font-size:1.875rem!important;line-height:2.25rem!important}.text-4xl{font-size:2.25rem!important;line-height:2.5rem!important}.text-5xl{font-size:3rem!important}.text-5xl,.text-6xl{line-height:1!important}.text-6xl{font-size:3.75rem!important}.text-lg{font-size:1.125rem!important;line-height:1.75rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-xl{font-size:1.25rem!important;line-height:1.75rem!important}.text-xxs{font-size:.6875rem!important}.text-negative{--tw-text-opacity:1!important;color:rgb(185 30 40/var(--tw-text-opacity))!important}.text-negative-light{--tw-text-opacity:1!important;color:rgb(255 204 211/var(--tw-text-opacity))!important}.hover\:text-negative:hover{--tw-text-opacity:1!important;color:rgb(185 30 40/var(--tw-text-opacity))!important}.ml-1{margin-left:.25rem!important}.ml-2{margin-left:.5rem!important}.justify-between{justify-content:space-between!important}.col-start-1{grid-column-start:1!important}.col-start-2{grid-column-start:2!important}.col-start-3{grid-column-start:3!important}.col-start-4{grid-column-start:4!important}.col-start-5{grid-column-start:5!important}.col-start-6{grid-column-start:6!important}.col-start-7{grid-column-start:7!important}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}.h-6{height:1.5rem!important}.rounded{border-radius:.25rem!important}.inline{display:inline!important}.justify-center{justify-content:center!important}.mb-14{margin-bottom:3.5rem!important}.mb-6{margin-bottom:1.5rem!important}.table{display:table!important}.hidden{display:none!important}.w-6{width:1.5rem!important}.max-w-\[20rem\]{max-width:20rem!important}.self-center{align-self:center!important}.py-24{padding-bottom:6rem!important;padding-top:6rem!important}.text-center{text-align:center!important}.text-storm-medium{--tw-text-opacity:1!important;color:rgb(128 130 158/var(--tw-text-opacity))!important}.table-cell{display:table-cell!important}.w-1\/12{width:8.333333%!important}.w-10\/12{width:83.333333%!important}.w-11\/12{width:91.666667%!important}.w-2\/12{width:16.666667%!important}.w-3\/12{width:25%!important}.w-4\/12{width:33.333333%!important}.w-5\/12{width:41.666667%!important}.w-6\/12{width:50%!important}.w-7\/12{width:58.333333%!important}.w-8\/12{width:66.666667%!important}.w-9\/12{width:75%!important}.w-auto{width:auto!important}.justify-start{justify-content:flex-start!important}.justify-end{justify-content:flex-end!important}.text-storm-dark{--tw-text-opacity:1!important;color:rgb(39 40 56/var(--tw-text-opacity))!important}@media (min-width:40rem){.tablet\:w-1\/12{width:8.333333%!important}.tablet\:w-10\/12{width:83.333333%!important}.tablet\:w-11\/12{width:91.666667%!important}.tablet\:w-2\/12{width:16.666667%!important}.tablet\:w-3\/12{width:25%!important}.tablet\:w-4\/12{width:33.333333%!important}.tablet\:w-5\/12{width:41.666667%!important}.tablet\:w-6\/12{width:50%!important}.tablet\:w-7\/12{width:58.333333%!important}.tablet\:w-8\/12{width:66.666667%!important}.tablet\:w-9\/12{width:75%!important}}@media (min-width:64rem){.desktop-xs\:w-1\/12{width:8.333333%!important}.desktop-xs\:w-10\/12{width:83.333333%!important}.desktop-xs\:w-11\/12{width:91.666667%!important}.desktop-xs\:w-2\/12{width:16.666667%!important}.desktop-xs\:w-3\/12{width:25%!important}.desktop-xs\:w-4\/12{width:33.333333%!important}.desktop-xs\:w-5\/12{width:41.666667%!important}.desktop-xs\:w-6\/12{width:50%!important}.desktop-xs\:w-7\/12{width:58.333333%!important}.desktop-xs\:w-8\/12{width:66.666667%!important}.desktop-xs\:w-9\/12{width:75%!important}}@media (min-width:80rem){.desktop-sm\:w-1\/12{width:8.333333%!important}.desktop-sm\:w-10\/12{width:83.333333%!important}.desktop-sm\:w-11\/12{width:91.666667%!important}.desktop-sm\:w-2\/12{width:16.666667%!important}.desktop-sm\:w-3\/12{width:25%!important}.desktop-sm\:w-4\/12{width:33.333333%!important}.desktop-sm\:w-5\/12{width:41.666667%!important}.desktop-sm\:w-6\/12{width:50%!important}.desktop-sm\:w-7\/12{width:58.333333%!important}.desktop-sm\:w-8\/12{width:66.666667%!important}.desktop-sm\:w-9\/12{width:75%!important}}@media (min-width:85.375rem){.desktop\:w-1\/12{width:8.333333%!important}.desktop\:w-10\/12{width:83.333333%!important}.desktop\:w-11\/12{width:91.666667%!important}.desktop\:w-2\/12{width:16.666667%!important}.desktop\:w-3\/12{width:25%!important}.desktop\:w-4\/12{width:33.333333%!important}.desktop\:w-5\/12{width:41.666667%!important}.desktop\:w-6\/12{width:50%!important}.desktop\:w-7\/12{width:58.333333%!important}.desktop\:w-8\/12{width:66.666667%!important}.desktop\:w-9\/12{width:75%!important}}@media (min-width:90rem){.desktop-lg\:w-1\/12{width:8.333333%!important}.desktop-lg\:w-10\/12{width:83.333333%!important}.desktop-lg\:w-11\/12{width:91.666667%!important}.desktop-lg\:w-2\/12{width:16.666667%!important}.desktop-lg\:w-3\/12{width:25%!important}.desktop-lg\:w-4\/12{width:33.333333%!important}.desktop-lg\:w-5\/12{width:41.666667%!important}.desktop-lg\:w-6\/12{width:50%!important}.desktop-lg\:w-7\/12{width:58.333333%!important}.desktop-lg\:w-8\/12{width:66.666667%!important}.desktop-lg\:w-9\/12{width:75%!important}}@media (min-width:120rem){.desktop-xl\:w-1\/12{width:8.333333%!important}.desktop-xl\:w-10\/12{width:83.333333%!important}.desktop-xl\:w-11\/12{width:91.666667%!important}.desktop-xl\:w-2\/12{width:16.666667%!important}.desktop-xl\:w-3\/12{width:25%!important}.desktop-xl\:w-4\/12{width:33.333333%!important}.desktop-xl\:w-5\/12{width:41.666667%!important}.desktop-xl\:w-6\/12{width:50%!important}.desktop-xl\:w-7\/12{width:58.333333%!important}.desktop-xl\:w-8\/12{width:66.666667%!important}.desktop-xl\:w-9\/12{width:75%!important}}@media (min-width:64rem){.desktop-xs\:flex{display:flex!important}}.fixed{position:fixed!important}.bottom-0{bottom:0!important}.left-0{left:0!important}.block{display:block!important}.w-3\/4{width:75%!important}.gap-4{gap:1rem!important}.border{border-width:1px!important}.border-transparent{border-color:transparent!important}.border-t-mystic-dark{--tw-border-opacity:1!important;border-top-color:rgb(218 230 240/var(--tw-border-opacity))!important}.p-4{padding:1rem!important}@media (min-width:64rem){.desktop-xs\:hidden{display:none!important}.desktop-xs\:w-48{width:12rem!important}.desktop-xs\:w-auto{width:auto!important}.desktop-xs\:flex-row{flex-direction:row!important}}.m-0{margin:0!important}.table-row{display:table-row!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}
+.mb-\[2px\]{margin-bottom:2px!important}.flex{display:flex!important}.h-10{height:2.5rem!important}.h-8{height:2rem!important}.w-full{width:100%!important}.flex-1{flex:1 1 0%!important}.flex-col{flex-direction:column!important}.items-end{align-items:flex-end!important}.items-center{align-items:center!important}.gap-2{gap:.5rem!important}.rounded-bl-none{border-bottom-left-radius:0!important}.rounded-br-none{border-bottom-right-radius:0!important}.rounded-tl-none{border-top-left-radius:0!important}.rounded-tr-none{border-top-right-radius:0!important}.border-b{border-bottom-width:1px!important}.border-l-0{border-left-width:0!important}.border-r{border-right-width:1px!important}.border-r-0{border-right-width:0!important}.border-t{border-top-width:1px!important}.border-solid{border-style:solid!important}.border-indigo{--tw-border-opacity:1!important;border-color:rgb(82 138 250/var(--tw-border-opacity))!important}.border-mystic-dark{--tw-border-opacity:1!important;border-color:rgb(218 230 240/var(--tw-border-opacity))!important}.border-negative{--tw-border-opacity:1!important;border-color:rgb(185 30 40/var(--tw-border-opacity))!important}.bg-white{--tw-bg-opacity:1!important;background-color:rgb(255 255 255/var(--tw-bg-opacity))!important}.pl-0{padding-left:0!important}.pr-0{padding-right:0!important}.text-base{font-size:1rem!important;line-height:1.5rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.font-semibold{font-weight:600!important}.uppercase{text-transform:uppercase!important}.tracking-wider{letter-spacing:.05em!important}.text-storm{--tw-text-opacity:1!important;color:rgb(81 83 107/var(--tw-text-opacity))!important}.text-storm-vague{--tw-text-opacity:1!important;color:rgb(152 154 183/var(--tw-text-opacity))!important}.outline-none{outline:2px solid transparent!important;outline-offset:2px!important}*{box-sizing:border-box}:host{display:flex;flex-direction:column;outline:2px solid transparent!important;outline-offset:2px!important;width:100%}:host .input-label{--tw-text-opacity:1;color:rgb(152 154 183/var(--tw-text-opacity));font-size:.75rem;font-weight:600;letter-spacing:.05em;line-height:1rem;margin-bottom:2px;text-transform:uppercase}:host .input-header{align-items:flex-end;display:flex;gap:.5rem;margin-bottom:2px}:host .content{display:flex}:host .content .prefix,:host .content .suffix{--tw-bg-opacity:1;--tw-border-opacity:1!important;--tw-text-opacity:1;align-items:center;background-color:rgb(255 255 255/var(--tw-bg-opacity));border-color:rgb(218 230 240/var(--tw-border-opacity))!important;border-radius:.375rem;border-style:solid!important;border-width:1px;box-sizing:border-box;color:rgb(39 40 56/var(--tw-text-opacity));color:rgb(81 83 107/var(--tw-text-opacity));display:flex;flex:1 1 0%;font-size:1rem;height:2.5rem;justify-content:flex-start;line-height:1.5rem;outline:2px solid transparent!important;outline-offset:2px!important;padding-left:1rem;padding-right:1rem;width:100%}:host .content .prefix::-moz-placeholder,:host .content .suffix::-moz-placeholder{--tw-text-opacity:1;color:rgb(128 130 158/var(--tw-text-opacity));font-size:1rem;line-height:1.5rem}:host .content .prefix::placeholder,:host .content .suffix::placeholder{--tw-text-opacity:1;color:rgb(128 130 158/var(--tw-text-opacity));font-size:1rem;line-height:1.5rem}:host .content .prefix.active,:host .content .prefix.focus,:host .content .prefix:focus,:host .content .prefix:focus-visible,:host .content .prefix:focus-within,:host .content .prefix[active],:host .content .suffix.active,:host .content .suffix.focus,:host .content .suffix:focus,:host .content .suffix:focus-visible,:host .content .suffix:focus-within,:host .content .suffix[active]{--tw-border-opacity:1!important;border-color:rgb(82 138 250/var(--tw-border-opacity))!important;outline:2px solid transparent!important;outline-offset:2px!important}:host .content .prefix.size-small,:host .content .suffix.size-small{font-size:.875rem;height:2rem;line-height:1.25rem}:host .content .prefix{border-bottom-right-radius:0;border-right-width:0!important;border-top-right-radius:0;order:1;padding-right:.5rem}:host .content .suffix{border-bottom-left-radius:0;border-left-width:0!important;border-top-left-radius:0;order:3;padding-left:.5rem}:host .content ::slotted(input[type=date].p-input),:host .content ::slotted(input[type=datetime-local].p-input),:host .content ::slotted(input[type=email].p-input),:host .content ::slotted(input[type=month].p-input),:host .content ::slotted(input[type=number].p-input),:host .content ::slotted(input[type=password].p-input),:host .content ::slotted(input[type=tel].p-input),:host .content ::slotted(input[type=text].p-input),:host .content ::slotted(input[type=time].p-input){--tw-text-opacity:1;--tw-bg-opacity:1;--tw-border-opacity:1!important;align-items:center;background-color:rgb(255 255 255/var(--tw-bg-opacity));border-color:rgb(218 230 240/var(--tw-border-opacity))!important;border-radius:.375rem;border-style:solid!important;border-width:1px;color:rgb(39 40 56/var(--tw-text-opacity));display:flex;font-size:1rem;height:2.5rem;justify-content:flex-start;line-height:1.5rem;order:2;outline:2px solid transparent!important;outline-offset:2px!important;padding-left:1rem;padding-right:1rem;width:100%}:host .content ::slotted(input[type=date].p-input)::-moz-placeholder,:host .content ::slotted(input[type=datetime-local].p-input)::-moz-placeholder,:host .content ::slotted(input[type=email].p-input)::-moz-placeholder,:host .content ::slotted(input[type=month].p-input)::-moz-placeholder,:host .content ::slotted(input[type=number].p-input)::-moz-placeholder,:host .content ::slotted(input[type=password].p-input)::-moz-placeholder,:host .content ::slotted(input[type=tel].p-input)::-moz-placeholder,:host .content ::slotted(input[type=text].p-input)::-moz-placeholder,:host .content ::slotted(input[type=time].p-input)::-moz-placeholder{--tw-text-opacity:1;color:rgb(128 130 158/var(--tw-text-opacity));font-size:1rem;line-height:1.5rem}:host .content ::slotted(input[type=date].p-input)::placeholder,:host .content ::slotted(input[type=datetime-local].p-input)::placeholder,:host .content ::slotted(input[type=email].p-input)::placeholder,:host .content ::slotted(input[type=month].p-input)::placeholder,:host .content ::slotted(input[type=number].p-input)::placeholder,:host .content ::slotted(input[type=password].p-input)::placeholder,:host .content ::slotted(input[type=tel].p-input)::placeholder,:host .content ::slotted(input[type=text].p-input)::placeholder,:host .content ::slotted(input[type=time].p-input)::placeholder{--tw-text-opacity:1;color:rgb(128 130 158/var(--tw-text-opacity));font-size:1rem;line-height:1.5rem}:host .content .active::slotted(input[type=date].p-input),:host .content .active::slotted(input[type=datetime-local].p-input),:host .content .active::slotted(input[type=email].p-input),:host .content .active::slotted(input[type=month].p-input),:host .content .active::slotted(input[type=number].p-input),:host .content .active::slotted(input[type=password].p-input),:host .content .active::slotted(input[type=tel].p-input),:host .content .active::slotted(input[type=text].p-input),:host .content .active::slotted(input[type=time].p-input),:host .content .focus::slotted(input[type=date].p-input),:host .content .focus::slotted(input[type=datetime-local].p-input),:host .content .focus::slotted(input[type=email].p-input),:host .content .focus::slotted(input[type=month].p-input),:host .content .focus::slotted(input[type=number].p-input),:host .content .focus::slotted(input[type=password].p-input),:host .content .focus::slotted(input[type=tel].p-input),:host .content .focus::slotted(input[type=text].p-input),:host .content .focus::slotted(input[type=time].p-input),:host .content :focus-visible::slotted(input[type=date].p-input),:host .content :focus-visible::slotted(input[type=datetime-local].p-input),:host .content :focus-visible::slotted(input[type=email].p-input),:host .content :focus-visible::slotted(input[type=month].p-input),:host .content :focus-visible::slotted(input[type=number].p-input),:host .content :focus-visible::slotted(input[type=password].p-input),:host .content :focus-visible::slotted(input[type=tel].p-input),:host .content :focus-visible::slotted(input[type=text].p-input),:host .content :focus-visible::slotted(input[type=time].p-input),:host .content :focus-within::slotted(input[type=date].p-input),:host .content :focus-within::slotted(input[type=datetime-local].p-input),:host .content :focus-within::slotted(input[type=email].p-input),:host .content :focus-within::slotted(input[type=month].p-input),:host .content :focus-within::slotted(input[type=number].p-input),:host .content :focus-within::slotted(input[type=password].p-input),:host .content :focus-within::slotted(input[type=tel].p-input),:host .content :focus-within::slotted(input[type=text].p-input),:host .content :focus-within::slotted(input[type=time].p-input),:host .content :focus::slotted(input[type=date].p-input),:host .content :focus::slotted(input[type=datetime-local].p-input),:host .content :focus::slotted(input[type=email].p-input),:host .content :focus::slotted(input[type=month].p-input),:host .content :focus::slotted(input[type=number].p-input),:host .content :focus::slotted(input[type=password].p-input),:host .content :focus::slotted(input[type=tel].p-input),:host .content :focus::slotted(input[type=text].p-input),:host .content :focus::slotted(input[type=time].p-input),:host .content [active]::slotted(input[type=date].p-input),:host .content [active]::slotted(input[type=datetime-local].p-input),:host .content [active]::slotted(input[type=email].p-input),:host .content [active]::slotted(input[type=month].p-input),:host .content [active]::slotted(input[type=number].p-input),:host .content [active]::slotted(input[type=password].p-input),:host .content [active]::slotted(input[type=tel].p-input),:host .content [active]::slotted(input[type=text].p-input),:host .content [active]::slotted(input[type=time].p-input){--tw-border-opacity:1!important;border-color:rgb(82 138 250/var(--tw-border-opacity))!important;outline:2px solid transparent!important;outline-offset:2px!important}:host .content .size-small::slotted(input[type=date].p-input),:host .content .size-small::slotted(input[type=datetime-local].p-input),:host .content .size-small::slotted(input[type=email].p-input),:host .content .size-small::slotted(input[type=month].p-input),:host .content .size-small::slotted(input[type=number].p-input),:host .content .size-small::slotted(input[type=password].p-input),:host .content .size-small::slotted(input[type=tel].p-input),:host .content .size-small::slotted(input[type=text].p-input),:host .content .size-small::slotted(input[type=time].p-input){font-size:.875rem;height:2rem;line-height:1.25rem}:host .content .prefix+::slotted(input[type=date].p-input),:host .content .prefix+::slotted(input[type=datetime-local].p-input),:host .content .prefix+::slotted(input[type=email].p-input),:host .content .prefix+::slotted(input[type=month].p-input),:host .content .prefix+::slotted(input[type=number].p-input),:host .content .prefix+::slotted(input[type=password].p-input),:host .content .prefix+::slotted(input[type=tel].p-input),:host .content .prefix+::slotted(input[type=text].p-input),:host .content .prefix+::slotted(input[type=time].p-input){border-bottom-left-radius:0!important;border-left-width:0!important;border-top-left-radius:0!important;flex:1 1 auto;padding-left:0!important}:host .content .suffix+::slotted(input[type=date].p-input),:host .content .suffix+::slotted(input[type=datetime-local].p-input),:host .content .suffix+::slotted(input[type=email].p-input),:host .content .suffix+::slotted(input[type=month].p-input),:host .content .suffix+::slotted(input[type=number].p-input),:host .content .suffix+::slotted(input[type=password].p-input),:host .content .suffix+::slotted(input[type=tel].p-input),:host .content .suffix+::slotted(input[type=text].p-input),:host .content .suffix+::slotted(input[type=time].p-input){border-bottom-right-radius:0!important;border-right-width:0!important;border-top-right-radius:0!important;flex:1 1 auto;padding-right:0!important}:host(.focused),:host(:focus),:host(:focus-within),:host([focused]){outline:2px solid transparent!important;outline-offset:2px!important}:host(.focused) .prefix,:host(.focused) .suffix,:host(:focus) .prefix,:host(:focus) .suffix,:host(:focus-within) .prefix,:host(:focus-within) .suffix,:host([focused]) .prefix,:host([focused]) .suffix{--tw-border-opacity:1!important;--tw-text-opacity:1;border-color:rgb(82 138 250/var(--tw-border-opacity))!important;color:rgb(82 138 250/var(--tw-text-opacity));outline:2px solid transparent!important;outline-offset:2px!important}:host(.focused) ::slotted(input[type=date].p-input),:host(.focused) ::slotted(input[type=datetime-local].p-input),:host(.focused) ::slotted(input[type=email].p-input),:host(.focused) ::slotted(input[type=month].p-input),:host(.focused) ::slotted(input[type=number].p-input),:host(.focused) ::slotted(input[type=password].p-input),:host(.focused) ::slotted(input[type=tel].p-input),:host(.focused) ::slotted(input[type=text].p-input),:host(.focused) ::slotted(input[type=time].p-input),:host(:focus) ::slotted(input[type=date].p-input),:host(:focus) ::slotted(input[type=datetime-local].p-input),:host(:focus) ::slotted(input[type=email].p-input),:host(:focus) ::slotted(input[type=month].p-input),:host(:focus) ::slotted(input[type=number].p-input),:host(:focus) ::slotted(input[type=password].p-input),:host(:focus) ::slotted(input[type=tel].p-input),:host(:focus) ::slotted(input[type=text].p-input),:host(:focus) ::slotted(input[type=time].p-input),:host(:focus-within) ::slotted(input[type=date].p-input),:host(:focus-within) ::slotted(input[type=datetime-local].p-input),:host(:focus-within) ::slotted(input[type=email].p-input),:host(:focus-within) ::slotted(input[type=month].p-input),:host(:focus-within) ::slotted(input[type=number].p-input),:host(:focus-within) ::slotted(input[type=password].p-input),:host(:focus-within) ::slotted(input[type=tel].p-input),:host(:focus-within) ::slotted(input[type=text].p-input),:host(:focus-within) ::slotted(input[type=time].p-input),:host([focused]) ::slotted(input[type=date].p-input),:host([focused]) ::slotted(input[type=datetime-local].p-input),:host([focused]) ::slotted(input[type=email].p-input),:host([focused]) ::slotted(input[type=month].p-input),:host([focused]) ::slotted(input[type=number].p-input),:host([focused]) ::slotted(input[type=password].p-input),:host([focused]) ::slotted(input[type=tel].p-input),:host([focused]) ::slotted(input[type=text].p-input),:host([focused]) ::slotted(input[type=time].p-input){--tw-border-opacity:1!important;border-color:rgb(82 138 250/var(--tw-border-opacity))!important;outline:2px solid transparent!important;outline-offset:2px!important}:host(.error) .prefix,:host(.error) .suffix,:host([error]) .prefix,:host([error]) .suffix{--tw-border-opacity:1!important;--tw-text-opacity:1;border-color:rgb(185 30 40/var(--tw-border-opacity))!important;color:rgb(138 15 29/var(--tw-text-opacity));color:rgb(185 30 40/var(--tw-text-opacity))}:host(.error) .prefix::-moz-placeholder,:host(.error) .suffix::-moz-placeholder,:host([error]) .prefix::-moz-placeholder,:host([error]) .suffix::-moz-placeholder{--tw-text-opacity:1;color:rgb(255 204 211/var(--tw-text-opacity))}:host(.error) .prefix::placeholder,:host(.error) .suffix::placeholder,:host([error]) .prefix::placeholder,:host([error]) .suffix::placeholder{--tw-text-opacity:1;color:rgb(255 204 211/var(--tw-text-opacity))}:host(.error) ::slotted(input[type=date].p-input),:host(.error) ::slotted(input[type=datetime-local].p-input),:host(.error) ::slotted(input[type=email].p-input),:host(.error) ::slotted(input[type=month].p-input),:host(.error) ::slotted(input[type=number].p-input),:host(.error) ::slotted(input[type=password].p-input),:host(.error) ::slotted(input[type=tel].p-input),:host(.error) ::slotted(input[type=text].p-input),:host(.error) ::slotted(input[type=time].p-input),:host([error]) ::slotted(input[type=date].p-input),:host([error]) ::slotted(input[type=datetime-local].p-input),:host([error]) ::slotted(input[type=email].p-input),:host([error]) ::slotted(input[type=month].p-input),:host([error]) ::slotted(input[type=number].p-input),:host([error]) ::slotted(input[type=password].p-input),:host([error]) ::slotted(input[type=tel].p-input),:host([error]) ::slotted(input[type=text].p-input),:host([error]) ::slotted(input[type=time].p-input){--tw-text-opacity:1;--tw-border-opacity:1!important;border-color:rgb(185 30 40/var(--tw-border-opacity))!important;color:rgb(138 15 29/var(--tw-text-opacity))}:host(.error) ::slotted(input[type=date].p-input)::-moz-placeholder,:host(.error) ::slotted(input[type=datetime-local].p-input)::-moz-placeholder,:host(.error) ::slotted(input[type=email].p-input)::-moz-placeholder,:host(.error) ::slotted(input[type=month].p-input)::-moz-placeholder,:host(.error) ::slotted(input[type=number].p-input)::-moz-placeholder,:host(.error) ::slotted(input[type=password].p-input)::-moz-placeholder,:host(.error) ::slotted(input[type=tel].p-input)::-moz-placeholder,:host(.error) ::slotted(input[type=text].p-input)::-moz-placeholder,:host(.error) ::slotted(input[type=time].p-input)::-moz-placeholder,:host([error]) ::slotted(input[type=date].p-input)::-moz-placeholder,:host([error]) ::slotted(input[type=datetime-local].p-input)::-moz-placeholder,:host([error]) ::slotted(input[type=email].p-input)::-moz-placeholder,:host([error]) ::slotted(input[type=month].p-input)::-moz-placeholder,:host([error]) ::slotted(input[type=number].p-input)::-moz-placeholder,:host([error]) ::slotted(input[type=password].p-input)::-moz-placeholder,:host([error]) ::slotted(input[type=tel].p-input)::-moz-placeholder,:host([error]) ::slotted(input[type=text].p-input)::-moz-placeholder,:host([error]) ::slotted(input[type=time].p-input)::-moz-placeholder{--tw-text-opacity:1;color:rgb(255 204 211/var(--tw-text-opacity))}:host(.error) ::slotted(input[type=date].p-input)::placeholder,:host(.error) ::slotted(input[type=datetime-local].p-input)::placeholder,:host(.error) ::slotted(input[type=email].p-input)::placeholder,:host(.error) ::slotted(input[type=month].p-input)::placeholder,:host(.error) ::slotted(input[type=number].p-input)::placeholder,:host(.error) ::slotted(input[type=password].p-input)::placeholder,:host(.error) ::slotted(input[type=tel].p-input)::placeholder,:host(.error) ::slotted(input[type=text].p-input)::placeholder,:host(.error) ::slotted(input[type=time].p-input)::placeholder,:host([error]) ::slotted(input[type=date].p-input)::placeholder,:host([error]) ::slotted(input[type=datetime-local].p-input)::placeholder,:host([error]) ::slotted(input[type=email].p-input)::placeholder,:host([error]) ::slotted(input[type=month].p-input)::placeholder,:host([error]) ::slotted(input[type=number].p-input)::placeholder,:host([error]) ::slotted(input[type=password].p-input)::placeholder,:host([error]) ::slotted(input[type=tel].p-input)::placeholder,:host([error]) ::slotted(input[type=text].p-input)::placeholder,:host([error]) ::slotted(input[type=time].p-input)::placeholder{--tw-text-opacity:1;color:rgb(255 204 211/var(--tw-text-opacity))}:host(.disabled) .prefix,:host(.disabled) .suffix,:host([disabled]) .prefix,:host([disabled]) .suffix{opacity:.4}:host(.disabled) ::slotted(input[type=date].p-input),:host(.disabled) ::slotted(input[type=datetime-local].p-input),:host(.disabled) ::slotted(input[type=email].p-input),:host(.disabled) ::slotted(input[type=month].p-input),:host(.disabled) ::slotted(input[type=number].p-input),:host(.disabled) ::slotted(input[type=password].p-input),:host(.disabled) ::slotted(input[type=tel].p-input),:host(.disabled) ::slotted(input[type=text].p-input),:host(.disabled) ::slotted(input[type=time].p-input),:host([disabled]) ::slotted(input[type=date].p-input),:host([disabled]) ::slotted(input[type=datetime-local].p-input),:host([disabled]) ::slotted(input[type=email].p-input),:host([disabled]) ::slotted(input[type=month].p-input),:host([disabled]) ::slotted(input[type=number].p-input),:host([disabled]) ::slotted(input[type=password].p-input),:host([disabled]) ::slotted(input[type=tel].p-input),:host([disabled]) ::slotted(input[type=text].p-input),:host([disabled]) ::slotted(input[type=time].p-input){opacity:.4;pointer-events:none}:host(.size-small) ::slotted(input[type=date].p-input),:host(.size-small) ::slotted(input[type=datetime-local].p-input),:host(.size-small) ::slotted(input[type=email].p-input),:host(.size-small) ::slotted(input[type=month].p-input),:host(.size-small) ::slotted(input[type=number].p-input),:host(.size-small) ::slotted(input[type=password].p-input),:host(.size-small) ::slotted(input[type=tel].p-input),:host(.size-small) ::slotted(input[type=text].p-input),:host(.size-small) ::slotted(input[type=time].p-input){font-size:.875rem;height:2rem;line-height:1.25rem}.static{position:static!important}.cursor-pointer{cursor:pointer!important}.blur{--tw-blur:blur(8px)!important}.blur,.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}.visible{visibility:visible!important}.fixed{position:fixed!important}.-rotate-0{--tw-rotate:-0deg!important}.-rotate-0,.-rotate-135{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-135{--tw-rotate:-135deg!important}.-rotate-180{--tw-rotate:-180deg!important}.-rotate-180,.-rotate-225{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-225{--tw-rotate:-225deg!important}.-rotate-25{--tw-rotate:-25deg!important}.-rotate-25,.-rotate-270{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-270{--tw-rotate:-270deg!important}.-rotate-315{--tw-rotate:-315deg!important}.-rotate-315,.-rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-45{--tw-rotate:-45deg!important}.-rotate-90{--tw-rotate:-90deg!important}.-rotate-90,.rotate-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-0{--tw-rotate:0deg!important}.rotate-135{--tw-rotate:135deg!important}.rotate-135,.rotate-180{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-180{--tw-rotate:180deg!important}.rotate-225{--tw-rotate:225deg!important}.rotate-225,.rotate-25{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-25{--tw-rotate:25deg!important}.rotate-270{--tw-rotate:270deg!important}.rotate-270,.rotate-315{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-315{--tw-rotate:315deg!important}.rotate-45{--tw-rotate:45deg!important}.rotate-45,.rotate-90{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-90{--tw-rotate:90deg!important}.scale-x-flip{--tw-scale-x:-1!important}.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.scale-y-flip{--tw-scale-y:-1!important}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.text-2xl{font-size:1.5rem!important;line-height:2rem!important}.text-3xl{font-size:1.875rem!important;line-height:2.25rem!important}.text-4xl{font-size:2.25rem!important;line-height:2.5rem!important}.text-5xl{font-size:3rem!important}.text-5xl,.text-6xl{line-height:1!important}.text-6xl{font-size:3.75rem!important}.text-lg{font-size:1.125rem!important;line-height:1.75rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-xl{font-size:1.25rem!important;line-height:1.75rem!important}.text-xxs{font-size:.6875rem!important}.text-negative{--tw-text-opacity:1!important;color:rgb(185 30 40/var(--tw-text-opacity))!important}.text-negative-light{--tw-text-opacity:1!important;color:rgb(255 204 211/var(--tw-text-opacity))!important}.hover\:text-negative:hover{--tw-text-opacity:1!important;color:rgb(185 30 40/var(--tw-text-opacity))!important}.ml-1{margin-left:.25rem!important}.ml-2{margin-left:.5rem!important}.justify-between{justify-content:space-between!important}.col-start-1{grid-column-start:1!important}.col-start-2{grid-column-start:2!important}.col-start-3{grid-column-start:3!important}.col-start-4{grid-column-start:4!important}.col-start-5{grid-column-start:5!important}.col-start-6{grid-column-start:6!important}.col-start-7{grid-column-start:7!important}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}.h-6{height:1.5rem!important}.rounded{border-radius:.25rem!important}.inline{display:inline!important}.justify-center{justify-content:center!important}.mb-14{margin-bottom:3.5rem!important}.mb-6{margin-bottom:1.5rem!important}.table{display:table!important}.hidden{display:none!important}.w-6{width:1.5rem!important}.max-w-\[20rem\]{max-width:20rem!important}.self-center{align-self:center!important}.py-24{padding-bottom:6rem!important;padding-top:6rem!important}.text-center{text-align:center!important}.text-storm-medium{--tw-text-opacity:1!important;color:rgb(128 130 158/var(--tw-text-opacity))!important}.table-cell{display:table-cell!important}.w-1\/12{width:8.333333%!important}.w-10\/12{width:83.333333%!important}.w-11\/12{width:91.666667%!important}.w-2\/12{width:16.666667%!important}.w-3\/12{width:25%!important}.w-4\/12{width:33.333333%!important}.w-5\/12{width:41.666667%!important}.w-6\/12{width:50%!important}.w-7\/12{width:58.333333%!important}.w-8\/12{width:66.666667%!important}.w-9\/12{width:75%!important}.w-auto{width:auto!important}.justify-start{justify-content:flex-start!important}.justify-end{justify-content:flex-end!important}.text-storm-dark{--tw-text-opacity:1!important;color:rgb(39 40 56/var(--tw-text-opacity))!important}@media (min-width:40rem){.tablet\:w-1\/12{width:8.333333%!important}.tablet\:w-10\/12{width:83.333333%!important}.tablet\:w-11\/12{width:91.666667%!important}.tablet\:w-2\/12{width:16.666667%!important}.tablet\:w-3\/12{width:25%!important}.tablet\:w-4\/12{width:33.333333%!important}.tablet\:w-5\/12{width:41.666667%!important}.tablet\:w-6\/12{width:50%!important}.tablet\:w-7\/12{width:58.333333%!important}.tablet\:w-8\/12{width:66.666667%!important}.tablet\:w-9\/12{width:75%!important}}@media (min-width:64rem){.desktop-xs\:w-1\/12{width:8.333333%!important}.desktop-xs\:w-10\/12{width:83.333333%!important}.desktop-xs\:w-11\/12{width:91.666667%!important}.desktop-xs\:w-2\/12{width:16.666667%!important}.desktop-xs\:w-3\/12{width:25%!important}.desktop-xs\:w-4\/12{width:33.333333%!important}.desktop-xs\:w-5\/12{width:41.666667%!important}.desktop-xs\:w-6\/12{width:50%!important}.desktop-xs\:w-7\/12{width:58.333333%!important}.desktop-xs\:w-8\/12{width:66.666667%!important}.desktop-xs\:w-9\/12{width:75%!important}}@media (min-width:80rem){.desktop-sm\:w-1\/12{width:8.333333%!important}.desktop-sm\:w-10\/12{width:83.333333%!important}.desktop-sm\:w-11\/12{width:91.666667%!important}.desktop-sm\:w-2\/12{width:16.666667%!important}.desktop-sm\:w-3\/12{width:25%!important}.desktop-sm\:w-4\/12{width:33.333333%!important}.desktop-sm\:w-5\/12{width:41.666667%!important}.desktop-sm\:w-6\/12{width:50%!important}.desktop-sm\:w-7\/12{width:58.333333%!important}.desktop-sm\:w-8\/12{width:66.666667%!important}.desktop-sm\:w-9\/12{width:75%!important}}@media (min-width:85.375rem){.desktop\:w-1\/12{width:8.333333%!important}.desktop\:w-10\/12{width:83.333333%!important}.desktop\:w-11\/12{width:91.666667%!important}.desktop\:w-2\/12{width:16.666667%!important}.desktop\:w-3\/12{width:25%!important}.desktop\:w-4\/12{width:33.333333%!important}.desktop\:w-5\/12{width:41.666667%!important}.desktop\:w-6\/12{width:50%!important}.desktop\:w-7\/12{width:58.333333%!important}.desktop\:w-8\/12{width:66.666667%!important}.desktop\:w-9\/12{width:75%!important}}@media (min-width:90rem){.desktop-lg\:w-1\/12{width:8.333333%!important}.desktop-lg\:w-10\/12{width:83.333333%!important}.desktop-lg\:w-11\/12{width:91.666667%!important}.desktop-lg\:w-2\/12{width:16.666667%!important}.desktop-lg\:w-3\/12{width:25%!important}.desktop-lg\:w-4\/12{width:33.333333%!important}.desktop-lg\:w-5\/12{width:41.666667%!important}.desktop-lg\:w-6\/12{width:50%!important}.desktop-lg\:w-7\/12{width:58.333333%!important}.desktop-lg\:w-8\/12{width:66.666667%!important}.desktop-lg\:w-9\/12{width:75%!important}}@media (min-width:120rem){.desktop-xl\:w-1\/12{width:8.333333%!important}.desktop-xl\:w-10\/12{width:83.333333%!important}.desktop-xl\:w-11\/12{width:91.666667%!important}.desktop-xl\:w-2\/12{width:16.666667%!important}.desktop-xl\:w-3\/12{width:25%!important}.desktop-xl\:w-4\/12{width:33.333333%!important}.desktop-xl\:w-5\/12{width:41.666667%!important}.desktop-xl\:w-6\/12{width:50%!important}.desktop-xl\:w-7\/12{width:58.333333%!important}.desktop-xl\:w-8\/12{width:66.666667%!important}.desktop-xl\:w-9\/12{width:75%!important}}@media (min-width:64rem){.desktop-xs\:flex{display:flex!important}}.bottom-0{bottom:0!important}.left-0{left:0!important}.block{display:block!important}.w-3\/4{width:75%!important}.gap-4{gap:1rem!important}.border{border-width:1px!important}.border-transparent{border-color:transparent!important}.border-t-mystic-dark{--tw-border-opacity:1!important;border-top-color:rgb(218 230 240/var(--tw-border-opacity))!important}.p-4{padding:1rem!important}@media (min-width:64rem){.desktop-xs\:hidden{display:none!important}.desktop-xs\:w-48{width:12rem!important}.desktop-xs\:w-auto{width:auto!important}.desktop-xs\:flex-row{flex-direction:row!important}}.m-0{margin:0!important}.table-row{display:table-row!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}

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

@@ -1 +1 @@
-.flex{display:flex!important}*{box-sizing:border-box}p-pagination{display:flex}.static{position:static!important}.mb-14{margin-bottom:3.5rem!important}.mb-6{margin-bottom:1.5rem!important}.table{display:table!important}.hidden{display:none!important}.h-6{height:1.5rem!important}.w-6{width:1.5rem!important}.max-w-\[20rem\]{max-width:20rem!important}.cursor-pointer{cursor:pointer!important}.flex-col{flex-direction:column!important}.items-center{align-items:center!important}.self-center{align-self:center!important}.rounded{border-radius:.25rem!important}.py-24{padding-bottom:6rem!important;padding-top:6rem!important}.text-center{text-align:center!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.font-semibold{font-weight:600!important}.text-storm-medium{--tw-text-opacity:1!important;color:rgb(128 130 158/var(--tw-text-opacity))!important}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}.table-cell{display:table-cell!important}.w-1\/12{width:8.333333%!important}.w-10\/12{width:83.333333%!important}.w-11\/12{width:91.666667%!important}.w-2\/12{width:16.666667%!important}.w-3\/12{width:25%!important}.w-4\/12{width:33.333333%!important}.w-5\/12{width:41.666667%!important}.w-6\/12{width:50%!important}.w-7\/12{width:58.333333%!important}.w-8\/12{width:66.666667%!important}.w-9\/12{width:75%!important}.w-auto{width:auto!important}.w-full{width:100%!important}.flex-1{flex:1 1 0%!important}.justify-start{justify-content:flex-start!important}.justify-end{justify-content:flex-end!important}.justify-center{justify-content:center!important}.text-storm-dark{--tw-text-opacity:1!important;color:rgb(39 40 56/var(--tw-text-opacity))!important}@media (min-width:40rem){.tablet\:w-1\/12{width:8.333333%!important}.tablet\:w-10\/12{width:83.333333%!important}.tablet\:w-11\/12{width:91.666667%!important}.tablet\:w-2\/12{width:16.666667%!important}.tablet\:w-3\/12{width:25%!important}.tablet\:w-4\/12{width:33.333333%!important}.tablet\:w-5\/12{width:41.666667%!important}.tablet\:w-6\/12{width:50%!important}.tablet\:w-7\/12{width:58.333333%!important}.tablet\:w-8\/12{width:66.666667%!important}.tablet\:w-9\/12{width:75%!important}}@media (min-width:64rem){.desktop-xs\:w-1\/12{width:8.333333%!important}.desktop-xs\:w-10\/12{width:83.333333%!important}.desktop-xs\:w-11\/12{width:91.666667%!important}.desktop-xs\:w-2\/12{width:16.666667%!important}.desktop-xs\:w-3\/12{width:25%!important}.desktop-xs\:w-4\/12{width:33.333333%!important}.desktop-xs\:w-5\/12{width:41.666667%!important}.desktop-xs\:w-6\/12{width:50%!important}.desktop-xs\:w-7\/12{width:58.333333%!important}.desktop-xs\:w-8\/12{width:66.666667%!important}.desktop-xs\:w-9\/12{width:75%!important}}@media (min-width:80rem){.desktop-sm\:w-1\/12{width:8.333333%!important}.desktop-sm\:w-10\/12{width:83.333333%!important}.desktop-sm\:w-11\/12{width:91.666667%!important}.desktop-sm\:w-2\/12{width:16.666667%!important}.desktop-sm\:w-3\/12{width:25%!important}.desktop-sm\:w-4\/12{width:33.333333%!important}.desktop-sm\:w-5\/12{width:41.666667%!important}.desktop-sm\:w-6\/12{width:50%!important}.desktop-sm\:w-7\/12{width:58.333333%!important}.desktop-sm\:w-8\/12{width:66.666667%!important}.desktop-sm\:w-9\/12{width:75%!important}}@media (min-width:85.375rem){.desktop\:w-1\/12{width:8.333333%!important}.desktop\:w-10\/12{width:83.333333%!important}.desktop\:w-11\/12{width:91.666667%!important}.desktop\:w-2\/12{width:16.666667%!important}.desktop\:w-3\/12{width:25%!important}.desktop\:w-4\/12{width:33.333333%!important}.desktop\:w-5\/12{width:41.666667%!important}.desktop\:w-6\/12{width:50%!important}.desktop\:w-7\/12{width:58.333333%!important}.desktop\:w-8\/12{width:66.666667%!important}.desktop\:w-9\/12{width:75%!important}}@media (min-width:90rem){.desktop-lg\:w-1\/12{width:8.333333%!important}.desktop-lg\:w-10\/12{width:83.333333%!important}.desktop-lg\:w-11\/12{width:91.666667%!important}.desktop-lg\:w-2\/12{width:16.666667%!important}.desktop-lg\:w-3\/12{width:25%!important}.desktop-lg\:w-4\/12{width:33.333333%!important}.desktop-lg\:w-5\/12{width:41.666667%!important}.desktop-lg\:w-6\/12{width:50%!important}.desktop-lg\:w-7\/12{width:58.333333%!important}.desktop-lg\:w-8\/12{width:66.666667%!important}.desktop-lg\:w-9\/12{width:75%!important}}@media (min-width:120rem){.desktop-xl\:w-1\/12{width:8.333333%!important}.desktop-xl\:w-10\/12{width:83.333333%!important}.desktop-xl\:w-11\/12{width:91.666667%!important}.desktop-xl\:w-2\/12{width:16.666667%!important}.desktop-xl\:w-3\/12{width:25%!important}.desktop-xl\:w-4\/12{width:33.333333%!important}.desktop-xl\:w-5\/12{width:41.666667%!important}.desktop-xl\:w-6\/12{width:50%!important}.desktop-xl\:w-7\/12{width:58.333333%!important}.desktop-xl\:w-8\/12{width:66.666667%!important}.desktop-xl\:w-9\/12{width:75%!important}}.h-8{height:2rem!important}@media (min-width:64rem){.desktop-xs\:flex{display:flex!important}}.fixed{position:fixed!important}.bottom-0{bottom:0!important}.left-0{left:0!important}.ml-1{margin-left:.25rem!important}.block{display:block!important}.w-3\/4{width:75%!important}.gap-4{gap:1rem!important}.border{border-width:1px!important}.border-solid{border-style:solid!important}.border-transparent{border-color:transparent!important}.border-t-mystic-dark{--tw-border-opacity:1!important;border-top-color:rgb(218 230 240/var(--tw-border-opacity))!important}.bg-white{--tw-bg-opacity:1!important;background-color:rgb(255 255 255/var(--tw-bg-opacity))!important}.p-4{padding:1rem!important}@media (min-width:64rem){.desktop-xs\:hidden{display:none!important}.desktop-xs\:w-48{width:12rem!important}.desktop-xs\:w-auto{width:auto!important}.desktop-xs\:flex-row{flex-direction:row!important}}.m-0{margin:0!important}.table-row{display:table-row!important}.visible{visibility:visible!important}.absolute{position:absolute!important}.blur{--tw-blur:blur(8px)!important;filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.-rotate-0{--tw-rotate:-0deg!important}.-rotate-0,.-rotate-135{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-135{--tw-rotate:-135deg!important}.-rotate-180{--tw-rotate:-180deg!important}.-rotate-180,.-rotate-225{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-225{--tw-rotate:-225deg!important}.-rotate-25{--tw-rotate:-25deg!important}.-rotate-25,.-rotate-270{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-270{--tw-rotate:-270deg!important}.-rotate-315{--tw-rotate:-315deg!important}.-rotate-315,.-rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-45{--tw-rotate:-45deg!important}.-rotate-90{--tw-rotate:-90deg!important}.-rotate-90,.rotate-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-0{--tw-rotate:0deg!important}.rotate-135{--tw-rotate:135deg!important}.rotate-135,.rotate-180{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-180{--tw-rotate:180deg!important}.rotate-225{--tw-rotate:225deg!important}.rotate-225,.rotate-25{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-25{--tw-rotate:25deg!important}.rotate-270{--tw-rotate:270deg!important}.rotate-270,.rotate-315{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-315{--tw-rotate:315deg!important}.rotate-45{--tw-rotate:45deg!important}.rotate-45,.rotate-90{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-90{--tw-rotate:90deg!important}.scale-x-flip{--tw-scale-x:-1!important}.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.scale-y-flip{--tw-scale-y:-1!important}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.text-2xl{font-size:1.5rem!important;line-height:2rem!important}.text-3xl{font-size:1.875rem!important;line-height:2.25rem!important}.text-4xl{font-size:2.25rem!important;line-height:2.5rem!important}.text-5xl{font-size:3rem!important}.text-5xl,.text-6xl{line-height:1!important}.text-6xl{font-size:3.75rem!important}.text-base{font-size:1rem!important;line-height:1.5rem!important}.text-lg{font-size:1.125rem!important}.text-lg,.text-xl{line-height:1.75rem!important}.text-xl{font-size:1.25rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.text-xxs{font-size:.6875rem!important}.text-negative{--tw-text-opacity:1!important;color:rgb(185 30 40/var(--tw-text-opacity))!important}.text-negative-light{--tw-text-opacity:1!important;color:rgb(255 204 211/var(--tw-text-opacity))!important}.hover\:text-negative:hover{--tw-text-opacity:1!important;color:rgb(185 30 40/var(--tw-text-opacity))!important}.ml-2{margin-left:.5rem!important}.items-end{align-items:flex-end!important}.justify-between{justify-content:space-between!important}.rounded-bl-none{border-bottom-left-radius:0!important}.rounded-br-none{border-bottom-right-radius:0!important}.rounded-tl-none{border-top-left-radius:0!important}.rounded-tr-none{border-top-right-radius:0!important}.border-l-0{border-left-width:0!important}.border-r-0{border-right-width:0!important}.pl-0{padding-left:0!important}.pr-0{padding-right:0!important}.inline{display:inline!important}
+.flex{display:flex!important}*{box-sizing:border-box}p-pagination{display:flex}.static{position:static!important}.mb-14{margin-bottom:3.5rem!important}.mb-6{margin-bottom:1.5rem!important}.table{display:table!important}.hidden{display:none!important}.h-6{height:1.5rem!important}.w-6{width:1.5rem!important}.max-w-\[20rem\]{max-width:20rem!important}.cursor-pointer{cursor:pointer!important}.flex-col{flex-direction:column!important}.items-center{align-items:center!important}.self-center{align-self:center!important}.rounded{border-radius:.25rem!important}.py-24{padding-bottom:6rem!important;padding-top:6rem!important}.text-center{text-align:center!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.font-semibold{font-weight:600!important}.text-storm-medium{--tw-text-opacity:1!important;color:rgb(128 130 158/var(--tw-text-opacity))!important}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}.table-cell{display:table-cell!important}.w-1\/12{width:8.333333%!important}.w-10\/12{width:83.333333%!important}.w-11\/12{width:91.666667%!important}.w-2\/12{width:16.666667%!important}.w-3\/12{width:25%!important}.w-4\/12{width:33.333333%!important}.w-5\/12{width:41.666667%!important}.w-6\/12{width:50%!important}.w-7\/12{width:58.333333%!important}.w-8\/12{width:66.666667%!important}.w-9\/12{width:75%!important}.w-auto{width:auto!important}.w-full{width:100%!important}.flex-1{flex:1 1 0%!important}.justify-start{justify-content:flex-start!important}.justify-end{justify-content:flex-end!important}.justify-center{justify-content:center!important}.text-storm-dark{--tw-text-opacity:1!important;color:rgb(39 40 56/var(--tw-text-opacity))!important}@media (min-width:40rem){.tablet\:w-1\/12{width:8.333333%!important}.tablet\:w-10\/12{width:83.333333%!important}.tablet\:w-11\/12{width:91.666667%!important}.tablet\:w-2\/12{width:16.666667%!important}.tablet\:w-3\/12{width:25%!important}.tablet\:w-4\/12{width:33.333333%!important}.tablet\:w-5\/12{width:41.666667%!important}.tablet\:w-6\/12{width:50%!important}.tablet\:w-7\/12{width:58.333333%!important}.tablet\:w-8\/12{width:66.666667%!important}.tablet\:w-9\/12{width:75%!important}}@media (min-width:64rem){.desktop-xs\:w-1\/12{width:8.333333%!important}.desktop-xs\:w-10\/12{width:83.333333%!important}.desktop-xs\:w-11\/12{width:91.666667%!important}.desktop-xs\:w-2\/12{width:16.666667%!important}.desktop-xs\:w-3\/12{width:25%!important}.desktop-xs\:w-4\/12{width:33.333333%!important}.desktop-xs\:w-5\/12{width:41.666667%!important}.desktop-xs\:w-6\/12{width:50%!important}.desktop-xs\:w-7\/12{width:58.333333%!important}.desktop-xs\:w-8\/12{width:66.666667%!important}.desktop-xs\:w-9\/12{width:75%!important}}@media (min-width:80rem){.desktop-sm\:w-1\/12{width:8.333333%!important}.desktop-sm\:w-10\/12{width:83.333333%!important}.desktop-sm\:w-11\/12{width:91.666667%!important}.desktop-sm\:w-2\/12{width:16.666667%!important}.desktop-sm\:w-3\/12{width:25%!important}.desktop-sm\:w-4\/12{width:33.333333%!important}.desktop-sm\:w-5\/12{width:41.666667%!important}.desktop-sm\:w-6\/12{width:50%!important}.desktop-sm\:w-7\/12{width:58.333333%!important}.desktop-sm\:w-8\/12{width:66.666667%!important}.desktop-sm\:w-9\/12{width:75%!important}}@media (min-width:85.375rem){.desktop\:w-1\/12{width:8.333333%!important}.desktop\:w-10\/12{width:83.333333%!important}.desktop\:w-11\/12{width:91.666667%!important}.desktop\:w-2\/12{width:16.666667%!important}.desktop\:w-3\/12{width:25%!important}.desktop\:w-4\/12{width:33.333333%!important}.desktop\:w-5\/12{width:41.666667%!important}.desktop\:w-6\/12{width:50%!important}.desktop\:w-7\/12{width:58.333333%!important}.desktop\:w-8\/12{width:66.666667%!important}.desktop\:w-9\/12{width:75%!important}}@media (min-width:90rem){.desktop-lg\:w-1\/12{width:8.333333%!important}.desktop-lg\:w-10\/12{width:83.333333%!important}.desktop-lg\:w-11\/12{width:91.666667%!important}.desktop-lg\:w-2\/12{width:16.666667%!important}.desktop-lg\:w-3\/12{width:25%!important}.desktop-lg\:w-4\/12{width:33.333333%!important}.desktop-lg\:w-5\/12{width:41.666667%!important}.desktop-lg\:w-6\/12{width:50%!important}.desktop-lg\:w-7\/12{width:58.333333%!important}.desktop-lg\:w-8\/12{width:66.666667%!important}.desktop-lg\:w-9\/12{width:75%!important}}@media (min-width:120rem){.desktop-xl\:w-1\/12{width:8.333333%!important}.desktop-xl\:w-10\/12{width:83.333333%!important}.desktop-xl\:w-11\/12{width:91.666667%!important}.desktop-xl\:w-2\/12{width:16.666667%!important}.desktop-xl\:w-3\/12{width:25%!important}.desktop-xl\:w-4\/12{width:33.333333%!important}.desktop-xl\:w-5\/12{width:41.666667%!important}.desktop-xl\:w-6\/12{width:50%!important}.desktop-xl\:w-7\/12{width:58.333333%!important}.desktop-xl\:w-8\/12{width:66.666667%!important}.desktop-xl\:w-9\/12{width:75%!important}}.h-8{height:2rem!important}@media (min-width:64rem){.desktop-xs\:flex{display:flex!important}}.fixed{position:fixed!important}.bottom-0{bottom:0!important}.left-0{left:0!important}.ml-1{margin-left:.25rem!important}.block{display:block!important}.w-3\/4{width:75%!important}.gap-4{gap:1rem!important}.border{border-width:1px!important}.border-solid{border-style:solid!important}.border-transparent{border-color:transparent!important}.border-t-mystic-dark{--tw-border-opacity:1!important;border-top-color:rgb(218 230 240/var(--tw-border-opacity))!important}.bg-white{--tw-bg-opacity:1!important;background-color:rgb(255 255 255/var(--tw-bg-opacity))!important}.p-4{padding:1rem!important}@media (min-width:64rem){.desktop-xs\:hidden{display:none!important}.desktop-xs\:w-48{width:12rem!important}.desktop-xs\:w-auto{width:auto!important}.desktop-xs\:flex-row{flex-direction:row!important}}.m-0{margin:0!important}.table-row{display:table-row!important}.visible{visibility:visible!important}.blur{--tw-blur:blur(8px)!important;filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.-rotate-0{--tw-rotate:-0deg!important}.-rotate-0,.-rotate-135{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-135{--tw-rotate:-135deg!important}.-rotate-180{--tw-rotate:-180deg!important}.-rotate-180,.-rotate-225{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-225{--tw-rotate:-225deg!important}.-rotate-25{--tw-rotate:-25deg!important}.-rotate-25,.-rotate-270{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-270{--tw-rotate:-270deg!important}.-rotate-315{--tw-rotate:-315deg!important}.-rotate-315,.-rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-45{--tw-rotate:-45deg!important}.-rotate-90{--tw-rotate:-90deg!important}.-rotate-90,.rotate-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-0{--tw-rotate:0deg!important}.rotate-135{--tw-rotate:135deg!important}.rotate-135,.rotate-180{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-180{--tw-rotate:180deg!important}.rotate-225{--tw-rotate:225deg!important}.rotate-225,.rotate-25{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-25{--tw-rotate:25deg!important}.rotate-270{--tw-rotate:270deg!important}.rotate-270,.rotate-315{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-315{--tw-rotate:315deg!important}.rotate-45{--tw-rotate:45deg!important}.rotate-45,.rotate-90{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-90{--tw-rotate:90deg!important}.scale-x-flip{--tw-scale-x:-1!important}.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.scale-y-flip{--tw-scale-y:-1!important}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.text-2xl{font-size:1.5rem!important;line-height:2rem!important}.text-3xl{font-size:1.875rem!important;line-height:2.25rem!important}.text-4xl{font-size:2.25rem!important;line-height:2.5rem!important}.text-5xl{font-size:3rem!important}.text-5xl,.text-6xl{line-height:1!important}.text-6xl{font-size:3.75rem!important}.text-base{font-size:1rem!important;line-height:1.5rem!important}.text-lg{font-size:1.125rem!important}.text-lg,.text-xl{line-height:1.75rem!important}.text-xl{font-size:1.25rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.text-xxs{font-size:.6875rem!important}.text-negative{--tw-text-opacity:1!important;color:rgb(185 30 40/var(--tw-text-opacity))!important}.text-negative-light{--tw-text-opacity:1!important;color:rgb(255 204 211/var(--tw-text-opacity))!important}.hover\:text-negative:hover{--tw-text-opacity:1!important;color:rgb(185 30 40/var(--tw-text-opacity))!important}.ml-2{margin-left:.5rem!important}.items-end{align-items:flex-end!important}.justify-between{justify-content:space-between!important}.rounded-bl-none{border-bottom-left-radius:0!important}.rounded-br-none{border-bottom-right-radius:0!important}.rounded-tl-none{border-top-left-radius:0!important}.rounded-tr-none{border-top-right-radius:0!important}.border-l-0{border-left-width:0!important}.border-r-0{border-right-width:0!important}.pl-0{padding-left:0!important}.pr-0{padding-right:0!important}.inline{display:inline!important}

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

@@ -1 +1 @@
-.flex{display:flex!important}.h-\[3\.125rem\]{height:3.125rem!important}.h-\[4\.125rem\]{height:4.125rem!important}.flex-col{flex-direction:column!important}.items-center{align-items:center!important}.justify-center{justify-content:center!important}.gap-3{gap:.75rem!important}.overflow-hidden{overflow:hidden!important}.text-ellipsis{text-overflow:ellipsis!important}.rounded{border-radius:.25rem!important}.border{border-width:1px!important}.border-solid{border-style:solid!important}.border-mystic-dark{--tw-border-opacity:1!important;border-color:rgb(218 230 240/var(--tw-border-opacity))!important}.p-2{padding:.5rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}*{box-sizing:border-box}:host{display:flex}:host .content{align-items:center;display:flex;gap:.75rem;width:100%}:host .content .name{display:flex;flex-direction:column;justify-content:center;overflow:hidden}:host .content .name>:first-child{--tw-text-opacity:1;color:rgb(39 40 56/var(--tw-text-opacity));font-size:.875rem;font-weight:600;line-height:1.25rem}:host .content .name>:nth-child(2){--tw-text-opacity:1;color:rgb(152 154 183/var(--tw-text-opacity));font-size:.875rem;line-height:1.25rem}:host .content .name ::slotted(*){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host([size=small]){height:2rem}:host([size=medium]){height:3.125rem}:host([size=large]){height:4rem}:host(.has-dropdown){cursor:pointer}:host(.has-dropdown) .content{--tw-border-opacity:1!important;border-color:rgb(218 230 240/var(--tw-border-opacity))!important;border-radius:.25rem;border-style:solid!important;border-width:1px!important;padding:.5rem}:host(.has-dropdown[size=small]){height:3rem}:host(.has-dropdown[size=medium]){height:4.125rem}:host(.has-dropdown[size=large]){height:5rem}:host(.active) .content,:host(.has-dropdown:hover) .content{--tw-shadow:0px 0.3125rem 1rem rgba(0,24,98,.08),0px 0.0625rem 0.1875rem rgba(0,24,98,.13);--tw-shadow-colored:0px 0.3125rem 1rem var(--tw-shadow-color),0px 0.0625rem 0.1875rem var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}:host(.active) .content p-icon{--tw-text-opacity:1;color:rgb(82 138 250/var(--tw-text-opacity))}.static{position:static!important}.absolute{position:absolute!important}.ml-auto{margin-left:auto!important}.w-full{width:100%!important}.min-w-0{min-width:0!important}.visible{visibility:visible!important}.-rotate-0{--tw-rotate:-0deg!important}.-rotate-0,.-rotate-135{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-135{--tw-rotate:-135deg!important}.-rotate-180{--tw-rotate:-180deg!important}.-rotate-180,.-rotate-225{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-225{--tw-rotate:-225deg!important}.-rotate-25{--tw-rotate:-25deg!important}.-rotate-25,.-rotate-270{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-270{--tw-rotate:-270deg!important}.-rotate-315{--tw-rotate:-315deg!important}.-rotate-315,.-rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-45{--tw-rotate:-45deg!important}.-rotate-90{--tw-rotate:-90deg!important}.-rotate-90,.rotate-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-0{--tw-rotate:0deg!important}.rotate-135{--tw-rotate:135deg!important}.rotate-135,.rotate-180{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-180{--tw-rotate:180deg!important}.rotate-225{--tw-rotate:225deg!important}.rotate-225,.rotate-25{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-25{--tw-rotate:25deg!important}.rotate-270{--tw-rotate:270deg!important}.rotate-270,.rotate-315{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-315{--tw-rotate:315deg!important}.rotate-45{--tw-rotate:45deg!important}.rotate-45,.rotate-90{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-90{--tw-rotate:90deg!important}.scale-x-flip{--tw-scale-x:-1!important}.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.scale-y-flip{--tw-scale-y:-1!important}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.text-2xl{font-size:1.5rem!important;line-height:2rem!important}.text-3xl{font-size:1.875rem!important;line-height:2.25rem!important}.text-4xl{font-size:2.25rem!important;line-height:2.5rem!important}.text-5xl{font-size:3rem!important}.text-5xl,.text-6xl{line-height:1!important}.text-6xl{font-size:3.75rem!important}.text-base{font-size:1rem!important;line-height:1.5rem!important}.text-lg{font-size:1.125rem!important}.text-lg,.text-xl{line-height:1.75rem!important}.text-xl{font-size:1.25rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.text-xxs{font-size:.6875rem!important}
+.flex{display:flex!important}.h-\[3\.125rem\]{height:3.125rem!important}.h-\[4\.125rem\]{height:4.125rem!important}.flex-col{flex-direction:column!important}.items-center{align-items:center!important}.justify-center{justify-content:center!important}.gap-3{gap:.75rem!important}.overflow-hidden{overflow:hidden!important}.text-ellipsis{text-overflow:ellipsis!important}.rounded{border-radius:.25rem!important}.border{border-width:1px!important}.border-solid{border-style:solid!important}.border-mystic-dark{--tw-border-opacity:1!important;border-color:rgb(218 230 240/var(--tw-border-opacity))!important}.p-2{padding:.5rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}*{box-sizing:border-box}:host{display:flex}:host .content{align-items:center;display:flex;gap:.75rem;width:100%}:host .content .name{display:flex;flex-direction:column;justify-content:center;overflow:hidden}:host .content .name>:first-child{--tw-text-opacity:1;color:rgb(39 40 56/var(--tw-text-opacity));font-size:.875rem;font-weight:600;line-height:1.25rem}:host .content .name>:nth-child(2){--tw-text-opacity:1;color:rgb(152 154 183/var(--tw-text-opacity));font-size:.875rem;line-height:1.25rem}:host .content .name ::slotted(*){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host([size=small]){height:2rem}:host([size=medium]){height:3.125rem}:host([size=large]){height:4rem}:host(.has-dropdown){cursor:pointer}:host(.has-dropdown) .content{--tw-border-opacity:1!important;border-color:rgb(218 230 240/var(--tw-border-opacity))!important;border-radius:.25rem;border-style:solid!important;border-width:1px!important;padding:.5rem}:host(.has-dropdown[size=small]){height:3rem}:host(.has-dropdown[size=medium]){height:4.125rem}:host(.has-dropdown[size=large]){height:5rem}:host(.active) .content,:host(.has-dropdown:hover) .content{--tw-shadow:0px 0.3125rem 1rem rgba(0,24,98,.08),0px 0.0625rem 0.1875rem rgba(0,24,98,.13);--tw-shadow-colored:0px 0.3125rem 1rem var(--tw-shadow-color),0px 0.0625rem 0.1875rem var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}:host(.active) .content p-icon{--tw-text-opacity:1;color:rgb(82 138 250/var(--tw-text-opacity))}.static{position:static!important}.absolute{position:absolute!important}.ml-auto{margin-left:auto!important}.w-full{width:100%!important}.min-w-0{min-width:0!important}.visible{visibility:visible!important}.fixed{position:fixed!important}.-rotate-0{--tw-rotate:-0deg!important}.-rotate-0,.-rotate-135{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-135{--tw-rotate:-135deg!important}.-rotate-180{--tw-rotate:-180deg!important}.-rotate-180,.-rotate-225{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-225{--tw-rotate:-225deg!important}.-rotate-25{--tw-rotate:-25deg!important}.-rotate-25,.-rotate-270{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-270{--tw-rotate:-270deg!important}.-rotate-315{--tw-rotate:-315deg!important}.-rotate-315,.-rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-45{--tw-rotate:-45deg!important}.-rotate-90{--tw-rotate:-90deg!important}.-rotate-90,.rotate-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-0{--tw-rotate:0deg!important}.rotate-135{--tw-rotate:135deg!important}.rotate-135,.rotate-180{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-180{--tw-rotate:180deg!important}.rotate-225{--tw-rotate:225deg!important}.rotate-225,.rotate-25{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-25{--tw-rotate:25deg!important}.rotate-270{--tw-rotate:270deg!important}.rotate-270,.rotate-315{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-315{--tw-rotate:315deg!important}.rotate-45{--tw-rotate:45deg!important}.rotate-45,.rotate-90{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-90{--tw-rotate:90deg!important}.scale-x-flip{--tw-scale-x:-1!important}.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.scale-y-flip{--tw-scale-y:-1!important}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.text-2xl{font-size:1.5rem!important;line-height:2rem!important}.text-3xl{font-size:1.875rem!important;line-height:2.25rem!important}.text-4xl{font-size:2.25rem!important;line-height:2.5rem!important}.text-5xl{font-size:3rem!important}.text-5xl,.text-6xl{line-height:1!important}.text-6xl{font-size:3.75rem!important}.text-base{font-size:1rem!important;line-height:1.5rem!important}.text-lg{font-size:1.125rem!important}.text-lg,.text-xl{line-height:1.75rem!important}.text-xl{font-size:1.25rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.text-xxs{font-size:.6875rem!important}

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

@@ -11,7 +11,7 @@ export class Profile {
   render() {
     const hasDropdownSlot = !!this._el.querySelector(':scope > [slot="dropdown"]');
     const content = this._getContent(hasDropdownSlot);
-    return (h(Host, { class: `p-profile ${hasDropdownSlot && 'has-dropdown'} ${this._dropdownOpen && 'active'}` }, hasDropdownSlot ? (h("p-dropdown", { class: "w-full min-w-0", strategy: "absolute", placement: this.variant === 'user' ? 'top-end' : 'bottom-end', onIsOpen: (ev) => (this._dropdownOpen = ev.detail) }, content, h("div", { slot: "items" }, h("slot", { name: "dropdown" })))) : (content)));
+    return (h(Host, { class: `p-profile ${hasDropdownSlot && 'has-dropdown'} ${this._dropdownOpen && 'active'}` }, hasDropdownSlot ? (h("p-dropdown", { class: "w-full min-w-0", strategy: "absolute", placement: this.variant === 'user' ? 'top-end' : 'bottom-end', applyFullWidth: true, applyMaxWidth: false, onIsOpen: (ev) => (this._dropdownOpen = ev.detail) }, content, h("div", { slot: "items" }, h("slot", { name: "dropdown" })))) : (content)));
   }
   _getContent(hasDropdownSlot) {
     return (h("div", { class: "content", slot: "trigger" }, h("slot", { name: "avatar" }), h("div", { class: "name" }, h("slot", { name: "title" }), h("slot", { name: "subtitle" })), hasDropdownSlot && this._getIcon()));

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

@@ -1 +1 @@
-{"version":3,"file":"profile.component.js","sourceRoot":"","sources":["../../../../src/components/molecules/profile/profile.component.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAOzE,MAAM,OAAO,OAAO;;mBAIsB,MAAM;gBAKkB,OAAO;yBAOpC,KAAK;;EAEtC,mBAAmB;IACf,IAAI,CAAC,aAAa,EAAE,CAAC;EACzB,CAAC;EAED,MAAM;IACF,MAAM,eAAe,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,aAAa,CAC5C,4BAA4B,CAC/B,CAAC;IACF,MAAM,OAAO,GAAG,IAAI,CAAC,WAAW,CAAC,eAAe,CAAC,CAAC;IAClD,OAAO,CACH,EAAC,IAAI,IACD,KAAK,EAAE,aAAa,eAAe,IAAI,cAAc,IACjD,IAAI,CAAC,aAAa,IAAI,QAC1B,EAAE,IAED,eAAe,CAAC,CAAC,CAAC,CACf,kBACI,KAAK,EAAC,gBAAgB,EACtB,QAAQ,EAAC,UAAU,EACnB,SAAS,EACL,IAAI,CAAC,OAAO,KAAK,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,YAAY,EAEtD,QAAQ,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,aAAa,GAAG,EAAE,CAAC,MAAM,CAAC;MAEjD,OAAO;MACR,WAAK,IAAI,EAAC,OAAO;QACb,YAAM,IAAI,EAAC,UAAU,GAAG,CACtB,CACG,CAChB,CAAC,CAAC,CAAC,CACA,OAAO,CACV,CACE,CACV,CAAC;EACN,CAAC;EAEO,WAAW,CAAC,eAAe;IAC/B,OAAO,CACH,WAAK,KAAK,EAAC,SAAS,EAAC,IAAI,EAAC,SAAS;MAC/B,YAAM,IAAI,EAAC,QAAQ,GAAG;MACtB,WAAK,KAAK,EAAC,MAAM;QACb,YAAM,IAAI,EAAC,OAAO,GAAG;QACrB,YAAM,IAAI,EAAC,UAAU,GAAG,CACtB;MAEL,eAAe,IAAI,IAAI,CAAC,QAAQ,EAAE,CACjC,CACT,CAAC;EACN,CAAC;EAEO,aAAa;;IACjB,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,aAAa,CACjC,yBAAyB,CACN,CAAC;IAExB,IAAI,CAAC,MAAM,EAAE;MACT,OAAO;KACV;IAED,MAAM,CAAC,OAAO,GAAG,MAAA,IAAI,CAAC,OAAO,mCAAI,MAAM,CAAC,OAAO,CAAC;IAChD,MAAM,CAAC,IAAI,GAAG,MAAA,IAAI,CAAC,IAAI,mCAAI,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,IAAI,CAAC;EAC5C,CAAC;EAEO,QAAQ;IACZ,OAAO,CACH,cACI,KAAK,EAAC,SAAS,EACf,OAAO,EAAE,IAAI,CAAC,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,GAC1D,CACL,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Element, h, Host, Prop, State } from '@stencil/core';\n\n@Component({\n    tag: 'p-profile',\n    styleUrl: 'profile.component.scss',\n    shadow: true,\n})\nexport class Profile {\n    /**\n     * The variant of the profile\n     */\n    @Prop() variant: 'company' | 'user' = 'user';\n\n    /**\n     * The size of the profile avatar\n     */\n    @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'small';\n\n    /**\n     * The host element\n     */\n    @Element() private _el: HTMLElement;\n\n    @State() private _dropdownOpen = false;\n\n    componentWillRender() {\n        this._updateAvatar();\n    }\n\n    render() {\n        const hasDropdownSlot = !!this._el.querySelector(\n            ':scope > [slot=\"dropdown\"]'\n        );\n        const content = this._getContent(hasDropdownSlot);\n        return (\n            <Host\n                class={`p-profile ${hasDropdownSlot && 'has-dropdown'} ${\n                    this._dropdownOpen && 'active'\n                }`}\n            >\n                {hasDropdownSlot ? (\n                    <p-dropdown\n                        class=\"w-full min-w-0\"\n                        strategy=\"absolute\"\n                        placement={\n                            this.variant === 'user' ? 'top-end' : 'bottom-end'\n                        }\n                        onIsOpen={(ev) => (this._dropdownOpen = ev.detail)}\n                    >\n                        {content}\n                        <div slot=\"items\">\n                            <slot name=\"dropdown\" />\n                        </div>\n                    </p-dropdown>\n                ) : (\n                    content\n                )}\n            </Host>\n        );\n    }\n\n    private _getContent(hasDropdownSlot) {\n        return (\n            <div class=\"content\" slot=\"trigger\">\n                <slot name=\"avatar\" />\n                <div class=\"name\">\n                    <slot name=\"title\" />\n                    <slot name=\"subtitle\" />\n                </div>\n\n                {hasDropdownSlot && this._getIcon()}\n            </div>\n        );\n    }\n\n    private _updateAvatar() {\n        const avatar = this._el.querySelector(\n            'p-avatar[slot=\"avatar\"]'\n        ) as HTMLPAvatarElement;\n\n        if (!avatar) {\n            return;\n        }\n\n        avatar.variant = this.variant ?? avatar.variant;\n        avatar.size = this.size ?? avatar?.size;\n    }\n\n    private _getIcon() {\n        return (\n            <p-icon\n                class=\"ml-auto\"\n                variant={this.variant === 'company' ? 'chevron' : 'more'}\n            />\n        );\n    }\n}\n"]}
+{"version":3,"file":"profile.component.js","sourceRoot":"","sources":["../../../../src/components/molecules/profile/profile.component.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAOzE,MAAM,OAAO,OAAO;;mBAIsB,MAAM;gBAKkB,OAAO;yBAOpC,KAAK;;EAEtC,mBAAmB;IACf,IAAI,CAAC,aAAa,EAAE,CAAC;EACzB,CAAC;EAED,MAAM;IACF,MAAM,eAAe,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,aAAa,CAC5C,4BAA4B,CAC/B,CAAC;IACF,MAAM,OAAO,GAAG,IAAI,CAAC,WAAW,CAAC,eAAe,CAAC,CAAC;IAClD,OAAO,CACH,EAAC,IAAI,IACD,KAAK,EAAE,aAAa,eAAe,IAAI,cAAc,IACjD,IAAI,CAAC,aAAa,IAAI,QAC1B,EAAE,IAED,eAAe,CAAC,CAAC,CAAC,CACf,kBACI,KAAK,EAAC,gBAAgB,EACtB,QAAQ,EAAC,UAAU,EACnB,SAAS,EACL,IAAI,CAAC,OAAO,KAAK,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,YAAY,EAEtD,cAAc,EAAE,IAAI,EACpB,aAAa,EAAE,KAAK,EACpB,QAAQ,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,aAAa,GAAG,EAAE,CAAC,MAAM,CAAC;MAEjD,OAAO;MACR,WAAK,IAAI,EAAC,OAAO;QACb,YAAM,IAAI,EAAC,UAAU,GAAG,CACtB,CACG,CAChB,CAAC,CAAC,CAAC,CACA,OAAO,CACV,CACE,CACV,CAAC;EACN,CAAC;EAEO,WAAW,CAAC,eAAe;IAC/B,OAAO,CACH,WAAK,KAAK,EAAC,SAAS,EAAC,IAAI,EAAC,SAAS;MAC/B,YAAM,IAAI,EAAC,QAAQ,GAAG;MACtB,WAAK,KAAK,EAAC,MAAM;QACb,YAAM,IAAI,EAAC,OAAO,GAAG;QACrB,YAAM,IAAI,EAAC,UAAU,GAAG,CACtB;MAEL,eAAe,IAAI,IAAI,CAAC,QAAQ,EAAE,CACjC,CACT,CAAC;EACN,CAAC;EAEO,aAAa;;IACjB,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,aAAa,CACjC,yBAAyB,CACN,CAAC;IAExB,IAAI,CAAC,MAAM,EAAE;MACT,OAAO;KACV;IAED,MAAM,CAAC,OAAO,GAAG,MAAA,IAAI,CAAC,OAAO,mCAAI,MAAM,CAAC,OAAO,CAAC;IAChD,MAAM,CAAC,IAAI,GAAG,MAAA,IAAI,CAAC,IAAI,mCAAI,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,IAAI,CAAC;EAC5C,CAAC;EAEO,QAAQ;IACZ,OAAO,CACH,cACI,KAAK,EAAC,SAAS,EACf,OAAO,EAAE,IAAI,CAAC,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,GAC1D,CACL,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Element, h, Host, Prop, State } from '@stencil/core';\n\n@Component({\n    tag: 'p-profile',\n    styleUrl: 'profile.component.scss',\n    shadow: true,\n})\nexport class Profile {\n    /**\n     * The variant of the profile\n     */\n    @Prop() variant: 'company' | 'user' = 'user';\n\n    /**\n     * The size of the profile avatar\n     */\n    @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'small';\n\n    /**\n     * The host element\n     */\n    @Element() private _el: HTMLElement;\n\n    @State() private _dropdownOpen = false;\n\n    componentWillRender() {\n        this._updateAvatar();\n    }\n\n    render() {\n        const hasDropdownSlot = !!this._el.querySelector(\n            ':scope > [slot=\"dropdown\"]'\n        );\n        const content = this._getContent(hasDropdownSlot);\n        return (\n            <Host\n                class={`p-profile ${hasDropdownSlot && 'has-dropdown'} ${\n                    this._dropdownOpen && 'active'\n                }`}\n            >\n                {hasDropdownSlot ? (\n                    <p-dropdown\n                        class=\"w-full min-w-0\"\n                        strategy=\"absolute\"\n                        placement={\n                            this.variant === 'user' ? 'top-end' : 'bottom-end'\n                        }\n                        applyFullWidth={true}\n                        applyMaxWidth={false}\n                        onIsOpen={(ev) => (this._dropdownOpen = ev.detail)}\n                    >\n                        {content}\n                        <div slot=\"items\">\n                            <slot name=\"dropdown\" />\n                        </div>\n                    </p-dropdown>\n                ) : (\n                    content\n                )}\n            </Host>\n        );\n    }\n\n    private _getContent(hasDropdownSlot) {\n        return (\n            <div class=\"content\" slot=\"trigger\">\n                <slot name=\"avatar\" />\n                <div class=\"name\">\n                    <slot name=\"title\" />\n                    <slot name=\"subtitle\" />\n                </div>\n\n                {hasDropdownSlot && this._getIcon()}\n            </div>\n        );\n    }\n\n    private _updateAvatar() {\n        const avatar = this._el.querySelector(\n            'p-avatar[slot=\"avatar\"]'\n        ) as HTMLPAvatarElement;\n\n        if (!avatar) {\n            return;\n        }\n\n        avatar.variant = this.variant ?? avatar.variant;\n        avatar.size = this.size ?? avatar?.size;\n    }\n\n    private _getIcon() {\n        return (\n            <p-icon\n                class=\"ml-auto\"\n                variant={this.variant === 'company' ? 'chevron' : 'more'}\n            />\n        );\n    }\n}\n"]}

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

@@ -1 +1 @@
-.flex{display:flex!important}.w-full{width:100%!important}*{box-sizing:border-box}p-select{display:flex;flex-direction:column;width:100%}p-select input.read-only{text-overflow:ellipsis}.static{position:static!important}.h-6{height:1.5rem!important}.cursor-pointer{cursor:pointer!important}.rounded{border-radius:.25rem!important}.blur{--tw-blur:blur(8px)!important}.blur,.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}.visible{visibility:visible!important}.absolute{position:absolute!important}.-rotate-0{--tw-rotate:-0deg!important}.-rotate-0,.-rotate-135{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-135{--tw-rotate:-135deg!important}.-rotate-180{--tw-rotate:-180deg!important}.-rotate-180,.-rotate-225{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-225{--tw-rotate:-225deg!important}.-rotate-25{--tw-rotate:-25deg!important}.-rotate-25,.-rotate-270{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-270{--tw-rotate:-270deg!important}.-rotate-315{--tw-rotate:-315deg!important}.-rotate-315,.-rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-45{--tw-rotate:-45deg!important}.-rotate-90{--tw-rotate:-90deg!important}.-rotate-90,.rotate-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-0{--tw-rotate:0deg!important}.rotate-135{--tw-rotate:135deg!important}.rotate-135,.rotate-180{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-180{--tw-rotate:180deg!important}.rotate-225{--tw-rotate:225deg!important}.rotate-225,.rotate-25{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-25{--tw-rotate:25deg!important}.rotate-270{--tw-rotate:270deg!important}.rotate-270,.rotate-315{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-315{--tw-rotate:315deg!important}.rotate-45{--tw-rotate:45deg!important}.rotate-45,.rotate-90{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-90{--tw-rotate:90deg!important}.scale-x-flip{--tw-scale-x:-1!important}.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.scale-y-flip{--tw-scale-y:-1!important}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.text-2xl{font-size:1.5rem!important;line-height:2rem!important}.text-3xl{font-size:1.875rem!important;line-height:2.25rem!important}.text-4xl{font-size:2.25rem!important;line-height:2.5rem!important}.text-5xl{font-size:3rem!important}.text-5xl,.text-6xl{line-height:1!important}.text-6xl{font-size:3.75rem!important}.text-base{font-size:1rem!important;line-height:1.5rem!important}.text-lg{font-size:1.125rem!important;line-height:1.75rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-xl{font-size:1.25rem!important;line-height:1.75rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.text-xxs{font-size:.6875rem!important}.text-negative{--tw-text-opacity:1!important;color:rgb(185 30 40/var(--tw-text-opacity))!important}.text-negative-light{--tw-text-opacity:1!important;color:rgb(255 204 211/var(--tw-text-opacity))!important}.hover\:text-negative:hover{--tw-text-opacity:1!important;color:rgb(185 30 40/var(--tw-text-opacity))!important}.ml-1{margin-left:.25rem!important}.ml-2{margin-left:.5rem!important}.items-end{align-items:flex-end!important}.justify-between{justify-content:space-between!important}.rounded-bl-none{border-bottom-left-radius:0!important}.rounded-br-none{border-bottom-right-radius:0!important}.rounded-tl-none{border-top-left-radius:0!important}.rounded-tr-none{border-top-right-radius:0!important}.border-l-0{border-left-width:0!important}.border-r-0{border-right-width:0!important}.pl-0{padding-left:0!important}.pr-0{padding-right:0!important}.inline{display:inline!important}.justify-center{justify-content:center!important}
+.flex{display:flex!important}.w-full{width:100%!important}*{box-sizing:border-box}p-select{display:flex;flex-direction:column;width:100%}p-select input.read-only{text-overflow:ellipsis}.static{position:static!important}.h-6{height:1.5rem!important}.cursor-pointer{cursor:pointer!important}.rounded{border-radius:.25rem!important}.blur{--tw-blur:blur(8px)!important}.blur,.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}.visible{visibility:visible!important}.fixed{position:fixed!important}.-rotate-0{--tw-rotate:-0deg!important}.-rotate-0,.-rotate-135{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-135{--tw-rotate:-135deg!important}.-rotate-180{--tw-rotate:-180deg!important}.-rotate-180,.-rotate-225{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-225{--tw-rotate:-225deg!important}.-rotate-25{--tw-rotate:-25deg!important}.-rotate-25,.-rotate-270{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-270{--tw-rotate:-270deg!important}.-rotate-315{--tw-rotate:-315deg!important}.-rotate-315,.-rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-45{--tw-rotate:-45deg!important}.-rotate-90{--tw-rotate:-90deg!important}.-rotate-90,.rotate-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-0{--tw-rotate:0deg!important}.rotate-135{--tw-rotate:135deg!important}.rotate-135,.rotate-180{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-180{--tw-rotate:180deg!important}.rotate-225{--tw-rotate:225deg!important}.rotate-225,.rotate-25{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-25{--tw-rotate:25deg!important}.rotate-270{--tw-rotate:270deg!important}.rotate-270,.rotate-315{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-315{--tw-rotate:315deg!important}.rotate-45{--tw-rotate:45deg!important}.rotate-45,.rotate-90{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-90{--tw-rotate:90deg!important}.scale-x-flip{--tw-scale-x:-1!important}.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.scale-y-flip{--tw-scale-y:-1!important}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.text-2xl{font-size:1.5rem!important;line-height:2rem!important}.text-3xl{font-size:1.875rem!important;line-height:2.25rem!important}.text-4xl{font-size:2.25rem!important;line-height:2.5rem!important}.text-5xl{font-size:3rem!important}.text-5xl,.text-6xl{line-height:1!important}.text-6xl{font-size:3.75rem!important}.text-base{font-size:1rem!important;line-height:1.5rem!important}.text-lg{font-size:1.125rem!important;line-height:1.75rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-xl{font-size:1.25rem!important;line-height:1.75rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.text-xxs{font-size:.6875rem!important}.text-negative{--tw-text-opacity:1!important;color:rgb(185 30 40/var(--tw-text-opacity))!important}.text-negative-light{--tw-text-opacity:1!important;color:rgb(255 204 211/var(--tw-text-opacity))!important}.hover\:text-negative:hover{--tw-text-opacity:1!important;color:rgb(185 30 40/var(--tw-text-opacity))!important}.ml-1{margin-left:.25rem!important}.ml-2{margin-left:.5rem!important}.items-end{align-items:flex-end!important}.justify-between{justify-content:space-between!important}.rounded-bl-none{border-bottom-left-radius:0!important}.rounded-br-none{border-bottom-right-radius:0!important}.rounded-tl-none{border-top-left-radius:0!important}.rounded-tr-none{border-top-right-radius:0!important}.border-l-0{border-left-width:0!important}.border-r-0{border-right-width:0!important}.pl-0{padding-left:0!important}.pr-0{padding-right:0!important}.inline{display:inline!important}.justify-center{justify-content:center!important}

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

@@ -28,6 +28,7 @@ export class Select {
     this._showDropdown = false;
     this._selectedItem = null;
     this._isAutoCompleting = false;
+    this._queryChanged = false;
   }
   get _items() {
     var _a;
@@ -45,7 +46,10 @@ export class Select {
         text: str,
       }));
     }
-    if (this._isAutoCompleting && ((_a = this.query) === null || _a === void 0 ? void 0 : _a.length) && !this.asyncFilter) {
+    if (this._isAutoCompleting &&
+      ((_a = this.query) === null || _a === void 0 ? void 0 : _a.length) &&
+      this._queryChanged &&
+      !this.asyncFilter) {
       items = items.filter((item) => {
         if (this.queryKey) {
           return this._checkvalue(this.queryKey, item);
@@ -70,8 +74,8 @@ export class Select {
       : this.placeholder;
   }
   get _identifierKey() {
-    var _a;
-    return (_a = this.identifierKey) !== null && _a !== void 0 ? _a : this.valueKey;
+    var _a, _b;
+    return (_b = (_a = this.identifierKey) !== null && _a !== void 0 ? _a : this.valueKey) !== null && _b !== void 0 ? _b : 'value';
   }
   componentDidLoad() {
     if (!this.valueKey && !this.identifierKey) {
@@ -156,6 +160,7 @@ export class Select {
       ? item === null || item === void 0 ? void 0 : item[this.valueKey]
       : item;
     this.query = this.keepQuery ? item === null || item === void 0 ? void 0 : item[this.displayKey] : null;
+    this._queryChanged = false;
     this.value = value;
     this.valueChange.emit(value);
     this._onBlur(true);
@@ -198,6 +203,7 @@ export class Select {
       this._isAutoCompleting = true;
       this._showDropdown = true;
     }
+    this._queryChanged = true;
     this.query = ev.target.value;
     this.queryChange.emit(ev.target.value);
   }
@@ -640,7 +646,8 @@ export class Select {
     return {
       "_showDropdown": {},
       "_selectedItem": {},
-      "_isAutoCompleting": {}
+      "_isAutoCompleting": {},
+      "_queryChanged": {}
     };
   }
   static get events() {