@paperless/core 2.1.0 → 2.2.0

package/dist/collection/components/atoms/checkbox/checkbox.component.js

@@ -11,19 +11,19 @@ const checkbox = cva([
         disabled: {
             false: [
                 'cursor-pointer shadow-1',
-                'bg-white border-black-teal-100',
-                'hover:bg-supportive-lilac-100 hover:border-black-teal-100',
-                'group-hover/checkbox-label:bg-supportive-lilac-100 group-hover/checkbox-label:border-black-teal-100',
-                'checked:bg-supportive-lilac checked:border-black-teal/20',
-                'checked:ring-2 checked:ring-supportive-lilac-100',
-                'checked:hover:bg-supportive-lilac-700 checked:hover:border-black-teal/20',
-                'checked:group-hover/checkbox-label:bg-supportive-lilac-700 checked:group-hover/checkbox-label:border-black-teal/20',
-                'indeterminate:bg-supportive-lilac-700 indeterminate:border-black-teal/20',
-                'indeterminate:ring-2 indeterminate:ring-supportive-lilac-100',
-                'indeterminate:hover:bg-supportive-lilac indeterminate:hover:border-black-teal/20',
-                'indeterminate:group-hover/checkbox-label:bg-supportive-lilac indeterminate:group-hover/checkbox-label:border-black-teal/20',
+                'bg-white border-storm-100',
+                'hover:bg-indigo-100 hover:border-storm/20',
+                'group-hover/checkbox-label:bg-indigo-100 group-hover/checkbox-label:border-storm-100',
+                'checked:bg-indigo-600 checked:border-storm/20',
+                'checked:ring-2 checked:ring-indigo-100',
+                'checked:hover:bg-indigo-700 checked:hover:border-storm/20',
+                'checked:group-hover/checkbox-label:bg-indigo-700 checked:group-hover/checkbox-label:border-storm/20',
+                'indeterminate:bg-indigo-600 indeterminate:border-storm/20',
+                'indeterminate:ring-2 indeterminate:ring-indigo-100',
+                'indeterminate:hover:bg-indigo-700 indeterminate:hover:border-storm/20',
+                'indeterminate:group-hover/checkbox-label:bg-indigo-700 indeterminate:group-hover/checkbox-label:border-storm/20',
             ],
-            true: 'bg-white-600 border-black-teal-50 cursor-not-allowed ',
+            true: 'bg-white-600 border-storm cursor-not-allowed ',
         },
     },
 });
@@ -34,11 +34,11 @@ const iconContainer = cva([
     variants: {
         disabled: {
             false: 'text-white',
-            true: 'text-black-teal-200',
+            true: 'text-storm-200',
         },
     },
 });
-const icon = cva(['drop-shadow-black-teal-10% text-xs'], {
+const icon = cva(['drop-shadow-2 text-xs'], {
     variants: {
         disabled: {
             false: 'group-hover/p-checkbox:text-sm group-hover/checkbox-label:text-sm',
@@ -93,13 +93,13 @@ export class Checkbox {
     }
     render() {
         const id = this.id?.length ? this.id : this._nonce;
-        return (h("label", { key: '405cb642fd1e1a310e221e73c75cba3ac4c91247', htmlFor: id, class: 'group/p-checkbox flex items-center justify-start gap-2 text-black-teal' }, h("div", { key: '0e3a821728c2a3afbd8e7a556d733d6f066dec94', class: 'relative flex flex-shrink-0 items-center' }, h("input", { key: 'a0b24c4bebf349d3646b84d9ed4ebc1e78312dba', class: checkbox({
+        return (h("label", { key: '0551b891499c7acb2d684ab16bbcdd46ed188fd4', htmlFor: id, class: 'group/p-checkbox flex items-center justify-start gap-2' }, h("div", { key: 'e718baf411eb711babf4ffd327ad7f418a944de9', class: 'relative flex flex-shrink-0 items-center' }, h("input", { key: '8f095a9f67503572f387c0342d86ba7c95f534d4', class: checkbox({
                 disabled: asBoolean(this.disabled),
-            }), type: 'checkbox', id: id, name: this.name, required: asBoolean(this.required), checked: asBoolean(this.checked), indeterminate: asBoolean(this.indeterminate), disabled: asBoolean(this.disabled), onChange: ev => this._onChange(ev) }), h("div", { key: '822918f55e75ab424572f0dfcb3bb2bf2d41ef5a', class: iconContainer({
+            }), type: 'checkbox', id: id, name: this.name, required: asBoolean(this.required), checked: asBoolean(this.checked), indeterminate: asBoolean(this.indeterminate), disabled: asBoolean(this.disabled), onChange: ev => this._onChange(ev) }), h("div", { key: '56e4fe46bf6172e6b098dcf62703dc80db57f810', class: iconContainer({
                 disabled: asBoolean(this.disabled),
-            }) }, h("p-icon", { key: '8932bf5a6fdf25b886c610a797d1f6cef4135581', class: icon({
+            }) }, h("p-icon", { key: '56d0ac331c4dd25219ce51f2e7f5ca4b2ec89e57', class: icon({
                 disabled: asBoolean(this.disabled),
-            }), size: 'auto', variant: asBoolean(this.indeterminate) ? 'minus' : 'checkmarkThick' }))), h("slot", { key: '51e053a0556546c465bdb34094f71203e26e608c' })));
+            }), size: 'auto', variant: asBoolean(this.indeterminate) ? 'minus' : 'checkmarkThick' }))), h("slot", { key: 'a7d8a3c7cc04462e76f5d7c82525dac0844fdfbc' })));
     }
     _onChange(ev) {
         if (this.disabled) {

package/dist/collection/components/atoms/checkbox/checkbox.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox.component.js","sourceRoot":"","sources":["../../../../src/components/atoms/checkbox/checkbox.component.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n\tAttachInternals,\n\tComponent,\n\tEvent,\n\tEventEmitter,\n\tProp,\n\tState,\n\th,\n} from '@stencil/core';\nimport { cva } from 'class-variance-authority';\nimport { asBoolean } from '../../../utils/as-boolean';\nimport { nonce } from '../../../utils/nonce';\n\nconst checkbox = cva(\n\t[\n\t\t'peer appearance-none m-0 outline-none flex-shrink-0',\n\t\t'border border-inset border-solid ',\n\t\t'rounded w-4 h-4',\n\t],\n\t{\n\t\tvariants: {\n\t\t\tdisabled: {\n\t\t\t\tfalse: [\n\t\t\t\t\t'cursor-pointer shadow-1',\n\t\t\t\t\t'bg-white border-black-teal-100',\n\t\t\t\t\t'hover:bg-supportive-lilac-100 hover:border-black-teal-100',\n\t\t\t\t\t'group-hover/checkbox-label:bg-supportive-lilac-100 group-hover/checkbox-label:border-black-teal-100',\n\t\t\t\t\t'checked:bg-supportive-lilac checked:border-black-teal/20',\n\t\t\t\t\t'checked:ring-2 checked:ring-supportive-lilac-100',\n\t\t\t\t\t'checked:hover:bg-supportive-lilac-700 checked:hover:border-black-teal/20',\n\t\t\t\t\t'checked:group-hover/checkbox-label:bg-supportive-lilac-700 checked:group-hover/checkbox-label:border-black-teal/20',\n\t\t\t\t\t'indeterminate:bg-supportive-lilac-700 indeterminate:border-black-teal/20',\n\t\t\t\t\t'indeterminate:ring-2 indeterminate:ring-supportive-lilac-100',\n\t\t\t\t\t'indeterminate:hover:bg-supportive-lilac indeterminate:hover:border-black-teal/20',\n\t\t\t\t\t'indeterminate:group-hover/checkbox-label:bg-supportive-lilac indeterminate:group-hover/checkbox-label:border-black-teal/20',\n\t\t\t\t],\n\t\t\t\ttrue: 'bg-white-600 border-black-teal-50 cursor-not-allowed ',\n\t\t\t},\n\t\t},\n\t}\n);\n\nconst iconContainer = cva(\n\t[\n\t\t'hidden peer-indeterminate:flex peer-checked:flex',\n\t\t'absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 pointer-events-none',\n\t],\n\t{\n\t\tvariants: {\n\t\t\tdisabled: {\n\t\t\t\tfalse: 'text-white',\n\t\t\t\ttrue: 'text-black-teal-200',\n\t\t\t},\n\t\t},\n\t}\n);\n\nconst icon = cva(['drop-shadow-black-teal-10% text-xs'], {\n\tvariants: {\n\t\tdisabled: {\n\t\t\tfalse:\n\t\t\t\t'group-hover/p-checkbox:text-sm group-hover/checkbox-label:text-sm',\n\t\t\ttrue: null,\n\t\t},\n\t},\n});\n\n@Component({\n\ttag: 'p-checkbox',\n\tstyleUrl: 'checkbox.component.css',\n\tformAssociated: true,\n})\nexport class Checkbox {\n\t/**\n\t * Wether the checkbox is checked\n\t */\n\t@Prop() checked: boolean;\n\n\t/**\n\t * Wether the checkbox is in indeterminate state\n\t */\n\t@Prop() indeterminate: boolean;\n\n\t/**\n\t * Wether the checkbox is disabled\n\t */\n\t@Prop({ reflect: true }) disabled: boolean = false;\n\n\t/**\n\t * Wether the checkbox is required\n\t */\n\t@Prop({ reflect: true }) required: boolean = true;\n\n\t/**\n\t * The id of the checkbox button\n\t */\n\t@Prop({ reflect: true }) id: string;\n\n\t/**\n\t * The name of the checkbox button\n\t */\n\t@Prop({ reflect: true }) name: string;\n\n\t/**\n\t * Event whenever the checked changes\n\t */\n\t@Event() checkedChange: EventEmitter<boolean>;\n\t/**\n\t * Event whenever the indeterminate changes\n\t */\n\t@Event() indeterminateChange: EventEmitter<boolean>;\n\n\t@State() private _nonce = nonce(5);\n\n\t@AttachInternals() _internals: ElementInternals;\n\n\tformResetCallback() {\n\t\tthis.checked = false;\n\t\tthis.indeterminate = false;\n\t}\n\n\tformDisabledCallback(disabled: boolean) {\n\t\tif (!this._internals.form) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.disabled = disabled;\n\t}\n\n\trender() {\n\t\tconst id = this.id?.length ? this.id : this._nonce;\n\n\t\treturn (\n\t\t\t<label\n\t\t\t\thtmlFor={id}\n\t\t\t\tclass='group/p-checkbox flex items-center justify-start gap-2 text-black-teal'\n\t\t\t>\n\t\t\t\t<div class='relative flex flex-shrink-0 items-center'>\n\t\t\t\t\t<input\n\t\t\t\t\t\tclass={checkbox({\n\t\t\t\t\t\t\tdisabled: asBoolean(this.disabled),\n\t\t\t\t\t\t})}\n\t\t\t\t\t\ttype='checkbox'\n\t\t\t\t\t\tid={id}\n\t\t\t\t\t\tname={this.name}\n\t\t\t\t\t\trequired={asBoolean(this.required)}\n\t\t\t\t\t\tchecked={asBoolean(this.checked)}\n\t\t\t\t\t\tindeterminate={asBoolean(this.indeterminate)}\n\t\t\t\t\t\tdisabled={asBoolean(this.disabled)}\n\t\t\t\t\t\tonChange={ev => this._onChange(ev)}\n\t\t\t\t\t/>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclass={iconContainer({\n\t\t\t\t\t\t\tdisabled: asBoolean(this.disabled),\n\t\t\t\t\t\t})}\n\t\t\t\t\t>\n\t\t\t\t\t\t<p-icon\n\t\t\t\t\t\t\tclass={icon({\n\t\t\t\t\t\t\t\tdisabled: asBoolean(this.disabled),\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tsize='auto'\n\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\tasBoolean(this.indeterminate) ? 'minus' : 'checkmarkThick'\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t\t<slot />\n\t\t\t</label>\n\t\t);\n\t}\n\n\tprivate _onChange(ev: Event) {\n\t\tif (this.disabled) {\n\t\t\tev.preventDefault();\n\t\t\treturn;\n\t\t}\n\n\t\tconst checked = asBoolean((ev.target as HTMLInputElement).checked);\n\t\tconst indeterminate = asBoolean(\n\t\t\t(ev.target as HTMLInputElement).indeterminate\n\t\t);\n\n\t\tif (checked != this.checked) {\n\t\t\tthis.checked = checked;\n\t\t\tthis.checkedChange.emit(checked);\n\t\t}\n\n\t\tif (indeterminate != this.indeterminate) {\n\t\t\tthis.indeterminate = indeterminate;\n\t\t\tthis.indeterminateChange.emit(indeterminate);\n\t\t}\n\n\t\tthis._internals.setFormValue(\n\t\t\tthis.indeterminate ? 'indeterminate' : this.checked ? 'on' : 'off'\n\t\t);\n\t}\n}\n"]}
+{"version":3,"file":"checkbox.component.js","sourceRoot":"","sources":["../../../../src/components/atoms/checkbox/checkbox.component.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n\tAttachInternals,\n\tComponent,\n\tEvent,\n\tEventEmitter,\n\tProp,\n\tState,\n\th,\n} from '@stencil/core';\nimport { cva } from 'class-variance-authority';\nimport { asBoolean } from '../../../utils/as-boolean';\nimport { nonce } from '../../../utils/nonce';\n\nconst checkbox = cva(\n\t[\n\t\t'peer appearance-none m-0 outline-none flex-shrink-0',\n\t\t'border border-inset border-solid ',\n\t\t'rounded w-4 h-4',\n\t],\n\t{\n\t\tvariants: {\n\t\t\tdisabled: {\n\t\t\t\tfalse: [\n\t\t\t\t\t'cursor-pointer shadow-1',\n\t\t\t\t\t'bg-white border-storm-100',\n\t\t\t\t\t'hover:bg-indigo-100 hover:border-storm/20',\n\t\t\t\t\t'group-hover/checkbox-label:bg-indigo-100 group-hover/checkbox-label:border-storm-100',\n\t\t\t\t\t'checked:bg-indigo-600 checked:border-storm/20',\n\t\t\t\t\t'checked:ring-2 checked:ring-indigo-100',\n\t\t\t\t\t'checked:hover:bg-indigo-700 checked:hover:border-storm/20',\n\t\t\t\t\t'checked:group-hover/checkbox-label:bg-indigo-700 checked:group-hover/checkbox-label:border-storm/20',\n\t\t\t\t\t'indeterminate:bg-indigo-600 indeterminate:border-storm/20',\n\t\t\t\t\t'indeterminate:ring-2 indeterminate:ring-indigo-100',\n\t\t\t\t\t'indeterminate:hover:bg-indigo-700 indeterminate:hover:border-storm/20',\n\t\t\t\t\t'indeterminate:group-hover/checkbox-label:bg-indigo-700 indeterminate:group-hover/checkbox-label:border-storm/20',\n\t\t\t\t],\n\t\t\t\ttrue: 'bg-white-600 border-storm cursor-not-allowed ',\n\t\t\t},\n\t\t},\n\t}\n);\n\nconst iconContainer = cva(\n\t[\n\t\t'hidden peer-indeterminate:flex peer-checked:flex',\n\t\t'absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 pointer-events-none',\n\t],\n\t{\n\t\tvariants: {\n\t\t\tdisabled: {\n\t\t\t\tfalse: 'text-white',\n\t\t\t\ttrue: 'text-storm-200',\n\t\t\t},\n\t\t},\n\t}\n);\n\nconst icon = cva(['drop-shadow-2 text-xs'], {\n\tvariants: {\n\t\tdisabled: {\n\t\t\tfalse:\n\t\t\t\t'group-hover/p-checkbox:text-sm group-hover/checkbox-label:text-sm',\n\t\t\ttrue: null,\n\t\t},\n\t},\n});\n\n@Component({\n\ttag: 'p-checkbox',\n\tstyleUrl: 'checkbox.component.css',\n\tformAssociated: true,\n})\nexport class Checkbox {\n\t/**\n\t * Wether the checkbox is checked\n\t */\n\t@Prop() checked: boolean;\n\n\t/**\n\t * Wether the checkbox is in indeterminate state\n\t */\n\t@Prop() indeterminate: boolean;\n\n\t/**\n\t * Wether the checkbox is disabled\n\t */\n\t@Prop({ reflect: true }) disabled: boolean = false;\n\n\t/**\n\t * Wether the checkbox is required\n\t */\n\t@Prop({ reflect: true }) required: boolean = true;\n\n\t/**\n\t * The id of the checkbox button\n\t */\n\t@Prop({ reflect: true }) id: string;\n\n\t/**\n\t * The name of the checkbox button\n\t */\n\t@Prop({ reflect: true }) name: string;\n\n\t/**\n\t * Event whenever the checked changes\n\t */\n\t@Event() checkedChange: EventEmitter<boolean>;\n\t/**\n\t * Event whenever the indeterminate changes\n\t */\n\t@Event() indeterminateChange: EventEmitter<boolean>;\n\n\t@State() private _nonce = nonce(5);\n\n\t@AttachInternals() _internals: ElementInternals;\n\n\tformResetCallback() {\n\t\tthis.checked = false;\n\t\tthis.indeterminate = false;\n\t}\n\n\tformDisabledCallback(disabled: boolean) {\n\t\tif (!this._internals.form) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.disabled = disabled;\n\t}\n\n\trender() {\n\t\tconst id = this.id?.length ? this.id : this._nonce;\n\n\t\treturn (\n\t\t\t<label\n\t\t\t\thtmlFor={id}\n\t\t\t\tclass='group/p-checkbox flex items-center justify-start gap-2'\n\t\t\t>\n\t\t\t\t<div class='relative flex flex-shrink-0 items-center'>\n\t\t\t\t\t<input\n\t\t\t\t\t\tclass={checkbox({\n\t\t\t\t\t\t\tdisabled: asBoolean(this.disabled),\n\t\t\t\t\t\t})}\n\t\t\t\t\t\ttype='checkbox'\n\t\t\t\t\t\tid={id}\n\t\t\t\t\t\tname={this.name}\n\t\t\t\t\t\trequired={asBoolean(this.required)}\n\t\t\t\t\t\tchecked={asBoolean(this.checked)}\n\t\t\t\t\t\tindeterminate={asBoolean(this.indeterminate)}\n\t\t\t\t\t\tdisabled={asBoolean(this.disabled)}\n\t\t\t\t\t\tonChange={ev => this._onChange(ev)}\n\t\t\t\t\t/>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclass={iconContainer({\n\t\t\t\t\t\t\tdisabled: asBoolean(this.disabled),\n\t\t\t\t\t\t})}\n\t\t\t\t\t>\n\t\t\t\t\t\t<p-icon\n\t\t\t\t\t\t\tclass={icon({\n\t\t\t\t\t\t\t\tdisabled: asBoolean(this.disabled),\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tsize='auto'\n\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\tasBoolean(this.indeterminate) ? 'minus' : 'checkmarkThick'\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t\t<slot />\n\t\t\t</label>\n\t\t);\n\t}\n\n\tprivate _onChange(ev: Event) {\n\t\tif (this.disabled) {\n\t\t\tev.preventDefault();\n\t\t\treturn;\n\t\t}\n\n\t\tconst checked = asBoolean((ev.target as HTMLInputElement).checked);\n\t\tconst indeterminate = asBoolean(\n\t\t\t(ev.target as HTMLInputElement).indeterminate\n\t\t);\n\n\t\tif (checked != this.checked) {\n\t\t\tthis.checked = checked;\n\t\t\tthis.checkedChange.emit(checked);\n\t\t}\n\n\t\tif (indeterminate != this.indeterminate) {\n\t\t\tthis.indeterminate = indeterminate;\n\t\t\tthis.indeterminateChange.emit(indeterminate);\n\t\t}\n\n\t\tthis._internals.setFormValue(\n\t\t\tthis.indeterminate ? 'indeterminate' : this.checked ? 'on' : 'off'\n\t\t);\n\t}\n}\n"]}

package/dist/collection/components/atoms/divider/divider.component.css

@@ -1 +1 @@
-*{box-sizing:border-box}p-divider{--tw-content:""}.flex{display:flex!important}.h-full{height:100%!important}.w-full{width:100%!important}.flex-col{flex-direction:column!important}.items-center{align-items:center!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.font-medium{font-weight:500!important}.text-black-teal-400{--tw-text-opacity:1!important;color:rgb(53 85 80/var(--tw-text-opacity,1))!important}.text-off-white-700{--tw-text-opacity:1!important;color:rgb(222 219 213/var(--tw-text-opacity,1))!important}.before\:hidden:before{content:var(--tw-content)!important;display:none!important}.before\:h-px:before{content:var(--tw-content)!important;height:1px!important}.before\:w-px:before{content:var(--tw-content)!important;width:1px!important}.before\:flex-1:before{content:var(--tw-content)!important;flex:1 1 0%!important}.before\:bg-current:before{background-color:currentColor!important;content:var(--tw-content)!important}.after\:hidden:after{content:var(--tw-content)!important;display:none!important}.after\:h-px:after{content:var(--tw-content)!important;height:1px!important}.after\:w-px:after{content:var(--tw-content)!important;width:1px!important}.after\:flex-1:after{content:var(--tw-content)!important;flex:1 1 0%!important}.after\:bg-current:after{background-color:currentColor!important;content:var(--tw-content)!important}.empty\:px-0:empty{padding-left:0!important;padding-right:0!important}
+*{box-sizing:border-box}p-divider{--tw-content:""}.flex{display:flex!important}.h-full{height:100%!important}.w-full{width:100%!important}.flex-col{flex-direction:column!important}.items-center{align-items:center!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.font-medium{font-weight:500!important}.text-off-white-700{--tw-text-opacity:1!important;color:rgb(222 219 213/var(--tw-text-opacity,1))!important}.text-storm-400{--tw-text-opacity:1!important;color:rgb(70 75 84/var(--tw-text-opacity,1))!important}.before\:hidden:before{content:var(--tw-content)!important;display:none!important}.before\:h-px:before{content:var(--tw-content)!important;height:1px!important}.before\:w-px:before{content:var(--tw-content)!important;width:1px!important}.before\:flex-1:before{content:var(--tw-content)!important;flex:1 1 0%!important}.before\:bg-current:before{background-color:currentColor!important;content:var(--tw-content)!important}.after\:hidden:after{content:var(--tw-content)!important;display:none!important}.after\:h-px:after{content:var(--tw-content)!important;height:1px!important}.after\:w-px:after{content:var(--tw-content)!important;width:1px!important}.after\:flex-1:after{content:var(--tw-content)!important;flex:1 1 0%!important}.after\:bg-current:after{background-color:currentColor!important;content:var(--tw-content)!important}.empty\:px-0:empty{padding-left:0!important;padding-right:0!important}

package/dist/collection/components/atoms/divider/divider.component.js

@@ -37,7 +37,7 @@ export class Divider {
             } }, h("div", { key: '8b889b5e6813f27598f4661e2365b51ecb34c1df', class: content({
                 variant: this.variant,
                 alignContent: this.alignContent,
-            }) }, h("div", { key: 'dc3ae5e3dabda5aa0449f4c3a924ca4d80bca30f', class: 'flex items-center px-2 text-sm font-medium text-black-teal-400 empty:px-0' }, hasContent && h("slot", { key: '40e1c6119722fcc97b3338c24ce02d4755a436c8' })))));
+            }) }, h("div", { key: 'da8f34b7b5a933cb0964580e672772d7630e4810', class: 'flex items-center px-2 text-sm font-medium text-storm-400 empty:px-0' }, hasContent && h("slot", { key: '665bd2cfae7a77abb68633131236c45d017a43f6' })))));
     }
     static get is() { return "p-divider"; }
     static get originalStyleUrls() {

package/dist/collection/components/atoms/divider/divider.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"divider.component.js","sourceRoot":"","sources":["../../../../src/components/atoms/divider/divider.component.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAClE,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAE/C,MAAM,OAAO,GAAG,GAAG,CAClB;IACC,mBAAmB;IACnB,oCAAoC;IACpC,4BAA4B;CAC5B,EACD;IACC,QAAQ,EAAE;QACT,OAAO,EAAE;YACR,UAAU,EAAE,CAAC,wBAAwB,EAAE,QAAQ,CAAC;YAChD,QAAQ,EAAE,CAAC,UAAU,EAAE,wBAAwB,EAAE,QAAQ,CAAC;SAC1D;QACD,YAAY,EAAE;YACb,KAAK,EAAE,eAAe;YACtB,MAAM,EAAE,IAAI;YACZ,GAAG,EAAE,cAAc;SACnB;KACD;CACD,CACD,CAAC;AAMF,MAAM,OAAO,OAAO;IACnB;;OAEG;IACsB,OAAO,GAA8B,YAAY,CAAC;IAE3E;;OAEG;IACsB,YAAY,GAA+B,QAAQ,CAAC;IAE7E;;OAEG;IACgB,GAAG,CAAc;IAEpC,MAAM;QACL,MAAM,UAAU,GAAG,IAAI,CAAC,GAAG,CAAC,SAAS,EAAE,MAAM,GAAG,CAAC,CAAC;QAClD,OAAO,CACN,EAAC,IAAI,qDACJ,KAAK,EAAE;gBACN,oBAAoB,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC,SAAS,CAAC,QAAQ,CAAC,MAAM,CAAC;aAC1D;YAED,4DACC,KAAK,EAAE,OAAO,CAAC;oBACd,OAAO,EAAE,IAAI,CAAC,OAAO;oBACrB,YAAY,EAAE,IAAI,CAAC,YAAY;iBAC/B,CAAC;gBAEF,4DAAK,KAAK,EAAC,2EAA2E,IACpF,UAAU,IAAI,8DAAQ,CAClB,CACD,CACA,CACP,CAAC;IACH,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACD","sourcesContent":["import { Component, h, Prop, Element, Host } from '@stencil/core';\nimport { cva } from 'class-variance-authority';\n\nconst content = cva(\n\t[\n\t\t'flex items-center',\n\t\t'after:bg-current before:bg-current',\n\t\t'after:flex-1 before:flex-1',\n\t],\n\t{\n\t\tvariants: {\n\t\t\tvariant: {\n\t\t\t\thorizontal: ['after:h-px before:h-px', 'w-full'],\n\t\t\t\tvertical: ['flex-col', 'after:w-px before:w-px', 'h-full'],\n\t\t\t},\n\t\t\talignContent: {\n\t\t\t\tstart: 'before:hidden',\n\t\t\t\tcenter: null,\n\t\t\t\tend: 'after:hidden',\n\t\t\t},\n\t\t},\n\t}\n);\n\n@Component({\n\ttag: 'p-divider',\n\tstyleUrl: 'divider.component.css',\n})\nexport class Divider {\n\t/**\n\t * The variant of the modal body\n\t */\n\t@Prop({ reflect: true }) variant: 'horizontal' | 'vertical' = 'horizontal';\n\n\t/**\n\t * Where to align the content\n\t */\n\t@Prop({ reflect: true }) alignContent: 'start' | 'center' | 'end' = 'center';\n\n\t/**\n\t * The host element\n\t */\n\t@Element() private _el: HTMLElement;\n\n\trender() {\n\t\tconst hasContent = this._el.innerHTML?.length > 0;\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={{\n\t\t\t\t\t'text-off-white-700': !this._el.className.includes('text'),\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tclass={content({\n\t\t\t\t\t\tvariant: this.variant,\n\t\t\t\t\t\talignContent: this.alignContent,\n\t\t\t\t\t})}\n\t\t\t\t>\n\t\t\t\t\t<div class='flex items-center px-2 text-sm font-medium text-black-teal-400 empty:px-0'>\n\t\t\t\t\t\t{hasContent && <slot />}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"]}
+{"version":3,"file":"divider.component.js","sourceRoot":"","sources":["../../../../src/components/atoms/divider/divider.component.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAClE,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAE/C,MAAM,OAAO,GAAG,GAAG,CAClB;IACC,mBAAmB;IACnB,oCAAoC;IACpC,4BAA4B;CAC5B,EACD;IACC,QAAQ,EAAE;QACT,OAAO,EAAE;YACR,UAAU,EAAE,CAAC,wBAAwB,EAAE,QAAQ,CAAC;YAChD,QAAQ,EAAE,CAAC,UAAU,EAAE,wBAAwB,EAAE,QAAQ,CAAC;SAC1D;QACD,YAAY,EAAE;YACb,KAAK,EAAE,eAAe;YACtB,MAAM,EAAE,IAAI;YACZ,GAAG,EAAE,cAAc;SACnB;KACD;CACD,CACD,CAAC;AAMF,MAAM,OAAO,OAAO;IACnB;;OAEG;IACsB,OAAO,GAA8B,YAAY,CAAC;IAE3E;;OAEG;IACsB,YAAY,GAA+B,QAAQ,CAAC;IAE7E;;OAEG;IACgB,GAAG,CAAc;IAEpC,MAAM;QACL,MAAM,UAAU,GAAG,IAAI,CAAC,GAAG,CAAC,SAAS,EAAE,MAAM,GAAG,CAAC,CAAC;QAClD,OAAO,CACN,EAAC,IAAI,qDACJ,KAAK,EAAE;gBACN,oBAAoB,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC,SAAS,CAAC,QAAQ,CAAC,MAAM,CAAC;aAC1D;YAED,4DACC,KAAK,EAAE,OAAO,CAAC;oBACd,OAAO,EAAE,IAAI,CAAC,OAAO;oBACrB,YAAY,EAAE,IAAI,CAAC,YAAY;iBAC/B,CAAC;gBAEF,4DAAK,KAAK,EAAC,sEAAsE,IAC/E,UAAU,IAAI,8DAAQ,CAClB,CACD,CACA,CACP,CAAC;IACH,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACD","sourcesContent":["import { Component, h, Prop, Element, Host } from '@stencil/core';\nimport { cva } from 'class-variance-authority';\n\nconst content = cva(\n\t[\n\t\t'flex items-center',\n\t\t'after:bg-current before:bg-current',\n\t\t'after:flex-1 before:flex-1',\n\t],\n\t{\n\t\tvariants: {\n\t\t\tvariant: {\n\t\t\t\thorizontal: ['after:h-px before:h-px', 'w-full'],\n\t\t\t\tvertical: ['flex-col', 'after:w-px before:w-px', 'h-full'],\n\t\t\t},\n\t\t\talignContent: {\n\t\t\t\tstart: 'before:hidden',\n\t\t\t\tcenter: null,\n\t\t\t\tend: 'after:hidden',\n\t\t\t},\n\t\t},\n\t}\n);\n\n@Component({\n\ttag: 'p-divider',\n\tstyleUrl: 'divider.component.css',\n})\nexport class Divider {\n\t/**\n\t * The variant of the modal body\n\t */\n\t@Prop({ reflect: true }) variant: 'horizontal' | 'vertical' = 'horizontal';\n\n\t/**\n\t * Where to align the content\n\t */\n\t@Prop({ reflect: true }) alignContent: 'start' | 'center' | 'end' = 'center';\n\n\t/**\n\t * The host element\n\t */\n\t@Element() private _el: HTMLElement;\n\n\trender() {\n\t\tconst hasContent = this._el.innerHTML?.length > 0;\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={{\n\t\t\t\t\t'text-off-white-700': !this._el.className.includes('text'),\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tclass={content({\n\t\t\t\t\t\tvariant: this.variant,\n\t\t\t\t\t\talignContent: this.alignContent,\n\t\t\t\t\t})}\n\t\t\t\t>\n\t\t\t\t\t<div class='flex items-center px-2 text-sm font-medium text-storm-400 empty:px-0'>\n\t\t\t\t\t\t{hasContent && <slot />}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"]}

package/dist/collection/components/atoms/drawer/header/drawer-header.component.js

@@ -7,7 +7,7 @@ const header = cva([
 const content = cva(['flex justify-between', 'w-full p-4 pb-0 min-h-12']);
 const title = cva([
     'flex-1 text-center',
-    'black-teal-500 text-2xl text-ambit font-bold',
+    'storm-500 text-2xl text-ambit font-bold',
 ]);
 export class DrawerHeader {
     /**
@@ -19,7 +19,7 @@ export class DrawerHeader {
      */
     close;
     render() {
-        return (h("div", { key: 'ffb05b089ecefdd3d23fb015deaea1a90fcf9868', class: header() }, h("div", { key: 'f0f0dbd1a93dee0a738998ee9e84eaebe4664516', class: content() }, this.showClose && (h("p-button", { key: '1a155c66e312bef3eb847245276f2b06d269ad09', variant: 'secondary', icon: 'negative', iconOnly: true, onClick: ev => this.close.emit(ev) })), h("div", { key: '385716c7243e4856a40beeb760a52f7e6e577268', class: title() }, h("slot", { key: '7078a619b4fae4a2ab8050c3e8e847130fa5c29b' })), this.showClose && h("div", { key: 'f69f3fd3167b10a93c099730e2aae4b1ba74163a', class: "size-8" })), h("p-smile", { key: '62d60c03fb5e2aee5337d5b1fde2918ae3ac125e' })));
+        return (h("div", { key: 'e250e8faa0b3df4523ba9dbf7c6203b34629135e', class: header() }, h("div", { key: '0208b32ccd4b63a23c47ab86d25b8614bd45cd63', class: content() }, this.showClose && (h("p-button", { key: 'e73e3e2ceb6a667d8d93204c754e38cff657595f', variant: 'secondary', icon: 'negative', iconOnly: true, onClick: ev => this.close.emit(ev) })), h("div", { key: '1e180c299dd9e0d7ccf2e191650faeb3c7e1b58c', class: title() }, h("slot", { key: '0a883a7cf8bad4d1ec8abb68a24458fd52b24ab6' })), this.showClose && h("div", { key: '61dddd4b2339aee4d72d0fb04e1f672a87bdc1f8', class: "size-8" })), h("p-smile", { key: '36e7af85229de55a80b0767d0a22cd7391e1d208' })));
     }
     static get is() { return "p-drawer-header"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/atoms/drawer/header/drawer-header.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"drawer-header.component.js","sourceRoot":"","sources":["../../../../../src/components/atoms/drawer/header/drawer-header.component.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AACxE,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAE/C,MAAM,MAAM,GAAG,GAAG,CAAC;IAClB,gFAAgF;IAChF,aAAa;CACb,CAAC,CAAC;AAEH,MAAM,OAAO,GAAG,GAAG,CAAC,CAAC,sBAAsB,EAAE,0BAA0B,CAAC,CAAC,CAAC;AAE1E,MAAM,KAAK,GAAG,GAAG,CAAC;IACjB,oBAAoB;IACpB,8CAA8C;CAC9C,CAAC,CAAC;AAOH,MAAM,OAAO,YAAY;IACxB;;OAEG;IACK,SAAS,GAAG,IAAI,CAAC;IAEzB;;OAEG;IAIH,KAAK,CAA2B;IAEhC,MAAM;QACL,OAAO,CACN,4DAAK,KAAK,EAAE,MAAM,EAAE;YACnB,4DAAK,KAAK,EAAE,OAAO,EAAE;gBACnB,IAAI,CAAC,SAAS,IAAI,CAClB,iEACC,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,UAAU,EACf,QAAQ,EAAE,IAAI,EACd,OAAO,EAAE,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,GACvB,CACZ;gBAED,4DAAK,KAAK,EAAE,KAAK,EAAE;oBAClB,8DAAQ,CACH;gBAEL,IAAI,CAAC,SAAS,IAAI,4DAAK,KAAK,EAAC,QAAQ,GAAG,CACpC;YAEN,iEAAW,CACN,CACN,CAAC;IACH,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACD","sourcesContent":["import { Component, Event, EventEmitter, h, Prop } from '@stencil/core';\nimport { cva } from 'class-variance-authority';\n\nconst header = cva([\n\t'w-full min-h-18 flex-col bg-white relative rounded-t-2xl overflow-hidden z-[1]',\n\t'inline-flex',\n]);\n\nconst content = cva(['flex justify-between', 'w-full p-4 pb-0 min-h-12']);\n\nconst title = cva([\n\t'flex-1 text-center',\n\t'black-teal-500 text-2xl text-ambit font-bold',\n]);\n\n@Component({\n\ttag: 'p-drawer-header',\n\tstyleUrl: 'drawer-header.component.css',\n\tshadow: true,\n})\nexport class DrawerHeader {\n\t/**\n\t * Wether to show the close button on mobile\n\t */\n\t@Prop() showClose = true;\n\n\t/**\n\t * Close click event\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tclose: EventEmitter<MouseEvent>;\n\n\trender() {\n\t\treturn (\n\t\t\t<div class={header()}>\n\t\t\t\t<div class={content()}>\n\t\t\t\t\t{this.showClose && (\n\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\t\ticon='negative'\n\t\t\t\t\t\t\ticonOnly={true}\n\t\t\t\t\t\t\tonClick={ev => this.close.emit(ev)}\n\t\t\t\t\t\t></p-button>\n\t\t\t\t\t)}\n\n\t\t\t\t\t<div class={title()}>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</div>\n\n\t\t\t\t\t{this.showClose && <div class=\"size-8\" />}\n\t\t\t\t</div>\n\n\t\t\t\t<p-smile />\n\t\t\t</div>\n\t\t);\n\t}\n}\n"]}
+{"version":3,"file":"drawer-header.component.js","sourceRoot":"","sources":["../../../../../src/components/atoms/drawer/header/drawer-header.component.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AACxE,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAE/C,MAAM,MAAM,GAAG,GAAG,CAAC;IAClB,gFAAgF;IAChF,aAAa;CACb,CAAC,CAAC;AAEH,MAAM,OAAO,GAAG,GAAG,CAAC,CAAC,sBAAsB,EAAE,0BAA0B,CAAC,CAAC,CAAC;AAE1E,MAAM,KAAK,GAAG,GAAG,CAAC;IACjB,oBAAoB;IACpB,yCAAyC;CACzC,CAAC,CAAC;AAOH,MAAM,OAAO,YAAY;IACxB;;OAEG;IACK,SAAS,GAAG,IAAI,CAAC;IAEzB;;OAEG;IAIH,KAAK,CAA2B;IAEhC,MAAM;QACL,OAAO,CACN,4DAAK,KAAK,EAAE,MAAM,EAAE;YACnB,4DAAK,KAAK,EAAE,OAAO,EAAE;gBACnB,IAAI,CAAC,SAAS,IAAI,CAClB,iEACC,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,UAAU,EACf,QAAQ,EAAE,IAAI,EACd,OAAO,EAAE,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,GACvB,CACZ;gBAED,4DAAK,KAAK,EAAE,KAAK,EAAE;oBAClB,8DAAQ,CACH;gBAEL,IAAI,CAAC,SAAS,IAAI,4DAAK,KAAK,EAAC,QAAQ,GAAG,CACpC;YAEN,iEAAW,CACN,CACN,CAAC;IACH,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACD","sourcesContent":["import { Component, Event, EventEmitter, h, Prop } from '@stencil/core';\nimport { cva } from 'class-variance-authority';\n\nconst header = cva([\n\t'w-full min-h-18 flex-col bg-white relative rounded-t-2xl overflow-hidden z-[1]',\n\t'inline-flex',\n]);\n\nconst content = cva(['flex justify-between', 'w-full p-4 pb-0 min-h-12']);\n\nconst title = cva([\n\t'flex-1 text-center',\n\t'storm-500 text-2xl text-ambit font-bold',\n]);\n\n@Component({\n\ttag: 'p-drawer-header',\n\tstyleUrl: 'drawer-header.component.css',\n\tshadow: true,\n})\nexport class DrawerHeader {\n\t/**\n\t * Wether to show the close button on mobile\n\t */\n\t@Prop() showClose = true;\n\n\t/**\n\t * Close click event\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tclose: EventEmitter<MouseEvent>;\n\n\trender() {\n\t\treturn (\n\t\t\t<div class={header()}>\n\t\t\t\t<div class={content()}>\n\t\t\t\t\t{this.showClose && (\n\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\t\ticon='negative'\n\t\t\t\t\t\t\ticonOnly={true}\n\t\t\t\t\t\t\tonClick={ev => this.close.emit(ev)}\n\t\t\t\t\t\t></p-button>\n\t\t\t\t\t)}\n\n\t\t\t\t\t<div class={title()}>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</div>\n\n\t\t\t\t\t{this.showClose && <div class=\"size-8\" />}\n\t\t\t\t</div>\n\n\t\t\t\t<p-smile />\n\t\t\t</div>\n\t\t);\n\t}\n}\n"]}

package/dist/collection/components/atoms/dropdown-menu/container/dropdown-menu-container.component.css

@@ -1 +1 @@
-*{box-sizing:border-box}.relative{position:relative!important}.z-10{z-index:10!important}.flex{display:flex!important}.max-h-\[11\.5rem\]{max-height:11.5rem!important}.max-h-\[13\.875rem\]{max-height:13.875rem!important}.max-h-\[20rem\]{max-height:20rem!important}.min-h-full{min-height:100%!important}.w-auto{width:auto!important}.w-full{width:100%!important}.max-w-\[13\.875rem\]{max-width:13.875rem!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}.flex-col{flex-direction:column!important}.overflow-y-auto{overflow-y:auto!important}.overflow-x-hidden{overflow-x:hidden!important}.rounded-lg{border-radius:.5rem!important}.border{border-width:1px!important}.border-black-teal-100{--tw-border-opacity:1!important;border-color:rgb(205 212 211/var(--tw-border-opacity,1))!important}.border-dark-teal-400{--tw-border-opacity:1!important;border-color:rgb(51 116 109/var(--tw-border-opacity,1))!important}.bg-dark-teal-400{--tw-bg-opacity:1!important;background-color:rgb(51 116 109/var(--tw-bg-opacity,1))!important}.bg-white{--tw-bg-opacity:1!important;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))!important}.p-1{padding:.25rem!important}.drop-shadow-2{--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}.drop-shadow-2,.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}.will-change-transform{will-change:transform!important}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:85.375rem){.container{max-width:85.375rem}}@media (min-width:90rem){.container{max-width:90rem}}@media (min-width:96rem){.container{max-width:96rem}}@media (min-width:105rem){.container{max-width:105rem}}@media (min-width:120rem){.container{max-width:120rem}}@media (min-width:160rem){.container{max-width:160rem}}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}
+*{box-sizing:border-box}.relative{position:relative!important}.z-10{z-index:10!important}.flex{display:flex!important}.max-h-\[11\.5rem\]{max-height:11.5rem!important}.max-h-\[13\.875rem\]{max-height:13.875rem!important}.max-h-\[20rem\]{max-height:20rem!important}.min-h-full{min-height:100%!important}.w-auto{width:auto!important}.w-full{width:100%!important}.max-w-\[13\.875rem\]{max-width:13.875rem!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}.flex-col{flex-direction:column!important}.overflow-y-auto{overflow-y:auto!important}.overflow-x-hidden{overflow-x:hidden!important}.rounded-lg{border-radius:.5rem!important}.border{border-width:1px!important}.border-storm-100{--tw-border-opacity:1!important;border-color:rgb(209 210 212/var(--tw-border-opacity,1))!important}.border-storm-400{--tw-border-opacity:1!important;border-color:rgb(70 75 84/var(--tw-border-opacity,1))!important}.bg-storm-400{background-color:rgb(70 75 84/var(--tw-bg-opacity,1))!important}.bg-storm-400,.bg-white{--tw-bg-opacity:1!important}.bg-white{background-color:rgb(255 255 255/var(--tw-bg-opacity,1))!important}.p-1{padding:.25rem!important}.drop-shadow-2{--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}.drop-shadow-2,.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}.will-change-transform{will-change:transform!important}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:85.375rem){.container{max-width:85.375rem}}@media (min-width:90rem){.container{max-width:90rem}}@media (min-width:96rem){.container{max-width:96rem}}@media (min-width:105rem){.container{max-width:105rem}}@media (min-width:120rem){.container{max-width:120rem}}@media (min-width:160rem){.container{max-width:160rem}}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}

package/dist/collection/components/atoms/dropdown-menu/container/dropdown-menu-container.component.js

@@ -10,8 +10,8 @@ const dropdownMenuContainer = cva([
 ], {
     variants: {
         variant: {
-            default: 'bg-white border-black-teal-100 drop-shadow-2 ',
-            'dark-teal': 'bg-dark-teal-400 drop-shadow-3 border-dark-teal-400',
+            default: 'bg-white border-storm-100 drop-shadow-2 ',
+            storm: 'bg-storm-400 drop-shadow-3 border-storm-400',
         },
         fullWidth: {
             false: null,
@@ -75,15 +75,15 @@ export class DropdownMenuContainer {
             : this.scrollable === true
                 ? 'default'
                 : this.scrollable;
-        return (h("div", { key: 'cbd09df9b05562b0a59a428f9f5e89f22d617151', class: dropdownMenuContainer({
+        return (h("div", { key: 'a730d8d0fbcb45733909c30bd217e77e68047a06', class: dropdownMenuContainer({
                 class: this.class,
                 variant: this.variant,
                 fullWidth: asBoolean(this.fullWidth, true),
                 maxWidth: this.maxWidth,
-            }) }, h("div", { key: '2c224326325793e8fbec5704ec0e5987528ebba4', class: innerContainer({
+            }) }, h("div", { key: '521d8a1f69e7d70d356edf3085715644c3799016', class: innerContainer({
                 allowOverflow: asBoolean(this.allowOverflow),
                 scrollable,
-            }) }, h("div", { key: '6364abaa8ac670cb1dd48261a0f0bd91d3d67bf1', class: 'flex w-full flex-col' }, h("slot", { key: 'd7df8fbc7cf4f3900a153b9a640e8bc39f388f79' })))));
+            }) }, h("div", { key: '4526d24f33b8695e9a9861e604834ea629ab6a46', class: 'flex w-full flex-col' }, h("slot", { key: '1aaca49e10995bdc3e402b362962b1b52e22d869' })))));
     }
     static get is() { return "p-dropdown-menu-container"; }
     static get encapsulation() { return "shadow"; }
@@ -104,8 +104,8 @@ export class DropdownMenuContainer {
                 "attribute": "variant",
                 "mutable": false,
                 "complexType": {
-                    "original": "'default' | 'dark-teal'",
-                    "resolved": "\"dark-teal\" | \"default\"",
+                    "original": "'default' | 'storm'",
+                    "resolved": "\"default\" | \"storm\"",
                     "references": {}
                 },
                 "required": false,

package/dist/collection/components/atoms/dropdown-menu/container/dropdown-menu-container.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown-menu-container.component.js","sourceRoot":"","sources":["../../../../../src/components/atoms/dropdown-menu/container/dropdown-menu-container.component.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AACnD,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAC/C,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAEzD,MAAM,qBAAqB,GAAG,GAAG,CAChC;IACC,2BAA2B;IAC3B,KAAK;IACL,iBAAiB;IACjB,QAAQ;IACR,qCAAqC;CACrC,EACD;IACC,QAAQ,EAAE;QACT,OAAO,EAAE;YACR,OAAO,EAAE,+CAA+C;YACxD,WAAW,EAAE,qDAAqD;SAClE;QACD,SAAS,EAAE;YACV,KAAK,EAAE,IAAI;YACX,IAAI,EAAE,QAAQ;SACd;QACD,QAAQ,EAAE;YACT,KAAK,EAAE,IAAI;YACX,IAAI,EAAE,mBAAmB;SACzB;KACD;IACD,gBAAgB,EAAE;QACjB;YACC,SAAS,EAAE,KAAK;YAChB,QAAQ,EAAE,IAAI;YACd,KAAK,EAAE,QAAQ;SACf;KACD;CACD,CACD,CAAC;AAEF,MAAM,cAAc,GAAG,GAAG,CAAC,4BAA4B,EAAE;IACxD,QAAQ,EAAE;QACT,aAAa,EAAE;YACd,KAAK,EAAE,mCAAmC;YAC1C,IAAI,EAAE,IAAI;SACV;QACD,UAAU,EAAE;YACX,IAAI,EAAE,IAAI;YACV,OAAO,EAAE,iBAAiB;YAC1B,KAAK,EAAE,mBAAmB;YAC1B,MAAM,EAAE,eAAe;SACvB;KACD;CACD,CAAC,CAAC;AAOH,MAAM,OAAO,qBAAqB;IACjC;;OAEG;IACK,OAAO,GAA4B,SAAS,CAAC;IAErD;;OAEG;IACK,QAAQ,GAAY,IAAI,CAAC;IAEjC;;OAEG;IACK,KAAK,CAAS;IAEtB;;OAEG;IACK,SAAS,GAAY,IAAI,CAAC;IAElC;;OAEG;IACK,aAAa,GAAY,KAAK,CAAC;IAEvC;;OAEG;IACK,UAAU,GAA6C,KAAK,CAAC;IAErE,MAAM;QACL,MAAM,UAAU,GACf,IAAI,CAAC,UAAU,KAAK,KAAK;YACxB,CAAC,CAAC,MAAM;YACR,CAAC,CAAC,IAAI,CAAC,UAAU,KAAK,IAAI;gBAC1B,CAAC,CAAC,SAAS;gBACX,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC;QAEpB,OAAO,CACN,4DACC,KAAK,EAAE,qBAAqB,CAAC;gBAC5B,KAAK,EAAE,IAAI,CAAC,KAAK;gBACjB,OAAO,EAAE,IAAI,CAAC,OAAO;gBACrB,SAAS,EAAE,SAAS,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC;gBAC1C,QAAQ,EAAE,IAAI,CAAC,QAAQ;aACvB,CAAC;YAEF,4DACC,KAAK,EAAE,cAAc,CAAC;oBACrB,aAAa,EAAE,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC;oBAC5C,UAAU;iBACV,CAAC;gBAEF,4DAAK,KAAK,EAAC,sBAAsB;oBAChC,8DAAQ,CACH,CACD,CACD,CACN,CAAC;IACH,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACD","sourcesContent":["import { Component, h, Prop } from '@stencil/core';\nimport { cva } from 'class-variance-authority';\nimport { asBoolean } from '../../../../utils/as-boolean';\n\nconst dropdownMenuContainer = cva(\n\t[\n\t\t'p-dropdown-menu-container',\n\t\t'p-1',\n\t\t'rounded-lg z-10',\n\t\t'border',\n\t\t'transform-gpu will-change-transform',\n\t],\n\t{\n\t\tvariants: {\n\t\t\tvariant: {\n\t\t\t\tdefault: 'bg-white border-black-teal-100 drop-shadow-2 ',\n\t\t\t\t'dark-teal': 'bg-dark-teal-400 drop-shadow-3 border-dark-teal-400',\n\t\t\t},\n\t\t\tfullWidth: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: 'w-full',\n\t\t\t},\n\t\t\tmaxWidth: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: 'max-w-[13.875rem]',\n\t\t\t},\n\t\t},\n\t\tcompoundVariants: [\n\t\t\t{\n\t\t\t\tfullWidth: false,\n\t\t\t\tmaxWidth: true,\n\t\t\t\tclass: 'w-auto',\n\t\t\t},\n\t\t],\n\t}\n);\n\nconst innerContainer = cva('w-full min-h-full relative', {\n\tvariants: {\n\t\tallowOverflow: {\n\t\t\tfalse: 'overflow-y-auto overflow-x-hidden',\n\t\t\ttrue: null,\n\t\t},\n\t\tscrollable: {\n\t\t\tnone: null,\n\t\t\tdefault: 'max-h-[11.5rem]',\n\t\t\tlarge: 'max-h-[13.875rem]',\n\t\t\txlarge: 'max-h-[20rem]',\n\t\t},\n\t},\n});\n\n@Component({\n\ttag: 'p-dropdown-menu-container',\n\tstyleUrl: 'dropdown-menu-container.component.css',\n\tshadow: true,\n})\nexport class DropdownMenuContainer {\n\t/**\n\t * The variant of the container\n\t */\n\t@Prop() variant: 'default' | 'dark-teal' = 'default';\n\n\t/**\n\t * Wether the container applies it's max width\n\t */\n\t@Prop() maxWidth: boolean = true;\n\n\t/**\n\t * The class of the container passed by parent\n\t */\n\t@Prop() class: string;\n\n\t/**\n\t * Wether the container should all available space\n\t */\n\t@Prop() fullWidth: boolean = true;\n\n\t/**\n\t * Wether to allow overflow\n\t */\n\t@Prop() allowOverflow: boolean = false;\n\n\t/**\n\t * Wether the container should be scrollable when the threshold is met.\n\t */\n\t@Prop() scrollable: boolean | 'default' | 'large' | 'xlarge' = false;\n\n\trender() {\n\t\tconst scrollable =\n\t\t\tthis.scrollable === false\n\t\t\t\t? 'none'\n\t\t\t\t: this.scrollable === true\n\t\t\t\t? 'default'\n\t\t\t\t: this.scrollable;\n\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={dropdownMenuContainer({\n\t\t\t\t\tclass: this.class,\n\t\t\t\t\tvariant: this.variant,\n\t\t\t\t\tfullWidth: asBoolean(this.fullWidth, true),\n\t\t\t\t\tmaxWidth: this.maxWidth,\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tclass={innerContainer({\n\t\t\t\t\t\tallowOverflow: asBoolean(this.allowOverflow),\n\t\t\t\t\t\tscrollable,\n\t\t\t\t\t})}\n\t\t\t\t>\n\t\t\t\t\t<div class='flex w-full flex-col'>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t);\n\t}\n}\n"]}
+{"version":3,"file":"dropdown-menu-container.component.js","sourceRoot":"","sources":["../../../../../src/components/atoms/dropdown-menu/container/dropdown-menu-container.component.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AACnD,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAC/C,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAEzD,MAAM,qBAAqB,GAAG,GAAG,CAChC;IACC,2BAA2B;IAC3B,KAAK;IACL,iBAAiB;IACjB,QAAQ;IACR,qCAAqC;CACrC,EACD;IACC,QAAQ,EAAE;QACT,OAAO,EAAE;YACR,OAAO,EAAE,0CAA0C;YACnD,KAAK,EAAE,6CAA6C;SACpD;QACD,SAAS,EAAE;YACV,KAAK,EAAE,IAAI;YACX,IAAI,EAAE,QAAQ;SACd;QACD,QAAQ,EAAE;YACT,KAAK,EAAE,IAAI;YACX,IAAI,EAAE,mBAAmB;SACzB;KACD;IACD,gBAAgB,EAAE;QACjB;YACC,SAAS,EAAE,KAAK;YAChB,QAAQ,EAAE,IAAI;YACd,KAAK,EAAE,QAAQ;SACf;KACD;CACD,CACD,CAAC;AAEF,MAAM,cAAc,GAAG,GAAG,CAAC,4BAA4B,EAAE;IACxD,QAAQ,EAAE;QACT,aAAa,EAAE;YACd,KAAK,EAAE,mCAAmC;YAC1C,IAAI,EAAE,IAAI;SACV;QACD,UAAU,EAAE;YACX,IAAI,EAAE,IAAI;YACV,OAAO,EAAE,iBAAiB;YAC1B,KAAK,EAAE,mBAAmB;YAC1B,MAAM,EAAE,eAAe;SACvB;KACD;CACD,CAAC,CAAC;AAOH,MAAM,OAAO,qBAAqB;IACjC;;OAEG;IACK,OAAO,GAAwB,SAAS,CAAC;IAEjD;;OAEG;IACK,QAAQ,GAAY,IAAI,CAAC;IAEjC;;OAEG;IACK,KAAK,CAAS;IAEtB;;OAEG;IACK,SAAS,GAAY,IAAI,CAAC;IAElC;;OAEG;IACK,aAAa,GAAY,KAAK,CAAC;IAEvC;;OAEG;IACK,UAAU,GAA6C,KAAK,CAAC;IAErE,MAAM;QACL,MAAM,UAAU,GACf,IAAI,CAAC,UAAU,KAAK,KAAK;YACxB,CAAC,CAAC,MAAM;YACR,CAAC,CAAC,IAAI,CAAC,UAAU,KAAK,IAAI;gBAC1B,CAAC,CAAC,SAAS;gBACX,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC;QAEpB,OAAO,CACN,4DACC,KAAK,EAAE,qBAAqB,CAAC;gBAC5B,KAAK,EAAE,IAAI,CAAC,KAAK;gBACjB,OAAO,EAAE,IAAI,CAAC,OAAO;gBACrB,SAAS,EAAE,SAAS,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC;gBAC1C,QAAQ,EAAE,IAAI,CAAC,QAAQ;aACvB,CAAC;YAEF,4DACC,KAAK,EAAE,cAAc,CAAC;oBACrB,aAAa,EAAE,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC;oBAC5C,UAAU;iBACV,CAAC;gBAEF,4DAAK,KAAK,EAAC,sBAAsB;oBAChC,8DAAQ,CACH,CACD,CACD,CACN,CAAC;IACH,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACD","sourcesContent":["import { Component, h, Prop } from '@stencil/core';\nimport { cva } from 'class-variance-authority';\nimport { asBoolean } from '../../../../utils/as-boolean';\n\nconst dropdownMenuContainer = cva(\n\t[\n\t\t'p-dropdown-menu-container',\n\t\t'p-1',\n\t\t'rounded-lg z-10',\n\t\t'border',\n\t\t'transform-gpu will-change-transform',\n\t],\n\t{\n\t\tvariants: {\n\t\t\tvariant: {\n\t\t\t\tdefault: 'bg-white border-storm-100 drop-shadow-2 ',\n\t\t\t\tstorm: 'bg-storm-400 drop-shadow-3 border-storm-400',\n\t\t\t},\n\t\t\tfullWidth: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: 'w-full',\n\t\t\t},\n\t\t\tmaxWidth: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: 'max-w-[13.875rem]',\n\t\t\t},\n\t\t},\n\t\tcompoundVariants: [\n\t\t\t{\n\t\t\t\tfullWidth: false,\n\t\t\t\tmaxWidth: true,\n\t\t\t\tclass: 'w-auto',\n\t\t\t},\n\t\t],\n\t}\n);\n\nconst innerContainer = cva('w-full min-h-full relative', {\n\tvariants: {\n\t\tallowOverflow: {\n\t\t\tfalse: 'overflow-y-auto overflow-x-hidden',\n\t\t\ttrue: null,\n\t\t},\n\t\tscrollable: {\n\t\t\tnone: null,\n\t\t\tdefault: 'max-h-[11.5rem]',\n\t\t\tlarge: 'max-h-[13.875rem]',\n\t\t\txlarge: 'max-h-[20rem]',\n\t\t},\n\t},\n});\n\n@Component({\n\ttag: 'p-dropdown-menu-container',\n\tstyleUrl: 'dropdown-menu-container.component.css',\n\tshadow: true,\n})\nexport class DropdownMenuContainer {\n\t/**\n\t * The variant of the container\n\t */\n\t@Prop() variant: 'default' | 'storm' = 'default';\n\n\t/**\n\t * Wether the container applies it's max width\n\t */\n\t@Prop() maxWidth: boolean = true;\n\n\t/**\n\t * The class of the container passed by parent\n\t */\n\t@Prop() class: string;\n\n\t/**\n\t * Wether the container should all available space\n\t */\n\t@Prop() fullWidth: boolean = true;\n\n\t/**\n\t * Wether to allow overflow\n\t */\n\t@Prop() allowOverflow: boolean = false;\n\n\t/**\n\t * Wether the container should be scrollable when the threshold is met.\n\t */\n\t@Prop() scrollable: boolean | 'default' | 'large' | 'xlarge' = false;\n\n\trender() {\n\t\tconst scrollable =\n\t\t\tthis.scrollable === false\n\t\t\t\t? 'none'\n\t\t\t\t: this.scrollable === true\n\t\t\t\t? 'default'\n\t\t\t\t: this.scrollable;\n\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={dropdownMenuContainer({\n\t\t\t\t\tclass: this.class,\n\t\t\t\t\tvariant: this.variant,\n\t\t\t\t\tfullWidth: asBoolean(this.fullWidth, true),\n\t\t\t\t\tmaxWidth: this.maxWidth,\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tclass={innerContainer({\n\t\t\t\t\t\tallowOverflow: asBoolean(this.allowOverflow),\n\t\t\t\t\t\tscrollable,\n\t\t\t\t\t})}\n\t\t\t\t>\n\t\t\t\t\t<div class='flex w-full flex-col'>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t);\n\t}\n}\n"]}

package/dist/collection/components/atoms/dropdown-menu/item/dropdown-menu-item.component.css

@@ -1 +1 @@
-*{box-sizing:border-box}.block{display:block!important}.flex{display:flex!important}.h-8{height:2rem!important}.min-h-8{min-height:2rem!important}.w-full{width:100%!important}.max-w-full{max-width:100%!important}.cursor-not-allowed{cursor:not-allowed!important}.cursor-pointer{cursor:pointer!important}.items-center{align-items:center!important}.gap-2{gap:.5rem!important}.overflow-hidden{overflow:hidden!important}.text-ellipsis{text-overflow:ellipsis!important}.whitespace-nowrap{white-space:nowrap!important}.rounded-lg{border-radius:.5rem!important}.bg-dark-teal-600{--tw-bg-opacity:1!important;background-color:rgb(0 72 64/var(--tw-bg-opacity,1))!important}.bg-negative-red-100{--tw-bg-opacity:1!important;background-color:rgb(255 221 221/var(--tw-bg-opacity,1))!important}.bg-negative-red-50{--tw-bg-opacity:1!important;background-color:rgb(253 237 237/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}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.py-1{padding-bottom:.25rem!important;padding-top:.25rem!important}.text-start{text-align:start!important}.text-base{font-size:1rem!important;line-height:1.5rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.font-medium{font-weight:500!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-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}.text-dark-teal-100{--tw-text-opacity:1!important;color:rgb(204 220 218/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-100{--tw-text-opacity:1!important;color:rgb(255 221 221/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}.text-white{--tw-text-opacity:1!important;color:rgb(255 255 255/var(--tw-text-opacity,1))!important}.opacity-40{opacity:.4!important}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:85.375rem){.container{max-width:85.375rem}}@media (min-width:90rem){.container{max-width:90rem}}@media (min-width:96rem){.container{max-width:96rem}}@media (min-width:105rem){.container{max-width:105rem}}@media (min-width:120rem){.container{max-width:120rem}}@media (min-width:160rem){.container{max-width:160rem}}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.hover\:bg-dark-teal-500:hover{--tw-bg-opacity:1!important;background-color:rgb(0 81 72/var(--tw-bg-opacity,1))!important}.hover\:bg-negative-red-50:hover{--tw-bg-opacity:1!important;background-color:rgb(253 237 237/var(--tw-bg-opacity,1))!important}.hover\:bg-supportive-lilac-50:hover{--tw-bg-opacity:1!important;background-color:rgb(250 247 255/var(--tw-bg-opacity,1))!important}@keyframes wave{0%{transform:rotate(0deg)}to{transform:rotate(-15deg)}}.group:hover .group-hover\:animate-wave{animation:wave .5s ease-in-out -.5s infinite alternate forwards!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-negative-red-800{--tw-text-opacity:1!important;color:rgb(141 16 16/var(--tw-text-opacity,1))!important}.group:hover .group-hover\:text-white{--tw-text-opacity:1!important;color:rgb(255 255 255/var(--tw-text-opacity,1))!important}
+*{box-sizing:border-box}.block{display:block!important}.flex{display:flex!important}.h-8{height:2rem!important}.min-h-8{min-height:2rem!important}.w-full{width:100%!important}.max-w-full{max-width:100%!important}.cursor-not-allowed{cursor:not-allowed!important}.cursor-pointer{cursor:pointer!important}.items-center{align-items:center!important}.gap-2{gap:.5rem!important}.overflow-hidden{overflow:hidden!important}.text-ellipsis{text-overflow:ellipsis!important}.whitespace-nowrap{white-space:nowrap!important}.rounded-lg{border-radius:.5rem!important}.bg-indigo-100{--tw-bg-opacity:1!important;background-color:rgb(227 236 254/var(--tw-bg-opacity,1))!important}.bg-indigo-50{--tw-bg-opacity:1!important;background-color:rgb(241 246 255/var(--tw-bg-opacity,1))!important}.bg-negative-red-100{--tw-bg-opacity:1!important;background-color:rgb(255 221 221/var(--tw-bg-opacity,1))!important}.bg-negative-red-50{--tw-bg-opacity:1!important;background-color:rgb(253 237 237/var(--tw-bg-opacity,1))!important}.bg-storm-600{--tw-bg-opacity:1!important;background-color:rgb(15 22 34/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}.text-start{text-align:start!important}.text-base{font-size:1rem!important;line-height:1.5rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.font-medium{font-weight:500!important}.text-negative-red{--tw-text-opacity:1!important;color:rgb(230 30 30/var(--tw-text-opacity,1))!important}.text-negative-red-100{--tw-text-opacity:1!important;color:rgb(255 221 221/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}.text-storm{color:rgb(24 30 41/var(--tw-text-opacity,1))!important}.text-storm,.text-storm-100{--tw-text-opacity:1!important}.text-storm-100{color:rgb(209 210 212/var(--tw-text-opacity,1))!important}.text-storm-200{--tw-text-opacity:1!important;color:rgb(163 165 169/var(--tw-text-opacity,1))!important}.text-storm-300{color:rgb(116 120 127/var(--tw-text-opacity,1))!important}.text-storm-300,.text-white{--tw-text-opacity:1!important}.text-white{color:rgb(255 255 255/var(--tw-text-opacity,1))!important}.opacity-40{opacity:.4!important}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:85.375rem){.container{max-width:85.375rem}}@media (min-width:90rem){.container{max-width:90rem}}@media (min-width:96rem){.container{max-width:96rem}}@media (min-width:105rem){.container{max-width:105rem}}@media (min-width:120rem){.container{max-width:120rem}}@media (min-width:160rem){.container{max-width:160rem}}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.hover\:bg-indigo-50:hover{--tw-bg-opacity:1!important;background-color:rgb(241 246 255/var(--tw-bg-opacity,1))!important}.hover\:bg-negative-red-50:hover{--tw-bg-opacity:1!important;background-color:rgb(253 237 237/var(--tw-bg-opacity,1))!important}.hover\:bg-storm-500:hover{--tw-bg-opacity:1!important;background-color:rgb(24 30 41/var(--tw-bg-opacity,1))!important}@keyframes wave{0%{transform:rotate(0deg)}to{transform:rotate(-15deg)}}.group:hover .group-hover\:animate-wave{animation:wave .5s ease-in-out -.5s infinite alternate forwards!important}.group:hover .group-hover\:text-negative-red-800{--tw-text-opacity:1!important;color:rgb(141 16 16/var(--tw-text-opacity,1))!important}.group:hover .group-hover\:text-storm{--tw-text-opacity:1!important;color:rgb(24 30 41/var(--tw-text-opacity,1))!important}.group:hover .group-hover\:text-white{--tw-text-opacity:1!important;color:rgb(255 255 255/var(--tw-text-opacity,1))!important}

package/dist/collection/components/atoms/dropdown-menu/item/dropdown-menu-item.component.js

@@ -8,7 +8,7 @@ const dropdownMenuItem = cva([
     variants: {
         variant: {
             default: null,
-            'dark-teal': null,
+            storm: null,
             negative: null,
         },
         active: {
@@ -34,50 +34,50 @@ const dropdownMenuItem = cva([
             active: false,
             enableHover: true,
             disabled: false,
-            class: 'hover:bg-supportive-lilac-50',
+            class: 'hover:bg-indigo-50',
         },
         {
             variant: 'default',
             active: true,
             disabled: false,
-            class: 'bg-supportive-lilac-100',
+            class: 'bg-indigo-100',
         },
         {
             variant: 'default',
             disabled: false,
-            class: 'text-black-teal',
+            class: 'text-storm',
         },
         {
             variant: 'default',
             disabled: true,
-            class: 'text-black-teal-200',
+            class: 'text-storm-200',
         },
         {
             variant: 'default',
             disabled: true,
             active: true,
-            class: 'bg-supportive-lilac-100',
+            class: 'bg-indigo-50',
         },
         {
-            variant: 'dark-teal',
+            variant: 'storm',
             active: false,
             enableHover: true,
             class: 'text-white',
         },
         {
-            variant: 'dark-teal',
+            variant: 'storm',
             active: false,
             enableHover: true,
             disabled: false,
-            class: 'hover:bg-dark-teal-500',
+            class: 'hover:bg-storm-500',
         },
         {
-            variant: 'dark-teal',
+            variant: 'storm',
             active: true,
-            class: 'text-white bg-dark-teal-600',
+            class: 'text-white bg-storm-600',
         },
         {
-            variant: 'dark-teal',
+            variant: 'storm',
             disabled: true,
             class: 'opacity-40',
         },
@@ -116,7 +116,7 @@ const dropdownMenuItemIcon = cva(['text-base'], {
     variants: {
         variant: {
             default: null,
-            'dark-teal': null,
+            storm: null,
             negative: null,
         },
         active: {
@@ -125,7 +125,7 @@ const dropdownMenuItemIcon = cva(['text-base'], {
         },
         disabled: {
             false: null,
-            true: 'text-black-teal-100',
+            true: 'text-storm-100',
         },
         wave: {
             true: 'group-hover:animate-wave',
@@ -137,13 +137,13 @@ const dropdownMenuItemIcon = cva(['text-base'], {
             variant: 'default',
             active: false,
             disabled: false,
-            class: 'text-black-teal-300 group-hover:text-black-teal',
+            class: 'text-storm-300 group-hover:text-storm',
         },
         {
-            variant: 'dark-teal',
+            variant: 'storm',
             active: false,
             disabled: false,
-            class: 'text-dark-teal-100 group-hover:text-white',
+            class: 'text-storm-100 group-hover:text-white',
         },
         {
             variant: 'negative',
@@ -197,18 +197,18 @@ export class DropdownMenuItem {
      */
     useContainer = true;
     render() {
-        return (h("div", { key: '582860d13e234b4b115c48511fe8261f3551052b', class: dropdownMenuItem({
+        return (h("div", { key: 'b7bab4e32e56c7b76290d7befc83c1da872cd65a', class: dropdownMenuItem({
                 variant: this.variant,
                 active: asBoolean(this.active),
                 enableHover: asBoolean(this.enableHover ?? true, true),
                 enableTextWrap: this.enableTextWrap,
                 disabled: asBoolean(this.disabled),
-            }) }, this.icon && (h("p-icon", { key: '699505d51423d5c835050d7f9e00a15d18772439', class: dropdownMenuItemIcon({
+            }) }, this.icon && (h("p-icon", { key: '96cc571cbf34e878700166748a5a66919dd87b34', class: dropdownMenuItemIcon({
                 variant: this.variant,
                 active: asBoolean(this.active),
                 disabled: asBoolean(this.disabled),
                 wave: asBoolean(this.iconWave),
-            }), variant: this.icon })), this.checkbox && (h("p-checkbox", { key: 'bcd960f68b1895db9f56d0c72dd1e9468a4cb6da', checked: this.active, disabled: this.disabled })), this.useContainer ? (h("div", { class: cn('block w-full overflow-hidden text-start', {
+            }), variant: this.icon })), this.checkbox && (h("p-checkbox", { key: '129eb625c12b9b6184688caf1d633d079c3086c5', checked: this.active, disabled: this.disabled })), this.useContainer ? (h("div", { class: cn('block w-full overflow-hidden text-start', {
                 'text-ellipsis whitespace-nowrap': !this.enableTextWrap,
             }) }, h("slot", null))) : (h("slot", null))));
     }
@@ -271,8 +271,8 @@ export class DropdownMenuItem {
                 "attribute": "variant",
                 "mutable": false,
                 "complexType": {
-                    "original": "'default' | 'dark-teal' | 'negative'",
-                    "resolved": "\"dark-teal\" | \"default\" | \"negative\"",
+                    "original": "'default' | 'storm' | 'negative'",
+                    "resolved": "\"default\" | \"negative\" | \"storm\"",
                     "references": {}
                 },
                 "required": false,

package/dist/collection/components/atoms/dropdown-menu/item/dropdown-menu-item.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown-menu-item.component.js","sourceRoot":"","sources":["../../../../../src/components/atoms/dropdown-menu/item/dropdown-menu-item.component.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, h } from '@stencil/core';\nimport { cva } from 'class-variance-authority';\nimport { asBoolean } from '../../../../utils/as-boolean';\nimport { IconVariant } from '../../icon/icon.component';\nimport { cn } from '../../../../utils';\n\nconst dropdownMenuItem = cva(\n\t[\n\t\t'p-dropdown-menu-item flex px-2 py-1 gap-2 text-sm font-medium group rounded-lg items-center max-w-full',\n\t],\n\t{\n\t\tvariants: {\n\t\t\tvariant: {\n\t\t\t\tdefault: null,\n\t\t\t\t'dark-teal': null,\n\t\t\t\tnegative: null,\n\t\t\t},\n\t\t\tactive: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: null,\n\t\t\t},\n\t\t\tdisabled: {\n\t\t\t\tfalse: 'cursor-pointer',\n\t\t\t\ttrue: 'cursor-not-allowed',\n\t\t\t},\n\t\t\tenableHover: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: null,\n\t\t\t},\n\t\t\tenableTextWrap: {\n\t\t\t\ttrue: 'min-h-8',\n\t\t\t\tfalse: 'h-8',\n\t\t\t},\n\t\t},\n\t\tcompoundVariants: [\n\t\t\t{\n\t\t\t\tvariant: 'default',\n\t\t\t\tactive: false,\n\t\t\t\tenableHover: true,\n\t\t\t\tdisabled: false,\n\t\t\t\tclass: 'hover:bg-supportive-lilac-50',\n\t\t\t},\n\t\t\t{\n\t\t\t\tvariant: 'default',\n\t\t\t\tactive: true,\n\t\t\t\tdisabled: false,\n\t\t\t\tclass: 'bg-supportive-lilac-100',\n\t\t\t},\n\t\t\t{\n\t\t\t\tvariant: 'default',\n\t\t\t\tdisabled: false,\n\t\t\t\tclass: 'text-black-teal',\n\t\t\t},\n\t\t\t{\n\t\t\t\tvariant: 'default',\n\t\t\t\tdisabled: true,\n\t\t\t\tclass: 'text-black-teal-200',\n\t\t\t},\n\t\t\t{\n\t\t\t\tvariant: 'default',\n\t\t\t\tdisabled: true,\n\t\t\t\tactive: true,\n\t\t\t\tclass: 'bg-supportive-lilac-100',\n\t\t\t},\n\n\t\t\t{\n\t\t\t\tvariant: 'dark-teal',\n\t\t\t\tactive: false,\n\t\t\t\tenableHover: true,\n\t\t\t\tclass: 'text-white',\n\t\t\t},\n\t\t\t{\n\t\t\t\tvariant: 'dark-teal',\n\t\t\t\tactive: false,\n\t\t\t\tenableHover: true,\n\t\t\t\tdisabled: false,\n\t\t\t\tclass: 'hover:bg-dark-teal-500',\n\t\t\t},\n\t\t\t{\n\t\t\t\tvariant: 'dark-teal',\n\t\t\t\tactive: true,\n\t\t\t\tclass: 'text-white bg-dark-teal-600',\n\t\t\t},\n\t\t\t{\n\t\t\t\tvariant: 'dark-teal',\n\t\t\t\tdisabled: true,\n\t\t\t\tclass: 'opacity-40',\n\t\t\t},\n\n\t\t\t{\n\t\t\t\tvariant: 'negative',\n\t\t\t\tactive: false,\n\t\t\t\tenableHover: true,\n\t\t\t\tdisabled: false,\n\t\t\t\tclass: 'text-negative-red hover:bg-negative-red-50',\n\t\t\t},\n\t\t\t{\n\t\t\t\tvariant: 'negative',\n\t\t\t\tactive: true,\n\t\t\t\tdisabled: false,\n\t\t\t\tclass: 'bg-negative-red-100 text-negative-red',\n\t\t\t},\n\t\t\t{\n\t\t\t\tvariant: 'negative',\n\t\t\t\tdisabled: true,\n\t\t\t\tclass: 'text-negative-red-100',\n\t\t\t},\n\t\t\t{\n\t\t\t\tvariant: 'negative',\n\t\t\t\tdisabled: true,\n\t\t\t\tactive: true,\n\t\t\t\tclass: 'bg-negative-red-50',\n\t\t\t},\n\n\t\t\t{\n\t\t\t\tenableHover: true,\n\t\t\t\tdisabled: false,\n\t\t\t\tclass: 'cursor-pointer',\n\t\t\t},\n\t\t],\n\t}\n);\n\nconst dropdownMenuItemIcon = cva(['text-base'], {\n\tvariants: {\n\t\tvariant: {\n\t\t\tdefault: null,\n\t\t\t'dark-teal': null,\n\t\t\tnegative: null,\n\t\t},\n\t\tactive: {\n\t\t\tfalse: null,\n\t\t\ttrue: null,\n\t\t},\n\t\tdisabled: {\n\t\t\tfalse: null,\n\t\t\ttrue: 'text-black-teal-100',\n\t\t},\n\t\twave: {\n\t\t\ttrue: 'group-hover:animate-wave',\n\t\t\tfalse: null,\n\t\t},\n\t},\n\tcompoundVariants: [\n\t\t{\n\t\t\tvariant: 'default',\n\t\t\tactive: false,\n\t\t\tdisabled: false,\n\t\t\tclass: 'text-black-teal-300 group-hover:text-black-teal',\n\t\t},\n\n\t\t{\n\t\t\tvariant: 'dark-teal',\n\t\t\tactive: false,\n\t\t\tdisabled: false,\n\t\t\tclass: 'text-dark-teal-100 group-hover:text-white',\n\t\t},\n\n\t\t{\n\t\t\tvariant: 'negative',\n\t\t\tactive: false,\n\t\t\tdisabled: false,\n\t\t\tclass: 'text-negative-red group-hover:text-negative-red-800',\n\t\t},\n\t\t{\n\t\t\tvariant: 'negative',\n\t\t\tactive: true,\n\t\t\tdisabled: false,\n\t\t\tclass: 'text-negative-red-800',\n\t\t},\n\t],\n});\n\n@Component({\n\ttag: 'p-dropdown-menu-item',\n\tstyleUrl: 'dropdown-menu-item.component.css',\n\tshadow: true,\n})\nexport class DropdownMenuItem {\n\t/**\n\t * Wether the dropdown menu item is active\n\t */\n\t@Prop() active: boolean = false;\n\n\t/**\n\t * Wether the dropdown menu item has a checkbox\n\t */\n\t@Prop() checkbox: boolean = false;\n\n\t/**\n\t * The variant of the item\n\t */\n\t@Prop() variant: 'default' | 'dark-teal' | 'negative' = 'default';\n\n\t/**\n\t * Wether to enable the hover state\n\t */\n\t@Prop() enableHover?: boolean = true;\n\n\t/**\n\t * Wether to enable wrapping the text to a new line\n\t */\n\t@Prop() enableTextWrap?: boolean = false;\n\n\t/**\n\t * Wether the item is disabled\n\t */\n\t@Prop() disabled: boolean = false;\n\n\t/**\n\t * Icon of the navigation item\n\t */\n\t@Prop() icon: IconVariant;\n\n\t/**\n\t * Wether to apply wave animation to icon\n\t */\n\t@Prop() iconWave: boolean = false;\n\n\t/**\n\t *  wether to use the container for text\n\t */\n\t@Prop() useContainer = true;\n\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={dropdownMenuItem({\n\t\t\t\t\tvariant: this.variant,\n\t\t\t\t\tactive: asBoolean(this.active),\n\t\t\t\t\tenableHover: asBoolean(this.enableHover ?? true, true),\n\t\t\t\t\tenableTextWrap: this.enableTextWrap,\n\t\t\t\t\tdisabled: asBoolean(this.disabled),\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t{this.icon && (\n\t\t\t\t\t<p-icon\n\t\t\t\t\t\tclass={dropdownMenuItemIcon({\n\t\t\t\t\t\t\tvariant: this.variant,\n\t\t\t\t\t\t\tactive: asBoolean(this.active),\n\t\t\t\t\t\t\tdisabled: asBoolean(this.disabled),\n\t\t\t\t\t\t\twave: asBoolean(this.iconWave),\n\t\t\t\t\t\t})}\n\t\t\t\t\t\tvariant={this.icon}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\n\t\t\t\t{this.checkbox && (\n\t\t\t\t\t<p-checkbox\n\t\t\t\t\t\tchecked={this.active}\n\t\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\n\t\t\t\t{this.useContainer ? (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclass={cn('block w-full overflow-hidden text-start', {\n\t\t\t\t\t\t\t'text-ellipsis whitespace-nowrap': !this.enableTextWrap,\n\t\t\t\t\t\t})}\n\t\t\t\t\t>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</div>\n\t\t\t\t) : (\n\t\t\t\t\t<slot />\n\t\t\t\t)}\n\t\t\t</div>\n\t\t);\n\t}\n}\n"]}
+{"version":3,"file":"dropdown-menu-item.component.js","sourceRoot":"","sources":["../../../../../src/components/atoms/dropdown-menu/item/dropdown-menu-item.component.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AACnD,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAC/C,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAEzD,OAAO,EAAE,EAAE,EAAE,MAAM,mBAAmB,CAAC;AAEvC,MAAM,gBAAgB,GAAG,GAAG,CAC3B;IACC,wGAAwG;CACxG,EACD;IACC,QAAQ,EAAE;QACT,OAAO,EAAE;YACR,OAAO,EAAE,IAAI;YACb,KAAK,EAAE,IAAI;YACX,QAAQ,EAAE,IAAI;SACd;QACD,MAAM,EAAE;YACP,KAAK,EAAE,IAAI;YACX,IAAI,EAAE,IAAI;SACV;QACD,QAAQ,EAAE;YACT,KAAK,EAAE,gBAAgB;YACvB,IAAI,EAAE,oBAAoB;SAC1B;QACD,WAAW,EAAE;YACZ,KAAK,EAAE,IAAI;YACX,IAAI,EAAE,IAAI;SACV;QACD,cAAc,EAAE;YACf,IAAI,EAAE,SAAS;YACf,KAAK,EAAE,KAAK;SACZ;KACD;IACD,gBAAgB,EAAE;QACjB;YACC,OAAO,EAAE,SAAS;YAClB,MAAM,EAAE,KAAK;YACb,WAAW,EAAE,IAAI;YACjB,QAAQ,EAAE,KAAK;YACf,KAAK,EAAE,oBAAoB;SAC3B;QACD;YACC,OAAO,EAAE,SAAS;YAClB,MAAM,EAAE,IAAI;YACZ,QAAQ,EAAE,KAAK;YACf,KAAK,EAAE,eAAe;SACtB;QACD;YACC,OAAO,EAAE,SAAS;YAClB,QAAQ,EAAE,KAAK;YACf,KAAK,EAAE,YAAY;SACnB;QACD;YACC,OAAO,EAAE,SAAS;YAClB,QAAQ,EAAE,IAAI;YACd,KAAK,EAAE,gBAAgB;SACvB;QACD;YACC,OAAO,EAAE,SAAS;YAClB,QAAQ,EAAE,IAAI;YACd,MAAM,EAAE,IAAI;YACZ,KAAK,EAAE,cAAc;SACrB;QAED;YACC,OAAO,EAAE,OAAO;YAChB,MAAM,EAAE,KAAK;YACb,WAAW,EAAE,IAAI;YACjB,KAAK,EAAE,YAAY;SACnB;QACD;YACC,OAAO,EAAE,OAAO;YAChB,MAAM,EAAE,KAAK;YACb,WAAW,EAAE,IAAI;YACjB,QAAQ,EAAE,KAAK;YACf,KAAK,EAAE,oBAAoB;SAC3B;QACD;YACC,OAAO,EAAE,OAAO;YAChB,MAAM,EAAE,IAAI;YACZ,KAAK,EAAE,yBAAyB;SAChC;QACD;YACC,OAAO,EAAE,OAAO;YAChB,QAAQ,EAAE,IAAI;YACd,KAAK,EAAE,YAAY;SACnB;QAED;YACC,OAAO,EAAE,UAAU;YACnB,MAAM,EAAE,KAAK;YACb,WAAW,EAAE,IAAI;YACjB,QAAQ,EAAE,KAAK;YACf,KAAK,EAAE,4CAA4C;SACnD;QACD;YACC,OAAO,EAAE,UAAU;YACnB,MAAM,EAAE,IAAI;YACZ,QAAQ,EAAE,KAAK;YACf,KAAK,EAAE,uCAAuC;SAC9C;QACD;YACC,OAAO,EAAE,UAAU;YACnB,QAAQ,EAAE,IAAI;YACd,KAAK,EAAE,uBAAuB;SAC9B;QACD;YACC,OAAO,EAAE,UAAU;YACnB,QAAQ,EAAE,IAAI;YACd,MAAM,EAAE,IAAI;YACZ,KAAK,EAAE,oBAAoB;SAC3B;QAED;YACC,WAAW,EAAE,IAAI;YACjB,QAAQ,EAAE,KAAK;YACf,KAAK,EAAE,gBAAgB;SACvB;KACD;CACD,CACD,CAAC;AAEF,MAAM,oBAAoB,GAAG,GAAG,CAAC,CAAC,WAAW,CAAC,EAAE;IAC/C,QAAQ,EAAE;QACT,OAAO,EAAE;YACR,OAAO,EAAE,IAAI;YACb,KAAK,EAAE,IAAI;YACX,QAAQ,EAAE,IAAI;SACd;QACD,MAAM,EAAE;YACP,KAAK,EAAE,IAAI;YACX,IAAI,EAAE,IAAI;SACV;QACD,QAAQ,EAAE;YACT,KAAK,EAAE,IAAI;YACX,IAAI,EAAE,gBAAgB;SACtB;QACD,IAAI,EAAE;YACL,IAAI,EAAE,0BAA0B;YAChC,KAAK,EAAE,IAAI;SACX;KACD;IACD,gBAAgB,EAAE;QACjB;YACC,OAAO,EAAE,SAAS;YAClB,MAAM,EAAE,KAAK;YACb,QAAQ,EAAE,KAAK;YACf,KAAK,EAAE,uCAAuC;SAC9C;QAED;YACC,OAAO,EAAE,OAAO;YAChB,MAAM,EAAE,KAAK;YACb,QAAQ,EAAE,KAAK;YACf,KAAK,EAAE,uCAAuC;SAC9C;QAED;YACC,OAAO,EAAE,UAAU;YACnB,MAAM,EAAE,KAAK;YACb,QAAQ,EAAE,KAAK;YACf,KAAK,EAAE,qDAAqD;SAC5D;QACD;YACC,OAAO,EAAE,UAAU;YACnB,MAAM,EAAE,IAAI;YACZ,QAAQ,EAAE,KAAK;YACf,KAAK,EAAE,uBAAuB;SAC9B;KACD;CACD,CAAC,CAAC;AAOH,MAAM,OAAO,gBAAgB;IAC5B;;OAEG;IACK,MAAM,GAAY,KAAK,CAAC;IAEhC;;OAEG;IACK,QAAQ,GAAY,KAAK,CAAC;IAElC;;OAEG;IACK,OAAO,GAAqC,SAAS,CAAC;IAE9D;;OAEG;IACK,WAAW,GAAa,IAAI,CAAC;IAErC;;OAEG;IACK,cAAc,GAAa,KAAK,CAAC;IAEzC;;OAEG;IACK,QAAQ,GAAY,KAAK,CAAC;IAElC;;OAEG;IACK,IAAI,CAAc;IAE1B;;OAEG;IACK,QAAQ,GAAY,KAAK,CAAC;IAElC;;OAEG;IACK,YAAY,GAAG,IAAI,CAAC;IAE5B,MAAM;QACL,OAAO,CACN,4DACC,KAAK,EAAE,gBAAgB,CAAC;gBACvB,OAAO,EAAE,IAAI,CAAC,OAAO;gBACrB,MAAM,EAAE,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC;gBAC9B,WAAW,EAAE,SAAS,CAAC,IAAI,CAAC,WAAW,IAAI,IAAI,EAAE,IAAI,CAAC;gBACtD,cAAc,EAAE,IAAI,CAAC,cAAc;gBACnC,QAAQ,EAAE,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC;aAClC,CAAC;YAED,IAAI,CAAC,IAAI,IAAI,CACb,+DACC,KAAK,EAAE,oBAAoB,CAAC;oBAC3B,OAAO,EAAE,IAAI,CAAC,OAAO;oBACrB,MAAM,EAAE,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC;oBAC9B,QAAQ,EAAE,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC;oBAClC,IAAI,EAAE,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC;iBAC9B,CAAC,EACF,OAAO,EAAE,IAAI,CAAC,IAAI,GACjB,CACF;YAEA,IAAI,CAAC,QAAQ,IAAI,CACjB,mEACC,OAAO,EAAE,IAAI,CAAC,MAAM,EACpB,QAAQ,EAAE,IAAI,CAAC,QAAQ,GACtB,CACF;YAEA,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CACpB,WACC,KAAK,EAAE,EAAE,CAAC,yCAAyC,EAAE;oBACpD,iCAAiC,EAAE,CAAC,IAAI,CAAC,cAAc;iBACvD,CAAC;gBAEF,eAAQ,CACH,CACN,CAAC,CAAC,CAAC,CACH,eAAQ,CACR,CACI,CACN,CAAC;IACH,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACD","sourcesContent":["import { Component, Prop, h } from '@stencil/core';\nimport { cva } from 'class-variance-authority';\nimport { asBoolean } from '../../../../utils/as-boolean';\nimport { IconVariant } from '../../icon/icon.component';\nimport { cn } from '../../../../utils';\n\nconst dropdownMenuItem = cva(\n\t[\n\t\t'p-dropdown-menu-item flex px-2 py-1 gap-2 text-sm font-medium group rounded-lg items-center max-w-full',\n\t],\n\t{\n\t\tvariants: {\n\t\t\tvariant: {\n\t\t\t\tdefault: null,\n\t\t\t\tstorm: null,\n\t\t\t\tnegative: null,\n\t\t\t},\n\t\t\tactive: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: null,\n\t\t\t},\n\t\t\tdisabled: {\n\t\t\t\tfalse: 'cursor-pointer',\n\t\t\t\ttrue: 'cursor-not-allowed',\n\t\t\t},\n\t\t\tenableHover: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: null,\n\t\t\t},\n\t\t\tenableTextWrap: {\n\t\t\t\ttrue: 'min-h-8',\n\t\t\t\tfalse: 'h-8',\n\t\t\t},\n\t\t},\n\t\tcompoundVariants: [\n\t\t\t{\n\t\t\t\tvariant: 'default',\n\t\t\t\tactive: false,\n\t\t\t\tenableHover: true,\n\t\t\t\tdisabled: false,\n\t\t\t\tclass: 'hover:bg-indigo-50',\n\t\t\t},\n\t\t\t{\n\t\t\t\tvariant: 'default',\n\t\t\t\tactive: true,\n\t\t\t\tdisabled: false,\n\t\t\t\tclass: 'bg-indigo-100',\n\t\t\t},\n\t\t\t{\n\t\t\t\tvariant: 'default',\n\t\t\t\tdisabled: false,\n\t\t\t\tclass: 'text-storm',\n\t\t\t},\n\t\t\t{\n\t\t\t\tvariant: 'default',\n\t\t\t\tdisabled: true,\n\t\t\t\tclass: 'text-storm-200',\n\t\t\t},\n\t\t\t{\n\t\t\t\tvariant: 'default',\n\t\t\t\tdisabled: true,\n\t\t\t\tactive: true,\n\t\t\t\tclass: 'bg-indigo-50',\n\t\t\t},\n\n\t\t\t{\n\t\t\t\tvariant: 'storm',\n\t\t\t\tactive: false,\n\t\t\t\tenableHover: true,\n\t\t\t\tclass: 'text-white',\n\t\t\t},\n\t\t\t{\n\t\t\t\tvariant: 'storm',\n\t\t\t\tactive: false,\n\t\t\t\tenableHover: true,\n\t\t\t\tdisabled: false,\n\t\t\t\tclass: 'hover:bg-storm-500',\n\t\t\t},\n\t\t\t{\n\t\t\t\tvariant: 'storm',\n\t\t\t\tactive: true,\n\t\t\t\tclass: 'text-white bg-storm-600',\n\t\t\t},\n\t\t\t{\n\t\t\t\tvariant: 'storm',\n\t\t\t\tdisabled: true,\n\t\t\t\tclass: 'opacity-40',\n\t\t\t},\n\n\t\t\t{\n\t\t\t\tvariant: 'negative',\n\t\t\t\tactive: false,\n\t\t\t\tenableHover: true,\n\t\t\t\tdisabled: false,\n\t\t\t\tclass: 'text-negative-red hover:bg-negative-red-50',\n\t\t\t},\n\t\t\t{\n\t\t\t\tvariant: 'negative',\n\t\t\t\tactive: true,\n\t\t\t\tdisabled: false,\n\t\t\t\tclass: 'bg-negative-red-100 text-negative-red',\n\t\t\t},\n\t\t\t{\n\t\t\t\tvariant: 'negative',\n\t\t\t\tdisabled: true,\n\t\t\t\tclass: 'text-negative-red-100',\n\t\t\t},\n\t\t\t{\n\t\t\t\tvariant: 'negative',\n\t\t\t\tdisabled: true,\n\t\t\t\tactive: true,\n\t\t\t\tclass: 'bg-negative-red-50',\n\t\t\t},\n\n\t\t\t{\n\t\t\t\tenableHover: true,\n\t\t\t\tdisabled: false,\n\t\t\t\tclass: 'cursor-pointer',\n\t\t\t},\n\t\t],\n\t}\n);\n\nconst dropdownMenuItemIcon = cva(['text-base'], {\n\tvariants: {\n\t\tvariant: {\n\t\t\tdefault: null,\n\t\t\tstorm: null,\n\t\t\tnegative: null,\n\t\t},\n\t\tactive: {\n\t\t\tfalse: null,\n\t\t\ttrue: null,\n\t\t},\n\t\tdisabled: {\n\t\t\tfalse: null,\n\t\t\ttrue: 'text-storm-100',\n\t\t},\n\t\twave: {\n\t\t\ttrue: 'group-hover:animate-wave',\n\t\t\tfalse: null,\n\t\t},\n\t},\n\tcompoundVariants: [\n\t\t{\n\t\t\tvariant: 'default',\n\t\t\tactive: false,\n\t\t\tdisabled: false,\n\t\t\tclass: 'text-storm-300 group-hover:text-storm',\n\t\t},\n\n\t\t{\n\t\t\tvariant: 'storm',\n\t\t\tactive: false,\n\t\t\tdisabled: false,\n\t\t\tclass: 'text-storm-100 group-hover:text-white',\n\t\t},\n\n\t\t{\n\t\t\tvariant: 'negative',\n\t\t\tactive: false,\n\t\t\tdisabled: false,\n\t\t\tclass: 'text-negative-red group-hover:text-negative-red-800',\n\t\t},\n\t\t{\n\t\t\tvariant: 'negative',\n\t\t\tactive: true,\n\t\t\tdisabled: false,\n\t\t\tclass: 'text-negative-red-800',\n\t\t},\n\t],\n});\n\n@Component({\n\ttag: 'p-dropdown-menu-item',\n\tstyleUrl: 'dropdown-menu-item.component.css',\n\tshadow: true,\n})\nexport class DropdownMenuItem {\n\t/**\n\t * Wether the dropdown menu item is active\n\t */\n\t@Prop() active: boolean = false;\n\n\t/**\n\t * Wether the dropdown menu item has a checkbox\n\t */\n\t@Prop() checkbox: boolean = false;\n\n\t/**\n\t * The variant of the item\n\t */\n\t@Prop() variant: 'default' | 'storm' | 'negative' = 'default';\n\n\t/**\n\t * Wether to enable the hover state\n\t */\n\t@Prop() enableHover?: boolean = true;\n\n\t/**\n\t * Wether to enable wrapping the text to a new line\n\t */\n\t@Prop() enableTextWrap?: boolean = false;\n\n\t/**\n\t * Wether the item is disabled\n\t */\n\t@Prop() disabled: boolean = false;\n\n\t/**\n\t * Icon of the navigation item\n\t */\n\t@Prop() icon: IconVariant;\n\n\t/**\n\t * Wether to apply wave animation to icon\n\t */\n\t@Prop() iconWave: boolean = false;\n\n\t/**\n\t *  wether to use the container for text\n\t */\n\t@Prop() useContainer = true;\n\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={dropdownMenuItem({\n\t\t\t\t\tvariant: this.variant,\n\t\t\t\t\tactive: asBoolean(this.active),\n\t\t\t\t\tenableHover: asBoolean(this.enableHover ?? true, true),\n\t\t\t\t\tenableTextWrap: this.enableTextWrap,\n\t\t\t\t\tdisabled: asBoolean(this.disabled),\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t{this.icon && (\n\t\t\t\t\t<p-icon\n\t\t\t\t\t\tclass={dropdownMenuItemIcon({\n\t\t\t\t\t\t\tvariant: this.variant,\n\t\t\t\t\t\t\tactive: asBoolean(this.active),\n\t\t\t\t\t\t\tdisabled: asBoolean(this.disabled),\n\t\t\t\t\t\t\twave: asBoolean(this.iconWave),\n\t\t\t\t\t\t})}\n\t\t\t\t\t\tvariant={this.icon}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\n\t\t\t\t{this.checkbox && (\n\t\t\t\t\t<p-checkbox\n\t\t\t\t\t\tchecked={this.active}\n\t\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\n\t\t\t\t{this.useContainer ? (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclass={cn('block w-full overflow-hidden text-start', {\n\t\t\t\t\t\t\t'text-ellipsis whitespace-nowrap': !this.enableTextWrap,\n\t\t\t\t\t\t})}\n\t\t\t\t\t>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</div>\n\t\t\t\t) : (\n\t\t\t\t\t<slot />\n\t\t\t\t)}\n\t\t\t</div>\n\t\t);\n\t}\n}\n"]}

package/dist/collection/components/atoms/floating-menu/container/floating-menu-container.component.css

@@ -1 +1 @@
-*{box-sizing:border-box}:host(.preload){animation:none}.static{position:static!important}.z-floating-menu{z-index:190!important}.mx-0{margin-left:0!important;margin-right:0!important}.ml-auto{margin-left:auto!important}.box-content{box-sizing:content-box!important}.flex{display:flex!important}.table{display:table!important}.size-4{height:1rem!important;width:1rem!important}.h-10{height:2.5rem!important}.h-4{height:1rem!important}.w-auto{width:auto!important}.min-w-0{min-width:0!important}.cursor-pointer{cursor:pointer!important}.items-center{align-items:center!important}.gap-2{gap:.5rem!important}.overflow-hidden{overflow:hidden!important}.text-ellipsis{text-overflow:ellipsis!important}.text-nowrap{text-wrap:nowrap!important}.rounded-lg{border-radius:.5rem!important}.bg-dark-teal-600{--tw-bg-opacity:1!important;background-color:rgb(0 72 64/var(--tw-bg-opacity,1))!important}.p-2{padding:.5rem!important}.px-1{padding-left:.25rem!important;padding-right:.25rem!important}.py-1{padding-bottom:.25rem!important;padding-top:.25rem!important}.pl-3{padding-left:.75rem!important}.pr-1{padding-right:.25rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-black-teal-400{--tw-text-opacity:1!important;color:rgb(53 85 80/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-300{--tw-text-opacity:1!important;color:rgb(102 151 145/var(--tw-text-opacity,1))!important}.shadow-3{--tw-shadow:0 1px 1px rgba(0,2,2,.08),0 2px 2px rgba(0,2,2,.08),0 4px 4px rgba(0,2,2,.08)!important;--tw-shadow-colored:0 1px 1px var(--tw-shadow-color),0 2px 2px var(--tw-shadow-color),0 4px 4px var(--tw-shadow-color)!important;box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)!important}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:85.375rem){.container{max-width:85.375rem}}@media (min-width:90rem){.container{max-width:90rem}}@media (min-width:96rem){.container{max-width:96rem}}@media (min-width:105rem){.container{max-width:105rem}}@media (min-width:120rem){.container{max-width:120rem}}@media (min-width:160rem){.container{max-width:160rem}}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.hover\:text-dark-teal-100:hover{--tw-text-opacity:1!important;color:rgb(204 220 218/var(--tw-text-opacity,1))!important}
+*{box-sizing:border-box}:host(.preload){animation:none}.static{position:static!important}.z-floating-menu{z-index:190!important}.mx-0{margin-left:0!important;margin-right:0!important}.flex{display:flex!important}.table{display:table!important}.h-10{height:2.5rem!important}.h-4{height:1rem!important}.w-auto{width:auto!important}.min-w-0{min-width:0!important}.items-center{align-items:center!important}.gap-2{gap:.5rem!important}.overflow-hidden{overflow:hidden!important}.text-ellipsis{text-overflow:ellipsis!important}.text-nowrap{text-wrap:nowrap!important}.rounded-lg{border-radius:.5rem!important}.bg-storm-500{--tw-bg-opacity:1!important;background-color:rgb(24 30 41/var(--tw-bg-opacity,1))!important}.px-1{padding-left:.25rem!important;padding-right:.25rem!important}.py-1{padding-bottom:.25rem!important;padding-top:.25rem!important}.pl-3{padding-left:.75rem!important}.pr-1{padding-right:.25rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-storm-100{--tw-text-opacity:1!important;color:rgb(209 210 212/var(--tw-text-opacity,1))!important}.text-storm-400{--tw-text-opacity:1!important;color:rgb(70 75 84/var(--tw-text-opacity,1))!important}.shadow-3{--tw-shadow:0 1px 1px rgba(0,2,2,.08),0 2px 2px rgba(0,2,2,.08),0 4px 4px rgba(0,2,2,.08)!important;--tw-shadow-colored:0 1px 1px var(--tw-shadow-color),0 2px 2px var(--tw-shadow-color),0 4px 4px var(--tw-shadow-color)!important;box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)!important}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:85.375rem){.container{max-width:85.375rem}}@media (min-width:90rem){.container{max-width:90rem}}@media (min-width:96rem){.container{max-width:96rem}}@media (min-width:105rem){.container{max-width:105rem}}@media (min-width:120rem){.container{max-width:120rem}}@media (min-width:160rem){.container{max-width:160rem}}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}

package/dist/collection/components/atoms/floating-menu/container/floating-menu-container.component.js

@@ -3,7 +3,7 @@ import { cva } from "class-variance-authority";
 import { formatTranslation, getLocaleComponentStrings, } from "../../../../utils";
 const container = cva([
     'floating-menu-container z-floating-menu',
-    'bg-dark-teal-600 shadow-3',
+    'bg-storm-500 shadow-3',
     'h-10 py-1 w-auto',
     'rounded-lg',
     'text-sm',
@@ -17,7 +17,7 @@ const container = cva([
     },
 });
 const amountSelected = cva([
-    'text-dark-teal-100',
+    'text-storm-100',
     'min-w-0',
     'overflow-hidden text-ellipsis text-nowrap',
 ]);
@@ -60,9 +60,9 @@ export class FloatingMenuContainer {
         this._setLocales();
     }
     render() {
-        return (h(Host, { key: '588580cddbbfb9582754921c4277271ec99891a5' }, h("div", { key: '9b2afb1c525e278493a77ec8e198101675c89c28', class: container({
+        return (h(Host, { key: '0452958de7d66615078fc372997fe28a8e95834a' }, h("div", { key: '1454348833943649553b902acc2d74af9aae987e', class: container({
                 enableAmountSelected: this.enableAmountSelected,
-            }) }, this.enableAmountSelected && (h(Fragment, { key: 'cca4b53a77fa08b77671902bc4e30138dbb0783b' }, h("p", { key: '34d7be81d047f88b66013e10f37132b00d89ced1', class: amountSelected() }, this.amountSelectedTemplate(this.amount)), h("p-divider", { key: 'd05feb777e63ff15a15abab1286c57a81cc5d17f', class: 'mx-0 h-4 text-black-teal-400', variant: 'vertical' }))), this.usedInTable ? h("slot", { name: 'floating-menu-item' }) : h("slot", null), this.enableClose && (h("div", { key: 'b45695d7487384a7e2efb2a9d760d26c018caaa0', class: 'ml-auto box-content size-4 cursor-pointer p-2 text-dark-teal-300 hover:text-dark-teal-100', onClick: ev => this.close.emit(ev) }, h("p-icon", { key: '63fff3ccadd9d79de4207e4451e635911cbb4b28', variant: 'negative' }))))));
+            }) }, this.enableAmountSelected && (h(Fragment, { key: '1d5d66e2d6b9fd1f0a0ea7e4de8176297b17a13f' }, h("p", { key: '8d19e34503f6b7535ea3cc6c39831161507995c5', class: amountSelected() }, this.amountSelectedTemplate(this.amount)), h("p-divider", { key: '0258a80bc46a92f4094e1b48854d0cae92113906', class: 'mx-0 h-4 text-storm-400', variant: 'vertical' }))), h("div", { key: '32cc025c0eb458c63251448d35a50ccd93360205', class: 'flex items-center' }, this.usedInTable ? h("slot", { name: 'floating-menu-item' }) : h("slot", null), this.enableClose && (h("p-floating-menu-item", { key: 'a0d94f377f3cf1285ebd88c021ca6e84271337dc', onClick: ev => this.close.emit(ev), icon: 'negative' }))))));
     }
     async _setLocales() {
         this._locales = await getLocaleComponentStrings(this._el);

package/dist/collection/components/atoms/floating-menu/container/floating-menu-container.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"floating-menu-container.component.js","sourceRoot":"","sources":["../../../../../src/components/atoms/floating-menu/container/floating-menu-container.component.tsx"],"names":[],"mappings":"AAAA,OAAO,EACN,SAAS,EACT,KAAK,EAEL,QAAQ,EACR,IAAI,EACJ,MAAM,EACN,IAAI,EACJ,CAAC,EACD,OAAO,EACP,KAAK,GACL,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAC/C,OAAO,EACN,iBAAiB,EACjB,yBAAyB,GACzB,MAAM,mBAAmB,CAAC;AAE3B,MAAM,SAAS,GAAG,GAAG,CACpB;IACC,yCAAyC;IACzC,2BAA2B;IAC3B,kBAAkB;IAClB,YAAY;IACZ,SAAS;IACT,yBAAyB;CACzB,EACD;IACC,QAAQ,EAAE;QACT,oBAAoB,EAAE;YACrB,KAAK,EAAE,MAAM;YACb,IAAI,EAAE,WAAW;SACjB;KACD;CACD,CACD,CAAC;AAEF,MAAM,cAAc,GAAG,GAAG,CAAC;IAC1B,oBAAoB;IACpB,SAAS;IACT,2CAA2C;CAC3C,CAAC,CAAC;AASH,MAAM,OAAO,qBAAqB;IACjC;;OAEG;IACK,WAAW,GAAY,KAAK,CAAC;IAErC;;OAEG;IACK,oBAAoB,GAAG,IAAI,CAAC;IAEpC;;OAEG;IACK,MAAM,GAAG,CAAC,CAAC;IAEnB;;OAEG;IACK,WAAW,GAAG,IAAI,CAAC;IAE3B;;OAEG;IACK,sBAAsB,GAA+B,CAC5D,MAAc,EACb,EAAE,CACH,iBAAiB,CAChB,CAAC,MAAM,KAAK,CAAC;QACZ,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,eAAe;QAC/B,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,sBAAsB,CACtC,EAAE,OAAO,CAAC,YAAY,EAAE,MAAM,CAAC,CAChC,CAAC;IAEH;;OAEG;IACM,KAAK,CAA2B;IAEzC;;OAEG;IACgB,GAAG,CAAc;IAEpC;;OAEG;IACc,QAAQ,GAAQ,EAAE,CAAC;IAEpC,iBAAiB;QAChB,IAAI,CAAC,WAAW,EAAE,CAAC;IACpB,CAAC;IAED,MAAM;QACL,OAAO,CACN,EAAC,IAAI;YACJ,4DACC,KAAK,EAAE,SAAS,CAAC;oBAChB,oBAAoB,EAAE,IAAI,CAAC,oBAAoB;iBAC/C,CAAC;gBAED,IAAI,CAAC,oBAAoB,IAAI,CAC7B,EAAC,QAAQ;oBACR,0DAAG,KAAK,EAAE,cAAc,EAAE,IACxB,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,MAAM,CAAC,CACtC;oBAEJ,kEACC,KAAK,EAAC,8BAA8B,EACpC,OAAO,EAAC,UAAU,GACjB,CACQ,CACX;gBAEA,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,YAAM,IAAI,EAAC,oBAAoB,GAAG,CAAC,CAAC,CAAC,eAAQ;gBAEhE,IAAI,CAAC,WAAW,IAAI,CACpB,4DACC,KAAK,EAAC,2FAA2F,EACjG,OAAO,EAAE,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC;oBAElC,+DAAQ,OAAO,EAAC,UAAU,GAAG,CACxB,CACN,CACI,CACA,CACP,CAAC;IACH,CAAC;IAGO,KAAK,CAAC,WAAW;QACxB,IAAI,CAAC,QAAQ,GAAG,MAAM,yBAAyB,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAC3D,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACD","sourcesContent":["import {\n\tComponent,\n\tEvent,\n\tEventEmitter,\n\tFragment,\n\tHost,\n\tListen,\n\tProp,\n\th,\n\tElement,\n\tState,\n} from '@stencil/core';\nimport { cva } from 'class-variance-authority';\nimport {\n\tformatTranslation,\n\tgetLocaleComponentStrings,\n} from '../../../../utils';\n\nconst container = cva(\n\t[\n\t\t'floating-menu-container z-floating-menu',\n\t\t'bg-dark-teal-600 shadow-3',\n\t\t'h-10 py-1 w-auto',\n\t\t'rounded-lg',\n\t\t'text-sm',\n\t\t'flex items-center gap-2',\n\t],\n\t{\n\t\tvariants: {\n\t\t\tenableAmountSelected: {\n\t\t\t\tfalse: 'px-1',\n\t\t\t\ttrue: 'pl-3 pr-1',\n\t\t\t},\n\t\t},\n\t}\n);\n\nconst amountSelected = cva([\n\t'text-dark-teal-100',\n\t'min-w-0',\n\t'overflow-hidden text-ellipsis text-nowrap',\n]);\n\nexport type amountSelectedTemplateFunc = (amount: number) => string;\n\n@Component({\n\ttag: 'p-floating-menu-container',\n\tstyleUrl: 'floating-menu-container.component.css',\n\tshadow: true,\n})\nexport class FloatingMenuContainer {\n\t/**\n\t * Wether the container is used in the table\n\t */\n\t@Prop() usedInTable: boolean = false;\n\n\t/**\n\t * Wether to show the amount selected\n\t */\n\t@Prop() enableAmountSelected = true;\n\n\t/**\n\t * The amount selected\n\t */\n\t@Prop() amount = 0;\n\n\t/**\n\t * Wether to enablethe close button\n\t */\n\t@Prop() enableClose = true;\n\n\t/**\n\t * The template for amount selected\n\t */\n\t@Prop() amountSelectedTemplate: amountSelectedTemplateFunc = (\n\t\tamount: number\n\t) =>\n\t\tformatTranslation(\n\t\t\t(amount === 1\n\t\t\t\t? this._locales.amount_selected\n\t\t\t\t: this._locales.amount_selected_plural\n\t\t\t)?.replace('{{amount}}', amount)\n\t\t);\n\n\t/**\n\t * Event whenever the close button is clicked\n\t */\n\t@Event() close: EventEmitter<MouseEvent>;\n\n\t/**\n\t * The host element\n\t */\n\t@Element() private _el: HTMLElement;\n\n\t/**\n\t * Locales used for this component\n\t */\n\t@State() private _locales: any = {};\n\n\tcomponentWillLoad() {\n\t\tthis._setLocales();\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div\n\t\t\t\t\tclass={container({\n\t\t\t\t\t\tenableAmountSelected: this.enableAmountSelected,\n\t\t\t\t\t})}\n\t\t\t\t>\n\t\t\t\t\t{this.enableAmountSelected && (\n\t\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t\t<p class={amountSelected()}>\n\t\t\t\t\t\t\t\t{this.amountSelectedTemplate(this.amount)}\n\t\t\t\t\t\t\t</p>\n\n\t\t\t\t\t\t\t<p-divider\n\t\t\t\t\t\t\t\tclass='mx-0 h-4 text-black-teal-400'\n\t\t\t\t\t\t\t\tvariant='vertical'\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{this.usedInTable ? <slot name='floating-menu-item' /> : <slot />}\n\n\t\t\t\t\t{this.enableClose && (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclass='ml-auto box-content size-4 cursor-pointer p-2 text-dark-teal-300 hover:text-dark-teal-100'\n\t\t\t\t\t\t\tonClick={ev => this.close.emit(ev)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<p-icon variant='negative' />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t@Listen('localeChanged', { target: 'body' })\n\tprivate async _setLocales(): Promise<void> {\n\t\tthis._locales = await getLocaleComponentStrings(this._el);\n\t}\n}\n"]}
+{"version":3,"file":"floating-menu-container.component.js","sourceRoot":"","sources":["../../../../../src/components/atoms/floating-menu/container/floating-menu-container.component.tsx"],"names":[],"mappings":"AAAA,OAAO,EACN,SAAS,EACT,KAAK,EAEL,QAAQ,EACR,IAAI,EACJ,MAAM,EACN,IAAI,EACJ,CAAC,EACD,OAAO,EACP,KAAK,GACL,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAC/C,OAAO,EACN,iBAAiB,EACjB,yBAAyB,GACzB,MAAM,mBAAmB,CAAC;AAE3B,MAAM,SAAS,GAAG,GAAG,CACpB;IACC,yCAAyC;IACzC,uBAAuB;IACvB,kBAAkB;IAClB,YAAY;IACZ,SAAS;IACT,yBAAyB;CACzB,EACD;IACC,QAAQ,EAAE;QACT,oBAAoB,EAAE;YACrB,KAAK,EAAE,MAAM;YACb,IAAI,EAAE,WAAW;SACjB;KACD;CACD,CACD,CAAC;AAEF,MAAM,cAAc,GAAG,GAAG,CAAC;IAC1B,gBAAgB;IAChB,SAAS;IACT,2CAA2C;CAC3C,CAAC,CAAC;AASH,MAAM,OAAO,qBAAqB;IACjC;;OAEG;IACK,WAAW,GAAY,KAAK,CAAC;IAErC;;OAEG;IACK,oBAAoB,GAAG,IAAI,CAAC;IAEpC;;OAEG;IACK,MAAM,GAAG,CAAC,CAAC;IAEnB;;OAEG;IACK,WAAW,GAAG,IAAI,CAAC;IAE3B;;OAEG;IACK,sBAAsB,GAA+B,CAC5D,MAAc,EACb,EAAE,CACH,iBAAiB,CAChB,CAAC,MAAM,KAAK,CAAC;QACZ,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,eAAe;QAC/B,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,sBAAsB,CACtC,EAAE,OAAO,CAAC,YAAY,EAAE,MAAM,CAAC,CAChC,CAAC;IAEH;;OAEG;IACM,KAAK,CAA2B;IAEzC;;OAEG;IACgB,GAAG,CAAc;IAEpC;;OAEG;IACc,QAAQ,GAAQ,EAAE,CAAC;IAEpC,iBAAiB;QAChB,IAAI,CAAC,WAAW,EAAE,CAAC;IACpB,CAAC;IAED,MAAM;QACL,OAAO,CACN,EAAC,IAAI;YACJ,4DACC,KAAK,EAAE,SAAS,CAAC;oBAChB,oBAAoB,EAAE,IAAI,CAAC,oBAAoB;iBAC/C,CAAC;gBAED,IAAI,CAAC,oBAAoB,IAAI,CAC7B,EAAC,QAAQ;oBACR,0DAAG,KAAK,EAAE,cAAc,EAAE,IACxB,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,MAAM,CAAC,CACtC;oBAEJ,kEACC,KAAK,EAAC,yBAAyB,EAC/B,OAAO,EAAC,UAAU,GACjB,CACQ,CACX;gBAED,4DAAK,KAAK,EAAC,mBAAmB;oBAC5B,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,YAAM,IAAI,EAAC,oBAAoB,GAAG,CAAC,CAAC,CAAC,eAAQ;oBAEhE,IAAI,CAAC,WAAW,IAAI,CACpB,6EACC,OAAO,EAAE,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,EAClC,IAAI,EAAC,UAAU,GACQ,CACxB,CACI,CACD,CACA,CACP,CAAC;IACH,CAAC;IAGO,KAAK,CAAC,WAAW;QACxB,IAAI,CAAC,QAAQ,GAAG,MAAM,yBAAyB,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAC3D,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACD","sourcesContent":["import {\n\tComponent,\n\tEvent,\n\tEventEmitter,\n\tFragment,\n\tHost,\n\tListen,\n\tProp,\n\th,\n\tElement,\n\tState,\n} from '@stencil/core';\nimport { cva } from 'class-variance-authority';\nimport {\n\tformatTranslation,\n\tgetLocaleComponentStrings,\n} from '../../../../utils';\n\nconst container = cva(\n\t[\n\t\t'floating-menu-container z-floating-menu',\n\t\t'bg-storm-500 shadow-3',\n\t\t'h-10 py-1 w-auto',\n\t\t'rounded-lg',\n\t\t'text-sm',\n\t\t'flex items-center gap-2',\n\t],\n\t{\n\t\tvariants: {\n\t\t\tenableAmountSelected: {\n\t\t\t\tfalse: 'px-1',\n\t\t\t\ttrue: 'pl-3 pr-1',\n\t\t\t},\n\t\t},\n\t}\n);\n\nconst amountSelected = cva([\n\t'text-storm-100',\n\t'min-w-0',\n\t'overflow-hidden text-ellipsis text-nowrap',\n]);\n\nexport type amountSelectedTemplateFunc = (amount: number) => string;\n\n@Component({\n\ttag: 'p-floating-menu-container',\n\tstyleUrl: 'floating-menu-container.component.css',\n\tshadow: true,\n})\nexport class FloatingMenuContainer {\n\t/**\n\t * Wether the container is used in the table\n\t */\n\t@Prop() usedInTable: boolean = false;\n\n\t/**\n\t * Wether to show the amount selected\n\t */\n\t@Prop() enableAmountSelected = true;\n\n\t/**\n\t * The amount selected\n\t */\n\t@Prop() amount = 0;\n\n\t/**\n\t * Wether to enablethe close button\n\t */\n\t@Prop() enableClose = true;\n\n\t/**\n\t * The template for amount selected\n\t */\n\t@Prop() amountSelectedTemplate: amountSelectedTemplateFunc = (\n\t\tamount: number\n\t) =>\n\t\tformatTranslation(\n\t\t\t(amount === 1\n\t\t\t\t? this._locales.amount_selected\n\t\t\t\t: this._locales.amount_selected_plural\n\t\t\t)?.replace('{{amount}}', amount)\n\t\t);\n\n\t/**\n\t * Event whenever the close button is clicked\n\t */\n\t@Event() close: EventEmitter<MouseEvent>;\n\n\t/**\n\t * The host element\n\t */\n\t@Element() private _el: HTMLElement;\n\n\t/**\n\t * Locales used for this component\n\t */\n\t@State() private _locales: any = {};\n\n\tcomponentWillLoad() {\n\t\tthis._setLocales();\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div\n\t\t\t\t\tclass={container({\n\t\t\t\t\t\tenableAmountSelected: this.enableAmountSelected,\n\t\t\t\t\t})}\n\t\t\t\t>\n\t\t\t\t\t{this.enableAmountSelected && (\n\t\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t\t<p class={amountSelected()}>\n\t\t\t\t\t\t\t\t{this.amountSelectedTemplate(this.amount)}\n\t\t\t\t\t\t\t</p>\n\n\t\t\t\t\t\t\t<p-divider\n\t\t\t\t\t\t\t\tclass='mx-0 h-4 text-storm-400'\n\t\t\t\t\t\t\t\tvariant='vertical'\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t)}\n\n\t\t\t\t\t<div class='flex items-center'>\n\t\t\t\t\t\t{this.usedInTable ? <slot name='floating-menu-item' /> : <slot />}\n\n\t\t\t\t\t\t{this.enableClose && (\n\t\t\t\t\t\t\t<p-floating-menu-item\n\t\t\t\t\t\t\t\tonClick={ev => this.close.emit(ev)}\n\t\t\t\t\t\t\t\ticon='negative'\n\t\t\t\t\t\t\t></p-floating-menu-item>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t@Listen('localeChanged', { target: 'body' })\n\tprivate async _setLocales(): Promise<void> {\n\t\tthis._locales = await getLocaleComponentStrings(this._el);\n\t}\n}\n"]}

package/dist/collection/components/atoms/floating-menu/item/floating-menu-item.component.css

@@ -1 +1 @@
-*{box-sizing:border-box}.static{position:static!important}.flex{display:flex!important}.h-6{height:1.5rem!important}.min-w-0{min-width:0!important}.cursor-not-allowed{cursor:not-allowed!important}.cursor-pointer{cursor:pointer!important}.items-center{align-items:center!important}.gap-2{gap:.5rem!important}.overflow-hidden{overflow:hidden!important}.text-ellipsis{text-overflow:ellipsis!important}.text-nowrap{text-wrap:nowrap!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.font-semibold{font-weight:600!important}.text-dark-teal-200{--tw-text-opacity:1!important;color:rgb(153 185 182/var(--tw-text-opacity,1))!important}.text-dark-teal-300{--tw-text-opacity:1!important;color:rgb(102 151 145/var(--tw-text-opacity,1))!important}.opacity-60{opacity:.6!important}.group:hover .group-hover\:text-dark-teal-100,.hover\:text-dark-teal-100:hover{--tw-text-opacity:1!important;color:rgb(204 220 218/var(--tw-text-opacity,1))!important}
+*{box-sizing:border-box}.flex{display:flex!important}.h-8{height:2rem!important}.min-w-0{min-width:0!important}.cursor-not-allowed{cursor:not-allowed!important}.cursor-pointer{cursor:pointer!important}.items-center{align-items:center!important}.gap-2{gap:.5rem!important}.overflow-hidden{overflow:hidden!important}.text-ellipsis{text-overflow:ellipsis!important}.text-nowrap{text-wrap:nowrap!important}.rounded-lg{border-radius:.5rem!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.font-semibold{font-weight:600!important}.text-storm-100{--tw-text-opacity:1!important;color:rgb(209 210 212/var(--tw-text-opacity,1))!important}.text-storm-50{--tw-text-opacity:1!important;color:rgb(232 232 234/var(--tw-text-opacity,1))!important}.opacity-60{opacity:.6!important}.empty\:hidden:empty{display:none!important}.hover\:bg-storm-800:hover{--tw-bg-opacity:1!important;background-color:rgb(2 8 21/var(--tw-bg-opacity,1))!important}.active\:bg-storm-700:active{--tw-bg-opacity:1!important;background-color:rgb(8 15 28/var(--tw-bg-opacity,1))!important}.active\:text-storm-100\/60:active{color:hsla(220,3%,83%,.6)!important}.group:hover .group-hover\:text-storm-100{--tw-text-opacity:1!important;color:rgb(209 210 212/var(--tw-text-opacity,1))!important}.group:active .group-active\:text-storm-100\/60{color:hsla(220,3%,83%,.6)!important}