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

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

@@ -1 +0,0 @@
-{"version":3,"names":["isValueEmpty","value","Array","isArray","length","sixSelectCss","id","SixSelect","this","inputId","labelId","helpTextId","errorTextId","touched","eventListeners","EventListeners","handleBlur","hasFocus","sixBlur","emit","handleFocus","sixFocus","handleClearClick","event","stopPropagation","clearValues","sixChange","isSelected","handleSelectAll","nonFilteredItems","getItems","filter","item","style","display","keyName","key","keyCode","code","isOpen","multiple","ctrlKey","preventDefault","hasDeselectedOptions","some","opt","disabled","checked","option","forEach","checkedItems","map","handleKeyDown","target","items","firstItem","lastItem","tagName","toLowerCase","_a","dropdown","hide","includes","_b","show","setFocus","_c","_d","menu","typeToSelect","handleLabelClick","box","focus","handleMenuSelect","detail","getValue","v","syncItemsFromValue","handleMenuShow","resizeMenu","resizeObserver","observe","host","handleMenuHide","unobserve","handleSlotChange","hasHelpTextSlot","hasSlot","hasLabelSlot","hasErrorTextSlot","handleTagInteraction","path","composedPath","clearButton","find","el","HTMLElement","element","classList","contains","DEFAULT_DEBOUNCE_FAST","handleDisabledChange","handleLabelChange","handleMultipleChange","getValueAsArray","handleValueChange","connectedCallback","virtualScroll","options","console","error","shadowRoot","addEventListener","forward","componentWillLoad","componentDidLoad","input","ResizeObserver","requestAnimationFrame","add","debounce","enteredValue","inputDebounce","hasSelection","displayLabel","disconnectedCallback","removeEventListener","removeAll","getItemLabel","slot","querySelector","getTextContent","textContent","h","label","querySelectorAll","hasMenuItems","values","String","minWidth","clientWidth","reposition","val","push","displayTags","exportparts","type","size","pill","clearable","onClick","onKeyDown","syncValueFromItems","maxTagsVisible","total","slice","extractLabelForSelectedItem","join","selectedOption","checkedItem","checkedValues","render","FormControl","helpText","errorText","errorTextCount","onLabelClick","required","displayError","invalid","part","ref","hoist","closeOnSelect","containingElement","disableHideOnEnterAndSpace","autocomplete","class","select","filterPlaceholder","filterDebounce","asyncFilter","select__box","line","role","tabIndex","onBlur","onFocus","select__label","placeholder","name","tabindex","select__input","select__menu","onSlotchange"],"sources":["src/components/six-select/util.ts","src/components/six-select/six-select.scss?tag=six-select&encapsulation=shadow","src/components/six-select/six-select.tsx"],"sourcesContent":["export interface MenuItem {\n  value: string;\n}\n\nexport function getValue(value: unknown, multiple: boolean, menuItems: MenuItem[]): string | string[] {\n  if (multiple) {\n    if (Array.isArray(value)) {\n      return getSelectedValues(value, menuItems);\n    } else {\n      return getSelectedValuesFromString(value, menuItems);\n    }\n  }\n\n  return getSelectedMenuItem(value, menuItems)?.value ?? '';\n}\n\nexport function isValidValue(value: unknown, multiple: boolean, menuItems: MenuItem[]): boolean {\n  if (value === '') {\n    return true;\n  }\n\n  if (multiple) {\n    if (Array.isArray(value)) {\n      if (value.length === 0) {\n        return true;\n      }\n      return getSelectedValues(value, menuItems).length === value.length;\n    }\n    return getSelectedValuesFromString(value, menuItems).length > 0;\n  }\n\n  return getSelectedMenuItem(value, menuItems) != null;\n}\n\nexport function valueEquals(a: string | string[], b: string | string[]): boolean {\n  if (Array.isArray(a) && Array.isArray(b)) {\n    return a.length === b.length && a.every((element, index) => element === b[index]);\n  } else if (typeof a === 'string' && typeof b === 'string') {\n    return a === b;\n  }\n  return false;\n}\n\nexport function isValueEmpty(value: string | string[]): boolean {\n  if (Array.isArray(value)) {\n    return value.length === 0;\n  }\n  return value === '';\n}\n\nfunction getSelectedValues(values: unknown[], menuItems: MenuItem[]): string[] {\n  return menuItems.filter((menuItem) => values.includes(menuItem.value)).map((menuItem) => menuItem.value);\n}\n\nfunction getSelectedValuesFromString(value: unknown, menuItems: MenuItem[]): string[] {\n  return menuItems.filter((menuItem) => value === menuItem.value).map((menuItem) => menuItem.value);\n}\n\nfunction getSelectedMenuItem(value: unknown, menuItems: MenuItem[]): MenuItem | undefined {\n  return menuItems.find((item) => value === item.value);\n}\n","@import 'src/global/component';\n@import '../../functional-components/form-control/form-control';\n@import 'src/global/mixins/hidden';\n@import 'src/global/mixins/hide-scrollbar';\n\n:host {\n  display: block;\n}\n\n.select {\n  display: block;\n}\n\n.select__box {\n  display: inline-flex;\n  align-items: center;\n  justify-content: start;\n  position: relative;\n  width: 100%;\n  font-family: var(--six-font-family);\n  font-weight: var(--six-input-font-weight);\n  font-size: var(--six-input-font-size-medium);\n  letter-spacing: var(--six-input-letter-spacing);\n  background-color: var(--six-input-background-color);\n  border: solid var(--six-border-width) var(--six-input-border-color);\n  vertical-align: middle;\n  transition: var(--six-transition-fast) color, var(--six-transition-fast) border, var(--six-transition-fast) box-shadow;\n  cursor: pointer;\n\n  &--line {\n    border: none;\n    border-bottom: solid var(--six-border-width) var(--six-input-border-color);\n  }\n\n  &--autocomplete {\n    border: none;\n    overflow: initial;\n  }\n}\n\n.select:not(.select--disabled) .select__box:hover {\n  background-color: var(--six-input-background-color-hover);\n  color: var(--six-input-color-hover);\n\n  border-bottom-color: var(--six-input-border-color-hover);\n\n  &:not(.select__box--line) {\n    border-color: var(--six-input-border-color-hover);\n  }\n}\n\n.select:not(.select--disabled) .select__box:focus {\n  background-color: var(--six-input-background-color-focus);\n  outline: none;\n  color: var(--six-input-color-focus);\n\n  border-bottom-color: var(--six-input-border-color-focus);\n  box-shadow: 0 1px 0 0 var(--six-input-border-color-focus);\n\n  &:not(.select__box--line) {\n    border-color: var(--six-input-border-color-focus);\n    box-shadow: var(--six-input-focus-shadow);\n  }\n}\n\n.select--disabled {\n  .select__box {\n    background-color: var(--six-input-background-color-disabled);\n    color: var(--six-input-color-disabled);\n    cursor: not-allowed;\n    outline: none;\n\n    &:not(.select__box--line) {\n      border-color: var(--six-input-border-color-disabled);\n    }\n  }\n\n  .select__tags,\n  .select__clear {\n    pointer-events: none;\n  }\n}\n\n.select--invalid:not(.select--disabled):not(.select--focused) {\n  .select__box {\n    border-bottom-color: var(--six-input-border-color-danger);\n\n    &:not(.input--line) {\n      border-color: var(--six-input-border-color-danger);\n    }\n  }\n}\n\n.select__label {\n  flex-shrink: 1;\n  flex-grow: 1;\n  align-items: center;\n  user-select: none;\n  width: 0; /* needed for firefox because due to \"white-space: nowrap\" the default is set to max-content */\n\n  @include hide-scrollbar;\n  overflow-x: auto;\n  overflow-y: hidden;\n  text-overflow: ellipsis;\n}\n\n.select__label--single {\n  white-space: nowrap;\n}\n\n.select__clear {\n  flex-shrink: 0;\n  flex-grow: 0;\n  display: inline;\n}\n\n.select__icon {\n  flex-shrink: 0;\n  flex-grow: 0;\n  display: inline;\n  transition: var(--six-transition-medium) transform ease;\n}\n\n.select--open .select__icon {\n  transform: rotate(-180deg);\n}\n\n// Placeholder\n.select--placeholder-visible .select__label {\n  color: var(--six-input-placeholder-color);\n}\n\n.select--disabled.select--placeholder-visible .select__label {\n  color: var(--six-input-placeholder-color-disabled);\n}\n\n// Tags\n.select__tags {\n  display: flex;\n  align-items: center;\n  flex-wrap: wrap;\n  justify-content: left;\n  margin-left: var(--six-spacing-xx-small);\n}\n\n// Hidden input (for form control validation to show)\n.select__hidden-select {\n  @include visually-hidden();\n}\n\n.select__input {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n}\n\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n// Size modifiers\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n\n.select--small {\n  .select__box {\n    border-radius: var(--six-input-border-radius-small);\n    font-size: var(--six-input-font-size-small);\n    min-height: var(--six-height-small);\n\n    &--line {\n      border: none;\n      border-bottom: solid var(--six-border-width) var(--six-input-border-color);\n    }\n  }\n\n  .select__label {\n    margin: 0 var(--six-input-spacing-small);\n  }\n\n  .select__clear {\n    margin-right: var(--six-spacing-xxx-small);\n  }\n\n  .select__icon {\n    margin-right: var(--six-spacing-x-small);\n  }\n\n  .select__tags {\n    padding-bottom: 2px;\n\n    six-tag {\n      padding-top: 2px;\n      margin-right: var(--six-spacing-xx-small);\n    }\n  }\n\n  &.select--has-tags .select__label {\n    margin-left: 0;\n  }\n}\n\n.select--medium {\n  .select__box {\n    border-radius: var(--six-input-border-radius-medium);\n    font-size: var(--six-input-font-size-medium);\n    min-height: var(--six-height-medium);\n\n    &--line {\n      border: none;\n      border-bottom: solid var(--six-border-width) var(--six-input-border-color);\n    }\n  }\n\n  .select__label {\n    margin: 0 var(--six-input-spacing-medium);\n  }\n\n  .select__clear {\n    margin-right: var(--six-spacing-xxx-small);\n  }\n\n  .select__icon {\n    margin-right: var(--six-spacing-x-small);\n  }\n\n  .select__tags {\n    padding-bottom: 3px;\n\n    six-tag {\n      padding-top: 3px;\n      margin-right: var(--six-spacing-xx-small);\n    }\n  }\n\n  &.select--has-tags .select__label {\n    margin-left: 0;\n  }\n}\n\n.select--large {\n  .select__box {\n    border-radius: var(--six-input-border-radius-large);\n    font-size: var(--six-input-font-size-large);\n    min-height: var(--six-height-large);\n\n    &--line {\n      border: none;\n      border-bottom: solid var(--six-border-width) var(--six-input-border-color);\n    }\n  }\n\n  .select__label {\n    margin: 0 var(--six-input-spacing-large);\n  }\n\n  .select__clear {\n    margin-right: var(--six-spacing-xxx-small);\n  }\n\n  .select__icon {\n    margin-right: var(--six-spacing-x-small);\n  }\n\n  .select__tags {\n    padding-bottom: 4px;\n\n    six-tag {\n      padding-top: 4px;\n      margin-right: var(--six-spacing-xx-small);\n    }\n  }\n\n  &.select--has-tags .select__label {\n    margin-left: 0;\n  }\n}\n\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n// Pill modifier\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n\n.select--pill {\n  &.select--small .select__box {\n    border-radius: var(--six-height-small);\n  }\n\n  &.select--medium .select__box {\n    border-radius: var(--six-height-medium);\n  }\n\n  &.select--large .select__box {\n    border-radius: var(--six-height-large);\n  }\n}\n\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n// Menu\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n.select {\n  &__menu {\n    max-width: 50vw;\n    width: fit-content;\n\n    &--filtered {\n      // fixes problem where when filter is enabled the popup has the width of the input field but the menu has the width\n      // of the trigger element and we thus get weird UI glitches when trigger is narrower than filter input field\n      width: 100% !important;\n    }\n\n    &--hidden {\n      // hide the menu panel if there are no menu items\n      display: none;\n    }\n  }\n}\n\n// fixes problem where six-select height changes when size=\"small\" and clearing button is visible\nsix-icon-button::part(base) {\n  padding-top: 0;\n  padding-bottom: 0;\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { getTextContent, hasSlot } from '../../utils/slot';\nimport FormControl from '../../functional-components/form-control/form-control';\nimport { EmptyPayload } from '../../utils/types';\nimport { EventListeners } from '../../utils/event-listeners';\nimport { debounce, DEFAULT_DEBOUNCE_FAST } from '../../utils/execution-control';\nimport { SixMenuItemData } from '../six-menu/six-menu';\nimport { isValueEmpty } from './util';\n\nexport interface SixSelectChangePayload {\n  value: string | string[];\n  isSelected: boolean;\n}\n\nlet id = 0;\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot - The select's options in the form of menu items.\n * @slot label - The select's label. Alternatively, you can use the label prop.\n * @slot help-text - Help text that describes how to use the select.\n * @slot error-text - Error text that is shown for validation errors. Alternatively, you can use the error-text prop.\n *\n * @part base - The component's base wrapper.\n * @part clear-button - The input's clear button, exported from six-input.\n * @part form-control - The form control that wraps the label, input, and help text.\n * @part help-text - The select's help text.\n * @part icon - The select's icon.\n * @part label - The select's label.\n * @part menu - The select menu, a six-menu element.\n * @part tag - The multiselect option, a six-tag element.\n * @part tags - The container in which multiselect options are rendered.\n */\n\n@Component({\n  tag: 'six-select',\n  styleUrl: 'six-select.scss',\n  shadow: true,\n})\nexport class SixSelect {\n  private box?: HTMLElement;\n  private dropdown?: HTMLSixDropdownElement;\n  private input?: HTMLSixInputElement;\n  private inputId = `select-${++id}`;\n  private labelId = `select-label-${id}`;\n  private helpTextId = `select-help-text-${id}`;\n  private errorTextId = `select-error-text-${id}`;\n  private menu?: HTMLSixMenuElement;\n  private resizeObserver?: ResizeObserver;\n  private touched = false;\n  private eventListeners = new EventListeners();\n\n  @Element() host!: HTMLSixSelectElement;\n\n  @State() hasFocus = false;\n  @State() hasHelpTextSlot = false;\n  @State() hasLabelSlot = false;\n  @State() hasErrorTextSlot = false;\n  @State() isOpen = false;\n  @State() displayLabel = '';\n  @State() displayTags: HTMLSixTagElement[] = [];\n\n  /** Set to true to enable multiselect. */\n  @Prop() multiple = false;\n\n  /**\n   * The maximum number of tags to show when `multiple` is true. After the maximum, \"+n\" will be shown to indicate the\n   * number of additional items that are selected. Set to -1 to remove the limit.\n   */\n  @Prop() maxTagsVisible = 3;\n\n  /** Set to true to disable the select control. */\n  @Prop() disabled = false;\n\n  /** The select's name. */\n  @Prop() name = '';\n\n  /** The select's placeholder text. */\n  @Prop() placeholder = '';\n\n  /** The filter's placeholder text. */\n  @Prop() filterPlaceholder?: string;\n\n  /** The debounce for the filter callbacks. */\n  @Prop() filterDebounce = DEFAULT_DEBOUNCE_FAST;\n\n  /** The select's size. */\n  @Prop() size: 'small' | 'medium' | 'large' = 'medium';\n\n  /**\n   * Enable this option to prevent the panel from being clipped when the component is placed inside a container with\n   * `overflow: auto|scroll`.\n   */\n  @Prop() hoist = false;\n\n  /** The value of the control. This will be a string or an array depending on `multiple`. */\n  @Prop({ mutable: true }) value: string | string[] = '';\n\n  /** Set to true to draw a pill-style select with rounded edges. */\n  @Prop() pill = false;\n\n  /** The select's help text. Alternatively, you can use the help-text slot. */\n  @Prop() helpText = '';\n\n  /** Set to true to show an asterisk beneath the label. */\n  @Prop() required = false;\n\n  /** Set to true to add a clear button when the select is populated. */\n  @Prop() clearable = false;\n\n  /** The label text. */\n  @Prop() label = '';\n\n  /** The error message shown, if `invalid` is set to true.  */\n  @Prop() errorText: string | string[] = '';\n\n  /** The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1 */\n  @Prop() errorTextCount?: number;\n\n  /** If this property is set to true and an error message is provided by `errorText`, the error message is displayed.  */\n  @Prop({ reflect: true }) invalid = false;\n\n  /** Set to render as line */\n  @Prop() line = false;\n\n  /** Set to true to allow filtering for entries in the dropdown */\n  @Prop() filter = false;\n\n  /**\n   * Set to true to allow async filtering.\n   * When you enter something in the search field the component will only emit an event but not filter any elements itself.\n   * You can then simply listen to the 'six-async-filter-fired' event to manage the shown menu-items yourself\n   */\n  @Prop() asyncFilter = false;\n\n  /**\n   * Set to true to turn the six-select into an autocomplete.\n   */\n  @Prop() autocomplete = false;\n\n  /** The debounce for when the input changes for autocompletes should be emitted */\n  @Prop() inputDebounce = DEFAULT_DEBOUNCE_FAST;\n\n  /** Set the options to be shown in the dropdown (alternative to setting the elements via html) */\n  @Prop() options: SixMenuItemData[] | null = null;\n\n  /** Defines whether the menu list will be rendered virtually i.e. only the elements actually shown (and a couple around)\n   *  are actually rendered in the DOM. If you use virtual scrolling pass the elements via prop instead of via slot. */\n  @Prop() virtualScroll = false;\n\n  @Watch('disabled')\n  handleDisabledChange() {\n    if (this.disabled && this.isOpen) {\n      this.dropdown?.hide();\n    }\n  }\n\n  @Watch('helpText')\n  @Watch('errorText')\n  @Watch('label')\n  handleLabelChange() {\n    this.handleSlotChange();\n  }\n\n  @Watch('multiple')\n  handleMultipleChange() {\n    // Cast to array | string based on `this.multiple`\n    const value = this.getValueAsArray();\n    this.value = this.multiple ? value : value[0] || '';\n    this.syncItemsFromValue();\n  }\n\n  @Watch('value')\n  async handleValueChange() {\n    if (this.multiple && !Array.isArray(this.value)) {\n      this.value = [];\n    }\n\n    if (!this.multiple && typeof this.value !== 'string') {\n      this.value = '';\n    }\n\n    await this.syncItemsFromValue();\n  }\n\n  /** Emitted when the control's value changes. */\n  @Event({ eventName: 'six-select-change' }) sixChange!: EventEmitter<SixSelectChangePayload>;\n\n  /** Emitted when the control gains focus. */\n  @Event({ eventName: 'six-select-focus' }) sixFocus!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the control loses focus. */\n  @Event({ eventName: 'six-select-blur' }) sixBlur!: EventEmitter<EmptyPayload>;\n\n  connectedCallback() {\n    if (this.virtualScroll && this.options === null) {\n      console.error('Options must be defined when using virtual scrolling');\n    }\n    this.host.shadowRoot?.addEventListener('slotchange', this.handleSlotChange);\n    this.eventListeners.forward('six-select-change', 'change', this.host);\n    this.eventListeners.forward('six-select-blur', 'blur', this.host);\n    this.eventListeners.forward('six-select-focus', 'focus', this.host);\n  }\n\n  componentWillLoad() {\n    this.handleSlotChange();\n    if (this.multiple && this.value != null) {\n      this.value = this.getValueAsArray();\n    }\n  }\n\n  componentDidLoad() {\n    if (this.input == null) return;\n    const input = this.input;\n    this.resizeObserver = new ResizeObserver(() => this.resizeMenu());\n\n    // We need to do an initial sync after the component has rendered, so this will suppress the re-render warning\n    requestAnimationFrame(() => this.syncItemsFromValue());\n\n    this.eventListeners.add(\n      input,\n      'six-input-input',\n      debounce((event) => {\n        const enteredValue = input.value;\n        this.clearValues();\n        this.sixChange.emit({ value: enteredValue, isSelected: false });\n        event.stopPropagation();\n      }, this.inputDebounce)\n    );\n\n    input.value = this.hasSelection() ? this.displayLabel : '';\n  }\n\n  disconnectedCallback() {\n    this.host.shadowRoot?.removeEventListener('slotchange', this.handleSlotChange);\n    this.eventListeners.removeAll();\n  }\n\n  /** Sets focus on the select. */\n  @Method()\n  async setFocus(options?: FocusOptions) {\n    this.hasFocus = true;\n    this.box?.focus(options);\n  }\n\n  private getItemLabel(item: HTMLSixMenuItemElement): string {\n    const slot = item.shadowRoot?.querySelector('slot:not([name])') as HTMLSlotElement;\n    if (slot != null) {\n      return getTextContent(slot);\n    } else {\n      // bugfix/COMSLI-203-six-select-value-is-not-updated-if-the-slot-is-changed\n      return item.textContent ?? '';\n    }\n  }\n\n  private getItems(): HTMLSixMenuItemElement[] {\n    if (this.options !== null) {\n      return this.options.map((option) => <six-menu-item value={option.value}>{option.label}</six-menu-item>);\n    }\n\n    return [...this.host.querySelectorAll('six-menu-item')];\n  }\n\n  private hasMenuItems() {\n    return this.getItems().length > 0;\n  }\n\n  private getValueAsArray() {\n    const values = Array.isArray(this.value) ? this.value : this.value === '' ? [] : [this.value];\n    // enforce that the values are converted to 'string' before the value is compared\n    return values.map(String);\n  }\n\n  private handleBlur = () => {\n    this.hasFocus = false;\n    this.sixBlur.emit();\n  };\n\n  private handleFocus = () => {\n    this.hasFocus = true;\n    this.sixFocus.emit();\n  };\n\n  private handleClearClick = (event: MouseEvent) => {\n    event.stopPropagation();\n    this.clearValues();\n    this.sixChange.emit({ value: this.value, isSelected: true });\n  };\n\n  private clearValues() {\n    this.value = this.multiple ? [] : '';\n    this.syncItemsFromValue();\n  }\n\n  private handleSelectAll = (event: KeyboardEvent) => {\n    const nonFilteredItems = this.getItems().filter((item) => item.style.display !== 'none');\n    const keyName = event.key;\n    const keyCode = event.code;\n\n    if (keyName === 'Control') {\n      return;\n    }\n\n    if (this.isOpen && this.multiple && keyCode === 'KeyA' && event.ctrlKey) {\n      event.preventDefault();\n      const hasDeselectedOptions = nonFilteredItems.some((opt) => !opt.disabled && !opt.checked);\n\n      nonFilteredItems\n        .filter((option) => !option.disabled)\n        .forEach((option) => (option.checked = hasDeselectedOptions));\n      const checkedItems = nonFilteredItems.filter((option) => option.checked).map((option) => option.value);\n      this.value = hasDeselectedOptions ? checkedItems : [];\n      this.sixChange.emit({ value: this.value, isSelected: true });\n    }\n  };\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    const target = event.target as HTMLElement;\n\n    const items = this.getItems();\n    const firstItem = items[0];\n    const lastItem = items[items.length - 1];\n\n    // Ignore key presses on tags\n    if (target.tagName.toLowerCase() === 'six-tag') {\n      return;\n    }\n\n    // Tabbing out of the control closes it\n    if (event.key === 'Tab') {\n      if (this.isOpen) {\n        this.dropdown?.hide();\n      }\n      return;\n    }\n\n    // Up/down opens the menu\n    if (['ArrowDown', 'ArrowUp'].includes(event.key)) {\n      event.preventDefault();\n\n      // Show the menu if it's not already open\n      if (!this.isOpen) {\n        this.dropdown?.show();\n      }\n\n      // Focus on a menu item\n      if (event.key === 'ArrowDown' && firstItem) {\n        firstItem.setFocus();\n        return;\n      }\n\n      if (event.key === 'ArrowUp' && lastItem) {\n        lastItem.setFocus();\n        return;\n      }\n    }\n\n    // All other keys open the menu and initiate type to select\n    if (!this.isOpen) {\n      event.stopPropagation();\n      event.preventDefault();\n      this.dropdown?.show();\n      this.menu?.typeToSelect(event.key);\n    }\n  };\n\n  private handleLabelClick = () => {\n    this.box?.focus();\n  };\n\n  private handleMenuSelect = (event: CustomEvent) => {\n    const item = event.detail.item;\n\n    const getValue = () => {\n      if (this.multiple) {\n        return this.value.includes(item.value)\n          ? (this.value as []).filter((v) => v !== item.value)\n          : [...this.value, item.value];\n      } else {\n        return item.value;\n      }\n    };\n\n    this.value = getValue();\n\n    this.syncItemsFromValue();\n    this.sixChange.emit({ value: this.value, isSelected: true });\n  };\n\n  private handleMenuShow = (event: CustomEvent) => {\n    if (this.disabled) {\n      event.preventDefault();\n      return;\n    }\n\n    this.resizeMenu();\n    this.resizeObserver?.observe(this.host);\n    this.isOpen = true;\n  };\n\n  private handleMenuHide = () => {\n    this.resizeObserver?.unobserve(this.host);\n    this.isOpen = false;\n  };\n\n  private handleSlotChange = () => {\n    this.hasHelpTextSlot = hasSlot(this.host, 'help-text');\n    this.hasLabelSlot = hasSlot(this.host, 'label');\n    this.hasErrorTextSlot = hasSlot(this.host, 'error-text');\n    this.syncItemsFromValue();\n  };\n\n  private handleTagInteraction = (event: KeyboardEvent | MouseEvent) => {\n    // Don't toggle the menu when a tag's clear button is activated\n    const path = event.composedPath() as EventTarget[];\n    const clearButton = path.find((el) => {\n      if (el instanceof HTMLElement) {\n        const element = el as HTMLElement;\n        return element.classList.contains('tag__clear');\n      }\n    });\n\n    if (clearButton) {\n      event.stopPropagation();\n      this.sixChange.emit({ value: this.value, isSelected: true });\n    }\n  };\n\n  private resizeMenu() {\n    if (this.menu == null || this.box == null) return;\n    this.menu.style.minWidth = `${this.box.clientWidth}px`;\n\n    if (this.dropdown) {\n      this.dropdown.reposition();\n    }\n  }\n\n  private async syncItemsFromValue() {\n    const items = this.getItems();\n    const value = this.getValueAsArray();\n\n    // Sync checked states\n    items.forEach((item) => (item.checked = value.includes(item.value)));\n\n    // Sync display label\n    if (this.multiple) {\n      const checkedItems: HTMLSixMenuItemElement[] = [];\n      value.forEach((val) => items.map((item) => (item.value === val ? checkedItems.push(item) : null)));\n\n      this.displayTags = checkedItems.map((item) => {\n        return (\n          <six-tag\n            exportparts=\"base:tag\"\n            type=\"primary\"\n            size={this.size}\n            pill={this.pill}\n            clearable\n            onClick={this.handleTagInteraction}\n            onKeyDown={this.handleTagInteraction}\n            onSix-tag-clear={(event) => {\n              event.stopPropagation();\n              if (!this.disabled) {\n                item.checked = false;\n                this.syncValueFromItems();\n              }\n            }}\n          >\n            {this.getItemLabel(item)}\n          </six-tag>\n        );\n      });\n\n      if (this.maxTagsVisible > 0 && this.displayTags.length > this.maxTagsVisible) {\n        const total = this.displayTags.length;\n        this.displayLabel = '';\n        this.displayTags = this.displayTags.slice(0, this.maxTagsVisible);\n        this.displayTags.push(\n          <six-tag exportparts=\"base:tag\" type=\"info\" size={this.size}>\n            +{total - this.maxTagsVisible}\n          </six-tag>\n        );\n      }\n    } else {\n      this.displayLabel = this.extractLabelForSelectedItem(value, items);\n      this.displayTags = [];\n    }\n\n    if (!isValueEmpty(this.value)) {\n      this.touched = true;\n    }\n    if (this.touched && this.input != null) {\n      this.input.value = Array.isArray(this.value) ? this.value.join(',') : this.value;\n    }\n  }\n\n  private extractLabelForSelectedItem(value: string[], items: HTMLSixMenuItemElement[]): string {\n    if (value.length === 0 || (value.length === 1 && value[0] === '')) {\n      return '';\n    }\n\n    if (this.options !== null) {\n      const selectedOption = this.options.find((item) => item.value === value[0]);\n      return selectedOption?.value || '';\n    }\n\n    const checkedItem = items.find((item) => item.value === value[0]);\n    return checkedItem ? this.getItemLabel(checkedItem) : '';\n  }\n\n  private syncValueFromItems() {\n    const items = this.getItems();\n    const checkedItems = items.filter((item) => item.checked);\n    const checkedValues = checkedItems.map((item) => item.value);\n    this.value = this.multiple\n      ? this.getValueAsArray().filter((val) => checkedValues.includes(val))\n      : checkedValues.length > 0\n      ? checkedValues[0]\n      : '';\n  }\n\n  render() {\n    const hasSelection = this.hasSelection();\n\n    return (\n      <FormControl\n        inputId={this.inputId}\n        label={this.label}\n        labelId={this.labelId}\n        hasLabelSlot={this.hasLabelSlot}\n        helpTextId={this.helpTextId}\n        helpText={this.helpText}\n        hasHelpTextSlot={this.hasHelpTextSlot}\n        errorTextId={this.errorTextId}\n        errorText={this.errorText}\n        errorTextCount={this.errorTextCount}\n        hasErrorTextSlot={this.hasErrorTextSlot}\n        size={this.size}\n        onLabelClick={this.handleLabelClick}\n        disabled={this.disabled}\n        required={this.required}\n        displayError={this.invalid}\n      >\n        <six-dropdown\n          part=\"base\"\n          ref={(el) => (this.dropdown = el)}\n          hoist={this.hoist}\n          closeOnSelect={!this.multiple}\n          containingElement={this.host}\n          disableHideOnEnterAndSpace={this.autocomplete}\n          class={{\n            select: true,\n            'select--open': this.isOpen,\n            'select--empty': this.value?.length === 0,\n            'select--focused': this.hasFocus,\n            'select--clearable': this.clearable,\n            'select--disabled': this.disabled,\n            'select--multiple': this.multiple,\n            'select--has-tags': this.multiple && hasSelection,\n            'select--placeholder-visible': this.displayLabel === '',\n            'select--small': this.size === 'small',\n            'select--medium': this.size === 'medium',\n            'select--large': this.size === 'large',\n            'select--pill': this.pill,\n            'select--invalid': this.invalid,\n          }}\n          onKeyDown={this.handleSelectAll}\n          onSix-dropdown-show={this.handleMenuShow}\n          onSix-dropdown-hide={this.handleMenuHide}\n          filterPlaceholder={this.filterPlaceholder}\n          filterDebounce={this.filterDebounce}\n          filter={this.filter}\n          asyncFilter={this.asyncFilter}\n        >\n          <div\n            slot=\"trigger\"\n            ref={(el) => (this.box = el)}\n            id={this.inputId}\n            class={{\n              select__box: true,\n              'select__box--line': this.line,\n              'select__box--autocomplete': this.autocomplete,\n            }}\n            role=\"combobox\"\n            aria-labelledby={this.labelId}\n            aria-describedby={this.helpTextId}\n            aria-haspopup=\"true\"\n            aria-expanded={this.isOpen ? 'true' : 'false'}\n            tabIndex={this.disabled ? -1 : 0}\n            onBlur={this.handleBlur}\n            onFocus={this.handleFocus}\n            onKeyDown={this.handleKeyDown}\n          >\n            <span class={{ select__label: true, 'select__label--single': !this.displayTags.length }}>\n              {this.displayTags.length > 0 ? (\n                <span part=\"tags\" class=\"select__tags\">\n                  {this.displayTags}\n                </span>\n              ) : (\n                this.displayLabel || this.placeholder\n              )}\n            </span>\n\n            {this.clearable && hasSelection && (\n              <six-icon-button\n                exportparts=\"base:clear-button\"\n                class=\"select__clear\"\n                name=\"clear\"\n                size=\"small\"\n                onClick={this.handleClearClick}\n                tabindex=\"-1\"\n              />\n            )}\n\n            {this.hasMenuItems() && (\n              <span part=\"icon\" class=\"select__icon\">\n                <six-icon size=\"medium\">expand_more</six-icon>\n              </span>\n            )}\n\n            {/*\n              The hidden input tricks the browser's built-in validation so it works as expected. We use an input instead\n              of a select because, otherwise, iOS will show a list of options during validation.\n            */}\n            <six-input\n              ref={(el) => (this.input = el)}\n              class={{\n                select__input: true,\n                'select__hidden-select': !this.autocomplete,\n              }}\n              aria-hidden=\"true\"\n              required={this.required}\n              onFocus={this.handleFocus}\n              clearable={this.clearable}\n              placeholder={this.placeholder}\n              pill={this.pill}\n              disabled={this.disabled}\n              size={this.size}\n              tabIndex={-1}\n            />\n          </div>\n\n          <six-menu\n            ref={(el) => (this.menu = el)}\n            part=\"menu\"\n            class={{\n              select__menu: true,\n              'select__menu--filtered': this.filter || this.asyncFilter,\n              'select__menu--hidden': !this.hasMenuItems(),\n            }}\n            onSix-menu-item-selected={this.handleMenuSelect}\n            items={this.options}\n            virtualScroll={this.virtualScroll}\n            remove-box-shadow\n          >\n            <slot onSlotchange={this.handleSlotChange} />\n          </six-menu>\n        </six-dropdown>\n      </FormControl>\n    );\n  }\n\n  private hasSelection() {\n    return this.multiple ? this.value.length > 0 : this.value !== '';\n  }\n}\n"],"mappings":"gOA2CgBA,EAAaC,GAC3B,GAAIC,MAAMC,QAAQF,GAAQ,CACxB,OAAOA,EAAMG,SAAW,C,CAE1B,OAAOH,IAAU,EACnB,CChDA,MAAMI,EAAe,+6PCcrB,IAAIC,EAAK,E,MA6BIC,EAAS,M,0JAIZC,KAAAC,QAAU,YAAYH,IACtBE,KAAAE,QAAU,gBAAgBJ,IAC1BE,KAAAG,WAAa,oBAAoBL,IACjCE,KAAAI,YAAc,qBAAqBN,IAGnCE,KAAAK,QAAU,MACVL,KAAAM,eAAiB,IAAIC,EA+NrBP,KAAAQ,WAAa,KACnBR,KAAKS,SAAW,MAChBT,KAAKU,QAAQC,MAAM,EAGbX,KAAAY,YAAc,KACpBZ,KAAKS,SAAW,KAChBT,KAAKa,SAASF,MAAM,EAGdX,KAAAc,iBAAoBC,IAC1BA,EAAMC,kBACNhB,KAAKiB,cACLjB,KAAKkB,UAAUP,KAAK,CAAElB,MAAOO,KAAKP,MAAO0B,WAAY,MAAO,EAQtDnB,KAAAoB,gBAAmBL,IACzB,MAAMM,EAAmBrB,KAAKsB,WAAWC,QAAQC,GAASA,EAAKC,MAAMC,UAAY,SACjF,MAAMC,EAAUZ,EAAMa,IACtB,MAAMC,EAAUd,EAAMe,KAEtB,GAAIH,IAAY,UAAW,CACzB,M,CAGF,GAAI3B,KAAK+B,QAAU/B,KAAKgC,UAAYH,IAAY,QAAUd,EAAMkB,QAAS,CACvElB,EAAMmB,iBACN,MAAMC,EAAuBd,EAAiBe,MAAMC,IAASA,EAAIC,WAAaD,EAAIE,UAElFlB,EACGE,QAAQiB,IAAYA,EAAOF,WAC3BG,SAASD,GAAYA,EAAOD,QAAUJ,IACzC,MAAMO,EAAerB,EAAiBE,QAAQiB,GAAWA,EAAOD,UAASI,KAAKH,GAAWA,EAAO/C,QAChGO,KAAKP,MAAQ0C,EAAuBO,EAAe,GACnD1C,KAAKkB,UAAUP,KAAK,CAAElB,MAAOO,KAAKP,MAAO0B,WAAY,M,GAIjDnB,KAAA4C,cAAiB7B,I,YACvB,MAAM8B,EAAS9B,EAAM8B,OAErB,MAAMC,EAAQ9C,KAAKsB,WACnB,MAAMyB,EAAYD,EAAM,GACxB,MAAME,EAAWF,EAAMA,EAAMlD,OAAS,GAGtC,GAAIiD,EAAOI,QAAQC,gBAAkB,UAAW,CAC9C,M,CAIF,GAAInC,EAAMa,MAAQ,MAAO,CACvB,GAAI5B,KAAK+B,OAAQ,EACfoB,EAAAnD,KAAKoD,YAAQ,MAAAD,SAAA,SAAAA,EAAEE,M,CAEjB,M,CAIF,GAAI,CAAC,YAAa,WAAWC,SAASvC,EAAMa,KAAM,CAChDb,EAAMmB,iBAGN,IAAKlC,KAAK+B,OAAQ,EAChBwB,EAAAvD,KAAKoD,YAAQ,MAAAG,SAAA,SAAAA,EAAEC,M,CAIjB,GAAIzC,EAAMa,MAAQ,aAAemB,EAAW,CAC1CA,EAAUU,WACV,M,CAGF,GAAI1C,EAAMa,MAAQ,WAAaoB,EAAU,CACvCA,EAASS,WACT,M,EAKJ,IAAKzD,KAAK+B,OAAQ,CAChBhB,EAAMC,kBACND,EAAMmB,kBACNwB,EAAA1D,KAAKoD,YAAQ,MAAAM,SAAA,SAAAA,EAAEF,QACfG,EAAA3D,KAAK4D,QAAI,MAAAD,SAAA,SAAAA,EAAEE,aAAa9C,EAAMa,I,GAI1B5B,KAAA8D,iBAAmB,K,OACzBX,EAAAnD,KAAK+D,OAAG,MAAAZ,SAAA,SAAAA,EAAEa,OAAO,EAGXhE,KAAAiE,iBAAoBlD,IAC1B,MAAMS,EAAOT,EAAMmD,OAAO1C,KAE1B,MAAM2C,EAAW,KACf,GAAInE,KAAKgC,SAAU,CACjB,OAAOhC,KAAKP,MAAM6D,SAAS9B,EAAK/B,OAC3BO,KAAKP,MAAa8B,QAAQ6C,GAAMA,IAAM5C,EAAK/B,QAC5C,IAAIO,KAAKP,MAAO+B,EAAK/B,M,KACpB,CACL,OAAO+B,EAAK/B,K,GAIhBO,KAAKP,MAAQ0E,IAEbnE,KAAKqE,qBACLrE,KAAKkB,UAAUP,KAAK,CAAElB,MAAOO,KAAKP,MAAO0B,WAAY,MAAO,EAGtDnB,KAAAsE,eAAkBvD,I,MACxB,GAAIf,KAAKsC,SAAU,CACjBvB,EAAMmB,iBACN,M,CAGFlC,KAAKuE,cACLpB,EAAAnD,KAAKwE,kBAAc,MAAArB,SAAA,SAAAA,EAAEsB,QAAQzE,KAAK0E,MAClC1E,KAAK+B,OAAS,IAAI,EAGZ/B,KAAA2E,eAAiB,K,OACvBxB,EAAAnD,KAAKwE,kBAAc,MAAArB,SAAA,SAAAA,EAAEyB,UAAU5E,KAAK0E,MACpC1E,KAAK+B,OAAS,KAAK,EAGb/B,KAAA6E,iBAAmB,KACzB7E,KAAK8E,gBAAkBC,EAAQ/E,KAAK0E,KAAM,aAC1C1E,KAAKgF,aAAeD,EAAQ/E,KAAK0E,KAAM,SACvC1E,KAAKiF,iBAAmBF,EAAQ/E,KAAK0E,KAAM,cAC3C1E,KAAKqE,oBAAoB,EAGnBrE,KAAAkF,qBAAwBnE,IAE9B,MAAMoE,EAAOpE,EAAMqE,eACnB,MAAMC,EAAcF,EAAKG,MAAMC,IAC7B,GAAIA,aAAcC,YAAa,CAC7B,MAAMC,EAAUF,EAChB,OAAOE,EAAQC,UAAUC,SAAS,a,KAItC,GAAIN,EAAa,CACftE,EAAMC,kBACNhB,KAAKkB,UAAUP,KAAK,CAAElB,MAAOO,KAAKP,MAAO0B,WAAY,M,iBAlXrC,M,qBACO,M,kBACH,M,sBACI,M,YACV,M,kBACM,G,iBACoB,G,cAGzB,M,oBAMM,E,cAGN,M,UAGJ,G,iBAGO,G,qDAMGyE,E,UAGoB,S,WAM7B,M,WAGoC,G,UAGrC,M,cAGI,G,cAGA,M,eAGC,M,WAGJ,G,eAGuB,G,2CAMJ,M,UAGpB,M,YAGE,M,iBAOK,M,kBAKC,M,mBAGCA,E,aAGoB,K,mBAIpB,K,CAGxB,oBAAAC,G,MACE,GAAI7F,KAAKsC,UAAYtC,KAAK+B,OAAQ,EAChCoB,EAAAnD,KAAKoD,YAAQ,MAAAD,SAAA,SAAAA,EAAEE,M,EAOnB,iBAAAyC,GACE9F,KAAK6E,kB,CAIP,oBAAAkB,GAEE,MAAMtG,EAAQO,KAAKgG,kBACnBhG,KAAKP,MAAQO,KAAKgC,SAAWvC,EAAQA,EAAM,IAAM,GACjDO,KAAKqE,oB,CAIP,uBAAM4B,GACJ,GAAIjG,KAAKgC,WAAatC,MAAMC,QAAQK,KAAKP,OAAQ,CAC/CO,KAAKP,MAAQ,E,CAGf,IAAKO,KAAKgC,iBAAmBhC,KAAKP,QAAU,SAAU,CACpDO,KAAKP,MAAQ,E,OAGTO,KAAKqE,oB,CAYb,iBAAA6B,G,MACE,GAAIlG,KAAKmG,eAAiBnG,KAAKoG,UAAY,KAAM,CAC/CC,QAAQC,MAAM,uD,EAEhBnD,EAAAnD,KAAK0E,KAAK6B,cAAU,MAAApD,SAAA,SAAAA,EAAEqD,iBAAiB,aAAcxG,KAAK6E,kBAC1D7E,KAAKM,eAAemG,QAAQ,oBAAqB,SAAUzG,KAAK0E,MAChE1E,KAAKM,eAAemG,QAAQ,kBAAmB,OAAQzG,KAAK0E,MAC5D1E,KAAKM,eAAemG,QAAQ,mBAAoB,QAASzG,KAAK0E,K,CAGhE,iBAAAgC,GACE1G,KAAK6E,mBACL,GAAI7E,KAAKgC,UAAYhC,KAAKP,OAAS,KAAM,CACvCO,KAAKP,MAAQO,KAAKgG,iB,EAItB,gBAAAW,GACE,GAAI3G,KAAK4G,OAAS,KAAM,OACxB,MAAMA,EAAQ5G,KAAK4G,MACnB5G,KAAKwE,eAAiB,IAAIqC,gBAAe,IAAM7G,KAAKuE,eAGpDuC,uBAAsB,IAAM9G,KAAKqE,uBAEjCrE,KAAKM,eAAeyG,IAClBH,EACA,kBACAI,GAAUjG,IACR,MAAMkG,EAAeL,EAAMnH,MAC3BO,KAAKiB,cACLjB,KAAKkB,UAAUP,KAAK,CAAElB,MAAOwH,EAAc9F,WAAY,QACvDJ,EAAMC,iBAAiB,GACtBhB,KAAKkH,gBAGVN,EAAMnH,MAAQO,KAAKmH,eAAiBnH,KAAKoH,aAAe,E,CAG1D,oBAAAC,G,OACElE,EAAAnD,KAAK0E,KAAK6B,cAAU,MAAApD,SAAA,SAAAA,EAAEmE,oBAAoB,aAActH,KAAK6E,kBAC7D7E,KAAKM,eAAeiH,W,CAKtB,cAAM9D,CAAS2C,G,MACbpG,KAAKS,SAAW,MAChB0C,EAAAnD,KAAK+D,OAAG,MAAAZ,SAAA,SAAAA,EAAEa,MAAMoC,E,CAGV,YAAAoB,CAAahG,G,QACnB,MAAMiG,GAAOtE,EAAA3B,EAAK+E,cAAU,MAAApD,SAAA,SAAAA,EAAEuE,cAAc,oBAC5C,GAAID,GAAQ,KAAM,CAChB,OAAOE,EAAeF,E,KACjB,CAEL,OAAOlE,EAAA/B,EAAKoG,eAAW,MAAArE,SAAA,EAAAA,EAAI,E,EAIvB,QAAAjC,GACN,GAAItB,KAAKoG,UAAY,KAAM,CACzB,OAAOpG,KAAKoG,QAAQzD,KAAKH,GAAWqF,EAAA,iBAAepI,MAAO+C,EAAO/C,OAAQ+C,EAAOsF,Q,CAGlF,MAAO,IAAI9H,KAAK0E,KAAKqD,iBAAiB,iB,CAGhC,YAAAC,GACN,OAAOhI,KAAKsB,WAAW1B,OAAS,C,CAG1B,eAAAoG,GACN,MAAMiC,EAASvI,MAAMC,QAAQK,KAAKP,OAASO,KAAKP,MAAQO,KAAKP,QAAU,GAAK,GAAK,CAACO,KAAKP,OAEvF,OAAOwI,EAAOtF,IAAIuF,O,CAmBZ,WAAAjH,GACNjB,KAAKP,MAAQO,KAAKgC,SAAW,GAAK,GAClChC,KAAKqE,oB,CAyIC,UAAAE,GACN,GAAIvE,KAAK4D,MAAQ,MAAQ5D,KAAK+D,KAAO,KAAM,OAC3C/D,KAAK4D,KAAKnC,MAAM0G,SAAW,GAAGnI,KAAK+D,IAAIqE,gBAEvC,GAAIpI,KAAKoD,SAAU,CACjBpD,KAAKoD,SAASiF,Y,EAIV,wBAAMhE,GACZ,MAAMvB,EAAQ9C,KAAKsB,WACnB,MAAM7B,EAAQO,KAAKgG,kBAGnBlD,EAAML,SAASjB,GAAUA,EAAKe,QAAU9C,EAAM6D,SAAS9B,EAAK/B,SAG5D,GAAIO,KAAKgC,SAAU,CACjB,MAAMU,EAAyC,GAC/CjD,EAAMgD,SAAS6F,GAAQxF,EAAMH,KAAKnB,GAAUA,EAAK/B,QAAU6I,EAAM5F,EAAa6F,KAAK/G,GAAQ,SAE3FxB,KAAKwI,YAAc9F,EAAaC,KAAKnB,GAEjCqG,EAAA,WACEY,YAAY,WACZC,KAAK,UACLC,KAAM3I,KAAK2I,KACXC,KAAM5I,KAAK4I,KACXC,UAAS,KACTC,QAAS9I,KAAKkF,qBACd6D,UAAW/I,KAAKkF,qBAAoB,kBAClBnE,IAChBA,EAAMC,kBACN,IAAKhB,KAAKsC,SAAU,CAClBd,EAAKe,QAAU,MACfvC,KAAKgJ,oB,IAIRhJ,KAAKwH,aAAahG,MAKzB,GAAIxB,KAAKiJ,eAAiB,GAAKjJ,KAAKwI,YAAY5I,OAASI,KAAKiJ,eAAgB,CAC5E,MAAMC,EAAQlJ,KAAKwI,YAAY5I,OAC/BI,KAAKoH,aAAe,GACpBpH,KAAKwI,YAAcxI,KAAKwI,YAAYW,MAAM,EAAGnJ,KAAKiJ,gBAClDjJ,KAAKwI,YAAYD,KACfV,EAAA,WAASY,YAAY,WAAWC,KAAK,OAAOC,KAAM3I,KAAK2I,MAAI,IACvDO,EAAQlJ,KAAKiJ,gB,MAIhB,CACLjJ,KAAKoH,aAAepH,KAAKoJ,4BAA4B3J,EAAOqD,GAC5D9C,KAAKwI,YAAc,E,CAGrB,IAAKhJ,EAAaQ,KAAKP,OAAQ,CAC7BO,KAAKK,QAAU,I,CAEjB,GAAIL,KAAKK,SAAWL,KAAK4G,OAAS,KAAM,CACtC5G,KAAK4G,MAAMnH,MAAQC,MAAMC,QAAQK,KAAKP,OAASO,KAAKP,MAAM4J,KAAK,KAAOrJ,KAAKP,K,EAIvE,2BAAA2J,CAA4B3J,EAAiBqD,GACnD,GAAIrD,EAAMG,SAAW,GAAMH,EAAMG,SAAW,GAAKH,EAAM,KAAO,GAAK,CACjE,MAAO,E,CAGT,GAAIO,KAAKoG,UAAY,KAAM,CACzB,MAAMkD,EAAiBtJ,KAAKoG,QAAQd,MAAM9D,GAASA,EAAK/B,QAAUA,EAAM,KACxE,OAAO6J,IAAc,MAAdA,SAAc,SAAdA,EAAgB7J,QAAS,E,CAGlC,MAAM8J,EAAczG,EAAMwC,MAAM9D,GAASA,EAAK/B,QAAUA,EAAM,KAC9D,OAAO8J,EAAcvJ,KAAKwH,aAAa+B,GAAe,E,CAGhD,kBAAAP,GACN,MAAMlG,EAAQ9C,KAAKsB,WACnB,MAAMoB,EAAeI,EAAMvB,QAAQC,GAASA,EAAKe,UACjD,MAAMiH,EAAgB9G,EAAaC,KAAKnB,GAASA,EAAK/B,QACtDO,KAAKP,MAAQO,KAAKgC,SACdhC,KAAKgG,kBAAkBzE,QAAQ+G,GAAQkB,EAAclG,SAASgF,KAC9DkB,EAAc5J,OAAS,EACvB4J,EAAc,GACd,E,CAGN,MAAAC,G,MACE,MAAMtC,EAAenH,KAAKmH,eAE1B,OACEU,EAAC6B,EAAW,CACVzJ,QAASD,KAAKC,QACd6H,MAAO9H,KAAK8H,MACZ5H,QAASF,KAAKE,QACd8E,aAAchF,KAAKgF,aACnB7E,WAAYH,KAAKG,WACjBwJ,SAAU3J,KAAK2J,SACf7E,gBAAiB9E,KAAK8E,gBACtB1E,YAAaJ,KAAKI,YAClBwJ,UAAW5J,KAAK4J,UAChBC,eAAgB7J,KAAK6J,eACrB5E,iBAAkBjF,KAAKiF,iBACvB0D,KAAM3I,KAAK2I,KACXmB,aAAc9J,KAAK8D,iBACnBxB,SAAUtC,KAAKsC,SACfyH,SAAU/J,KAAK+J,SACfC,aAAchK,KAAKiK,SAEnBpC,EAAA,gBACEqC,KAAK,OACLC,IAAM5E,GAAQvF,KAAKoD,SAAWmC,EAC9B6E,MAAOpK,KAAKoK,MACZC,eAAgBrK,KAAKgC,SACrBsI,kBAAmBtK,KAAK0E,KACxB6F,2BAA4BvK,KAAKwK,aACjCC,MAAO,CACLC,OAAQ,KACR,eAAgB1K,KAAK+B,OACrB,kBAAiBoB,EAAAnD,KAAKP,SAAK,MAAA0D,SAAA,SAAAA,EAAEvD,UAAW,EACxC,kBAAmBI,KAAKS,SACxB,oBAAqBT,KAAK6I,UAC1B,mBAAoB7I,KAAKsC,SACzB,mBAAoBtC,KAAKgC,SACzB,mBAAoBhC,KAAKgC,UAAYmF,EACrC,8BAA+BnH,KAAKoH,eAAiB,GACrD,gBAAiBpH,KAAK2I,OAAS,QAC/B,iBAAkB3I,KAAK2I,OAAS,SAChC,gBAAiB3I,KAAK2I,OAAS,QAC/B,eAAgB3I,KAAK4I,KACrB,kBAAmB5I,KAAKiK,SAE1BlB,UAAW/I,KAAKoB,gBAAe,sBACVpB,KAAKsE,eAAc,sBACnBtE,KAAK2E,eAC1BgG,kBAAmB3K,KAAK2K,kBACxBC,eAAgB5K,KAAK4K,eACrBrJ,OAAQvB,KAAKuB,OACbsJ,YAAa7K,KAAK6K,aAElBhD,EAAA,OACEJ,KAAK,UACL0C,IAAM5E,GAAQvF,KAAK+D,IAAMwB,EACzBzF,GAAIE,KAAKC,QACTwK,MAAO,CACLK,YAAa,KACb,oBAAqB9K,KAAK+K,KAC1B,4BAA6B/K,KAAKwK,cAEpCQ,KAAK,WAAU,kBACEhL,KAAKE,QAAO,mBACXF,KAAKG,WAAU,gBACnB,OAAM,gBACLH,KAAK+B,OAAS,OAAS,QACtCkJ,SAAUjL,KAAKsC,UAAY,EAAI,EAC/B4I,OAAQlL,KAAKQ,WACb2K,QAASnL,KAAKY,YACdmI,UAAW/I,KAAK4C,eAEhBiF,EAAA,QAAM4C,MAAO,CAAEW,cAAe,KAAM,yBAA0BpL,KAAKwI,YAAY5I,SAC5EI,KAAKwI,YAAY5I,OAAS,EACzBiI,EAAA,QAAMqC,KAAK,OAAOO,MAAM,gBACrBzK,KAAKwI,aAGRxI,KAAKoH,cAAgBpH,KAAKqL,aAI7BrL,KAAK6I,WAAa1B,GACjBU,EAAA,mBACEY,YAAY,oBACZgC,MAAM,gBACNa,KAAK,QACL3C,KAAK,QACLG,QAAS9I,KAAKc,iBACdyK,SAAS,OAIZvL,KAAKgI,gBACJH,EAAA,QAAMqC,KAAK,OAAOO,MAAM,gBACtB5C,EAAA,YAAUc,KAAK,UAAQ,gBAQ3Bd,EAAA,aACEsC,IAAM5E,GAAQvF,KAAK4G,MAAQrB,EAC3BkF,MAAO,CACLe,cAAe,KACf,yBAA0BxL,KAAKwK,cAChC,cACW,OACZT,SAAU/J,KAAK+J,SACfoB,QAASnL,KAAKY,YACdiI,UAAW7I,KAAK6I,UAChBwC,YAAarL,KAAKqL,YAClBzC,KAAM5I,KAAK4I,KACXtG,SAAUtC,KAAKsC,SACfqG,KAAM3I,KAAK2I,KACXsC,UAAW,KAIfpD,EAAA,YACEsC,IAAM5E,GAAQvF,KAAK4D,KAAO2B,EAC1B2E,KAAK,OACLO,MAAO,CACLgB,aAAc,KACd,yBAA0BzL,KAAKuB,QAAUvB,KAAK6K,YAC9C,wBAAyB7K,KAAKgI,gBAC/B,2BACyBhI,KAAKiE,iBAC/BnB,MAAO9C,KAAKoG,QACZD,cAAenG,KAAKmG,cAAa,0BAGjC0B,EAAA,QAAM6D,aAAc1L,KAAK6E,qB,CAO3B,YAAAsC,GACN,OAAOnH,KAAKgC,SAAWhC,KAAKP,MAAMG,OAAS,EAAII,KAAKP,QAAU,E"}

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

@@ -1,2 +0,0 @@
-import{r as i,c as t,h as s,g as e}from"./p-6153045b.js";import{I as r}from"./p-0f510624.js";import{D as n,b as o,a as h}from"./p-698bb2c8.js";import{E as a}from"./p-7d95def3.js";import{h as c}from"./p-15559d38.js";import{a as l,m as p}from"./p-59210f0b.js";const u=()=>{const i=new Date;return{hours:i.getHours(),minutes:i.getMinutes(),seconds:i.getSeconds(),milliseconds:i.getMilliseconds(),has24Hours:true}};const m=12;const d=i=>i>m?i-m:i;const f=()=>{const i=new Date;const t=i.getHours();return{hours:d(t),minutes:i.getMinutes(),seconds:i.getSeconds(),milliseconds:i.getMilliseconds(),has24Hours:false,period:t>=m?"PM":"AM"}};const g=(i=true)=>i?u():f();const x=(i,t)=>{const s=i.split(":");const e=t.split(":");return s.length===e.length};const k=(i,t)=>{const s=i.split(":");const e=t.split(":");if(!x(i,t)){console.error(`Timestring did not match expected format.\nExpected format: ${t}\nReceived timestring: ${i}`)}const r={};s.forEach(((i,t)=>{const s=e[t];switch(s){case"HH":r.hours=Number(i);r.has24Hours=true;break;case"hh":r.hours=Number(i);r.has24Hours=false;break;case"mm":r.minutes=Number(i);break;case"ss":r.seconds=Number(i);break;case"ms":r.milliseconds=Number(i);break;case"aa":r.period=i.toUpperCase()==="PM"?"PM":"AM"}}));return r};const b=(i,t)=>{if(i==null){return""}const s=t.split(":");return s.map((t=>{switch(t){case"HH":case"hh":return String(i.hours).padStart(2,"0");case"mm":return String(i.minutes).padStart(2,"0");case"ss":return String(i.seconds).padStart(2,"0");case"ms":return String(i.milliseconds).padStart(3,"0");case"aa":return String(i.period)}})).join(":")};const v=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}:host{display:block;font-family:var(--six-font-family)}.timepicker_clear{display:inline-flex;align-items:center;font-size:inherit;color:var(--six-input-icon-color);border:none;background:none;padding:0;transition:var(--six-transition-fast) color;cursor:pointer}.timepicker_clear:hover{color:var(--six-input-icon-color-hover)}.timepicker_clear:focus{outline:none}.timepicker_clear--right{right:0;position:absolute}.timepicker_clear--left{right:35px;position:absolute}.timepicker__container{position:relative}.timepicker__popup{display:flex;justify-content:center;min-width:min-content;min-height:145px;background-color:white;padding:0.5em 0.5em 1.5em;box-shadow:0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);user-select:none;position:absolute;z-index:var(--six-z-index-dropdown);right:0;left:0}.timepicker__popup--is-up{bottom:100%}.timepicker__popup--is-inline{position:initial;box-shadow:none;border:1px solid var(--six-color-web-rock-400)}.timepicker__separator{display:flex;align-items:center}.timepicker__item--wide{padding-left:0.5rem;padding-right:0.5rem}.input--empty .timepicker_clear{visibility:hidden}.input--hide{display:none}.prefix{cursor:pointer}.prefix--right{right:0;display:inline-flex;position:absolute;font-size:inherit;color:var(--six-input-icon-color);border:none;background:none;margin-right:var(--six-input-spacing-medium);transition:var(--six-transition-fast) color}";const _=145;const y=class{constructor(s){i(this,s);this.sixChange=t(this,"six-timepicker-change",7);this.sixChangeDebounced=t(this,"six-timepicker-change-debounced",7);this.sixClear=t(this,"six-timepicker-clear",7);this.eventListeners=new a;this.handlePickerChange=(i,t)=>{i.stopPropagation();if(this.popupValue==null){return}this.popupValue[t]=i.detail;const s=b(this.popupValue,this.format);this.value=s;this.sixChange.emit({changedProperty:t,value:this.popupValue,valueAsString:s})};this.handleDocumentMouseDown=i=>{const t=i.composedPath();if(!t.includes(this.host)){this.closePopup();return}};this.handleClearClick=i=>{i.stopPropagation();this.value="";this.sixClear.emit();this.sixChange.emit({value:{},valueAsString:""})};this.format="HH:mm:ss";this.separator=":";this.value="";this.open=false;this.inline=false;this.readonly=false;this.disabled=false;this.placement=undefined;this.size="medium";this.required=false;this.placeholder=undefined;this.errorText="";this.errorTextCount=undefined;this.label="";this.invalid=false;this.name="";this.clearable=false;this.iconPosition="left";this.hoist=false;this.timeout=n;this.interval=o;this.defaultTime=undefined;this.debounce=n;this.isPopupContentUp=false;this.isDropDownContentUp=false;this.popupValue={}}async resizeHandler(){this.calcIsPopupContentUp();this.moveOpenHoistedPopup()}async scrollHandler(){this.calcIsPopupContentUp();this.moveOpenHoistedPopup()}valueChanged(){this.updateValue()}async setFocus(i){var t;(t=this.inputElement)===null||t===void 0?void 0:t.setFocus(i)}connectedCallback(){this.eventListeners.forward("six-timepicker-change","change",this.host)}componentWillLoad(){this.updateValue();if(this.inline){this.open=true}if(this.open){this.eventListeners.add(document,"mousedown",this.handleDocumentMouseDown)}}componentDidLoad(){if(this.inputElement==null)return;const i=this.inputElement;this.eventListeners.add(this.host,"six-timepicker-change",h((i=>this.sixChangeDebounced.emit(i.detail)),this.debounce));this.eventListeners.add(i,"six-input-input",h((t=>{t.stopPropagation();if(!x(i.value,this.format)){this.value=i.value;this.sixChange.emit({value:{},valueAsString:""});return}this.value=i.value;this.popupValue=k(i.value,this.format);this.sixChange.emit({value:this.popupValue,valueAsString:b(this.popupValue,this.format)})}),this.debounce))}componentDidRender(){l(this.hoist,this.popup,this.inputElement,this.wrapper,_,(i=>this.isDropDownContentUp=i))}disconnectedCallback(){this.eventListeners.removeAll()}updateValue(){if(typeof this.value!=="string"||!x(this.value,this.format)){this.value=""}if(this.value===""){if(this.defaultTime==null){this.popupValue=g(this.is24HourClock())}else{this.popupValue=k(this.defaultTime,this.format)}}else{this.popupValue=k(this.value,this.format)}}calcIsPopupContentUp(){if(this.inputElement==null||this.wrapper==null){return}const i=this.inputElement.getBoundingClientRect();const t=this.wrapper.getBoundingClientRect();const s=Math.max(t.height,_);const e=i.y>window.innerHeight/2;this.isPopupContentUp=e&&window.innerHeight<i.bottom+s}moveOpenHoistedPopup(){p(this.hoist,this.open,this.popup,this.inputElement,this.wrapper,_)}getSixTimeUnitPicker(i){return s("six-item-picker",{class:i.class,timeout:this.timeout,interval:this.interval,padded:true,min:i.min,max:i.max,value:this.popupValue[i.propertyName],items:i.items,type:i.type||r.NUMBER,"padding-length":i.paddingLength,"onSix-item-picker-change":t=>this.handlePickerChange(t,i.propertyName)})}getHour24Picker(){if(!this.is24HourClock()){return}return this.getSixTimeUnitPicker({min:0,max:23,propertyName:"hours"})}is24HourClock(){return this.format.includes("HH")}getHour12Picker(){if(!this.is12HourClock()){return}return this.getSixTimeUnitPicker({min:0,max:11,propertyName:"hours"})}is12HourClock(){return this.format.includes("hh")}getAmPmPicker(){if(!this.is12HourClock()){return}const i=["AM","PM"];return this.getSixTimeUnitPicker({items:i,type:r.CUSTOM,propertyName:"period"})}getMinutePicker(){if(!this.format.includes("mm")){return}return this.getSixTimeUnitPicker({min:0,max:59,propertyName:"minutes"})}getSecondsPicker(){if(!this.format.includes("ss")){return}return this.getSixTimeUnitPicker({min:0,max:59,propertyName:"seconds"})}getMillisecondsPicker(){if(!this.format.includes("ms")){return}return this.getSixTimeUnitPicker({min:0,max:999,class:"timepicker__item--wide",paddingLength:3,propertyName:"milliseconds"})}getSeparator(){return s("div",{class:"timepicker__separator"},s("span",null,this.separator))}getContent(){const i=[this.getHour24Picker(),this.getHour12Picker(),this.getMinutePicker(),this.getSecondsPicker(),this.getMillisecondsPicker()];const t=i.filter((i=>i!==undefined));return t.map(((i,s)=>{if(s===t.length-1){return[i]}return[i,this.getSeparator()]}))}openPopup(){if(!this.open&&!this.disabled){this.open=true;this.eventListeners.add(document,"mousedown",this.handleDocumentMouseDown)}}closePopup(){if(this.inline){return}this.open=false;this.eventListeners.remove(document,"mousedown",this.handleDocumentMouseDown)}renderClearable(){return this.clearable&&s("button",{slot:"suffix",class:{timepicker_clear:true,"timepicker_clear--right":this.iconPosition==="left","timepicker_clear--left":this.iconPosition==="right"},type:"button",onClick:this.handleClearClick,tabindex:"-1"},s("six-icon",{size:"small"},"clear"))}renderCustomIcon(){const i=c(this.host,"custom-icon")?s("slot",{name:"custom-icon"}):s("six-icon",{size:this.size==="large"?"medium":this.size},"watch_later");return s("span",{slot:"prefix",part:"icon",class:{prefix:true,"prefix--right":this.iconPosition==="right"}},i)}render(){return s("div",{part:"container",ref:i=>this.wrapper=i,class:"timepicker__container"},s("six-input",{ref:i=>this.inputElement=i,part:"input",onClick:()=>this.openPopup(),value:this.value,placeholder:this.placeholder,readonly:this.readonly,disabled:this.disabled,errorTextCount:this.errorTextCount,errorText:this.errorText,invalid:this.invalid,size:this.size,name:this.name,label:this.label,required:this.required,class:{"input--empty":this.value==="","input--hide":this.inline}},this.renderCustomIcon(),this.renderClearable(),c(this.host,"label")?s("span",{slot:"label"},s("slot",{name:"label"})):null,c(this.host,"error-text")?s("span",{slot:"error-text"},s("slot",{name:"error-text"})):null),this.open&&s("div",{ref:i=>this.popup=i,part:"popup",class:{timepicker__popup:true,"timepicker__popup--is-up":this.placement==null?this.placement==="top":this.isPopupContentUp,"timepicker__popup--is-inline":this.inline}},...this.getContent(),this.getAmPmPicker()))}get host(){return e(this)}static get watchers(){return{value:["valueChanged"]}}};y.style=v;export{y as six_timepicker};
-//# sourceMappingURL=p-b6f47c9d.entry.js.map

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

@@ -1,2 +0,0 @@
-import{r as i,c as e,h as t,g as s}from"./p-6153045b.js";import{h as l,g as a}from"./p-15559d38.js";const o=':host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}:host{display:inline-block}.tile{min-height:var(--tile-size);width:var(--tile-size);background-color:var(--six-color-clay-50);display:inline-grid;grid-template-columns:100%;grid-template-areas:"header" "middle" "footer"}.tile--small{--tile-size:80px;--tile-padding-size:var(--six-spacing-medium)}.tile--medium{--tile-size:120px;--tile-padding-size:var(--six-spacing-large)}.tile--large{--tile-size:160px;--tile-padding-size:var(--six-spacing-x-large)}.tile:not(.tile--visible){visibility:hidden}.tile--elevated{border:0;box-shadow:var(--six-elevation-8dp)}.tile__header{grid-area:header;height:5%;justify-self:right;display:flex;justify-content:right;opacity:0;transition:var(--six-transition-fast) opacity}.tile:hover>.tile__header{opacity:1}.tile__header--hidden{visibility:hidden}.tile__header six-icon-button{margin-top:-6px;margin-right:-6px;margin-bottom:-16px}.tile__body,.tile__body--large,.tile__body--medium,.tile__body--small{grid-area:middle;display:grid;place-items:center;cursor:pointer;padding-left:var(--tile-padding-size);padding-right:var(--tile-padding-size)}.tile__body six-icon::part(base),.tile__body--large six-icon::part(base),.tile__body--medium six-icon::part(base),.tile__body--small six-icon::part(base){padding:0}.tile__body--small{--tile-padding-size:var(--six-spacing-medium)}.tile__body--medium{--tile-padding-size:var(--six-spacing-large)}.tile__body--large{--tile-padding-size:var(--six-spacing-x-large)}.tile__footer,.tile__footer--large,.tile__footer--medium,.tile__footer--small{grid-area:footer;display:flex;justify-content:center;cursor:pointer;font-weight:var(--six-font-weight-normal);color:var(--six-color-web-rock-900)}.tile__footer--small{font-size:var(--six-font-size-xxx-small)}.tile__footer--medium{font-size:var(--six-font-size-xx-small)}.tile__footer--large{font-size:var(--six-font-size-small)}.tile__footer .label__footer,.tile__footer--small .label__footer,.tile__footer--medium .label__footer,.tile__footer--large .label__footer{overflow:hidden;text-overflow:ellipsis;width:calc(var(--tile-size) - 2em);text-align:center}';const r=class{constructor(t){i(this,t);this.sixTileClose=e(this,"six-tile-closed",7);this.sixTileSelected=e(this,"six-tile-selected",7);this.handleSlotChange=()=>{this.hasIconSlot=l(this.host,"icon");this.hasLabelSlot=l(this.host,"label");if(this.hasIconSlot){const i=a(this.host,"icon");i===null||i===void 0?void 0:i.addEventListener("click",this.handleClickEvent)}if(this.hasLabelSlot){const i=a(this.host,"label");i===null||i===void 0?void 0:i.addEventListener("click",this.handleClickEvent)}};this.handleCloseClickEvent=()=>{this.visible=false;this.sixTileClose.emit()};this.handleClickEvent=()=>{this.sixTileSelected.emit()};this.label="";this.iconName=undefined;this.closeable=true;this.elevated=false;this.disableTooltip=true;this.disabled=false;this.size="medium";this.visible=true;this.hasIconSlot=false;this.hasLabelSlot=false}async hide(){this.visible=false}async show(){this.visible=true}componentWillLoad(){this.handleSlotChange()}render(){return t("six-tooltip",{disabled:this.disableTooltip||this.label==="",content:this.label},t("div",{part:"base",class:{tile:true,"tile--visible":this.visible,"tile--small":this.size==="small","tile--medium":this.size==="medium","tile--large":this.size==="large","tile--elevated":this.elevated}},t("div",{part:"header",class:"tile__header"},t("six-icon-button",{class:{"tile__header--hidden":!this.closeable},name:"close",size:d(this.size),onClick:this.handleCloseClickEvent})),t("div",{part:"body",class:"tile__body"},this.iconName&&t("six-icon",{onClick:this.handleClickEvent,size:n(this.size)},this.iconName),this.hasIconSlot&&t("slot",{name:"icon"})),t("div",{part:"footer",class:{"tile__footer--small":this.size==="small","tile__footer--medium":this.size==="medium","tile__footer--large":this.size==="large"}},this.label&&t("div",{class:{".label__footer":true},onClick:this.handleClickEvent},this.label),this.hasLabelSlot&&t("slot",{name:"label"}))))}get host(){return s(this)}};const d=i=>({small:"xxSmall",medium:"medium",large:"medium"}[i]);const n=i=>({small:"xLarge",medium:"xxLarge",large:"xxxLarge"}[i]);r.style=o;export{r as six_tile};
-//# sourceMappingURL=p-c03ebf7d.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["sixTileCss","SixTile","this","handleSlotChange","hasIconSlot","hasSlot","host","hasLabelSlot","slot","getSlot","addEventListener","handleClickEvent","handleCloseClickEvent","visible","sixTileClose","emit","sixTileSelected","hide","show","componentWillLoad","render","h","disabled","disableTooltip","label","content","part","class","tile","size","elevated","closeable","name","closeIconSize","onClick","iconName","iconSize","small","medium","large"],"sources":["src/components/six-tile/six-tile.scss?tag=six-tile&encapsulation=shadow","src/components/six-tile/six-tile.tsx"],"sourcesContent":["@import 'src/global/component';\n\n:host {\n  display: inline-block;\n}\n\n.tile {\n  &--small {\n    --tile-size: 80px;\n    --tile-padding-size: var(--six-spacing-medium);\n  }\n\n  &--medium {\n    --tile-size: 120px;\n    --tile-padding-size: var(--six-spacing-large);\n  }\n\n  &--large {\n    --tile-size: 160px;\n    --tile-padding-size: var(--six-spacing-x-large);\n  }\n\n  min-height: var(--tile-size);\n  width: var(--tile-size);\n\n  background-color: var(--six-color-clay-50);\n\n  display: inline-grid;\n  grid-template-columns: 100%;\n  grid-template-areas:\n    'header'\n    'middle'\n    'footer';\n\n  &:not(.tile--visible) {\n    visibility: hidden;\n  }\n\n  &--elevated {\n    border: 0;\n    box-shadow: var(--six-elevation-8dp);\n  }\n}\n\n.tile__header {\n  grid-area: header;\n  height: 5%;\n  justify-self: right;\n  display: flex;\n  justify-content: right;\n  opacity: 0;\n  transition: var(--six-transition-fast) opacity;\n\n  .tile:hover > & {\n    opacity: 1;\n  }\n\n  &--hidden {\n    visibility: hidden;\n  }\n\n  six-icon-button {\n    margin-top: -6px;\n    margin-right: -6px;\n    margin-bottom: -16px;\n  }\n}\n\n.tile__body {\n  grid-area: middle;\n  display: grid;\n  place-items: center;\n  cursor: pointer;\n\n  six-icon::part(base) {\n    padding: 0;\n  }\n\n  &--small {\n    @extend .tile__body;\n    --tile-padding-size: var(--six-spacing-medium);\n  }\n\n  &--medium {\n    @extend .tile__body;\n    --tile-padding-size: var(--six-spacing-large);\n  }\n\n  &--large {\n    @extend .tile__body;\n    --tile-padding-size: var(--six-spacing-x-large);\n  }\n\n  padding-left: var(--tile-padding-size);\n  padding-right: var(--tile-padding-size);\n}\n\n.tile__footer {\n  grid-area: footer;\n  display: flex;\n  justify-content: center;\n  cursor: pointer;\n  font-weight: var(--six-font-weight-normal);\n  color: var(--six-color-web-rock-900);\n\n  &--small {\n    @extend .tile__footer;\n    font-size: var(--six-font-size-xxx-small);\n  }\n\n  &--medium {\n    @extend .tile__footer;\n    font-size: var(--six-font-size-xx-small);\n  }\n\n  &--large {\n    @extend .tile__footer;\n    font-size: var(--six-font-size-small);\n  }\n\n  .label__footer {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    width: calc(var(--tile-size) - 2em);\n    text-align: center;\n  }\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State } from '@stencil/core';\nimport { EmptyPayload } from '../../utils/types';\nimport { getSlot, hasSlot } from '../../utils/slot';\n\n/**\n * @since 1.0\n * @status stable\n */\n\n@Component({\n  tag: 'six-tile',\n  styleUrl: 'six-tile.scss',\n  shadow: true,\n})\nexport class SixTile {\n  @Element() host!: HTMLSixTileElement;\n\n  /** The tile's label. */\n  @Prop() label = '';\n\n  /** The icon's name. */\n  @Prop() iconName?: string;\n\n  /** Flag, whether the tile is closeable. */\n  @Prop() closeable = true;\n\n  /** Flag, whether the tile should cast a shadow. */\n  @Prop() elevated = false;\n\n  /** Enables tile tooltip for tiles */\n  @Prop() disableTooltip = true;\n\n  /** Set to true to disable the tile. */\n  @Prop({ reflect: true }) disabled = false;\n\n  /** The tile's size. */\n  @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n  @State() visible = true;\n\n  /** Emitted when the tile was closed. */\n  @Event({ eventName: 'six-tile-closed' }) sixTileClose!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the tile is selected. */\n  @Event({ eventName: 'six-tile-selected' }) sixTileSelected!: EventEmitter<EmptyPayload>;\n\n  /** Hides the tile */\n  @Method()\n  async hide() {\n    this.visible = false;\n  }\n\n  /** Shows the tile */\n  @Method()\n  async show() {\n    this.visible = true;\n  }\n\n  @State() hasIconSlot = false;\n\n  @State() hasLabelSlot = false;\n\n  componentWillLoad() {\n    this.handleSlotChange();\n  }\n\n  private handleSlotChange = () => {\n    this.hasIconSlot = hasSlot(this.host, 'icon');\n    this.hasLabelSlot = hasSlot(this.host, 'label');\n\n    if (this.hasIconSlot) {\n      const slot = getSlot(this.host, 'icon');\n      slot?.addEventListener('click', this.handleClickEvent);\n    }\n\n    if (this.hasLabelSlot) {\n      const slot = getSlot(this.host, 'label');\n      slot?.addEventListener('click', this.handleClickEvent);\n    }\n  };\n\n  render() {\n    return (\n      <six-tooltip disabled={this.disableTooltip || this.label === ''} content={this.label}>\n        <div\n          part=\"base\"\n          class={{\n            tile: true,\n            'tile--visible': this.visible,\n            'tile--small': this.size === 'small',\n            'tile--medium': this.size === 'medium',\n            'tile--large': this.size === 'large',\n            'tile--elevated': this.elevated,\n          }}\n        >\n          <div part=\"header\" class=\"tile__header\">\n            <six-icon-button\n              class={{\n                'tile__header--hidden': !this.closeable,\n              }}\n              name=\"close\"\n              size={closeIconSize(this.size)}\n              onClick={this.handleCloseClickEvent}\n            />\n          </div>\n\n          <div part=\"body\" class=\"tile__body\">\n            {this.iconName && (\n              <six-icon onClick={this.handleClickEvent} size={iconSize(this.size)}>\n                {this.iconName}\n              </six-icon>\n            )}\n            {this.hasIconSlot && <slot name=\"icon\"></slot>}\n          </div>\n\n          <div\n            part=\"footer\"\n            class={{\n              'tile__footer--small': this.size === 'small',\n              'tile__footer--medium': this.size === 'medium',\n              'tile__footer--large': this.size === 'large',\n            }}\n          >\n            {this.label && (\n              <div\n                class={{\n                  '.label__footer': true,\n                }}\n                onClick={this.handleClickEvent}\n              >\n                {this.label}\n              </div>\n            )}\n            {this.hasLabelSlot && <slot name=\"label\"></slot>}\n          </div>\n        </div>\n      </six-tooltip>\n    );\n  }\n\n  private handleCloseClickEvent = () => {\n    this.visible = false;\n    this.sixTileClose.emit();\n  };\n\n  private handleClickEvent = () => {\n    this.sixTileSelected.emit();\n  };\n}\n\nconst closeIconSize = (size: string) => {\n  return {\n    small: 'xxSmall',\n    medium: 'medium',\n    large: 'medium',\n  }[size] as 'xSmall' | 'medium';\n};\n\nconst iconSize = (size: string) => {\n  return {\n    small: 'xLarge',\n    medium: 'xxLarge',\n    large: 'xxxLarge',\n  }[size] as 'xLarge' | 'xxLarge' | 'xxxLarge';\n};\n"],"mappings":"oGAAA,MAAMA,EAAa,moE,MCcNC,EAAO,M,0HAoDVC,KAAAC,iBAAmB,KACzBD,KAAKE,YAAcC,EAAQH,KAAKI,KAAM,QACtCJ,KAAKK,aAAeF,EAAQH,KAAKI,KAAM,SAEvC,GAAIJ,KAAKE,YAAa,CACpB,MAAMI,EAAOC,EAAQP,KAAKI,KAAM,QAChCE,IAAI,MAAJA,SAAI,SAAJA,EAAME,iBAAiB,QAASR,KAAKS,iB,CAGvC,GAAIT,KAAKK,aAAc,CACrB,MAAMC,EAAOC,EAAQP,KAAKI,KAAM,SAChCE,IAAI,MAAJA,SAAI,SAAJA,EAAME,iBAAiB,QAASR,KAAKS,iB,GA+DjCT,KAAAU,sBAAwB,KAC9BV,KAAKW,QAAU,MACfX,KAAKY,aAAaC,MAAM,EAGlBb,KAAAS,iBAAmB,KACzBT,KAAKc,gBAAgBD,MAAM,E,WAhIb,G,uCAMI,K,cAGD,M,oBAGM,K,cAGW,M,UAG0B,S,aAE3C,K,iBAoBI,M,kBAEC,K,CAZxB,UAAME,GACJf,KAAKW,QAAU,K,CAKjB,UAAMK,GACJhB,KAAKW,QAAU,I,CAOjB,iBAAAM,GACEjB,KAAKC,kB,CAkBP,MAAAiB,GACE,OACEC,EAAA,eAAaC,SAAUpB,KAAKqB,gBAAkBrB,KAAKsB,QAAU,GAAIC,QAASvB,KAAKsB,OAC7EH,EAAA,OACEK,KAAK,OACLC,MAAO,CACLC,KAAM,KACN,gBAAiB1B,KAAKW,QACtB,cAAeX,KAAK2B,OAAS,QAC7B,eAAgB3B,KAAK2B,OAAS,SAC9B,cAAe3B,KAAK2B,OAAS,QAC7B,iBAAkB3B,KAAK4B,WAGzBT,EAAA,OAAKK,KAAK,SAASC,MAAM,gBACvBN,EAAA,mBACEM,MAAO,CACL,wBAAyBzB,KAAK6B,WAEhCC,KAAK,QACLH,KAAMI,EAAc/B,KAAK2B,MACzBK,QAAShC,KAAKU,yBAIlBS,EAAA,OAAKK,KAAK,OAAOC,MAAM,cACpBzB,KAAKiC,UACJd,EAAA,YAAUa,QAAShC,KAAKS,iBAAkBkB,KAAMO,EAASlC,KAAK2B,OAC3D3B,KAAKiC,UAGTjC,KAAKE,aAAeiB,EAAA,QAAMW,KAAK,UAGlCX,EAAA,OACEK,KAAK,SACLC,MAAO,CACL,sBAAuBzB,KAAK2B,OAAS,QACrC,uBAAwB3B,KAAK2B,OAAS,SACtC,sBAAuB3B,KAAK2B,OAAS,UAGtC3B,KAAKsB,OACJH,EAAA,OACEM,MAAO,CACL,iBAAkB,MAEpBO,QAAShC,KAAKS,kBAEbT,KAAKsB,OAGTtB,KAAKK,cAAgBc,EAAA,QAAMW,KAAK,Y,6BAiB7C,MAAMC,EAAiBJ,IACd,CACLQ,MAAO,UACPC,OAAQ,SACRC,MAAO,UACPV,IAGJ,MAAMO,EAAYP,IACT,CACLQ,MAAO,SACPC,OAAQ,UACRC,MAAO,YACPV,I"}

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

@@ -1,2 +0,0 @@
-import{r as i,c as s,h as t,g as e}from"./p-6153045b.js";import{f as a}from"./p-5654e4c7.js";const o=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}:host{--hide-duration:var(--six-transition-medium);--hide-timing-function:ease;--show-duration:var(--six-transition-medium);--show-timing-function:ease;--horizontal-padding:var(--six-spacing-medium);font-family:var(--six-font-family);display:block}.details{border:solid var(--six-border-width) var(--six-input-border-color);border-radius:var(--six-border-radius-medium);color:var(--six-details-color);overflow-anchor:none;font-size:var(--six-input-font-size-medium)}.details:hover:not(.details--disabled):not(.details--open){border-color:var(--six-input-border-color-hover)}.details.inline{border:none;color:var(--six-sidebar-color)}.details.inline:hover{background-color:var(--six-sidebar-hover-background-color)}.details.inline.details--open{background-color:var(--six-color-web-rock-50)}.details.inline.details--open:hover{border:none;box-shadow:none}.details.inline.details--open>.details__header{color:var(--six-sidebar-color);font-weight:var(--six-font-weight-bold);background-color:var(--six-sidebar-header-background-color)}.details--disabled{background-color:var(--six-input-background-color-disabled);border-color:var(--six-input-border-color-disabled);color:var(--six-input-color-disabled)}.details__header{display:flex;align-items:center;border-radius:inherit;padding:var(--six-spacing-medium) var(--horizontal-padding);user-select:none;cursor:pointer}.details__header:focus{outline:none}.details--disabled .details__header{cursor:not-allowed;border-width:1px}.details--disabled .details__header:focus{outline:none;box-shadow:none}.details__summary{flex:1 1 auto;display:flex;align-items:center}.details__summary-icon{flex:0 0 auto;display:flex;align-items:center;font-size:1.2em;transition:var(--six-transition-medium) transform ease}.details--open .details__summary-icon--animate{transform:rotate(-180deg)}.details--open:hover{color:var(--six-input-color-focus)}.details__body{height:0;overflow:hidden;transition-property:height;transition-duration:var(--hide-duration);transition-timing-function:var(--hide-timing-function)}.details--open .details__body{transition-duration:var(--show-duration);transition-timing-function:var(--show-timing-function)}.details__content{padding:var(--six-spacing-medium)}";let r=0;const n=class{constructor(t){i(this,t);this.sixShow=s(this,"six-details-show",7);this.sixAfterShow=s(this,"six-details-after-show",7);this.sixHide=s(this,"six-details-hide",7);this.sixAfterHide=s(this,"six-details-after-hide",7);this.componentId=`details-${++r}`;this.isVisible=false;this.handleBodyTransitionEnd=i=>{if(this.body==null)return;const s=i.target;if(i.propertyName==="height"&&s.classList.contains("details__body")){this.body.style.overflow=this.open?"visible":"hidden";this.body.style.height=this.open?"auto":"0";this.open?this.sixAfterShow.emit():this.sixAfterHide.emit();this.body.hidden=!this.open}};this.handleSummaryClick=()=>{var i;if(!this.disabled&&(this.hasContent||this.selectableEmpty)){this.open?this.hide():this.show();(i=this.header)===null||i===void 0?void 0:i.focus()}};this.handleSummaryKeyDown=i=>{if(i.key==="Enter"||i.key===" "){i.preventDefault();this.open?this.hide():this.show()}if(i.key==="ArrowUp"||i.key==="ArrowLeft"){i.preventDefault();this.hide()}if(i.key==="ArrowDown"||i.key==="ArrowRight"){i.preventDefault();this.show()}};this.animateSummaryIcon=true;this.open=false;this.summary="";this.summaryIcon=undefined;this.summaryIconSize="inherit";this.disabled=false;this.inline=false;this.selectableEmpty=false;this.hasContent=true}handleOpenChange(){if(this.body!=null){this.open?this.show():this.hide()}}componentDidLoad(){if(this.details==null||this.body==null)return;a.observe(this.details);this.body.hidden=!this.open;if(this.open){this.show()}}disconnectedCallback(){if(this.details!=null){a.unobserve(this.details)}}async show(){if(this.isVisible||this.body==null)return;const i=this.sixShow.emit();if(i.defaultPrevented){this.open=false;return}this.body.hidden=false;if(this.body.scrollHeight===0){this.body.style.height="auto";this.body.style.overflow="visible"}else{this.body.style.height=`${this.body.scrollHeight}px`;this.body.style.overflow="hidden"}this.isVisible=true;this.open=true}async hide(){if(!this.isVisible||this.body==null)return;const i=this.body;const s=this.sixHide.emit();if(s.defaultPrevented){this.open=true;return}i.style.height=`${i.scrollHeight}px`;i.style.overflow="hidden";requestAnimationFrame((()=>{i.style.height="0"}));this.isVisible=false;this.open=false}render(){const i=this.hasContent&&(this.summaryIcon||"expand_more");return t("div",{ref:i=>this.details=i,part:"base",class:{details:true,"details--open":this.open,"details--disabled":this.disabled,inline:this.inline}},t("header",{ref:i=>this.header=i,part:"header",id:`${this.componentId}-header`,class:"details__header",role:"button","aria-expanded":this.open?"true":"false","aria-controls":`${this.componentId}-content`,"aria-disabled":this.disabled?"true":"false",tabIndex:this.disabled?-1:0,onClick:this.handleSummaryClick,onKeyDown:this.handleSummaryKeyDown},t("div",{part:"summary",class:"details__summary"},t("slot",{name:"summary"},this.summary)),t("span",{part:"summary-icon",class:{"details__summary-icon":true,"details__summary-icon--animate":this.animateSummaryIcon}},t("slot",{name:"summary-icon",onSlotchange:()=>this.animateSummaryIcon=false},i&&t("six-icon",{size:this.summaryIconSize},i)))),t("div",{ref:i=>this.body=i,class:"details__body",onTransitionEnd:this.handleBodyTransitionEnd},t("div",{part:"content",id:`${this.componentId}-content`,class:"details__content",role:"region","aria-labelledby":`${this.componentId}-header`},t("slot",null))))}get host(){return e(this)}static get watchers(){return{open:["handleOpenChange"]}}};n.style=o;export{n as six_details};
-//# sourceMappingURL=p-cba69e9d.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["sixDetailsCss","id","SixDetails","this","componentId","isVisible","handleBodyTransitionEnd","event","body","target","propertyName","classList","contains","style","overflow","open","height","sixAfterShow","emit","sixAfterHide","hidden","handleSummaryClick","disabled","hasContent","selectableEmpty","hide","show","_a","header","focus","handleSummaryKeyDown","key","preventDefault","handleOpenChange","componentDidLoad","details","focusVisible","observe","disconnectedCallback","unobserve","sixShow","defaultPrevented","scrollHeight","sixHide","requestAnimationFrame","render","summaryIcon","h","ref","el","part","class","inline","role","tabIndex","onClick","onKeyDown","name","summary","animateSummaryIcon","onSlotchange","size","summaryIconSize","onTransitionEnd"],"sources":["src/components/six-details/six-details.scss?tag=six-details&encapsulation=shadow","src/components/six-details/six-details.tsx"],"sourcesContent":["@import 'src/global/component';\n\n/**\n * @prop --hide-duration: The length of the hide transition.\n * @prop --hide-timing-function: The timing function (easing) to use for the hide transition.\n * @prop --show-duration: The length of the show transition.\n * @prop --show-timing-function: The timing function (easing) to use for the show transition.\n * @prop --horizontal-padding: The horizontal padding\n */\n:host {\n  --hide-duration: var(--six-transition-medium);\n  --hide-timing-function: ease;\n  --show-duration: var(--six-transition-medium);\n  --show-timing-function: ease;\n  --horizontal-padding: var(--six-spacing-medium);\n\n  font-family: var(--six-font-family);\n  display: block;\n}\n\n.details {\n  border: solid var(--six-border-width) var(--six-input-border-color);\n  border-radius: var(--six-border-radius-medium);\n  color: var(--six-details-color);\n  overflow-anchor: none;\n  font-size: var(--six-input-font-size-medium);\n\n  &:hover:not(.details--disabled):not(.details--open) {\n    border-color: var(--six-input-border-color-hover);\n  }\n\n  &.inline {\n    border: none;\n    color: var(--six-sidebar-color);\n\n    &:hover {\n      background-color: var(--six-sidebar-hover-background-color);\n    }\n\n    &.details--open {\n      background-color: var(--six-color-web-rock-50);\n\n      &:hover {\n        border: none;\n        box-shadow: none;\n      }\n\n      & > .details__header {\n        color: var(--six-sidebar-color);\n        font-weight: var(--six-font-weight-bold);\n        background-color: var(--six-sidebar-header-background-color);\n      }\n    }\n  }\n}\n\n.details--disabled {\n  background-color: var(--six-input-background-color-disabled);\n  border-color: var(--six-input-border-color-disabled);\n  color: var(--six-input-color-disabled);\n}\n\n.details__header {\n  display: flex;\n  align-items: center;\n  border-radius: inherit;\n  padding: var(--six-spacing-medium) var(--horizontal-padding);\n  user-select: none;\n  cursor: pointer;\n\n  &:focus {\n    outline: none;\n  }\n}\n\n.focus-visible .details__header:focus {\n}\n\n.details--disabled .details__header {\n  cursor: not-allowed;\n  border-width: 1px;\n\n  &:focus {\n    outline: none;\n    box-shadow: none;\n  }\n}\n\n.details__summary {\n  flex: 1 1 auto;\n  display: flex;\n  align-items: center;\n}\n\n.details__summary-icon {\n  flex: 0 0 auto;\n  display: flex;\n  align-items: center;\n  font-size: 1.2em;\n  transition: var(--six-transition-medium) transform ease;\n}\n\n.details--open .details__summary-icon--animate {\n  transform: rotate(-180deg);\n}\n\n.details--open:hover {\n  color: var(--six-input-color-focus);\n}\n\n.details__body {\n  height: 0;\n  overflow: hidden;\n  transition-property: height;\n  transition-duration: var(--hide-duration);\n  transition-timing-function: var(--hide-timing-function);\n}\n\n.details--open .details__body {\n  transition-duration: var(--show-duration);\n  transition-timing-function: var(--show-timing-function);\n}\n\n.details__content {\n  padding: var(--six-spacing-medium);\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { focusVisible } from '../../utils/focus-visible';\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 details' content.\n * @slot summary - The details' summary. Alternatively, you can use the summary prop.\n *\n * @part base - The component's base wrapper.\n * @part header - The summary header.\n * @part summary - The details summary.\n * @part summary-icon - The expand/collapse summary icon.\n * @part content - The details content.\n */\n\n@Component({\n  tag: 'six-details',\n  styleUrl: 'six-details.scss',\n  shadow: true,\n})\nexport class SixDetails {\n  @Element() readonly host!: HTMLSixDetailsElement;\n\n  @State() animateSummaryIcon = true;\n\n  private body?: HTMLElement;\n  private details?: HTMLElement;\n  private header?: HTMLElement;\n  private componentId = `details-${++id}`;\n  private isVisible = false;\n\n  /** Indicates whether the details is open. You can use this in lieu of the show/hide methods. */\n  @Prop({ mutable: true, reflect: true }) open = false;\n\n  /** The summary to show in the details header. If you need to display HTML, use the `summary` slot instead. */\n  @Prop() summary = '';\n\n  /** The summary icon to show in the details header. If you need to display HTML, use the `summary-icon` slot instead. */\n  @Prop() summaryIcon?: string;\n\n  /** The icon's size. */\n  @Prop({ reflect: true }) summaryIconSize:\n    | 'inherit'\n    | 'xSmall'\n    | 'small'\n    | 'medium'\n    | 'large'\n    | 'xLarge'\n    | 'xxLarge'\n    | 'xxxLarge' = 'inherit';\n\n  /** Set to true to prevent the user from toggling the details. */\n  @Prop() disabled = false;\n\n  /** Set to true when you want to use six-details inline e.g. in a sidebar */\n  @Prop() inline = false;\n\n  /** Set to true when you want details without content to be selectable. This is important if you e.g. have a toggled sidebar where some menus have no children  */\n  @Prop() selectableEmpty = false;\n\n  /** Set to false when you want to hide the summary icon and disable the open/close mechanism. Usually not needed, but used internally by 'six-sidebar-item-group' */\n  @Prop() hasContent = true;\n\n  @Watch('open')\n  handleOpenChange() {\n    if (this.body != null) {\n      this.open ? this.show() : this.hide();\n    }\n  }\n\n  /** Emitted when the details opens. Calling `event.preventDefault()` will prevent it from being opened. */\n  @Event({ eventName: 'six-details-show' }) sixShow!: EventEmitter<EmptyPayload>;\n\n  /** Emitted after the details opens and all transitions are complete. */\n  @Event({ eventName: 'six-details-after-show' }) sixAfterShow!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the details closes. Calling `event.preventDefault()` will prevent it from being closed. */\n  @Event({ eventName: 'six-details-hide' }) sixHide!: EventEmitter<EmptyPayload>;\n\n  /** Emitted after the details closes and all transitions are complete. */\n  @Event({ eventName: 'six-details-after-hide' }) sixAfterHide!: EventEmitter<EmptyPayload>;\n\n  componentDidLoad() {\n    if (this.details == null || this.body == null) return;\n\n    focusVisible.observe(this.details);\n    this.body.hidden = !this.open;\n\n    // Show on init if open\n    if (this.open) {\n      this.show();\n    }\n  }\n\n  disconnectedCallback() {\n    if (this.details != null) {\n      focusVisible.unobserve(this.details);\n    }\n  }\n\n  /** Shows the detail body */\n  @Method()\n  async show() {\n    // Prevent subsequent calls to the method, whether manually or triggered by the `open` watcher\n    if (this.isVisible || this.body == null) return;\n\n    const sixShow = this.sixShow.emit();\n    if (sixShow.defaultPrevented) {\n      this.open = false;\n      return;\n    }\n\n    this.body.hidden = false;\n\n    if (this.body.scrollHeight === 0) {\n      // When the scroll height can't be measured, use auto. This prevents a borked open state when the details is open\n      // initially, but not immediately visible (i.e. in a tab panel).\n      this.body.style.height = 'auto';\n      this.body.style.overflow = 'visible';\n    } else {\n      this.body.style.height = `${this.body.scrollHeight}px`;\n      this.body.style.overflow = 'hidden';\n    }\n    this.isVisible = true;\n    this.open = true;\n  }\n\n  /** Hides the detail body */\n  @Method()\n  async hide() {\n    // Prevent subsequent calls to the method, whether manually or triggered by the `open` watcher\n    if (!this.isVisible || this.body == null) return;\n    const body = this.body;\n\n    const sixHide = this.sixHide.emit();\n    if (sixHide.defaultPrevented) {\n      this.open = true;\n      return;\n    }\n\n    // We can't transition out of `height: auto`, so let's set it to the current height first\n    body.style.height = `${body.scrollHeight}px`;\n    body.style.overflow = 'hidden';\n\n    requestAnimationFrame(() => {\n      // tslint:disable-next-line: no-unused-expression\n      body.clientWidth; // force a reflow\n      body.style.height = '0';\n    });\n\n    this.isVisible = false;\n    this.open = false;\n  }\n\n  private handleBodyTransitionEnd = (event: TransitionEvent) => {\n    if (this.body == null) return;\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 === 'height' && target.classList.contains('details__body')) {\n      this.body.style.overflow = this.open ? 'visible' : 'hidden';\n      this.body.style.height = this.open ? 'auto' : '0';\n      this.open ? this.sixAfterShow.emit() : this.sixAfterHide.emit();\n      this.body.hidden = !this.open;\n    }\n  };\n\n  private handleSummaryClick = () => {\n    if (!this.disabled && (this.hasContent || this.selectableEmpty)) {\n      this.open ? this.hide() : this.show();\n      this.header?.focus();\n    }\n  };\n\n  private handleSummaryKeyDown = (event: KeyboardEvent) => {\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault();\n      this.open ? this.hide() : this.show();\n    }\n\n    if (event.key === 'ArrowUp' || event.key === 'ArrowLeft') {\n      event.preventDefault();\n      this.hide();\n    }\n\n    if (event.key === 'ArrowDown' || event.key === 'ArrowRight') {\n      event.preventDefault();\n      this.show();\n    }\n  };\n\n  render() {\n    const summaryIcon = this.hasContent && (this.summaryIcon || 'expand_more');\n\n    return (\n      <div\n        ref={(el) => (this.details = el)}\n        part=\"base\"\n        class={{\n          details: true,\n          'details--open': this.open,\n          'details--disabled': this.disabled,\n          inline: this.inline,\n        }}\n      >\n        <header\n          ref={(el) => (this.header = el)}\n          part=\"header\"\n          id={`${this.componentId}-header`}\n          class=\"details__header\"\n          role=\"button\"\n          aria-expanded={this.open ? 'true' : 'false'}\n          aria-controls={`${this.componentId}-content`}\n          aria-disabled={this.disabled ? 'true' : 'false'}\n          tabIndex={this.disabled ? -1 : 0}\n          onClick={this.handleSummaryClick}\n          onKeyDown={this.handleSummaryKeyDown}\n        >\n          <div part=\"summary\" class=\"details__summary\">\n            <slot name=\"summary\">{this.summary}</slot>\n          </div>\n\n          <span\n            part=\"summary-icon\"\n            class={{\n              'details__summary-icon': true,\n              'details__summary-icon--animate': this.animateSummaryIcon,\n            }}\n          >\n            <slot name=\"summary-icon\" onSlotchange={() => (this.animateSummaryIcon = false)}>\n              {summaryIcon && <six-icon size={this.summaryIconSize}>{summaryIcon}</six-icon>}\n            </slot>\n          </span>\n        </header>\n\n        <div ref={(el) => (this.body = el)} class=\"details__body\" onTransitionEnd={this.handleBodyTransitionEnd}>\n          <div\n            part=\"content\"\n            id={`${this.componentId}-content`}\n            class=\"details__content\"\n            role=\"region\"\n            aria-labelledby={`${this.componentId}-header`}\n          >\n            <slot />\n          </div>\n        </div>\n      </div>\n    );\n  }\n}\n"],"mappings":"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"}

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

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

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

@@ -1,2 +0,0 @@
-import{r as i,c as s,h as l,g as e}from"./p-6153045b.js";const o=".sc-six-file-upload-h{position:relative;box-sizing:border-box}.sc-six-file-upload-h *.sc-six-file-upload,.sc-six-file-upload-h *.sc-six-file-upload:before,.sc-six-file-upload-h *.sc-six-file-upload:after{box-sizing:inherit}.sc-six-file-upload-h{position:static;display:block}.six-file-upload.sc-six-file-upload six-card.sc-six-file-upload{box-shadow:none;padding:0;width:100%}.six-file-upload.sc-six-file-upload six-card.kyc-file-upload__container--compact.sc-six-file-upload{width:inherit}.six-file-upload__label--highlighted.sc-six-file-upload{color:var(--six-color-action-600)}.six-file-upload__container--full.sc-six-file-upload{border:dashed 1px var(--six-color-web-rock-500)}.six-file-upload__label-icon.sc-six-file-upload{margin-right:0.5rem}.six-file-upload__drop-zone.sc-six-file-upload{padding:2rem 0;display:flex;justify-content:center;width:100%;transition:background-color 0.3s}.six-file-upload__drop-zone--compact.sc-six-file-upload{padding:0}.six-file-upload__input.sc-six-file-upload{cursor:pointer;position:absolute;top:0;left:0;width:100%;user-select:none;height:100%;opacity:0;outline:none}.six-file-upload--disabled.sc-six-file-upload .six-file-upload__drop-zone.sc-six-file-upload{background-color:var(--six-color-inactive)}.six-file-upload.sc-six-file-upload:not(.six-file-upload--disabled) .six-file-upload__drop-zone.sc-six-file-upload:hover,.six-file-upload__drop-zone--hover.sc-six-file-upload{background-color:var(--six-color-action-light-to-be-defined)}.six-file-upload.sc-six-file-upload:not(.six-file-upload--disabled) .six-file-upload__drop-zone.sc-six-file-upload:hover.six-file-upload__drop-zone--compact,.six-file-upload__drop-zone--hover.six-file-upload__drop-zone--compact.sc-six-file-upload{background-color:inherit}.six-file-upload--disabled.sc-six-file-upload .six-file-upload__input.sc-six-file-upload{cursor:not-allowed}";const a=class{constructor(l){i(this,l);this.success=s(this,"six-file-upload-success",7);this.failure=s(this,"six-file-upload-failure",7);this.handleFiles=i=>{if(this.disabled||i.length===0){return}if(!this.multiple&&i.length>1){return this.failure.emit({reason:"Only one file is allowed."})}for(const s of i){if(s==null){return}let l=[];if(this.accept!=null){l=this.accept.replace(/\s/g,"").split(",")}if(l.length>0&&l.indexOf(s.type)===-1){const s=i.length>1?"One or more files have invalid MIME type.":"File has invalid MIME type.";return this.failure.emit({reason:s})}if(this.maxFileSize!=null&&s.size>this.maxFileSize){const s=i.length>1?"One or more files are too big":"File is too big.";return this.failure.emit({reason:s})}}const s=this.multiple?{files:i}:{file:i[0]};this.success.emit(s)};this.onChange=()=>{var i;if(((i=this.fileInput)===null||i===void 0?void 0:i.files)!=null){const i=this.fileInput.files;this.handleFiles(i);this.fileInput.value=""}};this.isOver=false;this.compact=false;this.label=undefined;this.disabled=false;this.accept=undefined;this.multiple=false;this.maxFileSize=undefined}dragenterHandler(){if(!this.disabled){this.isOver=true}}dragoverHandler(){if(!this.disabled){this.isOver=true}}dragleaveHandler(){if(!this.disabled){this.isOver=false}}dropHandler({dataTransfer:i}){if(!this.disabled){this.isOver=false;if(i!=null){this.handleFiles(i.files)}}}componentDidLoad(){["dragenter","dragover","dragleave","drop"].forEach((i=>{this.host.addEventListener(i,this.preventDefaults,false);document.body.addEventListener(i,this.preventDefaults,false)}))}disconnectedCallback(){["dragenter","dragover","dragleave","drop"].forEach((i=>{this.host.removeEventListener(i,this.preventDefaults,false);document.body.removeEventListener(i,this.preventDefaults,false)}))}preventDefaults(i){i.preventDefault();i.stopPropagation()}renderLabel(){var i;return(i=this.label)!==null&&i!==void 0?i:this.compact?"Upload":l("span",null,"Drop files to upload, or ",l("span",{class:"six-file-upload__label--highlighted"},"browse"))}render(){const i=this.compact?"six-button":"six-card";return l("div",{class:{"six-file-upload":true,"six-file-upload--disabled":this.disabled}},l(i,{class:{"six-file-upload__container--compact":this.compact,"six-file-upload__container--full":!this.compact}},this.compact&&l("span",{slot:"prefix"},l("six-icon",{class:"six-file-upload__label-icon"},"arrow_circle_up")),l("div",{class:{"six-file-upload__drop-zone":true,"six-file-upload__drop-zone--hover":this.isOver,"six-file-upload__drop-zone--compact":this.compact}},l("span",null,this.renderLabel()),l("input",{class:"six-file-upload__input",type:"file",name:"resume",disabled:this.disabled,accept:this.accept,multiple:this.multiple,onChange:this.onChange,ref:i=>this.fileInput=i}))))}get host(){return e(this)}};a.style=o;export{a as six_file_upload};
-//# sourceMappingURL=p-cdaed936.entry.js.map

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

@@ -1,2 +0,0 @@
-import{r as i,c as t,h as s,g as a}from"./p-6153045b.js";import{u as o,l as e}from"./p-052aa8d3.js";import{h as l}from"./p-15559d38.js";import{i as r,M as n}from"./p-9ace84c7.js";const h=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}: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-x-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=r();let c=0;const g=class{constructor(s){i(this,s);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-${++c}`;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 n(this.host,{onFocusOut:()=>{var i;return(i=this.panel)===null||i===void 0?void 0:i.focus()}})}componentWillLoad(){this.handleSlotChange();if(this.open){this.show()}}disconnectedCallback(){o(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();e(this.host);if(this.open){if(d){requestAnimationFrame((()=>{const t=this.sixInitialFocus.emit();if(!t.defaultPrevented){i.focus({preventScroll:true})}}))}else{this.dialog.addEventListener("transitionend",(()=>{const t=this.sixInitialFocus.emit();if(!t.defaultPrevented){i.focus()}}),{once: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();o(this.host)}render(){return s("div",{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},s("div",{part:"overlay",class:"dialog__overlay",onClick:this.handleOverlayClick}),s("div",{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&&s("header",{part:"header",class:"dialog__header"},s("span",{part:"title",class:"dialog__title",id:`${this.componentId}-title`},s("slot",{name:"label"},this.label||String.fromCharCode(65279))),s("six-icon-button",{exportparts:"base:close-button",class:"dialog__close",name:"close",onClick:this.handleCloseClick})),s("div",{part:"body",class:"dialog__body"},s("slot",null)),s("footer",{part:"footer",class:"dialog__footer"},s("slot",{name:"footer",onSlotchange:this.handleSlotChange}))))}get host(){return a(this)}static get watchers(){return{open:["handleOpenChange"]}}};g.style=h;export{g as six_dialog};
-//# sourceMappingURL=p-d1bda563.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["sixDialogCss","hasPreventScroll","isPreventScrollSupported","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","disconnectedCallback","unlockBodyScrolling","dialog","sixShow","activate","lockBodyScrolling","requestAnimationFrame","sixInitialFocus","preventScroll","addEventListener","once","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-x-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 { isPreventScrollSupported } from '../../utils/support';\nimport Modal from '../../utils/modal';\nimport { EmptyPayload } from '../../utils/types';\n\nconst hasPreventScroll = isPreventScrollSupported();\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    // 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      if (hasPreventScroll) {\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      } else {\n        // Once Safari supports { preventScroll: true } we can remove this nasty little hack, but until then we need to\n        // wait for the transition to complete before setting focus, otherwise the panel may render in a buggy way its\n        // out of view initially.\n        //\n        // Fiddle: https://jsfiddle.net/g6buoafq/1/\n        // Safari: https://bugs.webkit.org/show_bug.cgi?id=178583\n        //\n        this.dialog.addEventListener(\n          'transitionend',\n          () => {\n            const sixInitialFocus = this.sixInitialFocus.emit();\n            if (!sixInitialFocus.defaultPrevented) {\n              panel.focus();\n            }\n          },\n          { once: 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-db34a6cc.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as o,h as i,g as r}from"./p-6153045b.js";import{E as s}from"./p-7d95def3.js";import{F as e}from"./p-e5020f0d.js";import{h as l}from"./p-15559d38.js";const a=':host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}.form-control .form-control__label{display:none}.form-control .form-control__help-text{display:none}.form-control .form-control__error-text{display:none;text-align:left}.form-control--has-label .form-control__label{display:inline-block;color:var(--six-input-label-color);font-weight:var(--six-font-weight-bold);margin-bottom:var(--six-spacing-x-small)}.form-control--has-label .form-control__label__required::after{color:var(--six-color-danger-800);content:"*"}.form-control--has-label.form-control--small .form-control__label{font-size:var(--six-input-label-font-size-small)}.form-control--has-label.form-control--medium .form-control__label{font-size:var(--six-input-label-font-size-medium)}.form-control--has-label.form-control--large .form-control_label{font-size:var(--six-input-label-font-size-large)}.form-control--has-help-text .form-control__help-text{display:block;color:var(--six-input-help-text-color);margin-top:var(--six-spacing-x-small)}.form-control--has-help-text .form-control__help-text ::slotted(*){margin-top:var(--six-spacing-xxx-small)}.form-control--has-help-text.form-control--small .form-control__help-text{font-size:var(--six-input-help-text-font-size-small)}.form-control--has-help-text.form-control--medium .form-control__help-text{font-size:var(--six-input-help-text-font-size-medium)}.form-control--has-help-text.form-control--large .form-control__help-text{font-size:var(--six-input-help-text-font-size-large)}.form-control--has-error-text .form-control__error-text{display:block;margin-top:var(--six-spacing-xxx-small)}.form-control--has-error-text .form-control__error-text ::slotted(*){margin-top:var(--six-spacing-xxx-small)}.form-control--has-error-text.form-control--small .form-control__error-text{font-size:var(--six-input-help-text-font-size-small)}.form-control--has-error-text.form-control--medium .form-control__error-text{font-size:var(--six-input-help-text-font-size-medium)}.form-control--has-error-text.form-control--large .form-control__error-text{font-size:var(--six-input-help-text-font-size-large)}.form-control--disabled .form-control__help-text{color:var(--six-input-help-text-color-disabled)}.form-control--disabled .form-control__label{color:var(--six-input-label-color-disabled)}.form-control--invalid:not(.form-control--disabled) .form-control__label{color:var(--six-input-label-color)}:host{--height:var(--six-selection-control-toggle-size);--thumb-size:calc(var(--six-selection-control-toggle-size) - 4px);--width:calc(var(--height) * 2);display:inline-block}.switch{display:inline-flex;align-items:center;font-family:var(--six-font-family);font-size:var(--six-input-font-size-medium);font-weight:var(--six-input-font-weight);color:var(--six-input-color);vertical-align:middle;cursor:pointer}.switch__control{position:relative;display:inline-flex;align-items:center;justify-content:center;width:var(--width);height:var(--height);background-color:var(--six-selection-control-color-disabled);border-radius:var(--height);transition:var(--six-transition-fast) border-color, var(--six-transition-fast) background-color}.switch__control .switch__thumb{width:var(--thumb-size);height:var(--thumb-size);background-color:var(--six-input-background-color);border-radius:50%;transform:translateX(calc(var(--width) / -2 + var(--thumb-size) / 2 - (var(--thumb-size) - var(--height)) / 2));transition:var(--six-transition-fast) transform ease, var(--six-transition-fast) background-color, var(--six-transition-fast) border-color, var(--six-transition-fast) box-shadow}.switch__control input[type=checkbox]{position:absolute;opacity:0;padding:0;margin:0;pointer-events:none}.switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover{background-color:var(--six-input-border-color-hover)}.switch--checked .switch__control{background-color:var(--six-selection-control-color)}.switch--checked .switch__control .switch__thumb{background-color:var(--six-color-white);transform:translateX(calc(var(--width) / 2 - var(--thumb-size) / 2 + (var(--thumb-size) - var(--height)) / 2))}.switch.switch--checked:not(.switch--disabled) .switch__control:hover{background-color:var(--six-input-border-color-focus)}.switch--disabled{cursor:not-allowed;color:var(--six-selection-control-color-disabled)}.switch--disabled .switch__control{background-color:var(--six-selection-control-color-disabled)}.switch--disabled.switch--checked .switch__control{background-color:var(--six-selection-control-color-disabled)}.switch__label{line-height:var(--height);margin-left:0.5em;user-select:none}';let n=0;const h=class{constructor(i){t(this,i);this.sixBlur=o(this,"six-switch-blur",7);this.sixChange=o(this,"six-switch-change",7);this.sixFocus=o(this,"six-switch-focus",7);this.switchId=`switch-${++n}`;this.labelId=`switch-label-${n}`;this.errorTextId=`input-error-text-${n}`;this.eventListeners=new s;this.handleSlotChange=()=>{this.hasErrorTextSlot=l(this.host,"error-text")};this.handleClick=()=>{if(this.inputElement!=null){this.checked=this.inputElement.checked;this.sixChange.emit(this.checked)}};this.handleBlur=()=>{this.hasFocus=false;this.sixBlur.emit(this.checked)};this.handleFocus=()=>{this.hasFocus=true;this.sixFocus.emit()};this.handleKeyDown=t=>{if(t.key==="ArrowLeft"){t.preventDefault();this.checked=false;this.sixChange.emit(this.checked)}if(t.key==="ArrowRight"){t.preventDefault();this.checked=true;this.sixChange.emit(this.checked)}};this.handleMouseDown=t=>{var o;t.preventDefault();(o=this.inputElement)===null||o===void 0?void 0:o.focus()};this.hasFocus=false;this.hasErrorTextSlot=false;this.name="";this.value="on";this.disabled=false;this.required=false;this.checked=false;this.label="";this.errorText="";this.errorTextCount=undefined;this.invalid=false}componentWillLoad(){this.handleSlotChange()}handleCheckedChange(){if(this.inputElement!=null){this.inputElement.checked=this.checked;this.checked=this.inputElement.checked}}connectedCallback(){var t;(t=this.host.shadowRoot)===null||t===void 0?void 0:t.addEventListener("slotchange",this.handleSlotChange);this.eventListeners.forward("six-switch-change","change",this.host);this.eventListeners.forward("six-switch-blur","blur",this.host);this.eventListeners.forward("six-switch-focus","focus",this.host)}disconnectedCallback(){var t;(t=this.host.shadowRoot)===null||t===void 0?void 0:t.removeEventListener("slotchange",this.handleSlotChange);this.eventListeners.removeAll()}handleLabelChange(){this.handleSlotChange()}async setFocus(t){var o;(o=this.inputElement)===null||o===void 0?void 0:o.focus(t)}async removeFocus(){var t;(t=this.inputElement)===null||t===void 0?void 0:t.blur()}render(){return i(e,{inputId:this.switchId,label:this.label,labelId:this.labelId,hasLabelSlot:false,errorTextId:this.errorTextId,errorText:this.errorText,errorTextCount:this.errorTextCount,hasErrorTextSlot:this.hasErrorTextSlot,size:"medium",disabled:this.disabled,required:this.required,displayError:this.invalid},i("label",{part:"base",htmlFor:this.switchId,class:{switch:true,"switch--checked":this.checked,"switch--disabled":this.disabled,"switch--focused":this.hasFocus},onMouseDown:this.handleMouseDown},i("span",{part:"control",class:"switch__control"},i("span",{part:"thumb",class:"switch__thumb"}),i("input",{ref:t=>this.inputElement=t,id:this.switchId,type:"checkbox",name:this.name,value:this.value,checked:this.checked,disabled:this.disabled,required:this.required,role:"switch","aria-checked":this.checked?"true":"false","aria-labelledby":this.labelId,onClick:this.handleClick,onBlur:this.handleBlur,onFocus:this.handleFocus,onKeyDown:this.handleKeyDown})),i("span",{part:"label",id:this.labelId,class:"switch__label"},i("slot",null))))}get host(){return r(this)}static get watchers(){return{checked:["handleCheckedChange"],errorText:["handleLabelChange"],label:["handleLabelChange"]}}};h.style=a;export{h as six_switch};
-//# sourceMappingURL=p-db34a6cc.entry.js.map

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

@@ -1,2 +0,0 @@
-import{r as o,h as t,g as l}from"./p-6153045b.js";import{F as r}from"./p-e5020f0d.js";import{h as e}from"./p-15559d38.js";const s=':host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}.form-control .form-control__label{display:none}.form-control .form-control__help-text{display:none}.form-control .form-control__error-text{display:none;text-align:left}.form-control--has-label .form-control__label{display:inline-block;color:var(--six-input-label-color);font-weight:var(--six-font-weight-bold);margin-bottom:var(--six-spacing-x-small)}.form-control--has-label .form-control__label__required::after{color:var(--six-color-danger-800);content:"*"}.form-control--has-label.form-control--small .form-control__label{font-size:var(--six-input-label-font-size-small)}.form-control--has-label.form-control--medium .form-control__label{font-size:var(--six-input-label-font-size-medium)}.form-control--has-label.form-control--large .form-control_label{font-size:var(--six-input-label-font-size-large)}.form-control--has-help-text .form-control__help-text{display:block;color:var(--six-input-help-text-color);margin-top:var(--six-spacing-x-small)}.form-control--has-help-text .form-control__help-text ::slotted(*){margin-top:var(--six-spacing-xxx-small)}.form-control--has-help-text.form-control--small .form-control__help-text{font-size:var(--six-input-help-text-font-size-small)}.form-control--has-help-text.form-control--medium .form-control__help-text{font-size:var(--six-input-help-text-font-size-medium)}.form-control--has-help-text.form-control--large .form-control__help-text{font-size:var(--six-input-help-text-font-size-large)}.form-control--has-error-text .form-control__error-text{display:block;margin-top:var(--six-spacing-xxx-small)}.form-control--has-error-text .form-control__error-text ::slotted(*){margin-top:var(--six-spacing-xxx-small)}.form-control--has-error-text.form-control--small .form-control__error-text{font-size:var(--six-input-help-text-font-size-small)}.form-control--has-error-text.form-control--medium .form-control__error-text{font-size:var(--six-input-help-text-font-size-medium)}.form-control--has-error-text.form-control--large .form-control__error-text{font-size:var(--six-input-help-text-font-size-large)}.form-control--disabled .form-control__help-text{color:var(--six-input-help-text-color-disabled)}.form-control--disabled .form-control__label{color:var(--six-input-label-color-disabled)}.form-control--invalid:not(.form-control--disabled) .form-control__label{color:var(--six-input-label-color)}:host{display:block}';let i=0;const a=class{constructor(t){o(this,t);this.wrapperLabelId=`label-${++i}`;this.labelId=`label-label-${i}`;this.helpTextId=`label-help-text-${i}`;this.handleSlotChange=()=>{this.hasLabelSlot=e(this.host,"label");this.hasHelpTextSlot=e(this.host,"help-text")};this.hasHelpTextSlot=false;this.hasLabelSlot=false;this.size="medium";this.label="";this.helpText="";this.disabled=false;this.required=false}handleLabelChange(){this.handleSlotChange()}connectedCallback(){var o;(o=this.host.shadowRoot)===null||o===void 0?void 0:o.addEventListener("slotchange",this.handleSlotChange)}componentWillLoad(){this.handleSlotChange()}disconnectedCallback(){var o;(o=this.host.shadowRoot)===null||o===void 0?void 0:o.removeEventListener("slotchange",this.handleSlotChange)}render(){return t(r,{inputId:this.wrapperLabelId,label:this.label,labelId:this.labelId,hasLabelSlot:this.hasLabelSlot,helpTextId:this.helpTextId,helpText:this.helpText,hasHelpTextSlot:this.hasHelpTextSlot,size:this.size,disabled:this.disabled,required:this.required},t("slot",null))}get host(){return l(this)}static get watchers(){return{helpText:["handleLabelChange"],label:["handleLabelChange"]}}};a.style=s;export{a as six_group_label};
-//# sourceMappingURL=p-db936ad7.entry.js.map

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

@@ -1,2 +0,0 @@
-import{r as t,c as o,h as i,H as r,g as s}from"./p-6153045b.js";import{P as e}from"./p-0fdb185d.js";const a=':host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}:host{--max-width:20rem;--hide-delay:0s;--hide-duration:0.125s;--hide-timing-function:ease;--show-delay:0.125s;--show-duration:0.125s;--show-timing-function:ease;display:contents}.tooltip-positioner{position:fixed;z-index:var(--six-z-index-tooltip);pointer-events:none}.tooltip{max-width:var(--max-width);border-radius:var(--six-border-radius-medium);background-color:var(--six-tooltip-background-color);font-family:var(--six-font-family);font-size:var(--six-tooltip-font-size);font-weight:var(--six-tooltip-font-weight);line-height:var(--six-tooltip-line-height);color:var(--six-tooltip-color);opacity:0;padding:var(--six-spacing-xxx-small) var(--six-spacing-x-small);transform:scale(0.8);transform-origin:bottom;transition-property:opacity, transform;transition-delay:var(--hide-delay);transition-duration:var(--hide-duration);transition-timing-function:var(--hide-timing-function)}.tooltip::after{content:"";position:absolute;width:0;height:0}.tooltip-positioner[data-popper-placement^=top] .tooltip{transform-origin:bottom}.tooltip-positioner[data-popper-placement^=bottom] .tooltip{transform-origin:top}.tooltip-positioner[data-popper-placement^=left] .tooltip{transform-origin:right}.tooltip-positioner[data-popper-placement^=right] .tooltip{transform-origin:left}.tooltip-positioner.popover-visible .tooltip{opacity:1;transform:none;transition-delay:var(--show-delay);transition-duration:var(--show-duration);transition-timing-function:var(--show-timing-function)}.tooltip-positioner[data-popper-placement^=bottom] .tooltip::after{bottom:100%;left:calc(50% - var(--six-tooltip-arrow-size));border-bottom:var(--six-tooltip-arrow-size) solid var(--six-tooltip-background-color);border-left:var(--six-tooltip-arrow-size) solid transparent;border-right:var(--six-tooltip-arrow-size) solid transparent}.tooltip-positioner[data-popper-placement=bottom-start] .tooltip::after{left:var(--six-tooltip-arrow-start-end-offset)}.tooltip-positioner[data-popper-placement=bottom-end] .tooltip::after{right:var(--six-tooltip-arrow-start-end-offset);left:auto}.tooltip-positioner[data-popper-placement^=top] .tooltip::after{top:100%;left:calc(50% - var(--six-tooltip-arrow-size));border-top:var(--six-tooltip-arrow-size) solid var(--six-tooltip-background-color);border-left:var(--six-tooltip-arrow-size) solid transparent;border-right:var(--six-tooltip-arrow-size) solid transparent}.tooltip-positioner[data-popper-placement=top-start] .tooltip::after{left:var(--six-tooltip-arrow-start-end-offset)}.tooltip-positioner[data-popper-placement=top-end] .tooltip::after{right:var(--six-tooltip-arrow-start-end-offset);left:auto}.tooltip-positioner[data-popper-placement^=left] .tooltip::after{top:calc(50% - var(--six-tooltip-arrow-size));left:100%;border-left:var(--six-tooltip-arrow-size) solid var(--six-tooltip-background-color);border-top:var(--six-tooltip-arrow-size) solid transparent;border-bottom:var(--six-tooltip-arrow-size) solid transparent}.tooltip-positioner[data-popper-placement=left-start] .tooltip::after{top:var(--six-tooltip-arrow-start-end-offset)}.tooltip-positioner[data-popper-placement=left-end] .tooltip::after{top:auto;bottom:var(--six-tooltip-arrow-start-end-offset)}.tooltip-positioner[data-popper-placement^=right] .tooltip::after{top:calc(50% - var(--six-tooltip-arrow-size));right:100%;border-right:var(--six-tooltip-arrow-size) solid var(--six-tooltip-background-color);border-top:var(--six-tooltip-arrow-size) solid transparent;border-bottom:var(--six-tooltip-arrow-size) solid transparent}.tooltip-positioner[data-popper-placement=right-start] .tooltip::after{top:var(--six-tooltip-arrow-start-end-offset)}.tooltip-positioner[data-popper-placement=right-end] .tooltip::after{top:auto;bottom:var(--six-tooltip-arrow-start-end-offset)}';let n=0;const p=class{constructor(i){t(this,i);this.sixShow=o(this,"six-tooltip-show",7);this.sixAfterShow=o(this,"six-tooltip-after-show",7);this.sixHide=o(this,"six-tooltip-hide",7);this.sixAfterHide=o(this,"six-tooltip-after-hide",7);this.componentId=`tooltip-${++n}`;this.isVisible=false;this.handleBlur=()=>{if(this.hasTrigger("focus")){this.hide()}};this.handleClick=()=>{if(this.hasTrigger("click")){this.open?this.hide():this.show()}};this.handleFocus=()=>{if(this.hasTrigger("focus")){this.show()}};this.handleKeyDown=t=>{if(this.open&&t.key==="Escape"){t.stopPropagation();this.hide()}};this.handleMouseOver=()=>{if(this.hasTrigger("hover")){this.show()}};this.handleMouseOut=()=>{if(this.hasTrigger("hover")){this.hide()}};this.handleSlotChange=()=>{const t=this.target;const o=this.getTarget();if(o!==t){if(t!=null){t.removeAttribute("aria-describedby")}o.setAttribute("aria-describedby",this.componentId)}};this.content="";this.placement="top";this.disabled=false;this.distance=10;this.open=false;this.skidding=0;this.trigger="hover focus"}handleOpenChange(){this.open?this.show():this.hide()}componentDidLoad(){if(this.tooltipPositioner==null)return;this.target=this.getTarget();this.popover=new e(this.target,this.tooltipPositioner,{strategy:"fixed"});this.syncOptions();this.host.addEventListener("blur",this.handleBlur,true);this.host.addEventListener("click",this.handleClick,true);this.host.addEventListener("focus",this.handleFocus,true);this.tooltipPositioner.hidden=!this.open;if(this.open){this.show()}}componentDidUpdate(){this.syncOptions()}disconnectedCallback(){if(this.popover!=null){this.popover.destroy()}this.host.removeEventListener("blur",this.handleBlur,true);this.host.removeEventListener("click",this.handleClick,true);this.host.removeEventListener("focus",this.handleFocus,true)}async show(){var t;if(this.isVisible||this.disabled){return}const o=this.sixShow.emit();if(o.defaultPrevented){this.open=false;return}this.isVisible=true;this.open=true;(t=this.popover)===null||t===void 0?void 0:t.show()}async hide(){var t;if(!this.isVisible||this.disabled){return}const o=this.sixHide.emit();if(o.defaultPrevented){this.open=true;return}this.isVisible=false;this.open=false;(t=this.popover)===null||t===void 0?void 0:t.hide()}getTarget(){const t=[...this.host.children].find((t=>t.tagName.toLowerCase()!=="style"&&t.getAttribute("slot")!=="content"));if(t==null){throw new Error("Invalid tooltip target: no child element was found.")}return t}hasTrigger(t){const o=this.trigger.split(" ");return o.includes(t)}syncOptions(){if(this.popover==null)return;this.popover.setOptions({placement:this.placement,distance:this.distance,skidding:this.skidding,transitionElement:this.tooltip,onAfterHide:()=>this.sixAfterHide.emit(),onAfterShow:()=>this.sixAfterShow.emit()})}render(){return i(r,{onKeyDown:this.handleKeyDown,onMouseOver:this.handleMouseOver,onMouseOut:this.handleMouseOut},i("slot",{onSlotchange:this.handleSlotChange}),i("div",{ref:t=>this.tooltipPositioner=t,class:"tooltip-positioner"},i("div",{part:"base",ref:t=>this.tooltip=t,id:this.componentId,class:{tooltip:true,"tooltip--open":this.open},role:"tooltip","aria-hidden":this.open?"false":"true"},i("slot",{name:"content"},this.content))))}get host(){return s(this)}static get watchers(){return{open:["handleOpenChange"]}}};p.style=a;export{p as six_tooltip};
-//# sourceMappingURL=p-dc4f41d8.entry.js.map

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

@@ -1,2 +0,0 @@
-import{r as i,c as t,h as s,g as n}from"./p-6153045b.js";import{P as e}from"./p-0fdb185d.js";import{E as o}from"./p-7d95def3.js";import{b as r,a as h}from"./p-15559d38.js";import{D as l,a as d}from"./p-698bb2c8.js";function a(i){const t=i.tabIndex;return t>-1}function u(i){if(a(i)){return i}if(i.shadowRoot!=null){const t=[...i.shadowRoot.children].find((i=>a(i)));if(t!=null){return t}}if(i.children!=null){return[...i.children].map((i=>u(i))).at(0)}return undefined}const f=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}: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{max-height:50vh;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);box-shadow:var(--six-elevation-2dp);opacity:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:none;pointer-events:none;transform:scale(0.9);transition:var(--six-transition-fast) opacity, var(--six-transition-fast) transform;scrollbar-width:thin}.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}";const c=i=>t=>(t===null||t===void 0?void 0:t.tagName.toLowerCase())===i.toLowerCase();const p=c("six-menu");const v=c("six-menu-item");let m=0;const w=class{constructor(n){i(this,n);this.sixShow=t(this,"six-dropdown-show",7);this.sixAfterShow=t(this,"six-dropdown-after-show",7);this.sixHide=t(this,"six-dropdown-hide",7);this.sixAfterHide=t(this,"six-dropdown-after-hide",7);this.sixAutoFilter=t(this,"six-dropdown-auto-filter-fired",7);this.sixAsyncFilterFired=t(this,"six-async-filter-fired",7);this.sixScroll=t(this,"six-dropdown-scroll",7);this.componentId=`dropdown-${++m}`;this.isVisible=false;this.hasBeenInitialized=false;this.eventListeners=new o;this.getMenuItems=()=>{if(this.filteredOptions.length>0){return this.filteredOptions.map((i=>s("six-menu-item",{value:i.value},i.label)))}if(this.panel==null)return[];const[i]=r(this.panel);return r(i)||Array.from(i.querySelectorAll("six-menu-item"))};this.handleFilterInputChange=()=>{var i,t;if(this.filterInputElement==null)return;const s=((t=(i=this.filterInputElement.value)===null||i===void 0?void 0:i.toLowerCase())===null||t===void 0?void 0:t.trim())||"";if(this.filteredOptions.length>0){this.handleFilteringForAttributeItems(s)}else{this.handleFilteringForSlotItems(s)}this.sixAutoFilter.emit({filterValue:s})};this.handleDocumentKeyDown=i=>{var t;const s=i;if(s.key==="Escape"){void this.hide();this.focusOnTrigger();return}if(this.filterInputElement===((t=this.host.shadowRoot)===null||t===void 0?void 0:t.activeElement)){if(s.key==="ArrowDown"){const i=this.getMenuItems().find((i=>i.style.display!=="none"));if(i!=null){i.setFocus()}}}if(s.key==="Tab"){if(this.open&&document.activeElement!=null&&v(document.activeElement)){s.preventDefault();void this.hide();this.focusOnTrigger();return}setTimeout((()=>{var i,t;const s=this.container.getRootNode()instanceof ShadowRoot?(t=(i=document.activeElement)===null||i===void 0?void 0:i.shadowRoot)===null||t===void 0?void 0:t.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=i=>{const t=i.composedPath();if(!t.includes(this.container)){void this.hide();return}};this.handlePanelSelect=i=>{const t=i.target;if(this.closeOnSelect&&p(t)){void this.hide();this.focusOnTrigger()}};this.handleTriggerClick=()=>{this.open?this.hide():this.show()};this.handleTriggerKeyDown=i=>{if(i.key==="Escape"){this.focusOnTrigger();void this.hide();return}if(!this.disableHideOnEnterAndSpace&&[" ","Enter"].includes(i.key)){i.preventDefault();this.open?void this.hide():void this.show();return}const t=this.getMenu();if(["ArrowDown","ArrowUp"].includes(i.key)){i.preventDefault();if(!this.open){void this.show()}if(t==null){return}const s=[...t.querySelectorAll("six-menu-item")];const n=s.at(0);const e=s.at(s.length-1);if(i.key==="ArrowDown"&&n!=null){n.setFocus();return}if(i.key==="ArrowUp"&&e!=null){e.setFocus();return}}const s=["Tab","Shift","Meta","Ctrl","Alt"];if(this.open&&t!=null&&!s.includes(i.key)){void t.typeToSelect(i.key);return}};this.handleTriggerKeyUp=i=>{if(i.key===" "){i.preventDefault()}};this.handleTriggerSlotChange=()=>{this.updateAccessibleTrigger()};this.handleDropdownScroll=()=>{if(this.panel==null)return;this.sixScroll.emit({scrollHeight:this.panel.scrollHeight,scrollTop:this.panel.scrollTop,scrollbarHeight:this.panel.offsetHeight*(this.panel.offsetHeight/this.panel.scrollHeight),scrollRatio:this.panel.scrollTop/(this.panel.scrollHeight-this.panel.clientHeight)})};this.open=false;this.placement="bottom-start";this.closeOnSelect=true;this.distance=0;this.skidding=0;this.hoist=false;this.containingElement=undefined;this.filter=false;this.asyncFilter=false;this.filterPlaceholder="Filter...";this.autofocusFilter=true;this.filterDebounce=l;this.disableHideOnEnterAndSpace=false;this.options=[];this.virtualScroll=false;this.filteredOptions=[]}get hasFilterEnabled(){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(){if(Array.isArray(this.options)){this.filteredOptions=[...this.options]}}connectedCallback(){if(this.virtualScroll&&this.options===null){console.error("Options must be defined when using virtual scrolling")}if(Array.isArray(this.options)){this.filteredOptions=[...this.options]}if(this.hasBeenInitialized&&this.popover==null){this.initializePopover()}}componentDidLoad(){this.hasBeenInitialized=true;this.initializePopover();if(this.open){void this.show()}if(this.filter){this.setupFiltering(this.handleFilterInputChange)}else if(this.asyncFilter){this.setupFiltering((()=>{var i,t;return this.sixAsyncFilterFired.emit({filterValue:(t=(i=this.filterInputElement)===null||i===void 0?void 0:i.value)!==null&&t!==void 0?t:""})}))}}initializePopover(){if(this.trigger==null||this.positioner==null)return;const i=()=>{if(this.filter&&this.filterInputElement!=null){this.filterInputElement.value="";if(this.filteredOptions.length>0){this.filteredOptions=[...this.options]}else{const i=this.getMenuItems();i.forEach((i=>i.style.display="unset"))}}this.sixAfterHide.emit()};const t=async()=>{var i;if(this.hasFilterEnabled&&this.autofocusFilter){await((i=this.filterInputElement)===null||i===void 0?void 0:i.setFocus())}this.sixAfterShow.emit()};const s=()=>{if(!this.open&&this.panel!=null){this.panel.scrollTop=0}};this.popover=new e(this.trigger,this.positioner,{strategy:this.hoist?"fixed":"absolute",placement:this.placement,distance:this.distance,skidding:this.skidding,transitionElement:this.panel,onAfterHide:i,onAfterShow:t,onTransitionEnd:s})}setupFiltering(i){if(this.filterInputElement!=null){this.eventListeners.add(this.filterInputElement,"six-input-input",d(i,this.filterDebounce))}}handleFilteringForAttributeItems(i){if(i===""&&Array.isArray(this.options)){this.filteredOptions=[...this.options];return}this.filteredOptions=this.options.filter((t=>{var s,n,e,o;return t.label&&((n=(s=String(t.label))===null||s===void 0?void 0:s.toLowerCase())===null||n===void 0?void 0:n.includes(i))||t.value&&((o=(e=String(t.value))===null||e===void 0?void 0:e.toLowerCase())===null||o===void 0?void 0:o.includes(i))}))}handleFilteringForSlotItems(i){const t=this.getMenuItems();t.forEach((async t=>{var s,n,e,o;const r=((n=(s=t===null||t===void 0?void 0:t.value)===null||s===void 0?void 0:s.toLowerCase())===null||n===void 0?void 0:n.includes(i))||((o=(e=await(t===null||t===void 0?void 0:t.getTextLabel()))===null||e===void 0?void 0:e.toLowerCase())===null||o===void 0?void 0:o.includes(i));t.style.display=r?"unset":"none"}))}disconnectedCallback(){var i;this.eventListeners.removeAll();void this.hide();(i=this.popover)===null||i===void 0?void 0:i.destroy();this.popover=undefined}async show(){if(this.isVisible||this.popover==null||this.panel==null){return}const i=this.sixShow.emit();if(i.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;this.popover.show()}async hide(){if(!this.isVisible||this.panel==null||this.popover==null){return}const i=this.sixHide.emit();if(i.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(){if(this.trigger==null)return;const[i]=r(this.trigger);if(i!=null){if(typeof i.setFocus==="function"){i.setFocus()}else if(typeof i.focus==="function"){i.focus()}}}getMenu(){if(this.panel==null)return;return r(this.panel).filter(p).at(0)}async reposition(){if(!this.open||this.popover==null){return}this.popover.reposition()}updateAccessibleTrigger(){if(this.trigger==null)return;const i=r(this.trigger).map(u).at(0);if(i!=null){i.setAttribute("aria-haspopup","true");i.setAttribute("aria-expanded",this.open?"true":"false")}}render(){return s("div",{part:"base",id:this.componentId,class:{dropdown:true,"dropdown--open":this.open}},s("span",{part:"trigger",class:"dropdown__trigger",ref:i=>this.trigger=i,onClick:this.handleTriggerClick,onKeyDown:this.handleTriggerKeyDown,onKeyUp:this.handleTriggerKeyUp},s("slot",{name:"trigger",onSlotchange:this.handleTriggerSlotChange})),s("div",{ref:i=>this.positioner=i,class:{dropdown__positioner:true,dropdown__positioner__filtered:(this.filter||this.asyncFilter)&&!this.hoist}},this.hasFilterEnabled&&s("six-input",{class:{"filter-hidden":!this.open},"aria-hidden":this.open?"false":"true",ref:i=>this.filterInputElement=i,placeholder:this.filterPlaceholder}),s("div",{ref:i=>this.panel=i,part:"panel",class:"dropdown__panel",role:"menu","aria-hidden":this.open?"false":"true","aria-labelledby":this.componentId,onScroll:this.handleDropdownScroll},s("slot",null),this.filteredOptions.length>0&&s("six-menu",{part:"menu",items:this.filteredOptions,virtualScroll:this.virtualScroll}))))}get host(){return n(this)}static get watchers(){return{open:["handleOpenChange"],distance:["handlePopoverOptionsChange"],hoist:["handlePopoverOptionsChange"],placement:["handlePopoverOptionsChange"],skidding:["handlePopoverOptionsChange"],options:["handleOptionsChange"]}}};w.style=f;const g=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}:host{display:block}.menu{padding:0 0;border:none;box-shadow:var(--six-elevation-2dp)}.menu:focus{outline:none}.menu--noshadow{box-shadow:none}.menu__wrapper--scrollable{overflow-y:auto}";const b=i=>{var t,s,n;return(n=(s=(t=i===null||i===void 0?void 0:i.shadowRoot)===null||t===void 0?void 0:t.querySelector(".menu-item"))===null||s===void 0?void 0:s.classList)===null||n===void 0?void 0:n.contains("menu-item--focused")};const x=i=>(i===null||i===void 0?void 0:i.tagName.toLowerCase())==="six-menu-item";const _=({value:i,label:t})=>s("six-menu-item",{value:i},t);const y=5;const A=64;const k=class{constructor(s){i(this,s);this.sixMenuItemSelected=t(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.scrollingIndex=0;this.sixMenuItemHeight=A}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(i){var t;clearTimeout(this.typeToSelectTimeout);this.typeToSelectTimeout=setTimeout((()=>this.typeToSelectString=""),750);this.typeToSelectString+=i.toLowerCase();const s=this.getItems();for(const i of s){const s=(t=i.shadowRoot)===null||t===void 0?void 0:t.querySelector("slot:not([name])");const n=h(s).toLowerCase().trim();if(n.substring(0,this.typeToSelectString.length)===this.typeToSelectString){i.setFocus();break}}}getItemsShown(){var i;const t=this.virtualScroll?y:0;return(i=this.itemsShown)!==null&&i!==void 0?i:t}setupForVirtualScrollingAfterRendering(){var i,t;if(!this.virtualScroll||this.menuWrapper==null)return;this.eventListeners.add(this.menuWrapper,"scroll",d(this.handleScrolling,this.scrollingDebounce));const s=(t=(i=this.menu)===null||i===void 0?void 0:i.querySelector("six-menu-item"))===null||t===void 0?void 0:t.clientHeight;if(s!=null&&s>0){this.sixMenuItemHeight=s}}getItems(){if(this.menu==null)return[];if(this.items!=null){return this.items.map(_)}const i=this.menu.querySelector("slot");if(i==null)return[];return[...i.assignedElements({flatten:true})].filter((i=>x(i)&&!i.disabled))}getActiveItemIndex(){const i=this.getItems();const t=this.getActiveItem();if(t!=null){const s=i.indexOf(t);if(s>-1){return s}}const s=this.extractItemsFromDOM();return s.findIndex(b)}getActiveItem(){var i;const t=this.getItems().find((i=>i===document.activeElement));if(t!=null){return t}return(i=this.extractItemsFromDOM())===null||i===void 0?void 0:i.find(b)}extractItemsFromDOM(){var i,t;return Array.from((t=(i=this.host.shadowRoot)===null||i===void 0?void 0:i.querySelectorAll("six-menu-item"))!==null&&t!==void 0?t:[])}setActiveItem(i){i===null||i===void 0?void 0:i.setFocus()}handleClick(i){const t=i.target;const s=t.closest("six-menu-item");if(s&&!s.disabled){this.sixMenuItemSelected.emit({name:s.value,item:s})}}handleKeyDown(i){if(i.key==="Enter"){const t=this.getActiveItem();i.preventDefault();if(t!=null){this.sixMenuItemSelected.emit({name:t.value,item:t})}}if(i.key===" "){i.preventDefault()}if(["ArrowDown","ArrowUp","Home","End"].includes(i.key)){const t=this.items===null?this.getItems():this.extractItemsFromDOM();let s=this.getActiveItemIndex();if(t.length>0){i.preventDefault();if(i.key==="ArrowDown"){s++}else if(i.key==="ArrowUp"){s--}else if(i.key==="Home"){s=0}else if(i.key==="End"){s=t.length-1}if(s<0)s=0;if(s>t.length-1)s=t.length-1;this.setActiveItem(t[s]);return}}void this.typeToSelect(i.key)}getMenuWrapperStyle(){var i;const t={};if(this.getItemsShown()>0){t.height=`${((i=this.getItemsShown())!==null&&i!==void 0?i:0)*this.sixMenuItemHeight}px`}return Object.assign({},t)}getMenuContainerStyle(){const i={};if(this.virtualScroll){i.transform=`translateY(${this.sixMenuItemHeight*this.scrollingIndex}px)`}return Object.assign({},i)}getScrollbarGhostStyle(){const i={};if(this.virtualScroll&&this.items!==null){i.height=`${this.items.length*this.sixMenuItemHeight-this.itemSize*this.sixMenuItemHeight}px`}return Object.assign({},i)}renderItems(){if(this.items===undefined||this.items===null){return}if(!this.virtualScroll){return this.items.map(_)}return this.items.slice(this.scrollingIndex,Math.min(this.items.length,this.itemSize+this.scrollingIndex)).map(_)}render(){return s("div",{ref:i=>this.menuWrapper=i,style:this.getMenuWrapperStyle(),part:"wrapper",class:{menu:true,"menu--noshadow":this.removeBoxShadow,"menu__wrapper--scrollable":this.getItemsShown()>0}},s("div",{ref:i=>this.menu=i,part:"base",role:"menu",onClick:this.handleClick,onKeyDown:this.handleKeyDown,tabIndex:0,style:this.getMenuContainerStyle()},s("slot",null),this.renderItems()),this.virtualScroll&&s("div",{style:this.getScrollbarGhostStyle()}))}get host(){return n(this)}};k.style=g;export{w as six_dropdown,k as six_menu};
-//# sourceMappingURL=p-e775dcb4.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["isTabbable","el","tabIndex","getNearestTabbableElement","shadowRoot","tabbableShadowChild","children","find","e","map","at","undefined","sixDropdownCss","isTagName","name","tagName","toLowerCase","isSixMenu","isSixMenuItem","id","SixDropdown","this","componentId","isVisible","hasBeenInitialized","eventListeners","EventListeners","getMenuItems","filteredOptions","length","option","h","value","label","panel","getSlotChildren","Array","from","querySelectorAll","handleFilterInputChange","filterInputElement","lowerCaseFilterTerm","_b","_a","trim","handleFilteringForAttributeItems","handleFilteringForSlotItems","sixAutoFilter","emit","filterValue","handleDocumentKeyDown","event","keyboardEvent","key","hide","focusOnTrigger","host","activeElement","item","style","display","setFocus","open","document","preventDefault","setTimeout","container","getRootNode","ShadowRoot","closest","handleDocumentMouseDown","path","composedPath","includes","handlePanelSelect","target","closeOnSelect","handleTriggerClick","show","handleTriggerKeyDown","disableHideOnEnterAndSpace","menu","getMenu","menuItems","firstMenuItem","lastMenuItem","ignoredKeys","typeToSelect","handleTriggerKeyUp","handleTriggerSlotChange","updateAccessibleTrigger","handleDropdownScroll","sixScroll","scrollHeight","scrollTop","scrollbarHeight","offsetHeight","scrollRatio","clientHeight","DEFAULT_DEBOUNCE_FAST","hasFilterEnabled","filter","asyncFilter","containingElement","handleOpenChange","handlePopoverOptionsChange","popover","setOptions","strategy","hoist","placement","distance","skidding","handleOptionsChange","isArray","options","connectedCallback","virtualScroll","console","error","initializePopover","componentDidLoad","setupFiltering","sixAsyncFilterFired","trigger","positioner","onAfterHide","forEach","sixAfterHide","onAfterShow","async","autofocusFilter","sixAfterShow","onTransitionEnd","Popover","transitionElement","callback","add","debounce","filterDebounce","String","_d","_c","menuItem","elementContainsFilterTerm","getTextLabel","disconnectedCallback","removeAll","destroy","sixShow","defaultPrevented","sixHide","remove","focus","reposition","accessibleTrigger","setAttribute","render","part","class","dropdown","ref","onClick","onKeyDown","onKeyUp","onSlotchange","dropdown__positioner","dropdown__positioner__filtered","placeholder","filterPlaceholder","role","onScroll","items","sixMenuCss","isFocusedMenuItem","querySelector","classList","contains","isSIXMenuItemElement","mapToMenuItem","DEFAULT_NUMBER_OF_ITEMS_SHOWN_FOR_VIRTUAL_SCROLLING","DEFAULT_SIX_MENU_ITEM_HEIGHT","SixMenu","typeToSelectString","handleScrolling","menuWrapper","scrollingIndex","Math","floor","sixMenuItemHeight","handleClick","bind","handleKeyDown","componentWillLoad","setupForVirtualScrollingAfterRendering","clearTimeout","typeToSelectTimeout","getItems","slot","getTextContent","substring","getItemsShown","defaultItemsShown","itemsShown","scrollingDebounce","menuItemHeight","assignedElements","flatten","disabled","getActiveItemIndex","selectedItem","getActiveItem","itemIndex","indexOf","sixMenuItems","extractItemsFromDOM","findIndex","i","setActiveItem","clickedItem","sixMenuItemSelected","activeItem","indexOfActiveItem","getMenuWrapperStyle","styles","height","Object","assign","getMenuContainerStyle","transform","getScrollbarGhostStyle","itemSize","renderItems","slice","min","removeBoxShadow"],"sources":["src/utils/tabbable.ts","src/components/six-dropdown/six-dropdown.scss?tag=six-dropdown&encapsulation=shadow","src/components/six-dropdown/six-dropdown.tsx","src/components/six-menu/six-menu.scss?tag=six-menu&encapsulation=shadow","src/components/six-menu/six-menu.tsx"],"sourcesContent":["export function isTabbable(el: HTMLElement) {\n  const tabIndex = el.tabIndex;\n  return tabIndex > -1;\n}\n\nexport function getNearestTabbableElement(el: HTMLElement): HTMLElement | undefined {\n  // Check the element\n  if (isTabbable(el)) {\n    return el;\n  }\n\n  // Check the element's shadow root\n  if (el.shadowRoot != null) {\n    const tabbableShadowChild = [...el.shadowRoot.children].find((e) => isTabbable(e as HTMLElement)) as HTMLElement;\n    if (tabbableShadowChild != null) {\n      return tabbableShadowChild;\n    }\n  }\n\n  // Check the element's children\n  if (el.children != null) {\n    return [...el.children].map((e) => getNearestTabbableElement(e as HTMLElement)).at(0);\n  }\n\n  return undefined;\n}\n","@import 'src/global/component';\n@import 'src/global/mixins/scrollbar';\n\n:host {\n  display: inline-block;\n}\n\n.dropdown {\n  position: relative;\n}\n\n.dropdown__trigger {\n  display: block;\n}\n\n.dropdown__positioner {\n  position: absolute;\n  z-index: var(--six-z-index-dropdown);\n\n  &__filtered {\n    width: 100%;\n  }\n}\n\n.dropdown__panel {\n  max-height: 50vh;\n  font-family: var(--six-font-sans);\n  font-size: var(--six-font-size-small);\n  font-weight: var(--six-font-weight-normal);\n  color: var(--color);\n  background-color: var(--six-panel-background-color);\n  border-radius: var(--six-border-radius-medium);\n  box-shadow: var(--six-elevation-2dp);\n  opacity: 0;\n  overflow-y: auto;\n  overflow-x: hidden;\n  overscroll-behavior: none;\n  pointer-events: none;\n  transform: scale(0.9);\n  transition: var(--six-transition-fast) opacity, var(--six-transition-fast) transform;\n  // fix for firefox scrollbar\n  scrollbar-width: thin;\n}\n\n.filter-hidden {\n  display: none;\n}\n\n.dropdown__positioner {\n  &[data-popper-placement^='top'] .dropdown__panel {\n    transform-origin: bottom;\n  }\n\n  &[data-popper-placement^='bottom'] .dropdown__panel {\n    transform-origin: top;\n  }\n\n  &[data-popper-placement^='left'] .dropdown__panel {\n    transform-origin: right;\n  }\n\n  &[data-popper-placement^='right'] .dropdown__panel {\n    transform-origin: left;\n  }\n\n  &.popover-visible .dropdown__panel {\n    opacity: 1;\n    transform: none;\n    pointer-events: all;\n  }\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { getNearestTabbableElement } from '../../utils/tabbable';\nimport Popover from '../../utils/popover';\nimport { EventListeners } from '../../utils/event-listeners';\nimport { getSlotChildren } from '../../utils/slot';\nimport { debounce, DEFAULT_DEBOUNCE_FAST } from '../../utils/execution-control';\nimport { EmptyPayload } from '../../utils/types';\nimport { SixMenuItemData } from '../six-menu/six-menu';\n\nexport interface SixDropdownAutoFilterPayload {\n  filterValue: string;\n}\n\nexport interface SixDropdownAsyncFilterPayload {\n  filterValue: string;\n}\n\nexport interface SixDropdownScrollPayload {\n  scrollHeight: number;\n  scrollTop: number;\n  scrollbarHeight: number;\n  scrollRatio: number;\n}\n\nconst isTagName =\n  (name: string) =>\n  <T extends Element>(el?: T) =>\n    el?.tagName.toLowerCase() === name.toLowerCase();\nconst isSixMenu = isTagName('six-menu');\nconst isSixMenuItem = isTagName('six-menu-item');\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 trigger - The dropdown's trigger, usually a `<six-button>` element.\n * @slot - The dropdown's content.\n *\n * @part base - The component's base wrapper.\n * @part trigger - The container that wraps the trigger.\n * @part panel - The panel that gets shown when the dropdown is open.\n */\n\n@Component({\n  tag: 'six-dropdown',\n  styleUrl: 'six-dropdown.scss',\n  shadow: true,\n})\nexport class SixDropdown {\n  private componentId = `dropdown-${++id}`;\n  private isVisible = false;\n  private panel?: HTMLElement;\n  private positioner?: HTMLElement;\n  private popover?: Popover;\n  private trigger?: HTMLElement;\n  private hasBeenInitialized = false;\n\n  // the input element shown in the dropdown when filter is set to true\n  private filterInputElement?: HTMLSixInputElement;\n\n  @Element() host!: HTMLSixDropdownElement;\n\n  /** Indicates whether the dropdown 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 preferred placement of the dropdown panel. Note that the actual placement may vary as needed to keep the panel\n   * inside the viewport.\n   */\n  @Prop() placement:\n    | 'top'\n    | 'top-start'\n    | 'top-end'\n    | 'bottom'\n    | 'bottom-start'\n    | 'bottom-end'\n    | 'right'\n    | 'right-start'\n    | 'right-end'\n    | 'left'\n    | 'left-start'\n    | 'left-end' = 'bottom-start';\n\n  /** Determines whether the dropdown should hide when a menu item is selected. */\n  @Prop() closeOnSelect = true;\n\n  /** The distance in pixels from which to offset the panel away from its trigger. */\n  @Prop() distance = 0;\n\n  /** The distance in pixels from which to offset the panel along its trigger. */\n  @Prop() skidding = 0;\n\n  /**\n   * Enable this option to prevent the panel from being clipped when the component is placed inside a container with\n   * `overflow: auto|scroll`.\n   */\n  @Prop() hoist = false;\n\n  /** The dropdown will close when the user interacts outside of this element (e.g. clicking). */\n  @Prop() containingElement?: HTMLElement;\n\n  /**\n   * Set to true to allow auto filtering for entries in the dropdown.\n   * With this flag the dropdown will automatically filter itsel.\n   * If you need to coordinate the shown elements yourself,\n   * e.g. because you need to call an endpoint use asyncFilter instead\n   */\n  @Prop() filter = false;\n\n  /**\n   * Set to true to allow async filtering.\n   * When you enter something in the search field the component will only emit an event but not filter any elements itself.\n   * You can then simply listen to the 'six-async-filter-fired' event to manage the shown menu-items yourself\n   */\n  @Prop() asyncFilter = false;\n\n  /** The filter's placeholder text. */\n  @Prop() filterPlaceholder = 'Filter...';\n\n  /** By default the search field will be focused when opening a dropdown with filtering enabled. */\n  @Prop() autofocusFilter = true;\n\n  get hasFilterEnabled() {\n    return this.filter || this.asyncFilter;\n  }\n\n  /** The debounce for the filter callbacks. */\n  @Prop() filterDebounce = DEFAULT_DEBOUNCE_FAST;\n\n  /** The panel can be opend/closed by pressing the spacebar or the enter key. In some cases you might want to avoid this */\n  @Prop() disableHideOnEnterAndSpace = false;\n\n  /** Set the options to be shown in the dropdown (alternative to setting the elements via html)*/\n  @Prop() options: SixMenuItemData[] = [];\n\n  /** Defines whether the menu list will be rendered virtually i.e. only the elements actually shown (and a couple around)\n   *  are actually rendered in the DOM. If you use virtual scrolling pass the elements via prop instead of via slot. */\n  @Prop() virtualScroll = false;\n\n  get container() {\n    return this.containingElement || this.host;\n  }\n\n  /** Emitted when the dropdown opens. Calling `event.preventDefault()` will prevent it from being opened. */\n  @Event({ eventName: 'six-dropdown-show' }) sixShow!: EventEmitter<EmptyPayload>;\n\n  /** Emitted after the dropdown opens and all transitions are complete. */\n  @Event({ eventName: 'six-dropdown-after-show' }) sixAfterShow!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the dropdown closes. Calling `event.preventDefault()` will prevent it from being closed. */\n  @Event({ eventName: 'six-dropdown-hide' }) sixHide!: EventEmitter<EmptyPayload>;\n\n  /** Emitted after the dropdown closes and all transitions are complete. */\n  @Event({ eventName: 'six-dropdown-after-hide' }) sixAfterHide!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the auto filter is triggered */\n  @Event({ eventName: 'six-dropdown-auto-filter-fired' }) sixAutoFilter!: EventEmitter<SixDropdownAutoFilterPayload>;\n\n  /** Emitted when the async filter is triggered */\n  @Event({ eventName: 'six-async-filter-fired' }) sixAsyncFilterFired!: EventEmitter<SixDropdownAsyncFilterPayload>;\n\n  /** Emitted when the user scrolls inside dropdown panel.*/\n  @Event({ eventName: 'six-dropdown-scroll' }) sixScroll!: EventEmitter<SixDropdownScrollPayload>;\n\n  private eventListeners = new EventListeners();\n\n  // internal representation of options, so we don't have to make options mutable\n  @State() filteredOptions: SixMenuItemData[] = [];\n\n  @Watch('open')\n  handleOpenChange() {\n    this.open ? this.show() : this.hide();\n    this.updateAccessibleTrigger();\n  }\n\n  @Watch('distance')\n  @Watch('hoist')\n  @Watch('placement')\n  @Watch('skidding')\n  handlePopoverOptionsChange() {\n    if (this.popover == null) return;\n\n    this.popover.setOptions({\n      strategy: this.hoist ? 'fixed' : 'absolute',\n      placement: this.placement,\n      distance: this.distance,\n      skidding: this.skidding,\n    });\n  }\n\n  @Watch('options')\n  handleOptionsChange() {\n    if (Array.isArray(this.options)) {\n      this.filteredOptions = [...this.options];\n    }\n  }\n\n  connectedCallback() {\n    if (this.virtualScroll && this.options === null) {\n      console.error('Options must be defined when using virtual scrolling');\n    }\n\n    if (Array.isArray(this.options)) {\n      this.filteredOptions = [...this.options];\n    }\n\n    if (this.hasBeenInitialized && this.popover == null) {\n      // there was a weird bug when using six-dropdown inside an ag-grid filter. When closing the ag-grid filter\n      // disconnectedCallback() is executed. However, since componentDidLoad() will not be rerendered the popover had\n      // no longer a connected transitionEnd callback to the dropdown. To fix this, we have this sanity check here,\n      // to re-initialize the popover in case the component has already been initialized but the popover is undefined.\n      this.initializePopover();\n    }\n  }\n\n  componentDidLoad() {\n    this.hasBeenInitialized = true;\n    this.initializePopover();\n\n    // Show on init if open\n    if (this.open) {\n      void this.show();\n    }\n\n    if (this.filter) {\n      this.setupFiltering(this.handleFilterInputChange);\n    } else if (this.asyncFilter) {\n      this.setupFiltering(() => this.sixAsyncFilterFired.emit({ filterValue: this.filterInputElement?.value ?? '' }));\n    }\n  }\n\n  private initializePopover() {\n    if (this.trigger == null || this.positioner == null) return;\n    const onAfterHide = () => {\n      if (this.filter && this.filterInputElement != null) {\n        this.filterInputElement.value = '';\n\n        if (this.filteredOptions.length > 0) {\n          this.filteredOptions = [...this.options];\n        } else {\n          const menuItems = this.getMenuItems();\n          menuItems.forEach((item) => (item.style.display = 'unset'));\n        }\n      }\n\n      this.sixAfterHide.emit();\n    };\n\n    const onAfterShow = async () => {\n      if (this.hasFilterEnabled && this.autofocusFilter) {\n        // if dropdown filter is enabled we should autofocus the search field\n        await this.filterInputElement?.setFocus();\n      }\n\n      this.sixAfterShow.emit();\n    };\n\n    const onTransitionEnd = () => {\n      if (!this.open && this.panel != null) {\n        this.panel.scrollTop = 0;\n      }\n    };\n\n    this.popover = new Popover(this.trigger, this.positioner, {\n      strategy: this.hoist ? 'fixed' : 'absolute',\n      placement: this.placement,\n      distance: this.distance,\n      skidding: this.skidding,\n      transitionElement: this.panel,\n      onAfterHide,\n      onAfterShow,\n      onTransitionEnd,\n    });\n  }\n\n  private setupFiltering(callback: () => void) {\n    if (this.filterInputElement != null) {\n      this.eventListeners.add(this.filterInputElement, 'six-input-input', debounce(callback, this.filterDebounce));\n    }\n  }\n\n  private getMenuItems = (): HTMLSixMenuItemElement[] => {\n    if (this.filteredOptions.length > 0) {\n      return this.filteredOptions.map((option) => <six-menu-item value={option.value}>{option.label}</six-menu-item>);\n    }\n    if (this.panel == null) return [];\n\n    const [panel] = getSlotChildren<HTMLSixMenuElement>(this.panel);\n\n    // the menu-items can be in a slot e.g. in six-select or direct children of the panel\n    return getSlotChildren(panel) || Array.from(panel.querySelectorAll('six-menu-item'));\n  };\n\n  private handleFilterInputChange = () => {\n    if (this.filterInputElement == null) return;\n\n    const lowerCaseFilterTerm = this.filterInputElement.value?.toLowerCase()?.trim() || '';\n\n    if (this.filteredOptions.length > 0) {\n      this.handleFilteringForAttributeItems(lowerCaseFilterTerm);\n    } else {\n      this.handleFilteringForSlotItems(lowerCaseFilterTerm);\n    }\n\n    this.sixAutoFilter.emit({ filterValue: lowerCaseFilterTerm });\n  };\n\n  private handleFilteringForAttributeItems(lowerCaseFilterTerm: string) {\n    if (lowerCaseFilterTerm === '' && Array.isArray(this.options)) {\n      this.filteredOptions = [...this.options];\n      return;\n    }\n\n    this.filteredOptions = this.options.filter(\n      (option) =>\n        (option.label && String(option.label)?.toLowerCase()?.includes(lowerCaseFilterTerm)) ||\n        (option.value && String(option.value)?.toLowerCase()?.includes(lowerCaseFilterTerm))\n    );\n  }\n\n  private handleFilteringForSlotItems(lowerCaseFilterTerm: string) {\n    const menuItems = this.getMenuItems();\n    menuItems.forEach(async (menuItem) => {\n      // hide all elements which don't contain the entered substring\n      const elementContainsFilterTerm =\n        menuItem?.value?.toLowerCase()?.includes(lowerCaseFilterTerm) ||\n        (await menuItem?.getTextLabel())?.toLowerCase()?.includes(lowerCaseFilterTerm);\n\n      menuItem.style.display = elementContainsFilterTerm ? 'unset' : 'none';\n    });\n  }\n\n  disconnectedCallback() {\n    this.eventListeners.removeAll();\n\n    void this.hide();\n    this.popover?.destroy();\n    this.popover = undefined;\n  }\n\n  /** Shows the dropdown panel */\n  @Method()\n  async show() {\n    // Prevent subsequent calls to the method, whether manually or triggered by the `open` watcher\n    if (this.isVisible || this.popover == null || this.panel == null) {\n      return;\n    }\n\n    const sixShow = this.sixShow.emit();\n    if (sixShow.defaultPrevented) {\n      this.open = false;\n      return;\n    }\n\n    this.eventListeners.add(this.panel, 'six-menu-item-selected', this.handlePanelSelect);\n    this.eventListeners.add(document, 'keydown', this.handleDocumentKeyDown);\n    this.eventListeners.add(document, 'mousedown', this.handleDocumentMouseDown);\n\n    this.isVisible = true;\n    this.open = true;\n    this.popover.show();\n  }\n\n  /** Hides the dropdown panel */\n  @Method()\n  async hide() {\n    // Prevent subsequent calls to the method, whether manually or triggered by the `open` watcher\n    if (!this.isVisible || this.panel == null || this.popover == 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.eventListeners.remove(this.panel, 'six-menu-item-selected', this.handlePanelSelect);\n    this.eventListeners.remove(document, 'keydown', this.handleDocumentKeyDown);\n    this.eventListeners.remove(document, 'mousedown', this.handleDocumentMouseDown);\n\n    this.isVisible = false;\n    this.open = false;\n    this.popover.hide();\n  }\n\n  private focusOnTrigger() {\n    if (this.trigger == null) return;\n    const [trigger] = getSlotChildren<HTMLSixButtonElement>(this.trigger);\n    if (trigger != null) {\n      if (typeof trigger.setFocus === 'function') {\n        trigger.setFocus();\n      } else if (typeof trigger.focus === 'function') {\n        trigger.focus();\n      }\n    }\n  }\n\n  private getMenu(): HTMLSixMenuElement | undefined {\n    if (this.panel == null) return;\n    return getSlotChildren<HTMLSixMenuElement>(this.panel).filter(isSixMenu).at(0);\n  }\n\n  /**\n   * Instructs the dropdown menu to reposition. Useful when the position or size of the trigger changes when the menu\n   * is activated.\n   */\n  @Method()\n  async reposition() {\n    if (!this.open || this.popover == null) {\n      return;\n    }\n    this.popover.reposition();\n  }\n\n  private handleDocumentKeyDown = (event: Event) => {\n    const keyboardEvent = event as KeyboardEvent;\n    // Close when escape is pressed\n    if (keyboardEvent.key === 'Escape') {\n      void this.hide();\n      this.focusOnTrigger();\n      return;\n    }\n\n    if (this.filterInputElement === this.host.shadowRoot?.activeElement) {\n      if (keyboardEvent.key === 'ArrowDown') {\n        const item = this.getMenuItems().find((item) => item.style.display !== 'none');\n        if (item != null) {\n          item.setFocus();\n        }\n      }\n    }\n\n    // Handle tabbing\n    if (keyboardEvent.key === 'Tab') {\n      // Tabbing within an open menu should close the dropdown and refocus the trigger\n      if (this.open && document.activeElement != null && isSixMenuItem(document.activeElement)) {\n        keyboardEvent.preventDefault();\n        void this.hide();\n        this.focusOnTrigger();\n        return;\n      }\n\n      // Tabbing outside the containing element closes the panel\n      //\n      // If the dropdown is used within a shadow DOM, we need to obtain the activeElement within that shadowRoot,\n      // otherwise `document.activeElement` will only return the name of the parent shadow DOM element.\n      setTimeout(() => {\n        const activeElement =\n          this.container.getRootNode() instanceof ShadowRoot\n            ? document.activeElement?.shadowRoot?.activeElement\n            : document.activeElement;\n\n        if (activeElement?.closest(this.container.tagName.toLowerCase()) !== this.container) {\n          void this.hide();\n          return;\n        }\n      });\n    }\n  };\n\n  private handleDocumentMouseDown = (event: Event) => {\n    // Close when clicking outside the containing element\n    const path = event.composedPath() as EventTarget[];\n    if (!path.includes(this.container)) {\n      void this.hide();\n      return;\n    }\n  };\n\n  private handlePanelSelect = (event: Event) => {\n    const target = event.target as HTMLElement;\n\n    // Hide the dropdown when a menu item is selected\n    if (this.closeOnSelect && isSixMenu(target)) {\n      void this.hide();\n      this.focusOnTrigger();\n    }\n  };\n\n  private handleTriggerClick = () => {\n    this.open ? this.hide() : this.show();\n  };\n\n  private handleTriggerKeyDown = (event: KeyboardEvent) => {\n    // Close when escape or tab is pressed\n    if (event.key === 'Escape') {\n      this.focusOnTrigger();\n      void this.hide();\n      return;\n    }\n\n    // When spacebar/enter is pressed, show the panel but don't focus on the menu. This let's the user press the same\n    // key again to hide the menu in case they don't want to make a selection.\n    if (!this.disableHideOnEnterAndSpace && [' ', 'Enter'].includes(event.key)) {\n      event.preventDefault();\n      this.open ? void this.hide() : void this.show();\n      return;\n    }\n\n    const menu = this.getMenu();\n\n    // When up/down is pressed, we make the assumption that the user is familiar with the menu and plans to make a\n    // selection. Rather than toggle the panel, we focus on the menu (if one exists) and activate the first item for\n    // faster navigation.\n    if (['ArrowDown', 'ArrowUp'].includes(event.key)) {\n      event.preventDefault();\n\n      // Show the menu if it's not already open\n      if (!this.open) {\n        void this.show();\n      }\n\n      if (menu == null) {\n        return;\n      }\n      const menuItems = [...menu.querySelectorAll('six-menu-item')];\n      const firstMenuItem = menuItems.at(0);\n      const lastMenuItem = menuItems.at(menuItems.length - 1);\n\n      // Focus on a menu item\n      if (event.key === 'ArrowDown' && firstMenuItem != null) {\n        firstMenuItem.setFocus();\n        return;\n      }\n\n      if (event.key === 'ArrowUp' && lastMenuItem != null) {\n        lastMenuItem.setFocus();\n        return;\n      }\n    }\n\n    // Other keys bring focus to the menu and initiate type-to-select behavior\n    const ignoredKeys = ['Tab', 'Shift', 'Meta', 'Ctrl', 'Alt'];\n    if (this.open && menu != null && !ignoredKeys.includes(event.key)) {\n      void menu.typeToSelect(event.key);\n      return;\n    }\n  };\n\n  private handleTriggerKeyUp = (event: KeyboardEvent) => {\n    // Prevent space from triggering a click event in Firefox\n    if (event.key === ' ') {\n      event.preventDefault();\n    }\n  };\n\n  private handleTriggerSlotChange = () => {\n    this.updateAccessibleTrigger();\n  };\n\n  private handleDropdownScroll = () => {\n    if (this.panel == null) return;\n\n    this.sixScroll.emit({\n      scrollHeight: this.panel.scrollHeight,\n      scrollTop: this.panel.scrollTop,\n      scrollbarHeight: this.panel.offsetHeight * (this.panel.offsetHeight / this.panel.scrollHeight),\n      scrollRatio: this.panel.scrollTop / (this.panel.scrollHeight - this.panel.clientHeight),\n    });\n  };\n\n  //\n  // Slotted triggers can be arbitrary content, but we need to link them to the dropdown panel with `aria-haspopup` and\n  // `aria-expanded`. These must be applied to the \"accessible trigger\" (the tabbable portion of the trigger element\n  // that gets slotted in) so screen readers will understand them. The accessible trigger could be the slotted element,\n  // a child of the slotted element, or an element in the slotted element's shadow root.\n  //\n  // For example, the accessible trigger of an <sl-button> is a <button> located inside its shadow root.\n  //\n  // To determine this, we assume the first tabbable element in the trigger slot is the \"accessible trigger.\"\n  //\n  private updateAccessibleTrigger() {\n    if (this.trigger == null) return;\n\n    const accessibleTrigger = getSlotChildren(this.trigger).map(getNearestTabbableElement).at(0);\n    if (accessibleTrigger != null) {\n      accessibleTrigger.setAttribute('aria-haspopup', 'true');\n      accessibleTrigger.setAttribute('aria-expanded', this.open ? 'true' : 'false');\n    }\n  }\n\n  render() {\n    return (\n      <div\n        part=\"base\"\n        id={this.componentId}\n        class={{\n          dropdown: true,\n          'dropdown--open': this.open,\n        }}\n      >\n        <span\n          part=\"trigger\"\n          class=\"dropdown__trigger\"\n          ref={(el) => (this.trigger = el)}\n          onClick={this.handleTriggerClick}\n          onKeyDown={this.handleTriggerKeyDown}\n          onKeyUp={this.handleTriggerKeyUp}\n        >\n          <slot name=\"trigger\" onSlotchange={this.handleTriggerSlotChange} />\n        </span>\n\n        {/* Position the panel with a wrapper since the popover makes use of `translate`. This let's us add transitions\n        on the panel without interfering with the position. */}\n        <div\n          ref={(el) => (this.positioner = el)}\n          class={{\n            dropdown__positioner: true,\n            dropdown__positioner__filtered: (this.filter || this.asyncFilter) && !this.hoist,\n          }}\n        >\n          {this.hasFilterEnabled && (\n            <six-input\n              class={{\n                'filter-hidden': !this.open,\n              }}\n              aria-hidden={this.open ? 'false' : 'true'}\n              ref={(el) => (this.filterInputElement = el)}\n              placeholder={this.filterPlaceholder}\n            />\n          )}\n          <div\n            ref={(el) => (this.panel = el)}\n            part=\"panel\"\n            class=\"dropdown__panel\"\n            role=\"menu\"\n            aria-hidden={this.open ? 'false' : 'true'}\n            aria-labelledby={this.componentId}\n            onScroll={this.handleDropdownScroll}\n          >\n            <slot />\n            {this.filteredOptions.length > 0 && (\n              <six-menu part=\"menu\" items={this.filteredOptions} virtualScroll={this.virtualScroll}></six-menu>\n            )}\n          </div>\n        </div>\n      </div>\n    );\n  }\n}\n","@import 'src/global/component';\n\n:host {\n  display: block;\n}\n\n.menu {\n  padding: 0 0;\n  border: none;\n  box-shadow: var(--six-elevation-2dp);\n\n  &:focus {\n    outline: none;\n  }\n\n  &--noshadow {\n    box-shadow: none;\n  }\n\n  &__wrapper {\n    &--scrollable {\n      overflow-y: auto;\n    }\n  }\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State } from '@stencil/core';\nimport { getTextContent } from '../../utils/slot';\nimport { StyleDeclaration } from '../../utils/types';\nimport { EventListeners } from '../../utils/event-listeners';\nimport { debounce } from '../../utils/execution-control';\n\nexport interface SixMenuItemData {\n  label: string;\n  value: string;\n}\n\nexport interface SixMenuItemSelectedPayload {\n  name: string;\n  item: HTMLSixMenuItemElement;\n}\n\nconst isFocusedMenuItem = (menuItem: HTMLSixMenuItemElement) =>\n  menuItem?.shadowRoot?.querySelector('.menu-item')?.classList?.contains('menu-item--focused');\n\nconst isSIXMenuItemElement = (el?: Element): el is HTMLSixMenuItemElement =>\n  el?.tagName.toLowerCase() === 'six-menu-item';\n\nconst mapToMenuItem = ({ value, label }: SixMenuItemData) => <six-menu-item value={value}>{label}</six-menu-item>;\n\nconst DEFAULT_NUMBER_OF_ITEMS_SHOWN_FOR_VIRTUAL_SCROLLING = 5;\n\nconst DEFAULT_SIX_MENU_ITEM_HEIGHT = 64;\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot - The menu's content, including menu items, menu dividers, and menu labels.\n *\n * @part base - The component's base wrapper.\n */\n@Component({\n  tag: 'six-menu',\n  styleUrl: 'six-menu.scss',\n  shadow: true,\n})\nexport class SixMenu {\n  private readonly eventListeners = new EventListeners();\n\n  private menu?: HTMLElement;\n  private menuWrapper?: HTMLElement;\n  private typeToSelectString = '';\n  private typeToSelectTimeout?: number;\n\n  @Element() host!: HTMLSixMenuElement;\n\n  /** Emitted when a menu item is selected. */\n  @Event({ eventName: 'six-menu-item-selected' }) sixMenuItemSelected!: EventEmitter<SixMenuItemSelectedPayload>;\n\n  /** Set to true to remove the box-shadow */\n  @Prop() removeBoxShadow = false;\n\n  /** Set the options to be shown in the dropdown */\n  @Prop() items: SixMenuItemData[] | null = null;\n\n  /** Defines how many items should be shown. If the number of items is larger than this property a scrollbar will be shown */\n  @Prop() itemsShown?: number;\n\n  /** Defines whether the menu list will be rendered virtually i.e. only the elements actually shown (and a couple around)\n   *  are actually rendered in the DOM. If you use virtual scrolling pass the elements via prop instead of via slot. */\n  @Prop() virtualScroll = false;\n\n  /**\n   * Used for virtual scrolling\n   * Define how many items should be rendered in the DOM when using virtual scrolling\n   */\n  @Prop() itemSize = 10;\n\n  /**\n   * Used for virtual scrolling\n   * Define the debounce for listening on scrolling changes in milliseconds.\n   * The lower the number the more sensitive the component reacts to scrolling changes.\n   */\n  @Prop() scrollingDebounce = 15;\n\n  /**\n   * Used to calculate which items should be rendered in the DOM\n   */\n  @State()\n  private scrollingIndex = 0;\n\n  // set a default item height, this variable will be updated with the real value after the first render.\n  // However, it's necessary to have a default value because we can only fetch the proper height after the first render\n  @State()\n  sixMenuItemHeight = DEFAULT_SIX_MENU_ITEM_HEIGHT;\n\n  connectedCallback() {\n    this.handleClick = this.handleClick.bind(this);\n    this.handleKeyDown = this.handleKeyDown.bind(this);\n  }\n\n  componentWillLoad() {\n    if (this.items === null) {\n      return;\n    }\n  }\n\n  private handleScrolling = () => {\n    if (this.menuWrapper == null) return;\n    // for performance improvements we only update the DOM if the scrollRatio change \"enough\"\n    this.scrollingIndex = Math.floor(this.menuWrapper.scrollTop / this.sixMenuItemHeight);\n  };\n\n  componentDidLoad() {\n    this.setupForVirtualScrollingAfterRendering();\n  }\n\n  disconnectedCallback() {\n    this.eventListeners.removeAll();\n  }\n\n  /**\n   * Initiates type-to-select logic, which automatically selects an option based on what the user is currently typing.\n   * The key passed will be appended to the internal query and the selection will be updated. After a brief period, the\n   * internal query is cleared automatically. This method is intended to be used with the keydown event. Useful for\n   * enabling type-to-select when the menu doesn't have focus.\n   */\n  @Method()\n  async typeToSelect(key: string) {\n    clearTimeout(this.typeToSelectTimeout);\n    // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n    // @ts-ignore\n    this.typeToSelectTimeout = setTimeout(() => (this.typeToSelectString = ''), 750);\n    this.typeToSelectString += key.toLowerCase();\n    const items = this.getItems();\n    for (const item of items) {\n      const slot = item.shadowRoot?.querySelector('slot:not([name])') as HTMLSlotElement;\n      const label = getTextContent(slot).toLowerCase().trim();\n      if (label.substring(0, this.typeToSelectString.length) === this.typeToSelectString) {\n        item.setFocus();\n        break;\n      }\n    }\n  }\n\n  private getItemsShown(): number {\n    const defaultItemsShown = this.virtualScroll ? DEFAULT_NUMBER_OF_ITEMS_SHOWN_FOR_VIRTUAL_SCROLLING : 0;\n    return this.itemsShown ?? defaultItemsShown;\n  }\n\n  private setupForVirtualScrollingAfterRendering() {\n    if (!this.virtualScroll || this.menuWrapper == null) return;\n\n    this.eventListeners.add(this.menuWrapper, 'scroll', debounce(this.handleScrolling, this.scrollingDebounce));\n\n    // set menu height to proper height once the item is rendered.\n    const menuItemHeight = this.menu?.querySelector('six-menu-item')?.clientHeight;\n    if (menuItemHeight != null && menuItemHeight > 0) {\n      this.sixMenuItemHeight = menuItemHeight;\n    }\n  }\n\n  private getItems(): HTMLSixMenuItemElement[] {\n    if (this.menu == null) return [];\n\n    if (this.items != null) {\n      return this.items.map(mapToMenuItem);\n    }\n\n    const slot = this.menu.querySelector('slot');\n    if (slot == null) return [];\n    return [...slot.assignedElements({ flatten: true })].filter(\n      (el): el is HTMLSixMenuItemElement => isSIXMenuItemElement(el) && !el.disabled\n    );\n  }\n\n  private getActiveItemIndex() {\n    const items = this.getItems();\n    const selectedItem = this.getActiveItem();\n    if (selectedItem != null) {\n      const itemIndex = items.indexOf(selectedItem);\n      if (itemIndex > -1) {\n        return itemIndex;\n      }\n    }\n    const sixMenuItems = this.extractItemsFromDOM();\n    return sixMenuItems.findIndex(isFocusedMenuItem);\n  }\n\n  private getActiveItem(): HTMLSixMenuItemElement | undefined {\n    const activeElement = this.getItems().find((i) => i === document.activeElement);\n    if (activeElement != null) {\n      return activeElement;\n    }\n    return this.extractItemsFromDOM()?.find(isFocusedMenuItem);\n  }\n\n  private extractItemsFromDOM() {\n    return Array.from(this.host.shadowRoot?.querySelectorAll('six-menu-item') ?? []);\n  }\n\n  private setActiveItem(item: HTMLSixMenuItemElement) {\n    item?.setFocus();\n  }\n\n  private handleClick(event: MouseEvent) {\n    const target = event.target as HTMLElement;\n    const clickedItem = target.closest('six-menu-item');\n    if (clickedItem && !clickedItem.disabled) {\n      this.sixMenuItemSelected.emit({ name: clickedItem.value, item: clickedItem });\n    }\n  }\n\n  private handleKeyDown(event: KeyboardEvent) {\n    // Make a selection when pressing enter\n    if (event.key === 'Enter') {\n      const activeItem = this.getActiveItem();\n      event.preventDefault();\n\n      if (activeItem != null) {\n        this.sixMenuItemSelected.emit({ name: activeItem.value, item: activeItem });\n      }\n    }\n\n    // Prevent scrolling when space is pressed\n    if (event.key === ' ') {\n      event.preventDefault();\n    }\n\n    // Move the selection when pressing down or up\n    if (['ArrowDown', 'ArrowUp', 'Home', 'End'].includes(event.key)) {\n      const items = this.items === null ? this.getItems() : this.extractItemsFromDOM();\n\n      let indexOfActiveItem = this.getActiveItemIndex();\n\n      if (items.length > 0) {\n        event.preventDefault();\n\n        if (event.key === 'ArrowDown') {\n          indexOfActiveItem++;\n        } else if (event.key === 'ArrowUp') {\n          indexOfActiveItem--;\n        } else if (event.key === 'Home') {\n          indexOfActiveItem = 0;\n        } else if (event.key === 'End') {\n          indexOfActiveItem = items.length - 1;\n        }\n\n        if (indexOfActiveItem < 0) indexOfActiveItem = 0;\n        if (indexOfActiveItem > items.length - 1) indexOfActiveItem = items.length - 1;\n\n        this.setActiveItem(items[indexOfActiveItem]);\n\n        return;\n      }\n    }\n\n    void this.typeToSelect(event.key);\n  }\n\n  private getMenuWrapperStyle() {\n    const styles: Partial<StyleDeclaration> = {};\n    if (this.getItemsShown() > 0) {\n      // calculate the proper height to show the correct number of items\n      styles.height = `${(this.getItemsShown() ?? 0) * this.sixMenuItemHeight}px`;\n    }\n    return {\n      ...styles,\n    };\n  }\n\n  private getMenuContainerStyle() {\n    const styles: Partial<StyleDeclaration> = {};\n\n    if (this.virtualScroll) {\n      // calculate height of content are if all items would be rendered so the scrollbar has the proper size\n      styles.transform = `translateY(${this.sixMenuItemHeight * this.scrollingIndex}px)`;\n    }\n\n    return {\n      ...styles,\n    };\n  }\n\n  private getScrollbarGhostStyle() {\n    const styles: Partial<StyleDeclaration> = {};\n\n    if (this.virtualScroll && this.items !== null) {\n      styles.height = `${this.items.length * this.sixMenuItemHeight - this.itemSize * this.sixMenuItemHeight}px`;\n    }\n\n    return {\n      ...styles,\n    };\n  }\n\n  private renderItems() {\n    if (this.items === undefined || this.items === null) {\n      return;\n    }\n\n    if (!this.virtualScroll) {\n      return this.items.map(mapToMenuItem);\n    }\n\n    return this.items\n      .slice(this.scrollingIndex, Math.min(this.items.length, this.itemSize + this.scrollingIndex))\n      .map(mapToMenuItem);\n  }\n\n  render() {\n    return (\n      <div\n        ref={(el) => (this.menuWrapper = el)}\n        style={this.getMenuWrapperStyle()}\n        part=\"wrapper\"\n        class={{\n          menu: true,\n          'menu--noshadow': this.removeBoxShadow,\n          'menu__wrapper--scrollable': this.getItemsShown() > 0,\n        }}\n      >\n        <div\n          ref={(el) => (this.menu = el)}\n          part=\"base\"\n          role=\"menu\"\n          onClick={this.handleClick}\n          onKeyDown={this.handleKeyDown}\n          tabIndex={0}\n          style={this.getMenuContainerStyle()}\n        >\n          <slot />\n          {this.renderItems()}\n        </div>\n        {this.virtualScroll && <div style={this.getScrollbarGhostStyle()} />}\n      </div>\n    );\n  }\n}\n"],"mappings":"gOAAgBA,EAAWC,GACzB,MAAMC,EAAWD,EAAGC,SACpB,OAAOA,GAAY,CACrB,C,SAEgBC,EAA0BF,GAExC,GAAID,EAAWC,GAAK,CAClB,OAAOA,C,CAIT,GAAIA,EAAGG,YAAc,KAAM,CACzB,MAAMC,EAAsB,IAAIJ,EAAGG,WAAWE,UAAUC,MAAMC,GAAMR,EAAWQ,KAC/E,GAAIH,GAAuB,KAAM,CAC/B,OAAOA,C,EAKX,GAAIJ,EAAGK,UAAY,KAAM,CACvB,MAAO,IAAIL,EAAGK,UAAUG,KAAKD,GAAML,EAA0BK,KAAmBE,GAAG,E,CAGrF,OAAOC,SACT,CCzBA,MAAMC,EAAiB,myCCwBvB,MAAMC,EACHC,GACmBb,IAClBA,IAAE,MAAFA,SAAE,SAAFA,EAAIc,QAAQC,iBAAkBF,EAAKE,cACvC,MAAMC,EAAYJ,EAAU,YAC5B,MAAMK,EAAgBL,EAAU,iBAEhC,IAAIM,EAAK,E,MAqBIC,EAAW,M,oYACdC,KAAAC,YAAc,cAAcH,IAC5BE,KAAAE,UAAY,MAKZF,KAAAG,mBAAqB,MA6GrBH,KAAAI,eAAiB,IAAIC,EAqHrBL,KAAAM,aAAe,KACrB,GAAIN,KAAKO,gBAAgBC,OAAS,EAAG,CACnC,OAAOR,KAAKO,gBAAgBnB,KAAKqB,GAAWC,EAAA,iBAAeC,MAAOF,EAAOE,OAAQF,EAAOG,Q,CAE1F,GAAIZ,KAAKa,OAAS,KAAM,MAAO,GAE/B,MAAOA,GAASC,EAAoCd,KAAKa,OAGzD,OAAOC,EAAgBD,IAAUE,MAAMC,KAAKH,EAAMI,iBAAiB,iBAAiB,EAG9EjB,KAAAkB,wBAA0B,K,QAChC,GAAIlB,KAAKmB,oBAAsB,KAAM,OAErC,MAAMC,IAAsBC,GAAAC,EAAAtB,KAAKmB,mBAAmBR,SAAK,MAAAW,SAAA,SAAAA,EAAE3B,iBAAa,MAAA0B,SAAA,SAAAA,EAAEE,SAAU,GAEpF,GAAIvB,KAAKO,gBAAgBC,OAAS,EAAG,CACnCR,KAAKwB,iCAAiCJ,E,KACjC,CACLpB,KAAKyB,4BAA4BL,E,CAGnCpB,KAAK0B,cAAcC,KAAK,CAAEC,YAAaR,GAAsB,EA+GvDpB,KAAA6B,sBAAyBC,I,MAC/B,MAAMC,EAAgBD,EAEtB,GAAIC,EAAcC,MAAQ,SAAU,MAC7BhC,KAAKiC,OACVjC,KAAKkC,iBACL,M,CAGF,GAAIlC,KAAKmB,uBAAuBG,EAAAtB,KAAKmC,KAAKpD,cAAU,MAAAuC,SAAA,SAAAA,EAAEc,eAAe,CACnE,GAAIL,EAAcC,MAAQ,YAAa,CACrC,MAAMK,EAAOrC,KAAKM,eAAepB,MAAMmD,GAASA,EAAKC,MAAMC,UAAY,SACvE,GAAIF,GAAQ,KAAM,CAChBA,EAAKG,U,GAMX,GAAIT,EAAcC,MAAQ,MAAO,CAE/B,GAAIhC,KAAKyC,MAAQC,SAASN,eAAiB,MAAQvC,EAAc6C,SAASN,eAAgB,CACxFL,EAAcY,sBACT3C,KAAKiC,OACVjC,KAAKkC,iBACL,M,CAOFU,YAAW,K,QACT,MAAMR,EACJpC,KAAK6C,UAAUC,wBAAyBC,YACpC1B,GAAAC,EAAAoB,SAASN,iBAAa,MAAAd,SAAA,SAAAA,EAAEvC,cAAU,MAAAsC,SAAA,SAAAA,EAAEe,cACpCM,SAASN,cAEf,IAAIA,IAAa,MAAbA,SAAa,SAAbA,EAAeY,QAAQhD,KAAK6C,UAAUnD,QAAQC,kBAAmBK,KAAK6C,UAAW,MAC9E7C,KAAKiC,OACV,M,OAMAjC,KAAAiD,wBAA2BnB,IAEjC,MAAMoB,EAAOpB,EAAMqB,eACnB,IAAKD,EAAKE,SAASpD,KAAK6C,WAAY,MAC7B7C,KAAKiC,OACV,M,GAIIjC,KAAAqD,kBAAqBvB,IAC3B,MAAMwB,EAASxB,EAAMwB,OAGrB,GAAItD,KAAKuD,eAAiB3D,EAAU0D,GAAS,MACtCtD,KAAKiC,OACVjC,KAAKkC,gB,GAIDlC,KAAAwD,mBAAqB,KAC3BxD,KAAKyC,KAAOzC,KAAKiC,OAASjC,KAAKyD,MAAM,EAG/BzD,KAAA0D,qBAAwB5B,IAE9B,GAAIA,EAAME,MAAQ,SAAU,CAC1BhC,KAAKkC,sBACAlC,KAAKiC,OACV,M,CAKF,IAAKjC,KAAK2D,4BAA8B,CAAC,IAAK,SAASP,SAAStB,EAAME,KAAM,CAC1EF,EAAMa,iBACN3C,KAAKyC,UAAYzC,KAAKiC,YAAcjC,KAAKyD,OACzC,M,CAGF,MAAMG,EAAO5D,KAAK6D,UAKlB,GAAI,CAAC,YAAa,WAAWT,SAAStB,EAAME,KAAM,CAChDF,EAAMa,iBAGN,IAAK3C,KAAKyC,KAAM,MACTzC,KAAKyD,M,CAGZ,GAAIG,GAAQ,KAAM,CAChB,M,CAEF,MAAME,EAAY,IAAIF,EAAK3C,iBAAiB,kBAC5C,MAAM8C,EAAgBD,EAAUzE,GAAG,GACnC,MAAM2E,EAAeF,EAAUzE,GAAGyE,EAAUtD,OAAS,GAGrD,GAAIsB,EAAME,MAAQ,aAAe+B,GAAiB,KAAM,CACtDA,EAAcvB,WACd,M,CAGF,GAAIV,EAAME,MAAQ,WAAagC,GAAgB,KAAM,CACnDA,EAAaxB,WACb,M,EAKJ,MAAMyB,EAAc,CAAC,MAAO,QAAS,OAAQ,OAAQ,OACrD,GAAIjE,KAAKyC,MAAQmB,GAAQ,OAASK,EAAYb,SAAStB,EAAME,KAAM,MAC5D4B,EAAKM,aAAapC,EAAME,KAC7B,M,GAIIhC,KAAAmE,mBAAsBrC,IAE5B,GAAIA,EAAME,MAAQ,IAAK,CACrBF,EAAMa,gB,GAIF3C,KAAAoE,wBAA0B,KAChCpE,KAAKqE,yBAAyB,EAGxBrE,KAAAsE,qBAAuB,KAC7B,GAAItE,KAAKa,OAAS,KAAM,OAExBb,KAAKuE,UAAU5C,KAAK,CAClB6C,aAAcxE,KAAKa,MAAM2D,aACzBC,UAAWzE,KAAKa,MAAM4D,UACtBC,gBAAiB1E,KAAKa,MAAM8D,cAAgB3E,KAAKa,MAAM8D,aAAe3E,KAAKa,MAAM2D,cACjFI,YAAa5E,KAAKa,MAAM4D,WAAazE,KAAKa,MAAM2D,aAAexE,KAAKa,MAAMgE,eAC1E,E,UAhf2C,M,eAkB9B,e,mBAGO,K,cAGL,E,cAGA,E,WAMH,M,6CAWC,M,iBAOK,M,uBAGM,Y,qBAGF,K,oBAODC,E,gCAGY,M,aAGA,G,mBAIb,M,qBA8BsB,E,CA7C9C,oBAAIC,GACF,OAAO/E,KAAKgF,QAAUhF,KAAKiF,W,CAgB7B,aAAIpC,GACF,OAAO7C,KAAKkF,mBAAqBlF,KAAKmC,I,CA8BxC,gBAAAgD,GACEnF,KAAKyC,KAAOzC,KAAKyD,OAASzD,KAAKiC,OAC/BjC,KAAKqE,yB,CAOP,0BAAAe,GACE,GAAIpF,KAAKqF,SAAW,KAAM,OAE1BrF,KAAKqF,QAAQC,WAAW,CACtBC,SAAUvF,KAAKwF,MAAQ,QAAU,WACjCC,UAAWzF,KAAKyF,UAChBC,SAAU1F,KAAK0F,SACfC,SAAU3F,KAAK2F,U,CAKnB,mBAAAC,GACE,GAAI7E,MAAM8E,QAAQ7F,KAAK8F,SAAU,CAC/B9F,KAAKO,gBAAkB,IAAIP,KAAK8F,Q,EAIpC,iBAAAC,GACE,GAAI/F,KAAKgG,eAAiBhG,KAAK8F,UAAY,KAAM,CAC/CG,QAAQC,MAAM,uD,CAGhB,GAAInF,MAAM8E,QAAQ7F,KAAK8F,SAAU,CAC/B9F,KAAKO,gBAAkB,IAAIP,KAAK8F,Q,CAGlC,GAAI9F,KAAKG,oBAAsBH,KAAKqF,SAAW,KAAM,CAKnDrF,KAAKmG,mB,EAIT,gBAAAC,GACEpG,KAAKG,mBAAqB,KAC1BH,KAAKmG,oBAGL,GAAInG,KAAKyC,KAAM,MACRzC,KAAKyD,M,CAGZ,GAAIzD,KAAKgF,OAAQ,CACfhF,KAAKqG,eAAerG,KAAKkB,wB,MACpB,GAAIlB,KAAKiF,YAAa,CAC3BjF,KAAKqG,gBAAe,SAAA/E,EAAAD,EAAM,OAAArB,KAAKsG,oBAAoB3E,KAAK,CAAEC,aAAaP,GAAAC,EAAAtB,KAAKmB,sBAAkB,MAAAG,SAAA,SAAAA,EAAEX,SAAK,MAAAU,SAAA,EAAAA,EAAI,IAAK,G,EAI1G,iBAAA8E,GACN,GAAInG,KAAKuG,SAAW,MAAQvG,KAAKwG,YAAc,KAAM,OACrD,MAAMC,EAAc,KAClB,GAAIzG,KAAKgF,QAAUhF,KAAKmB,oBAAsB,KAAM,CAClDnB,KAAKmB,mBAAmBR,MAAQ,GAEhC,GAAIX,KAAKO,gBAAgBC,OAAS,EAAG,CACnCR,KAAKO,gBAAkB,IAAIP,KAAK8F,Q,KAC3B,CACL,MAAMhC,EAAY9D,KAAKM,eACvBwD,EAAU4C,SAASrE,GAAUA,EAAKC,MAAMC,QAAU,S,EAItDvC,KAAK2G,aAAahF,MAAM,EAG1B,MAAMiF,EAAcC,U,MAClB,GAAI7G,KAAK+E,kBAAoB/E,KAAK8G,gBAAiB,QAE3CxF,EAAAtB,KAAKmB,sBAAkB,MAAAG,SAAA,SAAAA,EAAEkB,W,CAGjCxC,KAAK+G,aAAapF,MAAM,EAG1B,MAAMqF,EAAkB,KACtB,IAAKhH,KAAKyC,MAAQzC,KAAKa,OAAS,KAAM,CACpCb,KAAKa,MAAM4D,UAAY,C,GAI3BzE,KAAKqF,QAAU,IAAI4B,EAAQjH,KAAKuG,QAASvG,KAAKwG,WAAY,CACxDjB,SAAUvF,KAAKwF,MAAQ,QAAU,WACjCC,UAAWzF,KAAKyF,UAChBC,SAAU1F,KAAK0F,SACfC,SAAU3F,KAAK2F,SACfuB,kBAAmBlH,KAAKa,MACxB4F,cACAG,cACAI,mB,CAII,cAAAX,CAAec,GACrB,GAAInH,KAAKmB,oBAAsB,KAAM,CACnCnB,KAAKI,eAAegH,IAAIpH,KAAKmB,mBAAoB,kBAAmBkG,EAASF,EAAUnH,KAAKsH,gB,EA8BxF,gCAAA9F,CAAiCJ,GACvC,GAAIA,IAAwB,IAAML,MAAM8E,QAAQ7F,KAAK8F,SAAU,CAC7D9F,KAAKO,gBAAkB,IAAIP,KAAK8F,SAChC,M,CAGF9F,KAAKO,gBAAkBP,KAAK8F,QAAQd,QACjCvE,I,YACC,OAACA,EAAOG,SAASS,GAAAC,EAAAiG,OAAO9G,EAAOG,UAAM,MAAAU,SAAA,SAAAA,EAAE3B,iBAAa,MAAA0B,SAAA,SAAAA,EAAE+B,SAAShC,KAC9DX,EAAOE,SAAS6G,GAAAC,EAAAF,OAAO9G,EAAOE,UAAM,MAAA8G,SAAA,SAAAA,EAAE9H,iBAAa,MAAA6H,SAAA,SAAAA,EAAEpE,SAAShC,GAAqB,G,CAIlF,2BAAAK,CAA4BL,GAClC,MAAM0C,EAAY9D,KAAKM,eACvBwD,EAAU4C,SAAQG,MAAOa,I,YAEvB,MAAMC,IACJtG,GAAAC,EAAAoG,IAAQ,MAARA,SAAQ,SAARA,EAAU/G,SAAK,MAAAW,SAAA,SAAAA,EAAE3B,iBAAa,MAAA0B,SAAA,SAAAA,EAAE+B,SAAShC,OACzCoG,GAAAC,QAAOC,IAAQ,MAARA,SAAQ,SAARA,EAAUE,mBAAe,MAAAH,SAAA,SAAAA,EAAE9H,iBAAa,MAAA6H,SAAA,SAAAA,EAAEpE,SAAShC,IAE5DsG,EAASpF,MAAMC,QAAUoF,EAA4B,QAAU,MAAM,G,CAIzE,oBAAAE,G,MACE7H,KAAKI,eAAe0H,iBAEf9H,KAAKiC,QACVX,EAAAtB,KAAKqF,WAAO,MAAA/D,SAAA,SAAAA,EAAEyG,UACd/H,KAAKqF,QAAU/F,S,CAKjB,UAAMmE,GAEJ,GAAIzD,KAAKE,WAAaF,KAAKqF,SAAW,MAAQrF,KAAKa,OAAS,KAAM,CAChE,M,CAGF,MAAMmH,EAAUhI,KAAKgI,QAAQrG,OAC7B,GAAIqG,EAAQC,iBAAkB,CAC5BjI,KAAKyC,KAAO,MACZ,M,CAGFzC,KAAKI,eAAegH,IAAIpH,KAAKa,MAAO,yBAA0Bb,KAAKqD,mBACnErD,KAAKI,eAAegH,IAAI1E,SAAU,UAAW1C,KAAK6B,uBAClD7B,KAAKI,eAAegH,IAAI1E,SAAU,YAAa1C,KAAKiD,yBAEpDjD,KAAKE,UAAY,KACjBF,KAAKyC,KAAO,KACZzC,KAAKqF,QAAQ5B,M,CAKf,UAAMxB,GAEJ,IAAKjC,KAAKE,WAAaF,KAAKa,OAAS,MAAQb,KAAKqF,SAAW,KAAM,CACjE,M,CAGF,MAAM6C,EAAUlI,KAAKkI,QAAQvG,OAC7B,GAAIuG,EAAQD,iBAAkB,CAC5BjI,KAAKyC,KAAO,KACZ,M,CAGFzC,KAAKI,eAAe+H,OAAOnI,KAAKa,MAAO,yBAA0Bb,KAAKqD,mBACtErD,KAAKI,eAAe+H,OAAOzF,SAAU,UAAW1C,KAAK6B,uBACrD7B,KAAKI,eAAe+H,OAAOzF,SAAU,YAAa1C,KAAKiD,yBAEvDjD,KAAKE,UAAY,MACjBF,KAAKyC,KAAO,MACZzC,KAAKqF,QAAQpD,M,CAGP,cAAAC,GACN,GAAIlC,KAAKuG,SAAW,KAAM,OAC1B,MAAOA,GAAWzF,EAAsCd,KAAKuG,SAC7D,GAAIA,GAAW,KAAM,CACnB,UAAWA,EAAQ/D,WAAa,WAAY,CAC1C+D,EAAQ/D,U,MACH,UAAW+D,EAAQ6B,QAAU,WAAY,CAC9C7B,EAAQ6B,O,GAKN,OAAAvE,GACN,GAAI7D,KAAKa,OAAS,KAAM,OACxB,OAAOC,EAAoCd,KAAKa,OAAOmE,OAAOpF,GAAWP,GAAG,E,CAQ9E,gBAAMgJ,GACJ,IAAKrI,KAAKyC,MAAQzC,KAAKqF,SAAW,KAAM,CACtC,M,CAEFrF,KAAKqF,QAAQgD,Y,CAgKP,uBAAAhE,GACN,GAAIrE,KAAKuG,SAAW,KAAM,OAE1B,MAAM+B,EAAoBxH,EAAgBd,KAAKuG,SAASnH,IAAIN,GAA2BO,GAAG,GAC1F,GAAIiJ,GAAqB,KAAM,CAC7BA,EAAkBC,aAAa,gBAAiB,QAChDD,EAAkBC,aAAa,gBAAiBvI,KAAKyC,KAAO,OAAS,Q,EAIzE,MAAA+F,GACE,OACE9H,EAAA,OACE+H,KAAK,OACL3I,GAAIE,KAAKC,YACTyI,MAAO,CACLC,SAAU,KACV,iBAAkB3I,KAAKyC,OAGzB/B,EAAA,QACE+H,KAAK,UACLC,MAAM,oBACNE,IAAMhK,GAAQoB,KAAKuG,QAAU3H,EAC7BiK,QAAS7I,KAAKwD,mBACdsF,UAAW9I,KAAK0D,qBAChBqF,QAAS/I,KAAKmE,oBAEdzD,EAAA,QAAMjB,KAAK,UAAUuJ,aAAchJ,KAAKoE,2BAK1C1D,EAAA,OACEkI,IAAMhK,GAAQoB,KAAKwG,WAAa5H,EAChC8J,MAAO,CACLO,qBAAsB,KACtBC,gCAAiClJ,KAAKgF,QAAUhF,KAAKiF,eAAiBjF,KAAKwF,QAG5ExF,KAAK+E,kBACJrE,EAAA,aACEgI,MAAO,CACL,iBAAkB1I,KAAKyC,MACxB,cACYzC,KAAKyC,KAAO,QAAU,OACnCmG,IAAMhK,GAAQoB,KAAKmB,mBAAqBvC,EACxCuK,YAAanJ,KAAKoJ,oBAGtB1I,EAAA,OACEkI,IAAMhK,GAAQoB,KAAKa,MAAQjC,EAC3B6J,KAAK,QACLC,MAAM,kBACNW,KAAK,OAAM,cACErJ,KAAKyC,KAAO,QAAU,OAAM,kBACxBzC,KAAKC,YACtBqJ,SAAUtJ,KAAKsE,sBAEf5D,EAAA,aACCV,KAAKO,gBAAgBC,OAAS,GAC7BE,EAAA,YAAU+H,KAAK,OAAOc,MAAOvJ,KAAKO,gBAAiByF,cAAehG,KAAKgG,kB,6RC7nBrF,MAAMwD,EAAa,mSCgBnB,MAAMC,EAAqB/B,IAAgC,IAAApG,EAAAD,EAAAoG,EACzD,OAAAA,GAAApG,GAAAC,EAAAoG,IAAQ,MAARA,SAAQ,SAARA,EAAU3I,cAAU,MAAAuC,SAAA,SAAAA,EAAEoI,cAAc,iBAAa,MAAArI,SAAA,SAAAA,EAAEsI,aAAS,MAAAlC,SAAA,SAAAA,EAAEmC,SAAS,qBAAqB,EAE9F,MAAMC,EAAwBjL,IAC5BA,IAAE,MAAFA,SAAE,SAAFA,EAAIc,QAAQC,iBAAkB,gBAEhC,MAAMmK,EAAgB,EAAGnJ,QAAOC,WAA6BF,EAAA,iBAAeC,MAAOA,GAAQC,GAE3F,MAAMmJ,EAAsD,EAE5D,MAAMC,EAA+B,G,MAiBxBC,EAAO,M,qFACDjK,KAAAI,eAAiB,IAAIC,EAI9BL,KAAAkK,mBAAqB,GAwDrBlK,KAAAmK,gBAAkB,KACxB,GAAInK,KAAKoK,aAAe,KAAM,OAE9BpK,KAAKqK,eAAiBC,KAAKC,MAAMvK,KAAKoK,YAAY3F,UAAYzE,KAAKwK,kBAAkB,E,qBAlD7D,M,WAGgB,K,6CAOlB,M,cAML,G,uBAOS,G,oBAMH,E,uBAKLR,C,CAEpB,iBAAAjE,GACE/F,KAAKyK,YAAczK,KAAKyK,YAAYC,KAAK1K,MACzCA,KAAK2K,cAAgB3K,KAAK2K,cAAcD,KAAK1K,K,CAG/C,iBAAA4K,GACE,GAAI5K,KAAKuJ,QAAU,KAAM,CACvB,M,EAUJ,gBAAAnD,GACEpG,KAAK6K,wC,CAGP,oBAAAhD,GACE7H,KAAKI,eAAe0H,W,CAUtB,kBAAM5D,CAAalC,G,MACjB8I,aAAa9K,KAAK+K,qBAGlB/K,KAAK+K,oBAAsBnI,YAAW,IAAO5C,KAAKkK,mBAAqB,IAAK,KAC5ElK,KAAKkK,oBAAsBlI,EAAIrC,cAC/B,MAAM4J,EAAQvJ,KAAKgL,WACnB,IAAK,MAAM3I,KAAQkH,EAAO,CACxB,MAAM0B,GAAO3J,EAAAe,EAAKtD,cAAU,MAAAuC,SAAA,SAAAA,EAAEoI,cAAc,oBAC5C,MAAM9I,EAAQsK,EAAeD,GAAMtL,cAAc4B,OACjD,GAAIX,EAAMuK,UAAU,EAAGnL,KAAKkK,mBAAmB1J,UAAYR,KAAKkK,mBAAoB,CAClF7H,EAAKG,WACL,K,GAKE,aAAA4I,G,MACN,MAAMC,EAAoBrL,KAAKgG,cAAgB+D,EAAsD,EACrG,OAAOzI,EAAAtB,KAAKsL,cAAU,MAAAhK,SAAA,EAAAA,EAAI+J,C,CAGpB,sCAAAR,G,QACN,IAAK7K,KAAKgG,eAAiBhG,KAAKoK,aAAe,KAAM,OAErDpK,KAAKI,eAAegH,IAAIpH,KAAKoK,YAAa,SAAU/C,EAASrH,KAAKmK,gBAAiBnK,KAAKuL,oBAGxF,MAAMC,GAAiBnK,GAAAC,EAAAtB,KAAK4D,QAAI,MAAAtC,SAAA,SAAAA,EAAEoI,cAAc,oBAAgB,MAAArI,SAAA,SAAAA,EAAEwD,aAClE,GAAI2G,GAAkB,MAAQA,EAAiB,EAAG,CAChDxL,KAAKwK,kBAAoBgB,C,EAIrB,QAAAR,GACN,GAAIhL,KAAK4D,MAAQ,KAAM,MAAO,GAE9B,GAAI5D,KAAKuJ,OAAS,KAAM,CACtB,OAAOvJ,KAAKuJ,MAAMnK,IAAI0K,E,CAGxB,MAAMmB,EAAOjL,KAAK4D,KAAK8F,cAAc,QACrC,GAAIuB,GAAQ,KAAM,MAAO,GACzB,MAAO,IAAIA,EAAKQ,iBAAiB,CAAEC,QAAS,QAAS1G,QAClDpG,GAAqCiL,EAAqBjL,KAAQA,EAAG+M,U,CAIlE,kBAAAC,GACN,MAAMrC,EAAQvJ,KAAKgL,WACnB,MAAMa,EAAe7L,KAAK8L,gBAC1B,GAAID,GAAgB,KAAM,CACxB,MAAME,EAAYxC,EAAMyC,QAAQH,GAChC,GAAIE,GAAa,EAAG,CAClB,OAAOA,C,EAGX,MAAME,EAAejM,KAAKkM,sBAC1B,OAAOD,EAAaE,UAAU1C,E,CAGxB,aAAAqC,G,MACN,MAAM1J,EAAgBpC,KAAKgL,WAAW9L,MAAMkN,GAAMA,IAAM1J,SAASN,gBACjE,GAAIA,GAAiB,KAAM,CACzB,OAAOA,C,CAET,OAAOd,EAAAtB,KAAKkM,yBAAqB,MAAA5K,SAAA,SAAAA,EAAEpC,KAAKuK,E,CAGlC,mBAAAyC,G,QACN,OAAOnL,MAAMC,MAAKK,GAAAC,EAAAtB,KAAKmC,KAAKpD,cAAU,MAAAuC,SAAA,SAAAA,EAAEL,iBAAiB,oBAAgB,MAAAI,SAAA,EAAAA,EAAI,G,CAGvE,aAAAgL,CAAchK,GACpBA,IAAI,MAAJA,SAAI,SAAJA,EAAMG,U,CAGA,WAAAiI,CAAY3I,GAClB,MAAMwB,EAASxB,EAAMwB,OACrB,MAAMgJ,EAAchJ,EAAON,QAAQ,iBACnC,GAAIsJ,IAAgBA,EAAYX,SAAU,CACxC3L,KAAKuM,oBAAoB5K,KAAK,CAAElC,KAAM6M,EAAY3L,MAAO0B,KAAMiK,G,EAI3D,aAAA3B,CAAc7I,GAEpB,GAAIA,EAAME,MAAQ,QAAS,CACzB,MAAMwK,EAAaxM,KAAK8L,gBACxBhK,EAAMa,iBAEN,GAAI6J,GAAc,KAAM,CACtBxM,KAAKuM,oBAAoB5K,KAAK,CAAElC,KAAM+M,EAAW7L,MAAO0B,KAAMmK,G,EAKlE,GAAI1K,EAAME,MAAQ,IAAK,CACrBF,EAAMa,gB,CAIR,GAAI,CAAC,YAAa,UAAW,OAAQ,OAAOS,SAAStB,EAAME,KAAM,CAC/D,MAAMuH,EAAQvJ,KAAKuJ,QAAU,KAAOvJ,KAAKgL,WAAahL,KAAKkM,sBAE3D,IAAIO,EAAoBzM,KAAK4L,qBAE7B,GAAIrC,EAAM/I,OAAS,EAAG,CACpBsB,EAAMa,iBAEN,GAAIb,EAAME,MAAQ,YAAa,CAC7ByK,G,MACK,GAAI3K,EAAME,MAAQ,UAAW,CAClCyK,G,MACK,GAAI3K,EAAME,MAAQ,OAAQ,CAC/ByK,EAAoB,C,MACf,GAAI3K,EAAME,MAAQ,MAAO,CAC9ByK,EAAoBlD,EAAM/I,OAAS,C,CAGrC,GAAIiM,EAAoB,EAAGA,EAAoB,EAC/C,GAAIA,EAAoBlD,EAAM/I,OAAS,EAAGiM,EAAoBlD,EAAM/I,OAAS,EAE7ER,KAAKqM,cAAc9C,EAAMkD,IAEzB,M,OAICzM,KAAKkE,aAAapC,EAAME,I,CAGvB,mBAAA0K,G,MACN,MAAMC,EAAoC,GAC1C,GAAI3M,KAAKoL,gBAAkB,EAAG,CAE5BuB,EAAOC,OAAS,KAAItL,EAAAtB,KAAKoL,mBAAe,MAAA9J,SAAA,EAAAA,EAAI,GAAKtB,KAAKwK,qB,CAExD,OAAAqC,OAAAC,OAAA,GACKH,E,CAIC,qBAAAI,GACN,MAAMJ,EAAoC,GAE1C,GAAI3M,KAAKgG,cAAe,CAEtB2G,EAAOK,UAAY,cAAchN,KAAKwK,kBAAoBxK,KAAKqK,mB,CAGjE,OAAAwC,OAAAC,OAAA,GACKH,E,CAIC,sBAAAM,GACN,MAAMN,EAAoC,GAE1C,GAAI3M,KAAKgG,eAAiBhG,KAAKuJ,QAAU,KAAM,CAC7CoD,EAAOC,OAAS,GAAG5M,KAAKuJ,MAAM/I,OAASR,KAAKwK,kBAAoBxK,KAAKkN,SAAWlN,KAAKwK,qB,CAGvF,OAAAqC,OAAAC,OAAA,GACKH,E,CAIC,WAAAQ,GACN,GAAInN,KAAKuJ,QAAUjK,WAAaU,KAAKuJ,QAAU,KAAM,CACnD,M,CAGF,IAAKvJ,KAAKgG,cAAe,CACvB,OAAOhG,KAAKuJ,MAAMnK,IAAI0K,E,CAGxB,OAAO9J,KAAKuJ,MACT6D,MAAMpN,KAAKqK,eAAgBC,KAAK+C,IAAIrN,KAAKuJ,MAAM/I,OAAQR,KAAKkN,SAAWlN,KAAKqK,iBAC5EjL,IAAI0K,E,CAGT,MAAAtB,GACE,OACE9H,EAAA,OACEkI,IAAMhK,GAAQoB,KAAKoK,YAAcxL,EACjC0D,MAAOtC,KAAK0M,sBACZjE,KAAK,UACLC,MAAO,CACL9E,KAAM,KACN,iBAAkB5D,KAAKsN,gBACvB,4BAA6BtN,KAAKoL,gBAAkB,IAGtD1K,EAAA,OACEkI,IAAMhK,GAAQoB,KAAK4D,KAAOhF,EAC1B6J,KAAK,OACLY,KAAK,OACLR,QAAS7I,KAAKyK,YACd3B,UAAW9I,KAAK2K,cAChB9L,SAAU,EACVyD,MAAOtC,KAAK+M,yBAEZrM,EAAA,aACCV,KAAKmN,eAEPnN,KAAKgG,eAAiBtF,EAAA,OAAK4B,MAAOtC,KAAKiN,2B"}

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

@@ -1,2 +0,0 @@
-import{r,h as s}from"./p-6153045b.js";const t=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}:host{--track-color:var(--six-progress-track-color);--indicator-color:var(--six-progress-indicator-color);display:inline-flex}.progress-ring{display:inline-flex;align-items:center;justify-content:center;position:relative}.progress-ring__image{transform:rotate(-90deg);transform-origin:50% 50%}.progress-ring__track{stroke:var(--track-color)}.progress-ring__indicator{stroke:var(--indicator-color);transition:0.35s stroke-dashoffset, 0.35s stroke}.progress-ring__label{display:flex;align-items:center;justify-content:center;position:absolute;top:0;left:0;width:100%;height:100%;text-align:center;user-select:none;font-family:var(--six-font-family)}";const i=class{constructor(s){r(this,s);this.size=128;this.strokeWidth=4;this.percentage=0}handlePercentageChange(){this.updateProgress()}componentDidLoad(){this.updateProgress()}updateProgress(){var r;if(((r=this.indicator)===null||r===void 0?void 0:r.r)==null)return;const s=this.indicator.r.baseVal.value;const t=s*2*Math.PI;const i=t-this.percentage/100*t;this.indicator.style.strokeDasharray=`${t} ${t}`;this.indicator.style.strokeDashoffset=`${i}`}render(){return s("div",{part:"base",class:"progress-ring"},s("svg",{class:"progress-ring__image",width:this.size,height:this.size},s("circle",{class:"progress-ring__track","stroke-width":this.strokeWidth,"stroke-linecap":"round",fill:"transparent",r:this.size/2-this.strokeWidth*2,cx:this.size/2,cy:this.size/2}),s("circle",{ref:r=>this.indicator=r,class:"progress-ring__indicator","stroke-width":this.strokeWidth,"stroke-linecap":"round",fill:"transparent",r:this.size/2-this.strokeWidth*2,cx:this.size/2,cy:this.size/2})),s("span",{part:"label",class:"progress-ring__label"},s("slot",null)))}static get watchers(){return{percentage:["handlePercentageChange"]}}};i.style=t;export{i as six_progress_ring};
-//# sourceMappingURL=p-ee950ce2.entry.js.map