@paperless/core 0.1.0-alpha.34 → 0.1.0-alpha.341

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

@@ -0,0 +1,53 @@
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { d as defineCustomElement$1 } from './icon.component.js';
+
+const segmentItemComponentCss = ".visible{visibility:visible!important}.static{position:static!important}.fixed{position:fixed!important}.absolute{position:absolute!important}.bottom-0{bottom:0!important}.left-0{left:0!important}.m-0{margin:0!important}.mb-14{margin-bottom:3.5rem!important}.mb-6{margin-bottom:1.5rem!important}.ml-1{margin-left:.25rem!important}.ml-2{margin-left:.5rem!important}.block{display:block!important}.inline{display:inline!important}.flex{display:flex!important}.table{display:table!important}.table-cell{display:table-cell!important}.table-row{display:table-row!important}.hidden{display:none!important}.h-6{height:1.5rem!important}.h-8{height:2rem!important}.w-1{width:.25rem!important}.w-10{width:2.5rem!important}.w-11{width:2.75rem!important}.w-2{width:.5rem!important}.w-3{width:.75rem!important}.w-4{width:1rem!important}.w-5{width:1.25rem!important}.w-6{width:1.5rem!important}.w-7{width:1.75rem!important}.w-8{width:2rem!important}.w-9{width:2.25rem!important}.w-auto{width:auto!important}.w-full{width:100%!important}.flex-1{flex:1 1 0%!important}.-rotate-0{--tw-rotate:-0deg!important}.-rotate-0,.-rotate-135{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}.-rotate-135{--tw-rotate:-135deg!important}.-rotate-180{--tw-rotate:-180deg!important}.-rotate-180,.-rotate-225{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}.-rotate-225{--tw-rotate:-225deg!important}.-rotate-25{--tw-rotate:-25deg!important}.-rotate-25,.-rotate-270{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}.-rotate-270{--tw-rotate:-270deg!important}.-rotate-315{--tw-rotate:-315deg!important}.-rotate-315,.-rotate-45{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}.-rotate-45{--tw-rotate:-45deg!important}.-rotate-90{--tw-rotate:-90deg!important}.-rotate-90,.rotate-0{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}.rotate-0{--tw-rotate:0deg!important}.rotate-135{--tw-rotate:135deg!important}.rotate-135,.rotate-180{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}.rotate-180{--tw-rotate:180deg!important}.rotate-225{--tw-rotate:225deg!important}.rotate-225,.rotate-25{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}.rotate-25{--tw-rotate:25deg!important}.rotate-270{--tw-rotate:270deg!important}.rotate-270,.rotate-315{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}.rotate-315{--tw-rotate:315deg!important}.rotate-45{--tw-rotate:45deg!important}.rotate-45,.rotate-90{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}.rotate-90{--tw-rotate:90deg!important}.scale-x-flip{--tw-scale-x:-1!important}.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.scale-y-flip{--tw-scale-y:-1!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}.cursor-pointer{cursor:pointer!important}.flex-col{flex-direction:column!important}.items-end{align-items:flex-end!important}.items-center{align-items:center!important}.justify-start{justify-content:flex-start!important}.justify-end{justify-content:flex-end!important}.justify-center{justify-content:center!important}.justify-between{justify-content:space-between!important}.gap-4{gap:1rem!important}.self-center{align-self:center!important}.justify-self-end{justify-self:end!important}.rounded{border-radius:.25rem!important}.rounded-bl-none{border-bottom-left-radius:0!important}.rounded-br-none{border-bottom-right-radius:0!important}.rounded-tl-none{border-top-left-radius:0!important}.rounded-tr-none{border-top-right-radius:0!important}.border{border-width:1px!important}.border-l-0{border-left-width:0!important}.border-r-0{border-right-width:0!important}.border-solid{border-style:solid!important}.border-transparent{border-color:transparent!important}.border-t-mystic-dark{--tw-border-opacity:1!important;border-top-color:rgb(218 230 240/var(--tw-border-opacity))!important}.bg-white{--tw-bg-opacity:1!important;background-color:rgb(255 255 255/var(--tw-bg-opacity))!important}.p-4{padding:1rem!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.py-24{padding-bottom:6rem!important;padding-top:6rem!important}.pl-0{padding-left:0!important}.pr-0{padding-right:0!important}.text-center{text-align:center!important}.text-2xl{font-size:1.5rem!important;line-height:2rem!important}.text-3xl{font-size:1.875rem!important;line-height:2.25rem!important}.text-4xl{font-size:2.25rem!important;line-height:2.5rem!important}.text-5xl{font-size:3rem!important}.text-5xl,.text-6xl{line-height:1!important}.text-6xl{font-size:3.75rem!important}.text-base{font-size:1rem!important;line-height:1.5rem!important}.text-lg{font-size:1.125rem!important;line-height:1.75rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-xl{font-size:1.25rem!important;line-height:1.75rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.text-xxs{font-size:.6875rem!important}.font-semibold{font-weight:600!important}.text-indigo{color:rgb(82 138 250/var(--tw-text-opacity))!important}.text-indigo,.text-negative{--tw-text-opacity:1!important}.text-negative{color:rgb(185 30 40/var(--tw-text-opacity))!important}.text-negative,.text-negative-light{--tw-text-opacity:1!important}.text-negative-light{color:rgb(255 204 211/var(--tw-text-opacity))!important}.text-storm{color:rgb(81 83 107/var(--tw-text-opacity))!important}.text-storm,.text-storm-dark{--tw-text-opacity:1!important}.text-storm-dark{color:rgb(39 40 56/var(--tw-text-opacity))!important}.text-storm-dark,.text-storm-medium{--tw-text-opacity:1!important}.text-storm-medium{color:rgb(128 130 158/var(--tw-text-opacity))!important}.blur{--tw-blur:blur(8px)!important}.blur,.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}.text-indigo,.text-storm{--tw-text-opacity:1!important}:host{--tw-text-opacity:1;align-items:center;border-radius:.375rem;color:rgb(81 83 107/var(--tw-text-opacity));cursor:pointer;display:flex;font-size:.875rem;font-weight:600;height:1.5rem;line-height:1.25rem;padding-left:.5rem;padding-right:.5rem;white-space:nowrap}:host(.variant-icon){justify-content:center;padding-left:0;padding-right:0;width:1.5rem}:host(:hover){--tw-bg-opacity:1;background-color:rgb(241 246 255/var(--tw-bg-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))}.max-w-\\[20rem\\]{max-width:20rem!important}.w-1\\/12{width:8.333333%!important}.w-10\\/12{width:83.333333%!important}.w-11\\/12{width:91.666667%!important}.w-2\\/12{width:16.666667%!important}.w-3\\/12{width:25%!important}.w-4\\/12{width:33.333333%!important}.w-5\\/12{width:41.666667%!important}.w-6\\/12{width:50%!important}.w-7\\/12{width:58.333333%!important}.w-8\\/12{width:66.666667%!important}.w-9\\/12{width:75%!important}@media (min-width:40rem){.tablet\\:w-1\\/12{width:8.333333%!important}.tablet\\:w-10\\/12{width:83.333333%!important}.tablet\\:w-11\\/12{width:91.666667%!important}.tablet\\:w-2\\/12{width:16.666667%!important}.tablet\\:w-3\\/12{width:25%!important}.tablet\\:w-4\\/12{width:33.333333%!important}.tablet\\:w-5\\/12{width:41.666667%!important}.tablet\\:w-6\\/12{width:50%!important}.tablet\\:w-7\\/12{width:58.333333%!important}.tablet\\:w-8\\/12{width:66.666667%!important}.tablet\\:w-9\\/12{width:75%!important}}@media (min-width:64rem){.desktop-xs\\:w-1\\/12{width:8.333333%!important}.desktop-xs\\:w-10\\/12{width:83.333333%!important}.desktop-xs\\:w-11\\/12{width:91.666667%!important}.desktop-xs\\:w-2\\/12{width:16.666667%!important}.desktop-xs\\:w-3\\/12{width:25%!important}.desktop-xs\\:w-4\\/12{width:33.333333%!important}.desktop-xs\\:w-5\\/12{width:41.666667%!important}.desktop-xs\\:w-6\\/12{width:50%!important}.desktop-xs\\:w-7\\/12{width:58.333333%!important}.desktop-xs\\:w-8\\/12{width:66.666667%!important}.desktop-xs\\:w-9\\/12{width:75%!important}}@media (min-width:80rem){.desktop-sm\\:w-1\\/12{width:8.333333%!important}.desktop-sm\\:w-10\\/12{width:83.333333%!important}.desktop-sm\\:w-11\\/12{width:91.666667%!important}.desktop-sm\\:w-2\\/12{width:16.666667%!important}.desktop-sm\\:w-3\\/12{width:25%!important}.desktop-sm\\:w-4\\/12{width:33.333333%!important}.desktop-sm\\:w-5\\/12{width:41.666667%!important}.desktop-sm\\:w-6\\/12{width:50%!important}.desktop-sm\\:w-7\\/12{width:58.333333%!important}.desktop-sm\\:w-8\\/12{width:66.666667%!important}.desktop-sm\\:w-9\\/12{width:75%!important}}@media (min-width:85.375rem){.desktop\\:w-1\\/12{width:8.333333%!important}.desktop\\:w-10\\/12{width:83.333333%!important}.desktop\\:w-11\\/12{width:91.666667%!important}.desktop\\:w-2\\/12{width:16.666667%!important}.desktop\\:w-3\\/12{width:25%!important}.desktop\\:w-4\\/12{width:33.333333%!important}.desktop\\:w-5\\/12{width:41.666667%!important}.desktop\\:w-6\\/12{width:50%!important}.desktop\\:w-7\\/12{width:58.333333%!important}.desktop\\:w-8\\/12{width:66.666667%!important}.desktop\\:w-9\\/12{width:75%!important}}@media (min-width:90rem){.desktop-lg\\:w-1\\/12{width:8.333333%!important}.desktop-lg\\:w-10\\/12{width:83.333333%!important}.desktop-lg\\:w-11\\/12{width:91.666667%!important}.desktop-lg\\:w-2\\/12{width:16.666667%!important}.desktop-lg\\:w-3\\/12{width:25%!important}.desktop-lg\\:w-4\\/12{width:33.333333%!important}.desktop-lg\\:w-5\\/12{width:41.666667%!important}.desktop-lg\\:w-6\\/12{width:50%!important}.desktop-lg\\:w-7\\/12{width:58.333333%!important}.desktop-lg\\:w-8\\/12{width:66.666667%!important}.desktop-lg\\:w-9\\/12{width:75%!important}}@media (min-width:120rem){.desktop-xl\\:w-1\\/12{width:8.333333%!important}.desktop-xl\\:w-10\\/12{width:83.333333%!important}.desktop-xl\\:w-11\\/12{width:91.666667%!important}.desktop-xl\\:w-2\\/12{width:16.666667%!important}.desktop-xl\\:w-3\\/12{width:25%!important}.desktop-xl\\:w-4\\/12{width:33.333333%!important}.desktop-xl\\:w-5\\/12{width:41.666667%!important}.desktop-xl\\:w-6\\/12{width:50%!important}.desktop-xl\\:w-7\\/12{width:58.333333%!important}.desktop-xl\\:w-8\\/12{width:66.666667%!important}.desktop-xl\\:w-9\\/12{width:75%!important}}@media (min-width:64rem){.desktop-xs\\:flex{display:flex!important}}.w-3\\/4{width:75%!important}@media (min-width:64rem){.desktop-xs\\:hidden{display:none!important}.desktop-xs\\:w-auto{width:auto!important}.desktop-xs\\:flex-row{flex-direction:row!important}}.-rotate-0,.-rotate-135,.-rotate-180,.-rotate-225,.-rotate-25,.-rotate-270,.-rotate-315,.-rotate-45,.-rotate-90,.rotate-0,.rotate-135,.rotate-180,.rotate-225,.rotate-25,.rotate-270,.rotate-315,.rotate-45,.rotate-90,.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.text-lg,.text-xl{line-height:1.75rem!important}.hover\\:text-negative:hover{--tw-text-opacity:1!important;color:rgb(185 30 40/var(--tw-text-opacity))!important}.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}";
+
+const SegmentItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    this.active = false;
+    this.icon = undefined;
+    this.iconFlip = undefined;
+    this.iconRotate = undefined;
+  }
+  render() {
+    return (h(Host, { class: `p-segment-item variant-${this.icon ? 'icon' : 'default'} ${this.active && 'active'}` }, this.icon ? this._getIcon() : h("slot", null)));
+  }
+  _getIcon() {
+    if (!this.icon) {
+      return;
+    }
+    return (h("p-icon", { class: "flex", variant: this.icon, flip: this.iconFlip, rotate: this.iconRotate }));
+  }
+  static get style() { return segmentItemComponentCss; }
+}, [1, "p-segment-item", {
+    "active": [4],
+    "icon": [1],
+    "iconFlip": [1, "icon-flip"],
+    "iconRotate": [2, "icon-rotate"]
+  }]);
+function defineCustomElement() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["p-segment-item", "p-icon"];
+  components.forEach(tagName => { switch (tagName) {
+    case "p-segment-item":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, SegmentItem);
+      }
+      break;
+    case "p-icon":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$1();
+      }
+      break;
+  } });
+}
+
+export { SegmentItem as S, defineCustomElement as d };
+
+//# sourceMappingURL=segment-item.component.js.map

package/dist/components/segment-item.component.js.map

@@ -0,0 +1 @@
+{"file":"segment-item.component.js","mappings":";;;AAAA,MAAM,uBAAuB,GAAG,qiZAAqiZ;;MCSxjZ,WAAW;;;;;kBAIM,KAAK;;;;;EAiB/B,MAAM;IACF,QACI,EAAC,IAAI,IACD,KAAK,EAAE,0BACH,IAAI,CAAC,IAAI,GAAG,MAAM,GAAG,SACzB,IAAI,IAAI,CAAC,MAAM,IAAI,QAAQ,EAAE,IAE5B,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,QAAQ,EAAE,GAAG,eAAQ,CACpC,EACT;GACL;EAEO,QAAQ;IACZ,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;MACZ,OAAO;KACV;IAED,QACI,cACI,KAAK,EAAC,MAAM,EACZ,OAAO,EAAE,IAAI,CAAC,IAAI,EAClB,IAAI,EAAE,IAAI,CAAC,QAAQ,EACnB,MAAM,EAAE,IAAI,CAAC,UAAU,GACzB,EACJ;GACL;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/atoms/segment-item/segment-item.component.scss?tag=p-segment-item&encapsulation=shadow","./src/components/atoms/segment-item/segment-item.component.tsx"],"sourcesContent":[":host {\n    @apply h-6 flex items-center px-2 rounded-large;\n    @apply text-storm text-sm font-semibold whitespace-nowrap;\n    @apply cursor-pointer;\n}\n\n:host(.variant-icon) {\n    @apply w-6 justify-center px-0;\n}\n\n:host(:hover) {\n    @apply bg-indigo-light;\n}\n\n:host(.active) {\n    @apply text-indigo bg-indigo-light;\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\nimport { RotateOptions } from '../../../types/tailwind';\nimport { IconFlipOptions, IconVariant } from '../icon/icon.component';\n\n@Component({\n    tag: 'p-segment-item',\n    styleUrl: 'segment-item.component.scss',\n    shadow: true,\n})\nexport class SegmentItem {\n    /**\n     * Wether the segment item is active\n     */\n    @Prop() active: boolean = false;\n\n    /**\n     * Icon to show on the segment item\n     */\n    @Prop() icon: IconVariant;\n\n    /**\n     * Icon flip\n     */\n    @Prop() iconFlip: IconFlipOptions;\n\n    /**\n     * Icon rotate\n     */\n    @Prop() iconRotate: RotateOptions;\n\n    render() {\n        return (\n            <Host\n                class={`p-segment-item variant-${\n                    this.icon ? 'icon' : 'default'\n                } ${this.active && 'active'}`}\n            >\n                {this.icon ? this._getIcon() : <slot />}\n            </Host>\n        );\n    }\n\n    private _getIcon() {\n        if (!this.icon) {\n            return;\n        }\n\n        return (\n            <p-icon\n                class=\"flex\"\n                variant={this.icon}\n                flip={this.iconFlip}\n                rotate={this.iconRotate}\n            />\n        );\n    }\n}\n"],"version":3}

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

@@ -0,0 +1,35 @@
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+
+const sliderIndicatorComponentCss = ".visible{visibility:visible!important}.static{position:static!important}.block{display:block!important}.hidden{display:none!important}.h-2{height:.5rem!important}.w-2{width:.5rem!important}.cursor-pointer{cursor:pointer!important}.resize{resize:both!important}.bg-mystic-dark{--tw-bg-opacity:1!important;background-color:rgb(218 230 240/var(--tw-bg-opacity))!important}*{box-sizing:border-box}:host{--tw-bg-opacity:1;background-color:rgb(218 230 240/var(--tw-bg-opacity));border-radius:100%;display:block;height:.5rem;width:.5rem}:host(.active){--tw-bg-opacity:1;background-color:rgb(82 138 250/var(--tw-bg-opacity))}";
+
+const SliderIndicator = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    this.active = false;
+  }
+  render() {
+    return (h(Host, { class: `p-slider-indicator ${this.active && 'active'}` }));
+  }
+  static get style() { return sliderIndicatorComponentCss; }
+}, [1, "p-slider-indicator", {
+    "active": [4]
+  }]);
+function defineCustomElement() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["p-slider-indicator"];
+  components.forEach(tagName => { switch (tagName) {
+    case "p-slider-indicator":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, SliderIndicator);
+      }
+      break;
+  } });
+}
+
+export { SliderIndicator as S, defineCustomElement as d };
+
+//# sourceMappingURL=slider-indicator.component.js.map

package/dist/components/slider-indicator.component.js.map

@@ -0,0 +1 @@
+{"file":"slider-indicator.component.js","mappings":";;AAAA,MAAM,2BAA2B,GAAG,2mBAA2mB;;MCOloB,eAAe;;;;;kBAIE,KAAK;;EAE/B,MAAM;IACF,QACI,EAAC,IAAI,IACD,KAAK,EAAE,sBAAsB,IAAI,CAAC,MAAM,IAAI,QAAQ,EAAE,GAClD,EACV;GACL;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/atoms/slider-indicator/slider-indicator.component.scss?tag=p-slider-indicator&encapsulation=shadow","./src/components/atoms/slider-indicator/slider-indicator.component.tsx"],"sourcesContent":[":host {\n    @apply block w-2 h-2 bg-mystic-dark rounded-round;\n}\n\n:host(.active) {\n    @apply bg-indigo;\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n    tag: 'p-slider-indicator',\n    styleUrl: 'slider-indicator.component.scss',\n    shadow: true,\n})\nexport class SliderIndicator {\n    /**\n     * Wether the slider indicator is active\n     */\n    @Prop() active: boolean = false;\n\n    render() {\n        return (\n            <Host\n                class={`p-slider-indicator ${this.active && 'active'}`}\n            ></Host>\n        );\n    }\n}\n"],"version":3}

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

@@ -0,0 +1,37 @@
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+
+const stepperLineComponentCss = ".static{position:static!important}.block{display:block!important}.transition{transition-duration:.15s!important;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter!important;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter!important;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important}.duration-500{transition-duration:.5s!important}*{box-sizing:border-box}.mb-\\[calc\\(\\.5rem-1px\\)\\]{margin-bottom:calc(.5rem - 1px)!important}.ml-\\[calc\\(\\.5rem-1px\\)\\]{margin-left:calc(.5rem - 1px)!important}.mr-\\[calc\\(\\.5rem-1px\\)\\]{margin-right:calc(.5rem - 1px)!important}.h-\\[2px\\]{height:2px!important}.min-h-\\[1rem\\]{min-height:1rem!important}.w-\\[2px\\]{width:2px!important}:host{--tw-bg-opacity:1;background-color:rgb(218 230 240/var(--tw-bg-opacity));display:block;flex:1 1 auto;transition-duration:.5s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1)}:host([direction=horizontal]){height:2px;margin-bottom:calc(.5rem - 1px)}:host([direction=vertical]){margin-left:calc(.5rem - 1px);margin-right:calc(.5rem - 1px);min-height:1rem;width:2px}:host([active]){--tw-bg-opacity:1;background-color:rgb(82 138 250/var(--tw-bg-opacity))}";
+
+const StepperLine = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    this.active = false;
+    this.direction = 'horizontal';
+  }
+  render() {
+    return h(Host, { class: "p-stepper-line" });
+  }
+  static get style() { return stepperLineComponentCss; }
+}, [1, "p-stepper-line", {
+    "active": [516],
+    "direction": [513]
+  }]);
+function defineCustomElement() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["p-stepper-line"];
+  components.forEach(tagName => { switch (tagName) {
+    case "p-stepper-line":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, StepperLine);
+      }
+      break;
+  } });
+}
+
+export { StepperLine as S, defineCustomElement as d };
+
+//# sourceMappingURL=stepper-line.component.js.map

package/dist/components/stepper-line.component.js.map

@@ -0,0 +1 @@
+{"file":"stepper-line.component.js","mappings":";;AAAA,MAAM,uBAAuB,GAAG,67DAA67D;;MCOh9D,WAAW;;;;;kBAIuB,KAAK;qBAM5C,YAAY;;EAEhB,MAAM;IACF,OAAO,EAAC,IAAI,IAAC,KAAK,EAAC,gBAAgB,GAAQ,CAAC;GAC/C;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/atoms/stepper-line/stepper-line.component.scss?tag=p-stepper-line&encapsulation=shadow","./src/components/atoms/stepper-line/stepper-line.component.tsx"],"sourcesContent":[":host {\n    @apply flex-auto;\n    @apply transition duration-500 ease-in-out;\n\n    @apply block;\n\n    @apply bg-mystic-dark;\n}\n\n:host([direction='horizontal']) {\n    @apply mb-[calc(.5rem-1px)] h-[2px];\n}\n\n:host([direction='vertical']) {\n    @apply ml-[calc(.5rem-1px)] mr-[calc(.5rem-1px)] min-h-[1rem] w-[2px];\n}\n\n:host([active]) {\n    @apply bg-indigo;\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n    tag: 'p-stepper-line',\n    styleUrl: 'stepper-line.component.scss',\n    shadow: true,\n})\nexport class StepperLine {\n    /**\n     * Wether the line is active\n     */\n    @Prop({ reflect: true }) active: boolean = false;\n\n    /**\n     * The direction of the stepper line\n     */\n    @Prop({ reflect: true }) direction: 'horizontal' | 'vertical' =\n        'horizontal';\n\n    render() {\n        return <Host class=\"p-stepper-line\"></Host>;\n    }\n}\n"],"version":3}

package/dist/components/table-cell.component.js

@@ -0,0 +1,137 @@
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { o as objectGetByPath } from './object-get-by-path.js';
+import { d as defineCustomElement$1 } from './loader.component.js';
+
+const tableCellComponentCss = ".visible{visibility:visible!important}.static{position:static!important}.fixed{position:fixed!important}.absolute{position:absolute!important}.bottom-0{bottom:0!important}.left-0{left:0!important}.m-0{margin:0!important}.mb-14{margin-bottom:3.5rem!important}.mb-6{margin-bottom:1.5rem!important}.ml-1{margin-left:.25rem!important}.ml-2{margin-left:.5rem!important}.block{display:block!important}.inline{display:inline!important}.flex{display:flex!important}.table{display:table!important}.table-cell{display:table-cell!important}.table-row{display:table-row!important}.hidden{display:none!important}.h-6{height:1.5rem!important}.h-8{height:2rem!important}.w-1{width:.25rem!important}.w-10{width:2.5rem!important}.w-11{width:2.75rem!important}.w-2{width:.5rem!important}.w-3{width:.75rem!important}.w-4{width:1rem!important}.w-5{width:1.25rem!important}.w-6{width:1.5rem!important}.w-7{width:1.75rem!important}.w-8{width:2rem!important}.w-9{width:2.25rem!important}.w-auto{width:auto!important}.w-full{width:100%!important}.flex-1{flex:1 1 0%!important}.-rotate-0{--tw-rotate:-0deg!important}.-rotate-0,.-rotate-135{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}.-rotate-135{--tw-rotate:-135deg!important}.-rotate-180{--tw-rotate:-180deg!important}.-rotate-180,.-rotate-225{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}.-rotate-225{--tw-rotate:-225deg!important}.-rotate-25{--tw-rotate:-25deg!important}.-rotate-25,.-rotate-270{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}.-rotate-270{--tw-rotate:-270deg!important}.-rotate-315{--tw-rotate:-315deg!important}.-rotate-315,.-rotate-45{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}.-rotate-45{--tw-rotate:-45deg!important}.-rotate-90{--tw-rotate:-90deg!important}.-rotate-90,.rotate-0{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}.rotate-0{--tw-rotate:0deg!important}.rotate-135{--tw-rotate:135deg!important}.rotate-135,.rotate-180{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}.rotate-180{--tw-rotate:180deg!important}.rotate-225{--tw-rotate:225deg!important}.rotate-225,.rotate-25{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}.rotate-25{--tw-rotate:25deg!important}.rotate-270{--tw-rotate:270deg!important}.rotate-270,.rotate-315{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}.rotate-315{--tw-rotate:315deg!important}.rotate-45{--tw-rotate:45deg!important}.rotate-45,.rotate-90{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}.rotate-90{--tw-rotate:90deg!important}.scale-x-flip{--tw-scale-x:-1!important}.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.scale-y-flip{--tw-scale-y:-1!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}.cursor-pointer{cursor:pointer!important}.flex-col{flex-direction:column!important}.items-end{align-items:flex-end!important}.items-center{align-items:center!important}.justify-start{justify-content:flex-start!important}.justify-end{justify-content:flex-end!important}.justify-center{justify-content:center!important}.justify-between{justify-content:space-between!important}.gap-4{gap:1rem!important}.self-center{align-self:center!important}.justify-self-end{justify-self:end!important}.rounded{border-radius:.25rem!important}.rounded-bl-none{border-bottom-left-radius:0!important}.rounded-br-none{border-bottom-right-radius:0!important}.rounded-tl-none{border-top-left-radius:0!important}.rounded-tr-none{border-top-right-radius:0!important}.border{border-width:1px!important}.border-l-0{border-left-width:0!important}.border-r-0{border-right-width:0!important}.border-solid{border-style:solid!important}.border-transparent{border-color:transparent!important}.border-t-mystic-dark{--tw-border-opacity:1!important;border-top-color:rgb(218 230 240/var(--tw-border-opacity))!important}.bg-white{--tw-bg-opacity:1!important;background-color:rgb(255 255 255/var(--tw-bg-opacity))!important}.p-4{padding:1rem!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.py-24{padding-bottom:6rem!important;padding-top:6rem!important}.pl-0{padding-left:0!important}.pr-0{padding-right:0!important}.text-center{text-align:center!important}.text-2xl{font-size:1.5rem!important;line-height:2rem!important}.text-3xl{font-size:1.875rem!important;line-height:2.25rem!important}.text-4xl{font-size:2.25rem!important;line-height:2.5rem!important}.text-5xl{font-size:3rem!important}.text-5xl,.text-6xl{line-height:1!important}.text-6xl{font-size:3.75rem!important}.text-base{font-size:1rem!important;line-height:1.5rem!important}.text-lg{font-size:1.125rem!important;line-height:1.75rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-xl{font-size:1.25rem!important;line-height:1.75rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.text-xxs{font-size:.6875rem!important}.font-semibold{font-weight:600!important}.text-negative{color:rgb(185 30 40/var(--tw-text-opacity))!important}.text-negative,.text-negative-light{--tw-text-opacity:1!important}.text-negative-light{color:rgb(255 204 211/var(--tw-text-opacity))!important}.text-storm-dark{color:rgb(39 40 56/var(--tw-text-opacity))!important}.text-storm-dark,.text-storm-medium{--tw-text-opacity:1!important}.text-storm-medium{color:rgb(128 130 158/var(--tw-text-opacity))!important}.blur{--tw-blur:blur(8px)!important}.blur,.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-table-cell{align-items:center;display:flex;gap:1rem}.max-w-\\[20rem\\]{max-width:20rem!important}.w-1\\/12{width:8.333333%!important}.w-10\\/12{width:83.333333%!important}.w-11\\/12{width:91.666667%!important}.w-2\\/12{width:16.666667%!important}.w-3\\/12{width:25%!important}.w-4\\/12{width:33.333333%!important}.w-5\\/12{width:41.666667%!important}.w-6\\/12{width:50%!important}.w-7\\/12{width:58.333333%!important}.w-8\\/12{width:66.666667%!important}.w-9\\/12{width:75%!important}@media (min-width:40rem){.tablet\\:w-1\\/12{width:8.333333%!important}.tablet\\:w-10\\/12{width:83.333333%!important}.tablet\\:w-11\\/12{width:91.666667%!important}.tablet\\:w-2\\/12{width:16.666667%!important}.tablet\\:w-3\\/12{width:25%!important}.tablet\\:w-4\\/12{width:33.333333%!important}.tablet\\:w-5\\/12{width:41.666667%!important}.tablet\\:w-6\\/12{width:50%!important}.tablet\\:w-7\\/12{width:58.333333%!important}.tablet\\:w-8\\/12{width:66.666667%!important}.tablet\\:w-9\\/12{width:75%!important}}@media (min-width:64rem){.desktop-xs\\:w-1\\/12{width:8.333333%!important}.desktop-xs\\:w-10\\/12{width:83.333333%!important}.desktop-xs\\:w-11\\/12{width:91.666667%!important}.desktop-xs\\:w-2\\/12{width:16.666667%!important}.desktop-xs\\:w-3\\/12{width:25%!important}.desktop-xs\\:w-4\\/12{width:33.333333%!important}.desktop-xs\\:w-5\\/12{width:41.666667%!important}.desktop-xs\\:w-6\\/12{width:50%!important}.desktop-xs\\:w-7\\/12{width:58.333333%!important}.desktop-xs\\:w-8\\/12{width:66.666667%!important}.desktop-xs\\:w-9\\/12{width:75%!important}}@media (min-width:80rem){.desktop-sm\\:w-1\\/12{width:8.333333%!important}.desktop-sm\\:w-10\\/12{width:83.333333%!important}.desktop-sm\\:w-11\\/12{width:91.666667%!important}.desktop-sm\\:w-2\\/12{width:16.666667%!important}.desktop-sm\\:w-3\\/12{width:25%!important}.desktop-sm\\:w-4\\/12{width:33.333333%!important}.desktop-sm\\:w-5\\/12{width:41.666667%!important}.desktop-sm\\:w-6\\/12{width:50%!important}.desktop-sm\\:w-7\\/12{width:58.333333%!important}.desktop-sm\\:w-8\\/12{width:66.666667%!important}.desktop-sm\\:w-9\\/12{width:75%!important}}@media (min-width:85.375rem){.desktop\\:w-1\\/12{width:8.333333%!important}.desktop\\:w-10\\/12{width:83.333333%!important}.desktop\\:w-11\\/12{width:91.666667%!important}.desktop\\:w-2\\/12{width:16.666667%!important}.desktop\\:w-3\\/12{width:25%!important}.desktop\\:w-4\\/12{width:33.333333%!important}.desktop\\:w-5\\/12{width:41.666667%!important}.desktop\\:w-6\\/12{width:50%!important}.desktop\\:w-7\\/12{width:58.333333%!important}.desktop\\:w-8\\/12{width:66.666667%!important}.desktop\\:w-9\\/12{width:75%!important}}@media (min-width:90rem){.desktop-lg\\:w-1\\/12{width:8.333333%!important}.desktop-lg\\:w-10\\/12{width:83.333333%!important}.desktop-lg\\:w-11\\/12{width:91.666667%!important}.desktop-lg\\:w-2\\/12{width:16.666667%!important}.desktop-lg\\:w-3\\/12{width:25%!important}.desktop-lg\\:w-4\\/12{width:33.333333%!important}.desktop-lg\\:w-5\\/12{width:41.666667%!important}.desktop-lg\\:w-6\\/12{width:50%!important}.desktop-lg\\:w-7\\/12{width:58.333333%!important}.desktop-lg\\:w-8\\/12{width:66.666667%!important}.desktop-lg\\:w-9\\/12{width:75%!important}}@media (min-width:120rem){.desktop-xl\\:w-1\\/12{width:8.333333%!important}.desktop-xl\\:w-10\\/12{width:83.333333%!important}.desktop-xl\\:w-11\\/12{width:91.666667%!important}.desktop-xl\\:w-2\\/12{width:16.666667%!important}.desktop-xl\\:w-3\\/12{width:25%!important}.desktop-xl\\:w-4\\/12{width:33.333333%!important}.desktop-xl\\:w-5\\/12{width:41.666667%!important}.desktop-xl\\:w-6\\/12{width:50%!important}.desktop-xl\\:w-7\\/12{width:58.333333%!important}.desktop-xl\\:w-8\\/12{width:66.666667%!important}.desktop-xl\\:w-9\\/12{width:75%!important}}@media (min-width:64rem){.desktop-xs\\:flex{display:flex!important}}.w-3\\/4{width:75%!important}@media (min-width:64rem){.desktop-xs\\:hidden{display:none!important}.desktop-xs\\:w-auto{width:auto!important}.desktop-xs\\:flex-row{flex-direction:row!important}}.-rotate-0,.-rotate-135,.-rotate-180,.-rotate-225,.-rotate-25,.-rotate-270,.-rotate-315,.-rotate-45,.-rotate-90,.rotate-0,.rotate-135,.rotate-180,.rotate-225,.rotate-25,.rotate-270,.rotate-315,.rotate-45,.rotate-90,.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.text-lg,.text-xl{line-height:1.75rem!important}.hover\\:text-negative:hover{--tw-text-opacity:1!important;color:rgb(185 30 40/var(--tw-text-opacity))!important}.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}";
+
+const TableCell = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.variant = 'default';
+    this.index = undefined;
+    this.rowIndex = undefined;
+    this.definition = undefined;
+    this.item = undefined;
+    this.value = undefined;
+    this.checkbox = undefined;
+    this.template = ({ value, }) => value;
+  }
+  get data() {
+    var _a;
+    if (this.variant === 'header') {
+      return {
+        value: this.value,
+      };
+    }
+    return {
+      value: (_a = this.value) !== null && _a !== void 0 ? _a : objectGetByPath(this.item, this.definition.path),
+      item: this.item,
+      index: this.index,
+      rowIndex: this.rowIndex,
+    };
+  }
+  render() {
+    return (h(Host, { class: Object.assign({ 'p-table-cell': true, [`variant-${this.variant}`]: true }, this._getColumnClasses()) }, this.checkbox, this.variant === 'loading' ? (h("p-loader", { variant: "ghost", class: "rounded flex-1 w-full h-6" })) : (h("div", { class: "flex" }, this.variant === 'header' ? (this.data.value) : this.definition.useSlot ? (h("slot", null)) : (this.template(this.data))))));
+  }
+  _getColumnClasses() {
+    var _a, _b, _c, _d, _e, _f;
+    const sizes = this.definition ? this._getSizes(this.definition) : {};
+    return Object.assign({ 'justify-start': !((_a = this.definition) === null || _a === void 0 ? void 0 : _a.align) || ((_b = this.definition) === null || _b === void 0 ? void 0 : _b.align) === 'start', 'justify-center': ((_c = this.definition) === null || _c === void 0 ? void 0 : _c.align) === 'center', 'justify-end': ((_d = this.definition) === null || _d === void 0 ? void 0 : _d.align) === 'end', 'font-semibold': this.variant !== 'header' && ((_e = this.definition) === null || _e === void 0 ? void 0 : _e.type) === 'th', 'text-storm-dark': this.variant !== 'header' && ((_f = this.definition) === null || _f === void 0 ? void 0 : _f.type) === 'th' }, sizes);
+  }
+  /*
+   With this, we shall hack the system in ways no one would ever have thought.
+   
+   <div class="w-1/12 w-2/12 w-3/12 w-4/12 w-5/12 w-6/12 w-7/12 w-8/12 w-9/12 w-10/12 w-11/12 w-12/12"></div>
+   <div class="tablet:w-1/12 tablet:w-2/12 tablet:w-3/12 tablet:w-4/12 tablet:w-5/12 tablet:w-6/12 tablet:w-7/12 tablet:w-8/12 tablet:w-9/12 tablet:w-10/12 tablet:w-11/12 tablet:w-12/12"></div>
+   <div class="desktop-xs:w-1/12 desktop-xs:w-2/12 desktop-xs:w-3/12 desktop-xs:w-4/12 desktop-xs:w-5/12 desktop-xs:w-6/12 desktop-xs:w-7/12 desktop-xs:w-8/12 desktop-xs:w-9/12 desktop-xs:w-10/12 desktop-xs:w-11/12 desktop-xs:w-12/12"></div>
+   <div class="desktop-xs:w-1/12 desktop-xs:w-2/12 desktop-xs:w-3/12 desktop-xs:w-4/12 desktop-xs:w-5/12 desktop-xs:w-6/12 desktop-xs:w-7/12 desktop-xs:w-8/12 desktop-xs:w-9/12 desktop-xs:w-10/12 desktop-xs:w-11/12 desktop-xs:w-12/12"></div>
+   <div class="desktop-sm:w-1/12 desktop-sm:w-2/12 desktop-sm:w-3/12 desktop-sm:w-4/12 desktop-sm:w-5/12 desktop-sm:w-6/12 desktop-sm:w-7/12 desktop-sm:w-8/12 desktop-sm:w-9/12 desktop-sm:w-10/12 desktop-sm:w-11/12 desktop-sm:w-12/12"></div>
+   <div class="desktop:w-1/12 desktop:w-2/12 desktop:w-3/12 desktop:w-4/12 desktop:w-5/12 desktop:w-6/12 desktop:w-7/12 desktop:w-8/12 desktop:w-9/12 desktop:w-10/12 desktop:w-11/12 desktop:w-12/12"></div>
+   <div class="desktop-lg:w-1/12 desktop-lg:w-2/12 desktop-lg:w-3/12 desktop-lg:w-4/12 desktop-lg:w-5/12 desktop-lg:w-6/12 desktop-lg:w-7/12 desktop-lg:w-8/12 desktop-lg:w-9/12 desktop-lg:w-10/12 desktop-lg:w-11/12 desktop-lg:w-12/12"></div>
+   <div class="desktop-xl:w-1/12 desktop-xl:w-2/12 desktop-xl:w-3/12 desktop-xl:w-4/12 desktop-xl:w-5/12 desktop-xl:w-6/12 desktop-xl:w-7/12 desktop-xl:w-8/12 desktop-xl:w-9/12 desktop-xl:w-10/12 desktop-xl:w-11/12 desktop-xl:w-12/12"></div>
+
+   
+      ⠀⠀⠀⠀⠀⣠⣴⣶⣿⣿⠿⣷⣶⣤⣄⡀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⣠⣴⣶⣷⠿⣿⣿⣶⣦⣀⠀⠀⠀⠀⠀
+      ⠀⠀⠀⢀⣾⣿⣿⣿⣿⣿⣿⣿⣶⣦⣬⡉⠒⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠚⢉⣥⣴⣾⣿⣿⣿⣿⣿⣿⣿⣧⠀⠀⠀⠀
+      ⠀⠀⠀⡾⠿⠛⠛⠛⠛⠿⢿⣿⣿⣿⣿⣿⣷⣄⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⣠⣾⣿⣿⣿⣿⣿⠿⠿⠛⠛⠛⠛⠿⢧⠀⠀⠀
+      ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠙⠻⣿⣿⣿⣿⣿⡄⠀⠀⠀⠀⠀⠀⣠⣿⣿⣿⣿⡿⠟⠉⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
+      ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠙⢿⣿⡄⠀⠀⠀⠀⠀⠀⠀⠀⢰⣿⡿⠋⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
+      ⠀⠀⠀⠀⠀⠀⠀⣠⣤⠶⠶⠶⠰⠦⣤⣀⠀⠙⣷⠀⠀⠀⠀⠀⠀⠀⢠⡿⠋⢀⣀⣤⢴⠆⠲⠶⠶⣤⣄⠀⠀⠀⠀⠀⠀⠀
+      ⠀⠘⣆⠀⠀⢠⣾⣫⣶⣾⣿⣿⣿⣿⣷⣯⣿⣦⠈⠃⡇⠀⠀⠀⠀⢸⠘⢁⣶⣿⣵⣾⣿⣿⣿⣿⣷⣦⣝⣷⡄⠀⠀⡰⠂⠀
+      ⠀⠀⣨⣷⣶⣿⣧⣛⣛⠿⠿⣿⢿⣿⣿⣛⣿⡿⠀⠀⡇⠀⠀⠀⠀⢸⠀⠈⢿⣟⣛⠿⢿⡿⢿⢿⢿⣛⣫⣼⡿⣶⣾⣅⡀⠀
+      ⢀⡼⠋⠁⠀⠀⠈⠉⠛⠛⠻⠟⠸⠛⠋⠉⠁⠀⠀⢸⡇⠀⠀⠄⠀⢸⡄⠀⠀⠈⠉⠙⠛⠃⠻⠛⠛⠛⠉⠁⠀⠀⠈⠙⢧⡀
+      ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⣿⡇⢠⠀⠀⠀⢸⣷⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
+      ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⣾⣿⡇⠀⠀⠀⠀⢸⣿⣷⡀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
+      ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣰⠟⠁⣿⠇⠀⠀⠀⠀⢸⡇⠙⢿⣆⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
+      ⠀⠰⣄⠀⠀⠀⠀⠀⠀⠀⠀⢀⣠⣾⠖⡾⠁⠀⠀⣿⠀⠀⠀⠀⠀⠘⣿⠀⠀⠙⡇⢸⣷⣄⡀⠀⠀⠀⠀⠀⠀⠀⠀⣰⠄⠀
+      ⠀⠀⢻⣷⡦⣤⣤⣤⡴⠶⠿⠛⠉⠁⠀⢳⠀⢠⡀⢿⣀⠀⠀⠀⠀⣠⡟⢀⣀⢠⠇⠀⠈⠙⠛⠷⠶⢦⣤⣤⣤⢴⣾⡏⠀⠀
+      ⠀⠀⠈⣿⣧⠙⣿⣷⣄⠀⠀⠀⠀⠀⠀⠀⠀⠘⠛⢊⣙⠛⠒⠒⢛⣋⡚⠛⠉⠀⠀⠀⠀⠀⠀⠀⠀⣠⣿⡿⠁⣾⡿⠀⠀⠀
+      ⠀⠀⠀⠘⣿⣇⠈⢿⣿⣦⠀⠀⠀⠀⠀⠀⠀⠀⣰⣿⣿⣿⡿⢿⣿⣿⣿⣆⠀⠀⠀⠀⠀⠀⠀⢀⣼⣿⡟⠁⣼⡿⠁⠀⠀⠀
+      ⠀⠀⠀⠀⠘⣿⣦⠀⠻⣿⣷⣦⣤⣤⣶⣶⣶⣿⣿⣿⣿⠏⠀⠀⠻⣿⣿⣿⣿⣶⣶⣶⣦⣤⣴⣿⣿⠏⢀⣼⡿⠁⠀⠀⠀⠀
+      ⠀⠀⠀⠀⠀⠘⢿⣷⣄⠙⠻⠿⠿⠿⠿⠿⢿⣿⣿⣿⣁⣀⣀⣀⣀⣙⣿⣿⣿⠿⠿⠿⠿⠿⠿⠟⠁⣠⣿⡿⠁⠀⠀⠀⠀⠀
+      ⠀⠀⠀⠀⠀⠀⠈⠻⣯⠙⢦⣀⠀⠀⠀⠀⠀⠉⠉⠉⠉⠉⠉⠉⠉⠉⠉⠉⠉⠀⠀⠀⠀⠀⣠⠴⢋⣾⠟⠀⠀⠀⠀⠀⠀⠀
+      ⠀⠀⠀⠀⠀⠀⠀⠀⠙⢧⡀⠈⠉⠒⠀⠀⠀⠀⠀⠀⣀⠀⠀⠀⠀⢀⠀⠀⠀⠀⠀⠐⠒⠉⠁⢀⡾⠃⠀⠀⠀⠀⠀⠀⠀⠀
+      ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠈⠳⣄⠀⠀⠀⠀⠀⠀⠀⠀⠻⣿⣿⣿⣿⠋⠀⠀⠀⠀⠀⠀⠀⠀⣠⠟⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
+      ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠘⢦⡀⠀⠀⠀⠀⠀⠀⠀⣸⣿⣿⡇⠀⠀⠀⠀⠀⠀⠀⢀⡴⠁⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
+      ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣿⣿⣿⣿⠀⠀⠀⠀⠀⠀⠀⠋⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
+      ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠐⣿⣿⣿⣿⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
+      ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣿⣿⣿⡿⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
+      ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢻⣿⣿⡇⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
+      ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠸⣿⣿⠃⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
+  */
+  _getSizes({ sizes }) {
+    if (sizes === 'auto' || !sizes) {
+      return {
+        'w-auto': true,
+      };
+    }
+    if (typeof sizes === 'object') {
+      const classes = {};
+      for (const size of Object.keys(sizes)) {
+        if (size === 'default') {
+          classes[`w-${sizes.default}/12`] = true;
+          continue;
+        }
+        classes[`${size}:w-${sizes[`${size}`]}/12`] = true;
+      }
+      return classes;
+    }
+    // is a number.
+    return {
+      [`w-${sizes}/12`]: true,
+    };
+  }
+  static get style() { return tableCellComponentCss; }
+}, [4, "p-table-cell", {
+    "variant": [1],
+    "index": [2],
+    "rowIndex": [2, "row-index"],
+    "definition": [16],
+    "item": [8],
+    "value": [8],
+    "checkbox": [8],
+    "template": [16]
+  }]);
+function defineCustomElement() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["p-table-cell", "p-loader"];
+  components.forEach(tagName => { switch (tagName) {
+    case "p-table-cell":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, TableCell);
+      }
+      break;
+    case "p-loader":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$1();
+      }
+      break;
+  } });
+}
+
+export { TableCell as T, defineCustomElement as d };
+
+//# sourceMappingURL=table-cell.component.js.map

package/dist/components/table-cell.component.js.map

@@ -0,0 +1 @@
+{"file":"table-cell.component.js","mappings":";;;;AAAA,MAAM,qBAAqB,GAAG,wtXAAwtX;;MCYzuX,SAAS;;;;mBAIkC,SAAS;;;;;;;oBAmCb,CAAC,EAC7C,KAAK,GACa,KAAK,KAAK;;EAEhC,IAAI,IAAI;;IACJ,IAAI,IAAI,CAAC,OAAO,KAAK,QAAQ,EAAE;MAC3B,OAAO;QACH,KAAK,EAAE,IAAI,CAAC,KAAK;OACpB,CAAC;KACL;IAED,OAAO;MACH,KAAK,EACD,MAAA,IAAI,CAAC,KAAK,mCAAI,eAAe,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC;MAClE,IAAI,EAAE,IAAI,CAAC,IAAI;MACf,KAAK,EAAE,IAAI,CAAC,KAAK;MACjB,QAAQ,EAAE,IAAI,CAAC,QAAQ;KAC1B,CAAC;GACL;EAED,MAAM;IACF,QACI,EAAC,IAAI,IACD,KAAK,kBACD,cAAc,EAAE,IAAI,EACpB,CAAC,WAAW,IAAI,CAAC,OAAO,EAAE,GAAG,IAAI,IAC9B,IAAI,CAAC,iBAAiB,EAAE,KAG9B,IAAI,CAAC,QAAQ,EAEb,IAAI,CAAC,OAAO,KAAK,SAAS,IACvB,gBACI,OAAO,EAAC,OAAO,EACf,KAAK,EAAC,2BAA2B,GACnC,KAEF,WAAK,KAAK,EAAC,MAAM,IACZ,IAAI,CAAC,OAAO,KAAK,QAAQ,IACtB,IAAI,CAAC,IAAI,CAAC,KAAK,IACf,IAAI,CAAC,UAAU,CAAC,OAAO,IACvB,eAAQ,KAER,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAA2B,CAAC,CAClD,CACC,CACT,CACE,EACT;GACL;EAEO,iBAAiB;;IACrB,MAAM,KAAK,GAAG,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,UAAU,CAAC,GAAG,EAAE,CAAC;IACrE,uBACI,eAAe,EACX,EAAC,MAAA,IAAI,CAAC,UAAU,0CAAE,KAAK,CAAA,IAAI,CAAA,MAAA,IAAI,CAAC,UAAU,0CAAE,KAAK,MAAK,OAAO,EACjE,gBAAgB,EAAE,CAAA,MAAA,IAAI,CAAC,UAAU,0CAAE,KAAK,MAAK,QAAQ,EACrD,aAAa,EAAE,CAAA,MAAA,IAAI,CAAC,UAAU,0CAAE,KAAK,MAAK,KAAK,EAC/C,eAAe,EACX,IAAI,CAAC,OAAO,KAAK,QAAQ,IAAI,CAAA,MAAA,IAAI,CAAC,UAAU,0CAAE,IAAI,MAAK,IAAI,EAC/D,iBAAiB,EACb,IAAI,CAAC,OAAO,KAAK,QAAQ,IAAI,CAAA,MAAA,IAAI,CAAC,UAAU,0CAAE,IAAI,MAAK,IAAI,IAC5D,KAAK,EACV;GACL;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA2CO,SAAS,CAAC,EAAE,KAAK,EAAe;IACpC,IAAI,KAAK,KAAK,MAAM,IAAI,CAAC,KAAK,EAAE;MAC5B,OAAO;QACH,QAAQ,EAAE,IAAI;OACjB,CAAC;KACL;IAED,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;MAC3B,MAAM,OAAO,GAAG,EAAE,CAAC;MACnB,KAAK,MAAM,IAAI,IAAI,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE;QACnC,IAAI,IAAI,KAAK,SAAS,EAAE;UACpB,OAAO,CAAC,KAAK,KAAK,CAAC,OAAO,KAAK,CAAC,GAAG,IAAI,CAAC;UACxC,SAAS;SACZ;QAED,OAAO,CAAC,GAAG,IAAI,MAAM,KAAK,CAAC,GAAG,IAAI,EAAE,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC;OACtD;MAED,OAAO,OAAO,CAAC;KAClB;;IAGD,OAAO;MACH,CAAC,KAAK,KAAK,KAAK,GAAG,IAAI;KAC1B,CAAC;GACL;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/molecules/table-cell/table-cell.component.scss?tag=p-table-cell","./src/components/molecules/table-cell/table-cell.component.tsx"],"sourcesContent":["p-table-cell {\n    @apply flex gap-4 items-center;\n\n    // TODO: Remove this\n    // @import '../../../style/form/checkbox';\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\nimport {\n    TableDefinitionData,\n    TableDefinitionTemplateFunc,\n} from '../../../types';\nimport { objectGetByPath } from '../../../utils';\nimport { TableColumn } from '../../helpers/table-column/table-column.component';\n\n@Component({\n    tag: 'p-table-cell',\n    styleUrl: 'table-cell.component.scss',\n})\nexport class TableCell {\n    /**\n     * The variant of the column\n     */\n    @Prop() variant: 'default' | 'loading' | 'header' = 'default';\n\n    /**\n     * The index of the column\n     */\n    @Prop() index: number;\n\n    /**\n     * The index of the row\n     */\n    @Prop() rowIndex: number;\n\n    /**\n     * The definition of the table column\n     */\n    @Prop() definition?: TableColumn;\n\n    /**\n     * The item in question\n     */\n    @Prop() item: any;\n\n    /**\n     * The value of the column\n     */\n    @Prop() value: any;\n\n    /**\n     * The checkbox to show\n     */\n    @Prop() checkbox: any;\n\n    /**\n     * The template to show\n     */\n    @Prop() template: TableDefinitionTemplateFunc = ({\n        value,\n    }: TableDefinitionData) => value;\n\n    get data(): TableDefinitionData | { value: string } {\n        if (this.variant === 'header') {\n            return {\n                value: this.value,\n            };\n        }\n\n        return {\n            value:\n                this.value ?? objectGetByPath(this.item, this.definition.path),\n            item: this.item,\n            index: this.index,\n            rowIndex: this.rowIndex,\n        };\n    }\n\n    render() {\n        return (\n            <Host\n                class={{\n                    'p-table-cell': true,\n                    [`variant-${this.variant}`]: true,\n                    ...this._getColumnClasses(),\n                }}\n            >\n                {this.checkbox}\n\n                {this.variant === 'loading' ? (\n                    <p-loader\n                        variant=\"ghost\"\n                        class=\"rounded flex-1 w-full h-6\"\n                    />\n                ) : (\n                    <div class=\"flex\">\n                        {this.variant === 'header' ? (\n                            this.data.value\n                        ) : this.definition.useSlot ? (\n                            <slot />\n                        ) : (\n                            this.template(this.data as TableDefinitionData)\n                        )}\n                    </div>\n                )}\n            </Host>\n        );\n    }\n\n    private _getColumnClasses() {\n        const sizes = this.definition ? this._getSizes(this.definition) : {};\n        return {\n            'justify-start':\n                !this.definition?.align || this.definition?.align === 'start',\n            'justify-center': this.definition?.align === 'center',\n            'justify-end': this.definition?.align === 'end',\n            'font-semibold':\n                this.variant !== 'header' && this.definition?.type === 'th',\n            'text-storm-dark':\n                this.variant !== 'header' && this.definition?.type === 'th',\n            ...sizes,\n        };\n    }\n\n    /* \n     With this, we shall hack the system in ways no one would ever have thought.\n     \n     <div class=\"w-1/12 w-2/12 w-3/12 w-4/12 w-5/12 w-6/12 w-7/12 w-8/12 w-9/12 w-10/12 w-11/12 w-12/12\"></div>\n     <div class=\"tablet:w-1/12 tablet:w-2/12 tablet:w-3/12 tablet:w-4/12 tablet:w-5/12 tablet:w-6/12 tablet:w-7/12 tablet:w-8/12 tablet:w-9/12 tablet:w-10/12 tablet:w-11/12 tablet:w-12/12\"></div>\n     <div class=\"desktop-xs:w-1/12 desktop-xs:w-2/12 desktop-xs:w-3/12 desktop-xs:w-4/12 desktop-xs:w-5/12 desktop-xs:w-6/12 desktop-xs:w-7/12 desktop-xs:w-8/12 desktop-xs:w-9/12 desktop-xs:w-10/12 desktop-xs:w-11/12 desktop-xs:w-12/12\"></div>\n     <div class=\"desktop-xs:w-1/12 desktop-xs:w-2/12 desktop-xs:w-3/12 desktop-xs:w-4/12 desktop-xs:w-5/12 desktop-xs:w-6/12 desktop-xs:w-7/12 desktop-xs:w-8/12 desktop-xs:w-9/12 desktop-xs:w-10/12 desktop-xs:w-11/12 desktop-xs:w-12/12\"></div>\n     <div class=\"desktop-sm:w-1/12 desktop-sm:w-2/12 desktop-sm:w-3/12 desktop-sm:w-4/12 desktop-sm:w-5/12 desktop-sm:w-6/12 desktop-sm:w-7/12 desktop-sm:w-8/12 desktop-sm:w-9/12 desktop-sm:w-10/12 desktop-sm:w-11/12 desktop-sm:w-12/12\"></div>\n     <div class=\"desktop:w-1/12 desktop:w-2/12 desktop:w-3/12 desktop:w-4/12 desktop:w-5/12 desktop:w-6/12 desktop:w-7/12 desktop:w-8/12 desktop:w-9/12 desktop:w-10/12 desktop:w-11/12 desktop:w-12/12\"></div>\n     <div class=\"desktop-lg:w-1/12 desktop-lg:w-2/12 desktop-lg:w-3/12 desktop-lg:w-4/12 desktop-lg:w-5/12 desktop-lg:w-6/12 desktop-lg:w-7/12 desktop-lg:w-8/12 desktop-lg:w-9/12 desktop-lg:w-10/12 desktop-lg:w-11/12 desktop-lg:w-12/12\"></div>\n     <div class=\"desktop-xl:w-1/12 desktop-xl:w-2/12 desktop-xl:w-3/12 desktop-xl:w-4/12 desktop-xl:w-5/12 desktop-xl:w-6/12 desktop-xl:w-7/12 desktop-xl:w-8/12 desktop-xl:w-9/12 desktop-xl:w-10/12 desktop-xl:w-11/12 desktop-xl:w-12/12\"></div>\n\n     \n        ⠀⠀⠀⠀⠀⣠⣴⣶⣿⣿⠿⣷⣶⣤⣄⡀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⣠⣴⣶⣷⠿⣿⣿⣶⣦⣀⠀⠀⠀⠀⠀\n        ⠀⠀⠀⢀⣾⣿⣿⣿⣿⣿⣿⣿⣶⣦⣬⡉⠒⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠚⢉⣥⣴⣾⣿⣿⣿⣿⣿⣿⣿⣧⠀⠀⠀⠀\n        ⠀⠀⠀⡾⠿⠛⠛⠛⠛⠿⢿⣿⣿⣿⣿⣿⣷⣄⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⣠⣾⣿⣿⣿⣿⣿⠿⠿⠛⠛⠛⠛⠿⢧⠀⠀⠀\n        ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠙⠻⣿⣿⣿⣿⣿⡄⠀⠀⠀⠀⠀⠀⣠⣿⣿⣿⣿⡿⠟⠉⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀\n        ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠙⢿⣿⡄⠀⠀⠀⠀⠀⠀⠀⠀⢰⣿⡿⠋⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀\n        ⠀⠀⠀⠀⠀⠀⠀⣠⣤⠶⠶⠶⠰⠦⣤⣀⠀⠙⣷⠀⠀⠀⠀⠀⠀⠀⢠⡿⠋⢀⣀⣤⢴⠆⠲⠶⠶⣤⣄⠀⠀⠀⠀⠀⠀⠀\n        ⠀⠘⣆⠀⠀⢠⣾⣫⣶⣾⣿⣿⣿⣿⣷⣯⣿⣦⠈⠃⡇⠀⠀⠀⠀⢸⠘⢁⣶⣿⣵⣾⣿⣿⣿⣿⣷⣦⣝⣷⡄⠀⠀⡰⠂⠀\n        ⠀⠀⣨⣷⣶⣿⣧⣛⣛⠿⠿⣿⢿⣿⣿⣛⣿⡿⠀⠀⡇⠀⠀⠀⠀⢸⠀⠈⢿⣟⣛⠿⢿⡿⢿⢿⢿⣛⣫⣼⡿⣶⣾⣅⡀⠀\n        ⢀⡼⠋⠁⠀⠀⠈⠉⠛⠛⠻⠟⠸⠛⠋⠉⠁⠀⠀⢸⡇⠀⠀⠄⠀⢸⡄⠀⠀⠈⠉⠙⠛⠃⠻⠛⠛⠛⠉⠁⠀⠀⠈⠙⢧⡀\n        ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⣿⡇⢠⠀⠀⠀⢸⣷⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀\n        ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⣾⣿⡇⠀⠀⠀⠀⢸⣿⣷⡀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀\n        ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣰⠟⠁⣿⠇⠀⠀⠀⠀⢸⡇⠙⢿⣆⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀\n        ⠀⠰⣄⠀⠀⠀⠀⠀⠀⠀⠀⢀⣠⣾⠖⡾⠁⠀⠀⣿⠀⠀⠀⠀⠀⠘⣿⠀⠀⠙⡇⢸⣷⣄⡀⠀⠀⠀⠀⠀⠀⠀⠀⣰⠄⠀\n        ⠀⠀⢻⣷⡦⣤⣤⣤⡴⠶⠿⠛⠉⠁⠀⢳⠀⢠⡀⢿⣀⠀⠀⠀⠀⣠⡟⢀⣀⢠⠇⠀⠈⠙⠛⠷⠶⢦⣤⣤⣤⢴⣾⡏⠀⠀\n        ⠀⠀⠈⣿⣧⠙⣿⣷⣄⠀⠀⠀⠀⠀⠀⠀⠀⠘⠛⢊⣙⠛⠒⠒⢛⣋⡚⠛⠉⠀⠀⠀⠀⠀⠀⠀⠀⣠⣿⡿⠁⣾⡿⠀⠀⠀\n        ⠀⠀⠀⠘⣿⣇⠈⢿⣿⣦⠀⠀⠀⠀⠀⠀⠀⠀⣰⣿⣿⣿⡿⢿⣿⣿⣿⣆⠀⠀⠀⠀⠀⠀⠀⢀⣼⣿⡟⠁⣼⡿⠁⠀⠀⠀\n        ⠀⠀⠀⠀⠘⣿⣦⠀⠻⣿⣷⣦⣤⣤⣶⣶⣶⣿⣿⣿⣿⠏⠀⠀⠻⣿⣿⣿⣿⣶⣶⣶⣦⣤⣴⣿⣿⠏⢀⣼⡿⠁⠀⠀⠀⠀\n        ⠀⠀⠀⠀⠀⠘⢿⣷⣄⠙⠻⠿⠿⠿⠿⠿⢿⣿⣿⣿⣁⣀⣀⣀⣀⣙⣿⣿⣿⠿⠿⠿⠿⠿⠿⠟⠁⣠⣿⡿⠁⠀⠀⠀⠀⠀\n        ⠀⠀⠀⠀⠀⠀⠈⠻⣯⠙⢦⣀⠀⠀⠀⠀⠀⠉⠉⠉⠉⠉⠉⠉⠉⠉⠉⠉⠉⠀⠀⠀⠀⠀⣠⠴⢋⣾⠟⠀⠀⠀⠀⠀⠀⠀\n        ⠀⠀⠀⠀⠀⠀⠀⠀⠙⢧⡀⠈⠉⠒⠀⠀⠀⠀⠀⠀⣀⠀⠀⠀⠀⢀⠀⠀⠀⠀⠀⠐⠒⠉⠁⢀⡾⠃⠀⠀⠀⠀⠀⠀⠀⠀\n        ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠈⠳⣄⠀⠀⠀⠀⠀⠀⠀⠀⠻⣿⣿⣿⣿⠋⠀⠀⠀⠀⠀⠀⠀⠀⣠⠟⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀\n        ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠘⢦⡀⠀⠀⠀⠀⠀⠀⠀⣸⣿⣿⡇⠀⠀⠀⠀⠀⠀⠀⢀⡴⠁⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀\n        ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣿⣿⣿⣿⠀⠀⠀⠀⠀⠀⠀⠋⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀\n        ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠐⣿⣿⣿⣿⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀\n        ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣿⣿⣿⡿⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀\n        ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢻⣿⣿⡇⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀\n        ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠸⣿⣿⠃⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀\n    */\n    private _getSizes({ sizes }: TableColumn) {\n        if (sizes === 'auto' || !sizes) {\n            return {\n                'w-auto': true,\n            };\n        }\n\n        if (typeof sizes === 'object') {\n            const classes = {};\n            for (const size of Object.keys(sizes)) {\n                if (size === 'default') {\n                    classes[`w-${sizes.default}/12`] = true;\n                    continue;\n                }\n\n                classes[`${size}:w-${sizes[`${size}`]}/12`] = true;\n            }\n\n            return classes;\n        }\n\n        // is a number.\n        return {\n            [`w-${sizes}/12`]: true,\n        };\n    }\n}\n"],"version":3}

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

@@ -0,0 +1,32 @@
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+
+const tableContainerComponentCss = ".visible{visibility:visible!important}.static{position:static!important}.fixed{position:fixed!important}.absolute{position:absolute!important}.bottom-0{bottom:0!important}.left-0{left:0!important}.m-0{margin:0!important}.mb-14{margin-bottom:3.5rem!important}.mb-6{margin-bottom:1.5rem!important}.ml-1{margin-left:.25rem!important}.ml-2{margin-left:.5rem!important}.block{display:block!important}.inline{display:inline!important}.flex{display:flex!important}.table{display:table!important}.table-cell{display:table-cell!important}.table-row{display:table-row!important}.hidden{display:none!important}.h-6{height:1.5rem!important}.h-8{height:2rem!important}.w-1{width:.25rem!important}.w-10{width:2.5rem!important}.w-11{width:2.75rem!important}.w-2{width:.5rem!important}.w-3{width:.75rem!important}.w-4{width:1rem!important}.w-5{width:1.25rem!important}.w-6{width:1.5rem!important}.w-7{width:1.75rem!important}.w-8{width:2rem!important}.w-9{width:2.25rem!important}.w-auto{width:auto!important}.w-full{width:100%!important}.flex-1{flex:1 1 0%!important}.-rotate-0{--tw-rotate:-0deg!important}.-rotate-0,.-rotate-135{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}.-rotate-135{--tw-rotate:-135deg!important}.-rotate-180{--tw-rotate:-180deg!important}.-rotate-180,.-rotate-225{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}.-rotate-225{--tw-rotate:-225deg!important}.-rotate-25{--tw-rotate:-25deg!important}.-rotate-25,.-rotate-270{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}.-rotate-270{--tw-rotate:-270deg!important}.-rotate-315{--tw-rotate:-315deg!important}.-rotate-315,.-rotate-45{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}.-rotate-45{--tw-rotate:-45deg!important}.-rotate-90{--tw-rotate:-90deg!important}.-rotate-90,.rotate-0{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}.rotate-0{--tw-rotate:0deg!important}.rotate-135{--tw-rotate:135deg!important}.rotate-135,.rotate-180{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}.rotate-180{--tw-rotate:180deg!important}.rotate-225{--tw-rotate:225deg!important}.rotate-225,.rotate-25{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}.rotate-25{--tw-rotate:25deg!important}.rotate-270{--tw-rotate:270deg!important}.rotate-270,.rotate-315{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}.rotate-315{--tw-rotate:315deg!important}.rotate-45{--tw-rotate:45deg!important}.rotate-45,.rotate-90{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}.rotate-90{--tw-rotate:90deg!important}.scale-x-flip{--tw-scale-x:-1!important}.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.scale-y-flip{--tw-scale-y:-1!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}.cursor-pointer{cursor:pointer!important}.flex-col{flex-direction:column!important}.items-end{align-items:flex-end!important}.items-center{align-items:center!important}.justify-start{justify-content:flex-start!important}.justify-end{justify-content:flex-end!important}.justify-center{justify-content:center!important}.justify-between{justify-content:space-between!important}.gap-4{gap:1rem!important}.self-center{align-self:center!important}.justify-self-end{justify-self:end!important}.rounded{border-radius:.25rem!important}.rounded-bl-none{border-bottom-left-radius:0!important}.rounded-br-none{border-bottom-right-radius:0!important}.rounded-tl-none{border-top-left-radius:0!important}.rounded-tr-none{border-top-right-radius:0!important}.border{border-width:1px!important}.border-l-0{border-left-width:0!important}.border-r-0{border-right-width:0!important}.border-solid{border-style:solid!important}.border-transparent{border-color:transparent!important}.border-t-mystic-dark{--tw-border-opacity:1!important;border-top-color:rgb(218 230 240/var(--tw-border-opacity))!important}.bg-white{--tw-bg-opacity:1!important;background-color:rgb(255 255 255/var(--tw-bg-opacity))!important}.p-4{padding:1rem!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.py-24{padding-bottom:6rem!important;padding-top:6rem!important}.pl-0{padding-left:0!important}.pr-0{padding-right:0!important}.text-center{text-align:center!important}.text-2xl{font-size:1.5rem!important;line-height:2rem!important}.text-3xl{font-size:1.875rem!important;line-height:2.25rem!important}.text-4xl{font-size:2.25rem!important;line-height:2.5rem!important}.text-5xl{font-size:3rem!important}.text-5xl,.text-6xl{line-height:1!important}.text-6xl{font-size:3.75rem!important}.text-base{font-size:1rem!important;line-height:1.5rem!important}.text-lg{font-size:1.125rem!important;line-height:1.75rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-xl{font-size:1.25rem!important;line-height:1.75rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.text-xxs{font-size:.6875rem!important}.font-semibold{font-weight:600!important}.text-negative{color:rgb(185 30 40/var(--tw-text-opacity))!important}.text-negative,.text-negative-light{--tw-text-opacity:1!important}.text-negative-light{color:rgb(255 204 211/var(--tw-text-opacity))!important}.text-storm-dark{color:rgb(39 40 56/var(--tw-text-opacity))!important}.text-storm-dark,.text-storm-medium{--tw-text-opacity:1!important}.text-storm-medium{color:rgb(128 130 158/var(--tw-text-opacity))!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}.blur{--tw-blur:blur(8px)!important}.blur,.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}:host{--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;background-color:rgb(255 255 255/var(--tw-bg-opacity));border-radius:.375rem;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;width:100%}.max-w-\\[20rem\\]{max-width:20rem!important}.w-1\\/12{width:8.333333%!important}.w-10\\/12{width:83.333333%!important}.w-11\\/12{width:91.666667%!important}.w-2\\/12{width:16.666667%!important}.w-3\\/12{width:25%!important}.w-4\\/12{width:33.333333%!important}.w-5\\/12{width:41.666667%!important}.w-6\\/12{width:50%!important}.w-7\\/12{width:58.333333%!important}.w-8\\/12{width:66.666667%!important}.w-9\\/12{width:75%!important}@media (min-width:40rem){.tablet\\:w-1\\/12{width:8.333333%!important}.tablet\\:w-10\\/12{width:83.333333%!important}.tablet\\:w-11\\/12{width:91.666667%!important}.tablet\\:w-2\\/12{width:16.666667%!important}.tablet\\:w-3\\/12{width:25%!important}.tablet\\:w-4\\/12{width:33.333333%!important}.tablet\\:w-5\\/12{width:41.666667%!important}.tablet\\:w-6\\/12{width:50%!important}.tablet\\:w-7\\/12{width:58.333333%!important}.tablet\\:w-8\\/12{width:66.666667%!important}.tablet\\:w-9\\/12{width:75%!important}}@media (min-width:64rem){.desktop-xs\\:w-1\\/12{width:8.333333%!important}.desktop-xs\\:w-10\\/12{width:83.333333%!important}.desktop-xs\\:w-11\\/12{width:91.666667%!important}.desktop-xs\\:w-2\\/12{width:16.666667%!important}.desktop-xs\\:w-3\\/12{width:25%!important}.desktop-xs\\:w-4\\/12{width:33.333333%!important}.desktop-xs\\:w-5\\/12{width:41.666667%!important}.desktop-xs\\:w-6\\/12{width:50%!important}.desktop-xs\\:w-7\\/12{width:58.333333%!important}.desktop-xs\\:w-8\\/12{width:66.666667%!important}.desktop-xs\\:w-9\\/12{width:75%!important}}@media (min-width:80rem){.desktop-sm\\:w-1\\/12{width:8.333333%!important}.desktop-sm\\:w-10\\/12{width:83.333333%!important}.desktop-sm\\:w-11\\/12{width:91.666667%!important}.desktop-sm\\:w-2\\/12{width:16.666667%!important}.desktop-sm\\:w-3\\/12{width:25%!important}.desktop-sm\\:w-4\\/12{width:33.333333%!important}.desktop-sm\\:w-5\\/12{width:41.666667%!important}.desktop-sm\\:w-6\\/12{width:50%!important}.desktop-sm\\:w-7\\/12{width:58.333333%!important}.desktop-sm\\:w-8\\/12{width:66.666667%!important}.desktop-sm\\:w-9\\/12{width:75%!important}}@media (min-width:85.375rem){.desktop\\:w-1\\/12{width:8.333333%!important}.desktop\\:w-10\\/12{width:83.333333%!important}.desktop\\:w-11\\/12{width:91.666667%!important}.desktop\\:w-2\\/12{width:16.666667%!important}.desktop\\:w-3\\/12{width:25%!important}.desktop\\:w-4\\/12{width:33.333333%!important}.desktop\\:w-5\\/12{width:41.666667%!important}.desktop\\:w-6\\/12{width:50%!important}.desktop\\:w-7\\/12{width:58.333333%!important}.desktop\\:w-8\\/12{width:66.666667%!important}.desktop\\:w-9\\/12{width:75%!important}}@media (min-width:90rem){.desktop-lg\\:w-1\\/12{width:8.333333%!important}.desktop-lg\\:w-10\\/12{width:83.333333%!important}.desktop-lg\\:w-11\\/12{width:91.666667%!important}.desktop-lg\\:w-2\\/12{width:16.666667%!important}.desktop-lg\\:w-3\\/12{width:25%!important}.desktop-lg\\:w-4\\/12{width:33.333333%!important}.desktop-lg\\:w-5\\/12{width:41.666667%!important}.desktop-lg\\:w-6\\/12{width:50%!important}.desktop-lg\\:w-7\\/12{width:58.333333%!important}.desktop-lg\\:w-8\\/12{width:66.666667%!important}.desktop-lg\\:w-9\\/12{width:75%!important}}@media (min-width:120rem){.desktop-xl\\:w-1\\/12{width:8.333333%!important}.desktop-xl\\:w-10\\/12{width:83.333333%!important}.desktop-xl\\:w-11\\/12{width:91.666667%!important}.desktop-xl\\:w-2\\/12{width:16.666667%!important}.desktop-xl\\:w-3\\/12{width:25%!important}.desktop-xl\\:w-4\\/12{width:33.333333%!important}.desktop-xl\\:w-5\\/12{width:41.666667%!important}.desktop-xl\\:w-6\\/12{width:50%!important}.desktop-xl\\:w-7\\/12{width:58.333333%!important}.desktop-xl\\:w-8\\/12{width:66.666667%!important}.desktop-xl\\:w-9\\/12{width:75%!important}}@media (min-width:64rem){.desktop-xs\\:flex{display:flex!important}}.w-3\\/4{width:75%!important}@media (min-width:64rem){.desktop-xs\\:hidden{display:none!important}.desktop-xs\\:w-auto{width:auto!important}.desktop-xs\\:flex-row{flex-direction:row!important}}.-rotate-0,.-rotate-135,.-rotate-180,.-rotate-225,.-rotate-25,.-rotate-270,.-rotate-315,.-rotate-45,.-rotate-90,.rotate-0,.rotate-135,.rotate-180,.rotate-225,.rotate-25,.rotate-270,.rotate-315,.rotate-45,.rotate-90,.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.text-lg,.text-xl{line-height:1.75rem!important}.hover\\:text-negative:hover{--tw-text-opacity:1!important;color:rgb(185 30 40/var(--tw-text-opacity))!important}.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}";
+
+const TableContainer = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+  }
+  render() {
+    return (h(Host, { class: "p-table-container" }, h("slot", null)));
+  }
+  static get style() { return tableContainerComponentCss; }
+}, [1, "p-table-container"]);
+function defineCustomElement() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["p-table-container"];
+  components.forEach(tagName => { switch (tagName) {
+    case "p-table-container":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, TableContainer);
+      }
+      break;
+  } });
+}
+
+export { TableContainer as T, defineCustomElement as d };
+
+//# sourceMappingURL=table-container.component.js.map

package/dist/components/table-container.component.js.map

@@ -0,0 +1 @@
+{"file":"table-container.component.js","mappings":";;AAAA,MAAM,0BAA0B,GAAG,i9YAAi9Y;;MCOv+Y,cAAc;;;;;;EACvB,MAAM;IACF,QACI,EAAC,IAAI,IAAC,KAAK,EAAC,mBAAmB,IAC3B,eAAQ,CACL,EACT;GACL;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/atoms/table-container/table-container.component.scss?tag=p-table-container&encapsulation=shadow","./src/components/atoms/table-container/table-container.component.tsx"],"sourcesContent":[":host {\n    @apply flex flex-col w-full;\n    @apply bg-white rounded-large;\n    @apply shadow-4 #{!important};\n}\n","import { Component, h, Host } from '@stencil/core';\n\n@Component({\n    tag: 'p-table-container',\n    styleUrl: 'table-container.component.scss',\n    shadow: true,\n})\nexport class TableContainer {\n    render() {\n        return (\n            <Host class=\"p-table-container\">\n                <slot />\n            </Host>\n        );\n    }\n}\n"],"version":3}

package/dist/components/table-footer.component.js

@@ -0,0 +1,129 @@
+import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
+import { f as formatTranslation, g as getLocaleComponentStrings } from './localization.js';
+import { a as defaultSize, b as defaultSizeOptions, d as defineCustomElement$3 } from './page-size-select.component.js';
+import { d as defineCustomElement$9 } from './button.component.js';
+import { d as defineCustomElement$8 } from './dropdown.component.js';
+import { d as defineCustomElement$7 } from './dropdown-menu-container.component.js';
+import { d as defineCustomElement$6 } from './dropdown-menu-item.component.js';
+import { d as defineCustomElement$5 } from './icon.component.js';
+import { d as defineCustomElement$4 } from './loader.component.js';
+import { d as defineCustomElement$2 } from './pagination.component.js';
+import { d as defineCustomElement$1 } from './pagination-item.component.js';
+
+const tableFooterComponentCss = ".visible{visibility:visible!important}.static{position:static!important}.fixed{position:fixed!important}.absolute{position:absolute!important}.bottom-0{bottom:0!important}.left-0{left:0!important}.m-0{margin:0!important}.mb-14{margin-bottom:3.5rem!important}.mb-6{margin-bottom:1.5rem!important}.ml-1{margin-left:.25rem!important}.ml-2{margin-left:.5rem!important}.block{display:block!important}.inline{display:inline!important}.flex{display:flex!important}.table{display:table!important}.table-cell{display:table-cell!important}.table-row{display:table-row!important}.grid{display:grid!important}.hidden{display:none!important}.h-6{height:1.5rem!important}.h-8{height:2rem!important}.w-1{width:.25rem!important}.w-10{width:2.5rem!important}.w-11{width:2.75rem!important}.w-2{width:.5rem!important}.w-3{width:.75rem!important}.w-4{width:1rem!important}.w-5{width:1.25rem!important}.w-6{width:1.5rem!important}.w-7{width:1.75rem!important}.w-8{width:2rem!important}.w-9{width:2.25rem!important}.w-auto{width:auto!important}.w-full{width:100%!important}.flex-1{flex:1 1 0%!important}.-rotate-0{--tw-rotate:-0deg!important}.-rotate-0,.-rotate-135{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}.-rotate-135{--tw-rotate:-135deg!important}.-rotate-180{--tw-rotate:-180deg!important}.-rotate-180,.-rotate-225{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}.-rotate-225{--tw-rotate:-225deg!important}.-rotate-25{--tw-rotate:-25deg!important}.-rotate-25,.-rotate-270{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}.-rotate-270{--tw-rotate:-270deg!important}.-rotate-315{--tw-rotate:-315deg!important}.-rotate-315,.-rotate-45{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}.-rotate-45{--tw-rotate:-45deg!important}.-rotate-90{--tw-rotate:-90deg!important}.-rotate-90,.rotate-0{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}.rotate-0{--tw-rotate:0deg!important}.rotate-135{--tw-rotate:135deg!important}.rotate-135,.rotate-180{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}.rotate-180{--tw-rotate:180deg!important}.rotate-225{--tw-rotate:225deg!important}.rotate-225,.rotate-25{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}.rotate-25{--tw-rotate:25deg!important}.rotate-270{--tw-rotate:270deg!important}.rotate-270,.rotate-315{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}.rotate-315{--tw-rotate:315deg!important}.rotate-45{--tw-rotate:45deg!important}.rotate-45,.rotate-90{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}.rotate-90{--tw-rotate:90deg!important}.scale-x-flip{--tw-scale-x:-1!important}.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.scale-y-flip{--tw-scale-y:-1!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}.cursor-pointer{cursor:pointer!important}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))!important}.flex-col{flex-direction:column!important}.items-end{align-items:flex-end!important}.items-center{align-items:center!important}.justify-start{justify-content:flex-start!important}.justify-end{justify-content:flex-end!important}.justify-center{justify-content:center!important}.justify-between{justify-content:space-between!important}.gap-4{gap:1rem!important}.self-center{align-self:center!important}.justify-self-end{justify-self:end!important}.justify-self-center{justify-self:center!important}.rounded{border-radius:.25rem!important}.rounded-bl-none{border-bottom-left-radius:0!important}.rounded-br-none{border-bottom-right-radius:0!important}.rounded-tl-none{border-top-left-radius:0!important}.rounded-tr-none{border-top-right-radius:0!important}.border{border-width:1px!important}.border-l-0{border-left-width:0!important}.border-r-0{border-right-width:0!important}.border-solid{border-style:solid!important}.border-transparent{border-color:transparent!important}.border-t-mystic-dark{--tw-border-opacity:1!important;border-top-color:rgb(218 230 240/var(--tw-border-opacity))!important}.bg-white{--tw-bg-opacity:1!important;background-color:rgb(255 255 255/var(--tw-bg-opacity))!important}.p-4{padding:1rem!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.py-24{padding-bottom:6rem!important;padding-top:6rem!important}.pl-0{padding-left:0!important}.pr-0{padding-right:0!important}.text-center{text-align:center!important}.text-2xl{font-size:1.5rem!important;line-height:2rem!important}.text-3xl{font-size:1.875rem!important;line-height:2.25rem!important}.text-4xl{font-size:2.25rem!important;line-height:2.5rem!important}.text-5xl{font-size:3rem!important}.text-5xl,.text-6xl{line-height:1!important}.text-6xl{font-size:3.75rem!important}.text-base{font-size:1rem!important;line-height:1.5rem!important}.text-lg{font-size:1.125rem!important;line-height:1.75rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-xl{font-size:1.25rem!important;line-height:1.75rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.text-xxs{font-size:.6875rem!important}.font-semibold{font-weight:600!important}.text-negative{color:rgb(185 30 40/var(--tw-text-opacity))!important}.text-negative,.text-negative-light{--tw-text-opacity:1!important}.text-negative-light{color:rgb(255 204 211/var(--tw-text-opacity))!important}.text-storm-dark{color:rgb(39 40 56/var(--tw-text-opacity))!important}.text-storm-dark,.text-storm-medium{--tw-text-opacity:1!important}.text-storm-medium{color:rgb(128 130 158/var(--tw-text-opacity))!important}.blur{--tw-blur:blur(8px)!important}.blur,.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}:host{display:grid;gap:1rem;grid-template-columns:repeat(1,minmax(0,1fr));padding:1.5rem;width:100%}:host>p-pagination{display:flex;grid-column-start:1;justify-self:center}:host>p-loader{grid-column-start:1}@media (min-width:64rem){:host{grid-template-areas:\"page-size pagination export\";grid-template-columns:repeat(3,minmax(0,1fr))}:host>p-page-size-select{grid-column-start:1}:host>p-pagination{grid-column-start:2}:host>p-loader{grid-column-start:2}:host>p-button{grid-column-start:3;justify-self:end}}:host(.page-size-disabled.export-disabled){grid-template-columns:repeat(1,minmax(0,1fr))}:host(.page-size-disabled.export-disabled)>p-pagination{grid-column-start:1}.max-w-\\[20rem\\]{max-width:20rem!important}.w-1\\/12{width:8.333333%!important}.w-10\\/12{width:83.333333%!important}.w-11\\/12{width:91.666667%!important}.w-2\\/12{width:16.666667%!important}.w-3\\/12{width:25%!important}.w-4\\/12{width:33.333333%!important}.w-5\\/12{width:41.666667%!important}.w-6\\/12{width:50%!important}.w-7\\/12{width:58.333333%!important}.w-8\\/12{width:66.666667%!important}.w-9\\/12{width:75%!important}@media (min-width:40rem){.tablet\\:w-1\\/12{width:8.333333%!important}.tablet\\:w-10\\/12{width:83.333333%!important}.tablet\\:w-11\\/12{width:91.666667%!important}.tablet\\:w-2\\/12{width:16.666667%!important}.tablet\\:w-3\\/12{width:25%!important}.tablet\\:w-4\\/12{width:33.333333%!important}.tablet\\:w-5\\/12{width:41.666667%!important}.tablet\\:w-6\\/12{width:50%!important}.tablet\\:w-7\\/12{width:58.333333%!important}.tablet\\:w-8\\/12{width:66.666667%!important}.tablet\\:w-9\\/12{width:75%!important}}@media (min-width:64rem){.desktop-xs\\:w-1\\/12{width:8.333333%!important}.desktop-xs\\:w-10\\/12{width:83.333333%!important}.desktop-xs\\:w-11\\/12{width:91.666667%!important}.desktop-xs\\:w-2\\/12{width:16.666667%!important}.desktop-xs\\:w-3\\/12{width:25%!important}.desktop-xs\\:w-4\\/12{width:33.333333%!important}.desktop-xs\\:w-5\\/12{width:41.666667%!important}.desktop-xs\\:w-6\\/12{width:50%!important}.desktop-xs\\:w-7\\/12{width:58.333333%!important}.desktop-xs\\:w-8\\/12{width:66.666667%!important}.desktop-xs\\:w-9\\/12{width:75%!important}}@media (min-width:80rem){.desktop-sm\\:w-1\\/12{width:8.333333%!important}.desktop-sm\\:w-10\\/12{width:83.333333%!important}.desktop-sm\\:w-11\\/12{width:91.666667%!important}.desktop-sm\\:w-2\\/12{width:16.666667%!important}.desktop-sm\\:w-3\\/12{width:25%!important}.desktop-sm\\:w-4\\/12{width:33.333333%!important}.desktop-sm\\:w-5\\/12{width:41.666667%!important}.desktop-sm\\:w-6\\/12{width:50%!important}.desktop-sm\\:w-7\\/12{width:58.333333%!important}.desktop-sm\\:w-8\\/12{width:66.666667%!important}.desktop-sm\\:w-9\\/12{width:75%!important}}@media (min-width:85.375rem){.desktop\\:w-1\\/12{width:8.333333%!important}.desktop\\:w-10\\/12{width:83.333333%!important}.desktop\\:w-11\\/12{width:91.666667%!important}.desktop\\:w-2\\/12{width:16.666667%!important}.desktop\\:w-3\\/12{width:25%!important}.desktop\\:w-4\\/12{width:33.333333%!important}.desktop\\:w-5\\/12{width:41.666667%!important}.desktop\\:w-6\\/12{width:50%!important}.desktop\\:w-7\\/12{width:58.333333%!important}.desktop\\:w-8\\/12{width:66.666667%!important}.desktop\\:w-9\\/12{width:75%!important}}@media (min-width:90rem){.desktop-lg\\:w-1\\/12{width:8.333333%!important}.desktop-lg\\:w-10\\/12{width:83.333333%!important}.desktop-lg\\:w-11\\/12{width:91.666667%!important}.desktop-lg\\:w-2\\/12{width:16.666667%!important}.desktop-lg\\:w-3\\/12{width:25%!important}.desktop-lg\\:w-4\\/12{width:33.333333%!important}.desktop-lg\\:w-5\\/12{width:41.666667%!important}.desktop-lg\\:w-6\\/12{width:50%!important}.desktop-lg\\:w-7\\/12{width:58.333333%!important}.desktop-lg\\:w-8\\/12{width:66.666667%!important}.desktop-lg\\:w-9\\/12{width:75%!important}}@media (min-width:120rem){.desktop-xl\\:w-1\\/12{width:8.333333%!important}.desktop-xl\\:w-10\\/12{width:83.333333%!important}.desktop-xl\\:w-11\\/12{width:91.666667%!important}.desktop-xl\\:w-2\\/12{width:16.666667%!important}.desktop-xl\\:w-3\\/12{width:25%!important}.desktop-xl\\:w-4\\/12{width:33.333333%!important}.desktop-xl\\:w-5\\/12{width:41.666667%!important}.desktop-xl\\:w-6\\/12{width:50%!important}.desktop-xl\\:w-7\\/12{width:58.333333%!important}.desktop-xl\\:w-8\\/12{width:66.666667%!important}.desktop-xl\\:w-9\\/12{width:75%!important}}@media (min-width:64rem){.desktop-xs\\:flex{display:flex!important}}.w-3\\/4{width:75%!important}@media (min-width:64rem){.desktop-xs\\:hidden{display:none!important}.desktop-xs\\:w-auto{width:auto!important}.desktop-xs\\:flex-row{flex-direction:row!important}}.-rotate-0,.-rotate-135,.-rotate-180,.-rotate-225,.-rotate-25,.-rotate-270,.-rotate-315,.-rotate-45,.-rotate-90,.rotate-0,.rotate-135,.rotate-180,.rotate-225,.rotate-25,.rotate-270,.rotate-315,.rotate-45,.rotate-90,.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.text-lg,.text-xl{line-height:1.75rem!important}.hover\\:text-negative:hover{--tw-text-opacity:1!important;color:rgb(185 30 40/var(--tw-text-opacity))!important}.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}";
+
+const TableFooter = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    this.pageChange = createEvent(this, "pageChange", 7);
+    this.pageSizeChange = createEvent(this, "pageSizeChange", 7);
+    this.export = createEvent(this, "export", 7);
+    this.enablePageSize = true;
+    this.enablePagination = true;
+    this.enableExport = true;
+    this.loading = false;
+    this.page = 1;
+    this.total = undefined;
+    this.pageSize = defaultSize;
+    this.pageSizeOptions = defaultSizeOptions;
+    this.hideOnSinglePage = true;
+    this._locales = {};
+  }
+  componentWillLoad() {
+    this._setLocales();
+  }
+  render() {
+    var _a;
+    const hidePageSizeSelect = this.hideOnSinglePage && this.total < ((_a = this.pageSizeOptions) === null || _a === void 0 ? void 0 : _a[0]);
+    return (h(Host, { class: `p-table-footer ${!this.enablePageSize && 'page-size-disabled'} ${!this.enablePagination && 'pagination-disabled'} ${!this.enableExport && 'export-disabled'}` }, !this.loading &&
+      this.enablePagination &&
+      this.enablePageSize && (h("p-page-size-select", { class: !hidePageSizeSelect && 'hidden desktop-xs:flex', hidden: hidePageSizeSelect, size: this.pageSize, sizeOptions: this.pageSizeOptions, onSizeChange: ({ detail }) => this._changePageSize(detail) })), this.loading && (h("p-loader", { variant: "ghost", class: "rounded w-full h-8" })), !this.loading && this.enablePagination && (h("p-pagination", { pageSize: this.pageSize, total: this.total, page: this.page, hideOnSinglePage: this.hideOnSinglePage, onPageChange: ({ detail }) => this.pageChange.emit(detail) })), !this.loading && this.enableExport && (h("p-button", { class: "hidden desktop-xs:flex", variant: "secondary", size: "small", icon: "download", onClick: () => this.export.emit() }, formatTranslation(this._locales.export)))));
+  }
+  async _setLocales() {
+    this._locales = await getLocaleComponentStrings(this._el);
+  }
+  _changePageSize(s) {
+    if (!s) {
+      return;
+    }
+    this.pageSize = s;
+    this.pageSizeChange.emit(this.pageSize);
+  }
+  get _el() { return this; }
+  static get style() { return tableFooterComponentCss; }
+}, [1, "p-table-footer", {
+    "enablePageSize": [4, "enable-page-size"],
+    "enablePagination": [4, "enable-pagination"],
+    "enableExport": [4, "enable-export"],
+    "loading": [4],
+    "page": [1538],
+    "total": [2],
+    "pageSize": [2, "page-size"],
+    "pageSizeOptions": [16],
+    "hideOnSinglePage": [4, "hide-on-single-page"],
+    "_locales": [32]
+  }, [[16, "localeChanged", "_setLocales"]]]);
+function defineCustomElement() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["p-table-footer", "p-button", "p-dropdown", "p-dropdown-menu-container", "p-dropdown-menu-item", "p-icon", "p-loader", "p-page-size-select", "p-pagination", "p-pagination-item"];
+  components.forEach(tagName => { switch (tagName) {
+    case "p-table-footer":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, TableFooter);
+      }
+      break;
+    case "p-button":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$9();
+      }
+      break;
+    case "p-dropdown":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$8();
+      }
+      break;
+    case "p-dropdown-menu-container":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$7();
+      }
+      break;
+    case "p-dropdown-menu-item":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$6();
+      }
+      break;
+    case "p-icon":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$5();
+      }
+      break;
+    case "p-loader":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$4();
+      }
+      break;
+    case "p-page-size-select":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$3();
+      }
+      break;
+    case "p-pagination":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$2();
+      }
+      break;
+    case "p-pagination-item":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$1();
+      }
+      break;
+  } });
+}
+
+export { TableFooter as T, defineCustomElement as d };
+
+//# sourceMappingURL=table-footer.component.js.map

package/dist/components/table-footer.component.js.map

@@ -0,0 +1 @@
+{"file":"table-footer.component.js","mappings":";;;;;;;;;;;;AAAA,MAAM,uBAAuB,GAAG,w9YAAw9Y;;MCsB3+Y,WAAW;;;;;;;;0BAIc,IAAI;4BAKF,IAAI;wBAKR,IAAI;mBAKT,KAAK;gBAKuB,CAAC;;oBAe7B,WAAW;2BAKF,kBAAkB;4BAelB,IAAI;oBAUP,EAAE;;EAEnC,iBAAiB;IACb,IAAI,CAAC,WAAW,EAAE,CAAC;GACtB;EAED,MAAM;;IACF,MAAM,kBAAkB,GACpB,IAAI,CAAC,gBAAgB,IAAI,IAAI,CAAC,KAAK,IAAG,MAAA,IAAI,CAAC,eAAe,0CAAG,CAAC,CAAC,CAAA,CAAC;IACpE,QACI,EAAC,IAAI,IACD,KAAK,EAAE,kBACH,CAAC,IAAI,CAAC,cAAc,IAAI,oBAC5B,IAAI,CAAC,IAAI,CAAC,gBAAgB,IAAI,qBAAqB,IAC/C,CAAC,IAAI,CAAC,YAAY,IAAI,iBAC1B,EAAE,IAED,CAAC,IAAI,CAAC,OAAO;MACV,IAAI,CAAC,gBAAgB;MACrB,IAAI,CAAC,cAAc,KACf,0BACI,KAAK,EACD,CAAC,kBAAkB,IAAI,wBAAwB,EAEnD,MAAM,EAAE,kBAAkB,EAC1B,IAAI,EAAE,IAAI,CAAC,QAAQ,EACnB,WAAW,EAAE,IAAI,CAAC,eAAe,EACjC,YAAY,EAAE,CAAC,EAAE,MAAM,EAAE,KACrB,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,GAElC,CACL,EAEJ,IAAI,CAAC,OAAO,KACT,gBACI,OAAO,EAAC,OAAO,EACf,KAAK,EAAC,oBAAoB,GAClB,CACf,EAEA,CAAC,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,gBAAgB,KACnC,oBACI,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,gBAAgB,EAAE,IAAI,CAAC,gBAAgB,EACvC,YAAY,EAAE,CAAC,EAAE,MAAM,EAAE,KACrB,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,MAAM,CAAC,GAElC,CACL,EACA,CAAC,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,YAAY,KAC/B,gBACI,KAAK,EAAC,wBAAwB,EAC9B,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,OAAO,EACZ,IAAI,EAAC,UAAU,EACf,OAAO,EAAE,MAAM,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,IAEhC,iBAAiB,CAAC,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,CACjC,CACd,CACE,EACT;GACL;EAGO,MAAM,WAAW;IACrB,IAAI,CAAC,QAAQ,GAAG,MAAM,yBAAyB,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;GAC7D;EAEO,eAAe,CAAC,CAAU;IAC9B,IAAI,CAAC,CAAC,EAAE;MACJ,OAAO;KACV;IAED,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC;IAClB,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;GAC3C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/molecules/table-footer/table-footer.component.scss?tag=p-table-footer&encapsulation=shadow","./src/components/molecules/table-footer/table-footer.component.tsx"],"sourcesContent":[":host {\n    @apply grid grid-cols-1 gap-4;\n    @apply w-full;\n    @apply p-6;\n\n    > p-pagination {\n        @apply flex justify-self-center col-start-1;\n    }\n\n    > p-loader {\n        @apply col-start-1;\n    }\n\n    @screen desktop-xs {\n        @apply grid-cols-3;\n        grid-template-areas: 'page-size pagination export';\n\n        > p-page-size-select {\n            @apply col-start-1;\n        }\n\n        > p-pagination {\n            @apply col-start-2;\n        }\n\n        > p-loader {\n            @apply col-start-2;\n        }\n\n        > p-button {\n            @apply justify-self-end col-start-3;\n        }\n    }\n}\n\n:host(.page-size-disabled.export-disabled) {\n    @apply grid-cols-1;\n\n    > p-pagination {\n        @apply col-start-1;\n    }\n}\n","import {\n    Component,\n    Element,\n    Event,\n    EventEmitter,\n    h,\n    Host,\n    Listen,\n    Prop,\n    State,\n} from '@stencil/core';\nimport {\n    formatTranslation,\n    getLocaleComponentStrings,\n} from '../../../utils/localization';\nimport { defaultSize, defaultSizeOptions } from '../page-size-select/constants';\n\n@Component({\n    tag: 'p-table-footer',\n    styleUrl: 'table-footer.component.scss',\n    shadow: true,\n})\nexport class TableFooter {\n    /**\n     * Wether to enable page size select\n     */\n    @Prop() enablePageSize: boolean = true;\n\n    /**\n     * Wether to enable pagination\n     */\n    @Prop() enablePagination: boolean = true;\n\n    /**\n     * Wether to enable export\n     */\n    @Prop() enableExport: boolean = true;\n\n    /**\n     * Wether we want to show loading state\n     */\n    @Prop() loading: boolean = false;\n\n    /**\n     * The current page\n     */\n    @Prop({ mutable: true, reflect: true }) page: number = 1;\n\n    /**\n     * The total amount of items\n     */\n    @Prop() total!: number;\n\n    /**\n     * Event whenever the page changes\n     */\n    @Event() pageChange: EventEmitter<number>;\n\n    /**\n     * The amount of items per page\n     */\n    @Prop() pageSize: number = defaultSize;\n\n    /**\n     * The options for the page size\n     */\n    @Prop() pageSizeOptions: number[] = defaultSizeOptions;\n\n    /**\n     * Event whenever the page changes\n     */\n    @Event() pageSizeChange: EventEmitter<number>;\n\n    /**\n     * Event whenever the page changes\n     */\n    @Event() export: EventEmitter<number>;\n\n    /**\n     * Wether to hide when there is only 1 page available\n     */\n    @Prop() hideOnSinglePage: boolean = true;\n\n    /**\n     * The host element\n     */\n    @Element() private _el: HTMLElement;\n\n    /**\n     * Locales used for this component\n     */\n    @State() private _locales: any = {};\n\n    componentWillLoad() {\n        this._setLocales();\n    }\n\n    render() {\n        const hidePageSizeSelect =\n            this.hideOnSinglePage && this.total < this.pageSizeOptions?.[0];\n        return (\n            <Host\n                class={`p-table-footer ${\n                    !this.enablePageSize && 'page-size-disabled'\n                } ${!this.enablePagination && 'pagination-disabled'} ${\n                    !this.enableExport && 'export-disabled'\n                }`}\n            >\n                {!this.loading &&\n                    this.enablePagination &&\n                    this.enablePageSize && (\n                        <p-page-size-select\n                            class={\n                                !hidePageSizeSelect && 'hidden desktop-xs:flex'\n                            }\n                            hidden={hidePageSizeSelect}\n                            size={this.pageSize}\n                            sizeOptions={this.pageSizeOptions}\n                            onSizeChange={({ detail }) =>\n                                this._changePageSize(detail)\n                            }\n                        />\n                    )}\n\n                {this.loading && (\n                    <p-loader\n                        variant=\"ghost\"\n                        class=\"rounded w-full h-8\"\n                    ></p-loader>\n                )}\n\n                {!this.loading && this.enablePagination && (\n                    <p-pagination\n                        pageSize={this.pageSize}\n                        total={this.total}\n                        page={this.page}\n                        hideOnSinglePage={this.hideOnSinglePage}\n                        onPageChange={({ detail }) =>\n                            this.pageChange.emit(detail)\n                        }\n                    />\n                )}\n                {!this.loading && this.enableExport && (\n                    <p-button\n                        class=\"hidden desktop-xs:flex\"\n                        variant=\"secondary\"\n                        size=\"small\"\n                        icon=\"download\"\n                        onClick={() => this.export.emit()}\n                    >\n                        {formatTranslation(this._locales.export)}\n                    </p-button>\n                )}\n            </Host>\n        );\n    }\n\n    @Listen('localeChanged', { target: 'body' })\n    private async _setLocales(): Promise<void> {\n        this._locales = await getLocaleComponentStrings(this._el);\n    }\n\n    private _changePageSize(s?: number) {\n        if (!s) {\n            return;\n        }\n\n        this.pageSize = s;\n        this.pageSizeChange.emit(this.pageSize);\n    }\n}\n"],"version":3}