@paperless/core 0.1.0-alpha.450 → 0.1.0-alpha.451

package/dist/components/p-attachment.js

@@ -5,7 +5,7 @@ import { d as defineCustomElement$4 } from './input-error.component.js';
 import { d as defineCustomElement$3 } from './loader.component.js';
 import { d as defineCustomElement$2 } from './tooltip.component.js';
 
-const attachmentComponentCss = ".visible{visibility:visible!important}.static{position:static!important}.absolute{position:absolute!important}.block{display:block!important}.inline{display:inline!important}.flex{display:flex!important}.h-8{height:2rem!important}.w-full{width:100%!important}.min-w-0{min-width:0!important}.flex-1{flex:1 1 0%!important}.-rotate-0{--tw-rotate:-0deg!important}.-rotate-0,.-rotate-135{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-135{--tw-rotate:-135deg!important}.-rotate-180{--tw-rotate:-180deg!important}.-rotate-180,.-rotate-225{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-225{--tw-rotate:-225deg!important}.-rotate-25{--tw-rotate:-25deg!important}.-rotate-25,.-rotate-270{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-270{--tw-rotate:-270deg!important}.-rotate-315{--tw-rotate:-315deg!important}.-rotate-315,.-rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-45{--tw-rotate:-45deg!important}.-rotate-90{--tw-rotate:-90deg!important}.-rotate-90,.rotate-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-0{--tw-rotate:0deg!important}.rotate-135{--tw-rotate:135deg!important}.rotate-135,.rotate-180{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-180{--tw-rotate:180deg!important}.rotate-225{--tw-rotate:225deg!important}.rotate-225,.rotate-25{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-25{--tw-rotate:25deg!important}.rotate-270{--tw-rotate:270deg!important}.rotate-270,.rotate-315{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-315{--tw-rotate:315deg!important}.rotate-45{--tw-rotate:45deg!important}.rotate-45,.rotate-90{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-90{--tw-rotate:90deg!important}.scale-x-flip{--tw-scale-x:-1!important}.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.scale-y-flip{--tw-scale-y:-1!important}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.items-start{align-items:flex-start!important}.items-center{align-items:center!important}.justify-start{justify-content:flex-start!important}.justify-center{justify-content:center!important}.gap-2{gap:.5rem!important}.gap-4{gap:1rem!important}.overflow-hidden{overflow:hidden!important}.text-ellipsis{text-overflow:ellipsis!important}.whitespace-nowrap{white-space:nowrap!important}.rounded-large{border-radius:.375rem!important}.bg-mystic{--tw-bg-opacity:1!important;background-color:rgb(247 250 252/var(--tw-bg-opacity))!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.text-2xl{font-size:1.5rem!important;line-height:2rem!important}.text-3xl{font-size:1.875rem!important;line-height:2.25rem!important}.text-4xl{font-size:2.25rem!important;line-height:2.5rem!important}.text-5xl{font-size:3rem!important}.text-5xl,.text-6xl{line-height:1!important}.text-6xl{font-size:3.75rem!important}.text-base{font-size:1rem!important;line-height:1.5rem!important}.text-lg{font-size:1.125rem!important;line-height:1.75rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-xl{font-size:1.25rem!important;line-height:1.75rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.text-xxs{font-size:.6875rem!important}.text-negative{color:rgb(185 30 40/var(--tw-text-opacity))!important}.text-negative,.text-negative-light{--tw-text-opacity:1!important}.text-negative-light{color:rgb(255 204 211/var(--tw-text-opacity))!important}.text-storm-medium{--tw-text-opacity:1!important;color:rgb(128 130 158/var(--tw-text-opacity))!important}.blur{--tw-blur:blur(8px)!important;filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}*{box-sizing:border-box}:host{display:block;width:100%}.-rotate-0,.-rotate-135,.-rotate-180,.-rotate-225,.-rotate-25,.-rotate-270,.-rotate-315,.-rotate-45,.-rotate-90,.rotate-0,.rotate-135,.rotate-180,.rotate-225,.rotate-25,.rotate-270,.rotate-315,.rotate-45,.rotate-90,.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.hover\\:text-negative:hover{--tw-text-opacity:1!important;color:rgb(185 30 40/var(--tw-text-opacity))!important}";
+const attachmentComponentCss = ".block{display:block!important}*{box-sizing:border-box}:host{display:block;width:100%}.static{position:static!important}.flex{display:flex!important}.h-8{height:2rem!important}.min-w-0{min-width:0!important}.flex-1{flex:1 1 0%!important}.items-start{align-items:flex-start!important}.items-center{align-items:center!important}.justify-start{justify-content:flex-start!important}.gap-2{gap:.5rem!important}.gap-4{gap:1rem!important}.overflow-hidden{overflow:hidden!important}.text-ellipsis{text-overflow:ellipsis!important}.whitespace-nowrap{white-space:nowrap!important}.rounded-large{border-radius:.375rem!important}.bg-mystic{--tw-bg-opacity:1!important;background-color:rgb(247 250 252/var(--tw-bg-opacity))!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.text-negative{--tw-text-opacity:1!important;color:rgb(185 30 40/var(--tw-text-opacity))!important}.text-storm-medium{--tw-text-opacity:1!important;color:rgb(128 130 158/var(--tw-text-opacity))!important}.visible{visibility:visible!important}.absolute{position:absolute!important}.blur{--tw-blur:blur(8px)!important;filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}.-rotate-0{--tw-rotate:-0deg!important}.-rotate-0,.-rotate-135{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-135{--tw-rotate:-135deg!important}.-rotate-180{--tw-rotate:-180deg!important}.-rotate-180,.-rotate-225{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-225{--tw-rotate:-225deg!important}.-rotate-25{--tw-rotate:-25deg!important}.-rotate-25,.-rotate-270{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-270{--tw-rotate:-270deg!important}.-rotate-315{--tw-rotate:-315deg!important}.-rotate-315,.-rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-45{--tw-rotate:-45deg!important}.-rotate-90{--tw-rotate:-90deg!important}.-rotate-90,.rotate-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-0{--tw-rotate:0deg!important}.rotate-135{--tw-rotate:135deg!important}.rotate-135,.rotate-180{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-180{--tw-rotate:180deg!important}.rotate-225{--tw-rotate:225deg!important}.rotate-225,.rotate-25{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-25{--tw-rotate:25deg!important}.rotate-270{--tw-rotate:270deg!important}.rotate-270,.rotate-315{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-315{--tw-rotate:315deg!important}.rotate-45{--tw-rotate:45deg!important}.rotate-45,.rotate-90{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-90{--tw-rotate:90deg!important}.scale-x-flip{--tw-scale-x:-1!important}.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.scale-y-flip{--tw-scale-y:-1!important}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.text-2xl{font-size:1.5rem!important;line-height:2rem!important}.text-3xl{font-size:1.875rem!important;line-height:2.25rem!important}.text-4xl{font-size:2.25rem!important;line-height:2.5rem!important}.text-5xl{font-size:3rem!important}.text-5xl,.text-6xl{line-height:1!important}.text-6xl{font-size:3.75rem!important}.text-base{font-size:1rem!important;line-height:1.5rem!important}.text-lg{font-size:1.125rem!important;line-height:1.75rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-xl{font-size:1.25rem!important;line-height:1.75rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.text-xxs{font-size:.6875rem!important}.text-negative-light{--tw-text-opacity:1!important;color:rgb(255 204 211/var(--tw-text-opacity))!important}.hover\\:text-negative:hover{--tw-text-opacity:1!important;color:rgb(185 30 40/var(--tw-text-opacity))!important}.inline{display:inline!important}.w-full{width:100%!important}.justify-center{justify-content:center!important}";
 
 const Attachment = /*@__PURE__*/ proxyCustomElement(class Attachment extends HTMLElement {
   constructor() {

package/dist/components/p-attachment.js.map

@@ -1 +1 @@
-{"file":"p-attachment.js","mappings":";;;;;;;AAAA,MAAM,sBAAsB,GAAG,24LAA24L;;MCO75L,UAAU;;;;;;;gBAIc,MAAM;mBAKrB,KAAK;;uBAeD,KAAK;;EAO3B,MAAM;;IACF,IAAI,MAAM,GAAG,cAAQ,OAAO,EAAC,YAAY,GAAG,CAAC;IAE7C,IAAI,IAAI,CAAC,OAAO,EAAE;MACd,MAAM,GAAG,mBAAY,CAAC;KACzB;IAED,IAAI,IAAI,CAAC,KAAK,EAAE;MACZ,MAAM,GAAG,cAAQ,OAAO,EAAC,SAAS,EAAC,KAAK,EAAC,eAAe,GAAG,CAAC;KAC/D;IAED,QACI,EAAC,IAAI,IAAC,KAAK,EAAC,qCAAqC,IAC7C,WACI,KAAK,EAAE,yFACH,CAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,MAAM;UACZ,eAAe;UACf,mBACV,EAAE,IAED,MAAM,EAEP,YAAM,KAAK,EAAC,gEAAgE,IACxE,eAAQ,CACL,EAEN,CAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,MAAM,KAAI,qBAAe,KAAK,EAAE,IAAI,CAAC,KAAK,GAAI,CACzD,EAEN,gBACI,OAAO,EAAC,WAAW,EACnB,QAAQ,EAAE,IAAI,EACd,IAAI,EAAE,IAAI,CAAC,IAAI,KAAK,MAAM,GAAG,UAAU,GAAG,OAAO,EACjD,QAAQ,EAAE,IAAI,CAAC,OAAO,EACtB,OAAO,EAAE,IAAI,CAAC,IAAI,KAAK,MAAM,IAAI,IAAI,CAAC,WAAW,EACjD,IAAI,EAAC,OAAO,EACZ,SAAS,EAAE,MACP,CAAC,IAAI,CAAC,IAAI,KAAK,MAAM;UACf,IAAI,CAAC,QAAQ;UACb,IAAI,CAAC,MAAM,EACf,IAAI,EAAE,GAEd,CACC,EACT;GACL;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/molecules/attachment/attachment.component.scss?tag=p-attachment&encapsulation=shadow","./src/components/molecules/attachment/attachment.component.tsx"],"sourcesContent":[":host {\n    @apply block w-full;\n}\n","import { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\n\n@Component({\n    tag: 'p-attachment',\n    styleUrl: 'attachment.component.scss',\n    shadow: true,\n})\nexport class Attachment {\n    /**\n     * The variant of the button\n     */\n    @Prop() mode: 'read' | 'write' = 'read';\n\n    /**\n     * Wether the attachment is uploading/loading\n     */\n    @Prop() loading = false;\n\n    /**\n     * The error to show\n     */\n    @Prop() error: string;\n\n    /**\n     * Event when download is pressed\n     */\n    @Event() download: EventEmitter<any>;\n\n    /**\n     * Wether the attachment is downloading\n     */\n    @Prop() downloading = false;\n\n    /**\n     * Event when delete is pressed\n     */\n    @Event() delete: EventEmitter<any>;\n\n    render() {\n        let prefix = <p-icon variant=\"attachment\" />;\n\n        if (this.loading) {\n            prefix = <p-loader />;\n        }\n\n        if (this.error) {\n            prefix = <p-icon variant=\"warning\" class=\"text-negative\" />;\n        }\n\n        return (\n            <Host class=\"p-attachment flex items-start gap-4\">\n                <div\n                    class={`flex h-8 min-w-0 flex-1 items-center justify-start gap-2 rounded-large bg-mystic px-2 ${\n                        this.error?.length\n                            ? 'text-negative'\n                            : 'text-storm-medium'\n                    }`}\n                >\n                    {prefix}\n\n                    <span class=\"min-w-0 flex-1 overflow-hidden text-ellipsis whitespace-nowrap\">\n                        <slot />\n                    </span>\n\n                    {this.error?.length && <p-input-error error={this.error} />}\n                </div>\n\n                <p-button\n                    variant=\"secondary\"\n                    iconOnly={true}\n                    icon={this.mode === 'read' ? 'download' : 'trash'}\n                    disabled={this.loading}\n                    loading={this.mode === 'read' && this.downloading}\n                    size=\"small\"\n                    onOnClick={() =>\n                        (this.mode === 'read'\n                            ? this.download\n                            : this.delete\n                        ).emit()\n                    }\n                />\n            </Host>\n        );\n    }\n}\n"],"version":3}
+{"file":"p-attachment.js","mappings":";;;;;;;AAAA,MAAM,sBAAsB,GAAG,08KAA08K;;MCO59K,UAAU;;;;;;;gBAIc,MAAM;mBAKrB,KAAK;;uBAeD,KAAK;;EAO3B,MAAM;;IACF,IAAI,MAAM,GAAG,cAAQ,OAAO,EAAC,YAAY,GAAG,CAAC;IAE7C,IAAI,IAAI,CAAC,OAAO,EAAE;MACd,MAAM,GAAG,mBAAY,CAAC;KACzB;IAED,IAAI,IAAI,CAAC,KAAK,EAAE;MACZ,MAAM,GAAG,cAAQ,OAAO,EAAC,SAAS,EAAC,KAAK,EAAC,eAAe,GAAG,CAAC;KAC/D;IAED,QACI,EAAC,IAAI,IAAC,KAAK,EAAC,qCAAqC,IAC7C,WACI,KAAK,EAAE,yFACH,CAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,MAAM;UACZ,eAAe;UACf,mBACV,EAAE,IAED,MAAM,EAEP,YAAM,KAAK,EAAC,gEAAgE,IACxE,eAAQ,CACL,EAEN,CAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,MAAM,KAAI,qBAAe,KAAK,EAAE,IAAI,CAAC,KAAK,GAAI,CACzD,EAEN,gBACI,OAAO,EAAC,WAAW,EACnB,QAAQ,EAAE,IAAI,EACd,IAAI,EAAE,IAAI,CAAC,IAAI,KAAK,MAAM,GAAG,UAAU,GAAG,OAAO,EACjD,QAAQ,EAAE,IAAI,CAAC,OAAO,EACtB,OAAO,EAAE,IAAI,CAAC,IAAI,KAAK,MAAM,IAAI,IAAI,CAAC,WAAW,EACjD,IAAI,EAAC,OAAO,EACZ,SAAS,EAAE,MACP,CAAC,IAAI,CAAC,IAAI,KAAK,MAAM;UACf,IAAI,CAAC,QAAQ;UACb,IAAI,CAAC,MAAM,EACf,IAAI,EAAE,GAEd,CACC,EACT;GACL;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/molecules/attachment/attachment.component.scss?tag=p-attachment&encapsulation=shadow","./src/components/molecules/attachment/attachment.component.tsx"],"sourcesContent":[":host {\n    @apply block w-full;\n}\n","import { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\n\n@Component({\n    tag: 'p-attachment',\n    styleUrl: 'attachment.component.scss',\n    shadow: true,\n})\nexport class Attachment {\n    /**\n     * The variant of the button\n     */\n    @Prop() mode: 'read' | 'write' = 'read';\n\n    /**\n     * Wether the attachment is uploading/loading\n     */\n    @Prop() loading = false;\n\n    /**\n     * The error to show\n     */\n    @Prop() error: string;\n\n    /**\n     * Event when download is pressed\n     */\n    @Event() download: EventEmitter<any>;\n\n    /**\n     * Wether the attachment is downloading\n     */\n    @Prop() downloading = false;\n\n    /**\n     * Event when delete is pressed\n     */\n    @Event() delete: EventEmitter<any>;\n\n    render() {\n        let prefix = <p-icon variant=\"attachment\" />;\n\n        if (this.loading) {\n            prefix = <p-loader />;\n        }\n\n        if (this.error) {\n            prefix = <p-icon variant=\"warning\" class=\"text-negative\" />;\n        }\n\n        return (\n            <Host class=\"p-attachment flex items-start gap-4\">\n                <div\n                    class={`flex h-8 min-w-0 flex-1 items-center justify-start gap-2 rounded-large bg-mystic px-2 ${\n                        this.error?.length\n                            ? 'text-negative'\n                            : 'text-storm-medium'\n                    }`}\n                >\n                    {prefix}\n\n                    <span class=\"min-w-0 flex-1 overflow-hidden text-ellipsis whitespace-nowrap\">\n                        <slot />\n                    </span>\n\n                    {this.error?.length && <p-input-error error={this.error} />}\n                </div>\n\n                <p-button\n                    variant=\"secondary\"\n                    iconOnly={true}\n                    icon={this.mode === 'read' ? 'download' : 'trash'}\n                    disabled={this.loading}\n                    loading={this.mode === 'read' && this.downloading}\n                    size=\"small\"\n                    onOnClick={() =>\n                        (this.mode === 'read'\n                            ? this.download\n                            : this.delete\n                        ).emit()\n                    }\n                />\n            </Host>\n        );\n    }\n}\n"],"version":3}

package/dist/components/p-avatar-group.js

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 
-const avatarGroupComponentCss = ".static{position:static!important}.flex{display:flex!important}.hidden{display:none!important}.-space-x-1>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0!important;margin-left:calc(-.25rem*(1 - var(--tw-space-x-reverse)))!important;margin-right:calc(-.25rem*var(--tw-space-x-reverse))!important}.overflow-hidden{overflow:hidden!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-storm-vague{--tw-text-opacity:1!important;color:rgb(152 154 183/var(--tw-text-opacity))!important}.ring-2{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)!important;--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color)!important;box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)!important}*{box-sizing:border-box}p-avatar-group{align-items:center;display:flex;overflow:hidden}p-avatar-group>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-left:calc(-.25rem*(1 - var(--tw-space-x-reverse)));margin-right:calc(-.25rem*var(--tw-space-x-reverse))}p-avatar-group p-avatar>img{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-opacity:1;--tw-ring-color:rgb(255 255 255/var(--tw-ring-opacity));box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}p-avatar-group p-avatar:first-child{z-index:3}p-avatar-group p-avatar:nth-child(2){z-index:2}p-avatar-group p-avatar:nth-child(3){z-index:1}p-avatar-group .extra{--tw-text-opacity:1;color:rgb(152 154 183/var(--tw-text-opacity));font-size:.875rem;line-height:1.25rem;padding-left:1rem}";
+const avatarGroupComponentCss = ".flex{display:flex!important}.-space-x-1>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0!important;margin-left:calc(-.25rem*(1 - var(--tw-space-x-reverse)))!important;margin-right:calc(-.25rem*var(--tw-space-x-reverse))!important}.overflow-hidden{overflow:hidden!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-storm-vague{--tw-text-opacity:1!important;color:rgb(152 154 183/var(--tw-text-opacity))!important}.ring-2{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)!important;--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color)!important;box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)!important}*{box-sizing:border-box}p-avatar-group{align-items:center;display:flex;overflow:hidden}p-avatar-group>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-left:calc(-.25rem*(1 - var(--tw-space-x-reverse)));margin-right:calc(-.25rem*var(--tw-space-x-reverse))}p-avatar-group p-avatar>img{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-opacity:1;--tw-ring-color:rgb(255 255 255/var(--tw-ring-opacity));box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}p-avatar-group p-avatar:first-child{z-index:3}p-avatar-group p-avatar:nth-child(2){z-index:2}p-avatar-group p-avatar:nth-child(3){z-index:1}p-avatar-group .extra{--tw-text-opacity:1;color:rgb(152 154 183/var(--tw-text-opacity));font-size:.875rem;line-height:1.25rem;padding-left:1rem}.static{position:static!important}";
 
 const AvatarGroup = /*@__PURE__*/ proxyCustomElement(class AvatarGroup extends HTMLElement {
   constructor() {

package/dist/components/p-avatar-group.js.map

@@ -1 +1 @@
-{"file":"p-avatar-group.js","mappings":";;AAAA,MAAM,uBAAuB,GAAG,kxDAAkxD;;MCOryD,WAAW;;;;;;EAMpB,MAAM;IACF,QACI,EAAC,IAAI,IAAC,KAAK,EAAC,gBAAgB,IACxB,eAAQ,EAEP,IAAI,CAAC,KAAK,IAAI,YAAM,KAAK,EAAC,OAAO,SAAG,IAAI,CAAC,KAAK,CAAQ,CACpD,EACT;GACL;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/atoms/avatar-group/avatar-group.component.scss?tag=p-avatar-group","./src/components/atoms/avatar-group/avatar-group.component.tsx"],"sourcesContent":["p-avatar-group {\n    @apply flex -space-x-1 overflow-hidden items-center;\n\n    p-avatar > img {\n        @apply ring-2 ring-white;\n    }\n\n    p-avatar:nth-child(1) {\n        z-index: 3;\n    }\n\n    p-avatar:nth-child(2) {\n        z-index: 2;\n    }\n\n    p-avatar:nth-child(3) {\n        z-index: 1;\n    }\n\n    .extra {\n        @apply text-sm text-storm-vague pl-4;\n    }\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n    tag: 'p-avatar-group',\n    styleUrl: 'avatar-group.component.scss',\n    // shadow: true,\n})\nexport class AvatarGroup {\n    /**\n     * The amount to show after the avatars\n     */\n    @Prop() extra: number;\n\n    render() {\n        return (\n            <Host class=\"p-avatar-group\">\n                <slot />\n\n                {this.extra && <span class=\"extra\">+{this.extra}</span>}\n            </Host>\n        );\n    }\n}\n"],"version":3}
+{"file":"p-avatar-group.js","mappings":";;AAAA,MAAM,uBAAuB,GAAG,mvDAAmvD;;MCOtwD,WAAW;;;;;;EAMpB,MAAM;IACF,QACI,EAAC,IAAI,IAAC,KAAK,EAAC,gBAAgB,IACxB,eAAQ,EAEP,IAAI,CAAC,KAAK,IAAI,YAAM,KAAK,EAAC,OAAO,SAAG,IAAI,CAAC,KAAK,CAAQ,CACpD,EACT;GACL;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/atoms/avatar-group/avatar-group.component.scss?tag=p-avatar-group","./src/components/atoms/avatar-group/avatar-group.component.tsx"],"sourcesContent":["p-avatar-group {\n    @apply flex -space-x-1 overflow-hidden items-center;\n\n    p-avatar > img {\n        @apply ring-2 ring-white;\n    }\n\n    p-avatar:nth-child(1) {\n        z-index: 3;\n    }\n\n    p-avatar:nth-child(2) {\n        z-index: 2;\n    }\n\n    p-avatar:nth-child(3) {\n        z-index: 1;\n    }\n\n    .extra {\n        @apply text-sm text-storm-vague pl-4;\n    }\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n    tag: 'p-avatar-group',\n    styleUrl: 'avatar-group.component.scss',\n    // shadow: true,\n})\nexport class AvatarGroup {\n    /**\n     * The amount to show after the avatars\n     */\n    @Prop() extra: number;\n\n    render() {\n        return (\n            <Host class=\"p-avatar-group\">\n                <slot />\n\n                {this.extra && <span class=\"extra\">+{this.extra}</span>}\n            </Host>\n        );\n    }\n}\n"],"version":3}

package/dist/components/p-avatar.js

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 
-const avatarComponentCss = ".static{position:static!important}.inline-block{display:inline-block!important}.w-16{width:4rem!important}.w-8{width:2rem!important}.rounded{border-radius:.25rem!important}.object-cover{-o-object-fit:cover!important;object-fit:cover!important}*{box-sizing:border-box}.h-\\[3\\.125rem\\]{height:3.125rem!important}.h-\\[6\\.5rem\\]{height:6.5rem!important}.w-\\[3\\.125rem\\]{width:3.125rem!important}.w-\\[6\\.5rem\\]{width:6.5rem!important}p-avatar{display:inline-block;flex-shrink:0}p-avatar>img{-o-object-fit:cover;object-fit:cover;-o-object-position:center;object-position:center}p-avatar[size=small]>img{height:2rem;width:2rem}p-avatar[size=medium]>img{height:3.125rem;width:3.125rem}p-avatar[size=large]>img{height:4rem;width:4rem}p-avatar[size=xlarge]>img{height:6.5rem;width:6.5rem}p-avatar[variant=company]>img{border-radius:.25rem}p-avatar[variant=company][size=large]>img,p-avatar[variant=company][size=medium]>img{border-radius:.375rem}p-avatar[variant=user]>img{border-radius:100%}";
+const avatarComponentCss = ".inline-block{display:inline-block!important}.h-\\[3\\.125rem\\]{height:3.125rem!important}.h-\\[6\\.5rem\\]{height:6.5rem!important}.w-16{width:4rem!important}.w-8{width:2rem!important}.w-\\[3\\.125rem\\]{width:3.125rem!important}.w-\\[6\\.5rem\\]{width:6.5rem!important}.rounded{border-radius:.25rem!important}.object-cover{-o-object-fit:cover!important;object-fit:cover!important}*{box-sizing:border-box}p-avatar{display:inline-block;flex-shrink:0}p-avatar>img{-o-object-fit:cover;object-fit:cover;-o-object-position:center;object-position:center}p-avatar[size=small]>img{height:2rem;width:2rem}p-avatar[size=medium]>img{height:3.125rem;width:3.125rem}p-avatar[size=large]>img{height:4rem;width:4rem}p-avatar[size=xlarge]>img{height:6.5rem;width:6.5rem}p-avatar[variant=company]>img{border-radius:.25rem}p-avatar[variant=company][size=large]>img,p-avatar[variant=company][size=medium]>img{border-radius:.375rem}p-avatar[variant=user]>img{border-radius:100%}.static{position:static!important}";
 
 const Avatar = /*@__PURE__*/ proxyCustomElement(class Avatar extends HTMLElement {
   constructor() {

package/dist/components/p-card-body.js

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 
-const cardBodyComponentCss = ".static{position:static!important}.px-4{padding-left:1rem!important;padding-right:1rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}*{box-sizing:border-box}p-card-body{--tw-text-opacity:1;color:rgb(152 154 183/var(--tw-text-opacity));font-size:.875rem;line-height:1.25rem;padding:1.5rem 1rem}p-card-body[inherit-text]{color:inherit!important;font-size:inherit!important;font-weight:inherit!important}";
+const cardBodyComponentCss = ".px-4{padding-left:1rem!important;padding-right:1rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}*{box-sizing:border-box}p-card-body{--tw-text-opacity:1;color:rgb(152 154 183/var(--tw-text-opacity));font-size:.875rem;line-height:1.25rem;padding:1.5rem 1rem}p-card-body[inherit-text]{color:inherit!important;font-size:inherit!important;font-weight:inherit!important}.static{position:static!important}";
 
 const CardBody = /*@__PURE__*/ proxyCustomElement(class CardBody extends HTMLElement {
   constructor() {

package/dist/components/p-card-container.js

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 
-const cardContainerComponentCss = ".static{position:static!important}.flex{display:flex!important}.flex-col{flex-direction:column!important}.bg-white{--tw-bg-opacity:1!important;background-color:rgb(255 255 255/var(--tw-bg-opacity))!important}.drop-shadow-4{--tw-drop-shadow:drop-shadow(0px 0.3125rem 1rem rgba(0,24,98,.08)) drop-shadow(0px 0.0625rem 0.1875rem rgba(0,24,98,.13))!important}.drop-shadow-4,.drop-shadow-5{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}.drop-shadow-5{--tw-drop-shadow:drop-shadow(0px 0.1875rem 1rem rgba(0,24,98,.3))!important}.drop-shadow-transparent{--tw-drop-shadow:drop-shadow(transparent)!important}.drop-shadow-transparent,.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}*{box-sizing:border-box}.drop-shadow-4,.drop-shadow-5,.drop-shadow-transparent,.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}:host{--tw-bg-opacity:1;--tw-drop-shadow:drop-shadow(0px 0.3125rem 1rem rgba(0,24,98,.08)) drop-shadow(0px 0.0625rem 0.1875rem rgba(0,24,98,.13))!important;background-color:rgb(255 255 255/var(--tw-bg-opacity));border-radius:.375rem;display:flex;filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important;flex-direction:column;width:100%}:host([hoverable]){cursor:pointer}:host([hoverable]:hover){--tw-drop-shadow:drop-shadow(0px 0.1875rem 1rem rgba(0,24,98,.3))!important;filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}:host([shadow=false]){--tw-drop-shadow:drop-shadow(transparent)!important;filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}";
+const cardContainerComponentCss = ".flex{display:flex!important}.flex-col{flex-direction:column!important}.bg-white{--tw-bg-opacity:1!important;background-color:rgb(255 255 255/var(--tw-bg-opacity))!important}.drop-shadow-4{--tw-drop-shadow:drop-shadow(0px 0.3125rem 1rem rgba(0,24,98,.08)) drop-shadow(0px 0.0625rem 0.1875rem rgba(0,24,98,.13))!important}.drop-shadow-4,.drop-shadow-5{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}.drop-shadow-5{--tw-drop-shadow:drop-shadow(0px 0.1875rem 1rem rgba(0,24,98,.3))!important}.drop-shadow-transparent{--tw-drop-shadow:drop-shadow(transparent)!important}.drop-shadow-transparent,.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}*{box-sizing:border-box}:host{--tw-bg-opacity:1;--tw-drop-shadow:drop-shadow(0px 0.3125rem 1rem rgba(0,24,98,.08)) drop-shadow(0px 0.0625rem 0.1875rem rgba(0,24,98,.13))!important;background-color:rgb(255 255 255/var(--tw-bg-opacity));border-radius:.375rem;display:flex;filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important;flex-direction:column;width:100%}:host([hoverable]){cursor:pointer}:host([hoverable]:hover){--tw-drop-shadow:drop-shadow(0px 0.1875rem 1rem rgba(0,24,98,.3))!important;filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}:host([shadow=false]){--tw-drop-shadow:drop-shadow(transparent)!important;filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}.static{position:static!important}";
 
 const CardContainer = /*@__PURE__*/ proxyCustomElement(class CardContainer extends HTMLElement {
   constructor() {

package/dist/components/p-card-container.js.map

@@ -1 +1 @@
-{"file":"p-card-container.js","mappings":";;AAAA,MAAM,yBAAyB,GAAG,6uEAA6uE;;MCOlwE,aAAa;;;;;qBAIwB,KAAK;kBAKR,IAAI;;EAE/C,MAAM;IACF,QACI,EAAC,IAAI,IAAC,KAAK,EAAC,kBAAkB,IAC1B,eAAQ,CACL,EACT;GACL;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/atoms/card-container/card-container.component.scss?tag=p-card-container&encapsulation=shadow","./src/components/atoms/card-container/card-container.component.tsx"],"sourcesContent":[":host {\n    @apply flex flex-col w-full;\n    @apply bg-white rounded-large;\n    @apply filter drop-shadow-4 #{!important};\n}\n\n:host([hoverable]) {\n    @apply cursor-pointer;\n}\n\n:host([hoverable]:hover) {\n    @apply drop-shadow-5 #{!important};\n}\n\n:host([shadow='false']) {\n    @apply drop-shadow-transparent #{!important};\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n    tag: 'p-card-container',\n    styleUrl: 'card-container.component.scss',\n    shadow: true,\n})\nexport class CardContainer {\n    /**\n     * Wether the card should be hoverable\n     */\n    @Prop({ reflect: true }) hoverable: boolean = false;\n\n    /**\n     * Wether the card should have shadow\n     */\n    @Prop({ reflect: true }) shadow: boolean = true;\n\n    render() {\n        return (\n            <Host class=\"p-card-container\">\n                <slot />\n            </Host>\n        );\n    }\n}\n"],"version":3}
+{"file":"p-card-container.js","mappings":";;AAAA,MAAM,yBAAyB,GAAG,m/DAAm/D;;MCOxgE,aAAa;;;;;qBAIwB,KAAK;kBAKR,IAAI;;EAE/C,MAAM;IACF,QACI,EAAC,IAAI,IAAC,KAAK,EAAC,kBAAkB,IAC1B,eAAQ,CACL,EACT;GACL;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/atoms/card-container/card-container.component.scss?tag=p-card-container&encapsulation=shadow","./src/components/atoms/card-container/card-container.component.tsx"],"sourcesContent":[":host {\n    @apply flex flex-col w-full;\n    @apply bg-white rounded-large;\n    @apply filter drop-shadow-4 #{!important};\n}\n\n:host([hoverable]) {\n    @apply cursor-pointer;\n}\n\n:host([hoverable]:hover) {\n    @apply drop-shadow-5 #{!important};\n}\n\n:host([shadow='false']) {\n    @apply drop-shadow-transparent #{!important};\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n    tag: 'p-card-container',\n    styleUrl: 'card-container.component.scss',\n    shadow: true,\n})\nexport class CardContainer {\n    /**\n     * Wether the card should be hoverable\n     */\n    @Prop({ reflect: true }) hoverable: boolean = false;\n\n    /**\n     * Wether the card should have shadow\n     */\n    @Prop({ reflect: true }) shadow: boolean = true;\n\n    render() {\n        return (\n            <Host class=\"p-card-container\">\n                <slot />\n            </Host>\n        );\n    }\n}\n"],"version":3}

package/dist/components/p-card-header.js

@@ -1,7 +1,7 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 import { d as defineCustomElement$2 } from './icon.component.js';
 
-const cardHeaderComponentCss = ".static{position:static!important}.mx-4{margin-left:1rem!important;margin-right:1rem!important}.ml-2{margin-left:.5rem!important}.flex{display:flex!important}.-rotate-0{--tw-rotate:-0deg!important}.-rotate-0,.-rotate-135{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-135{--tw-rotate:-135deg!important}.-rotate-180{--tw-rotate:-180deg!important}.-rotate-180,.-rotate-225{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-225{--tw-rotate:-225deg!important}.-rotate-25{--tw-rotate:-25deg!important}.-rotate-25,.-rotate-270{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-270{--tw-rotate:-270deg!important}.-rotate-315{--tw-rotate:-315deg!important}.-rotate-315,.-rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-45{--tw-rotate:-45deg!important}.-rotate-90{--tw-rotate:-90deg!important}.-rotate-90,.rotate-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-0{--tw-rotate:0deg!important}.rotate-135{--tw-rotate:135deg!important}.rotate-135,.rotate-180{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-180{--tw-rotate:180deg!important}.rotate-225{--tw-rotate:225deg!important}.rotate-225,.rotate-25{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-25{--tw-rotate:25deg!important}.rotate-270{--tw-rotate:270deg!important}.rotate-270,.rotate-315{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-315{--tw-rotate:315deg!important}.rotate-45{--tw-rotate:45deg!important}.rotate-45,.rotate-90{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-90{--tw-rotate:90deg!important}.scale-x-flip{--tw-scale-x:-1!important}.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.scale-y-flip{--tw-scale-y:-1!important}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.items-center{align-items:center!important}.gap-3{gap:.75rem!important}.border-b{border-bottom-width:1px!important}.border-b-mystic-medium{--tw-border-opacity:1!important;border-bottom-color:rgb(227 236 243/var(--tw-border-opacity))!important}.text-2xl{font-size:1.5rem!important;line-height:2rem!important}.text-3xl{font-size:1.875rem!important;line-height:2.25rem!important}.text-4xl{font-size:2.25rem!important;line-height:2.5rem!important}.text-5xl{font-size:3rem!important}.text-5xl,.text-6xl{line-height:1!important}.text-6xl{font-size:3.75rem!important}.text-base{font-size:1rem!important;line-height:1.5rem!important}.text-lg{font-size:1.125rem!important;line-height:1.75rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-xl{font-size:1.25rem!important;line-height:1.75rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.text-xxs{font-size:.6875rem!important}*{box-sizing:border-box}p-card-header{--tw-text-opacity:1;--tw-border-opacity:1!important;align-items:center;border-bottom-color:rgb(227 236 243/var(--tw-border-opacity))!important;border-bottom-width:1px!important;color:rgb(128 130 158/var(--tw-text-opacity));display:flex;gap:.75rem;height:3.5rem;margin-left:1rem;margin-right:1rem}p-card-header .title{--tw-text-opacity:1;align-items:center;color:rgb(81 83 107/var(--tw-text-opacity));display:flex;font-weight:600;order:2}p-card-header .title>p-icon{--tw-text-opacity:1;color:rgb(218 230 240/var(--tw-text-opacity));margin-left:.5rem}p-card-header [slot=prefix]{order:1}p-card-header [slot=suffix]{order:3}p-card-container.has-hover:hover p-card-header .title>p-icon{--tw-text-opacity:1;color:rgb(82 138 250/var(--tw-text-opacity))}.-rotate-0,.-rotate-135,.-rotate-180,.-rotate-225,.-rotate-25,.-rotate-270,.-rotate-315,.-rotate-45,.-rotate-90,.rotate-0,.rotate-135,.rotate-180,.rotate-225,.rotate-25,.rotate-270,.rotate-315,.rotate-45,.rotate-90,.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}";
+const cardHeaderComponentCss = ".mx-4{margin-left:1rem!important;margin-right:1rem!important}.ml-2{margin-left:.5rem!important}.flex{display:flex!important}.items-center{align-items:center!important}.gap-3{gap:.75rem!important}.border-b{border-bottom-width:1px!important}.border-b-mystic-medium{--tw-border-opacity:1!important;border-bottom-color:rgb(227 236 243/var(--tw-border-opacity))!important}*{box-sizing:border-box}p-card-header{--tw-text-opacity:1;--tw-border-opacity:1!important;align-items:center;border-bottom-color:rgb(227 236 243/var(--tw-border-opacity))!important;border-bottom-width:1px!important;color:rgb(128 130 158/var(--tw-text-opacity));display:flex;gap:.75rem;height:3.5rem;margin-left:1rem;margin-right:1rem}p-card-header .title{--tw-text-opacity:1;align-items:center;color:rgb(81 83 107/var(--tw-text-opacity));display:flex;font-weight:600;order:2}p-card-header .title>p-icon{--tw-text-opacity:1;color:rgb(218 230 240/var(--tw-text-opacity));margin-left:.5rem}p-card-header [slot=prefix]{order:1}p-card-header [slot=suffix]{order:3}p-card-container.has-hover:hover p-card-header .title>p-icon{--tw-text-opacity:1;color:rgb(82 138 250/var(--tw-text-opacity))}.static{position:static!important}.-rotate-0{--tw-rotate:-0deg!important}.-rotate-0,.-rotate-135{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-135{--tw-rotate:-135deg!important}.-rotate-180{--tw-rotate:-180deg!important}.-rotate-180,.-rotate-225{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-225{--tw-rotate:-225deg!important}.-rotate-25{--tw-rotate:-25deg!important}.-rotate-25,.-rotate-270{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-270{--tw-rotate:-270deg!important}.-rotate-315{--tw-rotate:-315deg!important}.-rotate-315,.-rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-45{--tw-rotate:-45deg!important}.-rotate-90{--tw-rotate:-90deg!important}.-rotate-90,.rotate-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-0{--tw-rotate:0deg!important}.rotate-135{--tw-rotate:135deg!important}.rotate-135,.rotate-180{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-180{--tw-rotate:180deg!important}.rotate-225{--tw-rotate:225deg!important}.rotate-225,.rotate-25{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-25{--tw-rotate:25deg!important}.rotate-270{--tw-rotate:270deg!important}.rotate-270,.rotate-315{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-315{--tw-rotate:315deg!important}.rotate-45{--tw-rotate:45deg!important}.rotate-45,.rotate-90{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-90{--tw-rotate:90deg!important}.scale-x-flip{--tw-scale-x:-1!important}.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.scale-y-flip{--tw-scale-y:-1!important}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.text-2xl{font-size:1.5rem!important;line-height:2rem!important}.text-3xl{font-size:1.875rem!important;line-height:2.25rem!important}.text-4xl{font-size:2.25rem!important;line-height:2.5rem!important}.text-5xl{font-size:3rem!important}.text-5xl,.text-6xl{line-height:1!important}.text-6xl{font-size:3.75rem!important}.text-base{font-size:1rem!important;line-height:1.5rem!important}.text-lg{font-size:1.125rem!important;line-height:1.75rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-xl{font-size:1.25rem!important;line-height:1.75rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.text-xxs{font-size:.6875rem!important}";
 
 const CardHeader = /*@__PURE__*/ proxyCustomElement(class CardHeader extends HTMLElement {
   constructor() {

package/dist/components/p-card-header.js.map

@@ -1 +1 @@
-{"file":"p-card-header.js","mappings":";;;AAAA,MAAM,sBAAsB,GAAG,m9KAAm9K;;MCMr+K,UAAU;;;;;iBASM,KAAK;;EAE9B,MAAM;;IACF,QACI,EAAC,IAAI,IAAC,KAAK,EAAC,eAAe,IACvB,YAAM,IAAI,EAAC,QAAQ,GAAG,EAErB,CAAC,CAAA,MAAA,IAAI,CAAC,MAAM,0CAAE,MAAM,KAAI,IAAI,CAAC,KAAK,MAC/B,WAAK,KAAK,EAAC,OAAO,IACb,MAAA,IAAI,CAAC,MAAM,mCAAI,EAAE,EACjB,IAAI,CAAC,KAAK,IAAI,cAAQ,OAAO,EAAC,OAAO,GAAG,CACvC,CACT,EAED,YAAM,IAAI,EAAC,QAAQ,GAAG,CACnB,EACT;GACL;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/atoms/card-header/card-header.component.scss?tag=p-card-header","./src/components/atoms/card-header/card-header.component.tsx"],"sourcesContent":["p-card-header {\n    @apply mx-4 h-14;\n    @apply flex gap-3 items-center;\n    @apply text-storm-medium;\n    @apply border-b border-b-mystic-medium #{!important};\n\n    .title {\n        @apply order-2;\n        @apply flex items-center text-storm;\n        @apply font-semibold;\n\n        > p-icon {\n            @apply ml-2 text-mystic-dark;\n        }\n    }\n\n    [slot='prefix'] {\n        @apply order-1;\n    }\n\n    [slot='suffix'] {\n        @apply order-3;\n    }\n}\n\np-card-container.has-hover:hover {\n    p-card-header {\n        .title > p-icon {\n            @apply text-indigo;\n        }\n    }\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n    tag: 'p-card-header',\n    styleUrl: 'card-header.component.scss',\n})\nexport class CardHeader {\n    /**\n     * Content of the card header\n     */\n    @Prop() header: string;\n\n    /**\n     * Enable the title arrow\n     */\n    @Prop() arrow: boolean = false;\n\n    render() {\n        return (\n            <Host class=\"p-card-header\">\n                <slot name=\"prefix\" />\n\n                {(this.header?.length || this.arrow) && (\n                    <div class=\"title\">\n                        {this.header ?? ''}\n                        {this.arrow && <p-icon variant=\"arrow\" />}\n                    </div>\n                )}\n\n                <slot name=\"suffix\" />\n            </Host>\n        );\n    }\n}\n"],"version":3}
+{"file":"p-card-header.js","mappings":";;;AAAA,MAAM,sBAAsB,GAAG,whKAAwhK;;MCM1iK,UAAU;;;;;iBASM,KAAK;;EAE9B,MAAM;;IACF,QACI,EAAC,IAAI,IAAC,KAAK,EAAC,eAAe,IACvB,YAAM,IAAI,EAAC,QAAQ,GAAG,EAErB,CAAC,CAAA,MAAA,IAAI,CAAC,MAAM,0CAAE,MAAM,KAAI,IAAI,CAAC,KAAK,MAC/B,WAAK,KAAK,EAAC,OAAO,IACb,MAAA,IAAI,CAAC,MAAM,mCAAI,EAAE,EACjB,IAAI,CAAC,KAAK,IAAI,cAAQ,OAAO,EAAC,OAAO,GAAG,CACvC,CACT,EAED,YAAM,IAAI,EAAC,QAAQ,GAAG,CACnB,EACT;GACL;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/atoms/card-header/card-header.component.scss?tag=p-card-header","./src/components/atoms/card-header/card-header.component.tsx"],"sourcesContent":["p-card-header {\n    @apply mx-4 h-14;\n    @apply flex gap-3 items-center;\n    @apply text-storm-medium;\n    @apply border-b border-b-mystic-medium #{!important};\n\n    .title {\n        @apply order-2;\n        @apply flex items-center text-storm;\n        @apply font-semibold;\n\n        > p-icon {\n            @apply ml-2 text-mystic-dark;\n        }\n    }\n\n    [slot='prefix'] {\n        @apply order-1;\n    }\n\n    [slot='suffix'] {\n        @apply order-3;\n    }\n}\n\np-card-container.has-hover:hover {\n    p-card-header {\n        .title > p-icon {\n            @apply text-indigo;\n        }\n    }\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n    tag: 'p-card-header',\n    styleUrl: 'card-header.component.scss',\n})\nexport class CardHeader {\n    /**\n     * Content of the card header\n     */\n    @Prop() header: string;\n\n    /**\n     * Enable the title arrow\n     */\n    @Prop() arrow: boolean = false;\n\n    render() {\n        return (\n            <Host class=\"p-card-header\">\n                <slot name=\"prefix\" />\n\n                {(this.header?.length || this.arrow) && (\n                    <div class=\"title\">\n                        {this.header ?? ''}\n                        {this.arrow && <p-icon variant=\"arrow\" />}\n                    </div>\n                )}\n\n                <slot name=\"suffix\" />\n            </Host>\n        );\n    }\n}\n"],"version":3}

package/dist/components/p-content-slider.js

@@ -1,7 +1,7 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 import { d as defineCustomElement$2 } from './slider-indicator.component.js';
 
-const contentSliderComponentCss = ".visible{visibility:visible!important}.static{position:static!important}.absolute{position:absolute!important}.relative{position:relative!important}.mt-3{margin-top:.75rem!important}.flex{display:flex!important}.hidden{display:none!important}.w-0{width:0!important}.w-full{width:100%!important}.flex-shrink-0{flex-shrink:0!important}.transform-gpu{transform:translate3d(var(--tw-translate-x),var(--tw-translate-y),0) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.cursor-grab{cursor:grab!important}.cursor-grabbing{cursor:grabbing!important}.cursor-pointer{cursor:pointer!important}.resize{resize:both!important}.flex-col{flex-direction:column!important}.flex-nowrap{flex-wrap:nowrap!important}.items-center{align-items:center!important}.items-stretch{align-items:stretch!important}.justify-center{justify-content:center!important}.overflow-visible{overflow:visible!important}.p-16{padding:4rem!important}.pt-1{padding-top:.25rem!important}.will-change-transform{will-change:transform!important}*{box-sizing:border-box}:host{display:flex;flex-direction:column;margin:-4rem;overflow:hidden;padding:4rem}:host .slider{box-sizing:content-box;overflow:visible;position:relative}:host .slider.draggable{cursor:grab}@media (min-width:64rem){:host .slider.draggable{cursor:auto}}:host .slider.draggable.dragging{cursor:grabbing}@media (min-width:64rem){:host .slider.draggable.dragging{cursor:auto}}:host .slider.draggable.dragging .inner-slider{transition-property:none}:host .slider .inner-slider{--tw-translate-x:0px;align-items:stretch;display:flex;flex-wrap:nowrap;gap:.5rem;position:absolute;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transform:translate3d(var(--tw-translate-x),var(--tw-translate-y),0) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transition-duration:.5s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:100%;will-change:transform}@media (min-width:64rem){:host .slider .inner-slider{flex-wrap:wrap;gap:1rem}}:host .slider .inner-slider>::slotted(*){flex-shrink:0;position:relative;width:100%;z-index:10}@media (min-width:40rem){:host .slider .inner-slider>::slotted(*){width:calc(50% - .5rem)}}@media (min-width:64rem){:host .slider .inner-slider>::slotted(*){flex:1 1 0%;width:0}}:host .indicator{align-items:center;display:flex;justify-content:center}@media (min-width:64rem){:host .indicator{display:none}}:host .indicator .item{margin-top:.75rem;padding-left:.25rem;padding-right:.25rem;padding-top:.25rem}@media (min-width:64rem){.desktop-xs\\:hidden{display:none!important}.desktop-xs\\:gap-4{gap:1rem!important}}";
+const contentSliderComponentCss = ".absolute{position:absolute!important}.relative{position:relative!important}.mt-3{margin-top:.75rem!important}.flex{display:flex!important}.w-0{width:0!important}.w-full{width:100%!important}.flex-shrink-0{flex-shrink:0!important}.transform-gpu{transform:translate3d(var(--tw-translate-x),var(--tw-translate-y),0) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.cursor-grab{cursor:grab!important}.cursor-grabbing{cursor:grabbing!important}.flex-col{flex-direction:column!important}.flex-nowrap{flex-wrap:nowrap!important}.items-center{align-items:center!important}.items-stretch{align-items:stretch!important}.justify-center{justify-content:center!important}.overflow-visible{overflow:visible!important}.p-16{padding:4rem!important}.pt-1{padding-top:.25rem!important}.will-change-transform{will-change:transform!important}*{box-sizing:border-box}:host{display:flex;flex-direction:column;margin:-4rem;overflow:hidden;padding:4rem}:host .slider{box-sizing:content-box;overflow:visible;position:relative}:host .slider.draggable{cursor:grab}@media (min-width:64rem){:host .slider.draggable{cursor:auto}}:host .slider.draggable.dragging{cursor:grabbing}@media (min-width:64rem){:host .slider.draggable.dragging{cursor:auto}}:host .slider.draggable.dragging .inner-slider{transition-property:none}:host .slider .inner-slider{--tw-translate-x:0px;align-items:stretch;display:flex;flex-wrap:nowrap;gap:.5rem;position:absolute;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transform:translate3d(var(--tw-translate-x),var(--tw-translate-y),0) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transition-duration:.15s;transition-duration:.5s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:100%;will-change:transform}@media (min-width:64rem){:host .slider .inner-slider{flex-wrap:wrap;gap:1rem}}:host .slider .inner-slider>::slotted(*){flex-shrink:0;position:relative;width:100%;z-index:10}@media (min-width:40rem){:host .slider .inner-slider>::slotted(*){width:calc(50% - .5rem)}}@media (min-width:64rem){:host .slider .inner-slider>::slotted(*){flex:1 1 0%;width:0}}:host .indicator{align-items:center;display:flex;justify-content:center}@media (min-width:64rem){:host .indicator{display:none}}:host .indicator .item{margin-top:.75rem;padding-left:.25rem;padding-right:.25rem;padding-top:.25rem}@media (min-width:64rem){.desktop-xs\\:hidden{display:none!important}.desktop-xs\\:gap-4{gap:1rem!important}}.visible{visibility:visible!important}.static{position:static!important}.hidden{display:none!important}.cursor-pointer{cursor:pointer!important}.resize{resize:both!important}";
 
 const ContentSlider = /*@__PURE__*/ proxyCustomElement(class ContentSlider extends HTMLElement {
   constructor() {

package/dist/components/p-content-slider.js.map

@@ -1 +1 @@
-{"file":"p-content-slider.js","mappings":"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","names":[],"sources":["./src/components/molecules/content-slider/content-slider.component.scss?tag=p-content-slider&encapsulation=shadow","./src/components/molecules/content-slider/content-slider.component.tsx"],"sourcesContent":[":host {\n    @apply flex flex-col overflow-hidden;\n\n    @apply p-16 -m-16;\n\n    .slider {\n        @apply overflow-visible relative box-content;\n\n        &.draggable {\n            @apply cursor-grab desktop-xs:cursor-auto;\n\n            &.dragging {\n                @apply cursor-grabbing desktop-xs:cursor-auto;\n\n                .inner-slider {\n                    @apply transition-none;\n                }\n            }\n        }\n\n        .inner-slider {\n            @apply absolute flex flex-nowrap items-stretch w-full gap-2;\n\n            @apply will-change-transform transform-gpu translate-x-0;\n\n            @apply desktop-xs:gap-4 desktop-xs:flex-wrap;\n\n            @apply transition-all;\n            transition-duration: 0.5s;\n\n            > ::slotted(*) {\n                @apply w-full;\n                @apply flex-shrink-0 z-10;\n\n                @screen tablet {\n                    width: calc(50% - 0.5rem);\n                }\n\n                @screen desktop-xs {\n                    @apply w-0 flex-1;\n                }\n\n                position: relative;\n            }\n        }\n    }\n\n    .indicator {\n        @apply flex justify-center items-center desktop-xs:hidden;\n\n        .item {\n            @apply mt-3 pt-1 px-1;\n        }\n    }\n}\n","import {\n    Component,\n    Element,\n    h,\n    Host,\n    Listen,\n    Prop,\n    State,\n} from '@stencil/core';\n\n@Component({\n    tag: 'p-content-slider',\n    styleUrl: 'content-slider.component.scss',\n    shadow: true,\n})\nexport class ContentSlider {\n    /**\n     * Wether to hide the indicator on mobile\n     */\n    @Prop() hideMobileIndicator: boolean = false;\n\n    /**\n     * Wether to disable dragging the content\n     */\n    @Prop() disableDrag: boolean = false;\n\n    /**\n     * Wether to disable auto centering the content\n     */\n    @Prop() disableAutoCenter: boolean = false;\n\n    /**\n     * Wether to disable clicking the indicator scrolls content\n     */\n    @Prop() disableIndicatorClick: boolean = false;\n\n    /**\n     * The host element\n     */\n    @Element() private _el: HTMLElement;\n\n    @State() private _visibleIndex: number;\n    @State() private _outerHeight = 0;\n    @State() private _totalWidth = 0;\n    private _sliderRef: HTMLElement;\n    private _innerSliderRef: HTMLElement;\n    private _items: HTMLElement[] = [];\n    private _innerSliderResizeObserver: ResizeObserver;\n\n    // mouse movement stuff\n    private _startX: number;\n    private _startMouseX: number;\n    private _lastMouseX: number;\n    private _lastIndex: number;\n    private _shouldCheckLocation = false;\n    @State() private _dragging = false;\n\n    componentWillRender() {\n        const items = this._el.querySelectorAll(':scope > *');\n        this._items = Array.from(items) as HTMLElement[];\n    }\n\n    componentDidLoad() {\n        this._innerSliderRef.style.setProperty('--tw-translate-x', `0px`);\n        this._calculateWidth();\n        this._calculateIndicator();\n    }\n\n    disconnectedCallback() {\n        if (this._innerSliderResizeObserver) {\n            this._innerSliderResizeObserver.disconnect();\n        }\n    }\n\n    render() {\n        return (\n            <Host class=\"p-content-slider\">\n                <div\n                    class={`slider ${!this.disableDrag && 'draggable'} ${\n                        this._dragging && 'dragging'\n                    }`}\n                    style={{\n                        height: `${this._outerHeight}px`,\n                    }}\n                    ref={(el) => (this._sliderRef = el)}\n                    onMouseDown={(e) => this._mouseDownHandler(e)}\n                    onTouchStart={(e) => this._mouseDownHandler(e)}\n                    onMouseMove={(e) => this._mouseMoveHandler(e)}\n                    onTouchMove={(e) => this._mouseMoveHandler(e)}\n                >\n                    <div\n                        class=\"inner-slider\"\n                        ref={(ref) => this._setInnerSliderReft(ref)}\n                        onTransitionEnd={() => this._transitionEndHandler()}\n                    >\n                        <slot />\n                    </div>\n                </div>\n                <div\n                    class={`indicator ${this.hideMobileIndicator && 'hidden'}`}\n                >\n                    {this._items.map((_, i) => (\n                        <div\n                            onClick={() => this._scrollTo(i, true)}\n                            class={`item ${\n                                !this.disableIndicatorClick && 'cursor-pointer'\n                            }`}\n                        >\n                            <p-slider-indicator\n                                active={i === this._visibleIndex}\n                            />\n                        </div>\n                    ))}\n                </div>\n            </Host>\n        );\n    }\n\n    private _mouseDownHandler(e) {\n        if (this.disableDrag || this._dragging) {\n            return;\n        }\n\n        const innerSliderStyle = getComputedStyle(this._innerSliderRef);\n        if (innerSliderStyle.flexWrap === 'wrap') {\n            return;\n        }\n\n        this._startMouseX = e.x;\n        const sliderRect = this._sliderRef.getBoundingClientRect();\n        if (e.type === 'touchstart') {\n            this._startMouseX = e.touches?.[0].clientX;\n        }\n\n        const innerSliderRect = this._innerSliderRef.getBoundingClientRect();\n        const offsetLeft = innerSliderRect.x - sliderRect.x;\n\n        this._startX = this._startMouseX - sliderRect.x - offsetLeft;\n        this._lastIndex = this._visibleIndex;\n        this._dragging = true;\n    }\n\n    private _mouseMoveHandler(e) {\n        if (!e || !this._dragging || this.disableDrag) {\n            return;\n        }\n\n        e.preventDefault();\n\n        this._shouldCheckLocation = true;\n\n        if (\n            this._innerSliderRef.style.getPropertyValue('pointer-events') === ''\n        ) {\n            this._innerSliderRef.style.pointerEvents = 'none';\n        }\n\n        const sliderRect = this._sliderRef.getBoundingClientRect();\n        let x = e.clientX - sliderRect.left;\n        this._lastMouseX = e.x;\n        if (e.type === 'touchmove') {\n            x = e.touches?.[0].clientX - sliderRect.left;\n            this._lastMouseX = e.touches?.[0].clientX;\n        }\n\n        this._innerSliderRef.style.setProperty(\n            '--tw-translate-x',\n            `${x - this._startX}px`\n        );\n\n        this._checkBoundary();\n        this._calculateIndicator();\n    }\n\n    private _transitionEndHandler() {\n        this._calculateIndicator();\n    }\n\n    @Listen('mouseup', { target: 'window' })\n    @Listen('touchend', { target: 'window' })\n    mouseUpHandler() {\n        this._dragging = false;\n        this._innerSliderRef.style.removeProperty('pointer-events');\n\n        this._checkLocation();\n    }\n\n    @Listen('resize', { target: 'window' })\n    resizeHandler() {\n        if (this._innerSliderRef) {\n            this._innerSliderRef.style.setProperty('--tw-translate-x', '0px');\n            this._calculateWidth();\n            this._calculateIndicator();\n        }\n    }\n\n    private _setInnerSliderReft(ref) {\n        this._innerSliderRef = ref;\n        this._innerSliderResizeObserver = new ResizeObserver(() =>\n            this._calculateHeight()\n        );\n        this._innerSliderResizeObserver.observe(this._innerSliderRef);\n    }\n\n    private _scrollTo(i: number, manual = false) {\n        if (this.disableIndicatorClick && manual) {\n            return;\n        }\n\n        const el = this._items[i];\n\n        if (i === 0) {\n            this._innerSliderRef.style.setProperty('--tw-translate-x', `0px`);\n            return;\n        }\n\n        const sliderRect = this._sliderRef.getBoundingClientRect();\n        const innerSliderRect = this._innerSliderRef.getBoundingClientRect();\n        const elRect = el.getBoundingClientRect();\n\n        const offsetLeft = elRect.x - innerSliderRect.x;\n\n        const centerOffset =\n            offsetLeft + elRect.width / 2 - sliderRect.width / 2;\n\n        this._innerSliderRef.style.setProperty(\n            '--tw-translate-x',\n            `-${centerOffset}px`\n        );\n\n        this._checkBoundary();\n        this._calculateIndicator();\n    }\n\n    private _checkBoundary() {\n        let outer = this._sliderRef.getBoundingClientRect();\n\n        const left = parseInt(\n            this._innerSliderRef.style.getPropertyValue('--tw-translate-x')\n        );\n        if (left > 0) {\n            this._innerSliderRef.style.setProperty('--tw-translate-x', `0px`);\n        }\n\n        const maxLeft = (this._totalWidth - outer.width) * -1;\n        if (left < maxLeft) {\n            this._innerSliderRef.style.setProperty(\n                '--tw-translate-x',\n                `${maxLeft}px`\n            );\n        }\n    }\n\n    private _calculateIndicator() {\n        for (let i = 0; i < this._items.length; i++) {\n            const item = this._items[i];\n            const visible = this._isVisible(item);\n\n            if (visible) {\n                this._visibleIndex = i;\n            }\n\n            if (i === 0 && visible) {\n                break;\n            }\n        }\n    }\n\n    private _checkLocation() {\n        if (!this._shouldCheckLocation) {\n            return;\n        }\n\n        let scrollToIndex = null;\n        if (this._lastIndex !== this._visibleIndex) {\n            scrollToIndex = this._visibleIndex;\n        }\n\n        if (this._lastIndex === this._visibleIndex) {\n            if (this._lastMouseX > this._startMouseX && this._lastIndex !== 0) {\n                scrollToIndex = this._lastIndex - 1;\n            }\n\n            if (\n                this._lastMouseX < this._startMouseX &&\n                this._lastIndex !== this._items?.length - 1\n            ) {\n                scrollToIndex = this._lastIndex + 1;\n            }\n        }\n\n        if (scrollToIndex !== null) {\n            this._shouldCheckLocation = false;\n            setTimeout(() => this._scrollTo(scrollToIndex), 100);\n        }\n    }\n\n    private _isVisible(el: HTMLElement) {\n        if (!this._el || !el) {\n            return false;\n        }\n\n        const elRect = el.getBoundingClientRect();\n        const sliderRect = this._sliderRef.getBoundingClientRect();\n\n        return (\n            (elRect.left >= sliderRect.left &&\n                elRect.right <= sliderRect.right) ||\n            (this._isMobile(el) &&\n                elRect.left + elRect.width / 2 >= sliderRect.left &&\n                elRect.left + elRect.width / 2 <= sliderRect.right)\n        );\n    }\n\n    private _calculateWidth() {\n        let totalWidth = 0;\n\n        for (let item of this._items) {\n            const rect = item.getBoundingClientRect();\n            totalWidth += rect.width;\n        }\n\n        const sliderStyle = getComputedStyle(this._sliderRef);\n        const padding = parseInt(sliderStyle.padding) * 2;\n\n        const innerSliderStyle = getComputedStyle(this._innerSliderRef);\n        const gap = parseInt(innerSliderStyle.gap) * (this._items.length - 1);\n\n        totalWidth += padding + gap;\n\n        this._totalWidth = totalWidth;\n    }\n\n    private _calculateHeight() {\n        const outerHeight = this._items.at(0).getBoundingClientRect().height;\n        if (outerHeight != this._outerHeight) {\n            this._outerHeight = outerHeight;\n        }\n    }\n\n    private _isMobile(el?: HTMLElement) {\n        if (!el) {\n            el = this._items.at(0);\n        }\n\n        const elRect = el.getBoundingClientRect();\n        const sliderRect = this._sliderRef.getBoundingClientRect();\n\n        return sliderRect.width - elRect.width < 10;\n    }\n}\n"],"version":3}
+{"file":"p-content-slider.js","mappings":"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","names":[],"sources":["./src/components/molecules/content-slider/content-slider.component.scss?tag=p-content-slider&encapsulation=shadow","./src/components/molecules/content-slider/content-slider.component.tsx"],"sourcesContent":[":host {\n    @apply flex flex-col overflow-hidden;\n\n    @apply p-16 -m-16;\n\n    .slider {\n        @apply overflow-visible relative box-content;\n\n        &.draggable {\n            @apply cursor-grab desktop-xs:cursor-auto;\n\n            &.dragging {\n                @apply cursor-grabbing desktop-xs:cursor-auto;\n\n                .inner-slider {\n                    @apply transition-none;\n                }\n            }\n        }\n\n        .inner-slider {\n            @apply absolute flex flex-nowrap items-stretch w-full gap-2;\n\n            @apply will-change-transform transform-gpu translate-x-0;\n\n            @apply desktop-xs:gap-4 desktop-xs:flex-wrap;\n\n            @apply transition-all;\n            transition-duration: 0.5s;\n\n            > ::slotted(*) {\n                @apply w-full;\n                @apply flex-shrink-0 z-10;\n\n                @screen tablet {\n                    width: calc(50% - 0.5rem);\n                }\n\n                @screen desktop-xs {\n                    @apply w-0 flex-1;\n                }\n\n                position: relative;\n            }\n        }\n    }\n\n    .indicator {\n        @apply flex justify-center items-center desktop-xs:hidden;\n\n        .item {\n            @apply mt-3 pt-1 px-1;\n        }\n    }\n}\n","import {\n    Component,\n    Element,\n    h,\n    Host,\n    Listen,\n    Prop,\n    State,\n} from '@stencil/core';\n\n@Component({\n    tag: 'p-content-slider',\n    styleUrl: 'content-slider.component.scss',\n    shadow: true,\n})\nexport class ContentSlider {\n    /**\n     * Wether to hide the indicator on mobile\n     */\n    @Prop() hideMobileIndicator: boolean = false;\n\n    /**\n     * Wether to disable dragging the content\n     */\n    @Prop() disableDrag: boolean = false;\n\n    /**\n     * Wether to disable auto centering the content\n     */\n    @Prop() disableAutoCenter: boolean = false;\n\n    /**\n     * Wether to disable clicking the indicator scrolls content\n     */\n    @Prop() disableIndicatorClick: boolean = false;\n\n    /**\n     * The host element\n     */\n    @Element() private _el: HTMLElement;\n\n    @State() private _visibleIndex: number;\n    @State() private _outerHeight = 0;\n    @State() private _totalWidth = 0;\n    private _sliderRef: HTMLElement;\n    private _innerSliderRef: HTMLElement;\n    private _items: HTMLElement[] = [];\n    private _innerSliderResizeObserver: ResizeObserver;\n\n    // mouse movement stuff\n    private _startX: number;\n    private _startMouseX: number;\n    private _lastMouseX: number;\n    private _lastIndex: number;\n    private _shouldCheckLocation = false;\n    @State() private _dragging = false;\n\n    componentWillRender() {\n        const items = this._el.querySelectorAll(':scope > *');\n        this._items = Array.from(items) as HTMLElement[];\n    }\n\n    componentDidLoad() {\n        this._innerSliderRef.style.setProperty('--tw-translate-x', `0px`);\n        this._calculateWidth();\n        this._calculateIndicator();\n    }\n\n    disconnectedCallback() {\n        if (this._innerSliderResizeObserver) {\n            this._innerSliderResizeObserver.disconnect();\n        }\n    }\n\n    render() {\n        return (\n            <Host class=\"p-content-slider\">\n                <div\n                    class={`slider ${!this.disableDrag && 'draggable'} ${\n                        this._dragging && 'dragging'\n                    }`}\n                    style={{\n                        height: `${this._outerHeight}px`,\n                    }}\n                    ref={(el) => (this._sliderRef = el)}\n                    onMouseDown={(e) => this._mouseDownHandler(e)}\n                    onTouchStart={(e) => this._mouseDownHandler(e)}\n                    onMouseMove={(e) => this._mouseMoveHandler(e)}\n                    onTouchMove={(e) => this._mouseMoveHandler(e)}\n                >\n                    <div\n                        class=\"inner-slider\"\n                        ref={(ref) => this._setInnerSliderReft(ref)}\n                        onTransitionEnd={() => this._transitionEndHandler()}\n                    >\n                        <slot />\n                    </div>\n                </div>\n                <div\n                    class={`indicator ${this.hideMobileIndicator && 'hidden'}`}\n                >\n                    {this._items.map((_, i) => (\n                        <div\n                            onClick={() => this._scrollTo(i, true)}\n                            class={`item ${\n                                !this.disableIndicatorClick && 'cursor-pointer'\n                            }`}\n                        >\n                            <p-slider-indicator\n                                active={i === this._visibleIndex}\n                            />\n                        </div>\n                    ))}\n                </div>\n            </Host>\n        );\n    }\n\n    private _mouseDownHandler(e) {\n        if (this.disableDrag || this._dragging) {\n            return;\n        }\n\n        const innerSliderStyle = getComputedStyle(this._innerSliderRef);\n        if (innerSliderStyle.flexWrap === 'wrap') {\n            return;\n        }\n\n        this._startMouseX = e.x;\n        const sliderRect = this._sliderRef.getBoundingClientRect();\n        if (e.type === 'touchstart') {\n            this._startMouseX = e.touches?.[0].clientX;\n        }\n\n        const innerSliderRect = this._innerSliderRef.getBoundingClientRect();\n        const offsetLeft = innerSliderRect.x - sliderRect.x;\n\n        this._startX = this._startMouseX - sliderRect.x - offsetLeft;\n        this._lastIndex = this._visibleIndex;\n        this._dragging = true;\n    }\n\n    private _mouseMoveHandler(e) {\n        if (!e || !this._dragging || this.disableDrag) {\n            return;\n        }\n\n        e.preventDefault();\n\n        this._shouldCheckLocation = true;\n\n        if (\n            this._innerSliderRef.style.getPropertyValue('pointer-events') === ''\n        ) {\n            this._innerSliderRef.style.pointerEvents = 'none';\n        }\n\n        const sliderRect = this._sliderRef.getBoundingClientRect();\n        let x = e.clientX - sliderRect.left;\n        this._lastMouseX = e.x;\n        if (e.type === 'touchmove') {\n            x = e.touches?.[0].clientX - sliderRect.left;\n            this._lastMouseX = e.touches?.[0].clientX;\n        }\n\n        this._innerSliderRef.style.setProperty(\n            '--tw-translate-x',\n            `${x - this._startX}px`\n        );\n\n        this._checkBoundary();\n        this._calculateIndicator();\n    }\n\n    private _transitionEndHandler() {\n        this._calculateIndicator();\n    }\n\n    @Listen('mouseup', { target: 'window' })\n    @Listen('touchend', { target: 'window' })\n    mouseUpHandler() {\n        this._dragging = false;\n        this._innerSliderRef.style.removeProperty('pointer-events');\n\n        this._checkLocation();\n    }\n\n    @Listen('resize', { target: 'window' })\n    resizeHandler() {\n        if (this._innerSliderRef) {\n            this._innerSliderRef.style.setProperty('--tw-translate-x', '0px');\n            this._calculateWidth();\n            this._calculateIndicator();\n        }\n    }\n\n    private _setInnerSliderReft(ref) {\n        this._innerSliderRef = ref;\n        this._innerSliderResizeObserver = new ResizeObserver(() =>\n            this._calculateHeight()\n        );\n        this._innerSliderResizeObserver.observe(this._innerSliderRef);\n    }\n\n    private _scrollTo(i: number, manual = false) {\n        if (this.disableIndicatorClick && manual) {\n            return;\n        }\n\n        const el = this._items[i];\n\n        if (i === 0) {\n            this._innerSliderRef.style.setProperty('--tw-translate-x', `0px`);\n            return;\n        }\n\n        const sliderRect = this._sliderRef.getBoundingClientRect();\n        const innerSliderRect = this._innerSliderRef.getBoundingClientRect();\n        const elRect = el.getBoundingClientRect();\n\n        const offsetLeft = elRect.x - innerSliderRect.x;\n\n        const centerOffset =\n            offsetLeft + elRect.width / 2 - sliderRect.width / 2;\n\n        this._innerSliderRef.style.setProperty(\n            '--tw-translate-x',\n            `-${centerOffset}px`\n        );\n\n        this._checkBoundary();\n        this._calculateIndicator();\n    }\n\n    private _checkBoundary() {\n        let outer = this._sliderRef.getBoundingClientRect();\n\n        const left = parseInt(\n            this._innerSliderRef.style.getPropertyValue('--tw-translate-x')\n        );\n        if (left > 0) {\n            this._innerSliderRef.style.setProperty('--tw-translate-x', `0px`);\n        }\n\n        const maxLeft = (this._totalWidth - outer.width) * -1;\n        if (left < maxLeft) {\n            this._innerSliderRef.style.setProperty(\n                '--tw-translate-x',\n                `${maxLeft}px`\n            );\n        }\n    }\n\n    private _calculateIndicator() {\n        for (let i = 0; i < this._items.length; i++) {\n            const item = this._items[i];\n            const visible = this._isVisible(item);\n\n            if (visible) {\n                this._visibleIndex = i;\n            }\n\n            if (i === 0 && visible) {\n                break;\n            }\n        }\n    }\n\n    private _checkLocation() {\n        if (!this._shouldCheckLocation) {\n            return;\n        }\n\n        let scrollToIndex = null;\n        if (this._lastIndex !== this._visibleIndex) {\n            scrollToIndex = this._visibleIndex;\n        }\n\n        if (this._lastIndex === this._visibleIndex) {\n            if (this._lastMouseX > this._startMouseX && this._lastIndex !== 0) {\n                scrollToIndex = this._lastIndex - 1;\n            }\n\n            if (\n                this._lastMouseX < this._startMouseX &&\n                this._lastIndex !== this._items?.length - 1\n            ) {\n                scrollToIndex = this._lastIndex + 1;\n            }\n        }\n\n        if (scrollToIndex !== null) {\n            this._shouldCheckLocation = false;\n            setTimeout(() => this._scrollTo(scrollToIndex), 100);\n        }\n    }\n\n    private _isVisible(el: HTMLElement) {\n        if (!this._el || !el) {\n            return false;\n        }\n\n        const elRect = el.getBoundingClientRect();\n        const sliderRect = this._sliderRef.getBoundingClientRect();\n\n        return (\n            (elRect.left >= sliderRect.left &&\n                elRect.right <= sliderRect.right) ||\n            (this._isMobile(el) &&\n                elRect.left + elRect.width / 2 >= sliderRect.left &&\n                elRect.left + elRect.width / 2 <= sliderRect.right)\n        );\n    }\n\n    private _calculateWidth() {\n        let totalWidth = 0;\n\n        for (let item of this._items) {\n            const rect = item.getBoundingClientRect();\n            totalWidth += rect.width;\n        }\n\n        const sliderStyle = getComputedStyle(this._sliderRef);\n        const padding = parseInt(sliderStyle.padding) * 2;\n\n        const innerSliderStyle = getComputedStyle(this._innerSliderRef);\n        const gap = parseInt(innerSliderStyle.gap) * (this._items.length - 1);\n\n        totalWidth += padding + gap;\n\n        this._totalWidth = totalWidth;\n    }\n\n    private _calculateHeight() {\n        const outerHeight = this._items.at(0).getBoundingClientRect().height;\n        if (outerHeight != this._outerHeight) {\n            this._outerHeight = outerHeight;\n        }\n    }\n\n    private _isMobile(el?: HTMLElement) {\n        if (!el) {\n            el = this._items.at(0);\n        }\n\n        const elRect = el.getBoundingClientRect();\n        const sliderRect = this._sliderRef.getBoundingClientRect();\n\n        return sliderRect.width - elRect.width < 10;\n    }\n}\n"],"version":3}

package/dist/components/p-datepicker.js

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