@paperless/core 1.3.0 → 1.3.2

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

@@ -58,7 +58,7 @@ const modalHeaderComponentCss = ".flex{display:flex!important}.justify-between{j
 const ModalHeader = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
-    this.close = createEvent(this, "close", 7);
+    this.close = createEvent(this, "close", 3);
     this.showClose = true;
   }
   render() {

package/dist/esm/p-modal-body_4.entry.js.map

@@ -1 +1 @@
-{"file":"p-modal-body.p-modal-container.p-modal-footer.p-modal-header.entry.js","mappings":";;AAAA,MAAM,qBAAqB,GAAG,29KAA29K;;MCO5+K,SAAS;;;mBAIqB,SAAS;mBAKrB,KAAK;;EAEhC,MAAM;IACF,QACI,EAAC,IAAI,IACD,KAAK,EAAE,wBAAwB,IAAI,CAAC,OAAO,IACvC,IAAI,CAAC,OAAO,IAAI,YACpB,EAAE,IAEF,eAAQ,CACL,EACT;GACL;;;;AC5BL,MAAM,0BAA0B,GAAG,wwNAAwwN;;ACE3yN;AACA;AACA;AACA;AACA;AAEA,MAAM,UAAU,GAAG;EACf,EAAE,EAAE,aAAa;EACjB,EAAE,EAAE,oBAAoB;EACxB,EAAE,EAAE,kBAAkB;EACtB,EAAE,EAAE,oBAAoB;EACxB,EAAE,EAAE,oBAAoB;CAC3B,CAAC;MAKW,cAAc;;;gBAImB,IAAI;mBAKnB,KAAK;;EAEhC,MAAM;IACF,MAAM,SAAS,GAAG,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAExC,QACI,EAAC,IAAI,IACD,KAAK,EAAE,qBACH,IAAI,CAAC,OAAO,IAAI,SACpB,IAAI,SAAS,EAAE,IAEf,eAAQ,CACL,EACT;GACL;;;;AC1CL,MAAM,uBAAuB,GAAG,8kKAA8kK;;MCOjmK,WAAW;;;;EACpB,MAAM;IACF,QACI,EAAC,IAAI,IAAC,KAAK,EAAC,gBAAgB,IACxB,iBAAW,KAAK,EAAC,kCAAkC,GAAG,EAEtD,eAAQ,CACL,EACT;GACL;;;;AChBL,MAAM,uBAAuB,GAAG,67KAA67K;;MCOh9K,WAAW;;;;qBAIA,IAAI;;EAOxB,MAAM;IACF,QACI,EAAC,IAAI,IAAC,KAAK,EAAC,gBAAgB,IACxB,gBACI,eAAQ,CACL,EAEN,IAAI,CAAC,SAAS,KACX,gBACI,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,UAAU,EACf,QAAQ,EAAE,IAAI,EACd,OAAO,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,EACpC,IAAI,EAAC,OAAO,GACJ,CACf,CACE,EACT;GACL;;;;;;","names":[],"sources":["./src/components/atoms/modal-body/modal-body.component.scss?tag=p-modal-body&encapsulation=shadow","./src/components/atoms/modal-body/modal-body.component.tsx","./src/components/atoms/modal-container/modal-container.component.scss?tag=p-modal-container","./src/components/atoms/modal-container/modal-container.component.tsx","./src/components/atoms/modal-footer/modal-footer.component.scss?tag=p-modal-footer&encapsulation=shadow","./src/components/atoms/modal-footer/modal-footer.component.tsx","./src/components/atoms/modal-header/modal-header.component.scss?tag=p-modal-header&encapsulation=shadow","./src/components/atoms/modal-header/modal-header.component.tsx"],"sourcesContent":[":host {\n    @apply bg-white;\n    @apply px-6 tablet:px-10 desktop-xs:px-14 py-6;\n}\n\n:host(.variant-table) {\n    @apply px-6;\n}\n\n:host(.is-rounded) {\n    @apply rounded-b-none desktop-xs:rounded-b-xxlarge;\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n    tag: 'p-modal-body',\n    styleUrl: 'modal-body.component.scss',\n    shadow: true,\n})\nexport class ModalBody {\n    /**\n     * The variant of the modal body\n     */\n    @Prop() variant: 'default' | 'table' = 'default';\n\n    /**\n     * Wether the modal body should be rounded at the bottom\n     */\n    @Prop() rounded: boolean = false;\n\n    render() {\n        return (\n            <Host\n                class={`p-modal-body variant-${this.variant} ${\n                    this.rounded && 'is-rounded'\n                }`}\n            >\n                <slot />\n            </Host>\n        );\n    }\n}\n","p-modal-container {\n    @apply flex flex-col w-full tablet:w-auto z-modal;\n    @apply rounded-b-none rounded-t-xxlarge desktop-xs:rounded-b-xxlarge;\n\n    @apply animate-slide-in-bottom desktop-xs:animate-slide-in-bottom-small #{!important};\n\n    @apply shadow-4 #{!important};\n\n    &.closing {\n        @apply animate-slide-out-bottom desktop-xs:animate-slide-out-bottom-small #{!important};\n    }\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n// $modal-xs: 20rem;\n// $modal-sm: 33.5rem;\n// $modal-md: 38rem;\n// $modal-lg: 47.5rem;\n// $modal-xl: 57.5rem;\n\nconst modalSizes = {\n    xs: 'tablet:w-80',\n    sm: 'tablet:w-[33.5rem]',\n    md: 'tablet:w-[38rem]',\n    lg: 'tablet:w-[47.5rem]',\n    xl: 'tablet:w-[57.5rem]',\n};\n@Component({\n    tag: 'p-modal-container',\n    styleUrl: 'modal-container.component.scss',\n})\nexport class ModalContainer {\n    /**\n     * The size of the modal container\n     */\n    @Prop() size: 'sm' | 'md' | 'lg' | 'xl' = 'md';\n\n    /**\n     * Wether the container is closing\n     */\n    @Prop() closing: boolean = false;\n\n    render() {\n        const sizeClass = modalSizes[this.size];\n\n        return (\n            <Host\n                class={`p-modal-container ${\n                    this.closing && 'closing'\n                } ${sizeClass}`}\n            >\n                <slot />\n            </Host>\n        );\n    }\n}\n",":host {\n    @apply bg-white;\n    @apply flex flex-col;\n    @apply pb-6 px-6;\n    @apply rounded-b-none desktop-xs:rounded-b-xxlarge;\n}\n","import { Component, h, Host } from '@stencil/core';\n\n@Component({\n    tag: 'p-modal-footer',\n    styleUrl: 'modal-footer.component.scss',\n    shadow: true,\n})\nexport class ModalFooter {\n    render() {\n        return (\n            <Host class=\"p-modal-footer\">\n                <p-divider class=\"mb-6 mt-0 hidden desktop-xs:flex\" />\n\n                <slot />\n            </Host>\n        );\n    }\n}\n",":host {\n    @apply bg-mystic rounded-t-xxlarge;\n    @apply flex justify-between items-center;\n    @apply p-4 desktop-xs:p-6;\n\n    @apply text-storm-dark text-xl font-semibold;\n    @apply desktop-xs:text-3xl desktop-xs:font-bold;\n}\n","import { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\n\n@Component({\n    tag: 'p-modal-header',\n    styleUrl: 'modal-header.component.scss',\n    shadow: true,\n})\nexport class ModalHeader {\n    /**\n     * Wether to show the close button on mobile\n     */\n    @Prop() showClose = true;\n\n    /**\n     * Close click event\n     */\n    @Event() close: EventEmitter<MouseEvent>;\n\n    render() {\n        return (\n            <Host class=\"p-modal-header\">\n                <span>\n                    <slot />\n                </span>\n\n                {this.showClose && (\n                    <p-button\n                        variant=\"secondary\"\n                        icon=\"negative\"\n                        iconOnly={true}\n                        onClick={(ev) => this.close.emit(ev)}\n                        size=\"small\"\n                    ></p-button>\n                )}\n            </Host>\n        );\n    }\n}\n"],"version":3}
+{"file":"p-modal-body.p-modal-container.p-modal-footer.p-modal-header.entry.js","mappings":";;AAAA,MAAM,qBAAqB,GAAG,29KAA29K;;MCO5+K,SAAS;;;mBAIqB,SAAS;mBAKrB,KAAK;;EAEhC,MAAM;IACF,QACI,EAAC,IAAI,IACD,KAAK,EAAE,wBAAwB,IAAI,CAAC,OAAO,IACvC,IAAI,CAAC,OAAO,IAAI,YACpB,EAAE,IAEF,eAAQ,CACL,EACT;GACL;;;;AC5BL,MAAM,0BAA0B,GAAG,wwNAAwwN;;ACE3yN;AACA;AACA;AACA;AACA;AAEA,MAAM,UAAU,GAAG;EACf,EAAE,EAAE,aAAa;EACjB,EAAE,EAAE,oBAAoB;EACxB,EAAE,EAAE,kBAAkB;EACtB,EAAE,EAAE,oBAAoB;EACxB,EAAE,EAAE,oBAAoB;CAC3B,CAAC;MAKW,cAAc;;;gBAImB,IAAI;mBAKnB,KAAK;;EAEhC,MAAM;IACF,MAAM,SAAS,GAAG,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAExC,QACI,EAAC,IAAI,IACD,KAAK,EAAE,qBACH,IAAI,CAAC,OAAO,IAAI,SACpB,IAAI,SAAS,EAAE,IAEf,eAAQ,CACL,EACT;GACL;;;;AC1CL,MAAM,uBAAuB,GAAG,8kKAA8kK;;MCOjmK,WAAW;;;;EACpB,MAAM;IACF,QACI,EAAC,IAAI,IAAC,KAAK,EAAC,gBAAgB,IACxB,iBAAW,KAAK,EAAC,kCAAkC,GAAG,EAEtD,eAAQ,CACL,EACT;GACL;;;;AChBL,MAAM,uBAAuB,GAAG,67KAA67K;;MCOh9K,WAAW;;;;qBAIA,IAAI;;EASxB,MAAM;IACF,QACI,EAAC,IAAI,IAAC,KAAK,EAAC,gBAAgB,IACxB,gBACI,eAAQ,CACL,EAEN,IAAI,CAAC,SAAS,KACX,gBACI,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,UAAU,EACf,QAAQ,EAAE,IAAI,EACd,OAAO,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,EACpC,IAAI,EAAC,OAAO,GACJ,CACf,CACE,EACT;GACL;;;;;;","names":[],"sources":["./src/components/atoms/modal-body/modal-body.component.scss?tag=p-modal-body&encapsulation=shadow","./src/components/atoms/modal-body/modal-body.component.tsx","./src/components/atoms/modal-container/modal-container.component.scss?tag=p-modal-container","./src/components/atoms/modal-container/modal-container.component.tsx","./src/components/atoms/modal-footer/modal-footer.component.scss?tag=p-modal-footer&encapsulation=shadow","./src/components/atoms/modal-footer/modal-footer.component.tsx","./src/components/atoms/modal-header/modal-header.component.scss?tag=p-modal-header&encapsulation=shadow","./src/components/atoms/modal-header/modal-header.component.tsx"],"sourcesContent":[":host {\n    @apply bg-white;\n    @apply px-6 tablet:px-10 desktop-xs:px-14 py-6;\n}\n\n:host(.variant-table) {\n    @apply px-6;\n}\n\n:host(.is-rounded) {\n    @apply rounded-b-none desktop-xs:rounded-b-xxlarge;\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n    tag: 'p-modal-body',\n    styleUrl: 'modal-body.component.scss',\n    shadow: true,\n})\nexport class ModalBody {\n    /**\n     * The variant of the modal body\n     */\n    @Prop() variant: 'default' | 'table' = 'default';\n\n    /**\n     * Wether the modal body should be rounded at the bottom\n     */\n    @Prop() rounded: boolean = false;\n\n    render() {\n        return (\n            <Host\n                class={`p-modal-body variant-${this.variant} ${\n                    this.rounded && 'is-rounded'\n                }`}\n            >\n                <slot />\n            </Host>\n        );\n    }\n}\n","p-modal-container {\n    @apply flex flex-col w-full tablet:w-auto z-modal;\n    @apply rounded-b-none rounded-t-xxlarge desktop-xs:rounded-b-xxlarge;\n\n    @apply animate-slide-in-bottom desktop-xs:animate-slide-in-bottom-small #{!important};\n\n    @apply shadow-4 #{!important};\n\n    &.closing {\n        @apply animate-slide-out-bottom desktop-xs:animate-slide-out-bottom-small #{!important};\n    }\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n// $modal-xs: 20rem;\n// $modal-sm: 33.5rem;\n// $modal-md: 38rem;\n// $modal-lg: 47.5rem;\n// $modal-xl: 57.5rem;\n\nconst modalSizes = {\n    xs: 'tablet:w-80',\n    sm: 'tablet:w-[33.5rem]',\n    md: 'tablet:w-[38rem]',\n    lg: 'tablet:w-[47.5rem]',\n    xl: 'tablet:w-[57.5rem]',\n};\n@Component({\n    tag: 'p-modal-container',\n    styleUrl: 'modal-container.component.scss',\n})\nexport class ModalContainer {\n    /**\n     * The size of the modal container\n     */\n    @Prop() size: 'sm' | 'md' | 'lg' | 'xl' = 'md';\n\n    /**\n     * Wether the container is closing\n     */\n    @Prop() closing: boolean = false;\n\n    render() {\n        const sizeClass = modalSizes[this.size];\n\n        return (\n            <Host\n                class={`p-modal-container ${\n                    this.closing && 'closing'\n                } ${sizeClass}`}\n            >\n                <slot />\n            </Host>\n        );\n    }\n}\n",":host {\n    @apply bg-white;\n    @apply flex flex-col;\n    @apply pb-6 px-6;\n    @apply rounded-b-none desktop-xs:rounded-b-xxlarge;\n}\n","import { Component, h, Host } from '@stencil/core';\n\n@Component({\n    tag: 'p-modal-footer',\n    styleUrl: 'modal-footer.component.scss',\n    shadow: true,\n})\nexport class ModalFooter {\n    render() {\n        return (\n            <Host class=\"p-modal-footer\">\n                <p-divider class=\"mb-6 mt-0 hidden desktop-xs:flex\" />\n\n                <slot />\n            </Host>\n        );\n    }\n}\n",":host {\n    @apply bg-mystic rounded-t-xxlarge;\n    @apply flex justify-between items-center;\n    @apply p-4 desktop-xs:p-6;\n\n    @apply text-storm-dark text-xl font-semibold;\n    @apply desktop-xs:text-3xl desktop-xs:font-bold;\n}\n","import { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\n\n@Component({\n    tag: 'p-modal-header',\n    styleUrl: 'modal-header.component.scss',\n    shadow: true,\n})\nexport class ModalHeader {\n    /**\n     * Wether to show the close button on mobile\n     */\n    @Prop() showClose = true;\n\n    /**\n     * Close click event\n     */\n    @Event({\n        bubbles: false\n    }) close: EventEmitter<MouseEvent>;\n\n    render() {\n        return (\n            <Host class=\"p-modal-header\">\n                <span>\n                    <slot />\n                </span>\n\n                {this.showClose && (\n                    <p-button\n                        variant=\"secondary\"\n                        icon=\"negative\"\n                        iconOnly={true}\n                        onClick={(ev) => this.close.emit(ev)}\n                        size=\"small\"\n                    ></p-button>\n                )}\n            </Host>\n        );\n    }\n}\n"],"version":3}

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

@@ -3,8 +3,8 @@ import { r as registerInstance, c as createEvent, h, H as Host, g as getElement
 const Modal = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
-    this.closeClicked = createEvent(this, "closeClicked", 7);
-    this.closed = createEvent(this, "closed", 7);
+    this.closeClicked = createEvent(this, "closeClicked", 3);
+    this.closed = createEvent(this, "closed", 3);
     this._hasFooterSlot = false;
     this._hasHeaderSlot = false;
     this.size = 'md';

package/dist/esm/p-modal.entry.js.map

@@ -1 +1 @@
-{"file":"p-modal.entry.js","mappings":";;MAea,KAAK;;;;;IA6DN,mBAAc,GAAG,KAAK,CAAC;IACvB,mBAAc,GAAG,KAAK,CAAC;gBA1DW,IAAI;mBAKP,SAAS;;gBAUxB,KAAK;qBAKA,KAAK;qBAKd,IAAI;4BAKG,KAAK;8BAKH,IAAI;sBAKH,IAAI;oBAoBN,KAAK;;EAEjC,iBAAiB;IACb,IAAI,CAAC,cAAc,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,aAAa,CAC1C,0BAA0B,CAC7B,CAAC;IACF,IAAI,CAAC,cAAc,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,aAAa,CAC1C,0BAA0B,CAC7B,CAAC;GACL;EAED,MAAM;;IACF,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;MACZ,OAAO;KACV;IAED,MAAM,aAAa,GAAG,YAAM,IAAI,EAAC,QAAQ,GAAG,CAAC;IAC7C,MAAM,WAAW,GAAG,YAAM,IAAI,EAAC,SAAS,GAAG,CAAC;IAC5C,MAAM,aAAa,GAAG,YAAM,IAAI,EAAC,QAAQ,GAAG,CAAC;IAE7C,QACI,EAAC,IAAI,IAAC,KAAK,EAAC,SAAS,IACjB,kBACI,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,SAAS,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC,cAAc,CAAC,EAAE,CAAC,MAAM,CAAC,EACjD,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,UAAU,EAAE,IAAI,CAAC,UAAU,IAE3B,yBAAmB,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,CAAC,QAAQ,IACrD,CAAC,CAAA,MAAA,IAAI,CAAC,MAAM,0CAAE,MAAM,KAAI,IAAI,CAAC,cAAc,MACxC,sBACI,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,OAAO,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,MAAM,CAAC,IAErC,IAAI,CAAC,cAAc;QACd,aAAa;QACb,IAAI,CAAC,MAAM,CACJ,CACpB,EACD,oBACI,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,OAAO,EAAE,CAAC,IAAI,CAAC,cAAc,IAE5B,WAAW,CACD,EACd,IAAI,CAAC,cAAc,KAChB,0BAAiB,aAAa,CAAkB,CACnD,CACe,CACX,CACV,EACT;GACL;EAEO,cAAc,CAAC,EAAc;IACjC,IAAI,CAAC,IAAI,CAAC,kBAAkB,EAAE;MAC1B,OAAO;KACV;IAED,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;GAClB;EAEM,KAAK,CAAC,EAAc;IACvB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IAE3B,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;IAErB,UAAU,CAAC;MACP,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;MAClB,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;MAEtB,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC;KACtB,EAAE,GAAG,CAAC,CAAC;GACX;;;;;;","names":[],"sources":["./src/components/organisms/modal/modal.component.tsx"],"sourcesContent":["import {\n    Component,\n    Element,\n    Event,\n    EventEmitter,\n    h,\n    Host,\n    Prop,\n    State\n} from '@stencil/core';\n\n@Component({\n    tag: 'p-modal',\n    shadow: true,\n})\nexport class Modal {\n    /**\n     * The size of the modal container\n     */\n    @Prop() size: 'sm' | 'md' | 'lg' | 'xl' = 'md';\n\n    /**\n     * The variant of the modal body\n     */\n    @Prop() variant: 'default' | 'table' = 'default';\n\n    /**\n     * The Header of the modal\n     */\n    @Prop() header?: string;\n\n    /**\n     * Wether to show the modal or not\n     */\n    @Prop() show: boolean = false;\n\n    /**\n     * Wether to apply blur to the backdrop\n     */\n    @Prop() applyBlur: boolean = false;\n\n    /**\n     * Wether to show the close button in the header\n     */\n    @Prop() showClose = true;\n\n    /**\n     * Wether to show the footer on mobile\n     */\n    @Prop() showMobileFooter = false;\n\n    /**\n     * Wether to hide the modal when the backdrop is clicked\n     */\n    @Prop() backdropClickClose = true;\n\n    /**\n     * Wether we should scroll lock the body\n     */\n    @Prop() scrollLock: boolean = true;\n\n    /**\n     * Close click event\n     */\n    @Event() closeClicked: EventEmitter<MouseEvent>;\n\n    /**\n     * Closed event\n     */\n    @Event() closed: EventEmitter<null>;\n\n    /**\n     * The host element\n     */\n    @Element() private _el: HTMLElement;\n\n    private _hasFooterSlot = false;\n    private _hasHeaderSlot = false;\n\n    @State() private _closing = false;\n\n    componentWillLoad() {\n        this._hasFooterSlot = !!this._el.querySelector(\n            ':scope > [slot=\"footer\"]'\n        );\n        this._hasHeaderSlot = !!this._el.querySelector(\n            ':scope > [slot=\"header\"]'\n        );\n    }\n\n    render() {\n        if (!this.show) {\n            return;\n        }\n\n        const headerContent = <slot name=\"header\" />;\n        const bodyContent = <slot name=\"content\" />;\n        const footerContent = <slot name=\"footer\" />;\n\n        return (\n            <Host class=\"p-modal\">\n                <p-backdrop\n                    applyBlur={this.applyBlur}\n                    onClicked={(ev) => this._backdropClick(ev.detail)}\n                    closing={this._closing}\n                    scrollLock={this.scrollLock}\n                >\n                    <p-modal-container size={this.size} closing={this._closing}>\n                        {(this.header?.length || this._hasHeaderSlot) && (\n                            <p-modal-header\n                                showClose={this.showClose}\n                                onClose={(ev) => this.close(ev.detail)}\n                            >\n                                {this._hasHeaderSlot\n                                    ? headerContent\n                                    : this.header}\n                            </p-modal-header>\n                        )}\n                        <p-modal-body\n                            variant={this.variant}\n                            rounded={!this._hasFooterSlot}\n                        >\n                            {bodyContent}\n                        </p-modal-body>\n                        {this._hasFooterSlot && (\n                            <p-modal-footer>{footerContent}</p-modal-footer>\n                        )}\n                    </p-modal-container>\n                </p-backdrop>\n            </Host>\n        );\n    }\n\n    private _backdropClick(ev: MouseEvent) {\n        if (!this.backdropClickClose) {\n            return;\n        }\n\n        this.close(ev);\n    }\n\n    public close(ev: MouseEvent) {\n        this.closeClicked.emit(ev);\n\n        this._closing = true;\n\n        setTimeout(() => {\n            this.show = false;\n            this._closing = false;\n\n            this.closed.emit();\n        }, 550);\n    }\n}\n"],"version":3}
+{"file":"p-modal.entry.js","mappings":";;MAea,KAAK;;;;;IAiEN,mBAAc,GAAG,KAAK,CAAC;IACvB,mBAAc,GAAG,KAAK,CAAC;gBA9DW,IAAI;mBAKP,SAAS;;gBAUxB,KAAK;qBAKA,KAAK;qBAKd,IAAI;4BAKG,KAAK;8BAKH,IAAI;sBAKH,IAAI;oBAwBN,KAAK;;EAEjC,iBAAiB;IACb,IAAI,CAAC,cAAc,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,aAAa,CAC1C,0BAA0B,CAC7B,CAAC;IACF,IAAI,CAAC,cAAc,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,aAAa,CAC1C,0BAA0B,CAC7B,CAAC;GACL;EAED,MAAM;;IACF,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;MACZ,OAAO;KACV;IAED,MAAM,aAAa,GAAG,YAAM,IAAI,EAAC,QAAQ,GAAG,CAAC;IAC7C,MAAM,WAAW,GAAG,YAAM,IAAI,EAAC,SAAS,GAAG,CAAC;IAC5C,MAAM,aAAa,GAAG,YAAM,IAAI,EAAC,QAAQ,GAAG,CAAC;IAE7C,QACI,EAAC,IAAI,IAAC,KAAK,EAAC,SAAS,IACjB,kBACI,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,SAAS,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC,cAAc,CAAC,EAAE,CAAC,MAAM,CAAC,EACjD,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,UAAU,EAAE,IAAI,CAAC,UAAU,IAE3B,yBAAmB,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,CAAC,QAAQ,IACrD,CAAC,CAAA,MAAA,IAAI,CAAC,MAAM,0CAAE,MAAM,KAAI,IAAI,CAAC,cAAc,MACxC,sBACI,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,OAAO,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,MAAM,CAAC,IAErC,IAAI,CAAC,cAAc;QACd,aAAa;QACb,IAAI,CAAC,MAAM,CACJ,CACpB,EACD,oBACI,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,OAAO,EAAE,CAAC,IAAI,CAAC,cAAc,IAE5B,WAAW,CACD,EACd,IAAI,CAAC,cAAc,KAChB,0BAAiB,aAAa,CAAkB,CACnD,CACe,CACX,CACV,EACT;GACL;EAEO,cAAc,CAAC,EAAc;IACjC,IAAI,CAAC,IAAI,CAAC,kBAAkB,EAAE;MAC1B,OAAO;KACV;IAED,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;GAClB;EAEM,KAAK,CAAC,EAAc;IACvB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IAE3B,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;IAErB,UAAU,CAAC;MACP,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;MAClB,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;MAEtB,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC;KACtB,EAAE,GAAG,CAAC,CAAC;GACX;;;;;;","names":[],"sources":["./src/components/organisms/modal/modal.component.tsx"],"sourcesContent":["import {\n    Component,\n    Element,\n    Event,\n    EventEmitter,\n    h,\n    Host,\n    Prop,\n    State\n} from '@stencil/core';\n\n@Component({\n    tag: 'p-modal',\n    shadow: true,\n})\nexport class Modal {\n    /**\n     * The size of the modal container\n     */\n    @Prop() size: 'sm' | 'md' | 'lg' | 'xl' = 'md';\n\n    /**\n     * The variant of the modal body\n     */\n    @Prop() variant: 'default' | 'table' = 'default';\n\n    /**\n     * The Header of the modal\n     */\n    @Prop() header?: string;\n\n    /**\n     * Wether to show the modal or not\n     */\n    @Prop() show: boolean = false;\n\n    /**\n     * Wether to apply blur to the backdrop\n     */\n    @Prop() applyBlur: boolean = false;\n\n    /**\n     * Wether to show the close button in the header\n     */\n    @Prop() showClose = true;\n\n    /**\n     * Wether to show the footer on mobile\n     */\n    @Prop() showMobileFooter = false;\n\n    /**\n     * Wether to hide the modal when the backdrop is clicked\n     */\n    @Prop() backdropClickClose = true;\n\n    /**\n     * Wether we should scroll lock the body\n     */\n    @Prop() scrollLock: boolean = true;\n\n    /**\n     * Close click event\n     */\n    @Event({\n        bubbles: false\n    }) closeClicked: EventEmitter<MouseEvent>;\n\n    /**\n     * Closed event\n     */\n    @Event({\n        bubbles: false\n    }) closed: EventEmitter<null>;\n\n    /**\n     * The host element\n     */\n    @Element() private _el: HTMLElement;\n\n    private _hasFooterSlot = false;\n    private _hasHeaderSlot = false;\n\n    @State() private _closing = false;\n\n    componentWillLoad() {\n        this._hasFooterSlot = !!this._el.querySelector(\n            ':scope > [slot=\"footer\"]'\n        );\n        this._hasHeaderSlot = !!this._el.querySelector(\n            ':scope > [slot=\"header\"]'\n        );\n    }\n\n    render() {\n        if (!this.show) {\n            return;\n        }\n\n        const headerContent = <slot name=\"header\" />;\n        const bodyContent = <slot name=\"content\" />;\n        const footerContent = <slot name=\"footer\" />;\n\n        return (\n            <Host class=\"p-modal\">\n                <p-backdrop\n                    applyBlur={this.applyBlur}\n                    onClicked={(ev) => this._backdropClick(ev.detail)}\n                    closing={this._closing}\n                    scrollLock={this.scrollLock}\n                >\n                    <p-modal-container size={this.size} closing={this._closing}>\n                        {(this.header?.length || this._hasHeaderSlot) && (\n                            <p-modal-header\n                                showClose={this.showClose}\n                                onClose={(ev) => this.close(ev.detail)}\n                            >\n                                {this._hasHeaderSlot\n                                    ? headerContent\n                                    : this.header}\n                            </p-modal-header>\n                        )}\n                        <p-modal-body\n                            variant={this.variant}\n                            rounded={!this._hasFooterSlot}\n                        >\n                            {bodyContent}\n                        </p-modal-body>\n                        {this._hasFooterSlot && (\n                            <p-modal-footer>{footerContent}</p-modal-footer>\n                        )}\n                    </p-modal-container>\n                </p-backdrop>\n            </Host>\n        );\n    }\n\n    private _backdropClick(ev: MouseEvent) {\n        if (!this.backdropClickClose) {\n            return;\n        }\n\n        this.close(ev);\n    }\n\n    public close(ev: MouseEvent) {\n        this.closeClicked.emit(ev);\n\n        this._closing = true;\n\n        setTimeout(() => {\n            this.show = false;\n            this._closing = false;\n\n            this.closed.emit();\n        }, 550);\n    }\n}\n"],"version":3}

package/dist/esm/p-page-size-select_3.entry.js

@@ -5,7 +5,7 @@ import { d as defaultSize, a as defaultSizeOptions } from './constants-826f9460.
 const PageSizeSelect = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
-    this.sizeChange = createEvent(this, "sizeChange", 7);
+    this.sizeChange = createEvent(this, "sizeChange", 3);
     this._defaultButtonTemplate = (size) => formatTranslation(this._locales.item, { size });
     this._defaultItemTemplate = (size) => formatTranslation(this._locales.item, { size });
     this.size = defaultSize;
@@ -45,7 +45,7 @@ const paginationComponentCss = ".flex{display:flex!important}*{box-sizing:border
 const Pagination = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
-    this.pageChange = createEvent(this, "pageChange", 7);
+    this.pageChange = createEvent(this, "pageChange", 3);
     this._pages = [];
     this._set = [];
     this._nextClick = () => {

package/dist/esm/p-page-size-select_3.entry.js.map

@@ -1 +1 @@
-{"file":"p-page-size-select.p-pagination.p-pagination-item.entry.js","mappings":"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","names":[],"sources":["./src/components/molecules/page-size-select/page-size-select.component.tsx","./src/components/molecules/pagination/pagination.component.scss?tag=p-pagination","./src/components/molecules/pagination/pagination.component.tsx","./src/components/atoms/pagination-item/pagination-item.component.scss?tag=p-pagination-item&encapsulation=shadow","./src/components/atoms/pagination-item/pagination-item.component.tsx"],"sourcesContent":["import {\n    Component,\n    Element,\n    Event,\n    EventEmitter,\n    h,\n    Host,\n    Listen,\n    Prop,\n    State,\n} from '@stencil/core';\nimport {\n    formatTranslation,\n    getLocaleComponentStrings,\n} from '../../../utils/localization';\nimport { defaultSize, defaultSizeOptions } from './constants';\n\nexport type templateFunc = (value: number) => string;\n\n@Component({\n    tag: 'p-page-size-select',\n    shadow: true,\n})\nexport class PageSizeSelect {\n    private _defaultButtonTemplate: templateFunc = (size) =>\n        formatTranslation(this._locales.item, { size });\n    private _defaultItemTemplate: templateFunc = (size) =>\n        formatTranslation(this._locales.item, { size });\n    /**\n     * The current page\n     */\n    @Prop({ mutable: true, reflect: true }) size: number = defaultSize;\n\n    /**\n     * The available sizes\n     */\n    @Prop() sizeOptions: number[] = defaultSizeOptions;\n\n    /**\n     * Event whenever the size changes\n     */\n    @Event() sizeChange: EventEmitter<number>;\n\n    /**\n     * Chevron position\n     */\n    @Prop() chevronPosition: 'start' | 'end' = 'start';\n\n    /**\n     * The size of the button\n     */\n    @Prop() buttonSize: 'small' | 'medium' = 'small';\n\n    /**\n     * The template for the data view\n     */\n    @Prop() buttonTemplate: templateFunc = this._defaultButtonTemplate;\n\n    /**\n     * The template for the data view\n     */\n    @Prop() itemTemplate: templateFunc = this._defaultItemTemplate;\n\n    /**\n     * The host element\n     */\n    @Element() private _el: HTMLElement;\n\n    /**\n     * Wether to hide when there is only 1 page available\n     */\n    @Prop() hidden: boolean = false;\n\n    /**\n     * Locales used for this component\n     */\n    @State() private _locales: any = {};\n\n    componentWillLoad() {\n        this._setLocales();\n    }\n\n    render() {\n        return (\n            <Host class={`p-page-size-select ${this.hidden && 'hidden'}`}>\n                <p-dropdown\n                    placement=\"top-start\"\n                    chevronPosition={this.chevronPosition}\n                    chevronDirection=\"down\"\n                >\n                    <p-button\n                        variant=\"secondary\"\n                        slot=\"trigger\"\n                        size={this.buttonSize}\n                    >\n                        {this.buttonTemplate\n                            ? this.buttonTemplate(this.size)\n                            : this._defaultButtonTemplate(this.size)}\n                    </p-button>\n                    <slot slot=\"items\">\n                        {this.sizeOptions.map((option) => (\n                            <p-dropdown-menu-item\n                                active={option === this.size}\n                                onClick={() => this._changeSize(option)}\n                            >\n                                {this.itemTemplate\n                                    ? this.itemTemplate(option)\n                                    : this._defaultItemTemplate(option)}\n                            </p-dropdown-menu-item>\n                        ))}\n                    </slot>\n                </p-dropdown>\n            </Host>\n        );\n    }\n\n    @Listen('localeChanged', { target: 'body' })\n    private async _setLocales(): Promise<void> {\n        this._locales = await getLocaleComponentStrings(this._el);\n    }\n\n    private _changeSize(s?: number) {\n        if (!s) {\n            return;\n        }\n\n        this.size = s;\n        this.sizeChange.emit(this.size);\n    }\n}\n","p-pagination {\n  @apply flex;\n}\n","import {\n    Component,\n    Event,\n    EventEmitter,\n    h,\n    Host,\n    Prop,\n    Watch,\n} from '@stencil/core';\n\ntype PaginationSetItem = {\n    type: string;\n    value?: number | Element | JSX.Element | string;\n};\n\n@Component({\n    tag: 'p-pagination',\n    styleUrl: 'pagination.component.scss',\n})\nexport class Pagination {\n    /**\n     * The current page\n     */\n    @Prop({ mutable: true, reflect: true }) page: number = 1;\n\n    /**\n     * Event whenever the page changes\n     */\n    @Event() pageChange: EventEmitter<number>;\n\n    /**\n     * The amount of items per page\n     */\n    @Prop() pageSize: number = 12;\n\n    /**\n     * Wether to hide when there is only 1 page available\n     */\n    @Prop() hideOnSinglePage: boolean = false;\n\n    /**\n     * The total amount of items\n     */\n    @Prop() total!: number;\n\n    private _pages: number[] = [];\n    private _set: PaginationSetItem[] = [];\n\n    componentWillRender() {\n        this._generate();\n    }\n\n    render() {\n        return (\n            <Host\n                class={`p-pagination ${\n                    this.hideOnSinglePage && this._set?.length === 3 && 'hidden'\n                }`}\n            >\n                {this._set?.map((p) => {\n                    if (p.type === 'previous' || p.type === 'next') {\n                        return (\n                            <p-pagination-item\n                                onClick={() =>\n                                    p.type === 'previous'\n                                        ? this._previousClick()\n                                        : this._nextClick()\n                                }\n                            >\n                                {p.value}\n                            </p-pagination-item>\n                        );\n                    }\n\n                    if (p.type === 'ellipsis') {\n                        return <p-pagination-item>...</p-pagination-item>;\n                    }\n\n                    return (\n                        <p-pagination-item\n                            active={p.value === this.page}\n                            onClick={() => this._pageClick(p.value as number)}\n                        >\n                            {p.value}\n                        </p-pagination-item>\n                    );\n                })}\n            </Host>\n        );\n    }\n\n    @Watch('page')\n    @Watch('pageSize')\n    @Watch('total')\n    protected pageChangeHandler() {\n        this._generate();\n    }\n\n    private _generate() {\n        this._pages = this._generatePages();\n        this._set = this._generateSet();\n\n        if (this.page > this._pages?.length) {\n            this._changePage(this._pages.length);\n        }\n    }\n\n    private _changePage(p?: number) {\n        if (!p) {\n            return;\n        }\n\n        this.page = p;\n        this.pageChange.emit(this.page);\n    }\n\n    private _previousClick() {\n        const previousPage = this.page - 1;\n        if (previousPage < this._pages[0]) {\n            return;\n        }\n\n        this._changePage(previousPage);\n    }\n\n    private _nextClick = () => {\n        const nextPage = this.page + 1;\n        if (nextPage > this._pages[this._pages.length - 1]) {\n            return;\n        }\n\n        this._changePage(nextPage);\n    };\n\n    private _pageClick = (p?: number) => this._changePage(p);\n\n    private _generatePages() {\n        if (!this.total || !this.pageSize) {\n            return [];\n        }\n\n        const pages = Math.ceil(this.total / this.pageSize);\n        return new Array(pages).fill(undefined).map((_, i) => i + 1);\n    }\n\n    private _generateSet = (\n        range: number = 1,\n        enableBoundaries: boolean = true\n    ): PaginationSetItem[] => {\n        const totalPages = this._pages.length;\n\n        if (!totalPages) {\n            return [];\n        }\n\n        let start = this.page - range;\n        let end = this.page + range;\n\n        if (end > totalPages) {\n            end = totalPages;\n            start = totalPages - range * 2;\n            start = start < 1 ? 1 : start;\n        }\n\n        if (start <= 1) {\n            start = 1;\n            end = Math.min(range * 2 + 1, totalPages);\n        }\n\n        const set = [];\n\n        const previous = {\n            type: 'previous',\n            value: <p-icon variant=\"chevron\" rotate={90} />,\n        };\n\n        const next = {\n            type: 'next',\n            value: <p-icon variant=\"chevron\" rotate={-90} />,\n        };\n\n        // Disable page range, display all the pages\n        if (range === null) {\n            const p = this._pages.map((p) => ({\n                type: 'page',\n                value: p,\n            }));\n\n            return enableBoundaries ? [previous, ...p, next] : p;\n        }\n\n        if (enableBoundaries) {\n            set.push(previous);\n        }\n\n        if (start <= 3) {\n            for (let i = 1; i < start; i++) {\n                set.push({\n                    type: 'page',\n                    value: this._pages[i - 1],\n                });\n            }\n        } else {\n            set.push({\n                type: 'page',\n                value: 1,\n            });\n\n            set.push({\n                type: 'ellipsis',\n                value: 'ellipsis',\n            });\n        }\n\n        for (let i = start; i <= end; i++) {\n            set.push({\n                type: 'page',\n                value: this._pages[i - 1],\n            });\n        }\n\n        if (end >= totalPages - 2) {\n            for (let i = end + 1; i <= totalPages; i++) {\n                set.push({\n                    type: 'page',\n                    value: this._pages[i - 1],\n                });\n            }\n        } else {\n            set.push({\n                type: 'ellipsis',\n            });\n\n            set.push({\n                type: 'page',\n                value: this._pages[this._pages.length - 1],\n            });\n        }\n\n        if (enableBoundaries) {\n            set.push(next);\n        }\n\n        return set;\n    };\n}\n",":host {\n  @apply h-8 w-8;\n  @apply flex justify-center items-center;\n  @apply font-semibold text-storm-medium text-sm;\n  @apply rounded;\n  @apply cursor-pointer;\n}\n\n:host(:hover),\n:host(:focus) {\n  @apply text-storm;\n}\n\n:host(.active) {\n  @apply text-indigo bg-indigo-light;\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'p-pagination-item',\n  styleUrl: 'pagination-item.component.scss',\n  shadow: true,\n})\nexport class PaginationItem {\n  /**\n   * Wether the pagination item is active\n   */\n  @Prop() active: boolean = false;\n\n  render() {\n    return (\n      <Host class={`p-pagination-item ${this.active && 'active'}`}>\n        <slot />\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-page-size-select.p-pagination.p-pagination-item.entry.js","mappings":"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","names":[],"sources":["./src/components/molecules/page-size-select/page-size-select.component.tsx","./src/components/molecules/pagination/pagination.component.scss?tag=p-pagination","./src/components/molecules/pagination/pagination.component.tsx","./src/components/atoms/pagination-item/pagination-item.component.scss?tag=p-pagination-item&encapsulation=shadow","./src/components/atoms/pagination-item/pagination-item.component.tsx"],"sourcesContent":["import {\n    Component,\n    Element,\n    Event,\n    EventEmitter,\n    h,\n    Host,\n    Listen,\n    Prop,\n    State\n} from '@stencil/core';\nimport {\n    formatTranslation,\n    getLocaleComponentStrings\n} from '../../../utils/localization';\nimport { defaultSize, defaultSizeOptions } from './constants';\n\nexport type templateFunc = (value: number) => string;\n\n@Component({\n    tag: 'p-page-size-select',\n    shadow: true,\n})\nexport class PageSizeSelect {\n    private _defaultButtonTemplate: templateFunc = (size) =>\n        formatTranslation(this._locales.item, { size });\n    private _defaultItemTemplate: templateFunc = (size) =>\n        formatTranslation(this._locales.item, { size });\n    /**\n     * The current page\n     */\n    @Prop({ mutable: true, reflect: true }) size: number = defaultSize;\n\n    /**\n     * The available sizes\n     */\n    @Prop() sizeOptions: number[] = defaultSizeOptions;\n\n    /**\n     * Event whenever the size changes\n     */\n    @Event({\n        bubbles: false\n    }) sizeChange: EventEmitter<number>;\n\n    /**\n     * Chevron position\n     */\n    @Prop() chevronPosition: 'start' | 'end' = 'start';\n\n    /**\n     * The size of the button\n     */\n    @Prop() buttonSize: 'small' | 'medium' = 'small';\n\n    /**\n     * The template for the data view\n     */\n    @Prop() buttonTemplate: templateFunc = this._defaultButtonTemplate;\n\n    /**\n     * The template for the data view\n     */\n    @Prop() itemTemplate: templateFunc = this._defaultItemTemplate;\n\n    /**\n     * The host element\n     */\n    @Element() private _el: HTMLElement;\n\n    /**\n     * Wether to hide when there is only 1 page available\n     */\n    @Prop() hidden: boolean = false;\n\n    /**\n     * Locales used for this component\n     */\n    @State() private _locales: any = {};\n\n    componentWillLoad() {\n        this._setLocales();\n    }\n\n    render() {\n        return (\n            <Host class={`p-page-size-select ${this.hidden && 'hidden'}`}>\n                <p-dropdown\n                    placement=\"top-start\"\n                    chevronPosition={this.chevronPosition}\n                    chevronDirection=\"down\"\n                >\n                    <p-button\n                        variant=\"secondary\"\n                        slot=\"trigger\"\n                        size={this.buttonSize}\n                    >\n                        {this.buttonTemplate\n                            ? this.buttonTemplate(this.size)\n                            : this._defaultButtonTemplate(this.size)}\n                    </p-button>\n                    <slot slot=\"items\">\n                        {this.sizeOptions.map((option) => (\n                            <p-dropdown-menu-item\n                                active={option === this.size}\n                                onClick={() => this._changeSize(option)}\n                            >\n                                {this.itemTemplate\n                                    ? this.itemTemplate(option)\n                                    : this._defaultItemTemplate(option)}\n                            </p-dropdown-menu-item>\n                        ))}\n                    </slot>\n                </p-dropdown>\n            </Host>\n        );\n    }\n\n    @Listen('localeChanged', { target: 'body' })\n    private async _setLocales(): Promise<void> {\n        this._locales = await getLocaleComponentStrings(this._el);\n    }\n\n    private _changeSize(s?: number) {\n        if (!s) {\n            return;\n        }\n\n        this.size = s;\n        this.sizeChange.emit(this.size);\n    }\n}\n","p-pagination {\n  @apply flex;\n}\n","import {\n    Component,\n    Event,\n    EventEmitter,\n    h,\n    Host,\n    Prop,\n    Watch\n} from '@stencil/core';\n\ntype PaginationSetItem = {\n    type: string;\n    value?: number | Element | JSX.Element | string;\n};\n\n@Component({\n    tag: 'p-pagination',\n    styleUrl: 'pagination.component.scss',\n})\nexport class Pagination {\n    /**\n     * The current page\n     */\n    @Prop({ mutable: true, reflect: true }) page: number = 1;\n\n    /**\n     * Event whenever the page changes\n     */\n    @Event({\n        bubbles: false\n    }) pageChange: EventEmitter<number>;\n\n    /**\n     * The amount of items per page\n     */\n    @Prop() pageSize: number = 12;\n\n    /**\n     * Wether to hide when there is only 1 page available\n     */\n    @Prop() hideOnSinglePage: boolean = false;\n\n    /**\n     * The total amount of items\n     */\n    @Prop() total!: number;\n\n    private _pages: number[] = [];\n    private _set: PaginationSetItem[] = [];\n\n    componentWillRender() {\n        this._generate();\n    }\n\n    render() {\n        return (\n            <Host\n                class={`p-pagination ${\n                    this.hideOnSinglePage && this._set?.length === 3 && 'hidden'\n                }`}\n            >\n                {this._set?.map((p) => {\n                    if (p.type === 'previous' || p.type === 'next') {\n                        return (\n                            <p-pagination-item\n                                onClick={() =>\n                                    p.type === 'previous'\n                                        ? this._previousClick()\n                                        : this._nextClick()\n                                }\n                            >\n                                {p.value}\n                            </p-pagination-item>\n                        );\n                    }\n\n                    if (p.type === 'ellipsis') {\n                        return <p-pagination-item>...</p-pagination-item>;\n                    }\n\n                    return (\n                        <p-pagination-item\n                            active={p.value === this.page}\n                            onClick={() => this._pageClick(p.value as number)}\n                        >\n                            {p.value}\n                        </p-pagination-item>\n                    );\n                })}\n            </Host>\n        );\n    }\n\n    @Watch('page')\n    @Watch('pageSize')\n    @Watch('total')\n    protected pageChangeHandler() {\n        this._generate();\n    }\n\n    private _generate() {\n        this._pages = this._generatePages();\n        this._set = this._generateSet();\n\n        if (this.page > this._pages?.length) {\n            this._changePage(this._pages.length);\n        }\n    }\n\n    private _changePage(p?: number) {\n        if (!p) {\n            return;\n        }\n\n        this.page = p;\n        this.pageChange.emit(this.page);\n    }\n\n    private _previousClick() {\n        const previousPage = this.page - 1;\n        if (previousPage < this._pages[0]) {\n            return;\n        }\n\n        this._changePage(previousPage);\n    }\n\n    private _nextClick = () => {\n        const nextPage = this.page + 1;\n        if (nextPage > this._pages[this._pages.length - 1]) {\n            return;\n        }\n\n        this._changePage(nextPage);\n    };\n\n    private _pageClick = (p?: number) => this._changePage(p);\n\n    private _generatePages() {\n        if (!this.total || !this.pageSize) {\n            return [];\n        }\n\n        const pages = Math.ceil(this.total / this.pageSize);\n        return new Array(pages).fill(undefined).map((_, i) => i + 1);\n    }\n\n    private _generateSet = (\n        range: number = 1,\n        enableBoundaries: boolean = true\n    ): PaginationSetItem[] => {\n        const totalPages = this._pages.length;\n\n        if (!totalPages) {\n            return [];\n        }\n\n        let start = this.page - range;\n        let end = this.page + range;\n\n        if (end > totalPages) {\n            end = totalPages;\n            start = totalPages - range * 2;\n            start = start < 1 ? 1 : start;\n        }\n\n        if (start <= 1) {\n            start = 1;\n            end = Math.min(range * 2 + 1, totalPages);\n        }\n\n        const set = [];\n\n        const previous = {\n            type: 'previous',\n            value: <p-icon variant=\"chevron\" rotate={90} />,\n        };\n\n        const next = {\n            type: 'next',\n            value: <p-icon variant=\"chevron\" rotate={-90} />,\n        };\n\n        // Disable page range, display all the pages\n        if (range === null) {\n            const p = this._pages.map((p) => ({\n                type: 'page',\n                value: p,\n            }));\n\n            return enableBoundaries ? [previous, ...p, next] : p;\n        }\n\n        if (enableBoundaries) {\n            set.push(previous);\n        }\n\n        if (start <= 3) {\n            for (let i = 1; i < start; i++) {\n                set.push({\n                    type: 'page',\n                    value: this._pages[i - 1],\n                });\n            }\n        } else {\n            set.push({\n                type: 'page',\n                value: 1,\n            });\n\n            set.push({\n                type: 'ellipsis',\n                value: 'ellipsis',\n            });\n        }\n\n        for (let i = start; i <= end; i++) {\n            set.push({\n                type: 'page',\n                value: this._pages[i - 1],\n            });\n        }\n\n        if (end >= totalPages - 2) {\n            for (let i = end + 1; i <= totalPages; i++) {\n                set.push({\n                    type: 'page',\n                    value: this._pages[i - 1],\n                });\n            }\n        } else {\n            set.push({\n                type: 'ellipsis',\n            });\n\n            set.push({\n                type: 'page',\n                value: this._pages[this._pages.length - 1],\n            });\n        }\n\n        if (enableBoundaries) {\n            set.push(next);\n        }\n\n        return set;\n    };\n}\n",":host {\n  @apply h-8 w-8;\n  @apply flex justify-center items-center;\n  @apply font-semibold text-storm-medium text-sm;\n  @apply rounded;\n  @apply cursor-pointer;\n}\n\n:host(:hover),\n:host(:focus) {\n  @apply text-storm;\n}\n\n:host(.active) {\n  @apply text-indigo bg-indigo-light;\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'p-pagination-item',\n  styleUrl: 'pagination-item.component.scss',\n  shadow: true,\n})\nexport class PaginationItem {\n  /**\n   * Wether the pagination item is active\n   */\n  @Prop() active: boolean = false;\n\n  render() {\n    return (\n      <Host class={`p-pagination-item ${this.active && 'active'}`}>\n        <slot />\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/p-select.entry.js

@@ -6,9 +6,9 @@ const selectComponentCss = ".flex{display:flex!important}.w-full{width:100%!impo
 const Select = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
-    this.queryChange = createEvent(this, "queryChange", 7);
-    this.valueChange = createEvent(this, "valueChange", 7);
-    this.dropdownShown = createEvent(this, "dropdownShown", 7);
+    this.queryChange = createEvent(this, "queryChange", 3);
+    this.valueChange = createEvent(this, "valueChange", 3);
+    this.dropdownShown = createEvent(this, "dropdownShown", 3);
     this.items = undefined;
     this.icon = undefined;
     this.query = undefined;

package/dist/esm/p-select.entry.js.map

@@ -1 +1 @@
-{"file":"p-select.entry.js","mappings":"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","names":[],"sources":["./src/components/molecules/select/select.component.scss?tag=p-select","./src/components/molecules/select/select.component.tsx"],"sourcesContent":["p-select {\n    @apply flex w-full flex-col;\n\n    input.read-only {\n        @apply text-ellipsis;\n    }\n}\n","import {\n    Component,\n    Element,\n    Event,\n    EventEmitter,\n    h,\n    Host,\n    Listen,\n    Prop,\n    State,\n    Watch,\n} from '@stencil/core';\nimport { childOf } from '../../../utils';\nimport { IconVariant } from '../../atoms/icon/icon.component';\n\n@Component({\n    tag: 'p-select',\n    styleUrl: 'select.component.scss',\n    shadow: false,\n})\nexport class Select {\n    /**\n     * The items to show in the dropdown\n     */\n    @Prop() items: string | any[];\n\n    /**\n     * Icon of the select box\n     */\n    @Prop() icon: IconVariant;\n\n    /**\n     * The current query\n     */\n    @Prop() query: string;\n\n    /**\n     * The placeholder of the input\n     */\n    @Prop() placeholder: string;\n\n    /**\n     * The placeholder of the input when auto completing\n     */\n    @Prop() autocompletePlaceholder: string;\n\n    /**\n     * The current value\n     */\n    @Prop() value: any;\n\n    /**\n     * The key of the object to display\n     */\n    @Prop() displayKey: string = 'text';\n\n    /**\n     * The key of the object to return\n     */\n    @Prop() valueKey: string;\n\n    /**\n     * The key to identify an object\n     */\n    @Prop() identifierKey: string;\n\n    /**\n     * The key of the object to display\n     */\n    @Prop() queryKey?: string;\n\n    /**\n     * Wether to automatically select the first item\n     */\n    @Prop() autoSelectFirst: boolean = true;\n\n    /**\n     * Wether to show the chevron or not\n     */\n    @Prop() showChevron: boolean = true;\n\n    /**\n     * The maximum amount of items to display\n     */\n    @Prop() maxDisplayedItems: number = 10;\n\n    /**\n     * Wether to enable autocomplete\n     */\n    @Prop() enableAutocomplete: boolean = true;\n\n    /**\n     * Wether to keep the query or not\n     */\n    @Prop() keepQuery: boolean = true;\n\n    /**\n     * Wether the input uses async filtering\n     */\n    @Prop() asyncFilter: boolean = false;\n\n    /**\n     * Wether to show loading items\n     */\n    @Prop() loading: boolean = false;\n\n    /**\n     * Event when the query of the autocomplete changes\n     */\n    @Event() queryChange: EventEmitter<string>;\n\n    /**\n     * Event when the value changes\n     */\n    @Event() valueChange: EventEmitter<any>;\n\n    /**\n     * Event when the dropdown shows\n     */\n    @Event() dropdownShown: EventEmitter<any>;\n\n    /**\n     * The size of the input group used by the select\n     */\n    @Prop() size: 'small' | 'medium' = 'medium';\n\n    /**\n     * The prefix of the input group used by the select\n     */\n    @Prop() prefix: string;\n\n    /**\n     * The label of the input group used by the select\n     */\n    @Prop() label: string;\n\n    /**\n     * The helper of the input group used by the select\n     */\n    @Prop() helper: string;\n\n    /**\n     * Wether the field is required\n     */\n    @Prop({ reflect: true }) required: boolean;\n\n    /**\n     * The helper of the input group used by the select\n     */\n    @Prop({ reflect: true }) error: string;\n\n    /**\n     * Wether the input group is disabled used by the select\n     */\n    @Prop({ reflect: true }) disabled: boolean = false;\n\n    /**\n     * The host element\n     */\n    @Element() private _el: HTMLElement;\n\n    @State() private _showDropdown: any = false;\n    @State() private _selectedItem: any = null;\n\n    @State() private _isAutoCompleting: boolean = false;\n\n    get _items() {\n        if (!this.items || this.loading) {\n            return [];\n        }\n\n        let items =\n            typeof this.items === 'string'\n                ? JSON.parse(this.items)\n                : this.items;\n\n        if (typeof items?.[0] === 'string') {\n            this.displayKey = 'text';\n            this.valueKey = 'value';\n\n            items = items.map((str) => ({\n                value: str,\n                text: str,\n            }));\n        }\n\n        if (\n            this._isAutoCompleting &&\n            this.query?.length &&\n            this.query !== this._selectedItem?.[this.displayKey] &&\n            !this.asyncFilter\n        ) {\n            items = items.filter((item) => {\n                if (this.queryKey) {\n                    return this._checkvalue(this.queryKey, item);\n                }\n\n                return (\n                    this._checkvalue(this._identifierKey, item) ||\n                    this._checkvalue(this.displayKey, item)\n                );\n            });\n        }\n\n        return items?.slice(0, this.maxDisplayedItems);\n    }\n\n    get _displayValue() {\n        if (this._isAutoCompleting) {\n            return this.query;\n        }\n\n        return this._selectedItem?.[this.displayKey];\n    }\n\n    get _placeholder() {\n        return this._isAutoCompleting && this.autocompletePlaceholder?.length\n            ? this.autocompletePlaceholder\n            : this.placeholder;\n    }\n\n    get _identifierKey() {\n        return this.identifierKey ?? this.valueKey ?? 'value';\n    }\n\n    componentDidLoad() {\n        if (!this.valueKey && !this.identifierKey) {\n            throw new Error('You must provide a valueKey or identifierKey');\n        }\n\n        if (this.value) {\n            this._valueChange();\n            return;\n        }\n\n        this.itemChanges();\n    }\n\n    render() {\n        return (\n            <Host class=\"p-select\">\n                {this._showDropdown && (!!this._items.length || this.loading)}\n                {this._isAutoCompleting}\n                <p-dropdown\n                    disableTriggerClick={true}\n                    calculateWidth={true}\n                    insideClick={true}\n                    show={\n                        this._showDropdown &&\n                        (!!this._items.length || this.loading)\n                    }\n                >\n                    <p-input-group\n                        slot=\"trigger\"\n                        icon={this.icon}\n                        size={this.size}\n                        prefix={this.prefix}\n                        label={this.label}\n                        helper={this.helper}\n                        required={this.required}\n                        error={this.error}\n                        disabled={this.disabled}\n                        focused={this._showDropdown}\n                        focusMethod={\n                            this.enableAutocomplete ? 'focus' : 'click'\n                        }\n                    >\n                        <input\n                            slot=\"input\"\n                            type=\"text\"\n                            placeholder={this._placeholder}\n                            value={this._displayValue}\n                            class={`p-input cursor-pointer ${\n                                !this._isAutoCompleting && 'read-only'\n                            }`}\n                            onFocus={(ev) => this._onFocus(ev)}\n                            onMouseDown={(ev) => this._onMouseDown(ev)}\n                            onClick={() => this._onClick()}\n                            onInput={(ev) => this._onChange(ev)}\n                        />\n\n                        {this.showChevron && (\n                            <p-icon variant=\"chevron\" slot=\"suffix\" />\n                        )}\n                    </p-input-group>\n                    <div slot=\"items\">\n                        {this.loading\n                            ? this._getLoadingItems()\n                            : this._getItems()}\n                    </div>\n                </p-dropdown>\n            </Host>\n        );\n    }\n\n    @Listen('click', { target: 'document', capture: true })\n    protected documentClickHandler({ target }) {\n        if (!this._showDropdown || childOf(target, this._el)) {\n            return;\n        }\n\n        this._showDropdown = false;\n        this._isAutoCompleting = false;\n    }\n\n    @Watch('value')\n    private _valueChange() {\n        this._preselectItem();\n    }\n\n    @Watch('items')\n    public itemChanges() {\n        this._preselectItem();\n    }\n\n    @Watch('_showDropdown')\n    public _showDropdownChanges() {\n        this.dropdownShown.emit({\n            value: this._showDropdown,\n            query: this.query,\n        });\n    }\n\n    private _preselectItem() {\n        if (this._isAutoCompleting && this.query?.length) {\n            return;\n        }\n\n        let value = this.value;\n\n        if (!this._selectedItem && !value && this.autoSelectFirst) {\n            value = this._items[0];\n        }\n\n        // if (!value) {\n        //     this._selectValue(null);\n        //     return;\n        // }\n\n        const identifier =\n            typeof value === 'object' && value !== null\n                ? value[this._identifierKey]\n                : value;\n        const parsedValue =\n            typeof identifier === 'string' || typeof identifier === 'number'\n                ? identifier\n                : JSON.stringify(identifier);\n\n        const currentValue = this._selectedItem\n            ? this._selectedItem?.[this._identifierKey]\n            : null;\n        const currentParsedValue =\n            typeof currentValue === 'string' || typeof currentValue === 'number'\n                ? currentValue\n                : JSON.stringify(currentValue);\n\n        if (this._selectedItem && currentParsedValue === parsedValue) {\n            return;\n        }\n\n        if (!this._items?.length && value) {\n            this._selectValue(value);\n            return;\n        }\n\n        const item = this._items.find((i) => {\n            const itemIdentifier = i?.[this._identifierKey];\n            const parsedItemIdentifier =\n                typeof itemIdentifier === 'string' ||\n                typeof itemIdentifier === 'number'\n                    ? itemIdentifier\n                    : JSON.stringify(itemIdentifier);\n\n            return parsedItemIdentifier === parsedValue;\n        });\n\n        this._selectValue(!!item ? item : value);\n    }\n\n    private _selectValue(item) {\n        this._selectedItem = item;\n        const value =\n            !!this.valueKey && this.valueKey !== 'false' && item !== null\n                ? item?.[this.valueKey]\n                : item;\n\n        this.query = this.keepQuery ? item?.[this.displayKey] : null;\n        this.value = value;\n        this.valueChange.emit(value);\n\n        this._onBlur(true);\n    }\n\n    private _onFocus(ev) {\n        if (!this.enableAutocomplete) {\n            ev.preventDefault();\n            ev.stopPropogation();\n\n            if (!this._showDropdown) {\n                this._showDropdown = true;\n            }\n            return;\n        }\n\n        this._showDropdown = true;\n        this._isAutoCompleting = true;\n    }\n\n    private _onMouseDown(ev) {\n        if (this.enableAutocomplete) {\n            return;\n        }\n\n        ev.preventDefault();\n    }\n\n    private _onClick() {\n        if (this.enableAutocomplete) {\n            return;\n        }\n\n        this._showDropdown = !this._showDropdown;\n    }\n\n    private _onBlur(force = false) {\n        if (!this.enableAutocomplete && !force) {\n            return;\n        }\n\n        this._isAutoCompleting = false;\n        this._showDropdown = false;\n    }\n\n    private _onChange(ev) {\n        if (!this.enableAutocomplete) {\n            return;\n        }\n\n        if (!this._isAutoCompleting) {\n            this._isAutoCompleting = true;\n            this._showDropdown = true;\n        }\n\n        this.query = ev.target.value;\n        this.queryChange.emit(ev.target.value);\n    }\n\n    private _checkvalue(key, item) {\n        return (\n            item?.[key]\n                ?.toString()\n                ?.toLowerCase()\n                .indexOf(this.query?.toLowerCase()) >= 0\n        );\n    }\n\n    private _getItems() {\n        return this._items.map((item) => (\n            <p-dropdown-menu-item\n                onClick={() => this._selectValue(item)}\n                active={\n                    item[this._identifierKey] ===\n                    this._selectedItem?.[this._identifierKey]\n                }\n            >\n                {item[this.displayKey]}\n            </p-dropdown-menu-item>\n        ));\n    }\n\n    private _getLoadingItems() {\n        return [0, 0, 0].map(() => (\n            <p-dropdown-menu-item enableHover={false}>\n                <p-loader variant=\"ghost\" class=\"h-6 w-full rounded\" />\n            </p-dropdown-menu-item>\n        ));\n    }\n}\n"],"version":3}
+{"file":"p-select.entry.js","mappings":";;;AAAA,MAAM,kBAAkB,GAAG,klLAAklL;;MCoBhmL,MAAM;;;;;;;;;;;;sBAkCc,MAAM;;;;2BAoBA,IAAI;uBAKR,IAAI;6BAKC,EAAE;8BAKA,IAAI;qBAKb,IAAI;uBAKF,KAAK;mBAKT,KAAK;gBA0BG,QAAQ;;;;;;oBA8BE,KAAK;yBAOZ,KAAK;yBACL,IAAI;6BAEI,KAAK;;EAEnD,IAAI,MAAM;;IACN,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,OAAO,EAAE;MAC7B,OAAO,EAAE,CAAC;KACb;IAED,IAAI,KAAK,GACL,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ;QACxB,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC;QACtB,IAAI,CAAC,KAAK,CAAC;IAErB,IAAI,QAAO,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAG,CAAC,CAAC,CAAA,KAAK,QAAQ,EAAE;MAChC,IAAI,CAAC,UAAU,GAAG,MAAM,CAAC;MACzB,IAAI,CAAC,QAAQ,GAAG,OAAO,CAAC;MAExB,KAAK,GAAG,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,MAAM;QACxB,KAAK,EAAE,GAAG;QACV,IAAI,EAAE,GAAG;OACZ,CAAC,CAAC,CAAC;KACP;IAED,IACI,IAAI,CAAC,iBAAiB;OACtB,MAAA,IAAI,CAAC,KAAK,0CAAE,MAAM,CAAA;MAClB,IAAI,CAAC,KAAK,MAAK,MAAA,IAAI,CAAC,aAAa,0CAAG,IAAI,CAAC,UAAU,CAAC,CAAA;MACpD,CAAC,IAAI,CAAC,WAAW,EACnB;MACE,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,IAAI;QACtB,IAAI,IAAI,CAAC,QAAQ,EAAE;UACf,OAAO,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,CAAC;SAChD;QAED,QACI,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,cAAc,EAAE,IAAI,CAAC;UAC3C,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,EACzC;OACL,CAAC,CAAC;KACN;IAED,OAAO,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,KAAK,CAAC,CAAC,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC;GAClD;EAED,IAAI,aAAa;;IACb,IAAI,IAAI,CAAC,iBAAiB,EAAE;MACxB,OAAO,IAAI,CAAC,KAAK,CAAC;KACrB;IAED,OAAO,MAAA,IAAI,CAAC,aAAa,0CAAG,IAAI,CAAC,UAAU,CAAC,CAAC;GAChD;EAED,IAAI,YAAY;;IACZ,OAAO,IAAI,CAAC,iBAAiB,KAAI,MAAA,IAAI,CAAC,uBAAuB,0CAAE,MAAM,CAAA;QAC/D,IAAI,CAAC,uBAAuB;QAC5B,IAAI,CAAC,WAAW,CAAC;GAC1B;EAED,IAAI,cAAc;;IACd,OAAO,MAAA,MAAA,IAAI,CAAC,aAAa,mCAAI,IAAI,CAAC,QAAQ,mCAAI,OAAO,CAAC;GACzD;EAED,gBAAgB;IACZ,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;MACvC,MAAM,IAAI,KAAK,CAAC,8CAA8C,CAAC,CAAC;KACnE;IAED,IAAI,IAAI,CAAC,KAAK,EAAE;MACZ,IAAI,CAAC,YAAY,EAAE,CAAC;MACpB,OAAO;KACV;IAED,IAAI,CAAC,WAAW,EAAE,CAAC;GACtB;EAED,MAAM;IACF,QACI,EAAC,IAAI,IAAC,KAAK,EAAC,UAAU,IACjB,IAAI,CAAC,aAAa,KAAK,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM,IAAI,IAAI,CAAC,OAAO,CAAC,EAC5D,IAAI,CAAC,iBAAiB,EACvB,kBACI,mBAAmB,EAAE,IAAI,EACzB,cAAc,EAAE,IAAI,EACpB,WAAW,EAAE,IAAI,EACjB,IAAI,EACA,IAAI,CAAC,aAAa;SACjB,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM,IAAI,IAAI,CAAC,OAAO,CAAC,IAG1C,qBACI,IAAI,EAAC,SAAS,EACd,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,OAAO,EAAE,IAAI,CAAC,aAAa,EAC3B,WAAW,EACP,IAAI,CAAC,kBAAkB,GAAG,OAAO,GAAG,OAAO,IAG/C,aACI,IAAI,EAAC,OAAO,EACZ,IAAI,EAAC,MAAM,EACX,WAAW,EAAE,IAAI,CAAC,YAAY,EAC9B,KAAK,EAAE,IAAI,CAAC,aAAa,EACzB,KAAK,EAAE,0BACH,CAAC,IAAI,CAAC,iBAAiB,IAAI,WAC/B,EAAE,EACF,OAAO,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC,QAAQ,CAAC,EAAE,CAAC,EAClC,WAAW,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC,YAAY,CAAC,EAAE,CAAC,EAC1C,OAAO,EAAE,MAAM,IAAI,CAAC,QAAQ,EAAE,EAC9B,OAAO,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC,SAAS,CAAC,EAAE,CAAC,GACrC,EAED,IAAI,CAAC,WAAW,KACb,cAAQ,OAAO,EAAC,SAAS,EAAC,IAAI,EAAC,QAAQ,GAAG,CAC7C,CACW,EAChB,WAAK,IAAI,EAAC,OAAO,IACZ,IAAI,CAAC,OAAO;QACP,IAAI,CAAC,gBAAgB,EAAE;QACvB,IAAI,CAAC,SAAS,EAAE,CACpB,CACG,CACV,EACT;GACL;EAGS,oBAAoB,CAAC,EAAE,MAAM,EAAE;IACrC,IAAI,CAAC,IAAI,CAAC,aAAa,IAAI,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC,GAAG,CAAC,EAAE;MAClD,OAAO;KACV;IAED,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;IAC3B,IAAI,CAAC,iBAAiB,GAAG,KAAK,CAAC;GAClC;EAGO,YAAY;IAChB,IAAI,CAAC,cAAc,EAAE,CAAC;GACzB;EAGM,WAAW;IACd,IAAI,CAAC,cAAc,EAAE,CAAC;GACzB;EAGM,oBAAoB;IACvB,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC;MACpB,KAAK,EAAE,IAAI,CAAC,aAAa;MACzB,KAAK,EAAE,IAAI,CAAC,KAAK;KACpB,CAAC,CAAC;GACN;EAEO,cAAc;;IAClB,IAAI,IAAI,CAAC,iBAAiB,KAAI,MAAA,IAAI,CAAC,KAAK,0CAAE,MAAM,CAAA,EAAE;MAC9C,OAAO;KACV;IAED,IAAI,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;IAEvB,IAAI,CAAC,IAAI,CAAC,aAAa,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,eAAe,EAAE;MACvD,KAAK,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;KAC1B;;;;;IAOD,MAAM,UAAU,GACZ,OAAO,KAAK,KAAK,QAAQ,IAAI,KAAK,KAAK,IAAI;QACrC,KAAK,CAAC,IAAI,CAAC,cAAc,CAAC;QAC1B,KAAK,CAAC;IAChB,MAAM,WAAW,GACb,OAAO,UAAU,KAAK,QAAQ,IAAI,OAAO,UAAU,KAAK,QAAQ;QAC1D,UAAU;QACV,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC;IAErC,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa;QACjC,MAAA,IAAI,CAAC,aAAa,0CAAG,IAAI,CAAC,cAAc,CAAC;QACzC,IAAI,CAAC;IACX,MAAM,kBAAkB,GACpB,OAAO,YAAY,KAAK,QAAQ,IAAI,OAAO,YAAY,KAAK,QAAQ;QAC9D,YAAY;QACZ,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC;IAEvC,IAAI,IAAI,CAAC,aAAa,IAAI,kBAAkB,KAAK,WAAW,EAAE;MAC1D,OAAO;KACV;IAED,IAAI,EAAC,MAAA,IAAI,CAAC,MAAM,0CAAE,MAAM,CAAA,IAAI,KAAK,EAAE;MAC/B,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;MACzB,OAAO;KACV;IAED,MAAM,IAAI,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC;MAC5B,MAAM,cAAc,GAAG,CAAC,aAAD,CAAC,uBAAD,CAAC,CAAG,IAAI,CAAC,cAAc,CAAC,CAAC;MAChD,MAAM,oBAAoB,GACtB,OAAO,cAAc,KAAK,QAAQ;QAClC,OAAO,cAAc,KAAK,QAAQ;UAC5B,cAAc;UACd,IAAI,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;MAEzC,OAAO,oBAAoB,KAAK,WAAW,CAAC;KAC/C,CAAC,CAAC;IAEH,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,GAAG,IAAI,GAAG,KAAK,CAAC,CAAC;GAC5C;EAEO,YAAY,CAAC,IAAI;IACrB,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;IAC1B,MAAM,KAAK,GACP,CAAC,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,KAAK,OAAO,IAAI,IAAI,KAAK,IAAI;QACvD,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAG,IAAI,CAAC,QAAQ,CAAC;QACrB,IAAI,CAAC;IAEf,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,SAAS,GAAG,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAG,IAAI,CAAC,UAAU,CAAC,GAAG,IAAI,CAAC;IAC7D,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;IACnB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAE7B,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;GACtB;EAEO,QAAQ,CAAC,EAAE;IACf,IAAI,CAAC,IAAI,CAAC,kBAAkB,EAAE;MAC1B,EAAE,CAAC,cAAc,EAAE,CAAC;MACpB,EAAE,CAAC,eAAe,EAAE,CAAC;MAErB,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;QACrB,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;OAC7B;MACD,OAAO;KACV;IAED,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;IAC1B,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC;GACjC;EAEO,YAAY,CAAC,EAAE;IACnB,IAAI,IAAI,CAAC,kBAAkB,EAAE;MACzB,OAAO;KACV;IAED,EAAE,CAAC,cAAc,EAAE,CAAC;GACvB;EAEO,QAAQ;IACZ,IAAI,IAAI,CAAC,kBAAkB,EAAE;MACzB,OAAO;KACV;IAED,IAAI,CAAC,aAAa,GAAG,CAAC,IAAI,CAAC,aAAa,CAAC;GAC5C;EAEO,OAAO,CAAC,KAAK,GAAG,KAAK;IACzB,IAAI,CAAC,IAAI,CAAC,kBAAkB,IAAI,CAAC,KAAK,EAAE;MACpC,OAAO;KACV;IAED,IAAI,CAAC,iBAAiB,GAAG,KAAK,CAAC;IAC/B,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;GAC9B;EAEO,SAAS,CAAC,EAAE;IAChB,IAAI,CAAC,IAAI,CAAC,kBAAkB,EAAE;MAC1B,OAAO;KACV;IAED,IAAI,CAAC,IAAI,CAAC,iBAAiB,EAAE;MACzB,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC;MAC9B,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;KAC7B;IAED,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC;IAC7B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;GAC1C;EAEO,WAAW,CAAC,GAAG,EAAE,IAAI;;IACzB,QACI,CAAA,MAAA,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAG,GAAG,CAAC,0CACL,QAAQ,EAAE,0CACV,WAAW,GACZ,OAAO,CAAC,MAAA,IAAI,CAAC,KAAK,0CAAE,WAAW,EAAE,CAAC,KAAI,CAAC,EAC9C;GACL;EAEO,SAAS;IACb,OAAO,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,IAAI;;MAAK,QAC7B,4BACI,OAAO,EAAE,MAAM,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,EACtC,MAAM,EACF,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC;WACzB,MAAA,IAAI,CAAC,aAAa,0CAAG,IAAI,CAAC,cAAc,CAAC,CAAA,IAG5C,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,CACH,EAC1B;KAAA,CAAC,CAAC;GACN;EAEO,gBAAgB;IACpB,OAAO,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,OACjB,4BAAsB,WAAW,EAAE,KAAK,IACpC,gBAAU,OAAO,EAAC,OAAO,EAAC,KAAK,EAAC,oBAAoB,GAAG,CACpC,CAC1B,CAAC,CAAC;GACN;;;;;;;;;;;;","names":[],"sources":["./src/components/molecules/select/select.component.scss?tag=p-select","./src/components/molecules/select/select.component.tsx"],"sourcesContent":["p-select {\n    @apply flex w-full flex-col;\n\n    input.read-only {\n        @apply text-ellipsis;\n    }\n}\n","import {\n    Component,\n    Element,\n    Event,\n    EventEmitter,\n    h,\n    Host,\n    Listen,\n    Prop,\n    State,\n    Watch\n} from '@stencil/core';\nimport { childOf } from '../../../utils';\nimport { IconVariant } from '../../atoms/icon/icon.component';\n\n@Component({\n    tag: 'p-select',\n    styleUrl: 'select.component.scss',\n    shadow: false,\n})\nexport class Select {\n    /**\n     * The items to show in the dropdown\n     */\n    @Prop() items: string | any[];\n\n    /**\n     * Icon of the select box\n     */\n    @Prop() icon: IconVariant;\n\n    /**\n     * The current query\n     */\n    @Prop() query: string;\n\n    /**\n     * The placeholder of the input\n     */\n    @Prop() placeholder: string;\n\n    /**\n     * The placeholder of the input when auto completing\n     */\n    @Prop() autocompletePlaceholder: string;\n\n    /**\n     * The current value\n     */\n    @Prop() value: any;\n\n    /**\n     * The key of the object to display\n     */\n    @Prop() displayKey: string = 'text';\n\n    /**\n     * The key of the object to return\n     */\n    @Prop() valueKey: string;\n\n    /**\n     * The key to identify an object\n     */\n    @Prop() identifierKey: string;\n\n    /**\n     * The key of the object to display\n     */\n    @Prop() queryKey?: string;\n\n    /**\n     * Wether to automatically select the first item\n     */\n    @Prop() autoSelectFirst: boolean = true;\n\n    /**\n     * Wether to show the chevron or not\n     */\n    @Prop() showChevron: boolean = true;\n\n    /**\n     * The maximum amount of items to display\n     */\n    @Prop() maxDisplayedItems: number = 10;\n\n    /**\n     * Wether to enable autocomplete\n     */\n    @Prop() enableAutocomplete: boolean = true;\n\n    /**\n     * Wether to keep the query or not\n     */\n    @Prop() keepQuery: boolean = true;\n\n    /**\n     * Wether the input uses async filtering\n     */\n    @Prop() asyncFilter: boolean = false;\n\n    /**\n     * Wether to show loading items\n     */\n    @Prop() loading: boolean = false;\n\n    /**\n     * Event when the query of the autocomplete changes\n     */\n    @Event({\n        bubbles: false\n    }) queryChange: EventEmitter<string>;\n\n    /**\n     * Event when the value changes\n     */\n    @Event({\n        bubbles: false\n    }) valueChange: EventEmitter<any>;\n\n    /**\n     * Event when the dropdown shows\n     */\n    @Event({\n        bubbles: false\n    }) dropdownShown: EventEmitter<any>;\n\n    /**\n     * The size of the input group used by the select\n     */\n    @Prop() size: 'small' | 'medium' = 'medium';\n\n    /**\n     * The prefix of the input group used by the select\n     */\n    @Prop() prefix: string;\n\n    /**\n     * The label of the input group used by the select\n     */\n    @Prop() label: string;\n\n    /**\n     * The helper of the input group used by the select\n     */\n    @Prop() helper: string;\n\n    /**\n     * Wether the field is required\n     */\n    @Prop({ reflect: true }) required: boolean;\n\n    /**\n     * The helper of the input group used by the select\n     */\n    @Prop({ reflect: true }) error: string;\n\n    /**\n     * Wether the input group is disabled used by the select\n     */\n    @Prop({ reflect: true }) disabled: boolean = false;\n\n    /**\n     * The host element\n     */\n    @Element() private _el: HTMLElement;\n\n    @State() private _showDropdown: any = false;\n    @State() private _selectedItem: any = null;\n\n    @State() private _isAutoCompleting: boolean = false;\n\n    get _items() {\n        if (!this.items || this.loading) {\n            return [];\n        }\n\n        let items =\n            typeof this.items === 'string'\n                ? JSON.parse(this.items)\n                : this.items;\n\n        if (typeof items?.[0] === 'string') {\n            this.displayKey = 'text';\n            this.valueKey = 'value';\n\n            items = items.map((str) => ({\n                value: str,\n                text: str,\n            }));\n        }\n\n        if (\n            this._isAutoCompleting &&\n            this.query?.length &&\n            this.query !== this._selectedItem?.[this.displayKey] &&\n            !this.asyncFilter\n        ) {\n            items = items.filter((item) => {\n                if (this.queryKey) {\n                    return this._checkvalue(this.queryKey, item);\n                }\n\n                return (\n                    this._checkvalue(this._identifierKey, item) ||\n                    this._checkvalue(this.displayKey, item)\n                );\n            });\n        }\n\n        return items?.slice(0, this.maxDisplayedItems);\n    }\n\n    get _displayValue() {\n        if (this._isAutoCompleting) {\n            return this.query;\n        }\n\n        return this._selectedItem?.[this.displayKey];\n    }\n\n    get _placeholder() {\n        return this._isAutoCompleting && this.autocompletePlaceholder?.length\n            ? this.autocompletePlaceholder\n            : this.placeholder;\n    }\n\n    get _identifierKey() {\n        return this.identifierKey ?? this.valueKey ?? 'value';\n    }\n\n    componentDidLoad() {\n        if (!this.valueKey && !this.identifierKey) {\n            throw new Error('You must provide a valueKey or identifierKey');\n        }\n\n        if (this.value) {\n            this._valueChange();\n            return;\n        }\n\n        this.itemChanges();\n    }\n\n    render() {\n        return (\n            <Host class=\"p-select\">\n                {this._showDropdown && (!!this._items.length || this.loading)}\n                {this._isAutoCompleting}\n                <p-dropdown\n                    disableTriggerClick={true}\n                    calculateWidth={true}\n                    insideClick={true}\n                    show={\n                        this._showDropdown &&\n                        (!!this._items.length || this.loading)\n                    }\n                >\n                    <p-input-group\n                        slot=\"trigger\"\n                        icon={this.icon}\n                        size={this.size}\n                        prefix={this.prefix}\n                        label={this.label}\n                        helper={this.helper}\n                        required={this.required}\n                        error={this.error}\n                        disabled={this.disabled}\n                        focused={this._showDropdown}\n                        focusMethod={\n                            this.enableAutocomplete ? 'focus' : 'click'\n                        }\n                    >\n                        <input\n                            slot=\"input\"\n                            type=\"text\"\n                            placeholder={this._placeholder}\n                            value={this._displayValue}\n                            class={`p-input cursor-pointer ${\n                                !this._isAutoCompleting && 'read-only'\n                            }`}\n                            onFocus={(ev) => this._onFocus(ev)}\n                            onMouseDown={(ev) => this._onMouseDown(ev)}\n                            onClick={() => this._onClick()}\n                            onInput={(ev) => this._onChange(ev)}\n                        />\n\n                        {this.showChevron && (\n                            <p-icon variant=\"chevron\" slot=\"suffix\" />\n                        )}\n                    </p-input-group>\n                    <div slot=\"items\">\n                        {this.loading\n                            ? this._getLoadingItems()\n                            : this._getItems()}\n                    </div>\n                </p-dropdown>\n            </Host>\n        );\n    }\n\n    @Listen('click', { target: 'document', capture: true })\n    protected documentClickHandler({ target }) {\n        if (!this._showDropdown || childOf(target, this._el)) {\n            return;\n        }\n\n        this._showDropdown = false;\n        this._isAutoCompleting = false;\n    }\n\n    @Watch('value')\n    private _valueChange() {\n        this._preselectItem();\n    }\n\n    @Watch('items')\n    public itemChanges() {\n        this._preselectItem();\n    }\n\n    @Watch('_showDropdown')\n    public _showDropdownChanges() {\n        this.dropdownShown.emit({\n            value: this._showDropdown,\n            query: this.query,\n        });\n    }\n\n    private _preselectItem() {\n        if (this._isAutoCompleting && this.query?.length) {\n            return;\n        }\n\n        let value = this.value;\n\n        if (!this._selectedItem && !value && this.autoSelectFirst) {\n            value = this._items[0];\n        }\n\n        // if (!value) {\n        //     this._selectValue(null);\n        //     return;\n        // }\n\n        const identifier =\n            typeof value === 'object' && value !== null\n                ? value[this._identifierKey]\n                : value;\n        const parsedValue =\n            typeof identifier === 'string' || typeof identifier === 'number'\n                ? identifier\n                : JSON.stringify(identifier);\n\n        const currentValue = this._selectedItem\n            ? this._selectedItem?.[this._identifierKey]\n            : null;\n        const currentParsedValue =\n            typeof currentValue === 'string' || typeof currentValue === 'number'\n                ? currentValue\n                : JSON.stringify(currentValue);\n\n        if (this._selectedItem && currentParsedValue === parsedValue) {\n            return;\n        }\n\n        if (!this._items?.length && value) {\n            this._selectValue(value);\n            return;\n        }\n\n        const item = this._items.find((i) => {\n            const itemIdentifier = i?.[this._identifierKey];\n            const parsedItemIdentifier =\n                typeof itemIdentifier === 'string' ||\n                typeof itemIdentifier === 'number'\n                    ? itemIdentifier\n                    : JSON.stringify(itemIdentifier);\n\n            return parsedItemIdentifier === parsedValue;\n        });\n\n        this._selectValue(!!item ? item : value);\n    }\n\n    private _selectValue(item) {\n        this._selectedItem = item;\n        const value =\n            !!this.valueKey && this.valueKey !== 'false' && item !== null\n                ? item?.[this.valueKey]\n                : item;\n\n        this.query = this.keepQuery ? item?.[this.displayKey] : null;\n        this.value = value;\n        this.valueChange.emit(value);\n\n        this._onBlur(true);\n    }\n\n    private _onFocus(ev) {\n        if (!this.enableAutocomplete) {\n            ev.preventDefault();\n            ev.stopPropogation();\n\n            if (!this._showDropdown) {\n                this._showDropdown = true;\n            }\n            return;\n        }\n\n        this._showDropdown = true;\n        this._isAutoCompleting = true;\n    }\n\n    private _onMouseDown(ev) {\n        if (this.enableAutocomplete) {\n            return;\n        }\n\n        ev.preventDefault();\n    }\n\n    private _onClick() {\n        if (this.enableAutocomplete) {\n            return;\n        }\n\n        this._showDropdown = !this._showDropdown;\n    }\n\n    private _onBlur(force = false) {\n        if (!this.enableAutocomplete && !force) {\n            return;\n        }\n\n        this._isAutoCompleting = false;\n        this._showDropdown = false;\n    }\n\n    private _onChange(ev) {\n        if (!this.enableAutocomplete) {\n            return;\n        }\n\n        if (!this._isAutoCompleting) {\n            this._isAutoCompleting = true;\n            this._showDropdown = true;\n        }\n\n        this.query = ev.target.value;\n        this.queryChange.emit(ev.target.value);\n    }\n\n    private _checkvalue(key, item) {\n        return (\n            item?.[key]\n                ?.toString()\n                ?.toLowerCase()\n                .indexOf(this.query?.toLowerCase()) >= 0\n        );\n    }\n\n    private _getItems() {\n        return this._items.map((item) => (\n            <p-dropdown-menu-item\n                onClick={() => this._selectValue(item)}\n                active={\n                    item[this._identifierKey] ===\n                    this._selectedItem?.[this._identifierKey]\n                }\n            >\n                {item[this.displayKey]}\n            </p-dropdown-menu-item>\n        ));\n    }\n\n    private _getLoadingItems() {\n        return [0, 0, 0].map(() => (\n            <p-dropdown-menu-item enableHover={false}>\n                <p-loader variant=\"ghost\" class=\"h-6 w-full rounded\" />\n            </p-dropdown-menu-item>\n        ));\n    }\n}\n"],"version":3}

package/dist/esm/p-table.entry.js

@@ -7,19 +7,19 @@ const tableComponentCss = ".flex{display:flex!important}.flex-shrink{flex-shrink
 const Table = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
-    this.selectedRowsChange = createEvent(this, "selectedRowsChange", 7);
-    this.rowClick = createEvent(this, "rowClick", 7);
-    this.rowSelected = createEvent(this, "rowSelected", 7);
-    this.rowDeselected = createEvent(this, "rowDeselected", 7);
-    this.hasRendered = createEvent(this, "hasRendered", 7);
-    this.quickFilter = createEvent(this, "quickFilter", 7);
-    this.queryChange = createEvent(this, "queryChange", 7);
-    this.filter = createEvent(this, "filter", 7);
-    this.edit = createEvent(this, "edit", 7);
-    this.pageChange = createEvent(this, "pageChange", 7);
-    this.pageSizeChange = createEvent(this, "pageSizeChange", 7);
-    this.export = createEvent(this, "export", 7);
-    this.emptyStateActionClick = createEvent(this, "emptyStateActionClick", 7);
+    this.selectedRowsChange = createEvent(this, "selectedRowsChange", 3);
+    this.rowClick = createEvent(this, "rowClick", 3);
+    this.rowSelected = createEvent(this, "rowSelected", 3);
+    this.rowDeselected = createEvent(this, "rowDeselected", 3);
+    this.hasRendered = createEvent(this, "hasRendered", 3);
+    this.quickFilter = createEvent(this, "quickFilter", 3);
+    this.queryChange = createEvent(this, "queryChange", 3);
+    this.filter = createEvent(this, "filter", 3);
+    this.edit = createEvent(this, "edit", 3);
+    this.pageChange = createEvent(this, "pageChange", 3);
+    this.pageSizeChange = createEvent(this, "pageSizeChange", 3);
+    this.export = createEvent(this, "export", 3);
+    this.emptyStateActionClick = createEvent(this, "emptyStateActionClick", 3);
     this._ctrlDown = false;
     this._hasCustomFilterSlot = false;
     this.items = undefined;

package/dist/esm/p-table.entry.js.map

@@ -1 +1 @@
-{"file":"p-table.entry.js","mappings":"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","names":[],"sources":["./src/components/organisms/table/table.component.scss?tag=p-table","./src/components/organisms/table/table.component.tsx"],"sourcesContent":["p-table {\n    @apply flex flex-col;\n\n    .p-input[type='checkbox'] {\n        flex-shrink: 0;\n    }\n}\n","import {\n    Component,\n    Element,\n    Event,\n    EventEmitter,\n    h,\n    Host,\n    Listen,\n    Prop,\n    State,\n    Watch,\n} from '@stencil/core';\nimport { IconVariant } from '../../../components';\nimport { QuickFilter, RowClickEvent } from '../../../types/table';\nimport { formatTranslation, getLocaleComponentStrings } from '../../../utils';\nimport { TableColumn } from '../../helpers/table-column/table-column.component';\nimport {\n    defaultSize,\n    defaultSizeOptions,\n} from '../../molecules/page-size-select/constants';\nimport { buttonTemplateFunc } from '../../molecules/table-header/table-header.component';\n\nexport type templateFunc = () => string;\n\n@Component({\n    tag: 'p-table',\n    styleUrl: 'table.component.scss',\n})\nexport class Table {\n    /**\n     * The items to be fed to the table\n     */\n    @Prop() items: string;\n\n    /**\n     * Wether data is loading\n     */\n    @Prop() loading: boolean = false;\n\n    /**\n     * Wether the header should show loading state\n     */\n    @Prop() headerLoading: boolean = false;\n\n    /**\n     * Wether the footer should show loading state\n     */\n    @Prop() footerLoading: boolean = false;\n\n    /**\n     * The amount of loading rows to show\n     */\n    @Prop() amountOfLoadingRows: number = 6;\n\n    /**\n     * Wether to enable selection\n     */\n    @Prop() enableRowSelection: boolean = true;\n\n    /**\n     * Wether to enable row clicking\n     */\n    @Prop() enableRowClick: boolean = true;\n\n    /**\n     * The current selection of items\n     */\n    @Prop() selectedRows: any[] = [];\n\n    /**\n     * Event whenever the current selection changes\n     */\n    @Event() selectedRowsChange: EventEmitter<any>;\n\n    /**\n     * The key to determine if a row is selected\n     */\n    @Prop() selectionKey: string;\n\n    /**\n     * A key to determine if a row can be selected\n     */\n    @Prop() canSelectKey: string;\n\n    /**\n     * Event whenever a row is clicked\n     */\n    @Event() rowClick: EventEmitter<RowClickEvent>;\n\n    /**\n     * Event whenever a row is selected\n     */\n    @Event() rowSelected: EventEmitter<any>;\n\n    /**\n     * Event whenever a row is deselected\n     */\n    @Event() rowDeselected: EventEmitter<any>;\n\n    /**\n     * Event when the table has rendered\n     */\n    @Event() hasRendered: EventEmitter<number>;\n\n    /** START HEADER */\n\n    /**\n     * Wether to show the header\n     */\n    @Prop() enableHeader: boolean = true;\n\n    /**\n     * Quick filters to show\n     */\n    @Prop() quickFilters: QuickFilter[] = [];\n\n    /**\n     * Active quick filter identifier\n     */\n    @Prop() activeQuickFilterIdentifier: string;\n\n    /**\n     * Wether to show the search input\n     */\n    @Prop() enableSearch: boolean = true;\n\n    /**\n     * The query to show in the search bar\n     */\n    @Prop({ mutable: true }) query: string;\n\n    /**\n     * Wether to show the filter button\n     */\n    @Prop() enableFilter: boolean = true;\n\n    /**\n     * The amount of filters being selected\n     */\n    @Prop() selectedFiltersAmount: number;\n\n    /**\n     * The template for the filter button text\n     */\n    @Prop() filterButtonTemplate: templateFunc;\n\n    /**\n     * Wether to show the edit button\n     */\n    @Prop() enableEdit: boolean = true;\n\n    /**\n     * Wether the edit button is loading\n     */\n    @Prop() editButtonLoading: boolean = false;\n\n    /**\n     * The edit button icon\n     */\n    @Prop() editButtonIcon: IconVariant = 'pencil';\n\n    /**\n     * The edit button text if changed\n     */\n    @Prop() editButtonText: string;\n\n    /**\n     * The template for the edit button text\n     */\n    @Prop() editButtonTemplate: buttonTemplateFunc;\n\n    /**\n     * Event when one of the quick filters is clicked\n     */\n    @Event() quickFilter: EventEmitter<QuickFilter>;\n\n    /**\n     * Event when the query changes\n     */\n    @Event() queryChange: EventEmitter<string>;\n\n    /**\n     * Event when the filter button is clicked\n     */\n    @Event() filter: EventEmitter<null>;\n\n    /**\n     * Event when the edit button is clicked\n     */\n    @Event() edit: EventEmitter<null>;\n\n    /** START FOOTER */\n\n    /**\n     * Wether to show the header\n     */\n    @Prop() enableFooter: boolean = true;\n\n    /**\n     * Wether to enable page size select\n     */\n    @Prop() enablePageSize: boolean = true;\n\n    /**\n     * Wether to enable pagination\n     */\n    @Prop() enablePagination: boolean = true;\n\n    /**\n     * Wether to enable export\n     */\n    @Prop() enableExport: boolean = true;\n\n    /**\n     * The current page\n     */\n    @Prop({ mutable: true, reflect: true }) page: number = 1;\n\n    /**\n     * The total amount of items\n     */\n    @Prop() total!: number;\n\n    /**\n     * Event whenever the page changes\n     */\n    @Event() pageChange: EventEmitter<number>;\n\n    /**\n     * The amount of items per page\n     */\n    @Prop() pageSize: number = defaultSize;\n\n    /**\n     * The options for the page size\n     */\n    @Prop() pageSizeOptions: number[] = defaultSizeOptions;\n\n    /**\n     * Event whenever the page changes\n     */\n    @Event() pageSizeChange: EventEmitter<number>;\n\n    /**\n     * Event whenever the page changes\n     */\n    @Event() export: EventEmitter<number>;\n\n    /**\n     * Wether to hide when there is only 1 page available\n     */\n    @Prop() hideOnSinglePage: boolean = true;\n\n    /* Empty state start */\n    @Prop() emptyStateHeader: templateFunc = () =>\n        formatTranslation(this._locales.empty_state?.no_filter.header);\n    @Prop() emptyStateContent: templateFunc = () =>\n        formatTranslation(this._locales.empty_state?.no_filter.content);\n    @Prop() emptyStateAction: templateFunc = () =>\n        formatTranslation(this._locales.empty_state?.no_filter.action);\n    /**\n     * Wether to enable empty state action\n     */\n    @Prop() enableEmptyStateAction: boolean = true;\n\n    @Prop() emptyStateFilteredHeader: templateFunc = () =>\n        formatTranslation(this._locales.empty_state.filtered.header);\n    @Prop() emptyStateFilteredContent: templateFunc = () =>\n        formatTranslation(this._locales.empty_state.filtered.content);\n\n    /**\n     * Event whenever the empty state is clicked\n     */\n    @Event() emptyStateActionClick: EventEmitter<null>;\n\n    /* Empty state end */\n\n    /**\n     * The host element\n     */\n    @Element() private _el: HTMLElement;\n\n    /**\n     * Locales used for this component\n     */\n    @State() private _locales: any = {};\n\n    @State() private _columns: any[] = [];\n    @State() private _items: any[] = [];\n\n    private _ctrlDown = false;\n    private _hasCustomFilterSlot = false;\n\n    componentWillLoad() {\n        this._hasCustomFilterSlot = !!this._el.querySelector(\n            ':scope > [slot=\"custom-filter\"]'\n        );\n\n        this._setLocales();\n        this._parseItems(this.items);\n        this._generateColumns();\n    }\n\n    componentDidRender() {\n        this.hasRendered.emit();\n    }\n\n    render() {\n        return (\n            <Host class=\"p-table\">\n                <p-table-container>\n                    {this.enableHeader && (\n                        <p-table-header\n                            // quick filters\n                            quickFilters={this.quickFilters}\n                            activeQuickFilterIdentifier={\n                                this.activeQuickFilterIdentifier\n                            }\n                            onQuickFilter={({ detail }) =>\n                                this.quickFilter.emit(detail)\n                            }\n                            // search\n                            enableSearch={this.enableSearch}\n                            query={this.query}\n                            onQueryChange={({ detail }) =>\n                                this.queryChange.emit(detail)\n                            }\n                            // filter button\n                            enableFilter={this.enableFilter}\n                            selectedFiltersAmount={this.selectedFiltersAmount}\n                            filterButtonTemplate={this.filterButtonTemplate}\n                            onFilter={() => this.filter.emit()}\n                            // edit button\n                            enableEdit={this.enableEdit}\n                            editIcon={this.editButtonIcon}\n                            editText={this.editButtonText}\n                            editLoading={this.editButtonLoading}\n                            canEdit={!!this.selectedRows?.length}\n                            editButtonTemplate={this.editButtonTemplate}\n                            onEdit={() => this.edit.emit()}\n                            itemsSelectedAmount={this.selectedRows?.length}\n                            //loading\n                            loading={this.headerLoading}\n                        >\n                            {this._hasCustomFilterSlot && (\n                                <slot\n                                    name=\"custom-filter\"\n                                    slot=\"custom-filter\"\n                                />\n                            )}\n                        </p-table-header>\n                    )}\n\n                    {this._getHeader()}\n                    <div class=\"flex flex-col\">{this._getRows()}</div>\n\n                    {this.enableFooter && (\n                        <p-table-footer\n                            // overall\n                            hideOnSinglePage={this.hideOnSinglePage}\n                            // page size select\n                            enablePageSize={this.enablePageSize}\n                            pageSize={this.pageSize}\n                            pageSizeOptions={this.pageSizeOptions}\n                            onPageSizeChange={({ detail }) =>\n                                this.pageSizeChange.emit(detail)\n                            }\n                            // pagination\n                            enablePagination={this.enablePagination}\n                            page={this.page}\n                            total={this.total}\n                            onPageChange={({ detail }) =>\n                                this.pageChange.emit(detail)\n                            }\n                            // export\n                            enableExport={this.enableExport}\n                            onExport={() => this.export.emit()}\n                            //loading\n                            loading={this.footerLoading}\n                        ></p-table-footer>\n                    )}\n                </p-table-container>\n            </Host>\n        );\n    }\n\n    @Listen('localeChanged', { target: 'body' })\n    private async _setLocales(): Promise<void> {\n        this._locales = await getLocaleComponentStrings(this._el);\n    }\n\n    @Listen('tableDefinitionChanged', { target: 'body' })\n    onTableDefinitionUpdated() {\n        this._generateColumns();\n    }\n\n    @Listen('keydown', { target: 'document' })\n    keyDown({ key }) {\n        if (key !== 'Control' || this._ctrlDown === true) {\n            return;\n        }\n\n        this._ctrlDown = true;\n    }\n\n    @Listen('keyup', { target: 'document' })\n    keyUp({ key }) {\n        if (key !== 'Control' || this._ctrlDown === false) {\n            return;\n        }\n\n        this._ctrlDown = false;\n    }\n\n    @Listen('visibilitychange', { target: 'document' })\n    visibilityChange() {\n        if (document.visibilityState !== 'hidden' || this._ctrlDown === false) {\n            return;\n        }\n\n        this._ctrlDown = false;\n    }\n\n    @Watch('items')\n    private _parseItems(items: string) {\n        if (!items) {\n            this._items = [];\n            return;\n        }\n\n        if (Array.isArray(items)) {\n            this._items = items;\n            return;\n        }\n\n        this._items = JSON.parse(items);\n    }\n\n    private _generateColumns() {\n        const definitions = this._el.querySelectorAll('p-table-column');\n        const definitionsArray = Array.from(definitions);\n\n        definitionsArray[definitionsArray.length - 1]['isLast'] = true;\n\n        this._columns = definitionsArray;\n    }\n\n    private _getHeader() {\n        return (\n            <p-table-row variant=\"header\">\n                {this._columns.map((col: TableColumn, index) => (\n                    <p-table-cell\n                        definition={col}\n                        value={col.name}\n                        variant=\"header\"\n                        checkbox={\n                            index === 0 || col.hasCheckbox\n                                ? this._getCheckbox(null, 'loading')\n                                : null\n                        }\n                        index={index}\n                    ></p-table-cell>\n                ))}\n            </p-table-row>\n        );\n    }\n\n    private _getRows() {\n        if (this.loading) {\n            return Array.from(\n                {\n                    length: this.amountOfLoadingRows,\n                },\n                (_, i) => (\n                    <p-table-row\n                        enableHover={\n                            this.enableRowSelection || this.enableRowClick\n                        }\n                    >\n                        {this._getLoadingColumns(i)}\n                    </p-table-row>\n                )\n            );\n        }\n\n        if (!this._items.length) {\n            return this._getEmptyState();\n        }\n\n        return this._items.map((item, index) => (\n            <p-table-row\n                enableHover={this.enableRowSelection || this.enableRowClick}\n                onClick={(ev) => this._rowClick(ev, index)}\n            >\n                {this._getRowColumns(item, index)}\n            </p-table-row>\n        ));\n    }\n\n    private _getRowColumns(item, index) {\n        return this._columns.map((col: TableColumn, colIndex) => {\n            return (\n                <p-table-cell\n                    definition={col}\n                    item={item}\n                    checkbox={\n                        colIndex === 0 || col.hasCheckbox\n                            ? this._getCheckbox(index)\n                            : null\n                    }\n                    index={colIndex}\n                    rowIndex={index}\n                ></p-table-cell>\n            );\n        });\n    }\n\n    private _getLoadingColumns(index) {\n        return this._columns.map((col: TableColumn, colIndex) => {\n            return (\n                <p-table-cell\n                    definition={col}\n                    variant=\"loading\"\n                    checkbox={\n                        colIndex === 0 || col.hasCheckbox\n                            ? this._getCheckbox(index, 'loading')\n                            : null\n                    }\n                    index={colIndex}\n                    rowIndex={index}\n                ></p-table-cell>\n            );\n        });\n    }\n\n    private _getCheckbox(\n        rowIndex,\n        variant: 'header' | 'default' | 'loading' = 'default'\n    ) {\n        if (!this.enableRowSelection || !this.selectionKey) {\n            return;\n        }\n\n        if (variant === 'loading') {\n            return <p-loader variant=\"ghost\" class=\"h-6 w-6 rounded\" />;\n        }\n\n        if (variant === 'header') {\n            return (\n                <input\n                    class=\"p-input\"\n                    type=\"checkbox\"\n                    onChange={(ev) => this._selectAllChange(ev)}\n                    checked={this._selectionContainsAll()}\n                    indeterminate={this._selectionIndeterminate()}\n                />\n            );\n        }\n\n        const item = this._items[rowIndex];\n\n        return (\n            <input\n                class=\"p-input\"\n                type=\"checkbox\"\n                onChange={(ev) => this._checkboxChange(ev?.target, rowIndex)}\n                disabled={this.canSelectKey && !item[this.canSelectKey]}\n                checked={this._selectionContains(item, rowIndex)}\n            />\n        );\n    }\n\n    private _getEmptyState() {\n        if (this.query?.length || this.selectedFiltersAmount) {\n            return (\n                <div class=\"flex max-w-[20rem] flex-col items-center self-center py-24 text-center\">\n                    <p-illustration variant=\"empty-state-search\" class=\"mb-6\" />\n                    <p class=\"text-storm-default font-semibold\">\n                        {this.emptyStateFilteredHeader()}\n                    </p>\n                    <p class=\"mb-14 text-sm text-storm-medium\">\n                        {this.emptyStateFilteredContent()}\n                    </p>\n                </div>\n            );\n        }\n\n        return (\n            <div\n                class={`flex max-w-[20rem] flex-col items-center self-center py-24 text-center ${\n                    this.enableEmptyStateAction && 'cursor-pointer'\n                }`}\n                onClick={() =>\n                    this.enableEmptyStateAction &&\n                    this.emptyStateActionClick.emit(null)\n                }\n            >\n                <p-illustration variant=\"empty-state-add\" class=\"mb-6\" />\n                <p class=\"text-storm-default font-semibold\">\n                    {this.emptyStateHeader()}\n                </p>\n                <p class=\"mb-6 text-sm text-storm-medium\">\n                    {this.emptyStateContent()}\n                </p>\n                {this.enableEmptyStateAction && (\n                    <p-button variant=\"secondary\" icon=\"plus\" size=\"small\">\n                        {this.emptyStateAction()}\n                    </p-button>\n                )}\n            </div>\n        );\n    }\n\n    private _selectAllChange($event: any) {\n        if (!this.enableRowSelection) {\n            return;\n        }\n\n        const value = this._getCheckedValue($event.target);\n        if (value) {\n            const toAdd = [];\n            for (let i = 0; i < this._items.length; i++) {\n                const row = this._items[i];\n                if (this.canSelectKey && !row[this.canSelectKey]) {\n                    continue;\n                }\n\n                if (this._selectionContains(row, i)) {\n                    continue;\n                }\n\n                toAdd.push(row);\n                this.rowSelected.emit(row);\n            }\n\n            this.selectedRows = [...this.selectedRows, ...toAdd];\n            this.selectedRowsChange.emit(this.selectedRows);\n            return;\n        }\n\n        for (let i = 0; i < this.selectedRows.length; i++) {\n            const value = this.selectedRows[i];\n            const row = this._items.find(\n                (d) =>\n                    this._getSelectionValue(d, i) ===\n                    this._getSelectionValue(value, i)\n            );\n\n            if (!row) {\n                continue;\n            }\n\n            this.rowDeselected.emit(row);\n        }\n\n        this.selectedRows = [];\n        this.selectedRowsChange.emit(this.selectedRows);\n    }\n\n    private _checkboxChange(target: any, index: number) {\n        if (!this.enableRowSelection) {\n            return;\n        }\n\n        const row = this._items[index];\n\n        if (this.canSelectKey && !row[this.canSelectKey]) {\n            target.checked = false;\n            return;\n        }\n\n        const value = this._getCheckedValue(target);\n        if (value) {\n            this.selectedRows = [...this.selectedRows, row];\n            this.selectedRowsChange.emit(this.selectedRows);\n            this.rowSelected.emit(row);\n            return;\n        }\n\n        const indexOfToRemove = this._selectionContains(row, index, true);\n\n        // we need to do this, because splice does not trigger the selection setter.\n        const selection = [...this.selectedRows];\n        selection.splice(indexOfToRemove, 1);\n        this.selectedRows = selection;\n        this.selectedRowsChange.emit(this.selectedRows);\n        this.rowDeselected.emit(row);\n    }\n\n    private _getCheckedValue(target: any) {\n        return target?.checked;\n    }\n\n    private _getSelectionValue(row: any, index: number) {\n        return this.selectionKey ? row?.[this.selectionKey] || index : index;\n    }\n\n    private _selectionContains(row, index, returnIndex = false): any {\n        const returnValue = this.selectedRows.findIndex(\n            (item) =>\n                this._getSelectionValue(row, index) ===\n                this._getSelectionValue(item, index)\n        );\n        return !returnIndex ? returnValue >= 0 : returnValue;\n    }\n\n    private _selectionContainsAll() {\n        let returnValue = true;\n        if (!this._items?.length) {\n            return false;\n        }\n\n        for (let i = 0; i < this._items?.length; i++) {\n            const item = this._items[i];\n            const contains = this._selectionContains(item, i);\n\n            if (!contains) {\n                returnValue = false;\n                break;\n            }\n        }\n\n        return returnValue;\n    }\n\n    private _selectionIndeterminate() {\n        if (!this._items?.length || !this.selectedRows?.length) {\n            return false;\n        }\n\n        let containsCount = 0;\n        for (let i = 0; i < this._items?.length; i++) {\n            const item = this._items[i];\n            const contains = this._selectionContains(item, i);\n\n            if (contains) {\n                containsCount++;\n            }\n        }\n\n        return containsCount > 0 && containsCount !== this._items.length;\n    }\n\n    private _rowClick($event, index) {\n        const target = $event.target;\n\n        if (\n            target.tagName.toLowerCase() === 'input' ||\n            target.type === 'checkbox'\n        ) {\n            return;\n        }\n\n        const row = this._findRow($event.target);\n\n        if (this.enableRowClick) {\n            const action = this._findRowAction($event.target);\n\n            if (action) {\n                return;\n            }\n\n            const item = this._items[index];\n            this.rowClick.emit({\n                item,\n                ctrlDown: this._ctrlDown,\n            });\n            return;\n        }\n\n        if (!this.enableRowSelection) {\n            return;\n        }\n\n        const checkbox = row?.querySelector('input[type=\"checkbox\"]');\n\n        if (!checkbox) {\n            return;\n        }\n\n        checkbox.checked = !checkbox.checked;\n        this._checkboxChange(checkbox, index);\n    }\n\n    private _findRow(el: HTMLElement) {\n        if (!el) {\n            return el;\n        }\n\n        if (el?.tagName?.toLowerCase() === 'p-table-row') {\n            return el;\n        }\n\n        return this._findRow(el?.parentElement);\n    }\n\n    private _findRowAction(el: HTMLElement) {\n        if (!el) {\n            return null;\n        }\n\n        if (\n            el.getAttribute('data-is-action') !== null &&\n            el.getAttribute('data-is-action') !== 'false'\n        ) {\n            return el;\n        }\n\n        if (el?.tagName?.toLowerCase() === 'p-table-row') {\n            return null;\n        }\n\n        return this._findRowAction(el?.parentElement);\n    }\n}\n"],"version":3}
+{"file":"p-table.entry.js","mappings":"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","names":[],"sources":["./src/components/organisms/table/table.component.scss?tag=p-table","./src/components/organisms/table/table.component.tsx"],"sourcesContent":["p-table {\n    @apply flex flex-col;\n\n    .p-input[type='checkbox'] {\n        flex-shrink: 0;\n    }\n}\n","import {\n    Component,\n    Element,\n    Event,\n    EventEmitter,\n    h,\n    Host,\n    Listen,\n    Prop,\n    State,\n    Watch\n} from '@stencil/core';\nimport { IconVariant } from '../../../components';\nimport { QuickFilter, RowClickEvent } from '../../../types/table';\nimport { formatTranslation, getLocaleComponentStrings } from '../../../utils';\nimport { TableColumn } from '../../helpers/table-column/table-column.component';\nimport {\n    defaultSize,\n    defaultSizeOptions\n} from '../../molecules/page-size-select/constants';\nimport { buttonTemplateFunc } from '../../molecules/table-header/table-header.component';\n\nexport type templateFunc = () => string;\n\n@Component({\n    tag: 'p-table',\n    styleUrl: 'table.component.scss',\n})\nexport class Table {\n    /**\n     * The items to be fed to the table\n     */\n    @Prop() items: string;\n\n    /**\n     * Wether data is loading\n     */\n    @Prop() loading: boolean = false;\n\n    /**\n     * Wether the header should show loading state\n     */\n    @Prop() headerLoading: boolean = false;\n\n    /**\n     * Wether the footer should show loading state\n     */\n    @Prop() footerLoading: boolean = false;\n\n    /**\n     * The amount of loading rows to show\n     */\n    @Prop() amountOfLoadingRows: number = 6;\n\n    /**\n     * Wether to enable selection\n     */\n    @Prop() enableRowSelection: boolean = true;\n\n    /**\n     * Wether to enable row clicking\n     */\n    @Prop() enableRowClick: boolean = true;\n\n    /**\n     * The current selection of items\n     */\n    @Prop() selectedRows: any[] = [];\n\n    /**\n     * Event whenever the current selection changes\n     */\n    @Event({\n        bubbles: false\n    }) selectedRowsChange: EventEmitter<any>;\n\n    /**\n     * The key to determine if a row is selected\n     */\n    @Prop() selectionKey: string;\n\n    /**\n     * A key to determine if a row can be selected\n     */\n    @Prop() canSelectKey: string;\n\n    /**\n     * Event whenever a row is clicked\n     */\n    @Event({\n        bubbles: false\n    }) rowClick: EventEmitter<RowClickEvent>;\n\n    /**\n     * Event whenever a row is selected\n     */\n    @Event({\n        bubbles: false\n    }) rowSelected: EventEmitter<any>;\n\n    /**\n     * Event whenever a row is deselected\n     */\n    @Event({\n        bubbles: false\n    }) rowDeselected: EventEmitter<any>;\n\n    /**\n     * Event when the table has rendered\n     */\n    @Event({\n        bubbles: false\n    }) hasRendered: EventEmitter<number>;\n\n    /** START HEADER */\n\n    /**\n     * Wether to show the header\n     */\n    @Prop() enableHeader: boolean = true;\n\n    /**\n     * Quick filters to show\n     */\n    @Prop() quickFilters: QuickFilter[] = [];\n\n    /**\n     * Active quick filter identifier\n     */\n    @Prop() activeQuickFilterIdentifier: string;\n\n    /**\n     * Wether to show the search input\n     */\n    @Prop() enableSearch: boolean = true;\n\n    /**\n     * The query to show in the search bar\n     */\n    @Prop({ mutable: true }) query: string;\n\n    /**\n     * Wether to show the filter button\n     */\n    @Prop() enableFilter: boolean = true;\n\n    /**\n     * The amount of filters being selected\n     */\n    @Prop() selectedFiltersAmount: number;\n\n    /**\n     * The template for the filter button text\n     */\n    @Prop() filterButtonTemplate: templateFunc;\n\n    /**\n     * Wether to show the edit button\n     */\n    @Prop() enableEdit: boolean = true;\n\n    /**\n     * Wether the edit button is loading\n     */\n    @Prop() editButtonLoading: boolean = false;\n\n    /**\n     * The edit button icon\n     */\n    @Prop() editButtonIcon: IconVariant = 'pencil';\n\n    /**\n     * The edit button text if changed\n     */\n    @Prop() editButtonText: string;\n\n    /**\n     * The template for the edit button text\n     */\n    @Prop() editButtonTemplate: buttonTemplateFunc;\n\n    /**\n     * Event when one of the quick filters is clicked\n     */\n    @Event({\n        bubbles: false\n    }) quickFilter: EventEmitter<QuickFilter>;\n\n    /**\n     * Event when the query changes\n     */\n    @Event({\n        bubbles: false\n    }) queryChange: EventEmitter<string>;\n\n    /**\n     * Event when the filter button is clicked\n     */\n    @Event({\n        bubbles: false\n    }) filter: EventEmitter<null>;\n\n    /**\n     * Event when the edit button is clicked\n     */\n    @Event({\n        bubbles: false\n    }) edit: EventEmitter<null>;\n\n    /** START FOOTER */\n\n    /**\n     * Wether to show the header\n     */\n    @Prop() enableFooter: boolean = true;\n\n    /**\n     * Wether to enable page size select\n     */\n    @Prop() enablePageSize: boolean = true;\n\n    /**\n     * Wether to enable pagination\n     */\n    @Prop() enablePagination: boolean = true;\n\n    /**\n     * Wether to enable export\n     */\n    @Prop() enableExport: boolean = true;\n\n    /**\n     * The current page\n     */\n    @Prop({ mutable: true, reflect: true }) page: number = 1;\n\n    /**\n     * The total amount of items\n     */\n    @Prop() total!: number;\n\n    /**\n     * Event whenever the page changes\n     */\n    @Event({\n        bubbles: false\n    }) pageChange: EventEmitter<number>;\n\n    /**\n     * The amount of items per page\n     */\n    @Prop() pageSize: number = defaultSize;\n\n    /**\n     * The options for the page size\n     */\n    @Prop() pageSizeOptions: number[] = defaultSizeOptions;\n\n    /**\n     * Event whenever the page changes\n     */\n    @Event({\n        bubbles: false\n    }) pageSizeChange: EventEmitter<number>;\n\n    /**\n     * Event whenever the page changes\n     */\n    @Event({\n        bubbles: false\n    }) export: EventEmitter<number>;\n\n    /**\n     * Wether to hide when there is only 1 page available\n     */\n    @Prop() hideOnSinglePage: boolean = true;\n\n    /* Empty state start */\n    @Prop() emptyStateHeader: templateFunc = () =>\n        formatTranslation(this._locales.empty_state?.no_filter.header);\n    @Prop() emptyStateContent: templateFunc = () =>\n        formatTranslation(this._locales.empty_state?.no_filter.content);\n    @Prop() emptyStateAction: templateFunc = () =>\n        formatTranslation(this._locales.empty_state?.no_filter.action);\n    /**\n     * Wether to enable empty state action\n     */\n    @Prop() enableEmptyStateAction: boolean = true;\n\n    @Prop() emptyStateFilteredHeader: templateFunc = () =>\n        formatTranslation(this._locales.empty_state.filtered.header);\n    @Prop() emptyStateFilteredContent: templateFunc = () =>\n        formatTranslation(this._locales.empty_state.filtered.content);\n\n    /**\n     * Event whenever the empty state is clicked\n     */\n    @Event({\n        bubbles: false\n    }) emptyStateActionClick: EventEmitter<null>;\n\n    /* Empty state end */\n\n    /**\n     * The host element\n     */\n    @Element() private _el: HTMLElement;\n\n    /**\n     * Locales used for this component\n     */\n    @State() private _locales: any = {};\n\n    @State() private _columns: any[] = [];\n    @State() private _items: any[] = [];\n\n    private _ctrlDown = false;\n    private _hasCustomFilterSlot = false;\n\n    componentWillLoad() {\n        this._hasCustomFilterSlot = !!this._el.querySelector(\n            ':scope > [slot=\"custom-filter\"]'\n        );\n\n        this._setLocales();\n        this._parseItems(this.items);\n        this._generateColumns();\n    }\n\n    componentDidRender() {\n        this.hasRendered.emit();\n    }\n\n    render() {\n        return (\n            <Host class=\"p-table\">\n                <p-table-container>\n                    {this.enableHeader && (\n                        <p-table-header\n                            // quick filters\n                            quickFilters={this.quickFilters}\n                            activeQuickFilterIdentifier={\n                                this.activeQuickFilterIdentifier\n                            }\n                            onQuickFilter={({ detail }) =>\n                                this.quickFilter.emit(detail)\n                            }\n                            // search\n                            enableSearch={this.enableSearch}\n                            query={this.query}\n                            onQueryChange={({ detail }) =>\n                                this.queryChange.emit(detail)\n                            }\n                            // filter button\n                            enableFilter={this.enableFilter}\n                            selectedFiltersAmount={this.selectedFiltersAmount}\n                            filterButtonTemplate={this.filterButtonTemplate}\n                            onFilter={() => this.filter.emit()}\n                            // edit button\n                            enableEdit={this.enableEdit}\n                            editIcon={this.editButtonIcon}\n                            editText={this.editButtonText}\n                            editLoading={this.editButtonLoading}\n                            canEdit={!!this.selectedRows?.length}\n                            editButtonTemplate={this.editButtonTemplate}\n                            onEdit={() => this.edit.emit()}\n                            itemsSelectedAmount={this.selectedRows?.length}\n                            //loading\n                            loading={this.headerLoading}\n                        >\n                            {this._hasCustomFilterSlot && (\n                                <slot\n                                    name=\"custom-filter\"\n                                    slot=\"custom-filter\"\n                                />\n                            )}\n                        </p-table-header>\n                    )}\n\n                    {this._getHeader()}\n                    <div class=\"flex flex-col\">{this._getRows()}</div>\n\n                    {this.enableFooter && (\n                        <p-table-footer\n                            // overall\n                            hideOnSinglePage={this.hideOnSinglePage}\n                            // page size select\n                            enablePageSize={this.enablePageSize}\n                            pageSize={this.pageSize}\n                            pageSizeOptions={this.pageSizeOptions}\n                            onPageSizeChange={({ detail }) =>\n                                this.pageSizeChange.emit(detail)\n                            }\n                            // pagination\n                            enablePagination={this.enablePagination}\n                            page={this.page}\n                            total={this.total}\n                            onPageChange={({ detail }) =>\n                                this.pageChange.emit(detail)\n                            }\n                            // export\n                            enableExport={this.enableExport}\n                            onExport={() => this.export.emit()}\n                            //loading\n                            loading={this.footerLoading}\n                        ></p-table-footer>\n                    )}\n                </p-table-container>\n            </Host>\n        );\n    }\n\n    @Listen('localeChanged', { target: 'body' })\n    private async _setLocales(): Promise<void> {\n        this._locales = await getLocaleComponentStrings(this._el);\n    }\n\n    @Listen('tableDefinitionChanged', { target: 'body' })\n    onTableDefinitionUpdated() {\n        this._generateColumns();\n    }\n\n    @Listen('keydown', { target: 'document' })\n    keyDown({ key }) {\n        if (key !== 'Control' || this._ctrlDown === true) {\n            return;\n        }\n\n        this._ctrlDown = true;\n    }\n\n    @Listen('keyup', { target: 'document' })\n    keyUp({ key }) {\n        if (key !== 'Control' || this._ctrlDown === false) {\n            return;\n        }\n\n        this._ctrlDown = false;\n    }\n\n    @Listen('visibilitychange', { target: 'document' })\n    visibilityChange() {\n        if (document.visibilityState !== 'hidden' || this._ctrlDown === false) {\n            return;\n        }\n\n        this._ctrlDown = false;\n    }\n\n    @Watch('items')\n    private _parseItems(items: string) {\n        if (!items) {\n            this._items = [];\n            return;\n        }\n\n        if (Array.isArray(items)) {\n            this._items = items;\n            return;\n        }\n\n        this._items = JSON.parse(items);\n    }\n\n    private _generateColumns() {\n        const definitions = this._el.querySelectorAll('p-table-column');\n        const definitionsArray = Array.from(definitions);\n\n        definitionsArray[definitionsArray.length - 1]['isLast'] = true;\n\n        this._columns = definitionsArray;\n    }\n\n    private _getHeader() {\n        return (\n            <p-table-row variant=\"header\">\n                {this._columns.map((col: TableColumn, index) => (\n                    <p-table-cell\n                        definition={col}\n                        value={col.name}\n                        variant=\"header\"\n                        checkbox={\n                            index === 0 || col.hasCheckbox\n                                ? this._getCheckbox(null, 'loading')\n                                : null\n                        }\n                        index={index}\n                    ></p-table-cell>\n                ))}\n            </p-table-row>\n        );\n    }\n\n    private _getRows() {\n        if (this.loading) {\n            return Array.from(\n                {\n                    length: this.amountOfLoadingRows,\n                },\n                (_, i) => (\n                    <p-table-row\n                        enableHover={\n                            this.enableRowSelection || this.enableRowClick\n                        }\n                    >\n                        {this._getLoadingColumns(i)}\n                    </p-table-row>\n                )\n            );\n        }\n\n        if (!this._items.length) {\n            return this._getEmptyState();\n        }\n\n        return this._items.map((item, index) => (\n            <p-table-row\n                enableHover={this.enableRowSelection || this.enableRowClick}\n                onClick={(ev) => this._rowClick(ev, index)}\n            >\n                {this._getRowColumns(item, index)}\n            </p-table-row>\n        ));\n    }\n\n    private _getRowColumns(item, index) {\n        return this._columns.map((col: TableColumn, colIndex) => {\n            return (\n                <p-table-cell\n                    definition={col}\n                    item={item}\n                    checkbox={\n                        colIndex === 0 || col.hasCheckbox\n                            ? this._getCheckbox(index)\n                            : null\n                    }\n                    index={colIndex}\n                    rowIndex={index}\n                ></p-table-cell>\n            );\n        });\n    }\n\n    private _getLoadingColumns(index) {\n        return this._columns.map((col: TableColumn, colIndex) => {\n            return (\n                <p-table-cell\n                    definition={col}\n                    variant=\"loading\"\n                    checkbox={\n                        colIndex === 0 || col.hasCheckbox\n                            ? this._getCheckbox(index, 'loading')\n                            : null\n                    }\n                    index={colIndex}\n                    rowIndex={index}\n                ></p-table-cell>\n            );\n        });\n    }\n\n    private _getCheckbox(\n        rowIndex,\n        variant: 'header' | 'default' | 'loading' = 'default'\n    ) {\n        if (!this.enableRowSelection || !this.selectionKey) {\n            return;\n        }\n\n        if (variant === 'loading') {\n            return <p-loader variant=\"ghost\" class=\"h-6 w-6 rounded\" />;\n        }\n\n        if (variant === 'header') {\n            return (\n                <input\n                    class=\"p-input\"\n                    type=\"checkbox\"\n                    onChange={(ev) => this._selectAllChange(ev)}\n                    checked={this._selectionContainsAll()}\n                    indeterminate={this._selectionIndeterminate()}\n                />\n            );\n        }\n\n        const item = this._items[rowIndex];\n\n        return (\n            <input\n                class=\"p-input\"\n                type=\"checkbox\"\n                onChange={(ev) => this._checkboxChange(ev?.target, rowIndex)}\n                disabled={this.canSelectKey && !item[this.canSelectKey]}\n                checked={this._selectionContains(item, rowIndex)}\n            />\n        );\n    }\n\n    private _getEmptyState() {\n        if (this.query?.length || this.selectedFiltersAmount) {\n            return (\n                <div class=\"flex max-w-[20rem] flex-col items-center self-center py-24 text-center\">\n                    <p-illustration variant=\"empty-state-search\" class=\"mb-6\" />\n                    <p class=\"text-storm-default font-semibold\">\n                        {this.emptyStateFilteredHeader()}\n                    </p>\n                    <p class=\"mb-14 text-sm text-storm-medium\">\n                        {this.emptyStateFilteredContent()}\n                    </p>\n                </div>\n            );\n        }\n\n        return (\n            <div\n                class={`flex max-w-[20rem] flex-col items-center self-center py-24 text-center ${\n                    this.enableEmptyStateAction && 'cursor-pointer'\n                }`}\n                onClick={() =>\n                    this.enableEmptyStateAction &&\n                    this.emptyStateActionClick.emit(null)\n                }\n            >\n                <p-illustration variant=\"empty-state-add\" class=\"mb-6\" />\n                <p class=\"text-storm-default font-semibold\">\n                    {this.emptyStateHeader()}\n                </p>\n                <p class=\"mb-6 text-sm text-storm-medium\">\n                    {this.emptyStateContent()}\n                </p>\n                {this.enableEmptyStateAction && (\n                    <p-button variant=\"secondary\" icon=\"plus\" size=\"small\">\n                        {this.emptyStateAction()}\n                    </p-button>\n                )}\n            </div>\n        );\n    }\n\n    private _selectAllChange($event: any) {\n        if (!this.enableRowSelection) {\n            return;\n        }\n\n        const value = this._getCheckedValue($event.target);\n        if (value) {\n            const toAdd = [];\n            for (let i = 0; i < this._items.length; i++) {\n                const row = this._items[i];\n                if (this.canSelectKey && !row[this.canSelectKey]) {\n                    continue;\n                }\n\n                if (this._selectionContains(row, i)) {\n                    continue;\n                }\n\n                toAdd.push(row);\n                this.rowSelected.emit(row);\n            }\n\n            this.selectedRows = [...this.selectedRows, ...toAdd];\n            this.selectedRowsChange.emit(this.selectedRows);\n            return;\n        }\n\n        for (let i = 0; i < this.selectedRows.length; i++) {\n            const value = this.selectedRows[i];\n            const row = this._items.find(\n                (d) =>\n                    this._getSelectionValue(d, i) ===\n                    this._getSelectionValue(value, i)\n            );\n\n            if (!row) {\n                continue;\n            }\n\n            this.rowDeselected.emit(row);\n        }\n\n        this.selectedRows = [];\n        this.selectedRowsChange.emit(this.selectedRows);\n    }\n\n    private _checkboxChange(target: any, index: number) {\n        if (!this.enableRowSelection) {\n            return;\n        }\n\n        const row = this._items[index];\n\n        if (this.canSelectKey && !row[this.canSelectKey]) {\n            target.checked = false;\n            return;\n        }\n\n        const value = this._getCheckedValue(target);\n        if (value) {\n            this.selectedRows = [...this.selectedRows, row];\n            this.selectedRowsChange.emit(this.selectedRows);\n            this.rowSelected.emit(row);\n            return;\n        }\n\n        const indexOfToRemove = this._selectionContains(row, index, true);\n\n        // we need to do this, because splice does not trigger the selection setter.\n        const selection = [...this.selectedRows];\n        selection.splice(indexOfToRemove, 1);\n        this.selectedRows = selection;\n        this.selectedRowsChange.emit(this.selectedRows);\n        this.rowDeselected.emit(row);\n    }\n\n    private _getCheckedValue(target: any) {\n        return target?.checked;\n    }\n\n    private _getSelectionValue(row: any, index: number) {\n        return this.selectionKey ? row?.[this.selectionKey] || index : index;\n    }\n\n    private _selectionContains(row, index, returnIndex = false): any {\n        const returnValue = this.selectedRows.findIndex(\n            (item) =>\n                this._getSelectionValue(row, index) ===\n                this._getSelectionValue(item, index)\n        );\n        return !returnIndex ? returnValue >= 0 : returnValue;\n    }\n\n    private _selectionContainsAll() {\n        let returnValue = true;\n        if (!this._items?.length) {\n            return false;\n        }\n\n        for (let i = 0; i < this._items?.length; i++) {\n            const item = this._items[i];\n            const contains = this._selectionContains(item, i);\n\n            if (!contains) {\n                returnValue = false;\n                break;\n            }\n        }\n\n        return returnValue;\n    }\n\n    private _selectionIndeterminate() {\n        if (!this._items?.length || !this.selectedRows?.length) {\n            return false;\n        }\n\n        let containsCount = 0;\n        for (let i = 0; i < this._items?.length; i++) {\n            const item = this._items[i];\n            const contains = this._selectionContains(item, i);\n\n            if (contains) {\n                containsCount++;\n            }\n        }\n\n        return containsCount > 0 && containsCount !== this._items.length;\n    }\n\n    private _rowClick($event, index) {\n        const target = $event.target;\n\n        if (\n            target.tagName.toLowerCase() === 'input' ||\n            target.type === 'checkbox'\n        ) {\n            return;\n        }\n\n        const row = this._findRow($event.target);\n\n        if (this.enableRowClick) {\n            const action = this._findRowAction($event.target);\n\n            if (action) {\n                return;\n            }\n\n            const item = this._items[index];\n            this.rowClick.emit({\n                item,\n                ctrlDown: this._ctrlDown,\n            });\n            return;\n        }\n\n        if (!this.enableRowSelection) {\n            return;\n        }\n\n        const checkbox = row?.querySelector('input[type=\"checkbox\"]');\n\n        if (!checkbox) {\n            return;\n        }\n\n        checkbox.checked = !checkbox.checked;\n        this._checkboxChange(checkbox, index);\n    }\n\n    private _findRow(el: HTMLElement) {\n        if (!el) {\n            return el;\n        }\n\n        if (el?.tagName?.toLowerCase() === 'p-table-row') {\n            return el;\n        }\n\n        return this._findRow(el?.parentElement);\n    }\n\n    private _findRowAction(el: HTMLElement) {\n        if (!el) {\n            return null;\n        }\n\n        if (\n            el.getAttribute('data-is-action') !== null &&\n            el.getAttribute('data-is-action') !== 'false'\n        ) {\n            return el;\n        }\n\n        if (el?.tagName?.toLowerCase() === 'p-table-row') {\n            return null;\n        }\n\n        return this._findRowAction(el?.parentElement);\n    }\n}\n"],"version":3}

package/dist/esm/p-toast.entry.js

@@ -5,7 +5,7 @@ const toastComponentCss = ".flex{display:flex!important}.w-full{width:100%!impor
 const Toast = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
-    this.action = createEvent(this, "action", 7);
+    this.action = createEvent(this, "action", 3);
     this.variant = 'positive';
     this.header = undefined;
     this.content = undefined;

package/dist/esm/p-toast.entry.js.map

@@ -1 +1 @@
-{"file":"p-toast.entry.js","mappings":";;AAAA,MAAM,iBAAiB,GAAG,mkNAAmkN;;MCShlN,KAAK;;;;mBAI0C,UAAU;;;wBAelC,IAAI;sBAKF,UAAU;;;;EAiB5C,MAAM;;IACF,QACI,EAAC,IAAI,IACD,KAAK,EAAE,mBAAmB,IAAI,CAAC,OAAO,EAAE,EACxC,OAAO,EAAE,MAAM,IAAI,CAAC,QAAQ,EAAE,IAE9B,WAAK,KAAK,EAAC,8BAA8B,IACrC,SAAG,KAAK,EAAC,0BAA0B,IAC9B,CAAA,MAAA,IAAI,CAAC,MAAM,0CAAE,MAAM,KAChB,IAAI,CAAC,MAAM,KAEX,YAAM,IAAI,EAAC,QAAQ,GAAG,CACzB,CACD,EACJ,SAAG,KAAK,EAAC,kCAAkC,IACtC,CAAA,MAAA,IAAI,CAAC,OAAO,0CAAE,MAAM,KACjB,IAAI,CAAC,OAAO,KAEZ,YAAM,IAAI,EAAC,SAAS,GAAG,CAC1B,CACD,CACF,EAEL,IAAI,CAAC,YAAY,KACd,gBACI,OAAO,EAAC,WAAW,EACnB,QAAQ,QACR,IAAI,EAAC,OAAO,EACZ,IAAI,EAAE,IAAI,CAAC,UAAU,EACrB,QAAQ,EAAE,IAAI,CAAC,cAAc,EAC7B,UAAU,EAAE,IAAI,CAAC,gBAAgB,EACjC,KAAK,EAAC,eAAe,GACvB,CACL,CACE,EACT;GACL;EAEO,QAAQ;IACZ,IAAI,IAAI,CAAC,YAAY,EAAE;MACnB,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC;KACtB;GACJ;;;;;;","names":[],"sources":["./src/components/molecules/toast/toast.component.scss?tag=p-toast&encapsulation=shadow","./src/components/molecules/toast/toast.component.tsx"],"sourcesContent":[":host {\n    @apply flex justify-between items-center gap-2;\n    @apply w-full p-4 pl-5;\n    @apply bg-white rounded box-border;\n    @apply shadow-4 #{!important};\n    @apply border-l-4 border-solid #{!important};\n\n    p {\n        @apply m-0;\n        @apply overflow-hidden text-ellipsis whitespace-nowrap;\n    }\n}\n\n:host(.variant-positive) {\n    @apply border-l-positive  #{!important};\n}\n\n:host(.variant-unbiased) {\n    @apply border-l-unbiased  #{!important};\n}\n\n:host(.variant-negative) {\n    @apply border-l-negative  #{!important};\n}\n","import { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\nimport { RotateOptions } from '../../../types';\nimport { IconFlipOptions, IconVariant } from '../../atoms/icon/icon.component';\n\n@Component({\n    tag: 'p-toast',\n    styleUrl: 'toast.component.scss',\n    shadow: true,\n})\nexport class Toast {\n    /**\n     * The variant of the toast\n     */\n    @Prop() variant: 'positive' | 'unbiased' | 'negative' = 'positive';\n\n    /**\n     * The header of the toast\n     */\n    @Prop() header?: string;\n\n    /**\n     * The content of the toast\n     */\n    @Prop() content?: string;\n\n    /**\n     * Wether to enable the close button\n     */\n    @Prop() enableAction: boolean = true;\n\n    /**\n     * Icon to show on the button\n     */\n    @Prop() actionIcon: IconVariant = 'negative';\n\n    /**\n     * Icon flip\n     */\n    @Prop() actionIconFlip: IconFlipOptions;\n\n    /**\n     * Icon rotate\n     */\n    @Prop() actionIconRotate: RotateOptions;\n\n    /**\n     * Button click event\n     */\n    @Event() action: EventEmitter<MouseEvent>;\n\n    render() {\n        return (\n            <Host\n                class={`p-toast variant-${this.variant}`}\n                onClick={() => this._onClick()}\n            >\n                <div class=\"flex flex-col w-full min-w-0\">\n                    <p class=\"font-semibold text-storm\">\n                        {this.header?.length ? (\n                            this.header\n                        ) : (\n                            <slot name=\"header\" />\n                        )}\n                    </p>\n                    <p class=\"text-sm text-storm-medium w-full\">\n                        {this.content?.length ? (\n                            this.content\n                        ) : (\n                            <slot name=\"content\" />\n                        )}\n                    </p>\n                </div>\n\n                {this.enableAction && (\n                    <p-button\n                        variant=\"secondary\"\n                        iconOnly\n                        size=\"small\"\n                        icon={this.actionIcon}\n                        iconFlip={this.actionIconFlip}\n                        iconRotate={this.actionIconRotate}\n                        class=\"flex-shrink-0\"\n                    />\n                )}\n            </Host>\n        );\n    }\n\n    private _onClick() {\n        if (this.enableAction) {\n            this.action.emit();\n        }\n    }\n}\n"],"version":3}
+{"file":"p-toast.entry.js","mappings":";;AAAA,MAAM,iBAAiB,GAAG,mkNAAmkN;;MCShlN,KAAK;;;;mBAI0C,UAAU;;;wBAelC,IAAI;sBAKF,UAAU;;;;EAmB5C,MAAM;;IACF,QACI,EAAC,IAAI,IACD,KAAK,EAAE,mBAAmB,IAAI,CAAC,OAAO,EAAE,EACxC,OAAO,EAAE,MAAM,IAAI,CAAC,QAAQ,EAAE,IAE9B,WAAK,KAAK,EAAC,8BAA8B,IACrC,SAAG,KAAK,EAAC,0BAA0B,IAC9B,CAAA,MAAA,IAAI,CAAC,MAAM,0CAAE,MAAM,KAChB,IAAI,CAAC,MAAM,KAEX,YAAM,IAAI,EAAC,QAAQ,GAAG,CACzB,CACD,EACJ,SAAG,KAAK,EAAC,kCAAkC,IACtC,CAAA,MAAA,IAAI,CAAC,OAAO,0CAAE,MAAM,KACjB,IAAI,CAAC,OAAO,KAEZ,YAAM,IAAI,EAAC,SAAS,GAAG,CAC1B,CACD,CACF,EAEL,IAAI,CAAC,YAAY,KACd,gBACI,OAAO,EAAC,WAAW,EACnB,QAAQ,QACR,IAAI,EAAC,OAAO,EACZ,IAAI,EAAE,IAAI,CAAC,UAAU,EACrB,QAAQ,EAAE,IAAI,CAAC,cAAc,EAC7B,UAAU,EAAE,IAAI,CAAC,gBAAgB,EACjC,KAAK,EAAC,eAAe,GACvB,CACL,CACE,EACT;GACL;EAEO,QAAQ;IACZ,IAAI,IAAI,CAAC,YAAY,EAAE;MACnB,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC;KACtB;GACJ;;;;;;","names":[],"sources":["./src/components/molecules/toast/toast.component.scss?tag=p-toast&encapsulation=shadow","./src/components/molecules/toast/toast.component.tsx"],"sourcesContent":[":host {\n    @apply flex justify-between items-center gap-2;\n    @apply w-full p-4 pl-5;\n    @apply bg-white rounded box-border;\n    @apply shadow-4 #{!important};\n    @apply border-l-4 border-solid #{!important};\n\n    p {\n        @apply m-0;\n        @apply overflow-hidden text-ellipsis whitespace-nowrap;\n    }\n}\n\n:host(.variant-positive) {\n    @apply border-l-positive  #{!important};\n}\n\n:host(.variant-unbiased) {\n    @apply border-l-unbiased  #{!important};\n}\n\n:host(.variant-negative) {\n    @apply border-l-negative  #{!important};\n}\n","import { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\nimport { RotateOptions } from '../../../types';\nimport { IconFlipOptions, IconVariant } from '../../atoms/icon/icon.component';\n\n@Component({\n    tag: 'p-toast',\n    styleUrl: 'toast.component.scss',\n    shadow: true,\n})\nexport class Toast {\n    /**\n     * The variant of the toast\n     */\n    @Prop() variant: 'positive' | 'unbiased' | 'negative' = 'positive';\n\n    /**\n     * The header of the toast\n     */\n    @Prop() header?: string;\n\n    /**\n     * The content of the toast\n     */\n    @Prop() content?: string;\n\n    /**\n     * Wether to enable the close button\n     */\n    @Prop() enableAction: boolean = true;\n\n    /**\n     * Icon to show on the button\n     */\n    @Prop() actionIcon: IconVariant = 'negative';\n\n    /**\n     * Icon flip\n     */\n    @Prop() actionIconFlip: IconFlipOptions;\n\n    /**\n     * Icon rotate\n     */\n    @Prop() actionIconRotate: RotateOptions;\n\n    /**\n     * Button click event\n     */\n    @Event({\n        bubbles: false\n    }) action: EventEmitter<MouseEvent>;\n\n    render() {\n        return (\n            <Host\n                class={`p-toast variant-${this.variant}`}\n                onClick={() => this._onClick()}\n            >\n                <div class=\"flex flex-col w-full min-w-0\">\n                    <p class=\"font-semibold text-storm\">\n                        {this.header?.length ? (\n                            this.header\n                        ) : (\n                            <slot name=\"header\" />\n                        )}\n                    </p>\n                    <p class=\"text-sm text-storm-medium w-full\">\n                        {this.content?.length ? (\n                            this.content\n                        ) : (\n                            <slot name=\"content\" />\n                        )}\n                    </p>\n                </div>\n\n                {this.enableAction && (\n                    <p-button\n                        variant=\"secondary\"\n                        iconOnly\n                        size=\"small\"\n                        icon={this.actionIcon}\n                        iconFlip={this.actionIconFlip}\n                        iconRotate={this.actionIconRotate}\n                        class=\"flex-shrink-0\"\n                    />\n                )}\n            </Host>\n        );\n    }\n\n    private _onClick() {\n        if (this.enableAction) {\n            this.action.emit();\n        }\n    }\n}\n"],"version":3}