@six-group/ui-library 0.0.0-insider.c4e8588 → 0.0.0-insider.c8fa9a3

package/dist/ui-library/p-1e4d1252.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["sixSidebarItemGroupCss","SixSidebarItemGroup","constructor","hostRef","this","hasItems","name","icon","value","open","summaryIconHasContent","handleDetailsShow","event","stopPropagation","handleDetailsHide","provideSlot","h","slot","onSlotchange","_a","host","shadowRoot","querySelector","assignedNodes","length","connectedCallback","handleSlotChange","bind","componentWillLoad","hasSlot","isSubgroup","parentElement","closest","renderAsHref","href","render","element","class","inline","summaryIcon","hasContent","tabindex","undefined"],"sources":["src/components/six-sidebar-item-group/six-sidebar-item-group.scss?tag=six-sidebar-item-group&encapsulation=shadow","src/components/six-sidebar-item-group/six-sidebar-item-group.tsx"],"sourcesContent":["@import 'src/global/component';\n\n:host {\n  display: block;\n}\n\n.six-sidebar-item-group {\n  --horizontal-padding: var(--six-spacing-large);\n  &::part(content) {\n    padding: var(--six-spacing-medium) 0 var(--six-spacing-medium) var(--six-spacing-medium) !important;\n  }\n}\n\n.six-sidebar-item-group--childless::part(content) {\n  padding: 0 !important;\n}\n\n.six-sidebar-item-group--subgroup::part(header) {\n  background-color: transparent !important;\n  padding: var(--six-spacing-small) var(--six-spacing-large) var(--six-spacing-small) var(--six-spacing-medium) !important;\n  margin-left: var(--six-spacing-xx-small);\n}\n\n.six-sidebar-item-group__header-icon {\n  margin-left: 16px;\n  transform: translate(0px, -3px);\n}\n\n.six-sidebar-details__header {\n  display: flex;\n  align-items: center;\n  overflow-wrap: anywhere;\n}\n\n.six-sidebar-details__header-icon {\n  margin-right: var(--six-spacing-medium);\n}\n\n.six-sidebar-details__link {\n  text-decoration: none;\n  display: block;\n  color: inherit;\n  width: 100%;\n\n  &:focus {\n    outline: none;\n  }\n\n  &:focus-visible {\n    outline: var(--six-focus-ring);\n    outline-offset: calc(-1 * var(--six-focus-ring-offset));\n  }\n}\n","import { Component, Element, h, Prop, State } from '@stencil/core';\nimport { hasSlot } from '../../utils/slot';\nimport { SixDetailsCustomEvent } from '../../components';\n\n/**\n * @since 1.0\n * @status stable\n *\n * @slot - Used to define the nested sidebar [group] items.\n */\n\n@Component({\n  tag: 'six-sidebar-item-group',\n  styleUrl: 'six-sidebar-item-group.scss',\n  shadow: true,\n})\nexport class SixSidebarItemGroup {\n  @Element() readonly host!: HTMLSixSidebarItemGroupElement;\n\n  @State() hasItems = false;\n\n  /** Title of item group */\n  @Prop() name = '';\n\n  /** Icon of the group */\n  @Prop() icon = '';\n\n  /** A unique value to store in the sidebar item of the group label. This can be used as a way to identify sidebar items when selected. */\n  @Prop({ reflect: true }) value = '';\n\n  /** Indicates whether the sidebar is shown */\n  @Prop({ reflect: true, mutable: true }) open = false;\n\n  /** Custom summary icon name. */\n  @Prop() summaryIcon?: string;\n\n  @State() summaryIconHasContent = false;\n\n  /**\n   * Provide if the item should be rendered as anchor tag.\n   * Note, that the href is added automatically when using routerLink in Angular.\n   */\n  @Prop({ reflect: true }) href: string | undefined;\n\n  connectedCallback() {\n    this.handleSlotChange = this.handleSlotChange.bind(this);\n  }\n\n  componentWillLoad() {\n    this.handleSlotChange();\n  }\n\n  private handleSlotChange() {\n    this.hasItems = hasSlot(this.host);\n  }\n\n  private isSubgroup() {\n    return this.host.parentElement?.closest('six-sidebar-item-group') != null;\n  }\n\n  private renderAsHref(): boolean {\n    return this.href != null && !this.hasItems;\n  }\n\n  private handleDetailsShow = (event: SixDetailsCustomEvent<undefined>) => {\n    event.stopPropagation();\n    this.open = true;\n  };\n\n  private handleDetailsHide = (event: SixDetailsCustomEvent<undefined>) => {\n    event.stopPropagation();\n    this.open = false;\n  };\n\n  private provideSlot = (name: string) => {\n    if (this.summaryIconHasContent) {\n      return (\n        <div slot={name}>\n          <slot name={name}></slot>\n        </div>\n      );\n    }\n\n    return (\n      <slot\n        name={name}\n        onSlotchange={() => {\n          const slot = this.host.shadowRoot?.querySelector<HTMLSlotElement>(`slot[name=\"${name}\"]`);\n          if (slot != null) {\n            this.summaryIconHasContent = slot.assignedNodes().length > 0;\n          }\n        }}\n      ></slot>\n    );\n  };\n\n  render() {\n    const element = (\n      <six-details\n        class={{\n          'six-sidebar-item-group': true,\n          'six-sidebar-item-group--childless': !this.hasItems,\n          'six-sidebar-item-group--subgroup': this.isSubgroup(),\n        }}\n        inline={true}\n        open={this.open}\n        summary-icon={this.summaryIcon}\n        onSix-details-show={this.handleDetailsShow}\n        onSix-details-hide={this.handleDetailsHide}\n        hasContent={this.hasItems}\n        tabindex={this.renderAsHref() ? -1 : undefined}\n      >\n        <div slot=\"summary\">\n          <div class=\"six-sidebar-details__header\">\n            {this.icon && <six-icon class=\"six-sidebar-details__header-icon\">{this.icon}</six-icon>}\n            {this.name}\n          </div>\n        </div>\n        {this.provideSlot('summary-icon')}\n        <slot />\n      </six-details>\n    );\n\n    if (this.renderAsHref()) {\n      return (\n        <a class=\"six-sidebar-details__link\" href={this.href}>\n          {element}\n        </a>\n      );\n    } else {\n      return element;\n    }\n  }\n}\n"],"mappings":"sFAAA,MAAMA,EAAyB,+vC,MCgBlBC,EAAmB,MALhC,WAAAC,CAAAC,G,UAQWC,KAAQC,SAAG,MAGZD,KAAIE,KAAG,GAGPF,KAAIG,KAAG,GAGUH,KAAKI,MAAG,GAGOJ,KAAIK,KAAG,MAKtCL,KAAqBM,sBAAG,MA4BzBN,KAAAO,kBAAqBC,IAC3BA,EAAMC,kBACNT,KAAKK,KAAO,IAAI,EAGVL,KAAAU,kBAAqBF,IAC3BA,EAAMC,kBACNT,KAAKK,KAAO,KAAK,EAGXL,KAAAW,YAAeT,IACrB,GAAIF,KAAKM,sBAAuB,CAC9B,OACEM,EAAA,OAAKC,KAAMX,GACTU,EAAA,QAAMV,KAAMA,I,CAKlB,OACEU,EAAA,QACEV,KAAMA,EACNY,aAAc,K,MACZ,MAAMD,GAAOE,EAAAf,KAAKgB,KAAKC,cAAU,MAAAF,SAAA,SAAAA,EAAEG,cAA+B,cAAchB,OAChF,GAAIW,GAAQ,KAAM,CAChBb,KAAKM,sBAAwBO,EAAKM,gBAAgBC,OAAS,C,IAGzD,CAyCb,CAzFC,iBAAAC,GACErB,KAAKsB,iBAAmBtB,KAAKsB,iBAAiBC,KAAKvB,K,CAGrD,iBAAAwB,GACExB,KAAKsB,kB,CAGC,gBAAAA,GACNtB,KAAKC,SAAWwB,EAAQzB,KAAKgB,K,CAGvB,UAAAU,G,MACN,QAAOX,EAAAf,KAAKgB,KAAKW,iBAAe,MAAAZ,SAAA,SAAAA,EAAAa,QAAQ,4BAA6B,I,CAG/D,YAAAC,GACN,OAAO7B,KAAK8B,MAAQ,OAAS9B,KAAKC,Q,CAmCpC,MAAA8B,GACE,MAAMC,EACJpB,EAAA,eACEqB,MAAO,CACL,yBAA0B,KAC1B,qCAAsCjC,KAAKC,SAC3C,mCAAoCD,KAAK0B,cAE3CQ,OAAQ,KACR7B,KAAML,KAAKK,KAAI,eACDL,KAAKmC,YACC,qBAAAnC,KAAKO,kBAAiB,qBACtBP,KAAKU,kBACzB0B,WAAYpC,KAAKC,SACjBoC,SAAUrC,KAAK6B,gBAAiB,EAAKS,WAErC1B,EAAK,OAAAC,KAAK,WACRD,EAAK,OAAAqB,MAAM,+BACRjC,KAAKG,MAAQS,EAAU,YAAAqB,MAAM,oCAAoCjC,KAAKG,MACtEH,KAAKE,OAGTF,KAAKW,YAAY,gBAClBC,EAAQ,cAIZ,GAAIZ,KAAK6B,eAAgB,CACvB,OACEjB,EAAA,KAAGqB,MAAM,4BAA4BH,KAAM9B,KAAK8B,MAC7CE,E,KAGA,CACL,OAAOA,C","ignoreList":[]}

package/dist/ui-library/p-1e67ac05.entry.js

@@ -0,0 +1,2 @@
+import{r as o,h as r}from"./p-D0Go1Zjj.js";const a=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}:host{display:inline-flex}.badge{display:inline-flex;align-items:center;justify-content:center;font-family:var(--six-font-family);font-size:var(--six-font-size-x-small);font-weight:var(--six-font-weight-semibold);letter-spacing:var(--six-letter-spacing-normal);line-height:1;border-radius:var(--six-border-radius-small);white-space:nowrap;padding:3px 6px;user-select:none;cursor:inherit}.badge--info{background-color:var(--six-color-web-rock-900);color:var(--six-color-white)}.badge--success{background-color:var(--six-color-success-500);color:var(--six-color-web-rock-900)}.badge--warning{background-color:var(--six-color-warning-700);color:var(--six-color-web-rock-900)}.badge--danger{background-color:var(--six-color-danger-800);color:var(--six-color-white)}.badge--action{background-color:var(--six-color-action-500);color:var(--six-color-white)}.badge--primary{background-color:var(--six-color-clay-50);color:var(--six-color-black)}.badge--pill{border-radius:var(--six-border-radius-pill)}.badge--pulse{animation:pulse 1.5s infinite}.badge--pulse.badge--info{--pulse-color:var(--six-color-web-rock-900)}.badge--pulse.badge--success{--pulse-color:var(--six-color-success-500)}.badge--pulse.badge--warning{--pulse-color:var(--six-color-warning-700)}.badge--pulse.badge--danger{--pulse-color:var(--six-color-danger-800)}.badge--pulse.badge--action{--pulse-color:var(--six-color-action-500)}.badge--pulse.badge--primary{--pulse-color:var(--six-color-clay-50)}@keyframes pulse{0%{box-shadow:0 0 0 0 var(--pulse-color)}70%{box-shadow:0 0 0 0.5rem transparent}100%{box-shadow:0 0 0 0 transparent}}";const e=class{constructor(r){o(this,r);this.type="primary";this.pill=false;this.pulse=false}render(){return r("span",{key:"6352c1b6f7b593982f42b4e26862f365d9aa32fa",part:"base",class:{badge:true,"badge--primary":this.type==="primary","badge--secondary":this.type==="secondary","badge--success":this.type==="success","badge--warning":this.type==="warning","badge--danger":this.type==="danger","badge--action":this.type==="action","badge--info":this.type==="info","badge--pill":this.pill,"badge--pulse":this.pulse},role:"status"},r("slot",{key:"df34cfd3b2ecd789592b0436948a4918616dcf9f"}))}};e.style=a;export{e as six_badge};
+//# sourceMappingURL=p-1e67ac05.entry.js.map

package/dist/ui-library/p-1e67ac05.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["sixBadgeCss","SixBadge","constructor","hostRef","this","type","pill","pulse","render","h","key","part","class","badge","role"],"sources":["src/components/six-badge/six-badge.scss?tag=six-badge&encapsulation=shadow","src/components/six-badge/six-badge.tsx"],"sourcesContent":["@import 'src/global/component';\n\n:host {\n  display: inline-flex;\n}\n\n.badge {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  font-family: var(--six-font-family);\n  font-size: var(--six-font-size-x-small);\n  font-weight: var(--six-font-weight-semibold);\n  letter-spacing: var(--six-letter-spacing-normal);\n  line-height: 1;\n  border-radius: var(--six-border-radius-small);\n  white-space: nowrap;\n  padding: 3px 6px;\n  user-select: none;\n  cursor: inherit;\n}\n\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n// Type modifiers\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n\n.badge--info {\n  background-color: var(--six-color-web-rock-900);\n  color: var(--six-color-white);\n}\n\n.badge--success {\n  background-color: var(--six-color-success-500);\n  color: var(--six-color-web-rock-900);\n}\n\n.badge--warning {\n  background-color: var(--six-color-warning-700);\n  color: var(--six-color-web-rock-900);\n}\n\n.badge--danger {\n  background-color: var(--six-color-danger-800);\n  color: var(--six-color-white);\n}\n\n.badge--action {\n  background-color: var(--six-color-action-500);\n  color: var(--six-color-white);\n}\n\n.badge--primary {\n  background-color: var(--six-color-clay-50);\n  color: var(--six-color-black);\n}\n\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n// Pill modifier\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n\n.badge--pill {\n  border-radius: var(--six-border-radius-pill);\n}\n\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n// Pulse modifier\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n\n.badge--pulse {\n  animation: pulse 1.5s infinite;\n}\n\n.badge--pulse.badge--info {\n  --pulse-color: var(--six-color-web-rock-900);\n}\n\n.badge--pulse.badge--success {\n  --pulse-color: var(--six-color-success-500);\n}\n\n.badge--pulse.badge--warning {\n  --pulse-color: var(--six-color-warning-700);\n}\n\n.badge--pulse.badge--danger {\n  --pulse-color: var(--six-color-danger-800);\n}\n\n.badge--pulse.badge--action {\n  --pulse-color: var(--six-color-action-500);\n}\n\n.badge--pulse.badge--primary {\n  --pulse-color: var(--six-color-clay-50);\n}\n\n@keyframes pulse {\n  0% {\n    box-shadow: 0 0 0 0 var(--pulse-color);\n  }\n  70% {\n    box-shadow: 0 0 0 0.5rem transparent;\n  }\n  100% {\n    box-shadow: 0 0 0 0 transparent;\n  }\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot - The badge's content.\n *\n * @part base - The base wrapper\n */\n\n@Component({\n  tag: 'six-badge',\n  styleUrl: 'six-badge.scss',\n  shadow: true,\n})\nexport class SixBadge {\n  /** The badge's type. */\n  @Prop() type: 'primary' | 'secondary' | 'success' | 'warning' | 'danger' | 'info' | 'action' = 'primary';\n\n  /** Set to true to draw a pill-style badge with rounded edges. */\n  @Prop() pill = false;\n\n  /** Set to true to make the badge pulsate to draw attention. */\n  @Prop() pulse = false;\n\n  render() {\n    return (\n      <span\n        part=\"base\"\n        class={{\n          badge: true,\n\n          // Types\n          'badge--primary': this.type === 'primary',\n          'badge--secondary': this.type === 'secondary',\n          'badge--success': this.type === 'success',\n          'badge--warning': this.type === 'warning',\n          'badge--danger': this.type === 'danger',\n          'badge--action': this.type === 'action',\n          'badge--info': this.type === 'info',\n          'badge--pill': this.pill,\n          'badge--pulse': this.pulse,\n        }}\n        role=\"status\"\n      >\n        <slot />\n      </span>\n    );\n  }\n}\n"],"mappings":"2CAAA,MAAMA,EAAc,kyD,MCkBPC,EAAQ,MALrB,WAAAC,CAAAC,G,UAOUC,KAAIC,KAAmF,UAGvFD,KAAIE,KAAG,MAGPF,KAAKG,MAAG,KA0BjB,CAxBC,MAAAC,GACE,OACEC,EACE,QAAAC,IAAA,2CAAAC,KAAK,OACLC,MAAO,CACLC,MAAO,KAGP,iBAAkBT,KAAKC,OAAS,UAChC,mBAAoBD,KAAKC,OAAS,YAClC,iBAAkBD,KAAKC,OAAS,UAChC,iBAAkBD,KAAKC,OAAS,UAChC,gBAAiBD,KAAKC,OAAS,SAC/B,gBAAiBD,KAAKC,OAAS,SAC/B,cAAeD,KAAKC,OAAS,OAC7B,cAAeD,KAAKE,KACpB,eAAgBF,KAAKG,OAEvBO,KAAK,UAELL,EAAQ,QAAAC,IAAA,6C","ignoreList":[]}

package/dist/ui-library/p-1f86bd3e.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as t,h as s,g as i}from"./p-D0Go1Zjj.js";import{h as o,a as l,g as r}from"./p-j3oIB5oT.js";import{F as a}from"./p-IBmarOIS.js";import{E as n}from"./p-C4h4qpGl.js";import{D as c,d as h}from"./p-ltzGzaAu.js";import{a as d}from"./p-1oJarDAY.js";function u(e,t){if(t){if(Array.isArray(e)){return e.filter((e=>typeof e==="string"))}else if(typeof e==="string"&&e.length>0){return[e]}else{return[]}}else{if(typeof e==="string"){return e}else{return""}}}function f(e){return u(e,true)}function p(e,t){if(Array.isArray(e)&&Array.isArray(t)){return e.length===t.length&&e.every(((e,s)=>e===t[s]))}else if(typeof e==="string"&&typeof t==="string"){return e===t}return false}const b=':host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.form-control .form-control__label{display:none}.form-control .form-control__help-text{display:none}.form-control .form-control__error-text{display:none;text-align:left}.form-control--has-label .form-control__label{display:inline-block;color:var(--six-input-label-color);font-weight:var(--six-font-weight-bold);margin-bottom:var(--six-spacing-x-small)}.form-control--has-label .form-control__label__required::after{color:var(--six-color-danger-800);content:"*";transform:scale(1.1);margin-left:var(--six-spacing-xxx-small);position:absolute}.form-control--has-label.form-control--small .form-control__label{font-size:var(--six-input-label-font-size-small)}.form-control--has-label.form-control--medium .form-control__label{font-size:var(--six-input-label-font-size-medium)}.form-control--has-label.form-control--large .form-control_label{font-size:var(--six-input-label-font-size-large)}.form-control--has-help-text .form-control__help-text{display:block;color:var(--six-input-help-text-color);margin-top:var(--six-spacing-x-small)}.form-control--has-help-text .form-control__help-text ::slotted(*){margin-top:var(--six-spacing-xxx-small)}.form-control--has-help-text.form-control--small .form-control__help-text{font-size:var(--six-input-help-text-font-size-small)}.form-control--has-help-text.form-control--medium .form-control__help-text{font-size:var(--six-input-help-text-font-size-medium)}.form-control--has-help-text.form-control--large .form-control__help-text{font-size:var(--six-input-help-text-font-size-large)}.form-control--has-error-text .form-control__error-text{display:block;margin-top:var(--six-spacing-xxx-small)}.form-control--has-error-text .form-control__error-text ::slotted(*){margin-top:var(--six-spacing-xxx-small)}.form-control--has-error-text.form-control--small .form-control__error-text{font-size:var(--six-input-help-text-font-size-small)}.form-control--has-error-text.form-control--medium .form-control__error-text{font-size:var(--six-input-help-text-font-size-medium)}.form-control--has-error-text.form-control--large .form-control__error-text{font-size:var(--six-input-help-text-font-size-large)}.form-control--disabled .form-control__help-text{color:var(--six-input-help-text-color-disabled)}.form-control--disabled .form-control__label{color:var(--six-input-label-color-disabled)}.form-control--invalid:not(.form-control--disabled) .form-control__label{color:var(--six-input-label-color)}:host,.select{display:block}.select__box{display:inline-flex;align-items:center;justify-content:start;position:relative;width:100%;font-family:var(--six-font-family);font-weight:var(--six-input-font-weight);font-size:var(--six-input-font-size-medium);letter-spacing:var(--six-input-letter-spacing);background-color:var(--six-input-background-color);border:solid var(--six-border-width) var(--six-input-border-color);vertical-align:middle;transition:var(--six-transition-fast) color, var(--six-transition-fast) border, var(--six-transition-fast) box-shadow;cursor:pointer}.select__box--line{border:none;border-bottom:solid var(--six-border-width) var(--six-input-border-color)}.select__box--autocomplete{border:none;overflow:initial}.select:not(.select--disabled) .select__box:hover{background-color:var(--six-input-background-color-hover);color:var(--six-input-color-hover);border-bottom-color:var(--six-input-border-color-hover)}.select:not(.select--disabled) .select__box:hover:not(.select__box--line){border-color:var(--six-input-border-color-hover)}.select:not(.select--disabled) .select__box:focus{background-color:var(--six-input-background-color-focus);outline:none;color:var(--six-input-color-focus);border-bottom-color:var(--six-input-border-color-focus);box-shadow:0 1px 0 0 var(--six-input-border-color-focus)}.select:not(.select--disabled) .select__box:focus:not(.select__box--line){border-color:var(--six-input-border-color-focus);box-shadow:var(--six-input-focus-shadow)}.select--disabled .select__box{background-color:var(--six-input-background-color-disabled);color:var(--six-input-color-disabled);cursor:not-allowed;outline:none}.select--disabled .select__box:not(.select__box--line){border-color:var(--six-input-border-color-disabled)}.select--disabled .select__clear{pointer-events:none}.select--invalid:not(.select--disabled):not(.select--focused) .select__box{border-bottom-color:var(--six-input-border-color-danger)}.select--invalid:not(.select--disabled):not(.select--focused) .select__box:not(.input--line){border-color:var(--six-input-border-color-danger)}.display__values{display:flex;flex:1 1 auto;align-items:center;user-select:none;overflow:hidden;scrollbar-width:none;-ms-overflow-style:none}.display__values::-webkit-scrollbar{width:0;height:0}.display__values-values{flex:0 1 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.display__values-and-counter{display:flex;overflow:hidden}.select__clear{flex-shrink:0;flex-grow:0;display:inline}.select__icon{flex-shrink:0;flex-grow:0;display:inline;transition:var(--six-transition-medium) transform ease}.select--open .select__icon{transform:rotate(-180deg)}.placeholder{color:var(--six-input-placeholder-color)}.select--disabled .placeholder{color:var(--six-input-placeholder-color-disabled)}.select__input{position:absolute;top:0;left:0;width:100%;height:100%}.select--small .select__box{border-radius:var(--six-input-border-radius-small);font-size:var(--six-input-font-size-small);min-height:var(--six-height-small)}.select--small .select__box--line{border:none;border-bottom:solid var(--six-border-width) var(--six-input-border-color)}.select--small .display__values{margin:0 0 0 var(--six-input-spacing-small)}.select--small .select__clear{margin-right:var(--six-spacing-xxx-small)}.select--small .select__icon{margin-right:var(--six-spacing-x-small)}.select--medium .select__box{border-radius:var(--six-input-border-radius-medium);font-size:var(--six-input-font-size-medium);min-height:var(--six-height-medium)}.select--medium .select__box--line{border:none;border-bottom:solid var(--six-border-width) var(--six-input-border-color)}.select--medium .display__values{margin:0 0 0 var(--six-input-spacing-medium)}.select--medium .select__clear{margin-right:var(--six-spacing-xxx-small)}.select--medium .select__icon{margin-right:var(--six-spacing-x-small)}.select--large .select__box{border-radius:var(--six-input-border-radius-large);font-size:var(--six-input-font-size-large);min-height:var(--six-height-large)}.select--large .select__box--line{border:none;border-bottom:solid var(--six-border-width) var(--six-input-border-color)}.select--large .display__values{margin:0 0 0 var(--six-input-spacing-large)}.select--large .select__clear{margin-right:var(--six-spacing-xxx-small)}.select--large .select__icon{margin-right:var(--six-spacing-x-small)}.select--pill.select--small .select__box{border-radius:var(--six-height-small)}.select--pill.select--medium .select__box{border-radius:var(--six-height-medium)}.select--pill.select--large .select__box{border-radius:var(--six-height-large)}.select__menu{width:100%}.select__menu--hidden{display:none}six-icon-button::part(base){padding-top:0;padding-bottom:0}.selection-container--border{border-bottom:solid var(--six-border-width) var(--six-menu-divider-color);padding-top:var(--six-spacing-xx-small);padding-bottom:var(--six-spacing-xx-small)}.display-value--hidden{display:none}.overflow-count{color:var(--six-color-web-rock-600);padding-left:var(--six-spacing-x-small)}.overflow-count-hidden{display:none}.separator--hidden{display:none}.select-all{border-top:1px solid var(--six-color-web-rock-300);display:flex;justify-content:end}';let x=0;const m=class{constructor(i){e(this,i);this.sixChange=t(this,"six-select-change");this.sixFocus=t(this,"six-select-focus");this.sixBlur=t(this,"six-select-blur");this.inputId=`select-${++x}`;this.labelId=`select-label-${x}`;this.helpTextId=`select-help-text-${x}`;this.errorTextId=`select-error-text-${x}`;this.eventListeners=new n;this.activeItemIndex=-1;this.resizeObserver=new ResizeObserver((()=>this.updateDisplayedValues()));this.hasFocus=false;this.hasHelpTextSlot=false;this.hasLabelSlot=false;this.hasErrorTextSlot=false;this.isOpen=false;this.displayedValues=[];this.selectionContainerItems=[];this.multiple=false;this.selectAllButton=false;this.disabled=false;this.name="";this.placeholder="";this.size="medium";this.hoist=false;this.value="";this.pill=false;this.helpText="";this.required=false;this.clearable=false;this.label="";this.errorText="";this.invalid=false;this.line=false;this.filter=false;this.asyncFilter=false;this.autocomplete=false;this.inputDebounce=c;this.options=null;this.virtualScroll=false;this.handleBlur=()=>{this.hasFocus=false;this.sixBlur.emit()};this.handleFocus=()=>{this.hasFocus=true;this.sixFocus.emit()};this.handleClearClick=async e=>{var t;e.stopPropagation();await this.clearValues();await((t=this.dropdown)===null||t===void 0?void 0:t.show());await this.setFocus();this.sixChange.emit({value:this.value,isSelected:true})};this.handleKeyDown=e=>{var t,s,i,o;if(this.virtualScroll||this.autocomplete){return}if(["Control","Escape"].includes(e.key)){return}const l=this.getVisibleItems();if(this.isOpen&&this.multiple&&e.code==="KeyA"&&e.ctrlKey){e.preventDefault();this.selectAll();return}if(e.key==="Tab"){if(this.isOpen){(t=this.dropdown)===null||t===void 0?void 0:t.hide()}return}if(e.key===" "&&!this.multiple){return}if(this.activeItemIndex>=0&&["Enter"," "].includes(e.key)){const t=l.at(this.activeItemIndex);e.preventDefault();t===null||t===void 0?void 0:t.click();return}if(["ArrowDown","ArrowUp","Home","End"].includes(e.key)){if(!this.isOpen){(s=this.dropdown)===null||s===void 0?void 0:s.show()}if(l.length>0){e.preventDefault();if(e.key==="ArrowDown"){this.activeItemIndex++}else if(e.key==="ArrowUp"){this.activeItemIndex--}else if(e.key==="Home"){this.activeItemIndex=0}else if(e.key==="End"){this.activeItemIndex=l.length-1}if(this.activeItemIndex<0)this.activeItemIndex=0;if(this.activeItemIndex>l.length-1)this.activeItemIndex=l.length-1;(i=l.at(this.activeItemIndex))===null||i===void 0?void 0:i.setFocus()}}if(!this.isOpen){e.stopPropagation();e.preventDefault();(o=this.dropdown)===null||o===void 0?void 0:o.show()}};this.handleLabelClick=()=>{var e;(e=this.box)===null||e===void 0?void 0:e.focus()};this.handleMenuSelect=e=>{const t=e.detail.item;if(this.multiple){t.checked=!t.checked}else{this.getItems().forEach((e=>e.checked=false));t.checked=true}this.syncValueFromItems();this.sixChange.emit({value:this.value,isSelected:true})};this.handleMenuShow=e=>{if(this.disabled){e.preventDefault();return}this.activeItemIndex=-1;if(!this.virtualScroll&&this.multiple){const e=this.getItems();e.forEach((e=>e.style.display="unset"));const t=v(f(this.value),e);t.forEach((e=>e.style.display="none"));this.selectionContainerItems=t.map((e=>s("six-menu-item",{key:e.value,checked:true,value:e.value,checkType:this.multiple?"checkbox":"check",onClick:t=>{t.stopPropagation();if(!this.disabled){const s=t.target;const i=s.checked;s.checked=!i;e.checked=!i;this.syncValueFromItems();this.sixChange.emit({value:this.value,isSelected:true})}}},this.getSlottedItem(e,"prefix"),this.getItemLabel(e),this.getSlottedItem(e,"suffix"))))}this.isOpen=true};this.handleMenuHide=()=>{this.isOpen=false;if(this.multiple){this.handleBlur()}};this.handleSlotChange=()=>{this.hasHelpTextSlot=o(this.host,"help-text");this.hasLabelSlot=o(this.host,"label");this.hasErrorTextSlot=o(this.host,"error-text");this.syncItemsFromValue()}}handleDisabledChange(){var e;if(this.disabled&&this.isOpen){(e=this.dropdown)===null||e===void 0?void 0:e.hide()}}handleLabelChange(){this.handleSlotChange()}handleMultipleChange(){this.value=u(this.value,this.multiple);this.syncItemsFromValue()}async handleValueChange(){const e=u(this.value,this.multiple);if(!p(this.value,e)){this.value=e}await this.syncItemsFromValue()}connectedCallback(){var e;if(this.virtualScroll&&this.options===null){console.error("Options must be defined when using virtual scrolling")}(e=this.host.shadowRoot)===null||e===void 0?void 0:e.addEventListener("slotchange",this.handleSlotChange);this.eventListeners.forward("six-select-change","change",this.host);this.eventListeners.forward("six-select-blur","blur",this.host);this.eventListeners.forward("six-select-focus","focus",this.host);if(this.displayValuesContainer){this.resizeObserver.observe(this.displayValuesContainer)}}componentWillLoad(){this.value=u(this.value,this.multiple);this.handleSlotChange()}componentDidLoad(){if(this.displayValuesContainer){this.resizeObserver.observe(this.displayValuesContainer)}requestAnimationFrame((()=>this.syncItemsFromValue()));if(this.autocomplete&&this.autocompleteInput!=null){const e=this.autocompleteInput;this.eventListeners.add(e,"six-input-input",h((t=>{var s;this.value=e.value;this.sixChange.emit({value:this.value,isSelected:false});t.stopPropagation();if(this.virtualScroll||this.value.length>0){(s=this.dropdown)===null||s===void 0?void 0:s.show()}}),this.inputDebounce));const t=this.displayedValues.join(", ");e.value=t}}disconnectedCallback(){var e;this.resizeObserver.disconnect();(e=this.host.shadowRoot)===null||e===void 0?void 0:e.removeEventListener("slotchange",this.handleSlotChange);this.eventListeners.removeAll()}async setFocus(e){var t;this.hasFocus=true;(t=this.box)===null||t===void 0?void 0:t.focus(e)}getItemLabel(e){var t,s;const i=(t=e.shadowRoot)===null||t===void 0?void 0:t.querySelector("slot:not([name])");if(i!=null){return l(i)}else{return(s=e.textContent)!==null&&s!==void 0?s:""}}getSlottedItem(e,t){const i=r(e,t);if(i==null){return null}const o=Object.fromEntries([...i.attributes].map((e=>[e.name,e.value])));return s(i.tagName.toLowerCase(),Object.assign(Object.assign({},o),{innerHTML:i.innerHTML}))}getItems(){if(this.options!==null&&this.menu!=null&&this.menu.shadowRoot!=null){return[...this.menu.shadowRoot.querySelectorAll("six-menu-item")]}return[...this.host.querySelectorAll("six-menu-item")]}getVisibleItems(){const e=this.getSelectionContainerItems();const t=this.getItems();return[...e,...t].filter((e=>e.style.display!=="none"))}getSelectionContainerItems(){var e;return[...((e=this.host.shadowRoot)===null||e===void 0?void 0:e.querySelectorAll("six-menu-item"))||[]]}async clearValues(){this.value=this.multiple?[]:"";this.selectionContainerItems=[];await this.syncItemsFromValue()}selectAll(){const e=this.getVisibleItems();const t=this.hasDeselectedOptions();e.filter((e=>!e.disabled)).forEach((e=>e.checked=t));const s=e.filter((e=>e.checked)).map((e=>e.value));this.value=t?s:[];this.sixChange.emit({value:this.value,isSelected:true})}async syncItemsFromValue(){const e=this.getSelectionContainerItems();const t=this.getItems();const s=u(this.value,this.multiple);e.forEach((e=>{e.checkType=this.multiple?"checkbox":"check";if(Array.isArray(s)){e.checked=s.some((t=>t===e.value))}else{e.checked=s===e.value}}));t.forEach((e=>{e.checkType=this.multiple?"checkbox":"check";if(Array.isArray(s)){e.checked=s.some((t=>t===e.value))}else{e.checked=s===e.value}}));const i=v(f(this.value),t);this.displayedValues=i.map((e=>this.getItemLabel(e)));if(this.autocomplete&&this.autocompleteInput!=null&&!this.hasFocus){const e=this.displayedValues.join(", ");this.autocompleteInput.value=e}requestAnimationFrame((()=>{this.updateDisplayedValues()}))}syncValueFromItems(){const e=this.getItems();const t=e.filter((e=>e.checked)).map((e=>e.value));if(this.multiple){this.value=t}else{this.value=t.length>0?t[0]:""}}updateDisplayedValues(){var e,t;const s=[...(t=(e=this.displayValuesContainer)===null||e===void 0?void 0:e.querySelectorAll(".display-value"))!==null&&t!==void 0?t:[]];if(this.displayValuesContainer==null||s.length===0||this.overflowCount==null){return}s.forEach((e=>{z(e);k(e)}));const i=s[s.length-1].querySelector(".separator");if(i==null)return;let o=_(this.displayValuesContainer)+_(i);let{fitCount:l,overflowCount:r}=g(s,o);if(r===0){I(this.overflowCount);y(s,l)}else{S(this.overflowCount,r+1);A(this.overflowCount);o=o-_(this.overflowCount);({fitCount:l,overflowCount:r}=g(s,o));S(this.overflowCount,r);y(s,l)}}render(){var e;const t=this.hasSelection();const i=this.getItems();const o=i.length>0;const l=this.hasDeselectedOptions();let r=false;let n=o;if(this.clearable&&t){r=true;n=false}return s(a,{key:"e73d53ca359c50322538fe2950527ee8e65839bd",inputId:this.inputId,label:this.label,labelId:this.labelId,hasLabelSlot:this.hasLabelSlot,helpTextId:this.helpTextId,helpText:this.helpText,hasHelpTextSlot:this.hasHelpTextSlot,errorTextId:this.errorTextId,errorText:this.errorText,errorTextCount:this.errorTextCount,hasErrorTextSlot:this.hasErrorTextSlot,size:this.size,onLabelClick:this.handleLabelClick,disabled:this.disabled,required:this.required,displayError:this.invalid},s("six-dropdown",{key:"62552fb8b1f349b21770553c2de7da6b5ab2a4b6",part:"base",ref:e=>this.dropdown=e,hoist:this.hoist,matchTriggerWidth:true,closeOnSelect:!this.multiple,containingElement:this.host,disableHideOnEnterAndSpace:this.autocomplete,class:{select:true,"select--open":this.isOpen,"select--empty":((e=this.value)===null||e===void 0?void 0:e.length)===0,"select--focused":this.hasFocus,"select--clearable":this.clearable,"select--disabled":this.disabled,"select--multiple":this.multiple,"select--has-tags":this.multiple&&t,"select--placeholder-visible":this.displayedValues.length===0,"select--small":this.size==="small","select--medium":this.size==="medium","select--large":this.size==="large","select--pill":this.pill,"select--invalid":this.invalid},onKeyDown:this.handleKeyDown,"onSix-dropdown-show":this.handleMenuShow,"onSix-dropdown-hide":this.handleMenuHide,filterPlaceholder:this.filterPlaceholder,filterDebounce:this.filterDebounce,filter:this.filter,asyncFilter:this.asyncFilter,virtualScroll:this.virtualScroll},s("div",{key:"5206dc7c61d43783a4f28a02edf0ac542876a8ed",slot:"trigger",ref:e=>this.box=e,id:this.inputId,class:{select__box:true,"select__box--line":this.line,"select__box--autocomplete":this.autocomplete},role:"combobox","aria-labelledby":this.labelId,"aria-describedby":this.helpTextId,"aria-haspopup":"true","aria-expanded":this.isOpen?"true":"false",tabIndex:this.disabled?-1:0,onBlur:this.handleBlur,onFocus:this.handleFocus},s("div",{key:"35cd3650cfa756b85b8b685e762ced353b476404",class:"display__values",ref:e=>this.displayValuesContainer=e},this.displayedValues.length>0?s("span",{class:"display__values-and-counter"},s("span",{class:"display__values-values"},this.displayedValues.map((e=>s("span",{key:e,class:"display-value"},e,s("span",{class:{separator:true}},", "))))),s("span",{ref:e=>this.overflowCount=e,class:"overflow-count"},"+10")):s("span",{class:"placeholder"},this.placeholder)),r&&s("six-icon-button",{key:"9625fad5cf7e7355bcb282ebe87ba2fb528a6996",exportparts:"base:clear-button",class:"select__clear",name:"clear",size:"small",onClick:this.handleClearClick,tabindex:"-1"}),n&&s("span",{key:"29c3280a6b0cfcfc706b4a74fc166b60747957cc",part:"icon",class:"select__icon"},s("six-icon",{key:"1ae7ffd913829472745cb65e703da30b2c7d6050",size:"medium"},"expand_more")),s("six-input",{key:"55a6eede0286f7a78881a563e82c60d628177e1c",ref:e=>this.autocompleteInput=e,class:{select__input:true,"sr-only":!this.autocomplete},"aria-hidden":"true",required:this.required,onFocus:this.handleFocus,clearable:this.clearable,placeholder:this.placeholder,pill:this.pill,disabled:this.disabled,size:this.size,tabIndex:-1})),s("div",{key:"d0f86369184cbe505bb10097cc829389d406a8fd",class:{"selection-container":true,"selection-container--border":this.selectionContainerItems.length>0&&i.length!==this.selectionContainerItems.length}},this.selectionContainerItems),s("six-menu",{key:"fdbb314f7f52324fdbc41a56752de6e85cb9a20c",ref:e=>this.menu=e,part:"menu",class:{select__menu:true,"select__menu--hidden":!o},"onSix-menu-item-selected":this.handleMenuSelect,items:this.options,virtualScroll:this.virtualScroll,"remove-box-shadow":true,"disable-keyboard-handling":true},s("slot",{key:"8aa7f50f534891194237610a271841e59af67da3",onSlotchange:this.handleSlotChange})),this.multiple&&this.selectAllButton&&s("div",{key:"1003591fd15046d3fc436da79a3e47984f993056",class:"select-all",slot:"dropdown-footer"},s("six-button",{key:"dc90cc6d56ffa5456bfbbf10ef7392f68541096d",type:"link",onClick:()=>this.selectAll()},this.selectAllText==null?T(l):this.selectAllText))))}hasSelection(){return this.multiple?this.value.length>0:this.value!==""}hasDeselectedOptions(){return this.getVisibleItems().some((e=>!e.disabled&&!e.checked))}get host(){return i(this)}static get watchers(){return{disabled:["handleDisabledChange"],helpText:["handleLabelChange"],errorText:["handleLabelChange"],label:["handleLabelChange"],multiple:["handleMultipleChange"],value:["handleValueChange"]}}};function v(e,t){return t.filter((t=>e.includes(t.value)))}function _(e){return e.getBoundingClientRect().width}function g(e,t){let s=0;let i=0;for(let o=0;o<e.length;o++){const l=e[o];const r=_(l);if(o===0&&r>t){i=1;break}s+=r;if(s>t){break}else{i+=1}}const o=e.length-i;return{fitCount:i,overflowCount:o}}function y(e,t){if(e.length>0){e.slice(0,t).forEach(((e,t,s)=>{z(e);const i=t===s.length-1;if(i){w(e)}else{k(e)}}));e.slice(t).forEach((e=>{C(e);k(e)}))}}function w(e){var t;(t=e.querySelector(".separator"))===null||t===void 0?void 0:t.classList.add("separator--hidden")}function k(e){var t;(t=e.querySelector(".separator"))===null||t===void 0?void 0:t.classList.remove("separator--hidden")}function z(e){e.classList.remove("display-value--hidden")}function C(e){e.classList.add("display-value--hidden")}function S(e,t){e.textContent=`+${t}`}function A(e){e.classList.remove("overflow-count-hidden")}function I(e){e.classList.add("overflow-count-hidden")}function T(e){const t=d();switch(t){case"de":return e?"Alle auswählen":"Alle abwählen";case"fr":return e?"Tout sélectionner":"Tout désélectionner";case"it":return e?"Seleziona tutto":"Deseleziona tutto";case"en":return e?"Select all":"Deselect all";case"es":return e?"Seleccionar todo":"Deseleccionar todo"}}m.style=b;export{m as six_select};
+//# sourceMappingURL=p-1f86bd3e.entry.js.map

package/dist/ui-library/p-1f86bd3e.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["convertToValidValue","value","multiple","Array","isArray","filter","element","length","convertToValidArrayValue","valueEquals","a","b","every","index","sixSelectCss","id","SixSelect","constructor","hostRef","this","inputId","labelId","helpTextId","errorTextId","eventListeners","EventListeners","activeItemIndex","resizeObserver","ResizeObserver","updateDisplayedValues","hasFocus","hasHelpTextSlot","hasLabelSlot","hasErrorTextSlot","isOpen","displayedValues","selectionContainerItems","selectAllButton","disabled","name","placeholder","size","hoist","pill","helpText","required","clearable","label","errorText","invalid","line","asyncFilter","autocomplete","inputDebounce","DEFAULT_DEBOUNCE_FAST","options","virtualScroll","handleBlur","sixBlur","emit","handleFocus","sixFocus","handleClearClick","async","event","stopPropagation","clearValues","_a","dropdown","show","setFocus","sixChange","isSelected","handleKeyDown","includes","key","items","getVisibleItems","code","ctrlKey","preventDefault","selectAll","hide","activeItem","at","click","_b","_c","_d","handleLabelClick","box","focus","handleMenuSelect","currentItem","detail","item","checked","getItems","forEach","i","syncValueFromItems","handleMenuShow","mainItems","style","display","checkedItems","getCheckedItems","map","h","checkType","onClick","menuItem","target","isChecked","getSlottedItem","getItemLabel","handleMenuHide","handleSlotChange","hasSlot","host","syncItemsFromValue","handleDisabledChange","handleLabelChange","handleMultipleChange","handleValueChange","newValue","connectedCallback","console","error","shadowRoot","addEventListener","forward","displayValuesContainer","observe","componentWillLoad","componentDidLoad","requestAnimationFrame","autocompleteInput","add","debounce","selectedLabel","join","disconnectedCallback","disconnect","removeEventListener","removeAll","slot","querySelector","getTextContent","textContent","slotName","slottedElement","getSlot","attributes","Object","fromEntries","attr","tagName","toLowerCase","assign","innerHTML","menu","querySelectorAll","getSelectionContainerItems","visibleItems","hasDeselectedOptions","option","some","val","checkedValues","displayValueOptions","overflowCount","d","showDisplayValue","showSeparator","separator","availableWidth","getWidth","fitCount","computeFitCount","hideOverflowCount","showFittingValues","setOverflowCount","showOverflowCount","render","hasSelection","hasMenuItems","showClear","showExpand","FormControl","errorTextCount","onLabelClick","displayError","part","ref","el","matchTriggerWidth","closeOnSelect","containingElement","disableHideOnEnterAndSpace","class","select","onKeyDown","filterPlaceholder","filterDebounce","select__box","role","tabIndex","onBlur","onFocus","exportparts","tabindex","select__input","select__menu","onSlotchange","type","selectAllText","selectAllDefaultText","opt","getBoundingClientRect","width","accumulatedWidth","displayOption","slice","displayValue","list","isLast","hideSeparator","hideDisplayValue","displayValueOption","classList","remove","count","lang","getLanguage"],"sources":["src/components/six-select/util.ts","src/components/six-select/six-select.scss?tag=six-select&encapsulation=shadow","src/components/six-select/six-select.tsx"],"sourcesContent":["export interface MenuItem {\n  value: string;\n}\n\nexport function getValue(value: unknown, multiple: boolean, menuItems: MenuItem[]): string | string[] {\n  if (multiple) {\n    if (Array.isArray(value)) {\n      return getSelectedValues(value, menuItems);\n    } else {\n      return getSelectedValuesFromString(value, menuItems);\n    }\n  }\n\n  return getSelectedMenuItem(value, menuItems)?.value ?? '';\n}\n\nexport function isValidValue(value: unknown, multiple: boolean, menuItems: MenuItem[]): boolean {\n  if (value === '') {\n    return true;\n  }\n\n  if (multiple) {\n    if (Array.isArray(value)) {\n      if (value.length === 0) {\n        return true;\n      }\n      return getSelectedValues(value, menuItems).length === value.length;\n    }\n    return getSelectedValuesFromString(value, menuItems).length > 0;\n  }\n\n  return getSelectedMenuItem(value, menuItems) != null;\n}\n\nexport function convertToValidValue(value: unknown, multiple: boolean): string | string[] {\n  if (multiple) {\n    if (Array.isArray(value)) {\n      return value.filter((element) => typeof element === 'string');\n    } else if (typeof value === 'string' && value.length > 0) {\n      return [value];\n    } else {\n      return [];\n    }\n  } else {\n    if (typeof value === 'string') {\n      return value;\n    } else {\n      return '';\n    }\n  }\n}\n\nexport function convertToValidArrayValue(value: unknown): string[] {\n  return convertToValidValue(value, true) as string[];\n}\n\nexport function valueEquals(a: string | string[], b: string | string[]): boolean {\n  if (Array.isArray(a) && Array.isArray(b)) {\n    return a.length === b.length && a.every((element, index) => element === b[index]);\n  } else if (typeof a === 'string' && typeof b === 'string') {\n    return a === b;\n  }\n  return false;\n}\n\nexport function isValueEmpty(value: string | string[]): boolean {\n  if (Array.isArray(value)) {\n    return value.length === 0;\n  }\n  return value === '';\n}\n\nfunction getSelectedValues(values: unknown[], menuItems: MenuItem[]): string[] {\n  return menuItems.filter((menuItem) => values.includes(menuItem.value)).map((menuItem) => menuItem.value);\n}\n\nfunction getSelectedValuesFromString(value: unknown, menuItems: MenuItem[]): string[] {\n  return menuItems.filter((menuItem) => value === menuItem.value).map((menuItem) => menuItem.value);\n}\n\nfunction getSelectedMenuItem(value: unknown, menuItems: MenuItem[]): MenuItem | undefined {\n  return menuItems.find((item) => value === item.value);\n}\n","@import 'src/global/component';\n@import '../../functional-components/form-control/form-control';\n@import 'src/global/mixins/hidden';\n@import 'src/global/mixins/hide-scrollbar';\n\n:host,\n.select {\n  display: block;\n}\n\n.select__box {\n  display: inline-flex;\n  align-items: center;\n  justify-content: start;\n  position: relative;\n  width: 100%;\n  font-family: var(--six-font-family);\n  font-weight: var(--six-input-font-weight);\n  font-size: var(--six-input-font-size-medium);\n  letter-spacing: var(--six-input-letter-spacing);\n  background-color: var(--six-input-background-color);\n  border: solid var(--six-border-width) var(--six-input-border-color);\n  vertical-align: middle;\n  transition:\n    var(--six-transition-fast) color,\n    var(--six-transition-fast) border,\n    var(--six-transition-fast) box-shadow;\n  cursor: pointer;\n\n  &--line {\n    border: none;\n    border-bottom: solid var(--six-border-width) var(--six-input-border-color);\n  }\n\n  &--autocomplete {\n    border: none;\n    overflow: initial;\n  }\n}\n\n.select:not(.select--disabled) .select__box:hover {\n  background-color: var(--six-input-background-color-hover);\n  color: var(--six-input-color-hover);\n\n  border-bottom-color: var(--six-input-border-color-hover);\n\n  &:not(.select__box--line) {\n    border-color: var(--six-input-border-color-hover);\n  }\n}\n\n.select:not(.select--disabled) .select__box:focus {\n  background-color: var(--six-input-background-color-focus);\n  outline: none;\n  color: var(--six-input-color-focus);\n\n  border-bottom-color: var(--six-input-border-color-focus);\n  box-shadow: 0 1px 0 0 var(--six-input-border-color-focus);\n\n  &:not(.select__box--line) {\n    border-color: var(--six-input-border-color-focus);\n    box-shadow: var(--six-input-focus-shadow);\n  }\n}\n\n.select--disabled {\n  .select__box {\n    background-color: var(--six-input-background-color-disabled);\n    color: var(--six-input-color-disabled);\n    cursor: not-allowed;\n    outline: none;\n\n    &:not(.select__box--line) {\n      border-color: var(--six-input-border-color-disabled);\n    }\n  }\n\n  .select__clear {\n    pointer-events: none;\n  }\n}\n\n.select--invalid:not(.select--disabled):not(.select--focused) {\n  .select__box {\n    border-bottom-color: var(--six-input-border-color-danger);\n\n    &:not(.input--line) {\n      border-color: var(--six-input-border-color-danger);\n    }\n  }\n}\n\n.display__values {\n  display: flex;\n  flex: 1 1 auto;\n  align-items: center;\n  user-select: none;\n  overflow: hidden;\n  @include hide-scrollbar;\n}\n\n.display__values-values {\n  flex: 0 1 auto;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.display__values-and-counter {\n  display: flex;\n  overflow: hidden;\n}\n\n.select__clear {\n  flex-shrink: 0;\n  flex-grow: 0;\n  display: inline;\n}\n\n.select__icon {\n  flex-shrink: 0;\n  flex-grow: 0;\n  display: inline;\n  transition: var(--six-transition-medium) transform ease;\n}\n\n.select--open .select__icon {\n  transform: rotate(-180deg);\n}\n\n// Placeholder\n.placeholder {\n  color: var(--six-input-placeholder-color);\n}\n\n.select--disabled .placeholder {\n  color: var(--six-input-placeholder-color-disabled);\n}\n\n.select__input {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n}\n\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n// Size modifiers\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n\n.select--small {\n  .select__box {\n    border-radius: var(--six-input-border-radius-small);\n    font-size: var(--six-input-font-size-small);\n    min-height: var(--six-height-small);\n\n    &--line {\n      border: none;\n      border-bottom: solid var(--six-border-width) var(--six-input-border-color);\n    }\n  }\n\n  .display__values {\n    margin: 0 0 0 var(--six-input-spacing-small);\n  }\n\n  .select__clear {\n    margin-right: var(--six-spacing-xxx-small);\n  }\n\n  .select__icon {\n    margin-right: var(--six-spacing-x-small);\n  }\n}\n\n.select--medium {\n  .select__box {\n    border-radius: var(--six-input-border-radius-medium);\n    font-size: var(--six-input-font-size-medium);\n    min-height: var(--six-height-medium);\n\n    &--line {\n      border: none;\n      border-bottom: solid var(--six-border-width) var(--six-input-border-color);\n    }\n  }\n\n  .display__values {\n    margin: 0 0 0 var(--six-input-spacing-medium);\n  }\n\n  .select__clear {\n    margin-right: var(--six-spacing-xxx-small);\n  }\n\n  .select__icon {\n    margin-right: var(--six-spacing-x-small);\n  }\n}\n\n.select--large {\n  .select__box {\n    border-radius: var(--six-input-border-radius-large);\n    font-size: var(--six-input-font-size-large);\n    min-height: var(--six-height-large);\n\n    &--line {\n      border: none;\n      border-bottom: solid var(--six-border-width) var(--six-input-border-color);\n    }\n  }\n\n  .display__values {\n    margin: 0 0 0 var(--six-input-spacing-large);\n  }\n\n  .select__clear {\n    margin-right: var(--six-spacing-xxx-small);\n  }\n\n  .select__icon {\n    margin-right: var(--six-spacing-x-small);\n  }\n}\n\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n// Pill modifier\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n\n.select--pill {\n  &.select--small .select__box {\n    border-radius: var(--six-height-small);\n  }\n\n  &.select--medium .select__box {\n    border-radius: var(--six-height-medium);\n  }\n\n  &.select--large .select__box {\n    border-radius: var(--six-height-large);\n  }\n}\n\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n// Menu\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n.select {\n  &__menu {\n    width: 100%;\n\n    &--hidden {\n      // hide the menu panel if there are no menu items\n      display: none;\n    }\n  }\n}\n\n// fixes problem where six-select height changes when size=\"small\" and clearing button is visible\nsix-icon-button::part(base) {\n  padding-top: 0;\n  padding-bottom: 0;\n}\n\n.selection-container--border {\n  border-bottom: solid var(--six-border-width) var(--six-menu-divider-color);\n  padding-top: var(--six-spacing-xx-small);\n  padding-bottom: var(--six-spacing-xx-small);\n}\n\n.display-value--hidden {\n  display: none;\n}\n\n.overflow-count {\n  color: var(--six-color-web-rock-600);\n  padding-left: var(--six-spacing-x-small);\n}\n\n.overflow-count-hidden {\n  display: none;\n}\n\n.separator--hidden {\n  display: none;\n}\n\n.select-all {\n  border-top: 1px solid var(--six-color-web-rock-300);\n  display: flex;\n  justify-content: end;\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { getSlot, getTextContent, hasSlot } from '../../utils/slot';\nimport FormControl from '../../functional-components/form-control/form-control';\nimport { EmptyPayload } from '../../utils/types';\nimport { EventListeners } from '../../utils/event-listeners';\nimport { debounce, DEFAULT_DEBOUNCE_FAST } from '../../utils/execution-control';\nimport { SixMenuItemData } from '../six-menu/six-menu';\nimport { getLanguage } from '../../utils/error-messages';\nimport { convertToValidArrayValue, convertToValidValue, valueEquals } from './util';\n\nexport interface SixSelectChangePayload {\n  value: string | string[];\n  isSelected: boolean;\n}\n\nlet id = 0;\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot - The select's options in the form of menu items.\n * @slot label - The select's label. Alternatively, you can use the label prop.\n * @slot help-text - Help text that describes how to use the select.\n * @slot error-text - Error text that is shown for validation errors. Alternatively, you can use the error-text prop.\n *\n * @part base - The component's base wrapper.\n * @part clear-button - The input's clear button, exported from six-input.\n * @part form-control - The form control that wraps the label, input, and help text.\n * @part help-text - The select's help text.\n * @part icon - The select's icon.\n * @part label - The select's label.\n * @part menu - The select menu, a six-menu element.\n * @part tag - The multiselect option, a six-tag element.\n * @part tags - The container in which multiselect options are rendered.\n */\n\n@Component({\n  tag: 'six-select',\n  styleUrl: 'six-select.scss',\n  shadow: true,\n})\nexport class SixSelect {\n  private box?: HTMLElement;\n  private menu?: HTMLElement;\n  private dropdown?: HTMLSixDropdownElement;\n  private displayValuesContainer?: HTMLElement;\n  private overflowCount?: HTMLElement;\n  private autocompleteInput?: HTMLSixInputElement;\n  private inputId = `select-${++id}`;\n  private labelId = `select-label-${id}`;\n  private helpTextId = `select-help-text-${id}`;\n  private errorTextId = `select-error-text-${id}`;\n  private eventListeners = new EventListeners();\n  private activeItemIndex = -1;\n  private resizeObserver = new ResizeObserver(() => this.updateDisplayedValues());\n\n  @Element() host!: HTMLSixSelectElement;\n\n  @State() hasFocus = false;\n  @State() hasHelpTextSlot = false;\n  @State() hasLabelSlot = false;\n  @State() hasErrorTextSlot = false;\n  @State() isOpen = false;\n  @State() displayedValues: string[] = [];\n\n  /** Menu items shown in the selection container.  */\n  @State() selectionContainerItems: HTMLSixMenuItemElement[] = [];\n\n  /** Set to true to enable multiselect. */\n  @Prop() multiple = false;\n\n  /** Enables the select all button. */\n  @Prop() selectAllButton = false;\n\n  /**\n   * Custom text for the \"select all\" button. Defaults to \"Select all\" and equivalents in supported languages.\n   */\n  @Prop() selectAllText?: string;\n\n  /** Set to true to disable the select control. */\n  @Prop() disabled = false;\n\n  /** The select's name. */\n  @Prop() name = '';\n\n  /** The select's placeholder text. */\n  @Prop() placeholder = '';\n\n  /** The filter's placeholder text. */\n  @Prop() filterPlaceholder?: string;\n\n  /** The debounce for the filter callbacks. */\n  @Prop() filterDebounce?: number;\n\n  /** The select's size. */\n  @Prop() size: 'small' | 'medium' | 'large' = 'medium';\n\n  /**\n   * Enable this option to prevent the panel from being clipped when the component is placed inside a container with\n   * `overflow: auto|scroll`.\n   */\n  @Prop() hoist = false;\n\n  /** The value of the control. This will be a string or an array depending on `multiple`. */\n  @Prop({ mutable: true }) value: string | string[] = '';\n\n  /** Set to true to draw a pill-style select with rounded edges. */\n  @Prop() pill = false;\n\n  /** The select's help text. Alternatively, you can use the help-text slot. */\n  @Prop() helpText = '';\n\n  /** Set to true to show an asterisk beneath the label. */\n  @Prop() required = false;\n\n  /** Set to true to add a clear button when the select is populated. */\n  @Prop() clearable = false;\n\n  /** The label text. */\n  @Prop() label = '';\n\n  /** The error message shown, if `invalid` is set to true.  */\n  @Prop() errorText: string | string[] = '';\n\n  /** The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1 */\n  @Prop() errorTextCount?: number;\n\n  /** If this property is set to true and an error message is provided by `errorText`, the error message is displayed.  */\n  @Prop({ reflect: true }) invalid = false;\n\n  /** Set to render as line */\n  @Prop() line = false;\n\n  /** Set to true to allow filtering for entries in the dropdown */\n  @Prop() filter = false;\n\n  /**\n   * Set to true to allow async filtering.\n   * When you enter something in the search field the component will only emit an event but not filter any elements itself.\n   * You can then simply listen to the 'six-async-filter-fired' event to manage the shown menu-items yourself\n   */\n  @Prop() asyncFilter = false;\n\n  /**\n   * Set to true to turn the six-select into an autocomplete.\n   */\n  @Prop() autocomplete = false;\n\n  /** The debounce for when the input changes for autocompletes should be emitted */\n  @Prop() inputDebounce = DEFAULT_DEBOUNCE_FAST;\n\n  /** Set the options to be shown in the dropdown (alternative to setting the elements via html) */\n  @Prop() options: SixMenuItemData[] | null = null;\n\n  /** Defines whether the menu list will be rendered virtually i.e. only the elements actually shown (and a couple around)\n   *  are actually rendered in the DOM. If you use virtual scrolling pass the elements via prop instead of via slot. */\n  @Prop() virtualScroll = false;\n\n  @Watch('disabled')\n  handleDisabledChange() {\n    if (this.disabled && this.isOpen) {\n      this.dropdown?.hide();\n    }\n  }\n\n  @Watch('helpText')\n  @Watch('errorText')\n  @Watch('label')\n  handleLabelChange() {\n    this.handleSlotChange();\n  }\n\n  @Watch('multiple')\n  handleMultipleChange() {\n    this.value = convertToValidValue(this.value, this.multiple);\n    this.syncItemsFromValue();\n  }\n\n  @Watch('value')\n  async handleValueChange() {\n    const newValue = convertToValidValue(this.value, this.multiple);\n    if (!valueEquals(this.value, newValue)) {\n      this.value = newValue;\n    }\n    await this.syncItemsFromValue();\n  }\n\n  /** Emitted when the control's value changes. */\n  @Event({ eventName: 'six-select-change' }) sixChange!: EventEmitter<SixSelectChangePayload>;\n\n  /** Emitted when the control gains focus. */\n  @Event({ eventName: 'six-select-focus' }) sixFocus!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the control loses focus. */\n  @Event({ eventName: 'six-select-blur' }) sixBlur!: EventEmitter<EmptyPayload>;\n\n  connectedCallback() {\n    if (this.virtualScroll && this.options === null) {\n      console.error('Options must be defined when using virtual scrolling');\n    }\n\n    this.host.shadowRoot?.addEventListener('slotchange', this.handleSlotChange);\n    this.eventListeners.forward('six-select-change', 'change', this.host);\n    this.eventListeners.forward('six-select-blur', 'blur', this.host);\n    this.eventListeners.forward('six-select-focus', 'focus', this.host);\n    if (this.displayValuesContainer) {\n      this.resizeObserver.observe(this.displayValuesContainer);\n    }\n  }\n\n  componentWillLoad() {\n    this.value = convertToValidValue(this.value, this.multiple);\n    this.handleSlotChange();\n  }\n\n  componentDidLoad() {\n    if (this.displayValuesContainer) {\n      this.resizeObserver.observe(this.displayValuesContainer);\n    }\n\n    // We need to do an initial sync after the component has rendered, so this will suppress the re-render warning\n    requestAnimationFrame(() => this.syncItemsFromValue());\n\n    if (this.autocomplete && this.autocompleteInput != null) {\n      const autocompleteInput = this.autocompleteInput;\n      this.eventListeners.add(\n        autocompleteInput,\n        'six-input-input',\n        debounce((event) => {\n          this.value = autocompleteInput.value;\n          this.sixChange.emit({ value: this.value, isSelected: false });\n          event.stopPropagation();\n\n          if (this.virtualScroll || this.value.length > 0) {\n            this.dropdown?.show();\n          }\n        }, this.inputDebounce)\n      );\n\n      const selectedLabel = this.displayedValues.join(', ');\n      autocompleteInput.value = selectedLabel;\n    }\n  }\n\n  disconnectedCallback() {\n    this.resizeObserver.disconnect();\n    this.host.shadowRoot?.removeEventListener('slotchange', this.handleSlotChange);\n    this.eventListeners.removeAll();\n  }\n\n  /** Sets focus on the select. */\n  @Method()\n  async setFocus(options?: FocusOptions) {\n    this.hasFocus = true;\n    this.box?.focus(options);\n  }\n\n  private getItemLabel(item: HTMLSixMenuItemElement): string {\n    const slot = item.shadowRoot?.querySelector('slot:not([name])') as HTMLSlotElement;\n    if (slot != null) {\n      return getTextContent(slot);\n    } else {\n      // bugfix/COMSLI-203-six-select-value-is-not-updated-if-the-slot-is-changed\n      return item.textContent ?? '';\n    }\n  }\n\n  private getSlottedItem(item: HTMLSixMenuItemElement, slotName: 'prefix' | 'suffix') {\n    const slottedElement = getSlot(item, slotName);\n    if (slottedElement == null) {\n      return null;\n    }\n    const attributes = Object.fromEntries([...slottedElement.attributes].map((attr) => [attr.name, attr.value]));\n\n    return h(slottedElement.tagName.toLowerCase(), {\n      ...attributes,\n      innerHTML: slottedElement.innerHTML,\n    });\n  }\n\n  private getItems(): HTMLSixMenuItemElement[] {\n    if (this.options !== null && this.menu != null && this.menu.shadowRoot != null) {\n      return [...this.menu.shadowRoot.querySelectorAll('six-menu-item')];\n    }\n\n    return [...this.host.querySelectorAll('six-menu-item')];\n  }\n\n  private getVisibleItems(): HTMLSixMenuItemElement[] {\n    const selectionContainerItems = this.getSelectionContainerItems();\n    const mainItems = this.getItems();\n    return [...selectionContainerItems, ...mainItems].filter((i) => i.style.display !== 'none');\n  }\n\n  private getSelectionContainerItems() {\n    return [...(this.host.shadowRoot?.querySelectorAll('six-menu-item') || [])];\n  }\n\n  private handleBlur = () => {\n    this.hasFocus = false;\n    this.sixBlur.emit();\n  };\n\n  private handleFocus = () => {\n    this.hasFocus = true;\n    this.sixFocus.emit();\n  };\n\n  private handleClearClick = async (event: MouseEvent) => {\n    event.stopPropagation();\n    await this.clearValues();\n    await this.dropdown?.show();\n    await this.setFocus();\n    this.sixChange.emit({ value: this.value, isSelected: true });\n  };\n\n  private async clearValues() {\n    this.value = this.multiple ? [] : '';\n    this.selectionContainerItems = [];\n    await this.syncItemsFromValue();\n  }\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    if (this.virtualScroll || this.autocomplete) {\n      return;\n    }\n\n    if (['Control', 'Escape'].includes(event.key)) {\n      return;\n    }\n\n    const items = this.getVisibleItems();\n\n    // Ctrl-A selects all items\n    if (this.isOpen && this.multiple && event.code === 'KeyA' && event.ctrlKey) {\n      event.preventDefault();\n      this.selectAll();\n      return;\n    }\n\n    // Tabbing out of the control closes it\n    if (event.key === 'Tab') {\n      if (this.isOpen) {\n        this.dropdown?.hide();\n      }\n      return;\n    }\n\n    if (event.key === ' ' && !this.multiple) {\n      return;\n    }\n\n    // Enter and Space selects the active item\n    if (this.activeItemIndex >= 0 && ['Enter', ' '].includes(event.key)) {\n      const activeItem = items.at(this.activeItemIndex);\n      event.preventDefault();\n      activeItem?.click();\n      return;\n    }\n\n    // Move the selection when pressing up or down\n    if (['ArrowDown', 'ArrowUp', 'Home', 'End'].includes(event.key)) {\n      // Show the menu if it's not already open\n      if (!this.isOpen) {\n        this.dropdown?.show();\n      }\n\n      if (items.length > 0) {\n        event.preventDefault();\n\n        if (event.key === 'ArrowDown') {\n          this.activeItemIndex++;\n        } else if (event.key === 'ArrowUp') {\n          this.activeItemIndex--;\n        } else if (event.key === 'Home') {\n          this.activeItemIndex = 0;\n        } else if (event.key === 'End') {\n          this.activeItemIndex = items.length - 1;\n        }\n\n        if (this.activeItemIndex < 0) this.activeItemIndex = 0;\n        if (this.activeItemIndex > items.length - 1) this.activeItemIndex = items.length - 1;\n\n        items.at(this.activeItemIndex)?.setFocus();\n      }\n    }\n\n    // All other keys open the menu\n    if (!this.isOpen) {\n      event.stopPropagation();\n      event.preventDefault();\n      this.dropdown?.show();\n    }\n  };\n\n  private selectAll() {\n    const visibleItems = this.getVisibleItems();\n    const hasDeselectedOptions = this.hasDeselectedOptions();\n    visibleItems.filter((option) => !option.disabled).forEach((option) => (option.checked = hasDeselectedOptions));\n    const checkedItems = visibleItems.filter((option) => option.checked).map((option) => option.value);\n    this.value = hasDeselectedOptions ? checkedItems : [];\n    this.sixChange.emit({ value: this.value, isSelected: true });\n  }\n\n  private handleLabelClick = () => {\n    this.box?.focus();\n  };\n\n  private handleMenuSelect = (event: CustomEvent) => {\n    const currentItem = event.detail.item as HTMLSixMenuItemElement;\n    if (this.multiple) {\n      currentItem.checked = !currentItem.checked;\n    } else {\n      this.getItems().forEach((i) => (i.checked = false));\n      currentItem.checked = true;\n    }\n    this.syncValueFromItems();\n    this.sixChange.emit({ value: this.value, isSelected: true });\n  };\n\n  private handleMenuShow = (event: CustomEvent) => {\n    if (this.disabled) {\n      event.preventDefault();\n      return;\n    }\n    this.activeItemIndex = -1;\n\n    if (!this.virtualScroll && this.multiple) {\n      // reset display style of main items\n      const mainItems = this.getItems();\n      mainItems.forEach((item) => (item.style.display = 'unset'));\n\n      // show selected menu items in the selection container and hide them in the main container\n      const checkedItems = getCheckedItems(convertToValidArrayValue(this.value), mainItems);\n      checkedItems.forEach((i) => (i.style.display = 'none'));\n      this.selectionContainerItems = checkedItems.map((item) => {\n        return (\n          <six-menu-item\n            key={item.value} // key makes sure the node is not re-used: https://stenciljs.com/docs/templating-jsx#conditionals\n            checked={true}\n            value={item.value}\n            checkType={this.multiple ? 'checkbox' : 'check'}\n            onClick={(event) => {\n              event.stopPropagation();\n              if (!this.disabled) {\n                const menuItem = event.target as HTMLSixMenuItemElement;\n                const isChecked = menuItem.checked;\n                menuItem.checked = !isChecked;\n                item.checked = !isChecked;\n                this.syncValueFromItems();\n                this.sixChange.emit({ value: this.value, isSelected: true });\n              }\n            }}\n          >\n            {this.getSlottedItem(item, 'prefix')}\n            {this.getItemLabel(item)}\n            {this.getSlottedItem(item, 'suffix')}\n          </six-menu-item>\n        );\n      });\n    }\n\n    this.isOpen = true;\n  };\n\n  private handleMenuHide = () => {\n    this.isOpen = false;\n    if (this.multiple) {\n      this.handleBlur();\n    }\n  };\n\n  private handleSlotChange = () => {\n    this.hasHelpTextSlot = hasSlot(this.host, 'help-text');\n    this.hasLabelSlot = hasSlot(this.host, 'label');\n    this.hasErrorTextSlot = hasSlot(this.host, 'error-text');\n    this.syncItemsFromValue();\n  };\n\n  /**\n   * Sets the checked state of menu items and renders the displayed values.\n   */\n  private async syncItemsFromValue() {\n    const selectionContainerItems = this.getSelectionContainerItems();\n    const mainItems = this.getItems();\n    const value = convertToValidValue(this.value, this.multiple);\n\n    selectionContainerItems.forEach((item) => {\n      item.checkType = this.multiple ? 'checkbox' : 'check';\n      if (Array.isArray(value)) {\n        item.checked = value.some((val) => val === item.value);\n      } else {\n        item.checked = value === item.value;\n      }\n    });\n\n    mainItems.forEach((item) => {\n      item.checkType = this.multiple ? 'checkbox' : 'check';\n      if (Array.isArray(value)) {\n        item.checked = value.some((val) => val === item.value);\n      } else {\n        item.checked = value === item.value;\n      }\n    });\n\n    const checkedItems = getCheckedItems(convertToValidArrayValue(this.value), mainItems);\n    this.displayedValues = checkedItems.map((i) => this.getItemLabel(i));\n\n    if (this.autocomplete && this.autocompleteInput != null && !this.hasFocus) {\n      const selectedLabel = this.displayedValues.join(', ');\n      this.autocompleteInput.value = selectedLabel;\n    }\n\n    requestAnimationFrame(() => {\n      this.updateDisplayedValues();\n    });\n  }\n\n  private syncValueFromItems() {\n    const items = this.getItems();\n    const checkedValues = items.filter((item) => item.checked).map((item) => item.value);\n    if (this.multiple) {\n      this.value = checkedValues;\n    } else {\n      this.value = checkedValues.length > 0 ? checkedValues[0] : '';\n    }\n  }\n\n  private updateDisplayedValues() {\n    const displayValueOptions = [...(this.displayValuesContainer?.querySelectorAll('.display-value') ?? [])];\n    if (this.displayValuesContainer == null || displayValueOptions.length === 0 || this.overflowCount == null) {\n      return;\n    }\n\n    // Show all options and separators to properly measure all widths.\n    displayValueOptions.forEach((d) => {\n      showDisplayValue(d);\n      showSeparator(d);\n    });\n\n    // Measure available width. The last separator is added to the available width, because it will be hidden later on.\n    const separator = displayValueOptions[displayValueOptions.length - 1].querySelector('.separator');\n    if (separator == null) return;\n    let availableWidth = getWidth(this.displayValuesContainer) + getWidth(separator);\n\n    // Compute how many display value elements fit in the available width\n    let { fitCount, overflowCount } = computeFitCount(displayValueOptions, availableWidth);\n\n    if (overflowCount === 0) {\n      // All items fit, hide overflow count and show all values.\n      hideOverflowCount(this.overflowCount);\n      showFittingValues(displayValueOptions, fitCount);\n    } else {\n      // Not all items fit in the available width. Recompute the available width with the overflow-count visible.\n\n      // Increment overflow count by one to make sure the elements fit, even if the overflow count increases to the\n      // next higher power of ten, e.g. from 9 to 10 or 99 to 100.\n      setOverflowCount(this.overflowCount, overflowCount + 1);\n      showOverflowCount(this.overflowCount);\n\n      // Subtract the overflow count from the available width\n      availableWidth = availableWidth - getWidth(this.overflowCount);\n\n      // Compute how many display value elements fit in the new available width\n      ({ fitCount, overflowCount } = computeFitCount(displayValueOptions, availableWidth));\n\n      // Show overflow count and items that fit.\n      setOverflowCount(this.overflowCount, overflowCount);\n      showFittingValues(displayValueOptions, fitCount);\n    }\n  }\n\n  render() {\n    const hasSelection = this.hasSelection();\n    const items = this.getItems();\n    const hasMenuItems = items.length > 0;\n    const hasDeselectedOptions = this.hasDeselectedOptions();\n    let showClear = false;\n    let showExpand = hasMenuItems;\n    if (this.clearable && hasSelection) {\n      showClear = true;\n      showExpand = false;\n    }\n\n    return (\n      <FormControl\n        inputId={this.inputId}\n        label={this.label}\n        labelId={this.labelId}\n        hasLabelSlot={this.hasLabelSlot}\n        helpTextId={this.helpTextId}\n        helpText={this.helpText}\n        hasHelpTextSlot={this.hasHelpTextSlot}\n        errorTextId={this.errorTextId}\n        errorText={this.errorText}\n        errorTextCount={this.errorTextCount}\n        hasErrorTextSlot={this.hasErrorTextSlot}\n        size={this.size}\n        onLabelClick={this.handleLabelClick}\n        disabled={this.disabled}\n        required={this.required}\n        displayError={this.invalid}\n      >\n        <six-dropdown\n          part=\"base\"\n          ref={(el) => (this.dropdown = el)}\n          hoist={this.hoist}\n          matchTriggerWidth={true}\n          closeOnSelect={!this.multiple}\n          containingElement={this.host}\n          disableHideOnEnterAndSpace={this.autocomplete}\n          class={{\n            select: true,\n            'select--open': this.isOpen,\n            'select--empty': this.value?.length === 0,\n            'select--focused': this.hasFocus,\n            'select--clearable': this.clearable,\n            'select--disabled': this.disabled,\n            'select--multiple': this.multiple,\n            'select--has-tags': this.multiple && hasSelection,\n            'select--placeholder-visible': this.displayedValues.length === 0,\n            'select--small': this.size === 'small',\n            'select--medium': this.size === 'medium',\n            'select--large': this.size === 'large',\n            'select--pill': this.pill,\n            'select--invalid': this.invalid,\n          }}\n          onKeyDown={this.handleKeyDown}\n          onSix-dropdown-show={this.handleMenuShow}\n          onSix-dropdown-hide={this.handleMenuHide}\n          filterPlaceholder={this.filterPlaceholder}\n          filterDebounce={this.filterDebounce}\n          filter={this.filter}\n          asyncFilter={this.asyncFilter}\n          virtualScroll={this.virtualScroll}\n        >\n          {/* Trigger */}\n          <div\n            slot=\"trigger\"\n            ref={(el) => (this.box = el)}\n            id={this.inputId}\n            class={{\n              select__box: true,\n              'select__box--line': this.line,\n              'select__box--autocomplete': this.autocomplete,\n            }}\n            role=\"combobox\"\n            aria-labelledby={this.labelId}\n            aria-describedby={this.helpTextId}\n            aria-haspopup=\"true\"\n            aria-expanded={this.isOpen ? 'true' : 'false'}\n            tabIndex={this.disabled ? -1 : 0}\n            onBlur={this.handleBlur}\n            onFocus={this.handleFocus}\n          >\n            {/* Display values */}\n            <div class=\"display__values\" ref={(el) => (this.displayValuesContainer = el)}>\n              {this.displayedValues.length > 0 ? (\n                <span class=\"display__values-and-counter\">\n                  <span class=\"display__values-values\">\n                    {this.displayedValues.map((value) => (\n                      <span key={value} class=\"display-value\">\n                        {value}\n                        <span class={{ separator: true }}>, </span>\n                      </span>\n                    ))}\n                  </span>\n                  <span ref={(el) => (this.overflowCount = el)} class=\"overflow-count\">\n                    +10\n                  </span>\n                </span>\n              ) : (\n                <span class=\"placeholder\">{this.placeholder}</span>\n              )}\n            </div>\n\n            {/* Clear */}\n            {showClear && (\n              <six-icon-button\n                exportparts=\"base:clear-button\"\n                class=\"select__clear\"\n                name=\"clear\"\n                size=\"small\"\n                onClick={this.handleClearClick}\n                tabindex=\"-1\"\n              />\n            )}\n\n            {/* Expand */}\n            {showExpand && (\n              <span part=\"icon\" class=\"select__icon\">\n                <six-icon size=\"medium\">expand_more</six-icon>\n              </span>\n            )}\n\n            {/* Autocomplete */}\n            <six-input\n              ref={(el) => (this.autocompleteInput = el)}\n              class={{\n                select__input: true,\n                'sr-only': !this.autocomplete,\n              }}\n              aria-hidden=\"true\"\n              required={this.required}\n              onFocus={this.handleFocus}\n              clearable={this.clearable}\n              placeholder={this.placeholder}\n              pill={this.pill}\n              disabled={this.disabled}\n              size={this.size}\n              tabIndex={-1}\n            />\n          </div>\n\n          {/* Selection container */}\n          <div\n            class={{\n              'selection-container': true,\n              'selection-container--border':\n                this.selectionContainerItems.length > 0 && items.length !== this.selectionContainerItems.length,\n            }}\n          >\n            {this.selectionContainerItems}\n          </div>\n\n          {/* Menu */}\n          <six-menu\n            ref={(el) => (this.menu = el)}\n            part=\"menu\"\n            class={{\n              select__menu: true,\n              'select__menu--hidden': !hasMenuItems,\n            }}\n            onSix-menu-item-selected={this.handleMenuSelect}\n            items={this.options}\n            virtualScroll={this.virtualScroll}\n            remove-box-shadow={true}\n            disable-keyboard-handling={true}\n          >\n            <slot onSlotchange={this.handleSlotChange} />\n          </six-menu>\n\n          {/* Select all */}\n          {this.multiple && this.selectAllButton && (\n            <div class=\"select-all\" slot=\"dropdown-footer\">\n              <six-button type=\"link\" onClick={() => this.selectAll()}>\n                {this.selectAllText == null ? selectAllDefaultText(hasDeselectedOptions) : this.selectAllText}\n              </six-button>\n            </div>\n          )}\n        </six-dropdown>\n      </FormControl>\n    );\n  }\n\n  private hasSelection() {\n    return this.multiple ? this.value.length > 0 : this.value !== '';\n  }\n\n  private hasDeselectedOptions() {\n    return this.getVisibleItems().some((opt) => !opt.disabled && !opt.checked);\n  }\n}\n\nfunction getCheckedItems(value: string[], items: HTMLSixMenuItemElement[]): HTMLSixMenuItemElement[] {\n  return items.filter((item) => value.includes(item.value));\n}\n\nfunction getWidth(element: Element) {\n  return element.getBoundingClientRect().width;\n}\n\nfunction computeFitCount(options: Element[], availableWidth: number): { fitCount: number; overflowCount: number } {\n  let accumulatedWidth = 0;\n  let fitCount = 0;\n\n  for (let i = 0; i < options.length; i++) {\n    const displayOption = options[i];\n    const width = getWidth(displayOption);\n    if (i === 0 && width > availableWidth) {\n      fitCount = 1;\n      break;\n    }\n    accumulatedWidth += width;\n    if (accumulatedWidth > availableWidth) {\n      break;\n    } else {\n      fitCount += 1;\n    }\n  }\n  const overflowCount = options.length - fitCount;\n  return { fitCount, overflowCount };\n}\n\nfunction showFittingValues(displayValueOptions: Element[], fitCount: number) {\n  if (displayValueOptions.length > 0) {\n    // show items that fit\n    displayValueOptions.slice(0, fitCount).forEach((displayValue, index, list) => {\n      showDisplayValue(displayValue);\n      const isLast = index === list.length - 1;\n      if (isLast) {\n        hideSeparator(displayValue);\n      } else {\n        showSeparator(displayValue);\n      }\n    });\n\n    // hide the rest\n    displayValueOptions.slice(fitCount).forEach((displayValue) => {\n      hideDisplayValue(displayValue);\n      showSeparator(displayValue);\n    });\n  }\n}\n\nfunction hideSeparator(displayValueOption: Element) {\n  displayValueOption.querySelector('.separator')?.classList.add('separator--hidden');\n}\n\nfunction showSeparator(displayValueOption: Element) {\n  displayValueOption.querySelector('.separator')?.classList.remove('separator--hidden');\n}\n\nfunction showDisplayValue(displayValueOption: Element) {\n  displayValueOption.classList.remove('display-value--hidden');\n}\n\nfunction hideDisplayValue(displayValueOption: Element) {\n  displayValueOption.classList.add('display-value--hidden');\n}\n\nfunction setOverflowCount(overflowCount: Element, count: number) {\n  overflowCount.textContent = `+${count}`;\n}\n\nfunction showOverflowCount(overflowCount: Element) {\n  overflowCount.classList.remove('overflow-count-hidden');\n}\n\nfunction hideOverflowCount(overflowCount: Element) {\n  overflowCount.classList.add('overflow-count-hidden');\n}\n\nfunction selectAllDefaultText(hasDeselectedOptions: boolean) {\n  const lang = getLanguage();\n  switch (lang) {\n    case 'de':\n      return hasDeselectedOptions ? 'Alle auswählen' : 'Alle abwählen';\n    case 'fr':\n      return hasDeselectedOptions ? 'Tout sélectionner' : 'Tout désélectionner';\n    case 'it':\n      return hasDeselectedOptions ? 'Seleziona tutto' : 'Deseleziona tutto';\n    case 'en':\n      return hasDeselectedOptions ? 'Select all' : 'Deselect all';\n    case 'es':\n      return hasDeselectedOptions ? 'Seleccionar todo' : 'Deseleccionar todo';\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/ui-library/p-1oJarDAY.js

@@ -0,0 +1,2 @@
+const e=["de","fr","it","en","es"];const a=new Intl.DateTimeFormat("de-CH");function r(e,r){try{const i=t[e][r.key];switch(r.key){case"required":case"requiredtrue":case"email":return i;case"minlength":case"maxlength":return i.replace("{requiredLength}",String(r.requiredLength));case"pattern":return i.replace("{pattern}",String(r.requiredPattern));case"min":return i.replace("{min}",String(r.min));case"max":return i.replace("{max}",String(r.max));case"mindate":return i.replace("{mindate}",a.format(typeof r.mindate==="string"?new Date(r.mindate):r.mindate));case"maxdate":return i.replace("{maxdate}",a.format(typeof r.maxdate==="string"?new Date(r.maxdate):r.maxdate));case"invaliddate":return i;case"custom":return r.text}}catch(a){console.warn(`no error message in '${e}' for error: ${r}`,a);return undefined}}function i(){const a=document.documentElement.lang;if(e.includes(a)){return a}return"de"}const t={en:{required:"Please fill out this field.",minlength:"Please enter at least {requiredLength} characters.",maxlength:"Please enter no more than {requiredLength} characters.",pattern:"Please enter a value that matches the pattern: {pattern}.",email:"Please enter a valid email address.",min:"Please enter a value greater than or equal to {min}.",max:"Please enter a value less than or equal to {max}.",requiredtrue:"Please check this field.",mindate:"Please enter a date on or after {mindate}.",maxdate:"Please enter a date on or before {maxdate}.",invaliddate:"Please enter a valid date."},fr:{required:"Veuillez remplir ce champ s'il vous plaît.",minlength:"Veuillez entrer au moins {requiredLength} caractères.",maxlength:"Veuillez entrer au maximum {requiredLength} caractères.",pattern:"Veuillez entrer une valeur qui correspond au format : {pattern}.",email:"Veuillez entrer une adresse email valide.",min:"Veuillez entrer une valeur supérieure ou égale à {min}.",max:"Veuillez entrer une valeur inférieure ou égale à {max}.",requiredtrue:"Veuillez cocher cette case s'il vous plaît.",mindate:"Veuillez entrer une date le {mindate} ou après.",maxdate:"Veuillez entrer une date le {maxdate} ou avant.",invaliddate:"Veuillez entrer une date valide."},de:{required:"Bitte füllen Sie dieses Feld aus.",minlength:"Bitte geben Sie mindestens {requiredLength} Zeichen ein.",maxlength:"Bitte geben Sie höchstens {requiredLength} Zeichen ein.",pattern:"Bitte geben Sie einen Wert ein, der dem Muster entspricht: {pattern}.",email:"Bitte geben Sie eine gültige E-Mail-Adresse ein.",min:"Bitte geben Sie einen Wert größer oder gleich {min} ein.",max:"Bitte geben Sie einen Wert kleiner oder gleich {max} ein.",requiredtrue:"Bitte aktivieren Sie dieses Feld.",mindate:"Bitte geben Sie ein Datum am oder nach dem {mindate} ein.",maxdate:"Bitte geben Sie ein Datum am oder vor dem {maxdate} ein.",invaliddate:"Bitte geben Sie ein gültiges Datum ein."},it:{required:"Si prega di compilare questo campo.",minlength:"Si prega di inserire almeno {requiredLength} caratteri.",maxlength:"Si prega di inserire al massimo {requiredLength} caratteri.",pattern:"Si prega di inserire un valore che corrisponde al formato: {pattern}.",email:"Si prega di inserire un indirizzo email valido.",min:"Si prega di inserire un valore maggiore o uguale a {min}.",max:"Si prega di inserire un valore minore o uguale a {max}.",requiredtrue:"Si prega di spuntare questo campo.",mindate:"Si prega di inserire una data il {mindate} o successiva.",maxdate:"Si prega di inserire una data il {maxdate} o precedente.",invaliddate:"Inserisci una data valida."},es:{required:"Por favor, rellene este campo.",minlength:"Por favor, introduzca al menos {requiredLength} caracteres.",maxlength:"Por favor, introduzca no más de {requiredLength} caracteres.",pattern:"Por favor, introduzca un valor que coincida con el patrón: {pattern}.",email:"Por favor, introduzca una dirección de correo electrónico válida.",min:"Por favor, introduzca un valor mayor o igual a {min}.",max:"Por favor, introduzca un valor menor o igual a {max}.",requiredtrue:"Por favor, marque este campo.",mindate:"Por favor, introduzca una fecha igual o posterior a {mindate}.",maxdate:"Por favor, introduzca una fecha igual o anterior a {maxdate}.",invaliddate:"Por favor, introduzca una fecha válida."}};export{i as a,r as g,e as l};
+//# sourceMappingURL=p-1oJarDAY.js.map

package/dist/ui-library/p-1oJarDAY.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"p-1oJarDAY.js","sources":["src/utils/error-messages.ts"],"sourcesContent":["export const languages = ['de', 'fr', 'it', 'en', 'es'] as const;\nexport type Language = (typeof languages)[number];\n\nconst dateFormat = new Intl.DateTimeFormat('de-CH');\n\nexport type ValidationError =\n  | { key: 'required' }\n  | { key: 'requiredtrue' }\n  | { key: 'email'; requiredPattern: string }\n  | { key: 'minlength'; requiredLength: number }\n  | { key: 'maxlength'; requiredLength: number }\n  | { key: 'pattern'; requiredPattern: string }\n  | { key: 'min'; min: number }\n  | { key: 'max'; max: number }\n  | { key: 'mindate'; mindate: Date; actual: Date | string }\n  | { key: 'maxdate'; maxdate: Date; actual: Date | string }\n  | { key: 'invaliddate'; actual: Date }\n  | { key: 'custom'; text: string };\n\n/**\n * Returns an error message for the given language and error.\n */\nexport function getErrorMessage(language: Language, error: ValidationError): string | undefined {\n  try {\n    const message = translation[language][error.key];\n    switch (error.key) {\n      case 'required':\n      case 'requiredtrue':\n      case 'email':\n        return message;\n      case 'minlength':\n      case 'maxlength':\n        return message.replace('{requiredLength}', String(error.requiredLength));\n      case 'pattern':\n        return message.replace('{pattern}', String(error.requiredPattern));\n      case 'min':\n        return message.replace('{min}', String(error.min));\n      case 'max':\n        return message.replace('{max}', String(error.max));\n      case 'mindate':\n        return message.replace(\n          '{mindate}',\n          dateFormat.format(typeof error.mindate === 'string' ? new Date(error.mindate) : error.mindate)\n        );\n      case 'maxdate':\n        return message.replace(\n          '{maxdate}',\n          dateFormat.format(typeof error.maxdate === 'string' ? new Date(error.maxdate) : error.maxdate)\n        );\n      case 'invaliddate':\n        return message;\n      case 'custom':\n        return error.text;\n    }\n  } catch (e) {\n    console.warn(`no error message in '${language}' for error: ${error}`, e);\n\n    return undefined;\n  }\n}\n\nexport function getLanguage(): Language {\n  const documentLang = document.documentElement.lang as Language;\n  if (languages.includes(documentLang)) {\n    return documentLang;\n  }\n  return 'de';\n}\n\nconst translation: Record<Language, Record<string, string>> = {\n  en: {\n    required: 'Please fill out this field.',\n    minlength: 'Please enter at least {requiredLength} characters.',\n    maxlength: 'Please enter no more than {requiredLength} characters.',\n    pattern: 'Please enter a value that matches the pattern: {pattern}.',\n    email: 'Please enter a valid email address.',\n    min: 'Please enter a value greater than or equal to {min}.',\n    max: 'Please enter a value less than or equal to {max}.',\n    requiredtrue: 'Please check this field.',\n    mindate: 'Please enter a date on or after {mindate}.',\n    maxdate: 'Please enter a date on or before {maxdate}.',\n    invaliddate: 'Please enter a valid date.',\n  },\n  fr: {\n    required: \"Veuillez remplir ce champ s'il vous plaît.\",\n    minlength: 'Veuillez entrer au moins {requiredLength} caractères.',\n    maxlength: 'Veuillez entrer au maximum {requiredLength} caractères.',\n    pattern: 'Veuillez entrer une valeur qui correspond au format : {pattern}.',\n    email: 'Veuillez entrer une adresse email valide.',\n    min: 'Veuillez entrer une valeur supérieure ou égale à {min}.',\n    max: 'Veuillez entrer une valeur inférieure ou égale à {max}.',\n    requiredtrue: \"Veuillez cocher cette case s'il vous plaît.\",\n    mindate: 'Veuillez entrer une date le {mindate} ou après.',\n    maxdate: 'Veuillez entrer une date le {maxdate} ou avant.',\n    invaliddate: 'Veuillez entrer une date valide.',\n  },\n  de: {\n    required: 'Bitte füllen Sie dieses Feld aus.',\n    minlength: 'Bitte geben Sie mindestens {requiredLength} Zeichen ein.',\n    maxlength: 'Bitte geben Sie höchstens {requiredLength} Zeichen ein.',\n    pattern: 'Bitte geben Sie einen Wert ein, der dem Muster entspricht: {pattern}.',\n    email: 'Bitte geben Sie eine gültige E-Mail-Adresse ein.',\n    min: 'Bitte geben Sie einen Wert größer oder gleich {min} ein.',\n    max: 'Bitte geben Sie einen Wert kleiner oder gleich {max} ein.',\n    requiredtrue: 'Bitte aktivieren Sie dieses Feld.',\n    mindate: 'Bitte geben Sie ein Datum am oder nach dem {mindate} ein.',\n    maxdate: 'Bitte geben Sie ein Datum am oder vor dem {maxdate} ein.',\n    invaliddate: 'Bitte geben Sie ein gültiges Datum ein.',\n  },\n  it: {\n    required: 'Si prega di compilare questo campo.',\n    minlength: 'Si prega di inserire almeno {requiredLength} caratteri.',\n    maxlength: 'Si prega di inserire al massimo {requiredLength} caratteri.',\n    pattern: 'Si prega di inserire un valore che corrisponde al formato: {pattern}.',\n    email: 'Si prega di inserire un indirizzo email valido.',\n    min: 'Si prega di inserire un valore maggiore o uguale a {min}.',\n    max: 'Si prega di inserire un valore minore o uguale a {max}.',\n    requiredtrue: 'Si prega di spuntare questo campo.',\n    mindate: 'Si prega di inserire una data il {mindate} o successiva.',\n    maxdate: 'Si prega di inserire una data il {maxdate} o precedente.',\n    invaliddate: 'Inserisci una data valida.',\n  },\n\n  es: {\n    required: 'Por favor, rellene este campo.',\n    minlength: 'Por favor, introduzca al menos {requiredLength} caracteres.',\n    maxlength: 'Por favor, introduzca no más de {requiredLength} caracteres.',\n    pattern: 'Por favor, introduzca un valor que coincida con el patrón: {pattern}.',\n    email: 'Por favor, introduzca una dirección de correo electrónico válida.',\n    min: 'Por favor, introduzca un valor mayor o igual a {min}.',\n    max: 'Por favor, introduzca un valor menor o igual a {max}.',\n    requiredtrue: 'Por favor, marque este campo.',\n    mindate: 'Por favor, introduzca una fecha igual o posterior a {mindate}.',\n    maxdate: 'Por favor, introduzca una fecha igual o anterior a {maxdate}.',\n    invaliddate: 'Por favor, introduzca una fecha válida.',\n  },\n};\n"],"names":[],"mappings":"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"}

package/dist/ui-library/p-22ad5b1e.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as o,h as t,g as i}from"./p-D0Go1Zjj.js";import{F as s}from"./p-IBmarOIS.js";import{h as r,a as c}from"./p-j3oIB5oT.js";import{E as l}from"./p-C4h4qpGl.js";const a=':host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.form-control .form-control__label{display:none}.form-control .form-control__help-text{display:none}.form-control .form-control__error-text{display:none;text-align:left}.form-control--has-label .form-control__label{display:inline-block;color:var(--six-input-label-color);font-weight:var(--six-font-weight-bold);margin-bottom:var(--six-spacing-x-small)}.form-control--has-label .form-control__label__required::after{color:var(--six-color-danger-800);content:"*";transform:scale(1.1);margin-left:var(--six-spacing-xxx-small);position:absolute}.form-control--has-label.form-control--small .form-control__label{font-size:var(--six-input-label-font-size-small)}.form-control--has-label.form-control--medium .form-control__label{font-size:var(--six-input-label-font-size-medium)}.form-control--has-label.form-control--large .form-control_label{font-size:var(--six-input-label-font-size-large)}.form-control--has-help-text .form-control__help-text{display:block;color:var(--six-input-help-text-color);margin-top:var(--six-spacing-x-small)}.form-control--has-help-text .form-control__help-text ::slotted(*){margin-top:var(--six-spacing-xxx-small)}.form-control--has-help-text.form-control--small .form-control__help-text{font-size:var(--six-input-help-text-font-size-small)}.form-control--has-help-text.form-control--medium .form-control__help-text{font-size:var(--six-input-help-text-font-size-medium)}.form-control--has-help-text.form-control--large .form-control__help-text{font-size:var(--six-input-help-text-font-size-large)}.form-control--has-error-text .form-control__error-text{display:block;margin-top:var(--six-spacing-xxx-small)}.form-control--has-error-text .form-control__error-text ::slotted(*){margin-top:var(--six-spacing-xxx-small)}.form-control--has-error-text.form-control--small .form-control__error-text{font-size:var(--six-input-help-text-font-size-small)}.form-control--has-error-text.form-control--medium .form-control__error-text{font-size:var(--six-input-help-text-font-size-medium)}.form-control--has-error-text.form-control--large .form-control__error-text{font-size:var(--six-input-help-text-font-size-large)}.form-control--disabled .form-control__help-text{color:var(--six-input-help-text-color-disabled)}.form-control--disabled .form-control__label{color:var(--six-input-label-color-disabled)}.form-control--invalid:not(.form-control--disabled) .form-control__label{color:var(--six-input-label-color)}:host{display:inline-block}.checkbox{display:inline-flex;align-items:center;font-family:var(--six-font-family);font-size:var(--six-input-font-size-medium);font-weight:var(--six-input-font-weight);color:var(--six-input-color);vertical-align:middle;cursor:pointer}.checkbox--focused .checkbox__control{outline:var(--six-focus-ring);outline-offset:0}.checkbox__control{position:relative;display:inline-flex;align-items:center;justify-content:center;width:var(--six-selection-control-toggle-size);min-width:var(--six-selection-control-toggle-size);height:var(--six-selection-control-toggle-size);border:solid var(--six-border-width) var(--six-input-border-color);border-radius:0;background-color:var(--six-input-background-color);color:var(--six-checkbox-color);transition:var(--six-transition-fast) border-color, var(--six-transition-fast) background-color, var(--six-transition-fast) color, var(--six-transition-fast) box-shadow}.checkbox__control input[type=checkbox]{position:absolute;opacity:0;padding:0;margin:0;pointer-events:none;min-width:var(--six-selection-control-toggle-size)}.checkbox__control .checkbox__icon{display:inline-flex;width:var(--six-selection-control-toggle-size);height:var(--six-selection-control-toggle-size)}.checkbox__control .checkbox__icon svg{width:100%;height:100%}.checkbox:not(.checkbox--checked):not(.checkbox--disabled) .checkbox__control:hover{border-color:var(--six-input-border-color-hover)}.checkbox--checked .checkbox__control,.checkbox--indeterminate .checkbox__control{border-color:var(--six-selection-control-color);background-color:var(--six-selection-control-color)}.checkbox.checkbox--checked:not(.checkbox--disabled) .checkbox__control:hover,.checkbox.checkbox--indeterminate:not(.checkbox--disabled) .checkbox__control:hover{border-color:var(--six-input-border-color-focus);background-color:var(--six-input-border-color-focus)}.checkbox--disabled{cursor:not-allowed;color:var(--six-input-color-disabled)}.checkbox--disabled .checkbox__control{border-color:var(--six-input-border-color-disabled)}.checkbox--disabled.checkbox--checked .checkbox__control,.checkbox--disabled.checkbox--indeterminate .checkbox__control{background-color:var(--six-selection-control-color-disabled)}.checkbox--invalid:not(.checkbox--disabled) .checkbox__control{border-color:var(--six-input-border-color-danger)}.checkbox__text{line-height:var(--six-selection-control-toggle-size);margin-left:0.5em;user-select:none}';let n=0;const h=class{constructor(t){e(this,t);this.sixBlur=o(this,"six-checkbox-blur");this.sixChange=o(this,"six-checkbox-change");this.sixFocus=o(this,"six-checkbox-focus");this.inputId=`checkbox-${++n}`;this.labelId=`checkbox-label-${n}`;this.textId=`checkbox-text-${n}`;this.errorTextId=`input-error-text-${n}`;this.eventListeners=new l;this.hasFocus=false;this.hasLabelSlot=false;this.hasErrorSlot=false;this.name="";this.value="on";this.disabled=false;this.required=false;this.label="";this.errorText="";this.invalid=false;this.checked=false;this.indeterminate=false;this.handleChange=()=>{if(this.nativeInput!=null){this.checked=this.nativeInput.checked;this.indeterminate=false;this.sixChange.emit()}};this.handleBlur=()=>{this.hasFocus=false;this.sixBlur.emit()};this.handleFocus=()=>{this.hasFocus=true;this.sixFocus.emit()};this.handleMouseDown=e=>{var o;e.preventDefault();(o=this.nativeInput)===null||o===void 0?void 0:o.focus()}}handleCheckedChange(){if(this.nativeInput==null)return;this.nativeInput.checked=this.checked;this.checked=this.nativeInput.checked;this.nativeInput.indeterminate=this.indeterminate}handleLabelChange(){this.handleSlotChange()}connectedCallback(){var e;(e=this.host.shadowRoot)===null||e===void 0?void 0:e.addEventListener("slotchange",this.handleSlotChange);this.eventListeners.forward("six-checkbox-change","change",this.host);this.eventListeners.forward("six-checkbox-blur","blur",this.host);this.eventListeners.forward("six-checkbox-focus","focus",this.host)}disconnectedCallback(){var e;(e=this.host.shadowRoot)===null||e===void 0?void 0:e.removeEventListener("slotchange",this.handleSlotChange);this.eventListeners.removeAll()}componentWillLoad(){this.handleSlotChange()}componentDidLoad(){const e=this.nativeInput;if(e==null){return}e.indeterminate=this.indeterminate}async setFocus(e){var o;(o=this.nativeInput)===null||o===void 0?void 0:o.focus(e)}async removeFocus(){var e;(e=this.nativeInput)===null||e===void 0?void 0:e.blur()}handleSlotChange(){this.hasLabelSlot=r(this.host,"label");this.hasErrorSlot=r(this.host,"error-text")}render(){return t(s,{key:"fb33e858f751205c8df374f3bcca37cec9f8203b",inputId:this.inputId,label:this.label,labelId:this.labelId,hasLabelSlot:this.hasLabelSlot,errorTextId:this.errorTextId,hasErrorTextSlot:this.hasErrorSlot,errorText:this.errorText,errorTextCount:this.errorTextCount,size:"medium",disabled:this.disabled,required:this.required,displayError:this.invalid},t("label",{key:"35bfda441fe651af25cb45d75d003919c7869ae2",part:"base",class:{checkbox:true,"checkbox--checked":this.checked,"checkbox--disabled":this.disabled,"checkbox--focused":this.hasFocus,"checkbox--invalid":this.invalid,"checkbox--indeterminate":this.indeterminate},htmlFor:this.inputId,onMouseDown:this.handleMouseDown},t("span",{key:"92d31ea45a0f1f45230def64e15bd0e81c4de140",part:"control",class:"checkbox__control"},this.checked&&t("span",{key:"49501ea788463f4d39c5500349ace013c21d31c2",part:"checked-icon",class:"checkbox__icon"},t("svg",{key:"8ae0e9bfe850b13a205722a5e17e90b21ad35f26",viewBox:"0 0 16 16"},t("g",{key:"463b4761b130e5e9377efb7e26f57218ce5249ad",stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd","stroke-linecap":"round"},t("g",{key:"147d4348146dcace57835e436453bc834763c464",stroke:"currentColor","stroke-width":"2"},t("g",{key:"6596f4cd75b94d8ff3bef19698acc56a6eab847a",transform:"translate(3.428571, 3.428571)"},t("path",{key:"453cfb8ae9d6d4e45f1b569e06ba79ac2a0d2b9c",d:"M0,5.71428571 L3.42857143,9.14285714"}),t("path",{key:"b650801a5ae8fde8886b9e1fb4257eca704beabd",d:"M9.14285714,0 L3.42857143,9.14285714"})))))),!this.checked&&this.indeterminate&&t("span",{key:"ab31b1999eae88b74c5bdeb1bbc1007b0459f8a8",part:"indeterminate-icon",class:"checkbox__icon"},t("svg",{key:"8d5cf52fc16243531056ba760d9c770decd593e3",viewBox:"0 0 16 16"},t("g",{key:"fb8ee93f8ec5abc82f8d982cc2ad59c4ae77fb91",stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd","stroke-linecap":"round"},t("g",{key:"825161dbc71cfc395061b3ef485352762c8780c5",stroke:"currentColor","stroke-width":"2"},t("g",{key:"c5541fd6e2d69a376278cd617447a8b9bfe6a0d6",transform:"translate(2.285714, 6.857143)"},t("path",{key:"6c1f488d0572c2773b8497cd6214dcfdc64164ef",d:"M10.2857143,1.14285714 L1.14285714,1.14285714"})))))),t("input",{key:"2e8ac6e459e47708116702585a5155ee4385d021",ref:e=>this.nativeInput=e,id:this.inputId,type:"checkbox",name:this.name,value:this.value,checked:this.checked,disabled:this.disabled,required:this.required,role:"checkbox","aria-checked":this.checked?"true":"false","aria-labelledby":this.labelId,onChange:this.handleChange,onBlur:this.handleBlur,onFocus:this.handleFocus})),t("span",{key:"817dae0dcffedf7de011d0fa68ce3a1ca45bbd3a",part:"text",id:this.textId,class:"checkbox__text"},t("slot",{key:"e0f9b77cf11c592efd6b312888491a3b5e84bb32"}))))}get host(){return i(this)}static get watchers(){return{checked:["handleCheckedChange"],indeterminate:["handleCheckedChange"],errorText:["handleLabelChange"],label:["handleLabelChange"]}}};h.style=a;const d=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}:host{display:block}:focus{outline:none}.menu-item{position:relative;display:flex;align-items:stretch;font-family:var(--six-font-sans);font-size:var(--six-font-size-small);font-weight:var(--six-font-weight-normal);line-height:var(--six-line-height-normal);letter-spacing:var(--six-letter-spacing-normal);text-align:left;color:var(--six-input-color);border-radius:var(--six-border-radius-medium);padding:var(--six-spacing-x-small) var(--six-spacing-medium);transition:var(--six-transition-fast) fill;user-select:none;white-space:nowrap;cursor:pointer}.menu-item.menu-item--focused:not(.menu-item--disabled){outline:none;background-color:var(--six-menu-item-background-color)}.menu-item.menu-item--active:not(.menu-item--disabled){outline:none;background-color:var(--six-menu-item-background-color)}.menu-item.menu-item--disabled{outline:none;color:var(--six-input-color-disabled);cursor:not-allowed}.menu-item .menu-item__label{flex:1 1 auto;align-self:center}.menu-item .menu-item__prefix{flex:0 0 auto;display:flex;align-items:center}.menu-item .menu-item__prefix ::slotted(:last-child){margin-right:0.5em}.menu-item .menu-item__suffix{flex:0 0 auto;display:flex;align-items:center}.menu-item .menu-item__suffix ::slotted(:first-child){margin-left:0.5em}.menu-item .menu-item__check{flex:0 0 auto;display:flex;align-items:center;margin-left:var(--six-spacing-small);visibility:hidden;font-size:inherit}.menu-item .menu-item__checkbox{margin-top:-1px}.menu-item--checked .menu-item__check{visibility:visible}";const b=class{constructor(o){e(this,o);this.hasFocus=false;this.active=false;this.checkType="check";this.checked=false;this.value="";this.disabled=false;this.handleCheckboxChange=()=>{this.host.dispatchEvent(new Event("click",{bubbles:true,cancelable:true}))}}connectedCallback(){this.handleBlur=this.handleBlur.bind(this);this.handleFocus=this.handleFocus.bind(this);this.handleMouseEnter=this.handleMouseEnter.bind(this);this.handleMouseLeave=this.handleMouseLeave.bind(this);this.handleCheckboxChange=this.handleCheckboxChange.bind(this)}async setFocus(e){var o;(o=this.menuItem)===null||o===void 0?void 0:o.focus(e)}async removeFocus(){var e;(e=this.menuItem)===null||e===void 0?void 0:e.blur()}getTextLabel(){return Promise.resolve(c(this.defaultSlot))}handleBlur(){this.hasFocus=false}handleFocus(){this.hasFocus=true}handleMouseEnter(){this.active=true}handleMouseLeave(){this.active=false;this.hasFocus=false}render(){return t("div",{key:"1272ddcb536f11b8362d2d6050e7e022f2c57601",ref:e=>this.menuItem=e,part:"base",class:{"menu-item":true,"menu-item--checked":this.checked,"menu-item--disabled":this.disabled,"menu-item--focused":this.hasFocus,"menu-item--active":this.active},role:"menuitem","aria-disabled":this.disabled?"true":"false","aria-checked":this.checked?"true":"false",tabIndex:!this.disabled?0:undefined,onFocus:this.handleFocus,onBlur:this.handleBlur,onMouseEnter:this.handleMouseEnter,onMouseLeave:this.handleMouseLeave},this.checkType==="checkbox"&&t("span",{key:"433f8c7ea79197d6881f02d5daad580cdc45ad75",class:"menu-item__checkbox"},t("six-checkbox",{key:"a2bb3ef76de46374e058f814723ae2e601d9d12e","onSix-checkbox-change":this.handleCheckboxChange,disabled:this.disabled,checked:this.checked})),t("span",{key:"7e068c6cca0e53ecac63a461945d13b3a157e9e6",part:"prefix",class:"menu-item__prefix"},t("slot",{key:"4a8b59e044ec0d20fa96a4f2c8dabcc697e24641",name:"prefix"})),t("span",{key:"9d33d8597e12e94d6b4da75480bf034053124e34",part:"label",class:"menu-item__label"},t("slot",{key:"eb1f6a5ac3dd253c3844b7b2f1abd8eab5d8e2f7",ref:e=>this.defaultSlot=e})),t("span",{key:"dafb3d36a73291eb05e3bb53744204400f0cde66",part:"suffix",class:"menu-item__suffix"},t("slot",{key:"b544b01d90f3a5ab49a99ca39b4abc622fed87c1",name:"suffix"})),this.checkType==="check"&&t("span",{key:"f7dc2836cbd13a851db43967f9e1f4334937f19e",part:"checked-icon",class:"menu-item__check"},t("six-icon",{key:"db186867ab833a1064f091d592f4c39675a9aeeb",size:"small","aria-hidden":"true"},"check")))}get host(){return i(this)}};b.style=d;export{h as six_checkbox,b as six_menu_item};
+//# sourceMappingURL=p-22ad5b1e.entry.js.map

package/dist/ui-library/p-22ad5b1e.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["sixCheckboxCss","id","SixCheckbox","constructor","hostRef","this","inputId","labelId","textId","errorTextId","eventListeners","EventListeners","hasFocus","hasLabelSlot","hasErrorSlot","name","value","disabled","required","label","errorText","invalid","checked","indeterminate","handleChange","nativeInput","sixChange","emit","handleBlur","sixBlur","handleFocus","sixFocus","handleMouseDown","event","preventDefault","_a","focus","handleCheckedChange","handleLabelChange","handleSlotChange","connectedCallback","host","shadowRoot","addEventListener","forward","disconnectedCallback","removeEventListener","removeAll","componentWillLoad","componentDidLoad","setFocus","options","removeFocus","blur","hasSlot","render","h","FormControl","key","hasErrorTextSlot","errorTextCount","size","displayError","part","class","checkbox","htmlFor","onMouseDown","viewBox","stroke","fill","transform","d","ref","el","type","role","onChange","onBlur","onFocus","sixMenuItemCss","SixMenuItem","active","checkType","handleCheckboxChange","dispatchEvent","Event","bubbles","cancelable","bind","handleMouseEnter","handleMouseLeave","menuItem","getTextLabel","Promise","resolve","getTextContent","defaultSlot","tabIndex","undefined","onMouseEnter","onMouseLeave"],"sources":["src/components/six-checkbox/six-checkbox.scss?tag=six-checkbox&encapsulation=shadow","src/components/six-checkbox/six-checkbox.tsx","src/components/six-menu-item/six-menu-item.scss?tag=six-menu-item&encapsulation=shadow","src/components/six-menu-item/six-menu-item.tsx"],"sourcesContent":["@import 'src/global/component';\n@import '../../functional-components/form-control/form-control';\n\n:host {\n  display: inline-block;\n}\n\n.checkbox {\n  display: inline-flex;\n  align-items: center;\n  font-family: var(--six-font-family);\n  font-size: var(--six-input-font-size-medium);\n  font-weight: var(--six-input-font-weight);\n  color: var(--six-input-color);\n  vertical-align: middle;\n  cursor: pointer;\n}\n\n.checkbox--focused {\n  .checkbox__control {\n    outline: var(--six-focus-ring);\n    outline-offset: 0;\n  }\n}\n\n.checkbox__control {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: var(--six-selection-control-toggle-size);\n  min-width: var(--six-selection-control-toggle-size);\n  height: var(--six-selection-control-toggle-size);\n  border: solid var(--six-border-width) var(--six-input-border-color);\n  border-radius: 0;\n  background-color: var(--six-input-background-color);\n  color: var(--six-checkbox-color);\n  transition:\n    var(--six-transition-fast) border-color,\n    var(--six-transition-fast) background-color,\n    var(--six-transition-fast) color,\n    var(--six-transition-fast) box-shadow;\n\n  input[type='checkbox'] {\n    position: absolute;\n    opacity: 0;\n    padding: 0;\n    margin: 0;\n    pointer-events: none;\n    min-width: var(--six-selection-control-toggle-size);\n  }\n\n  .checkbox__icon {\n    display: inline-flex;\n    width: var(--six-selection-control-toggle-size);\n    height: var(--six-selection-control-toggle-size);\n\n    svg {\n      width: 100%;\n      height: 100%;\n    }\n  }\n}\n\n// Hover\n.checkbox:not(.checkbox--checked):not(.checkbox--disabled) .checkbox__control:hover {\n  border-color: var(--six-input-border-color-hover);\n}\n\n// Checked/indeterminate\n.checkbox--checked .checkbox__control,\n.checkbox--indeterminate .checkbox__control {\n  border-color: var(--six-selection-control-color);\n  background-color: var(--six-selection-control-color);\n}\n\n// Checked/indeterminate + hover\n.checkbox.checkbox--checked:not(.checkbox--disabled) .checkbox__control:hover,\n.checkbox.checkbox--indeterminate:not(.checkbox--disabled) .checkbox__control:hover {\n  border-color: var(--six-input-border-color-focus);\n  background-color: var(--six-input-border-color-focus);\n}\n\n// Disabled\n.checkbox--disabled {\n  cursor: not-allowed;\n  color: var(--six-input-color-disabled);\n\n  .checkbox__control {\n    border-color: var(--six-input-border-color-disabled);\n  }\n\n  &.checkbox--checked .checkbox__control,\n  &.checkbox--indeterminate .checkbox__control {\n    background-color: var(--six-selection-control-color-disabled);\n  }\n}\n\n// Invalid\n.checkbox--invalid:not(.checkbox--disabled) {\n  .checkbox__control {\n    border-color: var(--six-input-border-color-danger);\n  }\n}\n\n.checkbox__text {\n  line-height: var(--six-selection-control-toggle-size);\n  margin-left: 0.5em;\n  user-select: none;\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport FormControl from '../../functional-components/form-control/form-control';\nimport { hasSlot } from '../../utils/slot';\nimport { EmptyPayload } from '../../utils/types';\nimport { EventListeners } from '../../utils/event-listeners';\n\nlet id = 0;\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot label - The checkbox label.\n * @slot error-text - Error text that is shown for validation errors. Alternatively, you can use the error-text prop.\n *\n * @part base - The component's base wrapper.\n * @part control - The checkbox control.\n * @part checked-icon - The container the wraps the checked icon.\n * @part indeterminate-icon - The container that wraps the indeterminate icon.\n * @part text - The checkbox text rendered to the right.\n */\n\n@Component({\n  tag: 'six-checkbox',\n  styleUrl: 'six-checkbox.scss',\n  shadow: true,\n})\nexport class SixCheckbox {\n  private inputId = `checkbox-${++id}`;\n  private labelId = `checkbox-label-${id}`;\n  private textId = `checkbox-text-${id}`;\n  private errorTextId = `input-error-text-${id}`;\n  private nativeInput?: HTMLInputElement;\n  private eventListeners = new EventListeners();\n\n  @Element() host!: HTMLSixCheckboxElement;\n\n  @State() hasFocus = false;\n  @State() hasLabelSlot = false;\n  @State() hasErrorSlot = false;\n\n  /** The checkbox's name attribute. */\n  @Prop() name = '';\n\n  /**\n   * The value of the checkbox does not mean if it's checked or not, use the `checked`\n   * property for that.\n   *\n   * The value of a checkbox is analogous to the value of an `<input type=\"checkbox\">`,\n   * it's only used when the checkbox participates in a native `<form>`.\n   */\n  @Prop() value = 'on';\n\n  /** Set to true to disable the checkbox. */\n  @Prop() disabled = false;\n\n  /** Set to true to show an asterisk beneath the label. */\n  @Prop() required = false;\n\n  /** The label text. */\n  @Prop() label = '';\n\n  /** The error message shown, if `invalid` is set to true.  */\n  @Prop() errorText: string | string[] = '';\n\n  /** The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1 */\n  @Prop() errorTextCount?: number;\n\n  /** If this property is set to true and an error message is provided by `errorText`, the error message is displayed.  */\n  @Prop({ reflect: true }) invalid = false;\n\n  /** Set to true to draw the checkbox in a checked state. */\n  @Prop({ mutable: true, reflect: true }) checked = false;\n\n  /** Set to true to draw the checkbox in an indeterminate state. */\n  @Prop({ mutable: true, reflect: true }) indeterminate = false;\n\n  /** Emitted when the control loses focus. */\n  @Event({ eventName: 'six-checkbox-blur' }) sixBlur!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the control's checked state changes. */\n  @Event({ eventName: 'six-checkbox-change' }) sixChange!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the control gains focus. */\n  @Event({ eventName: 'six-checkbox-focus' }) sixFocus!: EventEmitter<EmptyPayload>;\n\n  @Watch('checked')\n  @Watch('indeterminate')\n  handleCheckedChange() {\n    if (this.nativeInput == null) return;\n\n    this.nativeInput.checked = this.checked;\n    this.checked = this.nativeInput.checked;\n    this.nativeInput.indeterminate = this.indeterminate;\n  }\n\n  @Watch('errorText')\n  @Watch('label')\n  handleLabelChange() {\n    this.handleSlotChange();\n  }\n\n  connectedCallback() {\n    this.host.shadowRoot?.addEventListener('slotchange', this.handleSlotChange);\n    this.eventListeners.forward('six-checkbox-change', 'change', this.host);\n    this.eventListeners.forward('six-checkbox-blur', 'blur', this.host);\n    this.eventListeners.forward('six-checkbox-focus', 'focus', this.host);\n  }\n\n  disconnectedCallback() {\n    this.host.shadowRoot?.removeEventListener('slotchange', this.handleSlotChange);\n    this.eventListeners.removeAll();\n  }\n\n  componentWillLoad() {\n    this.handleSlotChange();\n  }\n\n  componentDidLoad() {\n    const nativeInput = this.nativeInput;\n    if (nativeInput == null) {\n      return;\n    }\n\n    nativeInput.indeterminate = this.indeterminate;\n  }\n\n  /** Sets focus on the checkbox. */\n  @Method()\n  async setFocus(options?: FocusOptions) {\n    this.nativeInput?.focus(options);\n  }\n\n  /** Removes focus from the checkbox. */\n  @Method()\n  async removeFocus() {\n    this.nativeInput?.blur();\n  }\n\n  private handleChange = () => {\n    if (this.nativeInput != null) {\n      this.checked = this.nativeInput.checked;\n      this.indeterminate = false;\n      this.sixChange.emit();\n    }\n  };\n\n  private handleBlur = () => {\n    this.hasFocus = false;\n    this.sixBlur.emit();\n  };\n\n  private handleFocus = () => {\n    this.hasFocus = true;\n    this.sixFocus.emit();\n  };\n\n  private handleMouseDown = (event: MouseEvent) => {\n    // Prevent clicks on the label from briefly blurring the input\n    event.preventDefault();\n    this.nativeInput?.focus();\n  };\n\n  private handleSlotChange() {\n    this.hasLabelSlot = hasSlot(this.host, 'label');\n    this.hasErrorSlot = hasSlot(this.host, 'error-text');\n  }\n\n  render() {\n    return (\n      <FormControl\n        inputId={this.inputId}\n        label={this.label}\n        labelId={this.labelId}\n        hasLabelSlot={this.hasLabelSlot}\n        errorTextId={this.errorTextId}\n        hasErrorTextSlot={this.hasErrorSlot}\n        errorText={this.errorText}\n        errorTextCount={this.errorTextCount}\n        size=\"medium\"\n        disabled={this.disabled}\n        required={this.required}\n        displayError={this.invalid}\n      >\n        <label\n          part=\"base\"\n          class={{\n            checkbox: true,\n            'checkbox--checked': this.checked,\n            'checkbox--disabled': this.disabled,\n            'checkbox--focused': this.hasFocus,\n            'checkbox--invalid': this.invalid,\n            'checkbox--indeterminate': this.indeterminate,\n          }}\n          htmlFor={this.inputId}\n          onMouseDown={this.handleMouseDown}\n        >\n          <span part=\"control\" class=\"checkbox__control\">\n            {this.checked && (\n              <span part=\"checked-icon\" class=\"checkbox__icon\">\n                <svg viewBox=\"0 0 16 16\">\n                  <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\" stroke-linecap=\"round\">\n                    <g stroke=\"currentColor\" stroke-width=\"2\">\n                      <g transform=\"translate(3.428571, 3.428571)\">\n                        <path d=\"M0,5.71428571 L3.42857143,9.14285714\"></path>\n                        <path d=\"M9.14285714,0 L3.42857143,9.14285714\"></path>\n                      </g>\n                    </g>\n                  </g>\n                </svg>\n              </span>\n            )}\n\n            {!this.checked && this.indeterminate && (\n              <span part=\"indeterminate-icon\" class=\"checkbox__icon\">\n                <svg viewBox=\"0 0 16 16\">\n                  <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\" stroke-linecap=\"round\">\n                    <g stroke=\"currentColor\" stroke-width=\"2\">\n                      <g transform=\"translate(2.285714, 6.857143)\">\n                        <path d=\"M10.2857143,1.14285714 L1.14285714,1.14285714\"></path>\n                      </g>\n                    </g>\n                  </g>\n                </svg>\n              </span>\n            )}\n\n            <input\n              ref={(el) => (this.nativeInput = el)}\n              id={this.inputId}\n              type=\"checkbox\"\n              name={this.name}\n              value={this.value}\n              checked={this.checked}\n              disabled={this.disabled}\n              required={this.required}\n              role=\"checkbox\"\n              aria-checked={this.checked ? 'true' : 'false'}\n              aria-labelledby={this.labelId}\n              onChange={this.handleChange}\n              onBlur={this.handleBlur}\n              onFocus={this.handleFocus}\n            />\n          </span>\n\n          <span part=\"text\" id={this.textId} class=\"checkbox__text\">\n            <slot />\n          </span>\n        </label>\n      </FormControl>\n    );\n  }\n}\n","@import 'src/global/component';\n\n:host {\n  display: block;\n}\n\n:focus {\n  outline: none;\n}\n\n.menu-item {\n  position: relative;\n  display: flex;\n  align-items: stretch;\n  font-family: var(--six-font-sans);\n  font-size: var(--six-font-size-small);\n  font-weight: var(--six-font-weight-normal);\n  line-height: var(--six-line-height-normal);\n  letter-spacing: var(--six-letter-spacing-normal);\n  text-align: left;\n  color: var(--six-input-color);\n  border-radius: var(--six-border-radius-medium);\n  padding: var(--six-spacing-x-small) var(--six-spacing-medium);\n  transition: var(--six-transition-fast) fill;\n  user-select: none;\n  white-space: nowrap;\n  cursor: pointer;\n\n  &.menu-item--focused:not(.menu-item--disabled) {\n    outline: none;\n    background-color: var(--six-menu-item-background-color);\n  }\n\n  &.menu-item--active:not(.menu-item--disabled) {\n    outline: none;\n    background-color: var(--six-menu-item-background-color);\n  }\n\n  &.menu-item--disabled {\n    outline: none;\n    color: var(--six-input-color-disabled);\n    cursor: not-allowed;\n  }\n\n  .menu-item__label {\n    flex: 1 1 auto;\n    align-self: center;\n  }\n\n  .menu-item__prefix {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n\n    ::slotted(:last-child) {\n      margin-right: 0.5em;\n    }\n  }\n\n  .menu-item__suffix {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n\n    ::slotted(:first-child) {\n      margin-left: 0.5em;\n    }\n  }\n\n  .menu-item__check {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n    margin-left: var(--six-spacing-small);\n    visibility: hidden;\n    font-size: inherit;\n  }\n\n  .menu-item__checkbox {\n    margin-top: -1px;\n  }\n}\n\n.menu-item--checked .menu-item__check {\n  visibility: visible;\n}\n","import { Component, Element, h, Method, Prop, State } from '@stencil/core';\nimport { getTextContent } from '../../utils/slot';\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot - The menu item's label.\n * @slot prefix - Used to prepend an icon or similar element to the menu item.\n * @slot suffix - Used to append an icon or similar element to the menu item.\n *\n * @part base - The component's base wrapper.\n * @part checked-icon - The container that wraps the checked icon.\n * @part prefix - The prefix container.\n * @part label - The menu item label.\n * @part suffix - The suffix container.\n */\n\n@Component({\n  tag: 'six-menu-item',\n  styleUrl: 'six-menu-item.scss',\n  shadow: true,\n})\nexport class SixMenuItem {\n  private menuItem?: HTMLElement;\n  private defaultSlot?: HTMLSlotElement;\n\n  @Element() host!: HTMLSixMenuItemElement;\n\n  @State() hasFocus = false;\n\n  @State() active = false;\n\n  /** Defines if the checked state is displayed as a checkbox or a check-icon */\n  @Prop() checkType: 'checkbox' | 'check' = 'check';\n\n  /** Internal: Draws the item in a checked state. CheckType needs to be set to 'checkbox' or 'check' to show the\n   * checked state */\n  @Prop({ reflect: true }) checked = false;\n\n  /** A unique value to store in the menu item. This can be used as a way to identify menu items when selected. */\n  @Prop({ reflect: true }) value = '';\n\n  /** Set to true to draw the menu item in a disabled state. */\n  @Prop({ reflect: true }) disabled = false;\n\n  connectedCallback() {\n    this.handleBlur = this.handleBlur.bind(this);\n    this.handleFocus = this.handleFocus.bind(this);\n    this.handleMouseEnter = this.handleMouseEnter.bind(this);\n    this.handleMouseLeave = this.handleMouseLeave.bind(this);\n    this.handleCheckboxChange = this.handleCheckboxChange.bind(this);\n  }\n\n  /** Sets focus on the button. */\n  @Method()\n  async setFocus(options?: FocusOptions) {\n    this.menuItem?.focus(options);\n  }\n\n  /** Removes focus from the button. */\n  @Method()\n  async removeFocus() {\n    this.menuItem?.blur();\n  }\n\n  /** Returns a text label based on the contents of the menu item's default slot. */\n  @Method()\n  getTextLabel() {\n    return Promise.resolve(getTextContent(this.defaultSlot));\n  }\n\n  private handleBlur() {\n    this.hasFocus = false;\n  }\n\n  private handleFocus() {\n    this.hasFocus = true;\n  }\n\n  private handleMouseEnter() {\n    this.active = true;\n  }\n\n  private handleMouseLeave() {\n    this.active = false;\n    this.hasFocus = false;\n  }\n\n  private handleCheckboxChange = () => {\n    this.host.dispatchEvent(new Event('click', { bubbles: true, cancelable: true }));\n  };\n\n  render() {\n    return (\n      <div\n        ref={(el) => (this.menuItem = el)}\n        part=\"base\"\n        class={{\n          'menu-item': true,\n          'menu-item--checked': this.checked,\n          'menu-item--disabled': this.disabled,\n          'menu-item--focused': this.hasFocus,\n          'menu-item--active': this.active,\n        }}\n        role=\"menuitem\"\n        aria-disabled={this.disabled ? 'true' : 'false'}\n        aria-checked={this.checked ? 'true' : 'false'}\n        tabIndex={!this.disabled ? 0 : undefined}\n        onFocus={this.handleFocus}\n        onBlur={this.handleBlur}\n        onMouseEnter={this.handleMouseEnter}\n        onMouseLeave={this.handleMouseLeave}\n      >\n        {this.checkType === 'checkbox' && (\n          <span class=\"menu-item__checkbox\">\n            <six-checkbox\n              onSix-checkbox-change={this.handleCheckboxChange}\n              disabled={this.disabled}\n              checked={this.checked}\n            ></six-checkbox>\n          </span>\n        )}\n\n        <span part=\"prefix\" class=\"menu-item__prefix\">\n          <slot name=\"prefix\" />\n        </span>\n\n        <span part=\"label\" class=\"menu-item__label\">\n          <slot ref={(el) => (this.defaultSlot = el as HTMLSlotElement)} />\n        </span>\n\n        <span part=\"suffix\" class=\"menu-item__suffix\">\n          <slot name=\"suffix\" />\n        </span>\n\n        {this.checkType === 'check' && (\n          <span part=\"checked-icon\" class=\"menu-item__check\">\n            <six-icon size=\"small\" aria-hidden=\"true\">\n              check\n            </six-icon>\n          </span>\n        )}\n      </div>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/ui-library/p-27e8e8a6.entry.js

@@ -0,0 +1,2 @@
+import{r as i,c as s,h as e,g as l}from"./p-D0Go1Zjj.js";import{h as o}from"./p-j3oIB5oT.js";const a=".sc-six-file-upload-h{position:relative;box-sizing:border-box}.sc-six-file-upload-h *.sc-six-file-upload,.sc-six-file-upload-h *.sc-six-file-upload:before,.sc-six-file-upload-h *.sc-six-file-upload:after{box-sizing:border-box}.sr-only.sc-six-file-upload{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.sc-six-file-upload-h{position:static;display:block}.six-file-upload.sc-six-file-upload six-card.sc-six-file-upload{box-shadow:none;padding:0;width:100%}.six-file-upload__label--highlighted.sc-six-file-upload{color:var(--six-color-action-600)}.six-file-upload__container--full.sc-six-file-upload{border:dashed 1px var(--six-color-web-rock-500)}.six-file-upload__drop-zone.sc-six-file-upload{padding:2rem 0;display:flex;justify-content:center;width:100%;transition:background-color 0.3s}.six-file-upload__drop-zone__spinner-container.sc-six-file-upload{display:flex;align-items:center}.six-file-upload__drop-zone__spinner-container.sc-six-file-upload six-spinner.sc-six-file-upload{margin-right:var(--six-spacing-x-small)}.six-file-upload__drop-zone--compact.sc-six-file-upload{padding:0}.six-file-upload__input.sc-six-file-upload{cursor:pointer;position:absolute;top:0;left:0;width:100%;user-select:none;height:100%;opacity:0;outline:none}.six-file-upload--disabled.sc-six-file-upload .six-file-upload__drop-zone.sc-six-file-upload{background-color:var(--six-color-inactive);cursor:not-allowed}.six-file-upload.sc-six-file-upload:not(.six-file-upload--disabled) .six-file-upload__drop-zone.sc-six-file-upload:hover,.six-file-upload__drop-zone--hover.sc-six-file-upload{background-color:var(--six-color-action-light-to-be-defined)}.six-file-upload.sc-six-file-upload:not(.six-file-upload--disabled) .six-file-upload__drop-zone.sc-six-file-upload:hover.six-file-upload__drop-zone--compact,.six-file-upload__drop-zone--hover.six-file-upload__drop-zone--compact.sc-six-file-upload{background-color:inherit}.six-file-upload--disabled.sc-six-file-upload .six-file-upload__input.sc-six-file-upload{cursor:not-allowed}.six-file-upload__error-text.sc-six-file-upload{font-size:var(--six-input-help-text-font-size-medium)}";const t=class{constructor(e){i(this,e);this.success=s(this,"six-file-upload-success");this.failure=s(this,"six-file-upload-failure");this.isOver=false;this.hasError=false;this.compact=false;this.disabled=false;this.multiple=false;this.uploading=false;this.errorText="";this.invalid=false;this.handleSlotChange=()=>{let i=false;if(this.errorText!=null&&(typeof this.errorText=="string"&&this.errorText.trim().length>0||typeof this.errorText=="object"&&this.errorText.length>0)){i=true}this.hasError=i||o(this.host,"error-text")};this.handleFiles=i=>{if(this.disabled||i.length===0||this.uploading){return}if(!this.multiple&&i.length>1){return this.failure.emit({reason:"Only one file is allowed."})}for(const s of i){if(s==null){return}let e=[];if(this.accept!=null){e=this.accept.replace(/\s/g,"").split(",")}if(e.length>0&&e.indexOf(s.type)===-1){const s=i.length>1?"One or more files have invalid MIME type.":"File has invalid MIME type.";return this.failure.emit({reason:s})}if(this.maxFileSize!=null&&s.size>this.maxFileSize){const s=i.length>1?"One or more files are too big":"File is too big.";return this.failure.emit({reason:s})}}this.success.emit({files:i})};this.onChange=()=>{var i;if(((i=this.fileInput)===null||i===void 0?void 0:i.files)!=null){const i=this.fileInput.files;this.handleFiles(i);this.fileInput.value=""}}}dragenterHandler(){if(!this.disabled){this.isOver=true}}dragoverHandler(){if(!this.disabled){this.isOver=true}}dragleaveHandler(){if(!this.disabled){this.isOver=false}}dropHandler(){if(!this.disabled){this.isOver=false}}componentWillLoad(){this.handleSlotChange()}componentDidLoad(){var i;["dragenter","dragover","dragleave","drop"].forEach((i=>{this.host.addEventListener(i,this.preventDefaults,false);document.body.addEventListener(i,this.preventDefaults,false)}));(i=this.host.shadowRoot)===null||i===void 0?void 0:i.addEventListener("slotchange",this.handleSlotChange)}disconnectedCallback(){var i;["dragenter","dragover","dragleave","drop"].forEach((i=>{this.host.removeEventListener(i,this.preventDefaults,false);document.body.removeEventListener(i,this.preventDefaults,false)}));(i=this.host.shadowRoot)===null||i===void 0?void 0:i.removeEventListener("slotchange",this.handleSlotChange)}preventDefaults(i){i.preventDefault();i.stopPropagation()}renderLabel(){var i;return(i=this.label)!==null&&i!==void 0?i:this.compact?"Upload":e("span",null,"Drop files to upload, or ",e("span",{class:"six-file-upload__label--highlighted"},"browse"))}render(){const i=this.compact?"six-button":"six-card";const s=(Array.isArray(this.errorText)?this.errorText:[this.errorText]).filter((i=>i!=null&&i.trim()!==""));return e("div",{key:"9a218054b8c8ebb757b52443eec09a1d0aeaed9f",class:{"six-file-upload":true,"six-file-upload--disabled":this.disabled||this.uploading}},e(i,{key:"b46e0045f3c2a5b4500dc427cf26958a0e9c95db",disabled:this.disabled||this.uploading,"aria-invalid":this.invalid?"true":"false",class:{"six-file-upload__container--compact":this.compact,"six-file-upload__container--full":!this.compact}},this.compact&&!this.uploading&&e("six-icon",{key:"5554e0b4f58b9070e5f187c3fb398c7799d3e2cb",slot:"prefix"},"arrow_circle_up"),e("div",{key:"fd1c35f6ae2bf980b50725af2c8de5caf6d23ca0",class:{"six-file-upload__drop-zone":true,"six-file-upload__drop-zone--hover":this.isOver,"six-file-upload__drop-zone--compact":this.compact}},this.uploading?e("span",{class:"six-file-upload__drop-zone__spinner-container"},e("six-spinner",null)," Uploading..."):e("div",null,e("span",null,this.renderLabel()),e("input",{class:"six-file-upload__input",type:"file",name:"resume",disabled:this.disabled,accept:this.accept,multiple:this.multiple,onChange:this.onChange,ref:i=>this.fileInput=i})))),e("div",{key:"25185ad2032778268e923c6b618129bb25e317df","aria-hidden":this.invalid?"false":"true"},e("slot",{key:"48a849e787fb9a3607990204d6cc2a8c3a31dc70",name:"error-text"},s.map((i=>e("six-error",null,e("div",{class:"six-file-upload__error-text"},i)))))))}get host(){return l(this)}};t.style=a;export{t as six_file_upload};
+//# sourceMappingURL=p-27e8e8a6.entry.js.map

package/dist/ui-library/p-27e8e8a6.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["sixFileUploadCss","SixFileUpload","constructor","hostRef","this","isOver","hasError","compact","disabled","multiple","uploading","errorText","invalid","handleSlotChange","validType","trim","length","hasSlot","host","handleFiles","files","failure","emit","reason","file","acceptedTypesList","accept","replace","split","indexOf","type","maxFileSize","size","success","onChange","_a","fileInput","value","dragenterHandler","dragoverHandler","dragleaveHandler","dropHandler","componentWillLoad","componentDidLoad","forEach","eventName","addEventListener","preventDefaults","document","body","shadowRoot","disconnectedCallback","removeEventListener","e","preventDefault","stopPropagation","renderLabel","label","h","class","render","Container","errorMessages","Array","isArray","filter","text","key","slot","name","ref","el","map"],"sources":["src/components/six-file-upload/six-file-upload.scss?tag=six-file-upload&encapsulation=scoped","src/components/six-file-upload/six-file-upload.tsx"],"sourcesContent":["@import 'src/global/component';\n\n$over-color: var(--six-color-action-light-to-be-defined);\n$disabled-color: var(--six-color-inactive);\n$transition: 0.3s;\n$margin: 1rem;\n\n:host {\n  position: static;\n  display: block;\n}\n\n.six-file-upload {\n  six-card {\n    box-shadow: none;\n    padding: 0;\n    width: 100%;\n  }\n\n  &__label {\n    &--highlighted {\n      color: var(--six-color-action-600);\n    }\n  }\n\n  &__container {\n    &--full {\n      border: dashed 1px var(--six-color-web-rock-500);\n    }\n  }\n\n  &__drop-zone {\n    padding: 2rem 0;\n    display: flex;\n    justify-content: center;\n    width: 100%;\n    transition: background-color $transition;\n\n    &__spinner-container {\n      display: flex;\n      align-items: center;\n\n      six-spinner {\n        margin-right: var(--six-spacing-x-small);\n      }\n    }\n\n    &--compact {\n      padding: 0;\n    }\n  }\n\n  &__input {\n    cursor: pointer;\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    user-select: none;\n    height: 100%;\n    opacity: 0;\n    outline: none;\n  }\n\n  &--disabled &__drop-zone {\n    background-color: $disabled-color;\n    cursor: not-allowed;\n  }\n\n  &:not(.six-file-upload--disabled) &__drop-zone:hover,\n  &__drop-zone--hover {\n    background-color: $over-color;\n\n    &.six-file-upload__drop-zone--compact {\n      background-color: inherit;\n    }\n  }\n\n  &--disabled &__input {\n    cursor: not-allowed;\n  }\n\n  &__error-text {\n    font-size: var(--six-input-help-text-font-size-medium);\n  }\n}\n","import { Component, Element, Event, EventEmitter, h, Listen, Prop, State } from '@stencil/core';\nimport { hasSlot } from '../../utils/slot';\n\nexport interface SixFileUploadSuccessPayload {\n  files: FileList;\n}\n\nexport interface SixFileUploadFailurePayload {\n  reason: string;\n}\n\n/**\n * @since 2.0.0\n * @status experimental\n *\n * @slot error-text - Error text that is shown when the status is set to invalid. Alternatively, you can use the error-text prop.\n */\n@Component({\n  tag: 'six-file-upload',\n  styleUrl: 'six-file-upload.scss',\n  scoped: true,\n  shadow: false,\n})\nexport class SixFileUpload {\n  @Element() readonly host!: HTMLSixFileUploadElement;\n\n  private fileInput?: HTMLInputElement;\n\n  @State() isOver = false;\n  @State() hasError = false;\n\n  /** Set to true if file control should be small. */\n  @Prop() readonly compact: boolean = false;\n\n  /** Label of the drop area. */\n  @Prop() readonly label?: string;\n\n  /** Set when button is disabled. */\n  @Prop() readonly disabled = false;\n\n  /** Accepted MIME-Types. */\n  @Prop() readonly accept?: string;\n\n  /** More than one file allowed. */\n  @Prop() readonly multiple = false;\n\n  /** Allowed max file size in bytes. */\n  @Prop() readonly maxFileSize?: number;\n\n  /** Set to true to draw the control in a loading state. */\n  @Prop({ reflect: true }) uploading = false;\n\n  /** The error message shown, if `invalid` is set to true.  */\n  @Prop() errorText: string | string[] = '';\n\n  /** If this property is set to true and an error message is provided by `errorText`, the error message is displayed.  */\n  @Prop({ reflect: true }) invalid = false;\n\n  /** Triggers when a file is added. */\n  @Event({ eventName: 'six-file-upload-success' }) success!: EventEmitter<SixFileUploadSuccessPayload>;\n\n  /** Triggers when an uploaded file doesn't match MIME type or max file size. */\n  @Event({ eventName: 'six-file-upload-failure' }) failure!: EventEmitter<SixFileUploadFailurePayload>;\n\n  @Listen('dragenter', { capture: false })\n  dragenterHandler() {\n    if (!this.disabled) {\n      this.isOver = true;\n    }\n  }\n\n  @Listen('dragover', { capture: false })\n  dragoverHandler() {\n    if (!this.disabled) {\n      this.isOver = true;\n    }\n  }\n\n  @Listen('dragleave', { capture: false })\n  dragleaveHandler() {\n    if (!this.disabled) {\n      this.isOver = false;\n    }\n  }\n\n  @Listen('drop', { capture: false })\n  dropHandler() {\n    if (!this.disabled) {\n      this.isOver = false;\n    }\n  }\n\n  private handleSlotChange = () => {\n    let validType = false;\n\n    if (\n      this.errorText != null &&\n      ((typeof this.errorText == 'string' && this.errorText.trim().length > 0) ||\n        (typeof this.errorText == 'object' && this.errorText.length > 0))\n    ) {\n      validType = true;\n    }\n\n    this.hasError = validType || hasSlot(this.host, 'error-text');\n  };\n\n  private handleFiles = (files: FileList) => {\n    if (this.disabled || files.length === 0 || this.uploading) {\n      return;\n    }\n\n    if (!this.multiple && files.length > 1) {\n      return this.failure.emit({ reason: 'Only one file is allowed.' });\n    }\n\n    for (const file of files) {\n      if (file == null) {\n        return;\n      }\n\n      let acceptedTypesList: string[] = [];\n      if (this.accept != null) {\n        acceptedTypesList = this.accept.replace(/\\s/g, '').split(',');\n      }\n\n      if (acceptedTypesList.length > 0 && acceptedTypesList.indexOf(file.type) === -1) {\n        const reason = files.length > 1 ? 'One or more files have invalid MIME type.' : 'File has invalid MIME type.';\n        return this.failure.emit({ reason });\n      }\n\n      if (this.maxFileSize != null && file.size > this.maxFileSize) {\n        const reason = files.length > 1 ? 'One or more files are too big' : 'File is too big.';\n        return this.failure.emit({ reason });\n      }\n    }\n\n    this.success.emit({ files } as SixFileUploadSuccessPayload);\n  };\n\n  componentWillLoad() {\n    this.handleSlotChange();\n  }\n\n  componentDidLoad() {\n    ['dragenter', 'dragover', 'dragleave', 'drop'].forEach((eventName) => {\n      this.host.addEventListener(eventName, this.preventDefaults, false);\n      document.body.addEventListener(eventName, this.preventDefaults, false);\n    });\n    this.host.shadowRoot?.addEventListener('slotchange', this.handleSlotChange);\n  }\n\n  disconnectedCallback() {\n    ['dragenter', 'dragover', 'dragleave', 'drop'].forEach((eventName) => {\n      this.host.removeEventListener(eventName, this.preventDefaults, false);\n      document.body.removeEventListener(eventName, this.preventDefaults, false);\n    });\n    this.host.shadowRoot?.removeEventListener('slotchange', this.handleSlotChange);\n  }\n\n  private preventDefaults(e: Event) {\n    e.preventDefault();\n    e.stopPropagation();\n  }\n\n  private onChange = () => {\n    if (this.fileInput?.files != null) {\n      const files = this.fileInput.files;\n      this.handleFiles(files);\n      this.fileInput.value = '';\n    }\n  };\n\n  private renderLabel() {\n    return (\n      this.label ??\n      (this.compact ? (\n        'Upload'\n      ) : (\n        <span>\n          Drop files to upload, or <span class=\"six-file-upload__label--highlighted\">browse</span>\n        </span>\n      ))\n    );\n  }\n\n  render() {\n    const Container = this.compact ? 'six-button' : 'six-card';\n\n    const errorMessages = (Array.isArray(this.errorText) ? this.errorText : [this.errorText]).filter(\n      (text) => text != null && text.trim() !== ''\n    );\n\n    return (\n      <div\n        class={{\n          'six-file-upload': true,\n          'six-file-upload--disabled': this.disabled || this.uploading,\n        }}\n      >\n        <Container\n          disabled={this.disabled || this.uploading}\n          aria-invalid={this.invalid ? 'true' : 'false'}\n          class={{\n            'six-file-upload__container--compact': this.compact,\n            'six-file-upload__container--full': !this.compact,\n          }}\n        >\n          {this.compact && !this.uploading && <six-icon slot=\"prefix\">arrow_circle_up</six-icon>}\n          <div\n            class={{\n              'six-file-upload__drop-zone': true,\n              'six-file-upload__drop-zone--hover': this.isOver,\n              'six-file-upload__drop-zone--compact': this.compact,\n            }}\n          >\n            {this.uploading ? (\n              <span class=\"six-file-upload__drop-zone__spinner-container\">\n                <six-spinner /> Uploading...\n              </span>\n            ) : (\n              <div>\n                <span>{this.renderLabel()}</span>\n                <input\n                  class=\"six-file-upload__input\"\n                  type=\"file\"\n                  name=\"resume\"\n                  disabled={this.disabled}\n                  accept={this.accept}\n                  multiple={this.multiple}\n                  onChange={this.onChange}\n                  ref={(el) => (this.fileInput = el)}\n                />\n              </div>\n            )}\n          </div>\n        </Container>\n        <div aria-hidden={this.invalid ? 'false' : 'true'}>\n          <slot name=\"error-text\">\n            {errorMessages.map((text) => (\n              <six-error>\n                <div class=\"six-file-upload__error-text\">{text}</div>\n              </six-error>\n            ))}\n          </slot>\n        </div>\n      </div>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/ui-library/p-36a316e0.entry.js

@@ -0,0 +1,2 @@
+import{r,h as e}from"./p-D0Go1Zjj.js";const o=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}:host{--height:16px;--track-color:var(--six-progress-track-color);--indicator-color:var(--six-progress-indicator-color);--label-color:var(--six-progress-label-color);display:block}.progress-bar{position:relative;background-color:var(--track-color);height:var(--height);border-radius:var(--sl-border-radius-pill);overflow:hidden}.progress-bar__indicator{height:100%;font-family:var(--six-font-sans);font-size:12px;font-weight:var(--six-font-weight-normal);background-color:var(--indicator-color);color:var(--label-color);text-align:center;line-height:var(--height);white-space:nowrap;overflow:hidden;transition:400ms width, 400ms background-color;user-select:none}.progress-bar--indeterminate .progress-bar__indicator{position:absolute;animation:indeterminate 2.5s infinite cubic-bezier(0.37, 0, 0.63, 1)}@keyframes indeterminate{0%{left:-50%;width:50%}75%,100%{left:100%;width:50%}}";const a=class{constructor(e){r(this,e);this.percentage=0;this.indeterminate=false}render(){return e("div",{key:"e11c3e9f83321a55170e04e84ab63c2e8b9f12a7",part:"base",class:{"progress-bar":true,"progress-bar--indeterminate":this.indeterminate},role:"progressbar","aria-valuemin":"0","aria-valuemax":"100","aria-valuenow":this.indeterminate?null:this.percentage},e("div",{key:"9c8b4a3f5ada54163272cbd7e8cf9e7cb90dc39b",part:"indicator",class:"progress-bar__indicator",style:{width:`${this.percentage}%`}},!this.indeterminate&&e("span",{key:"16be9dda6192ecf33efb192b23694cc006ceb4fd",part:"label",class:"progress-bar__label"},e("slot",{key:"1e102597d1ec71a54fecb87f336aa711fddd8558"}))))}};a.style=o;export{a as six_progress_bar};
+//# sourceMappingURL=p-36a316e0.entry.js.map

package/dist/ui-library/p-36a316e0.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["sixProgressBarCss","SixProgressBar","constructor","hostRef","this","percentage","indeterminate","render","h","key","part","class","role","style","width"],"sources":["src/components/six-progress-bar/six-progress-bar.scss?tag=six-progress-bar&encapsulation=shadow","src/components/six-progress-bar/six-progress-bar.tsx"],"sourcesContent":["@import 'src/global/component';\n\n/**\n * @prop --height: The progress bar's height.\n * @prop --track-color: The track color.\n * @prop --indicator-color: The indicator color.\n * @prop --label-color: The label color.\n */\n:host {\n  --height: 16px;\n  --track-color: var(--six-progress-track-color);\n  --indicator-color: var(--six-progress-indicator-color);\n  --label-color: var(--six-progress-label-color);\n\n  display: block;\n}\n\n.progress-bar {\n  position: relative;\n  background-color: var(--track-color);\n  height: var(--height);\n  border-radius: var(--sl-border-radius-pill);\n  overflow: hidden;\n}\n\n.progress-bar__indicator {\n  height: 100%;\n  font-family: var(--six-font-sans);\n  font-size: 12px;\n  font-weight: var(--six-font-weight-normal);\n  background-color: var(--indicator-color);\n  color: var(--label-color);\n  text-align: center;\n  line-height: var(--height);\n  white-space: nowrap;\n  overflow: hidden;\n  transition:\n    400ms width,\n    400ms background-color;\n  user-select: none;\n}\n\n// Indeterminate\n.progress-bar--indeterminate .progress-bar__indicator {\n  position: absolute;\n  animation: indeterminate 2.5s infinite cubic-bezier(0.37, 0, 0.63, 1);\n}\n\n@keyframes indeterminate {\n  0% {\n    left: -50%;\n    width: 50%;\n  }\n  75%,\n  100% {\n    left: 100%;\n    width: 50%;\n  }\n}\n","import { Component, h, Prop } from '@stencil/core';\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot - A label to show inside the indicator.\n *\n * @part base - The component's base wrapper.\n * @part indicator - The progress bar indicator.\n * @part label - The progress bar label.\n */\n\n@Component({\n  tag: 'six-progress-bar',\n  styleUrl: 'six-progress-bar.scss',\n  shadow: true,\n})\nexport class SixProgressBar {\n  /** The progress bar's percentage, 0 to 100. */\n  @Prop() percentage = 0;\n\n  /** When true, percentage is ignored, the label is hidden, and the progress bar is drawn in an indeterminate state. */\n  @Prop() indeterminate = false;\n\n  render() {\n    return (\n      <div\n        part=\"base\"\n        class={{\n          'progress-bar': true,\n          'progress-bar--indeterminate': this.indeterminate,\n        }}\n        role=\"progressbar\"\n        aria-valuemin=\"0\"\n        aria-valuemax=\"100\"\n        aria-valuenow={this.indeterminate ? null : this.percentage}\n      >\n        <div\n          part=\"indicator\"\n          class=\"progress-bar__indicator\"\n          style={{\n            width: `${this.percentage}%`,\n          }}\n        >\n          {!this.indeterminate && (\n            <span part=\"label\" class=\"progress-bar__label\">\n              <slot />\n            </span>\n          )}\n        </div>\n      </div>\n    );\n  }\n}\n"],"mappings":"sCAAA,MAAMA,EAAoB,ylC,MCoBbC,EAAc,MAL3B,WAAAC,CAAAC,G,UAOUC,KAAUC,WAAG,EAGbD,KAAaE,cAAG,KA+BzB,CA7BC,MAAAC,GACE,OACEC,EACE,OAAAC,IAAA,2CAAAC,KAAK,OACLC,MAAO,CACL,eAAgB,KAChB,8BAA+BP,KAAKE,eAEtCM,KAAK,cAAa,gBACJ,IACA,sBAAK,gBACJR,KAAKE,cAAgB,KAAOF,KAAKC,YAEhDG,EACE,OAAAC,IAAA,2CAAAC,KAAK,YACLC,MAAM,0BACNE,MAAO,CACLC,MAAO,GAAGV,KAAKC,iBAGfD,KAAKE,eACLE,EAAM,QAAAC,IAAA,2CAAAC,KAAK,QAAQC,MAAM,uBACvBH,EAAA,QAAAC,IAAA,+C","ignoreList":[]}

package/dist/ui-library/p-4a4a0751.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as t,H as s,g as o}from"./p-D0Go1Zjj.js";import{g as r}from"./p-j3oIB5oT.js";const i=":host{height:100%;display:flex;align-items:center;box-sizing:border-box;padding:0 var(--six-spacing-large);border-bottom:solid var(--six-header-border-height) transparent;border-top:solid var(--six-header-border-height) transparent}:host(.six-header-dropdown-item--active){border-bottom:solid var(--six-header-border-height) var(--six-header-border-color-open)}";const d=class{constructor(t){e(this,t);this.filter=false;this.filterPlaceholder="Filter...";this.active=false}connectedCallback(){this.updateDropdownDistance()}componentDidLoad(){this.updateDropdownDistance()}render(){return t(s,{key:"f2d143e5da9526b536b6e4d663d7f854ee1a3bf2",class:{"six-header-dropdown-item--active":this.active}},t("six-dropdown",{key:"ad3420fd33db605a06c62a4e7fdca7ecbeb6e3c2",ref:e=>this.dropdownElement=e,hoist:true,skidding:0,placement:"bottom-end","onSix-dropdown-show":()=>this.active=true,"onSix-dropdown-hide":()=>this.active=false,filter:this.filter,filterPlaceholder:this.filterPlaceholder},t("slot",{key:"0bf9ab3feeaa7dbbaf48fb26b18919d0d5e4e936",slot:"trigger",name:"trigger"}),t("slot",{key:"25e063e170bac1f46a805cb2b4b49977212b560a"})))}updateDropdownDistance(){const e=r(this.host,"trigger");const t=this.host.closest("six-header");if(e!=null&&t!=null&&this.dropdownElement!=null&&this.host!=null){const s=this.host.getBoundingClientRect().right;const o=e.getBoundingClientRect().right;const r=t.getBoundingClientRect().bottom;const i=e.getBoundingClientRect().bottom;this.dropdownElement.distance=r-i+3;this.dropdownElement.skidding=s-o}}get host(){return o(this)}};d.style=i;export{d as six_header_dropdown_item};
+//# sourceMappingURL=p-4a4a0751.entry.js.map

package/dist/ui-library/p-4a4a0751.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["sixHeaderDropdownItemCss","SixHeaderDropdownItem","constructor","hostRef","this","filter","filterPlaceholder","active","connectedCallback","updateDropdownDistance","componentDidLoad","render","h","Host","key","class","ref","el","dropdownElement","hoist","skidding","placement","slot","name","trigger","getSlot","host","header","closest","hostRight","getBoundingClientRect","right","triggerRight","headerBottom","bottom","triggerBottom","distance"],"sources":["src/components/six-header-dropdown-item/six-header-dropdown-item.scss?tag=six-header-dropdown-item&encapsulation=shadow","src/components/six-header-dropdown-item/six-header-dropdown-item.tsx"],"sourcesContent":[":host {\n  height: 100%;\n  display: flex;\n  align-items: center;\n  box-sizing: border-box;\n  padding: 0 var(--six-spacing-large);\n  border-bottom: solid var(--six-header-border-height) transparent;\n  border-top: solid var(--six-header-border-height) transparent;\n}\n\n:host(.six-header-dropdown-item--active) {\n  border-bottom: solid var(--six-header-border-height) var(--six-header-border-color-open);\n}\n","import { Component, Element, h, Host, Prop, State } from '@stencil/core';\nimport { getSlot } from '../../utils/slot';\n\n/**\n * @since 4.2.7\n * @status stable\n */\n\n@Component({\n  tag: 'six-header-dropdown-item',\n  styleUrl: 'six-header-dropdown-item.scss',\n  shadow: true,\n})\nexport class SixHeaderDropdownItem {\n  /**\n   * Set to true to allow auto filtering for entries in the dropdown.\n   * With this flag the dropdown will automatically filter itsel.\n   * If you need to coordinate the shown elements yourself,\n   * e.g. because you need to call an endpoint use asyncFilter instead\n   */\n  @Prop() filter = false;\n\n  /** The filter's placeholder text. */\n  @Prop() filterPlaceholder = 'Filter...';\n\n  @State() active = false;\n\n  @Element() host!: HTMLSixHeaderDropdownItemElement;\n\n  private dropdownElement?: HTMLSixDropdownElement;\n\n  connectedCallback() {\n    this.updateDropdownDistance();\n  }\n\n  componentDidLoad() {\n    this.updateDropdownDistance();\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          'six-header-dropdown-item--active': this.active,\n        }}\n      >\n        <six-dropdown\n          ref={(el) => (this.dropdownElement = el)}\n          hoist\n          skidding={0}\n          placement=\"bottom-end\"\n          onSix-dropdown-show={() => (this.active = true)}\n          onSix-dropdown-hide={() => (this.active = false)}\n          filter={this.filter}\n          filterPlaceholder={this.filterPlaceholder}\n        >\n          <slot slot=\"trigger\" name=\"trigger\" />\n          <slot />\n        </six-dropdown>\n      </Host>\n    );\n  }\n\n  private updateDropdownDistance() {\n    const trigger = getSlot(this.host, 'trigger');\n    const header = this.host.closest('six-header');\n    if (trigger != null && header != null && this.dropdownElement != null && this.host != null) {\n      const hostRight = this.host.getBoundingClientRect().right;\n      const triggerRight = trigger.getBoundingClientRect().right;\n      const headerBottom = header.getBoundingClientRect().bottom;\n      const triggerBottom = trigger.getBoundingClientRect().bottom;\n      this.dropdownElement.distance = headerBottom - triggerBottom + 3;\n      this.dropdownElement.skidding = hostRight - triggerRight;\n    }\n  }\n}\n"],"mappings":"6FAAA,MAAMA,EAA2B,4W,MCapBC,EAAqB,MALlC,WAAAC,CAAAC,G,UAYUC,KAAMC,OAAG,MAGTD,KAAiBE,kBAAG,YAEnBF,KAAMG,OAAG,KAkDnB,CA5CC,iBAAAC,GACEJ,KAAKK,wB,CAGP,gBAAAC,GACEN,KAAKK,wB,CAGP,MAAAE,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACL,mCAAoCX,KAAKG,SAG3CK,EACE,gBAAAE,IAAA,2CAAAE,IAAMC,GAAQb,KAAKc,gBAAkBD,EACrCE,MACA,KAAAC,SAAU,EACVC,UAAU,aACW,0BAAOjB,KAAKG,OAAS,KACrB,0BAAOH,KAAKG,OAAS,MAC1CF,OAAQD,KAAKC,OACbC,kBAAmBF,KAAKE,mBAExBM,EAAA,QAAAE,IAAA,2CAAMQ,KAAK,UAAUC,KAAK,YAC1BX,EAAQ,QAAAE,IAAA,8C,CAMR,sBAAAL,GACN,MAAMe,EAAUC,EAAQrB,KAAKsB,KAAM,WACnC,MAAMC,EAASvB,KAAKsB,KAAKE,QAAQ,cACjC,GAAIJ,GAAW,MAAQG,GAAU,MAAQvB,KAAKc,iBAAmB,MAAQd,KAAKsB,MAAQ,KAAM,CAC1F,MAAMG,EAAYzB,KAAKsB,KAAKI,wBAAwBC,MACpD,MAAMC,EAAeR,EAAQM,wBAAwBC,MACrD,MAAME,EAAeN,EAAOG,wBAAwBI,OACpD,MAAMC,EAAgBX,EAAQM,wBAAwBI,OACtD9B,KAAKc,gBAAgBkB,SAAWH,EAAeE,EAAgB,EAC/D/B,KAAKc,gBAAgBE,SAAWS,EAAYG,C","ignoreList":[]}

package/dist/ui-library/p-537a8953.entry.js

@@ -0,0 +1,2 @@
+import{r as t,h as i}from"./p-D0Go1Zjj.js";import{f as o}from"./p-Vw_F19Fv.js";const n=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}:host{display:inline-block}.icon-button{flex:0 0 auto;display:flex;align-items:center;background:none;border:none;border-radius:var(--six-border-radius-medium);font-size:inherit;text-decoration:none;color:var(--six-input-icon-color);padding:var(--six-spacing-x-small);cursor:pointer;transition:var(--six-transition-medium) color;-webkit-appearance:none}.icon-button:hover:not(.icon-button--disabled){color:var(--six-input-icon-color-hover)}.icon-button:active:not(.icon-button--disabled){color:var(--six-input-icon-color)}.icon-button:focus{outline:none}.icon-button:focus-visible{outline:var(--six-focus-ring);outline-offset:var(--six-focus-ring-offset)}.icon-button--disabled{opacity:0.5;pointer-events:none}.icon-button-wrapper--disabled{cursor:not-allowed}.icon-button ::slotted(six-badge){position:absolute;top:0;right:0;pointer-events:none}.icon-button six-icon[size=xLarge]+::slotted(six-badge){transform:translateY(40%) translateX(-35%)}.icon-button six-icon[size=large]+::slotted(six-badge){transform:translateY(20%) translateX(-20%)}.icon-button six-icon[size=medium]+::slotted(six-badge){transform:translateY(10%) translateX(50%)}.icon-button six-icon[size=xSmall]+::slotted(six-badge){transform:translateY(-25%) translateX(25%)}";const e=class{constructor(i){t(this,i);this.size="medium";this.disabled=false;this.handleClickEvent=t=>{if(this.disabled){t.preventDefault();t.stopPropagation()}}}componentDidLoad(){if(this.button!=null){o.observe(this.button)}}disconnectedCallback(){if(this.button!=null){o.unobserve(this.button)}}render(){const t=this.href!=null;const o=!t;const n=t?"a":"button";const e=this.html&&i("span",{key:"f351c6ac9b9c3a35d1c7cdd55d3e919f070244d0",innerHTML:this.html});return i("div",{key:"3828510ea2e5a3318c4f9dc1f40f0f13ec8f5120",onClick:this.handleClickEvent,class:{"icon-button-wrapper--disabled":this.disabled}},i(n,{key:"05ed661d1f708125d5353caefe236cd7bf8a427e",ref:t=>this.button=t,part:"base",disabled:o?this.disabled:undefined,tabindex:this.disabled?"-1":undefined,class:{"icon-button":true,"icon-button--disabled":this.disabled},type:o?"button":undefined,"aria-label":this.label,href:t?this.href:undefined,target:t&&this.target!=null?this.target:undefined,download:t&&this.download!=null?this.download:undefined,rel:t&&this.target!=null?"noreferrer noopener":undefined},i("six-icon",{key:"ba8d525d4ced58c6c93dff964738f34b3a36f067","aria-hidden":"true",size:this.size},this.name),i("slot",{key:"8f1c47548463c556045359dc3bfaa51d14b1a6ad"}),e))}};e.style=n;export{e as six_icon_button};
+//# sourceMappingURL=p-537a8953.entry.js.map

package/dist/ui-library/p-537a8953.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["sixIconButtonCss","SixIconButton","constructor","hostRef","this","size","disabled","handleClickEvent","event","preventDefault","stopPropagation","componentDidLoad","button","focusVisible","observe","disconnectedCallback","unobserve","render","isLink","href","isButton","Button","html","h","key","innerHTML","onClick","class","ref","el","part","undefined","tabindex","type","label","target","download","rel","name"],"sources":["src/components/six-icon-button/six-icon-button.scss?tag=six-icon-button&encapsulation=shadow","src/components/six-icon-button/six-icon-button.tsx"],"sourcesContent":["@import 'src/global/component';\n\n:host {\n  display: inline-block;\n}\n\n.icon-button {\n  flex: 0 0 auto;\n  display: flex;\n  align-items: center;\n  background: none;\n  border: none;\n  border-radius: var(--six-border-radius-medium);\n  font-size: inherit;\n  text-decoration: none;\n  color: var(--six-input-icon-color);\n  padding: var(--six-spacing-x-small);\n  cursor: pointer;\n  transition: var(--six-transition-medium) color;\n  -webkit-appearance: none;\n\n  &:hover:not(.icon-button--disabled) {\n    color: var(--six-input-icon-color-hover);\n  }\n\n  &:active:not(.icon-button--disabled) {\n    color: var(--six-input-icon-color);\n  }\n\n  &:focus {\n    outline: none;\n  }\n\n  &:focus-visible {\n    outline: var(--six-focus-ring);\n    outline-offset: var(--six-focus-ring-offset);\n  }\n}\n\n.icon-button--disabled {\n  opacity: 0.5;\n  pointer-events: none;\n}\n\n.icon-button-wrapper--disabled {\n  cursor: not-allowed;\n}\n\n.icon-button ::slotted(six-badge) {\n  position: absolute;\n  top: 0;\n  right: 0;\n  pointer-events: none;\n}\n\n.icon-button six-icon[size='xLarge'] + ::slotted(six-badge) {\n  transform: translateY(40%) translateX(-35%);\n}\n\n.icon-button six-icon[size='large'] + ::slotted(six-badge) {\n  transform: translateY(20%) translateX(-20%);\n}\n\n// TODO: tx4u9 should be adjusted for all sizes after design team\n.icon-button six-icon[size='medium'] + ::slotted(six-badge) {\n  transform: translateY(10%) translateX(50%);\n}\n\n.icon-button six-icon[size='small'] + ::slotted(six-badge) {\n  //  no translation necessary\n}\n\n.icon-button six-icon[size='xSmall'] + ::slotted(six-badge) {\n  transform: translateY(-25%) translateX(25%);\n}\n","import { Component, h, Prop } from '@stencil/core';\nimport { focusVisible } from '../../utils/focus-visible';\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @part base - The component's base wrapper.\n */\n\n@Component({\n  tag: 'six-icon-button',\n  styleUrl: 'six-icon-button.scss',\n  shadow: true,\n})\nexport class SixIconButton {\n  private button?: HTMLButtonElement | HTMLAnchorElement;\n\n  /** The name of the icon to draw. */\n  @Prop({ reflect: true }) name?: string;\n\n  /** The icon's size. */\n  @Prop({ reflect: true }) size: 'xSmall' | 'small' | 'medium' | 'large' | 'xLarge' | 'xxLarge' | 'xxxLarge' = 'medium';\n\n  /**\n   * A description that gets read by screen readers and other assistive devices. For optimal accessibility, you should\n   * always include a label that describes what the icon button does.\n   */\n  @Prop({ reflect: true }) label?: string;\n\n  /** Set to true to disable the button. */\n  @Prop({ reflect: true }) disabled = false;\n\n  /** HTML symbol code or entity. */\n  @Prop({ reflect: true }) html?: string;\n\n  /** When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`. */\n  @Prop() href?: string;\n\n  /** Tells the browser where to open the link. Only used when `href` is set. */\n  @Prop() target?: '_blank' | '_parent' | '_self' | '_top';\n\n  /** Tells the browser to download the linked file as this filename. Only used when `href` is set. */\n  @Prop() download?: string;\n\n  componentDidLoad() {\n    if (this.button != null) {\n      focusVisible.observe(this.button);\n    }\n  }\n\n  disconnectedCallback() {\n    if (this.button != null) {\n      focusVisible.unobserve(this.button);\n    }\n  }\n\n  render() {\n    const isLink = this.href != null;\n    const isButton = !isLink;\n    const Button = isLink ? 'a' : 'button';\n    const html = this.html && <span innerHTML={this.html} />;\n\n    return (\n      <div onClick={this.handleClickEvent} class={{ 'icon-button-wrapper--disabled': this.disabled }}>\n        <Button\n          ref={(el) => (this.button = el)}\n          part=\"base\"\n          disabled={isButton ? this.disabled : undefined}\n          tabindex={this.disabled ? '-1' : undefined}\n          class={{\n            'icon-button': true,\n            'icon-button--disabled': this.disabled,\n          }}\n          type={isButton ? 'button' : undefined}\n          aria-label={this.label}\n          href={isLink ? this.href : undefined}\n          target={isLink && this.target != null ? this.target : undefined}\n          download={isLink && this.download != null ? this.download : undefined}\n          rel={isLink && this.target != null ? 'noreferrer noopener' : undefined}\n        >\n          <six-icon aria-hidden=\"true\" size={this.size}>\n            {this.name}\n          </six-icon>\n          <slot />\n          {html}\n        </Button>\n      </div>\n    );\n  }\n\n  private handleClickEvent = (event: Event) => {\n    if (this.disabled) {\n      event.preventDefault();\n      event.stopPropagation();\n    }\n  };\n}\n"],"mappings":"+EAAA,MAAMA,EAAmB,+7C,MCiBZC,EAAa,MAL1B,WAAAC,CAAAC,G,UAY2BC,KAAIC,KAAgF,SASpFD,KAAQE,SAAG,MA4D5BF,KAAAG,iBAAoBC,IAC1B,GAAIJ,KAAKE,SAAU,CACjBE,EAAMC,iBACND,EAAME,iB,EAGX,CApDC,gBAAAC,GACE,GAAIP,KAAKQ,QAAU,KAAM,CACvBC,EAAaC,QAAQV,KAAKQ,O,EAI9B,oBAAAG,GACE,GAAIX,KAAKQ,QAAU,KAAM,CACvBC,EAAaG,UAAUZ,KAAKQ,O,EAIhC,MAAAK,GACE,MAAMC,EAASd,KAAKe,MAAQ,KAC5B,MAAMC,GAAYF,EAClB,MAAMG,EAASH,EAAS,IAAM,SAC9B,MAAMI,EAAOlB,KAAKkB,MAAQC,EAAM,QAAAC,IAAA,2CAAAC,UAAWrB,KAAKkB,OAEhD,OACEC,EAAK,OAAAC,IAAA,2CAAAE,QAAStB,KAAKG,iBAAkBoB,MAAO,CAAE,gCAAiCvB,KAAKE,WAClFiB,EAACF,EAAM,CAAAG,IAAA,2CACLI,IAAMC,GAAQzB,KAAKQ,OAASiB,EAC5BC,KAAK,OACLxB,SAAUc,EAAWhB,KAAKE,SAAWyB,UACrCC,SAAU5B,KAAKE,SAAW,KAAOyB,UACjCJ,MAAO,CACL,cAAe,KACf,wBAAyBvB,KAAKE,UAEhC2B,KAAMb,EAAW,SAAWW,UAAS,aACzB3B,KAAK8B,MACjBf,KAAMD,EAASd,KAAKe,KAAOY,UAC3BI,OAAQjB,GAAUd,KAAK+B,QAAU,KAAO/B,KAAK+B,OAASJ,UACtDK,SAAUlB,GAAUd,KAAKgC,UAAY,KAAOhC,KAAKgC,SAAWL,UAC5DM,IAAKnB,GAAUd,KAAK+B,QAAU,KAAO,sBAAwBJ,WAE7DR,EAAsB,YAAAC,IAAA,gEAAOnB,KAAMD,KAAKC,MACrCD,KAAKkC,MAERf,EAAQ,QAAAC,IAAA,6CACPF,G","ignoreList":[]}

package/dist/ui-library/p-55c15301.entry.js

@@ -0,0 +1,2 @@
+import{r as s,c as i,h as e}from"./p-D0Go1Zjj.js";import{D as t,d as h}from"./p-ltzGzaAu.js";import{E as a}from"./p-C4h4qpGl.js";const o=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}:host{display:block}.search-box{z-index:var(--six-z-index-search-field)}.search-box__icon{cursor:pointer}";const c=class{constructor(e){s(this,e);this.searchFieldChange=i(this,"six-search-field-change");this.debounce=t;this.disabled=false;this.value="";this.clearable=false;this.eventListeners=new a;this.handleInputChange=()=>{if(this.inputElement!=null){this.searchFieldChange.emit({value:this.inputElement.value})}}}handleValueChange(){if(this.inputElement!=null){this.inputElement.value=this.value}}componentDidLoad(){if(this.inputElement==null)return;this.eventListeners.add(this.inputElement,"six-input-input",h(this.handleInputChange,this.debounce));this.eventListeners.add(this.inputElement,"keydown",(s=>{const i=s;if(i.key==="Enter"){this.handleInputChange()}}))}disconnectedCallback(){this.eventListeners.removeAll()}render(){return e("div",{key:"424505c56697ecef9eff6e897ec823d2a80149e3",class:"search-box"},e("six-input",{key:"040876412a76d0128c9749518f3c075d505aef9c",ref:s=>this.inputElement=s,placeholder:this.placeholder,value:this.value,disabled:this.disabled,clearable:this.clearable},e("six-icon",{key:"e87d00186875991272cbfdb17a18c31574ed14c4",class:"search-box__icon",slot:"prefix",size:"small",onClick:this.handleInputChange},"search")),e("slot",{key:"f01f14307dcbf95a8401ab3ed7c59ecd3abc0cef"}))}static get watchers(){return{value:["handleValueChange"]}}};c.style=o;export{c as six_search_field};
+//# sourceMappingURL=p-55c15301.entry.js.map

package/dist/ui-library/p-55c15301.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["sixSearchFieldCss","SixSearchField","constructor","hostRef","this","debounce","DEFAULT_DEBOUNCE_FAST","disabled","value","clearable","eventListeners","EventListeners","handleInputChange","inputElement","searchFieldChange","emit","handleValueChange","componentDidLoad","add","event","keyboardEvent","key","disconnectedCallback","removeAll","render","h","class","ref","el","placeholder","slot","size","onClick"],"sources":["src/components/six-search-field/six-search-field.scss?tag=six-search-field&encapsulation=shadow","src/components/six-search-field/six-search-field.tsx"],"sourcesContent":["@import 'src/global/component';\n\n:host {\n  display: block;\n}\n\n.search-box {\n  z-index: var(--six-z-index-search-field);\n\n  &__icon {\n    cursor: pointer;\n  }\n}\n","import { Component, Event, EventEmitter, h, Prop, Watch } from '@stencil/core';\nimport { debounce, DEFAULT_DEBOUNCE_FAST } from '../../utils/execution-control';\nimport { EventListeners } from '../../utils/event-listeners';\n\nexport interface SixSearchFieldChangePayload {\n  value: string;\n}\n\n/**\n * @since 1.0\n * @status stable\n *\n * @slot - Used to define the results below the search component.\n */\n\n@Component({\n  tag: 'six-search-field',\n  styleUrl: 'six-search-field.scss',\n  shadow: true,\n})\nexport class SixSearchField {\n  /** The input's placeholder text. */\n  @Prop() placeholder?: string;\n\n  /** Debounce time in milliseconds, default is 300 ms */\n  @Prop({ reflect: true }) debounce = DEFAULT_DEBOUNCE_FAST;\n\n  /** Set to true to disable the input. */\n  @Prop({ reflect: true }) disabled = false;\n\n  /** The input's value attribute. */\n  @Prop({ reflect: true }) value = '';\n\n  /** Set to true to add a clear button when the input is populated. */\n  @Prop() clearable = false;\n\n  /** Emitted when a search is triggered */\n  @Event({ eventName: 'six-search-field-change' }) searchFieldChange!: EventEmitter<SixSearchFieldChangePayload>;\n\n  private inputElement?: HTMLSixInputElement;\n\n  private eventListeners = new EventListeners();\n\n  private handleInputChange = () => {\n    if (this.inputElement != null) {\n      this.searchFieldChange.emit({ value: this.inputElement.value });\n    }\n  };\n\n  @Watch('value')\n  handleValueChange() {\n    if (this.inputElement != null) {\n      this.inputElement.value = this.value;\n    }\n  }\n\n  componentDidLoad() {\n    if (this.inputElement == null) return;\n\n    this.eventListeners.add(this.inputElement, 'six-input-input', debounce(this.handleInputChange, this.debounce));\n    this.eventListeners.add(this.inputElement, 'keydown', (event: Event) => {\n      const keyboardEvent = event as KeyboardEvent;\n      if (keyboardEvent.key === 'Enter') {\n        // emit immediately\n        this.handleInputChange();\n      }\n    });\n  }\n\n  disconnectedCallback() {\n    this.eventListeners.removeAll();\n  }\n\n  render() {\n    return (\n      <div class=\"search-box\">\n        <six-input\n          ref={(el) => (this.inputElement = el)}\n          placeholder={this.placeholder}\n          value={this.value}\n          disabled={this.disabled}\n          clearable={this.clearable}\n        >\n          <six-icon class=\"search-box__icon\" slot=\"prefix\" size=\"small\" onClick={this.handleInputChange}>\n            search\n          </six-icon>\n        </six-input>\n        <slot />\n      </div>\n    );\n  }\n}\n"],"mappings":"iIAAA,MAAMA,EAAoB,gV,MCoBbC,EAAc,MAL3B,WAAAC,CAAAC,G,mEAU2BC,KAAQC,SAAGC,EAGXF,KAAQG,SAAG,MAGXH,KAAKI,MAAG,GAGzBJ,KAASK,UAAG,MAOZL,KAAAM,eAAiB,IAAIC,EAErBP,KAAiBQ,kBAAG,KAC1B,GAAIR,KAAKS,cAAgB,KAAM,CAC7BT,KAAKU,kBAAkBC,KAAK,CAAEP,MAAOJ,KAAKS,aAAaL,O,EA8C5D,CAzCC,iBAAAQ,GACE,GAAIZ,KAAKS,cAAgB,KAAM,CAC7BT,KAAKS,aAAaL,MAAQJ,KAAKI,K,EAInC,gBAAAS,GACE,GAAIb,KAAKS,cAAgB,KAAM,OAE/BT,KAAKM,eAAeQ,IAAId,KAAKS,aAAc,kBAAmBR,EAASD,KAAKQ,kBAAmBR,KAAKC,WACpGD,KAAKM,eAAeQ,IAAId,KAAKS,aAAc,WAAYM,IACrD,MAAMC,EAAgBD,EACtB,GAAIC,EAAcC,MAAQ,QAAS,CAEjCjB,KAAKQ,mB,KAKX,oBAAAU,GACElB,KAAKM,eAAea,W,CAGtB,MAAAC,GACE,OACEC,EAAA,OAAAJ,IAAA,2CAAKK,MAAM,cACTD,EAAA,aAAAJ,IAAA,2CACEM,IAAMC,GAAQxB,KAAKS,aAAee,EAClCC,YAAazB,KAAKyB,YAClBrB,MAAOJ,KAAKI,MACZD,SAAUH,KAAKG,SACfE,UAAWL,KAAKK,WAEhBgB,EAAA,YAAAJ,IAAA,2CAAUK,MAAM,mBAAmBI,KAAK,SAASC,KAAK,QAAQC,QAAS5B,KAAKQ,mBAAiB,WAI/Fa,EAAQ,QAAAJ,IAAA,6C","ignoreList":[]}