@six-group/ui-library 0.0.0-insider.fa8b667 → 0.0.0-insider.fade3a2

package/dist/ui-library/p-ab8f9503.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["sixSidebarItemGroupCss","SixSidebarItemGroupStyle0","SixSidebarItemGroup","this","provideSlot","name","summaryIconHasContent","h","slot","onSlotchange","_a","host","shadowRoot","querySelector","assignedNodes","length","connectedCallback","handleSlotChange","bind","componentWillLoad","hasItems","hasSlot","isSubgroup","parentElement","closest","renderAsHref","href","render","element","class","inline","open","summaryIcon","hasContent","icon"],"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-x-large);\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}\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  overflow-wrap: anywhere;\n}\n\n.six-sidebar-details__header-icon {\n  margin-right: 1em;\n}\n\n.six-sidebar-details__link {\n  text-decoration: none;\n  display: block;\n  color: inherit;\n  width: 100%;\n}\n","import { Component, Element, h, Prop, State } from '@stencil/core';\nimport { hasSlot } from '../../utils/slot';\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 }) 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 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        hasContent={this.hasItems}\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,uoBAC/B,MAAAC,EAAeD,E,MCcFE,EAAmB,M,yBAgDtBC,KAAAC,YAAeC,IACrB,GAAIF,KAAKG,sBAAuB,CAC9B,OACEC,EAAA,OAAKC,KAAMH,GACTE,EAAA,QAAMF,KAAMA,I,CAKlB,OACEE,EAAA,QACEF,KAAMA,EACNI,aAAc,K,MACZ,MAAMD,GAAOE,EAAAP,KAAKQ,KAAKC,cAAU,MAAAF,SAAA,SAAAA,EAAEG,cAA+B,cAAcR,OAChF,GAAIG,GAAQ,KAAM,CAChBL,KAAKG,sBAAwBE,EAAKM,gBAAgBC,OAAS,C,IAGzD,E,cA/DQ,M,UAGL,G,UAGA,G,WAGkB,G,UAGD,M,sDAKC,M,oBAQjC,iBAAAC,GACEb,KAAKc,iBAAmBd,KAAKc,iBAAiBC,KAAKf,K,CAGrD,iBAAAgB,GACEhB,KAAKc,kB,CAGC,gBAAAA,GACNd,KAAKiB,SAAWC,EAAQlB,KAAKQ,K,CAGvB,UAAAW,G,MACN,QAAOZ,EAAAP,KAAKQ,KAAKY,iBAAa,MAAAb,SAAA,SAAAA,EAAEc,QAAQ,4BAA6B,I,CAG/D,YAAAC,GACN,OAAOtB,KAAKuB,MAAQ,OAASvB,KAAKiB,Q,CAyBpC,MAAAO,GACE,MAAMC,EACJrB,EAAA,eACEsB,MAAO,CACL,yBAA0B,KAC1B,qCAAsC1B,KAAKiB,SAC3C,mCAAoCjB,KAAKmB,cAE3CQ,OAAQ,KACRC,KAAM5B,KAAK4B,KAAI,eACD5B,KAAK6B,YACnBC,WAAY9B,KAAKiB,UAEjBb,EAAA,OAAKC,KAAK,WACRD,EAAA,OAAKsB,MAAM,+BACR1B,KAAK+B,MAAQ3B,EAAA,YAAUsB,MAAM,oCAAoC1B,KAAK+B,MACtE/B,KAAKE,OAGTF,KAAKC,YAAY,gBAClBG,EAAA,cAIJ,GAAIJ,KAAKsB,eAAgB,CACvB,OACElB,EAAA,KAAGsB,MAAM,4BAA4BH,KAAMvB,KAAKuB,MAC7CE,E,KAGA,CACL,OAAOA,C"}

package/dist/ui-library/p-acc487ec.entry.js

@@ -0,0 +1,2 @@
+import{r as i,c as s,h as t}from"./p-f93d8a4e.js";import{s as e}from"./p-8227aaed.js";const o=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}:host{display:block;height:100%}.sidebar__container{height:100%;overflow:auto}.sidebar__container.sidebar--open{border-right:1px solid var(--six-color-web-rock-300)}.sidebar__container:not(.sidebar--visible){position:absolute;width:1px;height:1px;clip:rect(0 0 0 0);clip-path:inset(50%);overflow:hidden;pointer-events:none;visibility:hidden}.sidebar--left{color:var(--six-sidebar-color);background-color:var(--six-sidebar-background-color);transition:var(--six-transition-medium) margin-left;background-size:300vw 70%;background-position:bottom;background-repeat:no-repeat}.sidebar--right{transition:var(--six-transition-medium) margin-right}.sidebar--open.sidebar--left{margin-right:2px}.sidebar--open.sidebar--right{margin-left:2px}";const r=o;const n=i=>{var s;return((s=i===null||i===void 0?void 0:i.tagName)===null||s===void 0?void 0:s.toLowerCase())==="six-sidebar-item-group"};const a=class{constructor(t){i(this,t);this.sixShow=s(this,"six-sidebar-show",7);this.sixAfterShow=s(this,"six-sidebar-after-show",7);this.sixHide=s(this,"six-sidebar-hide",7);this.sixAfterHide=s(this,"six-sidebar-after-hide",7);this.sixInitialFocus=s(this,"six-sidebar-initial-focus",7);this.willShow=false;this.willHide=false;this.handleTransitionEnd=i=>{const s=i.target;if(i.type==="transitionend"&&s.classList.contains("sidebar__container")){this.resetTransitionVariables()}};this.closeSiblingDetailsOnShow=i=>{const s=i.target;if(this.sidebar!=null){e(s,this.sidebar)}const t=i=>{var t;let e=s;while(i(e)!=null){e=i(e);if(n(e)){const i=(t=e===null||e===void 0?void 0:e.shadowRoot)===null||t===void 0?void 0:t.querySelector("six-details");if(i!=null){i.open=false}}}};t((i=>i===null||i===void 0?void 0:i.previousElementSibling));t((i=>i===null||i===void 0?void 0:i.nextElementSibling))};this.isVisible=false;this.position="left";this.open=false;this.width="16rem";this.toggled=false}handleOpenChange(){this.open?this.show():this.hide()}componentWillLoad(){if(this.open){void this.show();this.resetTransitionVariables()}}componentDidRender(){this.setupTogglableMenuItems()}disconnectedCallback(){var i;(i=this.sidebar)===null||i===void 0?void 0:i.removeEventListener("six-details-show",this.closeSiblingDetailsOnShow)}setupTogglableMenuItems(){if(!this.toggled||this.sidebar==null)return;this.markAllMenuItemsAsSelectableEmpty();this.sidebar.addEventListener("six-details-show",this.closeSiblingDetailsOnShow)}markAllMenuItemsAsSelectableEmpty(){var i;const s=(i=this.sidebar)===null||i===void 0?void 0:i.querySelector("slot");const t=(s===null||s===void 0?void 0:s.assignedElements())||[];const e=[];while(t.length>0){const i=t.pop();if((i===null||i===void 0?void 0:i.shadowRoot)==null){continue}const s=i.shadowRoot.querySelectorAll("six-details");e.push(...s);const o=Array.from(i.children).filter(n);t.push(...o)}e.forEach((i=>i.selectableEmpty=true))}async toggle(){if(this.willShow||this.willHide){return}if(this.open){await this.hide()}else{await this.show()}}async show(){if(this.willShow){return}const i=this.sixShow.emit();if(i.defaultPrevented){this.open=false;return}this.willShow=true;this.isVisible=true;this.open=true}async hide(){if(this.willHide){return}const i=this.sixHide.emit();if(i.defaultPrevented){this.open=true;return}this.willHide=true;this.open=false}async selectItemByIndex(i){if(this.sidebar==null)return;const s=this.sidebar.querySelector("slot");const t=((s===null||s===void 0?void 0:s.assignedElements())||[]).flatMap((i=>{var s;const t=(s=i.shadowRoot)===null||s===void 0?void 0:s.querySelector("six-details");if(t==null){return[]}return[t]}));if(i<0||i>t.length-1){console.error(`Tried to access sidebar menu item by index, but provided index out of range. Provided index: ${i}`);return}await t[i].show()}async selectItemByName(i){var s,t,e;const o=(s=this.sidebar)===null||s===void 0?void 0:s.querySelector("slot");const r=o===null||o===void 0?void 0:o.assignedElements();if(r==null){return}const n=r.findIndex((s=>(s===null||s===void 0?void 0:s.name)===i));const a=(e=(t=r.at(n))===null||t===void 0?void 0:t.shadowRoot)===null||e===void 0?void 0:e.querySelector("six-details");await(a===null||a===void 0?void 0:a.show())}resetTransitionVariables(){this.isVisible=this.open;this.willShow=false;this.willHide=false;this.open?this.sixAfterShow.emit():this.sixAfterHide.emit()}render(){return t("host",{key:"653634dd387c74780afe8e46d45d6729087825cf",class:"six-sidebar"},t("div",{key:"175c9b41dbe9a6f6aab2c0b4e0140d1afb59f083",class:{sidebar__container:true,"sidebar--visible":this.isVisible,"sidebar--open":this.open,"sidebar--left":this.position==="left","sidebar--right":this.position==="right"},style:{width:this.width,[`margin-${this.position}`]:this.open?"0":`calc(1rem - ${this.width})`},ref:i=>this.sidebar=i,"aria-hidden":this.open?"false":"true",onTransitionEnd:this.handleTransitionEnd},t("slot",{key:"0a838ffd91022b9aad70bcff803c54c74f7158d7"})))}static get watchers(){return{open:["handleOpenChange"]}}};a.style=r;export{a as six_sidebar};
+//# sourceMappingURL=p-acc487ec.entry.js.map

package/dist/ui-library/p-acc487ec.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["sixSidebarCss","SixSidebarStyle0","isSidebarItemGroup","node","_a","tagName","toLowerCase","SixSidebar","this","willShow","willHide","handleTransitionEnd","event","target","type","classList","contains","resetTransitionVariables","closeSiblingDetailsOnShow","clickedMenuItem","sidebar","scrollIntoView","closeAllSiblingsBySiblingProperty","getSibling","detailsElement","shadowRoot","querySelector","open","previousElementSibling","nextElementSibling","handleOpenChange","show","hide","componentWillLoad","componentDidRender","setupTogglableMenuItems","disconnectedCallback","removeEventListener","toggled","markAllMenuItemsAsSelectableEmpty","addEventListener","slot","nodes","assignedElements","menuItems","length","pop","menuItemsForCurrentNode","querySelectorAll","push","newItemGroups","Array","from","children","filter","forEach","details","selectableEmpty","toggle","sixShow","emit","defaultPrevented","isVisible","sixHide","selectItemByIndex","index","menuItemsOnRootLevel","flatMap","el","console","error","selectItemByName","value","sidebarItemGroups","indexOfSelectedElement","findIndex","name","selectedItem","_c","_b","at","sixAfterShow","sixAfterHide","render","h","key","class","sidebar__container","position","style","width","ref","onTransitionEnd"],"sources":["src/components/six-sidebar/six-sidebar.scss?tag=six-sidebar&encapsulation=shadow","src/components/six-sidebar/six-sidebar.tsx"],"sourcesContent":["@import 'src/global/component';\n@import 'src/global/mixins/hidden';\n@import 'src/global/mixins/scrollbar';\n\n:host {\n  display: block;\n  height: 100%;\n}\n\n.sidebar {\n  &__container {\n    // scroll\n    height: 100%;\n    overflow: auto;\n\n    &.sidebar--open {\n      border-right: 1px solid var(--six-color-web-rock-300);\n    }\n\n    &:not(.sidebar--visible) {\n      @include hidden;\n    }\n  }\n\n  &--left {\n    color: var(--six-sidebar-color);\n    background-color: var(--six-sidebar-background-color);\n    // collapse\n    transition: var(--six-transition-medium) margin-left;\n    // six background\n    background-size: 300vw 70%;\n    background-position: bottom;\n    background-repeat: no-repeat;\n  }\n\n  &--right {\n    // collapse\n    transition: var(--six-transition-medium) margin-right;\n  }\n\n  // if the sidebar is embedded within six-root it cuts-off the border styling, for thus we need to guarante a margin\n  &--open {\n    &.sidebar--left {\n      margin-right: 2px;\n    }\n\n    &.sidebar--right {\n      margin-left: 2px;\n    }\n  }\n}\n","import { Component, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { EmptyPayload } from '../../utils/types';\nimport { scrollIntoView } from '../../utils/scroll';\n\nconst isSidebarItemGroup = (node?: Element | null): boolean =>\n  node?.tagName?.toLowerCase() === 'six-sidebar-item-group';\n\n/**\n * @since 1.0\n * @status stable\n *\n * @slot - Used to define the nested side bar [group] items.\n */\n\n@Component({\n  tag: 'six-sidebar',\n  styleUrl: 'six-sidebar.scss',\n  shadow: true,\n})\nexport class SixSidebar {\n  private willShow = false;\n  private willHide = false;\n\n  private sidebar?: HTMLElement;\n\n  @State() isVisible = false;\n\n  /** Sidebar position */\n  @Prop() position: 'left' | 'right' = 'left';\n\n  /** Indicates whether the sidebar is open. You can use this in lieu of the show/hide methods. */\n  @Prop({ mutable: true, reflect: true }) open = false;\n\n  /** Sidebar width */\n  @Prop() width = '16rem';\n\n  /** Define whether sidebar is toggled meaning only one menu can be open at the same time*/\n  @Prop() toggled = false;\n\n  /** Emitted when the sidebar opens. Calling `event.preventDefault()` will prevent it from being opened. */\n  @Event({ eventName: 'six-sidebar-show' }) sixShow!: EventEmitter<EmptyPayload>;\n\n  /** Emitted after the sidebar opens and all transitions are complete. */\n  @Event({ eventName: 'six-sidebar-after-show' }) sixAfterShow!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the sidebar closes. Calling `event.preventDefault()` will prevent it from being closed. */\n  @Event({ eventName: 'six-sidebar-hide' }) sixHide!: EventEmitter<EmptyPayload>;\n\n  /** Emitted after the sidebar closes and all transitions are complete. */\n  @Event({ eventName: 'six-sidebar-after-hide' }) sixAfterHide!: EventEmitter<EmptyPayload>;\n\n  /**\n   * Emitted when the sidebar opens and the panel gains focus. Calling `event.preventDefault()` will prevent focus and\n   * allow you to set it on a different element in the sidebar, such as an input or button.\n   */\n  @Event({ eventName: 'six-sidebar-initial-focus' }) sixInitialFocus!: EventEmitter<EmptyPayload>;\n\n  @Watch('open')\n  handleOpenChange() {\n    this.open ? this.show() : this.hide();\n  }\n\n  private handleTransitionEnd = (event: TransitionEvent) => {\n    const target = event.target as HTMLElement;\n\n    // Ensure we only emit one event when the target element is no longer visible\n    if (event.type === 'transitionend' && target.classList.contains('sidebar__container')) {\n      this.resetTransitionVariables();\n    }\n  };\n\n  componentWillLoad() {\n    // Show on init if open\n    if (this.open) {\n      void this.show();\n      // if the sidebar is open by default we need to manually reset the\n      // transition variables since there will be no transition event\n      this.resetTransitionVariables();\n    }\n  }\n\n  componentDidRender() {\n    this.setupTogglableMenuItems();\n  }\n\n  disconnectedCallback() {\n    this.sidebar?.removeEventListener('six-details-show', this.closeSiblingDetailsOnShow);\n  }\n\n  private closeSiblingDetailsOnShow = (event: Event) => {\n    const clickedMenuItem = event.target as HTMLElement;\n    if (this.sidebar != null) {\n      scrollIntoView(clickedMenuItem, this.sidebar);\n    }\n\n    const closeAllSiblingsBySiblingProperty = (\n      getSibling: (node: Element | null | undefined) => Element | null | undefined\n    ) => {\n      let node: Element | null | undefined = clickedMenuItem;\n      while (getSibling(node) != null) {\n        node = getSibling(node);\n        if (isSidebarItemGroup(node)) {\n          const detailsElement = node?.shadowRoot?.querySelector('six-details');\n          if (detailsElement != null) {\n            detailsElement.open = false;\n          }\n        }\n      }\n    };\n\n    // close all previous siblings\n    closeAllSiblingsBySiblingProperty((node) => node?.previousElementSibling);\n    // close all further siblings\n    closeAllSiblingsBySiblingProperty((node) => node?.nextElementSibling);\n  };\n\n  private setupTogglableMenuItems() {\n    if (!this.toggled || this.sidebar == null) return;\n    this.markAllMenuItemsAsSelectableEmpty();\n    this.sidebar.addEventListener('six-details-show', this.closeSiblingDetailsOnShow);\n  }\n\n  private markAllMenuItemsAsSelectableEmpty() {\n    // when you have a toggled menu you also want to close other menu items when you click on an item without children\n    // nice benefit this item will then also be highlighted\n    const slot = this.sidebar?.querySelector('slot');\n    const nodes = slot?.assignedElements() || [];\n\n    // since we don't just want to make the top level empty menuItems selectable in toggled mode,\n    // but also nested items we need to traverse the whole menu item tree\n    const menuItems = [];\n    while (nodes.length > 0) {\n      const node = nodes.pop();\n      if (node?.shadowRoot == null) {\n        continue;\n      }\n\n      // collect six-details in the current shadowDOM\n      const menuItemsForCurrentNode = node.shadowRoot.querySelectorAll('six-details');\n      menuItems.push(...menuItemsForCurrentNode);\n\n      // collect all six-sidebar-item-group children of the current node to afterwards check their shadowDOM too\n      const newItemGroups = Array.from(node.children).filter(isSidebarItemGroup);\n      nodes.push(...newItemGroups);\n    }\n\n    menuItems.forEach((details) => (details.selectableEmpty = true));\n  }\n\n  /** Toggles whether the sidebar should be shown or hidden */\n  @Method()\n  async toggle() {\n    if (this.willShow || this.willHide) {\n      return;\n    }\n\n    if (this.open) {\n      await this.hide();\n    } else {\n      await this.show();\n    }\n  }\n\n  /** Shows the sidebar */\n  @Method()\n  async show() {\n    if (this.willShow) {\n      return;\n    }\n\n    const sixShow = this.sixShow.emit();\n    if (sixShow.defaultPrevented) {\n      this.open = false;\n      return;\n    }\n\n    this.willShow = true;\n    this.isVisible = true;\n    this.open = true;\n  }\n\n  /** Hides the sidebar */\n  @Method()\n  async hide() {\n    if (this.willHide) {\n      return;\n    }\n\n    const sixHide = this.sixHide.emit();\n    if (sixHide.defaultPrevented) {\n      this.open = true;\n      return;\n    }\n\n    this.willHide = true;\n    this.open = false;\n  }\n\n  /** Allows to select a menu item programmatically by index */\n  @Method()\n  async selectItemByIndex(index: number) {\n    if (this.sidebar == null) return;\n\n    const slot = this.sidebar.querySelector('slot');\n    const menuItemsOnRootLevel: HTMLSixDetailsElement[] = (slot?.assignedElements() || []).flatMap((el) => {\n      const detailsElement = el.shadowRoot?.querySelector('six-details');\n      if (detailsElement == null) {\n        return [];\n      }\n      return [detailsElement];\n    });\n    if (index < 0 || index > menuItemsOnRootLevel.length - 1) {\n      console.error(\n        `Tried to access sidebar menu item by index, but provided index out of range. Provided index: ${index}`\n      );\n      return;\n    }\n    await menuItemsOnRootLevel[index].show();\n  }\n\n  /** Allows to select a menu item programmatically by name */\n  @Method()\n  async selectItemByName(value: string) {\n    const slot = this.sidebar?.querySelector('slot');\n    const sidebarItemGroups = slot?.assignedElements() as HTMLSixSidebarItemGroupElement[];\n    if (sidebarItemGroups == null) {\n      return;\n    }\n\n    const indexOfSelectedElement = sidebarItemGroups.findIndex((el) => el?.name === value);\n    const selectedItem = sidebarItemGroups.at(indexOfSelectedElement)?.shadowRoot?.querySelector('six-details');\n    await selectedItem?.show();\n  }\n\n  private resetTransitionVariables() {\n    this.isVisible = this.open;\n    this.willShow = false;\n    this.willHide = false;\n    this.open ? this.sixAfterShow.emit() : this.sixAfterHide.emit();\n  }\n\n  render() {\n    return (\n      <host class=\"six-sidebar\">\n        <div\n          class={{\n            sidebar__container: true,\n            'sidebar--visible': this.isVisible,\n            'sidebar--open': this.open,\n            'sidebar--left': this.position === 'left',\n            'sidebar--right': this.position === 'right',\n          }}\n          style={{\n            width: this.width,\n            [`margin-${this.position}`]: this.open ? '0' : `calc(1rem - ${this.width})`,\n          }}\n          ref={(el) => (this.sidebar = el)}\n          aria-hidden={this.open ? 'false' : 'true'}\n          onTransitionEnd={this.handleTransitionEnd}\n        >\n          <slot />\n        </div>\n      </host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/ui-library/p-ba7424b3.entry.js

@@ -0,0 +1,2 @@
+import{r as o,h as s,H as r}from"./p-f93d8a4e.js";const e=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}:host{display:inline-block;box-shadow:var(--six-shadow-medium);border:1px solid var(--six-color-web-rock-100);padding:var(--six-spacing-medium)}";const a=e;const i=class{constructor(s){o(this,s)}render(){return s(r,{key:"ccbbf6bcbd5de13bb440629e16bfa95b9715a0d5"},s("slot",{key:"70c3d1760568a36077ae8ed8ff74ce59f19a8843"}))}};i.style=a;export{i as six_card};
+//# sourceMappingURL=p-ba7424b3.entry.js.map

package/dist/ui-library/p-ba7424b3.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["sixCardCss","SixCardStyle0","SixCard","render","h","Host","key"],"sources":["src/components/six-card/six-card.scss?tag=six-card&encapsulation=shadow","src/components/six-card/six-card.tsx"],"sourcesContent":["@import 'src/global/component';\n\n:host {\n  display: inline-block;\n  box-shadow: var(--six-shadow-medium);\n  border: 1px solid var(--six-color-web-rock-100);\n  padding: var(--six-spacing-medium);\n}\n","import { Component, h, Host } from '@stencil/core';\n\n/**\n * @since 1.0\n * @status stable\n *\n * @slot - Used to define the content of the card.\n */\n\n@Component({\n  tag: 'six-card',\n  styleUrl: 'six-card.scss',\n  shadow: true,\n})\nexport class SixCard {\n  render() {\n    return (\n      <Host>\n        <slot />\n      </Host>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAa,4PACnB,MAAAC,EAAeD,E,MCaFE,EAAO,M,yBAClB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,QAAAE,IAAA,6C"}

package/dist/ui-library/p-c948cf70.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as e,h as i,g as r}from"./p-f93d8a4e.js";import{u as a,l as s}from"./p-8227aaed.js";import{h as o}from"./p-0cebf1d2.js";import{M as n}from"./p-651293e7.js";const h=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}:host{--size:25rem;display:contents}.drawer{top:0;left:0;width:100%;height:100%;pointer-events:none;overflow:hidden}.drawer:not(.drawer--visible){position:absolute;width:1px;height:1px;clip:rect(0 0 0 0);clip-path:inset(50%);overflow:hidden;pointer-events:none;visibility:hidden}.drawer--contained{position:absolute;z-index:initial}.drawer--fixed{position:fixed;z-index:var(--six-z-index-drawer)}.drawer__panel{position:absolute;display:flex;flex-direction:column;z-index:2;max-width:100%;max-height:100%;background-color:var(--six-drawer-background-color);color:var(--six-drawer-color);box-shadow:var(--six-shadow-large);transition:var(--six-transition-medium) transform;overflow:auto;pointer-events:all}.drawer__panel:focus{outline:none}.drawer--top .drawer__panel{top:0;right:auto;bottom:auto;left:0;width:100%;height:var(--size);transform:translate(0, -100%)}.drawer--right .drawer__panel{top:0;right:0;bottom:auto;left:auto;width:var(--size);height:100%;transform:translate(100%, 0)}.drawer--bottom .drawer__panel{top:auto;right:auto;bottom:0;left:0;width:100%;height:var(--size);transform:translate(0, 100%)}.drawer--left .drawer__panel{top:0;right:auto;bottom:auto;left:0;width:var(--size);height:100%;transform:translate(-100%, 0)}.drawer--open .drawer__panel{transform:none}.drawer__header{display:flex}.drawer__title{flex:1 1 auto;font-size:var(--six-font-size-large);line-height:var(--six-line-height-dense);padding:var(--six-spacing-large)}.drawer__close{flex:0 0 auto;display:flex;align-items:center;font-size:var(--six-font-size-x-large);padding:0 var(--six-spacing-large)}.drawer__body{flex:1 1 auto;padding:var(--six-spacing-large);overflow:auto;-webkit-overflow-scrolling:touch}.drawer__footer{text-align:right;padding:var(--six-spacing-large)}.drawer__footer ::slotted(six-button:not(:last-of-type)){margin-right:var(--six-spacing-x-small)}.drawer:not(.drawer--has-footer) .drawer__footer{display:none}.drawer__overlay{display:block;position:fixed;top:0;right:0;bottom:0;left:0;background-color:var(--six-overlay-background-color);opacity:0;transition:var(--six-transition-medium) opacity;pointer-events:all}.drawer--contained .drawer__overlay{position:absolute}.drawer--open .drawer__overlay{opacity:0.4}";const l=h;let d=0;const f=class{constructor(i){t(this,i);this.sixShow=e(this,"six-drawer-show",7);this.sixAfterShow=e(this,"six-drawer-after-show",7);this.sixHide=e(this,"six-drawer-hide",7);this.sixAfterHide=e(this,"six-drawer-after-hide",7);this.sixInitialFocus=e(this,"six-drawer-initial-focus",7);this.sixOverlayDismiss=e(this,"six-drawer-overlay-dismiss",7);this.componentId=`drawer-${++d}`;this.willShow=false;this.willHide=false;this.handleCloseClick=()=>{this.hide()};this.handleKeyDown=t=>{if(t.key==="Escape"){this.hide()}};this.handleOverlayClick=()=>{const t=this.sixOverlayDismiss.emit();if(!t.defaultPrevented){this.hide()}};this.handleSlotChange=()=>{this.hasFooter=o(this.host,"footer")};this.handleTransitionEnd=t=>{const e=t.target;if(t.propertyName==="transform"&&e.classList.contains("drawer__panel")){this.resetTransitionVariables()}};this.hasFooter=false;this.isVisible=false;this.open=false;this.label="";this.placement="right";this.contained=false;this.noHeader=false}handleOpenChange(){this.open?this.show():this.hide()}connectedCallback(){this.modal=new n(this.host,{onFocusOut:()=>{var t;return this.contained?null:(t=this.panel)===null||t===void 0?void 0:t.focus()}})}componentWillLoad(){this.handleSlotChange();if(this.open){this.show();this.resetTransitionVariables()}}disconnectedCallback(){a(this.host)}async show(){if(this.willShow||this.modal==null||this.panel==null||this.drawer==null){return}const t=this.panel;const e=this.sixShow.emit();if(e.defaultPrevented){this.open=false;return}this.willShow=true;this.isVisible=true;this.open=true;if(!this.contained){this.modal.activate();s(this.host)}if(this.open){requestAnimationFrame((()=>{const e=this.sixInitialFocus.emit();if(!e.defaultPrevented){t.focus({preventScroll:true})}}))}}async hide(){if(this.willHide||this.modal==null){return}const t=this.sixHide.emit();if(t.defaultPrevented){this.open=true;return}this.willHide=true;this.open=false;this.modal.deactivate();a(this.host)}resetTransitionVariables(){this.isVisible=this.open;this.willShow=false;this.willHide=false;this.open?this.sixAfterShow.emit():this.sixAfterHide.emit()}render(){return i("div",{key:"c863c7d4440416870b4d9e86b9e1ca7922948a38",ref:t=>this.drawer=t,part:"base",class:{drawer:true,"drawer--open":this.open,"drawer--visible":this.isVisible,"drawer--top":this.placement==="top","drawer--right":this.placement==="right","drawer--bottom":this.placement==="bottom","drawer--left":this.placement==="left","drawer--contained":this.contained,"drawer--fixed":!this.contained,"drawer--has-footer":this.hasFooter},onKeyDown:this.handleKeyDown,onTransitionEnd:this.handleTransitionEnd},i("div",{key:"c3658d2eaac5636cc64035878a590794b1785458",part:"overlay",class:"drawer__overlay",onClick:this.handleOverlayClick,tabIndex:-1}),i("div",{key:"07f187570fc25af621c7be4259b90e1a4999b2d7",ref:t=>this.panel=t,part:"panel",class:"drawer__panel",role:"dialog","aria-modal":"true","aria-hidden":this.open?"false":"true","aria-label":this.noHeader?this.label:null,"aria-labelledby":!this.noHeader?`${this.componentId}-title`:null,tabIndex:0},!this.noHeader&&i("header",{part:"header",class:"drawer__header"},i("span",{part:"title",class:"drawer__title",id:`${this.componentId}-title`},i("slot",{name:"label"},this.label||String.fromCharCode(65279))),i("six-icon-button",{exportparts:"base:close-button",class:"drawer__close",name:"close",onClick:this.handleCloseClick})),i("div",{key:"e5b565a175f65e9990ba7de28b12ec4ebb69025d",part:"body",class:"drawer__body"},i("slot",{key:"f92f461ccb9fe322e6fe958aa03db86f5e5b8121"})),i("footer",{key:"a04d817305d2f5f98b2a17019bfc9e8401fb3941",part:"footer",class:"drawer__footer"},i("slot",{key:"e035c9fbf453cd2d4fd69b32ad876499f273ad48",name:"footer",onSlotchange:this.handleSlotChange}))))}get host(){return r(this)}static get watchers(){return{open:["handleOpenChange"]}}};f.style=l;export{f as six_drawer};
+//# sourceMappingURL=p-c948cf70.entry.js.map

package/dist/ui-library/p-c948cf70.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["sixDrawerCss","SixDrawerStyle0","id","SixDrawer","this","componentId","willShow","willHide","handleCloseClick","hide","handleKeyDown","event","key","handleOverlayClick","sixOverlayDismiss","emit","defaultPrevented","handleSlotChange","hasFooter","hasSlot","host","handleTransitionEnd","target","propertyName","classList","contains","resetTransitionVariables","handleOpenChange","open","show","connectedCallback","modal","Modal","onFocusOut","_a","contained","panel","focus","componentWillLoad","disconnectedCallback","unlockBodyScrolling","drawer","sixShow","isVisible","activate","lockBodyScrolling","requestAnimationFrame","sixInitialFocus","preventScroll","sixHide","deactivate","sixAfterShow","sixAfterHide","render","h","ref","el","part","class","placement","onKeyDown","onTransitionEnd","onClick","tabIndex","role","noHeader","label","name","String","fromCharCode","exportparts","onSlotchange"],"sources":["src/components/six-drawer/six-drawer.scss?tag=six-drawer&encapsulation=shadow","src/components/six-drawer/six-drawer.tsx"],"sourcesContent":["@import 'src/global/component';\n@import 'src/global/mixins/hidden';\n\n/**\n * @prop --size: The preferred size of the drawer. This will be applied to the drawer's width or height depending on its\n *   `placement`. Note that the drawer will shrink to accommodate smaller screens.\n */\n:host {\n  --size: 25rem;\n\n  display: contents;\n}\n\n.drawer {\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  pointer-events: none;\n  overflow: hidden;\n\n  &:not(.drawer--visible) {\n    @include hidden;\n  }\n}\n\n.drawer--contained {\n  position: absolute;\n  z-index: initial;\n}\n\n.drawer--fixed {\n  position: fixed;\n  z-index: var(--six-z-index-drawer);\n}\n\n.drawer__panel {\n  position: absolute;\n  display: flex;\n  flex-direction: column;\n  z-index: 2;\n  max-width: 100%;\n  max-height: 100%;\n  background-color: var(--six-drawer-background-color);\n  color: var(--six-drawer-color);\n  box-shadow: var(--six-shadow-large);\n  transition: var(--six-transition-medium) transform;\n  overflow: auto;\n  pointer-events: all;\n\n  &:focus {\n    outline: none;\n  }\n}\n\n.drawer--top .drawer__panel {\n  top: 0;\n  right: auto;\n  bottom: auto;\n  left: 0;\n  width: 100%;\n  height: var(--size);\n  transform: translate(0, -100%);\n}\n\n.drawer--right .drawer__panel {\n  top: 0;\n  right: 0;\n  bottom: auto;\n  left: auto;\n  width: var(--size);\n  height: 100%;\n  transform: translate(100%, 0);\n}\n\n.drawer--bottom .drawer__panel {\n  top: auto;\n  right: auto;\n  bottom: 0;\n  left: 0;\n  width: 100%;\n  height: var(--size);\n  transform: translate(0, 100%);\n}\n\n.drawer--left .drawer__panel {\n  top: 0;\n  right: auto;\n  bottom: auto;\n  left: 0;\n  width: var(--size);\n  height: 100%;\n  transform: translate(-100%, 0);\n}\n\n.drawer--open .drawer__panel {\n  // don't use translate here or it will cause problems with popovers inside the drawer e.g. dropdown, select etc.\n  transform: none;\n}\n\n.drawer__header {\n  display: flex;\n}\n\n.drawer__title {\n  flex: 1 1 auto;\n  font-size: var(--six-font-size-large);\n  line-height: var(--six-line-height-dense);\n  padding: var(--six-spacing-large);\n}\n\n.drawer__close {\n  flex: 0 0 auto;\n  display: flex;\n  align-items: center;\n  font-size: var(--six-font-size-x-large);\n  padding: 0 var(--six-spacing-large);\n}\n\n.drawer__body {\n  flex: 1 1 auto;\n  padding: var(--six-spacing-large);\n  overflow: auto;\n  -webkit-overflow-scrolling: touch;\n}\n\n.drawer__footer {\n  text-align: right;\n  padding: var(--six-spacing-large);\n\n  ::slotted(six-button:not(:last-of-type)) {\n    margin-right: var(--six-spacing-x-small);\n  }\n}\n\n.drawer:not(.drawer--has-footer) .drawer__footer {\n  display: none;\n}\n\n.drawer__overlay {\n  display: block;\n  position: fixed;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  background-color: var(--six-overlay-background-color);\n  opacity: 0;\n  transition: var(--six-transition-medium) opacity;\n  pointer-events: all;\n}\n\n.drawer--contained .drawer__overlay {\n  position: absolute;\n}\n\n.drawer--open .drawer__overlay {\n  opacity: 0.4;\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { lockBodyScrolling, unlockBodyScrolling } from '../../utils/scroll';\nimport { hasSlot } from '../../utils/slot';\nimport Modal from '../../utils/modal';\nimport { EmptyPayload } from '../../utils/types';\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 drawer's content.\n * @slot label - The drawer's label. Alternatively, you can use the label prop.\n * @slot footer - The drawer's footer, usually one or more buttons representing various options.\n *\n * @part base - The component's base wrapper.\n * @part overlay - The overlay.\n * @part panel - The drawer panel (where the drawer and its content is rendered).\n * @part header - The drawer header.\n * @part title - The drawer title.\n * @part close-button - The close button.\n * @part body - The drawer body.\n * @part footer - The drawer footer.\n */\n\n@Component({\n  tag: 'six-drawer',\n  styleUrl: 'six-drawer.scss',\n  shadow: true,\n})\nexport class SixDrawer {\n  private componentId = `drawer-${++id}`;\n  private drawer?: HTMLElement;\n  private modal?: Modal;\n  private panel?: HTMLElement;\n  private willShow = false;\n  private willHide = false;\n\n  @Element() host!: HTMLSixDrawerElement;\n\n  @State() hasFooter = false;\n  @State() isVisible = false;\n\n  /** Indicates whether the drawer is open. You can use this in lieu of the show/hide methods. */\n  @Prop({ mutable: true, reflect: true }) open = false;\n\n  /**\n   * The drawer's label as displayed in the header. You should always include a relevant label even when using\n   * `no-header`, as it is required for proper accessibility.\n   */\n  @Prop() label = '';\n\n  /** The direction from which the drawer will open. */\n  @Prop() placement: 'top' | 'right' | 'bottom' | 'left' = 'right';\n\n  /**\n   * By default, the drawer slides out of its containing block (usually the viewport). To make the drawer slide out of\n   * its parent element, set this prop and add `position: relative` to the parent.\n   */\n  @Prop() contained = false;\n\n  /**\n   * Removes the header. This will also remove the default close button, so please ensure you provide an easy,\n   * accessible way for users to dismiss the drawer.\n   */\n  @Prop() noHeader = false;\n\n  @Watch('open')\n  handleOpenChange() {\n    this.open ? this.show() : this.hide();\n  }\n\n  /** Emitted when the drawer opens. Calling `event.preventDefault()` will prevent it from being opened. */\n  @Event({ eventName: 'six-drawer-show' }) sixShow!: EventEmitter<EmptyPayload>;\n\n  /** Emitted after the drawer opens and all transitions are complete. */\n  @Event({ eventName: 'six-drawer-after-show' }) sixAfterShow!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the drawer closes. Calling `event.preventDefault()` will prevent it from being closed. */\n  @Event({ eventName: 'six-drawer-hide' }) sixHide!: EventEmitter<EmptyPayload>;\n\n  /** Emitted after the drawer closes and all transitions are complete. */\n  @Event({ eventName: 'six-drawer-after-hide' }) sixAfterHide!: EventEmitter<EmptyPayload>;\n\n  /**\n   * Emitted when the drawer opens and the panel gains focus. Calling `event.preventDefault()` will prevent focus and\n   * allow you to set it on a different element in the drawer, such as an input or button.\n   */\n  @Event({ eventName: 'six-drawer-initial-focus' }) sixInitialFocus!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the overlay is clicked. Calling `event.preventDefault()` will prevent the drawer from closing. */\n  @Event({ eventName: 'six-drawer-overlay-dismiss' }) sixOverlayDismiss!: EventEmitter<EmptyPayload>;\n\n  connectedCallback() {\n    this.modal = new Modal(this.host, {\n      onFocusOut: () => (this.contained ? null : this.panel?.focus()),\n    });\n  }\n\n  componentWillLoad() {\n    this.handleSlotChange();\n\n    // Show on init if open\n    if (this.open) {\n      this.show();\n      // if the sidebar is open by default we need to manually reset the\n      // transition variables since there will be no transition event\n      this.resetTransitionVariables();\n    }\n  }\n\n  disconnectedCallback() {\n    unlockBodyScrolling(this.host);\n  }\n\n  /** Shows the drawer */\n  @Method()\n  async show() {\n    if (this.willShow || this.modal == null || this.panel == null || this.drawer == null) {\n      return;\n    }\n    const panel = this.panel;\n\n    const sixShow = this.sixShow.emit();\n    if (sixShow.defaultPrevented) {\n      this.open = false;\n      return;\n    }\n\n    this.willShow = true;\n    this.isVisible = true;\n    this.open = true;\n\n    // Lock body scrolling only if the drawer isn't contained\n    if (!this.contained) {\n      this.modal.activate();\n      lockBodyScrolling(this.host);\n    }\n\n    if (this.open) {\n      // Wait for the next frame before setting initial focus so the dialog is technically visible\n      requestAnimationFrame(() => {\n        const sixInitialFocus = this.sixInitialFocus.emit();\n        if (!sixInitialFocus.defaultPrevented) {\n          panel.focus({ preventScroll: true });\n        }\n      });\n    }\n  }\n\n  /** Hides the drawer */\n  @Method()\n  async hide() {\n    if (this.willHide || this.modal == null) {\n      return;\n    }\n\n    const sixHide = this.sixHide.emit();\n    if (sixHide.defaultPrevented) {\n      this.open = true;\n      return;\n    }\n\n    this.willHide = true;\n    this.open = false;\n    this.modal.deactivate();\n\n    unlockBodyScrolling(this.host);\n  }\n\n  private handleCloseClick = () => {\n    this.hide();\n  };\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    if (event.key === 'Escape') {\n      this.hide();\n    }\n  };\n\n  private handleOverlayClick = () => {\n    const sixOverlayDismiss = this.sixOverlayDismiss.emit();\n\n    if (!sixOverlayDismiss.defaultPrevented) {\n      this.hide();\n    }\n  };\n\n  private handleSlotChange = () => {\n    this.hasFooter = hasSlot(this.host, 'footer');\n  };\n\n  private handleTransitionEnd = (event: TransitionEvent) => {\n    const target = event.target as HTMLElement;\n\n    // Ensure we only emit one event when the target element is no longer visible\n    if (event.propertyName === 'transform' && target.classList.contains('drawer__panel')) {\n      this.resetTransitionVariables();\n    }\n  };\n\n  private resetTransitionVariables() {\n    this.isVisible = this.open;\n    this.willShow = false;\n    this.willHide = false;\n    this.open ? this.sixAfterShow.emit() : this.sixAfterHide.emit();\n  }\n\n  render() {\n    return (\n      <div\n        ref={(el) => (this.drawer = el)}\n        part=\"base\"\n        class={{\n          drawer: true,\n          'drawer--open': this.open,\n          'drawer--visible': this.isVisible,\n          'drawer--top': this.placement === 'top',\n          'drawer--right': this.placement === 'right',\n          'drawer--bottom': this.placement === 'bottom',\n          'drawer--left': this.placement === 'left',\n          'drawer--contained': this.contained,\n          'drawer--fixed': !this.contained,\n          'drawer--has-footer': this.hasFooter,\n        }}\n        onKeyDown={this.handleKeyDown}\n        onTransitionEnd={this.handleTransitionEnd}\n      >\n        <div part=\"overlay\" class=\"drawer__overlay\" onClick={this.handleOverlayClick} tabIndex={-1} />\n\n        <div\n          ref={(el) => (this.panel = el)}\n          part=\"panel\"\n          class=\"drawer__panel\"\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-hidden={this.open ? 'false' : 'true'}\n          aria-label={this.noHeader ? this.label : null}\n          aria-labelledby={!this.noHeader ? `${this.componentId}-title` : null}\n          tabIndex={0}\n        >\n          {!this.noHeader && (\n            <header part=\"header\" class=\"drawer__header\">\n              <span part=\"title\" class=\"drawer__title\" id={`${this.componentId}-title`}>\n                <slot name=\"label\">\n                  {/* If there's no label, use an invisible character to prevent the heading from collapsing */}\n                  {this.label || String.fromCharCode(65279)}\n                </slot>\n              </span>\n              <six-icon-button\n                exportparts=\"base:close-button\"\n                class=\"drawer__close\"\n                name=\"close\"\n                onClick={this.handleCloseClick}\n              />\n            </header>\n          )}\n\n          <div part=\"body\" class=\"drawer__body\">\n            <slot />\n          </div>\n\n          <footer part=\"footer\" class=\"drawer__footer\">\n            <slot name=\"footer\" onSlotchange={this.handleSlotChange} />\n          </footer>\n        </div>\n      </div>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/ui-library/p-d55db23a.entry.js

@@ -0,0 +1,2 @@
+import{r as i,c as t,h as a,g as s}from"./p-f93d8a4e.js";import{u as e,l as o}from"./p-8227aaed.js";import{h as l}from"./p-0cebf1d2.js";import{M as r}from"./p-651293e7.js";const n=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}:host{--width:31rem;display:contents}.dialog{display:flex;align-items:center;justify-content:center;position:fixed;top:0;right:0;bottom:0;left:0;z-index:var(--six-z-index-dialog);color:var(--six-color-web-rock-900)}.dialog:not(.dialog--visible){position:absolute;width:1px;height:1px;clip:rect(0 0 0 0);clip-path:inset(50%);overflow:hidden;pointer-events:none;visibility:hidden}.dialog__panel{display:flex;flex-direction:column;z-index:2;width:var(--width);max-width:calc(100% - var(--six-spacing-xx-large));max-height:calc(100% - var(--six-spacing-xx-large));background-color:var(--six-panel-background-color);border-radius:var(--six-border-radius-medium);box-shadow:var(--six-shadow-large);opacity:0;transform:scale(0.8);transition:var(--six-transition-medium) opacity, var(--six-transition-medium) transform}.dialog__panel:focus{outline:none}@media screen and (max-width: 420px){.dialog__panel{max-height:80vh}}.dialog--open .dialog__panel{display:flex;opacity:1;transform:none}.dialog__header{flex:0 0 auto;display:flex}.dialog__title{flex:1 1 auto;font-size:var(--six-font-size-x-large);font-weight:var(--six-font-weight-bold);line-height:var(--six-line-height-dense);padding:var(--six-spacing-large) var(--six-spacing-large) var(--six-spacing-small)}.dialog__close{flex:0 0 auto;display:flex;align-items:center;font-size:var(--six-font-size-x-large);padding:0 var(--six-spacing-x-small)}.dialog__body{flex:1 1 auto;padding:var(--six-spacing-small) var(--six-spacing-large) var(--six-spacing-large);overflow:auto;-webkit-overflow-scrolling:touch}.dialog__footer{flex:0 0 auto;text-align:right;padding:var(--six-spacing-large)}.dialog__footer ::slotted(six-button:not(:first-of-type)){margin-left:var(--six-spacing-xx-small)}.dialog:not(.dialog--has-footer) .dialog__footer{display:none}.dialog__overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:var(--six-overlay-background-color);opacity:0;transition:var(--six-transition-medium) opacity}.dialog--open .dialog__overlay{opacity:0.8}";const d=n;let h=0;const c=class{constructor(a){i(this,a);this.sixShow=t(this,"six-dialog-show",7);this.sixAfterShow=t(this,"six-dialog-after-show",7);this.sixHide=t(this,"six-dialog-hide",7);this.sixAfterHide=t(this,"six-dialog-after-hide",7);this.sixInitialFocus=t(this,"six-dialog-initial-focus",7);this.sixOverlayDismiss=t(this,"six-dialog-overlay-dismiss",7);this.componentId=`dialog-${++h}`;this.willShow=false;this.willHide=false;this.handleCloseClick=()=>{this.hide()};this.handleKeyDown=i=>{if(i.key==="Escape"){this.hide()}};this.handleOverlayClick=()=>{const i=this.sixOverlayDismiss.emit();if(!i.defaultPrevented){this.hide()}};this.handleSlotChange=()=>{this.hasFooter=l(this.host,"footer")};this.handleTransitionEnd=i=>{const t=i.target;if(i.propertyName==="opacity"&&t.classList.contains("dialog__panel")){this.isVisible=this.open;this.willShow=false;this.willHide=false;this.open?this.sixAfterShow.emit():this.sixAfterHide.emit()}};this.hasFooter=false;this.isVisible=false;this.open=false;this.label="";this.noHeader=false}handleOpenChange(){this.open?this.show():this.hide()}connectedCallback(){this.modal=new r(this.host,{onFocusOut:()=>{var i;return(i=this.panel)===null||i===void 0?void 0:i.focus()}})}componentWillLoad(){this.handleSlotChange()}componentDidLoad(){if(this.open){this.show()}}disconnectedCallback(){e(this.host)}async show(){if(this.willShow||this.modal==null||this.panel==null||this.dialog==null){return}const i=this.panel;const t=this.sixShow.emit();if(t.defaultPrevented){this.open=false;return}this.willShow=true;this.isVisible=true;this.open=true;this.modal.activate();o(this.host);if(this.open){requestAnimationFrame((()=>{const t=this.sixInitialFocus.emit();if(!t.defaultPrevented){i.focus({preventScroll:true})}}))}}async hide(){if(this.willHide||this.modal==null){return}const i=this.sixHide.emit();if(i.defaultPrevented){this.open=true;return}this.willHide=true;this.open=false;this.modal.deactivate();e(this.host)}render(){return a("div",{key:"df1ad36ca5c4f01bdd0607fbb305158c820cba61",ref:i=>this.dialog=i,part:"base",class:{dialog:true,"dialog--open":this.open,"dialog--visible":this.isVisible,"dialog--has-footer":this.hasFooter},onKeyDown:this.handleKeyDown,onTransitionEnd:this.handleTransitionEnd},a("div",{key:"c8bb4895e3c4a324128797a5c5d214e6400ad34d",part:"overlay",class:"dialog__overlay",onClick:this.handleOverlayClick}),a("div",{key:"45dd7b4ab7aa300c434e3ae31772ea76da8cafc5",ref:i=>this.panel=i,part:"panel",class:"dialog__panel",role:"dialog","aria-modal":"true","aria-hidden":this.open?"false":"true","aria-label":this.noHeader?this.label:null,"aria-labelledby":!this.noHeader?`${this.componentId}-title`:null,tabIndex:0},!this.noHeader&&a("header",{part:"header",class:"dialog__header"},a("span",{part:"title",class:"dialog__title",id:`${this.componentId}-title`},a("slot",{name:"label"},this.label||String.fromCharCode(65279))),a("six-icon-button",{exportparts:"base:close-button",class:"dialog__close",name:"close",onClick:this.handleCloseClick})),a("div",{key:"2b2e44b8a06742c7d0648cc0d3b57064ce52d4af",part:"body",class:"dialog__body"},a("slot",{key:"c5a11acaeb1dfb4560b4ce1c8407c8468fd3858a"})),a("footer",{key:"0ec839c1ea9cb891a3af893a1209805c85796653",part:"footer",class:"dialog__footer"},a("slot",{key:"6618d5255dac86544ce238014e374908d1b4935e",name:"footer",onSlotchange:this.handleSlotChange}))))}get host(){return s(this)}static get watchers(){return{open:["handleOpenChange"]}}};c.style=d;export{c as six_dialog};
+//# sourceMappingURL=p-d55db23a.entry.js.map

package/dist/ui-library/p-d55db23a.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["sixDialogCss","SixDialogStyle0","id","SixDialog","this","componentId","willShow","willHide","handleCloseClick","hide","handleKeyDown","event","key","handleOverlayClick","sixOverlayDismiss","emit","defaultPrevented","handleSlotChange","hasFooter","hasSlot","host","handleTransitionEnd","target","propertyName","classList","contains","isVisible","open","sixAfterShow","sixAfterHide","handleOpenChange","show","connectedCallback","modal","Modal","onFocusOut","_a","panel","focus","componentWillLoad","componentDidLoad","disconnectedCallback","unlockBodyScrolling","dialog","sixShow","activate","lockBodyScrolling","requestAnimationFrame","sixInitialFocus","preventScroll","sixHide","deactivate","render","h","ref","el","part","class","onKeyDown","onTransitionEnd","onClick","role","noHeader","label","tabIndex","name","String","fromCharCode","exportparts","onSlotchange"],"sources":["src/components/six-dialog/six-dialog.scss?tag=six-dialog&encapsulation=shadow","src/components/six-dialog/six-dialog.tsx"],"sourcesContent":["@import 'src/global/component';\n@import 'src/global/mixins/hidden';\n\n/**\n * @prop --width: The preferred width of the dialog. Note that the dialog will shrink to accommodate smaller screens.\n */\n:host {\n  --width: 31rem;\n\n  display: contents;\n}\n\n.dialog {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  position: fixed;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: var(--six-z-index-dialog);\n  color: var(--six-color-web-rock-900);\n\n  &:not(.dialog--visible) {\n    @include hidden;\n  }\n}\n\n.dialog__panel {\n  display: flex;\n  flex-direction: column;\n  z-index: 2;\n  width: var(--width);\n  max-width: calc(100% - var(--six-spacing-xx-large));\n  max-height: calc(100% - var(--six-spacing-xx-large));\n  background-color: var(--six-panel-background-color);\n  border-radius: var(--six-border-radius-medium);\n  box-shadow: var(--six-shadow-large);\n  opacity: 0;\n  transform: scale(0.8);\n  transition: var(--six-transition-medium) opacity, var(--six-transition-medium) transform;\n\n  &:focus {\n    outline: none;\n  }\n}\n\n// Ensure there's enough vertical padding for phones that don't update vh when chrome appears (e.g. iPhone)\n@media screen and (max-width: 420px) {\n  .dialog__panel {\n    max-height: 80vh;\n  }\n}\n\n.dialog--open .dialog__panel {\n  display: flex;\n  opacity: 1;\n  transform: none;\n}\n\n.dialog__header {\n  flex: 0 0 auto;\n  display: flex;\n}\n\n.dialog__title {\n  flex: 1 1 auto;\n  font-size: var(--six-font-size-x-large);\n  font-weight: var(--six-font-weight-bold);\n  line-height: var(--six-line-height-dense);\n  padding: var(--six-spacing-large) var(--six-spacing-large) var(--six-spacing-small);\n}\n\n.dialog__close {\n  flex: 0 0 auto;\n  display: flex;\n  align-items: center;\n  font-size: var(--six-font-size-x-large);\n  padding: 0 var(--six-spacing-x-small);\n}\n\n.dialog__body {\n  flex: 1 1 auto;\n  padding: var(--six-spacing-small) var(--six-spacing-large) var(--six-spacing-large);\n  overflow: auto;\n  -webkit-overflow-scrolling: touch;\n}\n\n.dialog__footer {\n  flex: 0 0 auto;\n  text-align: right;\n  padding: var(--six-spacing-large);\n\n  ::slotted(six-button:not(:first-of-type)) {\n    margin-left: var(--six-spacing-xx-small);\n  }\n}\n\n.dialog:not(.dialog--has-footer) .dialog__footer {\n  display: none;\n}\n\n.dialog__overlay {\n  position: fixed;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  background-color: var(--six-overlay-background-color);\n  opacity: 0;\n  transition: var(--six-transition-medium) opacity;\n}\n\n.dialog--open .dialog__overlay {\n  opacity: 0.8;\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { lockBodyScrolling, unlockBodyScrolling } from '../../utils/scroll';\nimport { hasSlot } from '../../utils/slot';\nimport Modal from '../../utils/modal';\nimport { EmptyPayload } from '../../utils/types';\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 dialog's content.\n * @slot label - The dialog's label. Alternatively, you can use the label prop.\n * @slot footer - The dialog's footer, usually one or more buttons representing various options.\n *\n * @part base - The component's base wrapper.\n * @part overlay - The overlay.\n * @part panel - The dialog panel (where the dialog and its content is rendered).\n * @part header - The dialog header.\n * @part title - The dialog title.\n * @part close-button - The close button.\n * @part body - The dialog body.\n * @part footer - The dialog footer.\n *\n */\n@Component({\n  tag: 'six-dialog',\n  styleUrl: 'six-dialog.scss',\n  shadow: true,\n})\nexport class SixDialog {\n  private componentId = `dialog-${++id}`;\n  private dialog?: HTMLElement;\n  private modal?: Modal;\n  private panel?: HTMLElement;\n  private willShow = false;\n  private willHide = false;\n\n  @Element() host!: HTMLSixDialogElement;\n\n  @State() hasFooter = false;\n  @State() isVisible = false;\n\n  /** Indicates whether the dialog is open. You can use this in lieu of the show/hide methods. */\n  @Prop({ mutable: true, reflect: true }) open = false;\n\n  /**\n   * The dialog's label as displayed in the header. You should always include a relevant label even when using\n   * `no-header`, as it is required for proper accessibility.\n   */\n  @Prop() label = '';\n\n  /**\n   * Set to true to disable the header. This will also remove the default close button, so please ensure you provide an\n   * easy, accessible way for users to dismiss the dialog.\n   */\n  @Prop() noHeader = false;\n\n  @Watch('open')\n  handleOpenChange() {\n    this.open ? this.show() : this.hide();\n  }\n\n  /** Emitted when the dialog opens. Calling `event.preventDefault()` will prevent it from being opened. */\n  @Event({ eventName: 'six-dialog-show' }) sixShow!: EventEmitter<EmptyPayload>;\n\n  /** Emitted after the dialog opens and all transitions are complete. */\n  @Event({ eventName: 'six-dialog-after-show' }) sixAfterShow!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the dialog closes. Calling `event.preventDefault()` will prevent it from being closed. */\n  @Event({ eventName: 'six-dialog-hide' }) sixHide!: EventEmitter<EmptyPayload>;\n\n  /** Emitted after the dialog closes and all transitions are complete. */\n  @Event({ eventName: 'six-dialog-after-hide' }) sixAfterHide!: EventEmitter<EmptyPayload>;\n\n  /**\n   * Emitted when the dialog opens and the panel gains focus. Calling `event.preventDefault()` will prevent focus and\n   * allow you to set it on a different element in the dialog, such as an input or button.\n   */\n  @Event({ eventName: 'six-dialog-initial-focus' }) sixInitialFocus!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the overlay is clicked. Calling `event.preventDefault()` will prevent the dialog from closing. */\n  @Event({ eventName: 'six-dialog-overlay-dismiss' }) sixOverlayDismiss!: EventEmitter<EmptyPayload>;\n\n  connectedCallback() {\n    this.modal = new Modal(this.host, {\n      onFocusOut: () => this.panel?.focus(),\n    });\n  }\n\n  componentWillLoad() {\n    this.handleSlotChange();\n  }\n\n  componentDidLoad() {\n    // Show on init if open\n    if (this.open) {\n      this.show();\n    }\n  }\n\n  disconnectedCallback() {\n    unlockBodyScrolling(this.host);\n  }\n\n  /** Shows the dialog */\n  @Method()\n  async show() {\n    if (this.willShow || this.modal == null || this.panel == null || this.dialog == null) {\n      return;\n    }\n    const panel = this.panel;\n\n    const sixShow = this.sixShow.emit();\n    if (sixShow.defaultPrevented) {\n      this.open = false;\n      return;\n    }\n\n    this.willShow = true;\n    this.isVisible = true;\n    this.open = true;\n    this.modal.activate();\n\n    lockBodyScrolling(this.host);\n\n    if (this.open) {\n      requestAnimationFrame(() => {\n        const sixInitialFocus = this.sixInitialFocus.emit();\n        if (!sixInitialFocus.defaultPrevented) {\n          panel.focus({ preventScroll: true });\n        }\n      });\n    }\n  }\n\n  /** Hides the dialog */\n  @Method()\n  async hide() {\n    if (this.willHide || this.modal == null) {\n      return;\n    }\n\n    const sixHide = this.sixHide.emit();\n    if (sixHide.defaultPrevented) {\n      this.open = true;\n      return;\n    }\n\n    this.willHide = true;\n    this.open = false;\n    this.modal.deactivate();\n\n    unlockBodyScrolling(this.host);\n  }\n\n  private handleCloseClick = () => {\n    this.hide();\n  };\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    if (event.key === 'Escape') {\n      this.hide();\n    }\n  };\n\n  private handleOverlayClick = () => {\n    const sixOverlayDismiss = this.sixOverlayDismiss.emit();\n\n    if (!sixOverlayDismiss.defaultPrevented) {\n      this.hide();\n    }\n  };\n\n  private handleSlotChange = () => {\n    this.hasFooter = hasSlot(this.host, 'footer');\n  };\n\n  private handleTransitionEnd = (event: TransitionEvent) => {\n    const target = event.target as HTMLElement;\n\n    // Ensure we only emit one event when the target element is no longer visible\n    if (event.propertyName === 'opacity' && target.classList.contains('dialog__panel')) {\n      this.isVisible = this.open;\n      this.willShow = false;\n      this.willHide = false;\n      this.open ? this.sixAfterShow.emit() : this.sixAfterHide.emit();\n    }\n  };\n\n  render() {\n    return (\n      <div\n        ref={(el) => (this.dialog = el)}\n        part=\"base\"\n        class={{\n          dialog: true,\n          'dialog--open': this.open,\n          'dialog--visible': this.isVisible,\n          'dialog--has-footer': this.hasFooter,\n        }}\n        onKeyDown={this.handleKeyDown}\n        onTransitionEnd={this.handleTransitionEnd}\n      >\n        <div part=\"overlay\" class=\"dialog__overlay\" onClick={this.handleOverlayClick} />\n\n        <div\n          ref={(el) => (this.panel = el)}\n          part=\"panel\"\n          class=\"dialog__panel\"\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-hidden={this.open ? 'false' : 'true'}\n          aria-label={this.noHeader ? this.label : null}\n          aria-labelledby={!this.noHeader ? `${this.componentId}-title` : null}\n          tabIndex={0}\n        >\n          {!this.noHeader && (\n            <header part=\"header\" class=\"dialog__header\">\n              <span part=\"title\" class=\"dialog__title\" id={`${this.componentId}-title`}>\n                <slot name=\"label\">\n                  {/* If there's no label, use an invisible character to prevent the heading from collapsing */}\n                  {this.label || String.fromCharCode(65279)}\n                </slot>\n              </span>\n              <six-icon-button\n                exportparts=\"base:close-button\"\n                class=\"dialog__close\"\n                name=\"close\"\n                onClick={this.handleCloseClick}\n              />\n            </header>\n          )}\n\n          <div part=\"body\" class=\"dialog__body\">\n            <slot />\n          </div>\n\n          <footer part=\"footer\" class=\"dialog__footer\">\n            <slot name=\"footer\" onSlotchange={this.handleSlotChange} />\n          </footer>\n        </div>\n      </div>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/ui-library/p-d717a2f2.entry.js

@@ -0,0 +1,2 @@
+import{r as a,c as r,h as i}from"./p-f93d8a4e.js";import{a as s}from"./p-0cebf1d2.js";import{a as t}from"./p-a1502802.js";const o=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}:host{display:inline-block;overflow:hidden}.tag{display:flex;align-items:center;border:solid 1px;font-family:var(--six-font-family);line-height:1;white-space:nowrap;user-select:none;cursor:default}.tag__content{text-overflow:ellipsis;overflow:hidden}.tag__clear::part(base){color:inherit;padding:0}.tag--info{color:var(--six-color-white);background-color:var(--six-color-web-rock-900);border-color:var(--six-color-web-rock-900)}.tag--success{color:var(--six-color-web-rock-900);border-color:var(--six-color-success-500);background-color:var(--six-color-success-500)}.tag--primary{color:var(--six-color-web-rock-900);border-color:var(--six-color-clay-50);background-color:var(--six-color-clay-50)}.tag--warning{color:var(--six-color-web-rock-900);border-color:var(--six-color-warning-700);background-color:var(--six-color-warning-700)}.tag--danger{color:var(--six-color-white);border-color:var(--six-color-danger-800);background-color:var(--six-color-danger-800)}.tag--action{color:var(--six-color-white);border-color:var(--six-color-action-500);background-color:var(--six-color-action-500)}.tag--small{font-size:var(--six-button-font-size-small);height:calc(var(--six-height-small) * 0.8);line-height:calc(var(--six-height-small) - var(--six-border-width) * 2);border-radius:var(--six-input-border-radius-small);padding:0 var(--six-spacing-x-small)}.tag--small .tag__clear{margin-left:var(--six-spacing-xx-small);margin-right:calc(-1 * var(--six-spacing-xxx-small))}.tag--medium{font-size:var(--six-button-font-size-medium);height:calc(var(--six-height-medium) * 0.8);line-height:calc(var(--six-height-medium) - var(--six-border-width) * 2);border-radius:var(--six-input-border-radius-medium);padding:0 var(--six-spacing-small)}.tag--medium .tag__clear{margin-left:var(--six-spacing-xx-small);margin-right:calc(-1 * var(--six-spacing-xx-small))}.tag--large{font-size:var(--six-button-font-size-large);height:calc(var(--six-height-large) * 0.8);line-height:calc(var(--six-height-large) - var(--six-border-width) * 2);border-radius:var(--six-input-border-radius-large);padding:0 var(--six-spacing-medium)}.tag--large .tag__clear{margin-left:var(--six-spacing-xx-small);margin-right:calc(-1 * var(--six-spacing-x-small))}.tag--pill{border-radius:var(--six-border-radius-pill)}";const e=o;const l=class{constructor(i){a(this,i);this.sixClear=r(this,"six-tag-clear",7);this.resizeObserver=new ResizeObserver(t((()=>this.updateTooltip())));this.updateTooltip=()=>{if(this.tooltipElement!=null&&this.contentSlotElement!=null&&this.contentElement!=null){this.tooltipElement.content=s(this.contentSlotElement);this.tooltipElement.disabled=!(this.contentElement.offsetWidth<this.contentElement.scrollWidth)}};this.handleClearClick=()=>{this.sixClear.emit()};this.type="primary";this.size="medium";this.pill=false;this.clearable=false}connectedCallback(){if(this.contentElement!=null){this.resizeObserver.observe(this.contentElement)}}componentDidLoad(){if(this.contentElement!=null){this.resizeObserver.observe(this.contentElement)}}disconnectedCallback(){this.resizeObserver.disconnect()}render(){return i("span",{key:"59306674f01f712bc2e9daa94716f53120855b5c",part:"base",class:{tag:true,"tag--primary":this.type==="primary","tag--success":this.type==="success","tag--info":this.type==="info","tag--warning":this.type==="warning","tag--danger":this.type==="danger","tag--action":this.type==="action","tag--text":this.type==="text","tag--small":this.size==="small","tag--medium":this.size==="medium","tag--large":this.size==="large","tag--pill":this.pill,"tag--clear":this.clearable}},i("six-tooltip",{key:"ed368646e7f65e5ad2976f22175512d48328da36",ref:a=>this.tooltipElement=a},i("span",{key:"21f45d81e1f0e4778d552b20d11cfcc88bec66ae",ref:a=>this.contentElement=a,part:"content",class:"tag__content"},i("slot",{key:"948620efe64b5a923cf8b65a2f8c3792bdf8e476",ref:a=>this.contentSlotElement=a}))),this.clearable&&i("six-icon-button",{exportparts:"base:clear-button",size:"xSmall",name:"clear",class:"tag__clear",onClick:this.handleClearClick}))}};l.style=e;export{l as six_tag};
+//# sourceMappingURL=p-d717a2f2.entry.js.map

package/dist/ui-library/p-d717a2f2.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["sixTagCss","SixTagStyle0","SixTag","this","resizeObserver","ResizeObserver","debounce","updateTooltip","tooltipElement","contentSlotElement","contentElement","content","getTextContent","disabled","offsetWidth","scrollWidth","handleClearClick","sixClear","emit","connectedCallback","observe","componentDidLoad","disconnectedCallback","disconnect","render","h","key","part","class","tag","type","size","pill","clearable","ref","el","exportparts","name","onClick"],"sources":["src/components/six-tag/six-tag.scss?tag=six-tag&encapsulation=shadow","src/components/six-tag/six-tag.tsx"],"sourcesContent":["@import 'src/global/component';\n\n:host {\n  display: inline-block;\n  overflow: hidden;\n}\n\n.tag {\n  display: flex;\n  align-items: center;\n  border: solid 1px;\n  font-family: var(--six-font-family);\n  line-height: 1;\n  white-space: nowrap;\n  user-select: none;\n  cursor: default;\n}\n\n.tag__content {\n  text-overflow: ellipsis;\n  overflow: hidden;\n}\n\n.tag__clear::part(base) {\n  color: inherit;\n  padding: 0;\n}\n\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n// Type modifiers\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n\n.tag--info {\n  color: var(--six-color-white);\n  background-color: var(--six-color-web-rock-900);\n  border-color: var(--six-color-web-rock-900);\n}\n\n.tag--success {\n  color: var(--six-color-web-rock-900);\n  border-color: var(--six-color-success-500);\n  background-color: var(--six-color-success-500);\n}\n\n.tag--primary {\n  color: var(--six-color-web-rock-900);\n  border-color: var(--six-color-clay-50);\n  background-color: var(--six-color-clay-50);\n}\n\n.tag--warning {\n  color: var(--six-color-web-rock-900);\n  border-color: var(--six-color-warning-700);\n  background-color: var(--six-color-warning-700);\n}\n\n.tag--danger {\n  color: var(--six-color-white);\n  border-color: var(--six-color-danger-800);\n  background-color: var(--six-color-danger-800);\n}\n\n.tag--action {\n  color: var(--six-color-white);\n  border-color: var(--six-color-action-500);\n  background-color: var(--six-color-action-500);\n}\n\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n// Size modifiers\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n\n.tag--small {\n  font-size: var(--six-button-font-size-small);\n  height: calc(var(--six-height-small) * 0.8);\n  line-height: calc(var(--six-height-small) - var(--six-border-width) * 2);\n  border-radius: var(--six-input-border-radius-small);\n  padding: 0 var(--six-spacing-x-small);\n\n  .tag__clear {\n    margin-left: var(--six-spacing-xx-small);\n    margin-right: calc(-1 * var(--six-spacing-xxx-small));\n  }\n}\n\n.tag--medium {\n  font-size: var(--six-button-font-size-medium);\n  height: calc(var(--six-height-medium) * 0.8);\n  line-height: calc(var(--six-height-medium) - var(--six-border-width) * 2);\n  border-radius: var(--six-input-border-radius-medium);\n  padding: 0 var(--six-spacing-small);\n\n  .tag__clear {\n    margin-left: var(--six-spacing-xx-small);\n    margin-right: calc(-1 * var(--six-spacing-xx-small));\n  }\n}\n\n.tag--large {\n  font-size: var(--six-button-font-size-large);\n  height: calc(var(--six-height-large) * 0.8);\n  line-height: calc(var(--six-height-large) - var(--six-border-width) * 2);\n  border-radius: var(--six-input-border-radius-large);\n  padding: 0 var(--six-spacing-medium);\n\n  .tag__clear {\n    margin-left: var(--six-spacing-xx-small);\n    margin-right: calc(-1 * var(--six-spacing-x-small));\n  }\n}\n\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n// Pill modifier\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n\n.tag--pill {\n  border-radius: var(--six-border-radius-pill);\n}\n","import { Component, Event, EventEmitter, h, Prop } from '@stencil/core';\nimport { EmptyPayload } from '../../utils/types';\nimport { getTextContent } from '../../utils/slot';\nimport { debounce } from '../../utils/execution-control';\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 tag's content.\n *\n * @part base - The component's base wrapper.\n * @part content - The tag content.\n * @part clear-button - The clear button.\n */\n\n@Component({\n  tag: 'six-tag',\n  styleUrl: 'six-tag.scss',\n  shadow: true,\n})\nexport class SixTag {\n  /** The tag's type. */\n  @Prop({ reflect: true }) type: 'primary' | 'success' | 'info' | 'warning' | 'danger' | 'action' | 'text' = 'primary';\n\n  /** The tag's size. */\n  @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n  /** Set to true to draw a pill-style tag with rounded edges. */\n  @Prop({ reflect: true }) pill = false;\n\n  /** Set to true to make the tag clearable. */\n  @Prop({ reflect: true }) clearable = false;\n\n  /** Emitted when the clear button is activated. */\n  @Event({ eventName: 'six-tag-clear' }) sixClear!: EventEmitter<EmptyPayload>;\n\n  private contentSlotElement: HTMLSlotElement | undefined;\n  private tooltipElement: HTMLSixTooltipElement | undefined;\n  private contentElement: HTMLElement | undefined;\n  private resizeObserver = new ResizeObserver(debounce(() => this.updateTooltip()));\n\n  connectedCallback() {\n    if (this.contentElement != null) {\n      this.resizeObserver.observe(this.contentElement);\n    }\n  }\n\n  componentDidLoad() {\n    if (this.contentElement != null) {\n      this.resizeObserver.observe(this.contentElement);\n    }\n  }\n\n  disconnectedCallback() {\n    this.resizeObserver.disconnect();\n  }\n\n  private updateTooltip = () => {\n    if (this.tooltipElement != null && this.contentSlotElement != null && this.contentElement != null) {\n      this.tooltipElement.content = getTextContent(this.contentSlotElement);\n      this.tooltipElement.disabled = !(this.contentElement.offsetWidth < this.contentElement.scrollWidth);\n    }\n  };\n\n  private handleClearClick = () => {\n    this.sixClear.emit();\n  };\n\n  render() {\n    return (\n      <span\n        part=\"base\"\n        class={{\n          tag: true,\n\n          // Types\n          'tag--primary': this.type === 'primary',\n          'tag--success': this.type === 'success',\n          'tag--info': this.type === 'info',\n          'tag--warning': this.type === 'warning',\n          'tag--danger': this.type === 'danger',\n          'tag--action': this.type === 'action',\n          'tag--text': this.type === 'text',\n\n          // Sizes\n          'tag--small': this.size === 'small',\n          'tag--medium': this.size === 'medium',\n          'tag--large': this.size === 'large',\n\n          // Modifers\n          'tag--pill': this.pill,\n          'tag--clear': this.clearable,\n        }}\n      >\n        <six-tooltip ref={(el) => (this.tooltipElement = el)}>\n          <span ref={(el) => (this.contentElement = el)} part=\"content\" class=\"tag__content\">\n            <slot ref={(el) => (this.contentSlotElement = el as HTMLSlotElement)} />\n          </span>\n        </six-tooltip>\n\n        {this.clearable && (\n          <six-icon-button\n            exportparts=\"base:clear-button\"\n            size=\"xSmall\"\n            name=\"clear\"\n            class=\"tag__clear\"\n            onClick={this.handleClearClick}\n          />\n        )}\n      </span>\n    );\n  }\n}\n"],"mappings":"0HAAA,MAAMA,EAAY,60EAClB,MAAAC,EAAeD,E,MCsBFE,EAAM,M,iEAmBTC,KAAAC,eAAiB,IAAIC,eAAeC,GAAS,IAAMH,KAAKI,mBAkBxDJ,KAAAI,cAAgB,KACtB,GAAIJ,KAAKK,gBAAkB,MAAQL,KAAKM,oBAAsB,MAAQN,KAAKO,gBAAkB,KAAM,CACjGP,KAAKK,eAAeG,QAAUC,EAAeT,KAAKM,oBAClDN,KAAKK,eAAeK,WAAaV,KAAKO,eAAeI,YAAcX,KAAKO,eAAeK,Y,GAInFZ,KAAAa,iBAAmB,KACzBb,KAAKc,SAASC,MAAM,E,UA3CqF,U,UAG7C,S,UAG9B,M,eAGK,K,CAUrC,iBAAAC,GACE,GAAIhB,KAAKO,gBAAkB,KAAM,CAC/BP,KAAKC,eAAegB,QAAQjB,KAAKO,e,EAIrC,gBAAAW,GACE,GAAIlB,KAAKO,gBAAkB,KAAM,CAC/BP,KAAKC,eAAegB,QAAQjB,KAAKO,e,EAIrC,oBAAAY,GACEnB,KAAKC,eAAemB,Y,CActB,MAAAC,GACE,OACEC,EAAA,QAAAC,IAAA,2CACEC,KAAK,OACLC,MAAO,CACLC,IAAK,KAGL,eAAgB1B,KAAK2B,OAAS,UAC9B,eAAgB3B,KAAK2B,OAAS,UAC9B,YAAa3B,KAAK2B,OAAS,OAC3B,eAAgB3B,KAAK2B,OAAS,UAC9B,cAAe3B,KAAK2B,OAAS,SAC7B,cAAe3B,KAAK2B,OAAS,SAC7B,YAAa3B,KAAK2B,OAAS,OAG3B,aAAc3B,KAAK4B,OAAS,QAC5B,cAAe5B,KAAK4B,OAAS,SAC7B,aAAc5B,KAAK4B,OAAS,QAG5B,YAAa5B,KAAK6B,KAClB,aAAc7B,KAAK8B,YAGrBR,EAAA,eAAAC,IAAA,2CAAaQ,IAAMC,GAAQhC,KAAKK,eAAiB2B,GAC/CV,EAAA,QAAAC,IAAA,2CAAMQ,IAAMC,GAAQhC,KAAKO,eAAiByB,EAAKR,KAAK,UAAUC,MAAM,gBAClEH,EAAA,QAAAC,IAAA,2CAAMQ,IAAMC,GAAQhC,KAAKM,mBAAqB0B,MAIjDhC,KAAK8B,WACJR,EAAA,mBACEW,YAAY,oBACZL,KAAK,SACLM,KAAK,QACLT,MAAM,aACNU,QAASnC,KAAKa,mB"}

package/dist/ui-library/p-d7739200.entry.js

@@ -0,0 +1,2 @@
+import{r as a,h as s,H as t,g as e}from"./p-f93d8a4e.js";const o=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}:host{display:block;font-family:var(--six-font-family)}.tab-panel{border:solid 1px transparent;padding:20px 20px}";const i=o;let r=0;const d=class{constructor(s){a(this,s);this.componentId=`tab-panel-${++r}`;this.name="";this.active=false}render(){return s(t,{key:"6b8958e2148c21062d9d871ffe7a016b2fa8a1c5",id:this.host.id||this.componentId,style:{display:this.active?"block":"none"}},s("div",{key:"a35fd74db0e878943ccc49d7f33746ac1f5fc221",part:"base",class:"tab-panel",role:"tabpanel","aria-selected":this.active?"true":"false","aria-hidden":this.active?"false":"true"},s("slot",{key:"6de9b87d93c055a9c4de931139c7da3a366a2aa1"})))}get host(){return e(this)}};d.style=i;export{d as six_tab_panel};
+//# sourceMappingURL=p-d7739200.entry.js.map

package/dist/ui-library/p-d7739200.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["sixTabPanelCss","SixTabPanelStyle0","id","SixTabPanel","this","componentId","render","h","Host","key","host","style","display","active","part","class","role"],"sources":["src/components/six-tab-panel/six-tab-panel.scss?tag=six-tab-panel&encapsulation=shadow","src/components/six-tab-panel/six-tab-panel.tsx"],"sourcesContent":["@import 'src/global/component';\n\n:host {\n  display: block;\n  font-family: var(--six-font-family);\n}\n\n.tab-panel {\n  border: solid 1px transparent;\n  padding: 20px 20px;\n}\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\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 tab panel's content.\n *\n * @part base - The component's base wrapper.\n */\n\n@Component({\n  tag: 'six-tab-panel',\n  styleUrl: 'six-tab-panel.scss',\n  shadow: true,\n})\nexport class SixTabPanel {\n  private componentId = `tab-panel-${++id}`;\n\n  @Element() host!: HTMLSixTabPanelElement;\n\n  /** The tab panel's name. */\n  @Prop() name = '';\n\n  /** When true, the tab panel will be shown. */\n  @Prop({ reflect: true }) active = false;\n\n  render() {\n    return (\n      // If the user didn't provide an ID, we'll set one, so we can link tabs and tab panels with aria labels\n      <Host id={this.host.id || this.componentId} style={{ display: this.active ? 'block' : 'none' }}>\n        <div\n          part=\"base\"\n          class=\"tab-panel\"\n          role=\"tabpanel\"\n          aria-selected={this.active ? 'true' : 'false'}\n          aria-hidden={this.active ? 'false' : 'true'}\n        >\n          <slot />\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAiB,6NACvB,MAAAC,EAAeD,ECCf,IAAIE,EAAK,E,MAkBIC,EAAW,M,yBACdC,KAAAC,YAAc,eAAeH,I,UAKtB,G,YAGmB,K,CAElC,MAAAI,GACE,OAEEC,EAACC,EAAI,CAAAC,IAAA,2CAACP,GAAIE,KAAKM,KAAKR,IAAME,KAAKC,YAAaM,MAAO,CAAEC,QAASR,KAAKS,OAAS,QAAU,SACpFN,EAAA,OAAAE,IAAA,2CACEK,KAAK,OACLC,MAAM,YACNC,KAAK,WAAU,gBACAZ,KAAKS,OAAS,OAAS,QAAO,cAChCT,KAAKS,OAAS,QAAU,QAErCN,EAAA,QAAAE,IAAA,8C"}

package/dist/ui-library/p-e080d5b6.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(r.mindate));case"maxdate":return i.replace("{maxdate}",a.format(r.maxdate));case"invaliddate":return i;case"custom":return r.text}}catch(a){console.warn(`no error message in '${e}' for error:`,r);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-e080d5b6.js.map

package/dist/ui-library/p-e080d5b6.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["languages","dateFormat","Intl","DateTimeFormat","getErrorMessage","language","error","message","translation","key","replace","String","requiredLength","requiredPattern","min","max","format","mindate","maxdate","text","e","console","warn","undefined","getLanguage","documentLang","document","documentElement","lang","includes","en","required","minlength","maxlength","pattern","email","requiredtrue","invaliddate","fr","de","it","es"],"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 }\n  | { key: 'maxdate'; maxdate: Date; actual: Date }\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('{mindate}', dateFormat.format(error.mindate));\n      case 'maxdate':\n        return message.replace('{maxdate}', dateFormat.format(error.maxdate));\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);\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"],"mappings":"MAAaA,EAAY,CAAC,KAAM,KAAM,KAAM,KAAM,MAGlD,MAAMC,EAAa,IAAIC,KAAKC,eAAe,S,SAmB3BC,EAAgBC,EAAoBC,GAClD,IACE,MAAMC,EAAUC,EAAYH,GAAUC,EAAMG,KAC5C,OAAQH,EAAMG,KACZ,IAAK,WACL,IAAK,eACL,IAAK,QACH,OAAOF,EACT,IAAK,YACL,IAAK,YACH,OAAOA,EAAQG,QAAQ,mBAAoBC,OAAOL,EAAMM,iBAC1D,IAAK,UACH,OAAOL,EAAQG,QAAQ,YAAaC,OAAOL,EAAMO,kBACnD,IAAK,MACH,OAAON,EAAQG,QAAQ,QAASC,OAAOL,EAAMQ,MAC/C,IAAK,MACH,OAAOP,EAAQG,QAAQ,QAASC,OAAOL,EAAMS,MAC/C,IAAK,UACH,OAAOR,EAAQG,QAAQ,YAAaT,EAAWe,OAAOV,EAAMW,UAC9D,IAAK,UACH,OAAOV,EAAQG,QAAQ,YAAaT,EAAWe,OAAOV,EAAMY,UAC9D,IAAK,cACH,OAAOX,EACT,IAAK,SACH,OAAOD,EAAMa,K,CAEjB,MAAOC,GACPC,QAAQC,KAAK,wBAAwBjB,gBAAwBC,GAC7D,OAAOiB,S,CAEX,C,SAEgBC,IACd,MAAMC,EAAeC,SAASC,gBAAgBC,KAC9C,GAAI5B,EAAU6B,SAASJ,GAAe,CACpC,OAAOA,C,CAET,MAAO,IACT,CAEA,MAAMjB,EAAwD,CAC5DsB,GAAI,CACFC,SAAU,8BACVC,UAAW,qDACXC,UAAW,yDACXC,QAAS,4DACTC,MAAO,sCACPrB,IAAK,uDACLC,IAAK,oDACLqB,aAAc,2BACdnB,QAAS,6CACTC,QAAS,8CACTmB,YAAa,8BAEfC,GAAI,CACFP,SAAU,6CACVC,UAAW,wDACXC,UAAW,0DACXC,QAAS,mEACTC,MAAO,4CACPrB,IAAK,0DACLC,IAAK,0DACLqB,aAAc,8CACdnB,QAAS,kDACTC,QAAS,kDACTmB,YAAa,oCAEfE,GAAI,CACFR,SAAU,oCACVC,UAAW,2DACXC,UAAW,0DACXC,QAAS,wEACTC,MAAO,mDACPrB,IAAK,2DACLC,IAAK,4DACLqB,aAAc,oCACdnB,QAAS,4DACTC,QAAS,2DACTmB,YAAa,2CAEfG,GAAI,CACFT,SAAU,sCACVC,UAAW,0DACXC,UAAW,8DACXC,QAAS,wEACTC,MAAO,kDACPrB,IAAK,4DACLC,IAAK,0DACLqB,aAAc,qCACdnB,QAAS,2DACTC,QAAS,2DACTmB,YAAa,8BAGfI,GAAI,CACFV,SAAU,iCACVC,UAAW,8DACXC,UAAW,+DACXC,QAAS,wEACTC,MAAO,oEACPrB,IAAK,wDACLC,IAAK,wDACLqB,aAAc,gCACdnB,QAAS,iEACTC,QAAS,gEACTmB,YAAa,mD"}

package/dist/ui-library/p-e1255160.js

@@ -0,0 +1,2 @@
+const o=()=>{};export{o as g};
+//# sourceMappingURL=p-e1255160.js.map

package/dist/ui-library/p-e1255160.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["globalScripts"],"sources":["@stencil/core/internal/app-globals"],"sourcesContent":["export const globalScripts = () => {};\n"],"mappings":"AAAY,MAACA,EAAgB,c"}

package/dist/ui-library/p-e3766acb.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as t,g as a}from"./p-f93d8a4e.js";const d=":host{display:block;overflow:hidden;height:inherit}.six-root{display:grid;grid-template:auto 1fr auto/auto 1fr auto;height:100%}.six-root__container--padded{padding:var(--six-spacing-xxx-large)}.six-root__left-sidebar{height:100%;overflow:scroll;grid-column:1/2}.six-root__right-sidebar{height:100%;overflow:scroll;grid-column:3/4}.six-root nav{overflow:hidden}header{grid-column:1/4;position:sticky;top:0;z-index:var(--six-z-index-header);margin-right:2px}main{height:100%;display:flex;flex-direction:column;justify-content:space-between;grid-column:2/3;overflow:auto}footer{grid-column:1/4}";const i=d;const o=class{constructor(t){e(this,t);this.padded=true;this.stage=null;this.version=""}render(){return t("host",{key:"d004ad641b82d656ccbb7b788a04d8befab64b47",class:"six-root"},t("header",{key:"cce9488ed3c0778120fb1c0ce040a74b8c3b18d6",part:"header"},this.stage&&t("six-stage-indicator",{stage:this.stage},this.version),t("slot",{key:"b5810a66f91e003d83ee9196e0c955b52773794a",name:"header"})),t("nav",{key:"8d7aa97373ddb660d7a6e5ab1b860736726b9ee7",class:"six-root__left-sidebar",part:"left-sidebar"},t("slot",{key:"ab612b588dedf3e3098cd6f423078ef2fdc83bed",name:"left-sidebar"})),t("main",{key:"2c6e91c192a5346302d6d0be19a4e43d190cf5d4",part:"main"},t("div",{key:"bb52732ddf5462b1d536444f0f584fa48ba5ee55",class:{"six-root__container":true,"six-root__container--padded":this.padded},part:"container"},t("slot",{key:"23db6d1c2426497e40e91ef7d7898f37e1977465",name:"main"})),t("div",{key:"f083d6d754ff7a502efe8f20663a423075f85e9f",class:"six-root__footer"},t("slot",{key:"d902e6b083181958e12f8f808b2dc98e2bb99dfd",name:"footer"}))),t("nav",{key:"05b158597d15d8536e8eb8ccc66f0ff971ebdc92",class:"six-root__right-sidebar",part:"right-sidebar"},t("slot",{key:"3a9168dbd5039344e948c22c822ca7f65648cb1f",name:"right-sidebar"})))}get host(){return a(this)}};o.style=i;export{o as six_root};
+//# sourceMappingURL=p-e3766acb.entry.js.map

package/dist/ui-library/p-e3766acb.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["sixRootCss","SixRootStyle0","SixRoot","render","h","key","class","part","this","stage","version","name","padded"],"sources":["src/components/six-root/six-root.scss?tag=six-root&encapsulation=shadow","src/components/six-root/six-root.tsx"],"sourcesContent":["@import 'src/global/mixins/scrollbar';\n\n:host {\n  display: block;\n  overflow: hidden;\n  height: inherit;\n}\n\n.six-root {\n  display: grid;\n  grid-template: auto 1fr auto / auto 1fr auto;\n  height: 100%;\n\n  &__container {\n    &--padded {\n      padding: var(--six-spacing-xxx-large);\n    }\n  }\n\n  &__left-sidebar {\n    height: 100%;\n    overflow: scroll;\n    grid-column: 1 / 2;\n  }\n\n  &__right-sidebar {\n    height: 100%;\n    overflow: scroll;\n    grid-column: 3 / 4;\n  }\n\n  nav {\n    overflow: hidden;\n  }\n}\n\nheader {\n  grid-column: 1 / 4;\n  position: sticky;\n  top: 0;\n  z-index: var(--six-z-index-header);\n  // border fix\n  margin-right: 2px;\n}\n\nmain {\n  height: 100%;\n\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n\n  grid-column: 2 / 3;\n  overflow: auto;\n}\n\nfooter {\n  grid-column: 1 / 4;\n}\n","import { Component, Element, h, Prop } from '@stencil/core';\nimport { StageType } from '../six-stage-indicator/six-stage-indicator';\n\n/**\n * @since 1.0\n * @status stable\n *\n * @slot header - Used to define the header component.\n * @slot main - Used to define the components in the main area.\n * @slot left-sidebar - Used to define the sidebar on the left side.\n * @slot right-sidebar - Used to define the sidebar on the right side.\n * @slot footer - Used to define the footer component.\n */\n\n@Component({\n  tag: 'six-root',\n  styleUrl: 'six-root.scss',\n  shadow: true,\n})\nexport class SixRoot {\n  @Element() host!: HTMLSixRootElement;\n\n  /** Defines whether the content section should be padded */\n  // eslint-disable-next-line @stencil-community/ban-default-true\n  @Prop() padded = true;\n\n  /** Defines the stage of the application*/\n  @Prop() stage: StageType = null;\n\n  /** Defines the version of the application*/\n  @Prop() version = '';\n\n  render() {\n    return (\n      <host class=\"six-root\">\n        <header part=\"header\">\n          {this.stage && <six-stage-indicator stage={this.stage}>{this.version}</six-stage-indicator>}\n          <slot name=\"header\" />\n        </header>\n        <nav class=\"six-root__left-sidebar\" part=\"left-sidebar\">\n          <slot name=\"left-sidebar\" />\n        </nav>\n        <main part=\"main\">\n          <div class={{ 'six-root__container': true, 'six-root__container--padded': this.padded }} part=\"container\">\n            <slot name=\"main\" />\n          </div>\n          <div class=\"six-root__footer\">\n            <slot name=\"footer\" />\n          </div>\n        </main>\n        <nav class=\"six-root__right-sidebar\" part=\"right-sidebar\">\n          <slot name=\"right-sidebar\" />\n        </nav>\n      </host>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAa,mlBACnB,MAAAC,EAAeD,E,MCkBFE,EAAO,M,qCAKD,K,WAGU,K,aAGT,E,CAElB,MAAAC,GACE,OACEC,EAAA,QAAAC,IAAA,2CAAMC,MAAM,YACVF,EAAA,UAAAC,IAAA,2CAAQE,KAAK,UACVC,KAAKC,OAASL,EAAA,uBAAqBK,MAAOD,KAAKC,OAAQD,KAAKE,SAC7DN,EAAA,QAAAC,IAAA,2CAAMM,KAAK,YAEbP,EAAA,OAAAC,IAAA,2CAAKC,MAAM,yBAAyBC,KAAK,gBACvCH,EAAA,QAAAC,IAAA,2CAAMM,KAAK,kBAEbP,EAAA,QAAAC,IAAA,2CAAME,KAAK,QACTH,EAAA,OAAAC,IAAA,2CAAKC,MAAO,CAAE,sBAAuB,KAAM,8BAA+BE,KAAKI,QAAUL,KAAK,aAC5FH,EAAA,QAAAC,IAAA,2CAAMM,KAAK,UAEbP,EAAA,OAAAC,IAAA,2CAAKC,MAAM,oBACTF,EAAA,QAAAC,IAAA,2CAAMM,KAAK,aAGfP,EAAA,OAAAC,IAAA,2CAAKC,MAAM,0BAA0BC,KAAK,iBACxCH,EAAA,QAAAC,IAAA,2CAAMM,KAAK,mB"}

package/dist/ui-library/p-e43e5e45.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as i,h as s,g as e}from"./p-f93d8a4e.js";import{g as r}from"./p-0cebf1d2.js";const a=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}:host{display:contents;margin:0}.alert{position:relative;display:flex;align-items:stretch;background-color:var(--six-color-white);border:solid 1px var(--six-color-web-rock-200);border-top-width:3px;border-radius:var(--six-border-radius-medium);box-shadow:var(--box-shadow);font-family:var(--six-font-sans);font-size:var(--six-font-size-small);font-weight:var(--six-font-weight-normal);line-height:1.6;color:var(--six-color-web-rock-700);opacity:0;transform:scale(0.9);transition:var(--six-transition-medium) opacity ease, var(--six-transition-medium) transform ease;margin:inherit}.alert:not(.alert--visible){position:absolute;width:1px;height:1px;clip:rect(0 0 0 0);clip-path:inset(50%);overflow:hidden;pointer-events:none;visibility:hidden}.alert--shadow{box-shadow:var(--six-shadow-medium)}.alert--open{opacity:1;transform:none}.alert__icon{flex:0 0 auto;display:flex;align-items:center;font-size:var(--six-font-size-large)}.alert__icon ::slotted(*){margin-left:var(--six-spacing-large)}.alert--primary{border-top-color:var(--six-color-web-rock-900)}.alert--primary .alert__icon{color:var(--six-color-web-rock-900)}.alert--success{border-top-color:var(--six-color-success-600)}.alert--success .alert__icon{color:var(--six-color-success-600)}.alert--info{border-top-color:var(--six-color-action-500)}.alert--info .alert__icon{color:var(--six-color-action-500)}.alert--warning{border-top-color:var(--six-color-warning-800)}.alert--warning .alert__icon{color:var(--six-color-warning-800)}.alert--danger{border-top-color:var(--six-color-danger-900)}.alert--danger .alert__icon{color:var(--six-color-danger-900)}.alert__message{flex:1 1 auto;padding:var(--six-spacing-large);overflow:hidden}.alert__close{flex:0 0 auto;display:flex;align-items:center;font-size:var(--six-font-size-large);padding-right:var(--six-spacing-medium)}";const o=a;const n=Object.assign(document.createElement("div"),{className:"six-toast-stack"});const l=class{constructor(s){t(this,s);this.sixShow=i(this,"six-alert-show",7);this.sixAfterShow=i(this,"six-alert-after-show",7);this.sixHide=i(this,"six-alert-hide",7);this.sixAfterHide=i(this,"six-alert-after-hide",7);this.handleCloseClick=()=>{this.hide()};this.handleMouseEnter=()=>{this.pauseAutoHide()};this.handleMouseLeave=()=>{this.resetAutoHide()};this.handleTransitionEnd=t=>{const i=t.target;if(t.propertyName==="opacity"&&i.classList.contains("alert")){this.isVisible=this.open;this.open?this.sixAfterShow.emit():this.sixAfterHide.emit()}};this.isVisible=false;this.open=false;this.closable=false;this.type="primary";this.duration=Infinity}handleOpenChange(){this.open?this.show():this.hide()}handleDurationChange(){this.restartAutoHide()}componentWillLoad(){if(this.open){this.show()}}async show(){if(this.isVisible){return}const t=this.sixShow.emit();if(t.defaultPrevented){this.open=false;return}this.isVisible=true;this.open=true;if(this.duration<Infinity){this.autoHideTimeout=window.setTimeout((()=>this.hide()),this.duration)}}async hide(){if(!this.isVisible){return}const t=this.sixHide.emit();if(t.defaultPrevented){this.open=true;return}clearTimeout(this.autoHideTimeout);this.isVisible=false;this.open=false}async toast(t=true){return new Promise((i=>{var s;if(!n.parentElement){document.body.append(n)}n.append(this.host);if(t){const t=document.querySelector("six-root");const i=r(t,"header");const e=(s=t===null||t===void 0?void 0:t.shadowRoot)===null||s===void 0?void 0:s.querySelector("host main");if(e!=null&&e instanceof HTMLElement){const t=e.offsetWidth-e.clientWidth;n.style.right=`${t}px`}if(i!=null){const t=i===null||i===void 0?void 0:i.getBoundingClientRect();n.style.top=`${t.top+t.height}px`}}else{n.style.top="0";n.style.right="0"}requestAnimationFrame((()=>this.show()));this.host.addEventListener("six-alert-after-hide",(()=>{this.host.remove();i();if(n.querySelector("six-alert")===null){n.remove()}}),{once:true})}))}pauseAutoHide(){clearTimeout(this.autoHideTimeout)}resetAutoHide(){if(this.open&&this.duration<Infinity){this.autoHideTimeout=window.setTimeout((()=>this.hide()),this.duration)}}restartAutoHide(){this.pauseAutoHide();this.resetAutoHide()}render(){const t=this.host.closest(".six-toast-stack")!=null;return s("div",{key:"cd9d14bef5923cf2ec8add1f61e92733aa9dd59f",part:"base",class:{alert:true,"alert--open":this.open,"alert--visible":this.isVisible,"alert--closable":this.closable,"alert--primary":this.type==="primary","alert--success":this.type==="success","alert--info":this.type==="info","alert--warning":this.type==="warning","alert--danger":this.type==="danger","alert--shadow":t},role:"alert","aria-live":"assertive","aria-atomic":"true","aria-hidden":this.open?"false":"true",onTransitionEnd:this.handleTransitionEnd,onMouseEnter:this.handleMouseEnter,onMouseLeave:this.handleMouseLeave},s("span",{key:"fb6e8cf52eb87ddb1a81a797482457b3afccaa98",part:"icon",class:"alert__icon"},s("slot",{key:"3d97a399ac05620214ef8a4d6a19c37a103f76a2",name:"icon"})),s("span",{key:"3984ce04838d33a688b6cfafb7827646e0e9d582",part:"message",class:"alert__message"},s("slot",{key:"f84ff31b7b74571b2ff9f074b617cb344313939e"})),this.closable&&s("span",{class:"alert__close"},s("six-icon-button",{name:"clear",exportparts:"base:close-button",onClick:this.handleCloseClick})))}get host(){return e(this)}static get watchers(){return{open:["handleOpenChange"],duration:["handleDurationChange"]}}};l.style=o;export{l as six_alert};
+//# sourceMappingURL=p-e43e5e45.entry.js.map

package/dist/ui-library/p-e43e5e45.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["sixAlertCss","SixAlertStyle0","toastStack","Object","assign","document","createElement","className","SixAlert","this","handleCloseClick","hide","handleMouseEnter","pauseAutoHide","handleMouseLeave","resetAutoHide","handleTransitionEnd","event","target","propertyName","classList","contains","isVisible","open","sixAfterShow","emit","sixAfterHide","Infinity","handleOpenChange","show","handleDurationChange","restartAutoHide","componentWillLoad","sixShow","defaultPrevented","duration","autoHideTimeout","window","setTimeout","sixHide","clearTimeout","toast","adjustPosition","Promise","resolve","parentElement","body","append","host","sixRoot","querySelector","headerSlot","getSlot","mainSlot","_a","shadowRoot","HTMLElement","scrollbarWidth","offsetWidth","clientWidth","style","right","rect","getBoundingClientRect","top","height","requestAnimationFrame","addEventListener","remove","once","render","asToast","closest","h","key","part","class","alert","closable","type","role","onTransitionEnd","onMouseEnter","onMouseLeave","name","exportparts","onClick"],"sources":["src/components/six-alert/six-alert.scss?tag=six-alert&encapsulation=shadow","src/components/six-alert/six-alert.tsx"],"sourcesContent":["@import 'src/global/component';\n@import 'src/global/mixins/hidden';\n\n/**\n * @prop --box-shadow: The alert's box shadow.\n */\n:host {\n  display: contents;\n\n  // For better DX, we'll reset the margin here so the base part can inherit it\n  margin: 0;\n}\n\n.alert {\n  position: relative;\n  display: flex;\n  align-items: stretch;\n  background-color: var(--six-color-white);\n  border: solid 1px var(--six-color-web-rock-200);\n  border-top-width: 3px;\n  border-radius: var(--six-border-radius-medium);\n  box-shadow: var(--box-shadow);\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: 1.6;\n  color: var(--six-color-web-rock-700);\n  opacity: 0;\n  transform: scale(0.9);\n  transition: var(--six-transition-medium) opacity ease, var(--six-transition-medium) transform ease;\n  margin: inherit;\n\n  &:not(.alert--visible) {\n    @include hidden;\n  }\n}\n\n.alert--shadow {\n  box-shadow: var(--six-shadow-medium);\n}\n\n.alert--open {\n  opacity: 1;\n  transform: none;\n}\n\n.alert__icon {\n  flex: 0 0 auto;\n  display: flex;\n  align-items: center;\n  font-size: var(--six-font-size-large);\n\n  ::slotted(*) {\n    margin-left: var(--six-spacing-large);\n  }\n}\n\n.alert--primary {\n  border-top-color: var(--six-color-web-rock-900);\n\n  .alert__icon {\n    color: var(--six-color-web-rock-900);\n  }\n}\n\n.alert--success {\n  border-top-color: var(--six-color-success-600);\n\n  .alert__icon {\n    color: var(--six-color-success-600);\n  }\n}\n\n.alert--info {\n  border-top-color: var(--six-color-action-500);\n\n  .alert__icon {\n    color: var(--six-color-action-500);\n  }\n}\n\n.alert--warning {\n  border-top-color: var(--six-color-warning-800);\n\n  .alert__icon {\n    color: var(--six-color-warning-800);\n  }\n}\n\n.alert--danger {\n  border-top-color: var(--six-color-danger-900);\n\n  .alert__icon {\n    color: var(--six-color-danger-900);\n  }\n}\n\n.alert__message {\n  flex: 1 1 auto;\n  padding: var(--six-spacing-large);\n  overflow: hidden;\n}\n\n.alert__close {\n  flex: 0 0 auto;\n  display: flex;\n  align-items: center;\n  font-size: var(--six-font-size-large);\n  padding-right: var(--six-spacing-medium);\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { EmptyPayload } from '../../utils/types';\nimport { getSlot } from '../../utils/slot';\n\nconst toastStack = Object.assign(document.createElement('div'), { className: 'six-toast-stack' });\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 alert's content.\n * @slot icon - An icon to show in the alert.\n *\n * @part base - The component's base wrapper.\n * @part icon - The container that wraps the alert icon.\n * @part message - The alert message.\n * @part close-button - The close button.\n */\n\n@Component({\n  tag: 'six-alert',\n  styleUrl: 'six-alert.scss',\n  shadow: true,\n})\nexport class SixAlert {\n  private autoHideTimeout?: number;\n\n  @Element() host!: HTMLSixAlertElement;\n\n  @State() isVisible = false;\n\n  /** Indicates whether or not the alert is open. You can use this in lieu of the show/hide methods. */\n  @Prop({ mutable: true, reflect: true }) open = false;\n\n  /** Set to true to make the alert closable. */\n  @Prop({ reflect: true }) closable = false;\n\n  /** The type of alert. */\n  @Prop({ reflect: true }) type: AlertType = 'primary';\n\n  /**\n   * The length of time, in milliseconds, the alert will show before closing itself.\n   * If the user hovers over the toast alert, the timer will pause.\n   * On leaving the element with the mouse, the timer resets.\n   */\n  @Prop() duration = Infinity;\n\n  @Watch('open')\n  handleOpenChange() {\n    this.open ? this.show() : this.hide();\n  }\n\n  @Watch('duration')\n  handleDurationChange() {\n    this.restartAutoHide();\n  }\n\n  /** Emitted when the alert opens. Calling `event.preventDefault()` will prevent it from being opened. */\n  @Event({ eventName: 'six-alert-show' }) sixShow!: EventEmitter<EmptyPayload>;\n\n  /** Emitted after the alert opens and all transitions are complete. */\n  @Event({ eventName: 'six-alert-after-show' }) sixAfterShow!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the alert closes. Calling `event.preventDefault()` will prevent it from being closed. */\n  @Event({ eventName: 'six-alert-hide' }) sixHide!: EventEmitter<EmptyPayload>;\n\n  /** Emitted after the alert closes and all transitions are complete. */\n  @Event({ eventName: 'six-alert-after-hide' }) sixAfterHide!: EventEmitter<EmptyPayload>;\n\n  componentWillLoad() {\n    // Show on init if open\n    if (this.open) {\n      this.show();\n    }\n  }\n\n  /** Shows the alert. */\n  @Method()\n  async show() {\n    // Prevent subsequent calls to the method, whether manually or triggered by the `open` watcher\n    if (this.isVisible) {\n      return;\n    }\n\n    const sixShow = this.sixShow.emit();\n    if (sixShow.defaultPrevented) {\n      this.open = false;\n      return;\n    }\n\n    this.isVisible = true;\n    this.open = true;\n\n    if (this.duration < Infinity) {\n      this.autoHideTimeout = window.setTimeout(() => this.hide(), this.duration);\n    }\n  }\n\n  /** Hides the alert */\n  @Method()\n  async hide() {\n    // Prevent subsequent calls to the method, whether manually or triggered by the `open` watcher\n    if (!this.isVisible) {\n      return;\n    }\n\n    const sixHide = this.sixHide.emit();\n    if (sixHide.defaultPrevented) {\n      this.open = true;\n      return;\n    }\n\n    clearTimeout(this.autoHideTimeout);\n    this.isVisible = false;\n    this.open = false;\n  }\n\n  /**\n   * Displays the alert as a toast notification. This will move the alert out of its position in the DOM and, when\n   * dismissed, it will be removed from the DOM completely. By storing a reference to the alert, you can reuse it by\n   * calling this method again. The returned promise will resolve after the alert is hidden.\n   * @param adjustPosition  If true, the top and right position of the toast stack is shifted according to the\n   *                        six-root header's height and the presence of a vertical scrollbar.\n   */\n  @Method()\n  async toast(adjustPosition = true) {\n    return new Promise<void>((resolve) => {\n      if (!toastStack.parentElement) {\n        document.body.append(toastStack);\n      }\n      toastStack.append(this.host);\n\n      if (adjustPosition) {\n        const sixRoot = document.querySelector('six-root');\n        const headerSlot = getSlot(sixRoot, 'header');\n        const mainSlot = sixRoot?.shadowRoot?.querySelector('host main');\n        if (mainSlot != null && mainSlot instanceof HTMLElement) {\n          const scrollbarWidth = mainSlot.offsetWidth - mainSlot.clientWidth;\n          toastStack.style.right = `${scrollbarWidth}px`;\n        }\n        if (headerSlot != null) {\n          const rect = headerSlot?.getBoundingClientRect();\n          toastStack.style.top = `${rect.top + rect.height}px`;\n        }\n      } else {\n        toastStack.style.top = '0';\n        toastStack.style.right = '0';\n      }\n\n      requestAnimationFrame(() => this.show());\n\n      this.host.addEventListener(\n        'six-alert-after-hide',\n        () => {\n          this.host.remove();\n          resolve();\n\n          // Remove the toast stack from the DOM when there are no more alerts\n          if (toastStack.querySelector('six-alert') === null) {\n            toastStack.remove();\n          }\n        },\n        { once: true }\n      );\n    });\n  }\n\n  private pauseAutoHide() {\n    clearTimeout(this.autoHideTimeout);\n  }\n\n  private resetAutoHide() {\n    if (this.open && this.duration < Infinity) {\n      this.autoHideTimeout = window.setTimeout(() => this.hide(), this.duration);\n    }\n  }\n\n  private restartAutoHide() {\n    this.pauseAutoHide();\n    this.resetAutoHide();\n  }\n\n  private handleCloseClick = () => {\n    this.hide();\n  };\n\n  private handleMouseEnter = () => {\n    this.pauseAutoHide();\n  };\n\n  private handleMouseLeave = () => {\n    this.resetAutoHide();\n  };\n\n  private handleTransitionEnd = (event: TransitionEvent) => {\n    const target = event.target as HTMLElement;\n\n    // Ensure we only emit one event when the target element is no longer visible\n    if (event.propertyName === 'opacity' && target.classList.contains('alert')) {\n      this.isVisible = this.open;\n      this.open ? this.sixAfterShow.emit() : this.sixAfterHide.emit();\n    }\n  };\n\n  render() {\n    const asToast = this.host.closest('.six-toast-stack') != null;\n\n    return (\n      <div\n        part=\"base\"\n        class={{\n          alert: true,\n          'alert--open': this.open,\n          'alert--visible': this.isVisible,\n          'alert--closable': this.closable,\n          'alert--primary': this.type === 'primary',\n          'alert--success': this.type === 'success',\n          'alert--info': this.type === 'info',\n          'alert--warning': this.type === 'warning',\n          'alert--danger': this.type === 'danger',\n          'alert--shadow': asToast,\n        }}\n        role=\"alert\"\n        aria-live=\"assertive\"\n        aria-atomic=\"true\"\n        aria-hidden={this.open ? 'false' : 'true'}\n        onTransitionEnd={this.handleTransitionEnd}\n        onMouseEnter={this.handleMouseEnter}\n        onMouseLeave={this.handleMouseLeave}\n      >\n        <span part=\"icon\" class=\"alert__icon\">\n          <slot name=\"icon\" />\n        </span>\n\n        <span part=\"message\" class=\"alert__message\">\n          <slot />\n        </span>\n\n        {this.closable && (\n          <span class=\"alert__close\">\n            <six-icon-button\n              name=\"clear\"\n              exportparts=\"base:close-button\"\n              onClick={this.handleCloseClick}\n            ></six-icon-button>\n          </span>\n        )}\n      </div>\n    );\n  }\n}\n\nexport type AlertType = 'primary' | 'success' | 'info' | 'warning' | 'danger';\n"],"mappings":"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"}

package/dist/ui-library/p-e798314b.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as i,h as s,g as e}from"./p-f93d8a4e.js";import{P as n}from"./p-7f856f00.js";import{E as o}from"./p-8bfb4bfc.js";import{a as r,D as h}from"./p-a1502802.js";import{a as l}from"./p-0cebf1d2.js";function a(t){const i=t.tabIndex;return i>-1}function d(t){if(a(t)){return t}if(t.shadowRoot!=null){const i=[...t.shadowRoot.children].find((t=>a(t)));if(i!=null){return i}}if(t.children!=null){return[...t.children].map((t=>d(t))).at(0)}return undefined}const u=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}:host{display:inline-block}.dropdown{position:relative}.dropdown__trigger{display:block}.dropdown__positioner{position:absolute;z-index:var(--six-z-index-dropdown)}.dropdown__positioner__filtered{width:100%}.dropdown__panel{font-family:var(--six-font-sans);font-size:var(--six-font-size-small);font-weight:var(--six-font-weight-normal);color:var(--color);background-color:var(--six-panel-background-color);border-radius:var(--six-border-radius-medium);border:1px solid var(--six-color-web-rock-300);box-shadow:var(--six-shadow-small);opacity:0;pointer-events:none;transform:scale(0.9);transition:var(--six-transition-fast) opacity, var(--six-transition-fast) transform;max-width:90vw}.dropdown__panel__scroll{max-height:18.75rem;overflow-y:auto;overflow-x:hidden;overscroll-behavior:none}.dropdown__panel__scroll--virtual{overflow-y:hidden;overflow-x:hidden}.filter-hidden{display:none}.dropdown__positioner[data-popper-placement^=top] .dropdown__panel{transform-origin:bottom}.dropdown__positioner[data-popper-placement^=bottom] .dropdown__panel{transform-origin:top}.dropdown__positioner[data-popper-placement^=left] .dropdown__panel{transform-origin:right}.dropdown__positioner[data-popper-placement^=right] .dropdown__panel{transform-origin:left}.dropdown__positioner.popover-visible .dropdown__panel{opacity:1;transform:none;pointer-events:all}.filter{border-bottom:1px solid var(--six-color-web-rock-300)}.filter__icon{color:var(--six-color-web-rock-600)}";const c=u;let f=0;const p=class{constructor(e){t(this,e);this.sixShow=i(this,"six-dropdown-show",7);this.sixAfterShow=i(this,"six-dropdown-after-show",7);this.sixHide=i(this,"six-dropdown-hide",7);this.sixAfterHide=i(this,"six-dropdown-after-hide",7);this.sixAutoFilter=i(this,"six-dropdown-auto-filter-fired",7);this.sixAsyncFilterFired=i(this,"six-async-filter-fired",7);this.sixScroll=i(this,"six-dropdown-scroll",7);this.componentId=`dropdown-${++f}`;this.isVisible=false;this.resizeObserver=new ResizeObserver(r((()=>this.updatePanelPosition()),100));this.eventListeners=new o;this.getMenuItems=()=>{var t,i,e,n;if(this.options.length>0){return{sixMenuItems:this.renderedOptions.map((t=>s("six-menu-item",{value:t.value},t.label))),selectionContainerItems:[]}}if(this.panel==null)return{sixMenuItems:[],selectionContainerItems:[]};const o=(t=this.panelSlot)===null||t===void 0?void 0:t.assignedElements({flatten:true}).filter(w).at(0);const r=(i=this.panelSlot)===null||i===void 0?void 0:i.assignedElements({flatten:true}).filter(v).at(0);const h=(o===null||o===void 0?void 0:o.querySelectorAll("six-menu-item"))||[];let l=((e=r===null||r===void 0?void 0:r.querySelector("slot"))===null||e===void 0?void 0:e.assignedElements().filter((t=>m(t))))||[];if(l.length===0){l=Array.from(((n=r===null||r===void 0?void 0:r.shadowRoot)===null||n===void 0?void 0:n.querySelectorAll("six-menu-item"))||[])}if(h.length>0||l.length>0){return{sixMenuItems:l,selectionContainerItems:[...h]}}else{return{sixMenuItems:r?Array.from(r.querySelectorAll("six-menu-item")):[],selectionContainerItems:[]}}};this.handleDocumentKeyDown=t=>{var i;const s=t;if(s.key==="Escape"){void this.hide();this.focusOnTrigger();return}if(this.filterInputElement===((i=this.host.shadowRoot)===null||i===void 0?void 0:i.activeElement)){if(s.key==="ArrowDown"){const{sixMenuItems:t,selectionContainerItems:i}=this.getMenuItems();const s=[...i,...t].find((t=>t.style.display!=="none"));if(s!=null){s.setFocus()}}}if(s.key==="Tab"){if(this.open&&document.activeElement!=null&&m(document.activeElement)){s.preventDefault();void this.hide();this.focusOnTrigger();return}setTimeout((()=>{var t,i;const s=this.container.getRootNode()instanceof ShadowRoot?(i=(t=document.activeElement)===null||t===void 0?void 0:t.shadowRoot)===null||i===void 0?void 0:i.activeElement:document.activeElement;if((s===null||s===void 0?void 0:s.closest(this.container.tagName.toLowerCase()))!==this.container){void this.hide();return}}))}};this.handleDocumentMouseDown=t=>{const i=t.composedPath();if(!i.includes(this.container)){void this.hide();return}};this.handlePanelSelect=t=>{const i=t.target;if(this.closeOnSelect&&v(i)){void this.hide();this.focusOnTrigger()}};this.handleTriggerClick=()=>{this.open?this.hide():this.show()};this.handleTriggerKeyDown=t=>{if(t.key==="Escape"){this.focusOnTrigger();void this.hide();return}if(!this.disableHideOnEnterAndSpace&&[" ","Enter"].includes(t.key)){t.preventDefault();this.open?void this.hide():void this.show();return}const i=this.getMenu();if(["ArrowDown","ArrowUp"].includes(t.key)){t.preventDefault();if(!this.open){void this.show()}if(i==null){return}const s=[...i.querySelectorAll("six-menu-item")];const e=s.at(0);const n=s.at(s.length-1);if(t.key==="ArrowDown"&&e!=null){e.setFocus();return}if(t.key==="ArrowUp"&&n!=null){n.setFocus();return}}const s=["Tab","Shift","Meta","Ctrl","Alt"];if(this.open&&i!=null&&!s.includes(t.key)){void i.typeToSelect(t.key);return}};this.handleTriggerKeyUp=t=>{if(t.key===" "){t.preventDefault()}};this.handleTriggerSlotChange=()=>{this.updateAccessibleTrigger()};this.handleDropdownScroll=()=>{if(this.scrollPanel==null)return;this.sixScroll.emit({scrollHeight:this.scrollPanel.scrollHeight,scrollTop:this.scrollPanel.scrollTop,scrollbarHeight:this.scrollPanel.offsetHeight*(this.scrollPanel.offsetHeight/this.scrollPanel.scrollHeight),scrollRatio:this.scrollPanel.scrollTop/(this.scrollPanel.scrollHeight-this.scrollPanel.clientHeight)})};this.open=false;this.placement="bottom-start";this.closeOnSelect=true;this.distance=4;this.skidding=0;this.hoist=false;this.containingElement=undefined;this.filter=false;this.asyncFilter=false;this.filterPlaceholder="Filter...";this.autofocusFilter=true;this.filterDebounce=0;this.disableHideOnEnterAndSpace=false;this.options=[];this.virtualScroll=false;this.matchTriggerWidth=false;this.renderedOptions=[]}get filterEnabled(){return this.filter||this.asyncFilter}get container(){return this.containingElement||this.host}handleOpenChange(){this.open?this.show():this.hide();this.updateAccessibleTrigger()}handlePopoverOptionsChange(){if(this.popover==null)return;this.popover.setOptions({strategy:this.hoist?"fixed":"absolute",placement:this.placement,distance:this.distance,skidding:this.skidding})}handleOptionsChange(){this.validateOptions()}validateOptions(){if(!Array.isArray(this.options)){this.options=[]}if(this.virtualScroll&&this.options.length===0){console.error("Options must be defined when using virtual scrolling")}this.renderedOptions=[...this.options]}componentWillLoad(){this.validateOptions();if(this.asyncFilter){this.filterDebounce=h}}componentDidLoad(){this.init();if(this.open){void this.show()}}connectedCallback(){this.init()}init(){this.initPopover();const t=this.filterInputElement;if(t!=null){this.eventListeners.add(t,"six-input-input",r((()=>{var i;const s=(i=t.value)!==null&&i!==void 0?i:"";if(this.filter){this.applyFilter(s)}this.emitFilterEvents(s)}),this.filterDebounce))}}applyFilter(t){var i;const s=((i=t.toLowerCase())===null||i===void 0?void 0:i.trim())||"";if(this.options.length>0){this.renderedOptions=this.options.filter((t=>{var i,e,n,o;return t.label&&((e=(i=String(t.label))===null||i===void 0?void 0:i.toLowerCase())===null||e===void 0?void 0:e.includes(s))||t.value&&((o=(n=String(t.value))===null||n===void 0?void 0:n.toLowerCase())===null||o===void 0?void 0:o.includes(s))}))}else{const{selectionContainerItems:t,sixMenuItems:i}=this.getMenuItems();const e=t.map((t=>t.value));t.forEach((async t=>{t.style.display=await b(t,s)?"unset":"none"}));i.forEach((async t=>{t.style.display=await b(t,s)&&!e.includes(t.value)?"unset":"none"}))}}resetFilter(){if(this.filterInputElement!=null){this.filterInputElement.value="";this.emitFilterEvents("")}if(this.options.length>0){this.renderedOptions=[...this.options]}else{const{selectionContainerItems:t,sixMenuItems:i}=this.getMenuItems();[...t,...i].forEach((t=>t.style.display="unset"))}}emitFilterEvents(t){if(this.filter){this.sixAutoFilter.emit({filterValue:t})}else if(this.asyncFilter){this.sixAsyncFilterFired.emit({filterValue:t})}}initPopover(){if(this.trigger==null||this.positioner==null)return;this.popover=new n(this.trigger,this.positioner,{strategy:this.hoist?"fixed":"absolute",placement:this.placement,distance:this.distance,skidding:this.skidding,transitionElement:this.panel,onAfterHide:()=>{if(this.filterEnabled){this.resetFilter()}this.sixAfterHide.emit()},onAfterShow:async()=>{this.sixAfterShow.emit()},onTransitionEnd:()=>{if(!this.open&&this.scrollPanel!=null){this.scrollPanel.scrollTop=0}}})}disconnectedCallback(){var t;this.resizeObserver.disconnect();this.eventListeners.removeAll();void this.hide();(t=this.popover)===null||t===void 0?void 0:t.destroy();this.popover=undefined}async show(){if(this.isVisible||this.popover==null||this.panel==null){return}const t=this.sixShow.emit();if(t.defaultPrevented){this.open=false;return}this.eventListeners.add(this.panel,"six-menu-item-selected",this.handlePanelSelect);this.eventListeners.add(document,"keydown",this.handleDocumentKeyDown);this.eventListeners.add(document,"mousedown",this.handleDocumentMouseDown);this.isVisible=true;this.open=true;if(this.trigger!=null){this.resizeObserver.observe(this.trigger)}this.updatePanelPosition();this.popover.show();if(this.filterEnabled&&this.autofocusFilter){requestAnimationFrame((()=>{var t;(t=this.filterInputElement)===null||t===void 0?void 0:t.setFocus()}))}}updatePanelPosition(){if(!this.open){return}if(this.matchTriggerWidth&&this.trigger!=null&&this.panel!=null){const t=this.trigger.getBoundingClientRect().width;this.panel.style.minWidth=`${t}px`}if(this.popover!=null){this.popover.reposition()}}async hide(){this.resizeObserver.disconnect();if(!this.isVisible||this.panel==null||this.popover==null){return}const t=this.sixHide.emit();if(t.defaultPrevented){this.open=true;return}this.eventListeners.remove(this.panel,"six-menu-item-selected",this.handlePanelSelect);this.eventListeners.remove(document,"keydown",this.handleDocumentKeyDown);this.eventListeners.remove(document,"mousedown",this.handleDocumentMouseDown);this.isVisible=false;this.open=false;this.popover.hide()}focusOnTrigger(){var t;if(this.trigger==null)return;const i=(t=this.triggerSlot)===null||t===void 0?void 0:t.assignedElements({flatten:true}).at(0);if(i!=null){if(typeof i.setFocus==="function"){i.setFocus()}else if(typeof i.focus==="function"){i.focus()}}}getMenu(){var t;return(t=this.panelSlot)===null||t===void 0?void 0:t.assignedElements({flatten:true}).filter(v).at(0)}async reposition(){if(this.open&&this.popover!=null){this.popover.reposition()}}updateAccessibleTrigger(){var t;if(this.trigger==null)return;const i=((t=this.triggerSlot)===null||t===void 0?void 0:t.assignedElements({flatten:true}))||[];const s=i.map(d).at(0);if(s!=null){s.setAttribute("aria-haspopup","true");s.setAttribute("aria-expanded",this.open?"true":"false")}}render(){return s("div",{key:"6569a6e118fd68e19f14dcae0553e25f81987923",part:"base",id:this.componentId,class:{dropdown:true,"dropdown--open":this.open}},s("span",{key:"be04c5d687eafa3c58c9fed9cf43f72d43aa45ef",part:"trigger",class:"dropdown__trigger",ref:t=>this.trigger=t,onClick:this.handleTriggerClick,onKeyDown:this.handleTriggerKeyDown,onKeyUp:this.handleTriggerKeyUp},s("slot",{key:"fba562d4fc45a0874e5cf8caad5e9710d6dd34e0",name:"trigger",ref:t=>this.triggerSlot=t,onSlotchange:this.handleTriggerSlotChange})),s("div",{key:"d37f1cb0246d47ca34004f35e3575e8433d998c8",ref:t=>this.positioner=t,class:{dropdown__positioner:true,dropdown__positioner__filtered:(this.filter||this.asyncFilter)&&!this.hoist}},s("div",{key:"e6c08b51f39a12259b4d8911770e1e1754dc4b8e",ref:t=>this.panel=t,part:"panel",class:"dropdown__panel",role:"menu","aria-hidden":this.open?"false":"true","aria-labelledby":this.componentId},this.filterEnabled&&s("six-input",{class:{filter:true,"filter-hidden":!this.open},"dropdown-search":true,"aria-hidden":this.open?"false":"true",ref:t=>this.filterInputElement=t,placeholder:this.filterPlaceholder},s("six-icon",{class:"filter__icon",slot:"suffix",size:"small"},"search")),s("div",{key:"174d0a5dd5965877e9278475112e2f14d959966d",class:{dropdown__panel__scroll:true,"dropdown__panel__scroll--virtual":this.virtualScroll},onScroll:this.handleDropdownScroll,ref:t=>this.scrollPanel=t},s("slot",{key:"fa0fc63a45e693cc6655db03b0382f028aea9473",ref:t=>this.panelSlot=t}),this.options.length>0&&s("six-menu",{part:"menu",items:this.renderedOptions,virtualScroll:this.virtualScroll})),s("slot",{key:"f24f41a9a70f0624078d43eb60b41e841ee90bf7",name:"dropdown-footer"}))))}get host(){return e(this)}static get watchers(){return{open:["handleOpenChange"],distance:["handlePopoverOptionsChange"],hoist:["handlePopoverOptionsChange"],placement:["handlePopoverOptionsChange"],skidding:["handlePopoverOptionsChange"],options:["handleOptionsChange"],virtualScroll:["handleOptionsChange"]}}};function v(t){return(t===null||t===void 0?void 0:t.tagName.toLowerCase())==="six-menu"}function m(t){return(t===null||t===void 0?void 0:t.tagName.toLowerCase())==="six-menu-item"}function w(t){var i;return((i=t===null||t===void 0?void 0:t.getAttribute("class"))===null||i===void 0?void 0:i.includes("selection-container"))||false}async function b(t,i){return t.value.toLowerCase().includes(i)||(await t.getTextLabel()).toLowerCase().includes(i)}p.style=c;const x=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}:host{display:block}.menu{padding:var(--six-spacing-xx-small) 0;border:none;box-shadow:var(--six-shadow-small);overflow-y:auto;overflow-x:hidden}.menu:focus{outline:none}.no-shadow{box-shadow:none}";const g=x;const _=t=>{var i,s,e;return(e=(s=(i=t===null||t===void 0?void 0:t.shadowRoot)===null||i===void 0?void 0:i.querySelector(".menu-item"))===null||s===void 0?void 0:s.classList)===null||e===void 0?void 0:e.contains("menu-item--focused")};const y=t=>(t===null||t===void 0?void 0:t.tagName.toLowerCase())==="six-menu-item";const k=({value:t,label:i})=>s("six-menu-item",{key:t,value:t},i);const C=5;const I=64;const A=class{constructor(s){t(this,s);this.sixMenuItemSelected=i(this,"six-menu-item-selected",7);this.eventListeners=new o;this.typeToSelectString="";this.handleScrolling=()=>{if(this.menuWrapper==null)return;this.scrollingIndex=Math.floor(this.menuWrapper.scrollTop/this.sixMenuItemHeight)};this.removeBoxShadow=false;this.items=null;this.itemsShown=undefined;this.virtualScroll=false;this.itemSize=10;this.scrollingDebounce=15;this.disableKeyboardHandling=false;this.scrollingIndex=0;this.sixMenuItemHeight=I}connectedCallback(){this.handleClick=this.handleClick.bind(this);this.handleKeyDown=this.handleKeyDown.bind(this)}componentWillLoad(){if(this.items===null){return}}componentDidLoad(){this.setupForVirtualScrollingAfterRendering()}disconnectedCallback(){this.eventListeners.removeAll()}async typeToSelect(t){var i;clearTimeout(this.typeToSelectTimeout);this.typeToSelectTimeout=setTimeout((()=>this.typeToSelectString=""),750);this.typeToSelectString+=t.toLowerCase();const s=this.getItems();for(const t of s){const s=(i=t.shadowRoot)===null||i===void 0?void 0:i.querySelector("slot:not([name])");const e=l(s).toLowerCase().trim();if(e.substring(0,this.typeToSelectString.length)===this.typeToSelectString){t.setFocus();break}}}getItemsShown(){var t;const i=this.virtualScroll?C:0;return(t=this.itemsShown)!==null&&t!==void 0?t:i}setupForVirtualScrollingAfterRendering(){var t,i;if(!this.virtualScroll||this.menuWrapper==null)return;this.eventListeners.add(this.menuWrapper,"scroll",r(this.handleScrolling,this.scrollingDebounce));const s=(i=(t=this.menu)===null||t===void 0?void 0:t.querySelector("six-menu-item"))===null||i===void 0?void 0:i.clientHeight;if(s!=null&&s>0){this.sixMenuItemHeight=s}}getItems(){if(this.menu==null)return[];if(this.items!=null){return this.items.map(k)}const t=this.menu.querySelector("slot");if(t==null)return[];return[...t.assignedElements({flatten:true})].filter((t=>y(t)&&!t.disabled))}getActiveItemIndex(){const t=this.getItems();const i=this.getActiveItem();if(i!=null){const s=t.indexOf(i);if(s>-1){return s}}const s=this.extractItemsFromDOM();return s.findIndex(_)}getActiveItem(){var t;const i=this.getItems().find((t=>t===document.activeElement));if(i!=null){return i}return(t=this.extractItemsFromDOM())===null||t===void 0?void 0:t.find(_)}extractItemsFromDOM(){var t,i;return Array.from((i=(t=this.host.shadowRoot)===null||t===void 0?void 0:t.querySelectorAll("six-menu-item"))!==null&&i!==void 0?i:[])}setActiveItem(t){t===null||t===void 0?void 0:t.setFocus()}handleClick(t){const i=t.target;const s=i.closest("six-menu-item");if(s&&!s.disabled){this.sixMenuItemSelected.emit({name:s.value,item:s})}}handleKeyDown(t){if(this.disableKeyboardHandling){return}if(t.key==="Enter"){const i=this.getActiveItem();t.preventDefault();if(i!=null){this.sixMenuItemSelected.emit({name:i.value,item:i})}}if(t.key===" "){t.preventDefault()}if(["ArrowDown","ArrowUp","Home","End"].includes(t.key)){const i=this.items===null?this.getItems():this.extractItemsFromDOM();let s=this.getActiveItemIndex();if(i.length>0){t.preventDefault();if(t.key==="ArrowDown"){s++}else if(t.key==="ArrowUp"){s--}else if(t.key==="Home"){s=0}else if(t.key==="End"){s=i.length-1}if(s<0)s=0;if(s>i.length-1)s=i.length-1;this.setActiveItem(i[s]);return}}void this.typeToSelect(t.key)}getMenuWrapperStyle(){var t;const i={};if(this.getItemsShown()>0){i.height=`${((t=this.getItemsShown())!==null&&t!==void 0?t:0)*this.sixMenuItemHeight}px`}return Object.assign({},i)}getMenuContainerStyle(){const t={};if(this.virtualScroll){t.transform=`translateY(${this.sixMenuItemHeight*this.scrollingIndex}px)`}return Object.assign({},t)}getScrollbarGhostStyle(){const t={};if(this.virtualScroll&&this.items!==null){t.height=`${this.items.length*this.sixMenuItemHeight-this.itemSize*this.sixMenuItemHeight}px`}return Object.assign({},t)}renderItems(){if(this.items===undefined||this.items===null){return}if(!this.virtualScroll){return this.items.map(k)}return this.items.slice(this.scrollingIndex,Math.min(this.items.length,this.itemSize+this.scrollingIndex)).map((({value:t,label:i})=>s("six-menu-item",{checkType:"check",key:t,value:t},i)))}render(){return s("div",{key:"a8806ec6aee657eb677931fc1ba1405caec3e96e",ref:t=>this.menuWrapper=t,style:this.getMenuWrapperStyle(),part:"wrapper",class:{menu:true,".no-shadow":this.removeBoxShadow}},s("div",{key:"34b85eb38385f88e87f49a6689cf6ad082723a87",ref:t=>this.menu=t,part:"base",role:"menu",onClick:this.handleClick,onKeyDown:this.handleKeyDown,tabIndex:0,style:this.getMenuContainerStyle()},s("slot",{key:"a62dcc8bd5d97a8d479f4a4270aedcb77b729aea"}),this.renderItems()),this.virtualScroll&&s("div",{style:this.getScrollbarGhostStyle()}))}get host(){return e(this)}};A.style=g;export{p as six_dropdown,A as six_menu};
+//# sourceMappingURL=p-e798314b.entry.js.map