npm - @paperless/core - Versions diffs - 2.0.1-beta.1 → 2.0.1-beta.10 - Mend

@paperless/core 2.0.1-beta.1 → 2.0.1-beta.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1421) hide show

package/dist/esm/p-datepicker.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-7b917f6b.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-f99096d4.js';
 import { c as childOf } from './child-of-fec6ab3a.js';
 import { _ as _typeof, g as getUTCWeekYear, s as startOfUTCWeek, a as startOfUTCISOWeek, r as requiredArgs, t as toDate, b as getUTCWeek, c as toInteger, d as getUTCISOWeek, e as getDefaultOptions, l as longFormatters, f as subMilliseconds, h as getTimezoneOffsetInMilliseconds, i as locale, j as isProtectedWeekYearToken, k as throwProtectedError, m as isProtectedDayOfYearToken, n as isValid, o as isBefore, p as isAfter, q as startOfDay, u as isSameDay, v as format } from './index-5fa2e728.js';

package/dist/esm/p-divider.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-7b917f6b.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-f99096d4.js';
-const dividerComponentCss = ".mx-2{margin-left:.5rem!important;margin-right:.5rem!important}.my-0{margin-bottom:0!important;margin-top:0!important}.my-2{margin-bottom:.5rem!important;margin-top:.5rem!important}.block{display:block!important}.flex{display:flex!important}.h-full{height:100%!important}.h-px{height:1px!important}.w-auto{width:auto!important}.w-full{width:100%!important}.w-px{width:1px!important}.flex-1{flex:1 1 0%!important}*{box-sizing:border-box}:host{--tw-text-opacity:1;color:rgb(227 236 243/var(--tw-text-opacity));display:block;margin-bottom:.5rem;margin-top:.5rem;width:100%}:host .content{align-items:center;display:flex;width:100%}:host .content:after,:host .content:before{background-color:currentColor;content:\"\";flex:1 1 0%;height:1px}:host([variant=vertical]){display:block;height:100%;margin:0 .5rem;width:auto}:host([variant=vertical]) .content{flex-direction:column;height:100%;width:auto}:host([variant=vertical]) .content:after,:host([variant=vertical]) .content:before{background-color:currentColor;content:\"\";flex:1 1 0%;width:1px}.static{position:static!important}.items-center{align-items:center!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.text-xxs{font-size:.6875rem!important}.font-semibold{font-weight:600!important}.uppercase{text-transform:uppercase!important}.text-storm-light{--tw-text-opacity:1!important;color:rgb(176 178 203/var(--tw-text-opacity))!important}";
+const dividerComponentCss = ".mx-2{margin-left:.5rem!important;margin-right:.5rem!important}.my-0{margin-bottom:0!important;margin-top:0!important}.my-2{margin-bottom:.5rem!important;margin-top:.5rem!important}.block{display:block!important}.flex{display:flex!important}.h-full{height:100%!important}.h-px{height:1px!important}.w-auto{width:auto!important}.w-full{width:100%!important}.w-px{width:1px!important}.flex-1{flex:1 1 0%!important}*{box-sizing:border-box}:host{--tw-text-opacity:1;color:rgb(227 236 243/var(--tw-text-opacity,1));display:block;margin-bottom:.5rem;margin-top:.5rem;width:100%}:host .content{align-items:center;display:flex;width:100%}:host .content:after,:host .content:before{background-color:currentColor;content:\"\";flex:1 1 0%;height:1px}:host([variant=vertical]){display:block;height:100%;margin:0 .5rem;width:auto}:host([variant=vertical]) .content{flex-direction:column;height:100%;width:auto}:host([variant=vertical]) .content:after,:host([variant=vertical]) .content:before{background-color:currentColor;content:\"\";flex:1 1 0%;width:1px}.static{position:static!important}.items-center{align-items:center!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.font-semibold{font-weight:600!important}.uppercase{text-transform:uppercase!important}.text-storm-light{--tw-text-opacity:1!important;color:rgb(176 178 203/var(--tw-text-opacity,1))!important}";
 const Divider = class {
   constructor(hostRef) {
@@ -10,7 +10,7 @@ const Divider = class {
   render() {
     var _a;
     const hasSlotted = !!((_a = this._el.innerHTML) === null || _a === void 0 ? void 0 : _a.length);
-    return (h(Host, { class: "p-divider" }, h("div", { class: "content" }, h("div", { class: `flex items-center ${hasSlotted && 'px-2'} text-xxs font-semibold uppercase text-storm-light` }, h("slot", null)))));
+    return (h(Host, { class: 'p-divider' }, h("div", { class: 'content' }, h("div", { class: `flex items-center ${hasSlotted && 'px-2'} text-xs font-semibold uppercase text-storm-light` }, h("slot", null)))));
   }
   get _el() { return getElement(this); }
 };

package/dist/esm/p-divider.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"p-divider.entry.js","mappings":";;AAAA,MAAM,mBAAmB,GAAG,~~y4CAAy4C~~;;~~MCOx5C~~,OAAO;;;mBAI2C,YAAY;;EAO1E,MAAM;;IACL,MAAM,UAAU,GAAG,CAAC,EAAC,MAAA,IAAI,CAAC,GAAG,CAAC,SAAS,0CAAE,MAAM,CAAA,CAAC;IAChD,QACC,EAAC,IAAI,IAAC,KAAK,EAAC,WAAW,IACtB,WAAK,KAAK,EAAC,SAAS,IACnB,WACC,KAAK,EAAE,qBACN,UAAU,IAAI,MACf,~~oDAAoD~~,~~IAEpD~~,eAAQ,CACH,CACD,CACA,EACN;GACF;;;;;;;","names":[],"sources":["src/components/atoms/divider/divider.component.scss?tag=p-divider&encapsulation=shadow","src/components/atoms/divider/divider.component.tsx"],"sourcesContent":[":host {\n\t@apply my-2 block w-full text-mystic-medium;\n\n\t.content {\n\t\t@apply flex w-full items-center;\n\n\t\t&::before,\n\t\t&::after {\n\t\t\tcontent: '';\n\t\t\t@apply h-px flex-1 bg-current;\n\t\t}\n\t}\n}\n\n:host([variant='vertical']) {\n\t@apply mx-2 my-0 block h-full w-auto;\n\n\t.content {\n\t\t@apply h-full w-auto flex-col;\n\n\t\t&::before,\n\t\t&::after {\n\t\t\tcontent: '';\n\t\t\t@apply w-px flex-1 bg-current;\n\t\t}\n\t}\n}\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n\ttag: 'p-divider',\n\tstyleUrl: 'divider.component.scss',\n\tshadow: true,\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 The host element\n\t */\n\t@Element() private _el: HTMLElement;\n\n\trender() {\n\t\tconst hasSlotted = !!this._el.innerHTML?.length;\n\t\treturn (\n\t\t\t<Host class~~=\"~~p-divider\">\n\t\t\t\t<div class~~=\"~~content\">\n\t\t\t\t\t<div\n\t\t\t\t\t\tclass={`flex items-center ${\n\t\t\t\t\t\t\thasSlotted && 'px-2'\n\t\t\t\t\t\t} text-~~xxs~~ font-semibold uppercase text-storm-light`}\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</div>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"version":3}
1	+ {"file":"p-divider.entry.js","mappings":";;AAAA,MAAM,mBAAmB,GAAG,q6CAAq6C;;MCOp7C,OAAO;;;mBAI2C,YAAY;;EAO1E,MAAM;;IACL,MAAM,UAAU,GAAG,CAAC,EAAC,MAAA,IAAI,CAAC,GAAG,CAAC,SAAS,0CAAE,MAAM,CAAA,CAAC;IAChD,QACC,EAAC,IAAI,IAAC,KAAK,EAAC,WAAW,IACtB,WAAK,KAAK,EAAC,SAAS,IACnB,WACC,KAAK,EAAE,qBACN,UAAU,IAAI,MACf,mDAAmD,IAEnD,eAAQ,CACH,CACD,CACA,EACN;GACF;;;;;;;","names":[],"sources":["src/components/atoms/divider/divider.component.scss?tag=p-divider&encapsulation=shadow","src/components/atoms/divider/divider.component.tsx"],"sourcesContent":[":host {\n\t@apply my-2 block w-full text-mystic-medium;\n\n\t.content {\n\t\t@apply flex w-full items-center;\n\n\t\t&::before,\n\t\t&::after {\n\t\t\tcontent: '';\n\t\t\t@apply h-px flex-1 bg-current;\n\t\t}\n\t}\n}\n\n:host([variant='vertical']) {\n\t@apply mx-2 my-0 block h-full w-auto;\n\n\t.content {\n\t\t@apply h-full w-auto flex-col;\n\n\t\t&::before,\n\t\t&::after {\n\t\t\tcontent: '';\n\t\t\t@apply w-px flex-1 bg-current;\n\t\t}\n\t}\n}\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n\ttag: 'p-divider',\n\tstyleUrl: 'divider.component.scss',\n\tshadow: true,\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 The host element\n\t */\n\t@Element() private _el: HTMLElement;\n\n\trender() {\n\t\tconst hasSlotted = !!this._el.innerHTML?.length;\n\t\treturn (\n\t\t\t<Host class='p-divider'>\n\t\t\t\t<div class='content'>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclass={`flex items-center ${\n\t\t\t\t\t\t\thasSlotted && 'px-2'\n\t\t\t\t\t\t} text-xs font-semibold uppercase text-storm-light`}\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</div>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"version":3}

package/dist/esm/p-drawer-body_3.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
-import { r as registerInstance, h, H as Host, c as createEvent } from './index-7b917f6b.js';
+import { r as registerInstance, h, H as Host, c as createEvent } from './index-f99096d4.js';
-const drawerBodyComponentCss = ".flex{display:flex!important}.min-h-full{min-height:100%!important}.w-full{width:100%!important}.flex-1{flex:1 1 0%!important}.px-4{padding-left:1rem!important;padding-right:1rem!important}*{box-sizing:border-box}:host{--tw-bg-opacity:1;background-color:rgb(247 250 252/var(--tw-bg-opacity));display:flex;flex:1 1 0%;flex-direction:column;min-height:100%;padding:1.5rem 1rem env(safe-area-inset-bottom,0);width:100%}.static{position:static!important}";
+const drawerBodyComponentCss = ".flex{display:flex!important}.min-h-full{min-height:100%!important}.w-full{width:100%!important}.flex-1{flex:1 1 0%!important}.px-4{padding-left:1rem!important;padding-right:1rem!important}*{box-sizing:border-box}:host{--tw-bg-opacity:1;background-color:rgb(247 250 252/var(--tw-bg-opacity,1));display:flex;flex:1 1 0%;flex-direction:column;min-height:100%;padding:1.5rem 1rem env(safe-area-inset-bottom,0);width:100%}.static{position:static!important}";
 const ModalBody = class {
   constructor(hostRef) {
@@ -13,7 +13,7 @@ const ModalBody = class {
 };
 ModalBody.style = drawerBodyComponentCss;
-const drawerContainerComponentCss = ".z-drawer{z-index:500!important}.flex{display:flex!important}.w-full{width:100%!important}.shadow-4{--tw-shadow:0px 0.3125rem 1rem rgba(0,24,98,.08),0px 0.0625rem 0.1875rem rgba(0,24,98,.13)!important;--tw-shadow-colored:0px 0.3125rem 1rem var(--tw-shadow-color),0px 0.0625rem 0.1875rem 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}*{box-sizing:border-box}p-drawer-container{--tw-bg-opacity:1;--tw-shadow:0px 0.3125rem 1rem rgba(0,24,98,.08),0px 0.0625rem 0.1875rem rgba(0,24,98,.13)!important;--tw-shadow-colored:0px 0.3125rem 1rem var(--tw-shadow-color),0px 0.0625rem 0.1875rem var(--tw-shadow-color)!important;animation:slideInRight .5s ease forwards;background-color:rgb(255 255 255/var(--tw-bg-opacity));box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)!important;display:flex;flex-direction:column;min-height:100vh;width:100%;z-index:500}@media (min-width:40rem){p-drawer-container{width:22.5rem}}@keyframes slideInRight{0%{transform:translateX(100%)}to{transform:translateX(0)}}@keyframes slideOutRight{0%{transform:translateX(0)}to{transform:translateX(100%)}}p-drawer-container.closing{animation:slideOutRight .2s ease forwards}@media (min-width:40rem){.tablet\\:w-\\[22\\.5rem\\]{width:22.5rem!important}}.static{position:static!important}";
+const drawerContainerComponentCss = ".z-drawer{z-index:500!important}.flex{display:flex!important}.w-full{width:100%!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}.animate-in{--tw-enter-opacity:initial!important;--tw-enter-scale:initial!important;--tw-enter-rotate:initial!important;--tw-enter-translate-x:initial!important;--tw-enter-translate-y:initial!important;animation-duration:.15s!important;animation-name:enter!important}*{box-sizing:border-box}p-drawer-container{--tw-bg-opacity:1;--tw-enter-opacity:initial;--tw-enter-scale:initial;--tw-enter-rotate:initial;--tw-enter-translate-x:initial;--tw-enter-translate-y:initial;--tw-enter-translate-x:100%;--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;animation-duration:.15s;animation-name:enter;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)!important;display:flex;flex-direction:column;min-height:100vh;width:100%;z-index:500}@media (min-width:40rem){p-drawer-container{width:22.5rem}}p-drawer-container.closing{--tw-exit-translate-x:100%}@media (min-width:40rem){.tablet\\:w-\\[22\\.5rem\\]{width:22.5rem!important}}.static{position:static!important}";
 const ModalContainer = class {
   constructor(hostRef) {
@@ -26,7 +26,7 @@ const ModalContainer = class {
 };
 ModalContainer.style = drawerContainerComponentCss;
-const drawerHeaderComponentCss = ".absolute{position:absolute!important}.sticky{position:sticky!important}.top-0{top:0!important}.z-drawer-header{z-index:501!important}.flex{display:flex!important}.items-center{align-items:center!important}.border-0{border-width:0!important}.border-b{border-bottom-width:1px!important}.border-solid{border-style:solid!important}.border-b-mystic-dark{--tw-border-opacity:1!important;border-bottom-color:rgb(218 230 240/var(--tw-border-opacity))!important}.text-xl{font-size:1.25rem!important;line-height:1.75rem!important}.font-semibold{font-weight:600!important}*{box-sizing:border-box}:host{--tw-bg-opacity:1;--tw-text-opacity:1;--tw-border-opacity:1!important;align-items:center;background-color:rgb(255 255 255/var(--tw-bg-opacity));border-width:0!important;border-bottom:1px rgb(218 230 240/var(--tw-border-opacity))!important;border-style:solid!important;color:rgb(39 40 56/var(--tw-text-opacity));display:flex;font-size:1.25rem;font-weight:600;justify-content:center;line-height:1.75rem;padding:calc(env(safe-area-inset-top, 0) + 1rem) 1rem 1rem;position:sticky;top:0;z-index:501}:host p-button{left:1rem;position:absolute;top:calc(env(safe-area-inset-top, 0) + 1rem)}.static{position:static!important}";
+const drawerHeaderComponentCss = ".absolute{position:absolute!important}.sticky{position:sticky!important}.top-0{top:0!important}.z-drawer-header{z-index:501!important}.flex{display:flex!important}.items-center{align-items:center!important}.border-0{border-width:0!important}.border-b{border-bottom-width:1px!important}.border-solid{border-style:solid!important}.border-b-mystic-dark{--tw-border-opacity:1!important;border-bottom-color:rgb(218 230 240/var(--tw-border-opacity,1))!important}.text-xl{font-size:1.25rem!important;line-height:1.75rem!important}.font-semibold{font-weight:600!important}*{box-sizing:border-box}:host{--tw-bg-opacity:1;--tw-text-opacity:1;--tw-border-opacity:1!important;align-items:center;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));border-width:0!important;border-bottom:1px rgb(218 230 240/var(--tw-border-opacity,1))!important;border-style:solid!important;color:rgb(39 40 56/var(--tw-text-opacity,1));display:flex;font-size:1.25rem;font-weight:600;justify-content:center;line-height:1.75rem;padding:calc(env(safe-area-inset-top, 0) + 1rem) 1rem 1rem;position:sticky;top:0;z-index:501}:host p-button{left:1rem;position:absolute;top:calc(env(safe-area-inset-top, 0) + 1rem)}.static{position:static!important}";
 const ModalHeader = class {
   constructor(hostRef) {
@@ -35,7 +35,7 @@ const ModalHeader = class {
     this.showClose = true;
   }
   render() {
-    return (h(Host, { class: "p-drawer-header" }, this.showClose && (h("p-button", { variant: "secondary", icon: "negative", iconOnly: true, onClick: () => this.close.emit(), size: "small" })), h("slot", null)));
+    return (h(Host, { class: 'p-drawer-header' }, this.showClose && (h("p-button", { variant: 'secondary', icon: 'negative', iconOnly: true, onClick: () => this.close.emit(), size: 'sm' })), h("slot", null)));
   }
 };
 ModalHeader.style = drawerHeaderComponentCss;

package/dist/esm/p-drawer-body_3.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"p-drawer-body.p-drawer-container.p-drawer-header.entry.js","mappings":";;AAAA,MAAM,sBAAsB,GAAG,~~ocAAoc~~;;~~MCOtd~~,SAAS;;;mBAIkB,SAAS;;EAEhD,MAAM;IACL,QACC,EAAC,IAAI,IAAC,KAAK,EAAE,yBAAyB,IAAI,CAAC,OAAO,EAAE,IACnD,eAAQ,CACF,EACN;GACF;;;;ACnBF,MAAM,2BAA2B,GAAG,~~q3CAAq3C~~;;~~MCY54C~~,cAAc;;;mBAIC,KAAK;;EAEhC,MAAM;IACL,QACC,EAAC,IAAI,IAAC,KAAK,EAAE,sBAAsB,IAAI,CAAC,OAAO,IAAI,SAAS,EAAE,IAC7D,eAAQ,CACF,EACN;GACF;;;;ACxBF,MAAM,wBAAwB,GAAG,~~0rCAA0rC~~;;~~MCO9sC~~,WAAW;;;;qBAIH,IAAI;;EAUxB,MAAM;IACL,QACC,EAAC,IAAI,IAAC,KAAK,EAAC,iBAAiB,IAC3B,IAAI,CAAC,SAAS,KACd,gBACC,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,UAAU,EACf,QAAQ,EAAE,IAAI,EACd,OAAO,EAAE,MAAM,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,EAChC,IAAI,EAAC,~~OAAO~~,~~GACD~~,CACZ,EAED,eAAQ,CACF,EACN;GACF;;;;;;","names":[],"sources":["src/components/atoms/drawer-body/drawer-body.component.scss?tag=p-drawer-body&encapsulation=shadow","src/components/atoms/drawer-body/drawer-body.component.tsx","src/components/atoms/drawer-container/drawer-container.component.scss?tag=p-drawer-container","src/components/atoms/drawer-container/drawer-container.component.tsx","src/components/atoms/drawer-header/drawer-header.component.scss?tag=p-drawer-header&encapsulation=shadow","src/components/atoms/drawer-header/drawer-header.component.tsx"],"sourcesContent":[":host {\n\t@apply flex flex-1 flex-col;\n\t@apply min-h-full w-full px-4 py-6;\n\t@apply bg-mystic;\n\n\tpadding-bottom: env(safe-area-inset-bottom, 0);\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n\ttag: 'p-drawer-body',\n\tstyleUrl: 'drawer-body.component.scss',\n\tshadow: true,\n})\nexport class ModalBody {\n\t/*\n\t The variant of the modal body\n\t /\n\t@Prop() variant: 'default' \| 'table' = 'default';\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={`p-drawer-body variant-${this.variant}`}>\n\t\t\t\t<slot />\n\t\t\t</Host>\n\t\t);\n\t}\n}\n","p-drawer-container {\n\t@apply z-drawer flex flex-col;\n\t// tablet:w-[22.5rem]\n\t@apply w-full tablet:w-[22.5rem];\n\t@apply bg-white;\n\t@apply ~~animate~~-~~slide~~-~~in-right~~;\n\t@apply ~~min~~-h-~~screen~~;\n\n\t@apply shadow-4 #{!important};\n\n\t&.closing {\n\t\t@apply ~~animate-~~slide-out-right;\n\t}\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n// $drawer-xs: 20rem;\n// $drawer-sm: 33.5rem;\n// $drawer-md: 38rem;\n// $drawer-lg: 47.5rem;\n// $drawer-xl: 57.5rem;\n\n@Component({\n\ttag: 'p-drawer-container',\n\tstyleUrl: 'drawer-container.component.scss',\n})\nexport class ModalContainer {\n\t/\n\t Wether the container is closing\n\t /\n\t@Prop() closing: boolean = false;\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={`p-drawer-container ${this.closing && 'closing'}`}>\n\t\t\t\t<slot />\n\t\t\t</Host>\n\t\t);\n\t}\n}\n",":host {\n\t@apply bg-white;\n\t@apply sticky top-0 flex items-center justify-center;\n\t@apply z-drawer-header p-4;\n\n\tpadding-top: calc(env(safe-area-inset-top, 0) + 1rem);\n\n\t@apply text-xl font-semibold text-storm-dark;\n\n\t@apply border-0 border-b border-solid border-b-mystic-dark #{!important};\n\n\tp-button {\n\t\t@apply absolute left-4;\n\n\t\ttop: calc(env(safe-area-inset-top, 0) + 1rem);\n\t}\n}\n","import { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\n\n@Component({\n\ttag: 'p-drawer-header',\n\tstyleUrl: 'drawer-header.component.scss',\n\tshadow: true,\n})\nexport class ModalHeader {\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<Host class~~=\"~~p-drawer-header\">\n\t\t\t\t{this.showClose && (\n\t\t\t\t\t<p-button\n\t\t\t\t\t\tvariant~~=\"~~secondary\"\n\t\t\t\t\t\ticon~~=\"~~negative\"\n\t\t\t\t\t\ticonOnly={true}\n\t\t\t\t\t\tonClick={() => this.close.emit()}\n\t\t\t\t\t\tsize~~=\"small~~\"\n\t\t\t\t\t></p-button>\n\t\t\t\t)}\n\n\t\t\t\t<slot />\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"version":3}
1	+ {"file":"p-drawer-body.p-drawer-container.p-drawer-header.entry.js","mappings":";;AAAA,MAAM,sBAAsB,GAAG,scAAsc;;MCOxd,SAAS;;;mBAIkB,SAAS;;EAEhD,MAAM;IACL,QACC,EAAC,IAAI,IAAC,KAAK,EAAE,yBAAyB,IAAI,CAAC,OAAO,EAAE,IACnD,eAAQ,CACF,EACN;GACF;;;;ACnBF,MAAM,2BAA2B,GAAG,4oDAA4oD;;MCYnqD,cAAc;;;mBAIC,KAAK;;EAEhC,MAAM;IACL,QACC,EAAC,IAAI,IAAC,KAAK,EAAE,sBAAsB,IAAI,CAAC,OAAO,IAAI,SAAS,EAAE,IAC7D,eAAQ,CACF,EACN;GACF;;;;ACxBF,MAAM,wBAAwB,GAAG,ksCAAksC;;MCOttC,WAAW;;;;qBAIH,IAAI;;EAUxB,MAAM;IACL,QACC,EAAC,IAAI,IAAC,KAAK,EAAC,iBAAiB,IAC3B,IAAI,CAAC,SAAS,KACd,gBACC,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,UAAU,EACf,QAAQ,EAAE,IAAI,EACd,OAAO,EAAE,MAAM,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,EAChC,IAAI,EAAC,IAAI,GACE,CACZ,EAED,eAAQ,CACF,EACN;GACF;;;;;;","names":[],"sources":["src/components/atoms/drawer-body/drawer-body.component.scss?tag=p-drawer-body&encapsulation=shadow","src/components/atoms/drawer-body/drawer-body.component.tsx","src/components/atoms/drawer-container/drawer-container.component.scss?tag=p-drawer-container","src/components/atoms/drawer-container/drawer-container.component.tsx","src/components/atoms/drawer-header/drawer-header.component.scss?tag=p-drawer-header&encapsulation=shadow","src/components/atoms/drawer-header/drawer-header.component.tsx"],"sourcesContent":[":host {\n\t@apply flex flex-1 flex-col;\n\t@apply min-h-full w-full px-4 py-6;\n\t@apply bg-mystic;\n\n\tpadding-bottom: env(safe-area-inset-bottom, 0);\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n\ttag: 'p-drawer-body',\n\tstyleUrl: 'drawer-body.component.scss',\n\tshadow: true,\n})\nexport class ModalBody {\n\t/*\n\t The variant of the modal body\n\t /\n\t@Prop() variant: 'default' \| 'table' = 'default';\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={`p-drawer-body variant-${this.variant}`}>\n\t\t\t\t<slot />\n\t\t\t</Host>\n\t\t);\n\t}\n}\n","p-drawer-container {\n\t@apply z-drawer flex flex-col;\n\t// tablet:w-[22.5rem]\n\t@apply w-full tablet:w-[22.5rem];\n\t@apply bg-white;\n\t@apply min-h-screen;\n\t@apply animate-in slide-in-from-right;\n\n\t@apply shadow-3 #{!important};\n\n\t&.closing {\n\t\t@apply slide-out-to-right;\n\t}\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n// $drawer-xs: 20rem;\n// $drawer-sm: 33.5rem;\n// $drawer-md: 38rem;\n// $drawer-lg: 47.5rem;\n// $drawer-xl: 57.5rem;\n\n@Component({\n\ttag: 'p-drawer-container',\n\tstyleUrl: 'drawer-container.component.scss',\n})\nexport class ModalContainer {\n\t/\n\t Wether the container is closing\n\t /\n\t@Prop() closing: boolean = false;\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={`p-drawer-container ${this.closing && 'closing'}`}>\n\t\t\t\t<slot />\n\t\t\t</Host>\n\t\t);\n\t}\n}\n",":host {\n\t@apply bg-white;\n\t@apply sticky top-0 flex items-center justify-center;\n\t@apply z-drawer-header p-4;\n\n\tpadding-top: calc(env(safe-area-inset-top, 0) + 1rem);\n\n\t@apply text-xl font-semibold text-storm-dark;\n\n\t@apply border-0 border-b border-solid border-b-mystic-dark #{!important};\n\n\tp-button {\n\t\t@apply absolute left-4;\n\n\t\ttop: calc(env(safe-area-inset-top, 0) + 1rem);\n\t}\n}\n","import { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\n\n@Component({\n\ttag: 'p-drawer-header',\n\tstyleUrl: 'drawer-header.component.scss',\n\tshadow: true,\n})\nexport class ModalHeader {\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<Host class='p-drawer-header'>\n\t\t\t\t{this.showClose && (\n\t\t\t\t\t<p-button\n\t\t\t\t\t\tvariant='secondary'\n\t\t\t\t\t\ticon='negative'\n\t\t\t\t\t\ticonOnly={true}\n\t\t\t\t\t\tonClick={() => this.close.emit()}\n\t\t\t\t\t\tsize='sm'\n\t\t\t\t\t></p-button>\n\t\t\t\t)}\n\n\t\t\t\t<slot />\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"version":3}

package/dist/esm/p-drawer.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-7b917f6b.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-f99096d4.js';
 const drawerComponentCss = ".block{display:block!important}*{box-sizing:border-box}:host{display:block}.static{position:static!important}";

package/dist/esm/p-dropdown-menu-container.entry.js CHANGED Viewed

@@ -1,17 +1,58 @@
-import { r as registerInstance, h, H as Host } from './index-7b917f6b.js';
+import { r as registerInstance, h, H as Host } from './index-f99096d4.js';
+import { c as cva } from './index-10317a74.js';
+import './clsx-297c1ffe.js';
-const dropdownMenuContainerComponentCss = ".z-10{z-index:10!important}.flex{display:flex!important}.hidden{display:none!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}.w-full{width:100%!important}.max-w-\\[222px\\]{max-width:222px!important}.flex-col{flex-direction:column!important}.gap-\\[1px\\]{gap:1px!important}.overflow-y-auto{overflow-y:auto!important}.rounded-xxlarge{border-radius:.75rem!important}.drop-shadow-4{--tw-drop-shadow:drop-shadow(0px 0.3125rem 1rem rgba(0,24,98,.08)) drop-shadow(0px 0.0625rem 0.1875rem rgba(0,24,98,.13))!important}.drop-shadow-4,.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}*{box-sizing:border-box}p-dropdown-menu-container{--tw-bg-opacity:1;--tw-drop-shadow:drop-shadow(0px 0.3125rem 1rem rgba(0,24,98,.08)) drop-shadow(0px 0.0625rem 0.1875rem rgba(0,24,98,.13));background-color:rgb(255 255 255/var(--tw-bg-opacity));border-radius:.75rem;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);width:auto;z-index:10}p-dropdown-menu-container .content{display:flex;flex-direction:column;gap:1px;padding:.5rem;width:100%}p-dropdown-menu-container.full-width{width:100%}p-dropdown-menu-container.no-overflow{overflow-x:hidden;overflow-y:auto}p-dropdown-menu-container.max-width{max-width:222px}p-dropdown-menu-container.scrollable{max-height:11.5rem;scrollbar-width:none}p-dropdown-menu-container.scrollable::-webkit-scrollbar{display:none}p-dropdown-menu-container.scrollable .content{height:100%}p-dropdown-menu-container.scrollable.scrollable-large{max-height:13.875rem}p-dropdown-menu-container.scrollable.scrollable-xlarge{max-height:20rem}.static{position:static!important}";
+const dropdownMenuContainerComponentCss = "*{box-sizing:border-box}.static{position:static!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}.w-auto{width:auto!important}.w-full{width:100%!important}.max-w-\\[13\\.875rem\\]{max-width:13.875rem!important}.flex-col{flex-direction:column!important}.gap-\\[1px\\]{gap:1px!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}.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;filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}";
+const dropdownMenuContainer = cva([
+  'p-dropdown-menu-container',
+  'w-auto p-1',
+  'bg-white rounded-lg z-10 drop-shadow-2',
+  'border border-black-teal-100',
+], {
+  variants: {
+    fullWidth: {
+      false: null,
+      true: 'w-full',
+    },
+    allowOverflow: {
+      false: 'overflow-y-auto overflow-x-hidden',
+      true: null,
+    },
+    scrollable: {
+      none: null,
+      default: 'max-h-[11.5rem]',
+      large: 'max-h-[13.875rem]',
+      xlarge: 'max-h-[20rem]',
+    },
+    maxWidth: {
+      false: null,
+      true: 'max-w-[13.875rem]',
+    },
+  },
+});
 const DropdownMenuContainer = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.maxWidth = true;
+    this.class = undefined;
     this.fullWidth = true;
     this.allowOverflow = false;
     this.scrollable = false;
   }
   render() {
-    return (h(Host, { class: `p-dropdown-menu-container ${this.maxWidth && 'max-width'} ${this.fullWidth && 'full-width'} ${!this.allowOverflow && 'no-overflow'} ${!!this.scrollable && 'scrollable'} ${this.scrollable === 'large' ? 'scrollable-large' : ''} ${this.scrollable === 'xlarge' ? 'scrollable-xlarge' : ''}` }, h("div", { class: "content" }, h("slot", null))));
+    const scrollable = this.scrollable === false
+      ? 'none'
+      : this.scrollable === true
+        ? 'default'
+        : this.scrollable;
+    return (h(Host, { class: dropdownMenuContainer({
+        class: this.class,
+        fullWidth: this.fullWidth,
+        allowOverflow: this.allowOverflow,
+        scrollable,
+        maxWidth: this.maxWidth,
+      }) }, h("div", { class: 'flex w-full flex-col gap-[1px]' }, h("slot", null))));
   }
 };
 DropdownMenuContainer.style = dropdownMenuContainerComponentCss;

package/dist/esm/p-dropdown-menu-container.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"p-dropdown-menu-container.entry.js","mappings":";;AAAA,MAAM,iCAAiC,GAAG,~~66DAA66D~~;;~~MCO18D~~,qBAAqB~~;;;oBAIL~~,~~IAAI~~;~~qBAKH~~,~~IAAI~~;~~yBAKA~~,~~KAAK~~;~~sBAKyB~~,~~KAAK;;EAEpE~~,~~MAAM~~;~~IACL~~,~~QACC~~,~~EAAC~~,~~IAAI~~,~~IACJ~~,KAAK,EAAE,~~6BACN~~,IAAI,~~CAAC~~,QAAQ,~~IAAI~~,~~WAClB~~,IAAI,IAAI,~~CAAC~~,~~SAAS~~,IAAI,~~YAAY~~,IAAI,~~CAAC~~,IAAI,CAAC,~~aAAa~~,IAAI,~~aAAa~~,~~IACzE~~,~~CAAC~~,~~CAAC~~,IAAI,CAAC,UAAU,IAAI,~~YACtB~~,IAAI,IAAI,CAAC,UAAU,KAAK,~~OAAO~~,~~GAAG~~,~~kBAAkB~~,~~GAAG~~,EAAE,IAAI,IAAI,CAAC,~~UAAU~~,~~KAAK~~,~~QAAQ~~,~~GAAG~~,~~mBAAmB~~,~~GAAG~~,~~EAAE~~,EAAE,~~IAEtH~~,WAAK,KAAK,EAAC,~~SAAS~~,~~IACnB~~,eAAQ,CACH,CACA,EACN;GACF;;;;;;","names":[],"sources":["src/components/atoms/dropdown-menu-container/dropdown-menu-container.component.scss?tag=p-dropdown-menu-container","src/components/atoms/dropdown-menu-container/dropdown-menu-container.component.tsx"],"sourcesContent":["@import '~~../../../style~~/~~mixins~~';\n\np-dropdown-menu-container {\n\t~~@apply~~ w-auto;\n\t~~@apply~~ rounded-~~xxlarge~~ ~~bg-white;\n\t@apply~~ z-10 drop-shadow-4 ~~filter;\~~n\n\t~~.content~~ {\n\t\~~t@apply~~ ~~w-full p-2;\~~n\t\t~~@apply~~ ~~flex flex-col gap-[1px];\~~n\t}\n\n\t~~&.full-width {~~\n\t\~~t@apply~~ w-full;\n\t}\n\n\t~~&.no-overflow~~ {\n\t\t~~@apply~~ overflow-y-auto overflow-x-hidden;\n\t}\n\n\~~t&.max-width~~ {\n\t\t~~@apply max-w-[222px];\n~~\t}\n\n\t~~&.scrollable~~ {\n\t\t~~@apply~~ max-h-[11.5rem];\n\n\t\~~tscrollbar-width~~: ~~none;\~~n\t\t~~&::-webkit-scrollbar {~~\n\t\~~t\t@apply~~ ~~hidden;\~~n\t\t}\n\n\t\~~t.content~~ {\n\t\t\t~~@apply~~ ~~h-full;\~~n\t\t}\~~n\n\~~t\~~t&.scrollable-large~~ ~~{\n\t\t\t@apply~~ max-h-[13.875rem];\n\t\t}\~~n\n\~~t~~\t&.scrollable-xlarge {\~~n\t\t~~\t@apply max-h-[20rem];\n\t\t~~}\n\t}\n~~}\n","import { Component, h, Host, Prop } from '@stencil/core'~~;\n\n@Component({\n\ttag: 'p-dropdown-menu-container',\n\tstyleUrl: 'dropdown-menu-container.component.scss',\n~~\t// shadow: true,\n~~})\nexport class DropdownMenuContainer {\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 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\~~treturn~~ (\n\t\t\~~t<Host~~\n\t\t\t\~~tclass={`p-dropdown-menu-container~~ ${\n\t\t\t\t~~\tthis~~.~~maxWidth~~ && ~~'max-width'~~\n\t\t\t\t} ~~${this.fullWidth &&~~ '~~full-width~~'} ~~${!~~this.~~allowOverflow~~ ~~&& 'no-overflow'} $~~{\n\t\t\t\t\~~t!!~~this.~~scrollable && 'scrollable'\~~n\t\t\t\t} ${this.~~scrollable === 'large' ? 'scrollable-large'~~ : ~~''} ${~~this.~~scrollable === 'xlarge' ? 'scrollable-xlarge'~~ : ''}`}\n\t\t\t>\n\t\t\t\t<div class~~=\"content\"~~>\n\t\t\t\t\t<slot />\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"version":3}
1	+ {"file":"p-dropdown-menu-container.entry.js","mappings":";;;;AAAA,MAAM,iCAAiC,GAAG,4sCAA4sC;;ACGtvC,MAAM,qBAAqB,GAAG,GAAG,CAChC;EACC,2BAA2B;EAC3B,YAAY;EACZ,wCAAwC;EACxC,8BAA8B;CAC9B,EACD;EACC,QAAQ,EAAE;IACT,SAAS,EAAE;MACV,KAAK,EAAE,IAAI;MACX,IAAI,EAAE,QAAQ;KACd;IACD,aAAa,EAAE;MACd,KAAK,EAAE,mCAAmC;MAC1C,IAAI,EAAE,IAAI;KACV;IACD,UAAU,EAAE;MACX,IAAI,EAAE,IAAI;MACV,OAAO,EAAE,iBAAiB;MAC1B,KAAK,EAAE,mBAAmB;MAC1B,MAAM,EAAE,eAAe;KACvB;IACD,QAAQ,EAAE;MACT,KAAK,EAAE,IAAI;MACX,IAAI,EAAE,mBAAmB;KACzB;GACD;CACD,CACD,CAAC;MAMW,qBAAqB;;;oBAIL,IAAI;;qBAUH,IAAI;yBAKA,KAAK;sBAKyB,KAAK;;EAEpE,MAAM;IACL,MAAM,UAAU,GACf,IAAI,CAAC,UAAU,KAAK,KAAK;QACtB,MAAM;QACN,IAAI,CAAC,UAAU,KAAK,IAAI;UACxB,SAAS;UACT,IAAI,CAAC,UAAU,CAAC;IAEpB,QACC,EAAC,IAAI,IACJ,KAAK,EAAE,qBAAqB,CAAC;QAC5B,KAAK,EAAE,IAAI,CAAC,KAAK;QACjB,SAAS,EAAE,IAAI,CAAC,SAAS;QACzB,aAAa,EAAE,IAAI,CAAC,aAAa;QACjC,UAAU;QACV,QAAQ,EAAE,IAAI,CAAC,QAAQ;OACvB,CAAC,IAEF,WAAK,KAAK,EAAC,gCAAgC,IAC1C,eAAQ,CACH,CACA,EACN;GACF;;;;;;","names":[],"sources":["src/components/atoms/dropdown-menu-container/dropdown-menu-container.component.scss?tag=p-dropdown-menu-container","src/components/atoms/dropdown-menu-container/dropdown-menu-container.component.tsx"],"sourcesContent":["","import { Component, h, Host, Prop } from '@stencil/core';\nimport { cva } from 'class-variance-authority';\n\nconst dropdownMenuContainer = cva(\n\t[\n\t\t'p-dropdown-menu-container',\n\t\t'w-auto p-1',\n\t\t'bg-white rounded-lg z-10 drop-shadow-2',\n\t\t'border border-black-teal-100',\n\t],\n\t{\n\t\tvariants: {\n\t\t\tfullWidth: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: 'w-full',\n\t\t\t},\n\t\t\tallowOverflow: {\n\t\t\t\tfalse: 'overflow-y-auto overflow-x-hidden',\n\t\t\t\ttrue: null,\n\t\t\t},\n\t\t\tscrollable: {\n\t\t\t\tnone: null,\n\t\t\t\tdefault: 'max-h-[11.5rem]',\n\t\t\t\tlarge: 'max-h-[13.875rem]',\n\t\t\t\txlarge: 'max-h-[20rem]',\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}\n);\n\n@Component({\n\ttag: 'p-dropdown-menu-container',\n\tstyleUrl: 'dropdown-menu-container.component.scss',\n})\nexport class DropdownMenuContainer {\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<Host\n\t\t\t\tclass={dropdownMenuContainer({\n\t\t\t\t\tclass: this.class,\n\t\t\t\t\tfullWidth: this.fullWidth,\n\t\t\t\t\tallowOverflow: this.allowOverflow,\n\t\t\t\t\tscrollable,\n\t\t\t\t\tmaxWidth: this.maxWidth,\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t<div class='flex w-full flex-col gap-[1px]'>\n\t\t\t\t\t<slot />\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"version":3}

package/dist/esm/p-dropdown_2.entry.js CHANGED Viewed

@@ -1,9 +1,19 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-7b917f6b.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-f99096d4.js';
 import { a as autoUpdate, c as computePosition, o as offset, f as flip, s as shift } from './floating-ui.dom.esm-314a52b2.js';
+import { c as cva } from './index-10317a74.js';
 import { c as childOf } from './child-of-fec6ab3a.js';
+import './clsx-297c1ffe.js';
-const dropdownComponentCss = ".fixed{position:fixed!important}.absolute{position:absolute!important}.relative{position:relative!important}.left-0{left:0!important}.top-0{top:0!important}.z-dropdown{z-index:200!important}.block{display:block!important}.flex{display:flex!important}.hidden{display:none!important}.h-auto{height:auto!important}*{box-sizing:border-box}:host{display:block;position:relative}:host .trigger{display:block;height:auto;position:relative;width:auto}:host p-dropdown-menu-container{display:none;left:0;top:0;z-index:200}:host p-dropdown-menu-container[data-show]{display:flex}:host p-dropdown-menu-container[data-strategy=absolute]{position:absolute}:host p-dropdown-menu-container[data-strategy=fixed]{position:fixed}.visible{visibility:visible!important}.static{position:static!important}";
+const dropdownComponentCss = ".flex{display:flex!important}.hidden{display:none!important}*{box-sizing:border-box}p-dropdown p-dropdown-menu-container{display:none}p-dropdown p-dropdown-menu-container[data-show]{display:flex}.visible{visibility:visible!important}.static{position:static!important}.fixed{position:fixed!important}.absolute{position:absolute!important}.relative{position:relative!important}.z-dropdown{z-index:200!important}.w-inherit{width:inherit!important}";
+const dropdownContainer = cva(['z-dropdown'], {
+  variants: {
+    strategy: {
+      absolute: 'absolute',
+      fixed: 'fixed',
+    },
+  },
+});
 const Dropdown = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
@@ -27,6 +37,9 @@ const Dropdown = class {
   componentShouldUpdate() {
     this._update();
   }
+  componentDidLoad() {
+    this._checkButton();
+  }
   disconnectedCallback() {
     if (this._cleanup) {
       this._cleanup();
@@ -34,23 +47,24 @@ const Dropdown = class {
     }
   }
   render() {
-    return (h(Host, { class: "p-dropdown" }, h("div", { class: "trigger", ref: (ref) => (this._trigger = ref), onClick: () => this._triggerClickHandler() }, h("slot", { onSlotchange: (ev) => this._checkButton(ev), name: "trigger" })), h("p-dropdown-menu-container", { role: "popover", maxWidth: !this.calculateWidth && this.applyMaxWidth, fullWidth: this.applyFullWidth && !this.applyMaxWidth, allowOverflow: this.allowOverflow, ref: (el) => this._load(el), "data-placement": this.placement, "data-strategy": this.strategy, onClick: () => this._containerClickHandler(), scrollable: this.scrollable }, h("slot", { name: "items" }))));
+    return (h(Host, { class: 'p-dropdown relative' }, h("div", { class: 'relative w-inherit', ref: ref => (this._trigger = ref), onClick: () => this._triggerClickHandler() }, h("slot", { name: 'trigger' })), h("p-dropdown-menu-container", { class: dropdownContainer({
+        strategy: this.strategy,
+      }), role: 'popover', maxWidth: !this.calculateWidth && this.applyMaxWidth, fullWidth: this.applyFullWidth && !this.applyMaxWidth, allowOverflow: this.allowOverflow, ref: el => this._load(el), "data-placement": this.placement, "data-strategy": this.strategy, onClick: () => this._containerClickHandler(), scrollable: this.scrollable }, h("slot", { name: 'items' }))));
   }
-  _checkButton({ target }) {
+  _checkButton(active = false) {
     if (!this.applyChevron) {
       return;
     }
-    const slot = target;
-    const children = slot.assignedElements();
-    for (let child of children) {
-      if (child.nodeName === 'P-BUTTON') {
-        child.chevronPosition = this.chevronPosition;
-        child.chevron = this.chevronDirection
-          ? this.chevronDirection
-          : this.placement.indexOf('top') >= 0
-            ? 'up'
-            : 'down';
-      }
+    const buttons = this._el.querySelectorAll('p-button');
+    for (let button of buttons) {
+      button.chevronPosition = this.chevronPosition;
+      button.chevron = this.chevronDirection
+        ? this.chevronDirection
+        : this.placement.indexOf('top') >= 0
+          ? 'up'
+          : 'down';
+      button.disabled = this.disableTriggerClick;
+      button.active = active;
     }
   }
   onShowChange(show) {
@@ -64,8 +78,7 @@ const Dropdown = class {
     this._show();
   }
   documentClickHandler({ target }) {
-    if (!this._menu.hasAttribute('data-show') ||
-      childOf(target, this._el)) {
+    if (!this._menu.hasAttribute('data-show') || childOf(target, this._el)) {
       return;
     }
     this._hide();
@@ -109,6 +122,7 @@ const Dropdown = class {
     this._cleanup = autoUpdate(this._el, this._menu, () => this._update());
     this._menu.setAttribute('data-show', '');
     this.isOpen.emit(true);
+    this._checkButton(true);
   }
   _hide() {
     if (!this._loaded || this.show) {
@@ -121,6 +135,7 @@ const Dropdown = class {
     // Hide the popover
     this._menu.removeAttribute('data-show');
     this.isOpen.emit(false);
+    this._checkButton(false);
   }
   _update() {
     if (!this._menu) {
@@ -145,19 +160,70 @@ const Dropdown = class {
 };
 Dropdown.style = dropdownComponentCss;
-const dropdownMenuItemComponentCss = ".block{display:block!important}.flex{display:flex!important}.h-4{height:1rem!important}.h-6{height:1.5rem!important}.h-8{height:2rem!important}.w-4{width:1rem!important}.w-6{width:1.5rem!important}.w-\\[2\\.375rem\\]{width:2.375rem!important}.w-full{width:100%!important}.translate-x-0{--tw-translate-x:0px!important}.translate-x-0,.translate-x-3{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.translate-x-3{--tw-translate-x:0.75rem!important}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.appearance-none{appearance:none!important}.items-center{align-items:center!important}.justify-start{justify-content:flex-start!important}.gap-2{gap:.5rem!important}.overflow-hidden{overflow:hidden!important}.text-ellipsis{text-overflow:ellipsis!important}.whitespace-nowrap{white-space:nowrap!important}.rounded{border-radius:.25rem!important}.border{border-width:1px!important}.border-solid{border-style:solid!important}.border-indigo{--tw-border-opacity:1!important;border-color:rgb(82 138 250/var(--tw-border-opacity))!important}.border-negative{--tw-border-opacity:1!important;border-color:rgb(185 30 40/var(--tw-border-opacity))!important}.bg-indigo-light{--tw-bg-opacity:1!important;background-color:rgb(241 246 255/var(--tw-bg-opacity))!important}.bg-mystic-dark{background-color:rgb(218 230 240/var(--tw-bg-opacity))!important}.bg-mystic-dark,.bg-white{--tw-bg-opacity:1!important}.bg-white{background-color:rgb(255 255 255/var(--tw-bg-opacity))!important}.bg-center{background-position:50%!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.font-semibold{font-weight:600!important}.outline-none{outline:2px solid transparent!important;outline-offset:2px!important}.transition-transform{transition-duration:.15s!important;transition-property:transform!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important}*{box-sizing:border-box}:host{--tw-text-opacity:1;align-items:center;border-radius:.25rem;color:rgb(81 83 107/var(--tw-text-opacity));cursor:pointer;display:flex;font-size:.875rem;font-weight:600;gap:.5rem;height:2rem;justify-content:flex-start;line-height:1.25rem;padding-left:.5rem;padding-right:.5rem;width:100%}:host input[type=checkbox].p-input{--tw-bg-opacity:1;--tw-border-opacity:1;appearance:none;background-color:rgb(255 255 255/var(--tw-bg-opacity));background-position:50%;background-repeat:no-repeat;background-size:1rem;border-color:rgb(218 230 240/var(--tw-border-opacity));border-radius:.25rem;border-style:solid;border-width:1px;height:1.5rem;outline:2px solid transparent!important;outline-offset:2px!important;width:1.5rem}:host input[type=checkbox].p-input+label{margin-left:.2rem;margin-top:.05rem}:host input[type=checkbox].p-input:hover:not(:disabled):not([disabled]):not(.disabled){cursor:pointer}:host input[type=checkbox].p-input:hover:not(:disabled):not([disabled]):not(.disabled):not(:checked):not([checked]):not(.checked):not(:indeterminate):not([indeterminate]):not(.indeterminate){--tw-border-opacity:1;background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='1em' height='1em' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.965 11.487 13.53 1.53c.435-.572 1.22-.7 1.8-.292l.108.077c.294.206.492.53.546.895.054.365-.04.737-.26 1.026L7.26 14.38a1.34 1.34 0 0 1-.642.463 1.302 1.302 0 0 1-1.575-.263L.362 9.6a1.356 1.356 0 0 1-.36-.99c.017-.37.181-.713.452-.95l.1-.088a1.302 1.302 0 0 1 1.82.093l3.592 3.82h-.001Z' fill='%23dae6f0' fill-rule='evenodd'/%3E%3C/svg%3E\");border-color:rgb(82 138 250/var(--tw-border-opacity))}:host input[type=checkbox].p-input.checked,:host input[type=checkbox].p-input.indeterminate,:host input[type=checkbox].p-input:checked,:host input[type=checkbox].p-input:indeterminate,:host input[type=checkbox].p-input[checked],:host input[type=checkbox].p-input[indeterminate]{--tw-border-opacity:1;--tw-bg-opacity:1;background-color:rgb(82 138 250/var(--tw-bg-opacity));border-color:rgb(82 138 250/var(--tw-border-opacity))}:host input[type=checkbox].p-input.checked,:host input[type=checkbox].p-input:checked,:host input[type=checkbox].p-input[checked]{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='1em' height='1em' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.965 11.487 13.53 1.53c.435-.572 1.22-.7 1.8-.292l.108.077c.294.206.492.53.546.895.054.365-.04.737-.26 1.026L7.26 14.38a1.34 1.34 0 0 1-.642.463 1.302 1.302 0 0 1-1.575-.263L.362 9.6a1.356 1.356 0 0 1-.36-.99c.017-.37.181-.713.452-.95l.1-.088a1.302 1.302 0 0 1 1.82.093l3.592 3.82h-.001Z' fill='%23fff' fill-rule='evenodd'/%3E%3C/svg%3E\")}:host input[type=checkbox].p-input.indeterminate,:host input[type=checkbox].p-input:indeterminate,:host input[type=checkbox].p-input[indeterminate]{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='1em' height='1em' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 7h8a1 1 0 0 1 0 2H4a1 1 0 1 1 0-2Z' fill='%23fff' fill-rule='evenodd'/%3E%3C/svg%3E\")}:host input[type=checkbox].p-input.disabled,:host input[type=checkbox].p-input:disabled,:host input[type=checkbox].p-input[disabled]{opacity:.4}:host input[type=checkbox].p-input.error,:host input[type=checkbox].p-input[error]{--tw-text-opacity:1;--tw-border-opacity:1!important;border-color:rgb(185 30 40/var(--tw-border-opacity))!important;color:rgb(138 15 29/var(--tw-text-opacity))}:host input[type=checkbox].p-input.error::-moz-placeholder,:host input[type=checkbox].p-input[error]::-moz-placeholder{--tw-text-opacity:1;color:rgb(255 204 211/var(--tw-text-opacity))}:host input[type=checkbox].p-input.error::placeholder,:host input[type=checkbox].p-input[error]::placeholder{--tw-text-opacity:1;color:rgb(255 204 211/var(--tw-text-opacity))}:host input[type=checkbox].p-input.error.checked,:host input[type=checkbox].p-input.error:checked,:host input[type=checkbox].p-input.error[checked],:host input[type=checkbox].p-input[error].checked,:host input[type=checkbox].p-input[error]:checked,:host input[type=checkbox].p-input[error][checked]{--tw-bg-opacity:1;background-color:rgb(185 30 40/var(--tw-bg-opacity))}:host input[type=checkbox].p-input.size-small{height:1rem;width:1rem}:host input[type=checkbox].p-input.size-small:hover:not(:disabled):not([disabled]):not(.disabled):not(:checked):not([checked]):not(.checked):not(:indeterminate):not([indeterminate]):not(.indeterminate){background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath d='M2.667 2.667h10.667v10.667H2.667z'/%3E%3Cpath fill='%23DAE6F0' d='m6.644 10.325 5.044-6.638a.87.87 0 0 1 1.2-.194l.072.05a.91.91 0 0 1 .19 1.28l-5.644 7.43a.89.89 0 0 1-.427.31.868.868 0 0 1-1.05-.176l-3.12-3.32a.904.904 0 0 1-.241-.66.897.897 0 0 1 .302-.633l.067-.058a.868.868 0 0 1 1.213.062l2.394 2.547Z'/%3E%3C/g%3E%3C/svg%3E\")}:host input[type=checkbox].p-input.size-small.checked,:host input[type=checkbox].p-input.size-small:checked,:host input[type=checkbox].p-input.size-small[checked]{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath d='M2.667 2.667h10.667v10.667H2.667z'/%3E%3Cpath fill='%23FFF' d='m6.644 10.325 5.044-6.638a.87.87 0 0 1 1.2-.194l.072.05a.91.91 0 0 1 .19 1.28l-5.644 7.43a.89.89 0 0 1-.427.31.868.868 0 0 1-1.05-.176l-3.12-3.32a.904.904 0 0 1-.241-.66.897.897 0 0 1 .302-.633l.067-.058a.868.868 0 0 1 1.213.062l2.394 2.547Z'/%3E%3C/g%3E%3C/svg%3E\")}:host input[type=checkbox].p-toggle{--tw-bg-opacity:1;--tw-border-opacity:1;align-items:center;appearance:none;background-color:rgb(255 255 255/var(--tw-bg-opacity));border-color:rgb(218 230 240/var(--tw-border-opacity));border-radius:1.5625rem;border-style:solid;border-width:1px;display:flex;height:1.5rem;justify-content:flex-start;padding:.25rem;width:2.375rem}:host input[type=checkbox].p-toggle:after{--tw-translate-x:0px;--tw-bg-opacity:1;background-color:rgb(218 230 240/var(--tw-bg-opacity));border-radius:100%;content:\"\";display:block;height:1rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transition-duration:.1s;transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);width:1rem}:host input[type=checkbox].p-toggle.checked,:host input[type=checkbox].p-toggle:checked,:host input[type=checkbox].p-toggle[checked]{--tw-border-opacity:1;--tw-bg-opacity:1;background-color:rgb(82 138 250/var(--tw-bg-opacity));border-color:rgb(82 138 250/var(--tw-border-opacity))}:host input[type=checkbox].p-toggle.checked:after,:host input[type=checkbox].p-toggle:checked:after,:host input[type=checkbox].p-toggle[checked]:after{--tw-translate-x:0.75rem;--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity));transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}:host input[type=checkbox].p-toggle.disabled,:host input[type=checkbox].p-toggle:disabled,:host input[type=checkbox].p-toggle[disabled]{opacity:.4}:host input[type=checkbox].p-toggle:hover:not(:disabled):not([disabled]):not(.disabled){cursor:pointer}:host input[type=checkbox].p-toggle:hover:not(:disabled):not([disabled]):not(.disabled):not(:checked):not([checked]):not(.checked){--tw-border-opacity:1;border-color:rgb(82 138 250/var(--tw-border-opacity))}:host input[type=checkbox].p-toggle.error,:host input[type=checkbox].p-toggle[error]{--tw-text-opacity:1;--tw-border-opacity:1!important;border-color:rgb(185 30 40/var(--tw-border-opacity))!important;color:rgb(138 15 29/var(--tw-text-opacity))}:host input[type=checkbox].p-toggle.error::-moz-placeholder,:host input[type=checkbox].p-toggle[error]::-moz-placeholder{--tw-text-opacity:1;color:rgb(255 204 211/var(--tw-text-opacity))}:host input[type=checkbox].p-toggle.error::placeholder,:host input[type=checkbox].p-toggle[error]::placeholder{--tw-text-opacity:1;color:rgb(255 204 211/var(--tw-text-opacity))}:host input[type=checkbox].p-toggle.error.checked,:host input[type=checkbox].p-toggle.error:checked,:host input[type=checkbox].p-toggle.error[checked],:host input[type=checkbox].p-toggle[error].checked,:host input[type=checkbox].p-toggle[error]:checked,:host input[type=checkbox].p-toggle[error][checked]{--tw-bg-opacity:1;background-color:rgb(185 30 40/var(--tw-bg-opacity))}:host .text-container{display:block;overflow:hidden;text-align:start;text-overflow:ellipsis;white-space:nowrap;width:100%}:host(.hover:hover){--tw-bg-opacity:1;--tw-text-opacity:1;background-color:rgb(241 246 255/var(--tw-bg-opacity));color:rgb(81 83 107/var(--tw-text-opacity))}:host(.active){--tw-bg-opacity:1;--tw-text-opacity:1;background-color:rgb(241 246 255/var(--tw-bg-opacity));color:rgb(82 138 250/var(--tw-text-opacity))}.static{position:static!important}.flex-shrink-0{flex-shrink:0!important}";
+const dropdownMenuItemComponentCss = "*{box-sizing:border-box}.static{position:static!important}.block{display:block!important}.flex{display:flex!important}.h-8{height:2rem!important}.w-full{width:100%!important}.max-w-full{max-width:100%!important}.flex-shrink-0{flex-shrink: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}.whitespace-nowrap{white-space:nowrap!important}.rounded-lg{border-radius:.5rem!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-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}.hover\\:bg-supportive-lilac-50:hover{--tw-bg-opacity:1!important;background-color:rgb(250 247 255/var(--tw-bg-opacity,1))!important}";
+const dropdownMenuItem = cva([
+  'p-dropdown-menu-item flex px-2 py-1 gap-2 text-sm font-medium group rounded-lg items-center h-8 max-w-full',
+], {
+  variants: {
+    active: {
+      false: null,
+      true: 'bg-supportive-lilac-100',
+    },
+    disabled: {
+      false: null,
+      true: 'bg-supportive-lilac-100 text-black-teal-200 cursor-not-allowed',
+    },
+    enableHover: {
+      false: null,
+      true: null,
+    },
+  },
+  compoundVariants: [
+    {
+      active: false,
+      enableHover: true,
+      disabled: false,
+      class: 'hover:bg-supportive-lilac-50',
+    },
+    {
+      enableHover: true,
+      disabled: false,
+      class: 'cursor-pointer',
+    },
+  ],
+});
+const dropdownMenuItemIcon = cva(['text-base'], {
+  variants: {
+    active: {
+      false: 'text-black-teal-300',
+      true: false,
+    },
+    disabled: {
+      false: false,
+      true: 'text-black-teal-100',
+    },
+  },
+});
 const DropdownMenuItem = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.active = false;
     this.variant = 'default';
     this.enableHover = true;
+    this.disabled = false;
     this.icon = undefined;
     this.useContainer = true;
   }
   render() {
-    return (h(Host, { class: `p-dropdown-menu-item ${this.active && 'active'} ${this.enableHover && 'hover'}` }, this.icon && h("p-icon", { variant: this.icon }), this.variant === 'checkbox' && (h("input", { type: 'checkbox', class: 'p-input size-small flex-shrink-0', checked: this.active })), this.useContainer ? (h("div", { class: 'text-container' }, h("slot", null))) : (h("slot", null))));
+    return (h(Host, { class: dropdownMenuItem({
+        active: this.active,
+        enableHover: this.enableHover,
+        disabled: this.disabled,
+      }) }, this.icon && (h("p-icon", { class: dropdownMenuItemIcon({
+        active: this.active,
+        disabled: this.disabled,
+      }), variant: this.icon })), this.variant === 'checkbox' && (h("input", { type: 'checkbox', class: 'p-input size-small flex-shrink-0', checked: this.active })), this.useContainer ? (h("div", { class: 'block w-full overflow-hidden text-ellipsis whitespace-nowrap text-start' }, h("slot", null))) : (h("slot", null))));
   }
 };
 DropdownMenuItem.style = dropdownMenuItemComponentCss;

package/dist/esm/p-dropdown_2.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"p-dropdown.p-dropdown-menu-item.entry.js","mappings":"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","names":[],"sources":["src/components/molecules/dropdown/dropdown.component.scss?tag=p-dropdown&encapsulation=shadow","src/components/molecules/dropdown/dropdown.component.tsx","src/components/atoms/dropdown-menu-item/dropdown-menu-item.component.scss?tag=p-dropdown-menu-item&encapsulation=shadow","src/components/atoms/dropdown-menu-item/dropdown-menu-item.component.tsx"],"sourcesContent":[":host {\n\t@apply relative block;\n\n\t.trigger {\n\t\t@apply relative block h-auto w-auto;\n\t}\n\n\tp-dropdown-menu-container {\n\t\t@apply left-0 top-0 z-dropdown hidden;\n\n\t\t&[data-show] {\n\t\t\t@apply flex;\n\t\t}\n\n\t\t&[data-strategy='absolute'] {\n\t\t\t@apply absolute;\n\t\t}\n\n\t\t&[data-strategy='fixed'] {\n\t\t\t@apply fixed;\n\t\t}\n\t}\n}\n","import {\n\tautoUpdate,\n\tcomputePosition,\n\tflip,\n\toffset,\n\tPlacement,\n\tshift,\n\tStrategy,\n} from '@floating-ui/dom';\nimport {\n\tComponent,\n\tElement,\n\tEvent,\n\tEventEmitter,\n\th,\n\tHost,\n\tListen,\n\tProp,\n\tWatch,\n} from '@stencil/core';\nimport { childOf } from '../../../utils/child-of';\n\n@Component({\n\ttag: 'p-dropdown',\n\tstyleUrl: 'dropdown.component.scss',\n\tshadow: true,\n})\nexport class Dropdown {\n\t/*\n\t The content of the dropdown menu\n\t /\n\t@Prop({ reflect: true }) placement: Placement = 'bottom-start';\n\n\t/\n\t The offset of the dropdown menu\n\t /\n\t@Prop() offset: number = 8;\n\n\t/\n\t The strategy of the dropdown placement\n\t /\n\t@Prop() strategy: Strategy = 'absolute';\n\n\t/\n\t Wether to show the dropdown menu\n\t /\n\t@Prop() show: boolean = false;\n\n\t/\n\t Wether to automatically calculate the width of the menu based on the trigger\n\t /\n\t@Prop() calculateWidth: boolean = false;\n\n\t/\n\t Wether to apply the max width\n\t /\n\t@Prop() applyMaxWidth: boolean = true;\n\n\t/\n\t Wether to apply the full width\n\t /\n\t@Prop() applyFullWidth: boolean = true;\n\n\t/\n\t Wether to allow overflow in the container\n\t /\n\t@Prop() allowOverflow: boolean = false;\n\n\t/\n\t Wether the dropdown container should be scrollable when the threshold is met.\n\t /\n\t@Prop() scrollable: boolean \| 'default' \| 'large' = false;\n\n\t/\n\t Wether to automatically close the dropdown menu after clicking inside\n\t /\n\t@Prop() insideClick: boolean = false;\n\n\t/\n\t Wether to automatically close the dropdown menu after clicking inside\n\t /\n\t@Prop() disableTriggerClick: boolean = false;\n\n\t/\n\t Wether to apply chevron automatically\n\t /\n\t@Prop() applyChevron: boolean = true;\n\n\t/\n\t Chevron position\n\t /\n\t@Prop() chevronPosition: 'start' \| 'end' = 'end';\n\n\t/\n\t Chevron direction\n\t /\n\t@Prop() chevronDirection: 'up' \| 'down';\n\n\t/\n\t The host element\n\t /\n\t@Element() private _el: HTMLElement;\n\n\t/\n\t Open change event\n\t /\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tisOpen: EventEmitter<boolean>;\n\n\tprivate _loaded = false;\n\tprivate _trigger: HTMLElement;\n\tprivate _menu: HTMLElement;\n\tprivate _cleanup: () => void;\n\n\tcomponentShouldUpdate() {\n\t\tthis._update();\n\t}\n\n\tdisconnectedCallback() {\n\t\tif (this._cleanup) {\n\t\t\tthis._cleanup();\n\t\t\tthis._cleanup = null;\n\t\t}\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class=\"p-dropdown\">\n\t\t\t\t<div\n\t\t\t\t\tclass=\"trigger\"\n\t\t\t\t\tref={(ref) => (this._trigger = ref)}\n\t\t\t\t\tonClick={() => this._triggerClickHandler()}\n\t\t\t\t>\n\t\t\t\t\t<slot\n\t\t\t\t\t\tonSlotchange={(ev) => this._checkButton(ev)}\n\t\t\t\t\t\tname=\"trigger\"\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<p-dropdown-menu-container\n\t\t\t\t\trole=\"popover\"\n\t\t\t\t\tmaxWidth={!this.calculateWidth && this.applyMaxWidth}\n\t\t\t\t\tfullWidth={this.applyFullWidth && !this.applyMaxWidth}\n\t\t\t\t\tallowOverflow={this.allowOverflow}\n\t\t\t\t\tref={(el) => this._load(el)}\n\t\t\t\t\tdata-placement={this.placement}\n\t\t\t\t\tdata-strategy={this.strategy}\n\t\t\t\t\tonClick={() => this._containerClickHandler()}\n\t\t\t\t\tscrollable={this.scrollable}\n\t\t\t\t>\n\t\t\t\t\t<slot name=\"items\" />\n\t\t\t\t</p-dropdown-menu-container>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate _checkButton({ target }: Event) {\n\t\tif (!this.applyChevron) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst slot = target as HTMLSlotElement;\n\t\tconst children = slot.assignedElements();\n\n\t\tfor (let child of children) {\n\t\t\tif (child.nodeName === 'P-BUTTON') {\n\t\t\t\t(child as any).chevronPosition = this.chevronPosition;\n\t\t\t\t(child as any).chevron = this.chevronDirection\n\t\t\t\t\t? this.chevronDirection\n\t\t\t\t\t: this.placement.indexOf('top') >= 0\n\t\t\t\t\t\t? 'up'\n\t\t\t\t\t\t: 'down';\n\t\t\t}\n\t\t}\n\t}\n\n\t@Watch('show')\n\tprotected onShowChange(show) {\n\t\tif (!this._loaded) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (!show) {\n\t\t\tthis._hide();\n\t\t\treturn;\n\t\t}\n\n\t\tthis._show();\n\t}\n\n\t@Listen('click', { target: 'document', capture: true })\n\tprotected documentClickHandler({ target }) {\n\t\tif (\n\t\t\t!this._menu.hasAttribute('data-show') \|\|\n\t\t\tchildOf(target, this._el)\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._hide();\n\t}\n\n\tprivate _containerClickHandler() {\n\t\tif (this.insideClick) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (this._menu.hasAttribute('data-show')) {\n\t\t\tthis._hide();\n\t\t}\n\t}\n\n\tprivate _triggerClickHandler() {\n\t\tif (this.disableTriggerClick) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (this._menu.hasAttribute('data-show')) {\n\t\t\tthis._hide();\n\t\t\treturn;\n\t\t}\n\n\t\tthis._show();\n\t}\n\n\tprivate _load(popover: HTMLElement) {\n\t\tthis._menu = popover;\n\t\tif (popover) {\n\t\t\tthis._update();\n\t\t\tthis._loaded = true;\n\n\t\t\tif (this.show) {\n\t\t\t\tsetTimeout(() => this._show(), 100);\n\t\t\t}\n\t\t}\n\t}\n\n\tprivate _show() {\n\t\tif (!this._loaded) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Make the popover visible\n\t\tif (this.calculateWidth) {\n\t\t\tthis._menu.style.width = `${this._trigger.clientWidth}px`;\n\t\t}\n\n\t\tthis._cleanup = autoUpdate(this._el, this._menu, () => this._update());\n\n\t\tthis._menu.setAttribute('data-show', '');\n\t\tthis.isOpen.emit(true);\n\t}\n\n\tprivate _hide() {\n\t\tif (!this._loaded \|\| this.show) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (this._cleanup) {\n\t\t\tthis._cleanup();\n\t\t\tthis._cleanup = null;\n\t\t}\n\n\t\t// Hide the popover\n\t\tthis._menu.removeAttribute('data-show');\n\t\tthis.isOpen.emit(false);\n\t}\n\n\tprivate _update() {\n\t\tif (!this._menu) {\n\t\t\treturn;\n\t\t}\n\n\t\tcomputePosition(this._el, this._menu, {\n\t\t\tplacement: this.placement,\n\t\t\tstrategy: this.strategy,\n\t\t\tmiddleware: [offset(this.offset), flip(), shift()],\n\t\t}).then(({ x, y, placement }) => {\n\t\t\tthis._menu.dataset.placement = placement;\n\t\t\tObject.assign(this._menu.style, {\n\t\t\t\ttop: `${y}px`,\n\t\t\t\tleft: `${x}px`,\n\t\t\t});\n\t\t});\n\t}\n}\n",":host {\n\t@import '../../../style/form/checkbox';\n\n\t@apply flex h-8 w-full items-center justify-start gap-2 rounded px-2;\n\t@apply text-sm font-semibold text-storm;\n\t@apply cursor-pointer;\n\n\t.text-container {\n\t\t@apply block w-full overflow-hidden text-ellipsis whitespace-nowrap text-start;\n\t}\n}\n\n:host(.hover:hover) {\n\t@apply bg-indigo-light text-storm;\n}\n\n:host(.active) {\n\t@apply bg-indigo-light text-indigo;\n}\n","import { Component, Host, Prop, h } from '@stencil/core';\nimport { IconVariant } from '../icon/icon.component';\n\n@Component({\n\ttag: 'p-dropdown-menu-item',\n\tstyleUrl: 'dropdown-menu-item.component.scss',\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 The variant of the item\n\t /\n\t@Prop() variant: 'default' \| 'checkbox' = '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 Icon of the navigation item\n\t /\n\t@Prop() icon: IconVariant;\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<Host\n\t\t\t\tclass={`p-dropdown-menu-item ${this.active && 'active'} ${\n\t\t\t\t\tthis.enableHover && 'hover'\n\t\t\t\t}`}\n\t\t\t>\n\t\t\t\t{this.icon && <p-icon variant={this.icon} />}\n\n\t\t\t\t{this.variant === 'checkbox' && (\n\t\t\t\t\t<input\n\t\t\t\t\t\ttype='checkbox'\n\t\t\t\t\t\tclass='p-input size-small flex-shrink-0'\n\t\t\t\t\t\tchecked={this.active}\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 class='text-container'>\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</Host>\n\t\t);\n\t}\n}\n"],"version":3}
1	+ {"file":"p-dropdown.p-dropdown-menu-item.entry.js","mappings":"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","names":[],"sources":["src/components/molecules/dropdown/dropdown.component.scss?tag=p-dropdown","src/components/molecules/dropdown/dropdown.component.tsx","src/components/atoms/dropdown-menu-item/dropdown-menu-item.component.scss?tag=p-dropdown-menu-item","src/components/atoms/dropdown-menu-item/dropdown-menu-item.component.tsx"],"sourcesContent":["p-dropdown {\n\tp-dropdown-menu-container {\n\t\t@apply hidden;\n\n\t\t&[data-show] {\n\t\t\t@apply flex;\n\t\t}\n\t}\n}\n","import {\n\tautoUpdate,\n\tcomputePosition,\n\tflip,\n\toffset,\n\tPlacement,\n\tshift,\n\tStrategy,\n} from '@floating-ui/dom';\nimport {\n\tComponent,\n\tElement,\n\tEvent,\n\tEventEmitter,\n\th,\n\tHost,\n\tListen,\n\tProp,\n\tWatch,\n} from '@stencil/core';\nimport { cva } from 'class-variance-authority';\nimport { childOf } from '../../../utils/child-of';\n\nconst dropdownContainer = cva(['z-dropdown'], {\n\tvariants: {\n\t\tstrategy: {\n\t\t\tabsolute: 'absolute',\n\t\t\tfixed: 'fixed',\n\t\t},\n\t},\n});\n\n@Component({\n\ttag: 'p-dropdown',\n\tstyleUrl: 'dropdown.component.scss',\n})\nexport class Dropdown {\n\t/*\n\t The content of the dropdown menu\n\t /\n\t@Prop({ reflect: true }) placement: Placement = 'bottom-start';\n\n\t/\n\t The offset of the dropdown menu\n\t /\n\t@Prop() offset: number = 8;\n\n\t/\n\t The strategy of the dropdown placement\n\t /\n\t@Prop() strategy: Strategy = 'absolute';\n\n\t/\n\t Wether to show the dropdown menu\n\t /\n\t@Prop() show: boolean = false;\n\n\t/\n\t Wether to automatically calculate the width of the menu based on the trigger\n\t /\n\t@Prop() calculateWidth: boolean = false;\n\n\t/\n\t Wether to apply the max width\n\t /\n\t@Prop() applyMaxWidth: boolean = true;\n\n\t/\n\t Wether to apply the full width\n\t /\n\t@Prop() applyFullWidth: boolean = true;\n\n\t/\n\t Wether to allow overflow in the container\n\t /\n\t@Prop() allowOverflow: boolean = false;\n\n\t/\n\t Wether the dropdown container should be scrollable when the threshold is met.\n\t /\n\t@Prop() scrollable: boolean \| 'default' \| 'large' = false;\n\n\t/\n\t Wether to automatically close the dropdown menu after clicking inside\n\t /\n\t@Prop() insideClick: boolean = false;\n\n\t/\n\t Wether to automatically close the dropdown menu after clicking inside\n\t /\n\t@Prop() disableTriggerClick: boolean = false;\n\n\t/\n\t Wether to apply chevron automatically\n\t /\n\t@Prop() applyChevron: boolean = true;\n\n\t/\n\t Chevron position\n\t /\n\t@Prop() chevronPosition: 'start' \| 'end' = 'end';\n\n\t/\n\t Chevron direction\n\t /\n\t@Prop() chevronDirection: 'up' \| 'down';\n\n\t/\n\t The host element\n\t /\n\t@Element() private _el: HTMLElement;\n\n\t/\n\t Open change event\n\t /\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tisOpen: EventEmitter<boolean>;\n\n\tprivate _loaded = false;\n\tprivate _trigger: HTMLElement;\n\tprivate _menu: HTMLElement;\n\tprivate _cleanup: () => void;\n\n\tcomponentShouldUpdate() {\n\t\tthis._update();\n\t}\n\n\tcomponentDidLoad() {\n\t\tthis._checkButton();\n\t}\n\n\tdisconnectedCallback() {\n\t\tif (this._cleanup) {\n\t\t\tthis._cleanup();\n\t\t\tthis._cleanup = null;\n\t\t}\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class='p-dropdown relative'>\n\t\t\t\t<div\n\t\t\t\t\tclass='relative w-inherit'\n\t\t\t\t\tref={ref => (this._trigger = ref)}\n\t\t\t\t\tonClick={() => this._triggerClickHandler()}\n\t\t\t\t>\n\t\t\t\t\t<slot name='trigger' />\n\t\t\t\t</div>\n\t\t\t\t<p-dropdown-menu-container\n\t\t\t\t\tclass={dropdownContainer({\n\t\t\t\t\t\tstrategy: this.strategy,\n\t\t\t\t\t})}\n\t\t\t\t\trole='popover'\n\t\t\t\t\tmaxWidth={!this.calculateWidth && this.applyMaxWidth}\n\t\t\t\t\tfullWidth={this.applyFullWidth && !this.applyMaxWidth}\n\t\t\t\t\tallowOverflow={this.allowOverflow}\n\t\t\t\t\tref={el => this._load(el)}\n\t\t\t\t\tdata-placement={this.placement}\n\t\t\t\t\tdata-strategy={this.strategy}\n\t\t\t\t\tonClick={() => this._containerClickHandler()}\n\t\t\t\t\tscrollable={this.scrollable}\n\t\t\t\t>\n\t\t\t\t\t<slot name='items' />\n\t\t\t\t</p-dropdown-menu-container>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate _checkButton(active: boolean = false) {\n\t\tif (!this.applyChevron) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst buttons = this._el.querySelectorAll<HTMLPButtonElement>('p-button');\n\t\tfor (let button of buttons) {\n\t\t\tbutton.chevronPosition = this.chevronPosition;\n\t\t\tbutton.chevron = this.chevronDirection\n\t\t\t\t? this.chevronDirection\n\t\t\t\t: this.placement.indexOf('top') >= 0\n\t\t\t\t? 'up'\n\t\t\t\t: 'down';\n\t\t\tbutton.disabled = this.disableTriggerClick;\n\t\t\tbutton.active = active;\n\t\t}\n\t}\n\n\t@Watch('show')\n\tprotected onShowChange(show) {\n\t\tif (!this._loaded) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (!show) {\n\t\t\tthis._hide();\n\t\t\treturn;\n\t\t}\n\n\t\tthis._show();\n\t}\n\n\t@Listen('click', { target: 'document', capture: true })\n\tprotected documentClickHandler({ target }) {\n\t\tif (!this._menu.hasAttribute('data-show') \|\| childOf(target, this._el)) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._hide();\n\t}\n\n\tprivate _containerClickHandler() {\n\t\tif (this.insideClick) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (this._menu.hasAttribute('data-show')) {\n\t\t\tthis._hide();\n\t\t}\n\t}\n\n\tprivate _triggerClickHandler() {\n\t\tif (this.disableTriggerClick) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (this._menu.hasAttribute('data-show')) {\n\t\t\tthis._hide();\n\t\t\treturn;\n\t\t}\n\n\t\tthis._show();\n\t}\n\n\tprivate _load(popover: HTMLElement) {\n\t\tthis._menu = popover;\n\t\tif (popover) {\n\t\t\tthis._update();\n\t\t\tthis._loaded = true;\n\n\t\t\tif (this.show) {\n\t\t\t\tsetTimeout(() => this._show(), 100);\n\t\t\t}\n\t\t}\n\t}\n\n\tprivate _show() {\n\t\tif (!this._loaded) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Make the popover visible\n\t\tif (this.calculateWidth) {\n\t\t\tthis._menu.style.width = `${this._trigger.clientWidth}px`;\n\t\t}\n\n\t\tthis._cleanup = autoUpdate(this._el, this._menu, () => this._update());\n\n\t\tthis._menu.setAttribute('data-show', '');\n\t\tthis.isOpen.emit(true);\n\t\tthis._checkButton(true);\n\t}\n\n\tprivate _hide() {\n\t\tif (!this._loaded \|\| this.show) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (this._cleanup) {\n\t\t\tthis._cleanup();\n\t\t\tthis._cleanup = null;\n\t\t}\n\n\t\t// Hide the popover\n\t\tthis._menu.removeAttribute('data-show');\n\t\tthis.isOpen.emit(false);\n\t\tthis._checkButton(false);\n\t}\n\n\tprivate _update() {\n\t\tif (!this._menu) {\n\t\t\treturn;\n\t\t}\n\n\t\tcomputePosition(this._el, this._menu, {\n\t\t\tplacement: this.placement,\n\t\t\tstrategy: this.strategy,\n\t\t\tmiddleware: [offset(this.offset), flip(), shift()],\n\t\t}).then(({ x, y, placement }) => {\n\t\t\tthis._menu.dataset.placement = placement;\n\t\t\tObject.assign(this._menu.style, {\n\t\t\t\ttop: `${y}px`,\n\t\t\t\tleft: `${x}px`,\n\t\t\t});\n\t\t});\n\t}\n}\n","","import { Component, Host, Prop, h } from '@stencil/core';\nimport { IconVariant } from '../icon/icon.component';\nimport { cva } from 'class-variance-authority';\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 h-8 max-w-full',\n\t],\n\t{\n\t\tvariants: {\n\t\t\tactive: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: 'bg-supportive-lilac-100',\n\t\t\t},\n\t\t\tdisabled: {\n\t\t\t\tfalse: null,\n\t\t\t\ttrue: 'bg-supportive-lilac-100 text-black-teal-200 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},\n\t\tcompoundVariants: [\n\t\t\t{\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\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\tactive: {\n\t\t\tfalse: 'text-black-teal-300',\n\t\t\ttrue: false,\n\t\t},\n\t\tdisabled: {\n\t\t\tfalse: false,\n\t\t\ttrue: 'text-black-teal-100',\n\t\t},\n\t},\n});\n\n@Component({\n\ttag: 'p-dropdown-menu-item',\n\tstyleUrl: 'dropdown-menu-item.component.scss',\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 The variant of the item\n\t /\n\t@Prop() variant: 'default' \| 'checkbox' = '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 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 use the container for text\n\t /\n\t@Prop() useContainer = true;\n\n\trender() {\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={dropdownMenuItem({\n\t\t\t\t\tactive: this.active,\n\t\t\t\t\tenableHover: this.enableHover,\n\t\t\t\t\tdisabled: this.disabled,\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t{/ class={`p-dropdown-menu-item ${this.active && 'active'} ${ /}\n\t\t\t\t{/ \tthis.enableHover && 'hover' /}\n\t\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\tactive: this.active,\n\t\t\t\t\t\t\tdisabled: this.disabled,\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.variant === 'checkbox' && (\n\t\t\t\t\t<input\n\t\t\t\t\t\ttype='checkbox'\n\t\t\t\t\t\tclass='p-input size-small flex-shrink-0'\n\t\t\t\t\t\tchecked={this.active}\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 class='block w-full overflow-hidden text-ellipsis whitespace-nowrap text-start'>\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</Host>\n\t\t);\n\t}\n}\n"],"version":3}