@paperless/core 2.0.1-beta.21 → 2.0.1-beta.22

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

@@ -66,13 +66,13 @@ export class Radio {
      */
     checkedChange;
     render() {
-        return (h(Host, { key: 'cadcfb2a903a3a9f70796770dc47f22caf199b5e', class: 'p-radio' }, h("label", { key: 'bad70100ebbf0d8635fb9a50c274aac56b74735a', htmlFor: this.id ?? this._nonce, class: 'flex items-center justify-start gap-2 text-black-teal' }, h("div", { key: '87c8c6b485b23beb305450bb18416936425e000e', class: 'relative flex flex-shrink-0 items-center' }, h("input", { key: '500655357e45b7ed47b651993b2a4e62aaae1818', class: radio({
+        return (h(Host, { key: 'ef48217704ef103668234d8b3b8da720b58d90ee', class: 'p-radio' }, h("label", { key: '29176e1a1f018a252f1c990d8ed02ab67b97297c', htmlFor: this.id ?? this._nonce, class: 'flex items-center justify-start gap-2 text-black-teal' }, h("div", { key: '785cfc9c4f61069a37efd36f39ed948eb08ffea0', class: 'relative flex flex-shrink-0 items-center' }, h("input", { key: '8ef43efad2ebd27ea62dbd3254279901b7dc2504', class: radio({
                 size: this.size,
                 disabled: this.disabled,
-            }), type: 'radio', id: this.id ?? this._nonce, name: this.name, required: this.required, value: this.value, checked: this.checked, disabled: this.disabled, onChange: ev => this._onChange(ev) }), h("div", { key: '23b0de0ff8913ed6bc66bddd50eea9117063b880', class: circle({
+            }), type: 'radio', id: this.id ?? this._nonce, name: this.name, required: this.required, value: this.value, checked: this.checked, disabled: this.disabled, onChange: ev => this._onChange(ev) }), h("div", { key: 'fe41351c563e10018dfe02235faa98c1e883f153', class: circle({
                 size: this.size,
                 disabled: this.disabled,
-            }) })), h("slot", { key: 'bbf707984104b091871111ae1d1e79ea09f5e7b8' }))));
+            }) })), h("slot", { key: '9821b79310a24b03420be123009471ec4e99fefe' }))));
     }
     _onChange(ev) {
         if (this.disabled) {

package/dist/collection/components/atoms/segment-container/segment-container.component.js

@@ -1,7 +1,7 @@
 import { h, Host } from "@stencil/core";
 export class SegmentContainer {
     render() {
-        return (h(Host, { key: 'c8554666934a49559cb5b8a31e6d448d41445c10', class: "p-segment-container" }, h("slot", { key: 'a99446441d550c8d87e0e40a6b8cd576d4be8ba3' })));
+        return (h(Host, { key: 'a126f83ab98eedf6bf4bfcc894418ac2927fb1ec', class: "p-segment-container" }, h("slot", { key: '8fdb90a932a5d12e91c283cadf05aa8260a0664f' })));
     }
     static get is() { return "p-segment-container"; }
     static get originalStyleUrls() {

package/dist/collection/components/atoms/segment-item/segment-item.component.js

@@ -17,7 +17,7 @@ export class SegmentItem {
         this._hasDescriptionSlot = !!this._el.querySelector(':scope > [slot="description"]');
     }
     render() {
-        return (h(Host, { key: '0231e33d62667c6f6baf39907c52f1d05483b777', class: `p-segment-item variant-${this.iconOnly ? 'icon' : 'default'} ${this.active && 'active'}` }, this.icon && this._getIcon(), h("slot", { key: 'b150ba986fdaef2a98661a48796bf43ff77e8c24' }), this.size === 'big' && this._hasDescriptionSlot && (h("span", { key: '78017b51faf3a96f8fc8b8d59fc9a62bec694afd', class: "description" }, h("slot", { key: '6d36db486c92e1324260ba88e91fe6d5c709798a', name: "description" })))));
+        return (h(Host, { key: '1883a31af0f6e08cab2fbc21595405b7bea4c7b1', class: `p-segment-item variant-${this.iconOnly ? 'icon' : 'default'} ${this.active && 'active'}` }, this.icon && this._getIcon(), h("slot", { key: '2928aea3c142a89847851e9bae1d8e7c4dc80881' }), this.size === 'big' && this._hasDescriptionSlot && (h("span", { key: '5f579cb91b1961876a22a58f12c4e2e80a362d7e', class: "description" }, h("slot", { key: 'd7faac99c72f5965904079d9724a198511afcd2a', name: "description" })))));
     }
     _getIcon() {
         if (!this.icon) {

package/dist/collection/components/atoms/slider-indicator/slider-indicator.component.js

@@ -4,7 +4,7 @@ export class SliderIndicator {
         this.active = false;
     }
     render() {
-        return (h(Host, { key: 'b881e676d31e9db8b09093c2ad767467584194aa', class: `p-slider-indicator ${this.active && 'active'}` }));
+        return (h(Host, { key: '8023e6a85ee66918d86ab48398bf086129e04f9d', class: `p-slider-indicator ${this.active && 'active'}` }));
     }
     static get is() { return "p-slider-indicator"; }
     static get encapsulation() { return "shadow"; }

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

@@ -7,8 +7,8 @@ export class Status {
         this.iconRotate = undefined;
     }
     render() {
-        return (h(Host, { key: '1d4fc08551aaa41e7b1e6f5cffe6bc6dce88b417', class: `p-status variant-${this.variant}
-                }` }, this._getIcon(), h("slot", { key: '4b2d7a3a670c335b42905de63fb8aa1c8b0e34e3' })));
+        return (h(Host, { key: '9b538283ce0517c77e00bd51a9d683b24bb3d70c', class: `p-status variant-${this.variant}
+                }` }, this._getIcon(), h("slot", { key: 'fdadde949efb67b1f45314cb72ec048c437c1939' })));
     }
     _getIcon() {
         const icon = this.icon || this._getVariantIcon();

package/dist/collection/components/atoms/stepper-item/stepper-item.component.js

@@ -8,7 +8,7 @@ export class StepperItem {
         this.active = false;
     }
     render() {
-        return (h(Host, { key: '8da0538e191e3cbe2bc2ffd34235e29bf36c5c4b', class: "p-stepper-item" }, h("div", { key: '26ef593097c695a3944a7c50f941f566c2bada7b', class: "circle" }, this.finished && h("p-icon", { key: '648760041a32cd018e7e5a7b76d7cdb19220425e', variant: "checkmark" })), h("div", { key: 'fe3b931203de10909550032493c5d305187f9ef8', class: "content" }, h("slot", { key: '16627589013f17c494e482c98b7e96aaed2de5a4', name: "content" }))));
+        return (h(Host, { key: 'fdb8be45614926e6e49e020f37b2220b57fc4c4a', class: "p-stepper-item" }, h("div", { key: 'f6a682601cf37da44aba81c8c252657fa81fccee', class: "circle" }, this.finished && h("p-icon", { key: '6f255a564f8862711dc3d3617b8a52446e4c2aed', variant: "checkmark" })), h("div", { key: '7e87bad4eeeb5858efdba5fd03a02ad49d6fbf55', class: "content" }, h("slot", { key: '99076927549c510ae73bf7e0c1c248ab6f681a09', name: "content" }))));
     }
     static get is() { return "p-stepper-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/atoms/stepper-line/stepper-line.component.js

@@ -5,7 +5,7 @@ export class StepperLine {
         this.direction = 'horizontal';
     }
     render() {
-        return h(Host, { key: 'a098b7140c582af2edc9cdd7b4f8c37f5396223f', class: "p-stepper-line" });
+        return h(Host, { key: '9afe16b1b44c0af870416074eb6bfee7c50d7d1a', class: "p-stepper-line" });
     }
     static get is() { return "p-stepper-line"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/atoms/tab-group/tab-group.component.js

@@ -1,7 +1,7 @@
 import { h, Host } from "@stencil/core";
 export class TabGroup {
     render() {
-        return (h(Host, { key: 'f5db65ff43cf524cbbd2482ee29cf4e1d845e876', class: "p-tab-group relative flex w-full flex-col" }, h("div", { key: '1f410d379e84904b6d658a82d9ccd43f7f863202', class: "scrollbar-hide z-10 flex w-full gap-5 overflow-x-auto" }, h("slot", { key: 'a50bbd0b25ade7ffcfb8fd066afc2f0b08c2a4cb' })), h("p-divider", { key: 'd814f2ad8339c98d524c522f2002cf9518ef603e', class: "absolute bottom-0 left-0 m-0 w-full" })));
+        return (h(Host, { key: 'aa88a446769f313f5efbc20661cb38b8540178a5', class: "p-tab-group relative flex w-full flex-col" }, h("div", { key: '076cab05927dc55d65ff6bcefd9439ae35432c33', class: "scrollbar-hide z-10 flex w-full gap-5 overflow-x-auto" }, h("slot", { key: 'bbc31cf25e62f3a77d5ba08363ce1a8b28f00853' })), h("p-divider", { key: '617439542832dac0732b4d9f985e3d10b4a209b0', class: "absolute bottom-0 left-0 m-0 w-full" })));
     }
     static get is() { return "p-tab-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/atoms/tab-item/tab-item.component.js

@@ -4,7 +4,7 @@ export class TabItem {
         this.active = false;
     }
     render() {
-        return (h(Host, { key: 'd728170a44b3c2ed1a55aa9f90a2e333811b53c5', class: `p-tab-item ${this.active && 'active'}` }, h("slot", { key: '5e528d172aaef412521f6c93a755bd0bf9f9864a' })));
+        return (h(Host, { key: 'fa6aea3812d850f94a74a6cf1f88bc86b6351fa8', class: `p-tab-item ${this.active && 'active'}` }, h("slot", { key: 'b20e0b0695ec3a8e65506d004af650a6bee87d6b' })));
     }
     static get is() { return "p-tab-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/atoms/table-container/table-container.component.js

@@ -4,7 +4,7 @@ export class TableContainer {
         this.shadow = true;
     }
     render() {
-        return (h(Host, { key: '3093de271c11a50d334006232f4cd02a66131191', class: `p-table-container ${!this.shadow && 'no-shadow'}` }, h("slot", { key: '76d6ab8ecf532e2a4d43f6b7257135c4881176e3' })));
+        return (h(Host, { key: '4e0ae2ffb330d59f65fea3060a733589789b6238', class: `p-table-container ${!this.shadow && 'no-shadow'}` }, h("slot", { key: '4e5330fd7cfe7b021e8dd2a86a819170762a431a' })));
     }
     static get is() { return "p-table-container"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/atoms/toast-container/toast-container.component.js

@@ -4,7 +4,7 @@ export class ToastContainer {
         this.placement = 'top-end';
     }
     render() {
-        return (h(Host, { key: 'ab81aa8f5275de30e45826d232f2c551aded8cbe', class: `p-toast-container placement-${this.placement}` }, h("slot", { key: '82cd3e00ce8242aaf2acdbe393fe4058949b73fe' })));
+        return (h(Host, { key: '58603ebc78b238e44f447f59c4f16c82de5ddcb6', class: `p-toast-container placement-${this.placement}` }, h("slot", { key: '1a3ba94eadae2d79b46ade86520284423324b2b7' })));
     }
     static get is() { return "p-toast-container"; }
     static get encapsulation() { return "shadow"; }

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

@@ -104,13 +104,13 @@ export class Toggle {
      */
     indeterminateChange;
     render() {
-        return (h(Host, { key: '665a9617a9ab6f36f84bb2431a1aae0b873acfab', class: 'p-checkbox' }, h("label", { key: 'f9090b0b5cc6ca14c09a43e53f01bef33e411e5f', htmlFor: this.id ?? this._nonce, class: 'flex items-center justify-start gap-2 text-black-teal' }, h("div", { key: '9a47bbc17f2efb2cf196c558b67837b73531f02f', class: 'group relative flex flex-shrink-0 items-center' }, h("input", { key: 'aead176166d2cc5799d3756076d9ed4085d67637', class: checkbox({
+        return (h(Host, { key: 'c0dabd76bf6665ffdd747f3418cc4e1a22f96a5f', class: 'p-checkbox' }, h("label", { key: 'ffd7c2d536568ba6a350ace76f731c2938bfd2de', htmlFor: this.id ?? this._nonce, class: 'flex items-center justify-start gap-2 text-black-teal' }, h("div", { key: 'e53e83e770f6ed573d5cadeb11d45b86f2a4ddce', class: 'group relative flex flex-shrink-0 items-center' }, h("input", { key: '5d8b6cb60decc05e162a68ead269f7b9d4890b72', class: checkbox({
                 size: this.size,
                 disabled: this.disabled,
-            }), type: 'checkbox', id: this.id ?? this._nonce, name: this.name, required: this.required, checked: !!this.checked, indeterminate: this.indeterminate, disabled: this.disabled, onChange: ev => this._onChange(ev) }), h("div", { key: 'f73eab7f22090288618a5e71f1a0ca9d7aa92733', class: circle({
+            }), type: 'checkbox', id: this.id ?? this._nonce, name: this.name, required: this.required, checked: !!this.checked, indeterminate: this.indeterminate, disabled: this.disabled, onChange: ev => this._onChange(ev) }), h("div", { key: 'd20d1ef90cf7cedc4b48ba44826f2d5ad22878ed', class: circle({
                 size: this.size,
                 disabled: this.disabled,
-            }) })), h("slot", { key: 'dbd72bce56cdad804076b3a51c921a877530ec8a' }))));
+            }) })), h("slot", { key: 'ce3e1ee30f727d6f941f93df26403257018ef7fc' }))));
     }
     _onChange(ev) {
         if (this.disabled) {

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

@@ -83,19 +83,19 @@ export class Tooltip {
             ref: el => this._load(el),
         };
         let tooltip;
-        const tooltipElement = (h("div", { key: 'e773c573f879f37ca26e3efb0621a148150cc988', class: popover({
+        const tooltipElement = (h("div", { key: '56d0d0e1a7cb6d1e97b3367aee6adb5ae293b53b', class: popover({
                 variant: this.variant,
                 strategy: this.usePortal ? 'none' : this.strategy,
-            }), ...(this.usePortal ? {} : tooltipProps) }, h("div", { key: 'beae5aa49190a54cb3852aed32989e4393a4577b', class: 'flex gap-2' }, this.variant === 'error' && (h("div", { key: '2df89a5828f590f1140e7b49d0fdbc0bbd342e76', class: 'w-[2px] bg-negative-red' })), this.content ? this.content : h("slot", { name: 'content' }))));
+            }), ...(this.usePortal ? {} : tooltipProps) }, h("div", { key: '00d635edb79b804c7424e1d0860e9187ae306e7f', class: 'flex gap-2' }, this.variant === 'error' && (h("div", { key: '3db71eb65444549657f9720e9ab1c8fe06f5b0ca', class: 'w-[2px] bg-negative-red' })), this.content ? this.content : h("slot", { name: 'content' }))));
         if (this.usePortal) {
-            tooltip = (h("p-portal", { key: 'b10a6efabbd222ac3f49ce1ed609225d43aef28c', class: portal({
+            tooltip = (h("p-portal", { key: '34c9d947df9c8724cf6f0a30532fa7a8b8f0d94e', class: portal({
                     strategy: this.strategy,
                 }), ...tooltipProps }, tooltipElement));
         }
         else {
             tooltip = tooltipElement;
         }
-        return (h(Host, { key: '49b2555dfde9308712f54352b71b6b3392237f92', class: 'p-popover flex cursor-pointer' }, h("div", { key: '75bfdc10b8af271be06fb857d3f08e040c05711a', class: 'relative h-inherit w-inherit' }, h("slot", { key: '9dae75ed3b6edb2384b8a5d5b573aad90278a875', name: 'trigger' }), tooltip)));
+        return (h(Host, { key: '7eb41fb620f29211b4dfa7a8bf788625a8027393', class: 'p-popover flex cursor-pointer' }, h("div", { key: 'baa27f78e76a4a3218a6ca95b14941a71cb860ff', class: 'relative h-inherit w-inherit' }, h("slot", { key: '88c466a87263e47d96e29ef570f6a78298b8529c', name: 'trigger' }), tooltip)));
     }
     clickHandler() {
         if (this.variant === 'hover' || !this.enableUserInput) {

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

@@ -11,7 +11,7 @@ export class Accordion {
      */
     isOpen;
     render() {
-        return (h(Host, { key: '1987c3d70bcb8cbf640c5df6f3f4f9d6b4e91580', class: 'p-accordion' }, h("div", { key: '6b1b9e48c71f8eaf4d57d3ad0d200c7a1d5786e7', class: 'flex cursor-pointer items-center gap-3 text-storm-vague', onClick: () => this._onClick() }, h("p-icon", { key: 'a3730b1c6a0df8ea19b0bd0a860f297fda3950a1', class: 'flex', variant: 'caret', rotate: this.open ? 0 : -90 }), h("p", { key: 'd1c3e010caf52118b2f949f63cbf38f5958f08f8', class: 'm-0 whitespace-nowrap text-lg font-medium' }, this.header), h("p-divider", { key: '64e9ea96be09d1c832ca29bb25d00ff8093d21ee' })), this.open && (h("div", { key: '0b233c739b2b4f4619d59a479fb201bfff84d68d', class: 'mt-6' }, h("slot", { key: '1c2423d144b81593b8a282233169be7d87271f5f' })))));
+        return (h(Host, { key: '310eabf3edef4a28e9aad349c62709aba8b8b07c', class: 'p-accordion' }, h("div", { key: '9d9d3fb6dc68292ad5f90de15ebc884f289e5792', class: 'flex cursor-pointer items-center gap-3 text-storm-vague', onClick: () => this._onClick() }, h("p-icon", { key: '35f18b0cca23dd68fc527e4494b1acbe5478d338', class: 'flex', variant: 'caret', rotate: this.open ? 0 : -90 }), h("p", { key: 'ac21ad37327f5b73b23174aaa47547b997205b97', class: 'm-0 whitespace-nowrap text-lg font-medium' }, this.header), h("p-divider", { key: '18fe537bf51d29d4477f9355b299a5bce82e7a9b' })), this.open && (h("div", { key: 'b6d0a3c7cc497ec86a8adcca3fc4f2f815cd5ba0', class: 'mt-6' }, h("slot", { key: 'b44e3a118822173be502213d82b6a95365917b41' })))));
     }
     _onClick() {
         if (!this.closeable && this.open) {

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

@@ -15,14 +15,14 @@ export class Attachment {
      */
     delete;
     render() {
-        let prefix = h("p-icon", { key: '91f61402860b721f93e4d39092d1a7287c7d76be', variant: 'attachment' });
+        let prefix = h("p-icon", { key: '0f6fdd0e2d04701633d2159ec6dd3e7a6805d81f', variant: 'attachment' });
         if (this.loading) {
-            prefix = h("p-loader", { key: '2d80997d3d7586bd94cacf836973d52bf1e5d33c' });
+            prefix = h("p-loader", { key: '13ab45a77fc4bef011ab08760539459e68df943e' });
         }
         if (this.error) {
-            prefix = (h("p-icon", { key: '79811465cf29931d832ceb81ba11a3d0aad8987b', variant: 'warning', class: 'text-negative' }));
+            prefix = (h("p-icon", { key: 'e8d352fe5293af4fa7704df89a55d1a22a86756f', variant: 'warning', class: 'text-negative' }));
         }
-        return (h(Host, { key: '159cf6563bbe844c1992605de10d1518e2087d77', class: 'p-attachment flex items-start gap-4' }, h("div", { key: 'a04aad61a2ea29086ffc2fcbee6dd2c2299fab3b', class: `flex h-8 min-w-0 flex-1 items-center justify-start gap-2 rounded-lg bg-mystic px-2 ${this.error?.length ? 'text-negative' : 'text-storm-medium'}` }, prefix, h("span", { key: '5061aeaa9cc1884529a8b68a93f70180eca4cf8c', class: 'min-w-0 flex-1 overflow-hidden text-ellipsis whitespace-nowrap' }, h("slot", { key: '4a11f180fac573f1e5de447552f4f711e2d083d1' })), this.error?.length && h("p-input-error", { key: 'cad249378d27241da65d7c1c15a886f12e8adbf2', error: this.error })), h("p-button", { key: '1587915332cf3a281f88f8e0d28b525c37bafade', variant: 'secondary', iconOnly: true, icon: this.mode === 'read' ? 'download' : 'trash', disabled: this.loading, loading: this.mode === 'read' && this.downloading, size: 'sm', onOnClick: () => (this.mode === 'read' ? this.download : this.delete).emit() })));
+        return (h(Host, { key: '5d94032752397283496ad42f3034be1dc41a70e3', class: 'p-attachment flex items-start gap-4' }, h("div", { key: '0abebda5e4f17d6a00e07fe4d5853a3083046bf9', class: `flex h-8 min-w-0 flex-1 items-center justify-start gap-2 rounded-lg bg-mystic px-2 ${this.error?.length ? 'text-negative' : 'text-storm-medium'}` }, prefix, h("span", { key: '179dd7e6c759bc6205e9d9e2521c945553d3a0cb', class: 'min-w-0 flex-1 overflow-hidden text-ellipsis whitespace-nowrap' }, h("slot", { key: '0b99553205320b53f5389a721cd4c993fd6da95a' })), this.error?.length && h("p-input-error", { key: '39d53a690670b83dc859a9a667aeada3182e7a35', error: this.error })), h("p-button", { key: 'a8a726acacae0c0e82d979e31a2de2afff34acf5', variant: 'secondary', iconOnly: true, icon: this.mode === 'read' ? 'download' : 'trash', disabled: this.loading, loading: this.mode === 'read' && this.downloading, size: 'sm', onOnClick: () => (this.mode === 'read' ? this.download : this.delete).emit() })));
     }
     static get is() { return "p-attachment"; }
     static get encapsulation() { return "shadow"; }

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

@@ -289,7 +289,7 @@ export class Button {
             ? 'a'
             : 'button';
         const active = this.active || this.class?.includes('active');
-        return (h(Host, { key: 'c528dd1f603ec9602af623f74ff422d1745f5f88', class: 'p-button block' }, h(VariableTag, { key: 'ed0b7309950f72321c0c355288afdaa3ffbe9a3c', disabled: this.disabled, href: this.href, type: this.variant !== 'text' ? this.type : undefined, target: this.target, class: button({
+        return (h(Host, { key: 'b21137921cfdf8cef894f31aceec317b76f8e0dd', class: 'p-button block' }, h(VariableTag, { key: '3b796d5754b8e089b5dffe8d91e6f61e00538e0a', disabled: this.disabled, href: this.href, type: this.variant !== 'text' ? this.type : undefined, target: this.target, class: button({
                 variant: this.variant,
                 size: this.size,
                 underline: this.underline,
@@ -298,14 +298,14 @@ export class Button {
                 buttonGroupPosition: this.buttonGroupPosition,
                 iconOnly: this.iconOnly,
                 active,
-            }) }, this.chevron && this.chevronPosition === 'start' && (h("p-icon", { key: '4f20df27c82f4b43f4b3d0ce1584571e0854c61d', variant: 'caret', rotate: this.chevron === 'up' ? 180 : 0 })), this.icon &&
+            }) }, this.chevron && this.chevronPosition === 'start' && (h("p-icon", { key: 'dd238bf0b2d040ed90a8e439dfb563d9168c61b7', variant: 'caret', rotate: this.chevron === 'up' ? 180 : 0 })), this.icon &&
             this.iconPosition === 'start' &&
             !(this.iconOnly && this.loading) &&
-            this._getIcon(), h("slot", { key: 'ce4ed96beafa7bebb83e8f8346350e56a27fc8e3' }), this.icon &&
+            this._getIcon(), h("slot", { key: '9e06619e8b75a3afff008ef990bf3e04553d1d4b' }), this.icon &&
             this.iconPosition === 'end' &&
             !this.loading &&
             !this.chevron &&
-            this._getIcon(), this.chevron && !this.loading && this.chevronPosition === 'end' && (h("p-icon", { key: '1f2613670560b7ce499df4d08dddb011c92971a7', variant: 'caret', rotate: this.chevron === 'up' ? 180 : 0 })), this.loading && h("p-loader", { key: '282534a7fb06fa16769cdb6dbd736564f8d41beb', color: loaderColor }))));
+            this._getIcon(), this.chevron && !this.loading && this.chevronPosition === 'end' && (h("p-icon", { key: '8864bae307de1ddb69f1c466a428e2b05d907234', variant: 'caret', rotate: this.chevron === 'up' ? 180 : 0 })), this.loading && h("p-loader", { key: 'e5901475f799e01b5dc29a8a848a9e3fd239681f', color: loaderColor }))));
     }
     handleClick(ev) {
         if (this.loading || this.disabled) {

package/dist/collection/components/molecules/button-group/button-group.component.js

@@ -11,7 +11,7 @@ export class ButtonGroup {
         this._checkButtons();
     }
     render() {
-        return (h(Host, { key: '7d49236b6a489e5581670eb011a9743cf3edec50', class: 'p-button-group flex items-center' }, h("slot", { key: '40a1f245652f461c6c2619c3f2f3ceff9b11fd1f' })));
+        return (h(Host, { key: '2b21e710322939b988c56ec93315f294e141fd8b', class: 'p-button-group flex items-center' }, h("slot", { key: '8df0ce25df38771b78d6152368d00c45aec74dc4' })));
     }
     slotchange() {
         this._checkButtons();

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

@@ -139,7 +139,7 @@ export class Calendar {
             .filter(date => isValid(date));
     }
     render() {
-        return (h(Host, { key: '624da5939a3391fc98be636153ca8a296af47390', class: calendar({ variant: this.variant }) }, this._getView()));
+        return (h(Host, { key: 'bdac26a59422c5e8f2958bdbde5c2e2716926cc2', class: calendar({ variant: this.variant }) }, this._getView()));
     }
     _getView() {
         if (this._view === 'year') {

package/dist/collection/components/molecules/content-slider/content-slider.component.js

@@ -39,9 +39,9 @@ export class ContentSlider {
         }
     }
     render() {
-        return (h(Host, { key: 'e996c635c0cf4b6079e446ce63d73f1b9852726b', class: "p-content-slider" }, h("div", { key: '184859d7f3cc545fed4b2cd81ec40f1faf231a14', class: `slider ${!this.disableDrag && 'draggable'} ${this._dragging && 'dragging'}`, style: {
+        return (h(Host, { key: '75da799f01accf4047ac83242a1200509947c1f5', class: "p-content-slider" }, h("div", { key: '4146cd50da6e230f179612844beb835914a89632', class: `slider ${!this.disableDrag && 'draggable'} ${this._dragging && 'dragging'}`, style: {
                 height: `${this._outerHeight}px`,
-            }, ref: (el) => (this._sliderRef = el), onMouseDown: (e) => this._mouseDownHandler(e), onTouchStart: (e) => this._mouseDownHandler(e), onMouseMove: (e) => this._mouseMoveHandler(e), onTouchMove: (e) => this._mouseMoveHandler(e) }, h("div", { key: 'cbeab030c9c898ee3f13b18c542673057113a74d', class: "inner-slider", ref: (ref) => this._setInnerSliderReft(ref), onTransitionEnd: () => this._transitionEndHandler() }, h("slot", { key: '3a750b867b7abd33b4ad25dd08b7e634fbddd957' }))), h("div", { key: '6fb3c9c1bfcaf67067858c71de4058be1e6fd8b8', class: `indicator ${this.hideMobileIndicator && 'hidden'}` }, this._items.map((_, i) => (h("div", { onClick: () => this._scrollTo(i, true), class: `item ${!this.disableIndicatorClick && 'cursor-pointer'}` }, h("p-slider-indicator", { active: i === this._visibleIndex })))))));
+            }, ref: (el) => (this._sliderRef = el), onMouseDown: (e) => this._mouseDownHandler(e), onTouchStart: (e) => this._mouseDownHandler(e), onMouseMove: (e) => this._mouseMoveHandler(e), onTouchMove: (e) => this._mouseMoveHandler(e) }, h("div", { key: 'fdbbd773f07938dd8906bb456e7739f6c717092c', class: "inner-slider", ref: (ref) => this._setInnerSliderReft(ref), onTransitionEnd: () => this._transitionEndHandler() }, h("slot", { key: '7a3d5dd2a3234d27c8ab6acfc5a64f98cf52c1c8' }))), h("div", { key: '56cd4bdee286d29a469bf30ac842977c80ed6195', class: `indicator ${this.hideMobileIndicator && 'hidden'}` }, this._items.map((_, i) => (h("div", { onClick: () => this._scrollTo(i, true), class: `item ${!this.disableIndicatorClick && 'cursor-pointer'}` }, h("p-slider-indicator", { active: i === this._visibleIndex })))))));
     }
     _mouseDownHandler(e) {
         if (this.disableDrag || this._dragging) {

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

@@ -34,10 +34,10 @@ export class Cropper {
         }, 200);
     }
     render() {
-        return (h(Host, { key: 'afd5e10b35660436241cd4bf34804ff18d38e63c', class: 'p-cropper' }, this._loaded && (h("cropper-canvas", { key: 'b83a601fdc5e6dd0bdab4091dce8536dd8098abd', class: 'h-[17.5rem] w-full border-0 border-b border-solid border-mystic-medium bg-white', onAction: () => this._onAction() }, h("cropper-image", { key: '92f70e3d205a72e87c4454f6f2ffb3ecb7c2a2c4', src: this.value, alt: 'Picture', ref: ref => this._setImageRef(ref), scalable: true, crossorigin: 'anonymous' }), h("cropper-shade", { key: 'cb819b4d9a2e28263555c888b4db913d6d8d9f45', class: clsx({
+        return (h(Host, { key: '7390aec5b5f81ffd67e54811ca821cc9772fddc5', class: 'p-cropper' }, this._loaded && (h("cropper-canvas", { key: '95ecbd9acce466e81d90810cc7297dcf6ea5cdbe', class: 'h-[17.5rem] w-full border-0 border-b border-solid border-mystic-medium bg-white', onAction: () => this._onAction() }, h("cropper-image", { key: '76534002ee9c7dc3e8e073393b35235c187d7656', src: this.value, alt: 'Picture', ref: ref => this._setImageRef(ref), scalable: true, crossorigin: 'anonymous' }), h("cropper-shade", { key: '597dba1bcc2d306c4161b9a45bcb061d8acc9e2d', class: clsx({
                 'rounded-round': this.variant === 'user',
                 rounded: this.variant === 'company',
-            }), "theme-color": 'rgba(255, 255, 255, 0.5)', hidden: true }), h("cropper-selection", { key: '65e6df8e4166009cc27e83c173203c7dfe163bd8', "initial-coverage": '0.7', "aspect-ratio": '1', ref: ref => (this._selectionRef = ref) }), h("cropper-handle", { key: '2c7e8c3b91c7bf71ac9ab34f12d7533ac32686d1', action: 'move', plain: true }))), h("div", { key: 'f8bdfafaebb8ec4da34b01bbbefc8a56f34a9696', class: 'flex w-full items-center gap-2 px-14 text-storm-vague tablet:max-w-xs tablet:px-1' }, h("p-icon", { key: '883df6ef54a39ab1fbc2b1d3e1940aaec0f0d97f', variant: 'minus' }), h("input", { key: '8d39562d4df89cf00479cc3ff97194c14622fd31', class: 'p-input w-full', type: 'range', min: '0', max: '100', value: this._currentScale, onInput: ev => this._onInput(ev.target.value), step: '0.5' }), h("p-icon", { key: '9b0ba4eae79add1f148a884013f8ad3f8d7d75cd', variant: 'plus' }))));
+            }), "theme-color": 'rgba(255, 255, 255, 0.5)', hidden: true }), h("cropper-selection", { key: 'e00c6e0b5541edce749b7837769cb35b26b2e3b6', "initial-coverage": '0.7', "aspect-ratio": '1', ref: ref => (this._selectionRef = ref) }), h("cropper-handle", { key: 'adee5991926e23ed24349ca87b69f4e5002185a1', action: 'move', plain: true }))), h("div", { key: '76041ecf8ca26fd74b50acdc5543e94efc4326dd', class: 'flex w-full items-center gap-2 px-14 text-storm-vague tablet:max-w-xs tablet:px-1' }, h("p-icon", { key: 'e0ae20d0717c42c24a554527f032564ef62400c7', variant: 'minus' }), h("input", { key: 'e1f7facd9c9e6012e577688ba13b8119effce06d', class: 'p-input w-full', type: 'range', min: '0', max: '100', value: this._currentScale, onInput: ev => this._onInput(ev.target.value), step: '0.5' }), h("p-icon", { key: '25815296c58d77cc72a1d7de328e8f44c897b608', variant: 'plus' }))));
     }
     _setImageRef(ref) {
         if (this._imageRef) {

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

@@ -112,7 +112,7 @@ export class Datepicker {
         this.parseValue(this.value);
     }
     render() {
-        return (h(Host, { key: '81d0ef25f8732896445b7e5cb89d8442cc0db02e', class: 'p-datepicker' }, h("p-dropdown", { key: 'ae2f387721b7b6799bf413e5f6622ab60ab0807f', strategy: this.strategy, placement: this.placement, disableTriggerClick: true, applyMaxWidth: false, applyFullWidth: false, insideClick: true, show: this._showDropdown }, h("p-field", { key: '263f9cada2705bcd9cd579f569aba59f49f69f8e', slot: 'trigger', icon: this.hideIconWhenFilled && !!this._value ? null : 'calendar-multi', iconPosition: 'start', size: this.size, prefix: this.prefix, label: this.label, helper: this.helper, required: this.required, error: this.error, disabled: this.disabled, focused: this._showDropdown, value: this._getFormattedDate(), placeholder: this.placeholder, onFocus: () => this._onFocus(), onBlur: () => this._onBlur(), onValueChange: ev => this._onValueChange(ev.detail), onInputRefChange: ev => (this._inputRef = ev.detail) }), h("div", { key: '5669a50474ab48cc77391ab17c4e3b72ce3b8a7f', slot: 'items' }, h("p-calendar", { key: 'db4da464f2e0a96fe6a7697c1107990202d1a102', variant: 'embedded', value: this._value, onValueChange: ({ detail }) => (this.value = detail), preselectToday: this.preselectToday, disabledDates: this.disabledDates, minDate: this.minDate, maxDate: this.maxDate, disableWeekends: this.disableWeekends, mode: this.mode })))));
+        return (h(Host, { key: '0de36ac63a8498aa89896203a95b32990ff09005', class: 'p-datepicker' }, h("p-dropdown", { key: '03c3fd3666a07cafd8c972627637a335f4dbd31f', strategy: this.strategy, placement: this.placement, disableTriggerClick: true, applyMaxWidth: false, applyFullWidth: false, insideClick: true, show: this._showDropdown }, h("p-field", { key: '79f0be9fbc485923a05f884d7ab215d53d56ea46', slot: 'trigger', icon: this.hideIconWhenFilled && !!this._value ? null : 'calendar-multi', iconPosition: 'start', size: this.size, prefix: this.prefix, label: this.label, helper: this.helper, required: this.required, error: this.error, disabled: this.disabled, focused: this._showDropdown, value: this._getFormattedDate(), placeholder: this.placeholder, onFocus: () => this._onFocus(), onBlur: () => this._onBlur(), onValueChange: ev => this._onValueChange(ev.detail), onInputRefChange: ev => (this._inputRef = ev.detail) }), h("div", { key: '3f096013cc6cde840576d9a71cd8ff6bdbf5c0d7', slot: 'items' }, h("p-calendar", { key: 'e40c1f2a0c1458a836268f4d39e64bb3bb637b5a', variant: 'embedded', value: this._value, onValueChange: ({ detail }) => (this.value = detail), preselectToday: this.preselectToday, disabledDates: this.disabledDates, minDate: this.minDate, maxDate: this.maxDate, disableWeekends: this.disableWeekends, mode: this.mode })))));
     }
     documentClickHandler({ target }) {
         if (!this._showDropdown || childOf(target, this._el)) {

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

@@ -69,12 +69,12 @@ export class Dropdown {
         };
         let dropdownContainer;
         if (this.usePortal) {
-            dropdownContainer = (h("p-portal", { key: '5d9510a6759f791fb120fc06a31329a21f623f02', ...dropdownContainerProps }, h("p-dropdown-menu-container", { key: 'ea8ef6c6bba695321c530e12051881613fb73fac', maxWidth: !this.calculateWidth && this.applyMaxWidth, fullWidth: this.applyFullWidth && !this.applyMaxWidth, allowOverflow: this.allowOverflow, scrollable: this.scrollable }, h("slot", { key: '6ab8276bd86e17e48cea60aee12809edaf4d59ad', name: 'items' }))));
+            dropdownContainer = (h("p-portal", { key: '81ed3076cb5ac5af3c6fcf097ad343cede28bebb', ...dropdownContainerProps }, h("p-dropdown-menu-container", { key: '1a237f89a54eef8dbd5a992fb7c2aac0d207af48', maxWidth: !this.calculateWidth && this.applyMaxWidth, fullWidth: this.applyFullWidth && !this.applyMaxWidth, allowOverflow: this.allowOverflow, scrollable: this.scrollable }, h("slot", { key: '9615d965a064a4c0d3844b9baa0710049c78aa40', name: 'items' }))));
         }
         else {
-            dropdownContainer = (h("p-dropdown-menu-container", { key: 'fa587ed2bf372b31843d0e39b2cf5309d62fc0b5', maxWidth: !this.calculateWidth && this.applyMaxWidth, fullWidth: this.applyFullWidth && !this.applyMaxWidth, allowOverflow: this.allowOverflow, scrollable: this.scrollable, ...dropdownContainerProps }, h("slot", { key: '91a76863819e3c4d2cfd97f7b935b0b444d9dacc', name: 'items' })));
+            dropdownContainer = (h("p-dropdown-menu-container", { key: '9c84750f3ac8235467b4d877ce8c71848352c053', maxWidth: !this.calculateWidth && this.applyMaxWidth, fullWidth: this.applyFullWidth && !this.applyMaxWidth, allowOverflow: this.allowOverflow, scrollable: this.scrollable, ...dropdownContainerProps }, h("slot", { key: '94521db2dcb1fe662dff6b05d740fdfd5e1e8571', name: 'items' })));
         }
-        return (h(Host, { key: 'b5feffa63e8b3539ea8f7a00fcafab83d0be9c4e', class: 'p-dropdown relative' }, h("div", { key: 'ffe6f1d230d2281e6c704683dd08c9e74261dbe3', class: 'trigger', ref: ref => (this._trigger = ref), onClick: () => this._triggerClickHandler() }, h("slot", { key: 'f01bb68c26c92da98d639ba49aa1723a841c6c92', name: 'trigger' })), dropdownContainer));
+        return (h(Host, { key: '460ac62023f171b2e115af2d3de8bb77b55415dc', class: 'p-dropdown relative' }, h("div", { key: 'bba16627eac8cde7593ed69e0e7fec5d02987e52', class: 'trigger', ref: ref => (this._trigger = ref), onClick: () => this._triggerClickHandler() }, h("slot", { key: '6af8feb795d8b2e2401a1a70e7ec3029e7194132', name: 'trigger' })), dropdownContainer));
     }
     _checkButtons(active = false) {
         if (!this.applyChevron) {

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

@@ -135,16 +135,16 @@ export class Field {
     _inputRef;
     render() {
         const { prefix, suffix, hasHeaderSlot, hasLabelSlot, hasHelperSlot, hasErrorSlot, } = this._getSlotInfo();
-        return (h(Host, { key: 'b4229a4e7257f7a929cc3208834d95ab97990bcf', class: 'p-field' }, h("p-field-container", { key: '66c1e5bdc10bdc948e1e943fde89355e861135ae', forceShowTooltip: this.forceShowTooltip || this._focused, label: this.label, helper: this.helper, error: this.error, required: this.required }, hasLabelSlot && (h("slot", { key: '045626975fa0861371d2ad830d9bf8ec5b80720d', name: 'label', slot: 'label' })), hasHeaderSlot && (h("slot", { key: '43e613371e67f46a0c8ed5c9201b2b4e5fe91d7e', name: 'header', slot: 'header' })), hasHelperSlot && (h("slot", { key: 'e26723ffb55166d67c50e761410cd62100d70fa1', name: 'helper', slot: 'helper' })), hasErrorSlot && (h("slot", { key: 'b833ce639c3ff30e88ba86cdeb45dcf01ef866ac', name: 'error', slot: 'error' })), h("div", { key: 'd6b045356bca57b02a4ea32096969b5e017e3884', class: field({
+        return (h(Host, { key: '369e15b85e845790a9df07aa20508c953bb39ff3', class: 'p-field' }, h("p-field-container", { key: '232ac448fdd71b051d6e6d5ebcd65e5ce8effa38', forceShowTooltip: this.forceShowTooltip || this._focused, label: this.label, helper: this.helper, error: this.error, required: this.required }, hasLabelSlot && (h("slot", { key: '14db4b1e32a88d4936ed42e7b02fce2aa842484b', name: 'label', slot: 'label' })), hasHeaderSlot && (h("slot", { key: '30b883d2b9804772883690e2e02c480124f036c1', name: 'header', slot: 'header' })), hasHelperSlot && (h("slot", { key: '63dd8b1491818988bd2c3cf34064139f40a80824', name: 'helper', slot: 'helper' })), hasErrorSlot && (h("slot", { key: '9d764d0293a6085ef4d4e62f3a0899fb65951988', name: 'error', slot: 'error' })), h("div", { key: '7d439bcdbc4f9c6d7ee39732b9661c3c99aaa49e', class: field({
                 error: !!this.error?.length,
                 disabled: this.disabled,
                 focused: this.focused || this._focused,
                 size: this.size,
-            }), slot: 'content' }, (prefix || (this.icon && this.iconPosition === 'start')) && (h("div", { key: '6edc4f2c7b1b3bf470f7ab4a390655cdf0cf4d7f', class: prefixAndSuffic({
+            }), slot: 'content' }, (prefix || (this.icon && this.iconPosition === 'start')) && (h("div", { key: '4eff37bc22e6706a6546a4367bb89d25f4a6f91f', class: prefixAndSuffic({
                 error: !!this.error?.length,
                 disabled: this.disabled,
                 focused: this.focused || this._focused,
-            }), onClick: () => this._focusInput() }, this.icon && this.iconPosition === 'start' ? (h("p-icon", { class: 'flex', variant: this.icon, rotate: this.iconRotate, flip: this.iconFlip })) : (prefix))), this._getInput(), (suffix || (this.icon && this.iconPosition === 'end')) && (h("div", { key: '4b9d7579b8f08fb7fd7b6a2b69d0fb1a8a2bead5', class: prefixAndSuffic({
+            }), onClick: () => this._focusInput() }, this.icon && this.iconPosition === 'start' ? (h("p-icon", { class: 'flex', variant: this.icon, rotate: this.iconRotate, flip: this.iconFlip })) : (prefix))), this._getInput(), (suffix || (this.icon && this.iconPosition === 'end')) && (h("div", { key: '25f300b997455353e9563035288902de694b3130', class: prefixAndSuffic({
                 error: !!this.error?.length,
                 disabled: this.disabled,
                 focused: this.focused || this._focused,

package/dist/collection/components/molecules/input-error/input-error.component.js

@@ -6,7 +6,7 @@ export class InputError {
         this._showTooltip = false;
     }
     render() {
-        return (h(Host, { key: 'a5254a196be0c13c5f19f9db20eb14a606583fee', class: 'p-input-error' }, h("p-tooltip", { key: 'de2160ad2666b3478aa67fc94ac0d662c25e188c', variant: 'error', content: this.error, show: this.forceShowTooltip, onIsOpen: ev => (this._showTooltip = ev.detail) }, h("p-icon", { key: 'ec0c8e2591ae2933997fe2890e03852e7ae4f0c5', class: `${this._showTooltip ? 'text-negative' : 'text-negative-light'} hover:text-negative`, slot: 'trigger', variant: 'question-circle' }))));
+        return (h(Host, { key: 'ac5ab660850ac1908dd9645aec4e96238946ecf2', class: 'p-input-error' }, h("p-tooltip", { key: 'f9d2588446e1f675c4de4d58fd0d24e7d2af1fe9', variant: 'error', content: this.error, show: this.forceShowTooltip, onIsOpen: ev => (this._showTooltip = ev.detail) }, h("p-icon", { key: '4e6eaa812e9b30b07299a617c1fcb24261c00fee', class: `${this._showTooltip ? 'text-negative' : 'text-negative-light'} hover:text-negative`, slot: 'trigger', variant: 'question-circle' }))));
     }
     static get is() { return "p-input-error"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/molecules/label/label.component.css

@@ -0,0 +1 @@
+*{box-sizing:border-box}.static{position:static!important}.flex{display:flex!important}.hidden{display:none!important}.h-6{height:1.5rem!important}.w-6{width:1.5rem!important}.flex-1{flex:1 1 0%!important}.flex-shrink-0{flex-shrink:0!important}.items-center{align-items:center!important}.justify-center{justify-content: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-full{border-radius:9999px!important}.bg-amber-100{--tw-bg-opacity:1!important;background-color:rgb(255 246 194/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-positive-green-100{--tw-bg-opacity:1!important;background-color:rgb(213 251 199/var(--tw-bg-opacity,1))!important}.bg-supportive-lilac-100{--tw-bg-opacity:1!important;background-color:rgb(246 239 255/var(--tw-bg-opacity,1))!important}.bg-white-700{--tw-bg-opacity:1!important;background-color:rgb(242 242 242/var(--tw-bg-opacity,1))!important}.p-2{padding:.5rem!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-amber-800{--tw-text-opacity:1!important;color:rgb(148 77 11/var(--tw-text-opacity,1))!important}.text-dark-teal-800{--tw-text-opacity:1!important;color:rgb(1 37 33/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-positive-green-800{--tw-text-opacity:1!important;color:rgb(47 100 7/var(--tw-text-opacity,1))!important}.text-supportive-lilac-900{--tw-text-opacity:1!important;color:rgb(80 9 179/var(--tw-text-opacity,1))!important}@media (min-width:64rem){.desktop-xs\:block{display:block!important}.desktop-xs\:w-auto{width:auto!important}.desktop-xs\:py-0{padding-bottom:0!important;padding-top:0!important}}

package/dist/collection/components/{atoms → molecules}/label/label.component.js

@@ -1,24 +1,56 @@
 import { h, Host } from "@stencil/core";
+import { cva } from "class-variance-authority";
+import { cn } from "../../../utils/cn";
+const label = cva(['flex items-center justify-center gap-2', 'h-6 rounded-full'], {
+    variants: {
+        variant: {
+            positive: 'bg-positive-green-100 text-positive-green-800',
+            biased: 'bg-amber-100  text-amber-800',
+            negative: 'bg-negative-red-100 text-negative-red-800',
+            neutral: 'bg-supportive-lilac-100 text-supportive-lilac-900',
+            unavailable: 'bg-white-700 text-dark-teal-800',
+        },
+        iconOnly: {
+            false: 'px-2',
+            true: 'p-2 w-6',
+        },
+        keepMobileContent: {
+            false: null,
+            true: null,
+        },
+    },
+    compoundVariants: [
+        {
+            keepMobileContent: false,
+            iconOnly: false,
+            class: 'p-2 w-6 desktop-xs:w-auto desktop-xs:py-0',
+        },
+    ],
+});
 export class Label {
     constructor() {
         this.variant = 'neutral';
-        this.behavior = 'circle';
-        this.iconPosition = 'start';
+        this.iconOnly = false;
         this.icon = undefined;
         this.iconFlip = undefined;
         this.iconRotate = undefined;
-        this.size = 'default';
         this.keepMobileContent = false;
     }
     render() {
-        return (h(Host, { key: '8ba10d3dc16336fa12a22be608713816e04c3aa0', class: "p-label" }, this.icon && this.iconPosition === 'start' && (h("p-icon", { key: '34f7daa79756f34cb957d9cfb1bb6f0e71ff5dc7', variant: this.icon, flip: this.iconFlip, rotate: this.iconRotate })), (this.behavior === 'circle' ||
-            this.behavior === 'combination') && (h("div", { key: 'daf1ac4d3f85cbc542db3ff74de2901254b4758a', class: "circle" })), h("div", { key: 'f8481d947f4e51bd94c63179707816ca8e2b5696', class: "content" }, h("slot", { key: '81bf0d5bff0879b811d66234f3dfe6e03ce3b13f' })), this.icon && this.iconPosition === 'end' && (h("p-icon", { key: '46ebacc526e2f28a4b1a4c6df09bfaf18bd490be', variant: this.icon, flip: this.iconFlip, rotate: this.iconRotate }))));
+        return (h(Host, { key: 'f856eed050d7fa75c8cd48bb8f27bce27beb19c5', class: 'p-label' }, h("div", { key: '429ee34de3268f5a94e9996b1d4cde4f8165f67b', class: label({
+                variant: this.variant,
+                iconOnly: this.iconOnly,
+                keepMobileContent: this.keepMobileContent,
+            }) }, this.icon && (h("p-icon", { key: 'ed98f89a18751466d842f3c731aa253fa4a428b7', class: 'flex-shrink-0', variant: this.icon, flip: this.iconFlip, rotate: this.iconRotate })), !this.iconOnly && (h("div", { key: 'bc29f59321fa594bfa9925a0ec29c28ddedc7d4a', class: cn('flex-1 overflow-hidden text-ellipsis whitespace-nowrap text-sm', {
+                hidden: !this.keepMobileContent,
+                'desktop-xs:block': !this.keepMobileContent,
+            }) }, h("slot", { key: '81cdfddd2f82d84a26b4c85311cd03171ac6e9a0' }))))));
     }
     static get is() { return "p-label"; }
     static get encapsulation() { return "shadow"; }
     static get originalStyleUrls() {
         return {
-            "$": ["label.component.scss"]
+            "$": ["label.component.css"]
         };
     }
     static get styleUrls() {
@@ -32,8 +64,8 @@ export class Label {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "| 'neutral'\n\t\t| 'positive'\n\t\t| 'unbiased'\n\t\t| 'negative'\n\t\t| 'special'\n\t\t| 'info'",
-                    "resolved": "\"info\" | \"negative\" | \"neutral\" | \"positive\" | \"special\" | \"unbiased\"",
+                    "original": "| 'positive'\n\t\t| 'biased'\n\t\t| 'negative'\n\t\t| 'neutral'\n\t\t| 'unavailable'",
+                    "resolved": "\"biased\" | \"negative\" | \"neutral\" | \"positive\" | \"unavailable\"",
                     "references": {}
                 },
                 "required": false,
@@ -48,45 +80,25 @@ export class Label {
                 "reflect": true,
                 "defaultValue": "'neutral'"
             },
-            "behavior": {
-                "type": "string",
+            "iconOnly": {
+                "type": "boolean",
                 "mutable": false,
                 "complexType": {
-                    "original": "| 'icon'\n\t\t| 'circle'\n\t\t| 'combination'\n\t\t| 'text'\n\t\t| 'icon-only'",
-                    "resolved": "\"circle\" | \"combination\" | \"icon\" | \"icon-only\" | \"text\"",
+                    "original": "boolean",
+                    "resolved": "boolean",
                     "references": {}
                 },
                 "required": false,
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Define the behavior of the label"
+                    "text": "Wether to only show the icon"
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "behavior",
+                "attribute": "icon-only",
                 "reflect": true,
-                "defaultValue": "'circle'"
-            },
-            "iconPosition": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "'start' | 'end'",
-                    "resolved": "\"end\" | \"start\"",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Icon position"
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "icon-position",
-                "reflect": false,
-                "defaultValue": "'start'"
+                "defaultValue": "false"
             },
             "icon": {
                 "type": "string",
@@ -97,7 +109,7 @@ export class Label {
                     "references": {
                         "IconVariant": {
                             "location": "import",
-                            "path": "../icon/icon.component",
+                            "path": "../../atoms/icon/icon.component",
                             "id": "src/components/atoms/icon/icon.component.tsx::IconVariant"
                         }
                     }
@@ -122,7 +134,7 @@ export class Label {
                     "references": {
                         "IconFlipOptions": {
                             "location": "import",
-                            "path": "../icon/icon.component",
+                            "path": "../../atoms/icon/icon.component",
                             "id": "src/components/atoms/icon/icon.component.tsx::IconFlipOptions"
                         }
                     }
@@ -163,26 +175,6 @@ export class Label {
                 "attribute": "icon-rotate",
                 "reflect": false
             },
-            "size": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "'small' | 'default'",
-                    "resolved": "\"default\" | \"small\"",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "The size of the label"
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "size",
-                "reflect": true,
-                "defaultValue": "'default'"
-            },
             "keepMobileContent": {
                 "type": "boolean",
                 "mutable": false,

package/dist/collection/components/molecules/label/label.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"label.component.js","sourceRoot":"","sources":["../../../../src/components/molecules/label/label.component.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAGzD,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAC/C,OAAO,EAAE,EAAE,EAAE,MAAM,mBAAmB,CAAC;AAEvC,MAAM,KAAK,GAAG,GAAG,CAChB,CAAC,wCAAwC,EAAE,kBAAkB,CAAC,EAC9D;IACC,QAAQ,EAAE;QACT,OAAO,EAAE;YACR,QAAQ,EAAE,+CAA+C;YACzD,MAAM,EAAE,8BAA8B;YACtC,QAAQ,EAAE,2CAA2C;YACrD,OAAO,EAAE,mDAAmD;YAC5D,WAAW,EAAE,iCAAiC;SAC9C;QACD,QAAQ,EAAE;YACT,KAAK,EAAE,MAAM;YACb,IAAI,EAAE,SAAS;SACf;QACD,iBAAiB,EAAE;YAClB,KAAK,EAAE,IAAI;YACX,IAAI,EAAE,IAAI;SACV;KACD;IACD,gBAAgB,EAAE;QACjB;YACC,iBAAiB,EAAE,KAAK;YACxB,QAAQ,EAAE,KAAK;YACf,KAAK,EAAE,2CAA2C;SAClD;KACD;CACD,CACD,CAAC;AAOF,MAAM,OAAO,KAAK;;uBASE,SAAS;wBAKiB,KAAK;;;;iCAoBI,KAAK;;IAE3D,MAAM;QACL,OAAO,CACN,EAAC,IAAI,qDAAC,KAAK,EAAC,SAAS;YACpB,4DACC,KAAK,EAAE,KAAK,CAAC;oBACZ,OAAO,EAAE,IAAI,CAAC,OAAO;oBACrB,QAAQ,EAAE,IAAI,CAAC,QAAQ;oBACvB,iBAAiB,EAAE,IAAI,CAAC,iBAAiB;iBACzC,CAAC;gBAED,IAAI,CAAC,IAAI,IAAI,CACb,+DACC,KAAK,EAAC,eAAe,EACrB,OAAO,EAAE,IAAI,CAAC,IAAI,EAClB,IAAI,EAAE,IAAI,CAAC,QAAQ,EACnB,MAAM,EAAE,IAAI,CAAC,UAAU,GACtB,CACF;gBAEA,CAAC,IAAI,CAAC,QAAQ,IAAI,CAClB,4DACC,KAAK,EAAE,EAAE,CACR,gEAAgE,EAChE;wBACC,MAAM,EAAE,CAAC,IAAI,CAAC,iBAAiB;wBAC/B,kBAAkB,EAAE,CAAC,IAAI,CAAC,iBAAiB;qBAC3C,CACD;oBAED,8DAAQ,CACH,CACN,CACI,CACA,CACP,CAAC;IACH,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACD","sourcesContent":["import { Component, h, Host, Prop } from '@stencil/core';\nimport { RotateOptions } from '../../../types';\nimport { IconFlipOptions, IconVariant } from '../../atoms/icon/icon.component';\nimport { cva } from 'class-variance-authority';\nimport { cn } from '../../../utils/cn';\n\nconst label = cva(\n\t['flex items-center justify-center gap-2', 'h-6 rounded-full'],\n\t{\n\t\tvariants: {\n\t\t\tvariant: {\n\t\t\t\tpositive: 'bg-positive-green-100 text-positive-green-800',\n\t\t\t\tbiased: 'bg-amber-100  text-amber-800',\n\t\t\t\tnegative: 'bg-negative-red-100 text-negative-red-800',\n\t\t\t\tneutral: 'bg-supportive-lilac-100 text-supportive-lilac-900',\n\t\t\t\tunavailable: 'bg-white-700 text-dark-teal-800',\n\t\t\t},\n\t\t\ticonOnly: {\n\t\t\t\tfalse: 'px-2',\n\t\t\t\ttrue: 'p-2 w-6',\n\t\t\t},\n\t\t\tkeepMobileContent: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: null,\n\t\t\t},\n\t\t},\n\t\tcompoundVariants: [\n\t\t\t{\n\t\t\t\tkeepMobileContent: false,\n\t\t\t\ticonOnly: false,\n\t\t\t\tclass: 'p-2 w-6 desktop-xs:w-auto desktop-xs:py-0',\n\t\t\t},\n\t\t],\n\t}\n);\n\n@Component({\n\ttag: 'p-label',\n\tstyleUrl: 'label.component.css',\n\tshadow: true,\n})\nexport class Label {\n\t/**\n\t * Variant of the label\n\t */\n\t@Prop({ reflect: true }) variant:\n\t\t| 'positive'\n\t\t| 'biased'\n\t\t| 'negative'\n\t\t| 'neutral'\n\t\t| 'unavailable' = 'neutral';\n\n\t/**\n\t * Wether to only show the icon\n\t */\n\t@Prop({ reflect: true }) iconOnly: boolean = false;\n\n\t/**\n\t * Icon to show on the label\n\t */\n\t@Prop({ reflect: true }) icon: IconVariant;\n\n\t/**\n\t * Icon flip\n\t */\n\t@Prop() iconFlip: IconFlipOptions;\n\n\t/**\n\t * Icon rotate\n\t */\n\t@Prop() iconRotate: RotateOptions;\n\n\t/**\n\t * Wether to keep the content on mobile\n\t */\n\t@Prop({ reflect: true }) keepMobileContent: boolean = false;\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class='p-label'>\n\t\t\t\t<div\n\t\t\t\t\tclass={label({\n\t\t\t\t\t\tvariant: this.variant,\n\t\t\t\t\t\ticonOnly: this.iconOnly,\n\t\t\t\t\t\tkeepMobileContent: this.keepMobileContent,\n\t\t\t\t\t})}\n\t\t\t\t>\n\t\t\t\t\t{this.icon && (\n\t\t\t\t\t\t<p-icon\n\t\t\t\t\t\t\tclass='flex-shrink-0'\n\t\t\t\t\t\t\tvariant={this.icon}\n\t\t\t\t\t\t\tflip={this.iconFlip}\n\t\t\t\t\t\t\trotate={this.iconRotate}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{!this.iconOnly && (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclass={cn(\n\t\t\t\t\t\t\t\t'flex-1 overflow-hidden text-ellipsis whitespace-nowrap text-sm',\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\thidden: !this.keepMobileContent,\n\t\t\t\t\t\t\t\t\t'desktop-xs:block': !this.keepMobileContent,\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<slot />\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"]}

package/dist/collection/components/molecules/navigation-item/navigation-item.component.js

@@ -43,10 +43,10 @@ export class NavigationItem {
     render() {
         const TagType = this.as;
         const active = this.active || this.class?.includes('active');
-        return (h(Host, { key: 'd87d8e76973078637e8c2d184b495d630f4fd556', class: cn('p-navigation-item inline-block', this.class) }, h(TagType, { key: 'db37312225ef973cb75c71b0b0b918ed2f8799c3', class: navigationItem({
+        return (h(Host, { key: '093b9c1c4c03c9b6d8bafe510ff7713f2cde758c', class: cn('p-navigation-item inline-block', this.class) }, h(TagType, { key: '275b9172a1d3722d308065185b8c6f898e717bca', class: navigationItem({
                 icon: !!this.icon,
                 active,
-            }), href: this.href, target: this.target }, h("div", { key: '5f56c4395729260e25e6a71da5ac716b09193bd5', class: navigationItemIconContainer({ active }) }, h("p-icon", { key: '0cc4e9b0f0cdf1ad574ef8ba5b8b80f3ce376d3f', variant: this.icon })), h("span", { key: 'a52984e8227ec3af005d1b240944ff85ba58a37e', class: this.counter && 'has-counter' }, h("slot", { key: 'eaa1a3e88f0d7517fc383d96fae3194522e4efb1' })), !!this.counter && this.counter !== '0' && (h("p-badge", { key: 'eb7b69d6235d7f1c72ca1045255d70764a9b179d' }, this.counter)), !!this.loading && h("p-loader", { key: '081c5f8b49dfb3a80429815de87f717cd70e39ae', class: 'ml-auto' }))));
+            }), href: this.href, target: this.target }, h("div", { key: 'c2ca2fee661b6244bff144deaf9c8499ee0afa8b', class: navigationItemIconContainer({ active }) }, h("p-icon", { key: 'c1974b11f7d21422880f61139c535f0099f91a67', variant: this.icon })), h("span", { key: '71b4f19042174fb8cbf2f0feb6be74bffe5c1303', class: this.counter && 'has-counter' }, h("slot", { key: '72fa6bd043213151eb3e22105102973ad8c7fbef' })), !!this.counter && this.counter !== '0' && (h("p-badge", { key: 'caa907ca2acf8451cfcecc1e8a43ce0ef5bf153b' }, this.counter)), !!this.loading && h("p-loader", { key: 'cf2a8eb51f5a7453b87b87aa44bb4823670ef714', class: 'ml-auto' }))));
     }
     static get is() { return "p-navigation-item"; }
     static get originalStyleUrls() {

package/dist/collection/components/molecules/navigation-section/navigation-section.component.js

@@ -4,7 +4,7 @@ export class NavigationSection {
         this.header = undefined;
     }
     render() {
-        return (h(Host, { key: '796e5ed44de63dc1f59630dad492272b6451ed0e', class: 'p-navigation-section flex flex-col gap-2' }, this.header?.length > 0 && (h("p-navigation-title", { key: '09d6b3680a110b5cd88d5cc9b5265c4b604c8ab3' }, this.header)), h("div", { key: '646ea16ad875dcfdf40aeb12657d946c39f44b3b', class: 'flex flex-col' }, h("slot", { key: 'c11b12a07b3a65b5ca1e8d61910d8a5160e32ea7' }))));
+        return (h(Host, { key: 'f4c9cbde8f0bf86e2cc1df10c7f4b2d50e3ac803', class: 'p-navigation-section flex flex-col gap-2' }, this.header?.length > 0 && (h("p-navigation-title", { key: '4be5133078abe4f0b20e75168c49faced844655e' }, this.header)), h("div", { key: 'dc04383133e2f7122bba8d8dbe18f7d6ed2bae0e', class: 'flex flex-col' }, h("slot", { key: '82a5fd7183090458ab036d915b0e0af562183ef4' }))));
     }
     static get is() { return "p-navigation-section"; }
     static get originalStyleUrls() {