wabtec-internal-volt-basic-components 1.0.0 → 1.2.0

package/dist/collection/components/autocomplete/vds-basic-autocomplete.js.map

@@ -1 +1 @@
-{"version":3,"file":"vds-basic-autocomplete.js","sourceRoot":"","sources":["../../../src/components/autocomplete/vds-basic-autocomplete.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, Prop, Watch, h, Event, EventEmitter, Method, State, Element } from '@stencil/core';\nimport { combineClasses } from '../../utils/combine-classes';\nimport { toggleContainerDisplay, updateContainerWidth } from '../basic-dropdown/vds-basic-dropdown.utils';\nimport { updateFloatingBoxPosition } from '../../utils/floating-engine-utils';\nimport { HTMLStencilElement, Listen } from '@stencil/core/internal';\nimport { cloneAttributes } from '../../utils/clone-attributes';\nimport { findOptionByExactValue, findOptionByValue, getFilteredOptions } from './vds-basic-autocomplete.utils';\nimport { getIconSize } from '../../utils/icon-attr.utils';\n\n@Component({\n  tag: 'vds-basic-autocomplete',\n  styleUrl: 'vds-basic-autocomplete.scss',\n  shadow: true,\n})\nexport class VdsBasicAutocomplete {\n\n  /** \n   * Sets the internal input size.\n   * If multiple property is true, This will only set the basic-input text value.\n   * If multiple property is false and the value prop matches with an option, the option will be selected,\n   * Otherwise text will be set in the basic-input.\n   */\n  @Prop({ mutable: true }) size: \"small\" | \"medium\" | \"large\" = \"medium\";\n  /** Sets the internal input value */\n  @Prop({ mutable: true, reflect: true }) value: string;\n  /** Sets the selected options when multiple is activated */\n  @Prop({ mutable: true, reflect: true }) multipleValues: Array<string> = [];\n  /** Sets the selected dropdown value when dropdown is activated */\n  @Prop() selectedDropdownValue = \"\";\n  /** Sets the internal input placeholder. */\n  @Prop({ mutable: true, reflect: true }) placeholder: string;\n  /** Sets the internal input in disabled state. */\n  @Prop({ mutable: true, reflect: true }) disabled: boolean;\n  /** Sets the internal input in readonly state. */\n  @Prop({ mutable: true, reflect: true }) isReadonly: boolean;\n  /** Sets the internal input in error state. */\n  @Prop({ mutable: true, reflect: true }) error: boolean;\n  /** Toggles the required sign in the internal input */\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  /** 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 items list width */\n  @Prop({ mutable: true }) matchWidth: boolean = true;\n  /** Debounce time for key inputs before the search */\n  @Prop() debounce: number;\n  /** Allows user to define a search icon inside the input at its right (zoom by default) . */\n  @Prop() actionIcon: string = \"zoom\";\n  /** Sets the autocomplete clear button visibility. */\n  @Prop() showClearButton: boolean = true;\n  /** \n   * Shows a dropdown chevron arrow that flips up/down when change state open/close.\n   * Also enables the selectedDropdownValue prop to be able to select an option from dropdown\n   * When multiple is true, this prop will be set to false.\n   */\n  @Prop() dropdown: boolean = false;\n  /** Sets the autocomplete dropdown chevron icon visibility. */\n  @Prop() showDropdownIcon: boolean = true;\n  /** Enables a message when there's no match options. */\n  @Prop() showEmptyMessage: boolean = false;\n  /** Allow to set the text message in the 'emptyMessage' state. */\n  @Prop() emptyMessage: string = \"No options\";\n  /** \n   * Allow multiple values to be selected.\n   * Also enables the multipleValues prop to be able to select multiple options\n   * When multiple is true, dropdown prop will be set to false.\n   * When multiple is true, valueChanged will emit an array of strings\n   */\n  @Prop() multiple: boolean = false;\n  /** \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  /** \n   * Clear selection and input on clicking the close button.\n   * Only works when multiple is true.\n   */\n  @Prop() clearSelection: 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(s) */\n  @Event() valueChanged: EventEmitter<string | string[]>;\n  /** Emits an event when the clear button is clicked */\n  @Event() cleared: EventEmitter<void>;\n  /** Emits an event when the user click the actionIcon (the magnifying glass) */\n  @Event() actionIconClick: EventEmitter<void>;\n  /** Emits updated inputed value from the vds-basic-input similar to the input event */\n\t@Event() changeInput: EventEmitter<string>;\n\n  @Element() hostEl: HTMLElement;\n\n  autocompleteContent: HTMLDivElement;\n  basicInput: HTMLVdsBasicInputElement;\n  \n  floatingCleanUp: () => void = () => {};\n  @State() isOpened: boolean = false;\n  @State() multiselectValues: Array<string>;\n  options: HTMLVdsAutocompleteItemElement[] = [];\n  autocompleteItemEmptyOption: HTMLVdsAutocompleteItemElement;\n  debounceTimeTracker: NodeJS.Timeout = null;\n  showUnfilteredOptions: boolean = false;\n  private updateContainerWidth = updateContainerWidth;\n  validateDropdownValue: boolean;\n\n  componentWillLoad(): void {\n    this.multiselectValues = this.multipleValues;\n    this.validateDropdownValue = true;\n  }\n\n  componentWillRender(): void {\n    if (this.multiple) {\n      this.dropdown = false;\n    }\n  }\n  \n  componentDidLoad(): void {\n    this.options = Array.from(this.hostEl.querySelectorAll(\"vds-autocomplete-item\"));\n    this.setPreselection();\n  }\n\n  componentDidRender(): void {\n    this.options = Array.from(this.hostEl.querySelectorAll(\"vds-autocomplete-item\"));\n    updateFloatingBoxPosition(this.basicInput, this.autocompleteContent, null, 'bottom', false);\n    this.updateContainerWidth(this.basicInput, this.matchWidth, this.autocompleteContent);\n    this.setPreselection();\n  }\n\n  @Watch(\"multiselectValues\")\n  setMulitpleValueHandler() {\n    this.valueChanged.emit(this.multiselectValues);\n  }\n\n  @Watch(\"disabled\")\n  setDisabledState() {\n    this.close();\n  }\n\n  @Watch(\"selectedDropdownValue\")\n  setDropdownValueValidation() {\n    this.validateDropdownValue = true;\n  }\n\n  @Watch(\"isOpened\")\n  async toggleAutocomplete(): Promise<void> {\n    if (this.isOpened) {\n      toggleContainerDisplay(this.autocompleteContent, true);\n      this.opened.emit();\n      this.floatingCleanUp = await updateFloatingBoxPosition(this.basicInput, this.autocompleteContent, null, \"bottom\", this.autoPosition);\n    } else {\n      toggleContainerDisplay(this.autocompleteContent, false);\n      this.closed.emit();\n      this.floatingCleanUp();\n    }\n  }\n\n  /* Open the floating element(menu) of the autocomplete. */\n  @Method()\n  public async open(): Promise<void> {\n    if (!this.isReadonly && !this.disabled) {\n      setTimeout(() => {\n        this.isOpened = true;\n      });\n    }\n  }\n\n  /* Close the floating element(menu) of the autocomplete. */\n  @Method()\n  public async close(): Promise<void> {\n    this.isOpened = false;\n  }\n\n  /* Sets focus to the input element */\n  @Method()\n  public async setFocus(): Promise<void> {\n    this.basicInput.setFocus();\n    setTimeout(() => {\n      this.open();\n    });\n  }\n\n  /**\n   * Sets the autocomplete input value to handle filtering.\n   *\n   * @returns {Promise<void>} \n   */\n  @Method()\n  public async setValue(value: string): Promise<void> {\n    this.value = value;\n  }\n\n  /**\n   * Sets the autocomplete selection value to handle.\n   * When multiple is true, sets the selected values from the list\n   * When dropdown is true and multiple is false, sets a single selected value.\n   * When dropdown is false and When multiple is false, set the input value\n   *\n   * @returns {Promise<void>} \n   */\n    @Method()\n    public async setSelectionValue(value: string | string[]): Promise<void> {\n      if (this.multiple && Array.isArray(value)) {\n        this.multipleValues = this.multiselectValues = value;\n      }\n      if (typeof value === \"string\") {\n        if (this.dropdown) {\n          this.selectedDropdownValue = value;\n        }\n        this.value = value;\n      }\n    }\n\n  /**\n   * Return the autocomplete value.\n   *\n   * @returns {Promise<string>} A promise that resolves by returning the autocomplete value.\n   */\n  @Method()\n  public async getValue(): Promise<string | string[]> {\n    if (this.multiple) {\n      return this.multipleValues;\n    }\n    if (this.dropdown) {\n      return this.selectedDropdownValue;\n    }\n    return this.value;\n  }\n\n  /**\n   * Clears the selected options and resets the value of the autocomplete.\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    if (this.dropdown) {\n      this.clearOptions();\n    }\n    if (this.clearSelection && this.multiple) {\n      this.multipleValues = this.multiselectValues = [];\n      this.setOptionsMultiple();\n    }\n    this.cleared.emit();\n  }\n\n  @Listen(\"autocompleteClicked\")\n  handleSelectOption(evt: CustomEvent<{value: string, selected: boolean}>): void {\n    const selectedOption = this.options.find((option) => findOptionByExactValue(option, evt.detail.value));\n    const isValidOption: boolean = selectedOption !== null && selectedOption !== undefined;\n    \n    if (isValidOption && this.multiple) {\n      selectedOption.isSelected = evt.detail.selected;\n    }\n\n    this.handleValueAssignment(evt);\n\n    if (isValidOption && this.dropdown) {\n      this.setOptionsSingle(evt.detail.value);\n    }\n  }\n\n  /* Close the autocomplete when click outside */\n  @Listen('click', { target: 'window' })\n  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 isClickInsideParentAutocomplete = target.nodeName === \"VDS-AUTOCOMPLETE\" && target.shadowRoot && (evt.target as HTMLElement).shadowRoot.contains(this.hostEl);\n    if (!isClickInside && !isClickInsideParentAutocomplete) {\n      this.isOpened = false;\n    }\n  }\n\n  @Listen('keyup', { target: 'window' })\n  handleEscPress(evt: any) {\n    if (this.isOpened && evt.code === \"Escape\") {\n      this.close();\n      this.basicInput.blur();\n    }\n  }\n\n  handleMultiselection(selection: {value: string, selected: boolean}): void {\n    if (selection.selected && !this.multipleValues.find(value => value.toLowerCase() === selection.value.toLowerCase())) {\n      this.multipleValues.push(selection.value);\n    } else {\n      this.multipleValues = this.multipleValues.filter(value => value.toLowerCase() !== selection.value.toLowerCase());\n    }\n    this.multiselectValues = Array.from(this.multipleValues);\n    this.basicInput.setFocus();\n  }\n\n  handleValueAssignment(evt: CustomEvent<{value: string, selected: boolean}>): void {\n    if (this.multiple) {\n      this.handleMultiselection(evt.detail)\n    } else {\n      this.value = evt.detail.value;\n      this.setSelectionValue(evt.detail.value);\n      this.valueChanged.emit(this.value);\n      this.close();\n    }\n  }\n\n  handleChange(evt: CustomEvent<string>) {\n    evt.stopPropagation();\n    this.changeInput.emit(evt.detail);\n    if (this.debounce !== undefined && this.debounce > 0) {\n      this.handleDebounceValueChange(evt.detail);\n    } else {\n      this.value = evt.detail;\n    }\n    if (this.dropdown) {\n      this.showUnfilteredOptions = false;\n    }\n  }\n\n  hasFocus(): void {\n    this.open();\n    if (this.hasValue() && this.dropdown) {\n      this.showUnfilteredOptions = true;\n      this.validateDropdownValue = false;\n    }\n  }\n\n  lostFocus(): void {\n    if (this.dropdown) {\n      this.showUnfilteredOptions = false;\n      this.validateDropdownValue = true;\n    }\n  }\n\n  emitActionIcon(): void {\n    this.actionIconClick.emit();\n  }\n\n  handleDebounceValueChange(newValue: string): void {\n\t\tif (this.debounceTimeTracker !== null) {\n\t\t\tclearTimeout(this.debounceTimeTracker);\n\t\t\tthis.debounceTimeTracker = null;\n\t\t}\n\t\tthis.debounceTimeTracker = setTimeout(() => {\n      this.value = newValue;\n\t\t\tthis.debounceTimeTracker = null;\n\t\t}, this.debounce);\n\t}\n\n\n  private hasValue(): boolean {\n    return this.value !== null && this.value !== undefined && this.value !== \"undefined\" && this.value !== \"\";\n  }\n\n  /**\n   * Sets autocomplete styles for JSX.style property\n   *\n   * @param maxHeight string\n   * @returns { [key: string]: string }\n   */\n  private setAutoCompleteStyles = (maxHeight: string): { [key: string]: string } => {\n    let styles = {};\n\n    styles = {\n        maxHeight: maxHeight ? maxHeight : undefined,\n    }\n\n    return styles;\n  }\n\n  setPreselection(): void {\n    if (this.multiple) {\n      this.setOptionsMultiple();\n    }\n    if (this.dropdown) {\n      this.setDropdownOption();\n    }\n  }\n\n  private setOptionsMultiple(): void {\n    try {\n      this.options.forEach(item => {\n        item.hasCheckmark = true;\n        const selection = this.multipleValues?.find(value => findOptionByExactValue(item, value));\n        item.isSelected = !!selection;\n      });\n    } \n    catch (error) {\n      console.warn(\"[setOptionsMultiple]\", error);\n    }\n  }\n\n  /**\n   * Sets the selected value for a autocomplete type dropdown and updates the options accordingly.\n   * @private\n   * @param {string} selectedValue - The value of the selected option.\n   */\n  private setOptionsSingle(selectedValue: string): void {\n    try {\n      this.selectedDropdownValue = selectedValue;\n      this.options.forEach(item => {\n        item.hasCheckmark = false;\n        item.isSelected = findOptionByExactValue(item, this.selectedDropdownValue);\n      });\n    } \n    catch (error) {\n      console.warn(\"[setOptionsSingle]\", error);\n    }\n  }\n\n  private setDropdownOption(): void {\n    try {\n      const hasValidValue = this.options?.some(opt => findOptionByExactValue(opt, this.selectedDropdownValue));\n      if (\n        hasValidValue &&\n        this.selectedDropdownValue !== undefined &&\n        this.selectedDropdownValue !== \"undefined\" &&\n        this.selectedDropdownValue !== \"\"\n      ) {\n        this.setOptionsSingle(this.selectedDropdownValue);\n\n        if (this.validateDropdownValue) {\n          this.value = this.selectedDropdownValue;\n          this.validateDropdownValue = false;\n        }\n      }\n    } \n    catch (error) {\n      console.warn(\"[setOptionsMultiple]\", error);\n    }\n  }\n\n  /**\n   * Sets the all the options to unselected state\n   * @private\n   * @param {string} selectedValue - The value of the selected option.\n   */\n  private clearOptions(): void {\n    try {\n      this.selectedDropdownValue = null;\n      this.options.forEach(item => {\n        item.hasCheckmark = item.isSelected = false;\n      });\n    } \n    catch (error) {\n      console.warn(\"[clearOptions]\", error);\n    }\n  }\n\n  private renderUnfilteredOptions(): HTMLStencilElement {\n    return (\n      <div \n        class={combineClasses('vds-basic-autocomplete__content-options', this.maxHeight ? 'scrollable' : '')}\n        style={this.setAutoCompleteStyles(this.maxHeight)}\n      >\n        <slot name={\"items\"}></slot>\n        <slot></slot>\n      </div>\n    );\n  }\n\n  private renderItem(item: HTMLVdsAutocompleteItemElement): HTMLStencilElement {\n    let isSelected = false;\n    if (this.multiple) {\n      isSelected = this.multipleValues?.some(value => findOptionByValue(item, value));\n    }\n    return (\n      <vds-autocomplete-item isSelected={isSelected} hasCheckmark={this.multiple} {...cloneAttributes(item)} innerHTML={item.innerHTML}></vds-autocomplete-item>\n    );\n  }\n\n  private renderFilteredOptions(): HTMLStencilElement {\n    const value = this.hasValue() ? this.value : \"\";\n    const filteredOptions = getFilteredOptions(this.options, value);\n    if (filteredOptions.length === 0) {\n      return this.showEmptyMessage && this.emptyMessage ? this.renderEmptyOption() : null;\n    }\n  \n    return (\n      <div\n        class={combineClasses('vds-basic-autocomplete__content-options', this.maxHeight ? 'scrollable' : '')}\n        style={this.setAutoCompleteStyles(this.maxHeight)}\n      >\n        {filteredOptions.map(item => this.renderItem(item))}\n      </div>\n    );\n  }\n\n  private renderEmptyOption(): HTMLStencilElement {\n    if (!this.autocompleteItemEmptyOption) {\n      this.autocompleteItemEmptyOption = document.createElement(\"vds-autocomplete-item\");\n      this.autocompleteItemEmptyOption.classList.add(\"non-clickable\");\n      this.autocompleteItemEmptyOption.value = \"\";\n      this.autocompleteItemEmptyOption.setAttribute(\"value\", \"\");\n    }\n\n    this.autocompleteItemEmptyOption.setAttribute(\"size\", this.size);\n    this.autocompleteItemEmptyOption.setAttribute(\"label\", this.emptyMessage);\n\n    return this.renderItem(this.autocompleteItemEmptyOption);\n  }\n\n  private renderClearIcon(): HTMLStencilElement {\n    const disabled = this.disabled || this.isReadonly;\n    return (\n      <vds-icon-button\n        tabIndex={disabled ? -1 : undefined}\n        disabled={disabled}\n        variant=\"secondary\"\n        size={this.size === \"medium\" ? \"small\" : this.size === \"small\" ? \"extra-small\" : \"medium\"}\n        icon={\"close\"}\n        onClick={disabled ? undefined : () => { this.clear(); this.basicInput.setFocus();}}\n      ></vds-icon-button>\n    );\n  }\n\n  private renderActionIcon(): HTMLStencilElement {\n    const disabled = this.disabled || this.isReadonly;\n    if (this.dropdown && this.showDropdownIcon) {\n      return (\n        <vds-icon\n          svgIcon={this.isOpened ? 'chevron-up' : 'chevron-down'}\n          color={disabled ? 'color-icon-disabled' : 'color-icon-high'}\n          size={getIconSize(this.size)}\n          onClick={disabled ? undefined : () => this.isOpened ? this.close() : this.open()}\n        ></vds-icon>\n      );\n    } \n    if (this.actionIcon) {\n      return (\n        <vds-icon-button\n          tabIndex={disabled ? -1 : undefined}\n          disabled={disabled}\n          variant=\"secondary\"\n          size={this.size === \"medium\" ? \"small\" : this.size === \"small\" ? \"extra-small\" : \"medium\"}\n          icon={this.actionIcon}\n          onClick={disabled ? undefined : () => this.emitActionIcon()}\n        ></vds-icon-button>\n      )\n    }\n  }\n\n  private renderOptions(): HTMLStencilElement {\n    if (this.dropdown && this.showUnfilteredOptions) {\n      return this.renderUnfilteredOptions();\n    }\n\n    if (this.hasValue()) {\n      return this.renderFilteredOptions();\n    }\n\n    return this.renderUnfilteredOptions();\n  }\n\n  render(): HTMLStencilElement {\n    const filteredOptions = getFilteredOptions(this.options, this.value || \"\");\n    return (\n      <Host class={this.disabled ? \"vds-basic-autocomplete--disabled\" : \"\"} title={this.value}>\n        <div class={combineClasses(\"vds-basic-autocomplete__container\")}>\n          <vds-basic-input\n            ref={(el) => {\n              if (el) {\n                this.basicInput = el; \n              }\n            }}\n            type=\"text\"\n            placeholder={this.placeholder}\n            value={this.value}\n            size={this.size}\n            disabled={this.disabled}\n            isReadonly={this.isReadonly}\n            error={this.error}\n            isRequired={this.isRequired}\n            formatter={this.formatter}\n            informativeIcon={this.informativeIcon}\n            allowedStyles={this.allowedStyles}\n            onChangeInput={(evt): void => this.handleChange(evt)}\n            onFocus={(): void => this.hasFocus()}\n            onBlur={(): void => this.lostFocus()}\n          >\n            {this.showClearButton && this.hasValue() && (\n              <div class=\"vds-basic-autocomplete__secondary-action\" slot=\"secondaryActionIcon\">\n                {this.renderClearIcon()}\n              </div>\n            )}\n            {((this.dropdown && this.showDropdownIcon) || this.actionIcon) && (\n              <div class=\"vds-basic-autocomplete__primary-action\" slot=\"primaryActionIcon\">\n                {this.renderActionIcon()}\n              </div>\n            )}\n          </vds-basic-input>\n          {this.backdrop && this.isOpened ? <div class=\"vds-floating-backdrop\" onClick={this.close.bind(this)}></div> : ''}\n          <div \n            ref={(el): void => { if (el) this.autocompleteContent = el;}}\n            class={\n              combineClasses(\n                \"vds-basic-autocomplete__content\",\n                this.maxHeight ? \"has-scroll\" : \"\",\n                (!this.emptyMessage || this.emptyMessage === \"\") && filteredOptions.length === 0 ? \"no-shadow\" : \"\",\n                !this.showEmptyMessage && filteredOptions.length === 0 ? \"no-shadow\" : \"\",\n                !this.value && this.options.length === 0 ? \"no-shadow\" : \"\"\n              )}\n          >\n            <div class={\"vds-basic-autocomplete__content__header\"}>\n              <slot name=\"header\"></slot>\n            </div>\n            {this.renderOptions()}\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"vds-basic-autocomplete.js","sourceRoot":"","sources":["../../../src/components/autocomplete/vds-basic-autocomplete.tsx"],"names":[],"mappings":"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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, Prop, Watch, h, Event, EventEmitter, Method, State, Element } from '@stencil/core';\nimport { combineClasses } from '../../utils/combine-classes';\nimport { toggleContainerDisplay, updateContainerWidth } from '../basic-dropdown/vds-basic-dropdown.utils';\nimport { updateFloatingBoxPosition } from '../../utils/floating-engine-utils';\nimport { HTMLStencilElement, Listen } from '@stencil/core/internal';\nimport { cloneAttributes } from '../../utils/clone-attributes';\nimport { findOptionByExactValue, findOptionByValue, getFilteredOptions, SelectedValueChangedEventDetail } from './vds-basic-autocomplete.utils';\nimport { getIconSize, getActionIconButtonSize, getIconColor } from '../../utils/icon-attr.utils';\n\n@Component({\n  tag: 'vds-basic-autocomplete',\n  styleUrl: 'vds-basic-autocomplete.scss',\n  shadow: true,\n})\nexport class VdsBasicAutocomplete {\n\n  /** \n   * Sets the internal input size.\n   * If multiple property is true, This will only set the basic-input text value.\n   * If multiple property is false and the value prop matches with an option, the option will be selected,\n   * Otherwise text will be set in the basic-input.\n   */\n  @Prop({ mutable: true }) size: \"small\" | \"medium\" | \"large\" = \"medium\";\n  /** Sets the internal input value */\n  @Prop({ mutable: true, reflect: true }) value: string;\n  /** Sets the selected options when multiple is activated */\n  @Prop({ mutable: true, reflect: true }) multipleValues: Array<string> = [];\n  /** Sets the selected dropdown value when dropdown is activated */\n  @Prop() selectedDropdownValue = \"\";\n  /** Sets the internal input placeholder. */\n  @Prop({ mutable: true, reflect: true }) placeholder: string;\n  /** Sets the internal input in disabled state. */\n  @Prop({ mutable: true, reflect: true }) disabled: boolean;\n  /** Sets the internal input in readonly state. */\n  @Prop({ mutable: true, reflect: true }) isReadonly: boolean;\n  /** Sets the internal input in error state. */\n  @Prop({ mutable: true, reflect: true }) error: boolean;\n  /** Toggles the required sign in the internal input */\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  /** 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 items list width */\n  @Prop({ mutable: true }) matchWidth: boolean = true;\n  /** Debounce time for key inputs before the search */\n  @Prop() debounce: number;\n  /** Allows user to define a search icon inside the input at its right (zoom by default) . */\n  @Prop() actionIcon: string = \"zoom\";\n  /** Sets the autocomplete clear button visibility. */\n  @Prop() showClearButton: boolean = true;\n  /** \n   * Shows a dropdown chevron arrow that flips up/down when change state open/close.\n   * Also enables the selectedDropdownValue prop to be able to select an option from dropdown\n   * When multiple is true, this prop will be set to false.\n   */\n  @Prop() dropdown: boolean = false;\n  /** Sets the autocomplete dropdown chevron icon visibility. */\n  @Prop() showDropdownIcon: boolean = true;\n  /** Enables a message when there's no match options. */\n  @Prop() showEmptyMessage: boolean = false;\n  /** Allow to set the text message in the 'emptyMessage' state. */\n  @Prop() emptyMessage: string = \"No options\";\n  /** \n   * Allow multiple values to be selected.\n   * Also enables the multipleValues prop to be able to select multiple options\n   * When multiple is true, dropdown prop will be set to false.\n   * When multiple is true, valueChanged will emit an array of strings\n   */\n  @Prop() multiple: boolean = false;\n  /** \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  /** \n   * Clear selection and input on clicking the close button.\n   * Only works when multiple is true.\n   */\n  @Prop() clearSelection: 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 label of the selected item(s) */\n  @Event() valueChanged: EventEmitter<string | string[]>;\n  /** Emits an event when the clear button is clicked */\n  @Event() cleared: EventEmitter<void>;\n  /** Emits an event when the user click the actionIcon (the magnifying glass) */\n  @Event() actionIconClick: EventEmitter<void>;\n  /** Emits updated inputed value from the vds-basic-input similar to the input event */\n\t@Event() changeInput: EventEmitter<string>;\n  /** Emits event when an item is selected, this event contains the value of the selected item(s) */\n\t@Event() selectedValueChanged: EventEmitter<SelectedValueChangedEventDetail>;\n\n  @Element() hostEl: HTMLElement;\n\n  autocompleteContent: HTMLDivElement;\n  basicInput: HTMLVdsBasicInputElement;\n  \n  floatingCleanUp: () => void = () => {};\n  @State() isOpened: boolean = false;\n  @State() multiselectValues: Array<string>;\n  options: HTMLVdsAutocompleteItemElement[] = [];\n  autocompleteItemEmptyOption: HTMLVdsAutocompleteItemElement;\n  debounceTimeTracker: NodeJS.Timeout = null;\n  showUnfilteredOptions: boolean = false;\n  private updateContainerWidth = updateContainerWidth;\n  validateDropdownValue: boolean;\n\n  componentWillLoad(): void {\n    this.multiselectValues = this.multipleValues;\n    this.validateDropdownValue = true;\n  }\n\n  componentWillRender(): void {\n    if (this.multiple) {\n      this.dropdown = false;\n    }\n  }\n  \n  componentDidLoad(): void {\n    this.options = Array.from(this.hostEl.querySelectorAll(\"vds-autocomplete-item\"));\n    this.setPreselection();\n  }\n\n  componentDidRender(): void {\n    this.options = Array.from(this.hostEl.querySelectorAll(\"vds-autocomplete-item\"));\n    updateFloatingBoxPosition(this.basicInput, this.autocompleteContent, null, 'bottom', false);\n    this.updateContainerWidth(this.basicInput, this.matchWidth, this.autocompleteContent);\n    this.setPreselection();\n  }\n\n  @Watch(\"multiselectValues\")\n  setMulitpleValueHandler() {\n    this.valueChanged.emit(this.multiselectValues);\n  }\n\n  @Watch(\"disabled\")\n  setDisabledState() {\n    this.close();\n  }\n\n  @Watch(\"selectedDropdownValue\")\n  setDropdownValueValidation() {\n    this.validateDropdownValue = true;\n  }\n\n  @Watch(\"isOpened\")\n  async toggleAutocomplete(): Promise<void> {\n    if (this.isOpened) {\n      toggleContainerDisplay(this.autocompleteContent, true);\n      this.opened.emit();\n      this.floatingCleanUp = await updateFloatingBoxPosition(this.basicInput, this.autocompleteContent, null, \"bottom\", this.autoPosition);\n    } else {\n      toggleContainerDisplay(this.autocompleteContent, false);\n      this.closed.emit();\n      this.floatingCleanUp();\n    }\n  }\n\n  /* Open the floating element(menu) of the autocomplete. */\n  @Method()\n  public async open(): Promise<void> {\n    if (!this.isReadonly && !this.disabled) {\n      setTimeout(() => {\n        this.isOpened = true;\n      });\n    }\n  }\n\n  /* Close the floating element(menu) of the autocomplete. */\n  @Method()\n  public async close(): Promise<void> {\n    this.isOpened = false;\n  }\n\n  /* Sets focus to the input element */\n  @Method()\n  public async setFocus(): Promise<void> {\n    this.basicInput.setFocus();\n    setTimeout(() => {\n      this.open();\n    });\n  }\n\n  /**\n   * Sets the autocomplete input value to handle filtering.\n   *\n   * @returns {Promise<void>} \n   */\n  @Method()\n  public async setValue(value: string): Promise<void> {\n    this.value = value;\n  }\n\n  /**\n   * Sets the autocomplete selection value to handle.\n   * When multiple is true, sets the selected values from the list\n   * When dropdown is true and multiple is false, sets a single selected value.\n   * When dropdown is false and When multiple is false, set the input value\n   *\n   * @returns {Promise<void>} \n   */\n    @Method()\n    public async setSelectionValue(value: string | string[]): Promise<void> {\n      if (this.multiple && Array.isArray(value)) {\n        this.multipleValues = this.multiselectValues = value;\n      }\n      if (typeof value === \"string\") {\n        if (this.dropdown) {\n          this.selectedDropdownValue = value;\n        }\n      }\n    }\n\n  /**\n   * Return the autocomplete value.\n   *\n   * @returns {Promise<string>} A promise that resolves by returning the autocomplete value.\n   */\n  @Method()\n  public async getValue(): Promise<string | string[]> {\n    if (this.multiple) {\n      return this.multipleValues;\n    }\n    if (this.dropdown) {\n      return this.selectedDropdownValue;\n    }\n    return this.value;\n  }\n\n  /**\n   * Clears the selected options and resets the value of the autocomplete.\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    if (this.dropdown) {\n      this.clearOptions();\n    }\n    if (this.clearSelection && this.multiple) {\n      this.multipleValues = this.multiselectValues = [];\n      this.setOptionsMultiple();\n    }\n    this.cleared.emit();\n  }\n\n  @Listen(\"autocompleteClicked\")\n  handleSelectOption(evt: CustomEvent<{value: string, selected: boolean}>): void {\n    const selectedOption = this.options.find((option) => findOptionByExactValue(option, evt.detail.value));\n    const isValidOption: boolean = selectedOption !== null && selectedOption !== undefined;\n    \n    if (isValidOption && this.multiple) {\n      selectedOption.isSelected = evt.detail.selected;\n    }\n\n    this.handleValueAssignment(evt, selectedOption);\n\n    if (isValidOption && this.dropdown) {\n      this.setOptionsSingle(evt.detail.value);\n    }\n  }\n\n  /* Close the autocomplete when click outside */\n  @Listen('click', { target: 'window' })\n  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 isClickInsideParentAutocomplete = target.nodeName === \"VDS-AUTOCOMPLETE\" && target.shadowRoot && (evt.target as HTMLElement).shadowRoot.contains(this.hostEl);\n    if (!isClickInside && !isClickInsideParentAutocomplete) {\n      this.isOpened = false;\n    }\n  }\n\n  @Listen('keyup', { target: 'window' })\n  handleEscPress(evt: any) {\n    if (this.isOpened && evt.code === \"Escape\") {\n      this.close();\n      this.basicInput.blur();\n    }\n  }\n\n  handleMultiselection(selection: {value: string, selected: boolean}): void {\n    if (selection.selected && !this.multipleValues.find(value => value.toLowerCase() === selection.value.toLowerCase())) {\n      this.multipleValues.push(selection.value);\n    } else {\n      this.multipleValues = this.multipleValues.filter(value => value.toLowerCase() !== selection.value.toLowerCase());\n    }\n    this.multiselectValues = Array.from(this.multipleValues);\n    this.basicInput.setFocus();\n  }\n\n  handleValueAssignment(evt: CustomEvent<{ value: string; selected: boolean; }>, selectedOption: HTMLVdsAutocompleteItemElement): void {\n    if (this.multiple) {\n      this.handleMultiselection(evt.detail)\n    } else {\n      this.value = evt.detail.value;\n      this.setSelectionValue(evt.detail.value);\n      this.valueChanged.emit(this.value);\n      if (selectedOption)\n      {\n        this.selectedValueChanged.emit(\n          {\n            label: selectedOption.label,\n            value: selectedOption.value,\n            target: selectedOption\n          }\n        );\n      }\n      this.handleInputChange();\n      this.close();\n    }\n  }\n\n  handleChange(evt: CustomEvent<string>) {\n    evt.stopPropagation();\n    this.changeInput.emit(evt.detail);\n    if (this.debounce !== undefined && this.debounce > 0) {\n      this.handleDebounceValueChange(evt.detail);\n    } else {\n      this.value = evt.detail;\n    }\n    if (this.dropdown) {\n      this.showUnfilteredOptions = false;\n    }\n  }\n\n  handleInputChange(): void {\n    const inputEvent = new InputEvent(\"input\");\n    this.hostEl.dispatchEvent(inputEvent);\n  }\n\n  hasFocus(): void {\n    this.open();\n    if (this.hasValue() && this.dropdown) {\n      this.showUnfilteredOptions = true;\n      this.validateDropdownValue = false;\n    }\n  }\n\n  lostFocus(): void {\n    if (this.dropdown) {\n      this.showUnfilteredOptions = false;\n      this.validateDropdownValue = true;\n    }\n  }\n\n  emitActionIcon(): void {\n    this.actionIconClick.emit();\n  }\n\n  handleDebounceValueChange(newValue: string): void {\n\t\tif (this.debounceTimeTracker !== null) {\n\t\t\tclearTimeout(this.debounceTimeTracker);\n\t\t\tthis.debounceTimeTracker = null;\n\t\t}\n\t\tthis.debounceTimeTracker = setTimeout(() => {\n      this.value = newValue;\n\t\t\tthis.debounceTimeTracker = null;\n\t\t}, this.debounce);\n\t}\n\n\n  private hasValue(): boolean {\n    return this.value !== null && this.value !== undefined && this.value !== \"undefined\" && this.value !== \"\";\n  }\n\n  /**\n   * Sets autocomplete styles for JSX.style property\n   *\n   * @param maxHeight string\n   * @returns { [key: string]: string }\n   */\n  private setAutoCompleteStyles = (maxHeight: string): { [key: string]: string } => {\n    let styles = {};\n\n    styles = {\n        maxHeight: maxHeight ? maxHeight : undefined,\n    }\n\n    return styles;\n  }\n\n  setPreselection(): void {\n    if (this.multiple) {\n      this.setOptionsMultiple();\n    }\n    if (this.dropdown) {\n      this.setDropdownOption();\n    }\n  }\n\n  private setOptionsMultiple(): void {\n    try {\n      this.options.forEach(item => {\n        item.hasCheckmark = true;\n        const selection = this.multipleValues?.find(value => findOptionByExactValue(item, value));\n        item.isSelected = !!selection;\n      });\n    } \n    catch (error) {\n      console.warn(\"[setOptionsMultiple]\", error);\n    }\n  }\n\n  /**\n   * Sets the selected value for a autocomplete type dropdown and updates the options accordingly.\n   * @private\n   * @param {string} selectedValue - The value of the selected option.\n   */\n  private setOptionsSingle(selectedValue: string): void {\n    try {\n      this.selectedDropdownValue = selectedValue;\n      this.options.forEach(item => {\n        item.hasCheckmark = false;\n        item.isSelected = findOptionByExactValue(item, this.selectedDropdownValue);\n      });\n    } \n    catch (error) {\n      console.warn(\"[setOptionsSingle]\", error);\n    }\n  }\n\n  private setDropdownOption(): void {\n    try {\n      const hasValidValue = this.options?.some(opt => findOptionByExactValue(opt, this.selectedDropdownValue));\n      if (\n        hasValidValue &&\n        this.selectedDropdownValue !== undefined &&\n        this.selectedDropdownValue !== \"undefined\" &&\n        this.selectedDropdownValue !== \"\"\n      ) {\n        this.setOptionsSingle(this.selectedDropdownValue);\n\n        if (this.validateDropdownValue) {\n          const option = this.options?.find(opt => findOptionByExactValue(opt, this.selectedDropdownValue));\n          this.value = option ? (option.label || option.value) : this.value;\n          this.validateDropdownValue = false;\n        }\n      }\n    } \n    catch (error) {\n      console.warn(\"[setOptionsMultiple]\", error);\n    }\n  }\n\n  /**\n   * Sets the all the options to unselected state\n   * @private\n   * @param {string} selectedValue - The value of the selected option.\n   */\n  private clearOptions(): void {\n    try {\n      this.selectedDropdownValue = null;\n      this.options.forEach(item => {\n        item.hasCheckmark = item.isSelected = false;\n      });\n    } \n    catch (error) {\n      console.warn(\"[clearOptions]\", error);\n    }\n  }\n\n  private renderUnfilteredOptions(): HTMLStencilElement {\n    return (\n      <div \n        class={combineClasses('vds-basic-autocomplete__content-options', this.maxHeight ? 'scrollable' : '')}\n        style={this.setAutoCompleteStyles(this.maxHeight)}\n      >\n        <slot name={\"items\"}></slot>\n        <slot></slot>\n      </div>\n    );\n  }\n\n  private renderItem(item: HTMLVdsAutocompleteItemElement): HTMLStencilElement {\n    let isSelected = false;\n    if (this.multiple) {\n      isSelected = this.multipleValues?.some(value => findOptionByValue(item, value));\n    }\n    return (\n      <vds-autocomplete-item isSelected={isSelected} hasCheckmark={this.multiple} {...cloneAttributes(item)} innerHTML={item.innerHTML}></vds-autocomplete-item>\n    );\n  }\n\n  private renderFilteredOptions(): HTMLStencilElement {\n    const value = this.hasValue() ? this.value : \"\";\n    const filteredOptions = getFilteredOptions(this.options, value);\n    if (filteredOptions.length === 0) {\n      return this.showEmptyMessage && this.emptyMessage ? this.renderEmptyOption() : null;\n    }\n  \n    return (\n      <div\n        class={combineClasses('vds-basic-autocomplete__content-options', this.maxHeight ? 'scrollable' : '')}\n        style={this.setAutoCompleteStyles(this.maxHeight)}\n      >\n        {filteredOptions.map(item => this.renderItem(item))}\n      </div>\n    );\n  }\n\n  private renderEmptyOption(): HTMLStencilElement {\n    if (!this.autocompleteItemEmptyOption) {\n      this.autocompleteItemEmptyOption = document.createElement(\"vds-autocomplete-item\");\n      this.autocompleteItemEmptyOption.classList.add(\"non-clickable\");\n      this.autocompleteItemEmptyOption.value = \"\";\n      this.autocompleteItemEmptyOption.setAttribute(\"value\", \"\");\n    }\n\n    this.autocompleteItemEmptyOption.setAttribute(\"size\", this.size);\n    this.autocompleteItemEmptyOption.setAttribute(\"label\", this.emptyMessage);\n\n    return this.renderItem(this.autocompleteItemEmptyOption);\n  }\n\n  private renderClearIcon(): HTMLStencilElement {\n    const disabled = this.disabled || this.isReadonly;\n    return (\n      <vds-icon-button\n        tabIndex={disabled ? -1 : undefined}\n        disabled={disabled}\n        variant=\"secondary\"\n        size={getActionIconButtonSize(this.size)}\n        icon={\"close\"}\n        onClick={disabled ? undefined : () => { this.clear(); this.basicInput.setFocus();}}\n      ></vds-icon-button>\n    );\n  }\n\n  private renderActionIcon(): HTMLStencilElement {\n    const disabled = this.disabled || this.isReadonly;\n    if (this.dropdown && this.showDropdownIcon) {\n      return (\n        <vds-icon\n          svgIcon={this.isOpened ? 'chevron-up' : 'chevron-down'}\n          color={getIconColor(this.disabled, this.isReadonly)}\n          size={getIconSize(this.size)}\n          onClick={disabled ? undefined : () => this.isOpened ? this.close() : this.open()}\n        ></vds-icon>\n      );\n    }\n    if (this.actionIcon) {\n      return (\n        <vds-icon-button\n          tabIndex={disabled ? -1 : undefined}\n          disabled={disabled}\n          variant=\"secondary\"\n          size={getActionIconButtonSize(this.size)}\n          icon={this.actionIcon}\n          onClick={disabled ? undefined : () => this.emitActionIcon()}\n        ></vds-icon-button>\n      );\n    }\n  }\n\n  private renderOptions(): HTMLStencilElement {\n    if (this.dropdown && this.showUnfilteredOptions) {\n      return this.renderUnfilteredOptions();\n    }\n\n    if (this.hasValue()) {\n      return this.renderFilteredOptions();\n    }\n\n    return this.renderUnfilteredOptions();\n  }\n\n  render(): HTMLStencilElement {\n    const filteredOptions = getFilteredOptions(this.options, this.value || \"\");\n    return (\n      <Host class={this.disabled ? \"vds-basic-autocomplete--disabled\" : \"\"} title={this.value}>\n        <div class={combineClasses(\"vds-basic-autocomplete__container\")}>\n          <vds-basic-input\n            ref={(el) => {\n              if (el) {\n                this.basicInput = el; \n              }\n            }}\n            type=\"text\"\n            placeholder={this.placeholder}\n            value={this.value}\n            size={this.size}\n            disabled={this.disabled}\n            isReadonly={this.isReadonly}\n            error={this.error}\n            isRequired={this.isRequired}\n            formatter={this.formatter}\n            informativeIcon={this.informativeIcon}\n            allowedStyles={this.allowedStyles}\n            onChangeInput={(evt): void => this.handleChange(evt)}\n            onFocus={(): void => this.hasFocus()}\n            onBlur={(): void => this.lostFocus()}\n          >\n            {this.showClearButton && this.hasValue() && (\n              <div class=\"vds-basic-autocomplete__secondary-action\" slot=\"secondaryActionIcon\">\n                {this.renderClearIcon()}\n              </div>\n            )}\n            {((this.dropdown && this.showDropdownIcon) || this.actionIcon) && (\n              <div class=\"vds-basic-autocomplete__primary-action\" slot=\"primaryActionIcon\">\n                {this.renderActionIcon()}\n              </div>\n            )}\n          </vds-basic-input>\n          {this.backdrop && this.isOpened ? <div class=\"vds-floating-backdrop\" onClick={this.close.bind(this)}></div> : ''}\n          <div \n            ref={(el): void => { if (el) this.autocompleteContent = el;}}\n            class={\n              combineClasses(\n                \"vds-basic-autocomplete__content\",\n                this.maxHeight ? \"has-scroll\" : \"\",\n                (!this.emptyMessage || this.emptyMessage === \"\") && filteredOptions.length === 0 ? \"no-shadow\" : \"\",\n                !this.showEmptyMessage && filteredOptions.length === 0 ? \"no-shadow\" : \"\",\n                !this.value && this.options.length === 0 ? \"no-shadow\" : \"\"\n              )}\n          >\n            <div class={\"vds-basic-autocomplete__content__header\"}>\n              <slot name=\"header\"></slot>\n            </div>\n            {this.renderOptions()}\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/autocomplete/vds-basic-autocomplete.utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"vds-basic-autocomplete.utils.js","sourceRoot":"","sources":["../../../src/components/autocomplete/vds-basic-autocomplete.utils.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,OAAyC,EAAE,KAAa,EAAE,iBAA0B,KAAK,EAAE,EAAE;IAC5H,IAAI,CAAC;QACD,OAAO,OAAO,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE;;YACzB,IAAI,cAAc,EAAE,CAAC;gBACjB,OAAO,CAAC,CAAA,MAAA,IAAI,CAAC,WAAW,0CAAE,QAAQ,CAAC,KAAK,CAAC,MAAI,MAAA,IAAI,CAAC,KAAK,0CAAE,QAAQ,CAAC,KAAK,CAAC,CAAA,KAAI,MAAA,IAAI,CAAC,KAAK,0CAAE,QAAQ,CAAC,KAAK,CAAC,CAAA,CAAC,CAAC;YAC7G,CAAC;YACD,OAAO,iBAAiB,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;QAC1C,CAAC,CAAC,CAAC;IACP,CAAC;IAAC,OAAO,KAAK,EAAE,CAAC;QACb,OAAO,CAAC,IAAI,CAAC,sBAAsB,EAAE,KAAK,CAAC,CAAC;QAC5C,OAAO,EAAE,CAAC;IACd,CAAC;AACL,CAAC,CAAA;AAED;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,MAAsC,EAAE,WAAmB,EAAW,EAAE;;IACtG,IAAI,CAAC;QACD,MAAM,oBAAoB,GAAG,CAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,WAAW,EAAE,KAAI,EAAE,CAAC;QAC9D,OAAO,CACH,MAAM,CAAC,WAAW,KAAI,MAAA,MAAM,CAAC,WAAW,0CAAE,WAAW,GAAG,QAAQ,CAAC,oBAAoB,CAAC,CAAA;YACtF,MAAM,CAAC,KAAK,KAAI,MAAA,MAAM,CAAC,KAAK,0CAAE,WAAW,GAAG,QAAQ,CAAC,oBAAoB,CAAC,CAAA;YAC1E,MAAM,CAAC,KAAK,KAAI,MAAA,MAAM,CAAC,KAAK,0CAAE,WAAW,GAAG,QAAQ,CAAC,oBAAoB,CAAC,CAAA,CAC7E,CAAC;IACN,CAAC;IAAA,OAAO,KAAK,EAAE,CAAC;QACZ,OAAO,CAAC,IAAI,CAAC,qBAAqB,EAAE,KAAK,CAAC,CAAC;QAC3C,OAAO,KAAK,CAAC;IACjB,CAAC;AACL,CAAC,CAAC;AAEF;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,MAAsC,EAAE,WAAmB,EAAW,EAAE;;IAC3G,IAAI,CAAC;QACD,MAAM,oBAAoB,GAAG,CAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,WAAW,EAAE,KAAI,EAAE,CAAC;QAC9D,OAAO,CACH,MAAM,CAAC,WAAW,IAAI,CAAA,MAAA,MAAM,CAAC,WAAW,0CAAE,WAAW,EAAE,MAAK,oBAAoB;YAChF,MAAM,CAAC,KAAK,IAAI,CAAA,MAAA,MAAM,CAAC,KAAK,0CAAE,WAAW,EAAE,MAAK,oBAAoB;YACpE,MAAM,CAAC,KAAK,IAAI,CAAA,MAAA,MAAM,CAAC,KAAK,0CAAE,WAAW,EAAE,MAAK,oBAAoB,CACvE,CAAC;IACN,CAAC;IAAA,OAAO,KAAK,EAAE,CAAC;QACZ,OAAO,CAAC,IAAI,CAAC,qBAAqB,EAAE,KAAK,CAAC,CAAC;QAC3C,OAAO,KAAK,CAAC;IACjB,CAAC;AACL,CAAC,CAAC","sourcesContent":["export const getFilteredOptions = (options: HTMLVdsAutocompleteItemElement[], value: string, validateCasing: boolean = false) => {\n    try {\n        return options.filter(item => {\n            if (validateCasing) {\n                return (item.textContent?.includes(value) || item.value?.includes(value) || item.label?.includes(value));\n            }\n            return findOptionByValue(item, value);\n        });\n    } catch (error) {\n        console.warn(\"[getFilteredOptions]\", error);\n        return [];\n    }\n}\n\n/**\n * Checks if an option object matches the given search value.\n * @param {Object} option - The option object to be checked in a HTMLVdsAutocompleteItemElement\n * @param {string} searchValue - The value to search for within the option.\n * @returns {boolean} - \n *   True if the searchValue is found within the option's `textContent`, `label`, or `value`.\n *   False otherwise.\n */\nexport const findOptionByValue = (option: HTMLVdsAutocompleteItemElement, searchValue: string): boolean => {\n    try {\n        const lowerCaseSearchValue = searchValue?.toLowerCase() || \"\";\n        return (\n            option.textContent && option.textContent?.toLowerCase().includes(lowerCaseSearchValue) ||\n            option.label && option.label?.toLowerCase().includes(lowerCaseSearchValue) ||\n            option.value && option.value?.toLowerCase().includes(lowerCaseSearchValue)\n        );\n    }catch (error) {\n        console.warn(\"[findOptionByValue]\", error);\n        return false;\n    }\n};\n\n/**\n * Checks if an option object matches the given search value exactly.\n * @param {Object} option - The option object to be checked in a HTMLVdsAutocompleteItemElement\n * @param {string} searchValue - The value to search for within the option.\n * @returns {boolean} - \n *   True if the searchValue is exactly the same to one of the option's `textContent`, `label`, or `value`.\n *   False otherwise.\n */\nexport const findOptionByExactValue = (option: HTMLVdsAutocompleteItemElement, searchValue: string): boolean => {\n    try {\n        const lowerCaseSearchValue = searchValue?.toLowerCase() || \"\";\n        return (\n            option.textContent && option.textContent?.toLowerCase() === lowerCaseSearchValue ||\n            option.label && option.label?.toLowerCase() === lowerCaseSearchValue ||\n            option.value && option.value?.toLowerCase() === lowerCaseSearchValue\n        );\n    }catch (error) {\n        console.warn(\"[findOptionByValue]\", error);\n        return false;\n    }\n};"]}
+{"version":3,"file":"vds-basic-autocomplete.utils.js","sourceRoot":"","sources":["../../../src/components/autocomplete/vds-basic-autocomplete.utils.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,OAAyC,EAAE,KAAa,EAAE,iBAA0B,KAAK,EAAE,EAAE;IAC5H,IAAI,CAAC;QACD,OAAO,OAAO,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE;;YACzB,IAAI,cAAc,EAAE,CAAC;gBACjB,OAAO,CAAC,CAAA,MAAA,IAAI,CAAC,WAAW,0CAAE,QAAQ,CAAC,KAAK,CAAC,MAAI,MAAA,IAAI,CAAC,KAAK,0CAAE,QAAQ,CAAC,KAAK,CAAC,CAAA,KAAI,MAAA,IAAI,CAAC,KAAK,0CAAE,QAAQ,CAAC,KAAK,CAAC,CAAA,CAAC,CAAC;YAC7G,CAAC;YACD,OAAO,iBAAiB,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;QAC1C,CAAC,CAAC,CAAC;IACP,CAAC;IAAC,OAAO,KAAK,EAAE,CAAC;QACb,OAAO,CAAC,IAAI,CAAC,sBAAsB,EAAE,KAAK,CAAC,CAAC;QAC5C,OAAO,EAAE,CAAC;IACd,CAAC;AACL,CAAC,CAAA;AAED;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,MAAsC,EAAE,WAAmB,EAAW,EAAE;;IACtG,IAAI,CAAC;QACD,MAAM,oBAAoB,GAAG,CAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,WAAW,EAAE,KAAI,EAAE,CAAC;QAC9D,OAAO,CACH,MAAM,CAAC,WAAW,KAAI,MAAA,MAAM,CAAC,WAAW,0CAAE,WAAW,GAAG,QAAQ,CAAC,oBAAoB,CAAC,CAAA;YACtF,MAAM,CAAC,KAAK,KAAI,MAAA,MAAM,CAAC,KAAK,0CAAE,WAAW,GAAG,QAAQ,CAAC,oBAAoB,CAAC,CAAA;YAC1E,MAAM,CAAC,KAAK,KAAI,MAAA,MAAM,CAAC,KAAK,0CAAE,WAAW,GAAG,QAAQ,CAAC,oBAAoB,CAAC,CAAA,CAC7E,CAAC;IACN,CAAC;IAAA,OAAO,KAAK,EAAE,CAAC;QACZ,OAAO,CAAC,IAAI,CAAC,qBAAqB,EAAE,KAAK,CAAC,CAAC;QAC3C,OAAO,KAAK,CAAC;IACjB,CAAC;AACL,CAAC,CAAC;AAEF;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,MAAsC,EAAE,WAAmB,EAAW,EAAE;;IAC3G,IAAI,CAAC;QACD,MAAM,oBAAoB,GAAG,CAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,WAAW,EAAE,KAAI,EAAE,CAAC;QAC9D,OAAO,CACH,MAAM,CAAC,WAAW,IAAI,CAAA,MAAA,MAAM,CAAC,WAAW,0CAAE,WAAW,EAAE,MAAK,oBAAoB;YAChF,MAAM,CAAC,KAAK,IAAI,CAAA,MAAA,MAAM,CAAC,KAAK,0CAAE,WAAW,EAAE,MAAK,oBAAoB;YACpE,MAAM,CAAC,KAAK,IAAI,CAAA,MAAA,MAAM,CAAC,KAAK,0CAAE,WAAW,EAAE,MAAK,oBAAoB,CACvE,CAAC;IACN,CAAC;IAAA,OAAO,KAAK,EAAE,CAAC;QACZ,OAAO,CAAC,IAAI,CAAC,qBAAqB,EAAE,KAAK,CAAC,CAAC;QAC3C,OAAO,KAAK,CAAC;IACjB,CAAC;AACL,CAAC,CAAC","sourcesContent":["export const getFilteredOptions = (options: HTMLVdsAutocompleteItemElement[], value: string, validateCasing: boolean = false) => {\n    try {\n        return options.filter(item => {\n            if (validateCasing) {\n                return (item.textContent?.includes(value) || item.value?.includes(value) || item.label?.includes(value));\n            }\n            return findOptionByValue(item, value);\n        });\n    } catch (error) {\n        console.warn(\"[getFilteredOptions]\", error);\n        return [];\n    }\n}\n\n/**\n * Checks if an option object matches the given search value.\n * @param {Object} option - The option object to be checked in a HTMLVdsAutocompleteItemElement\n * @param {string} searchValue - The value to search for within the option.\n * @returns {boolean} - \n *   True if the searchValue is found within the option's `textContent`, `label`, or `value`.\n *   False otherwise.\n */\nexport const findOptionByValue = (option: HTMLVdsAutocompleteItemElement, searchValue: string): boolean => {\n    try {\n        const lowerCaseSearchValue = searchValue?.toLowerCase() || \"\";\n        return (\n            option.textContent && option.textContent?.toLowerCase().includes(lowerCaseSearchValue) ||\n            option.label && option.label?.toLowerCase().includes(lowerCaseSearchValue) ||\n            option.value && option.value?.toLowerCase().includes(lowerCaseSearchValue)\n        );\n    }catch (error) {\n        console.warn(\"[findOptionByValue]\", error);\n        return false;\n    }\n};\n\n/**\n * Checks if an option object matches the given search value exactly.\n * @param {Object} option - The option object to be checked in a HTMLVdsAutocompleteItemElement\n * @param {string} searchValue - The value to search for within the option.\n * @returns {boolean} - \n *   True if the searchValue is exactly the same to one of the option's `textContent`, `label`, or `value`.\n *   False otherwise.\n */\nexport const findOptionByExactValue = (option: HTMLVdsAutocompleteItemElement, searchValue: string): boolean => {\n    try {\n        const lowerCaseSearchValue = searchValue?.toLowerCase() || \"\";\n        return (\n            option.textContent && option.textContent?.toLowerCase() === lowerCaseSearchValue ||\n            option.label && option.label?.toLowerCase() === lowerCaseSearchValue ||\n            option.value && option.value?.toLowerCase() === lowerCaseSearchValue\n        );\n    }catch (error) {\n        console.warn(\"[findOptionByValue]\", error);\n        return false;\n    }\n};\n\nexport interface SelectedValueChangedEventDetail {\n    label: string;\n    value: string;\n    target: HTMLVdsAutocompleteItemElement;\n}"]}

package/dist/collection/components/autocomplete-item/vds-autocomplete-item.css

@@ -1,4 +1,3 @@
-@import url("https://fonts.googleapis.com/css2?family=Roboto+Flex:opsz,wght@8..144,100..1000&display=swap");
 :root {
   font-family: "Roboto Flex", sans-serif, sans-serif;
   box-sizing: border-box;
@@ -481,6 +480,13 @@
   --height-12:0.75rem;
 }
 
+@font-face {
+  font-family: "Roboto Flex";
+  src: url("../assets/fonts/Roboto_Flex/RobotoFlex-VariableFont_GRAD,XOPQ,XTRA,YOPQ,YTAS,YTDE,YTFI,YTLC,YTUC,opsz,slnt,wdth,wght.ttf") format("truetype");
+  font-weight: 100 1000;
+  font-stretch: 25% 151%;
+  font-style: normal;
+}
 :root body {
   --spacing-00:0rem;
   --spacing-01:0.125rem;
@@ -733,7 +739,15 @@
   --static-dataviz-div-red-blue-650:#163670;
   --static-dataviz-div-red-blue-700:#0B194C;
   --static-white:#ffffff;
+  --static-white-medium:rgba(255, 255, 255, 0.6392156863);
+  --static-white-low:rgba(255, 255, 255, 0.3215686275);
+  --static-white-lower:rgba(255, 255, 255, 0.1607843137);
+  --static-white-lowest:rgba(255, 255, 255, 0.1215686275);
   --static-black:#000000;
+  --static-black-medium:rgba(0, 0, 0, 0.6392156863);
+  --static-black-low:rgba(0, 0, 0, 0.3215686275);
+  --static-black-lower:rgba(0, 0, 0, 0.1607843137);
+  --static-black-lowest:rgba(0, 0, 0, 0.1215686275);
   --elevation-shadow-0:none;
   --elevation-shadow-1:0 0 2px var(--box-shadow-color-01), 0 1px 2px var(--box-shadow-color-02);
   --elevation-shadow-2:0 0 2px var(--box-shadow-color-01), 0 2px 4px var(--box-shadow-color-02);

package/dist/collection/components/autocomplete-item/vds-autocomplete-item.js

@@ -84,7 +84,6 @@ export class VdsAutocompleteItem {
         return {
             "disabled": {
                 "type": "boolean",
-                "attribute": "disabled",
                 "mutable": true,
                 "complexType": {
                     "original": "boolean",
@@ -100,11 +99,11 @@ export class VdsAutocompleteItem {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "disabled",
                 "defaultValue": "false"
             },
             "informativeIcon": {
                 "type": "string",
-                "attribute": "informative-icon",
                 "mutable": true,
                 "complexType": {
                     "original": "string",
@@ -119,11 +118,11 @@ export class VdsAutocompleteItem {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "informative-icon"
             },
             "isActive": {
                 "type": "boolean",
-                "attribute": "is-active",
                 "mutable": true,
                 "complexType": {
                     "original": "boolean",
@@ -139,11 +138,11 @@ export class VdsAutocompleteItem {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "is-active",
                 "defaultValue": "false"
             },
             "value": {
                 "type": "string",
-                "attribute": "value",
                 "mutable": true,
                 "complexType": {
                     "original": "string",
@@ -158,11 +157,11 @@ export class VdsAutocompleteItem {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": true
+                "reflect": true,
+                "attribute": "value"
             },
             "label": {
                 "type": "string",
-                "attribute": "label",
                 "mutable": true,
                 "complexType": {
                     "original": "string",
@@ -177,11 +176,11 @@ export class VdsAutocompleteItem {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": true
+                "reflect": true,
+                "attribute": "label"
             },
             "setAriaLabel": {
                 "type": "string",
-                "attribute": "set-aria-label",
                 "mutable": true,
                 "complexType": {
                     "original": "string",
@@ -196,11 +195,11 @@ export class VdsAutocompleteItem {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": true
+                "reflect": true,
+                "attribute": "set-aria-label"
             },
             "size": {
                 "type": "string",
-                "attribute": "size",
                 "mutable": true,
                 "complexType": {
                     "original": "\"small\" | \"medium\" | \"large\"",
@@ -216,11 +215,11 @@ export class VdsAutocompleteItem {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "size",
                 "defaultValue": "\"medium\""
             },
             "hasCheckmark": {
                 "type": "boolean",
-                "attribute": "has-checkmark",
                 "mutable": true,
                 "complexType": {
                     "original": "boolean",
@@ -236,11 +235,11 @@ export class VdsAutocompleteItem {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "has-checkmark",
                 "defaultValue": "false"
             },
             "isSelected": {
                 "type": "boolean",
-                "attribute": "is-selected",
                 "mutable": true,
                 "complexType": {
                     "original": "boolean",
@@ -256,11 +255,11 @@ export class VdsAutocompleteItem {
                 "getter": false,
                 "setter": false,
                 "reflect": true,
+                "attribute": "is-selected",
                 "defaultValue": "false"
             },
             "checkmarkVariant": {
                 "type": "string",
-                "attribute": "checkmark-variant",
                 "mutable": false,
                 "complexType": {
                     "original": "\"checkbox\" | \"checkmark\"",
@@ -276,11 +275,11 @@ export class VdsAutocompleteItem {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "checkmark-variant",
                 "defaultValue": "\"checkmark\""
             },
             "checkmarkAlignment": {
                 "type": "string",
-                "attribute": "checkmark-alignment",
                 "mutable": false,
                 "complexType": {
                     "original": "\"start\" | \"end\"",
@@ -296,11 +295,11 @@ export class VdsAutocompleteItem {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "checkmark-alignment",
                 "defaultValue": "\"start\""
             },
             "danger": {
                 "type": "boolean",
-                "attribute": "danger",
                 "mutable": true,
                 "complexType": {
                     "original": "boolean",
@@ -316,6 +315,7 @@ export class VdsAutocompleteItem {
                 "getter": false,
                 "setter": false,
                 "reflect": true,
+                "attribute": "danger",
                 "defaultValue": "false"
             }
         };

package/dist/collection/components/avatar/vds-avatar.css

@@ -1,4 +1,3 @@
-@import url("https://fonts.googleapis.com/css2?family=Roboto+Flex:opsz,wght@8..144,100..1000&display=swap");
 :root {
   font-family: "Roboto Flex", sans-serif, sans-serif;
   box-sizing: border-box;
@@ -481,6 +480,13 @@
   --height-12:0.75rem;
 }
 
+@font-face {
+  font-family: "Roboto Flex";
+  src: url("../assets/fonts/Roboto_Flex/RobotoFlex-VariableFont_GRAD,XOPQ,XTRA,YOPQ,YTAS,YTDE,YTFI,YTLC,YTUC,opsz,slnt,wdth,wght.ttf") format("truetype");
+  font-weight: 100 1000;
+  font-stretch: 25% 151%;
+  font-style: normal;
+}
 :root body {
   --spacing-00:0rem;
   --spacing-01:0.125rem;
@@ -733,7 +739,15 @@
   --static-dataviz-div-red-blue-650:#163670;
   --static-dataviz-div-red-blue-700:#0B194C;
   --static-white:#ffffff;
+  --static-white-medium:rgba(255, 255, 255, 0.6392156863);
+  --static-white-low:rgba(255, 255, 255, 0.3215686275);
+  --static-white-lower:rgba(255, 255, 255, 0.1607843137);
+  --static-white-lowest:rgba(255, 255, 255, 0.1215686275);
   --static-black:#000000;
+  --static-black-medium:rgba(0, 0, 0, 0.6392156863);
+  --static-black-low:rgba(0, 0, 0, 0.3215686275);
+  --static-black-lower:rgba(0, 0, 0, 0.1607843137);
+  --static-black-lowest:rgba(0, 0, 0, 0.1215686275);
   --elevation-shadow-0:none;
   --elevation-shadow-1:0 0 2px var(--box-shadow-color-01), 0 1px 2px var(--box-shadow-color-02);
   --elevation-shadow-2:0 0 2px var(--box-shadow-color-01), 0 2px 4px var(--box-shadow-color-02);
@@ -896,6 +910,8 @@
  */
 :host {
   display: block;
+  width: fit-content;
+  --vds-avatar-background-color: var(--color-icon-high);
 }
 :host .vds-avatar {
   width: var(--spacing-06);
@@ -911,6 +927,33 @@
   overflow: hidden;
   border: 1px solid var(--color-border-white-high);
   box-sizing: border-box;
+  position: relative;
+}
+:host .vds-avatar__overlay {
+  position: absolute;
+  left: 0;
+  bottom: 0;
+  width: 100%;
+  height: 32%;
+  background: var(--color-interaction-backdrop);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  pointer-events: none;
+  line-height: 0;
+  font-size: 0;
+  opacity: 0;
+  transition: opacity 0.15s ease;
+  will-change: opacity;
+}
+:host .vds-avatar--has-overlay {
+  cursor: pointer;
+  padding: 0;
+}
+:host .vds-avatar--has-overlay:hover .vds-avatar__overlay {
+  opacity: 1;
+  transition: opacity 0.15s ease;
+  will-change: opacity;
 }
 :host .vds-avatar--value {
   flex-shrink: 0;

package/dist/collection/components/avatar/vds-avatar.js

@@ -46,11 +46,11 @@ export class VdsAvatar {
         }
     }
     getValueStyles() {
-        return ({
+        return {
             'width': this.size,
             'height': this.calcLineHeight(this.size),
-            'font-size': this.calcFontSize(this.size)
-        });
+            'font-size': this.calcFontSize(this.size),
+        };
     }
     getAvatarContent() {
         if (this.value.startsWith('http')) {
@@ -64,11 +64,39 @@ export class VdsAvatar {
         }
     }
     setBackgroundColor() {
-        return this.setBackground ? 'var(--color-icon-high)' : 'transparent';
+        return this.setBackground ? 'var(--vds-avatar-background-color)' : 'transparent';
+    }
+    /**
+     * Calculates the overlay icon size so that a 100px avatar = 20px icon (1.25rem), scaling proportionally for px or rem.
+     */
+    getOverlayIconSize() {
+        const pxMatch = this.size.match(/^(\d+(?:\.\d+)?)px$/);
+        if (pxMatch) {
+            const px = parseFloat(pxMatch[1]);
+            const iconPx = (px * 20) / 100;
+            const iconRem = iconPx / 16;
+            return `${iconRem.toFixed(3)}rem`;
+        }
+        const remMatch = this.size.match(/^(\d+(?:\.\d+)?)rem$/);
+        if (remMatch) {
+            const rem = parseFloat(remMatch[1]);
+            const iconRem = rem * 0.2;
+            return `${iconRem.toFixed(4)}rem`;
+        }
+        return '1.25rem';
     }
     render() {
         const avatarContent = this.getAvatarContent();
-        return (h(Host, { key: 'bc751242af12481979a6d6ff819b9cce1de1749c' }, h("div", { key: '7173810e132dffeab51cf19cf4f596c0318cda87', class: `vds-avatar`, style: { 'width': this.size, 'height': this.size, 'background-color': this.setBackgroundColor() } }, avatarContent)));
+        const showOverlay = !!this.overlayIcon;
+        return (h(Host, { key: '0f9d23b6cd2ae876779e2b6cf6253dded9d0ccc9' }, showOverlay ? (h("button", { type: "button", class: `vds-avatar vds-avatar--has-overlay`, style: {
+                width: this.size,
+                height: this.size,
+                backgroundColor: this.setBackgroundColor(),
+            } }, avatarContent, h("div", { class: "vds-avatar__overlay" }, h("vds-icon", { svgIcon: this.overlayIcon, size: this.getOverlayIconSize(), color: "static-white" })))) : (h("div", { class: "vds-avatar", style: {
+                width: this.size,
+                height: this.size,
+                backgroundColor: this.setBackgroundColor(),
+            } }, avatarContent))));
     }
     static get is() { return "vds-avatar"; }
     static get encapsulation() { return "shadow"; }
@@ -86,7 +114,6 @@ export class VdsAvatar {
         return {
             "value": {
                 "type": "string",
-                "attribute": "value",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -101,11 +128,11 @@ export class VdsAvatar {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "value"
             },
             "size": {
                 "type": "string",
-                "attribute": "size",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -121,7 +148,27 @@ export class VdsAvatar {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "size",
                 "defaultValue": "'20px'"
+            },
+            "overlayIcon": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Name of the icon to show as overlay on hover. If not set, no overlay is shown."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "overlay-icon"
             }
         };
     }

package/dist/collection/components/avatar/vds-avatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"vds-avatar.js","sourceRoot":"","sources":["../../../src/components/avatar/vds-avatar.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, Prop, h } from '@stencil/core';\nimport { HTMLStencilElement } from '@stencil/core/internal';\n\n@Component({\n  tag: 'vds-avatar',\n  styleUrl: 'vds-avatar.scss',\n  shadow: true,\n})\nexport class VdsAvatar {\n  /**\n   * This property can receive:\n   * - Fullname to show the first letters inside the avatar.\n   * - Url of image.\n   * - +XX format for showing the number of additional users. Caps at +99.\n   */\n  @Prop() value: string;\n  /** Set icon size in px or rem, IE: 32px or 1.25rem */\n  @Prop() size: string = '20px';\n\n  setBackground: boolean;\n\n  private getNumberFormat(number: string): string {\n    const numValue = parseInt(number.substring(1), 10);\n    if (numValue > 99) {\n      return '+99';\n    }\n    return '+' + numValue;\n  }\n\n  private getNameInitials(name: string): string {\n    const parts = name.split(' ');\n    const firstInitial = parts[0].charAt(0);\n    const lastInitial = parts[parts.length - 1].charAt(0);\n    const initials = firstInitial + lastInitial;\n\n    return initials.toUpperCase();\n  }\n\n  getAvatarValue(value: string): string {\n    if (/^\\+\\d+$/.test(value)) {\n      return this.getNumberFormat(value);\n    }\n    return this.getNameInitials(value);\n  }\n\n  calcFontSize(size: string): string {\n    const regex = /^(\\d+)(px|rem)$/;\n    const match = size.match(regex);\n    if (match) {\n      const value = parseInt(match[1], 10) / 2;\n      const unit = match[2];\n      const calculated_font_size = value + unit;\n      return calculated_font_size;\n    }\n    throw new Error('Invalid size format. Please provide a valid size in px or rem.');\n  }\n  calcLineHeight(size: string): string {\n    const regex = /^(\\d+)(px|rem)$/;\n    const match = size.match(regex);\n    if (match) {\n      const value = parseFloat(match[1]);\n      const unit = match[2];\n      const lineHeight = ((value * 1.25) / 2).toFixed(2);\n      return lineHeight + unit;\n    }\n  }\n\n  getValueStyles(): {width: string, height: string, 'font-size': string} {\n    return ({\n      'width': this.size,\n      'height': this.calcLineHeight(this.size),\n      'font-size': this.calcFontSize(this.size)\n    })\n  }\n\n  getAvatarContent() {\n    if (this.value.startsWith('http')) {\n      this.setBackground = false;\n      return <img class=\"vds-avatar--picture\" src={this.value} alt=\"Avatar\" />;\n    } else {\n      this.setBackground = true;\n      const value = this.getAvatarValue(this.value);\n      return (\n        <span\n          class=\"vds-avatar--value\"\n          style={this.getValueStyles()}\n        >\n          {value}\n        </span>\n      );\n    }\n  }\n\n  setBackgroundColor(): string {\n    return this.setBackground ? 'var(--color-icon-high)' : 'transparent';\n  }\n\n  render(): HTMLStencilElement {\n    const avatarContent = this.getAvatarContent();\n\n    return (\n      <Host>\n        <div class={`vds-avatar`} style={{ 'width': this.size, 'height': this.size, 'background-color': this.setBackgroundColor() }}>\n          {avatarContent}\n        </div>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"vds-avatar.js","sourceRoot":"","sources":["../../../src/components/avatar/vds-avatar.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, Prop, h } from '@stencil/core';\nimport { HTMLStencilElement } from '@stencil/core/internal';\n\n@Component({\n  tag: 'vds-avatar',\n  styleUrl: 'vds-avatar.scss',\n  shadow: true,\n})\nexport class VdsAvatar {\n  /**\n   * This property can receive:\n   * - Fullname to show the first letters inside the avatar.\n   * - Url of image.\n   * - +XX format for showing the number of additional users. Caps at +99.\n   */\n  @Prop() value: string;\n  /** Set icon size in px or rem, IE: 32px or 1.25rem */\n  @Prop() size: string = '20px';\n  /**\n   * Name of the icon to show as overlay on hover. If not set, no overlay is shown.\n   */\n  @Prop() overlayIcon?: string;\n\n  setBackground: boolean;\n\n  private getNumberFormat(number: string): string {\n    const numValue = parseInt(number.substring(1), 10);\n    if (numValue > 99) {\n      return '+99';\n    }\n    return '+' + numValue;\n  }\n\n  private getNameInitials(name: string): string {\n    const parts = name.split(' ');\n    const firstInitial = parts[0].charAt(0);\n    const lastInitial = parts[parts.length - 1].charAt(0);\n    const initials = firstInitial + lastInitial;\n\n    return initials.toUpperCase();\n  }\n\n  getAvatarValue(value: string): string {\n    if (/^\\+\\d+$/.test(value)) {\n      return this.getNumberFormat(value);\n    }\n    return this.getNameInitials(value);\n  }\n\n  calcFontSize(size: string): string {\n    const regex = /^(\\d+)(px|rem)$/;\n    const match = size.match(regex);\n    if (match) {\n      const value = parseInt(match[1], 10) / 2;\n      const unit = match[2];\n      const calculated_font_size = value + unit;\n      return calculated_font_size;\n    }\n    throw new Error('Invalid size format. Please provide a valid size in px or rem.');\n  }\n  calcLineHeight(size: string): string {\n    const regex = /^(\\d+)(px|rem)$/;\n    const match = size.match(regex);\n    if (match) {\n      const value = parseFloat(match[1]);\n      const unit = match[2];\n      const lineHeight = ((value * 1.25) / 2).toFixed(2);\n      return lineHeight + unit;\n    }\n  }\n\n  getValueStyles(): { 'width': string; 'height': string; 'font-size': string } {\n    return {\n      'width': this.size,\n      'height': this.calcLineHeight(this.size),\n      'font-size': this.calcFontSize(this.size),\n    };\n  }\n\n  getAvatarContent() {\n    if (this.value.startsWith('http')) {\n      this.setBackground = false;\n      return <img class=\"vds-avatar--picture\" src={this.value} alt=\"Avatar\" />;\n    } else {\n      this.setBackground = true;\n      const value = this.getAvatarValue(this.value);\n      return (\n        <span class=\"vds-avatar--value\" style={this.getValueStyles()}>\n          {value}\n        </span>\n      );\n    }\n  }\n\n  setBackgroundColor(): string {\n    return this.setBackground ? 'var(--vds-avatar-background-color)' : 'transparent';\n  }\n\n  /**\n   * Calculates the overlay icon size so that a 100px avatar = 20px icon (1.25rem), scaling proportionally for px or rem.\n   */\n  getOverlayIconSize(): string {\n    const pxMatch = this.size.match(/^(\\d+(?:\\.\\d+)?)px$/);\n    if (pxMatch) {\n      const px = parseFloat(pxMatch[1]);\n      const iconPx = (px * 20) / 100;\n      const iconRem = iconPx / 16;\n      return `${iconRem.toFixed(3)}rem`;\n    }\n    const remMatch = this.size.match(/^(\\d+(?:\\.\\d+)?)rem$/);\n    if (remMatch) {\n      const rem = parseFloat(remMatch[1]);\n      const iconRem = rem * 0.2;\n      return `${iconRem.toFixed(4)}rem`;\n    }\n    return '1.25rem';\n  }\n\n  render(): HTMLStencilElement {\n    const avatarContent = this.getAvatarContent();\n    const showOverlay = !!this.overlayIcon;\n\n    return (\n      <Host>\n        {showOverlay ? (\n          <button\n            type=\"button\"\n            class={`vds-avatar vds-avatar--has-overlay`}\n            style={{\n              width: this.size,\n              height: this.size,\n              backgroundColor: this.setBackgroundColor(),\n            }}\n          >\n            {avatarContent}\n            <div class=\"vds-avatar__overlay\">\n              <vds-icon svgIcon={this.overlayIcon} size={this.getOverlayIconSize()} color=\"static-white\" />\n            </div>\n          </button>\n        ) : (\n          <div\n            class=\"vds-avatar\"\n            style={{\n              width: this.size,\n              height: this.size,\n              backgroundColor: this.setBackgroundColor(),\n            }}\n          >\n            {avatarContent}\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"]}