wabtec-internal-volt-basic-components 1.0.0

package/dist/volt-basic-components/p-74916490.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["vdsBasicDropdownCss","VdsBasicDropdown","constructor","hostRef","this","size","dynamicInformativeIcon","disabled","isReadonly","event","showClearButton","matchWidth","autoPosition","backdrop","dropdownOpened","valueLabel","undefined","options","emitValue","floatingCleanUp","updateFloatingBoxPosition","actionElementRef","dropdownContentElementRef","toggleContainerDisplay","value","scrollToSelectedValue","opened","emit","closed","setValueHandler","unselectNonSelectedItems","selectSelectedItems","defineValue","setFormValue","getSelectedLabel","internals","handleClickOut","evt","stopPropagation","isClickInside","hostEl","contains","target","close","handleFloatingKeydown","stopImmediatePropagation","key","handleClick","clickedElement","clearValue","clear","handleDropdownItemClicked","handleSelection","valueChanged","informativeIcon","detail","icon","label","open","defaultInformativeIcon","unselectAllItems","cleared","getTarget","document","querySelector","getValue","setValue","handleHover","hoveredElement","handleHoverOut","setPredefinedItem","slotElement","_a","items","assignedElements","preselectedItem","Array","from","filter","item","tagName","toLowerCase","getAttribute","setAttribute","findAndSetPredefinedItem","getPreselectedItem","length","find","hasAttribute","componentWillLoad","componentDidRender","querySelectorAll","updateContainerWidth","componentDidLoad","addEventListener","bind","_b","shadowRoot","setListenerForChildren","disconnectedCallback","window","removeEventListener","observer","disconnect","config","childList","subtree","MutationObserver","forceUpdate","observe","getIconColor","setDropdownIcon","h","svgIcon","color","getIconSize","setInformativeIcon","class","setLabelValue","combineClasses","placeholder","setClearValueButtonIcon","variant","onClick","setAriaLabel","render","Host","onClicked","tabIndex","error","ref","triggerEl","maxHeight","dropdownEl","style","setDropdownStyles","arrayIsEqual","a","b","i","vdsBasicDropdownMultiselectCss","VdsBasicDropdownMultiselect","displaySelectionLimitText","isOpened","dropdownContent","dropdownTrigger","newValue","getValidOptions","split","isArray","uniqueValues","Set","selectedOptions","join","toggleDropdown","isClickInsideParentDropdown","nodeName","handleDropdownSelection","isSelected","v","emitNativeInputEvent","clearIconClick","renderLabelValue","selectedValue","getTextValue","hasValue","displaySelectionLimit","getSelectedItemsText","renderInformativeIcon","renderClearIcon","renderDropdownIcon","title","el","shadowSubmitForm","host","form","closest","fakeSubmit","createElement","type","display","appendChild","click","remove","vdsBasicInputCss","VdsBasicInput","isRequired","allowedStyles","getInputIcon","isValidIcon","inputState","toggleFocusClass","inputContainerRef","setInputStyles","handleInput","inputEvent","InputEvent","setDirtyClass","formatter","maskValue","maskInput","data","currentTarget","changeInput","dispatchEvent","handleEnterKey","handleFocus","setTouchedClass","setFocus","Promise","resolve","inputEl","focus","console","warn","Object","assign","required","readOnly","onInput","onFocus","onBlur","cloneAttributes","name","spacingVars","vdsBasicTextareaCss","VdsBasicTextarea","minHeight","autogrow","textareaContainerRef","setTextareaStyles","inputedStyles","fieldSizing","styles","setSizesStyles","paddingOffset","height","width","textAreaEl","vdsButtonCss","VdsButton","textAlignment","danger","isFullWidth","handleSubmit","preventDefault","submitForm","vdsCardCss","VdsCard","padding","selectable","selected","button","shadowBox","emitSelected","select","handleBehaviorValidation","setCustomBorderColors","borderColor","borderHoverColor","handleSelectable","CheckboxEvent","Boolean","_value","_altKey","_ctrlKey","_metaKey","_shiftKey","super","valueOf","isChecked","altKey","ctrlKey","metaKey","shiftKey","vdsCheckboxCss","VdsBasicCheckbox","checked","indeterminate","state","componentWillRender","setCheckboxState","toString","setCheckedStates","toggleCheck","checkboxChange","check","renderCheckbox","disabledClass","renderLabel","labelValue","id","vdsDividerCss","VdsDivider","orientation","thickness","setDividerStyle","vdsDrawerCss","VdsDrawer","position","mode","isAdaptable","showShadow","showBorder","dropdownIsOpened","drawerOpened","drawerClosed","setPositionRelativeForDropdowns","disableClose","renderBackdrop","renderCloseIcon","showCloseButton","vdsDropdownGroupHeaderCss","VdsDropdownGroupHeader","generateGroupHeaderContainer","handleRefClick","linkRef","linkTarget","linkRel","link","href","rel","body","removeChild","vdsDropdownItemCss","VdsDropdownItem","isActive","linkHref","hasCheckmark","checkmarkVariant","checkmarkAlignment","updateItemState","handleSelected","dropdownItemClicked","deselected","generateCheckmarkIconButton","generateCheckbox","generateInformativeIcon","generateLabel","setAriaLabelText","tabindex","vdsFieldCss","VdsField","isDisabled","getLabel","getHelperText","helperText","helperTextColor","errorMessage","GenerateVdsSvg","svgContent","removeSize","removeColors","fill","RegExp","background","content","replace","vdsIconCss","VdsIcon","isValidUrl","isValidSvgUrl","setSvgContent","isSvgString","trim","startsWith","URL","err","isInternalIcon","icons","keys","svgs.default","some","endsWith","fetchSvgContent","url","response","fetch","ok","text","getSize","indexOf","sizes","getSvgContent","part","innerHTML","src","alt","vdsIconButtonCss","VdsIconButton","ICON_SIZE","vdsLabelCss","VdsLabel","getRequired","getIcon","vdsLinkCss","VdsLink","iconPosition","underline","vdsMenuCss","VdsMenu","menuOpened","isSubmenu","menuElementRef","closeNestedMenus","menuContent","elements","children","element","nestedMenu","handleMenuItemClicked","setMaxWidthAndHeight","maxWidth","triggerItem","child","matches","queryElementFromShadowRoot","menuEl","vdsMenuGroupHeaderCss","VdsMenuGroupHeader","vdsMenuItemCss","VdsMenuItem","hasChildren","parentMenu","isMenuTrigger","clicked","generateChildrenIconButton","vdsMenuListCss","VdsMenuList","vdsProgressCircularCss","VdsProgressCircular","status","duration","scale","customColors","setProgress","progress","radius","circumference","Math","PI","strokeDashoffset","strokeDasharray","setDurationAnimation","animation","setScale","max","setCustomColors","colors","JSON","parse","backgroundTrack","backgroundProgress","activateCustomColors","viewBox","cx","cy","r","vdsSidenavItemCss","VdsSidenavItem","expanded","isStatic","link_href","link_target","link_rel","generateRightSlot","generateChildrenIcon","Element","vdsUploadItemCss","VdsUploadItem","loadingValue","loadingDuration","handleIconButtonClick","actionIconClick","renderRemoveButton"],"sources":["src/components/basic-dropdown/vds-basic-dropdown.scss?tag=vds-basic-dropdown&encapsulation=shadow","src/components/basic-dropdown/vds-basic-dropdown.tsx","src/utils/array-utils.ts","src/components/dropdown-multiselect/vds-basic-dropdown-multiselect.scss?tag=vds-basic-dropdown-multiselect&encapsulation=shadow","src/components/dropdown-multiselect/vds-basic-dropdown-multiselect.tsx","src/utils/form.ts","src/components/input/vds-basic-input.scss?tag=vds-basic-input&encapsulation=shadow","src/components/input/vds-basic-input.tsx","src/constants/spacing-vars.ts","src/components/textarea/vds-basic-textarea.scss?tag=vds-basic-textarea&encapsulation=shadow","src/components/textarea/vds-basic-textarea.tsx","src/components/button/vds-button.scss?tag=vds-button&encapsulation=shadow","src/components/button/vds-button.tsx","src/components/card/vds-card.scss?tag=vds-card&encapsulation=shadow","src/components/card/vds-card.tsx","src/components/checkbox/vds-checkbox.utils.ts","src/components/checkbox/vds-checkbox.scss?tag=vds-checkbox&encapsulation=shadow","src/components/checkbox/vds-checkbox.tsx","src/components/divider/vds-divider.scss?tag=vds-divider&encapsulation=shadow","src/components/divider/vds-divider.tsx","src/components/drawer/vds-drawer.scss?tag=vds-drawer&encapsulation=shadow","src/components/drawer/vds-drawer.tsx","src/components/dropdown-group-header/vds-dropdown-group-header.scss?tag=vds-dropdown-group-header&encapsulation=shadow","src/components/dropdown-group-header/vds-dropdown-group-header.tsx","src/utils/utils.ts","src/components/dropdown-item/vds-dropdown-item.scss?tag=vds-dropdown-item&encapsulation=shadow","src/components/dropdown-item/vds-dropdown-item.tsx","src/components/field/vds-field.scss?tag=vds-field&encapsulation=shadow","src/components/field/vds-field.tsx","src/utils/icon-generation.utils.ts","src/components/icon/vds-icon.scss?tag=vds-icon&encapsulation=shadow","src/components/icon/vds-icon.tsx","src/components/icon-button/vds-icon-button.scss?tag=vds-icon-button&encapsulation=shadow","src/components/icon-button/vds-icon-button.tsx","src/components/label/vds-label.scss?tag=vds-label&encapsulation=shadow","src/components/label/vds-label.tsx","src/components/link/vds-link.scss?tag=vds-link&encapsulation=shadow","src/components/link/vds-link.tsx","src/components/menu/vds-menu.scss?tag=vds-menu&encapsulation=shadow","src/components/menu/vds-menu.tsx","src/components/menu-group-header/vds-menu-group-header.scss?tag=vds-menu-group-header&encapsulation=shadow","src/components/menu-group-header/vds-menu-group-header.tsx","src/components/menu-item/vds-menu-item.scss?tag=vds-menu-item&encapsulation=shadow","src/components/menu-item/vds-menu-item.tsx","src/components/menu-list/vds-menu-list.scss?tag=vds-menu-list&encapsulation=shadow","src/components/menu-list/vds-menu-list.tsx","src/components/progress-circular/vds-progress-circular.scss?tag=vds-progress-circular&encapsulation=shadow","src/components/progress-circular/vds-progress-circular.tsx","src/components/sidenav-item/vds-sidenav-item.scss?tag=vds-sidenav-item&encapsulation=shadow","src/components/sidenav-item/vds-sidenav-item.tsx","src/components/upload-item/vds-upload-item.scss?tag=vds-upload-item&encapsulation=shadow","src/components/upload-item/vds-upload-item.tsx"],"sourcesContent":["@import \"~@volt/volt-foundations/dist/volt-foundations/volt-foundations\";\n\n:host {\n  display: block;\n  width: 100%;  \n  .vds__dropdown--trigger{\n    box-sizing: border-box;\n    display: inline-flex;\n    width: 100%;\n    text-align: left;\n    align-items: center;\n    justify-content: space-between;\n    gap: 0.25rem;\n    align-self: stretch;\n    border-radius: var(--radius-medium);\n    border: none;\n    box-shadow: 0 0 0 0.0625rem inset var(--color-border-low);\n    background: var(--surface-medium);\n    &:active, &:hover {\n      cursor: pointer;\n      box-shadow: 0 0 0 0.0625rem inset var(--color-border-brand);\n    }\n\n    &:focus-visible {\n      outline: 0.125rem solid var(--color-border-focus-2);\n      outline-offset: 0.125rem;\n    }\n    &.vds__dropdown--trigger--size-small {\n      padding: var(--spacing-02) var(--spacing-03);\n      height: var(--spacing-07);\n    }\n    &.vds__dropdown--trigger--size-medium {\n      padding: var(--spacing-03) var(--spacing-04);\n      height: var(--spacing-10);\n    }\n    &.vds__dropdown--trigger--size-large {\n      padding: var(--spacing-04) var(--spacing-05);\n      height: var(--spacing-13);\n    }\n  }\n  .vds__dropdown--trigger-disabled{\n    cursor: none;\n    pointer-events: none;\n    color: var(--color-text-disabled);\n    box-shadow: 0 0 0 0.0625rem inset var(--color-border-disabled);\n    background: var(--surface-medium);\n    .vds__dropdown--value{\n      color: var(--color-text-disabled);\n    }\n  }\n  .vds__dropdown--trigger-error{\n    box-shadow: 0 0 0 0.0625rem inset var(--color-border-danger);\n    &:focus, &:active, &:hover {\n      box-shadow: 0 0 0 0.0625rem inset var(--color-border-danger);\n    }  \n    .vds__dropdown--value-label{\n      color: var(--color-text-danger-medium);\n    }\n  }\n  .vds__dropdown--value{\n    padding-right: var(--spacing-02);\n    font-feature-settings: 'clig' off, 'liga' off;\n    overflow: hidden;    \n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n  .vds__dropdown--value-small{\n    @include font-style(body, small);\n  }\n  .vds__dropdown--value-medium{\n    @include font-style(body, medium);\n  }\n  .vds__dropdown--value-large{\n    @include font-style(body, large);\n  }  \n  .vds__dropdown--value-label{\n    color: var(--color-text-high);\n  }  \n  .vds__dropdown--value-placeholder{\n    color: var(--color-text-medium);\n  }   \n  .vds__dropdown--container {\n    display: none;\n    width: fit-content;\n    min-width: max-content;\n    max-height: fit-content !important;\n    flex-direction: column;\n    align-items: flex-start;\n    align-self: stretch;\n    border-radius: var(--radius-medium);\n    background: var(--surface-medium);\n    z-index: var(--elevation-layer-5);\n    box-shadow: var(--elevation-shadow-2);\n    box-sizing: border-box;\n    border: 0.0625rem solid var(--color-border-lowest);\n    &.no-shadow {\n      box-shadow: none;\n      border: none;\n    }\n    &.has-scroll {\n      padding-right: var(--spacing-01);\n    }\n    &.match-width {\n      width: var(--trigger-width);\n      min-width: var(--trigger-width);\n    }\n  }\n  .vds-dropdown__content {\n    overflow-y: auto;\n    display: flex;\n    flex-direction: column;\n    border-radius: var(--radius-medium);\n    &.scrollable {\n      padding-right: var(--spacing-01);\n    }\n    &::-webkit-scrollbar {\n      background-color: var(--surface-medium);\n      width: 0.375rem;\n    }\n    &::-webkit-scrollbar-thumb {\n      background-color: var(--color-background-neutral-press);\n      border-radius: 1rem;\n    }\n  }\n  .vds__dropdown--left-content{\n    display: inline-flex;\n    column-gap: var(--spacing-02);\n    align-items: center;\n    overflow: hidden;\n    .vds-dropdown__informative-icon {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n    }\n  }\n  .vds__dropdown--trigger--size-large .vds__dropdown--left-content {\n    column-gap: var(--spacing-03);\n  }\n  .vds__dropdown--right-actions{\n    display: inline-flex;\n    align-items: center;\n  }\n  .vds-basic-dropdown__container {\n    display: block;\n  }\n  .vds-floating-backdrop {\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    background: var(--color-interaction-black-lower);\n    opacity: 0.06;\n    z-index: var(--elevation-layer-4);\n  }\n}\n\n:host-context(.vds-basic-dropdown--disabled) {\n  pointer-events: none;\n}","import { Component, Host, Prop, h, Method, Listen, Element, Event, EventEmitter, State, Watch, AttachInternals, forceUpdate } from '@stencil/core';\nimport { combineClasses } from '../../utils/combine-classes';\nimport { updateFloatingBoxPosition } from '../../utils/floating-engine-utils';\nimport { DropdownItemClickedEvent } from '../dropdown-item/vds-dropdown-item-clicked-event';\nimport { getIconSize } from '../../utils/icon-attr.utils';\nimport { getSelectedLabel, scrollToSelectedValue, selectSelectedItems, setDropdownStyles, toggleContainerDisplay, unselectAllItems, unselectNonSelectedItems, updateContainerWidth } from './vds-basic-dropdown.utils';\n\n@Component({\n  tag: 'vds-basic-dropdown',\n  styleUrl: 'vds-basic-dropdown.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class VdsBasicDropdown {\n  @Element() hostEl: HTMLElement;\n  /** Sets the dropdown's size. */\n  @Prop({ mutable: true }) size: 'small' | 'medium' | 'large' = 'medium';\n  /** Sets the dropdown's value. */\n  @Prop({ mutable: true }) value: string;\n  /** Allows user to define a information icon to the left of the dropdown. */\n  @Prop({ mutable: true }) informativeIcon: string;\n  /** Allows dropdown-item informativeIcon reflect dynamically as informativeIcon of the dropdown. */\n  @Prop({ mutable: true }) dynamicInformativeIcon: boolean = false;\n  /** Sets the dropdown's placeholder. */\n  @Prop({ mutable: true }) placeholder: string;\n  /** Sets the dropdown in disabled state. */\n  @Prop({ mutable: true }) disabled: boolean = false;\n  /** Sets the dropdown in readonly state. */\n  @Prop({ mutable: true }) isReadonly: boolean = false;\n  /** Sets the dropdown in error state. */\n  @Prop({ mutable: true, reflect: true }) error: boolean;\n  /** Sets the dropdown's trigger event. */\n  @Prop({ mutable: true }) event: 'click' | 'hover' = 'click';\n  /** Sets the dropdown's clear button visibility. */\n  @Prop({ mutable: true }) showClearButton: boolean = true;\n  /** Set the max height value for the floating container of the items */\n  @Prop({ mutable: true }) maxHeight: string;\n  /** Sets the width value for the floating container of the items to match the dropdown width */\n  @Prop({ mutable: true }) matchWidth: boolean = false;\n  /** Toggles the floating container auto-positioning based on available window space. \n   * False by default as it may cause positioning issues in some situations, use with caution \n   */\n  @Prop({mutable: true}) autoPosition: boolean = false;\n  /** Toggles the overlay element, allowing interaction only with this element when active */\n  @Prop() backdrop: boolean = false;\n  \n  \n\n  /** Emits event when floating element gets opens */\n  @Event() opened: EventEmitter<void>;\n  /** Emits event when floating element gets closes */\n  @Event() closed: EventEmitter<void>;\n  /** Emits event when an item is selected, this event contains the value of the selected item */\n  @Event() valueChanged: EventEmitter<string>;\n  /** Emits an event when the clear button is clicked */\n  @Event() cleared: EventEmitter<boolean>;\n  \n  /** Dropdown's status. */\n  @State() dropdownOpened: boolean = false;\n  /** Dropdown's label of the current value. */\n  @State() private valueLabel: string = undefined;\n\n  @AttachInternals() internals: ElementInternals;\n\n  private actionElementRef: HTMLButtonElement;\n  private dropdownContentElementRef: HTMLDivElement;\n  private defaultInformativeIcon: string;\n  private options: HTMLVdsDropdownItemElement[] = [];\n\n  private floatingCleanUp: () => void;\n  observer: any;\n\n  @Watch('dropdownOpened')\n  async emitValue(): Promise<void> {\n    if (this.dropdownOpened) {\n      this.floatingCleanUp = await updateFloatingBoxPosition(this.actionElementRef, this.dropdownContentElementRef, null, 'bottom', this.autoPosition);\n      toggleContainerDisplay(this.dropdownContentElementRef, true);\n      if (this.value) {\n        scrollToSelectedValue(this.dropdownContentElementRef, this.value);\n      }\n      this.opened.emit();\n    } else {\n      toggleContainerDisplay(this.dropdownContentElementRef, false);\n      this.floatingCleanUp();\n      this.closed.emit();\n    }\n  }\n\n  @Watch('value')\n  setValueHandler(): void {\n    unselectNonSelectedItems(this.dropdownContentElementRef, this.value);\n    selectSelectedItems(this.dropdownContentElementRef, this.value);\n    this.defineValue();\n    this.setFormValue();\n    this.valueLabel = getSelectedLabel(this.dropdownContentElementRef, this.value);\n  }\n \n  private setFormValue(): void {\n    if (this.internals && !!this.internals.setFormValue) {\n      this.internals.setFormValue(this.value);\n    }\n  }\n\n  /* Close the floating element when click outside */\n  @Listen('click', { target: 'window' })\n  private handleClickOut(evt: MouseEvent): void {\n    evt.stopPropagation();\n    const isClickInside = this.hostEl.contains(evt.target as Node);\n    if (!isClickInside) {\n      this.close();\n    }\n  }\n\n  /* Close the floating element with keydown on the trigger element  */\n  private handleFloatingKeydown(event: KeyboardEvent): void {\n    event.stopImmediatePropagation();\n    if (event.key === 'Escape' || event.key === 'Esc') {\n      this.close();\n    }\n  }\n\n  /* Open the floating element with click on the trigger element  */\n  private handleClick(evt: Event): void {\n    evt.stopImmediatePropagation();\n    if (this.event === 'click') {\n      const clickedElement = evt.target as HTMLElement;\n      if (clickedElement && !this.disabled && !this.isReadonly) {\n        this.dropdownOpened = !this.dropdownOpened;\n      }\n    }\n  }\n  /* Clear selected value from the Dropdown  */\n  private clearValue(evt: Event): void {\n    evt.stopImmediatePropagation();\n    this.clear();\n    this.close();\n  }\n  /* Listen when Dropdown Item element is clicked to close Dropdown Items window */\n  @Listen('dropdownItemClicked')\n  private handleDropdownItemClicked(event: CustomEvent<DropdownItemClickedEvent>): void {\n    this.handleSelection(event);\n    this.valueChanged.emit(this.value);\n    this.dynamicInformativeIcon ? (this.informativeIcon = event.detail.icon) : null;\n    this.close();\n  }\n\n  /* Checks if the item is already selected and if so clears the selection, otherwise sets the value */\n  private handleSelection(event: CustomEvent<DropdownItemClickedEvent>): void {\n    this.value = event.detail.value;\n    this.valueLabel = event.detail.label;\n  }\n\n  /* Open the floating element(menu) of the Dropdown. */\n  @Method()\n  public async open(): Promise<void> {\n    this.dropdownOpened = true;\n  }\n\n  /* Close the floating element(menu) of the Dropdown. */\n  @Method()\n  public async close(): Promise<void> {\n    this.dropdownOpened = false;\n  }\n  /* Clear the selected value from the Dropdown. */\n  @Method()\n  public async clear(): Promise<void> {\n    this.value = null;\n    this.valueLabel = null;\n    this.valueChanged.emit(this.value);\n    this.dynamicInformativeIcon ? (this.informativeIcon = this.defaultInformativeIcon) : null;\n    unselectAllItems(this.dropdownContentElementRef);\n    this.cleared.emit(true);\n  }\n  /**\n   *  Gets the target that will manage the menu\n   *  returns a promise with the target HTMLElement.\n   */\n  @Method()\n  public async getTarget(): Promise<HTMLElement | null> {\n    return document.querySelector('.vds__dropdown--trigger') as HTMLElement;\n  }\n  /**\n   *  Gets the selected value of the dropdown\n   *  returns a promise with the value.\n   */\n  @Method()\n  public async getValue(): Promise<String | null> {\n    return this.value;\n  }\n\n  /**\n   *  Set the value of the dropdown\n   */\n  @Method()\n  public async setValue(value: string): Promise<void> {\n    this.clear();\n    this.value = value;\n  }\n\n  private handleHover(event: Event): void {\n    const hoveredElement = event.target as HTMLElement;\n    if (this.event === 'hover' && hoveredElement) {\n      this.dropdownOpened = true;\n    }\n  }\n  private handleHoverOut(event: Event): void {\n    const hoveredElement = event.target as HTMLElement;\n    if (this.event === 'hover' && hoveredElement) {\n      this.close();\n    }\n  }\n\n  private setPredefinedItem() {\n    const slotElement = this.dropdownContentElementRef?.querySelector('slot');\n    const items = typeof slotElement?.assignedElements === 'function' && slotElement?.assignedElements();\n    let preselectedItem = Array.from(items || []).filter(item => item.tagName.toLowerCase() === 'vds-dropdown-item' && item.getAttribute('value') === this.value)[0];\n    if (preselectedItem) {\n      preselectedItem.setAttribute('is-selected', 'true');\n      preselectedItem.setAttribute('is-active', 'true');\n      this.valueLabel = preselectedItem.getAttribute('label');\n    }\n  }\n\n  private findAndSetPredefinedItem() {\n    let getPreselectedItem = undefined;\n    const slotElement = this.dropdownContentElementRef?.querySelector('slot');\n    if (slotElement && typeof slotElement.assignedElements === 'function' && slotElement.assignedElements().length > 0) {\n      getPreselectedItem = Array.from(slotElement.assignedElements()).find(\n        item =>\n          item.tagName.toLowerCase() === 'vds-dropdown-item' &&\n          item.hasAttribute('is-selected') &&\n          item.getAttribute('is-selected') === 'true' &&\n          item.hasAttribute('is-active') &&\n          item.getAttribute('is-active') === 'true',\n      );\n    }\n    if (getPreselectedItem !== undefined) {\n      this.value = getPreselectedItem.getAttribute('value');\n      this.valueLabel = getPreselectedItem.getAttribute('label');\n    }\n  }\n\n  private defineValue() {\n    if (this.value && !this.valueLabel) {\n      this.setPredefinedItem();\n    }\n    if (this.value) {\n      this.findAndSetPredefinedItem();\n    }\n  }\n\n  componentWillLoad() {\n    if (this.dynamicInformativeIcon && this.defaultInformativeIcon === undefined) {\n      this.defaultInformativeIcon = this.informativeIcon;\n    }\n  }\n\n  componentDidRender() {\n    this.options = Array.from(this.hostEl.querySelectorAll(\"vds-dropdown-item\"));\n    updateFloatingBoxPosition(this.actionElementRef, this.dropdownContentElementRef, null, 'bottom', false);\n    updateContainerWidth(this.actionElementRef, this.matchWidth, this.dropdownContentElementRef);\n  }\n\n  componentDidLoad() {\n    if (this.event === 'click') {\n      this.actionElementRef.addEventListener('click', this.handleClick.bind(this));\n    } else if (this.event === 'hover') {\n      this.actionElementRef.addEventListener('mouseenter', this.handleHover.bind(this));\n      this.dropdownContentElementRef.addEventListener('mouseleave', this.handleHoverOut.bind(this));\n    }\n    this.actionElementRef?.addEventListener('keydown', this.handleFloatingKeydown.bind(this));\n    this.dropdownContentElementRef?.addEventListener('keydown', this.handleFloatingKeydown.bind(this));\n    if (!this.dropdownContentElementRef) {\n      this.dropdownContentElementRef = this.hostEl.shadowRoot.querySelector(\".vds__dropdown--container\");\n    }\n    if (this.value) {\n      this.setPredefinedItem();\n    } else\n    {\n      this.findAndSetPredefinedItem();\n    }\n    this.setFormValue();\n    this.setListenerForChildren();\n  }\n\n  disconnectedCallback() {\n    window.removeEventListener('click', this.handleClickOut.bind(this));\n    if (this.event === 'click') {\n      this.actionElementRef.removeEventListener('click', this.handleClick.bind(this));\n    } else if (this.event === 'hover') {\n      this.actionElementRef.removeEventListener('mouseenter', this.handleHover.bind(this));\n      this.dropdownContentElementRef.removeEventListener('mouseleave', this.handleHoverOut.bind(this));\n      this.actionElementRef.removeEventListener('keydown', this.handleFloatingKeydown.bind(this));\n      this.dropdownContentElementRef.removeEventListener('keydown', this.handleFloatingKeydown.bind(this));\n    }\n\n    this.observer?.disconnect();\n  }\n\n  private setListenerForChildren(): void {\n\t\tconst config = {\n\t\t\tchildList: true,\n\t\t\tsubtree: true\n\t\t};\n\n\t\tthis.observer = new MutationObserver(() => {\n\t\t\tthis.options = Array.from(this.hostEl.querySelectorAll(\"vds-dropdown-item\"));\n\t\t\tforceUpdate(this);\n\t\t});\n\n\t\tthis.observer.observe(this.hostEl, config);\n\t}\n\n  /** Gets the icon color.\n   *\n   * @returns string\n   */\n  private getIconColor() {\n    return this.disabled ? 'color-icon-disabled' : 'color-icon-high';\n  }\n\n  private setDropdownIcon() {\n    return (\n      <span>\n        <vds-icon\n          svgIcon={this.dropdownOpened ? 'chevron-up' : 'chevron-down'}\n          color={this.disabled ? 'color-icon-disabled' : 'color-icon-high'}\n          size={getIconSize(this.size)}\n        ></vds-icon>\n      </span>\n    );\n  }\n  private setInformativeIcon() {\n    if (this.informativeIcon) {\n      return (\n        <span>\n          <vds-icon class={\"vds-dropdown__informative-icon\"} svgIcon={this.informativeIcon} color={this.getIconColor()} size={getIconSize(this.size)}></vds-icon>\n        </span>\n      );\n    } else {\n      return null;\n    }\n  }\n\n  private setLabelValue() {\n    return (\n      <span\n        class={combineClasses('vds__dropdown--value', 'vds__dropdown--value-' + this.size, 'vds__dropdown--value-' + (this.value && this.valueLabel ? 'label' : 'placeholder'))}\n      >\n        {this.value && this.valueLabel ? this.valueLabel : this.placeholder}\n      </span>\n    );\n  }\n\n  private setClearValueButtonIcon() {\n    if (this.value && this.valueLabel && this.showClearButton) {\n      return (\n        <span>\n          <vds-icon-button\n            icon=\"close\"\n            variant=\"secondary\"\n            size={this.size}\n            onClick={\n              !this.disabled && !this.isReadonly\n                ? event => {\n                    this.clearValue(event);\n                  }\n                : null\n            }\n            disabled={this.disabled || this.isReadonly}\n            setAriaLabel=\"clear\"\n          ></vds-icon-button>\n        </span>\n      );\n    } else {\n      return null;\n    }\n  }\n  render() {\n    return (\n      <Host class={combineClasses(this.disabled ? \"vds-basic-dropdown--disabled\" : \"\")} onClicked={event => this.handleDropdownItemClicked(event.detail)}>\n        <div class={\"vds-basic-dropdown__container\"}>\n          <button\n            tabIndex={0}\n            disabled={this.disabled}\n            value={this.value}\n            class={combineClasses('vds__dropdown--trigger', this.disabled ? 'vds__dropdown--trigger-disabled' : '', this.error ? 'vds__dropdown--trigger-error' : '', `vds__dropdown--trigger--size-${this.size}`,)}\n            onClick={(evt: MouseEvent) => {\n              this.handleClick(evt);\n            }}\n            ref={triggerEl => {\n              if (triggerEl) this.actionElementRef = triggerEl;\n            }}\n          >\n            <span class=\"vds__dropdown--left-content\">\n              {this.setInformativeIcon()}\n              {this.setLabelValue()}\n            </span>\n            <span class=\"vds__dropdown--right-actions\">\n              {this.setClearValueButtonIcon()}\n              {this.setDropdownIcon()}\n            </span>\n          </button>\n          {this.backdrop && this.dropdownOpened ? <div class=\"vds-floating-backdrop\" onClick={this.close.bind(this)}></div> : ''}\n          <div\n            class={combineClasses(\n              'vds__dropdown--container',\n              this.maxHeight ? 'has-scroll' : '',\n              this.options.length === 0 ? \"no-shadow\" : \"\"\n            )}\n            ref={dropdownEl => {\n              if (dropdownEl) this.dropdownContentElementRef = dropdownEl;\n            }}\n          >\n            <div class={combineClasses('vds-dropdown__content', this.maxHeight ? 'scrollable' : '')} style={setDropdownStyles(this.maxHeight)}>\n              <slot></slot>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n","/**\n * Compares two arrays for equality, taking into account their elements and order.\n *\n * @param {any[]} a The first array to compare.\n * @param {any[]} b The second array to compare.\n * @returns {boolean} True if the arrays are equal, false otherwise.\n *\n * **Comparison criteria:**\n * - **Reference equality:** If both arrays are the same reference, they are considered equal.\n * - **Null or undefined:** If either array is null or undefined, they are considered unequal.\n * - **Length:** If the arrays have different lengths, they are considered unequal.\n * - **Element equality:** If the arrays have the same length, each corresponding element is compared for equality using strict comparison (`===`).\n */\nexport const arrayIsEqual = (a: any[], b: any[]): boolean => {\n    if (a === b) return true;\n    if (a == null || b == null) return false;\n    if (a.length !== b.length) return false;\n  \n    for (var i = 0; i < a.length; ++i) {\n      if (a[i] !== b[i]) return false;\n    }\n    return true;\n}",":host {\n  display: block;\n  width: 100%;\n\n  .vds-dropdown-multiselect__container {\n    display: block;\n  }\n  .vds-dropdown-multiselect___trigger {\n    box-sizing: border-box;\n    display: flex;\n    width: 100%;\n    text-align: left;\n    align-items: center;\n    justify-content: space-between;\n    gap: var(--spacing-02);\n    align-self: stretch;\n    border-radius: var(--radius-medium);\n    border: none;\n    box-shadow: 0 0 0 0.0625rem inset var(--color-border-low);\n    background: var(--surface-medium);\n    &:active, &:hover {\n      cursor: pointer;\n      box-shadow: 0 0 0 0.0625rem inset var(--color-border-brand);\n    }\n    &:focus-visible{\n      outline: 0.125rem solid var(--color-border-focus-2);\n      outline-offset: 0.125rem;\n    }\n    &.vds-dropdown-multiselect___trigger--size-small {\n      padding: var(--spacing-02) var(--spacing-03);\n      height: var(--spacing-07);\n      @include font-style(body, small);\n    }\n    &.vds-dropdown-multiselect___trigger--size-medium {\n      padding: var(--spacing-03) var(--spacing-04);\n      height: var(--spacing-10);\n      @include font-style(body, medium);\n    }\n    &.vds-dropdown-multiselect___trigger--size-large {\n      padding: var(--spacing-04) var(--spacing-05);\n      height: var(--spacing-13);\n      gap: var(--spacing-03);\n      @include font-style(body, large);\n    }\n    &.vds-dropdown-multiselect___trigger--disabled {\n      pointer-events: none;\n      color: var(--color-text-disabled);\n      box-shadow: 0 0 0 0.0625rem inset var(--color-border-disabled);\n      .vds-dropdown-multiselect__label--value {\n        color: var(--color-text-disabled);\n      }\n      .vds-dropdown-multiselect__label--placeholder {\n        color: var(--color-text-disabled);\n      }\n    }\n\n    &.vds-dropdown-multiselect___trigger--error {\n      box-shadow: 0 0 0 0.0625rem inset var(--color-border-danger);\n      .vds-dropdown-multiselect__label--value {\n        color: var(--color-text-danger-medium);\n      }\n    }\n\n    &.vds-dropdown-multiselect___trigger--readonly {\n      pointer-events: none;\n      box-shadow: 0 0 0 0.0625rem inset var(--color-border-low);\n      &:focus, &:active, &:hover {\n        box-shadow: 0 0 0 0.0625rem inset var(--color-border-low);\n      }\n      &:focus-visible {\n        outline: none;\n      }\n      .vds-dropdown-multiselect__label--value {\n        color: var(--color-text-medium);\n      }\n    }\n    .vds-dropdown-multiselect__label {\n      display: block;\n      text-align: left;\n      width: 100%;\n      white-space: nowrap; \n      overflow: hidden;\n      text-overflow: ellipsis; \n    }\n    .vds-dropdown-multiselect__label--value{\n      color: var(--color-text-high);\n    }  \n    .vds-dropdown-multiselect__label--placeholder{\n      color: var(--color-text-medium);\n    } \n    .vds-dropdown-multiselect__trigger-icons {\n      display: flex;\n      align-items: center;\n      vds-icon {\n        margin-left: var(--spacing-02);\n        cursor: pointer;\n        padding: 0.125rem;\n        &:hover {\n          background: var(--color-interaction-black-lowest);\n          border-radius: var(--radius-medium);\n        }\n      }\n    }\n  }\n  .vds-dropdown-multiselect__content {\n    display: none;\n    flex-direction: column;\n    align-items: flex-start;\n    align-self: stretch;\n    min-width: max-content;\n    max-height: fit-content !important;\n    border-radius: var(--radius-medium);\n    background: var(--surface-medium);\n    box-shadow: var(--elevation-shadow-2);\n    box-sizing: border-box;\n    border: 0.0625rem solid var(--color-border-lowest);\n    z-index: var(--elevation-layer-5);\n    &.no-shadow {\n      box-shadow: none;\n      border: none;\n    }\n    &.has-scroll {\n      padding-right: var(--spacing-01);\n    }\n    &.match-width {\n      width: var(--trigger-width);\n      min-width: var(--trigger-width);\n    }\n    .vds-dropdown-multiselect__content-options {\n      overflow-y: auto;\n      display: flex;\n      flex-direction: column;\n      border-radius: var(--radius-medium);\n      &.scrollable {\n        padding-right: var(--spacing-01);\n      }\n      &::-webkit-scrollbar {\n        background-color: var(--surface-medium);\n        width: 0.375rem;\n      }\n      &::-webkit-scrollbar-thumb {\n        background-color: var(--color-background-neutral-press);\n        border-radius: 1rem;\n      }\n    }\n  }\n  .vds-floating-backdrop {\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    background: var(--color-interaction-black-lower);\n    opacity: 0.06;\n    z-index: var(--elevation-layer-4);\n  }\n}\n\n:host-context(.vds-basic-dropdown-multiselect--disabled) {\n  pointer-events: none;\n}","import { Component, Host, Method, Prop, h, Event, EventEmitter, Element } from \"@stencil/core\";\nimport { AttachInternals, HTMLStencilElement, Listen, State, Watch } from \"@stencil/core/internal\";\nimport { combineClasses } from \"../../utils/combine-classes\";\nimport { getIconSize, getIconColor } from \"../../utils/icon-attr.utils\";\nimport { updateFloatingBoxPosition } from \"../../utils/floating-engine-utils\";\nimport { emitNativeInputEvent, getSelectedItemsText, getValidOptions, selectSelectedItems, setDropdownStyles, toggleContainerDisplay, unselectAllItems, unselectNonSelectedItems, updateContainerWidth } from \"../basic-dropdown/vds-basic-dropdown.utils\";\nimport { DropdownItemClickedEvent } from \"../dropdown-item/vds-dropdown-item-clicked-event\";\nimport { arrayIsEqual } from \"../../utils/array-utils\";\n\n@Component({\n  tag: \"vds-basic-dropdown-multiselect\",\n  styleUrl: \"vds-basic-dropdown-multiselect.scss\",\n  shadow: true,\n  formAssociated: true\n})\nexport class VdsBasicDropdownMultiselect {\n  /** Sets the dropdown's size. */\n  @Prop({ mutable: true }) size: \"small\" | \"medium\" | \"large\" = \"medium\";\n  /** Sets the dropdown's value. */\n  @Prop({ mutable: true }) value: string[] | string = [];\n  /** Allows user to define a information icon to the left of the dropdown. */\n  @Prop({ mutable: true }) informativeIcon: string;\n  /** Sets the dropdown's placeholder. */\n  @Prop({ mutable: true }) placeholder: string;\n  /** Sets the dropdown in disabled state. */\n  @Prop({ mutable: true,  reflect: true }) disabled: boolean;\n  /** Sets the dropdown in readonly state. */\n  @Prop({ mutable: true,  reflect: true }) isReadonly: boolean;\n  /** Sets the dropdown in error state. */\n  @Prop({ mutable: true, reflect: true }) error: boolean;\n  /** Sets the dropdown's trigger event. */\n  @Prop({ mutable: true }) event: \"click\" = \"click\";\n  /** Sets the dropdown's value max items selected in plain text. */\n  @Prop() displaySelectionLimit: number;\n  /** Sets displaySelectionLimit text */\n  @Prop() displaySelectionLimitText: string = \"Items selected\";\n  /** Sets the dropdown's clear button visibility. */\n  @Prop({ mutable: true }) showClearButton: boolean = true;\n  /** Set the max height value for the floating container of the items */\n  @Prop({ mutable: true }) maxHeight: string;\n  /** Sets the width value for the floating container of the items to match the dropdown width */\n  @Prop({ mutable: true }) matchWidth: boolean = false;\n  /** Toggles the floating container auto-positioning based on available window space. \n   * False by default as it may cause positioning issues in some situations, use with caution \n   */\n  @Prop({mutable: true}) autoPosition: boolean = false;\n  /** Toggles the overlay element, allowing interaction only with this element when active */\n  @Prop() backdrop: boolean = false;\n\n  /** Emits event when floating element gets opens */\n  @Event() opened: EventEmitter<void>;\n  /** Emits event when floating element gets closes */\n  @Event() closed: EventEmitter<void>;\n  /** Emits event when an item is selected, this event contains the value of the selected item */\n  @Event() valueChanged: EventEmitter<string[]>;\n  /** Emits an event when the clear button is clicked */\n  @Event() cleared: EventEmitter<boolean>;\n\n  @State() isOpened: boolean = false;\n\n  @Element() hostEl: HTMLElement;\n\n  @AttachInternals() internals: ElementInternals;\n\n  private dropdownTrigger: HTMLButtonElement;\n  private dropdownContent: HTMLDivElement;\n  private options: HTMLVdsDropdownItemElement[] = [];\n  private observer: MutationObserver;\n\n  private floatingCleanUp: () => void;\n\n  componentDidLoad(): void {\n    this.setValueHandler(this.value);\n    selectSelectedItems(this.dropdownContent, this.value);\n    this.dropdownTrigger?.addEventListener('keydown', this.handleFloatingKeydown.bind(this));\n    this.dropdownContent?.addEventListener('keydown', this.handleFloatingKeydown.bind(this));\n    this.setListenerForChildren();\n  }\n\n  disconnectedCallback() {\n    this.dropdownTrigger.removeEventListener('keydown', this.handleFloatingKeydown.bind(this));\n    this.dropdownContent.removeEventListener('keydown', this.handleFloatingKeydown.bind(this));\n    window.removeEventListener('click', this.handleClickOut.bind(this));\n    this.observer?.disconnect();\n  }\n  private setListenerForChildren(): void {\n    const config = {\n      childList: true,\n      subtree: true\n    };\n    this.observer = new MutationObserver(() => {\n      this.options = Array.from(this.hostEl.querySelectorAll(\"vds-dropdown-item\"));\n    });\n    this.observer.observe(this.hostEl, config);\n  }\n\n  // Sets the value prop validating whether the newValue is string or array.\n  @Watch(\"value\")\n  setValueHandler(newValue: string[] | string) {\n    if (!newValue) {\n      this.value = [];\n      return;\n    }\n    if (typeof newValue === \"string\") {\n      this.value = getValidOptions(this.dropdownContent, newValue.split(\",\"));\n    }\n    if (Array.isArray(newValue)) {\n      const uniqueValues = [...new Set(newValue)];\n      const selectedOptions = getValidOptions(this.dropdownContent, uniqueValues);\n      this.value = arrayIsEqual(this.value as string[], selectedOptions) ? this.value : selectedOptions;\n    }\n    if (this.internals && !!this.internals.setFormValue) {\n      this.internals.setFormValue((this.value as string[]).join(\",\"));\n    }\n\n    unselectNonSelectedItems(this.dropdownContent, this.value);\n    selectSelectedItems(this.dropdownContent, this.value);\n\n    if (this.value && this.value.length === 0) {\n      unselectAllItems(this.dropdownContent);\n    }\n  }\n\n  componentDidRender() {\n    this.options = Array.from(this.hostEl.querySelectorAll(\"vds-dropdown-item\"));\n    updateFloatingBoxPosition(this.dropdownTrigger, this.dropdownContent, null, 'bottom', false);\n    updateContainerWidth(this.dropdownTrigger, this.matchWidth, this.dropdownContent);\n  }\n\n  @Watch(\"isOpened\")\n  async toggleDropdown(): Promise<void> {\n    if (this.isOpened) {\n      toggleContainerDisplay(this.dropdownContent, true);\n      this.opened.emit();\n      this.floatingCleanUp = await updateFloatingBoxPosition(this.dropdownTrigger, this.dropdownContent, null, \"bottom\", this.autoPosition);\n    } else {\n      toggleContainerDisplay(this.dropdownContent, false);\n      this.closed.emit();\n      this.floatingCleanUp();\n    }\n  }\n\n  /* Open the floating element(menu) of the Dropdown. */\n  @Method()\n  public async open(): Promise<void> {\n    this.isOpened = true;\n  }\n\n  /* Close the floating element(menu) of the Dropdown. */\n  @Method()\n  public async close(): Promise<void> {\n    this.isOpened = false;\n  }\n  \n  /**\n   * Clears the selected options and resets the value of the dropdown.\n   *\n   * @returns {Promise<void>} A promise that resolves when the clearing operation is complete.\n   */\n  @Method()\n  public async clear(): Promise<void> {\n    this.value = [];\n    unselectAllItems(this.dropdownContent);\n    this.cleared.emit(true);\n  }\n\n  /**\n   *  Gets the target that will manage the menu\n   *  returns a promise with the target HTMLElement.\n   * \n   *  @returns {Promise<HTMLElement>} A promise that resolves with the target html element.\n   */\n  @Method()\n  public async getTarget(): Promise<HTMLElement | null> {\n    return this.dropdownTrigger;\n  }\n  /**\n   *  Gets the selected value of the dropdown\n   *  returns a promise with the value.\n   * \n   *  @returns {Promise<string[]>} A promise that resolves with the value as string[].\n   */\n  @Method()\n  public async getValue(): Promise<string[]> {\n    return this.value as string[];\n  }\n  \n  /**\n   * Sets the selected value(s) for the dropdown.\n   *\n   * @param {string[] | string} value The new value or array of values to select.\n   * @returns {Promise<void>} A promise that resolves when the value is set.\n   */\n  @Method()\n  public async setValue(value: string[] | string): Promise<void> {\n    this.setValueHandler(value);\n  }\n\n  /* Close the floating element when click outside */\n  @Listen('click', { target: 'window' })\n  private handleClickOut(evt: MouseEvent): void {\n    evt.stopPropagation();\n    const target = evt.target as HTMLElement;\n    const isClickInside = this.hostEl.contains(target as Node);\n    const isClickInsideParentDropdown = target.nodeName === \"VDS-DROPDOWN-MULTISELECT\" && target.shadowRoot && (evt.target as HTMLElement).shadowRoot.contains(this.hostEl);\n    if (!isClickInside && !isClickInsideParentDropdown) {\n      this.close();\n    }\n  }\n\n  /**\n   * Listen when Dropdown Item element is clicked to close Dropdown Items window, set the value and emit the changes.\n   *\n   * @param {CustomEvent<DropdownItemClickedEvent>} event The dropdown item clicked event.\n   */\n  @Listen(\"dropdownItemClicked\")\n  handleDropdownSelection(event: CustomEvent<DropdownItemClickedEvent>): void {\n    const item = event.target as HTMLVdsDropdownItemElement;\n    const value = event.detail.value;\n    item.isSelected = !item.isSelected;\n    if (item.isSelected) {\n      this.value = [...this.value, value];\n    } else{\n      this.value = (this.value as string[]).filter(v => v !== value)\n    }\n    \n    this.valueChanged.emit(this.value);\n    emitNativeInputEvent(this.hostEl);\n  }\n\n  /* Open the floating element with click on the trigger element  */\n  private handleClick(evt: Event): void {\n    evt.stopImmediatePropagation();\n    if (this.event === \"click\" && !this.disabled && !this.isReadonly) {\n      this.isOpened = !this.isOpened\n    }\n  }\n\n  /* Close the floating element with keydown on the trigger element  */\n  private handleFloatingKeydown(event: KeyboardEvent): void {\n    event.stopImmediatePropagation();\n    if (event.key === 'Escape' || event.key === 'Esc') {\n      this.close();\n    }\n  }\n\n  private clearIconClick(evt: Event): void {\n    evt.stopImmediatePropagation();\n    this.clear();\n    this.close();\n  }\n\n  private renderLabelValue(): HTMLStencilElement {\n    const selectedValue = this.getTextValue();\n    return <span class={combineClasses(\n      \"vds-dropdown-multiselect__label\",\n      `vds-dropdown-multiselect__label--${this.hasValue() ? \"value\" : \"placeholder\"}`)}\n    >{selectedValue}</span>\n  }\n\n  private getTextValue(): string {\n    if (this.displaySelectionLimit > 0 && this.value.length > this.displaySelectionLimit) {\n      return `${this.value.length} ${this.displaySelectionLimitText}`;\n    }\n\n    return this.hasValue() ? getSelectedItemsText(this.dropdownContent, this.value as string[]).join(\", \") : this.placeholder;\n  }\n  \n  private renderInformativeIcon(): HTMLStencilElement {\n    return <vds-icon svgIcon={this.informativeIcon} color={getIconColor(this.disabled)} size={getIconSize(this.size)}></vds-icon>\n  }\n\n  private renderClearIcon(): HTMLStencilElement {\n    return <vds-icon-button\n      icon=\"close\"\n      variant=\"secondary\"\n      size={this.size}\n      onClick={(evt) => {\n        this.clearIconClick(evt);\n      }}\n      disabled={this.disabled}\n      setAriaLabel=\"clear\"\n    ></vds-icon-button>\n  }\n\n  private renderDropdownIcon(): HTMLStencilElement {\n    return <vds-icon\n      svgIcon={this.isOpened ? \"chevron-up\" : \"chevron-down\"}\n      color={getIconColor(this.disabled)}\n      size={getIconSize(this.size)}\n    ></vds-icon>\n  }\n\n  private hasValue(): boolean {\n    return Array.isArray(this.value) && this.value && this.value.length > 0;\n  }\n\n  render(): HTMLStencilElement {\n    return (\n      <Host class={combineClasses(this.disabled ? \"vds-basic-dropdown-multiselect--disabled\" : \"\")} title={this.getTextValue()}>\n        <div class={\"vds-dropdown-multiselect__container\"}>\n          <button\n            disabled={this.disabled}\n            ref={(el): void => {\n              if (el) this.dropdownTrigger = el;\n            }}\n            class={combineClasses(\n              \"vds-dropdown-multiselect___trigger\",\n              `vds-dropdown-multiselect___trigger--size-${this.size}`,\n              this.disabled ? \"vds-dropdown-multiselect___trigger--disabled\" : \"\",\n              this.isReadonly ? \"vds-dropdown-multiselect___trigger--readonly\" : \"\",\n              this.error ? \"vds-dropdown-multiselect___trigger--error\" : \"\" \n            )}\n            onClick={(evt: MouseEvent) => {\n              this.handleClick(evt);\n            }}\n          >\n            {this.informativeIcon && this.renderInformativeIcon()}\n            {this.renderLabelValue()}\n            <div class=\"vds-dropdown-multiselect__trigger-icons\">\n              {this.hasValue() && this.showClearButton && this.renderClearIcon()}\n              {this.renderDropdownIcon()}\n            </div>\n          </button>\n          {this.backdrop && this.isOpened ? <div class=\"vds-floating-backdrop\" onClick={this.close.bind(this)}></div> : ''}\n          <div\n            ref={(el): void => {\n              if (el) this.dropdownContent = el;\n            }}\n            class={combineClasses(\n              \"vds-dropdown-multiselect__content\",\n              this.maxHeight ? \"has-scroll\" : \"\",\n              this.options.length === 0 ? \"no-shadow\" : \"\"\n            )}\n          >\n            <div \n            class={combineClasses(\n              'vds-dropdown-multiselect__content-options', \n              (this.maxHeight ? 'scrollable' : '')\n            )}\n            style={setDropdownStyles(this.maxHeight)}>\n              <slot></slot>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n","/**\n * Emulates the native submit form\n *\n * @returns void\n */\nexport const shadowSubmitForm = (host: Element): void => {\n\tconst form = host.closest(\"form\");\n\tif (form) {\n\t\tconst fakeSubmit = document.createElement(\"button\");\n\t\tfakeSubmit.type = \"submit\";\n\t\tfakeSubmit.style.display = \"none\";\n\t\tform.appendChild(fakeSubmit);\n\t\tfakeSubmit.click();\n\t\tfakeSubmit.remove();\n\t}\n};\n","@import '~@volt/volt-foundations/dist/volt-foundations/volt-foundations';\n\n:host {\n  display: block;\n  \n  --vds-input-min-width-small: 5.75rem;\n  --vds-input-min-width: 7.5rem;\n  --vds-input-min-width-large: 9.25rem;\n\n  .vds__input__container {\n    display: flex;\n    align-items: center;\n    flex-shrink: 0;\n    box-sizing: border-box;\n    border-radius: var(--radius-medium);\n    border: var(--border-thickness-01) solid var(--color-border-low);\n    background: var(--surface-medium);\n\n    &:hover {\n      border-color: var(--color-border-brand);\n      outline: var(--border-thickness-05) solid var(--color-interaction-brand-low);\n    }\n\n    .vds-input__informative-icon::part(svg-icon) {\n      display: flex;\n      justify-content: center;\n      align-items: center;\n    }\n\n    &.vds__input__container--focus {\n      border-color: var(--color-border-brand);\n    }\n\n    &.vds__input__container--error {\n      border-color: var(--color-border-danger);\n      outline-color: var(--color-interaction-danger-medium);\n\n      .vds__input {\n        color: var(--color-text-danger-medium);\n      }\n    }\n\n    &.vds__input__container--readonly {\n      border-color: var(--color-border-low);\n      outline: none;\n      background-color: var(--color-interaction-black-lowest);\n\n      .vds__input {\n        color: var(--color-text-medium);\n      }\n    }\n\n    &.vds__input__container--disabled {\n      border-color: var(--color-border-lowest);\n      outline: none;\n      background-color: var(--surface-medium);\n\n      .vds__input {\n        color: var(--color-text-disabled);\n\n        &::placeholder {\n          color: var(--color-text-disabled);\n        }\n      }\n    }\n\n    &.vds__input--size-small {\n      gap: var(--spacing-02);\n      padding: var(--spacing-02) var(--spacing-03);\n      height: var(--spacing-07);\n      min-width: var(--vds-input-min-width-small);\n\n      .vds__input {\n        height: var(--spacing-07);\n        @include font-style(body, small);\n      }\n    }\n\n    &.vds__input--size-medium {\n      gap: var(--spacing-02);\n      padding: var(--spacing-03) var(--spacing-04);\n      height: var(--spacing-10);\n      min-width: var(--vds-input-min-width);\n\n      .vds__input {\n        height: var(--spacing-10);\n        @include font-style(body, medium);\n      }\n    }\n\n    &.vds__input--size-large {\n      gap: var(--spacing-03);\n      padding: var(--spacing-04) var(--spacing-05);\n      height: var(--spacing-13);\n      min-width: var(--vds-input-min-width-large);\n\n      .vds__input {\n        height: var(--spacing-13);\n        @include font-style(body, large);\n      }\n    }\n\n    .vds__input {\n      flex-grow: 1;\n      width: 100%;\n      border: none;\n      background: transparent;\n      padding: 0;\n      overflow: hidden;\n      color: var(--color-text-high);\n      font-feature-settings: 'clig' off, 'liga' off;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n      font-style: normal;\n\n      &::placeholder {\n        color: var(--color-text-medium);\n      }\n\n      &:hover,\n      &:focus {\n        border: none;\n        outline: none;\n      }\n    }\n  }\n}\n:host-context(.vds-basic-input--disabled) {\n  pointer-events: none;\n}\n\n:host-context(.theme-dark) {\n  .vds__input::-webkit-calendar-picker-indicator {\n    filter: invert(1);\n  }\n}","import {\n  Component,\n  Host,\n  Prop,\n  h,\n  Element,\n  Event,\n  EventEmitter,\n  Method\n} from '@stencil/core';\nimport { \n  VdsInputType,\n  isValidIcon,\n  toggleFocusClass,\n  getIconColor,\n  setInputStyles,\n  setTouchedClass,\n  setDirtyClass, \n  maskInput\n} from './vds-basic-input.utils';\nimport { combineClasses } from '../../utils/combine-classes';\nimport { cloneAttributes } from '../../utils/clone-attributes';\nimport { AttachInternals, HTMLStencilElement, Listen, Watch } from '@stencil/core/internal';\nimport { shadowSubmitForm } from '../../utils/form';\n\n@Component({\n  tag: 'vds-basic-input',\n  styleUrl: 'vds-basic-input.scss',\n  shadow: true,\n  formAssociated: true\n})\nexport class VdsBasicInput {\n  /** Sets the input size. */\n  @Prop({ mutable: true }) size: \"small\" | \"medium\" | \"large\" = \"medium\";\n  /** Sets input type in the DOM. Check HTML 5 Input type. */\n  @Prop({ mutable: true, reflect: true }) type: VdsInputType = \"text\";\n  /** Sets the input value. */\n  @Prop({ mutable: true, reflect: true }) value: string;\n  /** Sets the input placeholder. */\n  @Prop({ mutable: true, reflect: true }) placeholder: string;\n  /** Sets the input in disabled state. */\n  @Prop({ mutable: true, reflect: true }) disabled: boolean;\n  /** Sets the input in readonly state. */\n  @Prop({ mutable: true, reflect: true }) isReadonly: boolean;\n  /** Sets the input in error state. */\n  @Prop({ mutable: true, reflect: true }) error: boolean;\n  /** Toggles the required sign in the field */\n  @Prop({ mutable: true, reflect: true }) isRequired: boolean = false;\n  /** Allows user to define a information icon inside the input at its left . */\n  @Prop() informativeIcon: string;\n  /** Sets character formatting for user input. Useful for adding a mask to the input. */\n  @Prop({ mutable: true }) formatter?: Function;\n  /** Sets custom allowed styles to input (text-align, text-transform, unicode-bidi, direction) */\n  @Prop({ mutable: true }) allowedStyles: { [key: string]: string }[] = [];\n\n  @Element() hostEl: HTMLInputElement;    \n  \n\t/**  Emits updated input value */\n\t@Event() changeInput: EventEmitter<string>;\n\n  @AttachInternals() internals: ElementInternals;\n\n  private inputContainerRef: HTMLDivElement;\n  private inputEl: HTMLInputElement;\n\n  componentDidLoad(): void {\n    this.setFormValue();\n  }\n\n  @Watch(\"value\")\n  setFormValue(): void {\n    if (this.internals && !!this.internals.setFormValue) {\n      this.internals.setFormValue(this.value);\n    }\n  }\n\n  /**\n   * Displays vds-icon when icon string is valid\n   *\n   * @returns HTMLStencilElement\n   */\n  private getInputIcon(icon: string): HTMLStencilElement {\n    if(!isValidIcon(icon)) return null;\n\n    const inputState = this.disabled ? \"disabled\" : this.isReadonly ? \"readonly\" : \"normal\";\n    const size = this.size === \"medium\" ? \"1rem\" : this.size === \"small\" ? \"0.75rem\" : \"1.25rem\";\n    return (<vds-icon class=\"vds-input__informative-icon\" svgIcon={icon} size={size} color={getIconColor(inputState)}></vds-icon>);\n  }\n\n  /**\n   * Toggle class vds__input__container--focus in focus/blur input's event\n   *\n   * @returns void\n   */\n  private toggleFocusClass(): void {\n    this.inputContainerRef && toggleFocusClass(this.inputContainerRef);\n  }\n\n  /**\n   * Sets input inline styles for the allowedStyles \n   * [direction, text-align, textAlign, text-transform, textTransform, unicode-bidi, unicodeBidi]\n   *\n   * @returns void\n   */\n  private setInputStyles(): { [key: string]: string } {\n    return setInputStyles(this.allowedStyles);\n\t}\n\n  /**\n   * Sets value from input's event target.\n   * Emits change, input and changeInput events.\n   * Sets input as dirty when input's event is triggered.\n   * Executes formatter prop function on every inputed value.\n   *\n   * @returns void\n   */\n  private handleInput(evt: InputEvent): void {\n    evt.stopPropagation();\n    const target = evt.target as HTMLInputElement;\n    const inputEvent = new InputEvent(\"input\");\n    setDirtyClass(this.hostEl);\n    if(this.formatter) {\n      const maskValue = maskInput(this.formatter, target.value, this.value, evt.data, target, evt);\n      (evt.currentTarget as HTMLInputElement).value = maskValue;\n      this.value = maskValue;\n    } else {\n      this.value = target.value;\n    }\n\n    this.changeInput.emit(this.value);\n\t\tthis.hostEl.dispatchEvent(inputEvent);\n  }\n\n  /**\n\t * Executes method when input's keyup event is triggered.\n\t *\n\t * @returns void\n\t */\n  @Listen(\"keyup\")\n\thandleEnterKey(event: KeyboardEvent): void {\n\t\tif (event.key === \"Enter\") {\n\t\t\tshadowSubmitForm(this.hostEl);\n\t\t}\n\t}\n\n  /**\n\t * Executes method when vds-input gets focus.\n\t *\n\t * @returns void\n\t */\n\t@Listen(\"focus\")\n\thandleFocus(): void {\n    setTouchedClass(this.hostEl);\n\t}\n\n  /**\n\t * Sets focus on the vds-input element.\n\t *\n\t * @returns Promise<void>\n\t */\n\t@Method()\n\tsetFocus(): Promise<void> {\n    return new Promise((resolve) => {\n      this.inputEl.focus();\n      resolve();\n    });\n\t}\n\n  /**\n\t * Gets value prop from the vds-input element.\n\t *\n\t * @returns Promise<string>\n\t */\n\t@Method()\n\tgetValue(): Promise<string> {\n    return new Promise((resolve) => {\n      resolve(this.value);\n    });\n\t}\n\n  /**\n\t * Clears value prop from the vds-input element.\n\t *\n\t * @returns Promise<voiid>\n\t */\n\t@Method()\n\tclear(): Promise<void> {\n    return new Promise((resolve) => {\n      this.value = \"\";\n      this.inputEl.value = \"\";\n      resolve();\n    });\n\t}\n\n  render(): HTMLStencilElement {\n    if(this.type === \"datetime\"){ console.warn(\"The type datetime has been deprecated.Please use datetime-local.\")}\n    return (\n      <Host class={this.disabled ? \"vds-basic-input--disabled\" : \"\"}>\n        <div\n          ref={(el): void => { if(el) this.inputContainerRef = el} }\n          class={combineClasses(\n            \"vds__input__container\",\n            `vds__input--size-${this.size}`,\n            this.error && \"vds__input__container--error\",\n            this.isReadonly && \"vds__input__container--readonly\",\n            this.disabled && \"vds__input__container--disabled\"\n          )}\n        >\n          {this.getInputIcon(this.informativeIcon)}\n          <input\n            ref={(el): void => { if(el) this.inputEl = el} }\n            class={\"vds__input\"}\n            type={this.type}\n            value={this.value}\n            placeholder={this.placeholder}\n            disabled={this.disabled}\n            required={this.isRequired}\n            readOnly={this.isReadonly}\n            onInput={(evt): void => this.handleInput(evt)}\n            onFocus={(): void => this.toggleFocusClass()}\n            onBlur={(): void => this.toggleFocusClass()}\n            style={this.setInputStyles()}\n            {...cloneAttributes(\n              this.hostEl,\n              \"class\",\n              \"value\",\n              \"disabled\",\n              \"placeholder\",\n              \"label\",\n              \"style\",\n            )}\n          />\n          <slot name=\"secondaryActionIcon\" />\n          <slot name=\"primaryActionIcon\" />\n        </div>\n      </Host>\n    );\n  }\n}\n","export default {\n\t\"spacing-00\": \"0rem\",\n\t\"spacing-01\": \"0.125rem\",\n\t\"spacing-02\": \"0.25rem\",\n\t\"spacing-03\": \"0.5rem\",\n\t\"spacing-04\": \"0.75rem\",\n\t\"spacing-05\": \"1rem\",\n\t\"spacing-06\": \"1.25rem\",\n\t\"spacing-07\": \"1.5rem\",\n\t\"spacing-08\": \"1.75rem\",\n\t\"spacing-09\": \"2rem\",\n\t\"spacing-10\": \"2.25rem\",\n\t\"spacing-11\": \"2.5rem\",\n\t\"spacing-12\": \"2.75rem\",\n\t\"spacing-13\": \"3rem\",\n\t\"spacing-14\": \"3.25rem\",\n\t\"spacing-15\": \"3.5rem\",\n\t\"spacing-16\": \"3.75rem\",\n\t\"spacing-17\": \"4rem\",\n\t\"spacing-18\": \"4.25rem\",\n\t\"spacing-19\": \"4.5rem\",\n\t\"spacing-20\": \"4.75rem\",\n};","@import '~@volt/volt-foundations/dist/volt-foundations/volt-foundations';\n\n:host {\n  display: block;\n  .vds__textarea__container {\n    display: flex;\n    align-items: start;\n    flex-shrink: 0;\n    box-sizing: border-box;\n    border-radius: var(--radius-medium);\n    border: var(--border-thickness-01) solid var(--color-border-low);\n    background: var(--surface-medium);\n\n    &:hover {\n      border-color: var(--color-border-brand);\n      outline: var(--border-thickness-05) solid var(--color-interaction-brand-low);\n    }\n\n    &.vds__textarea__container--focus {\n      border-color: var(--color-border-brand);\n    }\n\n    &.vds__textarea__container--error {\n      border-color: var(--color-border-danger);\n      outline-color: var(--color-interaction-danger-medium);\n      .vds__textarea {\n        color: var(--color-text-danger-medium);\n      }\n    }\n    &.vds__textarea__container--readonly {\n      border-color: var(--color-border-low);\n      outline: none;\n      background-color: var(--color-interaction-black-lowest);\n      .vds__textarea {\n        color: var(--color-text-medium);\n      }\n    }\n    &.vds__textarea__container--disabled {\n      border-color: var(--color-border-disabled);\n      outline: none;\n      background-color: var(--surface-medium);\n      .vds__textarea {\n        color: var(--color-text-disabled);\n        &::placeholder {\n          color: var(--color-text-disabled);\n        }\n      }\n    }\n\n    &.vds__textarea--size-small {\n      gap: var(--spacing-02);\n      padding: var(--spacing-02) var(--spacing-03);\n      min-height: 3rem;\n      .vds__textarea {\n        min-width: 5.5rem;\n        min-height: 3rem;\n        @include font-style(body, small);\n      }\n    }\n\n    &.vds__textarea--size-medium {\n      gap: var(--spacing-02);\n      padding: var(--spacing-03) var(--spacing-04);\n      min-height: 4.5rem;\n      .vds__textarea {\n        min-width: 7.5rem;\n        min-height: 4.5rem;\n        @include font-style(body, medium);\n      }\n    }\n    &.vds__textarea--size-large {\n      gap: var(--spacing-03);\n      padding: var(--spacing-04) var(--spacing-05);\n      min-height: 6rem;\n      .vds__textarea {\n        min-width: 9.25rem;\n        min-height: 6rem;\n        @include font-style(body, large);\n      }\n    }\n\n    .vds__textarea {\n      flex-grow: 1;\n      border: none;\n      background: transparent;\n      padding: 0;\n      resize: none;\n      overflow: hidden;\n      color: var(--color-text-high);\n      font-feature-settings: 'clig' off, 'liga' off;\n      text-overflow: ellipsis;\n      font-style: normal;\n      &::placeholder {\n        color: var(--color-text-medium);\n      }\n      &:hover,\n      &:focus {\n        border: none;\n        outline: none;\n      }\n    }\n  }\n}\n\n:host-context(.vds-basic-textarea--disabled){\n  pointer-events: none;\n}","import {\n  Component,\n  Host,\n  Prop,\n  h,\n  Element,\n  Event,\n  EventEmitter,\n  Method\n} from '@stencil/core';\nimport {\n  toggleFocusClass,\n  setTouchedClass,\n  setDirtyClass, \n  maskInput,\n  setInputStyles\n} from '../input/vds-basic-input.utils';\nimport { combineClasses } from '../../utils/combine-classes';\nimport { cloneAttributes } from '../../utils/clone-attributes';\nimport { AttachInternals, HTMLStencilElement, Listen, Watch } from '@stencil/core/internal';\nimport spacingVars from '../../constants/spacing-vars';\n\n@Component({\n  tag: 'vds-basic-textarea',\n  styleUrl: 'vds-basic-textarea.scss',\n  shadow: true,\n  formAssociated: true\n})\nexport class VdsBasicTextarea {\n  /** Sets the textarea's size. */\n  @Prop({ mutable: true }) size: \"small\" | \"medium\" | \"large\" = \"medium\";\n  /** Sets the textarea's value. */\n  @Prop({ mutable: true }) value: string;\n  /** Sets the textarea's placeholder. */\n  @Prop({ mutable: true }) placeholder: string;\n  /** Sets the textarea in disabled state. */\n  @Prop({ mutable: true }) disabled: boolean;\n  /** Sets the textarea in readonly state. */\n  @Prop({ mutable: true }) isReadonly: boolean;\n  /** Sets the textarea in error state. */\n  @Prop({ mutable: true, reflect: true }) error: boolean;\n  /** Toggles the required sign in the field */\n  @Prop({ mutable: true, reflect: true }) isRequired: boolean = false \n  /** Sets character formatting for user inputs. Useful for adding a mask to the textarea. */\n  @Prop({ mutable: true }) formatter: Function;\n  /** Sets custom allowed styles to textarea (text-align, text-transform, unicode-bidi, direction) */\n  @Prop({ mutable: true }) allowedStyles: { [key: string]: string }[] = [];\n  /** Sets the width of the textarea. */\n  @Prop({ mutable: true }) width: string;\n  /** Sets the height of the textarea. This prop not works combining with autogrow=true. */\n  @Prop({ mutable: true }) height: string;\n  /** Sets the min-height for the textarea. This property works combining with autogrow=true only. \n   * - Default for medium: '4.5rem'\n   * - Default for large: '6rem'\n   * \n   * This value is automatically adjusted according to the 'size' property.\n   * @default '4.5rem' (when size is 'medium')\n  */\n  @Prop({ mutable: true }) minHeight: string = this.size === \"large\" ? \"6rem\" : this.size === \"small\" ? \"3rem\" : \"4.5rem\";\n  /** Sets the max-height for the textarea. This property works combining with autogrow=true only. \n   * - Default for medium: '12.15rem'\n   * - Default for large: '18rem'\n   * \n   * This value is automatically adjusted according to the 'size' property.\n   * @default '12.15rem' (when size is 'medium')\n  */\n  @Prop({ mutable: true }) maxHeight: string = this.size === \"large\" ? \"18rem\" : \"12.15rem\";\n  /** Makes the textarea grows with its content. This property works combining with maxHeight and minHeight. This prop not works combining with property height defined. */\n  @Prop({ mutable: true }) autogrow: boolean = true;\n\n  @Element() hostEl: HTMLVdsBasicTextareaElement;    \n\n\t/**  Emits updated textarea value */\n\t@Event() changeInput: EventEmitter<string>;\n\n  @AttachInternals() internals: ElementInternals;\n\n  private textareaContainerRef: HTMLDivElement;\n  private textAreaEl: HTMLTextAreaElement;\n\n  componentDidLoad(): void {\n    this.setFormValue();\n  }\n\n  @Watch(\"value\")\n  setFormValue(): void {\n    if (this.internals && !!this.internals.setFormValue) {\n      this.internals.setFormValue(this.value);\n    }\n  }\n\n  /**\n   * Toggle class vds__textarea__container--focus in focus/blur textarea's event\n   *\n   * @returns void\n   */\n  private toggleFocusClass(): void {\n    this.textareaContainerRef && toggleFocusClass(this.textareaContainerRef, \"textarea\");\n  }\n\n  /**\n   * Sets value from textarea's event target.\n   * Emits change, input and changeInput events.\n   * Sets textarea as dirty when textarea's event is triggered.\n   * Executes formatter prop function on every inputed value.\n   *\n   * @returns void\n   */\n  private handleInput(evt: InputEvent): void {\n    evt.stopPropagation();\n    const target = evt.target as HTMLTextAreaElement; \n    const inputEvent = new InputEvent(\"input\");\n    setDirtyClass(this.hostEl);\n\n    if(this.formatter) {\n      const maskValue = maskInput(this.formatter, target.value, this.value, evt.data, target, evt);\n      this.value = maskValue;\n    } else {\n      this.value = target.value;\n    }\n\n    this.changeInput.emit(this.value);\n\t\tthis.hostEl.dispatchEvent(inputEvent);\n  }\n\n\n  /**\n   * Sets textarea inline styles for the allowedStyle, height and width\n   * [direction, text-align, textAlign, text-transform, textTransform, unicode-bidi, unicodeBidi]\n   *\n   * @returns { [key: string]: string }\n   */\n    private setTextareaStyles(): { [key: string]: string } {\n      const inputedStyles = {...setInputStyles(this.allowedStyles) };\n\n      if (this.autogrow) {\n        inputedStyles.fieldSizing = \"content\";\n      }\n\n      const styles = this.setSizesStyles(inputedStyles) || {};\n      const paddingOffset = this.size === \"large\" ? spacingVars[\"spacing-04\"] : this.size === \"small\" ? spacingVars[\"spacing-02\"] : spacingVars[\"spacing-03\"]\n\n      if (styles.height && !this.autogrow) {\n        styles.height = `calc(${styles.height} - ${paddingOffset} * 2)`;\n      }\n\n      if (styles.minHeight) {\n        styles.minHeight = `calc(${styles.minHeight} - ${paddingOffset} * 2)`;\n      }\n\n      if (styles.maxHeight) {\n        styles.maxHeight = `calc(${styles.maxHeight} - ${paddingOffset} * 2)`;\n      }\n      \n      return styles;\n    }\n\n    /**\n     * Sets textarea inline styles for the height and width\n     *\n     * @returns { [key: string]: string }\n     */\n    private setSizesStyles(styles: { [key: string]: string } = {}): { [key: string]: string } {\n      if (this.width) {\n        styles.width = this.width;\n      }\n\n      if (this.height) {\n        styles.height = this.height;\n      }\n\n      if (this.maxHeight) {\n        styles.maxHeight = this.maxHeight;\n      }\n\n      if (this.minHeight) {\n        styles.minHeight = this.minHeight;\n      }\n\n      return styles;\n    }\n\n  /**\n\t * Executes method when vds-textarea gets focus.\n\t *\n\t * @returns void\n\t */\n\t@Listen(\"focus\")\n\thandleFocus(): void {\n    setTouchedClass(this.hostEl);\n\t}\n\n  /**\n\t * Sets focus on the vds-textarea element.\n\t *\n\t * @returns Promise<void>\n\t */\n\t@Method()\n\tsetFocus(): Promise<void> {\n    return new Promise((resolve) => {\n      this.textAreaEl.focus();\n      resolve();\n    });\n\t}\n\n  /**\n\t * Gets value prop from the vds-textarea element.\n\t *\n\t * @returns Promise<string>\n\t */\n\t@Method()\n\tgetValue(): Promise<string> {\n    return new Promise((resolve) => {\n      resolve(this.value);\n    });\n\t}\n\n  render(): HTMLStencilElement {\n    return (\n      <Host class={this.disabled ? \"vds-basic-textarea--disabled\" : \"\"}>\n          <div\n            ref={(el): void => { if(el) this.textareaContainerRef = el} }\n            class={combineClasses(\n              \"vds__textarea__container\",\n              `vds__textarea--size-${this.size}`,\n              this.error && \"vds__textarea__container--error\",\n              this.isReadonly && \"vds__textarea__container--readonly\",\n              this.disabled && \"vds__textarea__container--disabled\"\n            )}\n            style={this.setSizesStyles()}\n          >\n            <textarea\n              ref={(el): void => { if(el) this.textAreaEl = el} }\n              class={\"vds__textarea\"}\n              value={this.value}\n              placeholder={this.placeholder}\n              disabled={this.disabled}\n              required={this.isRequired}\n              readOnly={this.isReadonly}\n              style={this.setTextareaStyles()}\n              onInput={(evt): void => this.handleInput(evt)}\n              onFocus={(): void => this.toggleFocusClass()}\n              onBlur={(): void => this.toggleFocusClass()}\n              {...cloneAttributes(\n                this.hostEl,\n                \"class\",\n                \"value\",\n                \"disabled\",\n                \"placeholder\",\n                \"label\",\n                \"style\"\n              )}\n            ></textarea>\n            <slot name=\"secondaryActionIcon\" />\n            <slot name=\"primaryActionIcon\" />\n          </div>\n      </Host>\n    );\n  }\n}\n","@mixin disabledButton($borderless: false) {\n  background-color: transparent;\n  color: var(--color-text-disabled);\n  pointer-events: none;\n  @if not ($borderless) {\n    box-shadow: 0 0 0 0.0625rem inset var(--color-border-disabled);\n  }\n  ::slotted(vds-icon) {\n    color: var(--color-icon-disabled);\n    fill: var(--color-icon-disabled);\n  }\n}\n\n:host(.disabled) {\n  pointer-events: none;\n}\n\n:host {\n  display: inline-block;\n  width: fit-content;\n .vds-button {\n  &__element {\n    display: flex;\n    align-items: center;\n    border: none;\n    border-radius: var(--radius-medium);\n    box-sizing: border-box;\n    box-shadow: none;\n    cursor: pointer;\n    &:focus-visible {\n      outline: 0.125rem solid var(--color-border-focus-2);\n      outline-offset: 0.125rem;\n    }\n  }\n  &__size--large {\n    padding: calc(var(--spacing-04)) calc(var(--spacing-05));\n    gap: var(--spacing-03);\n    height: 3rem;\n    @include font-style(title, medium);\n  }\n\n  &__size--medium {\n    padding: calc(var(--spacing-03)) calc(var(--spacing-04));\n    gap: var(--spacing-03);\n    height: 2.25rem;\n    @include font-style(title, small);\n  }\n\n  &__size--small {\n    padding: calc(var(--spacing-02)) calc(var(--spacing-03));\n    gap: var(--spacing-02);\n    height: 1.5rem;\n    @include font-style(title, extra-small);\n  }\n\n  &__variant--primary {\n    background-color: var(--color-background-brand-default);\n    color: var(--static-white);\n    ::slotted(vds-icon) {\n      color: var(--static-white);\n      fill: var(--static-white);\n    }\n\n    &.vds-button__danger {\n      background-color: var(--color-background-danger-default);\n\n      &:active, &:active:hover {\n        background-color: var(--color-background-danger-high-press);\n        outline: none;\n      }\n      &:hover {\n        background-color: var(--color-background-danger-high-hover);\n        outline: 0.25rem solid var(--color-interaction-danger-medium);\n        outline-offset: 0;\n      }\n    }\n\n    &:active, &:active:hover {\n      background-color: var(--color-background-brand-press);\n      outline: none;\n    }\n    &:hover {\n      background-color: var(--color-background-brand-hover);\n      outline: 0.25rem solid var(--color-border-brand-hover);\n      outline-offset: 0;\n    }\n    &:disabled {\n      @include disabledButton(false);\n    }\n  }\n  &__variant--secondary {\n    background-color: transparent;\n    color: var(--color-link-default);\n    box-shadow: 0 0 0 0.125rem inset var(--color-border-brand);\n    ::slotted(vds-icon) {\n      color: var(--color-icon-brand-default);\n      fill: var(--color-icon-brand-default);\n    }\n  \n    &.vds-button__danger {\n      color: var(--color-text-danger-medium);\n      box-shadow: 0 0 0 0.125rem inset var(--color-border-danger);\n      ::slotted(vds-icon) {\n        color: var(--color-icon-danger);\n        fill: var(--color-icon-danger);\n      }\n \n      &:active, &:hover, &:active:hover {\n        background-color: var(--color-background-danger-lowest-press);\n        color: var(--color-text-danger-medium);\n        ::slotted(vds-icon) {\n          color: var(--color-icon-danger);\n          fill: var(--color-icon-danger);\n        }\n      }\n      &:hover {\n        background-color: var(--color-background-danger-lowest-hover);\n      }\n    }\n\n    &:active, &:active:hover {\n      background-color: var(--color-interaction-brand-lower);\n      color: var(--color-link-press);\n      ::slotted(vds-icon) {\n        color: var(--color-icon-brand-press);\n        fill: var(--color-icon-brand-press);\n      }\n    }\n    &:hover {\n      background-color: var(--color-interaction-brand-lowest);\n      color: var(--color-link-hover);\n      ::slotted(vds-icon) {\n        color: var(--color-icon-brand-hover);\n        fill: var(--color-icon-brand-hover);\n      }\n    }\n    &:disabled {\n      @include disabledButton(false);\n      box-shadow: 0 0 0 0.125rem inset var(--color-border-disabled);\n    }\n  }\n  &__variant--tertiary {\n    background-color: var(--surface-medium);\n    color: var(--color-text-high);\n    box-shadow: 0 0 0 0.0625rem inset var(--color-border-disabled);\n    ::slotted(vds-icon) {\n      color: var(--color-icon-high);\n      fill: var(--color-icon-high);\n    }\n\n    &:active, &:active:hover {\n      background-color: var(--surface-lower);\n    }\n    &:hover {\n      background-color: var(--surface-low);\n    }\n    &:disabled {\n      @include disabledButton(false);\n    }\n  }\n  &__variant--ghost {\n    background-color: transparent;\n    color: var(--color-link-default);\n    ::slotted(vds-icon) {\n      color: var(--color-icon-brand-default);\n      fill: var(--color-icon-brand-default);\n    }\n\n    &.vds-button__danger {\n      color: var(--color-text-danger-medium);\n      ::slotted(vds-icon) {\n        color: var(--color-icon-danger);\n        fill: var(--color-icon-danger);\n      }\n \n      &:active, &:hover, &:active:hover {\n        background-color: var(--color-background-danger-lowest-press);\n        color: var(--color-text-danger-medium);\n        ::slotted(vds-icon) {\n          color: var(--color-icon-danger);\n          fill: var(--color-icon-danger);\n        }\n      }\n      &:hover {\n        background-color: var(--color-background-danger-lowest-hover);\n      }\n    }\n\n    &:active, &:active:hover {\n      background-color: var(--color-interaction-brand-lower);\n      color: var(--color-link-press);\n      ::slotted(vds-icon) {\n        color: var(--color-icon-brand-press);\n        fill: var(--color-icon-brand-press);\n      }\n    }\n    &:hover {\n      background-color: var(--color-interaction-brand-lowest);\n      color: var(--color-link-hover);\n      ::slotted(vds-icon) {\n        color: var(--color-icon-brand-hover);\n        fill: var(--color-icon-brand-hover);\n      }\n    }\n    &:disabled {\n      @include disabledButton(true);\n    }\n  }\n  &__variant--ghost-alt {\n    background-color: transparent;\n    color: var(--color-text-high);\n\n    ::slotted(vds-icon) {\n      color: var(--color-icon-high);\n      fill: var(--color-icon-high);\n    }\n\n    &:active, &:active:hover {\n      background-color: var(--color-interaction-black-lower);\n    }\n    &:hover {\n      background-color: var(--color-interaction-black-lowest);\n    }\n    &:disabled {\n      @include disabledButton(true);\n    }\n  }\n  &__element_fullwidth {\n    width: 100%;\n    justify-content: center;\n  }\n }\n}\n\n:host-context(.vds-button--fullwidth) {\n  display: block;\n  width: auto;\n}\n","import { Component, Element, Host, Prop, h } from '@stencil/core';\nimport { shadowSubmitForm } from '../../utils/form';\nimport { combineClasses } from '../../utils/combine-classes';\nimport { cloneAttributes } from '../../utils/clone-attributes';\n\n@Component({\n  tag: 'vds-button',\n  styleUrl: 'vds-button.scss',\n  shadow: true,\n})\nexport class VdsButton {\n  /** Set button's size */\n\t@Prop() size: \"large\" | \"medium\" | \"small\" = \"medium\";\n  /** Set button's variant */\n\t@Prop() variant: \"primary\" | \"secondary\" | \"tertiary\" | \"ghost\" | \"ghost-alt\" = \"primary\";\n  /** Allow to change the button's text alignment */\n\t@Prop() textAlignment: \"right\" | \"left\" | \"center\" = \"center\";\n    /** Enable button's danger/error state */\n  @Prop() danger: boolean = false;\n  /** Enable button's disable state */\n\t@Prop() disabled: boolean = false;\n  /** Enable button's full width. This prop permits to the component will be adaptable to the container available horizontal space. */\n\t@Prop() isFullWidth: boolean = false;\n\n  @Element() hostEl: HTMLButtonElement;\n\n\thandleSubmit(event: Event): void {\n    if (this.disabled) {\n      event.preventDefault();\n      event.stopPropagation();\n      event.stopImmediatePropagation();\n    } else {\n      if (this.hostEl.getAttribute(\"type\") === \"submit\") {\n        this.submitForm();\n      }\n    }\n\t}\n\n  private submitForm(): void {\n\t\tshadowSubmitForm(this.hostEl);\n\t}\n\n  render() {\n    return (\n      <Host class={combineClasses(\n        \"vds-button\",\n        this.isFullWidth ? \"vds-button--fullwidth\" : \"\",\n        this.disabled ? \"disabled\" : \"\"\n      )}>\n        <button\n          onClick={(evt: Event) => this.handleSubmit(evt)}\n          class={combineClasses(\n            `vds-button__element`,\n            `vds-button__variant--${this.variant}`,\n            `vds-button__align--${this.textAlignment}`,\n            `vds-button__size--${this.size}`,\n            this.danger ? \"vds-button__danger\" : \"\",\n            this.disabled ? \"vds-button-disabled\" : \"\",\n            this.isFullWidth? \"vds-button__element_fullwidth\":\"\"\n          )}\n          type=\"button\"\n          disabled={ this.disabled || null}\n          {...cloneAttributes(\n\t\t\t\t\t\tthis.hostEl,\n            \"disabled\",\n            \"class\",\n            \"style\")}\n        >\n          <slot name=\"icon-left\"></slot>\n          <slot></slot>\n          <slot name=\"icon-right\"></slot>\n        </button>\n      </Host>\n    );\n  }\n\n}\n","@mixin card-variant($variant) {\n  $prefix: '--vds-card-#{$variant}-';\n  $is-default-or-secondary: $variant == 'default' or $variant == 'secondary';\n\n  @if $is-default-or-secondary {\n    border: 0.0625rem solid var(#{$prefix}border-color);\n    outline: none;\n  } @else {\n    border: 0.0625rem solid transparent;\n    &.vds__card--selectable,\n    &.vds__card--button {\n      &.vds__card--selected {\n        outline: 0.25rem solid var(#{$prefix}selected-border-color);\n      }\n      &:hover {\n        outline: 0.25rem solid var(#{$prefix}border-hover-color);\n      }\n      &:active:hover {\n        outline: none;\n      }\n    }\n  }\n\n  background-color: var(#{$prefix}background-color);\n\n  &.vds__card--selectable {\n    &.vds__card--selected {\n      @if $is-default-or-secondary {\n        border-color: var(#{$prefix}selected-border-color);\n      }\n      background-color: var(#{$prefix}selected-background-color);\n    }\n    &:is(:active, :active:hover) {\n      @if $is-default-or-secondary {\n        border-color: var(#{$prefix}selected-border-color);\n      }\n      background-color: var(#{$prefix}selected-background-color);\n    }\n  }\n\n  &.vds__card--button,\n  &.vds__card--selectable {\n    cursor: pointer;\n    &:hover {\n      @if $is-default-or-secondary {\n        border-color: var(#{$prefix}border-hover-color);\n      }\n      background-color: var(#{$prefix}background-hover-color);\n    }\n    &:is(:active, :active:hover) {\n      @if $is-default-or-secondary {\n        border-color: var(#{$prefix}border-press-color);\n      }\n      background-color: var(#{$prefix}background-press-color);\n    }\n  }\n}\n\n:host {\n  /** Tokens for style override and theming */\n\n  /** Default variant */\n  --vds-card-default-border-color: var(--color-border-lower);\n  --vds-card-default-border-hover-color: var(--color-border-lower);\n  --vds-card-default-border-press-color: var(--color-border-lower);\n  --vds-card-default-background-color: var(--surface-medium);\n  --vds-card-default-background-hover-color: var(--color-interaction-black-lowest);\n  --vds-card-default-background-press-color: var(--surface-neutral-press);\n  --vds-card-default-selected-border-color: var(--color-border-lower);\n  --vds-card-default-selected-background-color: var(--color-interaction-brand-lowest);\n\n  /** Primary variant */\n  --vds-card-primary-border-hover-color: var(--color-border-brand-hover);\n  --vds-card-primary-background-color: var(--color-background-brand-default);\n  --vds-card-primary-background-hover-color: var(--color-background-brand-hover);\n  --vds-card-primary-background-press-color: var(--color-background-brand-press);\n  --vds-card-primary-selected-border-color: var(--color-border-brand-hover);\n  --vds-card-primary-selected-background-color: var(--color-background-brand-hover);\n\n  /** Secondary variant */\n  --vds-card-secondary-border-color: var(--color-border-brand);\n  --vds-card-secondary-border-hover-color: var(--color-border-brand);\n  --vds-card-secondary-border-press-color: var(--color-border-brand);\n  --vds-card-secondary-background-color: var(--surface-medium);\n  --vds-card-secondary-background-hover-color: var(--color-interaction-brand-lowest);\n  --vds-card-secondary-background-press-color: var(--color-interaction-brand-lower);\n  --vds-card-secondary-selected-border-color: var(--color-border-brand);\n  --vds-card-secondary-selected-background-color: var(--color-interaction-brand-lowest);\n\n  /** Danger variant */\n  --vds-card-danger-border-hover-color: var(--color-interaction-danger-medium);\n  --vds-card-danger-background-color: var(--color-background-danger-default);\n  --vds-card-danger-background-hover-color: var(--color-background-danger-high-hover);\n  --vds-card-danger-background-press-color: var(--color-background-danger-high-press);\n  --vds-card-danger-selected-border-color: var(--color-interaction-danger-medium);\n  --vds-card-danger-selected-background-color: var(--color-background-danger-high-hover);\n\n  display: block;\n  .vds__card {\n    border-radius: var(--radius-medium);\n    box-sizing: border-box;\n    z-index: var(--elevation-layer-0);\n\n    &.vds__card--default {\n      @include card-variant('default');\n    }\n    &.vds__card--primary {\n      @include card-variant('primary');\n    }\n    &.vds__card--secondary {\n      @include card-variant('secondary');\n    }\n    &.vds__card--danger {\n      @include card-variant('danger');\n    }\n\n    &.vds__card--disabled {\n      pointer-events: none;\n      border: 0.0625rem solid var(--color-border-lower);\n      background-color: var(--surface-medium);\n      ::slotted(*) {\n        opacity: var(--opacity-32);\n      }\n      &.vds__card--button,\n      &.vds__card--selectable {\n        &.vds__card--selected {\n          outline: none;\n          border-color: var(--color-border-lower);\n          background-color: var(--surface-medium);\n        }\n      }\n      &:is(:hover, :active, :active:hover) {\n        background-color: var(--surface-medium);\n      }\n    }\n\n    @each $key, $value in $spacing {\n      &.padding__spacing-#{$key} {\n        padding: var(--spacing-#{$key});\n      }\n    }\n    @each $key, $value in $shadows {\n      &.shadow__elevation-shadow-#{$key} {\n        box-shadow: var(--elevation-shadow-#{$key});\n      }\n    }\n  }\n}\n\n:host-context(.vds-card--disabled) {\n  pointer-events: none;\n}","import { Component, Host, h } from '@stencil/core';\nimport { HTMLStencilElement, Prop, Event, EventEmitter, Watch } from '@stencil/core/internal';\nimport { Colors } from '../../definitions/colors';\nimport { Spacing } from '../../definitions/spacing';\nimport { ShadowBox } from '../../definitions/shadows';\nimport { combineClasses } from '../../utils/combine-classes';\n@Component({\n  tag: 'vds-card',\n  styleUrl: 'vds-card.scss',\n  shadow: true,\n})\nexport class VdsCard {\n  /** Padding of component based on volt-spacing tokens */\n  @Prop({ mutable: true }) padding: Spacing = 'spacing-05';\n  /** Selectable property allow the card to toggle between selected and unselected state.\n   * This property can't be used with the button property at the same time */\n  @Prop({ mutable: true }) selectable: boolean = false;\n  /** Sets the selected state for the card (only works when selectable property is true).\n   * This property can't be used with the button property at the same time */\n  @Prop({ mutable: true }) selected: boolean = false;\n  /** Button property allows the card to behave like a button.\n   * This property can't be used with the selectable property at the same time */\n  @Prop({ mutable: true }) button = false;\n  /** Sets the card in disabled state */\n  @Prop({ mutable: true }) disabled = false;\n  /** Allows changing the default card variant */\n  @Prop({ mutable: true }) variant: 'primary' | 'secondary' | 'danger' | 'default' = 'default';\n  /** Sets the shadow for the card */\n  @Prop({ mutable: true }) shadowBox: ShadowBox = 'elevation-shadow-1';\n\n  /**\n   * Allows changing the default border color.\n   * @deprecated This property is deprecated and will be removed from the code in the future.\n   */\n  @Prop() borderColor: Colors;\n  /**\n   * Allows changing the border color when hovering.\n   * @deprecated This property is deprecated and will be removed from the code in the future.\n   */\n  @Prop() borderHoverColor: Colors;\n\n  /** Emits event when card have been selected (only works when selectable property is true) */\n  @Event() select: EventEmitter<boolean>;\n  /** Emits event when card have been clicked on (only works when button property is true) */\n  @Event() click: EventEmitter<MouseEvent>;\n\n  @Watch('selected')\n  emitSelected(): void {\n    if (this.selectable) {\n      this.select.emit(this.selected);\n    }\n  }\n\n  @Watch('selectable')\n  @Watch('button')\n  handleBehaviorValidation(): void {\n    if (this.button && this.selectable) {\n      this.selectable = false;\n      this.selected = false;\n    }\n    if (!this.selectable && this.selected) {\n      this.selected = false;\n    }\n  }\n\n  /**\n   * Sets card's custom border colors\n   *\n   * @returns { [key: string]: string }\n   */\n  private setCustomBorderColors(): { [key: string]: string } {\n    const styles = {};\n\n    if (this.borderColor) {\n      styles['--vds-card-default-border-color'] = `var(--${this.borderColor})`;\n    }\n\n    if (this.borderHoverColor) {\n      styles['--vds-card-default-border-hover-color'] = `var(--${this.borderHoverColor})`;\n    }\n\n    return styles;\n  }\n\n  private handleSelectable(): void {\n    this.selected = !this.selected;\n  }\n\n  private handleClick(evt: MouseEvent): void {\n    if (this.button) {\n      this.click.emit(evt);\n    }\n\n    if (this.selectable) {\n      this.handleSelectable();\n    }\n  }\n\n  componentWillLoad(): void {\n    this.handleBehaviorValidation();\n  }\n\n  render(): HTMLStencilElement {\n    return (\n      <Host class={combineClasses(this.disabled ? \"vds-card--disabled\" : \"\")}>\n        <div\n          onClick={(evt: MouseEvent) => {\n            this.handleClick(evt);\n          }}\n          style={this.setCustomBorderColors()}\n          class={`\n            vds__card \n            vds__card--${this.variant}\n            padding__${this.padding}\n            shadow__${this.shadowBox}\n            ${this.selectable ? 'vds__card--selectable' : ''}\n            ${this.selectable && this.selected ? 'vds__card--selected' : ''}\n            ${this.button ? 'vds__card--button' : ''}\n            ${this.disabled ? 'vds__card--disabled' : ''}\n          `}\n        >\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n","/**\n * Custom checkbox change event to capture\n * extra keys being pressed when user clicks on the checkbox\n */\nexport class CheckboxEvent extends Boolean {\n\tconstructor(\n\t\tprivate _value = false,\n\t\tprivate _altKey = false,\n\t\tprivate _ctrlKey = false,\n\t\tprivate _metaKey = false,\n\t\tprivate _shiftKey = false\n\t) {\n\t\tsuper(_value);\n\t}\n\n\tvalueOf(): boolean {\n\t\treturn !!this._value;\n\t}\n\n\tisChecked(): boolean {\n\t\treturn !!this._value;\n\t}\n\n\tget altKey(): boolean {\n\t\treturn this._altKey;\n\t}\n\n\tget ctrlKey(): boolean {\n\t\treturn this._ctrlKey;\n\t}\n\n\tget metaKey(): boolean {\n\t\treturn this._metaKey;\n\t}\n\n\tget shiftKey(): boolean {\n\t\treturn this._shiftKey;\n\t}\n}\n\n",":host {\n  display: inline-block;\n  input {\n    outline: none;\n    border: 0;\n    appearance: none;\n    margin: 0;\n    padding: 0;\n  }\n  label {\n    cursor: pointer;\n  }\n  .vds__checkbox__container {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    cursor: pointer;\n    box-sizing: content-box;\n    border: 0.125rem solid transparent;\n    appearance: none;\n\n    .checkbox-label::part(label) {\n      cursor: pointer;\n    }\n\n    .vds__checkbox {\n      display: flex;\n    }\n    \n    &:focus-within {\n      outline: none;\n      border-radius: 0.25rem;\n      border: 0.125rem solid var(--color-border-focus-2);\n    }\n\n    &.vds__checkbox__container--size-medium {\n      gap: 0.5rem;\n      padding: calc(var(--spacing-03) - 0.125rem);\n      vds-icon {\n        width: var(--spacing-06);\n        height: var(--spacing-06);\n      }\n    }\n    &.vds__checkbox__container--size-large {\n      gap: 0.75rem;\n      padding: calc(var(--spacing-04) - 0.125rem);\n      vds-icon {\n        width: var(--spacing-07);\n        height: var(--spacing-07);\n      }\n    }\n\n    .checkbox-icon::part(svg-icon) {\n      color: var(--color-icon-medium);\n      fill: var(--color-icon-medium);\n    }\n\n    &:hover {\n      .checkbox-icon::part(svg-icon) {\n        color: var(--color-icon-high);\n        fill: var(--color-icon-high);\n      }\n    }\n    \n    &.vds__checkbox--checked {\n      .checkbox-icon::part(svg-icon) {\n        transform: scale(1.25);\n        color: var(--color-background-brand-default);\n        fill: var(--color-background-brand-default);\n      }\n      &:hover {\n        .checkbox-icon::part(svg-icon) {\n          color: var(--color-background-brand-hover);\n          fill: var(--color-background-brand-hover);\n        }\n      }\n    }\n\n    &.vds__checkbox--indeterminate {\n      .checkbox-icon::part(svg-icon) {\n        transform: scale(1.25);\n        color: var(--color-icon-medium);\n        fill: var(--color-icon-medium);\n      }\n    }\n  \n    &.vds__checkbox--error {\n      .checkbox-icon::part(svg-icon) {\n        color: var(--color-background-danger-default);\n        fill: var(--color-background-danger-default);\n      }\n      &:hover {\n        .checkbox-icon::part(svg-icon) {\n          color: var(--color-background-danger-high-hover);\n          fill: var(--color-background-danger-high-hover);\n        }\n      }\n    }\n\n    &.vds__checkbox--disabled {\n      pointer-events: none;\n      .checkbox-icon::part(svg-icon) {\n        color: var(--color-icon-disabled);\n        fill: var(--color-icon-disabled);\n      }\n    }\n  }\n}\n","import { Component, Host, h } from \"@stencil/core\";\nimport { HTMLStencilElement, Prop, Method, Event, EventEmitter, Element, AttachInternals, Watch } from \"@stencil/core/internal\";\nimport { combineClasses } from \"../../utils/combine-classes\";\nimport { CheckboxEvent } from \"./vds-checkbox.utils\";\n@Component({\n  tag: \"vds-checkbox\",\n  styleUrl: \"vds-checkbox.scss\",\n  shadow: true,\n  formAssociated: true\n})\nexport class VdsBasicCheckbox {\n  /** Sets the text to be shown in the checkbox */\n  @Prop({ reflect: true, mutable: true }) labelValue: string;\n  /** Sets the checkbox in checked state */\n  @Prop({ reflect: true, mutable: true }) checked: boolean = false;\n  /** Sets the checkbodx in indeterminate state */\n  @Prop({ reflect: true, mutable: true }) indeterminate: boolean = false;\n  /** Sets the checkbox in disabled state */\n  @Prop({ reflect: true, mutable: true }) disabled: boolean = false;\n  /** Sets the checkbox in error state */\n  @Prop({ reflect: true, mutable: true }) error: boolean = false;\n  /** Sets the checkbox's size */\n  @Prop({ mutable: true }) size: \"medium\" | \"large\" = \"medium\";\n  /** Toggles the required sign in the field */\n  @Prop({ mutable: true }) isRequired: boolean = false;\n  /** Sets the value in the input. Usually uses checked prop as string. \n   *  Used to manage Reactive forms and other native functionality */\n  @Prop({ reflect: true, mutable: true }) value: string;\n\n  @Element() hostEl: HTMLElement;\n\n  @AttachInternals() internals: ElementInternals;\n\n /**\n  * Event which is triggered when checkbox state changes. This event also captures if\n  * any of the special keys (shift, ctrl, meta or alt) where pressed when the checkbox state\n  * changed. Use CheckboxEvent.isChecked() or\n  * checkbox.on('checkboxEvent', (event : CustomEvent<CheckboxEvent>) => {\n  *\t\tif(event.detail == true) {\n  *\t\t\tconsole.log('Checked');\n  * \t\t}\n  * console.log(event.detail.altKey);\n  * console.log(event.detail.shiftKey);\n  * console.log(event.detail.ctrlKey);\n  * })\n  *\n  */\n  @Event() checkboxChange: EventEmitter<CheckboxEvent>;\n  /** Makes a custom change to target property using checked and indeterminate (use for React components) */\n  @Event() check: EventEmitter<boolean>;\n\n  private state: \"checked\" | \"unchecked\" | \"indeterminate\" = \"unchecked\";\n\n  componentWillRender(): void {\n    this.setCheckboxState();\n  }\n\n  componentDidLoad(): void {\n    if (this.internals && !!this.internals.setFormValue) {\n      this.internals.setFormValue(this.checked.toString());\n    }\n  }\n\n  /**\n   * Executes every time checked value changes.\n   * Sets indeterminate value to false in order to guarantee a change in value.\n   * Sets form value in order to work properly with native forms\n   *\n   * @returns void\n   */\n  @Watch(\"checked\")\n  setCheckedStates(): void {\n    this.indeterminate = false;\n    if (this.internals && !!this.internals.setFormValue) {\n      this.internals.setFormValue(this.checked.toString());\n    }\n  }\n\n  /**\n   * Executes every time the checkbox is being click.\n   * Executes toggleCheck method.\n   *\n   * @param event - MouseEvent\n   * @returns void\n   */\n\thandleClick(event: MouseEvent): void {\n\t\tthis.toggleCheck(event);\n\t}\n\n   /**\n   * Toggles checkbox value.\n   * Emits checkboxChange event with CheckboxEvent value.\n   * Emits check event with checked value.\n   *\n   * @param evt - KeyboardEvent | MouseEvent\n   * @returns Promise<void>\n   */\n  @Method()\n  toggleCheck(evt?: KeyboardEvent | MouseEvent): Promise<void> {\n    if (!this.disabled) {\n      const inputEvent = new InputEvent(\"input\");\n\t\t\tthis.checked = !this.checked;\n      this.value = this.checked.toString();\n\t\t\tthis.indeterminate = false;\n\t\t\tthis.checkboxChange.emit(\n\t\t\t\tnew CheckboxEvent(\n\t\t\t\t\tthis.checked,\n\t\t\t\t\tevt?.altKey,\n\t\t\t\t\tevt?.ctrlKey,\n\t\t\t\t\tevt?.metaKey,\n\t\t\t\t\tevt?.shiftKey\n\t\t\t\t)\n\t\t\t);\n\t\t\tthis.check.emit(this.checked);\n      this.hostEl.dispatchEvent(inputEvent);\n\t\t}\n    return Promise.resolve();\n  }\n\n  /**\n   * Determine state of the checkbox based on the indeterminate and checked properties.\n   * When indetermanate is true, state is indeterminate.\n   * When indetermanate is false and checked is true, state is checked.\n   * When indetermanate is false and checked is false, state is unchecked.\n   *\n   * @returns void\n   */\n  private setCheckboxState(): void {\n    this.state = this.indeterminate ? \"indeterminate\" : this.checked ? \"checked\" : \"unchecked\";\n  }\n\n  /**\n   * Returns the icon prop based on the state and calculate the size.\n   *\n   * @returns HTMLStencilElement\n   */\n  private renderCheckbox(): HTMLStencilElement {\n    const size = this.size === \"large\" ? \"1.5rem\" : \"1.25rem\";\n    const disabledClass = this.disabled ? \"checkbox-icon-disabled\" : \"\";\n    switch(this.state) {\n      case \"checked\":\n        return <vds-icon class={`checkbox-icon checkbox-icon-checked ${disabledClass}`} svgIcon={`checked`} size={size}></vds-icon>;\n      case \"indeterminate\":\n        return <vds-icon class={`checkbox-icon checkbox-icon-indeterminate ${disabledClass}`} svgIcon={`indeterminate`} size={size}></vds-icon>\n      default:\n        return <vds-icon class={`checkbox-icon ${disabledClass}`} svgIcon={`unchecked`} size={size}></vds-icon>;; \n    }\n  }\n\n   /**\n   * Returns the vds-label for the checkbox when there is a label provided.\n   *\n   * @returns HTMLStencilElement\n   */\n  private renderLabel(): HTMLStencilElement {\n    return <vds-label class={\"checkbox-label\"} labelValue={this.labelValue} required={this.isRequired} size={this.size} disabled={this.disabled}></vds-label>\n  }\n\n  render(): HTMLStencilElement {\n    return (\n      <Host state={this.state}>\n        <div\n          onClick={(evt): void => {this.handleClick(evt)}}\n          class={combineClasses(\n            \"vds__checkbox__container\",\n            `vds__checkbox__container--size-${this.size}`,\n            this.checked && !this.indeterminate ? \"vds__checkbox--checked\" : \"\",\n            this.indeterminate ? \"vds__checkbox--indeterminate\" : \"\",\n            this.disabled ? \"vds__checkbox--disabled\" : \"\",\n            this.error ? \"vds__checkbox--error\" : \"\",\n          )}\n        >\n          <div class=\"vds__checkbox\">\n            <input\n              type={\"checkbox\"}\n              checked={this.checked}\n              value={this.value}\n              id={this.hostEl?.id}\n              disabled={this.disabled} />\n            {this.renderCheckbox()}\n          </div>\n          {this.labelValue && this.renderLabel()}\n        </div>\n      </Host>\n    );\n  }\n}\n",":host(.horizontal) {\n  width: 100%;\n  height: fit-content;\n}\n:host(.vertical) {\n  width: fit-content;\n  height: 100%;\n}\n:host {\n  display: block;\n  .vds__divider--container-horizontal {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding-top: var(--spacing-03);\n    padding-bottom: var(--spacing-03);\n    overflow: hidden;\n    height: fit-content;\n  }\n  .vds__divider--container-vertical {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding-left: var(--spacing-03);\n    padding-right: var(--spacing-03);\n    overflow: hidden;\n    width: fit-content;\n    height: 100%;\n  }\n\n  .vds__divider--line {\n    background-color: var(--divider-border-color);\n    border-radius: var(--radius-sharp);\n    box-sizing: border-box;\n    flex-grow: 1;\n  }\n  .vds__divider--orientation-horizontal {\n    margin-left: var(--divider-padding);\n    margin-right: var(--divider-padding);\n    width: 100%;\n    height: var(--divider-border-width);\n  }\n  .vds__divider--orientation-vertical {\n    margin-top: var(--divider-padding);\n    margin-bottom: var(--divider-padding);\n    width: var(--divider-border-width);\n    align-self: stretch;\n  }\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\nimport { Spacing } from '../../definitions/spacing';\nimport { combineClasses } from '../../utils/combine-classes';\nimport { BorderColors } from '../../definitions/colors';\nimport { BorderThickness } from '../../definitions/thickness';\n\n@Component({\n  tag: 'vds-divider',\n  styleUrl: 'vds-divider.scss',\n  shadow: true,\n})\nexport class VdsDivider {\n  /** Define divider padding using our spacing system */\n  @Prop() padding: Spacing = 'spacing-03';\n  /** Define divider orientation horizontal or vertical */\n  @Prop() orientation: 'horizontal' | 'vertical' = 'horizontal';\n  /** Set the divider line color */\n  @Prop() color: BorderColors = 'color-border-low';\n  /** Set the divider line thickness */\n  @Prop() thickness: BorderThickness = 'border-thickness-01';\n\n  private setDividerStyle() {\n    return {\n      '--divider-padding': `var(--${this.padding})`,\n      '--divider-border-color': `var(--${this.color})`,\n      '--divider-border-width': `var(--${this.thickness})`,\n    };\n  }\n\n  render() {\n    return (\n      <Host class={combineClasses(this.orientation)} style={this.setDividerStyle()}>\n        <div class={combineClasses(\n          'vds__divider--container-' + this.orientation\n            )}>\n          <div class={combineClasses(\n            'vds__divider--line',\n            'vds__divider--orientation-' + this.orientation\n            )}>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n",":host {\n  display: block;\n  height: 100vh;\n  width: 100%;\n\n  --vds-drawer-background-color: var(--surface-medium);\n  --vds-drawer-border-color: var(--color-border-lowest);\n  --vds-drawer-backdrop-background-color: var(--color-interaction-black-lower);\n\n  .volt__drawer {\n    display: none;\n    margin: 0;\n    padding: 0;\n    height: 100%;\n    border-radius: var(--radius-sharp);\n    background: var(--vds-drawer-background-color);\n    transition: left 0.3 ease-in-out;\n\n    vds-icon-button {\n      display: flex;\n      justify-content: end;\n    }\n\n    &.volt__drawer--opened {\n      display: block;\n    }\n\n    @each $key, $value in $spacing {\n      &.padding__spacing-#{$key} {\n        padding: var(--spacing-#{$key});\n      }\n    }\n\n    .volt__drawer--header {\n      display: flex;\n      justify-content: end;\n\n      .volt__drawer--header-content {\n        flex-grow: 1;\n      }\n\n      &.volt__drawer--header-close-icon {\n        gap: var(--spacing-03);\n        align-items: start;\n      }\n    }\n    .volt__drawer--content {\n      display: flex;\n      flex-direction: column;\n      height: 100%;\n      overflow-y: auto;\n      z-index: var(--elevation-layer-5);\n      .volt-drawer__body {\n        flex-grow: 1;\n      }\n    }\n  }\n\n  .vds-drawer__dropdown-is-opened {\n    ::slotted([slot=\"drawer\"]) {\n      position: relative;\n    }\n  }\n\n  .volt__drawer__container {\n    .volt__drawer--backdrop {\n      position: absolute;\n      top: 0;\n      width: 100%;\n      height: 100%;\n      background: var(--vds-drawer-backdrop-background-color);\n      z-index: var(--elevation-layer-4);\n    }\n    .volt__drawer--backdrop-adaptable {\n      position: fixed;\n      top: 0;\n      width: 100%;\n      height: 100%;\n      background: var(--vds-drawer-backdrop-background-color);\n      z-index: var(--elevation-layer-4);\n    }\n  }\n\n  .vds-drawer__border--left {\n    border-right: 0.0625rem solid var(--vds-drawer-border-color);\n  }\n\n  .vds-drawer__border--right {\n    border-left: 0.0625rem solid var(--vds-drawer-border-color);\n  }\n\n  .vds-drawer__shadow--left {\n    box-shadow: var(--elevation-shadow-1);\n  }\n\n  .vds-drawer__shadow--right {\n    box-shadow: var(--elevation-shadow-1);\n  }\n}\n\n:host(.vds-drawer__over) {\n  position: relative;\n\n  .volt__drawer {\n    position: fixed;\n    z-index: var(--elevation-layer-5);\n\n    &.volt__drawer__element--position-right {\n      right: 0;\n    }\n\n    &.volt__drawer__element--position-left {\n      left: 0;\n    }\n  }\n\n  .volt__drawer__container {\n    position: absolute;\n    top: 0;\n    width: 100%;\n    height: 100%;\n  }\n}\n\n:host(.vds-drawer__side) {\n  display: flex;\n\n  .volt__drawer {\n    z-index: var(--elevation-layer-5);\n  }\n\n  .volt__drawer__container {\n    width: 100%;\n  }\n}\n\n:host(.vds-drawer__side.vds-drawer__right) {\n  flex-direction: row-reverse;\n}\n\n:host(.vds-drawer__side.vds-drawer__left) {\n  flex-direction: row;\n}\n\n:host(.vds-drawer--adaptable) {\n  height: 100%;\n  .volt__drawer {\n    box-sizing: border-box;\n  }\n}\n","import { Component, Host, h } from '@stencil/core';\nimport { HTMLStencilElement, Prop, Method, EventEmitter, Event, Watch, Listen, State } from '@stencil/core/internal';\nimport { Spacing } from '../../definitions/spacing';\nimport { combineClasses } from '../../utils/combine-classes';\n\n@Component({\n  tag: 'vds-drawer',\n  styleUrl: 'vds-drawer.scss',\n  shadow: true,\n})\nexport class VdsDrawer {\n  /** Opens/closes the drawer */\n  @Prop({ mutable: true }) opened: boolean;\n  /** Toggles close button in the drawer */\n  @Prop({ mutable: true }) showCloseButton: boolean;\n  /** Disables the close button in the drawer */\n  @Prop({ mutable: true }) disableClose: boolean;\n  /** Places the drawer in the screen */\n  @Prop({ mutable: true }) position: 'left' | 'right' = 'left';\n  /** Toggles backdrop behind the drawer in the screen */\n  @Prop({ mutable: true }) backdrop: boolean;\n  /** Adds the padding to the drawer */\n  @Prop({ mutable: true }) padding: Spacing;\n  /** Mode of the drawer; one of 'over' or 'side'. */\n  @Prop({ mutable: true }) mode: 'over' | 'side' = 'over';\n  /** Allow the vds-drawer to fit inside another html element */\n  @Prop() isAdaptable = false;\n  /** Allow show or hide the shadow of the drawer */\n  @Prop() showShadow: boolean = true;\n  // Allow display the border of the sidenav\n  @Prop() showBorder: boolean = false;\n\n  /** Emits event when drawer is closed */\n  @Event() drawerClosed: EventEmitter<void>;\n  /** Emits event when drawer is opened */\n  @Event() drawerOpened: EventEmitter<void>;\n\n  @State() dropdownIsOpened: boolean = false;\n\n  @Watch('opened')\n  emitValue(): void {\n    if (this.opened) this.drawerOpened.emit();\n    else this.drawerClosed.emit();\n  }\n\n  @Listen('opened', { target: 'window' })\n  @Listen('closed', { target: 'window' })\n  setPositionRelativeForDropdowns(evt: CustomEvent<boolean>): void {\n    const target = (evt.target) as HTMLElement;\n    if(\n        target.nodeName === \"VDS-BASIC-DROPDOWN\" || \n        target.nodeName === \"VDS-DROPDOWN\" || \n        target.nodeName === \"VDS-BASIC-DROPDOWN-MULTISELECT\" ||\n        target.nodeName === \"VDS-DROPDOWN-MULTISELECT\" ||\n        target.nodeName === \"VDS-BASIC-AUTOCOMPLETE\" || \n        target.nodeName === \"VDS-AUTOCOMPLETE\"\n      ) {\n      this.dropdownIsOpened = evt.type === \"opened\";\n    }\n  }\n\n  @Method()\n  open(): Promise<void> {\n    return new Promise(resolve => {\n      this.opened = true;\n      resolve();\n    });\n  }\n\n  @Method()\n  close(): Promise<void> {\n    return new Promise(resolve => {\n      if (!this.disableClose) {\n        this.opened = false;\n      }\n      resolve();\n    });\n  }\n\n  private renderBackdrop(): HTMLStencilElement {\n    return this.isAdaptable ? <div class={`volt__drawer--backdrop-adaptable`}></div> : <div class={`volt__drawer--backdrop`}></div>;\n  }\n\n  private renderCloseIcon(): HTMLStencilElement {\n    return (\n      <vds-icon-button\n        onClick={() => {\n          this.close();\n        }}\n        variant={'secondary'}\n        icon=\"close\"\n        disabled={this.disableClose}\n        size=\"large\"\n      ></vds-icon-button>\n    );\n  }\n\n  render(): HTMLStencilElement {\n    return (\n      <Host class={combineClasses(`vds-drawer__${this.mode}`, `vds-drawer__${this.position}`, this.isAdaptable ? 'vds-drawer--adaptable' : '')}>\n        <div\n          class={combineClasses(\n            'volt__drawer',\n            `padding__${this.padding}`,\n            this.opened ? 'volt__drawer--opened' : '',\n            `volt__drawer__element--position-${this.position}`,\n            this.showShadow ? `vds-drawer__shadow--${this.position}` : '',\n            this.showBorder ? `vds-drawer__border--${this.position}` : '',\n            this.dropdownIsOpened ? \"vds-drawer__dropdown-is-opened\" : \"\"\n          )}\n        >\n          \n          <div class={`volt__drawer--content`}>\n            <div\n              class={`volt__drawer--header ${this.showCloseButton ? \"volt__drawer--header-close-icon\" : \"\"}`}\n            >\n              <div class={\"volt__drawer--header-content\"}>\n                <slot name=\"header\" />\n              </div>\n              {this.showCloseButton && this.renderCloseIcon()}\n            </div>\n            <div class={`volt-drawer__body`}>\n              <slot name=\"drawer\" />\n            </div>\n            <slot name=\"footer\" />\n          </div>\n        </div>\n        <div class={'volt__drawer__container'}>\n          {this.backdrop && this.opened ? this.renderBackdrop() : ''}\n          <slot name=\"container\" />\n        </div>\n      </Host>\n    );\n  }\n}\n","@import '~@volt/volt-foundations/dist/volt-foundations/volt-foundations';\n@import '../base-group-header/base-group-header.scss';\n\n:host {\n  display: block;\n  width: 100%;\n}","import { Component, Host, Prop, h } from '@stencil/core';\nimport { GroupHeaderSize, generateGroupHeaderContainer } from '../base-group-header/base-group-header';\n\n@Component({\n  tag: 'vds-dropdown-group-header',\n  styleUrl: 'vds-dropdown-group-header.scss',\n  shadow: true,\n})\nexport class VdsDropdownGroupHeader {\n  /** Size of the group header */\n  @Prop() size: GroupHeaderSize = 'medium';\n\n  render() {\n    return (\n      <Host>\n        {generateGroupHeaderContainer(this.size)}\n      </Host>\n    );\n  }\n}\n","export function format(first: string, middle: string, last: string): string {\n  return (first || '') + (middle ? ` ${middle}` : '') + (last ? ` ${last}` : '');\n}\n\n/**\n * Handles a click event on a reference element and opens a link in a new window.\n *\n * @param {string} linkRef - The reference string for the link to open. (Optional if no link action desired)\n * @param {\"_self\" | \"_blank\" | \"_parent\" | \"_top\"} [linkTarget=\"_self\"] - The target window for the link.\n * @param {string} linkRel - The relationship type for the link.\n * \n * @returns {void}\n */\nexport const handleRefClick = (\n    linkRef: string,\n    linkTarget: \"_self\" | \"_blank\" | \"_parent\" | \"_top\" = \"_self\",\n    linkRel: string\n): void => {\n    if (linkRef) {\n        const link = document.createElement('a');\n        link.href = linkRef;\n        link.target = linkTarget;\n        link.rel = linkRel;\n        document.body.appendChild(link);\n        link.click();\n        document.body.removeChild(link);\n    }\n}","@import '~@volt/volt-foundations/dist/volt-foundations/volt-foundations';\n@import '../base-item/base-item.scss';\n\n:host {\n  display: block;\n  .vds-dropdown-item{\n    @include baseItem();\n    &.vds-dropdown-item--size-small {\n      @include baseItemSizeSmall();\n      .vds-dropdown-item__content {\n        @include baseItemContent(small);\n      }\n    }\n    &.vds-dropdown-item--size-medium {\n      @include baseItemSizeMedium();\n      .vds-dropdown-item__content {\n        @include baseItemContent(medium);\n      }\n    }\n    &.vds-dropdown-item--size-large {\n      @include baseItemSizeLarge();\n      .vds-dropdown-item__content {\n        @include baseItemContent(large);\n      }\n    }\n    &.vds-dropdown-item--active {\n      @include baseItemActive();\n      &.vds-dropdown-item--danger {\n        @include baseItemBackgroundDanger();\n      }\n    }\n    &.vds-dropdown-item--danger {\n      @include baseItemDanger();\n    }\n    &.vds-dropdown-item--disabled {\n      @include baseItemDisabled();\n      &.vds-dropdown-item--danger {\n        @include baseItemDisabled();\n      }\n    }\n  }\n}\n\n:host(.vds-dropdown-item--disabled) {\n  pointer-events: none;\n}\n\n","import { Component, Host, h, Prop, Event, Element, EventEmitter } from '@stencil/core';\nimport { HTMLStencilElement, Watch } from '@stencil/core/internal';\nimport { combineClasses } from '../../utils/combine-classes';\nimport { handleRefClick } from '../../utils/utils';\nimport { DropdownItemClickedEvent } from './vds-dropdown-item-clicked-event';\nimport { generateCheckbox, generateCheckmarkIconButton, generateInformativeIcon, generateLabel } from '../base-item/base-item';\n\n@Component({\n  tag: 'vds-dropdown-item',\n  styleUrl: 'vds-dropdown-item.scss',\n  shadow: true,\n})\nexport class VdsDropdownItem {\n  /** Puts the VdsDropdownItem in disabled state */\n  @Prop({ mutable: true }) disabled: boolean = false;\n  /** Define the icon value */\n  @Prop({ mutable: true }) informativeIcon: string;\n  /** Define item as active when is true */\n  @Prop({ mutable: true }) isActive: boolean = false;\n  /** Defines the element as a link */\n  @Prop({ mutable: true }) linkHref: string = null;\n  /** Sets the link target value */\n  @Prop({ mutable: true }) linkTarget: '_self' | '_blank' | '_parent' | '_top' = '_self';\n  /** Sets the link rel value */\n  @Prop({ mutable: true }) linkRel: string = null;\n  /** Define item value */\n  @Prop({ mutable: true, reflect: true }) value: string;\n  /** Define item label */\n  @Prop({ mutable: true, reflect: true }) label: string;\n  /** Define aria-label */\n  @Prop({ mutable: true, reflect: true }) setAriaLabel: string;\n  /** Set size of menu item */\n  @Prop({ mutable: true }) size: 'small' | 'medium' | 'large' = 'medium';\n  /** Shows checkmark */\n  @Prop({ mutable: true }) hasCheckmark: boolean = false;\n  /** Set state of checkmark */\n  @Prop({ mutable: true, reflect: true }) isSelected: boolean = false;\n  /** When has-checkmark is true, sets the checks element as checkmark or checkbox.  */\n  @Prop() checkmarkVariant: 'checkbox' | 'checkmark' = 'checkmark';\n  /** When has-checkmark is true, sets the checks element at the beginning or end.  */\n  @Prop() checkmarkAlignment: 'start' | 'end' = 'start';\n  /** Sets the dropdown item to danger state.  */\n  @Prop({ mutable: true, reflect: true }) danger: boolean = false;\n\n  /** Emits event when item gets clicked */\n  @Event() dropdownItemClicked: EventEmitter<DropdownItemClickedEvent>;\n  /** Emits event when item is selected */\n  @Event() selected: EventEmitter<MouseEvent>;\n  /** Emits event when item is deselected */\n  @Event() deselected: EventEmitter<MouseEvent>;\n\n  @Element() hostEl: HTMLElement;\n\n  @Watch('isSelected')\n  updateItemState() {\n    this.isActive = this.isSelected;\n  }\n\n  private handleClick(evt: MouseEvent): void {\n    handleRefClick(this.linkHref, this.linkTarget, this.linkRel);\n    this.handleSelected(evt);\n    this.dropdownItemClicked.emit({\n      value: this.value,\n      label: this.label,\n      icon: this.informativeIcon,\n      event: evt,\n      selected: this.isSelected,\n    });\n  }\n\n  private handleSelected(evt: MouseEvent): void {\n    if (this.isSelected) this.selected.emit(evt);\n    else this.deselected.emit(evt);\n  }\n\n  private generateCheckmarkIconButton() {\n    return generateCheckmarkIconButton(this.isSelected, this.size, this.disabled, this.isActive, this.danger);\n  }\n\n  private generateCheckbox() {\n    return generateCheckbox(this.isSelected, this.size, this.disabled, this.isActive, this.danger);\n  }\n\n  private generateInformativeIcon() {\n    return generateInformativeIcon(this.informativeIcon, this.value, this.size, this.disabled, this.isActive, this.danger);\n  }\n\n  private generateLabel() {\n    return generateLabel(this.label, this.size, this.disabled, this.isActive, this.danger);\n  }\n\n  private setAriaLabelText() {\n    return this.setAriaLabel ? this.setAriaLabel : this.label ? this.label : this.value;\n  }\n\n  render(): HTMLStencilElement {\n    return (\n      <Host class={this.disabled ? 'vds-dropdown-item--disabled' : ''}>\n        <button\n          type=\"button\"\n          tabindex=\"0\"\n          disabled={this.disabled}\n          title={this.setAriaLabelText()}\n          aria-label={this.setAriaLabelText()}\n          onClick={(evt: MouseEvent) => {\n            if (this.disabled) {\n              evt.stopPropagation();\n              evt.preventDefault();\n            } else {\n              this.handleClick(evt);\n            }\n          }}\n          class={combineClasses(\n            'vds-dropdown-item',\n            `vds-dropdown-item--size-${this.size}`,\n            this.disabled ? 'vds-dropdown-item--disabled' : '',\n            this.isActive || this.isSelected ? 'vds-dropdown-item--active' : '',\n            this.danger ? 'vds-dropdown-item--danger' : '',\n            `vds-dropdown-item__alignment-${this.checkmarkAlignment}`,\n          )}\n        >\n          <div class=\"vds-dropdown-item__content\">\n            {this.checkmarkAlignment === 'start' && this.hasCheckmark\n              ? this.checkmarkVariant === 'checkmark'\n                ? this.generateCheckmarkIconButton()\n                : this.generateCheckbox()\n              : null}\n            {this.informativeIcon && this.generateInformativeIcon()}\n            {this.generateLabel()}\n            {this.checkmarkAlignment === 'end' && this.hasCheckmark ? (this.checkmarkVariant === 'checkmark' ? this.generateCheckmarkIconButton() : this.generateCheckbox()) : null}\n          </div>\n        </button>\n      </Host>\n    );\n  }\n}\n","@import '~@volt/volt-foundations/dist/volt-foundations/volt-foundations.scss';\n\n@mixin helper-text-small {\n  font-feature-settings: 'clig' off, 'liga' off;\n  @include font-style(body, small);\n}\n\n@mixin helper-text-medium {\n  font-feature-settings: 'clig' off, 'liga' off;\n  @include font-style(body, small);\n}\n\n@mixin helper-text-large {\n  font-feature-settings: 'clig' off, 'liga' off;\n  @include font-style(body, medium);\n}\n\n:host {\n  display: block;\n\n  .vds__field__container {\n    display: flex;\n    justify-content: start;\n    flex-direction: column;\n    gap: var(--spacing-02);\n\n    .vds__field--helper-text {\n      display: block;\n      color: var(--color-text-medium);\n    }\n\n    .vds__field--error-message {\n      display: block;\n      color: var(--color-text-danger-medium);\n    }\n     &.vds__field__container--size-small {\n      .vds__field--helper-text {\n        @include helper-text-small();\n      }\n  \n      .vds__field--error-message {\n        @include helper-text-small();\n      }\n    }\n\n    &.vds__field__container--size-medium {\n      .vds__field--helper-text {\n        @include helper-text-medium();\n      }\n  \n      .vds__field--error-message {\n        @include helper-text-medium();\n      }\n    }\n    &.vds__field__container--size-large {\n      .vds__field--helper-text {\n        @include helper-text-large();\n      }\n  \n      .vds__field--error-message {\n        @include helper-text-large();\n      }\n    }\n    &.vds__field__container--disabled {\n      .vds__field--helper-text,\n      .vds__field--error-message {\n        color: var(--color-text-disabled);\n      }\n    }\n    @each $colorName, $palette in $volt-palettes {\n      @each $shadeName, $hex in $palette {\n        @if ($shadeName == main) {\n          .vds__field--helper-text-#{$colorName}-main {\n            color: $hex;\n          }\n        } @else {\n          .vds__field--helper-text-#{$colorName}-#{$shadeName} {\n            color: $hex;\n          }\n        }\n      }\n    }\n  }\n}\n\n:host-context(.vds-field--disabled) {\n  pointer-events: none;\n}","import { Component, Host, h } from '@stencil/core';\nimport { HTMLStencilElement, Prop } from '@stencil/core/internal';\nimport { Colors } from '../../definitions/colors';\nimport { combineClasses } from '../../utils/combine-classes';\n\n@Component({\n  tag: 'vds-field',\n  styleUrl: 'vds-field.scss',\n  shadow: true,\n})\nexport class VdsField {\n  /** Sets the field's label */\n  @Prop() label: string\n  /** Toggles the required sign in the field */\n  @Prop({ mutable: true }) isRequired: boolean = false \n  /** Sets the field in disabled state */\n  @Prop({ mutable: true }) isDisabled: boolean = false \n  /** Sets the field's helper text */\n  @Prop({ mutable: true }) helperText: string;\n  /** Sets the field's helper text color */\n  @Prop({ mutable: true }) helperTextColor: Colors;\n  /** Sets the field's error message */\n  @Prop({ mutable: true }) errorMessage: string;\n  /** Sets the field's size */\n  @Prop() size: \"small\" | \"medium\" | \"large\" = \"medium\";\n\n  private getLabel(): HTMLStencilElement | null {\n    if (!this.label) return null;\n\n    return (\n      <vds-label \n        labelValue={this.label}\n        required={this.isRequired}\n        size={this.size}\n      >\n      </vds-label>\n    );\n  }\n\n  private getHelperText(): HTMLStencilElement | null {\n    if (!this.helperText) return null;\n\n    return (\n      <span \n        class={`vds__field--helper-text ${this.helperTextColor ? `vds__field--helper-text-${this.helperTextColor}` : \"\"}`}>\n          {this.helperText}\n      </span>\n    );\n  }\n\n  render(): HTMLStencilElement {\n    return (\n      <Host class={this.isDisabled ? \"vds-field--disabled\" : \"\"}>\n        <div \n          class={\n            combineClasses(\"vds__field__container\",\n            `vds__field__container--size-${this.size}`,\n            `${this.isDisabled ? \"vds__field__container--disabled\" : \"\"}`)}\n        >\n          {this.getLabel()}\n          <slot></slot>\n          {this.getHelperText()}\n          {this.errorMessage && <span class={\"vds__field--error-message\"}>{this.errorMessage}</span>}\n        </div>\n      </Host>\n    );\n  }\n}\n","/**\n * Converts an SVG string to a base64-encoded string.\n *\n * @param {string} svgContent - The SVG content to convert.\n * @returns {string} The base64-encoded SVG string.\n */\nexport const ConvertSvgStringToBase64 = (svgContent: string): string => {\n    const strippedSvgContent = svgContent.replace(/\"/g, \"'\");\n    const base64 = btoa(strippedSvgContent);\n    return `data:image/svg+xml;base64,${base64}`;\n}\n\n/**\n * Generates a VDS SVG string by removing specified attributes.\n *\n * @param {string} svgContent - The original SVG content.\n * @param {boolean} [removeSize=true] - Whether to remove width and height attributes.\n * @param {boolean} [removeColors=true] - Whether to remove fill, background, and color attributes.\n * @returns {string} The modified SVG content.\n */\nexport const GenerateVdsSvg = (svgContent: string, removeSize = true, removeColors = true): string => {\n    const fill = new RegExp(/fill=\"[a-zA-Z0-9:;#\\.\\s\\(\\)\\-\\,]*\"/g);\n    const width = new RegExp(/ width=\"[a-zA-Z0-9:;#\\.\\s\\(\\)\\-\\,]*\"/g);\n    const height = new RegExp(/height=\"[a-zA-Z0-9:;#\\.\\s\\(\\)\\-\\,]*\"/g);\n    const background = new RegExp(/background:[a-zA-Z0-9:;#\\.\\s\\(\\)\\-\\,]*/g);\n    let content = svgContent;\n\n    if (removeSize) {\n        content = content.replace(width, \"\").replace(height, \"\");\n    }\n\n    if (removeColors) {\n        content = content.replace(fill, \"\").replace(background, \"\");\n    }\n\n    return content;\n}","@import '~@volt/volt-foundations/dist/volt-foundations/volt-foundations.scss';\n\n:host {\n  display: block;\n}\n\n:host-context(.checkbox-icon-checked:not(.checkbox-icon-disabled)) {\n  path:last-child {\n    fill: var(--static-white);\n    color: var(--static-white);\n  }\n}\n\n:host-context(.checkbox-icon-indeterminate:not(.checkbox-icon-disabled)) {\n  path:last-child {\n    fill: var(--static-white);\n    color: var(--static-white);\n  }\n}\n\n:host-context(.radio-button-icon-checked) {\n  path:nth-child(2) {\n    fill: var(--color-icon-white-high);\n    color: var(--color-icon-white-high);\n  }\n}\n\n:host-context(.slider-thumb) {\n  g {\n    path:nth-child(1) {\n      fill: var(--color-icon-white-high);\n      color: var(--color-icon-white-high);\n    }\n    path:nth-child(2) {\n      fill: var(--color-border-low);\n      color: var(--color-border-low);\n    }\n  }\n}\n\n@each $colorName, $_ in map-get($volt-themes, \"light\") {\n  :host(.color-#{$colorName}) {\n    fill: var(--#{$colorName});\n  }\n}\n\n@each $colorName, $palette in $volt-palettes {\n  @each $shadeName, $hex in $palette {\n    :host(.color-#{$colorName}-#{$shadeName}) {\n      fill: $hex;\n    }\n\n    @if ($shadeName == main) {\n      .color-#{$colorName} {\n        fill: $hex;\n      }\n\n      :host(.color-#{$colorName}) {\n        color: $hex;\n      }\n    }\n  }\n}\n\n@each $colorName, $_ in $global {\n  :host(.color-#{$colorName}) {\n    fill: var(--static-#{$colorName});\n  }\n}","import { Component, Host, h } from '@stencil/core';\nimport { Element, HostElement, Prop } from '@stencil/core/internal';\nimport * as svgs from '../../constants/icon-sprite';\nimport { Colors, IconColors } from '../../definitions/colors';\nimport { combineClasses } from '../../utils/combine-classes';\nimport { GenerateVdsSvg } from '../../utils/icon-generation.utils';\n\n@Component({\n  tag: 'vds-icon',\n  styleUrl: 'vds-icon.scss',\n  shadow: true,\n})\nexport class VdsIcon {\n  /** Set svg icon name to display */\n  @Prop({ mutable: true }) svgIcon: string;\n  /** Set icon size in px or rem, IE: 1.25rem */\n  @Prop({ mutable: true }) size: string;\n  /** Set icon color based in volt palette */\n  @Prop({ mutable: true }) color: IconColors | Colors = 'brand-main';\n  /** Set alt text for accesibility */\n  @Prop({ mutable: true }) alt: string;\n\n  @Element() host: HTMLDivElement;  \n  \n  private svgContent: string;\n\n  async componentWillLoad(): Promise<void> {\n    if (this.isValidUrl(this.svgIcon) && this.isValidSvgUrl(this.svgIcon)) {\n      this.svgContent = await this.setSvgContent(this.svgIcon);\n    }\n  }\n\n  private isSvgString(svgIcon: string): boolean {\n    return svgIcon?.trim().startsWith('<svg')?? false;\n  }\n\n  private isValidUrl(svgIcon: string): boolean {\n    try {\n      new URL(svgIcon);\n      return true;\n    } catch (err) {\n      return false;\n    }\n  }\n\n  private isInternalIcon(svgIcon: string): boolean {\n    const icons = Object.keys(svgs.default);\n\n    return icons.some(icon => icon === svgIcon+'.svg');\n  }\n  private isValidSvgUrl(svgIcon: string): boolean {\n    return svgIcon?.endsWith('.svg');\n  }\n\n  private async setSvgContent(svgIcon: string): Promise<string | null> {\n    return await this.fetchSvgContent(svgIcon);\n  }\n\n  private async fetchSvgContent(url: string): Promise<string | null> {\n    try {\n      const response = await fetch(url);\n      return !response.ok ? null : await response.text();\n    } catch (error) {\n      return null;\n    }\n  }\n  private getSize() {\n    if (this.size && this.size.indexOf(',') > -1) {\n      const sizes = this.size.split(',');\n      return {\n        width: sizes[0] ? sizes[0] : '1rem',\n        height: sizes[1] ? sizes[1] : '1rem',\n      };\n    }\n    return { width: this.size ? this.size : '1rem', height: this.size ? this.size : '1rem' };\n  }\n\n  private getSvgContent(): string {\n    if (this.isSvgString(this.svgIcon)) {\n      return GenerateVdsSvg(this.svgIcon);\n    }\n\n    if (this.isValidSvgUrl(this.svgIcon) && this.svgContent) {\n      return GenerateVdsSvg(this.svgContent);\n    }\n\n    return svgs.default[`${this.svgIcon}.svg`];\n  }\n\n  render(): HostElement {\n    return (\n      <Host class={combineClasses('volt-icon', `color-${this.color}`)}>\n        {this.isInternalIcon(this.svgIcon) || this.isSvgString(this.svgIcon) ? \n          (\n            <div\n              part=\"svg-icon\"\n              style={this.getSize()}\n              class={combineClasses('volt-icon-svg')}\n              innerHTML={this.getSvgContent()}>\n            </div>\n          ) \n          : \n          (\n            <img style={this.getSize()} src={this.svgIcon} alt={`${this.alt} icon`} />\n          )\n        }\n      </Host>\n    );\n  }\n}",":host {\n  display: inline-block;\n  width: fit-content;\n  button {\n    background-color: transparent;\n    border-color: transparent;\n    box-sizing: border-box;\n  }\n\n  @mixin disabledIconButton {\n    &:disabled {  \n      color: var(--color-icon-disabled);\n      pointer-events: none;\n      vds-icon {\n        color: var(--color-icon-disabled);\n        fill: var(--color-icon-disabled);\n      }\n    }\n  }\n  @mixin selectedIconButton {\n    &:active {\n      color: var(--color-icon-brand-press);\n      vds-icon {\n        color: var(--color-icon-brand-press);\n        fill: var(--color-icon-brand-press);\n      }\n    }\n  }\n\n  .vds-icon-button {\n    &__element {\n      display: flex;\n      align-items: center;\n      padding: var(--spacing-01, 0.125rem);\n      border: 0;\n      box-sizing: border-box;\n      box-shadow: none;\n      cursor: pointer;\n      border-radius: var(--radius-medium);\n      &:focus-visible {\n        outline: var(--spacing-01, 0.125rem) solid var(--color-border-focus-2);\n      }\n      &:active, &:active:hover {\n        background-color: transparent;\n      }\n    }\n    &__variant--primary {\n      background-color: transparent;\n      border-color: transparent;\n      color: var(--color-text-brand);\n      vds-icon {\n        color: var(--color-text-brand);\n        fill: var(--color-text-brand);\n      }\n      &:hover {\n        background: var(--color-interaction-brand-lowest);\n        color: var(--color-icon-brand-hover);\n        vds-icon {\n          color: var(--color-icon-brand-hover);\n          fill: var(--color-icon-brand-hover);\n        }\n      }\n      \n      @include disabledIconButton();\n      @include selectedIconButton();\n    }\n    &__variant--secondary {\n      background-color: transparent;\n      border-color: transparent;\n      color: var(--color-icon-high);\n      vds-icon {\n        color: var(--color-icon-high);\n        fill: var(--color-icon-high);\n      }\n      &:hover {\n        background: var(--color-interaction-black-lowest);\n        vds-icon {\n          color: var(--color-icon-medium);\n          fill: var(--color-icon-medium);\n        }\n      }\n      &:active {\n        color: var(--color-icon-high);\n        vds-icon {\n          color: var(--color-icon-high);\n          fill: var(--color-icon-high);\n        }\n      }\n\n      @include disabledIconButton();\n    }\n    &__variant--tertiary {\n      background-color: transparent;\n      border-color: transparent;\n      color: var(--color-icon-medium);\n      vds-icon {\n        color: var(--color-icon-medium);\n        fill: var(--color-icon-medium);\n      }\n      &:hover {\n        background: var(--color-interaction-brand-lowest);\n        color: var(--color-icon-brand-hover);\n        vds-icon {\n          color: var(--color-icon-brand-hover);\n          fill: var(--color-icon-brand-hover);\n        }\n      }\n\n      @include disabledIconButton();\n      @include selectedIconButton();\n    }\n  }\n}\n\n:host-context(.vds-icon-button--disabled) {\n  pointer-events: none;\n}","import { Component, Element, Host, Listen, Prop, h } from '@stencil/core';\nimport { shadowSubmitForm } from '../../utils/form';\nimport { combineClasses } from '../../utils/combine-classes';\nimport { cloneAttributes } from '../../utils/clone-attributes';\nimport { HTMLStencilElement } from '@stencil/core/internal';\nimport { ICON_SIZE } from './vds-icon-button.utils';\n\n@Component({\n  tag: 'vds-icon-button',\n  styleUrl: 'vds-icon-button.scss',\n  shadow: true,\n})\nexport class VdsIconButton {\n  /** Set icon button's size */\n\t@Prop() size: \"large\" | \"medium\" | \"small\" | \"extra-small\" = \"medium\";\n  /** Set icon button's variant */\n\t@Prop() variant: \"primary\" | \"secondary\" | \"tertiary\" = \"primary\";\n  /** Enable icon button's disable state */\n\t@Prop() disabled: boolean = false;\n  /** Sets the icon inside icon button */\n\t@Prop() icon: string;\n  /** Sets the button icon arial-label */\n  @Prop({reflect: true}) setAriaLabel: string;\n  \n  @Element() hostEl: HTMLVdsButtonElement;\n\n  @Listen(\"click\")\n\thandleSubmit(): void {\n\t\tif (this.hostEl.getAttribute(\"type\") === \"submit\") {\n\t\t\tthis.submitForm();\n\t\t}\n\t}\n\n  private submitForm(): void {\n\t\tshadowSubmitForm(this.hostEl);\n\t}\n\n  render(): HTMLStencilElement {\n    return (\n      <Host class={combineClasses(`vds-icon-button`, this.disabled ? \"vds-icon-button--disabled\" : \"\")}>\n        <button\n          class={combineClasses(\n            `vds-icon-button__element`,\n            `vds-icon-button__variant--${this.variant}`,\n            `vds-icon-button__size--${this.size}`,\n            this.disabled ? \"vds-icon-button-disabled\" : \"\"\n          )}\n          aria-label={this.setAriaLabel}\n          type=\"button\"\n          disabled={ this.disabled || null}\n          {...cloneAttributes(\n\t\t\t\t\t\tthis.hostEl,\n            \"disabled\",\n            \"class\",\n            \"style\"\n          )}\n        >\n          <vds-icon svg-icon={this.icon} size={ICON_SIZE[this.size]}></vds-icon>\n        </button>\n      </Host>\n    );\n  }\n}\n","@import '~@volt/volt-foundations/dist/volt-foundations/volt-foundations';\n\n:host {\n  display: block;\n  .volt__label {\n    color: var(--color-text-high);\n\n    label {\n      display: flex;\n    }\n\n    &.volt__label--size-small {\n      @include font-style(body, small);\n    }\n\n    &.volt__label--size-medium {\n      @include font-style(body, medium);\n    }\n    \n    &.volt__label--size-large {\n      @include font-style(body, large);\n    }\n\n    &.volt__label--disabled {\n      color: var(--color-text-disabled);\n      .volt__label--required {\n        color: var(--color-text-disabled);\n      }  \n    }\n\n    .volt__label--required {\n      width: 0.3125rem;\n      align-self: stretch;\n      color: var(--color-text-danger-medium);\n      @include font-style(title, 2x-small);\n    }\n  }\n}\n\n:host-context(.vds-label--disabled) {\n  pointer-events: none;\n}","import { Component, Host, h } from '@stencil/core';\nimport { HTMLStencilElement, Prop } from '@stencil/core/internal';\n\n@Component({\n  tag: 'vds-label',\n  styleUrl: 'vds-label.scss',\n  shadow: true,\n})\nexport class VdsLabel {\n  /** Sets the size of the label */\n  @Prop() size: \"small\" | \"large\" | \"medium\" = \"medium\";\n  /** Sets label in disabled state */\n  @Prop() disabled: boolean = false;\n  /** Sets the label as required element adding * at the end */\n  @Prop() required: boolean = false\n  /** Sets the label text */\n  @Prop() labelValue!: string;\n  /** Displays icon at the end of the text */\n  @Prop() icon: string;\n\n  private getRequired(): HTMLStencilElement {\n    return (\n      <span class={\"volt__label--required\"}>*</span>\n    )\n  }\n\n  private getIcon(): HTMLStencilElement {\n    return (\n      <vds-icon svg-icon={this.icon} color=\"brand-main\" size=\"2rem\"></vds-icon>\n    )\n  }\n\n  render(): HTMLStencilElement {\n    return (\n      <Host class={this.disabled ? \"vds-label--disabled\" : \"\"}>\n        <div class={`volt__label\n                     volt__label--size-${this.size}\n                     ${this.disabled ? \"volt__label--disabled\" : \"\"}`}>\n          <label part={\"label\"}>\n            {this.labelValue}{this.required && this.getRequired()}{this.icon && this.getIcon()}\n          </label>\n        </div>\n      </Host>\n    );\n  }\n}\n","@import '~@volt/volt-foundations/dist/volt-foundations/volt-foundations';\n\n:host {\n  display: inline-block;\n  .vds-link{\n    display: inline-flex;\n    justify-content: center;\n    align-items: center;\n    padding: var(--spacing-00);\n    gap: var(--spacing-00);\n    border-radius: var(--radius-medium);\n    text-decoration: none;\n    vertical-align: middle;\n    &:focus-visible {\n      outline: 0.125rem solid var(--color-border-focus-2);\n      outline-offset: 0.125rem;\n    }\n    .vds-link--container{\n      display: inline-flex;\n      justify-content: center;\n      align-items: center;\n      &.vds-link--icon-position-left {\n      flex-direction: row;\n      }\n      &.vds-link--icon-position-right {\n        flex-direction: row-reverse;\n      }\n    }\n    .vds-link--content {\n      color: var(--color-link-default);\n    }\n    vds-icon {\n      color: var(--color-icon-brand-default);\n      fill: var(--color-icon-brand-default);\n    }\n\n    &.vds-link--variant-primary {\n      .vds-link--content {\n        color: var(--color-link-default);\n      }\n      vds-icon {\n        color: var(--color-icon-brand-default);\n        fill: var(--color-icon-brand-default);\n      }\n      &:hover {\n        background-color: var(--color-interaction-brand-lowest);\n        .vds-link--content {\n          color: var(--color-icon-brand-hover);\n        }\n        vds-icon {\n          fill: var(--color-icon-brand-hover);\n          color: var(--color-icon-brand-hover);\n        }\n      }\n      &:active {\n        .vds-link--content {\n          color: var(--color-text-information-high);\n        }\n        vds-icon {\n          fill: var(--color-icon-information);\n          color: var(--color-icon-information);\n        }\n      }\n    }\n\n    &.vds-link--variant-secondary {\n      .vds-link--content {\n        color: var(--color-text-medium);\n      }\n      vds-icon {\n        color: var(--color-icon-medium);\n        fill: var(--color-icon-medium);\n      }\n      &:hover {\n        background-color: var(--color-interaction-black-lowest);\n        .vds-link--content {\n          color: var(--color-text-medium);\n        }\n        vds-icon {\n          fill: var(--color-icon-medium);\n          color: var(--color-icon-medium);\n        }\n      }\n      &:active {\n        .vds-link--content {\n          color: var(--color-text-information-high);\n        }\n        vds-icon {\n          fill: var(--color-icon-information);\n          color: var(--color-icon-information);\n        }\n      }\n    }   \n  }\n\n  .vds-link--content {\n    display: flex;\n    padding: var(--spacing-02);\n    justify-content: center;\n    align-items: center;\n    gap: 8px;\n    text-align: center;\n    font-feature-settings: 'clig' off, 'liga' off;\n    font-style: normal;    \n    text-decoration-line: none;\n    vertical-align: middle;    \n  }\n  vds-icon {\n    display: inline-flex;\n    padding: var(--spacing-02);\n    vertical-align: middle;\n  }\n\n  .vds-link--variant-footer {\n    @include font-style(title, '2x-small');\n    text-decoration-line: none;\n    outline: none;\n\n    &:hover {\n      background-color: var(--color-interaction-black-lowest);\n    }\n    .vds-link--content {\n      @include font-style(title, 2x-small);\n      color: var(--color-text-medium);\n    }\n\n    vds-icon {\n      color: var(--color-icon-medium);\n      fill: var(--color-icon-medium);\n    }\n\n  }\n  .vds-link--underline {\n    text-decoration: underline;\n  }\n  .vds-link--size-2x-small {\n    @include font-style(title, 2x-small);\n  }\n  .vds-link--size-extra-small {\n    @include font-style(title, extra-small);\n  }\n  .vds-link--size-small{\n    @include font-style(title, small);\n  }\n  .vds-link--size-medium {\n    @include font-style(title, medium);\n  }\n  .vds-link--size-large {\n    @include font-style(title, large);\n  }\n}\n","import { Component, Host, Prop, h } from \"@stencil/core\";\nimport { combineClasses } from \"../../utils/combine-classes\";\nimport { HTMLStencilElement } from \"@stencil/core/internal\";\n\n@Component({\n  tag: \"vds-link\",\n  styleUrl: \"vds-link.scss\",\n  shadow: true,\n})\nexport class VdsLink {\n  /** Sets the value for the label text */\n  @Prop() value: string;\n  /** Sets icon position relative to the label text */\n  @Prop() iconPosition: \"right\" | \"left\" = \"right\";\n  /** Enable / Disable underline text decoration */\n  @Prop() underline: boolean = false;\n  /** Sets url link for the internal href */\n  @Prop() url: string = \"#\";\n  /** Sets href target */\n  @Prop() target: \"_self\" | \"_blank\" | \"_parent\" | \"_top\" = \"_self\";\n  /** Sets the link rel value */\n  @Prop() rel: string = null;\n  /** Set the link size */\n  @Prop() size: \"large\" | \"medium\" | \"small\" | \"extra-small\" | \"2x-small\" = \"medium\";\n  /** Sets the informative icon in the vds-link */\n  @Prop() informativeIcon: string;\n  /** Sets the link variant - footer variant is the same as secondary.\n   * @tobedeprecated footer variant will be deprecated in the future.\n   */\n  @Prop() variant: \"primary\" | \"secondary\" | \"footer\" = \"primary\";\n\n\n  /** Sets the informative icon in the vds-link\n   * \n   * @returns HTMLStencilElement\n   */\n  getIcon(): HTMLStencilElement {\n    let size = \"1.5rem\";\n    switch(this.size) {\n      case \"2x-small\":\n        size = \"0.75rem\";\n        break;\n      case \"extra-small\":\n        size = \"1rem\";\n        break;\n      case \"small\":\n        size = \"1.25rem\";\n        break;\n      case \"medium\":\n        size = \"1.5rem\";\n        break;\n      case \"large\":\n        size = \"1.75rem\";\n        break;\n    }\n\n    return <vds-icon\n      svgIcon={this.informativeIcon}\n      size={this.variant === \"footer\" ? \"1rem\" : size}\n      color=\"color-link-default\"></vds-icon>;\n  }\n\n  render(): HTMLStencilElement {\n    return (\n      <Host>\n        <a\n          class={combineClasses(\n            `vds-link vds-link--variant-${this.variant}`,\n            `vds-link vds-link--size-${this.size}`,\n           \n          )}\n          href={this.url}\n          target={this.target}\n          rel={this.rel}\n        >\n          <span\n          class={combineClasses(`vds-link--container`,\n             `vds-link--icon-position-${this.iconPosition}`\n          )}\n          >\n            {this.informativeIcon && this.getIcon()}\n            <span\n              class={combineClasses(\n                `vds-link--content ${this.underline ? \"vds-link--underline\" : \"\"}`\n              )}\n            >\n              {this.value}\n            </span>\n          </span>\n        </a>\n      </Host>\n    );\n  }\n}\n",":host {\n  display: flex;\n  width: fit-content;\n  height: fit-content;\n\n  .vds__menu--container {\n    display: none;\n    position: absolute;\n    max-width: var(--menu-max-width, unset) !important;\n    height: fit-content;\n    max-height: var(--menu-max-height, unset) !important;\n    flex-direction: column;\n    align-self: stretch;\n    background-color: var(--surface-medium);\n    border-radius: var(--radius-medium);\n    border: 0px solid var(--color-border-low);\n    z-index: var(--elevation-layer-2);\n    box-shadow: var(--elevation-shadow-2);\n    box-sizing: border-box;\n    border: 0.0625rem solid var(--color-border-lowest);\n    &.has-scroll {\n      padding-right: var(--spacing-01);\n    }\n  }\n  .vds__menu--submenu {\n    &-right,\n    &-left,\n    &-top,\n    &-bottom {\n      top: auto !important;\n      white-space: nowrap;\n    }\n    &-right {\n      left: 100% !important;\n    }\n    &-left {\n      left: auto !important;\n      transform: translateX(-100%);\n    }\n    &-top,\n    &-bottom {\n      left: auto !important;\n    }\n  }\n}\n","import { Component, Host, Listen, Prop, State, h, Element, EventEmitter, Event, Method } from \"@stencil/core\";\nimport { HTMLStencilElement, Watch } from \"@stencil/core/internal\";\nimport { updateFloatingBoxPosition } from \"../../utils/floating-engine-utils\";\nimport { combineClasses } from \"../../utils/combine-classes\";\nimport { queryElementFromShadowRoot } from \"../../utils/node-utils\";\n\n@Component({\n  tag: \"vds-menu\",\n  styleUrl: \"vds-menu.scss\",\n  shadow: true,\n})\nexport class VdsMenu {\n\n  @Element() hostEl: HTMLElement;\n  /** Defines the position where the menu will be opened */\n  @Prop({ mutable: true }) position: \"top\" | \"bottom\" | \"right\" | \"left\" = \"bottom\";\n  /** Sets the maximum width of the menu\"s content */\n  @Prop({ mutable: true }) maxWidth: string;\n  /** Sets the maximum height of the menu\"s content */\n  @Prop({ mutable: true }) maxHeight: string;\n  /** The type of event that will trigger the popover */\n  @Prop({ mutable: true }) event: \"hover\" | \"click\" = \"click\";\n  /** Toggles the floating container auto-positioning based on available window space. \n   * False by default as it may cause positioning issues in some situations, use with caution \n   * */\n  @Prop({ mutable: true }) autoPosition: boolean = false;\n  /** Set backdrop when show the menu */\n  @Prop({ mutable: true }) backdrop: boolean = false;\n\n  @State() menuOpened: boolean = false;\n  /** Emits event when menu gets opens */\n  @Event() opened: EventEmitter<void>;\n  /** Emits event when menu gets closes */\n  @Event() closed: EventEmitter<void>;\n\n  private actionElementRef: HTMLElement;\n  private menuElementRef: HTMLElement;\n  private floatingCleanUp: () => void;\n\n  private isSubmenu: boolean = false;\n\n  @Watch(\"menuOpened\")\n  async emitValue(): Promise<void> {\n    if (this.menuOpened) {\n      this.opened.emit();\n      this.menuElementRef.style.display = \"inline-flex\";\n      this.floatingCleanUp = await updateFloatingBoxPosition(this.actionElementRef, this.menuElementRef, null, this.position, this.autoPosition);\n    } else {\n      this.closeNestedMenus();\n      this.closed.emit();\n      this.menuElementRef.style.display = \"none\";\n      this.floatingCleanUp();\n    }\n  }\n\n  /* Close the menu when click outside */\n  @Listen(\"click\", { target: \"window\" })\n  handleClickOut(evt: MouseEvent): void {\n    const isClickInside = this.hostEl.contains(evt.target as Node);\n    if (!isClickInside && !this.backdrop) {\n      this.menuOpened = false;\n    }\n  }\n  \n  handleHoverOut(event: Event): void {\n    if (this.event === \"hover\") {\n      const hoveredElement = event.target as HTMLElement;\n      if (hoveredElement) {\n        this.close();\n      }\n    }\n  }\n  \n  /* Close all nested menus recursively */\n  private closeNestedMenus(): void {\n    const menuContent = this.menuElementRef.querySelector('slot[name=\"menu-content\"]') as HTMLSlotElement;\n    if (menuContent) {\n      const elements = Array.from(menuContent.children);\n      for (const element of elements) {\n        const nestedMenu = element.querySelector('vds-menu');\n        if (nestedMenu) {\n          nestedMenu.close();\n        }\n      }\n    }\n  }\n  \n  /* Open the menu with click on the trigger element  */\n  async handleClick(evt: Event): Promise<void> {\n    if (this.event === \"click\") {\n      const clickedElement = evt.target as HTMLElement;\n      if (clickedElement && !this.menuOpened) {\n        this.menuOpened = true;\n      }\n    }\n  }\n\n  /* Listen when Menu Item element is clicked to close Menu window */\n  @Listen(\"clicked\")\n  handleMenuItemClicked(): void {\n    this.close();\n  }\n\n  /* Open the menu from other element  */\n  @Method()\n  public async open(): Promise<void> {\n    this.menuOpened = true;\n  }\n\n  /* Close the menu from other element  */\n  @Method()\n  public async close(): Promise<void> {\n    this.closeNestedMenus();\n    this.menuOpened = false;\n  }\n  /**\n   *  Gets the target that will manage the menu\n   *  returns a promise with the target HTMLElement.\n   */\n  @Method()\n  public async getTarget(): Promise<HTMLElement | null> {\n    return document.querySelector(\".vds__menu--trigger\") as HTMLElement;\n  }\n\n  private handleHover(event: Event): void {\n    if (this.event === \"hover\") {\n      const hoveredElement = event.target as HTMLElement;\n      if (hoveredElement) {\n        this.menuOpened = true;\n      }\n    }\n  }\n\n  private setMaxWidthAndHeight() {\n    return { \"--menu-max-width\": this.maxWidth, \"--menu-max-height\": this.maxHeight }\n  }\n\n  componentWillLoad() {\n    const triggerItem = Array.from(this.hostEl.children).find(\n      (child) => child.matches('vds-menu-item[slot=\"menu-trigger\"]')\n    );\n    if (triggerItem) {\n      this.isSubmenu = true;\n      this.backdrop = false;\n      this.autoPosition = false;\n    }\n  }\n\n  componentDidLoad() {\n    this.actionElementRef = queryElementFromShadowRoot(this.hostEl, \".vds__menu--trigger\");\n    this.menuElementRef = queryElementFromShadowRoot(this.hostEl, \".vds__menu--container\");\n    if (this.event === \"click\") {\n      this.actionElementRef.addEventListener(\"click\", this.handleClick.bind(this));\n    } else if (this.event === \"hover\") {\n      this.actionElementRef.addEventListener(\"mouseenter\", this.handleHover.bind(this));\n      this.menuElementRef.addEventListener(\"mouseleave\", this.handleHoverOut.bind(this));\n    }\n  }\n\n  componentDidRender() {\n    updateFloatingBoxPosition(this.actionElementRef, this.menuElementRef, null, this.position, this.autoPosition);\n  }\n\n  disconnectedCallback() {\n    window.removeEventListener(\"click\", this.handleClickOut.bind(this));\n    if (this.event === \"click\") {\n      this.actionElementRef.removeEventListener(\"click\", this.handleClick.bind(this));\n    } else if (this.event === \"hover\") {\n      this.actionElementRef.removeEventListener(\"mouseenter\", this.handleHover.bind(this));\n      this.menuElementRef.removeEventListener(\"mouseleave\", this.handleHoverOut.bind(this));\n    }\n  }\n\n  render(): HTMLStencilElement {\n    return (\n      <Host style={this.setMaxWidthAndHeight()}>\n        {this.backdrop && this.menuOpened ? <div class=\"vds__menu--backdrop\" onClick={() => this.close()}></div> : null}\n        <div class=\"vds__menu--trigger\"\n          onClick={(evt: MouseEvent) => {\n            this.handleClick(evt);\n          }}\n          ref={(triggerEl) => { if (triggerEl) this.actionElementRef = triggerEl; }}\n        >\n          <slot name=\"menu-trigger\"></slot>\n        </div>\n        <div\n          class={combineClasses(\n            \"vds__menu--container\",\n            this.maxHeight ? \"has-scroll\" : \"\",\n            this.isSubmenu ? `vds__menu--submenu-${this.position}` : \"\"\n          )}\n          ref={(menuEl) => { if (menuEl) this.menuElementRef = menuEl; }}\n        >\n          <slot name=\"menu-content\"></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n","@import '~@volt/volt-foundations/dist/volt-foundations/volt-foundations';\n@import '../base-group-header/base-group-header.scss';\n\n:host {\n  display: block;\n  width: 100%;\n}","import { Component, Host, h, Prop } from '@stencil/core';\nimport { GroupHeaderSize, generateGroupHeaderContainer } from '../base-group-header/base-group-header';\n\n@Component({\n  tag: 'vds-menu-group-header',\n  styleUrl: 'vds-menu-group-header.scss',\n  shadow: true,\n})\nexport class VdsMenuGroupHeader {\n  /** Size of the group header */\n  @Prop() size: GroupHeaderSize = 'medium';\n\n  render() {\n    return (\n      <Host>\n        {generateGroupHeaderContainer(this.size)}\n      </Host>\n    );\n  }\n}\n","@import \"~@volt/volt-foundations/dist/volt-foundations/volt-foundations\";\n@import '../base-item/base-item.scss';\n\n:host {\n  display: block;\n  width: 100%;\n  .vds-menu-item {\n    @include baseItem();\n    &.vds-menu-item--size-medium {\n      @include baseItemSizeMedium();\n      .vds-menu-item__content {\n        @include baseItemContent(medium);\n      }\n    }\n    &.vds-menu-item--size-large {\n      @include baseItemSizeLarge();\n      .vds-menu-item__content {\n        @include baseItemContent(large);\n      }\n    }\n    &.vds-menu-item--active {\n      @include baseItemActive();\n      &.vds-menu-item--danger  {\n        @include baseItemBackgroundDanger();\n      }\n    }\n    &.vds-menu-item--danger {\n      @include baseItemDanger();\n    }\n    &.vds-menu-item--disabled {\n      @include baseItemDisabled();\n      &.vds-menu-item--danger {\n        @include baseItemDisabled();\n      }\n    }\n  }\n}\n\n:host(.vds-menu-item--disabled) {\n  pointer-events: none;\n}\n","import { Component, Event, EventEmitter, Host, Prop, h, Element } from \"@stencil/core\";\nimport { HTMLStencilElement, Watch } from \"@stencil/core/internal\";\nimport { combineClasses } from \"../../utils/combine-classes\";\nimport { handleRefClick } from \"../../utils/utils\";\nimport { generateCheckbox, generateCheckmarkIconButton, generateChildrenIconButton, generateInformativeIcon, generateLabel } from \"../base-item/base-item\";\n\nexport interface MenuItemClickedEvent {\n  value: string;\n  event: MouseEvent;\n}\n\n@Component({\n  tag: \"vds-menu-item\",\n  styleUrl: \"vds-menu-item.scss\",\n  shadow: true,\n})\nexport class VdsMenuItem {\n /** Puts the VdsMenuItem in disabled state */\n  @Prop({ mutable: true }) disabled: boolean = false;\n  /** Define the icon value */\n  @Prop({ mutable: true }) icon: string;\n  /** Define item as active when is true */\n  @Prop({ mutable: true }) isActive: boolean = false;\n  /** Shows arrow when there are children */\n  @Prop({ mutable: true }) hasChildren: boolean = false;\n  /** Defines the element as a link */\n  @Prop({ mutable: true }) linkHref: string = null;\n  /** Sets the link target value */\n  @Prop({ mutable: true }) linkTarget: \"_self\" | \"_blank\" | \"_parent\" | \"_top\" = \"_self\";\n  /** Sets the link rel value */\n  @Prop({ mutable: true }) linkRel: string = null;\n  /** Define text value */\n  @Prop({ mutable: true, reflect: true }) value: string;\n  /** Define aria-label */\n  @Prop({ mutable: true, reflect: true }) setAriaLabel: string;\n  /** Set size of menu item */\n  @Prop({ mutable: true }) size: \"medium\" | \"large\" = \"medium\";\n  /** Shows checkmark */\n  @Prop({ mutable: true }) hasCheckmark: boolean = false;  \n  /** Set state of checkmark */\n  @Prop({ mutable: true, reflect: true }) isSelected: boolean = false;\n  /** When has-checkmark is true, sets the checks element as checkmark or checkbox.  */\n  @Prop() checkmarkVariant: \"checkbox\" |\"checkmark\" = \"checkmark\";\n  /** When has-checkmark is true, sets the checks element at the beginning or end.  */\n  @Prop() checkmarkAlignment: \"start\" |\"end\" = \"start\";\n  /** Sets the menu item to danger state.  */\n  @Prop({ mutable: true, reflect: true }) danger: boolean = false;\n\n  /** Emits event when item gets clicked */\n  @Event() clicked: EventEmitter<MenuItemClickedEvent>;\n  /** Emits event when item is selected */\n  @Event() selected: EventEmitter<MouseEvent>;\n  /** Emits event when item is deselected */\n  @Event() deselected: EventEmitter<MouseEvent>;\n \n  @Element() hostEl: HTMLElement; \n  \n  @Watch(\"isSelected\")\n  updateItemState() {\n    this.isActive = this.isSelected; \n  }\n\n  private handleClick(evt: MouseEvent): void {\n    const parentMenu = this.hostEl.closest(\"vds-menu\");\n    const isMenuTrigger = this.hostEl.getAttribute(\"slot\") === \"menu-trigger\";\n    if (parentMenu && isMenuTrigger) {\n      parentMenu.open();\n      evt.stopPropagation();\n    } else {\n      handleRefClick(this.linkHref, this.linkTarget, this.linkRel);\n      this.clicked.emit({ value: this.value, event: evt });\n      this.handleSelected(evt);\n    }\n  }\n\n  private handleSelected(evt: MouseEvent):void{\n    if (this.hasCheckmark) {\n      this.isSelected = !this.isSelected;\n    }\n    if (this.isSelected) this.selected.emit(evt);\n    else this.deselected.emit(evt);\n  }\n\n  private generateCheckmarkIconButton(){\n    return generateCheckmarkIconButton(this.isSelected, this.size, this.disabled, this.isActive, this.danger);\n  }\n  private generateInformativeIcon(){\n    return generateInformativeIcon(this.icon, this.value, this.size, this.disabled, this.isActive, this.danger);\n  }\n\n  private generateCheckbox() {\n    return generateCheckbox(this.isSelected, this.size, this.disabled, this.isActive, this.danger);\n  }\n\n  private generateLabel(){\n    return generateLabel(this.value, this.size, this.disabled, this.isActive, this.danger);\n  }\n\n  private generateChildrenIconButton(){\n    return generateChildrenIconButton(this.size, this.disabled, this.isActive, this.danger);\n  }\n\n  private setAriaLabelText(){\n    return this.setAriaLabel ? this.setAriaLabel : this.value;\n  }\n\n  render(): HTMLStencilElement {\n    return (\n      <Host class={this.disabled ? \"vds-menu-item--disabled\" : \"\"}>\n        <button\n          type=\"button\"\n          tabindex=\"0\"  \n          disabled={this.disabled}\n          title={this.setAriaLabelText()}\n          aria-label={this.setAriaLabelText()}\n          onClick={(evt: MouseEvent) => {\n            if (this.disabled) {\n              evt.stopPropagation();\n              evt.preventDefault();\n            } else {\n              this.handleClick(evt);\n            }\n          }}\n          class={\n            combineClasses(\n              \"vds-menu-item\",\n              `vds-menu-item--size-${this.size}`,\n              this.disabled ? \"vds-menu-item--disabled\" : \"\",\n              this.isActive || this.isSelected ? \"vds-menu-item--active\" : \"\",\n              this.danger ? \"vds-menu-item--danger\" : \"\",\n              `vds-menu-item__alignment-${this.checkmarkAlignment}`\n          )}\n        >\n          <div class=\"vds-menu-item__content\">\n            {this.checkmarkAlignment === \"start\" && this.hasCheckmark ? this.checkmarkVariant === \"checkmark\" ? this.generateCheckmarkIconButton() : this.generateCheckbox() : null}\n            {this.icon && this.generateInformativeIcon()}\n            {this.value ? this.generateLabel() : <slot></slot>}\n            {this.checkmarkAlignment === \"end\" && this.hasCheckmark ? this.checkmarkVariant === \"checkmark\" ? this.generateCheckmarkIconButton() : this.generateCheckbox() : null}\n            {this.hasChildren && this.generateChildrenIconButton()} \n          </div>\n        </button>\n      </Host>\n    );\n  }\n}\n",":host {\n  display: block;\n  .vds__menu-list--container{\n    display: flex;\n    align-items: flex-start;\n    flex-direction: column;\n    background:  var(--surface-medium);\n    border-radius: var(--radius-medium);\n    width: 100%;\n    overflow-y: auto;\n    max-height: calc(var(--menu-max-height, fit-content) - var(--spacing-02) * 2);\n    &::-webkit-scrollbar {\n      background-color:  var(--surface-medium);\n      width: 0.375rem;\n    }\n    &::-webkit-scrollbar-thumb {\n      background-color: var(--color-background-neutral-press);\n      border-radius: var(--radius-pill)\n    } \n  }\n}\n","import { Component, Host, h } from '@stencil/core';\n@Component({\n  tag: 'vds-menu-list',\n  styleUrl: 'vds-menu-list.scss',\n  shadow: true,\n})\nexport class VdsMenuList {\n  render() {\n    return (\n      <Host>\n        <div class=\"vds__menu-list--container\">\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}",":host {\n  display: block;\n  height: fit-content;\n  width: fit-content;\n  z-index: var(--elevation-layer-5);\n  --progress-circular-background-track: var(--color-background-information-lowest-default);\n  --progress-circular-background-track-fill: var(--color-background-information-default);\n  .vds-progress-circular__container {\n    display: flex;\n    position: relative;\n    justify-content: center;\n    align-items: center;\n    --size: 3.5rem;\n    height: var(--size);\n    width: var(--size);\n\n    .vds-progress-circular__track {\n      position: absolute;\n      stroke-width: 4;\n    }\n\n    .vds-progress-circular__track-fill {\n      position: absolute;\n      stroke-width: 4;\n      transform: rotate(-90deg);\n      transform-origin: center;\n    }\n\n    &.vds-progress-circular__container--default-colors {\n      .vds-progress-circular__track {\n        stroke: var(--progress-circular-background-track);\n        &.vds-progress-circular__track--error {\n          --progress-circular-background-track: var(--color-background-information-lowest-default);\n        }\n        &.vds-progress-circular__track--success {\n          --progress-circular-background-track: var(--color-background-information-lowest-default);\n        }\n      }\n      .vds-progress-circular__track-fill {\n        stroke: var(--progress-circular-background-track-fill);\n        &.vds-progress-circular__track-fill--error {\n          --progress-circular-background-track-fill: var(--color-background-danger-default);\n        }\n        &.vds-progress-circular__track-fill--success {\n          --progress-circular-background-track-fill: var(--color-background-healthy-default);\n        }\n      }\n    }\n    &.vds-progress-circular__container--custom-colors {\n      .vds-progress-circular__track {\n        stroke: var(--progress-circular-background-track);\n      }\n      .vds-progress-circular__track-fill {\n        stroke: var(--progress-circular-background-track-fill);\n      }\n    }\n  }\n\n  @keyframes rotate {\n    0% {\n      transform: rotate(0deg);\n    }\n    100% {\n      transform: rotate(360deg);\n    }\n  }\n}\n","import { Component, Host, Prop, State, Watch, h } from '@stencil/core';\nimport { combineClasses } from '../../utils/combine-classes';\n\n@Component({\n  tag: 'vds-progress-circular',\n  styleUrl: 'vds-progress-circular.scss',\n  shadow: true,\n})\nexport class VdsProgressCircular {\n  /** Sets the percentage filled value from 0 to 100 */\n  @Prop() value: number;\n  /** \n   * Defines the color based on the status:\n   * error -> color-background-critical-default,\n   * success -> color-background-general-healthy-default,\n   * default -> color-background-brand-default\n   */\n  @Prop() status: 'error' | 'success' | 'default' = 'default';\n  /** \n   * Sets the loop duration time for the indeterminate loop progress in miliseconds.\n   * Determinate and indeterminate state will be defined by adding or not the duration.\n   */\n  @Prop() duration: number = 500;\n  /** Sets the aria label */\n  @Prop() setAriaLabel: string;\n  /** \n   * Sets the progress indicator color from the Volt palette:\n   * backgroundProgress - ThemeColors,\n   * backgroundTrack - ThemeColors\n   */\n  @Prop() colors: { [key: string]: string } | string;\n  /** \n   * Set the size scale of the component based on 1 === 52px (3.5rem).\n   * Common values:\n   * - 0.25 (extra small): 13px\n   * - 0.5 (small): 26px\n   * - 1 (medium): 52px\n   * - 1.5 (large): 78px\n   * Minimum scale is 0.25\n   */\n  @Prop() scale: number = 1;\n\n  /**\n   * State variable to hold the progress value.\n   */\n  @State() progress: number;\n\n  private customColors = false;\n\n  /**\n   * Calculates and returns the styling for the progress circle based on the current value.\n   * This is used to create the stroke-dasharray and stroke-dashoffset for the SVG circle,\n   * which visually represents the progress percentage.\n   *\n   * @private\n   * @returns {Object} An object containing the CSS styles for the SVG circle's stroke.\n   */\n  private setProgress(): { strokeDasharray: string; strokeDashoffset: string } {\n    this.progress = this.value < 0 ? 0 : this.value > 100 ? 100 : this.value;\n    const radius = 24;\n    const circumference = 2 * Math.PI * radius;\n\n    const strokeDashoffset = circumference * (1 - this.progress / 100);\n\n    return {\n      strokeDasharray: `${circumference}`,\n      strokeDashoffset: `${strokeDashoffset}`,\n    };\n  }\n\n  /**\n   * Returns the animation for the indeterminate slider.\n   * Using the duration prop we return an animation effect in ms.\n   * Going from top to bottom using the value as the progress.\n   *\n   * @private\n   * @returns { animation: string }\n   */\n  @Watch('duration')\n  private setDurationAnimation(): { animation: string } | {} {\n    return this.duration > 0 ? { animation: `rotate ${this.duration}ms linear infinite` } : {};\n  }\n\n  /**\n   * Ensures that the scale is clamped to a minimum value of 0.25.\n   *\n   * @private\n   * @param {number} scale - The new scale value.\n   */\n  @Watch('scale')\n  private setScale(scale: number): void {\n    this.scale = Math.max(0.25, scale);\n  }\n\n  /**\n   * Sets custom colors for the progress bar.\n   *\n   * @private\n   * @returns {Object} An object containing the CSS styles for the custom colors.\n   */\n  private setCustomColors(): { [key: string]: string } {\n    const colors = typeof this.colors === 'string' ? JSON.parse(this.colors) : this.colors;\n    const style = {\n      ...(colors?.backgroundTrack && { '--progress-circular-background-track': `var(--${colors.backgroundTrack})` }),\n      ...(colors?.backgroundProgress && { '--progress-circular-background-track-fill': `var(--${colors.backgroundProgress})` }),\n    };\n    this.activateCustomColors(colors);\n\n    return style;\n  }\n\n  /**\n   * Activates custom colors.\n   *\n   * @private\n   * @param {Object} colors - The colors object.\n   * @returns {void}\n   */\n  private activateCustomColors(colors: { [key: string]: string }): void {\n    this.customColors = !!colors && (!!colors['backgroundTrack'] || !!colors['backgroundProgress']);\n  }\n\n  componentWillLoad() {\n    this.setScale(this.scale);\n  }\n\n  render() {\n    return (\n      <Host style={this.setCustomColors()}>\n        <div\n          class={combineClasses(\n            'vds-progress-circular__container',\n            this.customColors ? 'vds-progress-circular__container--custom-colors' : 'vds-progress-circular__container--default-colors',\n          )}\n          style={{ '--size': `calc(3.5rem * ${this.scale})` }}\n        >\n          <svg\n            class={combineClasses(\n              'vds-progress-circular__track',\n              `vds-progress-circular__track--${this.status}`,\n            )}\n            viewBox=\"0 0 52 52\"\n          >\n            <circle cx=\"26\" cy=\"26\" r=\"24\" fill=\"none\" />\n          </svg>\n          <svg\n            class={combineClasses(\n              'vds-progress-circular__track-fill',\n              `vds-progress-circular__track-fill--${this.status}`,\n            )}\n            style={this.setDurationAnimation()}\n            viewBox=\"0 0 52 52\"\n          >\n            <circle cx=\"26\" cy=\"26\" r=\"24\" fill=\"none\" style={this.setProgress()} />\n          </svg>\n        </div>\n      </Host>\n    );\n  }\n}\n","@import \"~@volt/volt-foundations/dist/volt-foundations/volt-foundations\";\n\n:host {\n  display: block;\n  box-sizing: border-box;\n  box-shadow: none;\n\n  --vds-sidenav-item-expanded-width: var(--vds-sidenav-expanded-width, 17.5rem);\n  --vds-sidenav-item-static-width: var(--vds-sidenav-static-width, 3.75rem);\n  --vds-sidenav-item-collapsed-width: var(--vds-sidenav-collapse-width, 3.5rem);\n\n\n  .vds__sidenav-item {\n      box-sizing: border-box;\n      padding: var(--spacing-00) var(--spacing-03);\n      justify-content: space-between;\n      align-items: center;\n      display: flex;\n      overflow: hidden;\n      font-feature-settings: 'clig' off, 'liga' off;\n      text-overflow: ellipsis;\n      line-height: 1.25rem;\n      border-radius: var(--spacing-02);\n      border: none;\n      text-decoration: none;\n      cursor: pointer;\n      @include font-style(body, medium);\n      &:hover {\n        background-color: var(--color-interaction-black-lowest);\n      }\n      &:focus-visible {\n        outline: 0.125rem solid var(--color-border-focus-2);\n        outline-offset: 0.125rem;\n      }\n  }\n  .vds__sidenav-item--expanded-informative-icon{\n    display: flex;\n    padding: var(--spacing-00) var(--spacing-03);\n    justify-content: center;\n    align-items: center;\n    gap: var(--spacing-00, 0px);\n    color: var(--color-icon-medium);\n  }\n\n  .vds__sidenav-item--collapsed-informative-icon{\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    color: var(--color-icon-medium);\n  }  \n  .vds__sidenav-item--static-informative-icon{\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    gap: var(--spacing-00);\n    color: var(--color-icon-medium);\n    padding: var(--spacing-03) var(--spacing-03) var(--spacing-00) var(--spacing-03);\n  }\n  .vds__sidenav-item--interaction-icon {\n    display: flex;\n    padding: var(--spacing-00);\n    justify-content: center;\n    align-items: center;\n    gap: var(--spacing-00);\n    color: var(--color-icon-medium);\n    background: transparent; \n  }\n  .vds__sidenav-item--interaction-right-slot {\n    display: flex;\n    padding: var(--spacing-00);\n    justify-content: center;\n    align-items: center;\n    gap: var(--spacing-00, 0px);\n    color: var(--color-text-medium);\n    background: transparent; \n  }\n  .vds__sidenav-item--static {\n    padding: 0;\n    color: var(--color-text-medium);\n    text-align: center;\n    width: var(--vds-sidenav-item-static-width);\n    display: flex;     \n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n    background-color: transparent;\n    min-height: 3rem;\n    max-height: 3.75rem;\n    @include font-style(title, 2x-small);\n    letter-spacing: 0.009rem;\n  }\n  .vds__sidenav-item--static-label {\n    width: auto;\n    height: auto;\n    max-height: 24px;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    padding: var(--spacing-02) var(--spacing-00);\n  }\n  .vds__sidenav-item--expanded {\n    width: var(--vds-sidenav-item-expanded-width);\n    height: 2.25rem;\n    background-color: transparent;\n    color: var(--color-text-medium);\n    border-radius: var(--spacing-02);\n    padding: var(--spacing-03) var(--spacing-03);\n    column-gap: var(--spacing-02);\n  }  \n  .vds__sidenav-item--expanded-label {\n    width: auto;\n    height: auto;\n    color: var(--color-text-medium);\n    padding: var(--spacing-00);\n    text-overflow: ellipsis;\n    overflow: hidden;\n    line-height: 1.25rem;\n    white-space: nowrap;\n    margin-right: auto;\n  }\n  .vds__sidenav-item--collapsed {\n    color: var(--color-text-medium);\n    padding: var(--spacing-03) var(--spacing-03);\n    width: var(--vds-sidenav-item-collapsed-width);\n    height: 2.25rem;\n    justify-content: center;\n    background-color: transparent;\n  }\n  .vds__sidenav-item--label-disabled{\n    color: var(--color-text-disabled);\n    cursor: none;\n  }\n  .vds__sidenav-item--label-active {\n    color: var(--color-link-press);\n    @include font-style(title, small);\n  }\n  .vds__sidenav-item--static-label-active {\n    color: var(--color-link-press);\n  }\n  .vds__sidenav-item--active {\n    background-color: var(--color-interaction-brand-lowest); \n    color: var(--color-link-press) ; \n  }\n  .vds__sidenav-item--disabled {\n    pointer-events: none;\n    background: var(--global-transparent);\n    color: var(--text-disabled);\n    &:focus-visible {\n      outline: none;\n    }\n  }  \n}\n\n:host-context(.vds__sidenav-item--disabled) {\n  pointer-events: none;\n}","import { Component, Host, Prop, h, Event, EventEmitter } from '@stencil/core';\nimport { HTMLStencilElement } from '@stencil/core/internal';\n\n@Component({\n  tag: 'vds-sidenav-item',\n  styleUrl: 'vds-sidenav-item.scss',\n  shadow: true,\n})\nexport class VdsSidenavItem {\n  /** Puts the navItem in disabled state */\n  @Prop({ mutable: true }) disabled: boolean = false;\n  /** When true expands the nav item to show both text and icon. When false, only shows the icon */\n  @Prop({ mutable: true }) expanded: boolean = false;\n  /** Define the icon value */\n  @Prop({ mutable: true }) icon: string;\n  /** Define item as active when is true */\n  @Prop({ mutable: true }) isActive: boolean = false;\n  /** Toggles static mode in nav-item */\n  @Prop({ mutable: true }) isStatic: boolean = false;\n  /** Shows arrow when there are children */\n  @Prop({ mutable: true }) hasChildren: boolean = false;\n  /** Defines the element as a link */\n  @Prop({ mutable: true }) link_href: string = null;\n  /** Sets the target value */\n  @Prop({ mutable: true }) link_target: '_self' | '_blank' | '_parent' | '_top' = '_self';\n  /** Sets the link rel value */\n  @Prop({ mutable: true }) link_rel: string = null;\n  /** Define text value */\n  @Prop({ mutable: true }) value: string;\n\n  /** Emits event when item gets clicked */\n  @Event() clicked: EventEmitter<MouseEvent>;\n\n  private handleClick(evt: MouseEvent): void {\n    this.clicked.emit(evt);\n  }\n\n  private generateRightSlot(){\n    return (\n      this.expanded && !this.isStatic ? \n        <span class=\"vds__sidenav-item--interaction-right-slot\">\n          <slot name=\"rightSlot\" />\n        </span> \n      : null\n    )\n  }\n\n  private generateChildrenIcon(){\n    \n  if (this.hasChildren && (this.isStatic || this.expanded)) {\n    return (\n            <span class=\"vds__sidenav-item--interaction-icon\">\n              <vds-icon\n                svg-icon=\"chevron-right\"\n                size={'1.25rem'}\n                color={this.disabled ? 'color-icon-disabled' : this.isActive ? 'color-icon-brand-press' : 'color-icon-medium'}\n                alt=\"Open menu\"\n              />\n            </span>\n          ) \n    }        \n  }\n  private generateInformativeIcon(){\n    if (this.icon){\n       return (\n          <span \n          class={`${this.isStatic ? \"vds__sidenav-item--static-informative-icon\" : \n            this.expanded ? \"vds__sidenav-item--expanded-informative-icon\" :\n            \"vds__sidenav-item--collapsed-informative-icon\"\n                }`}\n          >\n            <vds-icon\n              svg-icon={this.icon}\n              size={'1.25rem'}\n              color={this.disabled ? 'color-icon-disabled' : this.isActive ? 'color-icon-brand-press' : 'color-icon-medium'}\n              alt={this.value}\n            />\n          </span>\n       )\n    }\n  }\n  render(): HTMLStencilElement {\n    const Element = this.link_href ? \"a\" : \"button\";\n    const href = this.link_href ? this.link_href : null;\n    const target = this.link_href ? this.link_target : null;\n    const rel = this.link_href ? this.link_rel : null;\n    return (\n      <Host class={this.disabled ? 'vds__sidenav-item--disabled' : ''}>\n        <Element\n          onClick={(evt: MouseEvent) => {\n            if (this.disabled) {\n              evt.stopPropagation();\n              evt.preventDefault();\n            } else {\n              this.handleClick(evt);\n            }\n          }}\n          href={ href }\n          target={ target }\n          rel={ rel }\n          class={`vds__sidenav-item \n                     ${this.isStatic ? 'vds__sidenav-item--static' : this.expanded ? 'vds__sidenav-item--expanded' : 'vds__sidenav-item--collapsed'}\n                     ${this.disabled ? 'vds__sidenav-item--disabled' : ''}\n                     ${this.isActive && !this.disabled ? 'vds__sidenav-item--active' : ''}\n                `}\n        >\n          {this.generateInformativeIcon()}  \n          {this.expanded || this.isStatic ? (\n            <span\n              class={`\n                    ${this.isStatic ? 'vds__sidenav-item--static-label' : 'vds__sidenav-item--expanded-label'}\n                    ${this.disabled ? 'vds__sidenav-item--label-disabled' : ''}\n                    ${this.isActive && !this.disabled && this.expanded ? 'vds__sidenav-item--label-active' : ''}\n                    ${this.isActive && !this.disabled && this.isStatic ? 'vds__sidenav-item--static-label-active' : ''}\n                    `}\n            >\n              {this.value}\n            </span>\n          ) : null}\n          {this.generateRightSlot()}\n          {this.generateChildrenIcon()}\n        </Element>\n      </Host>\n    );\n  }\n}\n","@import '~@volt/volt-foundations/dist/volt-foundations/volt-foundations';\n@import '../base-item/base-item.scss';\n\n:host {\n  display: block;\n  .vds-upload-item {\n    @include baseItem();\n    cursor: default;\n    border-radius: var(--radius-medium);\n    &.vds-upload-item--size-medium {\n      @include baseItemSizeMedium();\n      .vds-upload-item__content {\n        @include baseItemContent(medium);\n      }\n    }\n    &.vds-upload-item--size-large {\n      @include baseItemSizeLarge();\n      .vds-upload-item__content {\n        @include baseItemContent(large);\n      }\n    }\n    &.vds-upload-item--error {\n      @include baseItemDanger();\n    }\n    .vds-upload-item__remove-icon {\n      opacity: 0;\n      pointer-events: none; \n      display: flex;\n      align-items: center;\n      .vds-upload-item--error & {\n        opacity: 1;\n      }\n    }\n    &:hover,\n    &:focus-within {\n      .vds-upload-item__remove-icon {\n        opacity: 1;\n        pointer-events: auto;\n      }\n    }\n  }\n}\n","import { Component, Host, h, Prop, Event } from '@stencil/core';\nimport { EventEmitter, HTMLStencilElement } from '@stencil/core/internal';\nimport { combineClasses } from '../../utils/combine-classes';\nimport { generateInformativeIcon, generateLabel } from '../base-item/base-item';\n\n@Component({\n  tag: 'vds-upload-item',\n  styleUrl: 'vds-upload-item.scss',\n  shadow: true,\n})\nexport class VdsUploadItem {\n  /** Sets the item text value */\n  @Prop() value: string = '';\n  /** Sets the item size */\n  @Prop() size: 'large' | 'medium' = 'medium';\n  /** Sets the item informative icon */\n  @Prop() informativeIcon: string = 'link-closed';\n  /** Sets the item state */\n  @Prop() status: 'loading' | 'error' | 'default' = 'default';\n  /** Sets the percentage filled value from 0 to 100 */\n  @Prop() loadingValue: number = 75;\n  /**\n   * Sets the loop duration time for the indeterminate loop progress in miliseconds.\n   * Determinate and indeterminate state will be defined by adding or not the duration.\n   */\n  @Prop() loadingDuration: number = 500;\n\n  /** Event emitted when the icon button is clicked */\n  @Event() actionIconClick: EventEmitter<void>;\n\n  private renderInformativeIcon() {\n    if (this.status === 'loading') {\n      return (\n        <div class=\"vds-upload-item__loading-indicator\">\n          <vds-progress-circular\n            value={this.loadingValue}\n            duration={this.loadingDuration}\n            scale={this.size === 'medium' ? 0.286 : 0.3575}\n          />\n        </div>\n      );\n    }\n    return generateInformativeIcon(this.informativeIcon, this.value, this.size, false, false, this.status === 'error');\n  }\n\n  private generateLabel() {\n    return generateLabel(this.value, this.size, false, false, this.status === 'error');\n  }\n\n  private handleIconButtonClick(event: Event) {\n    event.stopPropagation();\n    this.actionIconClick.emit();\n  }\n\n  private renderRemoveButton() {\n    return (\n      <div class=\"vds-upload-item__remove-icon\">\n        <vds-icon-button\n          icon={this.status === 'loading' ? 'close' : 'trash'}\n          size={this.size === 'medium' ? 'small' : 'medium'}\n          variant=\"secondary\"\n          setAriaLabel=\"Remove item\"\n          onClick={(event => this.handleIconButtonClick(event))}\n        />\n      </div>\n    );\n  }\n\n  render(): HTMLStencilElement {\n    return (\n      <Host>\n        <div class={combineClasses(\n          'vds-upload-item',\n          `vds-upload-item--size-${this.size}`,\n          `vds-upload-item--${this.status}`\n        )}>\n          <div class=\"vds-upload-item__content\">\n            {this.renderInformativeIcon()}\n            {this.generateLabel()}\n            {this.renderRemoveButton()}\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}