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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (123) hide show
  1. package/components/icon.js +3 -0
  2. package/components/icon.js.map +1 -1
  3. package/components/index.js.map +1 -1
  4. package/components/label.js +1 -1
  5. package/components/label.js.map +1 -1
  6. package/components/qds-button.js +28 -29
  7. package/components/qds-button.js.map +1 -1
  8. package/components/qds-checkbox.js +1 -1
  9. package/components/qds-checkbox.js.map +1 -1
  10. package/components/qds-dialog.js +2 -0
  11. package/components/qds-dialog.js.map +1 -1
  12. package/components/qds-dropdown.js +11 -1
  13. package/components/qds-dropdown.js.map +1 -1
  14. package/components/qds-inline-link.js +1 -1
  15. package/components/qds-inline-link.js.map +1 -1
  16. package/components/qds-input.js +6 -2
  17. package/components/qds-input.js.map +1 -1
  18. package/components/qds-radio.js +5 -2
  19. package/components/qds-radio.js.map +1 -1
  20. package/components/qds-select.js +8 -2
  21. package/components/qds-select.js.map +1 -1
  22. package/components/qds-switch.js +1 -1
  23. package/components/qds-switch.js.map +1 -1
  24. package/components/qds-textarea.js +5 -2
  25. package/components/qds-textarea.js.map +1 -1
  26. package/components/qds-tooltip.js +14 -1
  27. package/components/qds-tooltip.js.map +1 -1
  28. package/dist/cjs/{index-210f861c.js → index-54d11f50.js} +187 -72
  29. package/dist/cjs/index-54d11f50.js.map +1 -0
  30. package/dist/cjs/index.cjs.js +2 -2
  31. package/dist/cjs/index.cjs.js.map +1 -1
  32. package/dist/cjs/{library-4a3613dd.js → library-4c55a413.js} +2 -2
  33. package/dist/cjs/{library-4a3613dd.js.map → library-4c55a413.js.map} +1 -1
  34. package/dist/cjs/loader.cjs.js +2 -2
  35. package/dist/cjs/qds-button.cjs.entry.js +28 -29
  36. package/dist/cjs/qds-button.cjs.entry.js.map +1 -1
  37. package/dist/cjs/qds-checkbox.cjs.entry.js +2 -2
  38. package/dist/cjs/qds-checkbox.cjs.entry.js.map +1 -1
  39. package/dist/cjs/qds-dialog.cjs.entry.js +1 -1
  40. package/dist/cjs/qds-divider.cjs.entry.js +1 -1
  41. package/dist/cjs/qds-dropdown.cjs.entry.js +1 -1
  42. package/dist/cjs/qds-form-message.cjs.entry.js +1 -1
  43. package/dist/cjs/qds-icon.cjs.entry.js +2 -2
  44. package/dist/cjs/qds-inline-link.cjs.entry.js +2 -2
  45. package/dist/cjs/qds-inline-link.cjs.entry.js.map +1 -1
  46. package/dist/cjs/qds-input.cjs.entry.js +3 -3
  47. package/dist/cjs/qds-input.cjs.entry.js.map +1 -1
  48. package/dist/cjs/qds-label.cjs.entry.js +2 -2
  49. package/dist/cjs/qds-label.cjs.entry.js.map +1 -1
  50. package/dist/cjs/qds-radio.cjs.entry.js +6 -3
  51. package/dist/cjs/qds-radio.cjs.entry.js.map +1 -1
  52. package/dist/cjs/qds-select.cjs.entry.js +6 -3
  53. package/dist/cjs/qds-select.cjs.entry.js.map +1 -1
  54. package/dist/cjs/qds-switch.cjs.entry.js +2 -2
  55. package/dist/cjs/qds-switch.cjs.entry.js.map +1 -1
  56. package/dist/cjs/qds-table-body.cjs.entry.js +1 -1
  57. package/dist/cjs/qds-table-cell.cjs.entry.js +1 -1
  58. package/dist/cjs/qds-table-head-cell.cjs.entry.js +1 -1
  59. package/dist/cjs/qds-table-head.cjs.entry.js +1 -1
  60. package/dist/cjs/qds-table-row.cjs.entry.js +1 -1
  61. package/dist/cjs/qds-table.cjs.entry.js +1 -1
  62. package/dist/cjs/qds-textarea.cjs.entry.js +3 -3
  63. package/dist/cjs/qds-textarea.cjs.entry.js.map +1 -1
  64. package/dist/cjs/qds-title.cjs.entry.js +1 -1
  65. package/dist/cjs/qds-tooltip.cjs.entry.js +1 -1
  66. package/dist/cjs/qds.cjs.js +3 -3
  67. package/dist/cjs/qds.cjs.js.map +1 -1
  68. package/dist/custom-elements.json +45 -19
  69. package/dist/docs.json +34 -20
  70. package/dist/esm/{index-7b820913.js → index-5d80e9c2.js} +187 -72
  71. package/dist/esm/index-5d80e9c2.js.map +1 -0
  72. package/dist/esm/index.js +2 -2
  73. package/dist/esm/index.js.map +1 -1
  74. package/dist/esm/{library-68f03bea.js → library-376fa462.js} +2 -2
  75. package/dist/esm/{library-68f03bea.js.map → library-376fa462.js.map} +1 -1
  76. package/dist/esm/loader.js +3 -3
  77. package/dist/esm/qds-button.entry.js +28 -29
  78. package/dist/esm/qds-button.entry.js.map +1 -1
  79. package/dist/esm/qds-checkbox.entry.js +2 -2
  80. package/dist/esm/qds-checkbox.entry.js.map +1 -1
  81. package/dist/esm/qds-dialog.entry.js +1 -1
  82. package/dist/esm/qds-divider.entry.js +1 -1
  83. package/dist/esm/qds-dropdown.entry.js +1 -1
  84. package/dist/esm/qds-form-message.entry.js +1 -1
  85. package/dist/esm/qds-icon.entry.js +2 -2
  86. package/dist/esm/qds-inline-link.entry.js +2 -2
  87. package/dist/esm/qds-inline-link.entry.js.map +1 -1
  88. package/dist/esm/qds-input.entry.js +3 -3
  89. package/dist/esm/qds-input.entry.js.map +1 -1
  90. package/dist/esm/qds-label.entry.js +2 -2
  91. package/dist/esm/qds-label.entry.js.map +1 -1
  92. package/dist/esm/qds-radio.entry.js +6 -3
  93. package/dist/esm/qds-radio.entry.js.map +1 -1
  94. package/dist/esm/qds-select.entry.js +6 -3
  95. package/dist/esm/qds-select.entry.js.map +1 -1
  96. package/dist/esm/qds-switch.entry.js +2 -2
  97. package/dist/esm/qds-switch.entry.js.map +1 -1
  98. package/dist/esm/qds-table-body.entry.js +1 -1
  99. package/dist/esm/qds-table-cell.entry.js +1 -1
  100. package/dist/esm/qds-table-head-cell.entry.js +1 -1
  101. package/dist/esm/qds-table-head.entry.js +1 -1
  102. package/dist/esm/qds-table-row.entry.js +1 -1
  103. package/dist/esm/qds-table.entry.js +1 -1
  104. package/dist/esm/qds-textarea.entry.js +3 -3
  105. package/dist/esm/qds-textarea.entry.js.map +1 -1
  106. package/dist/esm/qds-title.entry.js +1 -1
  107. package/dist/esm/qds-tooltip.entry.js +1 -1
  108. package/dist/esm/qds.js +4 -4
  109. package/dist/esm/qds.js.map +1 -1
  110. package/dist/types/components/button/button.d.ts +1 -1
  111. package/dist/types/components/input/input.d.ts +1 -1
  112. package/dist/types/components/label/label.d.ts +1 -1
  113. package/dist/types/components/radio/radio.d.ts +2 -1
  114. package/dist/types/components/select/select.d.ts +2 -1
  115. package/dist/types/components/textarea/textarea.d.ts +1 -1
  116. package/dist/types/components.d.ts +158 -6
  117. package/dist/types/qds-test.d.ts +13 -2
  118. package/dist/types/stencil-public-runtime.d.ts +21 -0
  119. package/hydrate/index.js +135 -100
  120. package/package.json +30 -63
  121. package/dist/cjs/index-210f861c.js.map +0 -1
  122. package/dist/esm/index-7b820913.js.map +0 -1
  123. package/dist/types/components/create-story.d.ts +0 -5
@@ -1 +1 @@
1
- {"file":"qds-switch.entry.cjs.js","mappings":"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","names":["pickFocusEventAttributes","inheritAriaAttributes","inheritAttributes","h"],"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}
1
+ {"file":"qds-switch.entry.cjs.js","mappings":"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","names":["pickFocusEventAttributes","inheritAriaAttributes","inheritAttributes","h"],"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}
@@ -7,7 +7,7 @@
7
7
 
8
8
  Object.defineProperty(exports, '__esModule', { value: true });
9
9
 
10
- const index = require('./index-210f861c.js');
10
+ const index = require('./index-54d11f50.js');
11
11
  const helpers = require('./helpers-452256e8.js');
12
12
 
13
13
  const tableBodyCss = ":host([hidden]){display:none !important}:host{display:contents}.qds-table-body{box-sizing:border-box}";
@@ -7,7 +7,7 @@
7
7
 
8
8
  Object.defineProperty(exports, '__esModule', { value: true });
9
9
 
10
- const index = require('./index-210f861c.js');
10
+ const index = require('./index-54d11f50.js');
11
11
  const helpers = require('./helpers-452256e8.js');
12
12
 
13
13
  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}";
@@ -7,7 +7,7 @@
7
7
 
8
8
  Object.defineProperty(exports, '__esModule', { value: true });
9
9
 
10
- const index = require('./index-210f861c.js');
10
+ const index = require('./index-54d11f50.js');
11
11
  const helpers = require('./helpers-452256e8.js');
12
12
 
13
13
  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}";
@@ -7,7 +7,7 @@
7
7
 
8
8
  Object.defineProperty(exports, '__esModule', { value: true });
9
9
 
10
- const index = require('./index-210f861c.js');
10
+ const index = require('./index-54d11f50.js');
11
11
  const helpers = require('./helpers-452256e8.js');
12
12
 
13
13
  const tableHeadCss = ":host([hidden]){display:none !important}:host{display:contents}.qds-table-head{box-sizing:border-box}";
@@ -7,7 +7,7 @@
7
7
 
8
8
  Object.defineProperty(exports, '__esModule', { value: true });
9
9
 
10
- const index = require('./index-210f861c.js');
10
+ const index = require('./index-54d11f50.js');
11
11
  const helpers = require('./helpers-452256e8.js');
12
12
 
13
13
  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}";
@@ -7,7 +7,7 @@
7
7
 
8
8
  Object.defineProperty(exports, '__esModule', { value: true });
9
9
 
10
- const index = require('./index-210f861c.js');
10
+ const index = require('./index-54d11f50.js');
11
11
  const helpers = require('./helpers-452256e8.js');
12
12
 
13
13
  const tableCss = ":host([hidden]){display:none !important}:host{display:contents}.qds-table{border-collapse:collapse;border-spacing:0;box-sizing:border-box}";
@@ -7,7 +7,7 @@
7
7
 
8
8
  Object.defineProperty(exports, '__esModule', { value: true });
9
9
 
10
- const index = require('./index-210f861c.js');
10
+ const index = require('./index-54d11f50.js');
11
11
  const helpers = require('./helpers-452256e8.js');
12
12
 
13
13
  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)}";
@@ -49,7 +49,7 @@ const TextArea = class {
49
49
  this.onInvalid = () => {
50
50
  this.invalid = true;
51
51
  };
52
- this.invalid = undefined;
52
+ this.invalid = false;
53
53
  this.size = 'standard';
54
54
  this.autoCapitalize = undefined;
55
55
  this.autoComplete = undefined;
@@ -153,7 +153,7 @@ const TextArea = class {
153
153
  };
154
154
  }
155
155
  render() {
156
- return (index.h("textarea", { "aria-invalid": this.invalid ?? false ? 'true' : 'false', autoCapitalize: this.autoCapitalize, autoComplete: this.autoComplete,
156
+ return (index.h("textarea", { "aria-invalid": this.invalid.toString(), autoCapitalize: this.autoCapitalize, autoComplete: this.autoComplete,
157
157
  // eslint-disable-next-line jsx-a11y/no-autofocus
158
158
  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 }, index.h("slot", null)));
159
159
  }
@@ -1 +1 @@
1
- {"file":"qds-textarea.entry.cjs.js","mappings":"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","names":["pickFocusEventAttributes","invariant","pickInputEventAttributes","inheritAriaAttributes","inheritAttributes","h"],"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}
1
+ {"file":"qds-textarea.entry.cjs.js","mappings":"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","names":["pickFocusEventAttributes","invariant","pickInputEventAttributes","inheritAriaAttributes","inheritAttributes","h"],"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}
@@ -7,7 +7,7 @@
7
7
 
8
8
  Object.defineProperty(exports, '__esModule', { value: true });
9
9
 
10
- const index = require('./index-210f861c.js');
10
+ const index = require('./index-54d11f50.js');
11
11
  const helpers = require('./helpers-452256e8.js');
12
12
 
13
13
  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 )}";
@@ -7,7 +7,7 @@
7
7
 
8
8
  Object.defineProperty(exports, '__esModule', { value: true });
9
9
 
10
- const index = require('./index-210f861c.js');
10
+ const index = require('./index-54d11f50.js');
11
11
  const floatingUi_dom_esm = require('./floating-ui.dom.esm-93efaa21.js');
12
12
  const helpers = require('./helpers-452256e8.js');
13
13
 
@@ -7,10 +7,10 @@
7
7
 
8
8
  Object.defineProperty(exports, '__esModule', { value: true });
9
9
 
10
- const index = require('./index-210f861c.js');
10
+ const index = require('./index-54d11f50.js');
11
11
 
12
12
  /*
13
- Stencil Client Patch Browser v4.2.1 | MIT Licensed | https://stenciljs.com
13
+ Stencil Client Patch Browser v4.6.0 | MIT Licensed | https://stenciljs.com
14
14
  */
15
15
  const patchBrowser = () => {
16
16
  const importMeta = (typeof document === 'undefined' ? new (require('u' + 'rl').URL)('file:' + __filename).href : (document.currentScript && document.currentScript.src || new URL('qds.cjs.js', document.baseURI).href));
@@ -22,7 +22,7 @@ const patchBrowser = () => {
22
22
  };
23
23
 
24
24
  patchBrowser().then(options => {
25
- return index.bootstrapLazy([["qds-checkbox.cjs",[[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.cjs",[[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.cjs",[[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.cjs",[[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.cjs",[[1,"qds-form-message",{"inline":[4],"size":[513],"status":[1],"text":[513]}]]],["qds-inline-link.cjs",[[17,"qds-inline-link",{"disabled":[1540],"download":[8],"href":[1],"hreflang":[1],"referrerPolicy":[1,"referrerpolicy"],"rel":[1],"target":[1]},[[0,"click","onClick"]]]]],["qds-select.cjs",[[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.cjs",[[1,"qds-title",{"iconName":[513,"icon-name"],"iconLibrary":[513,"icon-library"],"kicker":[1],"layer":[1],"level":[1],"subtitle":[1],"tag":[1]}]]],["qds-dialog.cjs",[[1,"qds-dialog",{"open":[1540],"show":[64],"close":[64]}]]],["qds-divider.cjs",[[1,"qds-divider",{"importance":[513]}]]],["qds-dropdown.cjs",[[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.cjs",[[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.cjs",[[1,"qds-table"]]],["qds-table-body.cjs",[[1,"qds-table-body"]]],["qds-table-cell.cjs",[[1,"qds-table-cell",{"colSpan":[2,"colspan"],"rowSpan":[2,"rowspan"]}]]],["qds-table-head.cjs",[[1,"qds-table-head"]]],["qds-table-head-cell.cjs",[[1,"qds-table-head-cell",{"abbr":[1],"colSpan":[2,"colspan"],"rowSpan":[2,"rowspan"],"scope":[1]}]]],["qds-table-row.cjs",[[1,"qds-table-row"]]],["qds-textarea.cjs",[[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.cjs",[[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.cjs",[[1,"qds-label",{"inline":[4],"required":[4],"size":[513],"text":[513]}]]],["qds-icon.cjs",[[1,"qds-icon",{"name":[513],"library":[513],"svg":[32]}]]]], options);
25
+ return index.bootstrapLazy([["qds-checkbox.cjs",[[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.cjs",[[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.cjs",[[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.cjs",[[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.cjs",[[1,"qds-form-message",{"inline":[4],"size":[513],"status":[1],"text":[513]}]]],["qds-inline-link.cjs",[[17,"qds-inline-link",{"disabled":[1540],"download":[8],"href":[1],"hreflang":[1],"referrerPolicy":[1,"referrerpolicy"],"rel":[1],"target":[1]},[[0,"click","onClick"]]]]],["qds-select.cjs",[[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.cjs",[[1,"qds-title",{"iconName":[513,"icon-name"],"iconLibrary":[513,"icon-library"],"kicker":[1],"layer":[1],"level":[1],"subtitle":[1],"tag":[1]}]]],["qds-dialog.cjs",[[1,"qds-dialog",{"open":[1540],"show":[64],"close":[64]},null,{"open":["openChanged"]}]]],["qds-divider.cjs",[[1,"qds-divider",{"importance":[513]}]]],["qds-dropdown.cjs",[[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.cjs",[[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.cjs",[[1,"qds-table"]]],["qds-table-body.cjs",[[1,"qds-table-body"]]],["qds-table-cell.cjs",[[1,"qds-table-cell",{"colSpan":[2,"colspan"],"rowSpan":[2,"rowspan"]}]]],["qds-table-head.cjs",[[1,"qds-table-head"]]],["qds-table-head-cell.cjs",[[1,"qds-table-head-cell",{"abbr":[1],"colSpan":[2,"colspan"],"rowSpan":[2,"rowspan"],"scope":[1]}]]],["qds-table-row.cjs",[[1,"qds-table-row"]]],["qds-textarea.cjs",[[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.cjs",[[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.cjs",[[1,"qds-label",{"inline":[4],"required":[4],"size":[513],"text":[513]}]]],["qds-icon.cjs",[[1,"qds-icon",{"name":[513],"library":[513],"svg":[32]},null,{"name":["setIcon"],"library":["setIcon"]}]]]], options);
26
26
  });
27
27
 
28
28
  exports.setNonce = index.setNonce;
@@ -1 +1 @@
1
- {"file":"qds.cjs.js","mappings":";;;;;;;;;;;AAAA;AACA;AACA;AAGA,MAAM,YAAY,GAAG,MAAM;AAyB3B,IAAI,MAAM,UAAU,GAAG,qMAAe,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,OAAOA,oBAAc,CAAC,IAAI,CAAC,CAAC;AAChC,CAAC;;AChCD,YAAY,EAAE,CAAC,IAAI,CAAC,OAAO,IAAI;AAE/B,EAAE,OAAOC,mBAAa,CAAC,4BAA4B,EAAE,OAAO,CAAC,CAAC;AAC9D,CAAC,CAAC;;;;","names":["promiseResolve","bootstrapLazy"],"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}
1
+ {"file":"qds.cjs.js","mappings":";;;;;;;;;;;AAAA;AACA;AACA;AAGA,MAAM,YAAY,GAAG,MAAM;AAa3B,IAAI,MAAM,UAAU,GAAG,qMAAe,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,OAAOA,oBAAc,CAAC,IAAI,CAAC,CAAC;AAChC,CAAC;;ACpBD,YAAY,EAAE,CAAC,IAAI,CAAC,OAAO,IAAI;AAE/B,EAAE,OAAOC,mBAAa,CAAC,4BAA4B,EAAE,OAAO,CAAC,CAAC;AAC9D,CAAC,CAAC;;;;","names":["promiseResolve","bootstrapLazy"],"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}
@@ -251,14 +251,26 @@
251
251
  },
252
252
  {
253
253
  "kind": "method",
254
- "name": "render",
255
- "privacy": "public"
254
+ "name": "onClick",
255
+ "privacy": "protected",
256
+ "return": {
257
+ "type": {
258
+ "text": "void"
259
+ }
260
+ },
261
+ "parameters": [
262
+ {
263
+ "name": "event",
264
+ "type": {
265
+ "text": "MouseEvent"
266
+ }
267
+ }
268
+ ]
256
269
  },
257
270
  {
258
- "kind": "field",
259
- "name": "onClick",
260
- "privacy": "private",
261
- "readonly": true
271
+ "kind": "method",
272
+ "name": "render",
273
+ "privacy": "public"
262
274
  },
263
275
  {
264
276
  "kind": "field",
@@ -2044,9 +2056,10 @@
2044
2056
  "kind": "field",
2045
2057
  "name": "invalid",
2046
2058
  "type": {
2047
- "text": "boolean | undefined"
2059
+ "text": "boolean"
2048
2060
  },
2049
2061
  "privacy": "public",
2062
+ "default": "false",
2050
2063
  "description": "Defines if the input is in an invalid state. Validity is determined by\nattributes such as `type`, `pattern`, `min`, `max`, `required`, `step`,\n`minlength`, and `maxlength` using\n[constraint validation](https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation)."
2051
2064
  },
2052
2065
  {
@@ -2542,10 +2555,7 @@
2542
2555
  "attributes": [
2543
2556
  {
2544
2557
  "name": "invalid",
2545
- "fieldName": "invalid",
2546
- "type": {
2547
- "text": "boolean"
2548
- }
2558
+ "fieldName": "invalid"
2549
2559
  },
2550
2560
  {
2551
2561
  "name": "size",
@@ -2791,7 +2801,7 @@
2791
2801
  "kind": "field",
2792
2802
  "name": "size",
2793
2803
  "type": {
2794
- "text": "LabelSize"
2804
+ "text": "LabelSize | undefined"
2795
2805
  },
2796
2806
  "privacy": "public",
2797
2807
  "readonly": true,
@@ -2910,7 +2920,7 @@
2910
2920
  "kind": "field",
2911
2921
  "name": "size",
2912
2922
  "type": {
2913
- "text": "RadioSize"
2923
+ "text": "RadioSize | undefined"
2914
2924
  },
2915
2925
  "privacy": "public",
2916
2926
  "readonly": true,
@@ -3019,6 +3029,15 @@
3019
3029
  "privacy": "private",
3020
3030
  "readonly": true
3021
3031
  },
3032
+ {
3033
+ "kind": "field",
3034
+ "name": "computedSize",
3035
+ "type": {
3036
+ "text": "RadioSize"
3037
+ },
3038
+ "privacy": "private",
3039
+ "readonly": true
3040
+ },
3022
3041
  {
3023
3042
  "kind": "field",
3024
3043
  "name": "hasText",
@@ -3205,7 +3224,7 @@
3205
3224
  "kind": "field",
3206
3225
  "name": "size",
3207
3226
  "type": {
3208
- "text": "SelectSize"
3227
+ "text": "SelectSize | undefined"
3209
3228
  },
3210
3229
  "privacy": "public",
3211
3230
  "readonly": true,
@@ -3313,6 +3332,15 @@
3313
3332
  },
3314
3333
  "privacy": "private"
3315
3334
  },
3335
+ {
3336
+ "kind": "field",
3337
+ "name": "computedSize",
3338
+ "type": {
3339
+ "text": "SelectSize"
3340
+ },
3341
+ "privacy": "private",
3342
+ "readonly": true
3343
+ },
3316
3344
  {
3317
3345
  "kind": "method",
3318
3346
  "name": "addItem",
@@ -4423,9 +4451,10 @@
4423
4451
  "kind": "field",
4424
4452
  "name": "invalid",
4425
4453
  "type": {
4426
- "text": "boolean | undefined"
4454
+ "text": "boolean"
4427
4455
  },
4428
4456
  "privacy": "public",
4457
+ "default": "false",
4429
4458
  "description": "Defines if the textarea is in an invalid state. Validity is determined by\nattributes such as `required`, `minlength`, and `maxlength` using\n[constraint validation][].\n\n[constraint validation]: https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation"
4430
4459
  },
4431
4460
  {
@@ -4838,10 +4867,7 @@
4838
4867
  "attributes": [
4839
4868
  {
4840
4869
  "name": "invalid",
4841
- "fieldName": "invalid",
4842
- "type": {
4843
- "text": "boolean"
4844
- }
4870
+ "fieldName": "invalid"
4845
4871
  },
4846
4872
  {
4847
4873
  "name": "size",