@paperless/core 2.0.1-beta.23 → 2.0.1-beta.24

package/dist/collection/components/molecules/table-row/table-row.component.js

@@ -5,9 +5,9 @@ export class TableRow {
         this.enableHover = true;
     }
     render() {
-        return (h(Host, { key: '84fafc96af5423eca823b2702a4b878a03c76565', class: `p-table-row variant-${this.variant} ${this.enableHover &&
+        return (h(Host, { key: '962ec4f0187a22416270df391edb910c6584fc57', class: `p-table-row variant-${this.variant} ${this.enableHover &&
                 this.variant === 'default' &&
-                'enable-hover'} group` }, h("div", { key: '968888482a3d22ec973cda8a9618e3a3b59c2ff4', class: "content" }, h("slot", { key: '934e900af0720877e705d78a9cfbddf033206326' })), this.variant === 'default' && h("p-divider", { key: '5c443bc203dd2cdb0641b41db9824a26646239eb', class: "m-0" })));
+                'enable-hover'} group` }, h("div", { key: '45deb1c2a22e4afdf99b3e4f407f8ceedc3769fc', class: "content" }, h("slot", { key: 'd9bae05aad34f48ef13598e432813ffacab3d3f6' })), this.variant === 'default' && h("p-divider", { key: 'efdc3dcb43ea3f74786495f62ceaf7b6a62908d6', class: "m-0" })));
     }
     static get is() { return "p-table-row"; }
     static get encapsulation() { return "shadow"; }

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

@@ -14,7 +14,7 @@ export class Toast {
      */
     action;
     render() {
-        return (h(Host, { key: '45995dbf55e1f5da083853de2a84a8b2fabecae3', class: `p-toast variant-${this.variant}`, onClick: () => this._onClick() }, h("div", { key: '21cc758c734909d3ac31b57174ac48117086ea8b', class: 'flex w-full min-w-0 flex-col' }, h("p", { key: '6d9e38a1ff99eb3cca01492a1b23b1855d47e6c2', class: 'font-semibold text-storm' }, this.header?.length ? this.header : h("slot", { name: 'header' })), h("p", { key: 'e9cb052a385dc14e0485944518548365f743a3e4', class: 'w-full text-sm text-storm-medium' }, this.content?.length ? this.content : h("slot", { name: 'content' }))), this.enableAction && (h("p-button", { key: '3622337e6595749610b400498a5c8860adc9ab32', variant: 'secondary', iconOnly: true, size: 'sm', icon: this.actionIcon, iconFlip: this.actionIconFlip, iconRotate: this.actionIconRotate, class: 'flex-shrink-0' }))));
+        return (h(Host, { key: '8037040911805538a87e382891c638dc02b60206', class: `p-toast variant-${this.variant}`, onClick: () => this._onClick() }, h("div", { key: '3d62bfbdc62f0aad9f0b2aa399b881498328329c', class: 'flex w-full min-w-0 flex-col' }, h("p", { key: '6025fc8d67bdaeff8e43ae6b65aed1c12a42a107', class: 'font-semibold text-storm' }, this.header?.length ? this.header : h("slot", { name: 'header' })), h("p", { key: '39b41b1033a0b4eaaca958949556cae1037d0019', class: 'w-full text-sm text-storm-medium' }, this.content?.length ? this.content : h("slot", { name: 'content' }))), this.enableAction && (h("p-button", { key: '0b58b68d606925c26007d2e00437a3e2c69bfd0f', variant: 'secondary', iconOnly: true, size: 'sm', icon: this.actionIcon, iconFlip: this.actionIconFlip, iconRotate: this.actionIconRotate, class: 'flex-shrink-0' }))));
     }
     _onClick() {
         if (this.enableAction) {

package/dist/collection/components/organisms/navbar/navbar.component.js

@@ -44,7 +44,7 @@ export class Navbar {
         this._show = false;
     }
     render() {
-        return (h(Host, { key: '933b55e6875b50546cd980e5c4f7c923cd6cbd11', class: 'p-navbar w-full max-h-screen-safe layout-1280:w-60 layout-1680:w-72' }, h("p-backdrop", { key: '9fb8220b757a0571b77620f394b92fe78d578ba5', class: backdrop({ show: this._show }), scrollLock: this._show, onClicked: () => (this._show = false) }), h("div", { key: 'c24c80eca5ec18ee39df438c591e55ff683a9c06', class: sidebar({ class: sidebarAndTopbar(), show: this._show }) }, h("div", { key: '6338aee239fa25bef1555f5b085d0682c8122c94', class: 'flex w-full items-center justify-between layout-1280:hidden' }, h("p-button", { key: '7768db8078e996b9b0d08a38d7a63329513d4d7b', variant: 'secondary', icon: 'menu-arrow', iconFlip: 'horizontal', iconOnly: true, size: 'sm', onClick: () => (this._show = false) })), h("div", { key: 'b736053b767173fe3da99b1c270ce95eff3376fd', class: 'flex w-full flex-col items-stretch' }, h("slot", { key: '570c7aab38574229bf5f118c7b8196cc93b69992', name: 'company' })), h("div", { key: 'e0d69dc2869eda05e854eb167d72436412669978', class: 'flex w-full flex-col gap-6 overflow-y-auto' }, h("slot", { key: '02e79fdd87b22514e602fa8ace2b4091dde7126a', name: 'content' })), h("div", { key: 'dc66843c8beabbbcb21b1e3c937192b2dba656d2', class: 'mt-auto hidden w-full flex-col layout-1280:flex' }, h("slot", { key: 'b08ed35bb831aa4bc6076a4d5b4d5d1fb4c960d3', name: 'user' }))), h("div", { key: 'b15ae515d4872501b143aa3dc30d40e7004da088', class: topbar({ class: sidebarAndTopbar() }) }, h("p-button", { key: '96628a7f7741fc9d71d68e1744e727a95dec9552', variant: 'secondary', iconOnly: true, icon: 'menu-arrow', size: 'sm', onClick: () => (this._show = true) }), h("slot", { key: '22a596e750b0541a9dabf0d9857c294d77acea58', name: 'topbar' }))));
+        return (h(Host, { key: '5702b79e2c26e706ad4101b89f53de842fcb80b6', class: 'p-navbar w-full max-h-screen-safe layout-1280:w-60 layout-1680:w-72' }, h("p-backdrop", { key: 'c5fa86a7922261ce0c52a30f397a912da999b705', class: backdrop({ show: this._show }), scrollLock: this._show, onClicked: () => (this._show = false) }), h("div", { key: 'cea2c0276187ee5e86eea96879774d34d4439828', class: sidebar({ class: sidebarAndTopbar(), show: this._show }) }, h("div", { key: '7da029ff6de0ce27e5652a2995e1350384a0c83f', class: 'flex w-full items-center justify-between layout-1280:hidden' }, h("p-button", { key: '5bd366656745c2998e979bfb4650e17290c3e288', variant: 'secondary', icon: 'menu-arrow', iconFlip: 'horizontal', iconOnly: true, size: 'sm', onClick: () => (this._show = false) })), h("div", { key: '5fc3e1b70f45905c8a6dfbf85251a5edc8571b78', class: 'flex w-full flex-col items-stretch' }, h("slot", { key: '99f3a9c3bcf2f53b1bb69c14fd30d8f3dd850a23', name: 'company' })), h("div", { key: '47dbf4bb5cde7b785401df9584ed6ae155329be1', class: 'flex w-full flex-col gap-6 overflow-y-auto' }, h("slot", { key: '8220bc3836bb64fe353d1585003d005cb5c04bd4', name: 'content' })), h("div", { key: 'a04e5098279b15f9526fcba60ce000e552d6b3b4', class: 'mt-auto hidden w-full flex-col layout-1280:flex' }, h("slot", { key: '6902b1780e7e8e9642caa22e467adc938c335c2c', name: 'user' }))), h("div", { key: '54e624bd9bed375fe496a7ebb0ea26a92c6cf5f5', class: topbar({ class: sidebarAndTopbar() }) }, h("p-button", { key: '8b8df57e642e4e4fdc1848271c8104f3489ad269', variant: 'secondary', iconOnly: true, icon: 'menu-arrow', size: 'sm', onClick: () => (this._show = true) }), h("slot", { key: 'ea415e56ec47a30ca4005d0c138f2c6bdc7abf22', name: 'topbar' }))));
     }
     handleCloseNavbar() {
         this._show = false;

package/dist/components/field.component.js

@@ -124,6 +124,7 @@ const Field = /*@__PURE__*/ proxyCustomElement(class Field extends HTMLElement {
         this.placeholder = undefined;
         this.helper = undefined;
         this.required = true;
+        this.autofocus = false;
         this.error = undefined;
         this.errorPlacement = undefined;
         this.disabled = false;
@@ -144,18 +145,21 @@ const Field = /*@__PURE__*/ proxyCustomElement(class Field extends HTMLElement {
     inputRefChange;
     get _el() { return this; }
     _inputRef;
+    componentDidLoad() {
+        this._checkAutoFocus();
+    }
     render() {
         const { prefix, suffix, hasHeaderSlot, hasLabelSlot, hasHelperSlot, hasErrorSlot, } = this._getSlotInfo();
-        return (h(Host, { key: '6ee18d3003f95e306599804827d24bccb869fbac', class: 'p-field' }, h("p-field-container", { key: '253178a1a1f9d85dc5a2515d7daa3bdec3756685', forceShowTooltip: this.forceShowTooltip || this._focused, label: this.label, helper: this.helper, error: this.error, required: this.required }, hasLabelSlot && (h("slot", { key: '9ae351e4b130f2097c459889614d627426eb73f1', name: 'label', slot: 'label' })), hasHeaderSlot && (h("slot", { key: '06b232eb4d1101e51027b1fcb296076252ec73da', name: 'header', slot: 'header' })), hasHelperSlot && (h("slot", { key: '28bae575c273efc6373d30d80a403508bac4b5f5', name: 'helper', slot: 'helper' })), hasErrorSlot && (h("slot", { key: '9c43b918c2b1901f1e374f300d6189cb31608ecb', name: 'error', slot: 'error' })), h("div", { key: 'e170a99bfbc5fa17c9c4465051219132360a8c3d', class: field({
+        return (h(Host, { key: 'cf990118b7fb2b397a4ed1d00026893fb5d65651', class: 'p-field' }, h("p-field-container", { key: '8957ddbafafbe9be741359ae9c4265bb5c2ab08d', forceShowTooltip: this.forceShowTooltip || this._focused, label: this.label, helper: this.helper, error: this.error, required: this.required }, hasLabelSlot && (h("slot", { key: 'f60081c6a1485f8066715a2e422ea5903f0963a8', name: 'label', slot: 'label' })), hasHeaderSlot && (h("slot", { key: 'e4b78626d1a79acb5b95692158b5809a4b24dd63', name: 'header', slot: 'header' })), hasHelperSlot && (h("slot", { key: '4346e4bc124d1de2ceb4ee4005eb9b661bf677dd', name: 'helper', slot: 'helper' })), hasErrorSlot && (h("slot", { key: '6d0408efce0e27da7d14dfb4aa9fffb38d3b927a', name: 'error', slot: 'error' })), h("div", { key: 'cf6aed5c63d0652a7fa0ca66c562a7c79d57dafa', 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')) && (h("div", { key: 'ecf1fb9ec811e26c4123f97f5ba18d6cbc07750b', class: prefixAndSuffic({
+            }), slot: 'content' }, (prefix || (this.icon && this.iconPosition === 'start')) && (h("div", { key: 'fb6c0aa6cebc783dc15a44462bc04e89fcd13f13', class: prefixAndSuffic({
                 error: !!this.error?.length,
                 disabled: this.disabled,
                 focused: this.focused || this._focused,
-            }), onClick: () => this._focusInput() }, this.icon && this.iconPosition === 'start' ? (h("p-icon", { class: 'flex', variant: this.icon, rotate: this.iconRotate, flip: this.iconFlip })) : (prefix))), this._getInput(), (suffix || (this.icon && this.iconPosition === 'end')) && (h("div", { key: 'fb6fcf5c393812d91b01cdb7ebb5bd74767656be', class: prefixAndSuffic({
+            }), onClick: () => this._focusInput() }, this.icon && this.iconPosition === 'start' ? (h("p-icon", { class: 'flex', variant: this.icon, rotate: this.iconRotate, flip: this.iconFlip })) : (prefix))), this._getInput(), (suffix || (this.icon && this.iconPosition === 'end')) && (h("div", { key: '2822280cb543d2315d062b00b52729f1603b8c6f', class: prefixAndSuffic({
                 error: !!this.error?.length,
                 disabled: this.disabled,
                 focused: this.focused || this._focused,
@@ -241,6 +245,16 @@ const Field = /*@__PURE__*/ proxyCustomElement(class Field extends HTMLElement {
         this.value = value;
         this.valueChange.emit(value);
     }
+    _checkAutoFocus() {
+        if (!this.autofocus) {
+            return;
+        }
+        if (!this._inputRef) {
+            setTimeout(() => this._checkAutoFocus(), 100);
+            return;
+        }
+        this._focusInput();
+    }
     static get style() { return PFieldStyle0; }
 }, [1, "p-field", {
         "size": [1],
@@ -257,6 +271,7 @@ const Field = /*@__PURE__*/ proxyCustomElement(class Field extends HTMLElement {
         "placeholder": [1],
         "helper": [1],
         "required": [516],
+        "autofocus": [516],
         "error": [513],
         "errorPlacement": [1, "error-placement"],
         "disabled": [516],

package/dist/components/field.component.js.map

@@ -1 +1 @@
-{"file":"field.component.js","mappings":"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","names":[],"sources":["src/components/molecules/field/field.component.css?tag=p-field&encapsulation=shadow","src/components/molecules/field/field.component.tsx"],"sourcesContent":["","import { Placement } from '@floating-ui/dom';\nimport {\n\tComponent,\n\tElement,\n\tEvent,\n\tEventEmitter,\n\th,\n\tHost,\n\tListen,\n\tProp,\n\tState,\n} from '@stencil/core';\nimport { cva } from 'class-variance-authority';\nimport { HTMLInputTypeAttribute } from 'react';\nimport { RotateOptions } from '../../../types/tailwind';\nimport { IconFlipOptions, IconVariant } from '../../atoms/icon/icon.component';\nimport { templateFunc } from '../field-container/field-container.component';\n\nconst field = cva(\n\t['flex gap-2', 'w-inherit px-2', 'border border-solid rounded-lg'],\n\t{\n\t\tvariants: {\n\t\t\tsize: {\n\t\t\t\tsm: 'h-6',\n\t\t\t\tbase: 'h-8',\n\t\t\t},\n\t\t\tdisabled: {\n\t\t\t\tfalse: 'bg-white',\n\t\t\t\ttrue: 'bg-white-600 cursor-not-allowed',\n\t\t\t},\n\t\t\tfocused: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: null,\n\t\t\t},\n\t\t\terror: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: null,\n\t\t\t},\n\t\t},\n\t\tcompoundVariants: [\n\t\t\t{\n\t\t\t\tfocused: false,\n\t\t\t\terror: false,\n\t\t\t\tclass: 'border-black-teal-100',\n\t\t\t},\n\t\t\t{\n\t\t\t\tdisabled: false,\n\t\t\t\tfocused: true,\n\t\t\t\terror: false,\n\t\t\t\tclass:\n\t\t\t\t\t'border-supportive-lilac-800 ring ring-supportive-lilac-100 selection:bg-supportive-lilac',\n\t\t\t},\n\n\t\t\t{\n\t\t\t\tdisabled: false,\n\t\t\t\terror: true,\n\t\t\t\tclass: 'border-negative-red',\n\t\t\t},\n\t\t\t{\n\t\t\t\tdisabled: false,\n\t\t\t\tfocused: true,\n\t\t\t\terror: true,\n\t\t\t\tclass: 'ring ring-negative-red-50 selection:bg-negative-red-50',\n\t\t\t},\n\t\t],\n\t}\n);\n\nconst input = cva(\n\t'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',\n\t{\n\t\tvariants: {\n\t\t\tdisabled: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: 'cursor-not-allowed',\n\t\t\t},\n\t\t},\n\t}\n);\n\nconst prefixAndSuffic = cva(\n\t['flex flex-shrink-0 justify-center items-center text-center'],\n\t{\n\t\tvariants: {\n\t\t\tdisabled: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: 'text-black-teal-100',\n\t\t\t},\n\t\t\tfocused: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: null,\n\t\t\t},\n\t\t\terror: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: null,\n\t\t\t},\n\t\t},\n\t\tcompoundVariants: [\n\t\t\t{\n\t\t\t\tdisabled: false,\n\t\t\t\tfocused: false,\n\t\t\t\terror: false,\n\t\t\t\tclass: 'text-black-teal-300',\n\t\t\t},\n\n\t\t\t{\n\t\t\t\tdisabled: false,\n\t\t\t\tfocused: true,\n\t\t\t\terror: false,\n\t\t\t\tclass: 'text-black-teal-500',\n\t\t\t},\n\n\t\t\t{\n\t\t\t\tdisabled: false,\n\t\t\t\tfocused: false,\n\t\t\t\terror: true,\n\t\t\t\tclass: 'text-negative-red',\n\t\t\t},\n\n\t\t\t{\n\t\t\t\tdisabled: false,\n\t\t\t\tfocused: true,\n\t\t\t\terror: true,\n\t\t\t\tclass: 'text-negative-red-800',\n\t\t\t},\n\t\t],\n\t}\n);\n\n@Component({\n\ttag: 'p-field',\n\tstyleUrl: './field.component.css',\n\tshadow: true,\n})\nexport class Field {\n\t/**\n\t * The size of the input group\n\t */\n\t@Prop() size: 'sm' | 'base' = 'base';\n\n\t/**\n\t * The type of the input group\n\t */\n\t@Prop() type: HTMLInputTypeAttribute | 'textarea' | 'slot' = 'text';\n\n\t/**\n\t * The size of the input group\n\t */\n\t@Prop() properties: any | string = {};\n\n\t/**\n\t * The prefix of the input group\n\t */\n\t@Prop() prefix: string;\n\n\t/**\n\t * The suffix of the input group\n\t */\n\t@Prop() suffix: string;\n\n\t/**\n\t * Icon of the input group\n\t */\n\t@Prop() icon: IconVariant;\n\n\t/**\n\t * Icon flip */\n\t@Prop() iconFlip: IconFlipOptions;\n\n\t/**\n\t * Icon rotate\n\t */\n\t@Prop() iconRotate: RotateOptions;\n\n\t/**\n\t * Icon position\n\t */\n\t@Prop() iconPosition: 'start' | 'end' = 'start';\n\n\t/**\n\t * The value of the input\n\t */\n\t@Prop() value: string;\n\n\t/**\n\t * The label of the input group\n\t */\n\t@Prop() label: string;\n\n\t/**\n\t * The placeholder of the input\n\t */\n\t@Prop() placeholder: string;\n\n\t/**\n\t * The helper of the input group\n\t */\n\t@Prop() helper: string;\n\n\t/**\n\t * Wether the field is required\n\t */\n\t@Prop({ reflect: true }) required: boolean = true;\n\n\t/**\n\t * The error to display\n\t */\n\t@Prop({ reflect: true }) error: string;\n\n\t/**\n\t * The placement of the error popover\n\t */\n\t@Prop() errorPlacement: Placement;\n\n\t/**\n\t * Wether the input group is disabled\n\t */\n\t@Prop({ reflect: true }) disabled: boolean = false;\n\n\t/**\n\t * Wether the input group is focused\n\t */\n\t@Prop({ reflect: true }) focused: boolean = false;\n\n\t/**\n\t * Force show the error tooltip\n\t */\n\t@Prop({ reflect: true }) forceShowTooltip: boolean = false;\n\n\t/**\n\t * Wether to select all text on focus\n\t */\n\t@Prop({ reflect: true }) selectAllOnFocus: boolean = true;\n\n\t/**\n\t * The method to use when focusing the input\n\t */\n\t@Prop() focusMethod: 'focus' | 'click' = 'focus';\n\n\t/**\n\t * The template for the optional text\n\t */\n\t@Prop() optionalTemplate: templateFunc;\n\n\t/**\n\t * Event whenever the value changes\n\t */\n\t@Event() valueChange: EventEmitter<string>;\n\n\t/**\n\t * Event whenever the input ref changes\n\t */\n\t@Event() inputRefChange: EventEmitter<HTMLInputElement | HTMLTextAreaElement>;\n\n\t/**\n\t * The host element\n\t */\n\t@Element() private _el: HTMLElement;\n\n\t@State() private _focused = false;\n\n\tprivate _inputRef: HTMLInputElement | HTMLTextAreaElement;\n\n\trender() {\n\t\tconst {\n\t\t\tprefix,\n\t\t\tsuffix,\n\t\t\thasHeaderSlot,\n\t\t\thasLabelSlot,\n\t\t\thasHelperSlot,\n\t\t\thasErrorSlot,\n\t\t} = this._getSlotInfo();\n\n\t\treturn (\n\t\t\t<Host class='p-field'>\n\t\t\t\t<p-field-container\n\t\t\t\t\tforceShowTooltip={this.forceShowTooltip || this._focused}\n\t\t\t\t\tlabel={this.label}\n\t\t\t\t\thelper={this.helper}\n\t\t\t\t\terror={this.error}\n\t\t\t\t\trequired={this.required}\n\t\t\t\t>\n\t\t\t\t\t{hasLabelSlot && (\n\t\t\t\t\t\t<slot\n\t\t\t\t\t\t\tname='label'\n\t\t\t\t\t\t\tslot='label'\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{hasHeaderSlot && (\n\t\t\t\t\t\t<slot\n\t\t\t\t\t\t\tname='header'\n\t\t\t\t\t\t\tslot='header'\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{hasHelperSlot && (\n\t\t\t\t\t\t<slot\n\t\t\t\t\t\t\tname='helper'\n\t\t\t\t\t\t\tslot='helper'\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{hasErrorSlot && (\n\t\t\t\t\t\t<slot\n\t\t\t\t\t\t\tname='error'\n\t\t\t\t\t\t\tslot='error'\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\n\t\t\t\t\t<div\n\t\t\t\t\t\tclass={field({\n\t\t\t\t\t\t\terror: !!this.error?.length,\n\t\t\t\t\t\t\tdisabled: this.disabled,\n\t\t\t\t\t\t\tfocused: this.focused || this._focused,\n\t\t\t\t\t\t\tsize: this.size,\n\t\t\t\t\t\t})}\n\t\t\t\t\t\tslot='content'\n\t\t\t\t\t>\n\t\t\t\t\t\t{(prefix || (this.icon && this.iconPosition === 'start')) && (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclass={prefixAndSuffic({\n\t\t\t\t\t\t\t\t\terror: !!this.error?.length,\n\t\t\t\t\t\t\t\t\tdisabled: this.disabled,\n\t\t\t\t\t\t\t\t\tfocused: this.focused || this._focused,\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\tonClick={() => this._focusInput()}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{this.icon && this.iconPosition === 'start' ? (\n\t\t\t\t\t\t\t\t\t<p-icon\n\t\t\t\t\t\t\t\t\t\tclass='flex'\n\t\t\t\t\t\t\t\t\t\tvariant={this.icon}\n\t\t\t\t\t\t\t\t\t\trotate={this.iconRotate}\n\t\t\t\t\t\t\t\t\t\tflip={this.iconFlip}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\tprefix\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{this._getInput()}\n\n\t\t\t\t\t\t{(suffix || (this.icon && this.iconPosition === 'end')) && (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclass={prefixAndSuffic({\n\t\t\t\t\t\t\t\t\terror: !!this.error?.length,\n\t\t\t\t\t\t\t\t\tdisabled: this.disabled,\n\t\t\t\t\t\t\t\t\tfocused: this.focused || this._focused,\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\tonClick={() => this._focusInput()}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{this.icon && this.iconPosition === 'end' ? (\n\t\t\t\t\t\t\t\t\t<p-icon\n\t\t\t\t\t\t\t\t\t\tclass='flex'\n\t\t\t\t\t\t\t\t\t\tvariant={this.icon}\n\t\t\t\t\t\t\t\t\t\trotate={this.iconRotate}\n\t\t\t\t\t\t\t\t\t\tflip={this.iconFlip}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\tsuffix\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</p-field-container>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t@Listen('focusin')\n\thandleFocusIn() {\n\t\tif (this.disabled) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._focused = true;\n\t\tthis._selectAll();\n\t}\n\n\t@Listen('focusout')\n\thandleFocusOut() {\n\t\tif (this.disabled) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._focused = false;\n\t}\n\n\tprivate _getSlotInfo() {\n\t\tconst hasHelperSlot = !!this._el.querySelector(':scope > [slot=\"helper\"]');\n\t\tconst hasLabelSlot = !!this._el.querySelector(':scope > [slot=\"label\"]');\n\t\tconst hasPrefixSlot = !!this._el.querySelector(':scope > [slot=\"prefix\"]');\n\t\tconst hasSuffixSlot = !!this._el.querySelector(':scope > [slot=\"suffix\"]');\n\t\tconst hasHeaderSlot = !!this._el.querySelector(':scope > [slot=\"header\"]');\n\t\tconst hasErrorSlot = !!this._el.querySelector(':scope > [slot=\"error\"]');\n\n\t\tconst prefix = hasPrefixSlot ? <slot name='prefix' /> : this.prefix;\n\t\tconst suffix = hasSuffixSlot ? <slot name='suffix' /> : this.suffix;\n\n\t\tconst errorAndErrorIsNotBoolean =\n\t\t\tthis.error && typeof this.error === 'string' && this.error !== 'true';\n\n\t\treturn {\n\t\t\thasHelperSlot,\n\t\t\thasLabelSlot,\n\t\t\thasPrefixSlot,\n\t\t\thasSuffixSlot,\n\t\t\thasHeaderSlot,\n\t\t\thasErrorSlot,\n\t\t\tprefix,\n\t\t\tsuffix,\n\t\t\terrorAndErrorIsNotBoolean,\n\t\t};\n\t}\n\n\tprivate _getInput() {\n\t\tif (this.type === 'custom') {\n\t\t\treturn <slot name='input' />;\n\t\t}\n\n\t\tconst props = {\n\t\t\tclass: input({\n\t\t\t\tdisabled: this.disabled,\n\t\t\t}),\n\t\t\tvalue: this.value,\n\t\t\tplaceholder: this.placeholder,\n\t\t\tdisabled: this.disabled,\n\t\t\tonInput: (ev: Event) => this._valueChange(ev),\n\t\t};\n\n\t\tlet properties = this.properties ?? {};\n\t\tif (typeof properties === 'string') {\n\t\t\tproperties = JSON.parse(this.properties);\n\t\t}\n\n\t\tif (this.type === 'textarea') {\n\t\t\t<textarea\n\t\t\t\tref={ref => this._setInputRef(ref)}\n\t\t\t\t{...props}\n\t\t\t\t{...properties}\n\t\t\t/>;\n\t\t}\n\n\t\treturn (\n\t\t\t<input\n\t\t\t\ttype={this.type}\n\t\t\t\tref={ref => this._setInputRef(ref)}\n\t\t\t\t{...props}\n\t\t\t\t{...properties}\n\t\t\t/>\n\t\t);\n\t}\n\n\tprivate _setInputRef(ref: HTMLInputElement | HTMLTextAreaElement) {\n\t\tthis._inputRef = ref;\n\t\tthis.inputRefChange.emit(ref);\n\t}\n\n\tprivate _focusInput() {\n\t\tif (this._inputRef) {\n\t\t\tthis._inputRef.focus();\n\t\t\treturn;\n\t\t}\n\n\t\tconst input = this._el.querySelector(':scope > [slot=\"input\"]');\n\t\t(input as HTMLElement)[this.focusMethod]();\n\t}\n\n\tprivate _selectAll() {\n\t\tif (!this._inputRef || !this.selectAllOnFocus) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._inputRef.select();\n\t}\n\n\tprivate _valueChange(ev) {\n\t\tconst value = (ev.target as HTMLTextAreaElement | HTMLInputElement).value;\n\t\tthis.value = value;\n\t\tthis.valueChange.emit(value);\n\t}\n}\n"],"version":3}
+{"file":"field.component.js","mappings":"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","names":[],"sources":["src/components/molecules/field/field.component.css?tag=p-field&encapsulation=shadow","src/components/molecules/field/field.component.tsx"],"sourcesContent":["","import { Placement } from '@floating-ui/dom';\nimport {\n\tComponent,\n\tElement,\n\tEvent,\n\tEventEmitter,\n\th,\n\tHost,\n\tListen,\n\tProp,\n\tState,\n} from '@stencil/core';\nimport { cva } from 'class-variance-authority';\nimport { HTMLInputTypeAttribute } from 'react';\nimport { RotateOptions } from '../../../types/tailwind';\nimport { IconFlipOptions, IconVariant } from '../../atoms/icon/icon.component';\nimport { templateFunc } from '../field-container/field-container.component';\n\nconst field = cva(\n\t['flex gap-2', 'w-inherit px-2', 'border border-solid rounded-lg'],\n\t{\n\t\tvariants: {\n\t\t\tsize: {\n\t\t\t\tsm: 'h-6',\n\t\t\t\tbase: 'h-8',\n\t\t\t},\n\t\t\tdisabled: {\n\t\t\t\tfalse: 'bg-white',\n\t\t\t\ttrue: 'bg-white-600 cursor-not-allowed',\n\t\t\t},\n\t\t\tfocused: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: null,\n\t\t\t},\n\t\t\terror: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: null,\n\t\t\t},\n\t\t},\n\t\tcompoundVariants: [\n\t\t\t{\n\t\t\t\tfocused: false,\n\t\t\t\terror: false,\n\t\t\t\tclass: 'border-black-teal-100',\n\t\t\t},\n\t\t\t{\n\t\t\t\tdisabled: false,\n\t\t\t\tfocused: true,\n\t\t\t\terror: false,\n\t\t\t\tclass:\n\t\t\t\t\t'border-supportive-lilac-800 ring ring-supportive-lilac-100 selection:bg-supportive-lilac',\n\t\t\t},\n\n\t\t\t{\n\t\t\t\tdisabled: false,\n\t\t\t\terror: true,\n\t\t\t\tclass: 'border-negative-red',\n\t\t\t},\n\t\t\t{\n\t\t\t\tdisabled: false,\n\t\t\t\tfocused: true,\n\t\t\t\terror: true,\n\t\t\t\tclass: 'ring ring-negative-red-50 selection:bg-negative-red-50',\n\t\t\t},\n\t\t],\n\t}\n);\n\nconst input = cva(\n\t'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',\n\t{\n\t\tvariants: {\n\t\t\tdisabled: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: 'cursor-not-allowed',\n\t\t\t},\n\t\t},\n\t}\n);\n\nconst prefixAndSuffic = cva(\n\t['flex flex-shrink-0 justify-center items-center text-center'],\n\t{\n\t\tvariants: {\n\t\t\tdisabled: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: 'text-black-teal-100',\n\t\t\t},\n\t\t\tfocused: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: null,\n\t\t\t},\n\t\t\terror: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: null,\n\t\t\t},\n\t\t},\n\t\tcompoundVariants: [\n\t\t\t{\n\t\t\t\tdisabled: false,\n\t\t\t\tfocused: false,\n\t\t\t\terror: false,\n\t\t\t\tclass: 'text-black-teal-300',\n\t\t\t},\n\n\t\t\t{\n\t\t\t\tdisabled: false,\n\t\t\t\tfocused: true,\n\t\t\t\terror: false,\n\t\t\t\tclass: 'text-black-teal-500',\n\t\t\t},\n\n\t\t\t{\n\t\t\t\tdisabled: false,\n\t\t\t\tfocused: false,\n\t\t\t\terror: true,\n\t\t\t\tclass: 'text-negative-red',\n\t\t\t},\n\n\t\t\t{\n\t\t\t\tdisabled: false,\n\t\t\t\tfocused: true,\n\t\t\t\terror: true,\n\t\t\t\tclass: 'text-negative-red-800',\n\t\t\t},\n\t\t],\n\t}\n);\n\n@Component({\n\ttag: 'p-field',\n\tstyleUrl: './field.component.css',\n\tshadow: true,\n})\nexport class Field {\n\t/**\n\t * The size of the input group\n\t */\n\t@Prop() size: 'sm' | 'base' = 'base';\n\n\t/**\n\t * The type of the input group\n\t */\n\t@Prop() type: HTMLInputTypeAttribute | 'textarea' | 'slot' = 'text';\n\n\t/**\n\t * The size of the input group\n\t */\n\t@Prop() properties: any | string = {};\n\n\t/**\n\t * The prefix of the input group\n\t */\n\t@Prop() prefix: string;\n\n\t/**\n\t * The suffix of the input group\n\t */\n\t@Prop() suffix: string;\n\n\t/**\n\t * Icon of the input group\n\t */\n\t@Prop() icon: IconVariant;\n\n\t/**\n\t * Icon flip */\n\t@Prop() iconFlip: IconFlipOptions;\n\n\t/**\n\t * Icon rotate\n\t */\n\t@Prop() iconRotate: RotateOptions;\n\n\t/**\n\t * Icon position\n\t */\n\t@Prop() iconPosition: 'start' | 'end' = 'start';\n\n\t/**\n\t * The value of the input\n\t */\n\t@Prop() value: string;\n\n\t/**\n\t * The label of the input group\n\t */\n\t@Prop() label: string;\n\n\t/**\n\t * The placeholder of the input\n\t */\n\t@Prop() placeholder: string;\n\n\t/**\n\t * The helper of the input group\n\t */\n\t@Prop() helper: string;\n\n\t/**\n\t * Wether the field is required\n\t */\n\t@Prop({ reflect: true }) required: boolean = true;\n\n\t/**\n\t * Wether to autofocus the field\n\t */\n\t@Prop({ reflect: true }) autofocus: boolean = false;\n\n\t/**\n\t * The error to display\n\t */\n\t@Prop({ reflect: true }) error: string;\n\n\t/**\n\t * The placement of the error popover\n\t */\n\t@Prop() errorPlacement: Placement;\n\n\t/**\n\t * Wether the input group is disabled\n\t */\n\t@Prop({ reflect: true }) disabled: boolean = false;\n\n\t/**\n\t * Wether the input group is focused\n\t */\n\t@Prop({ reflect: true }) focused: boolean = false;\n\n\t/**\n\t * Force show the error tooltip\n\t */\n\t@Prop({ reflect: true }) forceShowTooltip: boolean = false;\n\n\t/**\n\t * Wether to select all text on focus\n\t */\n\t@Prop({ reflect: true }) selectAllOnFocus: boolean = true;\n\n\t/**\n\t * The method to use when focusing the input\n\t */\n\t@Prop() focusMethod: 'focus' | 'click' = 'focus';\n\n\t/**\n\t * The template for the optional text\n\t */\n\t@Prop() optionalTemplate: templateFunc;\n\n\t/**\n\t * Event whenever the value changes\n\t */\n\t@Event() valueChange: EventEmitter<string>;\n\n\t/**\n\t * Event whenever the input ref changes\n\t */\n\t@Event() inputRefChange: EventEmitter<HTMLInputElement | HTMLTextAreaElement>;\n\n\t/**\n\t * The host element\n\t */\n\t@Element() private _el: HTMLElement;\n\n\t@State() private _focused = false;\n\n\tprivate _inputRef: HTMLInputElement | HTMLTextAreaElement;\n\n\tcomponentDidLoad() {\n\t\tthis._checkAutoFocus();\n\t}\n\n\trender() {\n\t\tconst {\n\t\t\tprefix,\n\t\t\tsuffix,\n\t\t\thasHeaderSlot,\n\t\t\thasLabelSlot,\n\t\t\thasHelperSlot,\n\t\t\thasErrorSlot,\n\t\t} = this._getSlotInfo();\n\n\t\treturn (\n\t\t\t<Host class='p-field'>\n\t\t\t\t<p-field-container\n\t\t\t\t\tforceShowTooltip={this.forceShowTooltip || this._focused}\n\t\t\t\t\tlabel={this.label}\n\t\t\t\t\thelper={this.helper}\n\t\t\t\t\terror={this.error}\n\t\t\t\t\trequired={this.required}\n\t\t\t\t>\n\t\t\t\t\t{hasLabelSlot && (\n\t\t\t\t\t\t<slot\n\t\t\t\t\t\t\tname='label'\n\t\t\t\t\t\t\tslot='label'\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{hasHeaderSlot && (\n\t\t\t\t\t\t<slot\n\t\t\t\t\t\t\tname='header'\n\t\t\t\t\t\t\tslot='header'\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{hasHelperSlot && (\n\t\t\t\t\t\t<slot\n\t\t\t\t\t\t\tname='helper'\n\t\t\t\t\t\t\tslot='helper'\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{hasErrorSlot && (\n\t\t\t\t\t\t<slot\n\t\t\t\t\t\t\tname='error'\n\t\t\t\t\t\t\tslot='error'\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\n\t\t\t\t\t<div\n\t\t\t\t\t\tclass={field({\n\t\t\t\t\t\t\terror: !!this.error?.length,\n\t\t\t\t\t\t\tdisabled: this.disabled,\n\t\t\t\t\t\t\tfocused: this.focused || this._focused,\n\t\t\t\t\t\t\tsize: this.size,\n\t\t\t\t\t\t})}\n\t\t\t\t\t\tslot='content'\n\t\t\t\t\t>\n\t\t\t\t\t\t{(prefix || (this.icon && this.iconPosition === 'start')) && (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclass={prefixAndSuffic({\n\t\t\t\t\t\t\t\t\terror: !!this.error?.length,\n\t\t\t\t\t\t\t\t\tdisabled: this.disabled,\n\t\t\t\t\t\t\t\t\tfocused: this.focused || this._focused,\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\tonClick={() => this._focusInput()}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{this.icon && this.iconPosition === 'start' ? (\n\t\t\t\t\t\t\t\t\t<p-icon\n\t\t\t\t\t\t\t\t\t\tclass='flex'\n\t\t\t\t\t\t\t\t\t\tvariant={this.icon}\n\t\t\t\t\t\t\t\t\t\trotate={this.iconRotate}\n\t\t\t\t\t\t\t\t\t\tflip={this.iconFlip}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\tprefix\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{this._getInput()}\n\n\t\t\t\t\t\t{(suffix || (this.icon && this.iconPosition === 'end')) && (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclass={prefixAndSuffic({\n\t\t\t\t\t\t\t\t\terror: !!this.error?.length,\n\t\t\t\t\t\t\t\t\tdisabled: this.disabled,\n\t\t\t\t\t\t\t\t\tfocused: this.focused || this._focused,\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\tonClick={() => this._focusInput()}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{this.icon && this.iconPosition === 'end' ? (\n\t\t\t\t\t\t\t\t\t<p-icon\n\t\t\t\t\t\t\t\t\t\tclass='flex'\n\t\t\t\t\t\t\t\t\t\tvariant={this.icon}\n\t\t\t\t\t\t\t\t\t\trotate={this.iconRotate}\n\t\t\t\t\t\t\t\t\t\tflip={this.iconFlip}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\tsuffix\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</p-field-container>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t@Listen('focusin')\n\thandleFocusIn() {\n\t\tif (this.disabled) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._focused = true;\n\t\tthis._selectAll();\n\t}\n\n\t@Listen('focusout')\n\thandleFocusOut() {\n\t\tif (this.disabled) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._focused = false;\n\t}\n\n\tprivate _getSlotInfo() {\n\t\tconst hasHelperSlot = !!this._el.querySelector(':scope > [slot=\"helper\"]');\n\t\tconst hasLabelSlot = !!this._el.querySelector(':scope > [slot=\"label\"]');\n\t\tconst hasPrefixSlot = !!this._el.querySelector(':scope > [slot=\"prefix\"]');\n\t\tconst hasSuffixSlot = !!this._el.querySelector(':scope > [slot=\"suffix\"]');\n\t\tconst hasHeaderSlot = !!this._el.querySelector(':scope > [slot=\"header\"]');\n\t\tconst hasErrorSlot = !!this._el.querySelector(':scope > [slot=\"error\"]');\n\n\t\tconst prefix = hasPrefixSlot ? <slot name='prefix' /> : this.prefix;\n\t\tconst suffix = hasSuffixSlot ? <slot name='suffix' /> : this.suffix;\n\n\t\tconst errorAndErrorIsNotBoolean =\n\t\t\tthis.error && typeof this.error === 'string' && this.error !== 'true';\n\n\t\treturn {\n\t\t\thasHelperSlot,\n\t\t\thasLabelSlot,\n\t\t\thasPrefixSlot,\n\t\t\thasSuffixSlot,\n\t\t\thasHeaderSlot,\n\t\t\thasErrorSlot,\n\t\t\tprefix,\n\t\t\tsuffix,\n\t\t\terrorAndErrorIsNotBoolean,\n\t\t};\n\t}\n\n\tprivate _getInput() {\n\t\tif (this.type === 'custom') {\n\t\t\treturn <slot name='input' />;\n\t\t}\n\n\t\tconst props = {\n\t\t\tclass: input({\n\t\t\t\tdisabled: this.disabled,\n\t\t\t}),\n\t\t\tvalue: this.value,\n\t\t\tplaceholder: this.placeholder,\n\t\t\tdisabled: this.disabled,\n\t\t\tonInput: (ev: Event) => this._valueChange(ev),\n\t\t};\n\n\t\tlet properties = this.properties ?? {};\n\t\tif (typeof properties === 'string') {\n\t\t\tproperties = JSON.parse(this.properties);\n\t\t}\n\n\t\tif (this.type === 'textarea') {\n\t\t\t<textarea\n\t\t\t\tref={ref => this._setInputRef(ref)}\n\t\t\t\t{...props}\n\t\t\t\t{...properties}\n\t\t\t/>;\n\t\t}\n\n\t\treturn (\n\t\t\t<input\n\t\t\t\ttype={this.type}\n\t\t\t\tref={ref => this._setInputRef(ref)}\n\t\t\t\t{...props}\n\t\t\t\t{...properties}\n\t\t\t/>\n\t\t);\n\t}\n\n\tprivate _setInputRef(ref: HTMLInputElement | HTMLTextAreaElement) {\n\t\tthis._inputRef = ref;\n\t\tthis.inputRefChange.emit(ref);\n\t}\n\n\tprivate _focusInput() {\n\t\tif (this._inputRef) {\n\t\t\tthis._inputRef.focus();\n\t\t\treturn;\n\t\t}\n\n\t\tconst input = this._el.querySelector(':scope > [slot=\"input\"]');\n\t\t(input as HTMLElement)[this.focusMethod]();\n\t}\n\n\tprivate _selectAll() {\n\t\tif (!this._inputRef || !this.selectAllOnFocus) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._inputRef.select();\n\t}\n\n\tprivate _valueChange(ev) {\n\t\tconst value = (ev.target as HTMLTextAreaElement | HTMLInputElement).value;\n\t\tthis.value = value;\n\t\tthis.valueChange.emit(value);\n\t}\n\n\tprivate _checkAutoFocus() {\n\t\tif (!this.autofocus) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (!this._inputRef) {\n\t\t\tsetTimeout(() => this._checkAutoFocus(), 100);\n\t\t\treturn;\n\t\t}\n\n\t\tthis._focusInput();\n\t}\n}\n"],"version":3}

package/dist/components/p-icon-deprecated.js

@@ -13,6 +13,9 @@ const Icon = /*@__PURE__*/ proxyCustomElement(class Icon extends HTMLElement {
         this.rotate = 0;
         this.flip = 'none';
     }
+    componentDidLoad() {
+        console.warn('[p-icon-deprecated] Deprecated, please use p-icon');
+    }
     render() {
         const icon = iconsDeprecated[this.variant];
         const styles = {
@@ -49,7 +52,7 @@ const Icon = /*@__PURE__*/ proxyCustomElement(class Icon extends HTMLElement {
             '-rotate-270': this.rotate === -270,
             '-rotate-315': this.rotate === -315,
         };
-        return (h(Host, { key: 'd277986b0f5d36dd8999eaca58e2e7740799f072', class: styles, innerHTML: icon }));
+        return (h(Host, { key: '5dea07a6c18881f4b6b0ff852886c7ef36819530', class: styles, innerHTML: icon }));
     }
     static get style() { return PIconDeprecatedStyle0; }
 }, [0, "p-icon-deprecated", {

package/dist/components/p-icon-deprecated.js.map

@@ -1 +1 @@
-{"file":"p-icon-deprecated.js","mappings":";;;AAAA,MAAM,gBAAgB,GAAG,g2HAAg2H,CAAC;AAC13H,8BAAe,gBAAgB;;MCWlB,IAAI;;;;;oBASgB,MAAM;sBAKN,CAAC;oBAKD,MAAM;;IAEtC,MAAM;QACL,MAAM,IAAI,GAAG,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAE3C,MAAM,MAAM,GAAG;YACd,aAAa,EAAE,IAAI;YACnB,WAAW,EAAE,IAAI,CAAC,IAAI,KAAK,MAAM;YACjC,UAAU,EAAE,IAAI,CAAC,IAAI,KAAK,KAAK;YAC/B,SAAS,EAAE,IAAI,CAAC,IAAI,KAAK,IAAI;YAC7B,SAAS,EAAE,IAAI,CAAC,IAAI,KAAK,IAAI;YAC7B,WAAW,EAAE,IAAI,CAAC,IAAI,KAAK,MAAM;YACjC,SAAS,EAAE,IAAI,CAAC,IAAI,KAAK,IAAI;YAC7B,SAAS,EAAE,IAAI,CAAC,IAAI,KAAK,IAAI;YAC7B,UAAU,EAAE,IAAI,CAAC,IAAI,KAAK,KAAK;YAC/B,UAAU,EAAE,IAAI,CAAC,IAAI,KAAK,KAAK;YAC/B,UAAU,EAAE,IAAI,CAAC,IAAI,KAAK,KAAK;YAC/B,SAAS,EAAE,CAAC,CAAC,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,IAAI,KAAK,MAAM;YAChD,cAAc,EAAE,IAAI,CAAC,IAAI,KAAK,YAAY;YAC1C,cAAc,EAAE,IAAI,CAAC,IAAI,KAAK,UAAU;YACxC,UAAU,EAAE,IAAI,CAAC,MAAM,KAAK,CAAC;YAC7B,WAAW,EAAE,IAAI,CAAC,MAAM,KAAK,EAAE;YAC/B,WAAW,EAAE,IAAI,CAAC,MAAM,KAAK,EAAE;YAC/B,WAAW,EAAE,IAAI,CAAC,MAAM,KAAK,EAAE;YAC/B,YAAY,EAAE,IAAI,CAAC,MAAM,KAAK,GAAG;YACjC,YAAY,EAAE,IAAI,CAAC,MAAM,KAAK,GAAG;YACjC,YAAY,EAAE,IAAI,CAAC,MAAM,KAAK,GAAG;YACjC,YAAY,EAAE,IAAI,CAAC,MAAM,KAAK,GAAG;YACjC,YAAY,EAAE,IAAI,CAAC,MAAM,KAAK,GAAG;YACjC,WAAW,EAAE,IAAI,CAAC,MAAM,KAAK,CAAC,CAAC;YAC/B,YAAY,EAAE,IAAI,CAAC,MAAM,KAAK,CAAC,EAAE;YACjC,YAAY,EAAE,IAAI,CAAC,MAAM,KAAK,CAAC,EAAE;YACjC,YAAY,EAAE,IAAI,CAAC,MAAM,KAAK,CAAC,EAAE;YACjC,aAAa,EAAE,IAAI,CAAC,MAAM,KAAK,CAAC,GAAG;YACnC,aAAa,EAAE,IAAI,CAAC,MAAM,KAAK,CAAC,GAAG;YACnC,aAAa,EAAE,IAAI,CAAC,MAAM,KAAK,CAAC,GAAG;YACnC,aAAa,EAAE,IAAI,CAAC,MAAM,KAAK,CAAC,GAAG;YACnC,aAAa,EAAE,IAAI,CAAC,MAAM,KAAK,CAAC,GAAG;SACnC,CAAC;QAEF,QACC,EAAC,IAAI,qDACJ,KAAK,EAAE,MAAM,EACb,SAAS,EAAE,IAAI,GACR,EACP;KACF;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/atoms/icon-deprecated/icon.component.scss?tag=p-icon-deprecated","src/components/atoms/icon-deprecated/icon.component.tsx"],"sourcesContent":[":host {\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\nimport { RotateOptions, TextSizeOptions } from '../../../types/tailwind';\nimport { iconsDeprecated } from '../../../utils/icons-deprecated';\nimport { IconFlipOptions } from '../icon/icon.component';\n\nexport type IconDeprecatedVariant = keyof typeof iconsDeprecated;\n\n@Component({\n\ttag: 'p-icon-deprecated',\n\tstyleUrl: 'icon.component.scss',\n\t// shadow: true,\n})\nexport class Icon {\n\t/**\n\t * The icon the be displayed\n\t */\n\t@Prop() variant!: IconDeprecatedVariant;\n\n\t/**\n\t * The size of the icon, using tailwind sizes\n\t */\n\t@Prop() size: TextSizeOptions = 'auto';\n\n\t/**\n\t * Wether to rotate the icon x degrees\n\t */\n\t@Prop() rotate: RotateOptions = 0;\n\n\t/**\n\t * Wether to flip the icon horizontally or vertically\n\t */\n\t@Prop() flip: IconFlipOptions = 'none';\n\n\trender() {\n\t\tconst icon = iconsDeprecated[this.variant];\n\n\t\tconst styles = {\n\t\t\t'p-icon flex': true,\n\t\t\t'text-auto': this.size === 'auto',\n\t\t\t'text-xxs': this.size === 'xxs',\n\t\t\t'text-xs': this.size === 'xs',\n\t\t\t'text-sm': this.size === 'sm',\n\t\t\t'text-base': this.size === 'base',\n\t\t\t'text-lg': this.size === 'lg',\n\t\t\t'text-xl': this.size === 'xl',\n\t\t\t'text-2xl': this.size === '2xl',\n\t\t\t'text-3xl': this.size === '3xl',\n\t\t\t'text-4xl': this.size === '4xl',\n\t\t\ttransform: !!this.rotate || this.flip !== 'none',\n\t\t\t'scale-x-flip': this.flip === 'horizontal',\n\t\t\t'scale-y-flip': this.flip === 'vertical',\n\t\t\t'rotate-0': this.rotate === 0,\n\t\t\t'rotate-25': this.rotate === 25,\n\t\t\t'rotate-45': this.rotate === 45,\n\t\t\t'rotate-90': this.rotate === 90,\n\t\t\t'rotate-135': this.rotate === 135,\n\t\t\t'rotate-180': this.rotate === 180,\n\t\t\t'rotate-225': this.rotate === 225,\n\t\t\t'rotate-270': this.rotate === 270,\n\t\t\t'rotate-315': this.rotate === 315,\n\t\t\t'-rotate-0': this.rotate === -0,\n\t\t\t'-rotate-25': this.rotate === -25,\n\t\t\t'-rotate-45': this.rotate === -45,\n\t\t\t'-rotate-90': this.rotate === -90,\n\t\t\t'-rotate-135': this.rotate === -135,\n\t\t\t'-rotate-180': this.rotate === -180,\n\t\t\t'-rotate-225': this.rotate === -225,\n\t\t\t'-rotate-270': this.rotate === -270,\n\t\t\t'-rotate-315': this.rotate === -315,\n\t\t};\n\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={styles}\n\t\t\t\tinnerHTML={icon}\n\t\t\t></Host>\n\t\t);\n\t}\n}\n"],"version":3}
+{"file":"p-icon-deprecated.js","mappings":";;;AAAA,MAAM,gBAAgB,GAAG,g2HAAg2H,CAAC;AAC13H,8BAAe,gBAAgB;;MCWlB,IAAI;;;;;oBASgB,MAAM;sBAKN,CAAC;oBAKD,MAAM;;IAEtC,gBAAgB;QACf,OAAO,CAAC,IAAI,CAAC,mDAAmD,CAAC,CAAC;KAClE;IAED,MAAM;QACL,MAAM,IAAI,GAAG,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAE3C,MAAM,MAAM,GAAG;YACd,aAAa,EAAE,IAAI;YACnB,WAAW,EAAE,IAAI,CAAC,IAAI,KAAK,MAAM;YACjC,UAAU,EAAE,IAAI,CAAC,IAAI,KAAK,KAAK;YAC/B,SAAS,EAAE,IAAI,CAAC,IAAI,KAAK,IAAI;YAC7B,SAAS,EAAE,IAAI,CAAC,IAAI,KAAK,IAAI;YAC7B,WAAW,EAAE,IAAI,CAAC,IAAI,KAAK,MAAM;YACjC,SAAS,EAAE,IAAI,CAAC,IAAI,KAAK,IAAI;YAC7B,SAAS,EAAE,IAAI,CAAC,IAAI,KAAK,IAAI;YAC7B,UAAU,EAAE,IAAI,CAAC,IAAI,KAAK,KAAK;YAC/B,UAAU,EAAE,IAAI,CAAC,IAAI,KAAK,KAAK;YAC/B,UAAU,EAAE,IAAI,CAAC,IAAI,KAAK,KAAK;YAC/B,SAAS,EAAE,CAAC,CAAC,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,IAAI,KAAK,MAAM;YAChD,cAAc,EAAE,IAAI,CAAC,IAAI,KAAK,YAAY;YAC1C,cAAc,EAAE,IAAI,CAAC,IAAI,KAAK,UAAU;YACxC,UAAU,EAAE,IAAI,CAAC,MAAM,KAAK,CAAC;YAC7B,WAAW,EAAE,IAAI,CAAC,MAAM,KAAK,EAAE;YAC/B,WAAW,EAAE,IAAI,CAAC,MAAM,KAAK,EAAE;YAC/B,WAAW,EAAE,IAAI,CAAC,MAAM,KAAK,EAAE;YAC/B,YAAY,EAAE,IAAI,CAAC,MAAM,KAAK,GAAG;YACjC,YAAY,EAAE,IAAI,CAAC,MAAM,KAAK,GAAG;YACjC,YAAY,EAAE,IAAI,CAAC,MAAM,KAAK,GAAG;YACjC,YAAY,EAAE,IAAI,CAAC,MAAM,KAAK,GAAG;YACjC,YAAY,EAAE,IAAI,CAAC,MAAM,KAAK,GAAG;YACjC,WAAW,EAAE,IAAI,CAAC,MAAM,KAAK,CAAC,CAAC;YAC/B,YAAY,EAAE,IAAI,CAAC,MAAM,KAAK,CAAC,EAAE;YACjC,YAAY,EAAE,IAAI,CAAC,MAAM,KAAK,CAAC,EAAE;YACjC,YAAY,EAAE,IAAI,CAAC,MAAM,KAAK,CAAC,EAAE;YACjC,aAAa,EAAE,IAAI,CAAC,MAAM,KAAK,CAAC,GAAG;YACnC,aAAa,EAAE,IAAI,CAAC,MAAM,KAAK,CAAC,GAAG;YACnC,aAAa,EAAE,IAAI,CAAC,MAAM,KAAK,CAAC,GAAG;YACnC,aAAa,EAAE,IAAI,CAAC,MAAM,KAAK,CAAC,GAAG;YACnC,aAAa,EAAE,IAAI,CAAC,MAAM,KAAK,CAAC,GAAG;SACnC,CAAC;QAEF,QACC,EAAC,IAAI,qDACJ,KAAK,EAAE,MAAM,EACb,SAAS,EAAE,IAAI,GACR,EACP;KACF;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/atoms/icon-deprecated/icon.component.scss?tag=p-icon-deprecated","src/components/atoms/icon-deprecated/icon.component.tsx"],"sourcesContent":[":host {\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\nimport { RotateOptions, TextSizeOptions } from '../../../types/tailwind';\nimport { iconsDeprecated } from '../../../utils/icons-deprecated';\nimport { IconFlipOptions } from '../icon/icon.component';\n\nexport type IconDeprecatedVariant = keyof typeof iconsDeprecated;\n\n@Component({\n\ttag: 'p-icon-deprecated',\n\tstyleUrl: 'icon.component.scss',\n\t// shadow: true,\n})\nexport class Icon {\n\t/**\n\t * The icon the be displayed\n\t */\n\t@Prop() variant!: IconDeprecatedVariant;\n\n\t/**\n\t * The size of the icon, using tailwind sizes\n\t */\n\t@Prop() size: TextSizeOptions = 'auto';\n\n\t/**\n\t * Wether to rotate the icon x degrees\n\t */\n\t@Prop() rotate: RotateOptions = 0;\n\n\t/**\n\t * Wether to flip the icon horizontally or vertically\n\t */\n\t@Prop() flip: IconFlipOptions = 'none';\n\n\tcomponentDidLoad() {\n\t\tconsole.warn('[p-icon-deprecated] Deprecated, please use p-icon');\n\t}\n\n\trender() {\n\t\tconst icon = iconsDeprecated[this.variant];\n\n\t\tconst styles = {\n\t\t\t'p-icon flex': true,\n\t\t\t'text-auto': this.size === 'auto',\n\t\t\t'text-xxs': this.size === 'xxs',\n\t\t\t'text-xs': this.size === 'xs',\n\t\t\t'text-sm': this.size === 'sm',\n\t\t\t'text-base': this.size === 'base',\n\t\t\t'text-lg': this.size === 'lg',\n\t\t\t'text-xl': this.size === 'xl',\n\t\t\t'text-2xl': this.size === '2xl',\n\t\t\t'text-3xl': this.size === '3xl',\n\t\t\t'text-4xl': this.size === '4xl',\n\t\t\ttransform: !!this.rotate || this.flip !== 'none',\n\t\t\t'scale-x-flip': this.flip === 'horizontal',\n\t\t\t'scale-y-flip': this.flip === 'vertical',\n\t\t\t'rotate-0': this.rotate === 0,\n\t\t\t'rotate-25': this.rotate === 25,\n\t\t\t'rotate-45': this.rotate === 45,\n\t\t\t'rotate-90': this.rotate === 90,\n\t\t\t'rotate-135': this.rotate === 135,\n\t\t\t'rotate-180': this.rotate === 180,\n\t\t\t'rotate-225': this.rotate === 225,\n\t\t\t'rotate-270': this.rotate === 270,\n\t\t\t'rotate-315': this.rotate === 315,\n\t\t\t'-rotate-0': this.rotate === -0,\n\t\t\t'-rotate-25': this.rotate === -25,\n\t\t\t'-rotate-45': this.rotate === -45,\n\t\t\t'-rotate-90': this.rotate === -90,\n\t\t\t'-rotate-135': this.rotate === -135,\n\t\t\t'-rotate-180': this.rotate === -180,\n\t\t\t'-rotate-225': this.rotate === -225,\n\t\t\t'-rotate-270': this.rotate === -270,\n\t\t\t'-rotate-315': this.rotate === -315,\n\t\t};\n\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={styles}\n\t\t\t\tinnerHTML={icon}\n\t\t\t></Host>\n\t\t);\n\t}\n}\n"],"version":3}

package/dist/components/p-input-group.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface PInputGroup extends Components.PInputGroup, HTMLElement {}
+export const PInputGroup: {
+    prototype: PInputGroup;
+    new (): PInputGroup;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

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

@@ -0,0 +1,192 @@
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { d as defineCustomElement$6 } from './helper.component.js';
+import { d as defineCustomElement$5 } from './icon.component.js';
+import { d as defineCustomElement$4 } from './input-error.component.js';
+import { d as defineCustomElement$3 } from './portal.component.js';
+import { d as defineCustomElement$2 } from './tooltip.component.js';
+
+const inputGroupComponentCss = ".mb-\\[2px\\]{margin-bottom:2px!important}.box-border{box-sizing:border-box!important}.flex{display:flex!important}.w-full{width:100%!important}.flex-1{flex:1 1 0%!important}.items-start{align-items:flex-start!important}.items-end{align-items:flex-end!important}.rounded-bl-none{border-bottom-left-radius:0!important}.rounded-br-none{border-bottom-right-radius:0!important}.border-l-0{border-left-width:0!important}.border-r-0{border-right-width:0!important}.py-\\[calc\\(0\\.75rem-1px\\)\\]{padding-bottom:calc(.75rem - 1px)!important;padding-top:calc(.75rem - 1px)!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.font-semibold{font-weight:600!important}.uppercase{text-transform:uppercase!important}.tracking-wider{letter-spacing:.05em!important}.outline-none{outline:2px solid transparent!important;outline-offset:2px!important}*{box-sizing:border-box}:host{display:flex;flex-direction:column;outline:2px solid transparent!important;outline-offset:2px!important;width:100%}:host .input-label{--tw-text-opacity:1;color:rgb(152 154 183/var(--tw-text-opacity,1));font-size:.75rem;font-weight:600;letter-spacing:.05em;line-height:1rem;margin-bottom:2px;text-transform:uppercase}:host .input-header{align-items:flex-end;display:flex;gap:.5rem;margin-bottom:2px}:host .content{display:flex;width:100%}:host .content .prefix,:host .content .suffix{--tw-text-opacity:1;box-sizing:border-box;color:rgb(81 83 107/var(--tw-text-opacity,1));flex:1 1 0%;height:100%}:host .content .prefix{border-bottom-right-radius:0;border-right-width:0!important;border-top-right-radius:0;order:1;padding-right:.5rem}:host .content .suffix{border-bottom-left-radius:0;border-left-width:0!important;border-top-left-radius:0;order:3;padding-left:.5rem}:host(.focused),:host(:focus),:host(:focus-within),:host([focused]){outline:2px solid transparent!important;outline-offset:2px!important}:host(.focused) .prefix,:host(.focused) .suffix,:host(:focus) .prefix,:host(:focus) .suffix,:host(:focus-within) .prefix,:host(:focus-within) .suffix,:host([focused]) .prefix,:host([focused]) .suffix{--tw-text-opacity:1;color:rgb(82 138 250/var(--tw-text-opacity,1))}:host(.error) .prefix,:host(.error) .suffix,:host([error]) .prefix,:host([error]) .suffix{--tw-text-opacity:1;color:rgb(185 30 40/var(--tw-text-opacity,1))}:host(.error) .suffix,:host([error]) .suffix{align-items:flex-start;padding-bottom:calc(.75rem - 1px);padding-top:calc(.75rem - 1px)}:host(.size-small.error) .suffix,:host(.size-small[error]) .suffix{padding-bottom:.5rem;padding-top:.5rem}.static{position:static!important}.ml-1{margin-left:.25rem!important}.ml-2{margin-left:.5rem!important}.justify-between{justify-content:space-between!important}.rounded-tl-none{border-top-left-radius:0!important}.rounded-tr-none{border-top-right-radius:0!important}.pl-0{padding-left:0!important}.pr-0{padding-right:0!important}.text-negative{--tw-text-opacity:1!important;color:rgb(185 30 40/var(--tw-text-opacity,1))!important}";
+const PInputGroupStyle0 = inputGroupComponentCss;
+
+const InputGroup = /*@__PURE__*/ proxyCustomElement(class InputGroup extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.size = 'medium';
+        this.prefix = undefined;
+        this.suffix = undefined;
+        this.icon = undefined;
+        this.iconFlip = undefined;
+        this.iconRotate = undefined;
+        this.iconPosition = 'start';
+        this.label = undefined;
+        this.helper = undefined;
+        this.required = undefined;
+        this.error = undefined;
+        this.disabled = false;
+        this.focused = false;
+        this.forceShowTooltip = false;
+        this.focusMethod = 'focus';
+        this.errorVariant = 'auto';
+        this._forceShowTooltip = false;
+    }
+    get _el() { return this; }
+    _whitelistedTags = ['input', 'textarea'];
+    componentDidLoad() {
+        console.warn('[p-input-group] Deprecated, please use p-field');
+    }
+    componentWillRender() {
+        this._setInputClasses();
+    }
+    render() {
+        const { hasHeaderSlot, helper, label, prefix, suffix, errorAndErrorIsNotBoolean, errorVariant, } = this._getSlotInfo();
+        return (h(Host, { key: '9848be9dc18dbb66de4ffaeb0fd6377204355127', class: `p-input-group ${this.error?.length && 'error'} ${this.disabled && 'disabled'} ${this.focused && 'focused'} size-${this.size}` }, h("div", { key: '4d4035d525fe79a6afbd669bf49302fbd96ee4a9', class: 'flex items-end justify-between' }, label && (h("div", { key: '859e6c72d70ddd2b62c72170be460452d0d87d11', class: 'input-label', onClick: () => this._focusInput() }, label, this.required && h("span", { key: '19c99b31a2d0f5b6f03971b6441e459653e3af13', class: 'ml-1 text-negative' }, "*"))), (helper || hasHeaderSlot) && (h("div", { key: '3e2abec6c63ae8d26b42316d48516992c2bc699b', class: 'input-header' }, hasHeaderSlot && h("slot", { key: '1d100f887f1345ccfcf11e97d7667dd94355f026', name: 'header' }), helper && (h("p-helper", { key: '9dbf5401cd26db9421c526bd406c683829abd877', class: `flex ${hasHeaderSlot ? 'ml-2' : ''}`, placement: 'top-end' }, helper))))), h("p-tooltip", { key: '71ef03a090b4311c14d7c935809f147140791e9e', class: 'w-full', variant: 'error', content: this.error, show: errorAndErrorIsNotBoolean &&
+                errorVariant === 'element' &&
+                (this.forceShowTooltip || this._forceShowTooltip), enableUserInput: false }, h("div", { key: '21bda229af33f22f4080ef66cd2b2821f755edd6', class: 'content', slot: 'trigger' }, (prefix || (this.icon && this.iconPosition === 'start')) && (h("div", { key: '21f4e49db797a4ee2e6caee81d952858cc550567', class: `prefix size-${this.size}`, onClick: () => this._focusInput() }, this.icon && this.iconPosition === 'start' ? (h("p-icon", { class: 'flex', variant: this.icon, rotate: this.iconRotate, flip: this.iconFlip })) : (prefix))), (suffix ||
+            (errorAndErrorIsNotBoolean && errorVariant === 'icon') ||
+            (this.icon && this.iconPosition === 'end')) && (h("div", { key: '033bc354c872c0b9fb351182d7466515642d3f9b', class: `suffix size-${this.size}`, onClick: () => this._focusInput() }, errorAndErrorIsNotBoolean && errorVariant === 'icon' ? (h("p-input-error", { error: this.error, forceShowTooltip: this.forceShowTooltip || this._forceShowTooltip })) : this.icon && this.iconPosition === 'end' ? (h("p-icon", { class: 'flex', variant: this.icon, rotate: this.iconRotate, flip: this.iconFlip })) : (suffix))), h("slot", { key: '1dc6aa666c99246ba2d532c435987875528af5f6', name: 'input' })))));
+    }
+    handleFocusIn() {
+        this._forceShowTooltip = true;
+    }
+    handleFocusOut() {
+        this._forceShowTooltip = false;
+    }
+    /*
+     With this, we shall hack the system in ways no one would ever have thought.
+
+     <div class="pl-0 pr-0 border-l-0 border-r-0 rounded-tl-none rounded-bl-none rounded-tr-none rounded-br-none"></div>
+     */
+    _setInputClasses() {
+        const input = this._el.querySelector(':scope > [slot="input"]');
+        if (!input) {
+            return;
+        }
+        const tagName = input.tagName.toLowerCase();
+        if (this._whitelistedTags.indexOf(tagName) === -1) {
+            return;
+        }
+        if (!input.classList.contains('p-input')) {
+            input.classList.add('p-input');
+        }
+        const { prefix, suffix, errorAndErrorIsNotBoolean, errorVariant } = this._getSlotInfo();
+        if (suffix ||
+            (errorAndErrorIsNotBoolean && errorVariant === 'icon') ||
+            (this.icon && this.iconPosition === 'end')) {
+            input.classList.add('border-r-0', 'rounded-tr-none', 'rounded-br-none', 'pr-0');
+        }
+        else {
+            input.classList.remove('border-r-0', 'rounded-tr-none', 'rounded-br-none', 'pr-0');
+        }
+        if (prefix || (this.icon && this.iconPosition === 'start')) {
+            input.classList.add('border-l-0', 'rounded-tl-none', 'rounded-bl-none', 'pl-0');
+        }
+        else {
+            input.classList.remove('border-l-0', 'rounded-tl-none', 'rounded-bl-none', 'pl-0');
+        }
+        if (this.size === 'small' && !input.classList.contains('size-small')) {
+            input.classList.add('size-small');
+        }
+        if (this.size !== 'small' && input.classList.contains('size-small')) {
+            input.classList.remove('size-small');
+        }
+    }
+    _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 helper = hasHelperSlot ? h("slot", { name: 'helper' }) : this.helper;
+        const label = hasLabelSlot ? h("slot", { name: 'label' }) : this.label;
+        const prefix = hasPrefixSlot ? h("slot", { name: 'prefix' }) : this.prefix;
+        const suffix = hasSuffixSlot ? h("slot", { name: 'suffix' }) : this.suffix;
+        const errorAndErrorIsNotBoolean = this.error && typeof this.error === 'string' && this.error !== 'true';
+        return {
+            hasHelperSlot,
+            hasLabelSlot,
+            hasPrefixSlot,
+            hasSuffixSlot,
+            hasHeaderSlot,
+            helper,
+            label,
+            prefix,
+            suffix,
+            errorAndErrorIsNotBoolean,
+            errorVariant: this.errorVariant === 'auto'
+                ? this._el.offsetWidth <= 72
+                    ? 'element'
+                    : 'icon'
+                : this.errorVariant,
+        };
+    }
+    _focusInput() {
+        const input = this._el.querySelector(':scope > [slot="input"]');
+        input[this.focusMethod]();
+    }
+    static get style() { return PInputGroupStyle0; }
+}, [1, "p-input-group", {
+        "size": [1],
+        "prefix": [1],
+        "suffix": [1],
+        "icon": [1],
+        "iconFlip": [1, "icon-flip"],
+        "iconRotate": [2, "icon-rotate"],
+        "iconPosition": [1, "icon-position"],
+        "label": [1],
+        "helper": [1],
+        "required": [516],
+        "error": [513],
+        "disabled": [516],
+        "focused": [516],
+        "forceShowTooltip": [516, "force-show-tooltip"],
+        "focusMethod": [1, "focus-method"],
+        "errorVariant": [1, "error-variant"],
+        "_forceShowTooltip": [32]
+    }, [[0, "focusin", "handleFocusIn"], [0, "focusout", "handleFocusOut"]]]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["p-input-group", "p-helper", "p-icon", "p-input-error", "p-portal", "p-tooltip"];
+    components.forEach(tagName => { switch (tagName) {
+        case "p-input-group":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, InputGroup);
+            }
+            break;
+        case "p-helper":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$6();
+            }
+            break;
+        case "p-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$5();
+            }
+            break;
+        case "p-input-error":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "p-portal":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "p-tooltip":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
+
+const PInputGroup = InputGroup;
+const defineCustomElement = defineCustomElement$1;
+
+export { PInputGroup, defineCustomElement };
+
+//# sourceMappingURL=p-input-group.js.map

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

@@ -0,0 +1 @@
+{"file":"p-input-group.js","mappings":"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","names":[],"sources":["src/components/molecules/input-group/input-group.component.scss?tag=p-input-group&encapsulation=shadow","src/components/molecules/input-group/input-group.component.tsx"],"sourcesContent":[":host {\n\t@apply flex w-full flex-col;\n\t@apply outline-none #{!important};\n\n\t.input-label {\n\t\t@apply mb-[2px] text-xs font-semibold uppercase tracking-wider text-storm-vague;\n\t}\n\n\t.input-header {\n\t\t@apply mb-[2px] flex items-end gap-2;\n\t}\n\n\t.content {\n\t\t@apply flex w-full;\n\n\t\t.prefix,\n\t\t.suffix {\n\t\t\t@apply box-border flex-1 text-storm;\n\t\t\t@apply h-full;\n\t\t}\n\n\t\t.prefix {\n\t\t\t@apply rounded-br-none rounded-tr-none;\n\t\t\t@apply border-r-0 #{!important};\n\t\t\t@apply order-1;\n\t\t\t@apply pr-2;\n\t\t}\n\n\t\t.suffix {\n\t\t\t@apply rounded-bl-none rounded-tl-none;\n\t\t\t@apply order-3;\n\t\t\t@apply pl-2;\n\t\t\t@apply border-l-0 #{!important};\n\t\t}\n\t}\n}\n\n:host(.focused),\n:host([focused]),\n:host(:focus-within),\n:host(:focus) {\n\t@apply outline-none #{!important};\n\n\t.prefix,\n\t.suffix {\n\t\t@apply text-indigo;\n\t}\n}\n\n:host(.error),\n:host([error]) {\n\t.prefix,\n\t.suffix {\n\t\t@apply text-negative;\n\t}\n\n\t.suffix {\n\t\t@apply items-start py-[calc(0.75rem-1px)];\n\t}\n}\n\n:host(.disabled),\n:host([disabled]) {\n\t.prefix,\n\t.suffix {\n\t}\n}\n\n:host(.size-small.error),\n:host(.size-small[error]) {\n\t.suffix {\n\t\t@apply py-2;\n\t}\n}\n","import {\n\tComponent,\n\tElement,\n\th,\n\tHost,\n\tListen,\n\tProp,\n\tState,\n} from '@stencil/core';\nimport { RotateOptions } from '../../../types/tailwind';\nimport { IconFlipOptions, IconVariant } from '../../atoms/icon/icon.component';\n\n@Component({\n\ttag: 'p-input-group',\n\tstyleUrl: './input-group.component.scss',\n\tshadow: true,\n})\nexport class InputGroup {\n\t/**\n\t * The size of the input group\n\t */\n\t@Prop() size: 'small' | 'medium' = 'medium';\n\n\t/**\n\t * The prefix of the input group\n\t */\n\t@Prop() prefix: string;\n\n\t/**\n\t * The suffix of the input group\n\t */\n\t@Prop() suffix: string;\n\n\t/**\n\t * Icon of the input group\n\t */\n\t@Prop() icon: IconVariant;\n\n\t/**\n\t * Icon flip\n\t */\n\t@Prop() iconFlip: IconFlipOptions;\n\n\t/**\n\t * Icon rotate\n\t */\n\t@Prop() iconRotate: RotateOptions;\n\n\t/**\n\t * Icon position\n\t */\n\t@Prop() iconPosition: 'start' | 'end' = 'start';\n\n\t/**\n\t * The label of the input group\n\t */\n\t@Prop() label: string;\n\n\t/**\n\t * The helper of the input group\n\t */\n\t@Prop() helper: string;\n\n\t/**\n\t * Wether the field is required\n\t */\n\t@Prop({ reflect: true }) required: boolean;\n\n\t/**\n\t * The helper of the input group\n\t */\n\t@Prop({ reflect: true }) error: string;\n\n\t/**\n\t * Wether the input group is disabled\n\t */\n\t@Prop({ reflect: true }) disabled: boolean = false;\n\n\t/**\n\t * Wether the input group is focused\n\t */\n\t@Prop({ reflect: true }) focused: boolean = false;\n\n\t/**\n\t * Force show the error tooltip\n\t */\n\t@Prop({ reflect: true }) forceShowTooltip: boolean = false;\n\n\t/**\n\t * The method to use when focusing the input\n\t */\n\t@Prop() focusMethod: 'focus' | 'click' = 'focus';\n\n\t/**\n\t * The error variant to use\n\t */\n\t@Prop() errorVariant: 'auto' | 'suffix' | 'element' = 'auto';\n\n\t/**\n\t * The host element\n\t */\n\t@Element() private _el: HTMLElement;\n\n\t@State() private _forceShowTooltip = false;\n\n\tprivate _whitelistedTags = ['input', 'textarea'];\n\n\tcomponentDidLoad() {\n\t\tconsole.warn('[p-input-group] Deprecated, please use p-field');\n\t}\n\n\tcomponentWillRender() {\n\t\tthis._setInputClasses();\n\t}\n\n\trender() {\n\t\tconst {\n\t\t\thasHeaderSlot,\n\t\t\thelper,\n\t\t\tlabel,\n\t\t\tprefix,\n\t\t\tsuffix,\n\t\t\terrorAndErrorIsNotBoolean,\n\t\t\terrorVariant,\n\t\t} = this._getSlotInfo();\n\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={`p-input-group ${this.error?.length && 'error'} ${\n\t\t\t\t\tthis.disabled && 'disabled'\n\t\t\t\t} ${this.focused && 'focused'} size-${this.size}`}\n\t\t\t>\n\t\t\t\t<div class='flex items-end justify-between'>\n\t\t\t\t\t{label && (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclass='input-label'\n\t\t\t\t\t\t\tonClick={() => this._focusInput()}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{label}\n\t\t\t\t\t\t\t{this.required && <span class='ml-1 text-negative'>*</span>}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{(helper || hasHeaderSlot) && (\n\t\t\t\t\t\t<div class='input-header'>\n\t\t\t\t\t\t\t{hasHeaderSlot && <slot name='header' />}\n\t\t\t\t\t\t\t{helper && (\n\t\t\t\t\t\t\t\t<p-helper\n\t\t\t\t\t\t\t\t\tclass={`flex ${hasHeaderSlot ? 'ml-2' : ''}`}\n\t\t\t\t\t\t\t\t\tplacement='top-end'\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{helper}\n\t\t\t\t\t\t\t\t</p-helper>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t\t<p-tooltip\n\t\t\t\t\tclass='w-full'\n\t\t\t\t\tvariant='error'\n\t\t\t\t\tcontent={this.error}\n\t\t\t\t\tshow={\n\t\t\t\t\t\terrorAndErrorIsNotBoolean &&\n\t\t\t\t\t\terrorVariant === 'element' &&\n\t\t\t\t\t\t(this.forceShowTooltip || this._forceShowTooltip)\n\t\t\t\t\t}\n\t\t\t\t\tenableUserInput={false}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclass='content'\n\t\t\t\t\t\tslot='trigger'\n\t\t\t\t\t>\n\t\t\t\t\t\t{(prefix || (this.icon && this.iconPosition === 'start')) && (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclass={`prefix size-${this.size}`}\n\t\t\t\t\t\t\t\tonClick={() => this._focusInput()}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{this.icon && this.iconPosition === 'start' ? (\n\t\t\t\t\t\t\t\t\t<p-icon\n\t\t\t\t\t\t\t\t\t\tclass='flex'\n\t\t\t\t\t\t\t\t\t\tvariant={this.icon}\n\t\t\t\t\t\t\t\t\t\trotate={this.iconRotate}\n\t\t\t\t\t\t\t\t\t\tflip={this.iconFlip}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\tprefix\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{(suffix ||\n\t\t\t\t\t\t\t(errorAndErrorIsNotBoolean && errorVariant === 'icon') ||\n\t\t\t\t\t\t\t(this.icon && this.iconPosition === 'end')) && (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclass={`suffix size-${this.size}`}\n\t\t\t\t\t\t\t\tonClick={() => this._focusInput()}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{errorAndErrorIsNotBoolean && errorVariant === 'icon' ? (\n\t\t\t\t\t\t\t\t\t<p-input-error\n\t\t\t\t\t\t\t\t\t\terror={this.error}\n\t\t\t\t\t\t\t\t\t\tforceShowTooltip={\n\t\t\t\t\t\t\t\t\t\t\tthis.forceShowTooltip || this._forceShowTooltip\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) : this.icon && this.iconPosition === 'end' ? (\n\t\t\t\t\t\t\t\t\t<p-icon\n\t\t\t\t\t\t\t\t\t\tclass='flex'\n\t\t\t\t\t\t\t\t\t\tvariant={this.icon}\n\t\t\t\t\t\t\t\t\t\trotate={this.iconRotate}\n\t\t\t\t\t\t\t\t\t\tflip={this.iconFlip}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\tsuffix\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t<slot name='input' />\n\t\t\t\t\t</div>\n\t\t\t\t</p-tooltip>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t@Listen('focusin')\n\thandleFocusIn() {\n\t\tthis._forceShowTooltip = true;\n\t}\n\n\t@Listen('focusout')\n\thandleFocusOut() {\n\t\tthis._forceShowTooltip = false;\n\t}\n\t/*\n     With this, we shall hack the system in ways no one would ever have thought.\n\n     <div class=\"pl-0 pr-0 border-l-0 border-r-0 rounded-tl-none rounded-bl-none rounded-tr-none rounded-br-none\"></div>\n     */\n\tprivate _setInputClasses() {\n\t\tconst input = this._el.querySelector(':scope > [slot=\"input\"]');\n\n\t\tif (!input) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst tagName = input.tagName.toLowerCase();\n\t\tif (this._whitelistedTags.indexOf(tagName) === -1) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (!input.classList.contains('p-input')) {\n\t\t\tinput.classList.add('p-input');\n\t\t}\n\n\t\tconst { prefix, suffix, errorAndErrorIsNotBoolean, errorVariant } =\n\t\t\tthis._getSlotInfo();\n\n\t\tif (\n\t\t\tsuffix ||\n\t\t\t(errorAndErrorIsNotBoolean && errorVariant === 'icon') ||\n\t\t\t(this.icon && this.iconPosition === 'end')\n\t\t) {\n\t\t\tinput.classList.add(\n\t\t\t\t'border-r-0',\n\t\t\t\t'rounded-tr-none',\n\t\t\t\t'rounded-br-none',\n\t\t\t\t'pr-0'\n\t\t\t);\n\t\t} else {\n\t\t\tinput.classList.remove(\n\t\t\t\t'border-r-0',\n\t\t\t\t'rounded-tr-none',\n\t\t\t\t'rounded-br-none',\n\t\t\t\t'pr-0'\n\t\t\t);\n\t\t}\n\n\t\tif (prefix || (this.icon && this.iconPosition === 'start')) {\n\t\t\tinput.classList.add(\n\t\t\t\t'border-l-0',\n\t\t\t\t'rounded-tl-none',\n\t\t\t\t'rounded-bl-none',\n\t\t\t\t'pl-0'\n\t\t\t);\n\t\t} else {\n\t\t\tinput.classList.remove(\n\t\t\t\t'border-l-0',\n\t\t\t\t'rounded-tl-none',\n\t\t\t\t'rounded-bl-none',\n\t\t\t\t'pl-0'\n\t\t\t);\n\t\t}\n\n\t\tif (this.size === 'small' && !input.classList.contains('size-small')) {\n\t\t\tinput.classList.add('size-small');\n\t\t}\n\n\t\tif (this.size !== 'small' && input.classList.contains('size-small')) {\n\t\t\tinput.classList.remove('size-small');\n\t\t}\n\t}\n\n\tprivate _getSlotInfo() {\n\t\tconst hasHelperSlot = !!this._el.querySelector(':scope > [slot=\"helper\"]');\n\t\tconst hasLabelSlot = !!this._el.querySelector(':scope > [slot=\"label\"]');\n\t\tconst hasPrefixSlot = !!this._el.querySelector(':scope > [slot=\"prefix\"]');\n\t\tconst hasSuffixSlot = !!this._el.querySelector(':scope > [slot=\"suffix\"]');\n\t\tconst hasHeaderSlot = !!this._el.querySelector(':scope > [slot=\"header\"]');\n\n\t\tconst helper = hasHelperSlot ? <slot name='helper' /> : this.helper;\n\t\tconst label = hasLabelSlot ? <slot name='label' /> : this.label;\n\t\tconst prefix = hasPrefixSlot ? <slot name='prefix' /> : this.prefix;\n\t\tconst suffix = hasSuffixSlot ? <slot name='suffix' /> : this.suffix;\n\n\t\tconst errorAndErrorIsNotBoolean =\n\t\t\tthis.error && typeof this.error === 'string' && this.error !== 'true';\n\n\t\treturn {\n\t\t\thasHelperSlot,\n\t\t\thasLabelSlot,\n\t\t\thasPrefixSlot,\n\t\t\thasSuffixSlot,\n\t\t\thasHeaderSlot,\n\t\t\thelper,\n\t\t\tlabel,\n\t\t\tprefix,\n\t\t\tsuffix,\n\t\t\terrorAndErrorIsNotBoolean,\n\t\t\terrorVariant:\n\t\t\t\tthis.errorVariant === 'auto'\n\t\t\t\t\t? this._el.offsetWidth <= 72\n\t\t\t\t\t\t? 'element'\n\t\t\t\t\t\t: 'icon'\n\t\t\t\t\t: this.errorVariant,\n\t\t};\n\t}\n\n\tprivate _focusInput() {\n\t\tconst input = this._el.querySelector(':scope > [slot=\"input\"]');\n\t\t(input as HTMLElement)[this.focusMethod]();\n\t}\n}\n"],"version":3}

package/dist/components/p-label.js

@@ -45,14 +45,14 @@ const Label = /*@__PURE__*/ proxyCustomElement(class Label extends HTMLElement {
         this.keepMobileContent = false;
     }
     render() {
-        return (h(Host, { key: 'b65dfe6ae11bfa1309561cd1aa1fb0c2c71b5535', class: 'p-label' }, h("div", { key: '4e6b4648f1778aadee757fab902bae7281f5a5ff', class: label({
+        return (h(Host, { key: '04c0b2510fd1ae8cad957ee02d7d54245b7fdbb0', class: 'p-label' }, h("div", { key: '7dfd0871e52cef46c49f0c30e58facfa603c5d0f', class: label({
                 variant: this.variant,
                 iconOnly: this.iconOnly,
                 keepMobileContent: this.keepMobileContent,
-            }) }, this.icon && (h("p-icon", { key: 'a1ef1bf1d58046c3ceeadb1def0030b547a6297c', class: 'flex-shrink-0', variant: this.icon, flip: this.iconFlip, rotate: this.iconRotate })), !this.iconOnly && (h("div", { key: '961a9f05c969fdb3b1d31f706a370084dd365ab1', class: cn('flex-1 overflow-hidden text-ellipsis whitespace-nowrap text-sm', {
+            }) }, this.icon && (h("p-icon", { key: 'b70587122206d6b26785cbf5e9e8219219aeb7d0', class: 'flex-shrink-0', variant: this.icon, flip: this.iconFlip, rotate: this.iconRotate })), !this.iconOnly && (h("div", { key: '5426ae86e86f205b04130628923f3d53747c85d5', class: cn('flex-1 overflow-hidden text-ellipsis whitespace-nowrap text-sm', {
                 hidden: !this.keepMobileContent,
                 'desktop-xs:block': !this.keepMobileContent,
-            }) }, h("slot", { key: 'ffa41b6d694819b6b438c4ea58485e78c41d34a6' }))))));
+            }) }, h("slot", { key: '62413d44b71c12291cb13997e839774d2b047fdd' }))))));
     }
     static get style() { return PLabelStyle0; }
 }, [1, "p-label", {

package/dist/components/p-navbar.js

@@ -55,7 +55,7 @@ const Navbar = /*@__PURE__*/ proxyCustomElement(class Navbar extends HTMLElement
         this._show = false;
     }
     render() {
-        return (h(Host, { key: '933b55e6875b50546cd980e5c4f7c923cd6cbd11', class: 'p-navbar w-full max-h-screen-safe layout-1280:w-60 layout-1680:w-72' }, h("p-backdrop", { key: '9fb8220b757a0571b77620f394b92fe78d578ba5', class: backdrop({ show: this._show }), scrollLock: this._show, onClicked: () => (this._show = false) }), h("div", { key: 'c24c80eca5ec18ee39df438c591e55ff683a9c06', class: sidebar({ class: sidebarAndTopbar(), show: this._show }) }, h("div", { key: '6338aee239fa25bef1555f5b085d0682c8122c94', class: 'flex w-full items-center justify-between layout-1280:hidden' }, h("p-button", { key: '7768db8078e996b9b0d08a38d7a63329513d4d7b', variant: 'secondary', icon: 'menu-arrow', iconFlip: 'horizontal', iconOnly: true, size: 'sm', onClick: () => (this._show = false) })), h("div", { key: 'b736053b767173fe3da99b1c270ce95eff3376fd', class: 'flex w-full flex-col items-stretch' }, h("slot", { key: '570c7aab38574229bf5f118c7b8196cc93b69992', name: 'company' })), h("div", { key: 'e0d69dc2869eda05e854eb167d72436412669978', class: 'flex w-full flex-col gap-6 overflow-y-auto' }, h("slot", { key: '02e79fdd87b22514e602fa8ace2b4091dde7126a', name: 'content' })), h("div", { key: 'dc66843c8beabbbcb21b1e3c937192b2dba656d2', class: 'mt-auto hidden w-full flex-col layout-1280:flex' }, h("slot", { key: 'b08ed35bb831aa4bc6076a4d5b4d5d1fb4c960d3', name: 'user' }))), h("div", { key: 'b15ae515d4872501b143aa3dc30d40e7004da088', class: topbar({ class: sidebarAndTopbar() }) }, h("p-button", { key: '96628a7f7741fc9d71d68e1744e727a95dec9552', variant: 'secondary', iconOnly: true, icon: 'menu-arrow', size: 'sm', onClick: () => (this._show = true) }), h("slot", { key: '22a596e750b0541a9dabf0d9857c294d77acea58', name: 'topbar' }))));
+        return (h(Host, { key: '5702b79e2c26e706ad4101b89f53de842fcb80b6', class: 'p-navbar w-full max-h-screen-safe layout-1280:w-60 layout-1680:w-72' }, h("p-backdrop", { key: 'c5fa86a7922261ce0c52a30f397a912da999b705', class: backdrop({ show: this._show }), scrollLock: this._show, onClicked: () => (this._show = false) }), h("div", { key: 'cea2c0276187ee5e86eea96879774d34d4439828', class: sidebar({ class: sidebarAndTopbar(), show: this._show }) }, h("div", { key: '7da029ff6de0ce27e5652a2995e1350384a0c83f', class: 'flex w-full items-center justify-between layout-1280:hidden' }, h("p-button", { key: '5bd366656745c2998e979bfb4650e17290c3e288', variant: 'secondary', icon: 'menu-arrow', iconFlip: 'horizontal', iconOnly: true, size: 'sm', onClick: () => (this._show = false) })), h("div", { key: '5fc3e1b70f45905c8a6dfbf85251a5edc8571b78', class: 'flex w-full flex-col items-stretch' }, h("slot", { key: '99f3a9c3bcf2f53b1bb69c14fd30d8f3dd850a23', name: 'company' })), h("div", { key: '47dbf4bb5cde7b785401df9584ed6ae155329be1', class: 'flex w-full flex-col gap-6 overflow-y-auto' }, h("slot", { key: '8220bc3836bb64fe353d1585003d005cb5c04bd4', name: 'content' })), h("div", { key: 'a04e5098279b15f9526fcba60ce000e552d6b3b4', class: 'mt-auto hidden w-full flex-col layout-1280:flex' }, h("slot", { key: '6902b1780e7e8e9642caa22e467adc938c335c2c', name: 'user' }))), h("div", { key: '54e624bd9bed375fe496a7ebb0ea26a92c6cf5f5', class: topbar({ class: sidebarAndTopbar() }) }, h("p-button", { key: '8b8df57e642e4e4fdc1848271c8104f3489ad269', variant: 'secondary', iconOnly: true, icon: 'menu-arrow', size: 'sm', onClick: () => (this._show = true) }), h("slot", { key: 'ea415e56ec47a30ca4005d0c138f2c6bdc7abf22', name: 'topbar' }))));
     }
     handleCloseNavbar() {
         this._show = false;

package/dist/components/p-navigation-item.js

@@ -52,10 +52,10 @@ const NavigationItem = /*@__PURE__*/ proxyCustomElement(class NavigationItem ext
     render() {
         const TagType = this.as;
         const active = this.active || this.class?.includes('active');
-        return (h(Host, { key: 'f87e67e61239b95e49d93b9bd07686b7b70477a9', class: cn('p-navigation-item inline-block', this.class) }, h(TagType, { key: '67c327313aa12d7fe54389bc298ca23b3e17437a', class: navigationItem({
+        return (h(Host, { key: '6b12fc10340027d176fc9fa9699ff62a9f200c06', class: cn('p-navigation-item inline-block', this.class) }, h(TagType, { key: '447c6dfb9e7cd9a426dfc83a786117ecd809ed23', class: navigationItem({
                 icon: !!this.icon,
                 active,
-            }), href: this.href, target: this.target }, h("div", { key: 'b1de70235c4bb1bff509db3f1723c106e50614d9', class: navigationItemIconContainer({ active }) }, h("p-icon", { key: 'debe4fce9441178c12c4198cab3c94247db0cd49', variant: this.icon })), h("span", { key: 'f6e9daee27dc7fc467c1d6e5d50b3f2d9aaa3cf8', class: this.counter && 'has-counter' }, h("slot", { key: 'c10c72c8c3ad0f8b238ed69636ca2b8e3291dc44' })), !!this.counter && this.counter !== '0' && (h("p-badge", { key: '4bb1889d85efdac8e80a398fcb3769dc55b26ee3' }, this.counter)), !!this.loading && h("p-loader", { key: '80b43031e00df08c342df9872caa928dcbc87650', class: 'ml-auto' }))));
+            }), href: this.href, target: this.target }, h("div", { key: 'ee2fb03620b46d75f34887c1426abe3090dd50f8', class: navigationItemIconContainer({ active }) }, h("p-icon", { key: '92ae190b1b415939e23476403dfc7ea7065db3f6', variant: this.icon })), h("span", { key: 'd56fbd8fdffc8a20b98d4d4a25dd68eb1e2548e0', class: this.counter && 'has-counter' }, h("slot", { key: 'd1baea6b23dab3cc3db75ab4c6c5b660977475c6' })), !!this.counter && this.counter !== '0' && (h("p-badge", { key: 'd50225f39e08b412b622055438584ad9aa02b4c1' }, this.counter)), !!this.loading && h("p-loader", { key: '10ab89e057f00442ad0dab32c0342ad16daf667a', class: 'ml-auto' }))));
     }
     static get style() { return PNavigationItemStyle0; }
 }, [4, "p-navigation-item", {

package/dist/components/p-navigation-section.js

@@ -11,7 +11,7 @@ const NavigationSection = /*@__PURE__*/ proxyCustomElement(class NavigationSecti
         this.header = undefined;
     }
     render() {
-        return (h(Host, { key: '2498f9f2121a61e9a086faa32e676ac8a59bbe7b', class: 'p-navigation-section flex flex-col gap-2' }, this.header?.length > 0 && (h("p-navigation-title", { key: '04a310fc04574b350c1d36cb57b23537a25a8b6e' }, this.header)), h("div", { key: 'd444fee83c080992f04ed3e0c977b8687198633c', class: 'flex flex-col' }, h("slot", { key: 'fde7c2c5be6223b0ae89c2708c74bd0d840de2f1' }))));
+        return (h(Host, { key: '2278321f85bd2cc19317f416174aee1d2797ff56', class: 'p-navigation-section flex flex-col gap-2' }, this.header?.length > 0 && (h("p-navigation-title", { key: '2eba4771425254e503d02470d0b7caeb18cac710' }, this.header)), h("div", { key: 'bf1ffb4905308dbc7694e911ca171be4686e0300', class: 'flex flex-col' }, h("slot", { key: 'e646b3ae3781eea037ff358dc59937d847f2b956' }))));
     }
     static get style() { return PNavigationSectionStyle0; }
 }, [4, "p-navigation-section", {

package/dist/components/p-profile.js

@@ -35,7 +35,7 @@ const Profile = /*@__PURE__*/ proxyCustomElement(class Profile extends HTMLEleme
     }
     render() {
         const content = this._getContent();
-        return (h(Host, { key: '9313ef616b33a4491b7a8bd6ebe647b3e334c168', class: 'p-profile inline-block w-inherit' }, this._hasDropdownSlot ? (h("p-dropdown", { class: 'block', strategy: 'absolute', placement: this.dropdownLocation, applyFullWidth: true, applyMaxWidth: false, onIsOpen: ev => (this._dropdownOpen = ev.detail) }, h("p-button", { variant: 'dropdown', chevron: this._dropdownOpen ? 'up' : 'down', active: this._dropdownOpen, slot: 'trigger', size: 'lg', class: 'w-full' }, content), h("div", { slot: 'items' }, h("slot", { name: 'dropdown', onSlotchange: () => this._checkDropdownSlot() })))) : (content)));
+        return (h(Host, { key: 'a9482eb4aab89a3dff60ec39ecc2be00b1b8036f', class: 'p-profile inline-block w-inherit' }, this._hasDropdownSlot ? (h("p-dropdown", { class: 'block', strategy: 'absolute', placement: this.dropdownLocation, applyFullWidth: true, applyMaxWidth: false, onIsOpen: ev => (this._dropdownOpen = ev.detail) }, h("p-button", { variant: 'dropdown', chevron: this._dropdownOpen ? 'up' : 'down', active: this._dropdownOpen, slot: 'trigger', size: 'lg', class: 'w-full' }, content), h("div", { slot: 'items' }, h("slot", { name: 'dropdown', onSlotchange: () => this._checkDropdownSlot() })))) : (content)));
     }
     slotchange() {
         this._checkDropdownSlot();

package/dist/components/p-select.js

@@ -195,7 +195,7 @@ const Select = /*@__PURE__*/ proxyCustomElement(class Select extends HTMLElement
         }
     }
     render() {
-        return (h(Host, { key: 'bbcf5a411b3516151b5cde49e83e637e8f275d6d', class: 'p-select' }, h("p-dropdown", { key: '0a75a3e234fe53fd205cda607860b12ae864c998', disableTriggerClick: true, calculateWidth: true, insideClick: true, scrollable: this.enableAutocomplete ? 'large' : true, show: this._showDropdown, onIsOpen: ev => this._onDropdownOpen(ev) }, h("p-field-container", { key: 'd09b7269c07ab493d9372481165f88c383210230', slot: 'trigger', prefix: this.prefix, label: this.label, helper: this.helper, required: this.required, error: this.error, errorPlacement: 'top-start', forceShowTooltip: this.error?.length && this._showDropdown }, h("p-button", { key: 'ae1626f92d3a509e0cab45faa11a9965b12d27aa', class: 'w-full', slot: 'content', variant: 'secondary', size: this.size, chevron: this.showChevron, disabled: this.disabled, active: this._showDropdown, icon: this.icon, onClick: ev => this._onClick(ev) }, h("div", { key: '9d53222285fdc827c4df5468e38a491399496f01', class: 'relative flex-1', ref: ref => (this._inputRef = ref) }, this._displayValue))), this.loading ? this._getLoadingItems() : this._getItems(), this.showAddItem && this._getAddItem())));
+        return (h(Host, { key: 'f62a834435e5a23ac883458bbbc6584fc475585a', class: 'p-select' }, h("p-dropdown", { key: 'f052fca097cd93660e1319d9e697cddfa849adbb', disableTriggerClick: true, calculateWidth: true, insideClick: true, scrollable: this.enableAutocomplete ? 'large' : true, show: this._showDropdown, onIsOpen: ev => this._onDropdownOpen(ev) }, h("p-field-container", { key: 'abeced0d91a257f87f02cd6c22ee150ed66b3c4f', slot: 'trigger', prefix: this.prefix, label: this.label, helper: this.helper, required: this.required, error: this.error, errorPlacement: 'top-start', forceShowTooltip: this.error?.length && this._showDropdown }, h("p-button", { key: 'ac9f12fbab1e18cb05c406b90d9d615220626ed3', class: 'w-full', slot: 'content', variant: 'secondary', size: this.size, chevron: this.showChevron, disabled: this.disabled, active: this._showDropdown, icon: this.icon, onClick: ev => this._onClick(ev) }, h("div", { key: '00962c1d7e8cc69860a071cf4f4ff48ae096c43d', class: 'relative flex-1', ref: ref => (this._inputRef = ref) }, this._displayValue))), this.loading ? this._getLoadingItems() : this._getItems(), this.showAddItem && this._getAddItem())));
     }
     documentClickHandler({ target }) {
         if (!this._showDropdown || childOf(target, this._el)) {

package/dist/components/p-stepper.js

@@ -96,7 +96,7 @@ const Stepper = /*@__PURE__*/ proxyCustomElement(class Stepper extends HTMLEleme
         this._generateSteps(true);
     }
     render() {
-        return (h(Host, { key: 'dab66ec915bdfc6db37204746035c9fa25beb364', class: 'p-stepper' }, h("slot", { key: '614787c115b5f21dd50d589acfb830c84fc84173', onSlotchange: this._onSlotChange })));
+        return (h(Host, { key: '8fa52e3d517deebb230039f2938893a14fb5613e', class: 'p-stepper' }, h("slot", { key: '385c27e425dad328346910e77f42d7fdc32183b8', onSlotchange: this._onSlotChange })));
     }
     _onActiveStepChange() {
         this._generateSteps();