@quartzds/core 1.0.0-beta.21 → 1.0.0-beta.23

package/dist/esm/qds-switch.entry.js.map

@@ -1 +1 @@
-{"file":"qds-switch.entry.js","mappings":"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","names":[],"sources":["src/components/switch/switch.css?tag=qds-switch&encapsulation=scoped","src/components/switch/switch.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2023 Schneider Electric\n *\n * SPDX-License-Identifier: LGPL-2.1-only\n */\n\n@import url('../shared.css');\n\n:host {\n  display: inline-block;\n}\n\n.qds-track,\n.qds-knob {\n  print-color-adjust: exact;\n}\n\n.qds-unchecked-text {\n  text-align: end;\n}\n\n.qds-icon {\n  color: var(--qds-theme-control-text-standard);\n  flex-shrink: 0;\n}\n\n.qds-track {\n  align-items: center;\n  border-radius: var(--qds-control-rounded-border-radius);\n  display: flex;\n  flex-shrink: 0;\n  print-color-adjust: exact;\n  background-color: var(--qds-theme-control-slider-track-inactive);\n}\n\n.qds-knob {\n  background-color: var(--qds-theme-accessory-background);\n  border-radius: var(--qds-control-rounded-border-radius);\n  border: var(--qds-control-border-width) solid var(--qds-theme-control-border);\n  box-shadow: var(--qds-theme-accessory-elevation);\n  box-sizing: content-box;\n}\n\n.qds-label {\n  box-sizing: border-box;\n  cursor: pointer;\n  display: flex;\n}\n\n.qds-switch {\n  clip-path: inset(50%);\n  height: 1px;\n  margin: 0;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n\n  &:hover ~ .qds-track > .qds-knob {\n    background-color: var(--qds-theme-interactive-background-hover);\n  }\n\n  &:active ~ .qds-track > .qds-knob {\n    background-color: var(--qds-theme-interactive-background-pressed);\n  }\n\n  &:checked {\n    & ~ .qds-track {\n      justify-content: flex-end;\n      background-color: var(--qds-theme-signature-color-default);\n\n      & > .qds-knob {\n        border-color: transparent;\n        box-sizing: border-box;\n        margin-inline-end: var(--qds-control-border-width);\n      }\n    }\n\n    &:hover ~ .qds-track > .qds-knob {\n      background-color: var(--qds-theme-interactive-background-hover);\n    }\n\n    &:active ~ .qds-track > .qds-knob {\n      background-color: var(--qds-theme-interactive-background-pressed);\n    }\n  }\n\n  &:focus-visible ~ .qds-track {\n    outline: var(--qds-theme-focus-border) solid var(--qds-focus-border-width);\n    outline-offset: var(--qds-focus-border-offset);\n  }\n}\n\n[aria-disabled='true'] {\n  opacity: var(--qds-theme-disabled);\n  pointer-events: none;\n}\n\n[data-size='small'] {\n  &.qds-icon {\n    height: var(--qds-control-small-icon-size);\n    width: var(--qds-control-small-icon-size);\n  }\n\n  &.qds-inline {\n    margin-block: var(--qds-control-small-padding-auto-height);\n  }\n\n  &.qds-label {\n    gap: var(--qds-control-small-gap-siblings-related);\n  }\n\n  &.qds-track {\n    width: calc(var(--qds-control-slider-knob-small-size) * 2);\n    height: var(--qds-control-toggle-box-small-size);\n  }\n\n  &.qds-knob {\n    height: var(--qds-control-slider-knob-small-size);\n    width: var(--qds-control-slider-knob-small-size);\n  }\n}\n\n[data-size='standard'] {\n  &.qds-icon {\n    height: var(--qds-control-standard-icon-size);\n    width: var(--qds-control-standard-icon-size);\n  }\n\n  &.qds-inline {\n    margin-block: var(--qds-control-standard-padding-auto-height);\n  }\n\n  &.qds-label {\n    gap: var(--qds-control-standard-gap-siblings-related);\n  }\n\n  &.qds-track {\n    width: calc(var(--qds-control-slider-knob-standard-size) * 2);\n    height: var(--qds-control-toggle-box-standard-size);\n  }\n\n  &.qds-knob {\n    height: var(--qds-control-slider-knob-standard-size);\n    width: var(--qds-control-slider-knob-standard-size);\n  }\n}\n\n[data-size='large'] {\n  &.qds-icon {\n    height: var(--qds-control-large-icon-size);\n    width: var(--qds-control-large-icon-size);\n  }\n\n  &.qds-inline {\n    margin-block: var(--qds-control-large-padding-auto-height);\n  }\n\n  &.qds-label {\n    gap: var(--qds-control-large-gap-siblings-related);\n  }\n\n  &.qds-track {\n    width: calc(var(--qds-control-slider-knob-large-size) * 2);\n    height: var(--qds-control-toggle-box-large-size);\n  }\n\n  &.qds-knob {\n    height: var(--qds-control-slider-knob-large-size);\n    width: var(--qds-control-slider-knob-large-size);\n  }\n}\n","// SPDX-FileCopyrightText: © 2023 Schneider Electric\n//\n// SPDX-License-Identifier: LGPL-2.1-only\n\nimport type { ComponentInterface, EventEmitter } from '@stencil/core'\nimport { Component, Element, Event, h, Listen, Prop } from '@stencil/core'\n\nimport type { Attributes, QdsFocusEventDetail } from '../../helpers'\nimport {\n  inheritAriaAttributes,\n  inheritAttributes,\n  pickFocusEventAttributes,\n} from '../../helpers'\nimport type { Value } from '../controls'\n\nexport type SwitchSize = 'large' | 'small' | 'standard'\n\nlet autoIncrementingId = 1\n\n/**\n * @see https://quartz.se.com/build/components/switch\n */\n@Component({\n  tag: 'qds-switch',\n  scoped: true,\n  styleUrl: 'switch.css',\n})\nexport class Switch implements ComponentInterface {\n  /**\n   * Adds vertical margin to the switch for alignment.\n   *\n   * This is useful when creating inline layouts so that the first lines have\n   * the correct vertical centering.\n   */\n  @Prop() public readonly inline: boolean = false\n\n  /**\n   * The name of the checked icon to render.\n   *\n   * Available names depend on the icon library being used.\n   */\n  @Prop({ reflect: true }) public readonly iconCheckedName?: string\n\n  /**\n   * The name of a registered checked icon library.\n   */\n  @Prop({ reflect: true }) public readonly iconCheckedLibrary: string =\n    'default'\n\n  /**\n   * The name of the unchecked icon to render.\n   *\n   * Available names depend on the icon library being used.\n   */\n  @Prop({ reflect: true }) public readonly iconUncheckedName?: string\n\n  /**\n   * The name of a registered unchecked icon library.\n   */\n  @Prop({ reflect: true }) public readonly iconUncheckedLibrary: string =\n    'default'\n\n  /**\n   * The switches's size.\n   */\n  @Prop({ reflect: true }) public readonly size: SwitchSize = 'standard'\n\n  /**\n   * The switch's checked text.\n   */\n  @Prop({ mutable: true, reflect: true }) public readonly textChecked?: string\n\n  /**\n   * The switch's unchecked text.\n   */\n  @Prop({ mutable: true, reflect: true }) public readonly textUnchecked?: string\n\n  /**\n   * Specify whether the switch should have focus when the page loads.\n   *\n   * @webnative\n   */\n  @Prop({ attribute: 'autofocus' }) public readonly autoFocus?: boolean\n\n  /**\n   *Sets the switch's state.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true, reflect: true }) public checked?: boolean\n\n  /**\n   * Prevents the switch from being interacted with: it cannot be pressed or\n   *focused.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true, reflect: true }) public disabled?: boolean\n\n  /**\n   * The [`<form>`](https://developer.mozilla.org/docs/Web/HTML/Element/form)\n   * element to associate the switch with (its form owner).\n   *\n   * The value of this property must be the id of a `<form>` in the same\n   * document. If this property is not set, the `<qds-switch>` is associated\n   * with its ancestor `<form>` element, if any.\n   *\n   * This property lets you associate `<qds-switch>` elements to `<form>`s\n   * anywhere in the document, not just inside a `<form>`. It can also override\n   *an ancestor `<form>` element.\n   *\n   * @webnative\n   */\n  @Prop() public readonly form?: string\n\n  /**\n   * The name of the switch, which is submitted with the form data. An\n   *incrementing ID is used by default.\n   *\n   * @webnative\n   */\n  @Prop() public readonly name = `qds-switch-${autoIncrementingId}`\n\n  /**\n   * The value of the switch, submitted as a name/value pair with form data.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true }) public value?: Value\n\n  /**\n   * Emitted when the switch loses focus.\n   */\n  @Event({ eventName: 'qdsBlur', bubbles: false, cancelable: false })\n  private readonly blurEmitter!: EventEmitter<QdsFocusEventDetail>\n\n  /**\n   * Emitted when a change to the switch's state is committed by the user.\n   */\n  @Event({ eventName: 'qdsChange', cancelable: false })\n  private readonly changeEmitter!: EventEmitter<void>\n\n  /**\n   * Emitted when the switch gains focus.\n   */\n  @Event({ eventName: 'qdsFocus', bubbles: false, cancelable: false })\n  private readonly focusEmitter!: EventEmitter<QdsFocusEventDetail>\n\n  @Element() private readonly element!: HTMLQdsSwitchElement\n\n  private inheritedAttributes: Attributes = {}\n\n  private get computedDisabled(): boolean {\n    return this.disabled ?? false\n  }\n\n  @Listen('click')\n  protected onClick(event: MouseEvent): void {\n    if (this.computedDisabled) return\n\n    event.preventDefault()\n\n    this.checked = !(this.checked ?? false)\n    this.changeEmitter.emit()\n  }\n\n  public componentWillLoad(): void {\n    autoIncrementingId += 1\n    this.inheritedAttributes = {\n      ...inheritAriaAttributes(this.element),\n      ...inheritAttributes(this.element, ['tabindex']),\n    }\n  }\n\n  public render() {\n    return (\n      // eslint-disable-next-line jsx-a11y/label-has-associated-control\n      <label\n        aria-disabled={this.computedDisabled ? 'true' : 'false'}\n        class={{\n          'qds-inline': this.inline,\n          'qds-label': true,\n        }}\n        data-size={this.size}\n      >\n        {this.textUnchecked !== undefined && this.textUnchecked !== '' && (\n          <qds-label\n            class=\"qds-unchecked-text\"\n            size={this.size}\n            text={this.textUnchecked}\n          />\n        )}\n        {this.iconUncheckedName !== undefined &&\n          this.iconUncheckedName !== '' && (\n            <qds-icon\n              class=\"qds-icon\"\n              data-size={this.size}\n              library={this.iconUncheckedLibrary}\n              name={this.iconUncheckedName}\n            />\n          )}\n        <input\n          // eslint-disable-next-line jsx-a11y/no-autofocus\n          autoFocus={this.autoFocus}\n          checked={this.checked}\n          class=\"qds-switch\"\n          disabled={this.disabled}\n          form={this.form}\n          name={this.name}\n          onBlur={this.onBlur}\n          onFocus={this.onFocus}\n          type=\"checkbox\"\n          value={this.value ?? undefined}\n          // eslint-disable-next-line react/jsx-props-no-spreading\n          {...this.inheritedAttributes}\n        />\n        <div class=\"qds-track\" data-size={this.size}>\n          <div class=\"qds-knob\" data-size={this.size} />\n        </div>\n        {this.iconCheckedName !== undefined && this.iconCheckedName !== '' && (\n          <qds-icon\n            class=\"qds-icon\"\n            data-size={this.size}\n            library={this.iconCheckedLibrary}\n            name={this.iconCheckedName}\n          />\n        )}\n        {this.textChecked !== undefined && this.textChecked !== '' && (\n          <qds-label size={this.size} text={this.textChecked} />\n        )}\n      </label>\n    )\n  }\n\n  private readonly onBlur = (event: FocusEvent): void => {\n    this.blurEmitter.emit(pickFocusEventAttributes(event))\n  }\n\n  private readonly onFocus = (event: FocusEvent): void => {\n    this.focusEmitter.emit(pickFocusEventAttributes(event))\n  }\n}\n"],"version":3}
+{"file":"qds-switch.entry.js","mappings":"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","names":[],"sources":["src/components/switch/switch.css?tag=qds-switch&encapsulation=scoped","src/components/switch/switch.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2023 Schneider Electric\n *\n * SPDX-License-Identifier: LGPL-2.1-only\n */\n\n@import url('../shared.css');\n\n:host {\n  display: inline-block;\n}\n\n.qds-track,\n.qds-knob {\n  print-color-adjust: exact;\n}\n\n.qds-unchecked-text {\n  text-align: end;\n}\n\n.qds-icon {\n  color: var(--qds-theme-control-text-standard);\n  flex-shrink: 0;\n}\n\n.qds-track {\n  align-items: center;\n  border-radius: var(--qds-control-rounded-border-radius);\n  display: flex;\n  flex-shrink: 0;\n  print-color-adjust: exact;\n  background-color: var(--qds-theme-control-slider-track-inactive);\n}\n\n.qds-knob {\n  background-color: var(--qds-theme-accessory-background);\n  border-radius: var(--qds-control-rounded-border-radius);\n  border: var(--qds-control-border-width) solid var(--qds-theme-control-border);\n  box-shadow: var(--qds-theme-accessory-elevation);\n  box-sizing: content-box;\n}\n\n.qds-label {\n  box-sizing: border-box;\n  cursor: pointer;\n  display: flex;\n}\n\n.qds-switch {\n  clip-path: inset(50%);\n  height: 1px;\n  margin: 0;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n\n  &:hover ~ .qds-track > .qds-knob {\n    background-color: var(--qds-theme-interactive-background-hover);\n  }\n\n  &:active ~ .qds-track > .qds-knob {\n    background-color: var(--qds-theme-interactive-background-pressed);\n  }\n\n  &:checked {\n    & ~ .qds-track {\n      justify-content: flex-end;\n      background-color: var(--qds-theme-signature-color-default);\n\n      & > .qds-knob {\n        border-color: transparent;\n        box-sizing: border-box;\n        margin-inline-end: var(--qds-control-border-width);\n      }\n    }\n\n    &:hover ~ .qds-track > .qds-knob {\n      background-color: var(--qds-theme-interactive-background-hover);\n    }\n\n    &:active ~ .qds-track > .qds-knob {\n      background-color: var(--qds-theme-interactive-background-pressed);\n    }\n  }\n\n  &:focus-visible ~ .qds-track {\n    outline: var(--qds-theme-focus-border) solid var(--qds-focus-border-width);\n    outline-offset: var(--qds-focus-border-offset);\n  }\n}\n\n[aria-disabled='true'] {\n  opacity: var(--qds-theme-disabled);\n  pointer-events: none;\n}\n\n[data-size='small'] {\n  &.qds-icon {\n    height: var(--qds-control-small-icon-size);\n    width: var(--qds-control-small-icon-size);\n  }\n\n  &.qds-inline {\n    margin-block: var(--qds-control-small-padding-auto-height);\n  }\n\n  &.qds-label {\n    gap: var(--qds-control-small-gap-siblings-related);\n  }\n\n  &.qds-track {\n    width: calc(var(--qds-control-slider-knob-small-size) * 2);\n    height: var(--qds-control-toggle-box-small-size);\n  }\n\n  &.qds-knob {\n    height: var(--qds-control-slider-knob-small-size);\n    width: var(--qds-control-slider-knob-small-size);\n  }\n}\n\n[data-size='standard'] {\n  &.qds-icon {\n    height: var(--qds-control-standard-icon-size);\n    width: var(--qds-control-standard-icon-size);\n  }\n\n  &.qds-inline {\n    margin-block: var(--qds-control-standard-padding-auto-height);\n  }\n\n  &.qds-label {\n    gap: var(--qds-control-standard-gap-siblings-related);\n  }\n\n  &.qds-track {\n    width: calc(var(--qds-control-slider-knob-standard-size) * 2);\n    height: var(--qds-control-toggle-box-standard-size);\n  }\n\n  &.qds-knob {\n    height: var(--qds-control-slider-knob-standard-size);\n    width: var(--qds-control-slider-knob-standard-size);\n  }\n}\n\n[data-size='large'] {\n  &.qds-icon {\n    height: var(--qds-control-large-icon-size);\n    width: var(--qds-control-large-icon-size);\n  }\n\n  &.qds-inline {\n    margin-block: var(--qds-control-large-padding-auto-height);\n  }\n\n  &.qds-label {\n    gap: var(--qds-control-large-gap-siblings-related);\n  }\n\n  &.qds-track {\n    width: calc(var(--qds-control-slider-knob-large-size) * 2);\n    height: var(--qds-control-toggle-box-large-size);\n  }\n\n  &.qds-knob {\n    height: var(--qds-control-slider-knob-large-size);\n    width: var(--qds-control-slider-knob-large-size);\n  }\n}\n","// SPDX-FileCopyrightText: © 2023 Schneider Electric\n//\n// SPDX-License-Identifier: LGPL-2.1-only\n\nimport type { ComponentInterface, EventEmitter } from '@stencil/core'\nimport { Component, Element, Event, h, Listen, Prop } from '@stencil/core'\n\nimport type { Attributes, QdsFocusEventDetail } from '../../helpers'\nimport {\n  inheritAriaAttributes,\n  inheritAttributes,\n  pickFocusEventAttributes,\n} from '../../helpers'\nimport type { Value } from '../controls'\n\nexport type SwitchSize = 'large' | 'small' | 'standard'\n\nlet autoIncrementingId = 1\n\n/**\n * @see https://quartz.se.com/build/components/switch\n */\n@Component({\n  tag: 'qds-switch',\n  scoped: true,\n  styleUrl: 'switch.css',\n})\nexport class Switch implements ComponentInterface {\n  /**\n   * Adds vertical margin to the switch for alignment.\n   *\n   * This is useful when creating inline layouts so that the first lines have\n   * the correct vertical centering.\n   */\n  @Prop() public readonly inline: boolean = false\n\n  /**\n   * The name of the checked icon to render.\n   *\n   * Available names depend on the icon library being used.\n   */\n  @Prop({ reflect: true }) public readonly iconCheckedName?: string\n\n  /**\n   * The name of a registered checked icon library.\n   */\n  @Prop({ reflect: true }) public readonly iconCheckedLibrary: string =\n    'default'\n\n  /**\n   * The name of the unchecked icon to render.\n   *\n   * Available names depend on the icon library being used.\n   */\n  @Prop({ reflect: true }) public readonly iconUncheckedName?: string\n\n  /**\n   * The name of a registered unchecked icon library.\n   */\n  @Prop({ reflect: true }) public readonly iconUncheckedLibrary: string =\n    'default'\n\n  /**\n   * The switches's size.\n   */\n  @Prop({ reflect: true }) public readonly size: SwitchSize = 'standard'\n\n  /**\n   * The switch's checked text.\n   */\n  @Prop({ mutable: true, reflect: true }) public readonly textChecked?: string\n\n  /**\n   * The switch's unchecked text.\n   */\n  @Prop({ mutable: true, reflect: true }) public readonly textUnchecked?: string\n\n  /**\n   * Specify whether the switch should have focus when the page loads.\n   *\n   * @webnative\n   */\n  @Prop({ attribute: 'autofocus' }) public readonly autoFocus?: boolean\n\n  /**\n   *Sets the switch's state.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true, reflect: true }) public checked?: boolean\n\n  /**\n   * Prevents the switch from being interacted with: it cannot be pressed or\n   *focused.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true, reflect: true }) public disabled?: boolean\n\n  /**\n   * The [`<form>`](https://developer.mozilla.org/docs/Web/HTML/Element/form)\n   * element to associate the switch with (its form owner).\n   *\n   * The value of this property must be the id of a `<form>` in the same\n   * document. If this property is not set, the `<qds-switch>` is associated\n   * with its ancestor `<form>` element, if any.\n   *\n   * This property lets you associate `<qds-switch>` elements to `<form>`s\n   * anywhere in the document, not just inside a `<form>`. It can also override\n   *an ancestor `<form>` element.\n   *\n   * @webnative\n   */\n  @Prop() public readonly form?: string\n\n  /**\n   * The name of the switch, which is submitted with the form data. An\n   *incrementing ID is used by default.\n   *\n   * @webnative\n   */\n  @Prop() public readonly name = `qds-switch-${autoIncrementingId}`\n\n  /**\n   * The value of the switch, submitted as a name/value pair with form data.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true }) public value?: Value\n\n  /**\n   * Emitted when the switch loses focus.\n   */\n  @Event({ eventName: 'qdsBlur', bubbles: false, cancelable: false })\n  private readonly blurEmitter!: EventEmitter<QdsFocusEventDetail>\n\n  /**\n   * Emitted when a change to the switch's state is committed by the user.\n   */\n  @Event({ eventName: 'qdsChange', cancelable: false })\n  private readonly changeEmitter!: EventEmitter<void>\n\n  /**\n   * Emitted when the switch gains focus.\n   */\n  @Event({ eventName: 'qdsFocus', bubbles: false, cancelable: false })\n  private readonly focusEmitter!: EventEmitter<QdsFocusEventDetail>\n\n  @Element() private readonly element!: HTMLQdsSwitchElement\n\n  private inheritedAttributes: Attributes = {}\n\n  private get computedDisabled(): boolean {\n    return this.disabled ?? false\n  }\n\n  @Listen('click')\n  protected onClick(event: MouseEvent): void {\n    if (this.computedDisabled) return\n\n    event.preventDefault()\n\n    this.checked = !(this.checked ?? false)\n    this.changeEmitter.emit()\n  }\n\n  public componentWillLoad(): void {\n    autoIncrementingId += 1\n    this.inheritedAttributes = {\n      ...inheritAriaAttributes(this.element),\n      ...inheritAttributes(this.element, ['tabindex']),\n    }\n  }\n\n  public render() {\n    return (\n      // eslint-disable-next-line jsx-a11y/label-has-associated-control\n      <label\n        aria-disabled={this.computedDisabled.toString()}\n        class={{\n          'qds-inline': this.inline,\n          'qds-label': true,\n        }}\n        data-size={this.size}\n      >\n        {this.textUnchecked !== undefined && this.textUnchecked !== '' && (\n          <qds-label\n            class=\"qds-unchecked-text\"\n            size={this.size}\n            text={this.textUnchecked}\n          />\n        )}\n        {this.iconUncheckedName !== undefined &&\n          this.iconUncheckedName !== '' && (\n            <qds-icon\n              class=\"qds-icon\"\n              data-size={this.size}\n              library={this.iconUncheckedLibrary}\n              name={this.iconUncheckedName}\n            />\n          )}\n        <input\n          // eslint-disable-next-line jsx-a11y/no-autofocus\n          autoFocus={this.autoFocus}\n          checked={this.checked}\n          class=\"qds-switch\"\n          disabled={this.disabled}\n          form={this.form}\n          name={this.name}\n          onBlur={this.onBlur}\n          onFocus={this.onFocus}\n          type=\"checkbox\"\n          value={this.value ?? undefined}\n          // eslint-disable-next-line react/jsx-props-no-spreading\n          {...this.inheritedAttributes}\n        />\n        <div class=\"qds-track\" data-size={this.size}>\n          <div class=\"qds-knob\" data-size={this.size} />\n        </div>\n        {this.iconCheckedName !== undefined && this.iconCheckedName !== '' && (\n          <qds-icon\n            class=\"qds-icon\"\n            data-size={this.size}\n            library={this.iconCheckedLibrary}\n            name={this.iconCheckedName}\n          />\n        )}\n        {this.textChecked !== undefined && this.textChecked !== '' && (\n          <qds-label size={this.size} text={this.textChecked} />\n        )}\n      </label>\n    )\n  }\n\n  private readonly onBlur = (event: FocusEvent): void => {\n    this.blurEmitter.emit(pickFocusEventAttributes(event))\n  }\n\n  private readonly onFocus = (event: FocusEvent): void => {\n    this.focusEmitter.emit(pickFocusEventAttributes(event))\n  }\n}\n"],"version":3}

package/dist/esm/qds-table-body.entry.js

@@ -3,7 +3,7 @@
  * 
  * SPDX-License-Identifier: LGPL-2.1-only
  */
-import { r as registerInstance, h, a as getElement } from './index-7b820913.js';
+import { r as registerInstance, h, a as getElement } from './index-5d80e9c2.js';
 import { i as inheritAriaAttributes } from './helpers-76b84f45.js';
 
 const tableBodyCss = ":host([hidden]){display:none !important}:host{display:contents}.qds-table-body{box-sizing:border-box}";

package/dist/esm/qds-table-cell.entry.js

@@ -3,7 +3,7 @@
  * 
  * SPDX-License-Identifier: LGPL-2.1-only
  */
-import { r as registerInstance, h, a as getElement } from './index-7b820913.js';
+import { r as registerInstance, h, a as getElement } from './index-5d80e9c2.js';
 import { i as inheritAriaAttributes } from './helpers-76b84f45.js';
 
 const tableCellCss = ":host([hidden]){display:none !important}:host{display:contents}.qds-table-cell{box-sizing:border-box;color:var(--qds-theme-list-item-label-main);font:var(--qds-list-item-label-main);padding-block:0;padding-inline:var(--qds-list-item-padding-horizontal);text-align:inherit;vertical-align:middle;width:inherit}";

package/dist/esm/qds-table-head-cell.entry.js

@@ -3,7 +3,7 @@
  * 
  * SPDX-License-Identifier: LGPL-2.1-only
  */
-import { r as registerInstance, h, a as getElement } from './index-7b820913.js';
+import { r as registerInstance, h, a as getElement } from './index-5d80e9c2.js';
 import { i as inheritAriaAttributes } from './helpers-76b84f45.js';
 
 const tableHeadCellCss = ":host([hidden]){display:none !important}:host{display:contents}.qds-table-head-cell{box-sizing:border-box;color:var(--qds-theme-list-item-label-main);font:var(--qds-list-item-label-main);padding-block:var(--qds-list-item-padding-vertical);padding-inline:var(--qds-list-item-padding-horizontal);text-align:inherit;vertical-align:middle;width:inherit}";

package/dist/esm/qds-table-head.entry.js

@@ -3,7 +3,7 @@
  * 
  * SPDX-License-Identifier: LGPL-2.1-only
  */
-import { r as registerInstance, h, a as getElement } from './index-7b820913.js';
+import { r as registerInstance, h, a as getElement } from './index-5d80e9c2.js';
 import { i as inheritAriaAttributes } from './helpers-76b84f45.js';
 
 const tableHeadCss = ":host([hidden]){display:none !important}:host{display:contents}.qds-table-head{box-sizing:border-box}";

package/dist/esm/qds-table-row.entry.js

@@ -3,7 +3,7 @@
  * 
  * SPDX-License-Identifier: LGPL-2.1-only
  */
-import { r as registerInstance, h, a as getElement } from './index-7b820913.js';
+import { r as registerInstance, h, a as getElement } from './index-5d80e9c2.js';
 import { i as inheritAriaAttributes } from './helpers-76b84f45.js';
 
 const tableRowCss = ":host([hidden]){display:none !important}:host{display:contents}.qds-table-row{border-block-end:var(--qds-list-border-width) solid\n    var(--qds-theme-list-border);box-sizing:border-box}";

package/dist/esm/qds-table.entry.js

@@ -3,7 +3,7 @@
  * 
  * SPDX-License-Identifier: LGPL-2.1-only
  */
-import { r as registerInstance, h, a as getElement } from './index-7b820913.js';
+import { r as registerInstance, h, a as getElement } from './index-5d80e9c2.js';
 import { i as inheritAriaAttributes } from './helpers-76b84f45.js';
 
 const tableCss = ":host([hidden]){display:none !important}:host{display:contents}.qds-table{border-collapse:collapse;border-spacing:0;box-sizing:border-box}";

package/dist/esm/qds-textarea.entry.js

@@ -3,7 +3,7 @@
  * 
  * SPDX-License-Identifier: LGPL-2.1-only
  */
-import { r as registerInstance, c as createEvent, h, a as getElement } from './index-7b820913.js';
+import { r as registerInstance, c as createEvent, h, a as getElement } from './index-5d80e9c2.js';
 import { p as pickFocusEventAttributes, a as invariant, e as pickInputEventAttributes, i as inheritAriaAttributes, b as inheritAttributes } from './helpers-76b84f45.js';
 
 const textareaCss = "[hidden].sc-qds-textarea-h{display:none !important}.sc-qds-textarea-h{display:inline-block;resize:both}.qds-textarea.sc-qds-textarea{background-color:var(--qds-theme-control-input-background);border-radius:var(--qds-control-border-radius);border:var(--qds-control-border-width) solid var(--qds-theme-control-border);box-sizing:border-box;color:var(--qds-theme-control-text-standard);height:100%;padding-inline:var(--qds-control-input-padding-horizontal);resize:inherit;width:100%}.qds-textarea[aria-invalid='true'].sc-qds-textarea:not(:focus){border-color:var(--qds-theme-feedback-result-failure)}.qds-textarea.sc-qds-textarea:disabled{opacity:var(--qds-theme-disabled);pointer-events:none}.qds-textarea.sc-qds-textarea:focus-visible{outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width);outline-offset:var(--qds-focus-border-offset)}.qds-textarea.sc-qds-textarea:placeholder-shown{color:var(--qds-theme-control-text-placeholder)}[data-size='small'].sc-qds-textarea{font:var(--qds-control-small-text);padding-block:var(--qds-control-small-padding-auto-height)}[data-size='standard'].sc-qds-textarea{font:var(--qds-control-standard-text);padding-block:var(--qds-control-standard-padding-auto-height)}[data-size='large'].sc-qds-textarea{font:var(--qds-control-large-text);padding-block:var(--qds-control-large-padding-auto-height)}";
@@ -45,7 +45,7 @@ const TextArea = class {
     this.onInvalid = () => {
       this.invalid = true;
     };
-    this.invalid = undefined;
+    this.invalid = false;
     this.size = 'standard';
     this.autoCapitalize = undefined;
     this.autoComplete = undefined;
@@ -149,7 +149,7 @@ const TextArea = class {
     };
   }
   render() {
-    return (h("textarea", { "aria-invalid": this.invalid ?? false ? 'true' : 'false', autoCapitalize: this.autoCapitalize, autoComplete: this.autoComplete,
+    return (h("textarea", { "aria-invalid": this.invalid.toString(), autoCapitalize: this.autoCapitalize, autoComplete: this.autoComplete,
       // eslint-disable-next-line jsx-a11y/no-autofocus
       autoFocus: this.autoFocus, class: "qds-textarea", cols: this.cols, "data-size": this.size, disabled: this.disabled, enterKeyHint: this.enterkeyhint, form: this.form, inputMode: this.inputmode, maxLength: this.maxLength, minLength: this.minLength, name: this.name, onBlur: this.onBlur, onChange: this.onChange, onClick: this.onClick, onFocus: this.onFocus, onInput: this.onInput, onInvalid: this.onInvalid, placeholder: this.placeholder, readOnly: this.readOnly, ref: this.ref, required: this.required, rows: this.rows, spellcheck: this.spellCheck, wrap: this.wrap, ...this.inheritedAttributes }, h("slot", null)));
   }

package/dist/esm/qds-textarea.entry.js.map

@@ -1 +1 @@
-{"file":"qds-textarea.entry.js","mappings":"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","names":[],"sources":["src/components/textarea/textarea.css?tag=qds-textarea&encapsulation=scoped","src/components/textarea/textarea.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2023 Schneider Electric\n *\n * SPDX-License-Identifier: LGPL-2.1-only\n */\n\n@import url('../shared.css');\n\n:host {\n  display: inline-block;\n  resize: both;\n}\n\n.qds-textarea {\n  background-color: var(--qds-theme-control-input-background);\n  border-radius: var(--qds-control-border-radius);\n  border: var(--qds-control-border-width) solid var(--qds-theme-control-border);\n  box-sizing: border-box;\n  color: var(--qds-theme-control-text-standard);\n  height: 100%;\n  padding-inline: var(--qds-control-input-padding-horizontal);\n  resize: inherit;\n  width: 100%;\n\n  &:not(:focus)[aria-invalid='true'] {\n    border-color: var(--qds-theme-feedback-result-failure);\n  }\n\n  &:disabled {\n    opacity: var(--qds-theme-disabled);\n    pointer-events: none;\n  }\n\n  &:focus-visible {\n    outline: var(--qds-theme-focus-border) solid var(--qds-focus-border-width);\n    outline-offset: var(--qds-focus-border-offset);\n  }\n\n  &:placeholder-shown {\n    color: var(--qds-theme-control-text-placeholder);\n  }\n}\n\n[data-size='small'] {\n  font: var(--qds-control-small-text);\n  padding-block: var(--qds-control-small-padding-auto-height);\n}\n\n[data-size='standard'] {\n  font: var(--qds-control-standard-text);\n  padding-block: var(--qds-control-standard-padding-auto-height);\n}\n\n[data-size='large'] {\n  font: var(--qds-control-large-text);\n  padding-block: var(--qds-control-large-padding-auto-height);\n}\n","// SPDX-FileCopyrightText: © 2023 Schneider Electric\n//\n// SPDX-License-Identifier: LGPL-2.1-only\n\nimport type { ComponentInterface, EventEmitter } from '@stencil/core'\nimport {\n  Component,\n  Element,\n  Event,\n  h,\n  Method,\n  Prop,\n  Watch,\n} from '@stencil/core'\n\nimport type {\n  Attributes,\n  QdsFocusEventDetail,\n  QdsInputEventDetail,\n} from '../../helpers'\nimport {\n  inheritAriaAttributes,\n  inheritAttributes,\n  invariant,\n  pickFocusEventAttributes,\n  pickInputEventAttributes,\n} from '../../helpers'\nimport type {\n  AutoCapitalize,\n  EnterKeyHint,\n  InputMode,\n  SelectDirection,\n  Value,\n} from '../controls'\n\nexport type TextAreaAutoComplete = 'off' | 'on'\nexport type TextAreaSize = 'large' | 'small' | 'standard'\nexport type Wrap = 'hard' | 'off' | 'soft'\n\nlet autoIncrementingId = 1\n\n/**\n * The `<qds-textarea>` element represents a multi-line plain-text editing\n * control, useful when you want to allow users to enter a sizeable amount of\n * free-form text, for example a comment on a review or feedback form.\n *\n * @see https://quartz.se.com/build/components/textarea\n */\n@Component({\n  tag: 'qds-textarea',\n  scoped: true,\n  styleUrl: 'textarea.css',\n})\nexport class TextArea implements ComponentInterface {\n  /**\n   * Defines if the textarea is in an invalid state. Validity is determined by\n   * attributes such as `required`, `minlength`, and `maxlength` using\n   * [constraint validation][].\n   *\n   * [constraint validation]: https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation\n   */\n  @Prop({ mutable: true, reflect: true }) public invalid?: boolean\n\n  /**\n   * The textarea's size.\n   *\n   * > **_NOTE:_** The native [`size` HTML attribute][] is not supported. CSS\n   * `width` should be used instead if this functionality is needed.\n   *\n   * [`size` HTML attribute]: https://developer.mozilla.org/docs/Web/HTML/Attributes/size\n   */\n  @Prop({ reflect: true }) public readonly size: TextAreaSize = 'standard'\n\n  /**\n   * Controls whether and how input is automatically capitalized as it is\n   * entered/edited by the user. Possible values:\n   *\n   * - `\"off\"` or `\"none\"`: No auto-capitalization is applied (all letters\n   * default to lowercase).\n   * - `\"on\"` or `\"sentences\"`: The first letter of each sentence defaults to a\n   * capital letter; all other letters default to lowercase.\n   * - `\"words\"`: The first letter of each word defaults to a capital letter;\n   * all other letters default to lowercase.\n   * - `\"characters\"`: All letters default to uppercase.\n   *\n   * @webnative\n   */\n  @Prop({ attribute: 'autocapitalize' })\n  public readonly autoCapitalize?: AutoCapitalize\n\n  /**\n   * Indicates whether the value of the textarea can be automatically completed\n   * by the browser. Possible values:\n   *\n   * `off`: The user must explicitly enter a value into this field for every\n   * use, or the document provides its own auto-completion method; the browser\n   * does not automatically complete the entry.\n   * `on`: The browser can automatically complete the value based on values\n   * that the user has entered during previous uses.\n   *\n   * If the `autocomplete` attribute is not specified on a `<qds-textarea>`\n   * element, then the browser uses the `autocomplete` attribute value of the\n   * `<qds-textarea>` element's form owner. The form owner is either the\n   * [`<form>`][] element that this `<qds-textarea>` element is a descendant of\n   * or the form element whose `id` is specified by the `form` attribute of the\n   * `qds-textarea` element. For more information, see the [`autocomplete`]\n   * attribute in [`<form>`][].\n   *\n   * [`<form>`]: https://developer.mozilla.org/docs/Web/HTML/Element/form\n   * [`autocomplete`]: https://developer.mozilla.org/docs/Web/HTML/Element/form#autocomplete\n   *\n   * @webnative\n   */\n  @Prop({ attribute: 'autocomplete' })\n  public readonly autoComplete?: TextAreaAutoComplete\n\n  /**\n   * Specify whether the input should have focus when the page loads.\n   *\n   * @webnative\n   */\n  @Prop({ attribute: 'autofocus' }) public readonly autoFocus?: boolean\n\n  /**\n   * The visible width of the text control, in average character widths. If it\n   * is specified, it must be a positive integer. If it is not specified, the\n   * default value is `20`.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true }) public readonly cols?: number\n\n  /**\n   * Prevents the input from being interacted with: it cannot be pressed or\n   * focused.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true, reflect: true }) public disabled?: boolean\n\n  /**\n   * What action label (or icon) to present for the enter key on virtual\n   * keyboards. Possible values:\n   *\n   * - `\"done\"`: Typically meaning there is nothing more to input and the input\n   * method editor (IME) will be closed.\n   * - `\"enter\"`:\tTypically inserting a new line.\n   * - `\"go\"`: \tTypically meaning to take the user to the target of the text\n   * they typed.\n   * - `\"next\"`: \tTypically taking the user to the next field that will accept\n   * text.\n   * - `\"previous\"`: Typically taking the user to the previous field that will\n   * accept text.\n   * - `\"search\"`: Typically taking the user to the results of searching for\n   * the text they have typed.\n   * - `\"send\"`: Typically delivering the text to its target.\n   *\n   * @webnative\n   */\n  // FIXME: Can't use `attribute` option here to name this `enterKeyHint` instead.\n  @Prop() public readonly enterkeyhint?: EnterKeyHint\n\n  /**\n   * The [`<form>`][] element to associate the input with (its form owner).\n   *\n   * The value of this attribute must be the id of a `<form>` in the same\n   * document. If this attribute is not set, the `<qds-textarea>` is associated\n   * with its ancestor `<form>` element, if any.\n   *\n   * This attribute lets you associate `<qds-textarea>` elements to `<form>`s\n   * anywhere in the document, not just inside a `<form>`. It can also override\n   * an ancestor `<form>` element.\n   *\n   * [`<form>`]: https://developer.mozilla.org/docs/Web/HTML/Element/form\n   *\n   * @webnative\n   */\n  @Prop() public readonly form?: string\n\n  /**\n   * Provide a hint to browsers as to the type of virtual keyboard\n   * configuration to use when editing this element or its contents.\n   *\n   * @webnative\n   */\n  // FIXME: Can't use `attribute` option here to name this `inputMode` instead.\n  @Prop() public readonly inputmode?: InputMode\n\n  /**\n   * The maximum number of characters (as UTF-16 code units) the user can enter\n   * into the textarea. This must be an non-negative integer value. If no\n   * `maxlength` is specified, or an invalid value is specified, the textarea\n   * has no maximum length.\n   *\n   * The textarea will fail [constraint validation][] if the length of the text\n   * entered into the field is greater than `maxlength` UTF-16 code units long.\n   * By default, browsers prevent users from entering more characters than\n   * allowed by the `maxlength` attribute. See [Client-side validation][] for\n   * more information.\n   *\n   * [constraint validation]: https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation\n   * [Client-side validation]: https://developer.mozilla.org/docs/Web/HTML/Element/input#client-side_validation\n   *\n   * @webnative\n   */\n  @Prop({ attribute: 'maxlength' }) public readonly maxLength?: number\n\n  /**\n   * The minimum number of characters (as UTF-16 code units) the user can enter\n   * into the textarea. This must be an non-negative integer value smaller than\n   * or equal to the value specified by `maxlength`. If no `minlength` is\n   * specified, or an invalid value is specified, the textarea has no minimum\n   * length.\n   *\n   * The textarea will fail [constraint validation][] if the length of the text\n   * entered into the field is fewer than `minlength` UTF-16 code units long,\n   * preventing form submission. See [Client-side validation][] for more\n   * information.\n   *\n   * [constraint validation]: https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation\n   * [Client-side validation]: https://developer.mozilla.org/docs/Web/HTML/Element/input#client-side_validation\n   *\n   * @webnative\n   */\n  @Prop({ attribute: 'minlength' }) public readonly minLength?: number\n\n  /**\n   * The name of the control, which is submitted with the form data. An\n   * incrementing textarea ID is used by default.\n   *\n   * @webnative\n   */\n  @Prop() public readonly name = `qds-textarea-${autoIncrementingId}`\n\n  /**\n   * Text that appears in the textarea when it has no value set.\n   *\n   * @webnative\n   */\n  @Prop() public readonly placeholder?: string\n\n  /**\n   * The value of the textarea cannot be edited.\n   *\n   * @webnative\n   */\n  @Prop({ attribute: 'readonly' }) public readonly readOnly?: boolean\n\n  /**\n   * A value must be specified for the textarea before the owning form can be\n   * submitted.\n   *\n   * See [Client-side validation][] and the [HTML attribute: `required`][] for\n   * more information.\n   *\n   * [Client-side validation]: https://developer.mozilla.org/docs/Web/HTML/Element/input#client-side_validation\n   * [HTML attribute: `required`]: https://developer.mozilla.org/docs/Web/HTML/Attributes/required\n   *\n   * @webnative\n   */\n  @Prop() public readonly required?: boolean\n\n  /**\n   * The number of visible text lines for the control. If it is specified, it\n   * must be a positive integer. If it is not specified, the default value is\n   * `2`.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true }) public readonly rows?: number\n\n  /**\n   * Defines whether the textarea may be checked for spelling errors.\n   *\n   * @webnative\n   */\n  @Prop({ attribute: 'spellcheck' }) public readonly spellCheck?: boolean\n\n  /**\n   * The value of the textarea.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true }) public value?: Value\n\n  /**\n   * Indicates how the control should wrap the value for form submission.\n   * Possible values are:\n   *\n   * - `hard`: The browser automatically inserts line breaks (`CR+LF`) so that\n   * each line is no longer than the width of the control; the `cols` attribute\n   * must be specified for this to take effect\n   * - `soft`: The browser ensures that all line breaks in the entered value\n   * are a `CR+LF` pair, but no additional line breaks are added to the value.\n   * - `off`: Like `soft` but changes appearance to `white-space: pre` so line\n   * segments exceeding `cols` are not wrapped and the `<qds-textarea>` becomes\n   * horizontally scrollable.\n   *\n   * If this attribute is not specified, `soft` is its default value.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true }) public wrap?: Wrap\n\n  /**\n   * Emitted when the textarea loses focus.\n   */\n  @Event({ eventName: 'qdsBlur', bubbles: false, cancelable: false })\n  private readonly blurEmitter!: EventEmitter<QdsFocusEventDetail>\n\n  /**\n   * Emitted when an alteration to the textarea's value is committed by the\n   * user.\n   */\n  @Event({ eventName: 'qdsChange', cancelable: false })\n  private readonly changeEmitter!: EventEmitter<void>\n\n  /**\n   * Emitted when the textarea gains focus.\n   */\n  @Event({ eventName: 'qdsFocus', bubbles: false, cancelable: false })\n  private readonly focusEmitter!: EventEmitter<QdsFocusEventDetail>\n\n  /**\n   * Emitted when the textarea's value changes.\n   */\n  @Event({ eventName: 'qdsInput', cancelable: false })\n  private readonly inputEmitter!: EventEmitter<QdsInputEventDetail>\n\n  @Element() private readonly element!: HTMLQdsTextareaElement\n\n  private inheritedAttributes: Attributes = {}\n\n  private textarea?: HTMLTextAreaElement\n\n  private get computedDisabled(): boolean {\n    return this.disabled ?? false\n  }\n\n  /**\n   * Returns true if the element's value passes validity checks; otherwise,\n   * returns false, fires an invalid event at the element, and (if the event\n   * isn't canceled) reports the problem to the user.\n   */\n  @Method()\n  public async reportValidity(): Promise<boolean> {\n    invariant(this.textarea)\n\n    return this.textarea.reportValidity()\n  }\n\n  /**\n   * Selects the entire content of the `<qds-textarea>` element if the\n   * element's content is selectable.\n   */\n  @Method()\n  public async select(): Promise<void> {\n    invariant(this.textarea)\n\n    this.textarea.select()\n  }\n\n  /**\n   * Sets a custom validity message for the textarea. If this message is not\n   * the empty string, then the element is considered invalid.\n   */\n  @Method()\n  public async setCustomValidity(message: string): Promise<void> {\n    invariant(this.textarea)\n\n    this.textarea.setCustomValidity(message)\n    this.invalid = !this.textarea.checkValidity()\n  }\n\n  /**\n   * Sets the contents of the specified range of characters in the textarea\n   * element to a given string.\n   *\n   * @param replacement The string to insert.\n   * @param start The 0-based index of the first character to replace. Defaults to the current selectionStart value (the start of the user's current selection).\n   * @param end The 0-based index of the character _after_ the last character to replace. Defaults to the current selectionEnd value (the end of the user's current selection).\n   * @param selectionMode A string defining how the selection should be set after the text has been replaced. Possible values:\n   *\n   * - `\"select\"` selects the newly inserted text.\n   * - `\"start\"` moves the selection to just before the inserted text.\n   * - `\"end\"` moves the selection to just after the inserted text.\n   * - `\"preserve\"` attempts to preserve the selection.\n   */\n  @Method()\n  public async setRangeText(\n    replacement: string,\n    start: number,\n    end: number,\n    selectionMode: SelectionMode = 'preserve',\n  ): Promise<void> {\n    invariant(this.textarea)\n\n    this.textarea.setRangeText(replacement, start, end, selectionMode)\n\n    if (this.value !== this.textarea.value) {\n      this.value = this.textarea.value\n      this.inputEmitter.emit()\n      this.changeEmitter.emit()\n    }\n  }\n\n  /**\n   * Selects the specified range of characters within the textarea.\n   *\n   * @param start The offset into the input for the start of the selection.\n   * @param end The offset into the input for the end of the selection.\n   * @param direction The direction in which the selection is performed.\n   */\n  @Method()\n  public async setSelectionRange(\n    start: number | null,\n    end: number | null,\n    direction?: SelectDirection,\n  ): Promise<void> {\n    invariant(this.textarea)\n\n    this.textarea.setSelectionRange(start, end, direction)\n  }\n\n  @Watch('disabled')\n  protected disabledChanged(): void {\n    invariant(this.textarea)\n\n    // Disabled inputs are always valid, so we need to recheck validity when\n    // the state changes.\n    this.textarea.disabled = this.computedDisabled\n    this.invalid = !this.textarea.checkValidity()\n  }\n\n  @Watch('value')\n  protected valueChanged(): void {\n    invariant(this.textarea)\n\n    this.textarea.value = this.value === null ? '' : String(this.value)\n    this.invalid = !this.textarea.checkValidity()\n  }\n\n  public componentWillLoad(): void {\n    autoIncrementingId += 1\n    this.inheritedAttributes = {\n      ...inheritAriaAttributes(this.element),\n      ...inheritAttributes(this.element, ['tabindex']),\n    }\n  }\n\n  public render() {\n    return (\n      <textarea\n        aria-invalid={this.invalid ?? false ? 'true' : 'false'}\n        autoCapitalize={this.autoCapitalize}\n        autoComplete={this.autoComplete}\n        // eslint-disable-next-line jsx-a11y/no-autofocus\n        autoFocus={this.autoFocus}\n        class=\"qds-textarea\"\n        cols={this.cols}\n        data-size={this.size}\n        disabled={this.disabled}\n        enterKeyHint={this.enterkeyhint}\n        form={this.form}\n        inputMode={this.inputmode}\n        maxLength={this.maxLength}\n        minLength={this.minLength}\n        name={this.name}\n        onBlur={this.onBlur}\n        onChange={this.onChange}\n        onClick={this.onClick}\n        onFocus={this.onFocus}\n        onInput={this.onInput}\n        onInvalid={this.onInvalid}\n        placeholder={this.placeholder}\n        readOnly={this.readOnly}\n        ref={this.ref}\n        required={this.required}\n        rows={this.rows}\n        spellcheck={this.spellCheck}\n        wrap={this.wrap}\n        // eslint-disable-next-line react/jsx-props-no-spreading\n        {...this.inheritedAttributes}\n      >\n        <slot />\n      </textarea>\n    )\n  }\n\n  private readonly ref = (textarea?: HTMLTextAreaElement): void => {\n    this.textarea = textarea\n  }\n\n  private readonly onBlur = (event: FocusEvent): void => {\n    this.blurEmitter.emit(pickFocusEventAttributes(event))\n  }\n\n  private readonly onChange = (): void => {\n    invariant(this.textarea)\n\n    this.value = this.textarea.value\n    this.changeEmitter.emit()\n  }\n\n  private readonly onClick = (event: MouseEvent): void => {\n    if (this.computedDisabled) {\n      event.preventDefault()\n      event.stopPropagation()\n    }\n  }\n\n  private readonly onFocus = (event: FocusEvent): void => {\n    this.focusEmitter.emit(pickFocusEventAttributes(event))\n  }\n\n  private readonly onInput = (event: InputEvent): void => {\n    invariant(this.textarea)\n\n    this.value = this.textarea.value\n    this.inputEmitter.emit(pickInputEventAttributes(event))\n  }\n\n  private readonly onInvalid = (): void => {\n    this.invalid = true\n  }\n}\n"],"version":3}
+{"file":"qds-textarea.entry.js","mappings":"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","names":[],"sources":["src/components/textarea/textarea.css?tag=qds-textarea&encapsulation=scoped","src/components/textarea/textarea.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2023 Schneider Electric\n *\n * SPDX-License-Identifier: LGPL-2.1-only\n */\n\n@import url('../shared.css');\n\n:host {\n  display: inline-block;\n  resize: both;\n}\n\n.qds-textarea {\n  background-color: var(--qds-theme-control-input-background);\n  border-radius: var(--qds-control-border-radius);\n  border: var(--qds-control-border-width) solid var(--qds-theme-control-border);\n  box-sizing: border-box;\n  color: var(--qds-theme-control-text-standard);\n  height: 100%;\n  padding-inline: var(--qds-control-input-padding-horizontal);\n  resize: inherit;\n  width: 100%;\n\n  &:not(:focus)[aria-invalid='true'] {\n    border-color: var(--qds-theme-feedback-result-failure);\n  }\n\n  &:disabled {\n    opacity: var(--qds-theme-disabled);\n    pointer-events: none;\n  }\n\n  &:focus-visible {\n    outline: var(--qds-theme-focus-border) solid var(--qds-focus-border-width);\n    outline-offset: var(--qds-focus-border-offset);\n  }\n\n  &:placeholder-shown {\n    color: var(--qds-theme-control-text-placeholder);\n  }\n}\n\n[data-size='small'] {\n  font: var(--qds-control-small-text);\n  padding-block: var(--qds-control-small-padding-auto-height);\n}\n\n[data-size='standard'] {\n  font: var(--qds-control-standard-text);\n  padding-block: var(--qds-control-standard-padding-auto-height);\n}\n\n[data-size='large'] {\n  font: var(--qds-control-large-text);\n  padding-block: var(--qds-control-large-padding-auto-height);\n}\n","// SPDX-FileCopyrightText: © 2023 Schneider Electric\n//\n// SPDX-License-Identifier: LGPL-2.1-only\n\nimport type { ComponentInterface, EventEmitter } from '@stencil/core'\nimport {\n  Component,\n  Element,\n  Event,\n  h,\n  Method,\n  Prop,\n  Watch,\n} from '@stencil/core'\n\nimport type {\n  Attributes,\n  QdsFocusEventDetail,\n  QdsInputEventDetail,\n} from '../../helpers'\nimport {\n  inheritAriaAttributes,\n  inheritAttributes,\n  invariant,\n  pickFocusEventAttributes,\n  pickInputEventAttributes,\n} from '../../helpers'\nimport type {\n  AutoCapitalize,\n  EnterKeyHint,\n  InputMode,\n  SelectDirection,\n  Value,\n} from '../controls'\n\nexport type TextAreaAutoComplete = 'off' | 'on'\nexport type TextAreaSize = 'large' | 'small' | 'standard'\nexport type Wrap = 'hard' | 'off' | 'soft'\n\nlet autoIncrementingId = 1\n\n/**\n * The `<qds-textarea>` element represents a multi-line plain-text editing\n * control, useful when you want to allow users to enter a sizeable amount of\n * free-form text, for example a comment on a review or feedback form.\n *\n * @see https://quartz.se.com/build/components/textarea\n */\n@Component({\n  tag: 'qds-textarea',\n  scoped: true,\n  styleUrl: 'textarea.css',\n})\nexport class TextArea implements ComponentInterface {\n  /**\n   * Defines if the textarea is in an invalid state. Validity is determined by\n   * attributes such as `required`, `minlength`, and `maxlength` using\n   * [constraint validation][].\n   *\n   * [constraint validation]: https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation\n   */\n  @Prop({ mutable: true, reflect: true }) public invalid = false\n\n  /**\n   * The textarea's size.\n   *\n   * > **_NOTE:_** The native [`size` HTML attribute][] is not supported. CSS\n   * `width` should be used instead if this functionality is needed.\n   *\n   * [`size` HTML attribute]: https://developer.mozilla.org/docs/Web/HTML/Attributes/size\n   */\n  @Prop({ reflect: true }) public readonly size: TextAreaSize = 'standard'\n\n  /**\n   * Controls whether and how input is automatically capitalized as it is\n   * entered/edited by the user. Possible values:\n   *\n   * - `\"off\"` or `\"none\"`: No auto-capitalization is applied (all letters\n   * default to lowercase).\n   * - `\"on\"` or `\"sentences\"`: The first letter of each sentence defaults to a\n   * capital letter; all other letters default to lowercase.\n   * - `\"words\"`: The first letter of each word defaults to a capital letter;\n   * all other letters default to lowercase.\n   * - `\"characters\"`: All letters default to uppercase.\n   *\n   * @webnative\n   */\n  @Prop({ attribute: 'autocapitalize' })\n  public readonly autoCapitalize?: AutoCapitalize\n\n  /**\n   * Indicates whether the value of the textarea can be automatically completed\n   * by the browser. Possible values:\n   *\n   * `off`: The user must explicitly enter a value into this field for every\n   * use, or the document provides its own auto-completion method; the browser\n   * does not automatically complete the entry.\n   * `on`: The browser can automatically complete the value based on values\n   * that the user has entered during previous uses.\n   *\n   * If the `autocomplete` attribute is not specified on a `<qds-textarea>`\n   * element, then the browser uses the `autocomplete` attribute value of the\n   * `<qds-textarea>` element's form owner. The form owner is either the\n   * [`<form>`][] element that this `<qds-textarea>` element is a descendant of\n   * or the form element whose `id` is specified by the `form` attribute of the\n   * `qds-textarea` element. For more information, see the [`autocomplete`]\n   * attribute in [`<form>`][].\n   *\n   * [`<form>`]: https://developer.mozilla.org/docs/Web/HTML/Element/form\n   * [`autocomplete`]: https://developer.mozilla.org/docs/Web/HTML/Element/form#autocomplete\n   *\n   * @webnative\n   */\n  @Prop({ attribute: 'autocomplete' })\n  public readonly autoComplete?: TextAreaAutoComplete\n\n  /**\n   * Specify whether the input should have focus when the page loads.\n   *\n   * @webnative\n   */\n  @Prop({ attribute: 'autofocus' }) public readonly autoFocus?: boolean\n\n  /**\n   * The visible width of the text control, in average character widths. If it\n   * is specified, it must be a positive integer. If it is not specified, the\n   * default value is `20`.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true }) public readonly cols?: number\n\n  /**\n   * Prevents the input from being interacted with: it cannot be pressed or\n   * focused.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true, reflect: true }) public disabled?: boolean\n\n  /**\n   * What action label (or icon) to present for the enter key on virtual\n   * keyboards. Possible values:\n   *\n   * - `\"done\"`: Typically meaning there is nothing more to input and the input\n   * method editor (IME) will be closed.\n   * - `\"enter\"`:\tTypically inserting a new line.\n   * - `\"go\"`: \tTypically meaning to take the user to the target of the text\n   * they typed.\n   * - `\"next\"`: \tTypically taking the user to the next field that will accept\n   * text.\n   * - `\"previous\"`: Typically taking the user to the previous field that will\n   * accept text.\n   * - `\"search\"`: Typically taking the user to the results of searching for\n   * the text they have typed.\n   * - `\"send\"`: Typically delivering the text to its target.\n   *\n   * @webnative\n   */\n  // FIXME: Can't use `attribute` option here to name this `enterKeyHint` instead.\n  @Prop() public readonly enterkeyhint?: EnterKeyHint\n\n  /**\n   * The [`<form>`][] element to associate the input with (its form owner).\n   *\n   * The value of this attribute must be the id of a `<form>` in the same\n   * document. If this attribute is not set, the `<qds-textarea>` is associated\n   * with its ancestor `<form>` element, if any.\n   *\n   * This attribute lets you associate `<qds-textarea>` elements to `<form>`s\n   * anywhere in the document, not just inside a `<form>`. It can also override\n   * an ancestor `<form>` element.\n   *\n   * [`<form>`]: https://developer.mozilla.org/docs/Web/HTML/Element/form\n   *\n   * @webnative\n   */\n  @Prop() public readonly form?: string\n\n  /**\n   * Provide a hint to browsers as to the type of virtual keyboard\n   * configuration to use when editing this element or its contents.\n   *\n   * @webnative\n   */\n  // FIXME: Can't use `attribute` option here to name this `inputMode` instead.\n  @Prop() public readonly inputmode?: InputMode\n\n  /**\n   * The maximum number of characters (as UTF-16 code units) the user can enter\n   * into the textarea. This must be an non-negative integer value. If no\n   * `maxlength` is specified, or an invalid value is specified, the textarea\n   * has no maximum length.\n   *\n   * The textarea will fail [constraint validation][] if the length of the text\n   * entered into the field is greater than `maxlength` UTF-16 code units long.\n   * By default, browsers prevent users from entering more characters than\n   * allowed by the `maxlength` attribute. See [Client-side validation][] for\n   * more information.\n   *\n   * [constraint validation]: https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation\n   * [Client-side validation]: https://developer.mozilla.org/docs/Web/HTML/Element/input#client-side_validation\n   *\n   * @webnative\n   */\n  @Prop({ attribute: 'maxlength' }) public readonly maxLength?: number\n\n  /**\n   * The minimum number of characters (as UTF-16 code units) the user can enter\n   * into the textarea. This must be an non-negative integer value smaller than\n   * or equal to the value specified by `maxlength`. If no `minlength` is\n   * specified, or an invalid value is specified, the textarea has no minimum\n   * length.\n   *\n   * The textarea will fail [constraint validation][] if the length of the text\n   * entered into the field is fewer than `minlength` UTF-16 code units long,\n   * preventing form submission. See [Client-side validation][] for more\n   * information.\n   *\n   * [constraint validation]: https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation\n   * [Client-side validation]: https://developer.mozilla.org/docs/Web/HTML/Element/input#client-side_validation\n   *\n   * @webnative\n   */\n  @Prop({ attribute: 'minlength' }) public readonly minLength?: number\n\n  /**\n   * The name of the control, which is submitted with the form data. An\n   * incrementing textarea ID is used by default.\n   *\n   * @webnative\n   */\n  @Prop() public readonly name = `qds-textarea-${autoIncrementingId}`\n\n  /**\n   * Text that appears in the textarea when it has no value set.\n   *\n   * @webnative\n   */\n  @Prop() public readonly placeholder?: string\n\n  /**\n   * The value of the textarea cannot be edited.\n   *\n   * @webnative\n   */\n  @Prop({ attribute: 'readonly' }) public readonly readOnly?: boolean\n\n  /**\n   * A value must be specified for the textarea before the owning form can be\n   * submitted.\n   *\n   * See [Client-side validation][] and the [HTML attribute: `required`][] for\n   * more information.\n   *\n   * [Client-side validation]: https://developer.mozilla.org/docs/Web/HTML/Element/input#client-side_validation\n   * [HTML attribute: `required`]: https://developer.mozilla.org/docs/Web/HTML/Attributes/required\n   *\n   * @webnative\n   */\n  @Prop() public readonly required?: boolean\n\n  /**\n   * The number of visible text lines for the control. If it is specified, it\n   * must be a positive integer. If it is not specified, the default value is\n   * `2`.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true }) public readonly rows?: number\n\n  /**\n   * Defines whether the textarea may be checked for spelling errors.\n   *\n   * @webnative\n   */\n  @Prop({ attribute: 'spellcheck' }) public readonly spellCheck?: boolean\n\n  /**\n   * The value of the textarea.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true }) public value?: Value\n\n  /**\n   * Indicates how the control should wrap the value for form submission.\n   * Possible values are:\n   *\n   * - `hard`: The browser automatically inserts line breaks (`CR+LF`) so that\n   * each line is no longer than the width of the control; the `cols` attribute\n   * must be specified for this to take effect\n   * - `soft`: The browser ensures that all line breaks in the entered value\n   * are a `CR+LF` pair, but no additional line breaks are added to the value.\n   * - `off`: Like `soft` but changes appearance to `white-space: pre` so line\n   * segments exceeding `cols` are not wrapped and the `<qds-textarea>` becomes\n   * horizontally scrollable.\n   *\n   * If this attribute is not specified, `soft` is its default value.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true }) public wrap?: Wrap\n\n  /**\n   * Emitted when the textarea loses focus.\n   */\n  @Event({ eventName: 'qdsBlur', bubbles: false, cancelable: false })\n  private readonly blurEmitter!: EventEmitter<QdsFocusEventDetail>\n\n  /**\n   * Emitted when an alteration to the textarea's value is committed by the\n   * user.\n   */\n  @Event({ eventName: 'qdsChange', cancelable: false })\n  private readonly changeEmitter!: EventEmitter<void>\n\n  /**\n   * Emitted when the textarea gains focus.\n   */\n  @Event({ eventName: 'qdsFocus', bubbles: false, cancelable: false })\n  private readonly focusEmitter!: EventEmitter<QdsFocusEventDetail>\n\n  /**\n   * Emitted when the textarea's value changes.\n   */\n  @Event({ eventName: 'qdsInput', cancelable: false })\n  private readonly inputEmitter!: EventEmitter<QdsInputEventDetail>\n\n  @Element() private readonly element!: HTMLQdsTextareaElement\n\n  private inheritedAttributes: Attributes = {}\n\n  private textarea?: HTMLTextAreaElement\n\n  private get computedDisabled(): boolean {\n    return this.disabled ?? false\n  }\n\n  /**\n   * Returns true if the element's value passes validity checks; otherwise,\n   * returns false, fires an invalid event at the element, and (if the event\n   * isn't canceled) reports the problem to the user.\n   */\n  @Method()\n  public async reportValidity(): Promise<boolean> {\n    invariant(this.textarea)\n\n    return this.textarea.reportValidity()\n  }\n\n  /**\n   * Selects the entire content of the `<qds-textarea>` element if the\n   * element's content is selectable.\n   */\n  @Method()\n  public async select(): Promise<void> {\n    invariant(this.textarea)\n\n    this.textarea.select()\n  }\n\n  /**\n   * Sets a custom validity message for the textarea. If this message is not\n   * the empty string, then the element is considered invalid.\n   */\n  @Method()\n  public async setCustomValidity(message: string): Promise<void> {\n    invariant(this.textarea)\n\n    this.textarea.setCustomValidity(message)\n    this.invalid = !this.textarea.checkValidity()\n  }\n\n  /**\n   * Sets the contents of the specified range of characters in the textarea\n   * element to a given string.\n   *\n   * @param replacement The string to insert.\n   * @param start The 0-based index of the first character to replace. Defaults to the current selectionStart value (the start of the user's current selection).\n   * @param end The 0-based index of the character _after_ the last character to replace. Defaults to the current selectionEnd value (the end of the user's current selection).\n   * @param selectionMode A string defining how the selection should be set after the text has been replaced. Possible values:\n   *\n   * - `\"select\"` selects the newly inserted text.\n   * - `\"start\"` moves the selection to just before the inserted text.\n   * - `\"end\"` moves the selection to just after the inserted text.\n   * - `\"preserve\"` attempts to preserve the selection.\n   */\n  @Method()\n  public async setRangeText(\n    replacement: string,\n    start: number,\n    end: number,\n    selectionMode: SelectionMode = 'preserve',\n  ): Promise<void> {\n    invariant(this.textarea)\n\n    this.textarea.setRangeText(replacement, start, end, selectionMode)\n\n    if (this.value !== this.textarea.value) {\n      this.value = this.textarea.value\n      this.inputEmitter.emit()\n      this.changeEmitter.emit()\n    }\n  }\n\n  /**\n   * Selects the specified range of characters within the textarea.\n   *\n   * @param start The offset into the input for the start of the selection.\n   * @param end The offset into the input for the end of the selection.\n   * @param direction The direction in which the selection is performed.\n   */\n  @Method()\n  public async setSelectionRange(\n    start: number | null,\n    end: number | null,\n    direction?: SelectDirection,\n  ): Promise<void> {\n    invariant(this.textarea)\n\n    this.textarea.setSelectionRange(start, end, direction)\n  }\n\n  @Watch('disabled')\n  protected disabledChanged(): void {\n    invariant(this.textarea)\n\n    // Disabled inputs are always valid, so we need to recheck validity when\n    // the state changes.\n    this.textarea.disabled = this.computedDisabled\n    this.invalid = !this.textarea.checkValidity()\n  }\n\n  @Watch('value')\n  protected valueChanged(): void {\n    invariant(this.textarea)\n\n    this.textarea.value = this.value === null ? '' : String(this.value)\n    this.invalid = !this.textarea.checkValidity()\n  }\n\n  public componentWillLoad(): void {\n    autoIncrementingId += 1\n    this.inheritedAttributes = {\n      ...inheritAriaAttributes(this.element),\n      ...inheritAttributes(this.element, ['tabindex']),\n    }\n  }\n\n  public render() {\n    return (\n      <textarea\n        aria-invalid={this.invalid.toString()}\n        autoCapitalize={this.autoCapitalize}\n        autoComplete={this.autoComplete}\n        // eslint-disable-next-line jsx-a11y/no-autofocus\n        autoFocus={this.autoFocus}\n        class=\"qds-textarea\"\n        cols={this.cols}\n        data-size={this.size}\n        disabled={this.disabled}\n        enterKeyHint={this.enterkeyhint}\n        form={this.form}\n        inputMode={this.inputmode}\n        maxLength={this.maxLength}\n        minLength={this.minLength}\n        name={this.name}\n        onBlur={this.onBlur}\n        onChange={this.onChange}\n        onClick={this.onClick}\n        onFocus={this.onFocus}\n        onInput={this.onInput}\n        onInvalid={this.onInvalid}\n        placeholder={this.placeholder}\n        readOnly={this.readOnly}\n        ref={this.ref}\n        required={this.required}\n        rows={this.rows}\n        spellcheck={this.spellCheck}\n        wrap={this.wrap}\n        // eslint-disable-next-line react/jsx-props-no-spreading\n        {...this.inheritedAttributes}\n      >\n        <slot />\n      </textarea>\n    )\n  }\n\n  private readonly ref = (textarea?: HTMLTextAreaElement): void => {\n    this.textarea = textarea\n  }\n\n  private readonly onBlur = (event: FocusEvent): void => {\n    this.blurEmitter.emit(pickFocusEventAttributes(event))\n  }\n\n  private readonly onChange = (): void => {\n    invariant(this.textarea)\n\n    this.value = this.textarea.value\n    this.changeEmitter.emit()\n  }\n\n  private readonly onClick = (event: MouseEvent): void => {\n    if (this.computedDisabled) {\n      event.preventDefault()\n      event.stopPropagation()\n    }\n  }\n\n  private readonly onFocus = (event: FocusEvent): void => {\n    this.focusEmitter.emit(pickFocusEventAttributes(event))\n  }\n\n  private readonly onInput = (event: InputEvent): void => {\n    invariant(this.textarea)\n\n    this.value = this.textarea.value\n    this.inputEmitter.emit(pickInputEventAttributes(event))\n  }\n\n  private readonly onInvalid = (): void => {\n    this.invalid = true\n  }\n}\n"],"version":3}

package/dist/esm/qds-title.entry.js

@@ -3,7 +3,7 @@
  * 
  * SPDX-License-Identifier: LGPL-2.1-only
  */
-import { r as registerInstance, h, a as getElement } from './index-7b820913.js';
+import { r as registerInstance, h, a as getElement } from './index-5d80e9c2.js';
 import { i as inheritAriaAttributes } from './helpers-76b84f45.js';
 
 const titleCss = ":host([hidden]){display:none !important}:host{display:block}.qds-titles,.qds-title{display:flex}.qds-titles{box-sizing:border-box;flex-direction:column}.qds-title,.qds-subtitle,.qds-kicker{margin-block:0}.qds-icon{flex-shrink:0}.qds-title{font-weight:initial;font-size:initial;color:var(--qds-theme-title)}.qds-subtitle{color:var(--qds-theme-subtitle)}.qds-kicker{color:var(--qds-theme-kicker);order:-1}.qds-subtitle,.qds-kicker{overflow-wrap:break-word}.qds-main.qds-section.qds-titles,.qds-main.qds-section.qds-title{gap:var(--qds-main-section-titles-gap)}.qds-main.qds-section.qds-title{font:var(--qds-main-section-title)}.qds-main.qds-section.qds-title .qds-icon{--qds-main-section-title-line-height:2rem;width:var(--qds-main-section-titles-icon-size);height:var(--qds-main-section-title-line-height)}.qds-main.qds-section.qds-subtitle{font:var(--qds-main-section-subtitle)}.qds-main.qds-section.qds-kicker{font:var(--qds-main-section-kicker)}.qds-main.qds-section.qds-has-icon{padding-inline-start:calc(\n        var(--qds-main-section-titles-icon-size, 0px) +\n          var(--qds-main-section-titles-gap, 0px)\n      )}.qds-main.qds-section.qds-has-icon-end{padding-inline-end:calc(\n        var(--qds-main-section-titles-icon-size, 0px) +\n          var(--qds-main-section-titles-gap, 0px)\n      )}.qds-main.qds-subsection.qds-titles,.qds-main.qds-subsection.qds-title{gap:var(--qds-main-subsection-titles-gap)}.qds-main.qds-subsection.qds-title{font:var(--qds-main-subsection-title)}.qds-main.qds-subsection.qds-title .qds-icon{--qds-main-subsection-title-line-height:1.5rem;width:var(--qds-main-subsection-titles-icon-size);height:var(--qds-main-subsection-title-line-height)}.qds-main.qds-subsection.qds-subtitle{font:var(--qds-main-subsection-subtitle)}.qds-main.qds-subsection.qds-kicker{font:var(--qds-main-subsection-kicker)}.qds-main.qds-subsection.qds-has-icon{padding-inline-start:calc(\n        var(--qds-main-subsection-titles-icon-size, 0px) +\n          var(--qds-main-subsection-titles-gap, 0px)\n      )}.qds-panel.qds-root.qds-titles,.qds-panel.qds-root.qds-title{gap:var(--qds-panel-titles-gap)}.qds-panel.qds-root.qds-title{font:var(--qds-panel-title)}.qds-panel.qds-root.qds-title .qds-icon{--qds-panel-title-line-height:2rem;width:var(--qds-panel-titles-icon-size);height:var(--qds-panel-title-line-height)}.qds-panel.qds-root.qds-subtitle{font:var(--qds-panel-subtitle)}.qds-panel.qds-root.qds-kicker{font:var(--qds-panel-kicker)}.qds-panel.qds-root.qds-has-icon{padding-inline-start:calc(\n        var(--qds-panel-titles-icon-size, 0px) +\n          var(--qds-panel-titles-gap, 0px)\n      )}.qds-panel.qds-section.qds-titles,.qds-panel.qds-section.qds-title{gap:var(--qds-panel-section-titles-gap)}.qds-panel.qds-section.qds-title{font:var(--qds-panel-section-title)}.qds-panel.qds-section.qds-title .qds-icon{--qds-panel-section-title-line-height:1.5rem;width:var(--qds-panel-section-titles-icon-size);height:var(--qds-panel-section-title-line-height)}.qds-panel.qds-section.qds-subtitle{font:var(--qds-panel-section-subtitle)}.qds-panel.qds-section.qds-kicker{font:var(--qds-panel-section-kicker)}.qds-panel.qds-section.qds-has-icon{padding-inline-start:calc(\n        var(--qds-panel-section-titles-icon-size, 0px) +\n          var(--qds-panel-section-titles-gap, 0px)\n      )}.qds-panel.qds-subsection.qds-titles,.qds-panel.qds-subsection.qds-title{gap:var(--qds-panel-subsection-titles-gap)}.qds-panel.qds-subsection.qds-title{font:var(--qds-panel-subsection-title)}.qds-panel.qds-subsection.qds-title .qds-icon{--qds-panel-subsection-title-line-height:1.25rem;width:var(--qds-panel-subsection-titles-icon-size);height:var(--qds-panel-subsection-title-line-height)}.qds-panel.qds-subsection.qds-subtitle{font:var(--qds-panel-subsection-subtitle)}.qds-panel.qds-subsection.qds-kicker{font:var(--qds-panel-subsection-kicker)}.qds-panel.qds-subsection.qds-has-icon{padding-inline-start:calc(\n        var(--qds-panel-subsection-titles-icon-size, 0px) +\n          var(--qds-panel-subsection-titles-gap, 0px)\n      )}.qds-navigation.qds-section.qds-titles,.qds-navigation.qds-section.qds-title{gap:var(--qds-navigation-section-titles-gap)}.qds-navigation.qds-section.qds-title{font:var(--qds-navigation-section-title)}.qds-navigation.qds-section.qds-title .qds-icon{--qds-navigation-section-title-line-height:1.5rem;width:var(--qds-navigation-section-titles-icon-size);height:var(--qds-navigation-section-title-line-height)}.qds-navigation.qds-section.qds-subtitle{font:var(--qds-navigation-section-subtitle)}.qds-navigation.qds-section.qds-kicker{font:var(--qds-navigation-section-kicker)}.qds-navigation.qds-section.qds-has-icon{padding-inline-start:calc(\n        var(--qds-navigation-section-titles-icon-size, 0px) +\n          var(--qds-navigation-section-titles-gap, 0px)\n      )}.qds-navigation.qds-subsection.qds-titles,.qds-navigation.qds-subsection.qds-title{gap:var(--qds-navigation-subsection-titles-gap)}.qds-navigation.qds-subsection.qds-title{font:var(--qds-navigation-subsection-title)}.qds-navigation.qds-subsection.qds-title .qds-icon{--qds-navigation-subsection-title-line-height:1.25rem;width:var(--qds-navigation-subsection-titles-icon-size);height:var(--qds-navigation-subsection-title-line-height)}.qds-navigation.qds-subsection.qds-subtitle{font:var(--qds-navigation-subsection-subtitle)}.qds-navigation.qds-subsection.qds-kicker{font:var(--qds-navigation-subsection-kicker)}.qds-navigation.qds-subsection.qds-has-icon{padding-inline-start:calc(\n        var(--qds-navigation-subsection-titles-icon-size, 0px) +\n          var(--qds-navigation-subsection-titles-gap, 0px)\n      )}.qds-popup.qds-root.qds-titles,.qds-popup.qds-root.qds-title{gap:var(--qds-popup-titles-gap)}.qds-popup.qds-root.qds-title{font:var(--qds-popup-title)}.qds-popup.qds-root.qds-title .qds-icon{--qds-popup-title-line-height:1.75rem;width:var(--qds-popup-titles-icon-size);height:var(--qds-popup-title-line-height)}.qds-popup.qds-root.qds-subtitle{font:var(--qds-popup-subtitle)}.qds-popup.qds-root.qds-kicker{font:var(--qds-popup-kicker)}.qds-popup.qds-root.qds-has-icon{padding-inline-start:calc(\n        var(--qds-popup-titles-icon-size, 0px) +\n          var(--qds-popup-titles-gap, 0px)\n      )}.qds-popup.qds-section.qds-titles,.qds-popup.qds-section.qds-title{gap:var(--qds-popup-section-titles-gap)}.qds-popup.qds-section.qds-title{font:var(--qds-popup-section-title)}.qds-popup.qds-section.qds-title .qds-icon{--qds-popup-section-title-line-height:1.5rem;width:var(--qds-popup-section-titles-icon-size);height:var(--qds-popup-section-title-line-height)}.qds-popup.qds-section.qds-subtitle{font:var(--qds-popup-section-subtitle)}.qds-popup.qds-section.qds-kicker{font:var(--qds-popup-section-kicker)}.qds-popup.qds-section.qds-has-icon{padding-inline-start:calc(\n        var(--qds-popup-section-titles-icon-size, 0px) +\n          var(--qds-popup-section-titles-gap, 0px)\n      )}.qds-popup.qds-subsection.qds-titles,.qds-popup.qds-subsection.qds-title{gap:var(--qds-popup-subsection-titles-gap)}.qds-popup.qds-subsection.qds-title{font:var(--qds-popup-subsection-title)}.qds-popup.qds-subsection.qds-title .qds-icon{--qds-popup-subsection-title-line-height:1.25rem;width:var(--qds-popup-subsection-titles-icon-size);height:var(--qds-popup-subsection-title-line-height)}.qds-popup.qds-subsection.qds-subtitle{font:var(--qds-popup-subsection-subtitle)}.qds-popup.qds-subsection.qds-kicker{font:var(--qds-popup-subsection-kicker)}.qds-popup.qds-subsection.qds-has-icon{padding-inline-start:calc(\n        var(--qds-popup-subsection-titles-icon-size, 0px) +\n          var(--qds-popup-subsection-titles-gap, 0px)\n      )}.qds-accessory.qds-root.qds-titles,.qds-accessory.qds-root.qds-title{gap:var(--qds-accessory-titles-gap)}.qds-accessory.qds-root.qds-title{font:var(--qds-accessory-title)}.qds-accessory.qds-root.qds-title .qds-icon{--qds-accessory-title-line-height:1.5rem;width:var(--qds-accessory-titles-icon-size);height:var(--qds-accessory-title-line-height)}.qds-accessory.qds-root.qds-subtitle{font:var(--qds-accessory-subtitle)}.qds-accessory.qds-root.qds-kicker{font:var(--qds-accessory-kicker)}.qds-accessory.qds-root.qds-has-icon{padding-inline-start:calc(\n        var(--qds-accessory-titles-icon-size, 0px) +\n          var(--qds-accessory-titles-gap, 0px)\n      )}.qds-accessory.qds-section.qds-titles,.qds-accessory.qds-section.qds-title{gap:var(--qds-accessory-section-titles-gap)}.qds-accessory.qds-section.qds-title{font:var(--qds-accessory-section-title)}.qds-accessory.qds-section.qds-title .qds-icon{--qds-accessory-section-title-line-height:1.25rem;width:var(--qds-accessory-section-titles-icon-size);height:var(--qds-accessory-section-title-line-height)}.qds-accessory.qds-section.qds-subtitle{font:var(--qds-accessory-section-subtitle)}.qds-accessory.qds-section.qds-kicker{font:var(--qds-accessory-section-kicker)}.qds-accessory.qds-section.qds-has-icon{padding-inline-start:calc(\n        var(--qds-accessory-section-titles-icon-size, 0px) +\n          var(--qds-accessory-section-titles-gap, 0px)\n      )}";

package/dist/esm/qds-tooltip.entry.js

@@ -3,7 +3,7 @@
  * 
  * SPDX-License-Identifier: LGPL-2.1-only
  */
-import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-7b820913.js';
+import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-5d80e9c2.js';
 import { o as offset, f as flip, s as shift, l as limitShift, b as arrow, c as computePosition, a as autoUpdate } from './floating-ui.dom.esm-48281c44.js';
 import { c as ignorePromise, d as propertyToPx, a as invariant, r as roundByDPR, f as isTouchDevice } from './helpers-76b84f45.js';
 

package/dist/esm/qds.js

@@ -3,11 +3,11 @@
  * 
  * SPDX-License-Identifier: LGPL-2.1-only
  */
-import { p as promiseResolve, b as bootstrapLazy } from './index-7b820913.js';
-export { s as setNonce } from './index-7b820913.js';
+import { p as promiseResolve, b as bootstrapLazy } from './index-5d80e9c2.js';
+export { s as setNonce } from './index-5d80e9c2.js';
 
 /*
- Stencil Client Patch Browser v4.2.1 | MIT Licensed | https://stenciljs.com
+ Stencil Client Patch Browser v4.6.0 | MIT Licensed | https://stenciljs.com
  */
 const patchBrowser = () => {
     const importMeta = import.meta.url;
@@ -19,7 +19,7 @@ const patchBrowser = () => {
 };
 
 patchBrowser().then(options => {
-  return bootstrapLazy([["qds-checkbox",[[2,"qds-checkbox",{"inline":[4],"size":[513],"text":[1537],"autoFocus":[4,"autofocus"],"checked":[1540],"disabled":[1540],"form":[1],"indeterminate":[1540],"name":[1],"required":[4],"value":[1032],"checkValidity":[64],"reportValidity":[64],"setCustomValidity":[64]},[[0,"click","onClick"]]]]],["qds-radio",[[2,"qds-radio",{"inline":[4],"size":[513],"text":[1537],"checked":[1540],"disabled":[1540],"form":[1],"name":[1],"required":[4],"value":[1032]},[[0,"click","onClick"]]]]],["qds-switch",[[2,"qds-switch",{"inline":[4],"iconCheckedName":[513,"icon-checked-name"],"iconCheckedLibrary":[513,"icon-checked-library"],"iconUncheckedName":[513,"icon-unchecked-name"],"iconUncheckedLibrary":[513,"icon-unchecked-library"],"size":[513],"textChecked":[1537,"text-checked"],"textUnchecked":[1537,"text-unchecked"],"autoFocus":[4,"autofocus"],"checked":[1540],"disabled":[1540],"form":[1],"name":[1],"value":[1032]},[[0,"click","onClick"]]]]],["qds-button",[[17,"qds-button",{"iconName":[513,"icon-name"],"iconLibrary":[513,"icon-library"],"importance":[513],"size":[513],"text":[1537],"disabled":[1540],"download":[1],"form":[1],"formAction":[1,"formaction"],"formMethod":[1,"formmethod"],"formNoValidate":[4,"formnovalidate"],"formTarget":[1,"formtarget"],"href":[1],"name":[1],"target":[1],"type":[1],"value":[1]}]]],["qds-form-message",[[1,"qds-form-message",{"inline":[4],"size":[513],"status":[1],"text":[513]}]]],["qds-inline-link",[[17,"qds-inline-link",{"disabled":[1540],"download":[8],"href":[1],"hreflang":[1],"referrerPolicy":[1,"referrerpolicy"],"rel":[1],"target":[1]},[[0,"click","onClick"]]]]],["qds-select",[[6,"qds-select",{"invalid":[1540],"size":[513],"autoComplete":[1,"autocomplete"],"autoFocus":[4,"autofocus"],"disabled":[1540],"form":[1],"multiple":[516],"name":[1],"required":[4],"value":[1032],"addItem":[64],"item":[64],"namedItem":[64],"removeItem":[64],"setCustomValidity":[64]}]]],["qds-title",[[1,"qds-title",{"iconName":[513,"icon-name"],"iconLibrary":[513,"icon-library"],"kicker":[1],"layer":[1],"level":[1],"subtitle":[1],"tag":[1]}]]],["qds-dialog",[[1,"qds-dialog",{"open":[1540],"show":[64],"close":[64]}]]],["qds-divider",[[1,"qds-divider",{"importance":[513]}]]],["qds-dropdown",[[1,"qds-dropdown",{"autoUpdateOptions":[16],"disabled":[1028],"flipOptions":[16],"noFlip":[4,"no-flip"],"noShift":[4,"no-shift"],"offsetOptions":[16],"placement":[1],"shiftOptions":[16],"strategy":[1],"target":[1],"hostAriaLabelledBy":[32],"hostDisplay":[32],"hostPosition":[32],"hostTransform":[32],"show":[64],"close":[64],"update":[64]},[[4,"click","handleMouseDown"]]]]],["qds-input",[[2,"qds-input",{"invalid":[1540],"size":[513],"autoCapitalize":[1,"autocapitalize"],"autoComplete":[1,"autocomplete"],"autoFocus":[4,"autofocus"],"disabled":[1540],"enterkeyhint":[1],"form":[1],"inputmode":[1],"max":[8],"maxLength":[2,"maxlength"],"min":[8],"minLength":[2,"minlength"],"multiple":[4],"name":[1],"pattern":[1],"placeholder":[1],"readOnly":[4,"readonly"],"required":[4],"spellCheck":[4,"spellcheck"],"step":[8],"type":[1],"value":[1032],"reportValidity":[64],"select":[64],"setCustomValidity":[64],"setRangeText":[64],"setSelectionRange":[64],"stepDown":[64],"stepUp":[64]}]]],["qds-table",[[1,"qds-table"]]],["qds-table-body",[[1,"qds-table-body"]]],["qds-table-cell",[[1,"qds-table-cell",{"colSpan":[2,"colspan"],"rowSpan":[2,"rowspan"]}]]],["qds-table-head",[[1,"qds-table-head"]]],["qds-table-head-cell",[[1,"qds-table-head-cell",{"abbr":[1],"colSpan":[2,"colspan"],"rowSpan":[2,"rowspan"],"scope":[1]}]]],["qds-table-row",[[1,"qds-table-row"]]],["qds-textarea",[[6,"qds-textarea",{"invalid":[1540],"size":[513],"autoCapitalize":[1,"autocapitalize"],"autoComplete":[1,"autocomplete"],"autoFocus":[4,"autofocus"],"cols":[1026],"disabled":[1540],"enterkeyhint":[1],"form":[1],"inputmode":[1],"maxLength":[2,"maxlength"],"minLength":[2,"minlength"],"name":[1],"placeholder":[1],"readOnly":[4,"readonly"],"required":[4],"rows":[1026],"spellCheck":[4,"spellcheck"],"value":[1032],"wrap":[1025],"reportValidity":[64],"select":[64],"setCustomValidity":[64],"setRangeText":[64],"setSelectionRange":[64]}]]],["qds-tooltip",[[1,"qds-tooltip",{"autoUpdateOptions":[16],"disabled":[1028],"flipOptions":[16],"noFlip":[4,"no-flip"],"noShift":[4,"no-shift"],"offsetOptions":[16],"placement":[1],"shiftOptions":[16],"strategy":[1],"target":[1],"hostPosition":[32],"hostTransform":[32],"open":[32],"middleware":[32],"aDisplay":[32],"side":[32],"aShape":[32],"aViewbox":[32],"aHeight":[32],"aWidth":[32],"aGap":[32],"aX":[32],"aY":[32],"show":[64],"close":[64],"updateArrow":[64]},[[5,"mousedown","handleMouseDown"]]]]],["qds-label",[[1,"qds-label",{"inline":[4],"required":[4],"size":[513],"text":[513]}]]],["qds-icon",[[1,"qds-icon",{"name":[513],"library":[513],"svg":[32]}]]]], options);
+  return bootstrapLazy([["qds-checkbox",[[2,"qds-checkbox",{"inline":[4],"size":[513],"text":[1537],"autoFocus":[4,"autofocus"],"checked":[1540],"disabled":[1540],"form":[1],"indeterminate":[1540],"name":[1],"required":[4],"value":[1032],"checkValidity":[64],"reportValidity":[64],"setCustomValidity":[64]},[[0,"click","onClick"]]]]],["qds-radio",[[2,"qds-radio",{"inline":[4],"size":[513],"text":[1537],"checked":[1540],"disabled":[1540],"form":[1],"name":[1],"required":[4],"value":[1032]},[[0,"click","onClick"]]]]],["qds-switch",[[2,"qds-switch",{"inline":[4],"iconCheckedName":[513,"icon-checked-name"],"iconCheckedLibrary":[513,"icon-checked-library"],"iconUncheckedName":[513,"icon-unchecked-name"],"iconUncheckedLibrary":[513,"icon-unchecked-library"],"size":[513],"textChecked":[1537,"text-checked"],"textUnchecked":[1537,"text-unchecked"],"autoFocus":[4,"autofocus"],"checked":[1540],"disabled":[1540],"form":[1],"name":[1],"value":[1032]},[[0,"click","onClick"]]]]],["qds-button",[[17,"qds-button",{"iconName":[513,"icon-name"],"iconLibrary":[513,"icon-library"],"importance":[513],"size":[513],"text":[1537],"disabled":[1540],"download":[1],"form":[1],"formAction":[1,"formaction"],"formMethod":[1,"formmethod"],"formNoValidate":[4,"formnovalidate"],"formTarget":[1,"formtarget"],"href":[1],"name":[1],"target":[1],"type":[1],"value":[1]},[[0,"click","onClick"]]]]],["qds-form-message",[[1,"qds-form-message",{"inline":[4],"size":[513],"status":[1],"text":[513]}]]],["qds-inline-link",[[17,"qds-inline-link",{"disabled":[1540],"download":[8],"href":[1],"hreflang":[1],"referrerPolicy":[1,"referrerpolicy"],"rel":[1],"target":[1]},[[0,"click","onClick"]]]]],["qds-select",[[6,"qds-select",{"invalid":[1540],"size":[513],"autoComplete":[1,"autocomplete"],"autoFocus":[4,"autofocus"],"disabled":[1540],"form":[1],"multiple":[516],"name":[1],"required":[4],"value":[1032],"addItem":[64],"item":[64],"namedItem":[64],"removeItem":[64],"setCustomValidity":[64]},null,{"disabled":["disabledChanged"],"value":["valueChanged"]}]]],["qds-title",[[1,"qds-title",{"iconName":[513,"icon-name"],"iconLibrary":[513,"icon-library"],"kicker":[1],"layer":[1],"level":[1],"subtitle":[1],"tag":[1]}]]],["qds-dialog",[[1,"qds-dialog",{"open":[1540],"show":[64],"close":[64]},null,{"open":["openChanged"]}]]],["qds-divider",[[1,"qds-divider",{"importance":[513]}]]],["qds-dropdown",[[1,"qds-dropdown",{"autoUpdateOptions":[16],"disabled":[1028],"flipOptions":[16],"noFlip":[4,"no-flip"],"noShift":[4,"no-shift"],"offsetOptions":[16],"placement":[1],"shiftOptions":[16],"strategy":[1],"target":[1],"hostAriaLabelledBy":[32],"hostDisplay":[32],"hostPosition":[32],"hostTransform":[32],"show":[64],"close":[64],"update":[64]},[[4,"click","handleMouseDown"]],{"target":["updateReferenceElement"],"flipOptions":["updateMiddleware"],"noFlip":["updateMiddleware"],"noShift":["updateMiddleware"],"offsetOptions":["updateMiddleware"],"shiftOptions":["updateMiddleware"],"placement":["updatePosition"],"strategy":["updatePosition"],"autoUpdateOptions":["startAutoUpdate"]}]]],["qds-input",[[2,"qds-input",{"invalid":[1540],"size":[513],"autoCapitalize":[1,"autocapitalize"],"autoComplete":[1,"autocomplete"],"autoFocus":[4,"autofocus"],"disabled":[1540],"enterkeyhint":[1],"form":[1],"inputmode":[1],"max":[8],"maxLength":[2,"maxlength"],"min":[8],"minLength":[2,"minlength"],"multiple":[4],"name":[1],"pattern":[1],"placeholder":[1],"readOnly":[4,"readonly"],"required":[4],"spellCheck":[4,"spellcheck"],"step":[8],"type":[1],"value":[1032],"reportValidity":[64],"select":[64],"setCustomValidity":[64],"setRangeText":[64],"setSelectionRange":[64],"stepDown":[64],"stepUp":[64]},null,{"disabled":["disabledChanged"],"step":["stepChanged"],"value":["valueChanged"]}]]],["qds-table",[[1,"qds-table"]]],["qds-table-body",[[1,"qds-table-body"]]],["qds-table-cell",[[1,"qds-table-cell",{"colSpan":[2,"colspan"],"rowSpan":[2,"rowspan"]}]]],["qds-table-head",[[1,"qds-table-head"]]],["qds-table-head-cell",[[1,"qds-table-head-cell",{"abbr":[1],"colSpan":[2,"colspan"],"rowSpan":[2,"rowspan"],"scope":[1]}]]],["qds-table-row",[[1,"qds-table-row"]]],["qds-textarea",[[6,"qds-textarea",{"invalid":[1540],"size":[513],"autoCapitalize":[1,"autocapitalize"],"autoComplete":[1,"autocomplete"],"autoFocus":[4,"autofocus"],"cols":[1026],"disabled":[1540],"enterkeyhint":[1],"form":[1],"inputmode":[1],"maxLength":[2,"maxlength"],"minLength":[2,"minlength"],"name":[1],"placeholder":[1],"readOnly":[4,"readonly"],"required":[4],"rows":[1026],"spellCheck":[4,"spellcheck"],"value":[1032],"wrap":[1025],"reportValidity":[64],"select":[64],"setCustomValidity":[64],"setRangeText":[64],"setSelectionRange":[64]},null,{"disabled":["disabledChanged"],"value":["valueChanged"]}]]],["qds-tooltip",[[1,"qds-tooltip",{"autoUpdateOptions":[16],"disabled":[1028],"flipOptions":[16],"noFlip":[4,"no-flip"],"noShift":[4,"no-shift"],"offsetOptions":[16],"placement":[1],"shiftOptions":[16],"strategy":[1],"target":[1],"hostPosition":[32],"hostTransform":[32],"open":[32],"middleware":[32],"aDisplay":[32],"side":[32],"aShape":[32],"aViewbox":[32],"aHeight":[32],"aWidth":[32],"aGap":[32],"aX":[32],"aY":[32],"show":[64],"close":[64],"updateArrow":[64]},[[5,"mousedown","handleMouseDown"]],{"aGap":["updateMiddleware"],"aHeight":["updateMiddleware"],"flipOptions":["updateMiddleware"],"noFlip":["updateMiddleware"],"noShift":["updateMiddleware"],"offsetOptions":["updateMiddleware"],"shiftOptions":["updateMiddleware"],"target":["updateReferenceElement"],"middleware":["updatePosition"],"placement":["updatePosition"],"strategy":["updatePosition"],"autoUpdateOptions":["startAutoUpdate"]}]]],["qds-label",[[1,"qds-label",{"inline":[4],"required":[4],"size":[513],"text":[513]}]]],["qds-icon",[[1,"qds-icon",{"name":[513],"library":[513],"svg":[32]},null,{"name":["setIcon"],"library":["setIcon"]}]]]], options);
 });
 
 //# sourceMappingURL=qds.js.map

package/dist/esm/qds.js.map

@@ -1 +1 @@
-{"file":"qds.js","mappings":";;;;;;;;AAAA;AACA;AACA;AAGA,MAAM,YAAY,GAAG,MAAM;AAyB3B,IAAI,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC;AACvC,IAAI,MAAM,IAAI,GAAiE,EAAE,CAAC;AAClF,IAAI,IAAI,UAAU,KAAK,EAAE,EAAE;AAC3B,QAAQ,IAAI,CAAC,YAAY,GAAG,IAAI,GAAG,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC,IAAI,CAAC;AAC1D,KAAK;AACL,IAAI,OAAO,cAAc,CAAC,IAAI,CAAC,CAAC;AAChC,CAAC;;AChCD,YAAY,EAAE,CAAC,IAAI,CAAC,OAAO,IAAI;AAE/B,EAAE,OAAO,aAAa,CAAC,4BAA4B,EAAE,OAAO,CAAC,CAAC;AAC9D,CAAC,CAAC","names":[],"sources":["../../node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.2.1 | MIT Licensed | https://stenciljs.com\n */\nimport { BUILD, NAMESPACE } from '@stencil/core/internal/app-data';\nimport { consoleDevInfo, doc, promiseResolve, H } from '@stencil/core';\nconst patchBrowser = () => {\n    // NOTE!! This fn cannot use async/await!\n    if (BUILD.isDev && !BUILD.isTesting) {\n        consoleDevInfo('Running in development mode.');\n    }\n    if (BUILD.cloneNodeFix) {\n        // opted-in to polyfill cloneNode() for slot polyfilled components\n        patchCloneNodeFix(H.prototype);\n    }\n    if (BUILD.profile && !performance.mark) {\n        // not all browsers support performance.mark/measure (Safari 10)\n        // because the mark/measure APIs are designed to write entries to a buffer in the browser that does not exist,\n        // simply stub the implementations out.\n        // TODO(STENCIL-323): Remove this patch when support for older browsers is removed (breaking)\n        // @ts-ignore\n        performance.mark = performance.measure = () => {\n            /*noop*/\n        };\n        performance.getEntriesByName = () => [];\n    }\n    // @ts-ignore\n    const scriptElm = BUILD.scriptDataOpts\n        ? Array.from(doc.querySelectorAll('script')).find((s) => new RegExp(`\\/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) ||\n            s.getAttribute('data-stencil-namespace') === NAMESPACE)\n        : null;\n    const importMeta = import.meta.url;\n    const opts = BUILD.scriptDataOpts ? (scriptElm || {})['data-opts'] || {} : {};\n    if (importMeta !== '') {\n        opts.resourcesUrl = new URL('.', importMeta).href;\n    }\n    return promiseResolve(opts);\n};\nconst patchCloneNodeFix = (HTMLElementPrototype) => {\n    const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n    HTMLElementPrototype.cloneNode = function (deep) {\n        if (this.nodeName === 'TEMPLATE') {\n            return nativeCloneNodeFn.call(this, deep);\n        }\n        const clonedNode = nativeCloneNodeFn.call(this, false);\n        const srcChildNodes = this.childNodes;\n        if (deep) {\n            for (let i = 0; i < srcChildNodes.length; i++) {\n                // Node.ATTRIBUTE_NODE === 2, and checking because IE11\n                if (srcChildNodes[i].nodeType !== 2) {\n                    clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n                }\n            }\n        }\n        return clonedNode;\n    };\n};\nexport { patchBrowser };\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(options => {\n  globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"version":3}
+{"file":"qds.js","mappings":";;;;;;;;AAAA;AACA;AACA;AAGA,MAAM,YAAY,GAAG,MAAM;AAa3B,IAAI,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC;AACvC,IAAI,MAAM,IAAI,GAAiE,EAAE,CAAC;AAClF,IAAI,IAAI,UAAU,KAAK,EAAE,EAAE;AAC3B,QAAQ,IAAI,CAAC,YAAY,GAAG,IAAI,GAAG,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC,IAAI,CAAC;AAC1D,KAAK;AACL,IAAI,OAAO,cAAc,CAAC,IAAI,CAAC,CAAC;AAChC,CAAC;;ACpBD,YAAY,EAAE,CAAC,IAAI,CAAC,OAAO,IAAI;AAE/B,EAAE,OAAO,aAAa,CAAC,4BAA4B,EAAE,OAAO,CAAC,CAAC;AAC9D,CAAC,CAAC","names":[],"sources":["../../node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.6.0 | MIT Licensed | https://stenciljs.com\n */\nimport { BUILD, NAMESPACE } from '@stencil/core/internal/app-data';\nimport { consoleDevInfo, doc, promiseResolve, H } from '@stencil/core';\nconst patchBrowser = () => {\n    // NOTE!! This fn cannot use async/await!\n    if (BUILD.isDev && !BUILD.isTesting) {\n        consoleDevInfo('Running in development mode.');\n    }\n    if (BUILD.cloneNodeFix) {\n        // opted-in to polyfill cloneNode() for slot polyfilled components\n        patchCloneNodeFix(H.prototype);\n    }\n    const scriptElm = BUILD.scriptDataOpts\n        ? Array.from(doc.querySelectorAll('script')).find((s) => new RegExp(`\\/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) ||\n            s.getAttribute('data-stencil-namespace') === NAMESPACE)\n        : null;\n    const importMeta = import.meta.url;\n    const opts = BUILD.scriptDataOpts ? (scriptElm || {})['data-opts'] || {} : {};\n    if (importMeta !== '') {\n        opts.resourcesUrl = new URL('.', importMeta).href;\n    }\n    return promiseResolve(opts);\n};\nconst patchCloneNodeFix = (HTMLElementPrototype) => {\n    const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n    HTMLElementPrototype.cloneNode = function (deep) {\n        if (this.nodeName === 'TEMPLATE') {\n            return nativeCloneNodeFn.call(this, deep);\n        }\n        const clonedNode = nativeCloneNodeFn.call(this, false);\n        const srcChildNodes = this.childNodes;\n        if (deep) {\n            for (let i = 0; i < srcChildNodes.length; i++) {\n                // Node.ATTRIBUTE_NODE === 2, and checking because IE11\n                if (srcChildNodes[i].nodeType !== 2) {\n                    clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n                }\n            }\n        }\n        return clonedNode;\n    };\n};\nexport { patchBrowser };\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(options => {\n  globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"version":3}

package/dist/types/components/button/button.d.ts

@@ -205,9 +205,9 @@ export declare class Button implements ComponentInterface {
   private get iconOnly();
   private get computedDisabled();
   private get computedTabIndex();
+  protected onClick(event: MouseEvent): void;
   componentWillLoad(): void;
   render(): any;
-  private readonly onClick;
   private readonly onBlur;
   private readonly onFocus;
 }

package/dist/types/components/input/input.d.ts

@@ -18,7 +18,7 @@ export declare class Input implements ComponentInterface {
    * `minlength`, and `maxlength` using
    * [constraint validation](https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation).
    */
-  invalid?: boolean;
+  invalid?: boolean | undefined;
   /**
    * The input's size.
    *

package/dist/types/components/label/label.d.ts

@@ -20,7 +20,7 @@ export declare class Label implements ComponentInterface {
   /**
    * The label's size.
    */
-  readonly size: LabelSize;
+  readonly size?: LabelSize;
   /**
    * The label's text.
    */

package/dist/types/components/radio/radio.d.ts

@@ -22,7 +22,7 @@ export declare class Radio implements ComponentInterface {
   /**
    * The radio button's size.
    */
-  readonly size: RadioSize;
+  readonly size?: RadioSize;
   /**
    * The radio button's text.
    */
@@ -98,6 +98,7 @@ export declare class Radio implements ComponentInterface {
   private inheritedAttributes;
   private input?;
   private get computedDisabled();
+  private get computedSize();
   private get hasText();
   protected onClick(): void;
   componentWillLoad(): void;

package/dist/types/components/select/select.d.ts

@@ -23,7 +23,7 @@ export declare class Select implements ComponentInterface {
    *
    * [`size` HTML attribute]: https://developer.mozilla.org/docs/Web/HTML/Attributes/size
    */
-  readonly size: SelectSize;
+  readonly size?: SelectSize;
   /**
    * Provides a hint for a [user agent's][] autocomplete feature. See
    * [the HTML `autocomplete` attribute][] for a complete list of values and
@@ -118,6 +118,7 @@ export declare class Select implements ComponentInterface {
   private readonly element;
   private inheritedAttributes;
   private select?;
+  private get computedSize();
   /**
    * Adds an element to the options collection.
    *

package/dist/types/components/textarea/textarea.d.ts

@@ -18,7 +18,7 @@ export declare class TextArea implements ComponentInterface {
    *
    * [constraint validation]: https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation
    */
-  invalid?: boolean;
+  invalid: boolean;
   /**
    * The textarea's size.
    *