@paperless/core 2.0.1-beta.18 → 2.0.1-beta.19

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

@@ -0,0 +1,972 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-3f9bbc0c.js');
+const index$1 = require('./index-b556e70f.js');
+const localization = require('./localization-3a0a71db.js');
+const icons = require('./icons-10aa18f0.js');
+const floatingUi_dom_esm = require('./floating-ui.dom.esm-ef421825.js');
+require('./clsx-fc789adc.js');
+
+const buttonComponentCss = "*{box-sizing:border-box}.static{position:static!important}.block{display:block!important}.flex{display:flex!important}.h-10{height:2.5rem!important}.h-6{height:1.5rem!important}.h-8{height:2rem!important}.w-10{width:2.5rem!important}.w-6{width:1.5rem!important}.w-8{width:2rem!important}.w-inherit{width:inherit!important}.cursor-not-allowed{cursor:not-allowed!important}.cursor-pointer{cursor:pointer!important}.cursor-wait{cursor:wait!important}.items-center{align-items:center!important}.justify-center{justify-content:center!important}.gap-2{gap:.5rem!important}.rounded-lg{border-radius:.5rem!important}.rounded-e-lg{border-end-end-radius:.5rem!important;border-start-end-radius:.5rem!important}.rounded-s-lg{border-end-start-radius:.5rem!important;border-start-start-radius:.5rem!important}.border{border-width:1px!important}.border-b{border-bottom-width:1px!important}.border-black-teal\\/10{border-color:rgba(3,42,36,.1)!important}.border-black-teal\\/20{border-color:rgba(3,42,36,.2)!important}.border-supportive-lilac-800{--tw-border-opacity:1!important;border-color:rgb(189 140 255/var(--tw-border-opacity,1))!important}.border-teal{border-color:rgb(8 136 121/var(--tw-border-opacity,1))!important}.border-teal,.border-teal-100{--tw-border-opacity:1!important}.border-teal-100{border-color:rgb(206 231 228/var(--tw-border-opacity,1))!important}.bg-supportive-lilac{--tw-bg-opacity:1!important;background-color:rgb(209 174 255/var(--tw-bg-opacity,1))!important}.bg-supportive-lilac-100{--tw-bg-opacity:1!important;background-color:rgb(246 239 255/var(--tw-bg-opacity,1))!important}.bg-transparent{background-color:transparent!important}.bg-white{background-color:rgb(255 255 255/var(--tw-bg-opacity,1))!important}.bg-white,.bg-white-600{--tw-bg-opacity:1!important}.bg-white-600{background-color:rgb(250 250 250/var(--tw-bg-opacity,1))!important}.p-2{padding:.5rem!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.px-3{padding-left:.75rem!important;padding-right:.75rem!important}.py-1{padding-bottom:.25rem!important;padding-top:.25rem!important}.text-base{font-size:1rem!important;line-height:1.5rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.font-semibold{font-weight:600!important}.leading-4{line-height:1rem!important}.text-black-teal{--tw-text-opacity:1!important;color:rgb(3 42 36/var(--tw-text-opacity,1))!important}.text-black-teal-100{--tw-text-opacity:1!important;color:rgb(205 212 211/var(--tw-text-opacity,1))!important}.text-black-teal-300{--tw-text-opacity:1!important;color:rgb(104 127 124/var(--tw-text-opacity,1))!important}.text-dark-teal-100{--tw-text-opacity:1!important;color:rgb(204 220 218/var(--tw-text-opacity,1))!important}.text-dark-teal-100\\/60{color:rgba(204,220,218,.6)!important}.text-dark-teal-200{--tw-text-opacity:1!important;color:rgb(153 185 182/var(--tw-text-opacity,1))!important}.text-teal{color:rgb(8 136 121/var(--tw-text-opacity,1))!important}.text-teal,.text-teal-100{--tw-text-opacity:1!important}.text-teal-100{color:rgb(206 231 228/var(--tw-text-opacity,1))!important}.text-teal-300{--tw-text-opacity:1!important;color:rgb(107 184 175/var(--tw-text-opacity,1))!important}.underline{text-decoration-line:underline!important}.ring{--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(3px + var(--tw-ring-offset-width)) var(--tw-ring-color)!important}.ring,.ring-2{box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)!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}.ring-black-teal\\/10{--tw-ring-color:rgba(3,42,36,.1)!important}.ring-supportive-lilac-100{--tw-ring-opacity:1!important;--tw-ring-color:rgb(246 239 255/var(--tw-ring-opacity,1))!important}.drop-shadow-1{--tw-drop-shadow:drop-shadow(0 1px 1px rgba(0,2,2,.08))!important}.drop-shadow-1,.drop-shadow-supportive-lilac{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-supportive-lilac{--tw-drop-shadow:drop-shadow(0px 1px 1px 0px rgba(189,140,255,.2))!important}.hover\\:bg-dark-teal:hover{--tw-bg-opacity:1!important;background-color:rgb(0 81 72/var(--tw-bg-opacity,1))!important}.hover\\:bg-supportive-lilac-700:hover{--tw-bg-opacity:1!important;background-color:rgb(200 159 255/var(--tw-bg-opacity,1))!important}.hover\\:bg-white-600:hover{--tw-bg-opacity:1!important;background-color:rgb(250 250 250/var(--tw-bg-opacity,1))!important}.hover\\:drop-shadow-1:hover{--tw-drop-shadow:drop-shadow(0 1px 1px rgba(0,2,2,.08))!important}.hover\\:drop-shadow-1:hover,.hover\\:drop-shadow-2:hover{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}.hover\\:drop-shadow-2:hover{--tw-drop-shadow:drop-shadow(0 1px 1px rgba(0,2,2,.04)) drop-shadow(0 2px 2px rgba(0,2,2,.04)) drop-shadow(0 4px 4px rgba(0,2,2,.04))!important}.active\\:border-supportive-lilac-800:active{--tw-border-opacity:1!important;border-color:rgb(189 140 255/var(--tw-border-opacity,1))!important}.active\\:text-black-teal\\/60:active{color:rgba(3,42,36,.6)!important}.active\\:text-dark-teal-100\\/60:active{color:rgba(204,220,218,.6)!important}.active\\:text-teal-800:active{--tw-text-opacity:1!important;color:rgb(2 102 92/var(--tw-text-opacity,1))!important}.active\\:ring:active{--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(3px + var(--tw-ring-offset-width)) var(--tw-ring-color)!important}.active\\:ring-2:active,.active\\:ring:active{box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)!important}.active\\:ring-2:active{--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}.active\\:ring-black-teal\\/10:active{--tw-ring-color:rgba(3,42,36,.1)!important}.active\\:ring-supportive-lilac-100:active{--tw-ring-opacity:1!important;--tw-ring-color:rgb(246 239 255/var(--tw-ring-opacity,1))!important}.group:hover .group-hover\\:text-black-teal{--tw-text-opacity:1!important;color:rgb(3 42 36/var(--tw-text-opacity,1))!important}.group:hover .group-hover\\:text-dark-teal-100{--tw-text-opacity:1!important;color:rgb(204 220 218/var(--tw-text-opacity,1))!important}.group:hover .group-hover\\:text-teal{--tw-text-opacity:1!important;color:rgb(8 136 121/var(--tw-text-opacity,1))!important}";
+const PButtonStyle0 = buttonComponentCss;
+
+const button = index$1.cva([
+    'group',
+    'font-semibold leading-4',
+    'flex items-center justify-center gap-2',
+    'cursor-pointer',
+], {
+    variants: {
+        variant: {
+            primary: ['bg-supportive-lilac border-black-teal/20'],
+            secondary: null,
+            text: ['text-teal'],
+            transparent: ['bg-transparent'],
+            dropdown: null,
+        },
+        active: {
+            true: null,
+            false: null,
+        },
+        loading: {
+            true: 'cursor-wait',
+            false: null,
+        },
+        size: {
+            sm: ['text-xs h-6'],
+            base: ['text-sm h-8'],
+            lg: ['text-base h-10'],
+        },
+        disabled: {
+            true: 'cursor-not-allowed',
+            false: null,
+        },
+        underline: {
+            true: null,
+            false: null,
+        },
+        buttonGroupPosition: {
+            none: null,
+            start: null,
+            center: null,
+            end: null,
+        },
+        iconOnly: {
+            true: 'justify-center',
+            false: 'w-inherit py-1',
+        },
+    },
+    compoundVariants: [
+        // variants
+        {
+            variant: ['secondary', 'dropdown'],
+            class: ['bg-white border-black-teal/10'],
+        },
+        {
+            variant: ['primary', 'secondary', 'dropdown'],
+            disabled: false,
+            class: 'border',
+        },
+        {
+            variant: ['primary', 'secondary', 'dropdown'],
+            disabled: false,
+            loading: false,
+            class: 'active:border-supportive-lilac-800 active:ring active:ring-2',
+        },
+        {
+            variant: ['primary', 'secondary', 'dropdown'],
+            disabled: false,
+            loading: false,
+            active: true,
+            class: 'border-supportive-lilac-800 ring ring-2',
+        },
+        {
+            variant: ['primary', 'secondary', 'transparent', 'dropdown'],
+            buttonGroupPosition: 'none',
+            class: 'rounded-lg',
+        },
+        {
+            variant: ['primary', 'secondary', 'transparent', 'dropdown'],
+            buttonGroupPosition: 'start',
+            class: 'rounded-s-lg',
+        },
+        {
+            variant: ['primary', 'secondary', 'transparent', 'dropdown'],
+            buttonGroupPosition: 'end',
+            class: 'rounded-e-lg',
+        },
+        {
+            variant: ['primary', 'secondary', 'dropdown'],
+            disabled: false,
+            class: 'text-black-teal',
+        },
+        {
+            variant: 'primary',
+            disabled: true,
+            class: 'bg-supportive-lilac-100 text-black-teal-100',
+        },
+        {
+            variant: 'primary',
+            disabled: false,
+            loading: false,
+            class: 'drop-shadow-supportive-lilac hover:drop-shadow-2 hover:bg-supportive-lilac-700 active:text-black-teal/60 active:ring-black-teal/10',
+        },
+        {
+            variant: 'primary',
+            disabled: false,
+            loading: false,
+            active: true,
+            class: 'ring-black-teal/10',
+        },
+        {
+            variant: ['secondary', 'dropdown'],
+            disabled: true,
+            class: 'border bg-white-600 text-black-teal-100',
+        },
+        {
+            variant: ['secondary', 'dropdown'],
+            disabled: false,
+            loading: false,
+            class: 'drop-shadow-1 hover:drop-shadow-1 hover:bg-white-600 active:text-black-teal/60 active:ring-supportive-lilac-100',
+        },
+        {
+            variant: ['secondary', 'dropdown'],
+            disabled: false,
+            loading: false,
+            active: true,
+            class: 'ring-supportive-lilac-100',
+        },
+        {
+            variant: 'text',
+            underline: true,
+            disabled: false,
+            class: 'border-b border-teal',
+        },
+        {
+            variant: 'text',
+            underline: true,
+            disabled: true,
+            class: 'border-b border-teal-100',
+        },
+        {
+            variant: 'text',
+            disabled: true,
+            class: 'text-teal-100',
+        },
+        {
+            variant: 'text',
+            disabled: false,
+            loading: false,
+            class: 'active:text-teal-800',
+        },
+        {
+            variant: 'transparent',
+            disabled: false,
+            class: 'text-dark-teal-100',
+        },
+        {
+            variant: 'transparent',
+            disabled: false,
+            loading: false,
+            class: 'hover:bg-dark-teal active:text-dark-teal-100/60',
+        },
+        {
+            variant: 'transparent',
+            disabled: true,
+            class: 'text-dark-teal-100/60',
+        },
+        {
+            variant: ['primary', 'secondary', 'transparent'],
+            size: ['base', 'sm'],
+            iconOnly: false,
+            class: 'px-2',
+        },
+        {
+            variant: ['primary', 'secondary', 'transparent'],
+            size: 'lg',
+            iconOnly: false,
+            class: 'px-3',
+        },
+        {
+            variant: 'dropdown',
+            iconOnly: false,
+            class: 'p-2',
+        },
+        {
+            variant: ['primary', 'secondary', 'transparent', 'text'],
+            iconOnly: false,
+            class: 'py-1',
+        },
+        {
+            size: 'sm',
+            iconOnly: true,
+            class: 'w-6',
+        },
+        {
+            size: 'base',
+            iconOnly: true,
+            class: 'w-8',
+        },
+        {
+            size: 'lg',
+            iconOnly: true,
+            class: 'w-10',
+        },
+    ],
+});
+const icon$1 = index$1.cva([], {
+    variants: {
+        size: {
+            sm: 'text-sm',
+            base: 'text-base',
+            lg: 'text-base',
+        },
+        variant: {
+            primary: null,
+            secondary: null,
+            text: null,
+            transparent: null,
+            dropdown: null,
+        },
+        disabled: {
+            true: null,
+            false: null,
+        },
+        active: {
+            true: null,
+            false: null,
+        },
+    },
+    compoundVariants: [
+        {
+            variant: ['secondary', 'dropdown'],
+            disabled: false,
+            active: false,
+            class: 'text-black-teal-300 group-hover:text-black-teal',
+        },
+        {
+            variant: 'text',
+            disabled: false,
+            active: false,
+            class: 'text-teal-300 group-hover:text-teal',
+        },
+        {
+            variant: 'transparent',
+            disabled: false,
+            active: false,
+            class: 'text-dark-teal-200 group-hover:text-dark-teal-100',
+        },
+    ],
+});
+const Button = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.onClick = index.createEvent(this, "onClick", 3);
+        this.as = 'button';
+        this.variant = 'primary';
+        this.active = false;
+        this.underline = true;
+        this.href = undefined;
+        this.target = undefined;
+        this.size = 'base';
+        this.type = 'button';
+        this.loading = false;
+        this.chevron = false;
+        this.chevronPosition = 'end';
+        this.disabled = false;
+        this.icon = undefined;
+        this.iconOnly = false;
+        this.iconPosition = 'end';
+        this.iconFlip = undefined;
+        this.iconRotate = undefined;
+        this.inheritText = false;
+        this.buttonGroupPosition = 'none';
+        this.class = undefined;
+    }
+    /**
+     * Button click event
+     */
+    onClick;
+    render() {
+        let loaderColor = 'white';
+        switch (this.variant) {
+            case 'secondary':
+                loaderColor = 'storm';
+                break;
+            case 'text':
+                loaderColor = 'indigo';
+                break;
+        }
+        const VariableTag = this.variant === 'text' || this.href?.length || this.as === 'a'
+            ? 'a'
+            : 'button';
+        const active = this.active || this.class?.includes('active');
+        return (index.h(index.Host, { key: 'bca01063b73ca6e8896c99e9420ff4a9cc4361ce', class: 'p-button block' }, index.h(VariableTag, { key: 'e718fe9ee63cdcc8ab2df935084a7a572f97fba1', disabled: this.disabled, href: this.href, type: this.variant !== 'text' ? this.type : undefined, target: this.target, class: button({
+                variant: this.variant,
+                size: this.size,
+                underline: this.underline,
+                loading: this.loading,
+                disabled: this.disabled,
+                buttonGroupPosition: this.buttonGroupPosition,
+                iconOnly: this.iconOnly,
+                active,
+            }) }, this.chevron && this.chevronPosition === 'start' && (index.h("p-icon", { key: 'cc4684cd994077ce472090275294d2ecf522b972', variant: 'caret', rotate: this.chevron === 'up' ? 180 : 0 })), this.icon &&
+            this.iconPosition === 'start' &&
+            !(this.iconOnly && this.loading) &&
+            this._getIcon(), index.h("slot", { key: '3a41981e6d332dfbfdcde53fdae2c621816c1bb6' }), this.icon &&
+            this.iconPosition === 'end' &&
+            !this.loading &&
+            !this.chevron &&
+            this._getIcon(), this.chevron && !this.loading && this.chevronPosition === 'end' && (index.h("p-icon", { key: '2c457ebdd1a4b1f10ba82b2b764c71955d22bbbe', variant: 'caret', rotate: this.chevron === 'up' ? 180 : 0 })), this.loading && index.h("p-loader", { key: '432c01d2999d671698516d5061db2bc37d783023', color: loaderColor }))));
+    }
+    handleClick(ev) {
+        if (this.loading || this.disabled) {
+            ev.preventDefault();
+            return;
+        }
+        this.onClick.emit(ev);
+    }
+    _getIcon() {
+        if (!this.icon) {
+            return;
+        }
+        return (index.h("p-icon", { class: icon$1({
+                size: this.size,
+                variant: this.variant,
+                disabled: this.disabled,
+                active: this.active,
+            }), variant: this.icon, flip: this.iconFlip, rotate: this.iconRotate }));
+    }
+};
+Button.style = PButtonStyle0;
+
+const fieldComponentCss = "*{box-sizing:border-box}.static{position:static!important}.flex{display:flex!important}.h-6{height:1.5rem!important}.h-8{height:2rem!important}.h-full{height:100%!important}.w-inherit{width:inherit!important}.min-w-0{min-width:0!important}.flex-1{flex:1 1 0%!important}.flex-shrink-0{flex-shrink:0!important}.cursor-not-allowed{cursor:not-allowed!important}.items-center{align-items:center!important}.justify-center{justify-content:center!important}.gap-2{gap:.5rem!important}.rounded-lg{border-radius:.5rem!important}.border{border-width:1px!important}.border-solid{border-style:solid!important}.border-none{border-style:none!important}.border-black-teal-100{--tw-border-opacity:1!important;border-color:rgb(205 212 211/var(--tw-border-opacity,1))!important}.border-negative-red{--tw-border-opacity:1!important;border-color:rgb(230 30 30/var(--tw-border-opacity,1))!important}.border-supportive-lilac-800{--tw-border-opacity:1!important;border-color:rgb(189 140 255/var(--tw-border-opacity,1))!important}.bg-transparent{background-color:transparent!important}.bg-white{background-color:rgb(255 255 255/var(--tw-bg-opacity,1))!important}.bg-white,.bg-white-600{--tw-bg-opacity:1!important}.bg-white-600{background-color:rgb(250 250 250/var(--tw-bg-opacity,1))!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.text-center{text-align:center!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-black-teal{--tw-text-opacity:1!important;color:rgb(3 42 36/var(--tw-text-opacity,1))!important}.text-black-teal-100{--tw-text-opacity:1!important;color:rgb(205 212 211/var(--tw-text-opacity,1))!important}.text-black-teal-300{--tw-text-opacity:1!important;color:rgb(104 127 124/var(--tw-text-opacity,1))!important}.text-black-teal-500{--tw-text-opacity:1!important;color:rgb(3 42 36/var(--tw-text-opacity,1))!important}.text-negative-red{--tw-text-opacity:1!important;color:rgb(230 30 30/var(--tw-text-opacity,1))!important}.text-negative-red-800{--tw-text-opacity:1!important;color:rgb(141 16 16/var(--tw-text-opacity,1))!important}.outline-none{outline:2px solid transparent!important;outline-offset:2px!important}.ring{--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(3px + 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}.ring-negative-red-50{--tw-ring-opacity:1!important;--tw-ring-color:rgb(253 237 237/var(--tw-ring-opacity,1))!important}.ring-supportive-lilac-100{--tw-ring-opacity:1!important;--tw-ring-color:rgb(246 239 255/var(--tw-ring-opacity,1))!important}.selection\\:bg-negative-red-50 ::selection{--tw-bg-opacity:1!important;background-color:rgb(253 237 237/var(--tw-bg-opacity,1))!important}.selection\\:bg-supportive-lilac ::selection{--tw-bg-opacity:1!important;background-color:rgb(209 174 255/var(--tw-bg-opacity,1))!important}.selection\\:bg-negative-red-50::selection{--tw-bg-opacity:1!important;background-color:rgb(253 237 237/var(--tw-bg-opacity,1))!important}.selection\\:bg-supportive-lilac::selection{--tw-bg-opacity:1!important;background-color:rgb(209 174 255/var(--tw-bg-opacity,1))!important}.placeholder\\:text-sm::placeholder{font-size:.875rem!important;line-height:1.25rem!important}.placeholder\\:text-black-teal-200::placeholder{--tw-text-opacity:1!important;color:rgb(154 170 167/var(--tw-text-opacity,1))!important}.focus\\:outline-none:focus{outline:2px solid transparent!important;outline-offset:2px!important}";
+const PFieldStyle0 = fieldComponentCss;
+
+const field = index$1.cva(['flex gap-2', 'w-inherit px-2', 'border border-solid rounded-lg'], {
+    variants: {
+        size: {
+            sm: 'h-6',
+            base: 'h-8',
+        },
+        disabled: {
+            false: 'bg-white',
+            true: 'bg-white-600 cursor-not-allowed',
+        },
+        focused: {
+            false: null,
+            true: null,
+        },
+        error: {
+            false: null,
+            true: null,
+        },
+    },
+    compoundVariants: [
+        {
+            focused: false,
+            error: false,
+            class: 'border-black-teal-100',
+        },
+        {
+            disabled: false,
+            focused: true,
+            error: false,
+            class: 'border-supportive-lilac-800 ring ring-supportive-lilac-100 selection:bg-supportive-lilac',
+        },
+        {
+            disabled: false,
+            error: true,
+            class: 'border-negative-red',
+        },
+        {
+            disabled: false,
+            focused: true,
+            error: true,
+            class: 'ring ring-negative-red-50 selection:bg-negative-red-50',
+        },
+    ],
+});
+const input = index$1.cva('text-sm placeholder:text-sm placeholder:text-black-teal-200 text-black-teal border-none outline-none focus:outline-none bg-transparent flex-1 min-w-0 h-full', {
+    variants: {
+        disabled: {
+            false: null,
+            true: 'cursor-not-allowed',
+        },
+    },
+});
+const prefixAndSuffic = index$1.cva(['flex flex-shrink-0 justify-center items-center text-center'], {
+    variants: {
+        disabled: {
+            false: null,
+            true: 'text-black-teal-100',
+        },
+        focused: {
+            false: null,
+            true: null,
+        },
+        error: {
+            false: null,
+            true: null,
+        },
+    },
+    compoundVariants: [
+        {
+            disabled: false,
+            focused: false,
+            error: false,
+            class: 'text-black-teal-300',
+        },
+        {
+            disabled: false,
+            focused: true,
+            error: false,
+            class: 'text-black-teal-500',
+        },
+        {
+            disabled: false,
+            focused: false,
+            error: true,
+            class: 'text-negative-red',
+        },
+        {
+            disabled: false,
+            focused: true,
+            error: true,
+            class: 'text-negative-red-800',
+        },
+    ],
+});
+const Field = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.valueChange = index.createEvent(this, "valueChange", 7);
+        this.inputRefChange = index.createEvent(this, "inputRefChange", 7);
+        this.size = 'base';
+        this.type = 'text';
+        this.properties = {};
+        this.prefix = undefined;
+        this.suffix = undefined;
+        this.icon = undefined;
+        this.iconFlip = undefined;
+        this.iconRotate = undefined;
+        this.iconPosition = 'start';
+        this.value = undefined;
+        this.label = undefined;
+        this.placeholder = undefined;
+        this.helper = undefined;
+        this.required = true;
+        this.error = undefined;
+        this.errorPlacement = undefined;
+        this.disabled = false;
+        this.focused = false;
+        this.forceShowTooltip = false;
+        this.selectAllOnFocus = true;
+        this.focusMethod = 'focus';
+        this.optionalTemplate = undefined;
+        this._focused = false;
+    }
+    /**
+     * Event whenever the value changes
+     */
+    valueChange;
+    /**
+     * Event whenever the input ref changes
+     */
+    inputRefChange;
+    get _el() { return index.getElement(this); }
+    _inputRef;
+    render() {
+        const { prefix, suffix, hasHeaderSlot, hasLabelSlot, hasHelperSlot, hasErrorSlot, } = this._getSlotInfo();
+        return (index.h(index.Host, { key: 'e2f6c8a1a217097531bae6e24b2f6e18b963a663', class: 'p-field' }, index.h("p-field-container", { key: 'af716a1cbea3ed9b247621d4a12b029d0829a1c9', forceShowTooltip: this.forceShowTooltip || this._focused, label: this.label, helper: this.helper, error: this.error, required: this.required }, hasLabelSlot && (index.h("slot", { key: '2cf704972acb092ef41ec1c043ce2df8d0bccddc', name: 'label', slot: 'label' })), hasHeaderSlot && (index.h("slot", { key: '9a81ab31ca82d117b579edbd6cdf11873d456e00', name: 'header', slot: 'header' })), hasHelperSlot && (index.h("slot", { key: '376d53014f8df0e3654e3b8c9052ed237897f1a6', name: 'helper', slot: 'helper' })), hasErrorSlot && (index.h("slot", { key: '90661403de0740cbcb3ca181151a7c6e412e58ff', name: 'error', slot: 'error' })), index.h("div", { key: 'fa774db3dcda1c5f172aa638704f733fba24cab3', class: field({
+                error: !!this.error?.length,
+                disabled: this.disabled,
+                focused: this.focused || this._focused,
+                size: this.size,
+            }), slot: 'content' }, (prefix || (this.icon && this.iconPosition === 'start')) && (index.h("div", { key: 'fd3ea49f13b9fd9ddf80ed0c7514dbd3221f18a4', class: prefixAndSuffic({
+                error: !!this.error?.length,
+                disabled: this.disabled,
+                focused: this.focused || this._focused,
+            }), onClick: () => this._focusInput() }, this.icon && this.iconPosition === 'start' ? (index.h("p-icon", { class: 'flex', variant: this.icon, rotate: this.iconRotate, flip: this.iconFlip })) : (prefix))), this._getInput(), (suffix || (this.icon && this.iconPosition === 'end')) && (index.h("div", { key: '2e8120dcb57814fa41894068394641bacc2d7daa', class: prefixAndSuffic({
+                error: !!this.error?.length,
+                disabled: this.disabled,
+                focused: this.focused || this._focused,
+            }), onClick: () => this._focusInput() }, this.icon && this.iconPosition === 'end' ? (index.h("p-icon", { class: 'flex', variant: this.icon, rotate: this.iconRotate, flip: this.iconFlip })) : (suffix)))))));
+    }
+    handleFocusIn() {
+        if (this.disabled) {
+            return;
+        }
+        this._focused = true;
+        this._selectAll();
+    }
+    handleFocusOut() {
+        if (this.disabled) {
+            return;
+        }
+        this._focused = false;
+    }
+    _getSlotInfo() {
+        const hasHelperSlot = !!this._el.querySelector(':scope > [slot="helper"]');
+        const hasLabelSlot = !!this._el.querySelector(':scope > [slot="label"]');
+        const hasPrefixSlot = !!this._el.querySelector(':scope > [slot="prefix"]');
+        const hasSuffixSlot = !!this._el.querySelector(':scope > [slot="suffix"]');
+        const hasHeaderSlot = !!this._el.querySelector(':scope > [slot="header"]');
+        const hasErrorSlot = !!this._el.querySelector(':scope > [slot="error"]');
+        const prefix = hasPrefixSlot ? index.h("slot", { name: 'prefix' }) : this.prefix;
+        const suffix = hasSuffixSlot ? index.h("slot", { name: 'suffix' }) : this.suffix;
+        const errorAndErrorIsNotBoolean = this.error && typeof this.error === 'string' && this.error !== 'true';
+        return {
+            hasHelperSlot,
+            hasLabelSlot,
+            hasPrefixSlot,
+            hasSuffixSlot,
+            hasHeaderSlot,
+            hasErrorSlot,
+            prefix,
+            suffix,
+            errorAndErrorIsNotBoolean,
+        };
+    }
+    _getInput() {
+        if (this.type === 'custom') {
+            return index.h("slot", { name: 'input' });
+        }
+        const props = {
+            class: input({
+                disabled: this.disabled,
+            }),
+            placeholder: this.placeholder,
+            disabled: this.disabled,
+            onInput: (e) => {
+                this.valueChange.emit(e.target.value);
+            },
+        };
+        let properties = this.properties ?? {};
+        if (typeof properties === 'string') {
+            properties = JSON.parse(this.properties);
+        }
+        if (this.type === 'textarea') {
+            index.h("textarea", { ref: ref => this._setInputRef(ref), ...props, ...properties });
+        }
+        return (index.h("input", { type: this.type, ref: ref => this._setInputRef(ref), ...props, ...properties }));
+    }
+    _setInputRef(ref) {
+        this._inputRef = ref;
+        this.inputRefChange.emit(ref);
+    }
+    _focusInput() {
+        if (this._inputRef) {
+            this._inputRef.focus();
+            return;
+        }
+        const input = this._el.querySelector(':scope > [slot="input"]');
+        input[this.focusMethod]();
+    }
+    _selectAll() {
+        if (!this._inputRef || !this.selectAllOnFocus) {
+            return;
+        }
+        this._inputRef.select();
+    }
+};
+Field.style = PFieldStyle0;
+
+const fieldContainerComponentCss = "*{box-sizing:border-box}.static{position:static!important}.ml-2{margin-left:.5rem!important}.flex{display:flex!important}.w-full{width:100%!important}.w-inherit{width:inherit!important}.flex-col{flex-direction:column!important}.items-end{align-items:flex-end!important}.items-center{align-items:center!important}.justify-between{justify-content:space-between!important}.gap-1{gap:.25rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.font-medium{font-weight:500!important}.text-black-teal-200{--tw-text-opacity:1!important;color:rgb(154 170 167/var(--tw-text-opacity,1))!important}.text-black-teal-300{--tw-text-opacity:1!important;color:rgb(104 127 124/var(--tw-text-opacity,1))!important}";
+const PFieldContainerStyle0 = fieldContainerComponentCss;
+
+const FieldContainer = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.focus = index.createEvent(this, "focus", 7);
+        this.label = undefined;
+        this.helper = undefined;
+        this.required = undefined;
+        this.error = undefined;
+        this.errorPlacement = undefined;
+        this.forceShowTooltip = false;
+        this.optionalTemplate = this._defaultOptionalTemplate;
+        this._locales = {};
+    }
+    _defaultOptionalTemplate = () => localization.formatTranslation(this._locales.optional);
+    get _el() { return index.getElement(this); }
+    focus;
+    componentWillLoad() {
+        this._setLocales();
+    }
+    render() {
+        const { hasHeaderSlot, hasErrorSlot, helper, label, errorAndErrorIsNotBoolean, } = this._getSlotInfo();
+        return (index.h(index.Host, { key: '5a9f6522df4ed827c3e66dec4fb0f4632f7b227a', class: 'p-field-container' }, index.h("div", { key: '7aca74e4bc43e883cc97f1c053117735af73fed4', class: 'flex w-inherit flex-col gap-1' }, index.h("div", { key: '426757bcec0af2c2835b95946e802aa52d19e603', class: 'flex items-end justify-between gap-1' }, label && (index.h("div", { key: 'b5f54de0e3643da28e390776339fd629cc784731', class: 'text-xs font-medium text-black-teal-300', onClick: () => this.focus.emit() }, label)), (!this.required || helper || hasHeaderSlot) && (index.h("div", { key: 'e3bad54b3ea5b73652cc50a08390adcf51563572', class: 'flex items-center gap-1' }, !this.required && (index.h("span", { key: 'e175174c57d7d7aa3c36789a51b3ea19f3f82e93', class: 'text-xs font-medium text-black-teal-200' }, this.optionalTemplate())), (helper || hasHeaderSlot) && (index.h(index.Fragment, { key: 'b6a58573f43e5dcb18aaee9ae6317c9a8ae18461' }, hasHeaderSlot && index.h("slot", { key: '5708bac40fa9ac3c35aaa103a9314182dc22ceeb', name: 'header' }), helper && (index.h("p-helper", { key: '4b40eaeb300d824d6af645f77b4f646f9fa49688', class: `flex ${hasHeaderSlot ? 'ml-2' : ''}`, placement: 'top-end' }, helper))))))), index.h("p-tooltip", { key: '2548c71b57fb4380ed7199763d92e0bfec97672b', class: 'w-full', variant: 'error', content: this.error, show: errorAndErrorIsNotBoolean && this.forceShowTooltip, enableUserInput: false, placement: this.errorPlacement }, hasErrorSlot && (index.h("slot", { key: '5e28992d5467ae8fc554aaa4b11833a9ef696918', name: 'error', slot: 'content' })), index.h("slot", { key: 'f08fdbf1124fe2d4f9d8b9ca9d057d00254d8046', name: 'content', slot: 'trigger' })))));
+    }
+    async _setLocales() {
+        this._locales = await localization.getLocaleComponentStrings(this._el);
+    }
+    _getSlotInfo() {
+        const hasHelperSlot = !!this._el.querySelector(':scope > [slot="helper"]');
+        const hasLabelSlot = !!this._el.querySelector(':scope > [slot="label"]');
+        const hasHeaderSlot = !!this._el.querySelector(':scope > [slot="header"]');
+        const hasErrorSlot = !!this._el.querySelector(':scope > [slot="error"]');
+        const helper = hasHelperSlot ? index.h("slot", { name: 'helper' }) : this.helper;
+        const label = hasLabelSlot ? index.h("slot", { name: 'label' }) : this.label;
+        const errorAndErrorIsNotBoolean = hasErrorSlot ||
+            (this.error && typeof this.error === 'string' && this.error !== 'true');
+        return {
+            hasHelperSlot,
+            hasLabelSlot,
+            hasHeaderSlot,
+            hasErrorSlot,
+            helper,
+            label,
+            errorAndErrorIsNotBoolean,
+        };
+    }
+};
+FieldContainer.style = PFieldContainerStyle0;
+
+const helperComponentCss = ".inline-block{display:inline-block!important}.h-\\[0\\.75rem\\]{height:.75rem!important}.w-\\[0\\.75rem\\]{width:.75rem!important}.cursor-pointer{cursor:pointer!important}.bg-center{background-position:50%!important}*{box-sizing:border-box}:host{line-height:.75rem}:host .helper{background-image:url(/assets/images/helper/helper.svg);background-position:50%;background-repeat:no-repeat;cursor:pointer;display:inline-block;height:.75rem;width:.75rem}:host .helper:hover{background-image:url(/assets/images/helper/helper-hover.svg)}.static{position:static!important}.absolute{position:absolute!important}";
+const PHelperStyle0 = helperComponentCss;
+
+const Helper = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.strategy = 'absolute';
+        this.placement = 'top';
+    }
+    render() {
+        return (index.h(index.Host, { key: '9392e235ad3f053620cfabe68e71bcdfe961df09', class: 'p-helper' }, index.h("p-tooltip", { key: 'b3e4f9e553a44ec81a2f67c2c58404505bc3f224', placement: this.placement, strategy: this.strategy }, index.h("div", { key: '8e4ce0d5f7c6b2af6dc0a16476bca5cce5abfdcc', slot: 'content' }, index.h("slot", { key: '5ef4bfce3db5547eb380cbe6e51a49ff283b7367' })), index.h("div", { key: 'fbaa2d08ae0d679ff7814e178569f53a830a1942', slot: 'trigger', class: 'helper' }))));
+    }
+};
+Helper.style = PHelperStyle0;
+
+const iconComponentCss = "*{box-sizing:border-box}:host{-webkit-transform-origin:50% 51%}.static{position:static!important}.flex{display:flex!important}.scale-\\[0\\.99\\]{--tw-scale-x:0.99!important;--tw-scale-y:0.99!important}.scale-\\[0\\.99\\],.scale-x-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-x-flip{--tw-scale-x:-1!important}.scale-y-flip{--tw-scale-y:-1!important}.scale-y-flip,.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}.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}.text-2xl{font-size:1.5rem!important;line-height:2rem!important}.text-3xl{font-size:2rem!important;line-height:2.5rem!important}.text-4xl{font-size:2.5rem!important;line-height:3rem!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}.text-xs,.text-xxs{line-height:1rem!important}.text-xxs{font-size:.5rem!important}";
+const PIconStyle0 = iconComponentCss;
+
+const icon = index$1.cva(['p-icon flex'], {
+    variants: {
+        flip: {
+            none: null,
+            horizontal: 'scale-x-flip',
+            vertical: 'scale-y-flip',
+        },
+        size: {
+            auto: 'text-auto',
+            xxs: 'text-xxs',
+            xs: 'text-xs',
+            sm: 'text-sm',
+            base: 'text-base',
+            lg: 'text-lg',
+            xl: 'text-xl',
+            '2xl': 'text-2xl',
+            '3xl': 'text-3xl',
+            '4xl': 'text-4xl',
+        },
+        transform: {
+            true: 'transform-gpu scale-[0.99]',
+            false: null,
+        },
+    },
+});
+const Icon = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.variant = undefined;
+        this.size = 'base';
+        this.rotate = 0;
+        this.flip = 'none';
+    }
+    render() {
+        const svg = icons.icons[this.variant];
+        return (index.h(index.Host, { key: 'bf9559d3ea263753b66321c184077ee7163ec27b', class: icon({
+                flip: this.flip,
+                size: this.size,
+                transform: this.flip !== 'none' || this.rotate > 0 || this.rotate < 0,
+            }), style: {
+                '--tw-rotate': `${this.rotate}deg`,
+            }, innerHTML: svg }));
+    }
+};
+Icon.style = PIconStyle0;
+
+const loaderComponentCss = ".fixed{position:fixed!important}.top-0{top:0!important}.box-border{box-sizing:border-box!important}.block{display:block!important}.inline-block{display:inline-block!important}.flex{display:flex!important}.h-\\[1em\\]{height:1em!important}.w-\\[1em\\]{width:1em!important}.w-full{width:100%!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}.border-2{border-width:2px!important}.border-solid{border-style:solid!important}.border-indigo-light{--tw-border-opacity:1!important;border-color:rgb(241 246 255/var(--tw-border-opacity,1))!important}.border-indigo-light\\/40{border-color:rgba(241,246,255,.4)!important}.border-storm-light\\/40{border-color:rgba(176,178,203,.4)!important}.border-t-storm{--tw-border-opacity:1!important;border-top-color:rgb(81 83 107/var(--tw-border-opacity,1))!important}.border-t-white{--tw-border-opacity:1!important;border-top-color:rgb(255 255 255/var(--tw-border-opacity,1))!important}.ease-in-out{animation-timing-function:cubic-bezier(.4,0,.2,1)!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important}.h-screen-safe{height:calc(100vh - env(safe-area-inset-top) - env(safe-area-inset-bottom))!important}.w-screen-safe{width:calc(100vw - env(safe-area-inset-left) - env(safe-area-inset-right))!important}*{box-sizing:border-box}:host .loader{--tw-border-opacity:1;animation:spin .5s linear infinite;border-color:rgb(241 246 255/var(--tw-border-opacity,1));border-radius:9999px;border-style:solid;border-top:solid rgb(82 138 250/var(--tw-border-opacity,1));border-width:2px;display:inline-block;height:1em;width:1em;will-change:transform}:host .loader.color-storm{--tw-border-opacity:1!important;border-color:rgba(176,178,203,.4)!important;border-top-color:rgb(81 83 107/var(--tw-border-opacity,1))!important}:host .loader.color-white{--tw-border-opacity:1!important;border-color:rgba(241,246,255,.4)!important;border-top-color:rgb(255 255 255/var(--tw-border-opacity,1))!important}:host .loading-screen{--tw-bg-opacity:1;align-items:center;background-color:rgb(247 250 252/var(--tw-bg-opacity,1));display:flex;height:calc(100vh - env(safe-area-inset-top) - env(safe-area-inset-bottom));justify-content:center;left:0;position:fixed;top:0;width:calc(100vw - env(safe-area-inset-left) - env(safe-area-inset-right));z-index:1001}:host .loading-screen .content{max-width:20rem}:host .loading-screen .content .loader-wrapper{display:flex;justify-content:center;width:100%}:host .loading-screen .content .loader-wrapper .loader{font-size:2.5rem;line-height:3rem}:host(.variant-ghost){--loading-bg:#f7fafc;--loading-stripe:#fcfdfe;animation:loading 1s ease-in-out infinite;background-color:var(--loading-bg);background:linear-gradient(100deg,hsla(0,0%,100%,0) 40%,var(--loading-stripe) 50%,hsla(0,0%,100%,0) 60%) var(--loading-bg);background-position-x:180%;background-size:200% 100%;box-sizing:border-box;display:block;min-height:1em;min-width:1em;will-change:background,background-position-x,background-color}@keyframes loading{to{background-position-x:-20%}}@keyframes spin{to{transform:rotate(1turn)}}.static{position:static!important}.inline{display:inline!important}.justify-center{justify-content:center!important}.text-4xl{font-size:2.5rem!important;line-height:3rem!important}";
+const PLoaderStyle0 = loaderComponentCss;
+
+const Loader = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.show = true;
+        this.variant = 'inline';
+        this.color = 'indigo';
+        this.modalTitle = undefined;
+        this.modalDescription = undefined;
+    }
+    _show = false;
+    _showSubscriber;
+    componendDidLoad() {
+        this._show = this.show;
+    }
+    componentWillRender() {
+        this._checkShow();
+    }
+    componentShouldUpdate() {
+        this._checkShow();
+    }
+    render() {
+        if (!this._show) {
+            return;
+        }
+        if (this.variant === 'ghost') {
+            return index.h(index.Host, { class: 'p-loader variant-ghost' });
+        }
+        const loader = index.h("div", { class: `loader color-${this.color}` });
+        if (this.variant === 'full-screen') {
+            return (index.h(index.Host, { class: 'p-loader variant-full-screen' }, index.h("div", { class: 'loading-screen' }, index.h("div", { class: 'content' }, index.h("slot", null), index.h("div", { class: 'loader-wrapper' }, loader)))));
+        }
+        return (index.h(index.Host, { class: `p-loader variant-default flex ${this.variant === 'full-width' && 'flex w-full justify-center text-4xl'}` }, loader));
+    }
+    _checkShow() {
+        if (this._showSubscriber) {
+            this._showSubscriber.unsubscribe();
+            this._showSubscriber = null;
+        }
+        if (typeof this.show !== 'boolean') {
+            this._showSubscriber = this.show?.subscribe(show => (this._show = show));
+            return;
+        }
+        this._show = this.show;
+    }
+};
+Loader.style = PLoaderStyle0;
+
+const Portal = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.containerClass = undefined;
+    }
+    get _element() { return index.getElement(this); }
+    _moved = false;
+    createPortal() {
+        document.body.append(this._element);
+    }
+    componentDidLoad() {
+        this.createPortal();
+    }
+    disconnectedCallback() {
+        this._moved ? this._element.remove() : (this._moved = true);
+    }
+    render() {
+        return (index.h(index.Host, { key: 'a8f8b6731f20ea358b6c9bf1b32906bea4c2da84' }, index.h("slot", { key: 'bf00f218895604ee0d63378c9c692e5d696b8989' })));
+    }
+};
+
+const tooltipComponentCss = "*{box-sizing:border-box}.pointer-events-none{pointer-events:none!important}.pointer-events-auto{pointer-events:auto!important}.visible{visibility:visible!important}.static{position:static!important}.fixed{position:fixed!important}.absolute{position:absolute!important}.relative{position:relative!important}.z-tooltip{z-index:601!important}.inline-block{display:inline-block!important}.flex{display:flex!important}.h-inherit{height:inherit!important}.w-\\[2px\\]{width:2px!important}.w-full{width:100%!important}.w-inherit{width:inherit!important}.w-max{width:max-content!important}.max-w-\\[14\\.5rem\\]{max-width:14.5rem!important}.max-w-full{max-width:100%!important}.cursor-pointer{cursor:pointer!important}.gap-2{gap:.5rem!important}.rounded-lg{border-radius:.5rem!important}.bg-black-teal{--tw-bg-opacity:1!important;background-color:rgb(3 42 36/var(--tw-bg-opacity,1))!important}.bg-negative-red{background-color:rgb(230 30 30/var(--tw-bg-opacity,1))!important}.bg-negative-red,.bg-white{--tw-bg-opacity:1!important}.bg-white{background-color:rgb(255 255 255/var(--tw-bg-opacity,1))!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.py-1{padding-bottom:.25rem!important;padding-top:.25rem!important}.py-2{padding-bottom:.5rem!important;padding-top:.5rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.text-black-teal-300{--tw-text-opacity:1!important;color:rgb(104 127 124/var(--tw-text-opacity,1))!important}.text-white{--tw-text-opacity:1!important;color:rgb(255 255 255/var(--tw-text-opacity,1))!important}.opacity-0{opacity:0!important}.opacity-100{opacity:1!important}.blur{--tw-blur:blur(8px)!important}.blur,.drop-shadow-3{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-3{--tw-drop-shadow:drop-shadow(0 1px 1px rgba(0,2,2,.08)) drop-shadow(0 2px 2px rgba(0,2,2,.08)) drop-shadow(0 4px 4px rgba(0,2,2,.08))!important}.transition-opacity{transition-duration:.15s!important;transition-property:opacity!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important}";
+const PTooltipStyle0 = tooltipComponentCss;
+
+const popover = index$1.cva([
+    'inline-block px-2',
+    'text-xs',
+    'opacity-0 drop-shadow-3 transition-opacity',
+    'rounded-lg',
+    'z-tooltip',
+    'pointer-events-none',
+], {
+    variants: {
+        variant: {
+            hover: 'bg-black-teal text-white py-1',
+            click: null,
+            error: 'max-w-full w-full',
+        },
+        strategy: {
+            none: null,
+            fixed: 'fixed',
+            absolute: 'absolute',
+        },
+    },
+    compoundVariants: [
+        {
+            variant: ['hover', 'click'],
+            class: 'max-w-[14.5rem] w-max',
+        },
+        {
+            variant: ['click', 'error'],
+            class: 'bg-white text-black-teal-300 py-2',
+        },
+    ],
+});
+const portal = index$1.cva('', {
+    variants: {
+        strategy: {
+            fixed: 'fixed',
+            absolute: 'absolute',
+        },
+    },
+});
+const Tooltip = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.isOpen = index.createEvent(this, "isOpen", 3);
+        this.variant = 'hover';
+        this.content = null;
+        this.placement = undefined;
+        this.offset = 8;
+        this.strategy = 'absolute';
+        this.enableUserInput = true;
+        this.show = false;
+        this.usePortal = false;
+        this.canManuallyClose = true;
+    }
+    /**
+     * Open change event
+     */
+    isOpen;
+    get _el() { return index.getElement(this); }
+    _hasContentSlot = false;
+    _loaded = false;
+    _popover;
+    _cleanup;
+    componentWillLoad() {
+        this._hasContentSlot = !!this._el.querySelector(':scope > [slot="content"]');
+    }
+    componentShouldUpdate() {
+        this._update();
+    }
+    disconnectedCallback() {
+        if (this._cleanup) {
+            this._cleanup();
+            this._cleanup = null;
+        }
+    }
+    render() {
+        const tooltipProps = {
+            role: 'popover',
+            'data-placement': this.placement,
+            ref: el => this._load(el),
+        };
+        let tooltip;
+        const tooltipElement = (index.h("div", { key: '7593488c3f391576b3b887126e672a2645bdbff9', class: popover({
+                variant: this.variant,
+                strategy: this.usePortal ? 'none' : this.strategy,
+            }), ...(this.usePortal ? {} : tooltipProps) }, index.h("div", { key: 'b684f4ee1a8457fedb625d0b8d4bda557afee7f9', class: 'flex gap-2' }, this.variant === 'error' && (index.h("div", { key: '8b7b98bf05446a4aefbcfc2194aeb7739123fdd2', class: 'w-[2px] bg-negative-red' })), this.content ? this.content : index.h("slot", { name: 'content' }))));
+        if (this.usePortal) {
+            tooltip = (index.h("p-portal", { key: '747ee0bfa525715b3061a5c68a1669b3f28c71d0', class: portal({
+                    strategy: this.strategy,
+                }), ...tooltipProps }, tooltipElement));
+        }
+        else {
+            tooltip = tooltipElement;
+        }
+        return (index.h(index.Host, { key: '6dac841888d10783b061a1f807562b2567ea19c4', class: 'p-popover flex cursor-pointer' }, index.h("div", { key: 'b0f2d0a14a9ebe94e75e71c0f05f5cb884404cdf', class: 'relative h-inherit w-inherit' }, index.h("slot", { key: '33253adf5caabce01a94dbc02f71402af6994e42', name: 'trigger' }), tooltip)));
+    }
+    clickHandler() {
+        if (this.variant === 'hover' || !this.enableUserInput) {
+            return;
+        }
+        if (this._popover.hasAttribute('data-show')) {
+            return;
+        }
+        this._show();
+    }
+    documentClickHandler() {
+        if (this.variant === 'hover' || !this.canManuallyClose || this.show) {
+            return;
+        }
+        if (!this._popover.hasAttribute('data-show')) {
+            return;
+        }
+        this._hide();
+    }
+    mouseEnterHandler() {
+        if (this.variant !== 'hover' || !this.enableUserInput) {
+            return;
+        }
+        this._show();
+    }
+    mouseLeaveHandler() {
+        if (this.show || this.variant !== 'hover' || !this.enableUserInput) {
+            return;
+        }
+        this._hide();
+    }
+    onShowChange(show) {
+        if (show && !this._popover.hasAttribute('data-show')) {
+            return this._show();
+        }
+        return this._hide();
+    }
+    _show() {
+        if (!this._loaded) {
+            return;
+        }
+        if (!this.content?.length && !this._hasContentSlot) {
+            if (this._popover.hasAttribute('data-show')) {
+                this._hide();
+            }
+            return;
+        }
+        this._cleanup = floatingUi_dom_esm.autoUpdate(this._el, this._popover, () => this._update());
+        // Make the popover visible
+        this._popover.setAttribute('data-show', '');
+        this._popover.classList.remove('opacity-0', 'pointer-events-none');
+        this._popover.classList.add('opacity-100', 'pointer-events-auto');
+        // Update its position
+        this.isOpen.emit(true);
+    }
+    _hide() {
+        if (!this._loaded) {
+            return;
+        }
+        if (this._cleanup) {
+            this._cleanup();
+            this._cleanup = null;
+        }
+        // Hide the popover
+        this._popover.removeAttribute('data-show');
+        this._popover.classList.remove('opacity-100', 'pointer-events-auto');
+        this._popover.classList.add('opacity-0', 'pointer-events-none');
+        this.isOpen.emit(false);
+    }
+    _load(popover) {
+        this._popover = popover;
+        if (popover) {
+            this._update();
+            this._loaded = true;
+            if (this.show) {
+                setTimeout(() => this._show(), 100);
+            }
+        }
+    }
+    _update() {
+        if (!this._popover) {
+            return;
+        }
+        floatingUi_dom_esm.computePosition(this._el, this._popover, {
+            placement: this.variant === 'error' && !this.placement
+                ? 'bottom-start'
+                : this.placement ?? 'top',
+            strategy: this.strategy,
+            middleware: [floatingUi_dom_esm.offset(this.offset), floatingUi_dom_esm.flip(), floatingUi_dom_esm.shift()],
+        }).then(({ x, y, placement }) => {
+            this._popover.dataset.placement = placement;
+            Object.assign(this._popover.style, {
+                top: `${y}px`,
+                left: `${x}px`,
+            });
+        });
+    }
+    static get watchers() { return {
+        "show": ["onShowChange"]
+    }; }
+};
+Tooltip.style = PTooltipStyle0;
+
+exports.p_button = Button;
+exports.p_field = Field;
+exports.p_field_container = FieldContainer;
+exports.p_helper = Helper;
+exports.p_icon = Icon;
+exports.p_loader = Loader;
+exports.p_portal = Portal;
+exports.p_tooltip = Tooltip;
+
+//# sourceMappingURL=p-button_8.cjs.entry.js.map