@six-group/ui-library 4.3.3 → 5.0.0-rc.1

package/dist/ui-library/p-6607d03a.entry.js.map

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

package/dist/ui-library/p-6dd3f54c.entry.js

@@ -0,0 +1,2 @@
+import{r as i,c as t,h as o,g as r}from"./p-JoG9I7EO.js";import{F as e}from"./p-Dg9366Gk.js";import{h as s}from"./p-j3oIB5oT.js";import{E as n}from"./p-C4h4qpGl.js";import{s as l}from"./p-B1bClJZ6.js";const a=':host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.form-control .form-control__label{display:none}.form-control .form-control__help-text{display:none}.form-control .form-control__error-text{display:none;text-align:left}.form-control--has-label .form-control__label{display:inline-block;color:var(--six-input-label-color);font-weight:var(--six-font-weight-bold);margin-bottom:var(--six-spacing-x-small)}.form-control--has-label .form-control__label__required::after{color:var(--six-color-danger-800);content:"*";transform:scale(1.1);margin-left:var(--six-spacing-xxx-small);position:absolute}.form-control--has-label.form-control--small .form-control__label{font-size:var(--six-input-label-font-size-small)}.form-control--has-label.form-control--medium .form-control__label{font-size:var(--six-input-label-font-size-medium)}.form-control--has-label.form-control--large .form-control_label{font-size:var(--six-input-label-font-size-large)}.form-control--has-help-text .form-control__help-text{display:block;color:var(--six-input-help-text-color);margin-top:var(--six-spacing-x-small)}.form-control--has-help-text .form-control__help-text ::slotted(*){margin-top:var(--six-spacing-xxx-small)}.form-control--has-help-text.form-control--small .form-control__help-text{font-size:var(--six-input-help-text-font-size-small)}.form-control--has-help-text.form-control--medium .form-control__help-text{font-size:var(--six-input-help-text-font-size-medium)}.form-control--has-help-text.form-control--large .form-control__help-text{font-size:var(--six-input-help-text-font-size-large)}.form-control--has-error-text .form-control__error-text{display:block;margin-top:var(--six-spacing-xxx-small)}.form-control--has-error-text .form-control__error-text ::slotted(*){margin-top:var(--six-spacing-xxx-small)}.form-control--has-error-text.form-control--small .form-control__error-text{font-size:var(--six-input-help-text-font-size-small)}.form-control--has-error-text.form-control--medium .form-control__error-text{font-size:var(--six-input-help-text-font-size-medium)}.form-control--has-error-text.form-control--large .form-control__error-text{font-size:var(--six-input-help-text-font-size-large)}.form-control--disabled .form-control__help-text{color:var(--six-input-help-text-color-disabled)}.form-control--disabled .form-control__label{color:var(--six-input-label-color-disabled)}.form-control--invalid:not(.form-control--disabled) .form-control__label{color:var(--six-input-label-color)}:host{display:block}.input{display:inline-flex;align-items:stretch;justify-content:start;position:relative;width:100%;font-family:var(--six-font-family);font-weight:var(--six-input-font-weight);letter-spacing:var(--six-input-letter-spacing);background-color:var(--six-input-background-color);border:solid var(--six-border-width) var(--six-input-border-color);vertical-align:middle;overflow:hidden;transition:var(--six-transition-fast) color, var(--six-transition-fast) border, var(--six-transition-fast) box-shadow;cursor:text}.input--line{border:none;border-bottom:solid var(--six-border-width) var(--six-input-border-color)}.input:hover:not(.input--disabled){background-color:var(--six-input-background-color-hover);border-color:var(--six-input-border-color-hover)}.input:hover:not(.input--disabled) .input__control{color:var(--six-input-color-hover)}.input:hover.input--dropdown-search{border-color:transparent}.input--dropdown-search{border-color:transparent}.input--dropdown-search.input--focused{border-color:var(--six-input-border-color)}.input.input--focused:not(.input--disabled){background-color:var(--six-input-background-color-focus);border-bottom-color:var(--six-input-border-color-focus);box-shadow:0 1px 0 0 var(--six-input-border-color-focus)}.input.input--focused:not(.input--disabled):not(.input--line){border-color:var(--six-input-border-color-focus);box-shadow:var(--six-input-focus-shadow)}.input.input--focused:not(.input--disabled) .input__control{color:var(--six-input-color-focus)}.input.input--disabled{background-color:var(--six-input-background-color-disabled);border-color:var(--six-input-border-color-disabled);cursor:not-allowed}.input.input--disabled .input__control{color:var(--six-input-color-disabled)}.input.input--disabled .input__control::placeholder{color:var(--six-input-placeholder-color-disabled)}.input.input--invalid:not(.input--disabled):not(.input--focused){border-bottom-color:var(--six-input-border-color-danger)}.input.input--invalid:not(.input--disabled):not(.input--focused):not(.input--line){border-color:var(--six-input-border-color-danger)}.input__control{flex:1 1 auto;width:100%;font-family:inherit;font-size:inherit;font-weight:inherit;min-width:0;color:var(--six-input-color);border:none;background:none;box-shadow:none;padding:0;margin:0;cursor:inherit;-webkit-appearance:none}.input__control::-webkit-search-decoration,.input__control::-webkit-search-cancel-button,.input__control::-webkit-search-results-button,.input__control::-webkit-search-results-decoration{-webkit-appearance:none}.input__control:-webkit-autofill,.input__control:-webkit-autofill:hover,.input__control:-webkit-autofill:focus,.input__control:-webkit-autofill:active{box-shadow:0 0 0 var(--six-height-large) var(--six-input-background-color-hover) inset !important;-webkit-text-fill-color:var(--six-color-primary-500)}.input__control::placeholder{color:var(--six-input-placeholder-color);user-select:none}.input__control:focus{outline:none}.input__control::-ms-reveal{display:none}.input__prefix,.input__suffix{display:inline-flex;flex:0 0 auto;align-items:center;cursor:default}.input__prefix ::slotted(six-icon),.input__suffix ::slotted(six-icon){color:var(--six-input-icon-color)}.input.input--disabled ::slotted(six-icon){cursor:not-allowed}.input--small{border-radius:var(--six-input-border-radius-small);font-size:var(--six-input-font-size-small);height:var(--six-height-small)}.input--small .input__control{height:calc(var(--six-height-small) - var(--six-border-width) * 2);margin:0 var(--six-input-spacing-small)}.input--small .input__control__prefix{margin:0 var(--six-input-prefix-spacing-small)}.input--small .input__clear,.input--small .input__password-toggle{margin-right:var(--six-input-spacing-small)}.input--small .input__prefix ::slotted(*){margin-left:var(--six-input-prefix-spacing-small)}.input--small .input__suffix ::slotted(*){margin-right:var(--six-input-prefix-spacing-small)}.input--medium{border-radius:var(--six-input-border-radius-medium);font-size:var(--six-input-font-size-medium);height:var(--six-height-medium)}.input--medium .input__control{height:calc(var(--six-height-medium) - var(--six-border-width) * 2);margin:0 var(--six-input-spacing-medium)}.input--medium .input__control__prefix{margin:0 var(--six-input-prefix-spacing-medium)}.input--medium .input__clear,.input--medium .input__password-toggle{margin-right:var(--six-input-spacing-medium)}.input--medium .input__prefix ::slotted(*){margin-left:var(--six-input-prefix-spacing-medium)}.input--medium .input__suffix ::slotted(*){margin-right:var(--six-input-prefix-spacing-medium)}.input--large{border-radius:var(--six-input-border-radius-large);font-size:var(--six-input-font-size-large);height:var(--six-height-large)}.input--large .input__control{height:calc(var(--six-height-large) - var(--six-border-width) * 2);margin:0 var(--six-input-spacing-large)}.input--large .input__control__prefix{margin:0 var(--six-input-prefix-spacing-large)}.input--large .input__clear,.input--large .input__password-toggle{margin-right:var(--six-input-spacing-large)}.input--large .input__prefix ::slotted(*){margin-left:var(--six-input-prefix-spacing-large)}.input--large .input__suffix ::slotted(*){margin-right:var(--six-input-prefix-spacing-large)}.input--pill.input--small{border-radius:var(--six-height-small)}.input--pill.input--medium{border-radius:var(--six-height-medium)}.input--pill.input--large{border-radius:var(--six-height-large)}.input__clear,.input__password-toggle{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}.input__clear:hover,.input__password-toggle:hover{color:var(--six-input-icon-color-hover)}.input__clear:focus,.input__password-toggle:focus{outline:none}.input--empty .input__clear{visibility:hidden}';const p={large:"medium",medium:"small",small:"xSmall"};let u=0;const h=class{constructor(o){i(this,o);this.sixChange=t(this,"six-input-change");this.sixClear=t(this,"six-input-clear");this.sixInput=t(this,"six-input-input");this.sixFocus=t(this,"six-input-focus");this.sixBlur=t(this,"six-input-blur");this.inputId=`input-${++u}`;this.labelId=`input-label-${u}`;this.helpTextId=`input-help-text-${u}`;this.errorTextId=`input-error-text-${u}`;this.eventListeners=new n;this.hasFocus=false;this.hasHelpTextSlot=false;this.hasLabelSlot=false;this.hasErrorSlot=false;this.isPasswordVisible=false;this.type="text";this.size="medium";this.name="";this.value="";this.pill=false;this.helpText="";this.disabled=false;this.readonly=false;this.dropdownSearch=false;this.required=false;this.autocapitalize="off";this.autocorrect="off";this.autocomplete="off";this.autofocus=false;this.spellcheck=false;this.label="";this.errorText="";this.invalid=false;this.clearable=false;this.togglePassword=false;this.line=false;this.handleChange=i=>{i.stopPropagation();if(this.nativeInput!=null){this.value=this.nativeInput.value;this.sixChange.emit()}};this.handleInput=i=>{i.stopPropagation();if(this.nativeInput!=null){this.value=this.nativeInput.value;this.sixInput.emit()}};this.handleBlur=()=>{this.hasFocus=false;this.sixBlur.emit()};this.handleFocus=()=>{this.hasFocus=true;this.sixFocus.emit()};this.handleClearClick=i=>{this.value="";this.sixClear.emit();this.sixInput.emit();this.sixChange.emit();if(this.nativeInput!=null){this.nativeInput.focus()}i.stopPropagation()};this.handleKeyDown=i=>{const t=i.metaKey||i.ctrlKey||i.shiftKey||i.altKey;if(i.key==="Enter"&&!t){setTimeout((()=>{if(!i.defaultPrevented&&!i.isComposing){l(this.host)}}))}};this.handlePasswordToggle=()=>{this.isPasswordVisible=!this.isPasswordVisible};this.handleSlotChange=()=>{this.hasHelpTextSlot=s(this.host,"help-text");this.hasLabelSlot=s(this.host,"label");this.hasErrorSlot=s(this.host,"error-text")}}handleLabelChange(){this.handleSlotChange()}handleValueChange(){this.value=this.getValue();if(this.nativeInput!=null&&this.nativeInput.value!==this.value){this.nativeInput.value=this.value}}connectedCallback(){var i;(i=this.host.shadowRoot)===null||i===void 0?void 0:i.addEventListener("slotchange",this.handleSlotChange);this.eventListeners.forward("six-input-input","input",this.host);this.eventListeners.forward("six-input-change","change",this.host);this.eventListeners.forward("six-input-focus","focus",this.host);this.eventListeners.forward("six-input-blur","blur",this.host)}componentWillLoad(){this.handleSlotChange()}disconnectedCallback(){var i;(i=this.host.shadowRoot)===null||i===void 0?void 0:i.removeEventListener("slotchange",this.handleSlotChange);this.eventListeners.removeAll()}async setFocus(i){var t;(t=this.nativeInput)===null||t===void 0?void 0:t.focus(i)}async removeFocus(){var i;(i=this.nativeInput)===null||i===void 0?void 0:i.blur()}async select(){var i;return(i=this.nativeInput)===null||i===void 0?void 0:i.select()}async setSelectionRange(i,t,o="none"){var r;return(r=this.nativeInput)===null||r===void 0?void 0:r.setSelectionRange(i,t,o)}async getSelectionRange(){var i,t,o,r,e,s;return{selectionStart:(t=(i=this.nativeInput)===null||i===void 0?void 0:i.selectionStart)!==null&&t!==void 0?t:undefined,selectionEnd:(r=(o=this.nativeInput)===null||o===void 0?void 0:o.selectionEnd)!==null&&r!==void 0?r:undefined,selectionDirection:(s=(e=this.nativeInput)===null||e===void 0?void 0:e.selectionDirection)!==null&&s!==void 0?s:undefined}}async setRangeText(i,t,o,r="preserve"){if(this.nativeInput==null){return}this.nativeInput.setRangeText(i,t,o,r);if(this.getValue()!==this.nativeInput.value){this.value=this.nativeInput.value;this.sixChange.emit();this.sixInput.emit()}}getValue(){var i;return((i=this.value)!==null&&i!==void 0?i:"").toString()}render(){return o(e,{key:"b88afe1aa2622eee58a8d66257cc5a0983354b25",inputId:this.inputId,label:this.label,labelId:this.labelId,hasLabelSlot:this.hasLabelSlot,helpTextId:this.helpTextId,helpText:this.helpText,hasHelpTextSlot:this.hasHelpTextSlot,errorTextId:this.errorTextId,errorText:this.errorText,errorTextCount:this.errorTextCount,hasErrorTextSlot:this.hasErrorSlot,size:this.size,disabled:this.disabled,required:this.required,displayError:this.invalid},o("div",{key:"b07352c5f2d4480a4b2919854e154faeac2d9f0f",part:"base",class:{input:true,"input--small":this.size==="small","input--medium":this.size==="medium","input--large":this.size==="large","input--line":this.line,"input--pill":this.pill,"input--disabled":this.disabled,"input--dropdown-search":this.dropdownSearch,"input--focused":this.hasFocus,"input--empty":this.getValue().length===0,"input--invalid":this.invalid}},o("span",{key:"37acf6498894ed16984dc35615387a9d7cb634d3",part:"prefix",class:"input__prefix"},o("slot",{key:"88e70802193d8925f03d58ea964a0bb9034a74ab",name:"prefix"})),o("input",{key:"bdeabe4cc23fc68a3a9c25307cf37ca2d77d6a5f",part:"input",ref:i=>this.nativeInput=i,id:this.inputId,size:1,class:{input__control:true,input__control__prefix:s(this.host,"prefix")},type:this.type==="password"&&this.isPasswordVisible?"text":this.type,name:this.name,placeholder:this.placeholder,disabled:this.disabled,readonly:this.readonly,minLength:this.minlength,maxLength:this.maxlength,min:this.min,max:this.max,step:this.step,value:this.getValue(),autoCapitalize:this.autocapitalize,autoComplete:this.autocomplete,autoCorrect:this.autocorrect,autoFocus:this.autofocus,spellcheck:this.spellcheck,pattern:this.pattern,required:this.required,inputMode:this.inputmode,"aria-labelledby":this.labelId,"aria-describedby":this.helpTextId,"aria-invalid":this.invalid?"true":"false",onChange:this.handleChange,onInput:this.handleInput,onFocus:this.handleFocus,onBlur:this.handleBlur,onKeyDown:this.handleKeyDown,"data-testid":"input-control"}),this.clearable&&!this.disabled&&o("button",{key:"e7f5713eec0bf5bd6b69335f60793071309770dc",part:"clear-button",class:"input__clear",type:"button",onClick:this.handleClearClick,tabindex:"-1","data-testid":"input-clear-button"},o("slot",{key:"9cef48b67afbb2a833a7dff0ffa3b8ce153c11b2",name:"clear-icon"},o("six-icon",{key:"fa08350fb58063c871ef9f64d3d3d5a9dd8fbdec",size:p[this.size]},"clear"))),this.togglePassword&&o("button",{key:"aacef765fcbc09b9479737d620568a5f78a884e5",part:"password-toggle-button",class:"input__password-toggle",type:"button",onClick:this.handlePasswordToggle,tabindex:"-1"},this.isPasswordVisible?o("slot",{name:"show-password-icon"},o("six-icon",{size:p[this.size]},"visibility_off")):o("slot",{name:"hide-password-icon"},o("six-icon",{size:p[this.size]},"visibility"))),o("span",{key:"0e8461e5897ab4380f67e207d1c1f3d9065b00b7",part:"suffix",class:"input__suffix"},o("slot",{key:"a7634ecf343884a7197b2edb82a55863af8faf5b",name:"suffix"}))))}get host(){return r(this)}static get watchers(){return{helpText:["handleLabelChange"],errorText:["handleLabelChange"],label:["handleLabelChange"],value:["handleValueChange"]}}};h.style=a;export{h as six_input};
+//# sourceMappingURL=p-6dd3f54c.entry.js.map

package/dist/ui-library/p-6dd3f54c.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["sixInputCss","ICON_SIZES","large","medium","small","id","SixInput","constructor","hostRef","this","inputId","labelId","helpTextId","errorTextId","eventListeners","EventListeners","hasFocus","hasHelpTextSlot","hasLabelSlot","hasErrorSlot","isPasswordVisible","type","size","name","value","pill","helpText","disabled","readonly","dropdownSearch","required","autocapitalize","autocorrect","autocomplete","autofocus","spellcheck","label","errorText","invalid","clearable","togglePassword","line","handleChange","event","stopPropagation","nativeInput","sixChange","emit","handleInput","sixInput","handleBlur","sixBlur","handleFocus","sixFocus","handleClearClick","sixClear","focus","handleKeyDown","hasModifier","metaKey","ctrlKey","shiftKey","altKey","key","setTimeout","defaultPrevented","isComposing","submitForm","host","handlePasswordToggle","handleSlotChange","hasSlot","handleLabelChange","handleValueChange","getValue","connectedCallback","_a","shadowRoot","addEventListener","forward","componentWillLoad","disconnectedCallback","removeEventListener","removeAll","setFocus","options","removeFocus","blur","select","setSelectionRange","selectionStart","selectionEnd","selectionDirection","getSelectionRange","_b","undefined","_d","_c","_f","_e","setRangeText","replacement","start","end","selectMode","toString","render","h","FormControl","errorTextCount","hasErrorTextSlot","displayError","part","class","input","length","ref","el","input__control","input__control__prefix","placeholder","minLength","minlength","maxLength","maxlength","min","max","step","autoCapitalize","autoComplete","autoCorrect","autoFocus","pattern","inputMode","inputmode","onChange","onInput","onFocus","onBlur","onKeyDown","onClick","tabindex"],"sources":["src/components/six-input/six-input.scss?tag=six-input&encapsulation=shadow","src/components/six-input/six-input.tsx"],"sourcesContent":["@import 'src/global/component';\n@import '../../functional-components/form-control/form-control';\n\n:host {\n  display: block;\n}\n\n.input {\n  display: inline-flex;\n  align-items: stretch;\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  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  overflow: hidden;\n  transition:\n    var(--six-transition-fast) color,\n    var(--six-transition-fast) border,\n    var(--six-transition-fast) box-shadow;\n  cursor: text;\n\n  &--line {\n    border: none;\n    border-bottom: solid var(--six-border-width) var(--six-input-border-color);\n  }\n\n  &:hover:not(.input--disabled) {\n    background-color: var(--six-input-background-color-hover);\n    border-color: var(--six-input-border-color-hover);\n\n    .input__control {\n      color: var(--six-input-color-hover);\n    }\n  }\n\n  &:hover.input--dropdown-search {\n    border-color: transparent;\n  }\n\n  &--dropdown-search {\n    border-color: transparent;\n  }\n\n  &--dropdown-search.input--focused {\n    border-color: var(--six-input-border-color);\n  }\n\n  &.input--focused:not(.input--disabled) {\n    background-color: var(--six-input-background-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(.input--line) {\n      border-color: var(--six-input-border-color-focus);\n      box-shadow: var(--six-input-focus-shadow);\n    }\n\n    .input__control {\n      color: var(--six-input-color-focus);\n    }\n  }\n\n  &.input--disabled {\n    background-color: var(--six-input-background-color-disabled);\n    border-color: var(--six-input-border-color-disabled);\n    cursor: not-allowed;\n\n    .input__control {\n      color: var(--six-input-color-disabled);\n\n      &::placeholder {\n        color: var(--six-input-placeholder-color-disabled);\n      }\n    }\n  }\n\n  &.input--invalid:not(.input--disabled):not(.input--focused) {\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.input__control {\n  flex: 1 1 auto;\n  width: 100%;\n  font-family: inherit;\n  font-size: inherit;\n  font-weight: inherit;\n  min-width: 0;\n  color: var(--six-input-color);\n  border: none;\n  background: none;\n  box-shadow: none;\n  padding: 0;\n  margin: 0;\n  cursor: inherit;\n  -webkit-appearance: none;\n\n  &::-webkit-search-decoration,\n  &::-webkit-search-cancel-button,\n  &::-webkit-search-results-button,\n  &::-webkit-search-results-decoration {\n    -webkit-appearance: none;\n  }\n\n  &:-webkit-autofill,\n  &:-webkit-autofill:hover,\n  &:-webkit-autofill:focus,\n  &:-webkit-autofill:active {\n    box-shadow: 0 0 0 var(--six-height-large) var(--six-input-background-color-hover) inset !important;\n    -webkit-text-fill-color: var(--six-color-primary-500);\n  }\n\n  &::placeholder {\n    color: var(--six-input-placeholder-color);\n    user-select: none;\n  }\n\n  &:focus {\n    outline: none;\n  }\n\n  &::-ms-reveal {\n    display: none;\n  }\n}\n\n.input__prefix,\n.input__suffix {\n  display: inline-flex;\n  flex: 0 0 auto;\n  align-items: center;\n  cursor: default;\n\n  ::slotted(six-icon) {\n    color: var(--six-input-icon-color);\n  }\n}\n\n.input {\n  &.input--disabled {\n    ::slotted(six-icon) {\n      cursor: not-allowed;\n    }\n  }\n}\n\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n// Size modifiers\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n\n.input--small {\n  border-radius: var(--six-input-border-radius-small);\n  font-size: var(--six-input-font-size-small);\n  height: var(--six-height-small);\n\n  .input__control {\n    height: calc(var(--six-height-small) - var(--six-border-width) * 2);\n    margin: 0 var(--six-input-spacing-small);\n  }\n\n  .input__control__prefix {\n    margin: 0 var(--six-input-prefix-spacing-small);\n  }\n\n  .input__clear,\n  .input__password-toggle {\n    margin-right: var(--six-input-spacing-small);\n  }\n\n  .input__prefix ::slotted(*) {\n    margin-left: var(--six-input-prefix-spacing-small);\n  }\n\n  .input__suffix ::slotted(*) {\n    margin-right: var(--six-input-prefix-spacing-small);\n  }\n}\n\n.input--medium {\n  border-radius: var(--six-input-border-radius-medium);\n  font-size: var(--six-input-font-size-medium);\n  height: var(--six-height-medium);\n\n  .input__control {\n    height: calc(var(--six-height-medium) - var(--six-border-width) * 2);\n    margin: 0 var(--six-input-spacing-medium);\n  }\n\n  .input__control__prefix {\n    margin: 0 var(--six-input-prefix-spacing-medium);\n  }\n\n  .input__clear,\n  .input__password-toggle {\n    margin-right: var(--six-input-spacing-medium);\n  }\n\n  .input__prefix ::slotted(*) {\n    margin-left: var(--six-input-prefix-spacing-medium);\n  }\n\n  .input__suffix ::slotted(*) {\n    margin-right: var(--six-input-prefix-spacing-medium);\n  }\n}\n\n.input--large {\n  border-radius: var(--six-input-border-radius-large);\n  font-size: var(--six-input-font-size-large);\n  height: var(--six-height-large);\n\n  .input__control {\n    height: calc(var(--six-height-large) - var(--six-border-width) * 2);\n    margin: 0 var(--six-input-spacing-large);\n  }\n\n  .input__control__prefix {\n    margin: 0 var(--six-input-prefix-spacing-large);\n  }\n\n  .input__clear,\n  .input__password-toggle {\n    margin-right: var(--six-input-spacing-large);\n  }\n\n  .input__prefix ::slotted(*) {\n    margin-left: var(--six-input-prefix-spacing-large);\n  }\n\n  .input__suffix ::slotted(*) {\n    margin-right: var(--six-input-prefix-spacing-large);\n  }\n}\n\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n// Pill modifier\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n\n.input--pill {\n  &.input--small {\n    border-radius: var(--six-height-small);\n  }\n\n  &.input--medium {\n    border-radius: var(--six-height-medium);\n  }\n\n  &.input--large {\n    border-radius: var(--six-height-large);\n  }\n}\n\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n// Clearable + Password Toggle\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n\n.input__clear,\n.input__password-toggle {\n  display: inline-flex;\n  align-items: center;\n  font-size: inherit;\n  color: var(--six-input-icon-color);\n  border: none;\n  background: none;\n  padding: 0;\n  transition: var(--six-transition-fast) color;\n  cursor: pointer;\n\n  &:hover {\n    color: var(--six-input-icon-color-hover);\n  }\n\n  &:focus {\n    outline: none;\n  }\n}\n\n.input--empty .input__clear {\n  visibility: hidden;\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport FormControl from '../../functional-components/form-control/form-control';\nimport { hasSlot } from '../../utils/slot';\nimport { EmptyPayload } from '../../utils/types';\nimport { EventListeners } from '../../utils/event-listeners';\nimport { submitForm } from '../../utils/form';\n\nconst ICON_SIZES: Record<'small' | 'medium' | 'large', 'xSmall' | 'small' | 'medium'> = {\n  large: 'medium',\n  medium: 'small',\n  small: 'xSmall',\n};\n\nexport type SelectionRangeDirection = 'forward' | 'backward' | 'none';\nexport type SelectionRange = {\n  selectionStart: number | undefined;\n  selectionEnd: number | undefined;\n  selectionDirection: SelectionRangeDirection | undefined;\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 label - The input's label. Alternatively, you can use the label prop.\n * @slot prefix - Used to prepend an icon or similar element to the input.\n * @slot suffix - Used to append an icon or similar element to the input.\n * @slot clear-icon - An icon to use in lieu of the default clear icon.\n * @slot show-password-icon - An icon to use in lieu of the default show password icon.\n * @slot hide-password-icon - An icon to use in lieu of the default hide password icon.\n * @slot help-text - Help text that describes how to use the input. Alternatively, you can use the help-text prop.\n * @slot error-text - Error text that is shown when the status is set to invalid. Alternatively, you can use the error-text prop.\n *\n * @part base - The component's base wrapper.\n * @part form-control - The form control that wraps the label, input, error-text and help-text.\n * @part label - The input label.\n * @part input - The input control.\n * @part prefix - The input prefix container.\n * @part clear-button - The clear button.\n * @part password-toggle-button - The password toggle button.\n * @part suffix - The input suffix container.\n * @part help-text - The input help text.\n * @part error-text - The input error text.\n */\n\n@Component({\n  tag: 'six-input',\n  styleUrl: 'six-input.scss',\n  shadow: true,\n})\nexport class SixInput {\n  private inputId = `input-${++id}`;\n  private labelId = `input-label-${id}`;\n  private helpTextId = `input-help-text-${id}`;\n  private errorTextId = `input-error-text-${id}`;\n  private nativeInput?: HTMLInputElement;\n  private eventListeners = new EventListeners();\n\n  @Element() host!: HTMLSixInputElement;\n\n  @State() hasFocus = false;\n  @State() hasHelpTextSlot = false;\n  @State() hasLabelSlot = false;\n  @State() hasErrorSlot = false;\n  @State() isPasswordVisible = false;\n\n  /** The input's type. */\n  @Prop({ reflect: true }) type: 'email' | 'number' | 'password' | 'search' | 'tel' | 'text' | 'url' = 'text';\n\n  /** The input's size. */\n  @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n  /** The input's name attribute. */\n  @Prop({ reflect: true }) name = '';\n\n  /** The input's value attribute. */\n  @Prop({ mutable: true, reflect: true }) value = '';\n\n  /** Set to true to draw a pill-style input with rounded edges. */\n  @Prop({ reflect: true }) pill = false;\n\n  /** The input's help text. Alternatively, you can use the help-text slot. */\n  @Prop() helpText = '';\n\n  /** The input's placeholder text. */\n  @Prop() placeholder?: string;\n\n  /** Set to true to disable the input. */\n  @Prop({ reflect: true }) disabled = false;\n\n  /** Set to true to make the input readonly. */\n  @Prop({ reflect: true }) readonly = false;\n\n  /** The minimum length of input that will be considered valid. */\n  @Prop({ reflect: true }) minlength?: number;\n\n  /** The maximum length of input that will be considered valid. */\n  @Prop({ reflect: true }) maxlength?: number;\n\n  /** The input's minimum value. */\n  @Prop({ reflect: true }) min?: number;\n\n  /** The input's maximum value. */\n  @Prop({ reflect: true }) max?: number;\n\n  /** The input's step attribute. */\n  @Prop({ reflect: true }) step?: number;\n\n  /** A pattern to validate input against. */\n  @Prop({ reflect: true }) pattern?: string;\n\n  /**\n   * Internal: Styles the input for the dropdown filter search.\n   */\n  @Prop() dropdownSearch = false;\n\n  /** Set to true to show an asterisk beneath the label. */\n  @Prop() required = false;\n\n  /** The input's autocaptialize attribute. */\n  @Prop() autocapitalize = 'off';\n\n  /** The input's autocorrect attribute. */\n  @Prop() autocorrect: 'on' | 'off' = 'off';\n\n  /** The input's autocomplete attribute. */\n  @Prop() autocomplete = 'off';\n\n  /** The input's autofocus attribute. */\n  @Prop() autofocus = false;\n\n  /** Enables spell checking on the input. */\n  @Prop() spellcheck = false;\n\n  /** The label text. */\n  @Prop() label = '';\n\n  /** The error message shown, if `invalid` is set to true.  */\n  @Prop() errorText: string | string[] = '';\n\n  /** The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1 */\n  @Prop() errorTextCount?: number;\n\n  /** If this property is set to true and an error message is provided by `errorText`, the error message is displayed.  */\n  @Prop({ reflect: true }) invalid = false;\n\n  /** Set to true to add a clear button when the input is populated. */\n  @Prop() clearable = false;\n\n  /** Set to true to add a password toggle button for password inputs. */\n  @Prop() togglePassword = false;\n\n  /** The input's inputmode attribute. */\n  @Prop() inputmode?: 'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url';\n\n  /** Set to render as line */\n  @Prop() line = false;\n\n  @Watch('helpText')\n  @Watch('errorText')\n  @Watch('label')\n  handleLabelChange() {\n    this.handleSlotChange();\n  }\n\n  @Watch('value')\n  handleValueChange() {\n    this.value = this.getValue();\n    if (this.nativeInput != null && this.nativeInput.value !== this.value) {\n      this.nativeInput.value = this.value;\n    }\n  }\n\n  /** Emitted when the control's value changes. Access the new value via event.target.value. */\n  @Event({ eventName: 'six-input-change' }) sixChange!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the clear button is activated. */\n  @Event({ eventName: 'six-input-clear' }) sixClear!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the control receives input. Access the new value via event.target.value.  */\n  @Event({ eventName: 'six-input-input' }) sixInput!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the control gains focus. */\n  @Event({ eventName: 'six-input-focus' }) sixFocus!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the control loses focus. Access the new value via event.target.value. */\n  @Event({ eventName: 'six-input-blur' }) sixBlur!: EventEmitter<EmptyPayload>;\n\n  connectedCallback() {\n    this.host.shadowRoot?.addEventListener('slotchange', this.handleSlotChange);\n    this.eventListeners.forward('six-input-input', 'input', this.host);\n    this.eventListeners.forward('six-input-change', 'change', this.host);\n    this.eventListeners.forward('six-input-focus', 'focus', this.host);\n    this.eventListeners.forward('six-input-blur', 'blur', this.host);\n  }\n\n  componentWillLoad() {\n    this.handleSlotChange();\n  }\n\n  disconnectedCallback() {\n    this.host.shadowRoot?.removeEventListener('slotchange', this.handleSlotChange);\n    this.eventListeners.removeAll();\n  }\n\n  /** Sets focus on the input. */\n  @Method()\n  async setFocus(options?: FocusOptions) {\n    this.nativeInput?.focus(options);\n  }\n\n  /** Removes focus from the input. */\n  @Method()\n  async removeFocus() {\n    this.nativeInput?.blur();\n  }\n\n  /** Selects all the text in the input. */\n  @Method()\n  async select() {\n    return this.nativeInput?.select();\n  }\n\n  /** Sets the start and end positions of the text selection (0-based). */\n  @Method()\n  async setSelectionRange(\n    selectionStart: number,\n    selectionEnd: number,\n    selectionDirection: SelectionRangeDirection = 'none'\n  ) {\n    return this.nativeInput?.setSelectionRange(selectionStart, selectionEnd, selectionDirection);\n  }\n\n  /** Returns the start and end positions of the text selection */\n  @Method()\n  async getSelectionRange(): Promise<SelectionRange> {\n    return {\n      selectionStart: this.nativeInput?.selectionStart ?? undefined,\n      selectionEnd: this.nativeInput?.selectionEnd ?? undefined,\n      selectionDirection: this.nativeInput?.selectionDirection ?? undefined,\n    };\n  }\n\n  /** Replaces a range of text with a new string. */\n  @Method()\n  async setRangeText(\n    replacement: string,\n    start: number,\n    end: number,\n    selectMode: 'select' | 'start' | 'end' | 'preserve' = 'preserve'\n  ) {\n    if (this.nativeInput == null) {\n      return;\n    }\n    this.nativeInput.setRangeText(replacement, start, end, selectMode);\n    if (this.getValue() !== this.nativeInput.value) {\n      this.value = this.nativeInput.value;\n      this.sixChange.emit();\n      this.sixInput.emit();\n    }\n  }\n\n  private handleChange = (event: Event) => {\n    event.stopPropagation();\n    if (this.nativeInput != null) {\n      this.value = this.nativeInput.value;\n      this.sixChange.emit();\n    }\n  };\n\n  private handleInput = (event: Event) => {\n    event.stopPropagation();\n    if (this.nativeInput != null) {\n      this.value = this.nativeInput.value;\n      this.sixInput.emit();\n    }\n  };\n\n  private handleBlur = () => {\n    this.hasFocus = false;\n    this.sixBlur.emit();\n  };\n\n  private handleFocus = () => {\n    this.hasFocus = true;\n    this.sixFocus.emit();\n  };\n\n  private handleClearClick = (event: MouseEvent) => {\n    this.value = '';\n    this.sixClear.emit();\n    this.sixInput.emit();\n    this.sixChange.emit();\n    if (this.nativeInput != null) {\n      this.nativeInput.focus();\n    }\n    event.stopPropagation();\n  };\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    const hasModifier = event.metaKey || event.ctrlKey || event.shiftKey || event.altKey;\n    if (event.key === 'Enter' && !hasModifier) {\n      setTimeout(() => {\n        if (!event.defaultPrevented && !event.isComposing) {\n          submitForm(this.host);\n        }\n      });\n    }\n  };\n\n  private handlePasswordToggle = () => {\n    this.isPasswordVisible = !this.isPasswordVisible;\n  };\n\n  private handleSlotChange = () => {\n    this.hasHelpTextSlot = hasSlot(this.host, 'help-text');\n    this.hasLabelSlot = hasSlot(this.host, 'label');\n    this.hasErrorSlot = hasSlot(this.host, 'error-text');\n  };\n\n  private getValue(): string {\n    return (this.value ?? '').toString();\n  }\n\n  render() {\n    return (\n      <FormControl\n        inputId={this.inputId}\n        label={this.label}\n        labelId={this.labelId}\n        hasLabelSlot={this.hasLabelSlot}\n        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.hasErrorSlot}\n        size={this.size}\n        disabled={this.disabled}\n        required={this.required}\n        displayError={this.invalid}\n      >\n        <div\n          part=\"base\"\n          class={{\n            input: true,\n\n            // Sizes\n            'input--small': this.size === 'small',\n            'input--medium': this.size === 'medium',\n            'input--large': this.size === 'large',\n\n            // States\n            'input--line': this.line,\n            'input--pill': this.pill,\n            'input--disabled': this.disabled,\n            'input--dropdown-search': this.dropdownSearch,\n            'input--focused': this.hasFocus,\n            'input--empty': this.getValue().length === 0,\n            'input--invalid': this.invalid,\n          }}\n        >\n          <span part=\"prefix\" class=\"input__prefix\">\n            <slot name=\"prefix\" />\n          </span>\n\n          <input\n            part=\"input\"\n            ref={(el) => (this.nativeInput = el)}\n            id={this.inputId}\n            size={1} // needed for firefox to overrule the default of 20\n            class={{\n              input__control: true,\n              input__control__prefix: hasSlot(this.host, 'prefix'),\n            }}\n            type={this.type === 'password' && this.isPasswordVisible ? 'text' : this.type}\n            name={this.name}\n            placeholder={this.placeholder}\n            disabled={this.disabled}\n            readonly={this.readonly}\n            minLength={this.minlength}\n            maxLength={this.maxlength}\n            min={this.min}\n            max={this.max}\n            step={this.step}\n            value={this.getValue()}\n            autoCapitalize={this.autocapitalize}\n            autoComplete={this.autocomplete}\n            autoCorrect={this.autocorrect}\n            autoFocus={this.autofocus}\n            spellcheck={this.spellcheck}\n            pattern={this.pattern}\n            required={this.required}\n            inputMode={this.inputmode}\n            aria-labelledby={this.labelId}\n            aria-describedby={this.helpTextId}\n            aria-invalid={this.invalid ? 'true' : 'false'}\n            onChange={this.handleChange}\n            onInput={this.handleInput}\n            onFocus={this.handleFocus}\n            onBlur={this.handleBlur}\n            onKeyDown={this.handleKeyDown}\n            data-testid=\"input-control\"\n          />\n\n          {this.clearable && !this.disabled && (\n            <button\n              part=\"clear-button\"\n              class=\"input__clear\"\n              type=\"button\"\n              onClick={this.handleClearClick}\n              tabindex=\"-1\"\n              data-testid=\"input-clear-button\"\n            >\n              <slot name=\"clear-icon\">\n                <six-icon size={ICON_SIZES[this.size]}>clear</six-icon>\n              </slot>\n            </button>\n          )}\n\n          {this.togglePassword && (\n            <button\n              part=\"password-toggle-button\"\n              class=\"input__password-toggle\"\n              type=\"button\"\n              onClick={this.handlePasswordToggle}\n              tabindex=\"-1\"\n            >\n              {this.isPasswordVisible ? (\n                <slot name=\"show-password-icon\">\n                  <six-icon size={ICON_SIZES[this.size]}>visibility_off</six-icon>\n                </slot>\n              ) : (\n                <slot name=\"hide-password-icon\">\n                  <six-icon size={ICON_SIZES[this.size]}>visibility</six-icon>\n                </slot>\n              )}\n            </button>\n          )}\n\n          <span part=\"suffix\" class=\"input__suffix\">\n            <slot name=\"suffix\" />\n          </span>\n        </div>\n      </FormControl>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/ui-library/p-811ce2a0.entry.js

@@ -0,0 +1,2 @@
+import{r as i,c as o,h as e,g as r}from"./p-JoG9I7EO.js";import{E as t}from"./p-C4h4qpGl.js";const s=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}:host{display:inline-block}.radio{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}.radio__icon{display:inline-flex;width:var(--six-selection-control-toggle-size);height:var(--six-selection-control-toggle-size)}.radio__icon svg{width:100%;height:100%}.radio__control{position:relative;display:inline-flex;align-items:center;justify-content:center;width:var(--six-selection-control-toggle-size);height:var(--six-selection-control-toggle-size);border:solid var(--six-border-width) var(--six-input-border-color);border-radius:50%;background-color:var(--six-input-background-color);color:transparent;transition:var(--six-transition-fast) border-color, var(--six-transition-fast) background-color, var(--six-transition-fast) color, var(--six-transition-fast) box-shadow}.radio__control input[type=radio]{position:absolute;opacity:0;padding:0;margin:0;pointer-events:none}.radio:not(.radio--checked):not(.radio--disabled) .radio__control:hover{border-color:var(--six-input-border-color-hover)}.radio--checked .radio__control{color:var(--six-selection-control-color);border-color:var(--six-selection-control-color)}.radio.radio--checked:not(.radio--disabled) .radio__control:hover{color:var(--six-input-border-color-focus);border-color:var(--six-input-border-color-focus)}.radio--disabled{cursor:not-allowed;color:var(--six-input-color-disabled)}.radio--disabled .radio__control{border-color:var(--six-input-border-color-disabled)}.radio--disabled.radio--checked .radio__control{color:var(--six-selection-control-color-disabled)}.radio__label{line-height:var(--six-selection-control-toggle-size);margin-left:0.5em;user-select:none}";let a=0;const l=class{constructor(e){i(this,e);this.sixBlur=o(this,"six-radio-blur");this.sixChange=o(this,"six-radio-change");this.sixFocus=o(this,"six-radio-focus");this.inputId=`radio-${++a}`;this.labelId=`radio-label-${a}`;this.eventListeners=new t;this.hasFocus=false;this.name="";this.value="on";this.disabled=false;this.checked=false;this.invalid=false;this.handleClick=()=>{if(this.nativeInput!=null){this.checked=this.nativeInput.checked;this.sixChange.emit()}};this.handleBlur=()=>{this.hasFocus=false;this.sixBlur.emit()};this.handleFocus=()=>{this.hasFocus=true;this.sixFocus.emit()};this.handleKeyDown=i=>{if(["ArrowUp","ArrowDown","ArrowLeft","ArrowRight"].includes(i.key)){const o=this.getAllRadios().filter((i=>!i.disabled));const e=["ArrowUp","ArrowLeft"].includes(i.key)?-1:1;let r=o.indexOf(this.host)+e;if(r<0)r=o.length-1;if(r>o.length-1)r=0;this.getAllRadios().forEach((i=>i.checked=false));o[r].setFocus();o[r].checked=true;o[r].dispatchEvent(new CustomEvent("six-radio-change",{bubbles:true,cancelable:true}));i.preventDefault()}};this.handleMouseDown=i=>{var o;i.preventDefault();(o=this.nativeInput)===null||o===void 0?void 0:o.focus()}}handleCheckedChange(){if(this.checked){this.getSiblingRadios().forEach((i=>i.checked=false))}if(this.nativeInput!=null){this.nativeInput.checked=this.checked}}handleNameChange(i){if(this.nativeInput!=null){this.nativeInput.name=i}}connectedCallback(){this.eventListeners.forward("six-radio-change","change",this.host);this.eventListeners.forward("six-radio-blur","blur",this.host);this.eventListeners.forward("six-radio-focus","focus",this.host)}disconnectedCallback(){this.eventListeners.removeAll()}async setFocus(i){var o;(o=this.nativeInput)===null||o===void 0?void 0:o.focus(i)}async removeFocus(){var i;(i=this.nativeInput)===null||i===void 0?void 0:i.blur()}getAllRadios(){const i=this.host.closest("form")||document.body;if(this.name==="")return[];return[...i.querySelectorAll("six-radio")].filter((i=>i.name===this.name))}getSiblingRadios(){return this.getAllRadios().filter((i=>i!==this.host))}render(){return e("label",{key:"cdb722e8b78cf02f527d97b3dab6f0679b333c21",part:"base",class:{radio:true,"radio--checked":this.checked,"radio--disabled":this.disabled,"radio--focused":this.hasFocus},htmlFor:this.inputId,onKeyDown:this.handleKeyDown,onMouseDown:this.handleMouseDown},e("span",{key:"9c627a113fe27c340b7f6162d9bde328220c8960",part:"control",class:"radio__control"},e("span",{key:"2ce65408f6c88cb7396c480eba0cc2dd663a3c85",part:"checked-icon",class:"radio__icon"},e("svg",{key:"f4aac67ee8b4a5fb2af26305799b6648e496941e",viewBox:"0 0 16 16"},e("g",{key:"f1bc8651eae70a2ede2dcbf5f48f8237d9f883e6",stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},e("g",{key:"7ffa14023971330ae34e041871c0db912789999a",fill:"currentColor"},e("circle",{key:"10d6f37d1227677ba8044a8bffd89f8828e54e0d",cx:"8",cy:"8",r:"5"}))))),e("input",{key:"55ae32be4a36646c17d1238e486df0a483db2650",ref:i=>this.nativeInput=i,id:this.inputId,type:"radio",name:this.name,value:this.value,checked:this.checked,disabled:this.disabled,role:"radio","aria-checked":this.checked?"true":"false","aria-labelledby":this.labelId,onClick:this.handleClick,onBlur:this.handleBlur,onFocus:this.handleFocus})),e("span",{key:"08128b78c44c561e9dc97f840bacf46059c2483b",part:"label",id:this.labelId,class:"radio__label"},e("slot",{key:"9dd8bcf11566bd74d7b8e91a71cd276947562426"})))}get host(){return r(this)}static get watchers(){return{checked:["handleCheckedChange"],name:["handleNameChange"]}}};l.style=s;export{l as six_radio};
+//# sourceMappingURL=p-811ce2a0.entry.js.map

package/dist/ui-library/p-811ce2a0.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["sixRadioCss","id","SixRadio","constructor","hostRef","this","inputId","labelId","eventListeners","EventListeners","hasFocus","name","value","disabled","checked","invalid","handleClick","nativeInput","sixChange","emit","handleBlur","sixBlur","handleFocus","sixFocus","handleKeyDown","keyboardEvent","includes","key","radios","getAllRadios","filter","radio","incr","index","indexOf","host","length","forEach","setFocus","dispatchEvent","CustomEvent","bubbles","cancelable","preventDefault","handleMouseDown","event","_a","focus","handleCheckedChange","getSiblingRadios","handleNameChange","connectedCallback","forward","disconnectedCallback","removeAll","options","removeFocus","blur","form","closest","document","body","querySelectorAll","render","h","part","class","htmlFor","onKeyDown","onMouseDown","viewBox","stroke","fill","cx","cy","r","ref","el","type","role","onClick","onBlur","onFocus"],"sources":["src/components/six-radio/six-radio.scss?tag=six-radio&encapsulation=shadow","src/components/six-radio/six-radio.tsx"],"sourcesContent":["@import 'src/global/component';\n\n:host {\n  display: inline-block;\n}\n\n.radio {\n  display: inline-flex;\n  align-items: center;\n  font-family: var(--six-font-family);\n  font-size: var(--six-input-font-size-medium);\n  font-weight: var(--six-input-font-weight);\n  color: var(--six-input-color);\n  vertical-align: middle;\n  cursor: pointer;\n}\n\n.radio__icon {\n  display: inline-flex;\n  width: var(--six-selection-control-toggle-size);\n  height: var(--six-selection-control-toggle-size);\n\n  svg {\n    width: 100%;\n    height: 100%;\n  }\n}\n\n.radio__control {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: var(--six-selection-control-toggle-size);\n  height: var(--six-selection-control-toggle-size);\n  border: solid var(--six-border-width) var(--six-input-border-color);\n  border-radius: 50%;\n  background-color: var(--six-input-background-color);\n  color: transparent;\n  transition:\n    var(--six-transition-fast) border-color,\n    var(--six-transition-fast) background-color,\n    var(--six-transition-fast) color,\n    var(--six-transition-fast) box-shadow;\n\n  input[type='radio'] {\n    position: absolute;\n    opacity: 0;\n    padding: 0;\n    margin: 0;\n    pointer-events: none;\n  }\n}\n\n// Hover\n.radio:not(.radio--checked):not(.radio--disabled) .radio__control:hover {\n  border-color: var(--six-input-border-color-hover);\n}\n\n// Checked\n.radio--checked .radio__control {\n  color: var(--six-selection-control-color);\n  border-color: var(--six-selection-control-color);\n}\n\n// Checked + hover\n.radio.radio--checked:not(.radio--disabled) .radio__control:hover {\n  color: var(--six-input-border-color-focus);\n  border-color: var(--six-input-border-color-focus);\n}\n\n// Disabled\n.radio--disabled {\n  cursor: not-allowed;\n  color: var(--six-input-color-disabled);\n\n  .radio__control {\n    border-color: var(--six-input-border-color-disabled);\n  }\n\n  &.radio--checked .radio__control {\n    color: var(--six-selection-control-color-disabled);\n  }\n}\n\n.radio__label {\n  line-height: var(--six-selection-control-toggle-size);\n  margin-left: 0.5em;\n  user-select: none;\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { EmptyPayload } from '../../utils/types';\nimport { EventListeners } from '../../utils/event-listeners';\n\nlet id = 0;\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot - The radio's label.\n *\n * @part base - The component's base wrapper.\n * @part control - The radio control.\n * @part checked-icon - The container the wraps the checked icon.\n * @part label - The radio label.\n */\n\n@Component({\n  tag: 'six-radio',\n  styleUrl: 'six-radio.scss',\n  shadow: true,\n})\nexport class SixRadio {\n  private inputId = `radio-${++id}`;\n  private labelId = `radio-label-${id}`;\n  private nativeInput?: HTMLInputElement;\n  private eventListeners = new EventListeners();\n\n  @Element() host!: HTMLSixRadioElement;\n\n  @State() hasFocus = false;\n\n  /** The radio's name attribute. */\n  @Prop() name = '';\n\n  /** The radio's value attribute. */\n  @Prop({ reflect: true }) value = 'on';\n\n  /** Set to true to disable the radio. */\n  @Prop() disabled = false;\n\n  /** Set to true to draw the radio in a checked state. */\n  @Prop({ mutable: true, reflect: true }) checked = false;\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  @Watch('checked')\n  handleCheckedChange() {\n    if (this.checked) {\n      this.getSiblingRadios().forEach((radio) => (radio.checked = false));\n    }\n    if (this.nativeInput != null) {\n      this.nativeInput.checked = this.checked;\n    }\n  }\n\n  @Watch('name')\n  handleNameChange(name: string) {\n    if (this.nativeInput != null) {\n      this.nativeInput.name = name;\n    }\n  }\n\n  /** Emitted when the control loses focus. */\n  @Event({ eventName: 'six-radio-blur' }) sixBlur!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the control's checked state changes. */\n  @Event({ eventName: 'six-radio-change' }) sixChange!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the control gains focus. */\n  @Event({ eventName: 'six-radio-focus' }) sixFocus!: EventEmitter<EmptyPayload>;\n\n  connectedCallback() {\n    this.eventListeners.forward('six-radio-change', 'change', this.host);\n    this.eventListeners.forward('six-radio-blur', 'blur', this.host);\n    this.eventListeners.forward('six-radio-focus', 'focus', this.host);\n  }\n\n  disconnectedCallback() {\n    this.eventListeners.removeAll();\n  }\n\n  /** Sets focus on the radio. */\n  @Method()\n  async setFocus(options?: FocusOptions) {\n    this.nativeInput?.focus(options);\n  }\n\n  /** Removes focus from the radio. */\n  @Method()\n  async removeFocus() {\n    this.nativeInput?.blur();\n  }\n\n  private getAllRadios() {\n    const form = this.host.closest('form') || document.body;\n\n    if (this.name === '') return [];\n\n    return [...form.querySelectorAll('six-radio')].filter(\n      (radio: HTMLSixRadioElement) => radio.name === this.name\n    ) as HTMLSixRadioElement[];\n  }\n\n  private getSiblingRadios() {\n    return this.getAllRadios().filter((radio) => radio !== this.host) as HTMLSixRadioElement[];\n  }\n\n  private handleClick = () => {\n    if (this.nativeInput != null) {\n      this.checked = this.nativeInput.checked;\n      this.sixChange.emit();\n    }\n  };\n\n  private handleBlur = () => {\n    this.hasFocus = false;\n    this.sixBlur.emit();\n  };\n\n  private handleFocus = () => {\n    this.hasFocus = true;\n    this.sixFocus.emit();\n  };\n\n  private handleKeyDown = (keyboardEvent: KeyboardEvent) => {\n    if (['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'].includes(keyboardEvent.key)) {\n      const radios = this.getAllRadios().filter((radio) => !radio.disabled);\n      const incr = ['ArrowUp', 'ArrowLeft'].includes(keyboardEvent.key) ? -1 : 1;\n      let index = radios.indexOf(this.host) + incr;\n      if (index < 0) index = radios.length - 1;\n      if (index > radios.length - 1) index = 0;\n\n      this.getAllRadios().forEach((radio) => (radio.checked = false));\n      radios[index].setFocus();\n      radios[index].checked = true;\n      radios[index].dispatchEvent(new CustomEvent('six-radio-change', { bubbles: true, cancelable: true }));\n      keyboardEvent.preventDefault();\n    }\n  };\n\n  private handleMouseDown = (event: MouseEvent) => {\n    // Prevent clicks on the label from briefly blurring the input\n    event.preventDefault();\n    this.nativeInput?.focus();\n  };\n\n  render() {\n    return (\n      <label\n        part=\"base\"\n        class={{\n          radio: true,\n          'radio--checked': this.checked,\n          'radio--disabled': this.disabled,\n          'radio--focused': this.hasFocus,\n        }}\n        htmlFor={this.inputId}\n        onKeyDown={this.handleKeyDown}\n        onMouseDown={this.handleMouseDown}\n      >\n        <span part=\"control\" class=\"radio__control\">\n          <span part=\"checked-icon\" class=\"radio__icon\">\n            <svg viewBox=\"0 0 16 16\">\n              <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                <g fill=\"currentColor\">\n                  <circle cx=\"8\" cy=\"8\" r=\"5\"></circle>\n                </g>\n              </g>\n            </svg>\n          </span>\n\n          <input\n            ref={(el) => (this.nativeInput = el)}\n            id={this.inputId}\n            type=\"radio\"\n            name={this.name}\n            value={this.value}\n            checked={this.checked}\n            disabled={this.disabled}\n            role=\"radio\"\n            aria-checked={this.checked ? 'true' : 'false'}\n            aria-labelledby={this.labelId}\n            onClick={this.handleClick}\n            onBlur={this.handleBlur}\n            onFocus={this.handleFocus}\n          />\n        </span>\n\n        <span part=\"label\" id={this.labelId} class=\"radio__label\">\n          <slot />\n        </span>\n      </label>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/ui-library/p-83d5fa7c.entry.js

@@ -0,0 +1,2 @@
+import{r as i,c as t,h as s,g as a}from"./p-JoG9I7EO.js";import{u as e,l as o}from"./p-BY6hIEFX.js";import{h as l}from"./p-j3oIB5oT.js";import{M as r}from"./p-CfIoyvm-.js";import{a as n}from"./p-SLlDVtvF.js";const d=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}:host{--width:31rem;display:contents}.dialog{display:flex;align-items:center;justify-content:center;position:fixed;top:0;right:0;bottom:0;left:0;z-index:var(--six-z-index-dialog);color:var(--six-color-web-rock-900)}.dialog:not(.dialog--visible){position:absolute;width:1px;height:1px;clip:rect(0 0 0 0);clip-path:inset(50%);overflow:hidden;pointer-events:none;visibility:hidden}.dialog__panel{display:flex;flex-direction:column;z-index:2;width:var(--width);max-width:calc(100% - var(--six-spacing-xx-large));max-height:calc(100% - var(--six-spacing-xx-large));background-color:var(--six-panel-background-color);border-radius:var(--six-border-radius-medium);box-shadow:var(--six-shadow-large);opacity:0;transform:scale(0.8);transition:var(--six-transition-medium) opacity, var(--six-transition-medium) transform}.dialog__panel:focus{outline:none}@media screen and (max-width: 420px){.dialog__panel{max-height:80vh}}.dialog--open .dialog__panel{display:flex;opacity:1;transform:none}.dialog__header{flex:0 0 auto;display:flex}.dialog__title{flex:1 1 auto;font-size:var(--six-font-size-x-large);font-weight:var(--six-font-weight-bold);line-height:var(--six-line-height-dense);padding:var(--six-spacing-large) var(--six-spacing-large) var(--six-spacing-small)}.dialog__close{flex:0 0 auto;display:flex;align-items:center;font-size:var(--six-font-size-x-large);padding:0 var(--six-spacing-x-small)}.dialog__body{flex:1 1 auto;padding:var(--six-spacing-small) var(--six-spacing-large) var(--six-spacing-large);overflow:auto;-webkit-overflow-scrolling:touch}.dialog__footer{flex:0 0 auto;text-align:right;padding:var(--six-spacing-large)}.dialog__footer ::slotted(six-button:not(:first-of-type)){margin-left:var(--six-spacing-xx-small)}.dialog:not(.dialog--has-footer) .dialog__footer{display:none}.dialog__overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:var(--six-overlay-background-color);opacity:0;transition:var(--six-transition-medium) opacity}.dialog--open .dialog__overlay{opacity:0.8}";let h=0;const c=class{constructor(s){i(this,s);this.sixShow=t(this,"six-dialog-show");this.sixAfterShow=t(this,"six-dialog-after-show");this.sixHide=t(this,"six-dialog-hide");this.sixAfterHide=t(this,"six-dialog-after-hide");this.sixInitialFocus=t(this,"six-dialog-initial-focus");this.sixRequestClose=t(this,"six-dialog-request-close");this.componentId=`dialog-${++h}`;this.willShow=false;this.willHide=false;this.hasFooter=false;this.isVisible=false;this.open=false;this.label="";this.noHeader=false;this.handleCloseClick=()=>{this.preventClose("close-button")};this.handleKeyDown=i=>{if(i.key==="Escape"){this.preventClose("keyboard")}};this.handleOverlayClick=()=>{this.preventClose("overlay")};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()}}}handleOpenChange(){this.open?this.show():this.hide()}connectedCallback(){this.modal=new r(this.host,{onFocusOut:()=>{var i;return(i=this.panel)===null||i===void 0?void 0:i.focus()}})}componentWillLoad(){this.handleSlotChange()}componentDidLoad(){if(this.open){this.show()}}disconnectedCallback(){e(this.host)}async show(){if(this.willShow||this.modal==null||this.panel==null||this.dialog==null){return}const i=this.panel;const t=this.sixShow.emit();if(t.defaultPrevented){this.open=false;return}this.willShow=true;this.isVisible=true;this.open=true;this.modal.activate();o(this.host);if(this.open){requestAnimationFrame((()=>{const t=this.sixInitialFocus.emit();if(!t.defaultPrevented){i.focus({preventScroll:true})}}))}}async hide(){if(this.willHide||this.modal==null){return}const i=this.sixHide.emit();if(i.defaultPrevented){this.open=true;return}this.willHide=true;this.open=false;this.modal.deactivate();e(this.host)}preventClose(i){const t=this.sixRequestClose.emit({source:i});if(t.defaultPrevented&&this.panel){n(this.panel,[{scale:1},{scale:1.01},{scale:1}],{duration:250});return}this.hide()}render(){return s("div",{key:"b97915d5076bb83782212b61b1f65f694fd84b63",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",{key:"153379e70061e86842f65f3588329dc9c6d592db",part:"overlay",class:"dialog__overlay",onClick:this.handleOverlayClick}),s("div",{key:"d0b78c413a70eeb6e6cbf75be7829a7d1f2ad715",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",{key:"94e7d993356ea718e1ed87d4fe9e1d3faf0574f8",part:"header",class:"dialog__header"},s("span",{key:"600591c9266dda80c457f41c54c92a8134d89bb8",part:"title",class:"dialog__title",id:`${this.componentId}-title`},s("slot",{key:"4ad2904648821134ce3851682768b01086a68359",name:"label"},this.label||String.fromCharCode(65279))),s("six-icon-button",{key:"4d793b14b41f7d9c43d5f9949cba6bfe7c6a442c",exportparts:"base:close-button",class:"dialog__close",name:"close",onClick:this.handleCloseClick})),s("div",{key:"729f6cc36802fccf46958b2c259213aa9369fb94",part:"body",class:"dialog__body"},s("slot",{key:"ba299ae12ba958c705a807639aee911167997b38"})),s("footer",{key:"92cb57fa4c4dc066a49dd259832e43be619cc945",part:"footer",class:"dialog__footer"},s("slot",{key:"63ea68abef52d91c04608ad1bf6d508a31012ed9",name:"footer",onSlotchange:this.handleSlotChange}))))}get host(){return a(this)}static get watchers(){return{open:["handleOpenChange"]}}};c.style=d;export{c as six_dialog};
+//# sourceMappingURL=p-83d5fa7c.entry.js.map

package/dist/ui-library/p-83d5fa7c.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["sixDialogCss","id","SixDialog","constructor","hostRef","this","componentId","willShow","willHide","hasFooter","isVisible","open","label","noHeader","handleCloseClick","preventClose","handleKeyDown","event","key","handleOverlayClick","handleSlotChange","hasSlot","host","handleTransitionEnd","target","propertyName","classList","contains","sixAfterShow","emit","sixAfterHide","handleOpenChange","show","hide","connectedCallback","modal","Modal","onFocusOut","_a","panel","focus","componentWillLoad","componentDidLoad","disconnectedCallback","unlockBodyScrolling","dialog","sixShow","defaultPrevented","activate","lockBodyScrolling","requestAnimationFrame","sixInitialFocus","preventScroll","sixHide","deactivate","source","sixRequestClose","animateTo","scale","duration","render","h","ref","el","part","class","onKeyDown","onTransitionEnd","onClick","role","tabIndex","name","String","fromCharCode","exportparts","onSlotchange"],"sources":["src/components/six-dialog/six-dialog.scss?tag=six-dialog&encapsulation=shadow","src/components/six-dialog/six-dialog.tsx"],"sourcesContent":["@import 'src/global/component';\n@import 'src/global/mixins/hidden';\n\n/**\n * @prop --width: The preferred width of the dialog. Note that the dialog will shrink to accommodate smaller screens.\n */\n:host {\n  --width: 31rem;\n\n  display: contents;\n}\n\n.dialog {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  position: fixed;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: var(--six-z-index-dialog);\n  color: var(--six-color-web-rock-900);\n\n  &:not(.dialog--visible) {\n    @include hidden;\n  }\n}\n\n.dialog__panel {\n  display: flex;\n  flex-direction: column;\n  z-index: 2;\n  width: var(--width);\n  max-width: calc(100% - var(--six-spacing-xx-large));\n  max-height: calc(100% - var(--six-spacing-xx-large));\n  background-color: var(--six-panel-background-color);\n  border-radius: var(--six-border-radius-medium);\n  box-shadow: var(--six-shadow-large);\n  opacity: 0;\n  transform: scale(0.8);\n  transition:\n    var(--six-transition-medium) opacity,\n    var(--six-transition-medium) transform;\n\n  &:focus {\n    outline: none;\n  }\n}\n\n// Ensure there's enough vertical padding for phones that don't update vh when chrome appears (e.g. iPhone)\n@media screen and (max-width: 420px) {\n  .dialog__panel {\n    max-height: 80vh;\n  }\n}\n\n.dialog--open .dialog__panel {\n  display: flex;\n  opacity: 1;\n  transform: none;\n}\n\n.dialog__header {\n  flex: 0 0 auto;\n  display: flex;\n}\n\n.dialog__title {\n  flex: 1 1 auto;\n  font-size: var(--six-font-size-x-large);\n  font-weight: var(--six-font-weight-bold);\n  line-height: var(--six-line-height-dense);\n  padding: var(--six-spacing-large) var(--six-spacing-large) var(--six-spacing-small);\n}\n\n.dialog__close {\n  flex: 0 0 auto;\n  display: flex;\n  align-items: center;\n  font-size: var(--six-font-size-x-large);\n  padding: 0 var(--six-spacing-x-small);\n}\n\n.dialog__body {\n  flex: 1 1 auto;\n  padding: var(--six-spacing-small) var(--six-spacing-large) var(--six-spacing-large);\n  overflow: auto;\n  -webkit-overflow-scrolling: touch;\n}\n\n.dialog__footer {\n  flex: 0 0 auto;\n  text-align: right;\n  padding: var(--six-spacing-large);\n\n  ::slotted(six-button:not(:first-of-type)) {\n    margin-left: var(--six-spacing-xx-small);\n  }\n}\n\n.dialog:not(.dialog--has-footer) .dialog__footer {\n  display: none;\n}\n\n.dialog__overlay {\n  position: fixed;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  background-color: var(--six-overlay-background-color);\n  opacity: 0;\n  transition: var(--six-transition-medium) opacity;\n}\n\n.dialog--open .dialog__overlay {\n  opacity: 0.8;\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { lockBodyScrolling, unlockBodyScrolling } from '../../utils/scroll';\nimport { hasSlot } from '../../utils/slot';\nimport Modal from '../../utils/modal';\nimport { EmptyPayload } from '../../utils/types';\nimport { animateTo } from '../../utils/animation';\n\nexport interface SixDialogRequestClose {\n  source: 'close-button' | 'keyboard' | 'overlay';\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 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  /**\n   * Emitted when the user attempts to close the drawer by clicking the close button, clicking the overlay, or\n   * pressing escape. Calling `event.preventDefault()` will keep the drawer open. Avoid using this unless closing\n   * the drawer will result in destructive behavior such as data loss.\n   */\n  @Event({ eventName: 'six-dialog-request-close' }) sixRequestClose!: EventEmitter<SixDialogRequestClose>;\n\n  connectedCallback() {\n    this.modal = new Modal(this.host, {\n      onFocusOut: () => this.panel?.focus(),\n    });\n  }\n\n  componentWillLoad() {\n    this.handleSlotChange();\n  }\n\n  componentDidLoad() {\n    // Show on init if open\n    if (this.open) {\n      this.show();\n    }\n  }\n\n  disconnectedCallback() {\n    unlockBodyScrolling(this.host);\n  }\n\n  /** Shows the dialog */\n  @Method()\n  async show() {\n    if (this.willShow || this.modal == null || this.panel == null || this.dialog == null) {\n      return;\n    }\n    const panel = this.panel;\n\n    const sixShow = this.sixShow.emit();\n    if (sixShow.defaultPrevented) {\n      this.open = false;\n      return;\n    }\n\n    this.willShow = true;\n    this.isVisible = true;\n    this.open = true;\n    this.modal.activate();\n\n    lockBodyScrolling(this.host);\n\n    if (this.open) {\n      requestAnimationFrame(() => {\n        const sixInitialFocus = this.sixInitialFocus.emit();\n        if (!sixInitialFocus.defaultPrevented) {\n          panel.focus({ preventScroll: true });\n        }\n      });\n    }\n  }\n\n  /** Hides the dialog */\n  @Method()\n  async hide() {\n    if (this.willHide || this.modal == null) {\n      return;\n    }\n\n    const sixHide = this.sixHide.emit();\n    if (sixHide.defaultPrevented) {\n      this.open = true;\n      return;\n    }\n\n    this.willHide = true;\n    this.open = false;\n    this.modal.deactivate();\n\n    unlockBodyScrolling(this.host);\n  }\n\n  private handleCloseClick = () => {\n    this.preventClose('close-button');\n  };\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    if (event.key === 'Escape') {\n      this.preventClose('keyboard');\n    }\n  };\n\n  private handleOverlayClick = () => {\n    this.preventClose('overlay');\n  };\n\n  private preventClose(source: 'close-button' | 'keyboard' | 'overlay') {\n    const sixRequestClose = this.sixRequestClose.emit({ source });\n\n    if (sixRequestClose.defaultPrevented && this.panel) {\n      animateTo(this.panel, [{ scale: 1 }, { scale: 1.01 }, { scale: 1 }], { duration: 250 });\n      return;\n    }\n\n    this.hide();\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":"gNAAA,MAAMA,EAAe,8rECWrB,IAAIC,EAAK,E,MA2BIC,EAAS,MALtB,WAAAC,CAAAC,G,4SAMUC,KAAAC,YAAc,YAAYL,IAI1BI,KAAQE,SAAG,MACXF,KAAQG,SAAG,MAIVH,KAASI,UAAG,MACZJ,KAASK,UAAG,MAGmBL,KAAIM,KAAG,MAMvCN,KAAKO,MAAG,GAMRP,KAAQQ,SAAG,MAwGXR,KAAgBS,iBAAG,KACzBT,KAAKU,aAAa,eAAe,EAG3BV,KAAAW,cAAiBC,IACvB,GAAIA,EAAMC,MAAQ,SAAU,CAC1Bb,KAAKU,aAAa,W,GAIdV,KAAkBc,mBAAG,KAC3Bd,KAAKU,aAAa,UAAU,EActBV,KAAgBe,iBAAG,KACzBf,KAAKI,UAAYY,EAAQhB,KAAKiB,KAAM,SAAS,EAGvCjB,KAAAkB,oBAAuBN,IAC7B,MAAMO,EAASP,EAAMO,OAGrB,GAAIP,EAAMQ,eAAiB,WAAaD,EAAOE,UAAUC,SAAS,iBAAkB,CAClFtB,KAAKK,UAAYL,KAAKM,KACtBN,KAAKE,SAAW,MAChBF,KAAKG,SAAW,MAChBH,KAAKM,KAAON,KAAKuB,aAAaC,OAASxB,KAAKyB,aAAaD,M,EA2D9D,CArMC,gBAAAE,GACE1B,KAAKM,KAAON,KAAK2B,OAAS3B,KAAK4B,M,CA4BjC,iBAAAC,GACE7B,KAAK8B,MAAQ,IAAIC,EAAM/B,KAAKiB,KAAM,CAChCe,WAAY,KAAK,IAAAC,EAAC,OAAAA,EAAAjC,KAAKkC,SAAK,MAAAD,SAAA,SAAAA,EAAEE,OAAO,G,CAIzC,iBAAAC,GACEpC,KAAKe,kB,CAGP,gBAAAsB,GAEE,GAAIrC,KAAKM,KAAM,CACbN,KAAK2B,M,EAIT,oBAAAW,GACEC,EAAoBvC,KAAKiB,K,CAK3B,UAAMU,GACJ,GAAI3B,KAAKE,UAAYF,KAAK8B,OAAS,MAAQ9B,KAAKkC,OAAS,MAAQlC,KAAKwC,QAAU,KAAM,CACpF,M,CAEF,MAAMN,EAAQlC,KAAKkC,MAEnB,MAAMO,EAAUzC,KAAKyC,QAAQjB,OAC7B,GAAIiB,EAAQC,iBAAkB,CAC5B1C,KAAKM,KAAO,MACZ,M,CAGFN,KAAKE,SAAW,KAChBF,KAAKK,UAAY,KACjBL,KAAKM,KAAO,KACZN,KAAK8B,MAAMa,WAEXC,EAAkB5C,KAAKiB,MAEvB,GAAIjB,KAAKM,KAAM,CACbuC,uBAAsB,KACpB,MAAMC,EAAkB9C,KAAK8C,gBAAgBtB,OAC7C,IAAKsB,EAAgBJ,iBAAkB,CACrCR,EAAMC,MAAM,CAAEY,cAAe,M,MAQrC,UAAMnB,GACJ,GAAI5B,KAAKG,UAAYH,KAAK8B,OAAS,KAAM,CACvC,M,CAGF,MAAMkB,EAAUhD,KAAKgD,QAAQxB,OAC7B,GAAIwB,EAAQN,iBAAkB,CAC5B1C,KAAKM,KAAO,KACZ,M,CAGFN,KAAKG,SAAW,KAChBH,KAAKM,KAAO,MACZN,KAAK8B,MAAMmB,aAEXV,EAAoBvC,KAAKiB,K,CAiBnB,YAAAP,CAAawC,GACnB,MAAMC,EAAkBnD,KAAKmD,gBAAgB3B,KAAK,CAAE0B,WAEpD,GAAIC,EAAgBT,kBAAoB1C,KAAKkC,MAAO,CAClDkB,EAAUpD,KAAKkC,MAAO,CAAC,CAAEmB,MAAO,GAAK,CAAEA,MAAO,MAAQ,CAAEA,MAAO,IAAM,CAAEC,SAAU,MACjF,M,CAGFtD,KAAK4B,M,CAmBP,MAAA2B,GACE,OACEC,EAAA,OAAA3C,IAAA,2CACE4C,IAAMC,GAAQ1D,KAAKwC,OAASkB,EAC5BC,KAAK,OACLC,MAAO,CACLpB,OAAQ,KACR,eAAgBxC,KAAKM,KACrB,kBAAmBN,KAAKK,UACxB,qBAAsBL,KAAKI,WAE7ByD,UAAW7D,KAAKW,cAChBmD,gBAAiB9D,KAAKkB,qBAEtBsC,EAAA,OAAA3C,IAAA,2CAAK8C,KAAK,UAAUC,MAAM,kBAAkBG,QAAS/D,KAAKc,qBAE1D0C,EAAA,OAAA3C,IAAA,2CACE4C,IAAMC,GAAQ1D,KAAKkC,MAAQwB,EAC3BC,KAAK,QACLC,MAAM,gBACNI,KAAK,SAAQ,aACF,OAAM,cACJhE,KAAKM,KAAO,QAAU,OAAM,aAC7BN,KAAKQ,SAAWR,KAAKO,MAAQ,KACxB,mBAACP,KAAKQ,SAAW,GAAGR,KAAKC,oBAAsB,KAChEgE,SAAU,IAERjE,KAAKQ,UACLgD,EAAA,UAAA3C,IAAA,2CAAQ8C,KAAK,SAASC,MAAM,kBAC1BJ,EAAA,QAAA3C,IAAA,2CAAM8C,KAAK,QAAQC,MAAM,gBAAgBhE,GAAI,GAAGI,KAAKC,qBACnDuD,EAAA,QAAA3C,IAAA,2CAAMqD,KAAK,SAERlE,KAAKO,OAAS4D,OAAOC,aAAa,SAGvCZ,EAAA,mBAAA3C,IAAA,2CACEwD,YAAY,oBACZT,MAAM,gBACNM,KAAK,QACLH,QAAS/D,KAAKS,oBAKpB+C,EAAA,OAAA3C,IAAA,2CAAK8C,KAAK,OAAOC,MAAM,gBACrBJ,EAAA,QAAA3C,IAAA,8CAGF2C,EAAA,UAAA3C,IAAA,2CAAQ8C,KAAK,SAASC,MAAM,kBAC1BJ,EAAA,QAAA3C,IAAA,2CAAMqD,KAAK,SAASI,aAActE,KAAKe,qB","ignoreList":[]}

package/dist/ui-library/p-850aff56.entry.js

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

package/dist/ui-library/p-850aff56.entry.js.map

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

package/dist/ui-library/p-8884a48b.entry.js

@@ -0,0 +1,2 @@
+import{r,h as i}from"./p-JoG9I7EO.js";const o=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}:host{display:block}.menu-divider{border-top:solid var(--six-border-width) var(--six-menu-divider-color);margin-top:var(--six-spacing-xx-small);margin-bottom:var(--six-spacing-xx-small)}";const e=class{constructor(i){r(this,i)}render(){return i("div",{key:"186bd0295f652e28206b3e01a092c0cc67128874",part:"base",class:"menu-divider",role:"separator","aria-hidden":"true"})}};e.style=o;export{e as six_menu_divider};
+//# sourceMappingURL=p-8884a48b.entry.js.map

package/dist/ui-library/p-8884a48b.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["sixMenuDividerCss","SixMenuDivider","render","h","key","part","class","role"],"sources":["src/components/six-menu-divider/six-menu-divider.scss?tag=six-menu-divider&encapsulation=shadow","src/components/six-menu-divider/six-menu-divider.tsx"],"sourcesContent":["@import 'src/global/component';\n\n:host {\n  display: block;\n}\n\n.menu-divider {\n  border-top: solid var(--six-border-width) var(--six-menu-divider-color);\n  margin-top: var(--six-spacing-xx-small);\n  margin-bottom: var(--six-spacing-xx-small);\n}\n","import { Component, h } from '@stencil/core';\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @part base - The component's base wrapper.\n */\n\n@Component({\n  tag: 'six-menu-divider',\n  styleUrl: 'six-menu-divider.scss',\n  shadow: true,\n})\nexport class SixMenuDivider {\n  render() {\n    return <div part=\"base\" class=\"menu-divider\" role=\"separator\" aria-hidden=\"true\" />;\n  }\n}\n"],"mappings":"sCAAA,MAAMA,EAAoB,ia,MCgBbC,EAAc,M,yBACzB,MAAAC,GACE,OAAOC,EAAK,OAAAC,IAAA,2CAAAC,KAAK,OAAOC,MAAM,eAAeC,KAAK,YAAwB,sB","ignoreList":[]}

package/dist/ui-library/p-91c195d3.entry.js

@@ -0,0 +1,2 @@
+import{r as i,c as s,h as e}from"./p-JoG9I7EO.js";const t=".six-files-list-item{padding-bottom:0.5rem}.six-files-list-item__name{color:var(--six-color-action-600);cursor:pointer}.six-files-list-item__name--disabled{cursor:inherit;color:var(--six-color-web-rock-500)}.six-files-list-item__name:hover:not(.six-files-list-item__name--disabled){color:var(--six-color-action-500)}.six-files-list-item__date{padding-left:1rem;color:var(--six-color-web-rock-600)}.six-files-list-item__size{padding-left:1rem;color:var(--six-color-web-rock-600)}.six-files-list-item__icon{padding-left:0.5rem;display:inline-block;transform:translateY(-3px);cursor:pointer;color:var(--six-color-web-rock-600)}.six-files-list-item__icon--disabled{cursor:not-allowed;color:var(--six-color-web-rock-500)}.six-files-list-item__icon:hover:not(.six-files-list-item__icon--disabled){color:var(--six-color-web-rock-900)}";const l=class{constructor(e){i(this,e);this.downloadEvent=s(this,"six-file-list-item-download");this.removeEvent=s(this,"six-file-list-item-remove");this.identifier="";this.name="";this.date="";this.nodownload=false;this.nodelete=false;this.downloadFile=()=>{if(this.nodownload){return}this.downloadEvent.emit({fileId:this.identifier,name:this.name})};this.removeFile=()=>{if(this.nodelete){return}this.removeEvent.emit({fileId:this.identifier,name:this.name})}}render(){return e("div",{key:"31722bec6e2a0956f4d1b14c7ee26330cae7e8cc",class:"six-files-list-item"},e("span",{key:"dfa90db55fd78720884ac4f67e5579b0eb184d40",class:{"six-files-list-item__name":true,"six-files-list-item__name--disabled":this.nodownload},onClick:this.downloadFile},this.name),e("span",{key:"401f4ef61bd59467c074dcdd1b1393724b56b30f",class:"six-files-list-item__date"},this.date),this.size!=null&&e("span",{key:"c9a2df206e02dfe5187f072c59e2c9d4cb59bf19",class:"six-files-list-item__size"},Math.round(this.size/1024)," KB"),e("six-icon",{key:"85857613cb52b6cc117e983573dfa27cd6e78c15",class:{"six-files-list-item__icon":true,"six-files-list-item__icon--disabled":this.nodelete},size:"small",onClick:this.removeFile},"delete"))}};l.style=t;export{l as six_file_list_item};
+//# sourceMappingURL=p-91c195d3.entry.js.map

package/dist/ui-library/{p-70fac778.entry.js.map → p-91c195d3.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["sixFileListItemCss","SixFileListItemStyle0","SixFileListItem","this","downloadFile","nodownload","downloadEvent","emit","fileId","identifier","name","removeFile","nodelete","removeEvent","render","h","key","class","onClick","date","size","Math","round"],"sources":["src/components/six-file-list-item/six-file-list-item.scss?tag=six-file-list-item&encapsulation=shadow","src/components/six-file-list-item/six-file-list-item.tsx"],"sourcesContent":[".six-files-list-item {\n  padding-bottom: 0.5rem;\n\n  &__name {\n    color: var(--six-color-action-600);\n    cursor: pointer;\n\n    &--disabled {\n      cursor: inherit;\n      color: var(--six-color-web-rock-500);\n    }\n\n    &:hover:not(&--disabled) {\n      color: var(--six-color-action-500);\n    }\n  }\n\n  &__date {\n    padding-left: 1rem;\n    color: var(--six-color-web-rock-600);\n  }\n\n  &__size {\n    padding-left: 1rem;\n    color: var(--six-color-web-rock-600);\n  }\n\n  &__icon {\n    padding-left: 0.5rem;\n    display: inline-block;\n    transform: translateY(-3px);\n    cursor: pointer;\n    color: var(--six-color-web-rock-600);\n\n    &--disabled {\n      cursor: not-allowed;\n      color: var(--six-color-web-rock-500);\n    }\n\n    &:hover:not(&--disabled) {\n      color: var(--six-color-web-rock-900);\n    }\n  }\n}\n","import { Component, Event, EventEmitter, h, Prop } from '@stencil/core';\n\nexport interface SixFileListDownloadPayload {\n  fileId: string;\n  name: string;\n}\n\nexport interface SixFileListRemovePayload {\n  fileId: string;\n  name: string;\n}\n\n/**\n * @since 2.0.0\n * @status experimental\n *\n */\n@Component({\n  tag: 'six-file-list-item',\n  styleUrl: 'six-file-list-item.scss',\n  shadow: true,\n})\nexport class SixFileListItem {\n  /** An id to clearly identify the file */\n  @Prop({ reflect: true }) identifier = '';\n\n  /** The filename */\n  @Prop({ reflect: true }) name = '';\n\n  /** The date when the file was uploaded */\n  @Prop({ reflect: true }) date = '';\n\n  /** The file size. This number will be divided by 1024 to show the filesize in KB */\n  @Prop({ reflect: true }) size?: number;\n\n  /** Set to true if you don't want to allow to download this file */\n  @Prop({ reflect: true }) nodownload = false;\n\n  /** Set to true if you don't want to allow to delete this file */\n  @Prop({ reflect: true }) nodelete = false;\n\n  /** Triggered on file download. */\n  @Event({ eventName: 'six-file-list-item-download' }) downloadEvent!: EventEmitter<SixFileListDownloadPayload>;\n\n  /** Triggered on file remove. */\n  @Event({ eventName: 'six-file-list-item-remove' }) removeEvent!: EventEmitter<SixFileListRemovePayload>;\n\n  private downloadFile = () => {\n    if (this.nodownload) {\n      return;\n    }\n\n    this.downloadEvent.emit({ fileId: this.identifier, name: this.name });\n  };\n\n  private removeFile = () => {\n    if (this.nodelete) {\n      return;\n    }\n\n    this.removeEvent.emit({ fileId: this.identifier, name: this.name });\n  };\n\n  render() {\n    return (\n      <div class=\"six-files-list-item\">\n        <span\n          class={{\n            'six-files-list-item__name': true,\n            'six-files-list-item__name--disabled': this.nodownload,\n          }}\n          onClick={this.downloadFile}\n        >\n          {this.name}\n        </span>\n        <span class=\"six-files-list-item__date\">{this.date}</span>\n        {this.size != null && <span class=\"six-files-list-item__size\">{Math.round(this.size / 1024)} KB</span>}\n        <six-icon\n          class={{\n            'six-files-list-item__icon': true,\n            'six-files-list-item__icon--disabled': this.nodelete,\n          }}\n          size=\"small\"\n          onClick={this.removeFile}\n        >\n          delete\n        </six-icon>\n      </div>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAqB,8zBAC3B,MAAAC,EAAeD,E,MCqBFE,EAAe,M,2IAyBlBC,KAAAC,aAAe,KACrB,GAAID,KAAKE,WAAY,CACnB,M,CAGFF,KAAKG,cAAcC,KAAK,CAAEC,OAAQL,KAAKM,WAAYC,KAAMP,KAAKO,MAAO,EAG/DP,KAAAQ,WAAa,KACnB,GAAIR,KAAKS,SAAU,CACjB,M,CAGFT,KAAKU,YAAYN,KAAK,CAAEC,OAAQL,KAAKM,WAAYC,KAAMP,KAAKO,MAAO,E,gBApC/B,G,UAGN,G,UAGA,G,oCAMM,M,cAGF,K,CAwBpC,MAAAI,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MAAM,uBACTF,EAAA,QAAAC,IAAA,2CACEC,MAAO,CACL,4BAA6B,KAC7B,sCAAuCd,KAAKE,YAE9Ca,QAASf,KAAKC,cAEbD,KAAKO,MAERK,EAAA,QAAAC,IAAA,2CAAMC,MAAM,6BAA6Bd,KAAKgB,MAC7ChB,KAAKiB,MAAQ,MAAQL,EAAA,QAAAC,IAAA,2CAAMC,MAAM,6BAA6BI,KAAKC,MAAMnB,KAAKiB,KAAO,MAAK,OAC3FL,EAAA,YAAAC,IAAA,2CACEC,MAAO,CACL,4BAA6B,KAC7B,sCAAuCd,KAAKS,UAE9CQ,KAAK,QACLF,QAASf,KAAKQ,YAAU,U","ignoreList":[]}
+{"version":3,"names":["sixFileListItemCss","SixFileListItem","constructor","hostRef","this","identifier","name","date","nodownload","nodelete","downloadFile","downloadEvent","emit","fileId","removeFile","removeEvent","render","h","key","class","onClick","size","Math","round"],"sources":["src/components/six-file-list-item/six-file-list-item.scss?tag=six-file-list-item&encapsulation=shadow","src/components/six-file-list-item/six-file-list-item.tsx"],"sourcesContent":[".six-files-list-item {\n  padding-bottom: 0.5rem;\n\n  &__name {\n    color: var(--six-color-action-600);\n    cursor: pointer;\n\n    &--disabled {\n      cursor: inherit;\n      color: var(--six-color-web-rock-500);\n    }\n\n    &:hover:not(&--disabled) {\n      color: var(--six-color-action-500);\n    }\n  }\n\n  &__date {\n    padding-left: 1rem;\n    color: var(--six-color-web-rock-600);\n  }\n\n  &__size {\n    padding-left: 1rem;\n    color: var(--six-color-web-rock-600);\n  }\n\n  &__icon {\n    padding-left: 0.5rem;\n    display: inline-block;\n    transform: translateY(-3px);\n    cursor: pointer;\n    color: var(--six-color-web-rock-600);\n\n    &--disabled {\n      cursor: not-allowed;\n      color: var(--six-color-web-rock-500);\n    }\n\n    &:hover:not(&--disabled) {\n      color: var(--six-color-web-rock-900);\n    }\n  }\n}\n","import { Component, Event, EventEmitter, h, Prop } from '@stencil/core';\n\nexport interface SixFileListDownloadPayload {\n  fileId: string;\n  name: string;\n}\n\nexport interface SixFileListRemovePayload {\n  fileId: string;\n  name: string;\n}\n\n/**\n * @since 2.0.0\n * @status experimental\n *\n */\n@Component({\n  tag: 'six-file-list-item',\n  styleUrl: 'six-file-list-item.scss',\n  shadow: true,\n})\nexport class SixFileListItem {\n  /** An id to clearly identify the file */\n  @Prop({ reflect: true }) identifier = '';\n\n  /** The filename */\n  @Prop({ reflect: true }) name = '';\n\n  /** The date when the file was uploaded */\n  @Prop({ reflect: true }) date = '';\n\n  /** The file size. This number will be divided by 1024 to show the filesize in KB */\n  @Prop({ reflect: true }) size?: number;\n\n  /** Set to true if you don't want to allow to download this file */\n  @Prop({ reflect: true }) nodownload = false;\n\n  /** Set to true if you don't want to allow to delete this file */\n  @Prop({ reflect: true }) nodelete = false;\n\n  /** Triggered on file download. */\n  @Event({ eventName: 'six-file-list-item-download' }) downloadEvent!: EventEmitter<SixFileListDownloadPayload>;\n\n  /** Triggered on file remove. */\n  @Event({ eventName: 'six-file-list-item-remove' }) removeEvent!: EventEmitter<SixFileListRemovePayload>;\n\n  private downloadFile = () => {\n    if (this.nodownload) {\n      return;\n    }\n\n    this.downloadEvent.emit({ fileId: this.identifier, name: this.name });\n  };\n\n  private removeFile = () => {\n    if (this.nodelete) {\n      return;\n    }\n\n    this.removeEvent.emit({ fileId: this.identifier, name: this.name });\n  };\n\n  render() {\n    return (\n      <div class=\"six-files-list-item\">\n        <span\n          class={{\n            'six-files-list-item__name': true,\n            'six-files-list-item__name--disabled': this.nodownload,\n          }}\n          onClick={this.downloadFile}\n        >\n          {this.name}\n        </span>\n        <span class=\"six-files-list-item__date\">{this.date}</span>\n        {this.size != null && <span class=\"six-files-list-item__size\">{Math.round(this.size / 1024)} KB</span>}\n        <six-icon\n          class={{\n            'six-files-list-item__icon': true,\n            'six-files-list-item__icon--disabled': this.nodelete,\n          }}\n          size=\"small\"\n          onClick={this.removeFile}\n        >\n          delete\n        </six-icon>\n      </div>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAqB,8zB,MCsBdC,EAAe,MAL5B,WAAAC,CAAAC,G,wHAO2BC,KAAUC,WAAG,GAGbD,KAAIE,KAAG,GAGPF,KAAIG,KAAG,GAMPH,KAAUI,WAAG,MAGbJ,KAAQK,SAAG,MAQ5BL,KAAYM,aAAG,KACrB,GAAIN,KAAKI,WAAY,CACnB,M,CAGFJ,KAAKO,cAAcC,KAAK,CAAEC,OAAQT,KAAKC,WAAYC,KAAMF,KAAKE,MAAO,EAG/DF,KAAUU,WAAG,KACnB,GAAIV,KAAKK,SAAU,CACjB,M,CAGFL,KAAKW,YAAYH,KAAK,CAAEC,OAAQT,KAAKC,WAAYC,KAAMF,KAAKE,MAAO,CA8BtE,CA3BC,MAAAU,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MAAM,uBACTF,EAAA,QAAAC,IAAA,2CACEC,MAAO,CACL,4BAA6B,KAC7B,sCAAuCf,KAAKI,YAE9CY,QAAShB,KAAKM,cAEbN,KAAKE,MAERW,EAAA,QAAAC,IAAA,2CAAMC,MAAM,6BAA6Bf,KAAKG,MAC7CH,KAAKiB,MAAQ,MAAQJ,EAAM,QAAAC,IAAA,2CAAAC,MAAM,6BAA6BG,KAAKC,MAAMnB,KAAKiB,KAAO,MAAgB,OACtGJ,EAAA,YAAAC,IAAA,2CACEC,MAAO,CACL,4BAA6B,KAC7B,sCAAuCf,KAAKK,UAE9CY,KAAK,QACLD,QAAShB,KAAKU,YAAU,U","ignoreList":[]}

package/dist/ui-library/p-9ec79195.entry.js

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

package/dist/ui-library/p-9ec79195.entry.js.map

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

package/dist/ui-library/{p-842b492e.js → p-B1bClJZ6.js}

@@ -1,2 +1,2 @@
 function n(n){const o=n.closest("form");if(o!=null){const n=document.createElement("button");n.type="submit";n.style.display="none";o.appendChild(n);n.click();n.remove()}}export{n as s};
-//# sourceMappingURL=p-842b492e.js.map
+//# sourceMappingURL=p-B1bClJZ6.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"p-B1bClJZ6.js","sources":["src/utils/form.ts"],"sourcesContent":["export function submitForm(element: HTMLElement) {\n  const form = element.closest('form');\n  if (form != null) {\n    // Calling form.submit() would bypass the submit event and constraint validation.\n    // To prevent this, we inject a native submit button into the form, \"click\" it,\n    // then remove it to simulate a standard form submission.\n    const fakeButton = document.createElement('button');\n    fakeButton.type = 'submit';\n    fakeButton.style.display = 'none';\n    form.appendChild(fakeButton);\n    fakeButton.click();\n    fakeButton.remove();\n  }\n}\n"],"names":[],"mappings":"AAAM,SAAU,UAAU,CAAC,OAAoB,EAAA;IAC7C,MAAM,IAAI,GAAG,OAAO,CAAC,OAAO,CAAC,MAAM,CAAC;AACpC,IAAA,IAAI,IAAI,IAAI,IAAI,EAAE;;;;QAIhB,MAAM,UAAU,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC;AACnD,QAAA,UAAU,CAAC,IAAI,GAAG,QAAQ;AAC1B,QAAA,UAAU,CAAC,KAAK,CAAC,OAAO,GAAG,MAAM;AACjC,QAAA,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC;QAC5B,UAAU,CAAC,KAAK,EAAE;QAClB,UAAU,CAAC,MAAM,EAAE;;AAEvB;;;;"}

package/dist/ui-library/{p-8227aaed.js → p-BY6hIEFX.js}

@@ -1,2 +1,2 @@
 function o(o,t){return{top:Math.round(o.getBoundingClientRect().top-t.getBoundingClientRect().top),left:Math.round(o.getBoundingClientRect().left-t.getBoundingClientRect().left)}}const t=new Set;function n(o){t.add(o);document.body.classList.add("six-scroll-lock")}function c(o){t.delete(o);if(t.size===0){document.body.classList.remove("six-scroll-lock")}}function i(t,n,c="vertical",i="smooth"){const e=o(t,n);const s=e.top+n.scrollTop;const l=e.left+n.scrollLeft;const f=n.scrollLeft;const a=n.scrollLeft+n.offsetWidth;const r=n.scrollTop;const h=n.scrollTop+n.offsetHeight;if(c==="horizontal"||c==="both"){if(l<f){n.scrollTo({left:l,behavior:i})}else if(l+t.clientWidth>a){n.scrollTo({left:l-n.offsetWidth+t.clientWidth,behavior:i})}}if(c==="vertical"||c==="both"){if(s<r){n.scrollTo({top:s,behavior:i})}else if(s+t.clientHeight>h){n.scrollTo({top:s-n.offsetHeight+t.clientHeight,behavior:i})}}}export{n as l,i as s,c as u};
-//# sourceMappingURL=p-8227aaed.js.map
+//# sourceMappingURL=p-BY6hIEFX.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"p-BY6hIEFX.js","sources":["src/utils/offset.ts","src/utils/scroll.ts"],"sourcesContent":["//\n// Returns an element's offset relative to its parent. Similar to element.offsetTop and element.offsetLeft, except the\n// parent doesn't have to be positioned relative or absolute.\n//\n// NOTE: This was created to work around what appears to be a bug in Chrome where a slotted element's offsetParent\n// seems to ignore elements inside the surrounding shadow DOM: https://bugs.chromium.org/p/chromium/issues/detail?id=920069\n//\nexport function getOffset(element: HTMLElement, parent: HTMLElement) {\n  return {\n    top: Math.round(element.getBoundingClientRect().top - parent.getBoundingClientRect().top),\n    left: Math.round(element.getBoundingClientRect().left - parent.getBoundingClientRect().left),\n  };\n}\n","import { getOffset } from './offset';\n\nconst locks = new Set();\n\n//\n// Prevents body scrolling. Keeps track of which elements requested a lock so multiple levels of locking are possible\n// without premature unlocking.\n//\nexport function lockBodyScrolling(lockingEl: HTMLElement) {\n  locks.add(lockingEl);\n  document.body.classList.add('six-scroll-lock');\n}\n\n//\n// Unlocks body scrolling. Scrolling will only be unlocked once all elements that requested a lock call this method.\n//\nexport function unlockBodyScrolling(lockingEl: HTMLElement) {\n  locks.delete(lockingEl);\n\n  if (locks.size === 0) {\n    document.body.classList.remove('six-scroll-lock');\n  }\n}\n\n//\n// Scrolls an element into view of its container. If the element is already in view, nothing will happen.\n//\nexport function scrollIntoView(\n  element: HTMLElement,\n  container: HTMLElement,\n  direction: 'horizontal' | 'vertical' | 'both' = 'vertical',\n  behavior: 'smooth' | 'auto' = 'smooth'\n) {\n  const offset = getOffset(element, container);\n  const offsetTop = offset.top + container.scrollTop;\n  const offsetLeft = offset.left + container.scrollLeft;\n  const minX = container.scrollLeft;\n  const maxX = container.scrollLeft + container.offsetWidth;\n  const minY = container.scrollTop;\n  const maxY = container.scrollTop + container.offsetHeight;\n\n  if (direction === 'horizontal' || direction === 'both') {\n    if (offsetLeft < minX) {\n      container.scrollTo({ left: offsetLeft, behavior });\n    } else if (offsetLeft + element.clientWidth > maxX) {\n      container.scrollTo({ left: offsetLeft - container.offsetWidth + element.clientWidth, behavior });\n    }\n  }\n\n  if (direction === 'vertical' || direction === 'both') {\n    if (offsetTop < minY) {\n      container.scrollTo({ top: offsetTop, behavior });\n    } else if (offsetTop + element.clientHeight > maxY) {\n      container.scrollTo({ top: offsetTop - container.offsetHeight + element.clientHeight, behavior });\n    }\n  }\n}\n"],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACgB,SAAA,SAAS,CAAC,OAAoB,EAAE,MAAmB,EAAA;IACjE,OAAO;AACL,QAAA,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,qBAAqB,EAAE,CAAC,GAAG,GAAG,MAAM,CAAC,qBAAqB,EAAE,CAAC,GAAG,CAAC;AACzF,QAAA,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,qBAAqB,EAAE,CAAC,IAAI,GAAG,MAAM,CAAC,qBAAqB,EAAE,CAAC,IAAI,CAAC;KAC7F;AACH;;ACVA,MAAM,KAAK,GAAG,IAAI,GAAG,EAAE;AAEvB;AACA;AACA;AACA;AACM,SAAU,iBAAiB,CAAC,SAAsB,EAAA;AACtD,IAAA,KAAK,CAAC,GAAG,CAAC,SAAS,CAAC;IACpB,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,iBAAiB,CAAC;AAChD;AAEA;AACA;AACA;AACM,SAAU,mBAAmB,CAAC,SAAsB,EAAA;AACxD,IAAA,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC;AAEvB,IAAA,IAAI,KAAK,CAAC,IAAI,KAAK,CAAC,EAAE;QACpB,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,iBAAiB,CAAC;;AAErD;AAEA;AACA;AACA;AACM,SAAU,cAAc,CAC5B,OAAoB,EACpB,SAAsB,EACtB,SAAgD,GAAA,UAAU,EAC1D,QAAA,GAA8B,QAAQ,EAAA;IAEtC,MAAM,MAAM,GAAG,SAAS,CAAC,OAAO,EAAE,SAAS,CAAC;IAC5C,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,GAAG,SAAS,CAAC,SAAS;IAClD,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,GAAG,SAAS,CAAC,UAAU;AACrD,IAAA,MAAM,IAAI,GAAG,SAAS,CAAC,UAAU;IACjC,MAAM,IAAI,GAAG,SAAS,CAAC,UAAU,GAAG,SAAS,CAAC,WAAW;AACzD,IAAA,MAAM,IAAI,GAAG,SAAS,CAAC,SAAS;IAChC,MAAM,IAAI,GAAG,SAAS,CAAC,SAAS,GAAG,SAAS,CAAC,YAAY;IAEzD,IAAI,SAAS,KAAK,YAAY,IAAI,SAAS,KAAK,MAAM,EAAE;AACtD,QAAA,IAAI,UAAU,GAAG,IAAI,EAAE;YACrB,SAAS,CAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,QAAQ,EAAE,CAAC;;aAC7C,IAAI,UAAU,GAAG,OAAO,CAAC,WAAW,GAAG,IAAI,EAAE;AAClD,YAAA,SAAS,CAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,UAAU,GAAG,SAAS,CAAC,WAAW,GAAG,OAAO,CAAC,WAAW,EAAE,QAAQ,EAAE,CAAC;;;IAIpG,IAAI,SAAS,KAAK,UAAU,IAAI,SAAS,KAAK,MAAM,EAAE;AACpD,QAAA,IAAI,SAAS,GAAG,IAAI,EAAE;YACpB,SAAS,CAAC,QAAQ,CAAC,EAAE,GAAG,EAAE,SAAS,EAAE,QAAQ,EAAE,CAAC;;aAC3C,IAAI,SAAS,GAAG,OAAO,CAAC,YAAY,GAAG,IAAI,EAAE;AAClD,YAAA,SAAS,CAAC,QAAQ,CAAC,EAAE,GAAG,EAAE,SAAS,GAAG,SAAS,CAAC,YAAY,GAAG,OAAO,CAAC,YAAY,EAAE,QAAQ,EAAE,CAAC;;;AAGtG;;;;"}

package/dist/ui-library/{p-8bfb4bfc.js → p-C4h4qpGl.js}

@@ -1,2 +1,2 @@
 class e{constructor(){this.eventListeners=[];this.add=(e,t,s,n=null)=>{this.eventListeners.push({el:e,name:t,listener:s,identifier:n});e.addEventListener(t,s)};this.remove=(e,t,s)=>{this.eventListeners=this.getFilteredEventListeners((n=>n.listener==s&&n.el===e&&n.name===t))};this.removeByIdentifier=e=>{const t=t=>t.identifier===e;const s=this.eventListeners.find(t)!==undefined;if(!s){return}this.eventListeners=this.getFilteredEventListeners(t)};this.removeAll=()=>{while(this.eventListeners.length>0){const e=this.eventListeners.pop();if(e!=null){e.el.removeEventListener(e.name,e.listener)}}}}getFilteredEventListeners(e){return this.eventListeners.filter((t=>{if(e(t)){t.el.removeEventListener(t.name,t.listener);return false}else{return true}}))}forward(e,t,s){switch(t){case"input":this.add(s,e,(()=>s.dispatchEvent(new InputEvent(t,{bubbles:true,cancelable:true}))));break;case"change":this.add(s,e,(()=>s.dispatchEvent(new InputEvent(t,{bubbles:true,cancelable:true}))));break;case"blur":this.add(s,e,(()=>s.dispatchEvent(new FocusEvent(t,{bubbles:true,cancelable:true}))));break;case"focus":this.add(s,e,(()=>s.dispatchEvent(new FocusEvent(t,{bubbles:true,cancelable:true}))));break}}}export{e as E};
-//# sourceMappingURL=p-8bfb4bfc.js.map
+//# sourceMappingURL=p-C4h4qpGl.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"p-C4h4qpGl.js","sources":["src/utils/event-listeners.ts"],"sourcesContent":["interface EventListener {\n  el: GlobalEventHandlers;\n  name: string;\n  listener: EventListenerOrEventListenerObject;\n  identifier?: string | null;\n}\n\nexport class EventListeners {\n  eventListeners: EventListener[] = [];\n\n  add = <T extends GlobalEventHandlers>(\n    el: T,\n    name: string,\n    listener: EventListenerOrEventListenerObject,\n    identifier: string | null | undefined = null\n  ) => {\n    this.eventListeners.push({ el, name, listener, identifier });\n    el.addEventListener(name, listener);\n  };\n\n  remove = <T extends GlobalEventHandlers>(el: T, name: string, listener: EventListenerOrEventListenerObject) => {\n    this.eventListeners = this.getFilteredEventListeners(\n      (eventListener: EventListener) =>\n        eventListener.listener == listener && eventListener.el === el && eventListener.name === name\n    );\n  };\n\n  removeByIdentifier = (identifier: string) => {\n    const sameItem = (el: EventListener) => el.identifier === identifier;\n    const foundListener = this.eventListeners.find(sameItem) !== undefined;\n    if (!foundListener) {\n      return;\n    }\n    this.eventListeners = this.getFilteredEventListeners(sameItem);\n  };\n\n  private getFilteredEventListeners(sameItem: (el: EventListener) => boolean) {\n    return this.eventListeners.filter((item) => {\n      if (sameItem(item)) {\n        item.el.removeEventListener(item.name, item.listener);\n        return false;\n      } else {\n        return true;\n      }\n    });\n  }\n\n  removeAll = () => {\n    while (this.eventListeners.length > 0) {\n      const eventListener: EventListener | undefined = this.eventListeners.pop();\n      if (eventListener != null) {\n        eventListener.el.removeEventListener(eventListener.name, eventListener.listener);\n      }\n    }\n  };\n\n  forward(from: string, to: 'input' | 'change' | 'blur' | 'focus', host: HTMLElement) {\n    switch (to) {\n      case 'input':\n        this.add(host, from, () => host.dispatchEvent(new InputEvent(to, { bubbles: true, cancelable: true })));\n        break;\n      case 'change':\n        this.add(host, from, () => host.dispatchEvent(new InputEvent(to, { bubbles: true, cancelable: true })));\n        break;\n      case 'blur':\n        this.add(host, from, () => host.dispatchEvent(new FocusEvent(to, { bubbles: true, cancelable: true })));\n        break;\n      case 'focus':\n        this.add(host, from, () => host.dispatchEvent(new FocusEvent(to, { bubbles: true, cancelable: true })));\n        break;\n    }\n  }\n}\n"],"names":[],"mappings":"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"}

package/dist/ui-library/{p-a1502802.js → p-CKhg9ibv.js}

@@ -1,2 +1,2 @@
 const t=35;const s=300;const o=(t,o=s)=>{let e;return s=>{clearTimeout(e);e=setTimeout((()=>t(s)),o)}};const e=(t,s)=>{const e=t._original||t;const n=o(e.emit.bind(e),s);return{_original:t,emit:n}};export{s as D,o as a,t as b,e as d};
-//# sourceMappingURL=p-a1502802.js.map
+//# sourceMappingURL=p-CKhg9ibv.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"p-CKhg9ibv.js","sources":["src/utils/execution-control.ts"],"sourcesContent":["import { EventEmitter } from '@stencil/core';\n\nexport const DEFAULT_DEBOUNCE_INSANELY_FAST = 35;\nexport const DEFAULT_DEBOUNCE_FAST = 300;\n\n/**\n * Debounce function to implement a timeframe to wait for no new changes before executing a callback\n\n *  example usages:\n *    debounce(() => saveInput());\n *    debounce(() => saveInput(), 750);\n *    this.searchInput.addEventListener('six-input-input', debounce((event) => this.searchInputChange(event)));\n *\n *  regarding default timeout check https://lawsofux.com/doherty-threshold/\n *\n * @param callback\n * @param timeout\n */\nexport const debounce = <T>(callback: (x: T) => void, timeout = DEFAULT_DEBOUNCE_FAST) => {\n  let timer: number;\n  return (args: T) => {\n    clearTimeout(timer);\n    // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n    // @ts-ignore\n    timer = setTimeout(() => callback(args), timeout);\n  };\n};\n\n/**\n * Debounce an event\n *\n * @param event\n * @param timeout\n */\nexport const debounceEvent = (event: EventEmitter, timeout: number): EventEmitter => {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  const original = (event as any)._original || event;\n  const emit = debounce(original.emit.bind(original), timeout) as (_: unknown) => CustomEvent;\n  return {\n    _original: event,\n    emit: emit,\n  } as EventEmitter;\n};\n"],"names":[],"mappings":"AAEO,MAAM,8BAA8B,GAAG;AACvC,MAAM,qBAAqB,GAAG;AAErC;;;;;;;;;;;;AAYG;AACU,MAAA,QAAQ,GAAG,CAAI,QAAwB,EAAE,OAAO,GAAG,qBAAqB,KAAI;AACvF,IAAA,IAAI,KAAa;IACjB,OAAO,CAAC,IAAO,KAAI;QACjB,YAAY,CAAC,KAAK,CAAC;;;AAGnB,QAAA,KAAK,GAAG,UAAU,CAAC,MAAM,QAAQ,CAAC,IAAI,CAAC,EAAE,OAAO,CAAC;AACnD,KAAC;AACH;AAEA;;;;;AAKG;MACU,aAAa,GAAG,CAAC,KAAmB,EAAE,OAAe,KAAkB;;AAElF,IAAA,MAAM,QAAQ,GAAI,KAAa,CAAC,SAAS,IAAI,KAAK;AAClD,IAAA,MAAM,IAAI,GAAG,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAgC;IAC3F,OAAO;AACL,QAAA,SAAS,EAAE,KAAK;AAChB,QAAA,IAAI,EAAE,IAAI;KACK;AACnB;;;;"}

package/dist/ui-library/{p-651293e7.js → p-CfIoyvm-.js}

@@ -1,2 +1,2 @@
 let t=[];class i{constructor(t,i){this.element=t;this.options=i;this.handleFocusIn=this.handleFocusIn.bind(this)}activate(){t.push(this.element);document.addEventListener("focusin",this.handleFocusIn)}deactivate(){t=t.filter((t=>t!==this.element));document.removeEventListener("focusin",this.handleFocusIn)}isActive(){return t[t.length-1]===this.element}handleFocusIn(t){var i,s;const h=t.target;const o=this.element.tagName.toLowerCase();if(this.isActive()&&h.closest(o)!==this.element&&typeof((i=this.options)===null||i===void 0?void 0:i.onFocusOut)==="function"){(s=this.options)===null||s===void 0?void 0:s.onFocusOut(t)}}}export{i as M};
-//# sourceMappingURL=p-651293e7.js.map
+//# sourceMappingURL=p-CfIoyvm-.js.map