@paperless/core 1.34.0 → 1.35.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (62) hide show
  1. package/CHANGELOG.md +19 -0
  2. package/dist/build/p-8873dc41.entry.js +2 -0
  3. package/dist/build/p-8873dc41.entry.js.map +1 -0
  4. package/dist/build/{p-daeadc69.entry.js → p-e4110d85.entry.js} +2 -2
  5. package/dist/build/p-e4110d85.entry.js.map +1 -0
  6. package/dist/{paperless/p-cda044a6.entry.js → build/p-e9d475ef.entry.js} +2 -2
  7. package/dist/build/p-e9d475ef.entry.js.map +1 -0
  8. package/dist/build/paperless.esm.js +1 -1
  9. package/dist/build/paperless.esm.js.map +1 -1
  10. package/dist/cjs/loader.cjs.js +1 -1
  11. package/dist/cjs/p-button_3.cjs.entry.js +2 -1
  12. package/dist/cjs/p-button_3.cjs.entry.js.map +1 -1
  13. package/dist/cjs/p-dropdown-menu-container.cjs.entry.js +2 -2
  14. package/dist/cjs/p-dropdown-menu-container.cjs.entry.js.map +1 -1
  15. package/dist/cjs/p-select.cjs.entry.js +1 -1
  16. package/dist/cjs/p-select.cjs.entry.js.map +1 -1
  17. package/dist/cjs/paperless.cjs.js +1 -1
  18. package/dist/collection/components/atoms/button/button.component.js +20 -1
  19. package/dist/collection/components/atoms/button/button.component.js.map +1 -1
  20. package/dist/collection/components/atoms/dropdown-menu-container/dropdown-menu-container.component.css +1 -1
  21. package/dist/collection/components/atoms/dropdown-menu-container/dropdown-menu-container.component.js +3 -3
  22. package/dist/collection/components/atoms/dropdown-menu-container/dropdown-menu-container.component.js.map +1 -1
  23. package/dist/collection/components/molecules/select/select.component.js +2 -2
  24. package/dist/collection/components/molecules/select/select.component.js.map +1 -1
  25. package/dist/components/button.component.js +3 -1
  26. package/dist/components/button.component.js.map +1 -1
  27. package/dist/components/dropdown-menu-container.component.js +2 -2
  28. package/dist/components/dropdown-menu-container.component.js.map +1 -1
  29. package/dist/components/p-select.js +1 -1
  30. package/dist/components/p-select.js.map +1 -1
  31. package/dist/esm/loader.js +1 -1
  32. package/dist/esm/p-button_3.entry.js +2 -1
  33. package/dist/esm/p-button_3.entry.js.map +1 -1
  34. package/dist/esm/p-dropdown-menu-container.entry.js +2 -2
  35. package/dist/esm/p-dropdown-menu-container.entry.js.map +1 -1
  36. package/dist/esm/p-select.entry.js +1 -1
  37. package/dist/esm/p-select.entry.js.map +1 -1
  38. package/dist/esm/paperless.js +1 -1
  39. package/dist/index.html +1 -1
  40. package/dist/paperless/p-8873dc41.entry.js +2 -0
  41. package/dist/paperless/p-8873dc41.entry.js.map +1 -0
  42. package/dist/paperless/{p-daeadc69.entry.js → p-e4110d85.entry.js} +2 -2
  43. package/dist/paperless/p-e4110d85.entry.js.map +1 -0
  44. package/dist/{build/p-cda044a6.entry.js → paperless/p-e9d475ef.entry.js} +2 -2
  45. package/dist/paperless/p-e9d475ef.entry.js.map +1 -0
  46. package/dist/paperless/paperless.esm.js +1 -1
  47. package/dist/paperless/paperless.esm.js.map +1 -1
  48. package/dist/sw.js +1 -1
  49. package/dist/sw.js.map +1 -1
  50. package/dist/types/components/atoms/button/button.component.d.ts +4 -0
  51. package/dist/types/components/atoms/dropdown-menu-container/dropdown-menu-container.component.d.ts +1 -1
  52. package/dist/types/components.d.ts +10 -2
  53. package/hydrate/index.js +6 -4
  54. package/package.json +1 -1
  55. package/dist/build/p-06c83915.entry.js +0 -2
  56. package/dist/build/p-06c83915.entry.js.map +0 -1
  57. package/dist/build/p-cda044a6.entry.js.map +0 -1
  58. package/dist/build/p-daeadc69.entry.js.map +0 -1
  59. package/dist/paperless/p-06c83915.entry.js +0 -2
  60. package/dist/paperless/p-06c83915.entry.js.map +0 -1
  61. package/dist/paperless/p-cda044a6.entry.js.map +0 -1
  62. package/dist/paperless/p-daeadc69.entry.js.map +0 -1
@@ -22,6 +22,10 @@ export declare class Button {
22
22
  * The size of the button
23
23
  */
24
24
  size: 'small' | 'medium';
25
+ /**
26
+ * The type of the button
27
+ */
28
+ type: 'button' | 'submit';
25
29
  /**
26
30
  * Wether to show a loader or not
27
31
  */
@@ -10,6 +10,6 @@ export declare class DropdownMenuContainer {
10
10
  /**
11
11
  * Wether the container should be scrollable when the threshold is met.
12
12
  */
13
- scrollable: boolean | 'default' | 'large';
13
+ scrollable: boolean | 'default' | 'large' | 'xlarge';
14
14
  render(): any;
15
15
  }
@@ -174,6 +174,10 @@ export namespace Components {
174
174
  * Target in case of "text" version
175
175
  */
176
176
  "target": string;
177
+ /**
178
+ * The type of the button
179
+ */
180
+ "type": 'button' | 'submit';
177
181
  /**
178
182
  * Wether the text variant has underline
179
183
  */
@@ -467,7 +471,7 @@ export namespace Components {
467
471
  /**
468
472
  * Wether the container should be scrollable when the threshold is met.
469
473
  */
470
- "scrollable": boolean | 'default' | 'large';
474
+ "scrollable": boolean | 'default' | 'large' | 'xlarge';
471
475
  }
472
476
  interface PDropdownMenuItem {
473
477
  /**
@@ -2218,6 +2222,10 @@ declare namespace LocalJSX {
2218
2222
  * Target in case of "text" version
2219
2223
  */
2220
2224
  "target"?: string;
2225
+ /**
2226
+ * The type of the button
2227
+ */
2228
+ "type"?: 'button' | 'submit';
2221
2229
  /**
2222
2230
  * Wether the text variant has underline
2223
2231
  */
@@ -2542,7 +2550,7 @@ declare namespace LocalJSX {
2542
2550
  /**
2543
2551
  * Wether the container should be scrollable when the threshold is met.
2544
2552
  */
2545
- "scrollable"?: boolean | 'default' | 'large';
2553
+ "scrollable"?: boolean | 'default' | 'large' | 'xlarge';
2546
2554
  }
2547
2555
  interface PDropdownMenuItem {
2548
2556
  /**
package/hydrate/index.js CHANGED
@@ -5989,6 +5989,7 @@ class Button {
5989
5989
  this.href = undefined;
5990
5990
  this.target = undefined;
5991
5991
  this.size = 'medium';
5992
+ this.type = 'button';
5992
5993
  this.loading = false;
5993
5994
  this.chevron = false;
5994
5995
  this.chevronPosition = 'end';
@@ -6011,7 +6012,7 @@ class Button {
6011
6012
  break;
6012
6013
  }
6013
6014
  const VariableTag = this.variant === 'text' ? 'a' : 'button';
6014
- return (hAsync(Host, { class: `p-button size-${this.size} ${this.iconOnly && 'has-icon-only'} ${this.chevron && 'has-chevron'}` }, hAsync(VariableTag, { class: `variant-${this.variant} icon-position-${this.iconPosition} chevron-position-${this.chevronPosition} ${this.inheritText && 'should-inherit-text'} ${this.underline && 'has-underline'}`, disabled: this.disabled, href: this.href, target: this.target }, this.chevron && this.chevronPosition === 'start' && (hAsync("p-icon", { class: "chevron", variant: "chevron", rotate: this.chevron === 'up' ? 180 : 0 })), this.icon &&
6015
+ return (hAsync(Host, { class: `p-button size-${this.size} ${this.iconOnly && 'has-icon-only'} ${this.chevron && 'has-chevron'}` }, hAsync(VariableTag, { class: `variant-${this.variant} icon-position-${this.iconPosition} chevron-position-${this.chevronPosition} ${this.inheritText && 'should-inherit-text'} ${this.underline && 'has-underline'}`, disabled: this.disabled, href: this.href, type: this.variant !== 'text' ? this.type : undefined, target: this.target }, this.chevron && this.chevronPosition === 'start' && (hAsync("p-icon", { class: "chevron", variant: "chevron", rotate: this.chevron === 'up' ? 180 : 0 })), this.icon &&
6015
6016
  this.iconPosition === 'start' &&
6016
6017
  !(this.iconOnly && this.loading) &&
6017
6018
  this._getIcon(), hAsync("slot", null), this.icon &&
@@ -6042,6 +6043,7 @@ class Button {
6042
6043
  "href": [1],
6043
6044
  "target": [1],
6044
6045
  "size": [1],
6046
+ "type": [1],
6045
6047
  "loading": [4],
6046
6048
  "chevron": [8],
6047
6049
  "chevronPosition": [1, "chevron-position"],
@@ -19638,7 +19640,7 @@ class Dropdown {
19638
19640
  }; }
19639
19641
  }
19640
19642
 
19641
- const dropdownMenuContainerComponentCss = ".z-10{z-index:10!important}.flex{display:flex!important}.hidden{display:none!important}.max-h-\\[11\\.5rem\\]{max-height:11.5rem!important}.max-h-\\[20rem\\]{max-height:20rem!important}.w-full{width:100%!important}.max-w-\\[222px\\]{max-width:222px!important}.flex-col{flex-direction:column!important}.gap-\\[1px\\]{gap:1px!important}.overflow-y-auto{overflow-y:auto!important}.overflow-x-hidden{overflow-x:hidden!important}.rounded-xxlarge{border-radius:.75rem!important}.drop-shadow-4{--tw-drop-shadow:drop-shadow(0px 0.3125rem 1rem rgba(0,24,98,.08)) drop-shadow(0px 0.0625rem 0.1875rem rgba(0,24,98,.13))!important}.drop-shadow-4,.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}*{box-sizing:border-box}p-dropdown-menu-container{--tw-bg-opacity:1;--tw-drop-shadow:drop-shadow(0px 0.3125rem 1rem rgba(0,24,98,.08)) drop-shadow(0px 0.0625rem 0.1875rem rgba(0,24,98,.13));background-color:rgb(255 255 255/var(--tw-bg-opacity));border-radius:.75rem;filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);overflow-x:hidden;overflow-y:auto;width:auto;z-index:10}p-dropdown-menu-container .content{display:flex;flex-direction:column;gap:1px;padding:.5rem;width:100%}p-dropdown-menu-container.full-width{width:100%}p-dropdown-menu-container.max-width{max-width:222px}p-dropdown-menu-container.scrollable{max-height:11.5rem;scrollbar-width:none}p-dropdown-menu-container.scrollable::-webkit-scrollbar{display:none}p-dropdown-menu-container.scrollable .content{height:100%}p-dropdown-menu-container.scrollable.scrollable-large{max-height:20rem}.static{position:static!important}";
19643
+ const dropdownMenuContainerComponentCss = ".z-10{z-index:10!important}.flex{display:flex!important}.hidden{display:none!important}.max-h-\\[11\\.5rem\\]{max-height:11.5rem!important}.max-h-\\[13\\.875rem\\]{max-height:13.875rem!important}.max-h-\\[20rem\\]{max-height:20rem!important}.w-full{width:100%!important}.max-w-\\[222px\\]{max-width:222px!important}.flex-col{flex-direction:column!important}.gap-\\[1px\\]{gap:1px!important}.overflow-y-auto{overflow-y:auto!important}.overflow-x-hidden{overflow-x:hidden!important}.rounded-xxlarge{border-radius:.75rem!important}.drop-shadow-4{--tw-drop-shadow:drop-shadow(0px 0.3125rem 1rem rgba(0,24,98,.08)) drop-shadow(0px 0.0625rem 0.1875rem rgba(0,24,98,.13))!important}.drop-shadow-4,.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}*{box-sizing:border-box}p-dropdown-menu-container{--tw-bg-opacity:1;--tw-drop-shadow:drop-shadow(0px 0.3125rem 1rem rgba(0,24,98,.08)) drop-shadow(0px 0.0625rem 0.1875rem rgba(0,24,98,.13));background-color:rgb(255 255 255/var(--tw-bg-opacity));border-radius:.75rem;filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);overflow-x:hidden;overflow-y:auto;width:auto;z-index:10}p-dropdown-menu-container .content{display:flex;flex-direction:column;gap:1px;padding:.5rem;width:100%}p-dropdown-menu-container.full-width{width:100%}p-dropdown-menu-container.max-width{max-width:222px}p-dropdown-menu-container.scrollable{max-height:11.5rem;scrollbar-width:none}p-dropdown-menu-container.scrollable::-webkit-scrollbar{display:none}p-dropdown-menu-container.scrollable .content{height:100%}p-dropdown-menu-container.scrollable.scrollable-large{max-height:13.875rem}p-dropdown-menu-container.scrollable.scrollable-xlarge{max-height:20rem}.static{position:static!important}";
19642
19644
 
19643
19645
  class DropdownMenuContainer {
19644
19646
  constructor(hostRef) {
@@ -19648,7 +19650,7 @@ class DropdownMenuContainer {
19648
19650
  this.scrollable = false;
19649
19651
  }
19650
19652
  render() {
19651
- return (hAsync(Host, { class: `p-dropdown-menu-container ${this.maxWidth && 'max-width'} ${this.fullWidth && 'full-width'} ${!!this.scrollable && 'scrollable'} ${this.scrollable === 'large' ? 'scrollable-large' : ''}` }, hAsync("div", { class: "content" }, hAsync("slot", null))));
19653
+ return (hAsync(Host, { class: `p-dropdown-menu-container ${this.maxWidth && 'max-width'} ${this.fullWidth && 'full-width'} ${!!this.scrollable && 'scrollable'} ${this.scrollable === 'large' ? 'scrollable-large' : ''} ${this.scrollable === 'xlarge' ? 'scrollable-xlarge' : ''}` }, hAsync("div", { class: "content" }, hAsync("slot", null))));
19652
19654
  }
19653
19655
  static get style() { return dropdownMenuContainerComponentCss; }
19654
19656
  static get cmpMeta() { return {
@@ -20993,7 +20995,7 @@ class Select {
20993
20995
  }
20994
20996
  render() {
20995
20997
  var _a, _b, _c;
20996
- return (hAsync(Host, { class: "p-select" }, hAsync("p-dropdown", { disableTriggerClick: true, calculateWidth: true, insideClick: true, scrollable: true, show: this._showDropdown, onIsOpen: (ev) => this._onDropdownOpen(ev) }, hAsync("p-input-group", { slot: "trigger", icon: this.icon, size: this.size, prefix: this.prefix, label: this.label, helper: this.helper, required: this.required, error: this.error, disabled: this.disabled, focused: this._showDropdown, forceShowTooltip: ((_a = this.error) === null || _a === void 0 ? void 0 : _a.length) && this._showDropdown }, hAsync("input", { slot: "input", type: "text", placeholder: this.placeholder, value: this.multi && ((_b = this._displayValue) === null || _b === void 0 ? void 0 : _b.length)
20998
+ return (hAsync(Host, { class: "p-select" }, hAsync("p-dropdown", { disableTriggerClick: true, calculateWidth: true, insideClick: true, scrollable: this.enableAutocomplete ? 'large' : true, show: this._showDropdown, onIsOpen: (ev) => this._onDropdownOpen(ev) }, hAsync("p-input-group", { slot: "trigger", icon: this.icon, size: this.size, prefix: this.prefix, label: this.label, helper: this.helper, required: this.required, error: this.error, disabled: this.disabled, focused: this._showDropdown, forceShowTooltip: ((_a = this.error) === null || _a === void 0 ? void 0 : _a.length) && this._showDropdown }, hAsync("input", { slot: "input", type: "text", placeholder: this.placeholder, value: this.multi && ((_b = this._displayValue) === null || _b === void 0 ? void 0 : _b.length)
20997
20999
  ? ' '
20998
21000
  : this._displayValue, class: "p-input cursor-pointer read-only", onFocus: (ev) => this._onFocus(ev), onMouseDown: (ev) => this._onMouseDown(ev), onClick: () => this._onClick(), ref: (ref) => (this._inputRef = ref) }), this.showChevron && (hAsync("p-icon", { variant: "chevron", slot: "suffix" }))), hAsync("div", { slot: "items" }, this.loading
20999
21001
  ? this._getLoadingItems()
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@paperless/core",
3
- "version": "1.34.0",
3
+ "version": "1.35.0",
4
4
  "description": "Stencil Component Starter",
5
5
  "main": "dist/index.cjs.js",
6
6
  "module": "dist/index.js",
@@ -1,2 +0,0 @@
1
- import{r,h as t,H as o}from"./p-e4d5e7a7.js";const a=".z-10{z-index:10!important}.flex{display:flex!important}.hidden{display:none!important}.max-h-\\[11\\.5rem\\]{max-height:11.5rem!important}.max-h-\\[20rem\\]{max-height:20rem!important}.w-full{width:100%!important}.max-w-\\[222px\\]{max-width:222px!important}.flex-col{flex-direction:column!important}.gap-\\[1px\\]{gap:1px!important}.overflow-y-auto{overflow-y:auto!important}.overflow-x-hidden{overflow-x:hidden!important}.rounded-xxlarge{border-radius:.75rem!important}.drop-shadow-4{--tw-drop-shadow:drop-shadow(0px 0.3125rem 1rem rgba(0,24,98,.08)) drop-shadow(0px 0.0625rem 0.1875rem rgba(0,24,98,.13))!important}.drop-shadow-4,.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}*{box-sizing:border-box}p-dropdown-menu-container{--tw-bg-opacity:1;--tw-drop-shadow:drop-shadow(0px 0.3125rem 1rem rgba(0,24,98,.08)) drop-shadow(0px 0.0625rem 0.1875rem rgba(0,24,98,.13));background-color:rgb(255 255 255/var(--tw-bg-opacity));border-radius:.75rem;filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);overflow-x:hidden;overflow-y:auto;width:auto;z-index:10}p-dropdown-menu-container .content{display:flex;flex-direction:column;gap:1px;padding:.5rem;width:100%}p-dropdown-menu-container.full-width{width:100%}p-dropdown-menu-container.max-width{max-width:222px}p-dropdown-menu-container.scrollable{max-height:11.5rem;scrollbar-width:none}p-dropdown-menu-container.scrollable::-webkit-scrollbar{display:none}p-dropdown-menu-container.scrollable .content{height:100%}p-dropdown-menu-container.scrollable.scrollable-large{max-height:20rem}.static{position:static!important}";const e=class{constructor(t){r(this,t);this.maxWidth=true;this.fullWidth=true;this.scrollable=false}render(){return t(o,{class:`p-dropdown-menu-container ${this.maxWidth&&"max-width"} ${this.fullWidth&&"full-width"} ${!!this.scrollable&&"scrollable"} ${this.scrollable==="large"?"scrollable-large":""}`},t("div",{class:"content"},t("slot",null)))}};e.style=a;export{e as p_dropdown_menu_container};
2
- //# sourceMappingURL=p-06c83915.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["dropdownMenuContainerComponentCss","DropdownMenuContainer","render","h","Host","class","this","maxWidth","fullWidth","scrollable"],"sources":["src/components/atoms/dropdown-menu-container/dropdown-menu-container.component.scss?tag=p-dropdown-menu-container","src/components/atoms/dropdown-menu-container/dropdown-menu-container.component.tsx"],"sourcesContent":["@import '../../../style/mixins';\n\np-dropdown-menu-container {\n\t@apply w-auto;\n\t@apply rounded-xxlarge bg-white;\n\t@apply z-10 overflow-y-auto overflow-x-hidden drop-shadow-4 filter;\n\n\t.content {\n\t\t@apply w-full p-2;\n\t\t@apply flex flex-col gap-[1px];\n\t}\n\n\t&.full-width {\n\t\t@apply w-full;\n\t}\n\n\t&.max-width {\n\t\t@apply max-w-[222px];\n\t}\n\n\t&.scrollable {\n\t\t@apply max-h-[11.5rem];\n\n\t\tscrollbar-width: none;\n\t\t&::-webkit-scrollbar {\n\t\t\t@apply hidden;\n\t\t}\n\n\t\t.content {\n\t\t\t@apply h-full;\n\t\t}\n\n\t\t&.scrollable-large {\n\t\t\t@apply max-h-[20rem];\n\t\t}\n\t}\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n\ttag: 'p-dropdown-menu-container',\n\tstyleUrl: 'dropdown-menu-container.component.scss',\n\t// shadow: true,\n})\nexport class DropdownMenuContainer {\n\t/**\n\t * Wether the container applies it's max width\n\t */\n\t@Prop() maxWidth: boolean = true;\n\n\t/**\n\t * Wether the container should all available space\n\t */\n\t@Prop() fullWidth: boolean = true;\n\n\t/**\n\t * Wether the container should be scrollable when the threshold is met.\n\t */\n\t@Prop() scrollable: boolean | 'default' | 'large' = false;\n\n\trender() {\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={`p-dropdown-menu-container ${\n\t\t\t\t\tthis.maxWidth && 'max-width'\n\t\t\t\t} ${this.fullWidth && 'full-width'} ${\n\t\t\t\t\t!!this.scrollable && 'scrollable'\n\t\t\t\t} ${this.scrollable === 'large' ? 'scrollable-large' : ''}`}\n\t\t\t>\n\t\t\t\t<div class=\"content\">\n\t\t\t\t\t<slot />\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"mappings":"6CAAA,MAAMA,EAAoC,mzD,MCO7BC,EAAqB,M,uCAIL,K,eAKC,K,gBAKuB,K,CAEpD,MAAAC,GACC,OACCC,EAACC,EAAI,CACJC,MAAO,6BACNC,KAAKC,UAAY,eACdD,KAAKE,WAAa,kBACnBF,KAAKG,YAAc,gBAClBH,KAAKG,aAAe,QAAU,mBAAqB,MAEvDN,EAAA,OAAKE,MAAM,WACVF,EAAA,c"}
@@ -1 +0,0 @@
1
- {"version":3,"names":["selectComponentCss","Select","_items","this","items","loading","JSON","parse","displayKey","valueKey","map","str","value","text","_a","query","length","asyncFilter","filter","item","queryKey","_checkvalue","_identifierKey","slice","maxDisplayedItems","_displayValue","multi","_selectedItem","_b","i","_c","_d","selectionDisplayKey","identifierKey","componentDidLoad","Error","_setMultiContainerMaxWidth","_resizeObserver","ResizeObserver","_resizeDebounceTimer","clearTimeout","setTimeout","_checkSelectedItems","observe","_el","_valueChange","itemChanges","componentDidRender","disconnectedCallback","disconnect","render","h","Host","class","disableTriggerClick","calculateWidth","insideClick","scrollable","show","_showDropdown","onIsOpen","ev","_onDropdownOpen","slot","icon","size","prefix","label","helper","required","error","disabled","focused","forceShowTooltip","type","placeholder","onFocus","_onFocus","onMouseDown","_onMouseDown","onClick","_onClick","ref","_inputRef","showChevron","variant","_getLoadingItems","_getItems","showAddItem","_getAddItem","_multiContainerRef","_selectValue","_amountHidden","documentClickHandler","target","childOf","_preselectItem","_showDropdownChanges","dropdownShown","emit","multiChanges","Array","isArray","valueChange","includes","autoSelectFirst","identifier","parsedValue","stringify","currentValue","currentParsedValue","find","itemIdentifier","parsedItemIdentifier","forceBlur","selectedItem","valueArray","includesIndex","findIndex","push","splice","_onBlur","preventDefault","blur","enableAutocomplete","force","_onAutoComplete","queryChange","key","toString","toLowerCase","indexOf","active","avatarKey","src","letters","avatarLettersKey","dropdownDisplayKey","emptyStateText","enableSelectAll","unshift","_selectAllChange","_allSelected","selectAllIcon","selectAllText","_getAutoCompleteItem","add","addItemText","enableHover","autocompletePlaceholder","onInput","autocompleteInputRef","style","maxWidth","clientWidth","containerRect","getBoundingClientRect","from","querySelectorAll","amountHidden","child","classList","remove","childRect","right","extra","querySelector","contains","detail","focus","selectAllChange"],"sources":["src/components/molecules/select/select.component.scss?tag=p-select","src/components/molecules/select/select.component.tsx"],"sourcesContent":["@import '../../../style/form/mixins';\n\np-select {\n\t@apply flex w-full flex-col relative text-ellipsis;\n\n\t.p-input {\n\t\t@include inputDefaultState();\n\t}\n\n\t.multi-container {\n\t\t@apply absolute bottom-0 left-0 h-10 flex gap-2 items-center px-2 py-4 overflow-hidden pointer-events-none w-full;\n\n\t\t&.size-small {\n\t\t\t@apply px-1 py-2 h-8;\n\t\t}\n\n\t\t.item {\n\t\t\t@apply bg-indigo-light rounded px-2 flex gap-2 items-center cursor-pointer text-indigo-dark h-[1.625rem] text-sm font-semibold pointer-events-auto whitespace-nowrap;\n\n\t\t\tp-icon {\n\t\t\t\t@apply text-indigo text-xs;\n\t\t\t}\n\t\t}\n\n\t\t.extra {\n\t\t\t@apply text-sm text-storm-medium pointer-events-none;\n\t\t}\n\t}\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Prop,\n State,\n Watch\n} from '@stencil/core';\nimport { childOf } from '../../../utils';\nimport { IconVariant } from '../../atoms/icon/icon.component';\n\n\n@Component({\n\ttag: 'p-select',\n\tstyleUrl: 'select.component.scss',\n\tshadow: false,\n})\nexport class Select {\n\t/**\n\t * The items to show in the dropdown\n\t */\n\t@Prop() items: string | any[];\n\n\t/**\n\t * Wether to enable multi select\n\t */\n\t@Prop({ reflect: true }) multi: boolean;\n\n\t/**\n\t * Icon of the select box\n\t */\n\t@Prop() icon: IconVariant;\n\n\t/**\n\t * The current query\n\t */\n\t@Prop() query: string;\n\n\t/**\n\t * The placeholder of the input\n\t */\n\t@Prop() placeholder: string;\n\n\t/**\n\t * The placeholder of the input used for auto complete\n\t */\n\t@Prop() autocompletePlaceholder: string = 'Search...';\n\n\t/**\n\t * The current value\n\t */\n\t@Prop() value: any;\n\n\t/**\n\t * The key of the object to display\n\t */\n\t@Prop() displayKey: string = 'text';\n\n\t/**\n\t * The key of the object to display in the dropdown (overwrites displayKey)\n\t */\n\t@Prop() dropdownDisplayKey: string | undefined;\n\n\t/**\n\t * The key of the object to display in the input (overwrites displayKey)\n\t */\n\t@Prop() selectionDisplayKey: string | undefined;\n\n\t/**\n\t * The key of the object to return\n\t */\n\t@Prop() valueKey: string;\n\n\t/**\n\t * The key of avatar within an item to show\n\t */\n\t@Prop() avatarKey: string;\n\n\t/**\n\t * The key of avatar letters within an item to show when the avatar url doesn't work\n\t */\n\t@Prop() avatarLettersKey: string;\n\n\t/**\n\t * The key to identify an object\n\t */\n\t@Prop() identifierKey: string;\n\n\t/**\n\t * The key of the object to display\n\t */\n\t@Prop() queryKey?: string;\n\n\t/**\n\t * Wether to automatically select the first item\n\t */\n\t@Prop() autoSelectFirst: boolean = true;\n\n\t/**\n\t * Wether to show the chevron or not\n\t */\n\t@Prop() showChevron: boolean = true;\n\n\t/**\n\t * The maximum amount of items to display\n\t */\n\t@Prop() maxDisplayedItems: number = 10;\n\n\t/**\n\t * Wether to enable autocomplete\n\t */\n\t@Prop() enableAutocomplete: boolean = true;\n\n\t/**\n\t * Wether the input uses async filtering\n\t */\n\t@Prop() asyncFilter: boolean = false;\n\n\t/**\n\t * Wether to show loading items\n\t */\n\t@Prop() loading: boolean = false;\n\n\t/**\n\t * Wether to show the select all item with multi select\n\t */\n\t@Prop() enableSelectAll: boolean = false;\n\n\t/**\n\t * The text of the select all item\n\t */\n\t@Prop() selectAllText: string = 'Select all';\n\n\t/**\n\t * The icon to prefix for select all\n\t */\n\t@Prop() selectAllIcon: IconVariant | undefined;\n\n\t/**\n\t * Event when the query of the autocomplete changes\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tqueryChange: EventEmitter<string>;\n\n\t/**\n\t * Event when the value changes\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tvalueChange: EventEmitter<any>;\n\n\t/**\n\t * Event when the select all item has been selected or not\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tselectAllChange: EventEmitter<any>;\n\n\t/**\n\t * Event when the dropdown shows\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tdropdownShown: EventEmitter<any>;\n\n\t/**\n\t * The size of the input group used by the select\n\t */\n\t@Prop() size: 'small' | 'medium' = 'medium';\n\n\t/**\n\t * The prefix of the input group used by the select\n\t */\n\t@Prop() prefix: string;\n\n\t/**\n\t * The label of the input group used by the select\n\t */\n\t@Prop() label: string;\n\n\t/**\n\t * The helper of the input group used by the select\n\t */\n\t@Prop() helper: string;\n\n\t/**\n\t * Wether the field is required\n\t */\n\t@Prop({ reflect: true }) required: boolean;\n\n\t/**\n\t * The helper of the input group used by the select\n\t */\n\t@Prop({ reflect: true }) error: string;\n\n\t/**\n\t * Wether the input group is disabled used by the select\n\t */\n\t@Prop({ reflect: true }) disabled: boolean = false;\n\n\t/**\n\t * Wether to show a \"add\" item\n\t */\n\t@Prop() showAddItem: boolean = false;\n\n\t/**\n\t * The text to show when add item is being shown\n\t */\n\t@Prop() addItemText: string = 'Add item';\n\n\t/**\n\t * Event when the add item is clicked\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tadd: EventEmitter;\n\n\t/**\n\t * The text to show when items is empty\n\t */\n\t@Prop() emptyStateText: string = 'No items available';\n\n\t/**\n\t * The host element\n\t */\n\t@Element() private _el: HTMLElement;\n\n\t@State() private _showDropdown: any = false;\n\t@State() private _selectedItem: any = null;\n\n\t@State() private _allSelected: boolean = false;\n\n\t@State() private _amountHidden = 0;\n\n\tprivate _inputRef: HTMLInputElement;\n\tprivate autocompleteInputRef: HTMLInputElement;\n\tprivate _multiContainerRef: HTMLElement;\n\n\tprivate _resizeObserver: ResizeObserver;\n\tprivate _resizeDebounceTimer: NodeJS.Timer;\n\n\tget _items() {\n\t\tif (!this.items || this.loading) {\n\t\t\treturn [];\n\t\t}\n\n\t\tlet items =\n\t\t\ttypeof this.items === 'string'\n\t\t\t\t? JSON.parse(this.items)\n\t\t\t\t: this.items;\n\n\t\tif (typeof items?.[0] === 'string') {\n\t\t\tthis.displayKey = 'text';\n\t\t\tthis.valueKey = 'value';\n\n\t\t\titems = items.map((str) => ({\n\t\t\t\tvalue: str,\n\t\t\t\ttext: str,\n\t\t\t}));\n\t\t}\n\n\t\tif (this.query?.length && !this.asyncFilter) {\n\t\t\titems = items.filter((item) => {\n\t\t\t\tif (this.queryKey) {\n\t\t\t\t\treturn this._checkvalue(this.queryKey, item);\n\t\t\t\t}\n\n\t\t\t\treturn (\n\t\t\t\t\tthis._checkvalue(this._identifierKey, item) ||\n\t\t\t\t\tthis._checkvalue(this.displayKey, item)\n\t\t\t\t);\n\t\t\t});\n\t\t}\n\n\t\treturn items?.slice(0, this.maxDisplayedItems);\n\t}\n\n\tget _displayValue() {\n\t\tif (this.multi) {\n\t\t\tif (!this._selectedItem?.length) {\n\t\t\t\treturn [];\n\t\t\t}\n\n\t\t\treturn this._selectedItem\n\t\t\t\t?.map((i) => i?.[this.displayKey])\n\t\t\t\t.filter((i) => !!i);\n\t\t}\n\n\t\treturn this._selectedItem?.[\n\t\t\tthis.selectionDisplayKey ?? this.displayKey\n\t\t];\n\t}\n\n\tget _identifierKey() {\n\t\treturn this.identifierKey ?? this.valueKey ?? 'value';\n\t}\n\n\tcomponentDidLoad() {\n\t\tif (!this.valueKey && !this.identifierKey) {\n\t\t\tthrow new Error('You must provide a valueKey or identifierKey');\n\t\t}\n\n\t\tif (this.multi) {\n\t\t\tthis._setMultiContainerMaxWidth();\n\n\t\t\tthis._resizeObserver = new ResizeObserver(() => {\n\t\t\t\tif (this._resizeDebounceTimer) {\n\t\t\t\t\tclearTimeout(this._resizeDebounceTimer);\n\t\t\t\t\tthis._resizeDebounceTimer = null;\n\t\t\t\t}\n\n\t\t\t\tthis._resizeDebounceTimer = setTimeout(() => {\n\t\t\t\t\tthis._setMultiContainerMaxWidth();\n\t\t\t\t\tthis._checkSelectedItems();\n\t\t\t\t}, 200);\n\t\t\t});\n\t\t\tthis._resizeObserver.observe(this._el);\n\t\t}\n\n\t\tif (this.value) {\n\t\t\tthis._valueChange();\n\t\t\treturn;\n\t\t}\n\n\t\tthis.itemChanges();\n\t}\n\n\tcomponentDidRender() {\n\t\tif (this.multi) {\n\t\t\tthis._setMultiContainerMaxWidth();\n\t\t\tthis._checkSelectedItems();\n\t\t}\n\t}\n\n\tdisconnectedCallback() {\n\t\tif (this.multi) {\n\t\t\tthis._resizeObserver.disconnect();\n\t\t}\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class=\"p-select\">\n\t\t\t\t<p-dropdown\n\t\t\t\t\tdisableTriggerClick={true}\n\t\t\t\t\tcalculateWidth={true}\n\t\t\t\t\tinsideClick={true}\n\t\t\t\t\tscrollable={true}\n\t\t\t\t\tshow={this._showDropdown}\n\t\t\t\t\tonIsOpen={(ev) => this._onDropdownOpen(ev)}\n\t\t\t\t>\n\t\t\t\t\t<p-input-group\n\t\t\t\t\t\tslot=\"trigger\"\n\t\t\t\t\t\ticon={this.icon}\n\t\t\t\t\t\tsize={this.size}\n\t\t\t\t\t\tprefix={this.prefix}\n\t\t\t\t\t\tlabel={this.label}\n\t\t\t\t\t\thelper={this.helper}\n\t\t\t\t\t\trequired={this.required}\n\t\t\t\t\t\terror={this.error}\n\t\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\t\tfocused={this._showDropdown}\n forceShowTooltip={this.error?.length && this._showDropdown}\n\t\t\t\t\t>\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\tslot=\"input\"\n\t\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t\tplaceholder={this.placeholder}\n\t\t\t\t\t\t\tvalue={\n\t\t\t\t\t\t\t\tthis.multi && this._displayValue?.length\n\t\t\t\t\t\t\t\t\t? ' '\n\t\t\t\t\t\t\t\t\t: this._displayValue\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tclass=\"p-input cursor-pointer read-only\"\n\t\t\t\t\t\t\tonFocus={(ev) => this._onFocus(ev)}\n\t\t\t\t\t\t\tonMouseDown={(ev) => this._onMouseDown(ev)}\n\t\t\t\t\t\t\tonClick={() => this._onClick()}\n\t\t\t\t\t\t\tref={(ref) => (this._inputRef = ref)}\n\t\t\t\t\t\t/>\n\n\t\t\t\t\t\t{this.showChevron && (\n\t\t\t\t\t\t\t<p-icon variant=\"chevron\" slot=\"suffix\" />\n\t\t\t\t\t\t)}\n\t\t\t\t\t</p-input-group>\n\t\t\t\t\t<div slot=\"items\">\n\t\t\t\t\t\t{this.loading\n\t\t\t\t\t\t\t? this._getLoadingItems()\n\t\t\t\t\t\t\t: this._getItems()}\n\t\t\t\t\t\t{this.showAddItem && this._getAddItem()}\n\t\t\t\t\t</div>\n\t\t\t\t</p-dropdown>\n\n\t\t\t\t{this.multi && this._selectedItem?.length > 0 && (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclass={`multi-container size-${this.size}`}\n\t\t\t\t\t\tref={(ref) => (this._multiContainerRef = ref)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{this._selectedItem.map((item) => (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclass=\"item\"\n\t\t\t\t\t\t\t\tonClick={() => this._selectValue(item)}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\titem[\n\t\t\t\t\t\t\t\t\t\tthis.selectionDisplayKey ??\n\t\t\t\t\t\t\t\t\t\t\tthis.displayKey\n\t\t\t\t\t\t\t\t\t]\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t<p-icon variant=\"negative\" />\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t))}\n\n\t\t\t\t\t\t<div class=\"extra hidden\">+{this._amountHidden}</div>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t@Listen('click', { target: 'document', capture: true })\n\tprotected documentClickHandler({ target }) {\n\t\tif (!this._showDropdown || childOf(target, this._el)) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._showDropdown = false;\n\t}\n\n\t@Watch('value')\n\tprivate _valueChange() {\n\t\tthis._preselectItem();\n\t}\n\n\t@Watch('items')\n\tpublic itemChanges() {\n\t\tthis._preselectItem();\n\t}\n\n\t@Watch('_showDropdown')\n\tpublic _showDropdownChanges() {\n\t\tthis.dropdownShown.emit({\n\t\t\tvalue: this._showDropdown,\n\t\t\tquery: this.query,\n\t\t});\n\t}\n\n\t@Watch('multi')\n\tpublic multiChanges() {\n\t\tif (this._selectedItem && !Array.isArray(this._selectedItem)) {\n\t\t\tthis._selectedItem = [];\n\t\t}\n\t}\n\n\tprivate _preselectItem() {\n\t\tlet value =\n\t\t\ttypeof this.value === 'string' && this.multi\n\t\t\t\t? JSON.parse(this.value)\n\t\t\t\t: this.value;\n\n\t\tif (this.multi) {\n\t\t\tif (!Array.isArray(value)) {\n\t\t\t\tthis.value = [];\n\t\t\t\tthis.valueChange.emit(this.value);\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tthis.value = value;\n\t\t\tif (!value.length) {\n\t\t\t\tthis._selectedItem = [];\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tthis._selectedItem =\n\t\t\t\t!!this.valueKey && this.valueKey !== 'false'\n\t\t\t\t\t? this._items.filter((i) =>\n\t\t\t\t\t\t\tvalue.includes(i?.[this.valueKey])\n\t\t\t\t\t\t)\n\t\t\t\t\t: [...value];\n\t\t\treturn;\n\t\t}\n\n\t\tif (!this._selectedItem && !value && this.autoSelectFirst) {\n\t\t\tvalue = this._items[0];\n\t\t}\n\n\t\tconst identifier =\n\t\t\ttypeof value === 'object' && value !== null\n\t\t\t\t? value[this._identifierKey]\n\t\t\t\t: value;\n\t\tconst parsedValue =\n\t\t\ttypeof identifier === 'string' || typeof identifier === 'number'\n\t\t\t\t? identifier\n\t\t\t\t: JSON.stringify(identifier);\n\n\t\tconst currentValue = this._selectedItem\n\t\t\t? this._selectedItem?.[this._identifierKey]\n\t\t\t: null;\n\t\tconst currentParsedValue =\n\t\t\ttypeof currentValue === 'string' || typeof currentValue === 'number'\n\t\t\t\t? currentValue\n\t\t\t\t: JSON.stringify(currentValue);\n\n\t\tif (this._selectedItem && currentParsedValue === parsedValue) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (!this._items?.length && value) {\n\t\t\tthis._selectValue(value, false);\n\t\t\treturn;\n\t\t}\n\n\t\tconst item = this._items.find((i) => {\n\t\t\tconst itemIdentifier = i?.[this._identifierKey];\n\t\t\tconst parsedItemIdentifier =\n\t\t\t\ttypeof itemIdentifier === 'string' ||\n\t\t\t\ttypeof itemIdentifier === 'number'\n\t\t\t\t\t? itemIdentifier\n\t\t\t\t\t: JSON.stringify(itemIdentifier);\n\n\t\t\treturn parsedItemIdentifier === parsedValue;\n\t\t});\n\n\t\tthis._selectValue(!!item ? item : value, false);\n\t}\n\n\tprivate _selectValue(item, forceBlur = true) {\n\t\tlet value =\n\t\t\t!!this.valueKey && this.valueKey !== 'false' && item !== null\n\t\t\t\t? item?.[this.valueKey]\n\t\t\t\t: item;\n\n\t\tif (this.multi) {\n\t\t\tif (!this._selectedItem || !Array.isArray(this._selectedItem)) {\n\t\t\t\tthis._selectedItem = [];\n\t\t\t}\n\n\t\t\tif (!this.value || !Array.isArray(this.value)) {\n\t\t\t\tthis.value = [];\n\t\t\t}\n\n\t\t\tconst selectedItem = [...this._selectedItem];\n\t\t\tconst valueArray = [...this.value];\n\n\t\t\tconst includesIndex = selectedItem.findIndex(\n\t\t\t\t(i) => i[this._identifierKey] === item[this._identifierKey]\n\t\t\t);\n\t\t\tif (includesIndex === -1) {\n\t\t\t\tselectedItem.push(item);\n\t\t\t\tvalueArray.push(value);\n\t\t\t} else {\n\t\t\t\tselectedItem.splice(includesIndex, 1);\n\t\t\t\tvalueArray.splice(includesIndex, 1);\n\t\t\t}\n\n\t\t\tthis._selectedItem = selectedItem;\n\t\t\tthis.value = valueArray;\n\t\t\tthis.valueChange.emit(valueArray);\n\t\t\treturn;\n\t\t}\n\n\t\tthis._selectedItem = item;\n\t\tthis.value = value;\n\t\tthis.valueChange.emit(value);\n\n\t\tthis._onBlur(forceBlur);\n\t}\n\n\tprivate _onFocus(ev) {\n\t\tev.preventDefault();\n\t\tthis._inputRef.blur();\n\n\t\tif (!this._showDropdown) {\n\t\t\tthis._showDropdown = true;\n\t\t}\n\n\t\treturn;\n\t}\n\n\tprivate _onMouseDown(ev) {\n\t\tif (this.enableAutocomplete) {\n\t\t\treturn;\n\t\t}\n\n\t\tev.preventDefault();\n\t}\n\n\tprivate _onClick() {\n\t\tif (this.enableAutocomplete) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._showDropdown = !this._showDropdown;\n\t}\n\n\tprivate _onBlur(force = false) {\n\t\tif (this.enableAutocomplete && !force) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._showDropdown = false;\n\t}\n\n\tprivate _onAutoComplete(ev) {\n\t\tif (!this.enableAutocomplete) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._showDropdown = true;\n\n\t\tthis.query = ev.target.value;\n\t\tthis.queryChange.emit(ev.target.value);\n\t}\n\n\tprivate _checkvalue(key, item) {\n\t\treturn (\n\t\t\titem?.[key]\n\t\t\t\t?.toString()\n\t\t\t\t?.toLowerCase()\n\t\t\t\t.indexOf(this.query?.toLowerCase()) >= 0\n\t\t);\n\t}\n\n\tprivate _getItems() {\n\t\tlet items = this._items.map((item) => (\n\t\t\t<p-dropdown-menu-item\n\t\t\t\tonClick={() => this._selectValue(item)}\n\t\t\t\tactive={\n\t\t\t\t\tthis.multi &&\n\t\t\t\t\t!!this._selectedItem &&\n\t\t\t\t\tArray.isArray(this._selectedItem)\n\t\t\t\t\t\t? this._selectedItem.findIndex(\n\t\t\t\t\t\t\t\t(i) =>\n\t\t\t\t\t\t\t\t\ti[this._identifierKey] ===\n\t\t\t\t\t\t\t\t\titem[this._identifierKey]\n\t\t\t\t\t\t\t) >= 0\n\t\t\t\t\t\t: item[this._identifierKey] ===\n\t\t\t\t\t\t\tthis._selectedItem?.[this._identifierKey]\n\t\t\t\t}\n\t\t\t\tvariant={this.multi ? 'checkbox' : 'default'}\n\t\t\t>\n\t\t\t\t{this.avatarKey ? (\n\t\t\t\t\t<span class=\"flex items-center gap-2\">\n\t\t\t\t\t\t<p-avatar\n\t\t\t\t\t\t\tsize=\"xsmall\"\n\t\t\t\t\t\t\tsrc={item[this.avatarKey]}\n\t\t\t\t\t\t\tletters={item[this.avatarLettersKey]}\n\t\t\t\t\t\t></p-avatar>\n\t\t\t\t\t\t{item[this.dropdownDisplayKey ?? this.displayKey]}\n\t\t\t\t\t</span>\n\t\t\t\t) : (\n\t\t\t\t\titem[this.displayKey]\n\t\t\t\t)}\n\t\t\t</p-dropdown-menu-item>\n\t\t));\n\n\t\tif (!this._items.length) {\n\t\t\titems = [\n\t\t\t\t<p class=\"w-full p-2 text-storm-medium text-sm text-center\">\n\t\t\t\t\t{this.emptyStateText}\n\t\t\t\t</p>,\n\t\t\t];\n\t\t}\n\n\t\tif (this.enableSelectAll && this._items.length) {\n\t\t\titems.unshift(\n\t\t\t\t<p-dropdown-menu-item\n\t\t\t\t\tvariant=\"checkbox\"\n\t\t\t\t\tonClick={() => this._selectAllChange()}\n\t\t\t\t\tactive={this._allSelected}\n\t\t\t\t>\n\t\t\t\t\t{this.selectAllIcon?.length ? (\n\t\t\t\t\t\t<span class=\"flex items-center gap-2\">\n\t\t\t\t\t\t\t<div class=\"w-6 justify-center flex text-lg\">\n\t\t\t\t\t\t\t\t<p-icon variant={this.selectAllIcon} />\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t{this.selectAllText}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t) : (\n\t\t\t\t\t\tthis.selectAllText\n\t\t\t\t\t)}\n\t\t\t\t</p-dropdown-menu-item>\n\t\t\t);\n\t\t}\n\n\t\tif (this.enableAutocomplete) {\n\t\t\titems.unshift(this._getAutoCompleteItem());\n\t\t}\n\n\t\treturn items;\n\t}\n\n\tprivate _getAddItem() {\n\t\treturn (\n\t\t\t<p-dropdown-menu-item onClick={() => this.add.emit()}>\n\t\t\t\t<span class=\"text-indigo font-semibold flex gap-1 items-center\">\n\t\t\t\t\t{this.addItemText}\n\t\t\t\t\t<p-icon variant=\"plus\" />\n\t\t\t\t</span>\n\t\t\t</p-dropdown-menu-item>\n\t\t);\n\t}\n\n\tprivate _getLoadingItems() {\n\t\tconst items = [0, 0, 0].map(() => (\n\t\t\t<p-dropdown-menu-item enableHover={false}>\n\t\t\t\t<p-loader variant=\"ghost\" class=\"h-6 w-full rounded\" />\n\t\t\t</p-dropdown-menu-item>\n\t\t));\n\n\t\tif (this.enableAutocomplete) {\n\t\t\titems.unshift(this._getAutoCompleteItem());\n\t\t}\n\n\t\treturn items;\n\t}\n\n\tprivate _getAutoCompleteItem() {\n\t\treturn (\n\t\t\t<div class=\"bg-white sticky top-0 pt-2 pb-1 -mt-2\">\n\t\t\t\t<input\n\t\t\t\t\tclass=\"p-input size-small mb-2 sticky top-2\"\n\t\t\t\t\tplaceholder={this.autocompletePlaceholder}\n\t\t\t\t\tonInput={(ev) => this._onAutoComplete(ev)}\n\t\t\t\t\tref={(ref) => (this.autocompleteInputRef = ref)}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t);\n\t}\n\n\tprivate _setMultiContainerMaxWidth() {\n\t\tif (!this._inputRef || !this._multiContainerRef) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._multiContainerRef.style.maxWidth = `${this._inputRef.clientWidth - 16}px`;\n\t}\n\n\tprivate _checkSelectedItems() {\n\t\tif (!this._multiContainerRef) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst containerRect = this._multiContainerRef.getBoundingClientRect();\n\t\tconst items = Array.from(\n\t\t\tthis._multiContainerRef.querySelectorAll('.item')\n\t\t) as HTMLElement[];\n\n\t\tlet amountHidden = 0;\n\n\t\tfor (const child of items) {\n\t\t\tchild.classList.remove('hidden');\n\n\t\t\tconst childRect = child.getBoundingClientRect();\n\t\t\tif (childRect.right > containerRect.right) {\n\t\t\t\tchild.classList.add('hidden');\n\t\t\t\tamountHidden++;\n\t\t\t}\n\t\t}\n\n\t\tthis._amountHidden = amountHidden;\n\t\tconst extra = this._multiContainerRef.querySelector('.extra');\n\t\tif (!extra) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (!extra.classList.contains('hidden')) {\n\t\t\textra.classList.add('hidden');\n\t\t}\n\n\t\tif (amountHidden > 0) {\n\t\t\textra.classList.remove('hidden');\n\t\t}\n\t}\n\n\tprivate _onDropdownOpen(ev) {\n\t\tif (!ev.detail || !this.autocompleteInputRef) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.autocompleteInputRef.focus();\n\t}\n\n\tprivate _selectAllChange() {\n\t\tthis._allSelected = !this._allSelected;\n\t\tthis.selectAllChange.emit(this._allSelected);\n\t}\n}\n"],"mappings":"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"}
@@ -1 +0,0 @@
1
- {"version":3,"names":["icons","arrow","attachment","bread","calendar","camera","car","checklist","checkmark","chevron","chevrons","clock","colleagues","cogs","comment","companies","company","deactivate","document","download","envelope","explanation","eye","faPiggy","filter","folder","formula","grid","hashtag","headset","iDeal","integration","list","location","megaphone","menu","minus","more","negative","notification","pagination","payment","pencil","person","plan","plus","question","reload","receipt","report","search","settings","sick","signout","switch","switchIcon","tachometer","task","template","tool","trash","turn","upload","warning","buttonComponentCss","Button","render","loaderColor","this","variant","VariableTag","h","Host","class","size","iconOnly","iconPosition","chevronPosition","inheritText","underline","disabled","href","target","rotate","icon","loading","_getIcon","color","handleClick","ev","preventDefault","onClick","emit","flip","iconFlip","iconRotate","iconComponentCss","Icon","styles","transform","innerHTML","loaderComponentCss","Loader","_show","show","_loader","componentWillRender","_checkShow","componentShouldUpdate","_showSubscriber","unsubscribe","_a","subscribe"],"sources":["src/utils/icons.ts","src/components/atoms/button/button.component.scss?tag=p-button","src/components/atoms/button/button.component.tsx","src/components/atoms/icon/icon.component.scss?tag=p-icon","src/components/atoms/icon/icon.component.tsx","src/components/atoms/loader/loader.component.scss?tag=p-loader&encapsulation=shadow","src/components/atoms/loader/loader.component.tsx"],"sourcesContent":["import arrow from '../assets/icons/arrow.svg';\nimport attachment from '../assets/icons/attachment.svg';\nimport bread from '../assets/icons/bread.svg';\nimport calendar from '../assets/icons/calendar.svg';\nimport camera from '../assets/icons/camera.svg';\nimport car from '../assets/icons/car.svg';\nimport checklist from '../assets/icons/checklist.svg';\nimport checkmark from '../assets/icons/checkmark.svg';\nimport chevron from '../assets/icons/chevron.svg';\nimport chevrons from '../assets/icons/chevrons.svg';\nimport clock from '../assets/icons/clock.svg';\nimport cogs from '../assets/icons/cogs.svg';\nimport colleagues from '../assets/icons/colleagues.svg';\nimport comment from '../assets/icons/comment.svg';\nimport companies from '../assets/icons/companies.svg';\nimport company from '../assets/icons/company.svg';\nimport deactivate from '../assets/icons/deactivate.svg';\nimport document from '../assets/icons/document.svg';\nimport download from '../assets/icons/download.svg';\nimport envelope from '../assets/icons/envelope.svg';\nimport explanation from '../assets/icons/explanation.svg';\nimport eye from '../assets/icons/eye.svg';\nimport faPiggy from '../assets/icons/fa/piggy.svg';\nimport filter from '../assets/icons/filter.svg';\nimport folder from '../assets/icons/folder.svg';\nimport formula from '../assets/icons/formula.svg';\nimport grid from '../assets/icons/grid.svg';\nimport hashtag from '../assets/icons/hashtag.svg';\nimport headset from '../assets/icons/headset.svg';\nimport iDeal from '../assets/icons/iDeal.svg';\nimport integration from '../assets/icons/integration.svg';\nimport list from '../assets/icons/list.svg';\nimport location from '../assets/icons/location.svg';\nimport megaphone from '../assets/icons/megaphone.svg';\nimport menu from '../assets/icons/menu.svg';\nimport minus from '../assets/icons/minus.svg';\nimport more from '../assets/icons/more.svg';\nimport negative from '../assets/icons/negative.svg';\nimport notification from '../assets/icons/notification.svg';\nimport pagination from '../assets/icons/pagination.svg';\nimport payment from '../assets/icons/payment.svg';\nimport pencil from '../assets/icons/pencil.svg';\nimport person from '../assets/icons/person.svg';\nimport plan from '../assets/icons/plan.svg';\nimport plus from '../assets/icons/plus.svg';\nimport question from '../assets/icons/question.svg';\nimport receipt from '../assets/icons/receipt.svg';\nimport reload from '../assets/icons/reload.svg';\nimport report from '../assets/icons/report.svg';\nimport search from '../assets/icons/search.svg';\nimport settings from '../assets/icons/settings.svg';\nimport sick from '../assets/icons/sick.svg';\nimport signout from '../assets/icons/signout.svg';\nimport switchIcon from '../assets/icons/switch.svg';\nimport tachometer from '../assets/icons/tachometer.svg';\nimport task from '../assets/icons/task.svg';\nimport template from '../assets/icons/template.svg';\nimport tool from '../assets/icons/tool.svg';\nimport trash from '../assets/icons/trash.svg';\nimport turn from '../assets/icons/turn.svg';\nimport upload from '../assets/icons/upload.svg';\nimport warning from '../assets/icons/warning.svg';\n\nexport default {\n\tarrow,\n\tattachment,\n\tbread,\n\tcalendar,\n\tcamera,\n\tcar,\n\tchecklist,\n\tcheckmark,\n\tchevron,\n\tchevrons,\n\tclock,\n\tcolleagues,\n\tcogs,\n\tcomment,\n\tcompanies,\n\tcompany,\n\tdeactivate,\n\tdocument,\n\tdownload,\n\tenvelope,\n\texplanation,\n\teye,\n\tfaPiggy,\n\tfilter,\n\tfolder,\n\tformula,\n\tgrid,\n\thashtag,\n\theadset,\n\tiDeal,\n\tintegration,\n\tlist,\n\tlocation,\n\tmegaphone,\n\tmenu,\n\tminus,\n\tmore,\n\tnegative,\n\tnotification,\n\tpagination,\n\tpayment,\n\tpencil,\n\tperson,\n\tplan,\n\tplus,\n\tquestion,\n\treload,\n\treceipt,\n\treport,\n\tsearch,\n\tsettings,\n\tsick,\n\tsignout,\n\tswitch: switchIcon,\n\ttachometer,\n\ttask,\n\ttemplate,\n\ttool,\n\ttrash,\n\tturn,\n\tupload,\n\twarning,\n};\n","p-button {\n\t@apply flex h-10 w-auto text-base;\n\n\tbutton,\n\ta {\n\t\toutline: 0;\n\t\tborder: 0;\n\t\t@apply h-full w-full;\n\t\t@apply rounded-large #{!important};\n\t\t@apply font-semibold leading-4;\n\t\t@apply flex items-center justify-center;\n\t\t@apply cursor-pointer text-base;\n\n\t\twill-change: filter;\n\n\t\t> p-loader {\n\t\t\t@apply ml-2;\n\t\t}\n\n\t\t// Icon positions\n\t\t&.icon-position-end {\n\t\t\t> p-icon:not(.chevron) {\n\t\t\t\t@apply ml-2;\n\t\t\t}\n\t\t}\n\n\t\t&.icon-position-start {\n\t\t\t> p-icon:not(.chevron) {\n\t\t\t\t@apply mr-2;\n\t\t\t}\n\t\t}\n\n\t\t// Variants\n\t\t&.variant-primary,\n\t\t&.variant-secondary {\n\t\t\t@apply px-4 filter;\n\t\t}\n\n\t\t&.variant-primary,\n\t\t&.variant-secondary {\n\t\t\t&:active,\n\t\t\t&.active {\n\t\t\t\t@apply drop-shadow-transparent;\n\t\t\t}\n\t\t}\n\n\t\t&.variant-primary {\n\t\t\t@apply bg-indigo text-white;\n\n\t\t\t&:active,\n\t\t\t&.active {\n\t\t\t\t&:not([disabled]) {\n\t\t\t\t\t@apply bg-indigo-dark;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t@media (pointer: fine) {\n\t\t\t\t&:hover:not([disabled]) {\n\t\t\t\t\t@apply drop-shadow-button-primary-hover;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t&.variant-secondary {\n\t\t\t@apply border border-solid border-mystic-dark #{!important};\n\t\t\t@apply bg-white text-storm;\n\n\t\t\t&:active,\n\t\t\t&.active {\n\t\t\t\t&:not([disabled]) {\n\t\t\t\t\t@apply bg-mystic;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t@media (pointer: fine) {\n\t\t\t\t&:hover:not([disabled]) {\n\t\t\t\t\t@apply drop-shadow-button-secondary-hover;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t&.variant-text {\n\t\t\t@apply text-indigo;\n\n\t\t\t&.has-underline {\n\t\t\t\t@apply underline underline-offset-1;\n\t\t\t}\n\n\t\t\t&:hover:not([disabled]) {\n\t\t\t\t@apply text-indigo-dark;\n\t\t\t}\n\t\t}\n\n\t\t&[disabled] {\n\t\t\t@apply opacity-40;\n\t\t}\n\n\t\t&.should-inherit-text {\n\t\t\tcolor: inherit #{!important};\n\t\t\tfont-size: inherit #{!important};\n\t\t\tfont-weight: inherit #{!important};\n\t\t}\n\t}\n\n\t// chevron\n\t&.has-chevron {\n\t\ta,\n\t\tbutton {\n\t\t\t&.chevron-position-start {\n\t\t\t\t@apply pl-2;\n\n\t\t\t\t> p-icon.chevron {\n\t\t\t\t\t@apply mr-2;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t&.chevron-position-end {\n\t\t\t\t@apply pr-2;\n\n\t\t\t\t> p-icon.chevron {\n\t\t\t\t\t@apply ml-2;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t&.variant-secondary:hover:not([disabled]) p-icon:last-child {\n\t\t\t\t@apply text-indigo;\n\t\t\t}\n\t\t}\n\t}\n\n\t&.has-icon-only {\n\t\t@apply w-10;\n\n\t\ta,\n\t\tbutton {\n\t\t\t@apply p-0;\n\n\t\t\t> p-icon:first-child {\n\t\t\t\t@apply mx-0;\n\t\t\t}\n\n\t\t\t> p-loader {\n\t\t\t\t@apply ml-0;\n\t\t\t}\n\t\t}\n\n\t\t&.has-chevron {\n\t\t\t@apply w-auto;\n\n\t\t\ta,\n\t\t\tbutton {\n\t\t\t\t&.chevron-position-start {\n\t\t\t\t\t@apply pr-2;\n\t\t\t\t}\n\n\t\t\t\t&.chevron-position-end {\n\t\t\t\t\t@apply pl-2;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\t// sizes\n\t&.size-small {\n\t\t@apply h-8;\n\n\t\tbutton,\n\t\ta {\n\t\t\t@apply text-sm;\n\n\t\t\t> p-icon {\n\t\t\t\t@apply text-base;\n\t\t\t}\n\t\t}\n\n\t\t&.has-icon-only {\n\t\t\t@apply w-8;\n\n\t\t\t&.has-chevron {\n\t\t\t\t@apply w-auto;\n\t\t\t}\n\t\t}\n\t}\n}\n","import {\n\tComponent,\n\tEvent,\n\tEventEmitter,\n\th,\n\tHost,\n\tListen,\n\tProp,\n} from '@stencil/core';\nimport { RotateOptions } from '../../../types/tailwind';\nimport { IconFlipOptions, IconVariant } from '../icon/icon.component';\n\n@Component({\n\ttag: 'p-button',\n\tstyleUrl: 'button.component.scss',\n\t// shadow: true,\n})\nexport class Button {\n\t/**\n\t * The variant of the button\n\t */\n\t@Prop() variant: 'primary' | 'secondary' | 'text' = 'primary';\n\n\t/**\n\t * Wether the text variant has underline\n\t */\n\t@Prop() underline: boolean = false;\n\n\t/**\n\t * Href in case of \"text\" version\n\t */\n\t@Prop() href: string;\n\n\t/**\n\t * Target in case of \"text\" version\n\t */\n\t@Prop() target: string;\n\n\t/**\n\t * The size of the button\n\t */\n\t@Prop() size: 'small' | 'medium' = 'medium';\n\n\t/**\n\t * Wether to show a loader or not\n\t */\n\t@Prop() loading: boolean = false;\n\n\t/**\n\t * Wether to show a chevron or not\n\t */\n\t@Prop() chevron: boolean | 'up' | 'down' = false;\n\n\t/**\n\t * Chevron position\n\t */\n\t@Prop() chevronPosition: 'start' | 'end' = 'end';\n\n\t/**\n\t * Wether the button is disabled\n\t */\n\t@Prop() disabled: boolean = false;\n\n\t/**\n\t * Icon to show on the button\n\t */\n\t@Prop() icon: IconVariant;\n\n\t/**\n\t * Wether the button is icon only\n\t */\n\t@Prop() iconOnly: boolean = false;\n\n\t/**\n\t * Icon position\n\t */\n\t@Prop() iconPosition: 'start' | 'end' = 'end';\n\n\t/**\n\t * Icon flip\n\t */\n\t@Prop() iconFlip: IconFlipOptions;\n\n\t/**\n\t * Icon rotate\n\t */\n\t@Prop() iconRotate: RotateOptions;\n\n\t/**\n\t * Wether the button should inherit text styles\n\t */\n\t@Prop() inheritText: boolean = false;\n\n\t/**\n\t * Button click event\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tonClick: EventEmitter<MouseEvent>;\n\n\trender() {\n\t\tlet loaderColor: 'white' | 'storm' | 'indigo' = 'white';\n\t\tswitch (this.variant) {\n\t\t\tcase 'secondary':\n\t\t\t\tloaderColor = 'storm';\n\t\t\t\tbreak;\n\t\t\tcase 'text':\n\t\t\t\tloaderColor = 'indigo';\n\t\t\t\tbreak;\n\t\t}\n\n\t\tconst VariableTag = this.variant === 'text' ? 'a' : 'button';\n\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={`p-button size-${this.size} ${\n\t\t\t\t\tthis.iconOnly && 'has-icon-only'\n\t\t\t\t} ${this.chevron && 'has-chevron'}`}\n\t\t\t>\n\t\t\t\t<VariableTag\n\t\t\t\t\tclass={`variant-${this.variant} icon-position-${\n\t\t\t\t\t\tthis.iconPosition\n\t\t\t\t\t} chevron-position-${this.chevronPosition} ${\n\t\t\t\t\t\tthis.inheritText && 'should-inherit-text'\n\t\t\t\t\t} ${this.underline && 'has-underline'}`}\n\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\thref={this.href}\n\t\t\t\t\ttarget={this.target}\n\t\t\t\t>\n\t\t\t\t\t{this.chevron && this.chevronPosition === 'start' && (\n\t\t\t\t\t\t<p-icon\n\t\t\t\t\t\t\tclass=\"chevron\"\n\t\t\t\t\t\t\tvariant=\"chevron\"\n\t\t\t\t\t\t\trotate={this.chevron === 'up' ? 180 : 0}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{this.icon &&\n\t\t\t\t\t\tthis.iconPosition === 'start' &&\n\t\t\t\t\t\t!(this.iconOnly && this.loading) &&\n\t\t\t\t\t\tthis._getIcon()}\n\n\t\t\t\t\t<slot />\n\n\t\t\t\t\t{this.icon &&\n\t\t\t\t\t\tthis.iconPosition === 'end' &&\n\t\t\t\t\t\t!(this.iconOnly && this.loading) &&\n\t\t\t\t\t\tthis._getIcon()}\n\n\t\t\t\t\t{this.loading && <p-loader color={loaderColor} />}\n\n\t\t\t\t\t{this.chevron && this.chevronPosition === 'end' && (\n\t\t\t\t\t\t<p-icon\n\t\t\t\t\t\t\tclass=\"chevron\"\n\t\t\t\t\t\t\tvariant=\"chevron\"\n\t\t\t\t\t\t\trotate={this.chevron === 'up' ? 180 : 0}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</VariableTag>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t@Listen('click', { capture: true })\n\thandleClick(ev: MouseEvent) {\n\t\tif (this.loading || this.disabled) {\n\t\t\tev.preventDefault();\n\t\t\treturn;\n\t\t}\n\n\t\tthis.onClick.emit(ev);\n\t}\n\n\tprivate _getIcon() {\n\t\tif (!this.icon) {\n\t\t\treturn;\n\t\t}\n\n\t\treturn (\n\t\t\t<p-icon\n\t\t\t\tvariant={this.icon}\n\t\t\t\tflip={this.iconFlip}\n\t\t\t\trotate={this.iconRotate}\n\t\t\t/>\n\t\t);\n\t}\n}\n",":host {\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\nimport { RotateOptions, TextSizeOptions } from '../../../types/tailwind';\nimport icons from '../../../utils/icons';\n\nexport type IconVariant = keyof typeof icons;\nexport type IconFlipOptions = 'horizontal' | 'vertical';\n\n@Component({\n\ttag: 'p-icon',\n\tstyleUrl: 'icon.component.scss',\n\t// shadow: true,\n})\nexport class Icon {\n\t/**\n\t * The icon the be displayed\n\t */\n\t@Prop() variant!: IconVariant;\n\n\t/**\n\t * The size of the icon, using tailwind sizes\n\t */\n\t@Prop() size: TextSizeOptions = 'auto';\n\n\t/**\n\t * Wether to rotate the icon x degrees\n\t */\n\t@Prop() rotate: RotateOptions = 0;\n\n\t/**\n\t * Wether to flip the icon horizontally or vertically\n\t */\n\t@Prop() flip: IconFlipOptions = null;\n\n\trender() {\n\t\tconst icon = icons[this.variant];\n\n\t\tconst styles = {\n\t\t\t'p-icon flex': true,\n\t\t\t'text-auto': this.size === 'auto',\n\t\t\t'text-xxs': this.size === 'xxs',\n\t\t\t'text-xs': this.size === 'xs',\n\t\t\t'text-sm': this.size === 'sm',\n\t\t\t'text-base': this.size === 'base',\n\t\t\t'text-lg': this.size === 'lg',\n\t\t\t'text-xl': this.size === 'xl',\n\t\t\t'text-2xl': this.size === '2xl',\n\t\t\t'text-3xl': this.size === '3xl',\n\t\t\t'text-4xl': this.size === '4xl',\n\t\t\t'text-5xl': this.size === '5xl',\n\t\t\t'text-6xl': this.size === '6xl',\n\t\t\ttransform: !!this.rotate || !!this.flip,\n\t\t\t'scale-x-flip': this.flip === 'horizontal',\n\t\t\t'scale-y-flip': this.flip === 'vertical',\n\t\t\t'rotate-0': this.rotate === 0,\n\t\t\t'rotate-25': this.rotate === 25,\n\t\t\t'rotate-45': this.rotate === 45,\n\t\t\t'rotate-90': this.rotate === 90,\n\t\t\t'rotate-135': this.rotate === 135,\n\t\t\t'rotate-180': this.rotate === 180,\n\t\t\t'rotate-225': this.rotate === 225,\n\t\t\t'rotate-270': this.rotate === 270,\n\t\t\t'rotate-315': this.rotate === 315,\n\t\t\t'-rotate-0': this.rotate === -0,\n\t\t\t'-rotate-25': this.rotate === -25,\n\t\t\t'-rotate-45': this.rotate === -45,\n\t\t\t'-rotate-90': this.rotate === -90,\n\t\t\t'-rotate-135': this.rotate === -135,\n\t\t\t'-rotate-180': this.rotate === -180,\n\t\t\t'-rotate-225': this.rotate === -225,\n\t\t\t'-rotate-270': this.rotate === -270,\n\t\t\t'-rotate-315': this.rotate === -315,\n\t\t};\n\n\t\treturn <Host class={styles} innerHTML={icon}></Host>;\n\t}\n}\n",":host {\n\t.loader {\n\t\t@apply inline-block h-[1em] w-[1em] rounded-round;\n\t\t@apply border-2 border-solid border-indigo-light border-t-indigo;\n\t\tanimation: 500ms spin linear infinite;\n\n\t\twill-change: transform;\n\n\t\t&.color-storm {\n\t\t\t@apply border-storm-light/40 border-t-storm #{!important};\n\t\t}\n\n\t\t&.color-white {\n\t\t\t@apply border-indigo-light/40 border-t-white #{!important};\n\t\t}\n\t}\n\n\t.loading-screen {\n\t\t@apply w-screen-safe h-screen-safe fixed top-0 left-0;\n\t\t@apply flex items-center justify-center;\n\t\t@apply bg-mystic;\n\n\t\tz-index: 1001;\n\n\t\t.content {\n\t\t\t@apply max-w-xs;\n\n\t\t\t.loader-wrapper {\n\t\t\t\t@apply flex w-full justify-center;\n\n\t\t\t\t.loader {\n\t\t\t\t\t@apply text-4xl;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}\n\n:host(.variant-ghost) {\n\t@apply box-border block;\n\n\twill-change: background, background-position-x, background-color;\n\n\tmin-height: 1em;\n\tmin-width: 1em;\n\n\t--loading-bg: #f7fafc;\n\t--loading-stripe: rgba(252, 253, 254, 1);\n\n\tbackground-color: var(--loading-bg);\n\tbackground: linear-gradient(\n\t\t\t100deg,\n\t\t\trgba(255, 255, 255, 0) 40%,\n\t\t\tvar(--loading-stripe) 50%,\n\t\t\trgba(255, 255, 255, 0) 60%\n\t\t)\n\t\tvar(--loading-bg);\n\tbackground-size: 200% 100%;\n\tbackground-position-x: 180%;\n\tanimation: 1s loading ease-in-out infinite;\n}\n\n@keyframes loading {\n\tto {\n\t\tbackground-position-x: -20%;\n\t}\n}\n\n@keyframes spin {\n\t100% {\n\t\ttransform: rotate(1turn);\n\t}\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\nimport { Observable, Subscription } from 'rxjs';\n\n@Component({\n\ttag: 'p-loader',\n\tstyleUrl: 'loader.component.scss',\n\tshadow: true,\n})\nexport class Loader {\n\t/**\n\t * Wether to show or hide the loader\n\t */\n\t@Prop() show: boolean | Observable<boolean> = true;\n\n\t/**\n\t * Variant of loader\n\t */\n\t@Prop() variant:\n\t\t| 'inline'\n\t\t| 'full-width'\n\t\t| 'full-screen'\n\t\t| 'modal'\n\t\t| 'ghost' = 'inline';\n\n\t/**\n\t * Color of the loader\n\t */\n\t@Prop() color: 'indigo' | 'white' | 'storm' = 'indigo';\n\n\t/**\n\t * !NOT IMPLEMENTED! Modal title for modal variant\n\t */\n\t@Prop() modalTitle: string;\n\n\t/**\n\t * !NOT IMPLEMENTED! Modal description for modal variant\n\t */\n\t@Prop() modalDescription: string;\n\n\tprivate _show = this.show;\n\tprivate _showSubscriber: Subscription;\n\n\tprivate _loader = (<div class={`loader color-${this.color}`}></div>);\n\n\tcomponentWillRender() {\n\t\tthis._checkShow();\n\t}\n\n\tcomponentShouldUpdate() {\n\t\tthis._checkShow();\n\t}\n\n\trender() {\n\t\tif (!this._show) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (this.variant === 'ghost') {\n\t\t\treturn <Host class=\"p-loader variant-ghost\"></Host>;\n\t\t}\n\n\t\tif (this.variant === 'full-screen') {\n\t\t\treturn (\n\t\t\t\t<Host class=\"p-loader variant-full-screen\">\n\t\t\t\t\t<div class=\"loading-screen\">\n\t\t\t\t\t\t<div class=\"content\">\n\t\t\t\t\t\t\t<slot />\n\n\t\t\t\t\t\t\t<div class=\"loader-wrapper\">{this._loader}</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</Host>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={`p-loader variant-default flex ${\n\t\t\t\t\tthis.variant === 'full-width' &&\n\t\t\t\t\t'w-full flex justify-center text-4xl'\n\t\t\t\t}`}\n\t\t\t>\n\t\t\t\t{this._loader}\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate _checkShow() {\n\t\tif (this._showSubscriber) {\n\t\t\tthis._showSubscriber.unsubscribe();\n\t\t\tthis._showSubscriber = null;\n\t\t}\n\n\t\tif (typeof this.show !== 'boolean') {\n\t\t\tthis._showSubscriber = this.show?.subscribe(\n\t\t\t\t(show) => (this._show = show)\n\t\t\t);\n\t\t\treturn;\n\t\t}\n\n\t\tthis._show = this.show;\n\t}\n}\n"],"mappings":"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"}
@@ -1,2 +0,0 @@
1
- import{r,h as t,H as o}from"./p-e4d5e7a7.js";const a=".z-10{z-index:10!important}.flex{display:flex!important}.hidden{display:none!important}.max-h-\\[11\\.5rem\\]{max-height:11.5rem!important}.max-h-\\[20rem\\]{max-height:20rem!important}.w-full{width:100%!important}.max-w-\\[222px\\]{max-width:222px!important}.flex-col{flex-direction:column!important}.gap-\\[1px\\]{gap:1px!important}.overflow-y-auto{overflow-y:auto!important}.overflow-x-hidden{overflow-x:hidden!important}.rounded-xxlarge{border-radius:.75rem!important}.drop-shadow-4{--tw-drop-shadow:drop-shadow(0px 0.3125rem 1rem rgba(0,24,98,.08)) drop-shadow(0px 0.0625rem 0.1875rem rgba(0,24,98,.13))!important}.drop-shadow-4,.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}*{box-sizing:border-box}p-dropdown-menu-container{--tw-bg-opacity:1;--tw-drop-shadow:drop-shadow(0px 0.3125rem 1rem rgba(0,24,98,.08)) drop-shadow(0px 0.0625rem 0.1875rem rgba(0,24,98,.13));background-color:rgb(255 255 255/var(--tw-bg-opacity));border-radius:.75rem;filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);overflow-x:hidden;overflow-y:auto;width:auto;z-index:10}p-dropdown-menu-container .content{display:flex;flex-direction:column;gap:1px;padding:.5rem;width:100%}p-dropdown-menu-container.full-width{width:100%}p-dropdown-menu-container.max-width{max-width:222px}p-dropdown-menu-container.scrollable{max-height:11.5rem;scrollbar-width:none}p-dropdown-menu-container.scrollable::-webkit-scrollbar{display:none}p-dropdown-menu-container.scrollable .content{height:100%}p-dropdown-menu-container.scrollable.scrollable-large{max-height:20rem}.static{position:static!important}";const e=class{constructor(t){r(this,t);this.maxWidth=true;this.fullWidth=true;this.scrollable=false}render(){return t(o,{class:`p-dropdown-menu-container ${this.maxWidth&&"max-width"} ${this.fullWidth&&"full-width"} ${!!this.scrollable&&"scrollable"} ${this.scrollable==="large"?"scrollable-large":""}`},t("div",{class:"content"},t("slot",null)))}};e.style=a;export{e as p_dropdown_menu_container};
2
- //# sourceMappingURL=p-06c83915.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["dropdownMenuContainerComponentCss","DropdownMenuContainer","render","h","Host","class","this","maxWidth","fullWidth","scrollable"],"sources":["src/components/atoms/dropdown-menu-container/dropdown-menu-container.component.scss?tag=p-dropdown-menu-container","src/components/atoms/dropdown-menu-container/dropdown-menu-container.component.tsx"],"sourcesContent":["@import '../../../style/mixins';\n\np-dropdown-menu-container {\n\t@apply w-auto;\n\t@apply rounded-xxlarge bg-white;\n\t@apply z-10 overflow-y-auto overflow-x-hidden drop-shadow-4 filter;\n\n\t.content {\n\t\t@apply w-full p-2;\n\t\t@apply flex flex-col gap-[1px];\n\t}\n\n\t&.full-width {\n\t\t@apply w-full;\n\t}\n\n\t&.max-width {\n\t\t@apply max-w-[222px];\n\t}\n\n\t&.scrollable {\n\t\t@apply max-h-[11.5rem];\n\n\t\tscrollbar-width: none;\n\t\t&::-webkit-scrollbar {\n\t\t\t@apply hidden;\n\t\t}\n\n\t\t.content {\n\t\t\t@apply h-full;\n\t\t}\n\n\t\t&.scrollable-large {\n\t\t\t@apply max-h-[20rem];\n\t\t}\n\t}\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n\ttag: 'p-dropdown-menu-container',\n\tstyleUrl: 'dropdown-menu-container.component.scss',\n\t// shadow: true,\n})\nexport class DropdownMenuContainer {\n\t/**\n\t * Wether the container applies it's max width\n\t */\n\t@Prop() maxWidth: boolean = true;\n\n\t/**\n\t * Wether the container should all available space\n\t */\n\t@Prop() fullWidth: boolean = true;\n\n\t/**\n\t * Wether the container should be scrollable when the threshold is met.\n\t */\n\t@Prop() scrollable: boolean | 'default' | 'large' = false;\n\n\trender() {\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={`p-dropdown-menu-container ${\n\t\t\t\t\tthis.maxWidth && 'max-width'\n\t\t\t\t} ${this.fullWidth && 'full-width'} ${\n\t\t\t\t\t!!this.scrollable && 'scrollable'\n\t\t\t\t} ${this.scrollable === 'large' ? 'scrollable-large' : ''}`}\n\t\t\t>\n\t\t\t\t<div class=\"content\">\n\t\t\t\t\t<slot />\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"mappings":"6CAAA,MAAMA,EAAoC,mzD,MCO7BC,EAAqB,M,uCAIL,K,eAKC,K,gBAKuB,K,CAEpD,MAAAC,GACC,OACCC,EAACC,EAAI,CACJC,MAAO,6BACNC,KAAKC,UAAY,eACdD,KAAKE,WAAa,kBACnBF,KAAKG,YAAc,gBAClBH,KAAKG,aAAe,QAAU,mBAAqB,MAEvDN,EAAA,OAAKE,MAAM,WACVF,EAAA,c"}
@@ -1 +0,0 @@
1
- {"version":3,"names":["selectComponentCss","Select","_items","this","items","loading","JSON","parse","displayKey","valueKey","map","str","value","text","_a","query","length","asyncFilter","filter","item","queryKey","_checkvalue","_identifierKey","slice","maxDisplayedItems","_displayValue","multi","_selectedItem","_b","i","_c","_d","selectionDisplayKey","identifierKey","componentDidLoad","Error","_setMultiContainerMaxWidth","_resizeObserver","ResizeObserver","_resizeDebounceTimer","clearTimeout","setTimeout","_checkSelectedItems","observe","_el","_valueChange","itemChanges","componentDidRender","disconnectedCallback","disconnect","render","h","Host","class","disableTriggerClick","calculateWidth","insideClick","scrollable","show","_showDropdown","onIsOpen","ev","_onDropdownOpen","slot","icon","size","prefix","label","helper","required","error","disabled","focused","forceShowTooltip","type","placeholder","onFocus","_onFocus","onMouseDown","_onMouseDown","onClick","_onClick","ref","_inputRef","showChevron","variant","_getLoadingItems","_getItems","showAddItem","_getAddItem","_multiContainerRef","_selectValue","_amountHidden","documentClickHandler","target","childOf","_preselectItem","_showDropdownChanges","dropdownShown","emit","multiChanges","Array","isArray","valueChange","includes","autoSelectFirst","identifier","parsedValue","stringify","currentValue","currentParsedValue","find","itemIdentifier","parsedItemIdentifier","forceBlur","selectedItem","valueArray","includesIndex","findIndex","push","splice","_onBlur","preventDefault","blur","enableAutocomplete","force","_onAutoComplete","queryChange","key","toString","toLowerCase","indexOf","active","avatarKey","src","letters","avatarLettersKey","dropdownDisplayKey","emptyStateText","enableSelectAll","unshift","_selectAllChange","_allSelected","selectAllIcon","selectAllText","_getAutoCompleteItem","add","addItemText","enableHover","autocompletePlaceholder","onInput","autocompleteInputRef","style","maxWidth","clientWidth","containerRect","getBoundingClientRect","from","querySelectorAll","amountHidden","child","classList","remove","childRect","right","extra","querySelector","contains","detail","focus","selectAllChange"],"sources":["src/components/molecules/select/select.component.scss?tag=p-select","src/components/molecules/select/select.component.tsx"],"sourcesContent":["@import '../../../style/form/mixins';\n\np-select {\n\t@apply flex w-full flex-col relative text-ellipsis;\n\n\t.p-input {\n\t\t@include inputDefaultState();\n\t}\n\n\t.multi-container {\n\t\t@apply absolute bottom-0 left-0 h-10 flex gap-2 items-center px-2 py-4 overflow-hidden pointer-events-none w-full;\n\n\t\t&.size-small {\n\t\t\t@apply px-1 py-2 h-8;\n\t\t}\n\n\t\t.item {\n\t\t\t@apply bg-indigo-light rounded px-2 flex gap-2 items-center cursor-pointer text-indigo-dark h-[1.625rem] text-sm font-semibold pointer-events-auto whitespace-nowrap;\n\n\t\t\tp-icon {\n\t\t\t\t@apply text-indigo text-xs;\n\t\t\t}\n\t\t}\n\n\t\t.extra {\n\t\t\t@apply text-sm text-storm-medium pointer-events-none;\n\t\t}\n\t}\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Prop,\n State,\n Watch\n} from '@stencil/core';\nimport { childOf } from '../../../utils';\nimport { IconVariant } from '../../atoms/icon/icon.component';\n\n\n@Component({\n\ttag: 'p-select',\n\tstyleUrl: 'select.component.scss',\n\tshadow: false,\n})\nexport class Select {\n\t/**\n\t * The items to show in the dropdown\n\t */\n\t@Prop() items: string | any[];\n\n\t/**\n\t * Wether to enable multi select\n\t */\n\t@Prop({ reflect: true }) multi: boolean;\n\n\t/**\n\t * Icon of the select box\n\t */\n\t@Prop() icon: IconVariant;\n\n\t/**\n\t * The current query\n\t */\n\t@Prop() query: string;\n\n\t/**\n\t * The placeholder of the input\n\t */\n\t@Prop() placeholder: string;\n\n\t/**\n\t * The placeholder of the input used for auto complete\n\t */\n\t@Prop() autocompletePlaceholder: string = 'Search...';\n\n\t/**\n\t * The current value\n\t */\n\t@Prop() value: any;\n\n\t/**\n\t * The key of the object to display\n\t */\n\t@Prop() displayKey: string = 'text';\n\n\t/**\n\t * The key of the object to display in the dropdown (overwrites displayKey)\n\t */\n\t@Prop() dropdownDisplayKey: string | undefined;\n\n\t/**\n\t * The key of the object to display in the input (overwrites displayKey)\n\t */\n\t@Prop() selectionDisplayKey: string | undefined;\n\n\t/**\n\t * The key of the object to return\n\t */\n\t@Prop() valueKey: string;\n\n\t/**\n\t * The key of avatar within an item to show\n\t */\n\t@Prop() avatarKey: string;\n\n\t/**\n\t * The key of avatar letters within an item to show when the avatar url doesn't work\n\t */\n\t@Prop() avatarLettersKey: string;\n\n\t/**\n\t * The key to identify an object\n\t */\n\t@Prop() identifierKey: string;\n\n\t/**\n\t * The key of the object to display\n\t */\n\t@Prop() queryKey?: string;\n\n\t/**\n\t * Wether to automatically select the first item\n\t */\n\t@Prop() autoSelectFirst: boolean = true;\n\n\t/**\n\t * Wether to show the chevron or not\n\t */\n\t@Prop() showChevron: boolean = true;\n\n\t/**\n\t * The maximum amount of items to display\n\t */\n\t@Prop() maxDisplayedItems: number = 10;\n\n\t/**\n\t * Wether to enable autocomplete\n\t */\n\t@Prop() enableAutocomplete: boolean = true;\n\n\t/**\n\t * Wether the input uses async filtering\n\t */\n\t@Prop() asyncFilter: boolean = false;\n\n\t/**\n\t * Wether to show loading items\n\t */\n\t@Prop() loading: boolean = false;\n\n\t/**\n\t * Wether to show the select all item with multi select\n\t */\n\t@Prop() enableSelectAll: boolean = false;\n\n\t/**\n\t * The text of the select all item\n\t */\n\t@Prop() selectAllText: string = 'Select all';\n\n\t/**\n\t * The icon to prefix for select all\n\t */\n\t@Prop() selectAllIcon: IconVariant | undefined;\n\n\t/**\n\t * Event when the query of the autocomplete changes\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tqueryChange: EventEmitter<string>;\n\n\t/**\n\t * Event when the value changes\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tvalueChange: EventEmitter<any>;\n\n\t/**\n\t * Event when the select all item has been selected or not\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tselectAllChange: EventEmitter<any>;\n\n\t/**\n\t * Event when the dropdown shows\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tdropdownShown: EventEmitter<any>;\n\n\t/**\n\t * The size of the input group used by the select\n\t */\n\t@Prop() size: 'small' | 'medium' = 'medium';\n\n\t/**\n\t * The prefix of the input group used by the select\n\t */\n\t@Prop() prefix: string;\n\n\t/**\n\t * The label of the input group used by the select\n\t */\n\t@Prop() label: string;\n\n\t/**\n\t * The helper of the input group used by the select\n\t */\n\t@Prop() helper: string;\n\n\t/**\n\t * Wether the field is required\n\t */\n\t@Prop({ reflect: true }) required: boolean;\n\n\t/**\n\t * The helper of the input group used by the select\n\t */\n\t@Prop({ reflect: true }) error: string;\n\n\t/**\n\t * Wether the input group is disabled used by the select\n\t */\n\t@Prop({ reflect: true }) disabled: boolean = false;\n\n\t/**\n\t * Wether to show a \"add\" item\n\t */\n\t@Prop() showAddItem: boolean = false;\n\n\t/**\n\t * The text to show when add item is being shown\n\t */\n\t@Prop() addItemText: string = 'Add item';\n\n\t/**\n\t * Event when the add item is clicked\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tadd: EventEmitter;\n\n\t/**\n\t * The text to show when items is empty\n\t */\n\t@Prop() emptyStateText: string = 'No items available';\n\n\t/**\n\t * The host element\n\t */\n\t@Element() private _el: HTMLElement;\n\n\t@State() private _showDropdown: any = false;\n\t@State() private _selectedItem: any = null;\n\n\t@State() private _allSelected: boolean = false;\n\n\t@State() private _amountHidden = 0;\n\n\tprivate _inputRef: HTMLInputElement;\n\tprivate autocompleteInputRef: HTMLInputElement;\n\tprivate _multiContainerRef: HTMLElement;\n\n\tprivate _resizeObserver: ResizeObserver;\n\tprivate _resizeDebounceTimer: NodeJS.Timer;\n\n\tget _items() {\n\t\tif (!this.items || this.loading) {\n\t\t\treturn [];\n\t\t}\n\n\t\tlet items =\n\t\t\ttypeof this.items === 'string'\n\t\t\t\t? JSON.parse(this.items)\n\t\t\t\t: this.items;\n\n\t\tif (typeof items?.[0] === 'string') {\n\t\t\tthis.displayKey = 'text';\n\t\t\tthis.valueKey = 'value';\n\n\t\t\titems = items.map((str) => ({\n\t\t\t\tvalue: str,\n\t\t\t\ttext: str,\n\t\t\t}));\n\t\t}\n\n\t\tif (this.query?.length && !this.asyncFilter) {\n\t\t\titems = items.filter((item) => {\n\t\t\t\tif (this.queryKey) {\n\t\t\t\t\treturn this._checkvalue(this.queryKey, item);\n\t\t\t\t}\n\n\t\t\t\treturn (\n\t\t\t\t\tthis._checkvalue(this._identifierKey, item) ||\n\t\t\t\t\tthis._checkvalue(this.displayKey, item)\n\t\t\t\t);\n\t\t\t});\n\t\t}\n\n\t\treturn items?.slice(0, this.maxDisplayedItems);\n\t}\n\n\tget _displayValue() {\n\t\tif (this.multi) {\n\t\t\tif (!this._selectedItem?.length) {\n\t\t\t\treturn [];\n\t\t\t}\n\n\t\t\treturn this._selectedItem\n\t\t\t\t?.map((i) => i?.[this.displayKey])\n\t\t\t\t.filter((i) => !!i);\n\t\t}\n\n\t\treturn this._selectedItem?.[\n\t\t\tthis.selectionDisplayKey ?? this.displayKey\n\t\t];\n\t}\n\n\tget _identifierKey() {\n\t\treturn this.identifierKey ?? this.valueKey ?? 'value';\n\t}\n\n\tcomponentDidLoad() {\n\t\tif (!this.valueKey && !this.identifierKey) {\n\t\t\tthrow new Error('You must provide a valueKey or identifierKey');\n\t\t}\n\n\t\tif (this.multi) {\n\t\t\tthis._setMultiContainerMaxWidth();\n\n\t\t\tthis._resizeObserver = new ResizeObserver(() => {\n\t\t\t\tif (this._resizeDebounceTimer) {\n\t\t\t\t\tclearTimeout(this._resizeDebounceTimer);\n\t\t\t\t\tthis._resizeDebounceTimer = null;\n\t\t\t\t}\n\n\t\t\t\tthis._resizeDebounceTimer = setTimeout(() => {\n\t\t\t\t\tthis._setMultiContainerMaxWidth();\n\t\t\t\t\tthis._checkSelectedItems();\n\t\t\t\t}, 200);\n\t\t\t});\n\t\t\tthis._resizeObserver.observe(this._el);\n\t\t}\n\n\t\tif (this.value) {\n\t\t\tthis._valueChange();\n\t\t\treturn;\n\t\t}\n\n\t\tthis.itemChanges();\n\t}\n\n\tcomponentDidRender() {\n\t\tif (this.multi) {\n\t\t\tthis._setMultiContainerMaxWidth();\n\t\t\tthis._checkSelectedItems();\n\t\t}\n\t}\n\n\tdisconnectedCallback() {\n\t\tif (this.multi) {\n\t\t\tthis._resizeObserver.disconnect();\n\t\t}\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class=\"p-select\">\n\t\t\t\t<p-dropdown\n\t\t\t\t\tdisableTriggerClick={true}\n\t\t\t\t\tcalculateWidth={true}\n\t\t\t\t\tinsideClick={true}\n\t\t\t\t\tscrollable={true}\n\t\t\t\t\tshow={this._showDropdown}\n\t\t\t\t\tonIsOpen={(ev) => this._onDropdownOpen(ev)}\n\t\t\t\t>\n\t\t\t\t\t<p-input-group\n\t\t\t\t\t\tslot=\"trigger\"\n\t\t\t\t\t\ticon={this.icon}\n\t\t\t\t\t\tsize={this.size}\n\t\t\t\t\t\tprefix={this.prefix}\n\t\t\t\t\t\tlabel={this.label}\n\t\t\t\t\t\thelper={this.helper}\n\t\t\t\t\t\trequired={this.required}\n\t\t\t\t\t\terror={this.error}\n\t\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\t\tfocused={this._showDropdown}\n forceShowTooltip={this.error?.length && this._showDropdown}\n\t\t\t\t\t>\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\tslot=\"input\"\n\t\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t\tplaceholder={this.placeholder}\n\t\t\t\t\t\t\tvalue={\n\t\t\t\t\t\t\t\tthis.multi && this._displayValue?.length\n\t\t\t\t\t\t\t\t\t? ' '\n\t\t\t\t\t\t\t\t\t: this._displayValue\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tclass=\"p-input cursor-pointer read-only\"\n\t\t\t\t\t\t\tonFocus={(ev) => this._onFocus(ev)}\n\t\t\t\t\t\t\tonMouseDown={(ev) => this._onMouseDown(ev)}\n\t\t\t\t\t\t\tonClick={() => this._onClick()}\n\t\t\t\t\t\t\tref={(ref) => (this._inputRef = ref)}\n\t\t\t\t\t\t/>\n\n\t\t\t\t\t\t{this.showChevron && (\n\t\t\t\t\t\t\t<p-icon variant=\"chevron\" slot=\"suffix\" />\n\t\t\t\t\t\t)}\n\t\t\t\t\t</p-input-group>\n\t\t\t\t\t<div slot=\"items\">\n\t\t\t\t\t\t{this.loading\n\t\t\t\t\t\t\t? this._getLoadingItems()\n\t\t\t\t\t\t\t: this._getItems()}\n\t\t\t\t\t\t{this.showAddItem && this._getAddItem()}\n\t\t\t\t\t</div>\n\t\t\t\t</p-dropdown>\n\n\t\t\t\t{this.multi && this._selectedItem?.length > 0 && (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclass={`multi-container size-${this.size}`}\n\t\t\t\t\t\tref={(ref) => (this._multiContainerRef = ref)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{this._selectedItem.map((item) => (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclass=\"item\"\n\t\t\t\t\t\t\t\tonClick={() => this._selectValue(item)}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\titem[\n\t\t\t\t\t\t\t\t\t\tthis.selectionDisplayKey ??\n\t\t\t\t\t\t\t\t\t\t\tthis.displayKey\n\t\t\t\t\t\t\t\t\t]\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t<p-icon variant=\"negative\" />\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t))}\n\n\t\t\t\t\t\t<div class=\"extra hidden\">+{this._amountHidden}</div>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t@Listen('click', { target: 'document', capture: true })\n\tprotected documentClickHandler({ target }) {\n\t\tif (!this._showDropdown || childOf(target, this._el)) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._showDropdown = false;\n\t}\n\n\t@Watch('value')\n\tprivate _valueChange() {\n\t\tthis._preselectItem();\n\t}\n\n\t@Watch('items')\n\tpublic itemChanges() {\n\t\tthis._preselectItem();\n\t}\n\n\t@Watch('_showDropdown')\n\tpublic _showDropdownChanges() {\n\t\tthis.dropdownShown.emit({\n\t\t\tvalue: this._showDropdown,\n\t\t\tquery: this.query,\n\t\t});\n\t}\n\n\t@Watch('multi')\n\tpublic multiChanges() {\n\t\tif (this._selectedItem && !Array.isArray(this._selectedItem)) {\n\t\t\tthis._selectedItem = [];\n\t\t}\n\t}\n\n\tprivate _preselectItem() {\n\t\tlet value =\n\t\t\ttypeof this.value === 'string' && this.multi\n\t\t\t\t? JSON.parse(this.value)\n\t\t\t\t: this.value;\n\n\t\tif (this.multi) {\n\t\t\tif (!Array.isArray(value)) {\n\t\t\t\tthis.value = [];\n\t\t\t\tthis.valueChange.emit(this.value);\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tthis.value = value;\n\t\t\tif (!value.length) {\n\t\t\t\tthis._selectedItem = [];\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tthis._selectedItem =\n\t\t\t\t!!this.valueKey && this.valueKey !== 'false'\n\t\t\t\t\t? this._items.filter((i) =>\n\t\t\t\t\t\t\tvalue.includes(i?.[this.valueKey])\n\t\t\t\t\t\t)\n\t\t\t\t\t: [...value];\n\t\t\treturn;\n\t\t}\n\n\t\tif (!this._selectedItem && !value && this.autoSelectFirst) {\n\t\t\tvalue = this._items[0];\n\t\t}\n\n\t\tconst identifier =\n\t\t\ttypeof value === 'object' && value !== null\n\t\t\t\t? value[this._identifierKey]\n\t\t\t\t: value;\n\t\tconst parsedValue =\n\t\t\ttypeof identifier === 'string' || typeof identifier === 'number'\n\t\t\t\t? identifier\n\t\t\t\t: JSON.stringify(identifier);\n\n\t\tconst currentValue = this._selectedItem\n\t\t\t? this._selectedItem?.[this._identifierKey]\n\t\t\t: null;\n\t\tconst currentParsedValue =\n\t\t\ttypeof currentValue === 'string' || typeof currentValue === 'number'\n\t\t\t\t? currentValue\n\t\t\t\t: JSON.stringify(currentValue);\n\n\t\tif (this._selectedItem && currentParsedValue === parsedValue) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (!this._items?.length && value) {\n\t\t\tthis._selectValue(value, false);\n\t\t\treturn;\n\t\t}\n\n\t\tconst item = this._items.find((i) => {\n\t\t\tconst itemIdentifier = i?.[this._identifierKey];\n\t\t\tconst parsedItemIdentifier =\n\t\t\t\ttypeof itemIdentifier === 'string' ||\n\t\t\t\ttypeof itemIdentifier === 'number'\n\t\t\t\t\t? itemIdentifier\n\t\t\t\t\t: JSON.stringify(itemIdentifier);\n\n\t\t\treturn parsedItemIdentifier === parsedValue;\n\t\t});\n\n\t\tthis._selectValue(!!item ? item : value, false);\n\t}\n\n\tprivate _selectValue(item, forceBlur = true) {\n\t\tlet value =\n\t\t\t!!this.valueKey && this.valueKey !== 'false' && item !== null\n\t\t\t\t? item?.[this.valueKey]\n\t\t\t\t: item;\n\n\t\tif (this.multi) {\n\t\t\tif (!this._selectedItem || !Array.isArray(this._selectedItem)) {\n\t\t\t\tthis._selectedItem = [];\n\t\t\t}\n\n\t\t\tif (!this.value || !Array.isArray(this.value)) {\n\t\t\t\tthis.value = [];\n\t\t\t}\n\n\t\t\tconst selectedItem = [...this._selectedItem];\n\t\t\tconst valueArray = [...this.value];\n\n\t\t\tconst includesIndex = selectedItem.findIndex(\n\t\t\t\t(i) => i[this._identifierKey] === item[this._identifierKey]\n\t\t\t);\n\t\t\tif (includesIndex === -1) {\n\t\t\t\tselectedItem.push(item);\n\t\t\t\tvalueArray.push(value);\n\t\t\t} else {\n\t\t\t\tselectedItem.splice(includesIndex, 1);\n\t\t\t\tvalueArray.splice(includesIndex, 1);\n\t\t\t}\n\n\t\t\tthis._selectedItem = selectedItem;\n\t\t\tthis.value = valueArray;\n\t\t\tthis.valueChange.emit(valueArray);\n\t\t\treturn;\n\t\t}\n\n\t\tthis._selectedItem = item;\n\t\tthis.value = value;\n\t\tthis.valueChange.emit(value);\n\n\t\tthis._onBlur(forceBlur);\n\t}\n\n\tprivate _onFocus(ev) {\n\t\tev.preventDefault();\n\t\tthis._inputRef.blur();\n\n\t\tif (!this._showDropdown) {\n\t\t\tthis._showDropdown = true;\n\t\t}\n\n\t\treturn;\n\t}\n\n\tprivate _onMouseDown(ev) {\n\t\tif (this.enableAutocomplete) {\n\t\t\treturn;\n\t\t}\n\n\t\tev.preventDefault();\n\t}\n\n\tprivate _onClick() {\n\t\tif (this.enableAutocomplete) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._showDropdown = !this._showDropdown;\n\t}\n\n\tprivate _onBlur(force = false) {\n\t\tif (this.enableAutocomplete && !force) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._showDropdown = false;\n\t}\n\n\tprivate _onAutoComplete(ev) {\n\t\tif (!this.enableAutocomplete) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._showDropdown = true;\n\n\t\tthis.query = ev.target.value;\n\t\tthis.queryChange.emit(ev.target.value);\n\t}\n\n\tprivate _checkvalue(key, item) {\n\t\treturn (\n\t\t\titem?.[key]\n\t\t\t\t?.toString()\n\t\t\t\t?.toLowerCase()\n\t\t\t\t.indexOf(this.query?.toLowerCase()) >= 0\n\t\t);\n\t}\n\n\tprivate _getItems() {\n\t\tlet items = this._items.map((item) => (\n\t\t\t<p-dropdown-menu-item\n\t\t\t\tonClick={() => this._selectValue(item)}\n\t\t\t\tactive={\n\t\t\t\t\tthis.multi &&\n\t\t\t\t\t!!this._selectedItem &&\n\t\t\t\t\tArray.isArray(this._selectedItem)\n\t\t\t\t\t\t? this._selectedItem.findIndex(\n\t\t\t\t\t\t\t\t(i) =>\n\t\t\t\t\t\t\t\t\ti[this._identifierKey] ===\n\t\t\t\t\t\t\t\t\titem[this._identifierKey]\n\t\t\t\t\t\t\t) >= 0\n\t\t\t\t\t\t: item[this._identifierKey] ===\n\t\t\t\t\t\t\tthis._selectedItem?.[this._identifierKey]\n\t\t\t\t}\n\t\t\t\tvariant={this.multi ? 'checkbox' : 'default'}\n\t\t\t>\n\t\t\t\t{this.avatarKey ? (\n\t\t\t\t\t<span class=\"flex items-center gap-2\">\n\t\t\t\t\t\t<p-avatar\n\t\t\t\t\t\t\tsize=\"xsmall\"\n\t\t\t\t\t\t\tsrc={item[this.avatarKey]}\n\t\t\t\t\t\t\tletters={item[this.avatarLettersKey]}\n\t\t\t\t\t\t></p-avatar>\n\t\t\t\t\t\t{item[this.dropdownDisplayKey ?? this.displayKey]}\n\t\t\t\t\t</span>\n\t\t\t\t) : (\n\t\t\t\t\titem[this.displayKey]\n\t\t\t\t)}\n\t\t\t</p-dropdown-menu-item>\n\t\t));\n\n\t\tif (!this._items.length) {\n\t\t\titems = [\n\t\t\t\t<p class=\"w-full p-2 text-storm-medium text-sm text-center\">\n\t\t\t\t\t{this.emptyStateText}\n\t\t\t\t</p>,\n\t\t\t];\n\t\t}\n\n\t\tif (this.enableSelectAll && this._items.length) {\n\t\t\titems.unshift(\n\t\t\t\t<p-dropdown-menu-item\n\t\t\t\t\tvariant=\"checkbox\"\n\t\t\t\t\tonClick={() => this._selectAllChange()}\n\t\t\t\t\tactive={this._allSelected}\n\t\t\t\t>\n\t\t\t\t\t{this.selectAllIcon?.length ? (\n\t\t\t\t\t\t<span class=\"flex items-center gap-2\">\n\t\t\t\t\t\t\t<div class=\"w-6 justify-center flex text-lg\">\n\t\t\t\t\t\t\t\t<p-icon variant={this.selectAllIcon} />\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t{this.selectAllText}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t) : (\n\t\t\t\t\t\tthis.selectAllText\n\t\t\t\t\t)}\n\t\t\t\t</p-dropdown-menu-item>\n\t\t\t);\n\t\t}\n\n\t\tif (this.enableAutocomplete) {\n\t\t\titems.unshift(this._getAutoCompleteItem());\n\t\t}\n\n\t\treturn items;\n\t}\n\n\tprivate _getAddItem() {\n\t\treturn (\n\t\t\t<p-dropdown-menu-item onClick={() => this.add.emit()}>\n\t\t\t\t<span class=\"text-indigo font-semibold flex gap-1 items-center\">\n\t\t\t\t\t{this.addItemText}\n\t\t\t\t\t<p-icon variant=\"plus\" />\n\t\t\t\t</span>\n\t\t\t</p-dropdown-menu-item>\n\t\t);\n\t}\n\n\tprivate _getLoadingItems() {\n\t\tconst items = [0, 0, 0].map(() => (\n\t\t\t<p-dropdown-menu-item enableHover={false}>\n\t\t\t\t<p-loader variant=\"ghost\" class=\"h-6 w-full rounded\" />\n\t\t\t</p-dropdown-menu-item>\n\t\t));\n\n\t\tif (this.enableAutocomplete) {\n\t\t\titems.unshift(this._getAutoCompleteItem());\n\t\t}\n\n\t\treturn items;\n\t}\n\n\tprivate _getAutoCompleteItem() {\n\t\treturn (\n\t\t\t<div class=\"bg-white sticky top-0 pt-2 pb-1 -mt-2\">\n\t\t\t\t<input\n\t\t\t\t\tclass=\"p-input size-small mb-2 sticky top-2\"\n\t\t\t\t\tplaceholder={this.autocompletePlaceholder}\n\t\t\t\t\tonInput={(ev) => this._onAutoComplete(ev)}\n\t\t\t\t\tref={(ref) => (this.autocompleteInputRef = ref)}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t);\n\t}\n\n\tprivate _setMultiContainerMaxWidth() {\n\t\tif (!this._inputRef || !this._multiContainerRef) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._multiContainerRef.style.maxWidth = `${this._inputRef.clientWidth - 16}px`;\n\t}\n\n\tprivate _checkSelectedItems() {\n\t\tif (!this._multiContainerRef) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst containerRect = this._multiContainerRef.getBoundingClientRect();\n\t\tconst items = Array.from(\n\t\t\tthis._multiContainerRef.querySelectorAll('.item')\n\t\t) as HTMLElement[];\n\n\t\tlet amountHidden = 0;\n\n\t\tfor (const child of items) {\n\t\t\tchild.classList.remove('hidden');\n\n\t\t\tconst childRect = child.getBoundingClientRect();\n\t\t\tif (childRect.right > containerRect.right) {\n\t\t\t\tchild.classList.add('hidden');\n\t\t\t\tamountHidden++;\n\t\t\t}\n\t\t}\n\n\t\tthis._amountHidden = amountHidden;\n\t\tconst extra = this._multiContainerRef.querySelector('.extra');\n\t\tif (!extra) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (!extra.classList.contains('hidden')) {\n\t\t\textra.classList.add('hidden');\n\t\t}\n\n\t\tif (amountHidden > 0) {\n\t\t\textra.classList.remove('hidden');\n\t\t}\n\t}\n\n\tprivate _onDropdownOpen(ev) {\n\t\tif (!ev.detail || !this.autocompleteInputRef) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.autocompleteInputRef.focus();\n\t}\n\n\tprivate _selectAllChange() {\n\t\tthis._allSelected = !this._allSelected;\n\t\tthis.selectAllChange.emit(this._allSelected);\n\t}\n}\n"],"mappings":"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"}
@@ -1 +0,0 @@
1
- {"version":3,"names":["icons","arrow","attachment","bread","calendar","camera","car","checklist","checkmark","chevron","chevrons","clock","colleagues","cogs","comment","companies","company","deactivate","document","download","envelope","explanation","eye","faPiggy","filter","folder","formula","grid","hashtag","headset","iDeal","integration","list","location","megaphone","menu","minus","more","negative","notification","pagination","payment","pencil","person","plan","plus","question","reload","receipt","report","search","settings","sick","signout","switch","switchIcon","tachometer","task","template","tool","trash","turn","upload","warning","buttonComponentCss","Button","render","loaderColor","this","variant","VariableTag","h","Host","class","size","iconOnly","iconPosition","chevronPosition","inheritText","underline","disabled","href","target","rotate","icon","loading","_getIcon","color","handleClick","ev","preventDefault","onClick","emit","flip","iconFlip","iconRotate","iconComponentCss","Icon","styles","transform","innerHTML","loaderComponentCss","Loader","_show","show","_loader","componentWillRender","_checkShow","componentShouldUpdate","_showSubscriber","unsubscribe","_a","subscribe"],"sources":["src/utils/icons.ts","src/components/atoms/button/button.component.scss?tag=p-button","src/components/atoms/button/button.component.tsx","src/components/atoms/icon/icon.component.scss?tag=p-icon","src/components/atoms/icon/icon.component.tsx","src/components/atoms/loader/loader.component.scss?tag=p-loader&encapsulation=shadow","src/components/atoms/loader/loader.component.tsx"],"sourcesContent":["import arrow from '../assets/icons/arrow.svg';\nimport attachment from '../assets/icons/attachment.svg';\nimport bread from '../assets/icons/bread.svg';\nimport calendar from '../assets/icons/calendar.svg';\nimport camera from '../assets/icons/camera.svg';\nimport car from '../assets/icons/car.svg';\nimport checklist from '../assets/icons/checklist.svg';\nimport checkmark from '../assets/icons/checkmark.svg';\nimport chevron from '../assets/icons/chevron.svg';\nimport chevrons from '../assets/icons/chevrons.svg';\nimport clock from '../assets/icons/clock.svg';\nimport cogs from '../assets/icons/cogs.svg';\nimport colleagues from '../assets/icons/colleagues.svg';\nimport comment from '../assets/icons/comment.svg';\nimport companies from '../assets/icons/companies.svg';\nimport company from '../assets/icons/company.svg';\nimport deactivate from '../assets/icons/deactivate.svg';\nimport document from '../assets/icons/document.svg';\nimport download from '../assets/icons/download.svg';\nimport envelope from '../assets/icons/envelope.svg';\nimport explanation from '../assets/icons/explanation.svg';\nimport eye from '../assets/icons/eye.svg';\nimport faPiggy from '../assets/icons/fa/piggy.svg';\nimport filter from '../assets/icons/filter.svg';\nimport folder from '../assets/icons/folder.svg';\nimport formula from '../assets/icons/formula.svg';\nimport grid from '../assets/icons/grid.svg';\nimport hashtag from '../assets/icons/hashtag.svg';\nimport headset from '../assets/icons/headset.svg';\nimport iDeal from '../assets/icons/iDeal.svg';\nimport integration from '../assets/icons/integration.svg';\nimport list from '../assets/icons/list.svg';\nimport location from '../assets/icons/location.svg';\nimport megaphone from '../assets/icons/megaphone.svg';\nimport menu from '../assets/icons/menu.svg';\nimport minus from '../assets/icons/minus.svg';\nimport more from '../assets/icons/more.svg';\nimport negative from '../assets/icons/negative.svg';\nimport notification from '../assets/icons/notification.svg';\nimport pagination from '../assets/icons/pagination.svg';\nimport payment from '../assets/icons/payment.svg';\nimport pencil from '../assets/icons/pencil.svg';\nimport person from '../assets/icons/person.svg';\nimport plan from '../assets/icons/plan.svg';\nimport plus from '../assets/icons/plus.svg';\nimport question from '../assets/icons/question.svg';\nimport receipt from '../assets/icons/receipt.svg';\nimport reload from '../assets/icons/reload.svg';\nimport report from '../assets/icons/report.svg';\nimport search from '../assets/icons/search.svg';\nimport settings from '../assets/icons/settings.svg';\nimport sick from '../assets/icons/sick.svg';\nimport signout from '../assets/icons/signout.svg';\nimport switchIcon from '../assets/icons/switch.svg';\nimport tachometer from '../assets/icons/tachometer.svg';\nimport task from '../assets/icons/task.svg';\nimport template from '../assets/icons/template.svg';\nimport tool from '../assets/icons/tool.svg';\nimport trash from '../assets/icons/trash.svg';\nimport turn from '../assets/icons/turn.svg';\nimport upload from '../assets/icons/upload.svg';\nimport warning from '../assets/icons/warning.svg';\n\nexport default {\n\tarrow,\n\tattachment,\n\tbread,\n\tcalendar,\n\tcamera,\n\tcar,\n\tchecklist,\n\tcheckmark,\n\tchevron,\n\tchevrons,\n\tclock,\n\tcolleagues,\n\tcogs,\n\tcomment,\n\tcompanies,\n\tcompany,\n\tdeactivate,\n\tdocument,\n\tdownload,\n\tenvelope,\n\texplanation,\n\teye,\n\tfaPiggy,\n\tfilter,\n\tfolder,\n\tformula,\n\tgrid,\n\thashtag,\n\theadset,\n\tiDeal,\n\tintegration,\n\tlist,\n\tlocation,\n\tmegaphone,\n\tmenu,\n\tminus,\n\tmore,\n\tnegative,\n\tnotification,\n\tpagination,\n\tpayment,\n\tpencil,\n\tperson,\n\tplan,\n\tplus,\n\tquestion,\n\treload,\n\treceipt,\n\treport,\n\tsearch,\n\tsettings,\n\tsick,\n\tsignout,\n\tswitch: switchIcon,\n\ttachometer,\n\ttask,\n\ttemplate,\n\ttool,\n\ttrash,\n\tturn,\n\tupload,\n\twarning,\n};\n","p-button {\n\t@apply flex h-10 w-auto text-base;\n\n\tbutton,\n\ta {\n\t\toutline: 0;\n\t\tborder: 0;\n\t\t@apply h-full w-full;\n\t\t@apply rounded-large #{!important};\n\t\t@apply font-semibold leading-4;\n\t\t@apply flex items-center justify-center;\n\t\t@apply cursor-pointer text-base;\n\n\t\twill-change: filter;\n\n\t\t> p-loader {\n\t\t\t@apply ml-2;\n\t\t}\n\n\t\t// Icon positions\n\t\t&.icon-position-end {\n\t\t\t> p-icon:not(.chevron) {\n\t\t\t\t@apply ml-2;\n\t\t\t}\n\t\t}\n\n\t\t&.icon-position-start {\n\t\t\t> p-icon:not(.chevron) {\n\t\t\t\t@apply mr-2;\n\t\t\t}\n\t\t}\n\n\t\t// Variants\n\t\t&.variant-primary,\n\t\t&.variant-secondary {\n\t\t\t@apply px-4 filter;\n\t\t}\n\n\t\t&.variant-primary,\n\t\t&.variant-secondary {\n\t\t\t&:active,\n\t\t\t&.active {\n\t\t\t\t@apply drop-shadow-transparent;\n\t\t\t}\n\t\t}\n\n\t\t&.variant-primary {\n\t\t\t@apply bg-indigo text-white;\n\n\t\t\t&:active,\n\t\t\t&.active {\n\t\t\t\t&:not([disabled]) {\n\t\t\t\t\t@apply bg-indigo-dark;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t@media (pointer: fine) {\n\t\t\t\t&:hover:not([disabled]) {\n\t\t\t\t\t@apply drop-shadow-button-primary-hover;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t&.variant-secondary {\n\t\t\t@apply border border-solid border-mystic-dark #{!important};\n\t\t\t@apply bg-white text-storm;\n\n\t\t\t&:active,\n\t\t\t&.active {\n\t\t\t\t&:not([disabled]) {\n\t\t\t\t\t@apply bg-mystic;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t@media (pointer: fine) {\n\t\t\t\t&:hover:not([disabled]) {\n\t\t\t\t\t@apply drop-shadow-button-secondary-hover;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t&.variant-text {\n\t\t\t@apply text-indigo;\n\n\t\t\t&.has-underline {\n\t\t\t\t@apply underline underline-offset-1;\n\t\t\t}\n\n\t\t\t&:hover:not([disabled]) {\n\t\t\t\t@apply text-indigo-dark;\n\t\t\t}\n\t\t}\n\n\t\t&[disabled] {\n\t\t\t@apply opacity-40;\n\t\t}\n\n\t\t&.should-inherit-text {\n\t\t\tcolor: inherit #{!important};\n\t\t\tfont-size: inherit #{!important};\n\t\t\tfont-weight: inherit #{!important};\n\t\t}\n\t}\n\n\t// chevron\n\t&.has-chevron {\n\t\ta,\n\t\tbutton {\n\t\t\t&.chevron-position-start {\n\t\t\t\t@apply pl-2;\n\n\t\t\t\t> p-icon.chevron {\n\t\t\t\t\t@apply mr-2;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t&.chevron-position-end {\n\t\t\t\t@apply pr-2;\n\n\t\t\t\t> p-icon.chevron {\n\t\t\t\t\t@apply ml-2;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t&.variant-secondary:hover:not([disabled]) p-icon:last-child {\n\t\t\t\t@apply text-indigo;\n\t\t\t}\n\t\t}\n\t}\n\n\t&.has-icon-only {\n\t\t@apply w-10;\n\n\t\ta,\n\t\tbutton {\n\t\t\t@apply p-0;\n\n\t\t\t> p-icon:first-child {\n\t\t\t\t@apply mx-0;\n\t\t\t}\n\n\t\t\t> p-loader {\n\t\t\t\t@apply ml-0;\n\t\t\t}\n\t\t}\n\n\t\t&.has-chevron {\n\t\t\t@apply w-auto;\n\n\t\t\ta,\n\t\t\tbutton {\n\t\t\t\t&.chevron-position-start {\n\t\t\t\t\t@apply pr-2;\n\t\t\t\t}\n\n\t\t\t\t&.chevron-position-end {\n\t\t\t\t\t@apply pl-2;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\t// sizes\n\t&.size-small {\n\t\t@apply h-8;\n\n\t\tbutton,\n\t\ta {\n\t\t\t@apply text-sm;\n\n\t\t\t> p-icon {\n\t\t\t\t@apply text-base;\n\t\t\t}\n\t\t}\n\n\t\t&.has-icon-only {\n\t\t\t@apply w-8;\n\n\t\t\t&.has-chevron {\n\t\t\t\t@apply w-auto;\n\t\t\t}\n\t\t}\n\t}\n}\n","import {\n\tComponent,\n\tEvent,\n\tEventEmitter,\n\th,\n\tHost,\n\tListen,\n\tProp,\n} from '@stencil/core';\nimport { RotateOptions } from '../../../types/tailwind';\nimport { IconFlipOptions, IconVariant } from '../icon/icon.component';\n\n@Component({\n\ttag: 'p-button',\n\tstyleUrl: 'button.component.scss',\n\t// shadow: true,\n})\nexport class Button {\n\t/**\n\t * The variant of the button\n\t */\n\t@Prop() variant: 'primary' | 'secondary' | 'text' = 'primary';\n\n\t/**\n\t * Wether the text variant has underline\n\t */\n\t@Prop() underline: boolean = false;\n\n\t/**\n\t * Href in case of \"text\" version\n\t */\n\t@Prop() href: string;\n\n\t/**\n\t * Target in case of \"text\" version\n\t */\n\t@Prop() target: string;\n\n\t/**\n\t * The size of the button\n\t */\n\t@Prop() size: 'small' | 'medium' = 'medium';\n\n\t/**\n\t * Wether to show a loader or not\n\t */\n\t@Prop() loading: boolean = false;\n\n\t/**\n\t * Wether to show a chevron or not\n\t */\n\t@Prop() chevron: boolean | 'up' | 'down' = false;\n\n\t/**\n\t * Chevron position\n\t */\n\t@Prop() chevronPosition: 'start' | 'end' = 'end';\n\n\t/**\n\t * Wether the button is disabled\n\t */\n\t@Prop() disabled: boolean = false;\n\n\t/**\n\t * Icon to show on the button\n\t */\n\t@Prop() icon: IconVariant;\n\n\t/**\n\t * Wether the button is icon only\n\t */\n\t@Prop() iconOnly: boolean = false;\n\n\t/**\n\t * Icon position\n\t */\n\t@Prop() iconPosition: 'start' | 'end' = 'end';\n\n\t/**\n\t * Icon flip\n\t */\n\t@Prop() iconFlip: IconFlipOptions;\n\n\t/**\n\t * Icon rotate\n\t */\n\t@Prop() iconRotate: RotateOptions;\n\n\t/**\n\t * Wether the button should inherit text styles\n\t */\n\t@Prop() inheritText: boolean = false;\n\n\t/**\n\t * Button click event\n\t */\n\t@Event({\n\t\tbubbles: false,\n\t})\n\tonClick: EventEmitter<MouseEvent>;\n\n\trender() {\n\t\tlet loaderColor: 'white' | 'storm' | 'indigo' = 'white';\n\t\tswitch (this.variant) {\n\t\t\tcase 'secondary':\n\t\t\t\tloaderColor = 'storm';\n\t\t\t\tbreak;\n\t\t\tcase 'text':\n\t\t\t\tloaderColor = 'indigo';\n\t\t\t\tbreak;\n\t\t}\n\n\t\tconst VariableTag = this.variant === 'text' ? 'a' : 'button';\n\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={`p-button size-${this.size} ${\n\t\t\t\t\tthis.iconOnly && 'has-icon-only'\n\t\t\t\t} ${this.chevron && 'has-chevron'}`}\n\t\t\t>\n\t\t\t\t<VariableTag\n\t\t\t\t\tclass={`variant-${this.variant} icon-position-${\n\t\t\t\t\t\tthis.iconPosition\n\t\t\t\t\t} chevron-position-${this.chevronPosition} ${\n\t\t\t\t\t\tthis.inheritText && 'should-inherit-text'\n\t\t\t\t\t} ${this.underline && 'has-underline'}`}\n\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\thref={this.href}\n\t\t\t\t\ttarget={this.target}\n\t\t\t\t>\n\t\t\t\t\t{this.chevron && this.chevronPosition === 'start' && (\n\t\t\t\t\t\t<p-icon\n\t\t\t\t\t\t\tclass=\"chevron\"\n\t\t\t\t\t\t\tvariant=\"chevron\"\n\t\t\t\t\t\t\trotate={this.chevron === 'up' ? 180 : 0}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{this.icon &&\n\t\t\t\t\t\tthis.iconPosition === 'start' &&\n\t\t\t\t\t\t!(this.iconOnly && this.loading) &&\n\t\t\t\t\t\tthis._getIcon()}\n\n\t\t\t\t\t<slot />\n\n\t\t\t\t\t{this.icon &&\n\t\t\t\t\t\tthis.iconPosition === 'end' &&\n\t\t\t\t\t\t!(this.iconOnly && this.loading) &&\n\t\t\t\t\t\tthis._getIcon()}\n\n\t\t\t\t\t{this.loading && <p-loader color={loaderColor} />}\n\n\t\t\t\t\t{this.chevron && this.chevronPosition === 'end' && (\n\t\t\t\t\t\t<p-icon\n\t\t\t\t\t\t\tclass=\"chevron\"\n\t\t\t\t\t\t\tvariant=\"chevron\"\n\t\t\t\t\t\t\trotate={this.chevron === 'up' ? 180 : 0}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</VariableTag>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t@Listen('click', { capture: true })\n\thandleClick(ev: MouseEvent) {\n\t\tif (this.loading || this.disabled) {\n\t\t\tev.preventDefault();\n\t\t\treturn;\n\t\t}\n\n\t\tthis.onClick.emit(ev);\n\t}\n\n\tprivate _getIcon() {\n\t\tif (!this.icon) {\n\t\t\treturn;\n\t\t}\n\n\t\treturn (\n\t\t\t<p-icon\n\t\t\t\tvariant={this.icon}\n\t\t\t\tflip={this.iconFlip}\n\t\t\t\trotate={this.iconRotate}\n\t\t\t/>\n\t\t);\n\t}\n}\n",":host {\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\nimport { RotateOptions, TextSizeOptions } from '../../../types/tailwind';\nimport icons from '../../../utils/icons';\n\nexport type IconVariant = keyof typeof icons;\nexport type IconFlipOptions = 'horizontal' | 'vertical';\n\n@Component({\n\ttag: 'p-icon',\n\tstyleUrl: 'icon.component.scss',\n\t// shadow: true,\n})\nexport class Icon {\n\t/**\n\t * The icon the be displayed\n\t */\n\t@Prop() variant!: IconVariant;\n\n\t/**\n\t * The size of the icon, using tailwind sizes\n\t */\n\t@Prop() size: TextSizeOptions = 'auto';\n\n\t/**\n\t * Wether to rotate the icon x degrees\n\t */\n\t@Prop() rotate: RotateOptions = 0;\n\n\t/**\n\t * Wether to flip the icon horizontally or vertically\n\t */\n\t@Prop() flip: IconFlipOptions = null;\n\n\trender() {\n\t\tconst icon = icons[this.variant];\n\n\t\tconst styles = {\n\t\t\t'p-icon flex': true,\n\t\t\t'text-auto': this.size === 'auto',\n\t\t\t'text-xxs': this.size === 'xxs',\n\t\t\t'text-xs': this.size === 'xs',\n\t\t\t'text-sm': this.size === 'sm',\n\t\t\t'text-base': this.size === 'base',\n\t\t\t'text-lg': this.size === 'lg',\n\t\t\t'text-xl': this.size === 'xl',\n\t\t\t'text-2xl': this.size === '2xl',\n\t\t\t'text-3xl': this.size === '3xl',\n\t\t\t'text-4xl': this.size === '4xl',\n\t\t\t'text-5xl': this.size === '5xl',\n\t\t\t'text-6xl': this.size === '6xl',\n\t\t\ttransform: !!this.rotate || !!this.flip,\n\t\t\t'scale-x-flip': this.flip === 'horizontal',\n\t\t\t'scale-y-flip': this.flip === 'vertical',\n\t\t\t'rotate-0': this.rotate === 0,\n\t\t\t'rotate-25': this.rotate === 25,\n\t\t\t'rotate-45': this.rotate === 45,\n\t\t\t'rotate-90': this.rotate === 90,\n\t\t\t'rotate-135': this.rotate === 135,\n\t\t\t'rotate-180': this.rotate === 180,\n\t\t\t'rotate-225': this.rotate === 225,\n\t\t\t'rotate-270': this.rotate === 270,\n\t\t\t'rotate-315': this.rotate === 315,\n\t\t\t'-rotate-0': this.rotate === -0,\n\t\t\t'-rotate-25': this.rotate === -25,\n\t\t\t'-rotate-45': this.rotate === -45,\n\t\t\t'-rotate-90': this.rotate === -90,\n\t\t\t'-rotate-135': this.rotate === -135,\n\t\t\t'-rotate-180': this.rotate === -180,\n\t\t\t'-rotate-225': this.rotate === -225,\n\t\t\t'-rotate-270': this.rotate === -270,\n\t\t\t'-rotate-315': this.rotate === -315,\n\t\t};\n\n\t\treturn <Host class={styles} innerHTML={icon}></Host>;\n\t}\n}\n",":host {\n\t.loader {\n\t\t@apply inline-block h-[1em] w-[1em] rounded-round;\n\t\t@apply border-2 border-solid border-indigo-light border-t-indigo;\n\t\tanimation: 500ms spin linear infinite;\n\n\t\twill-change: transform;\n\n\t\t&.color-storm {\n\t\t\t@apply border-storm-light/40 border-t-storm #{!important};\n\t\t}\n\n\t\t&.color-white {\n\t\t\t@apply border-indigo-light/40 border-t-white #{!important};\n\t\t}\n\t}\n\n\t.loading-screen {\n\t\t@apply w-screen-safe h-screen-safe fixed top-0 left-0;\n\t\t@apply flex items-center justify-center;\n\t\t@apply bg-mystic;\n\n\t\tz-index: 1001;\n\n\t\t.content {\n\t\t\t@apply max-w-xs;\n\n\t\t\t.loader-wrapper {\n\t\t\t\t@apply flex w-full justify-center;\n\n\t\t\t\t.loader {\n\t\t\t\t\t@apply text-4xl;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}\n\n:host(.variant-ghost) {\n\t@apply box-border block;\n\n\twill-change: background, background-position-x, background-color;\n\n\tmin-height: 1em;\n\tmin-width: 1em;\n\n\t--loading-bg: #f7fafc;\n\t--loading-stripe: rgba(252, 253, 254, 1);\n\n\tbackground-color: var(--loading-bg);\n\tbackground: linear-gradient(\n\t\t\t100deg,\n\t\t\trgba(255, 255, 255, 0) 40%,\n\t\t\tvar(--loading-stripe) 50%,\n\t\t\trgba(255, 255, 255, 0) 60%\n\t\t)\n\t\tvar(--loading-bg);\n\tbackground-size: 200% 100%;\n\tbackground-position-x: 180%;\n\tanimation: 1s loading ease-in-out infinite;\n}\n\n@keyframes loading {\n\tto {\n\t\tbackground-position-x: -20%;\n\t}\n}\n\n@keyframes spin {\n\t100% {\n\t\ttransform: rotate(1turn);\n\t}\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\nimport { Observable, Subscription } from 'rxjs';\n\n@Component({\n\ttag: 'p-loader',\n\tstyleUrl: 'loader.component.scss',\n\tshadow: true,\n})\nexport class Loader {\n\t/**\n\t * Wether to show or hide the loader\n\t */\n\t@Prop() show: boolean | Observable<boolean> = true;\n\n\t/**\n\t * Variant of loader\n\t */\n\t@Prop() variant:\n\t\t| 'inline'\n\t\t| 'full-width'\n\t\t| 'full-screen'\n\t\t| 'modal'\n\t\t| 'ghost' = 'inline';\n\n\t/**\n\t * Color of the loader\n\t */\n\t@Prop() color: 'indigo' | 'white' | 'storm' = 'indigo';\n\n\t/**\n\t * !NOT IMPLEMENTED! Modal title for modal variant\n\t */\n\t@Prop() modalTitle: string;\n\n\t/**\n\t * !NOT IMPLEMENTED! Modal description for modal variant\n\t */\n\t@Prop() modalDescription: string;\n\n\tprivate _show = this.show;\n\tprivate _showSubscriber: Subscription;\n\n\tprivate _loader = (<div class={`loader color-${this.color}`}></div>);\n\n\tcomponentWillRender() {\n\t\tthis._checkShow();\n\t}\n\n\tcomponentShouldUpdate() {\n\t\tthis._checkShow();\n\t}\n\n\trender() {\n\t\tif (!this._show) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (this.variant === 'ghost') {\n\t\t\treturn <Host class=\"p-loader variant-ghost\"></Host>;\n\t\t}\n\n\t\tif (this.variant === 'full-screen') {\n\t\t\treturn (\n\t\t\t\t<Host class=\"p-loader variant-full-screen\">\n\t\t\t\t\t<div class=\"loading-screen\">\n\t\t\t\t\t\t<div class=\"content\">\n\t\t\t\t\t\t\t<slot />\n\n\t\t\t\t\t\t\t<div class=\"loader-wrapper\">{this._loader}</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</Host>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={`p-loader variant-default flex ${\n\t\t\t\t\tthis.variant === 'full-width' &&\n\t\t\t\t\t'w-full flex justify-center text-4xl'\n\t\t\t\t}`}\n\t\t\t>\n\t\t\t\t{this._loader}\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate _checkShow() {\n\t\tif (this._showSubscriber) {\n\t\t\tthis._showSubscriber.unsubscribe();\n\t\t\tthis._showSubscriber = null;\n\t\t}\n\n\t\tif (typeof this.show !== 'boolean') {\n\t\t\tthis._showSubscriber = this.show?.subscribe(\n\t\t\t\t(show) => (this._show = show)\n\t\t\t);\n\t\t\treturn;\n\t\t}\n\n\t\tthis._show = this.show;\n\t}\n}\n"],"mappings":"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"}