@synergy-design-system/components 3.4.0 → 3.5.0

package/dist/chunks/chunk.2IL4PA6Q.js

@@ -1,130 +0,0 @@
-import {
-  option_size_styles_default
-} from "./chunk.AMDQJFFP.js";
-
-// src/components/combobox/combobox.custom.styles.ts
-import { css } from "lit";
-var combobox_custom_styles_default = css`
-
-  .combobox__display-input {
-    flex: 1;
-    min-width: var(--syn-spacing-2x-large);
-    width: unset;
-  }
-
-  .combobox:not(.combobox--disabled) .combobox__display-input {
-    cursor: text;
-  }
-
-  .listbox__options ::slotted(syn-option[hidden]), 
-  .listbox__options ::slotted(syn-optgroup[hidden]) {
-    display: none;
-  }
-
-  .listbox__no-results {
-    align-items: center;
-    color: var(--syn-color-neutral-950);
-    display: flex;
-    font: var(--syn-body-medium-regular);
-    padding: var(--syn-spacing-small) var(--syn-spacing-medium) var(--syn-spacing-small) 52px;
-  }
-
-  .combobox--small .listbox__no-results {
-    font-size: var(--syn-input-font-size-small);
-    min-height: var(--syn-input-height-small);
-    padding: 0 var(--syn-spacing-small) 0 40px;
-  }
-
-  .combobox--large .listbox__no-results {
-    font-size: var(--syn-input-font-size-large);
-    min-height: var(--syn-input-height-large);
-    padding: 0 var(--syn-spacing-large) 0 68px;
-  }
-
-  /* Multi Select */
-  .combobox__tags {
-    align-items: center;
-    display: flex;
-    flex-wrap: wrap;
-    margin-inline-start: var(--syn-spacing-2x-small);
-  }
-
-  .combobox__tags::slotted(syn-tag) {
-    cursor: pointer !important;
-  }
-
-  .combobox--disabled .combobox__tags,
-  .combobox--disabled .combobox__tags::slotted(syn-tag) {
-    cursor: not-allowed !important;
-  }
-
-  .combobox--small .combobox__tags {
-    gap: var(--syn-spacing-2x-small);
-  }
-
-  .combobox--medium .combobox__tags {
-    gap: var(--syn-spacing-x-small);
-  }
-
-  .combobox--large .combobox__tags {
-    gap: var(--syn-spacing-small);
-  }
-
-  .combobox--tags-visible.combobox--small .combobox__tags {
-    margin-inline-end: var(--syn-spacing-x-small);
-  }
-
-  .combobox--tags-visible.combobox--medium .combobox__tags {
-    margin-inline-end: var(--syn-input-spacing-small);
-  }
-
-  .combobox--tags-visible.combobox--large .combobox__tags {
-    margin-inline-end: var(--syn-input-spacing-medium);
-  }
-
-  /**
-   * #850: Allow to measure the size of the combobox.
-   * This is needed so we can automatically size and truncate the tags in the <syn-combobox multiple> component.
-   * Scoped to multiple to not break the single select per accident.
-   * Scoped to when placeholder is not visible to not break the placeholder visualization
-   */
-  :host([multiple]) :not(.combobox--placeholder-visible).combobox--tags-visible > .combobox__inputs > .combobox__tags {
-    min-width: 85px;
-    overflow: hidden;
-  }
-
-  :host([multiple]) .combobox__tags > div {
-    display: contents;
-  }
-
-  :host([multiple]) .combobox__tags > div > syn-tag {
-    --syn-tag-position-adjustment: var(--syn-spacing-3x-small);
-
-    max-width: var(--syn-select-tag-max-width);
-  }
-
-  :host([multiple]) .combobox__tags > div > syn-tag::part(content) {
-    display: initial;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
-
-  /* 
-  This class is needed to be able to hide the options as long as the popup close animation is running.
-  As otherwise the listbox would flicker because the options are shown again when the value is reset to empty string.
-  */
-  .options__hide {
-    /* We need to set the slot to something different than display: contents to be able to hide it. Also it should not take any space so we remove the height */
-    display: block;
-    height: 0;
-    opacity: 0;
-  }
-
-  ${option_size_styles_default}
-`;
-
-export {
-  combobox_custom_styles_default
-};
-//# sourceMappingURL=chunk.2IL4PA6Q.js.map

package/dist/chunks/chunk.2IL4PA6Q.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/combobox/combobox.custom.styles.ts"],
-  "sourcesContent": ["import { css } from 'lit';\nimport sharedOptionSize from '../option/option-size.styles.js';\n\nexport default css`\n\n  .combobox__display-input {\n    flex: 1;\n    min-width: var(--syn-spacing-2x-large);\n    width: unset;\n  }\n\n  .combobox:not(.combobox--disabled) .combobox__display-input {\n    cursor: text;\n  }\n\n  .listbox__options ::slotted(syn-option[hidden]), \n  .listbox__options ::slotted(syn-optgroup[hidden]) {\n    display: none;\n  }\n\n  .listbox__no-results {\n    align-items: center;\n    color: var(--syn-color-neutral-950);\n    display: flex;\n    font: var(--syn-body-medium-regular);\n    padding: var(--syn-spacing-small) var(--syn-spacing-medium) var(--syn-spacing-small) 52px;\n  }\n\n  .combobox--small .listbox__no-results {\n    font-size: var(--syn-input-font-size-small);\n    min-height: var(--syn-input-height-small);\n    padding: 0 var(--syn-spacing-small) 0 40px;\n  }\n\n  .combobox--large .listbox__no-results {\n    font-size: var(--syn-input-font-size-large);\n    min-height: var(--syn-input-height-large);\n    padding: 0 var(--syn-spacing-large) 0 68px;\n  }\n\n  /* Multi Select */\n  .combobox__tags {\n    align-items: center;\n    display: flex;\n    flex-wrap: wrap;\n    margin-inline-start: var(--syn-spacing-2x-small);\n  }\n\n  .combobox__tags::slotted(syn-tag) {\n    cursor: pointer !important;\n  }\n\n  .combobox--disabled .combobox__tags,\n  .combobox--disabled .combobox__tags::slotted(syn-tag) {\n    cursor: not-allowed !important;\n  }\n\n  .combobox--small .combobox__tags {\n    gap: var(--syn-spacing-2x-small);\n  }\n\n  .combobox--medium .combobox__tags {\n    gap: var(--syn-spacing-x-small);\n  }\n\n  .combobox--large .combobox__tags {\n    gap: var(--syn-spacing-small);\n  }\n\n  .combobox--tags-visible.combobox--small .combobox__tags {\n    margin-inline-end: var(--syn-spacing-x-small);\n  }\n\n  .combobox--tags-visible.combobox--medium .combobox__tags {\n    margin-inline-end: var(--syn-input-spacing-small);\n  }\n\n  .combobox--tags-visible.combobox--large .combobox__tags {\n    margin-inline-end: var(--syn-input-spacing-medium);\n  }\n\n  /**\n   * #850: Allow to measure the size of the combobox.\n   * This is needed so we can automatically size and truncate the tags in the <syn-combobox multiple> component.\n   * Scoped to multiple to not break the single select per accident.\n   * Scoped to when placeholder is not visible to not break the placeholder visualization\n   */\n  :host([multiple]) :not(.combobox--placeholder-visible).combobox--tags-visible > .combobox__inputs > .combobox__tags {\n    min-width: 85px;\n    overflow: hidden;\n  }\n\n  :host([multiple]) .combobox__tags > div {\n    display: contents;\n  }\n\n  :host([multiple]) .combobox__tags > div > syn-tag {\n    --syn-tag-position-adjustment: var(--syn-spacing-3x-small);\n\n    max-width: var(--syn-select-tag-max-width);\n  }\n\n  :host([multiple]) .combobox__tags > div > syn-tag::part(content) {\n    display: initial;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  /* \n  This class is needed to be able to hide the options as long as the popup close animation is running.\n  As otherwise the listbox would flicker because the options are shown again when the value is reset to empty string.\n  */\n  .options__hide {\n    /* We need to set the slot to something different than display: contents to be able to hide it. Also it should not take any space so we remove the height */\n    display: block;\n    height: 0;\n    opacity: 0;\n  }\n\n  ${sharedOptionSize}\n`;\n"],
-  "mappings": ";;;;;AAAA,SAAS,WAAW;AAGpB,IAAO,iCAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAqHX,0BAAgB;AAAA;",
-  "names": []
-}

package/dist/chunks/chunk.2K4HDCDF.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/file/file.component.ts"],
-  "sourcesContent": ["import { classMap } from 'lit/directives/class-map.js';\nimport { property, query, state } from 'lit/decorators.js';\nimport type { CSSResultGroup } from 'lit';\nimport { html } from 'lit';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { defaultValue } from '../../internal/default-value.js';\nimport { watch } from '../../internal/watch.js';\nimport type { SynergyFormControl } from '../../internal/synergy-element.js';\nimport { LocalizeController } from '../../utilities/localize.js';\nimport { FormControlController } from '../../internal/form.js';\nimport { HasSlotController } from '../../internal/slot.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport formControlStyles from '../../styles/form-control.styles.js';\nimport formControlCustomStyles from '../../styles/form-control.custom.styles.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport SynButton from '../button/button.component.js';\nimport SynIcon from '../icon/icon.component.js';\nimport styles from './file.styles.js';\nimport { getAnimation, setDefaultAnimation } from '../../utilities/animation-registry.js';\nimport { animateTo } from '../../internal/animate.js';\nimport { enableDefaultSettings } from '../../utilities/defaultSettings/decorator.js';\n\n/**\n * @summary File controls allow selecting an arbitrary number of files for uploading.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-file--docs\n * @status stable\n *\n * @dependency syn-button\n * @dependency syn-icon\n *\n * @slot label - The file control's label. Alternatively, you can use the `label` attribute.\n * @slot help-text - Text that describes how to use the file control.\n *    Alternatively, you can use the `help-text` attribute.\n * @slot droparea-icon - Optional droparea icon to use instead of the default.\n *    Works best with `<syn-icon>`.\n * @slot trigger - Optional content to be used as trigger instead of the default content.\n *    Opening the file dialog on click and as well as drag and drop will work for this content.\n *    Following attributes will no longer work: *label*, *droparea*, *help-text*, *size*,\n *    *hide-value*. Also if using the disabled attribute, the disabled styling will not be\n *    applied and must be taken care of yourself.\n *\n * @event syn-blur - Emitted when the control loses focus.\n * @event syn-change - Emitted when an alteration to the control's value is committed by the user.\n * @event syn-error - Emitted when multiple files are selected via drag and drop, without\n * the `multiple` property being set.\n * @event syn-focus - Emitted when the control gains focus.\n * @event syn-input - Emitted when the control receives input.\n *\n * @csspart form-control - The form control that wraps the label, input, and help text.\n * @csspart form-control-label - The label's wrapper.\n * @csspart form-control-input - The input's wrapper.\n * @csspart form-control-help-text - The help text's wrapper.\n * @csspart button-wrapper - The wrapper around the button and text value.\n * @csspart button - The syn-button acting as a file input.\n * @csspart button__base - The syn-button's exported `base` part.\n * @csspart value - The chosen files or placeholder text for the file input.\n * @csspart droparea - The element wrapping the drop zone.\n * @csspart droparea-background - The background of the drop zone.\n * @csspart droparea-icon - The container that wraps the icon for the drop zone.\n * @csspart droparea-value - The text for the drop zone.\n * @csspart trigger - The container that wraps the trigger.\n *\n * @animation file.iconDrop - The animation to use for the file icon\n * when a file is dropped\n * @animation file.text.disappear - The disappear animation to use for the file placeholder text\n * when a file is dropped\n * @animation file.text.appear - The appear animation to use for the file placeholder text\n * when a file is dropped\n */\n@enableDefaultSettings('SynFile')\nexport default class SynFile extends SynergyElement implements SynergyFormControl {\n  static styles: CSSResultGroup = [\n    componentStyles,\n    formControlStyles,\n    formControlCustomStyles,\n    styles,\n  ];\n\n  static dependencies = {\n    'syn-button': SynButton,\n    'syn-icon': SynIcon,\n  };\n\n  private readonly formControlController = new FormControlController(this, {\n    assumeInteractionOn: ['syn-change'],\n    // This makes sure the value sent in formdata events is always the files object\n    // @see internals/form.ts #handleFormData for more information\n    value: (el: SynFile) => el.files,\n  });\n\n  private readonly hasSlotController = new HasSlotController(this, 'help-text', 'label');\n\n  private readonly localize = new LocalizeController(this);\n\n  @state() private userIsDragging = false;\n\n  /**\n   * The selected files as a FileList object containing a list of File objects.\n   * The FileList behaves like an array, so you can get the number of selected files\n   * via its length property.\n   * [see MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#getting_information_on_selected_files)\n   *\n   * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#getting_information_on_selected_files\n   */\n  @property({ type: Object })\n  set files(v: FileList | null) {\n    if (this.input) {\n      this.input.files = v;\n    }\n  }\n\n  get files() {\n    return this.input?.files;\n  }\n\n  /** The name of the file control, submitted as a name/value pair with form data. */\n  @property({ type: String }) name = '';\n\n  /**\n   * The current value of the input, submitted as a name/value pair with form data.\n   * Beware that the only valid value when setting a file input is an empty string!\n   */\n\n  /**\n   * The value of the file control contains a string that represents the path of the selected file.\n   * If multiple files are selected, the value represents the first file in the list.\n   * If no file is selected, the value is an empty string.\n   * Beware that the only valid value when setting a file control is an empty string!\n   * [see MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#value)\n   *\n   * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#value\n   */\n  @property({ type: String })\n  set value(v: string) {\n    if (this.input) {\n      this.input.value = v;\n    }\n  }\n\n  get value() {\n    return this.input?.value;\n  }\n\n  /** The default value of the form control. Primarily used for resetting the form control. */\n  @defaultValue() defaultValue = '';\n\n  /** The file control's size. */\n  @property({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n  /** The file control's label. If you need to display HTML, use the `label` slot instead. */\n  @property() label = '';\n\n  /**\n   * The file control's help text.\n   * If you need to display HTML, use the `help-text` slot instead.\n   */\n  @property({ attribute: 'help-text' }) helpText = '';\n\n  /** Disables the file control. */\n  @property({ reflect: true, type: Boolean }) disabled = false;\n\n  /** Draw the file control as a drop area */\n  @property({ type: Boolean }) droparea = false;\n\n  /**\n   * Comma separated list of supported file types\n   * [see MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/accept)\n   *\n   * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/accept\n   * @example <syn-file accept=\".jpg,.jpeg,.png,.gif,text/plain,image/*\"></syn-file>\n   */\n  @property({ type: String }) accept = '';\n\n  /**\n   * Specifies the types of files that the server accepts.\n   * Can be set either to user or environment.\n   * Works only when not using a droparea!\n   * [see MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/capture)\n   *\n   * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/capture\n   */\n  @property({ type: String }) capture: 'user' | 'environment';\n\n  /**\n   * Indicates whether the user can select more than one file.\n   * Has no effect if webkitdirectory is set.\n   * [see MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#multiple)\n   *\n   * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#multiple\n   */\n  @property({ reflect: true, type: Boolean }) multiple = false;\n\n  /**\n   * Indicates that the file control should let the user select directories instead of files.\n   * When a directory is selected, the directory and its entire hierarchy of contents are included\n   * in the set of selected items.\n   * Note: This is a non-standard attribute but is supported in the major browsers.\n   * [see MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/webkitdirectory)\n   *\n   * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/webkitdirectory\n   */\n  @property({ reflect: true, type: Boolean }) webkitdirectory = false;\n\n  /**\n   * By default, form controls are associated with the nearest containing `<form>` element.\n   * This attribute allows you to place the form control outside of a form and associate it\n   * with the form that has this `id`. The form must be in the same document\n   * or shadow root for this to work.\n   */\n  @property({ reflect: true }) form = '';\n\n  /** Makes the input a required field. */\n  @property({ reflect: true, type: Boolean }) required = false;\n\n  /** Suppress the value from being displayed in the file control */\n  @property({ attribute: 'hide-value', type: Boolean }) hideValue = false;\n\n  @query('.input__control') input: HTMLInputElement;\n\n  @query('.button') button: SynButton;\n\n  @query('.droparea') dropareaWrapper: HTMLDivElement;\n\n  @query('.droparea__icon') dropareaIcon: HTMLSpanElement;\n\n  @query('.input__value') inputChosen: HTMLSpanElement;\n\n  /** Gets the validity state object */\n  get validity() {\n    return this.input.validity;\n  }\n\n  /** Gets the validation message */\n  get validationMessage() {\n    return this.input.validationMessage;\n  }\n\n  /**\n   * Checks for validity but does not show a validation message.\n   * Returns `true` when valid and `false` when invalid.\n   */\n  checkValidity() {\n    return this.input.checkValidity();\n  }\n\n  /** Gets the associated form, if one exists. */\n  getForm(): HTMLFormElement | null {\n    return this.formControlController.getForm();\n  }\n\n  /** Checks for validity and shows the browser's validation message if the control is invalid. */\n  reportValidity() {\n    return this.input.reportValidity();\n  }\n\n  /** Sets a custom validation message. Pass an empty string to restore validity. */\n  setCustomValidity(message: string) {\n    this.input.setCustomValidity(message);\n    this.formControlController.updateValidity();\n  }\n\n  @watch('disabled', { waitUntilFirstUpdate: true })\n  handleDisabledChange() {\n    // Disabled form controls are always valid\n    this.formControlController.setValidity(this.disabled);\n  }\n\n  @watch('value', { waitUntilFirstUpdate: true })\n  async handleValueChange() {\n    await this.updateComplete;\n    this.formControlController.updateValidity();\n  }\n\n  /** Sets focus on the button or droparea. */\n  focus(options?: FocusOptions) {\n    if (this.droparea) {\n      this.dropareaWrapper?.focus(options);\n      return;\n    }\n\n    this.button?.focus(options);\n  }\n\n  /** Removes focus from the button or droparea. */\n  blur() {\n    if (this.droparea) {\n      this.dropareaWrapper?.blur();\n      return;\n    }\n\n    this.button?.blur();\n  }\n\n  private handleInvalid(event: Event) {\n    this.formControlController.setValidity(false);\n    this.formControlController.emitInvalidEvent(event);\n  }\n\n  private handleFiles(files: FileList | null) {\n    if (!files) {\n      this.value = '';\n      return;\n    }\n    this.files = files;\n  }\n\n  private async handleTransferItems(items: DataTransferItemList | null): Promise<FileList> {\n    if (!items) {\n      this.value = '';\n      return new Promise((_resolve, reject) => { reject(new Error('No proper items found')); });\n    }\n\n    const entries = Array\n      .from(items)\n      .map(item => item.webkitGetAsEntry());\n\n    const filesPromises = entries.map(entry => this.getFilesFromEntry(entry));\n    const filesArray = await Promise.all(filesPromises);\n    const files = filesArray.flat();\n\n    const dataTransfer = new DataTransfer();\n    Array.from(files).forEach(f => dataTransfer.items.add(f));\n    return dataTransfer.files;\n  }\n\n  private async getFilesFromEntry(entry: FileSystemEntry | null): Promise<File[]> {\n    if (!entry) {\n      return [];\n    }\n    if (entry.isFile) {\n      return new Promise<File[]>((resolve, reject) => {\n        (entry as FileSystemFileEntry).file(file => resolve([file]), reject);\n      });\n    }\n    if (entry.isDirectory) {\n      return new Promise<File[]>((resolve, reject) => {\n        const dirReader = (entry as FileSystemDirectoryEntry).createReader();\n        dirReader.readEntries((entries) => {\n          Promise.all(entries.map(e => this.getFilesFromEntry(e)))\n            .then((files) => { resolve(files.flat()); })\n            .catch(reject);\n        });\n      });\n    }\n    return [];\n  }\n\n  private handleClick(e: Event) {\n    e.preventDefault();\n    this.input.click();\n  }\n\n  /** Handles the change event of the native input */\n  private handleChange(e: Event) {\n    e.preventDefault();\n    e.stopPropagation();\n\n    this.emit('syn-input');\n    this.emit('syn-change');\n  }\n\n  private handleDragOver(e: DragEvent) {\n    e.preventDefault();\n    e.stopPropagation();\n    this.userIsDragging = true;\n  }\n\n  private handleDragLeave(e: DragEvent) {\n    e.preventDefault();\n    e.stopPropagation();\n    this.userIsDragging = false;\n  }\n\n  // eslint-disable-next-line complexity\n  private async handleDrop(e: DragEvent) {\n    e.preventDefault();\n    e.stopPropagation();\n\n    if (!e.dataTransfer) {\n      return;\n    }\n\n    const files = await this.handleTransferItems(e.dataTransfer?.items);\n\n    this.userIsDragging = false;\n\n    if (!files) {\n      return;\n    }\n\n    // webkitdirectory also allows multiple files\n    if (!this.multiple && !this.webkitdirectory && files.length > 1) {\n      this.emit('syn-error');\n      return;\n    }\n\n    // Use the transferred file list from the drag drop interface\n    const hasTrigger = this.hasSlotController.test('trigger');\n    if (!hasTrigger) {\n      const disappearAnimation = getAnimation(this.inputChosen, 'file.text.disappear', { dir: this.localize.dir() });\n      const appearAnimation = getAnimation(this.inputChosen, 'file.text.appear', { dir: this.localize.dir() });\n\n      if (this.droparea) {\n        const dropIconAnimation = getAnimation(this.dropareaIcon, 'file.iconDrop', { dir: this.localize.dir() });\n        // eslint-disable-next-line @typescript-eslint/no-floating-promises\n        animateTo(this.dropareaIcon, dropIconAnimation.keyframes, dropIconAnimation.options);\n      }\n      // eslint-disable-next-line max-len\n      await animateTo(this.inputChosen, disappearAnimation.keyframes, disappearAnimation.options);\n      this.handleFiles(files);\n      await animateTo(this.inputChosen, appearAnimation.keyframes, appearAnimation.options);\n    } else {\n      this.handleFiles(files);\n    }\n\n    this.input.dispatchEvent(new Event('change'));\n  }\n\n  /**\n   * Handle the focus of the droparea and emit focus event\n   */\n  private handleFocus() {\n    this.emit('syn-focus');\n  }\n\n  /**\n   * Handle the blur of the droparea and emit blur event\n   */\n  private handleBlur() {\n    this.emit('syn-blur');\n  }\n\n  private renderValue() {\n    let hasFiles = false;\n    let fileChosenLabel = this.localize.term('numFilesSelected', 0, this.webkitdirectory);\n\n    if (this.files && this.files?.length > 0) {\n      hasFiles = true;\n      fileChosenLabel = this.files.length === 1\n        ? this.files[0].name\n        : this.localize.term('numFilesSelected', this.files.length, this.webkitdirectory);\n    }\n\n    return html`\n      <span\n        class=${classMap({\n          input__value: true,\n          'input__value--hidden': this.hideValue,\n          'input__value--placeholder': !hasFiles,\n        })}\n        part=\"value\"\n      >\n        ${fileChosenLabel}\n      </span>\n    `;\n  }\n\n  /* eslint-disable @typescript-eslint/unbound-method */\n  private renderDroparea() {\n    return html`\n      <div\n        class=\"droparea\"\n        @click=${this.handleClick}\n        @keypress=${this.handleClick}\n        @focus=${this.handleFocus}\n        @blur=${this.handleBlur}\n        tabindex=${this.disabled ? -1 : 0}\n        part=\"droparea\"\n      >\n        <div\n          class=\"droparea__background\"\n          part=\"droparea-background\"\n        >\n          <span part=\"droparea-icon\" class=\"droparea__icon\">\n            <slot name=\"droparea-icon\">\n              <syn-icon name=\"upload-file\" library=\"system\" ></syn-icon>\n            </slot>\n          </span>\n          <p\n            class=\"droparea__text\"\n            part=\"droparea-value\"\n          >\n            <strong>${this.localize.term(this.webkitdirectory ? 'folderDragDrop' : 'fileDragDrop')}</strong>\n            ${this.renderValue()}\n          </p>\n        </div>\n      </div>\n    `;\n  }\n  /* eslint-enable @typescript-eslint/unbound-method */\n\n  /* eslint-disable @typescript-eslint/unbound-method */\n  private renderButton() {\n    let buttonText = this.localize.term('fileButtonText');\n    if (this.multiple) {\n      buttonText = this.localize.term('fileButtonTextMultiple');\n    }\n    if (this.webkitdirectory) {\n      buttonText = this.localize.term('folderButtonText');\n    }\n\n    return html`\n      <div\n        class=\"button__wrapper\"\n        part=\"button-wrapper\"\n      >\n        <syn-button\n          class=\"button\"\n          @click=${this.handleClick}\n          ?disabled=${this.disabled}\n          exportparts=\"base:button__base\"\n          part=\"button\"\n          size=${this.size}\n          variant=\"outline\"\n        >\n          ${buttonText}\n        </syn-button>\n        ${this.renderValue()}\n      </div>\n    `;\n  }\n  /* eslint-enable @typescript-eslint/unbound-method */\n\n  /* eslint-disable @typescript-eslint/unbound-method */\n  // eslint-disable-next-line complexity\n  render() {\n    const hasLabel = this.label || !!this.hasSlotController.test('label');\n    const hasHelpText = this.helpText ? true : !!this.hasSlotController.test('help-text');\n    const hasTrigger = !!this.hasSlotController.test('trigger');\n\n    return html`\n      <div\n        class=${classMap({\n          'form-control': true,\n          'form-control--droparea': this.droparea,\n          'form-control--has-help-text': hasHelpText,\n          'form-control--has-label': hasLabel,\n          'form-control--large': this.size === 'large',\n          'form-control--medium': this.size === 'medium',\n          'form-control--small': this.size === 'small',\n          'form-control--user-dragging': this.userIsDragging,\n        })}\n        @dragenter=${this.handleDragOver}\n        @dragleave=${this.handleDragLeave}\n        @dragover=${this.handleDragOver}\n        @drop=${this.handleDrop}\n        part=\"form-control\"\n      >\n      ${\n        hasTrigger\n          ? html`\n                <slot \n                  @click=${this.handleClick}\n                  @keypress=${this.handleClick}\n                  name=\"trigger\"\n                  part=\"trigger\"\n                ></slot>\n            `\n          : html`\n              <label\n                aria-hidden=${hasLabel ? 'false' : 'true'}\n                class=\"form-control__label\"\n                for=\"input\"\n                part=\"form-control-label\"\n              >\n                <slot name=\"label\">${this.label}</slot>\n              </label>\n\n              <div\n                class=\"form-control-input\"\n                part=\"form-control-input\"\n              >\n\n                ${this.droparea ? this.renderDroparea() : this.renderButton()}\n              </div>\n\n              <div\n                aria-hidden=${hasHelpText ? 'false' : 'true'}\n                class=\"form-control__help-text\"\n                id=\"help-text\"\n                part=\"form-control-help-text\"\n              >\n                <slot name=\"help-text\">${this.helpText}</slot>\n              </div>\n            `\n        }\n        <input\n          accept=${this.accept}\n          aria-describedby=\"help-text\"\n          @change=${this.handleChange}\n          class=\"input__control\"\n          ?disabled=${this.disabled}\n          id=\"input\"\n          @invalid=${this.handleInvalid}\n          ?multiple=${this.multiple}\n          name=${ifDefined(this.name)}\n          ?required=${this.required}\n          type=\"file\"\n          tabindex=\"-1\"\n          ?webkitdirectory=${this.webkitdirectory}\n        >\n    </div>\n    `;\n  }\n  /* eslint-enable @typescript-eslint/unbound-method */\n}\n\nsetDefaultAnimation('file.iconDrop', {\n  keyframes: [\n    { scale: 1 },\n    { scale: 0.7 },\n    { scale: 1 },\n  ],\n  options: { duration: 600, easing: 'ease-out' },\n});\n\nsetDefaultAnimation('file.text.disappear', {\n  keyframes: [\n    { opacity: 1 },\n    { opacity: 0, transform: 'translateY(-40%)' },\n  ],\n  options: { duration: 300, easing: 'cubic-bezier(0.45, 1.45, 0.8, 1)' },\n});\n\nsetDefaultAnimation('file.text.appear', {\n  keyframes: [\n    { opacity: 0, transform: 'translateY(40%)' },\n    { opacity: 1 },\n  ],\n  options: { duration: 300, easing: 'cubic-bezier(0.45, 1.45, 0.8, 1)' },\n});\n"],
-  "mappings": "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",
-  "names": []
-}

package/dist/chunks/chunk.5OQDAMNY.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/range/range.component.ts"],
-  "sourcesContent": ["/* eslint-disable complexity */\nimport type { CSSResultGroup, PropertyValues } from 'lit';\nimport { html } from 'lit';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { property, query, queryAll } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport type { SynergyFormControl } from '../../internal/synergy-element.js';\nimport { defaultValue } from '../../internal/default-value.js';\nimport { FormControlController, customErrorValidityState, validValidityState } from '../../internal/form.js';\nimport { HasSlotController } from '../../internal/slot.js';\nimport { LocalizeController } from '../../utilities/localize.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport formControlStyles from '../../styles/form-control.styles.js';\nimport formControlCustomStyles from '../../styles/form-control.custom.styles.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport SynTooltip from '../tooltip/tooltip.component.js';\nimport {\n  arraysDiffer,\n  getNormalizedValueFromClientX,\n  numericSort,\n} from './utility.js';\nimport styles from './range.styles.js';\nimport { enableDefaultSettings } from '../../utilities/defaultSettings/decorator.js';\n\n/**\n * @summary Ranges allow the user to select values within a given range using one or two thumbs.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-range--docs\n * @status stable\n *\n * @dependency syn-tooltip\n *\n * @slot label - The range's label. Alternatively, you can use the `label` attribute.\n * @slot prefix - Used to prepend a presentational icon or similar element to the range.\n * @slot suffix - Used to append a presentational icon or similar element to the range.\n * @slot help-text - Text that describes how to use the range.\n * Alternatively, you can use the `help-text` attribute.\n * @slot ticks - Used to display tick marks at specific intervals along the range.\n *\n * @event syn-blur - Emitted when the control loses focus.\n * @event syn-change - Emitted when an alteration to the control's value is committed by the user.\n * @event syn-focus - Emitted when the control gains focus.\n * @event syn-input - Emitted when the control receives input.\n * @event syn-invalid - Emitted when the form control has been checked for validity\n * and its constraints aren't satisfied.\n * @event syn-move - Emitted when the user moves a thumb, either via touch or keyboard.\n * Use `Event.preventDefault()` to prevent movement.\n *\n * @csspart form-control - The form control that wraps the label, input, and help text.\n * @csspart form-control-label - The label's wrapper.\n * @csspart form-control-help-text - The help text's wrapper.\n * @csspart base - The component's base wrapper.\n * @csspart input-wrapper - The container that wraps the input track and ticks.\n * @csspart track-wrapper - The wrapper for the track.\n * @csspart track - The inactive track.\n * @csspart active-track - The active track.\n * @csspart prefix - The container that wraps the prefix.\n * @csspart suffix - The container that wraps the suffix.\n * @csspart ticks - The container that wraps the tick marks.\n * @csspart thumb - The thumb(s) that the user can drag to change the range.\n *\n * @csspart tooltip__base - The base of the tooltip\n * @csspart tooltip__arrow - The arrow of the tooltip\n * @csspart tooltip__popup - The popup of the tooltip\n * @csspart tooltip__body - The body of the tooltip\n *\n * @cssproperty --thumb-size - The size of a thumb.\n * @cssproperty --thumb-hit-area-size - The clickable area around the thumb.\n * Per default this is set to 140% of the thumb size. Must be a scale css value (defaults to 1.4).\n * @cssproperty --track-hit-area-size - The clickable area around the track (top and left).\n * @cssproperty --track-color-active - Color of the track representing the current value.\n * @cssproperty --track-color-inactive - Color of the track that represents the remaining value.\n * @cssproperty --track-height - The height of the track.\n * @cssproperty --track-active-offset - The point of origin of the active track,\n * starting at the left side of the range.\n */\n@enableDefaultSettings('SynRange')\nexport default class SynRange extends SynergyElement implements SynergyFormControl {\n  static styles: CSSResultGroup = [\n    componentStyles,\n    formControlStyles,\n    formControlCustomStyles,\n    styles,\n  ];\n\n  static dependencies = {\n    'syn-tooltip': SynTooltip,\n  };\n\n  /** The name of the range, submitted as a name/value pair with form data. */\n  @property() name = '';\n\n  /** The range's label. If you need to display HTML, use the `label` slot instead. */\n  @property() label = '';\n\n  /** The range's help text. If you need to display HTML, use the help-text slot instead. */\n  @property({ attribute: 'help-text' }) helpText = '';\n\n  /** Disables the range. */\n  @property({ reflect: true, type: Boolean }) disabled = false;\n\n  /** The minimum acceptable value of the range. */\n  @property({ type: Number }) min = 0;\n\n  /** The maximum acceptable value of the range. */\n  @property({ type: Number }) max = 100;\n\n  /** The interval at which the range will increase and decrease. */\n  @property({ type: Number }) step = 1;\n\n  /** The range's size. */\n  @property({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n  /** The preferred placement of the range's tooltip. Use \"none\" to disable the tooltip */\n  @property({ attribute: 'tooltip-placement', type: String }) tooltipPlacement: 'top' | 'bottom' | 'none' = 'top';\n\n  /** The current values of the input (in ascending order) as a string of space separated values */\n  @property({ type: String })\n  set value(value: string | null) {\n    this.#value = value\n      ? value.split(' ').map(Number).sort(numericSort)\n      : [];\n  }\n\n  get value() {\n    return this.#value.slice().sort(numericSort).join(' ');\n  }\n\n  /**\n   * Set to true to restrict the movement of a thumb to its next and previous thumb.\n   * This only affects multi range components\n   */\n  @property({ attribute: 'restrict-movement', type: Boolean }) restrictMovement = false;\n\n  /** Gets or sets the current values of the range as an array of numbers */\n  set valueAsArray(value: readonly number[] | null) {\n    const oldValue = this.#value;\n    this.#value = Array.isArray(value) ? value.slice().sort(numericSort) : value || [];\n    if (arraysDiffer(oldValue, this.#value)) {\n      this.requestUpdate('value', oldValue.join(' '));\n    }\n  }\n\n  get valueAsArray() {\n    return [...this.#value].sort(numericSort);\n  }\n\n  /** The default value of the form control. Primarily used for resetting the form control. */\n  @defaultValue() defaultValue = '0';\n\n  /**\n   * By default, form controls are associated with the nearest containing `<form>` element.\n   * This attribute allows you to place the form control outside of a form\n   * and associate it with the form that has this `id`.\n   * The form must be in the same document or shadow root for this to work.\n   */\n  @property({ reflect: true }) form = '';\n\n  /**\n   * A function used to format the tooltip's value.\n   * The value of the thumb is passed as the only argument.\n   * The function should return a string to display in the tooltip.\n   */\n  @property({ attribute: false }) tooltipFormatter: (value: number) => string;\n\n  @query('.input__wrapper') baseDiv: HTMLDivElement;\n\n  @query('.active-track') activeTrack: HTMLDivElement;\n\n  @query('.ticks') ticks: HTMLDivElement;\n\n  @queryAll('.thumb') thumbs: NodeListOf<HTMLDivElement>;\n\n  @query('.range__validation-input') validationInput: HTMLInputElement;\n\n  private readonly hasSlotController = new HasSlotController(this, 'help-text', 'label', 'prefix', 'suffix', 'ticks');\n\n  private readonly formControlController = new FormControlController(this, { assumeInteractionOn: ['syn-change'] });\n\n  private localize = new LocalizeController(this);\n\n  private visibilityObserver: IntersectionObserver;\n\n  #value: readonly number[] = [0];\n\n  #rangeValues = new Map<number, number>();\n\n  #hasFocus = false;\n\n  #validationError = '';\n\n  #validationTimeout: NodeJS.Timeout;\n\n  #lastChangeValue: number [] = [];\n\n  get #rtl() {\n    return this.localize.dir() === 'rtl';\n  }\n\n  constructor() {\n    super();\n    this.tooltipFormatter = this.localize.number.bind(this.localize);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this?.visibilityObserver?.disconnect();\n  }\n\n  firstUpdated() {\n    // #727: Check if the ticks are visible and update the prefix and suffix position when they are.\n    this.visibilityObserver = new IntersectionObserver((entries) => {\n      const entry = entries.at(0);\n      if (entry && entry.isIntersecting && entry.target.checkVisibility()) {\n        this.#updatePrefixSuffixPosition(entry.boundingClientRect.height);\n      }\n    }, {\n      // We bind the root to the parent element of the ticks to make sure we are only called\n      // when the ticks are visible, not when the ticks are scrolled out of the viewport.\n      root: this.ticks.parentElement,\n    });\n    this.visibilityObserver.observe(this.ticks);\n\n    this.formControlController.updateValidity();\n    // initialize the lastChangeValue with the initial value\n    this.#lastChangeValue = Array.from(this.#value);\n    /**\n     * Silence the screen reader for the tooltip.\n     * Otherwise it will read the new value on change multiple times instead of just one time.\n     * The aria-hidden needs to be set where the aria-live attribute is set, to silence it.\n     */\n    this.thumbs.forEach((thumb) => {\n      const tooltip = thumb.parentElement as SynTooltip;\n      // eslint-disable-next-line @typescript-eslint/no-floating-promises\n      tooltip.updateComplete.then(() => {\n        const tooltipBody = tooltip.shadowRoot!.querySelector('.tooltip__body');\n        tooltipBody?.setAttribute('aria-hidden', 'true');\n      });\n    });\n  }\n\n  protected override willUpdate(changedProperties: PropertyValues) {\n    super.willUpdate(changedProperties);\n\n    // When the proposed min is bigger than the max value,\n    // we need to swap the values to make sure the min is always smaller than the max\n    // @example <syn-range min=\"50\" max=\"10\"> becomes <syn-range min=\"10\" max=\"50\">\n    if (this.min > this.max) {\n      [this.min, this.max] = [this.max, this.min];\n    }\n\n    if (this.step > this.max - this.min) {\n      this.step = this.max - this.min;\n    }\n\n    if (this.step <= 0) {\n      this.step = 1;\n    }\n\n    const adjustedValue = this.#value\n      .map(value => {\n        if (value <= this.min) return this.min;\n        if (value >= this.max) return this.max;\n        const nextValue = this.min + this.step * Math.round((value - this.min) / this.step);\n        if (nextValue > this.max) return this.max;\n        return nextValue;\n      });\n\n    if (arraysDiffer(this.#value, adjustedValue)) {\n      this.#value = adjustedValue;\n    }\n  }\n\n  protected override updated(changedProperties: PropertyValues) {\n    super.updated(changedProperties);\n    // eslint-disable-next-line no-restricted-syntax\n    for (const thumb of this.thumbs) {\n      const rangeId = +thumb.dataset.rangeId!;\n      // eslint-disable-next-line no-continue\n      if (!this.#rangeValues.has(rangeId)) continue;\n      this.#moveThumb(thumb, this.#rangeValues.get(rangeId)!);\n    }\n    this.#updateActiveTrack();\n  }\n\n  override focus(options?: FocusOptions) {\n    const firstThumb = this.thumbs.item(0);\n    if (firstThumb) {\n      firstThumb.focus(options);\n    } else {\n      super.focus(options);\n    }\n  }\n\n  /**\n   * Checks for validity but does not show a validation message.\n   * Returns `true` when valid and `false` when invalid.\n   */\n  public checkValidity() {\n    if (this.disabled) return true;\n    const isValid = !this.#validationError;\n\n    if (!isValid) {\n      this.formControlController.emitInvalidEvent();\n    }\n\n    return isValid;\n  }\n\n  /** Checks for validity and shows the browser's validation message if the control is invalid. */\n  public reportValidity() {\n    if (this.disabled) return true;\n\n    const isValid = this.validity.valid;\n\n    this.formControlController.setValidity(isValid);\n    this.validationInput.hidden = true;\n    clearTimeout(this.#validationTimeout);\n\n    if (!isValid) {\n      // Show the browser's constraint validation message\n      this.validationInput.hidden = false;\n      this.validationInput.reportValidity();\n      this.#validationTimeout = setTimeout(() => {\n        this.validationInput.hidden = true;\n      }, 10000);\n    }\n\n    return isValid;\n  }\n\n  /** Sets a custom validation message. Pass an empty string to restore validity. */\n  public setCustomValidity(message: string) {\n    this.#validationError = message;\n    this.validationInput.setCustomValidity(message);\n    this.formControlController.updateValidity();\n  }\n\n  /** Gets the associated form, if one exists. */\n  public getForm(): HTMLFormElement | null {\n    return this.formControlController.getForm();\n  }\n\n  /** Gets the validity state object */\n  public get validity(): ValidityState {\n    if (this.#validationError) return customErrorValidityState;\n\n    return validValidityState;\n  }\n\n  /** Gets the validation message */\n  public get validationMessage() {\n    return this.#validationError;\n  }\n\n  #onClickTrack(event: PointerEvent, focusThumb = true) {\n    if (this.disabled) return;\n    const { clientX } = event;\n\n    const thumbs = Array.from(this.thumbs);\n    const pos = getNormalizedValueFromClientX(this.baseDiv, clientX, this.#rtl);\n    const unit = this.step / (this.max - this.min);\n    const nextValue = this.min + this.step * Math.round(pos / unit);\n\n    // Get the thumb that is placed closest to the click position\n    const thumb = thumbs.reduce((prev, curr) => {\n      const currValue = this.#rangeValues.get(+curr.dataset.rangeId!)!;\n      const prevValue = this.#rangeValues.get(+prev.dataset.rangeId!)!;\n\n      const currDiff = Math.abs(currValue - nextValue);\n      const prevDiff = Math.abs(prevValue - nextValue);\n\n      if (currDiff === prevDiff) {\n        // If the difference is the same, we use the thumb which has the correct order.\n        // left track click --> prev, right track click --> curr\n        return currValue < nextValue ? curr : prev;\n      }\n\n      return currDiff < prevDiff ? curr : prev;\n    });\n\n    const rangeId = +thumb.dataset.rangeId!;\n\n    if (!rangeId) return;\n\n    this.#rangeValues.set(rangeId, nextValue);\n    this.#moveThumb(thumb, nextValue);\n\n    const prevValue = this.#value;\n    this.#value = Array.from(this.#rangeValues.values());\n    this.#updateActiveTrack();\n\n    if (arraysDiffer(prevValue, this.#value)) {\n      this.#lastChangeValue = Array.from(this.#value);\n      this.emit('syn-input');\n      this.emit('syn-change');\n    }\n\n    // #595: Redispatch the original event to start dragging the thumb\n    // whenever the user clicked on the track.\n    // The check for focusThumb makes sure this does not happen when clicking on the track items\n    const newEvt = new PointerEvent('pointerdown', event);\n    if (focusThumb) {\n      if (thumb.dispatchEvent(newEvt)) {\n        this.#updateTooltip(thumb);\n      }\n    }\n  }\n\n  /**\n   * Special method for handling clicks on track items\n   * When clicking track items, we do not want the thumb to have focus\n   */\n  #onClickTrackItem(event: PointerEvent) {\n    this.#onClickTrack(event, false);\n  }\n\n  /**\n   * Get the boundaries of a given thumb\n   * @param thumb The thumb element that was moved\n   * @param value The current value of a thumb\n   * @returns An object containing information about the current boundaries\n   */\n  #movementBoundariesForThumb(thumb: HTMLDivElement, value: number) {\n    // If we are in restrict mode, we should not move the thumb\n    // if it is smaller than the previous thumb or larger than the next thumb\n    const values = this.valueAsArray!;\n    const thumbs = Array.from(this.thumbs);\n    const thumbIndex = thumbs.indexOf(thumb);\n\n    // Get the previous and next thumb and see what are our valid ranges\n    const prevValue = values[thumbIndex - 1] || this.min;\n    const nextValue = values[thumbIndex + 1] || this.max;\n\n    const isRestricted = value < prevValue || value > nextValue;\n    const finalValue = Math.max(prevValue, Math.min(nextValue, value));\n\n    return {\n      finalValue,\n      isRestricted,\n      nextValue,\n      prevValue,\n    };\n  }\n\n  async #onClickThumb(event: PointerEvent) {\n    if (this.disabled) return;\n\n    const thumb = event.target as HTMLDivElement;\n    this.#updateTooltip(thumb);\n\n    if (thumb.dataset.pointerId) {\n      thumb.releasePointerCapture(+thumb.dataset.pointerId);\n    }\n\n    thumb.dataset.pointerId = event.pointerId.toString();\n    thumb.setPointerCapture(event.pointerId);\n    thumb.classList.add('grabbed');\n\n    await (thumb.parentElement as SynTooltip).show();\n  }\n\n  #onDragThumb(event: PointerEvent) {\n    if (this.disabled) return;\n\n    const thumb = event.target as HTMLDivElement;\n    const rangeId = +thumb.dataset.rangeId!;\n    if (!this.#rangeValues.has(rangeId)) return;\n\n    const pointerId = thumb.dataset.pointerId ? +thumb.dataset.pointerId : null;\n    if (pointerId !== event.pointerId) return;\n\n    const pos = getNormalizedValueFromClientX(this.baseDiv, event.clientX, this.#rtl);\n    const unit = this.step / (this.max - this.min);\n    let value = this.min + this.step * Math.round(pos / unit);\n\n    const synMove = this.emit('syn-move', {\n      cancelable: true,\n      detail: {\n        element: thumb,\n        value,\n      },\n    });\n\n    if (synMove.defaultPrevented) {\n      return;\n    }\n\n    if (this.restrictMovement) {\n      const movementData = this.#movementBoundariesForThumb(thumb, value);\n      if (movementData.isRestricted) {\n        value = movementData.finalValue;\n        // Make sure the thumb has the highest z-index of all thumbs\n        thumb.style.zIndex = (3 + this.thumbs.length).toFixed(0);\n      } else {\n        thumb.style.zIndex = '3';\n      }\n    }\n\n    this.#rangeValues.set(rangeId, value);\n    this.#moveThumb(thumb, value);\n\n    const prevValue = this.#value;\n    this.#value = Array.from(this.#rangeValues.values());\n    this.#updateActiveTrack();\n\n    if (arraysDiffer(prevValue, this.#value)) {\n      this.emit('syn-input');\n    }\n  }\n\n  async #onReleaseThumb(event: PointerEvent) {\n    const thumb = event.target as HTMLDivElement;\n    if (!thumb.dataset.pointerId || event.pointerId !== +thumb.dataset.pointerId) return;\n\n    thumb.classList.remove('grabbed');\n    thumb.releasePointerCapture(event.pointerId);\n    delete thumb.dataset.pointerId;\n\n    if (arraysDiffer(this.#lastChangeValue, this.#value)) {\n      this.#lastChangeValue = Array.from(this.#value);\n      this.emit('syn-change');\n    }\n\n    await (thumb.parentElement as SynTooltip).hide();\n  }\n\n  #moveThumb(thumb: HTMLDivElement, value: number) {\n    thumb.setAttribute('aria-valuenow', value.toString());\n    thumb.setAttribute('aria-valuetext', this.tooltipFormatter(value));\n    const pos = (value - this.min) / (this.max - this.min);\n    // eslint-disable-next-line no-param-reassign\n    thumb.style.insetInlineStart = `calc(${100 * pos}% - var(--half-thumb-size))`;\n    this.#updateTooltip(thumb);\n  }\n\n  #updateActiveTrack() {\n    const { activeTrack } = this;\n    if (!activeTrack) return;\n\n    // Special case: User set min and max to the same values.\n    // To not show the active track in this case.\n    if (this.min === this.max) {\n      activeTrack.style.insetInlineStart = '0%';\n      activeTrack.style.insetInlineEnd = '0%';\n      return;\n    }\n\n    // If there is only one thumb, the active track should start at the beginning\n    // and end at the thumb\n    if (this.#value.length === 1) {\n      const start = getComputedStyle(this).getPropertyValue('--track-active-offset') || '0%';\n      const end = (100 * (this.#value[0] - this.min)) / (this.max - this.min);\n\n      activeTrack.style.insetInlineStart = `min(${start}, ${end}%)`;\n      activeTrack.style.insetInlineEnd = `min(calc(100% - ${start}), calc(100% - ${end}%))`;\n\n      return;\n    }\n\n    // The render order of the thumbs is not guaranteed to be the same as the value order.\n    const sortedValues = this.#value.slice().sort(numericSort);\n\n    // Multi thumb: Place the active track between the first and last thumb\n    const start = (100 * (sortedValues[0] - this.min)) / (this.max - this.min);\n    const end = (100 * (sortedValues[sortedValues.length - 1] - this.min)) / (this.max - this.min);\n\n    activeTrack.style.insetInlineStart = `${start}%`;\n    activeTrack.style.insetInlineEnd = `calc(100% - ${end}%)`;\n  }\n\n  #onKeyPress(event: KeyboardEvent) {\n    const thumb = event.target as HTMLDivElement;\n    const rangeId = +thumb.dataset.rangeId!;\n\n    const currentValue = this.#rangeValues.get(rangeId);\n    if (currentValue === undefined) return;\n\n    let value = currentValue;\n\n    switch (event.key) {\n      case 'ArrowUp':\n      case 'Up':\n        value = Math.min(currentValue + this.step, this.max);\n        break;\n      case 'ArrowDown':\n      case 'Down':\n        value = Math.max(currentValue - this.step, this.min);\n        break;\n      case 'ArrowLeft':\n      case 'Left':\n        value = this.#rtl\n          ? Math.min(currentValue + this.step, this.max)\n          : Math.max(currentValue - this.step, this.min);\n        break;\n      case 'ArrowRight':\n      case 'Right':\n        value = this.#rtl\n          ? Math.max(currentValue - this.step, this.min)\n          : Math.min(currentValue + this.step, this.max);\n        break;\n      case 'PageUp':\n        value = Math.min(\n          currentValue + ((this.max - this.min) / 5),\n          this.max,\n        );\n        break;\n      case 'PageDown':\n        value = Math.max(\n          (currentValue - (this.max - this.min) / 5),\n          this.min,\n        );\n        break;\n      case 'Home':\n        value = this.min;\n        break;\n      case 'End':\n        value = this.max;\n        break;\n      default:\n        return;\n    }\n\n    if (value !== currentValue) {\n      // Make sure the user is able to intercept movement\n      const synMove = this.emit('syn-move', {\n        cancelable: true,\n        detail: {\n          element: thumb,\n          value,\n        },\n      });\n\n      if (synMove.defaultPrevented) {\n        return;\n      }\n\n      if (this.restrictMovement) {\n        const movementData = this.#movementBoundariesForThumb(thumb, value);\n        if (movementData.isRestricted) {\n          value = movementData.finalValue;\n        }\n      }\n\n      this.#moveThumb(thumb, value);\n\n      this.#rangeValues.set(rangeId, value);\n      this.#value = Array.from(this.#rangeValues.values());\n\n      this.#updateActiveTrack();\n      this.#updateTooltip(thumb);\n\n      this.#lastChangeValue = Array.from(this.#value);\n      this.emit('syn-input');\n      this.emit('syn-change');\n    }\n\n    event.stopPropagation();\n    event.preventDefault();\n  }\n\n  #onBlur(event: FocusEvent) {\n    if (event.relatedTarget && this.shadowRoot?.contains(event.relatedTarget as Node)) return;\n    this.emit('syn-blur');\n    this.#hasFocus = false;\n  }\n\n  #updateTooltip(thumb: HTMLDivElement) {\n    if (this.tooltipPlacement === 'none') return;\n    const rangeId = +thumb.dataset.rangeId!;\n    if (!this.#rangeValues.has(rangeId)) return;\n    const value = this.#rangeValues.get(rangeId)!;\n    const tooltip = thumb.parentElement as SynTooltip;\n    tooltip.content = this.tooltipFormatter(value);\n  }\n\n  #onFocusThumb(event: FocusEvent) {\n    if (this.disabled) return;\n    if (!this.#hasFocus) {\n      this.#hasFocus = true;\n      this.emit('syn-focus');\n    }\n    const thumb = event.target as HTMLDivElement;\n    if (!thumb?.dataset?.rangeId) return;\n    this.#updateTooltip(thumb);\n  }\n\n  #handleInvalid(event: Event) {\n    this.formControlController.setValidity(false);\n    this.formControlController.emitInvalidEvent(event);\n  }\n\n  #updatePrefixSuffixPosition(height?: number) {\n    const hasTicksSlot = this.hasSlotController.test('ticks');\n    const hasPrefixSlot = this.hasSlotController.test('prefix');\n    const hasSuffixSlot = this.hasSlotController.test('suffix');\n\n    if (!hasTicksSlot) {\n      return;\n    }\n\n    let ticksHeight = height || this.shadowRoot?.querySelector('.ticks')?.clientHeight;\n    if (ticksHeight) {\n      // Add two pixels as the 1px margin on top and bottom are not included in the clientHeight\n      ticksHeight += 2;\n\n      ticksHeight /= 2;\n\n      if (hasPrefixSlot) {\n        const prefix = this.shadowRoot?.querySelector('.input__prefix') as HTMLElement;\n        prefix.style.transform = `translateY(-${ticksHeight}px)`;\n      }\n\n      if (hasSuffixSlot) {\n        const suffix = this.shadowRoot?.querySelector('.input__suffix') as HTMLElement;\n        suffix.style.transform = `translateY(-${ticksHeight}px)`;\n      }\n    }\n  }\n\n  /* eslint-disable @typescript-eslint/unbound-method */\n  private renderThumbs(hasLabel: boolean) {\n    // Aria special handling:\n    // 1. When there is only one label: Use the provided label as the aria-label for the thumb\n    // 2. When we have multiple label: Set the label for the first and last item to itself\n    const isMultiple = this.#value.length > 1;\n\n    this.#rangeValues.clear();\n    return this.#value.map((value, index) => {\n      const rangeId = index + 1;\n      this.#rangeValues.set(rangeId, value);\n\n      const id = `thumb-${rangeId}`;\n\n      let ariaLabel = '';\n      let ariaLabeledBy = '';\n\n      if (!isMultiple) {\n        ariaLabeledBy = hasLabel ? 'label aria-label-hidden' : '';\n      } else {\n        ariaLabeledBy = hasLabel ? `label aria-label-hidden ${id}` : `aria-label-hidden ${id}`;\n\n        if (index === 0) {\n          ariaLabel = `${this.localize.term('rangeMin')} (${this.tooltipFormatter(value)})`;\n        } else if (index === this.#value.length - 1) {\n          ariaLabel = `${this.localize.term('rangeMax')} (${this.tooltipFormatter(value)})`;\n        } else {\n          ariaLabel = this.tooltipFormatter(value);\n        }\n      }\n\n      return html`\n        <syn-tooltip\n          exportparts=\"base:tooltip__base, base__arrow:tooltip__arrow, base__popup:tooltip__popup, body:tooltip__body\"\n          .disabled=${this.tooltipPlacement === 'none' || this.disabled}\n          .placement=${this.tooltipPlacement as 'top' | 'bottom'}\n          trigger=\"focus\"\n        >\n          <div\n            aria-disabled=${ifDefined(this.disabled ? 'true' : undefined)}\n            aria-labelledby=${ariaLabeledBy}\n            aria-label=${ariaLabel}\n            aria-valuemax=\"${this.max}\"\n            aria-valuemin=\"${this.min}\"\n            aria-valuenow=\"${value}\"\n            aria-valuetext=\"${this.tooltipFormatter(value)}\"\n            class=\"thumb\"\n            data-range-id=\"${rangeId}\"\n            id=${id}\n            part=\"thumb\"\n            role=\"slider\"\n            tabindex=\"${this.disabled ? -1 : 0}\"\n            @pointerdown=${this.#onClickThumb}\n            @pointermove=${this.#onDragThumb}\n            @pointerup=${this.#onReleaseThumb}\n            @pointercancel=${this.#onReleaseThumb}\n            @pointerleave=${this.#onReleaseThumb}\n            @keydown=${this.#onKeyPress}\n            @focus=${this.#onFocusThumb}\n          ></div>\n        </syn-tooltip>\n      `;\n    });\n  }\n  /* eslint-enable @typescript-eslint/unbound-method */\n\n  /* eslint-disable @typescript-eslint/unbound-method */\n  override render() {\n    const hasLabelSlot = this.hasSlotController.test('label');\n    const hasHelpTextSlot = this.hasSlotController.test('help-text');\n    const hasPrefixSlot = this.hasSlotController.test('prefix');\n    const hasSuffixSlot = this.hasSlotController.test('suffix');\n    const hasLabel = this.label ? true : !!hasLabelSlot;\n    const hasHelpText = this.helpText ? true : !!hasHelpTextSlot;\n\n    return html`\n      <div\n        part=\"form-control\"\n        class=${classMap({\n          'form-control': true,\n          'form-control--has-help-text': hasHelpText,\n          'form-control--has-label': hasLabel,\n          'form-control--has-prefix': hasPrefixSlot,\n          'form-control--has-suffix': hasSuffixSlot,\n          'form-control--is-disabled': this.disabled,\n          'form-control--large': this.size === 'large',\n          'form-control--medium': this.size === 'medium',\n          'form-control--small': this.size === 'small',\n        })}\n        @focusout=${this.#onBlur}\n      >\n        <label\n          id=\"label\"\n          part=\"form-control-label\"\n          class=\"form-control__label\"\n          aria-hidden=${hasLabel ? 'false' : 'true'}\n          @click=${this.focus}\n        >\n          <slot name=\"label\">${this.label}</slot>\n        </label>\n\n        <label id=\"aria-label-hidden\" class=\"visually-hidden\">\n          (${this.#value.map(this.tooltipFormatter).join(' - ')})\n        </label>\n\n        <div class=\"base input__control\" part=\"base\">\n          <span part=\"prefix\" class=\"input__prefix\">\n            <slot name=\"prefix\"></slot>\n          </span>\n\n          <div class=\"input__wrapper\" part=\"input-wrapper\">\n            <input\n              class=\"range__validation-input visually-hidden\"\n              tabindex=\"-1\"\n              hidden\n              @invalid=${this.#handleInvalid}\n            />\n\n            <div\n              class=\"track__wrapper\"\n              @pointerdown=${this.#onClickTrack}\n              part=\"track-wrapper\"\n              role=\"presentation\"\n            >\n              <div class=\"track__click-helper\"></div>\n              <div class=\"track\" part=\"track\"></div>\n              <div class=\"active-track\" part=\"active-track\"></div>\n            </div>\n\n            ${this.renderThumbs(hasLabel)}\n\n            <div\n              class=\"ticks\"\n              part=\"ticks\"\n              @pointerdown=${this.#onClickTrackItem}\n              role=\"presentation\"\n            >\n              <slot name=\"ticks\"></slot>\n            </div>\n          </div>\n\n          <span part=\"suffix\" class=\"input__suffix\">\n            <slot name=\"suffix\"></slot>\n          </span>\n        </div>\n\n        <div\n          part=\"form-control-help-text\"\n          class=\"form-control__help-text\"\n          aria-hidden=${hasHelpText ? 'false' : 'true'}\n        >\n          <slot name=\"help-text\">${this.helpText}</slot>\n        </div>\n      </div>\n    `;\n  }\n  /* eslint-enable @typescript-eslint/unbound-method */\n}\n"],
-  "mappings": "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",
-  "names": ["prevValue", "start", "end"]
-}