@quartzds/core 1.0.0-beta.90 → 1.0.0-beta.92

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 (187) hide show
  1. package/components/index.js +2 -2
  2. package/components/{p-2806fee1.js → p-50f85f75.js} +6 -30
  3. package/components/p-50f85f75.js.map +1 -0
  4. package/components/{p-fed0d11f.js → p-5570cc30.js} +2 -2
  5. package/components/{p-fed0d11f.js.map → p-5570cc30.js.map} +1 -1
  6. package/components/{p-c80f112a.js → p-70d12c72.js} +7 -24
  7. package/components/p-70d12c72.js.map +1 -0
  8. package/components/{p-ba880369.js → p-72c09714.js} +9 -3
  9. package/components/p-72c09714.js.map +1 -0
  10. package/components/{p-688c90f6.js → p-9ffb4b49.js} +17 -12
  11. package/components/p-9ffb4b49.js.map +1 -0
  12. package/components/{p-fac26e20.js → p-a529eb5c.js} +4 -4
  13. package/components/{p-fac26e20.js.map → p-a529eb5c.js.map} +1 -1
  14. package/components/{p-a020ece3.js → p-b5608061.js} +10 -7
  15. package/components/p-b5608061.js.map +1 -0
  16. package/components/{p-adefd438.js → p-b6c04008.js} +22 -14
  17. package/components/p-b6c04008.js.map +1 -0
  18. package/components/{p-a6310886.js → p-ba860c62.js} +10 -7
  19. package/components/p-ba860c62.js.map +1 -0
  20. package/components/{p-3c48ff53.js → p-e22dd76d.js} +2 -2
  21. package/components/{p-3c48ff53.js.map → p-e22dd76d.js.map} +1 -1
  22. package/components/{p-b4c302d4.js → p-e2a9e441.js} +3 -3
  23. package/components/{p-b4c302d4.js.map → p-e2a9e441.js.map} +1 -1
  24. package/components/qds-badge-counter.js +1 -1
  25. package/components/qds-badge-indicator.js +1 -1
  26. package/components/qds-breadcrumb-item.js +7 -4
  27. package/components/qds-breadcrumb-item.js.map +1 -1
  28. package/components/qds-button.js +1 -1
  29. package/components/qds-checkbox.js +1 -1
  30. package/components/qds-chip.js +12 -9
  31. package/components/qds-chip.js.map +1 -1
  32. package/components/qds-dialog.js +3 -3
  33. package/components/qds-dialog.js.map +1 -1
  34. package/components/qds-divider.js +1 -1
  35. package/components/qds-dropdown.js +3 -3
  36. package/components/qds-form-message.js +4 -4
  37. package/components/qds-icon.js +1 -1
  38. package/components/qds-inline-link.js +4 -4
  39. package/components/qds-input.js +43 -17
  40. package/components/qds-input.js.map +1 -1
  41. package/components/qds-label.js +1 -1
  42. package/components/qds-list-item.js +7 -7
  43. package/components/qds-list-item.js.map +1 -1
  44. package/components/qds-loader.js +3 -3
  45. package/components/qds-nav-list-item.js +6 -6
  46. package/components/qds-progress-bar.js +3 -3
  47. package/components/qds-radio.js +7 -7
  48. package/components/qds-radio.js.map +1 -1
  49. package/components/qds-select.js +3 -3
  50. package/components/qds-standalone-link.js +4 -4
  51. package/components/qds-switch.js +5 -5
  52. package/components/qds-switch.js.map +1 -1
  53. package/components/qds-tab.js +7 -7
  54. package/components/qds-tabbar.js +7 -7
  55. package/components/qds-table-body.js +2 -2
  56. package/components/qds-table-cell.js +2 -2
  57. package/components/qds-table-head-cell.js +1 -1
  58. package/components/qds-table-head.js +2 -2
  59. package/components/qds-table-row.js +2 -2
  60. package/components/qds-table.js +2 -2
  61. package/components/qds-tag.js +1 -1
  62. package/components/qds-textarea.js +1 -1
  63. package/components/qds-title.js +1 -1
  64. package/components/qds-tooltip.js +1 -1
  65. package/dist/cjs/{index-523dd2e0.js → index-dbcccf98.js} +6 -29
  66. package/dist/cjs/index-dbcccf98.js.map +1 -0
  67. package/dist/cjs/index.cjs.js +2 -2
  68. package/dist/cjs/{library-41b19b9e.js → library-23467d99.js} +8 -2
  69. package/dist/cjs/library-23467d99.js.map +1 -0
  70. package/dist/cjs/loader.cjs.js +2 -2
  71. package/dist/cjs/qds-badge-counter_2.cjs.entry.js +1 -1
  72. package/dist/cjs/qds-breadcrumb-item.cjs.entry.js +6 -3
  73. package/dist/cjs/qds-breadcrumb-item.cjs.entry.js.map +1 -1
  74. package/dist/cjs/qds-button.cjs.entry.js +17 -9
  75. package/dist/cjs/qds-button.cjs.entry.js.map +1 -1
  76. package/dist/cjs/qds-checkbox.cjs.entry.js +12 -8
  77. package/dist/cjs/qds-checkbox.cjs.entry.js.map +1 -1
  78. package/dist/cjs/qds-chip.cjs.entry.js +10 -7
  79. package/dist/cjs/qds-chip.cjs.entry.js.map +1 -1
  80. package/dist/cjs/qds-dialog.cjs.entry.js +3 -3
  81. package/dist/cjs/qds-dialog.cjs.entry.js.map +1 -1
  82. package/dist/cjs/qds-divider.cjs.entry.js +2 -2
  83. package/dist/cjs/qds-dropdown.cjs.entry.js +3 -3
  84. package/dist/cjs/qds-form-message.cjs.entry.js +3 -3
  85. package/dist/cjs/qds-icon.cjs.entry.js +3 -3
  86. package/dist/cjs/qds-inline-link.cjs.entry.js +3 -3
  87. package/dist/cjs/qds-input.cjs.entry.js +36 -11
  88. package/dist/cjs/qds-input.cjs.entry.js.map +1 -1
  89. package/dist/cjs/qds-label.cjs.entry.js +8 -5
  90. package/dist/cjs/qds-label.cjs.entry.js.map +1 -1
  91. package/dist/cjs/qds-list-item.cjs.entry.js +3 -3
  92. package/dist/cjs/qds-list-item.cjs.entry.js.map +1 -1
  93. package/dist/cjs/qds-loader.cjs.entry.js +2 -2
  94. package/dist/cjs/qds-nav-list-item.cjs.entry.js +4 -4
  95. package/dist/cjs/qds-progress-bar.cjs.entry.js +3 -3
  96. package/dist/cjs/qds-radio.cjs.entry.js +4 -4
  97. package/dist/cjs/qds-radio.cjs.entry.js.map +1 -1
  98. package/dist/cjs/qds-select.cjs.entry.js +2 -2
  99. package/dist/cjs/qds-standalone-link.cjs.entry.js +3 -3
  100. package/dist/cjs/qds-switch.cjs.entry.js +5 -5
  101. package/dist/cjs/qds-switch.cjs.entry.js.map +1 -1
  102. package/dist/cjs/qds-tab.cjs.entry.js +1 -1
  103. package/dist/cjs/qds-tabbar.cjs.entry.js +1 -1
  104. package/dist/cjs/qds-table-body.cjs.entry.js +2 -2
  105. package/dist/cjs/qds-table-cell.cjs.entry.js +2 -2
  106. package/dist/cjs/qds-table-head-cell.cjs.entry.js +1 -1
  107. package/dist/cjs/qds-table-head.cjs.entry.js +2 -2
  108. package/dist/cjs/qds-table-row.cjs.entry.js +2 -2
  109. package/dist/cjs/qds-table.cjs.entry.js +2 -2
  110. package/dist/cjs/qds-tag_2.cjs.entry.js +8 -5
  111. package/dist/cjs/qds-tag_2.cjs.entry.js.map +1 -1
  112. package/dist/cjs/qds-textarea.cjs.entry.js +1 -1
  113. package/dist/cjs/qds-tooltip.cjs.entry.js +6 -21
  114. package/dist/cjs/qds-tooltip.cjs.entry.js.map +1 -1
  115. package/dist/cjs/qds.cjs.js +2 -2
  116. package/dist/custom-elements.json +70 -22
  117. package/dist/docs.json +30 -9
  118. package/dist/esm/{index-b1d6acd2.js → index-bc9462c1.js} +6 -30
  119. package/dist/esm/index-bc9462c1.js.map +1 -0
  120. package/dist/esm/index.js +2 -2
  121. package/dist/esm/{library-2e5458af.js → library-52ae166a.js} +8 -2
  122. package/dist/esm/library-52ae166a.js.map +1 -0
  123. package/dist/esm/loader.js +3 -3
  124. package/dist/esm/qds-badge-counter_2.entry.js +1 -1
  125. package/dist/esm/qds-breadcrumb-item.entry.js +6 -3
  126. package/dist/esm/qds-breadcrumb-item.entry.js.map +1 -1
  127. package/dist/esm/qds-button.entry.js +17 -9
  128. package/dist/esm/qds-button.entry.js.map +1 -1
  129. package/dist/esm/qds-checkbox.entry.js +12 -8
  130. package/dist/esm/qds-checkbox.entry.js.map +1 -1
  131. package/dist/esm/qds-chip.entry.js +10 -7
  132. package/dist/esm/qds-chip.entry.js.map +1 -1
  133. package/dist/esm/qds-dialog.entry.js +3 -3
  134. package/dist/esm/qds-dialog.entry.js.map +1 -1
  135. package/dist/esm/qds-divider.entry.js +2 -2
  136. package/dist/esm/qds-dropdown.entry.js +3 -3
  137. package/dist/esm/qds-form-message.entry.js +3 -3
  138. package/dist/esm/qds-icon.entry.js +3 -3
  139. package/dist/esm/qds-inline-link.entry.js +3 -3
  140. package/dist/esm/qds-input.entry.js +36 -11
  141. package/dist/esm/qds-input.entry.js.map +1 -1
  142. package/dist/esm/qds-label.entry.js +8 -5
  143. package/dist/esm/qds-label.entry.js.map +1 -1
  144. package/dist/esm/qds-list-item.entry.js +3 -3
  145. package/dist/esm/qds-list-item.entry.js.map +1 -1
  146. package/dist/esm/qds-loader.entry.js +2 -2
  147. package/dist/esm/qds-nav-list-item.entry.js +4 -4
  148. package/dist/esm/qds-progress-bar.entry.js +3 -3
  149. package/dist/esm/qds-radio.entry.js +4 -4
  150. package/dist/esm/qds-radio.entry.js.map +1 -1
  151. package/dist/esm/qds-select.entry.js +2 -2
  152. package/dist/esm/qds-standalone-link.entry.js +3 -3
  153. package/dist/esm/qds-switch.entry.js +5 -5
  154. package/dist/esm/qds-switch.entry.js.map +1 -1
  155. package/dist/esm/qds-tab.entry.js +1 -1
  156. package/dist/esm/qds-tabbar.entry.js +1 -1
  157. package/dist/esm/qds-table-body.entry.js +2 -2
  158. package/dist/esm/qds-table-cell.entry.js +2 -2
  159. package/dist/esm/qds-table-head-cell.entry.js +1 -1
  160. package/dist/esm/qds-table-head.entry.js +2 -2
  161. package/dist/esm/qds-table-row.entry.js +2 -2
  162. package/dist/esm/qds-table.entry.js +2 -2
  163. package/dist/esm/qds-tag_2.entry.js +8 -5
  164. package/dist/esm/qds-tag_2.entry.js.map +1 -1
  165. package/dist/esm/qds-textarea.entry.js +1 -1
  166. package/dist/esm/qds-tooltip.entry.js +6 -21
  167. package/dist/esm/qds-tooltip.entry.js.map +1 -1
  168. package/dist/esm/qds.js +3 -3
  169. package/dist/types/components/checkbox/checkbox.d.ts +8 -1
  170. package/dist/types/components/input/input.d.ts +1 -0
  171. package/dist/types/components/tooltip/tooltip.d.ts +0 -2
  172. package/dist/types/components.d.ts +20 -4
  173. package/dist/vscode.html-custom-data.json +5 -1
  174. package/hydrate/index.js +149 -125
  175. package/hydrate/index.mjs +149 -125
  176. package/package.json +1 -1
  177. package/components/p-2806fee1.js.map +0 -1
  178. package/components/p-688c90f6.js.map +0 -1
  179. package/components/p-a020ece3.js.map +0 -1
  180. package/components/p-a6310886.js.map +0 -1
  181. package/components/p-adefd438.js.map +0 -1
  182. package/components/p-ba880369.js.map +0 -1
  183. package/components/p-c80f112a.js.map +0 -1
  184. package/dist/cjs/index-523dd2e0.js.map +0 -1
  185. package/dist/cjs/library-41b19b9e.js.map +0 -1
  186. package/dist/esm/index-b1d6acd2.js.map +0 -1
  187. package/dist/esm/library-2e5458af.js.map +0 -1
@@ -1 +1 @@
1
- {"file":"qds-list-item.js","mappings":"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","names":[],"sources":["src/components/list-item/list-item.css?tag=qds-list-item&encapsulation=shadow","src/components/list-item/list-item.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2024 Schneider Electric\n *\n * SPDX-License-Identifier: Apache-2.0\n */\n\n@import url('../shared.css');\n\n:host {\n display: block;\n}\n\n.qds-disabled {\n opacity: var(--qds-theme-disabled);\n pointer-events: none;\n}\n\n.qds-list-item,\n.qds-indented-content {\n align-items: center;\n box-sizing: border-box;\n display: flex;\n}\n\n.qds-list-action {\n pointer-events: none;\n}\n\n.qds-indented-content {\n flex: 1 0;\n align-self: stretch;\n}\n\n.qds-destination {\n transform: scaleX(var(--qds-direction-factor, 1));\n}\n\n.qds-divider {\n border-block-end: var(--qds-list-border-width) solid\n var(--qds-theme-divider-standard);\n}\n\n.qds-icon {\n color: var(--qds-theme-text-standard);\n}\n\n.qds-texts {\n justify-items: center;\n display: flex;\n flex: 1 0;\n flex-direction: column;\n padding: 0;\n position: relative;\n}\n\n.qds-input {\n appearance: none;\n background: none;\n border: none;\n border-radius: var(--qds-control-border-radius);\n inset: 0;\n margin: 0;\n outline: none;\n position: absolute;\n}\n\n.qds-title {\n color: var(--qds-theme-title);\n}\n\n.qds-subtitle {\n color: var(--qds-theme-subtitle);\n}\n\n.qds-kicker {\n color: var(--qds-theme-kicker);\n}\n\n[data-size='small'] {\n &.qds-list-item {\n gap: var(--qds-list-item-small-gap-internal);\n padding-inline-start: var(--qds-list-item-small-padding-horizontal);\n }\n\n .qds-indented-content {\n gap: var(--qds-list-item-small-gap-internal);\n min-height: var(--qds-list-item-small-height);\n padding-block: var(--qds-list-item-small-padding-vertical);\n padding-inline-end: var(--qds-list-item-small-padding-horizontal);\n }\n\n .qds-icon {\n font-size: var(--qds-control-small-icon-size);\n }\n\n .qds-main-icon {\n font-size: var(--qds-list-item-small-icon-size);\n }\n\n .qds-texts {\n gap: var(--qds-list-item-small-titles-gap);\n }\n\n .qds-kicker {\n font: var(--qds-list-item-small-kicker);\n }\n\n .qds-title {\n font: var(--qds-list-item-small-title);\n }\n\n .qds-subtitle {\n font: var(--qds-list-item-small-subtitle);\n }\n}\n\n[data-size='standard'] {\n &.qds-list-item {\n gap: var(--qds-list-item-standard-gap-internal);\n padding-inline-start: var(--qds-list-item-standard-padding-horizontal);\n }\n\n .qds-indented-content {\n gap: var(--qds-list-item-standard-gap-internal);\n min-height: var(--qds-list-item-standard-height);\n padding-block: var(--qds-list-item-standard-padding-vertical);\n padding-inline-end: var(--qds-list-item-standard-padding-horizontal);\n }\n\n .qds-icon {\n font-size: var(--qds-control-standard-icon-size);\n }\n\n .qds-main-icon {\n font-size: var(--qds-list-item-standard-icon-size);\n }\n\n .qds-texts {\n gap: var(--qds-list-item-standard-titles-gap);\n }\n\n .qds-kicker {\n font: var(--qds-list-item-standard-kicker);\n }\n\n .qds-title {\n font: var(--qds-list-item-standard-title);\n }\n\n .qds-subtitle {\n font: var(--qds-list-item-standard-subtitle);\n }\n}\n\n[data-size='large'] {\n &.qds-list-item {\n gap: var(--qds-list-item-large-gap-internal);\n padding-inline-start: var(--qds-list-item-large-padding-horizontal);\n }\n\n .qds-indented-content {\n gap: var(--qds-list-item-large-gap-internal);\n min-height: var(--qds-list-item-large-height);\n padding-block: var(--qds-list-item-large-padding-vertical);\n padding-inline-end: var(--qds-list-item-large-padding-horizontal);\n }\n\n .qds-icon {\n font-size: var(--qds-control-large-icon-size);\n }\n\n .qds-main-icon {\n font-size: var(--qds-list-item-large-icon-size);\n }\n\n .qds-texts {\n gap: var(--qds-list-item-large-titles-gap);\n }\n\n .qds-kicker {\n font: var(--qds-list-item-large-kicker);\n }\n\n .qds-title {\n font: var(--qds-list-item-large-title);\n }\n\n .qds-subtitle {\n font: var(--qds-list-item-large-subtitle);\n }\n}\n\n.qds-list-item {\n &:hover {\n background-color: var(--qds-theme-interactive-background-hover);\n }\n\n &:active {\n background-color: var(--qds-theme-interactive-background-pressed);\n }\n\n &:has(input: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\n.qds-selected {\n &.qds-list-item {\n background-color: var(--qds-theme-interactive-background-selected);\n }\n\n &[data-size='small'] .qds-title {\n font: var(--qds-list-item-small-title-emphasized);\n }\n\n &[data-size='standard'] .qds-title {\n font: var(--qds-list-item-standard-title-emphasized);\n }\n\n &[data-size='large'] .qds-title {\n font: var(--qds-list-item-large-title-emphasized);\n }\n}\n\n:host(:last-of-type) {\n .qds-divider {\n border-block-end: none;\n }\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface, EventEmitter } from '@stencil/core'\nimport {\n Component,\n Element,\n Event,\n h,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core'\n\nimport type { Attributes, QdsFocusEventDetail } from '../../helpers'\nimport { inheritAriaAttributes, pickFocusEventAttributes } from '../../helpers'\nimport type { Size } from '../shared'\n\nexport type Destination = 'navigation'\nexport type ListAction = 'multiselect' | 'reorder'\nexport type Divider = 'hide' | 'indent'\n\n/**\n *\n *\n * @see https://quartz.se.com/build/components/list-item\n */\n@Component({\n tag: 'qds-list-item',\n shadow: { delegatesFocus: true },\n styleUrl: 'list-item.css',\n})\nexport class ListItem implements ComponentInterface {\n /**\n * The destination action that the list item denotes through its rightmost icon.\n */\n @Prop() public readonly destination?: Destination\n\n /**\n * Prevents the list item from being interacted with: it cannot be selected\n * or focused.\n */\n @Prop() public readonly disabled: boolean = false\n\n /**\n * Control how to display the bottom divider line.\n *\n * By default, the divider is visible and uses the full width of the list item.\n *\n * Use the `hide` value to hide the divider completely (useful with multiselect).\n *\n * Use the `indent` value to align the left end of the divider to the icon/text (useful on mobile).\n *\n * **Note**: the divider is automatically hidden on the last list item in the parent container.\n */\n @Prop() public readonly divider?: Divider\n\n /**\n * The name of the icon to render.\n *\n * Available names depend on the icon library being used.\n */\n @Prop() public readonly iconName?: string\n\n /**\n * The name of a registered icon library.\n */\n @Prop() public readonly iconLibrary: string = 'default'\n\n /**\n * Text to display for the kicker.\n */\n @Prop() public readonly kicker?: string\n\n /**\n * The type of list-level action that the list item supports\n */\n @Prop() public readonly listAction?: ListAction\n\n /**\n * The list items's size.\n */\n @Prop() public readonly size?: Size = 'standard'\n\n /**\n * Whether or not the list item is checked when `list-action=\"multiselect\"`\n */\n @Prop({ mutable: true }) public checked?: boolean\n\n /**\n * Whether or not the list item is selected.\n */\n @Prop({ mutable: true }) public selected?: boolean\n\n /**\n * Sets the list item to an indeterminate state, only when `list-action=\"indeterminate\"`.\n * This is usually applied to items that represent a \"select all/none\" behavior when associated\n * items have a mix of selected and unselected states.\n *\n * @webnative\n */\n @Prop({ mutable: true }) public indeterminate?: boolean\n\n /**\n * The primary text of the list item.\n */\n @Prop() public readonly text!: string\n\n /**\n * Text to display below the primary text.\n */\n @Prop() public readonly subtitle?: string\n\n /**\n * Emitted when the list item 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 checkbox'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 list item gains focus.\n */\n @Event({ eventName: 'qdsFocus', bubbles: false, cancelable: false })\n private readonly focusEmitter!: EventEmitter<QdsFocusEventDetail>\n\n @Element() private readonly host!: HTMLElement\n\n @State() private tabIndex?: number\n\n private inheritedAttributes: Attributes = {}\n\n get #computedDestination(): Destination | undefined {\n switch (this.destination) {\n case 'navigation': {\n return this.destination\n }\n default: {\n return undefined\n }\n }\n }\n\n get #computedDivider(): Divider | undefined {\n switch (this.divider) {\n case 'hide':\n case 'indent': {\n return this.divider\n }\n default: {\n return undefined\n }\n }\n }\n\n get #computedIndeterminate(): boolean {\n return this.indeterminate ?? false\n }\n\n get #computedListAction(): ListAction | undefined {\n switch (this.listAction) {\n case 'reorder':\n case 'multiselect': {\n return this.listAction\n }\n default: {\n return undefined\n }\n }\n }\n\n get #computedSelected(): boolean {\n return this.selected ?? false\n }\n\n get #computedChecked(): boolean {\n return this.checked ?? false\n }\n\n get #computedSize(): Size {\n switch (this.size) {\n case 'standard':\n case 'small':\n case 'large': {\n return this.size\n }\n default: {\n return 'standard'\n }\n }\n }\n\n @Listen('click')\n protected onClick(event: MouseEvent): void {\n if (this.disabled) {\n event.stopImmediatePropagation()\n return\n }\n\n // Always prevent default behavior to avoid the internal `<input>`\n // to toggle `checked` state inappropriately.\n //\n // Note that this will need adjustments once we add the `item-action` slot.\n event.preventDefault()\n\n if (this.listAction === 'multiselect') {\n this.checked = this.#computedIndeterminate ? true : !this.#computedChecked\n this.changeEmitter.emit()\n this.indeterminate = false\n }\n }\n\n @Watch('tabindex')\n protected tabindexChanged(newValue: string): void {\n const parsedValue = Number.parseInt(newValue, 10)\n this.tabIndex =\n parsedValue === 0 || Number.isNaN(parsedValue) ? undefined : parsedValue\n }\n\n public componentWillLoad(): void {\n this.inheritedAttributes = inheritAriaAttributes(this.host)\n this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0')\n }\n\n public render() {\n return (\n /* eslint-disable jsx-a11y/label-has-associated-control */\n // eslint-disable-next-line jsx-a11y/no-redundant-roles\n <li\n class={{\n 'qds-list-item': true,\n 'qds-disabled': this.disabled,\n 'qds-divider': this.#computedDivider === undefined,\n 'qds-multiselect': this.#computedListAction === 'multiselect',\n 'qds-selected': this.#computedSelected,\n 'qds-checked': this.#computedChecked,\n }}\n data-size={this.#computedSize}\n role=\"listitem\" // Required because it can't be a direct child of a list element (<ul>, <ol>, or <menu>).\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...this.inheritedAttributes}\n >\n {this.#computedListAction === 'multiselect' && (\n <qds-checkbox\n checked={this.checked}\n class=\"qds-list-action\"\n indeterminate={this.indeterminate}\n size={this.size}\n tabIndex={-1}\n />\n )}\n {this.#computedListAction === 'reorder' && (\n <qds-icon\n aria-hidden=\"true\"\n class=\"qds-icon qds-list-action\"\n library=\"core\"\n name={this.#computedListAction}\n />\n )}\n\n <div\n class={{\n 'qds-indented-content': true,\n 'qds-divider': this.#computedDivider === 'indent',\n }}\n >\n {this.iconName !== undefined && this.iconName !== '' && (\n <qds-icon\n aria-hidden=\"true\"\n class=\"qds-icon qds-main-icon\"\n library={this.iconLibrary}\n name={this.iconName}\n />\n )}\n\n <label class=\"qds-texts\">\n <input\n checked={this.selected}\n class=\"qds-input\"\n disabled={this.disabled}\n indeterminate={this.indeterminate}\n onBlur={this.#onBlur}\n onFocus={this.#onFocus}\n tabIndex={this.disabled ? undefined : this.tabIndex}\n type=\"checkbox\"\n />\n {this.kicker !== undefined && this.kicker !== '' && (\n <div class=\"qds-kicker\">{this.kicker}</div>\n )}\n <div class=\"qds-title\">{this.text}</div>\n {this.subtitle !== undefined && this.subtitle !== '' && (\n <div class=\"qds-subtitle\">{this.subtitle}</div>\n )}\n </label>\n {this.#computedDestination !== undefined && (\n <qds-icon\n aria-hidden=\"true\"\n class=\"qds-icon qds-destination\"\n library=\"core\"\n name={this.#computedDestination}\n />\n )}\n </div>\n </li>\n /* eslint-enable jsx-a11y/label-has-associated-control */\n )\n }\n\n readonly #onBlur = (event: FocusEvent): void => {\n this.blurEmitter.emit(pickFocusEventAttributes(event))\n }\n\n readonly #onFocus = (event: FocusEvent): void => {\n this.focusEmitter.emit(pickFocusEventAttributes(event))\n }\n}\n"],"version":3}
1
+ {"file":"qds-list-item.js","mappings":"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","names":[],"sources":["src/components/list-item/list-item.css?tag=qds-list-item&encapsulation=shadow","src/components/list-item/list-item.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2024 Schneider Electric\n *\n * SPDX-License-Identifier: Apache-2.0\n */\n\n@import url('../shared.css');\n\n:host {\n display: block;\n}\n\n.qds-disabled {\n opacity: var(--qds-theme-disabled);\n pointer-events: none;\n}\n\n.qds-list-item,\n.qds-indented-content {\n align-items: center;\n box-sizing: border-box;\n display: flex;\n}\n\n.qds-list-action {\n pointer-events: none;\n}\n\n.qds-indented-content {\n flex: 1 0;\n align-self: stretch;\n}\n\n.qds-destination {\n transform: scaleX(var(--qds-direction-factor, 1));\n}\n\n.qds-divider {\n border-block-end: var(--qds-list-border-width) solid\n var(--qds-theme-divider-standard);\n}\n\n.qds-icon {\n color: var(--qds-theme-text-standard);\n}\n\n.qds-texts {\n justify-items: center;\n display: flex;\n flex: 1 0;\n flex-direction: column;\n padding: 0;\n position: relative;\n}\n\n.qds-input {\n appearance: none;\n background: none;\n border: none;\n border-radius: var(--qds-control-border-radius);\n inset: 0;\n margin: 0;\n outline: none;\n position: absolute;\n}\n\n.qds-title {\n color: var(--qds-theme-title);\n}\n\n.qds-subtitle {\n color: var(--qds-theme-subtitle);\n}\n\n.qds-kicker {\n color: var(--qds-theme-kicker);\n}\n\n[data-size='small'] {\n &.qds-list-item {\n gap: var(--qds-list-item-small-gap-internal);\n padding-inline-start: var(--qds-list-item-small-padding-horizontal);\n }\n\n .qds-indented-content {\n gap: var(--qds-list-item-small-gap-internal);\n min-height: var(--qds-list-item-small-height);\n padding-block: var(--qds-list-item-small-padding-vertical);\n padding-inline-end: var(--qds-list-item-small-padding-horizontal);\n }\n\n .qds-icon {\n font-size: var(--qds-control-small-icon-size);\n }\n\n .qds-main-icon {\n font-size: var(--qds-list-item-small-icon-size);\n }\n\n .qds-texts {\n gap: var(--qds-list-item-small-titles-gap);\n }\n\n .qds-kicker {\n font: var(--qds-list-item-small-kicker);\n }\n\n .qds-title {\n font: var(--qds-list-item-small-title);\n }\n\n .qds-subtitle {\n font: var(--qds-list-item-small-subtitle);\n }\n}\n\n[data-size='standard'] {\n &.qds-list-item {\n gap: var(--qds-list-item-standard-gap-internal);\n padding-inline-start: var(--qds-list-item-standard-padding-horizontal);\n }\n\n .qds-indented-content {\n gap: var(--qds-list-item-standard-gap-internal);\n min-height: var(--qds-list-item-standard-height);\n padding-block: var(--qds-list-item-standard-padding-vertical);\n padding-inline-end: var(--qds-list-item-standard-padding-horizontal);\n }\n\n .qds-icon {\n font-size: var(--qds-control-standard-icon-size);\n }\n\n .qds-main-icon {\n font-size: var(--qds-list-item-standard-icon-size);\n }\n\n .qds-texts {\n gap: var(--qds-list-item-standard-titles-gap);\n }\n\n .qds-kicker {\n font: var(--qds-list-item-standard-kicker);\n }\n\n .qds-title {\n font: var(--qds-list-item-standard-title);\n }\n\n .qds-subtitle {\n font: var(--qds-list-item-standard-subtitle);\n }\n}\n\n[data-size='large'] {\n &.qds-list-item {\n gap: var(--qds-list-item-large-gap-internal);\n padding-inline-start: var(--qds-list-item-large-padding-horizontal);\n }\n\n .qds-indented-content {\n gap: var(--qds-list-item-large-gap-internal);\n min-height: var(--qds-list-item-large-height);\n padding-block: var(--qds-list-item-large-padding-vertical);\n padding-inline-end: var(--qds-list-item-large-padding-horizontal);\n }\n\n .qds-icon {\n font-size: var(--qds-control-large-icon-size);\n }\n\n .qds-main-icon {\n font-size: var(--qds-list-item-large-icon-size);\n }\n\n .qds-texts {\n gap: var(--qds-list-item-large-titles-gap);\n }\n\n .qds-kicker {\n font: var(--qds-list-item-large-kicker);\n }\n\n .qds-title {\n font: var(--qds-list-item-large-title);\n }\n\n .qds-subtitle {\n font: var(--qds-list-item-large-subtitle);\n }\n}\n\n.qds-list-item {\n &:hover {\n background-color: var(--qds-theme-interactive-background-hover);\n }\n\n &:active {\n background-color: var(--qds-theme-interactive-background-pressed);\n }\n\n &:has(input: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\n.qds-selected {\n &.qds-list-item {\n background-color: var(--qds-theme-interactive-background-selected);\n }\n\n &[data-size='small'] .qds-title {\n font: var(--qds-list-item-small-title-emphasized);\n }\n\n &[data-size='standard'] .qds-title {\n font: var(--qds-list-item-standard-title-emphasized);\n }\n\n &[data-size='large'] .qds-title {\n font: var(--qds-list-item-large-title-emphasized);\n }\n}\n\n:host(:last-of-type) {\n .qds-divider {\n border-block-end: none;\n }\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface, EventEmitter } from '@stencil/core'\nimport {\n Component,\n Element,\n Event,\n h,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core'\n\nimport type { Attributes, QdsFocusEventDetail } from '../../helpers'\nimport { inheritAriaAttributes, pickFocusEventAttributes } from '../../helpers'\nimport type { Size } from '../shared'\n\nexport type Destination = 'navigation'\nexport type ListAction = 'multiselect' | 'reorder'\nexport type Divider = 'hide' | 'indent'\n\n/**\n *\n *\n * @see https://quartz.se.com/build/components/list-item\n */\n@Component({\n tag: 'qds-list-item',\n shadow: { delegatesFocus: true },\n styleUrl: 'list-item.css',\n})\nexport class ListItem implements ComponentInterface {\n /**\n * The destination action that the list item denotes through its rightmost icon.\n */\n @Prop() public readonly destination?: Destination\n\n /**\n * Prevents the list item from being interacted with: it cannot be selected\n * or focused.\n */\n @Prop() public readonly disabled: boolean = false\n\n /**\n * Control how to display the bottom divider line.\n *\n * By default, the divider is visible and uses the full width of the list item.\n *\n * Use the `hide` value to hide the divider completely (useful with multiselect).\n *\n * Use the `indent` value to align the left end of the divider to the icon/text (useful on mobile).\n *\n * **Note**: the divider is automatically hidden on the last list item in the parent container.\n */\n @Prop() public readonly divider?: Divider\n\n /**\n * The name of the icon to render.\n *\n * Available names depend on the icon library being used.\n */\n @Prop() public readonly iconName?: string\n\n /**\n * The name of a registered icon library.\n */\n @Prop() public readonly iconLibrary: string = 'default'\n\n /**\n * Text to display for the kicker.\n */\n @Prop() public readonly kicker?: string\n\n /**\n * The type of list-level action that the list item supports\n */\n @Prop() public readonly listAction?: ListAction\n\n /**\n * The list items's size.\n */\n @Prop() public readonly size?: Size = 'standard'\n\n /**\n * Whether or not the list item is checked when `list-action=\"multiselect\"`\n */\n @Prop({ mutable: true }) public checked?: boolean\n\n /**\n * Whether or not the list item is selected.\n */\n @Prop({ mutable: true }) public selected?: boolean\n\n /**\n * Sets the list item to an indeterminate state, only when `list-action=\"indeterminate\"`.\n * This is usually applied to items that represent a \"select all/none\" behavior when associated\n * items have a mix of selected and unselected states.\n *\n * @webnative\n */\n @Prop({ mutable: true }) public indeterminate?: boolean\n\n /**\n * The primary text of the list item.\n */\n @Prop() public readonly text!: string\n\n /**\n * Text to display below the primary text.\n */\n @Prop() public readonly subtitle?: string\n\n /**\n * Emitted when the list item 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 checkbox'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 list item gains focus.\n */\n @Event({ eventName: 'qdsFocus', bubbles: false, cancelable: false })\n private readonly focusEmitter!: EventEmitter<QdsFocusEventDetail>\n\n @Element() private readonly host!: HTMLElement\n\n @State() private tabIndex?: number\n\n private inheritedAttributes: Attributes = {}\n\n get #computedDestination(): Destination | undefined {\n switch (this.destination) {\n case 'navigation': {\n return this.destination\n }\n default: {\n return undefined\n }\n }\n }\n\n get #computedDivider(): Divider | undefined {\n switch (this.divider) {\n case 'hide':\n case 'indent': {\n return this.divider\n }\n default: {\n return undefined\n }\n }\n }\n\n get #computedIndeterminate(): boolean {\n return this.indeterminate ?? false\n }\n\n get #computedListAction(): ListAction | undefined {\n switch (this.listAction) {\n case 'reorder':\n case 'multiselect': {\n return this.listAction\n }\n default: {\n return undefined\n }\n }\n }\n\n get #computedSelected(): boolean {\n return this.selected ?? false\n }\n\n get #computedChecked(): boolean {\n return this.checked ?? false\n }\n\n get #computedSize(): Size {\n switch (this.size) {\n case 'standard':\n case 'small':\n case 'large': {\n return this.size\n }\n default: {\n return 'standard'\n }\n }\n }\n\n @Listen('click')\n protected onClick(event: MouseEvent): void {\n if (this.disabled) {\n event.stopImmediatePropagation()\n return\n }\n\n // Always prevent default behavior to avoid the internal `<input>`\n // to toggle `checked` state inappropriately.\n //\n // Note that this will need adjustments once we add the `item-action` slot.\n event.preventDefault()\n\n if (this.listAction === 'multiselect') {\n this.checked = this.#computedIndeterminate ? true : !this.#computedChecked\n this.changeEmitter.emit()\n this.indeterminate = false\n }\n }\n\n @Watch('tabindex')\n protected tabindexChanged(newValue: string): void {\n const parsedValue = Number.parseInt(newValue, 10)\n this.tabIndex =\n parsedValue === 0 || Number.isNaN(parsedValue) ? undefined : parsedValue\n }\n\n public componentWillLoad(): void {\n this.inheritedAttributes = inheritAriaAttributes(this.host)\n this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0')\n }\n\n public render() {\n return (\n /* eslint-disable jsx-a11y/label-has-associated-control */\n // eslint-disable-next-line jsx-a11y/no-redundant-roles\n <li\n class={{\n 'qds-list-item': true,\n 'qds-disabled': this.disabled,\n 'qds-divider': this.#computedDivider === undefined,\n 'qds-multiselect': this.#computedListAction === 'multiselect',\n 'qds-selected': this.#computedSelected,\n 'qds-checked': this.#computedChecked,\n }}\n data-size={this.#computedSize}\n role=\"listitem\" // Required because it can't be a direct child of a list element (<ul>, <ol>, or <menu>).\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...this.inheritedAttributes}\n >\n {this.#computedListAction === 'multiselect' && (\n <qds-checkbox\n checked={this.checked}\n class=\"qds-list-action\"\n indeterminate={this.indeterminate}\n size={this.size}\n tabIndex={-1}\n text={this.text}\n checkboxOnly\n />\n )}\n {this.#computedListAction === 'reorder' && (\n <qds-icon\n aria-hidden=\"true\"\n class=\"qds-icon qds-list-action\"\n library=\"core\"\n name={this.#computedListAction}\n />\n )}\n\n <div\n class={{\n 'qds-indented-content': true,\n 'qds-divider': this.#computedDivider === 'indent',\n }}\n >\n {this.iconName !== undefined && this.iconName !== '' && (\n <qds-icon\n aria-hidden=\"true\"\n class=\"qds-icon qds-main-icon\"\n library={this.iconLibrary}\n name={this.iconName}\n />\n )}\n\n <label class=\"qds-texts\">\n <input\n checked={this.selected}\n class=\"qds-input\"\n disabled={this.disabled}\n indeterminate={this.indeterminate}\n onBlur={this.#onBlur}\n onFocus={this.#onFocus}\n tabIndex={this.disabled ? undefined : this.tabIndex}\n type=\"checkbox\"\n />\n {this.kicker !== undefined && this.kicker !== '' && (\n <div class=\"qds-kicker\">{this.kicker}</div>\n )}\n <div class=\"qds-title\">{this.text}</div>\n {this.subtitle !== undefined && this.subtitle !== '' && (\n <div class=\"qds-subtitle\">{this.subtitle}</div>\n )}\n </label>\n {this.#computedDestination !== undefined && (\n <qds-icon\n aria-hidden=\"true\"\n class=\"qds-icon qds-destination\"\n library=\"core\"\n name={this.#computedDestination}\n />\n )}\n </div>\n </li>\n /* eslint-enable jsx-a11y/label-has-associated-control */\n )\n }\n\n readonly #onBlur = (event: FocusEvent): void => {\n this.blurEmitter.emit(pickFocusEventAttributes(event))\n }\n\n readonly #onFocus = (event: FocusEvent): void => {\n this.focusEmitter.emit(pickFocusEventAttributes(event))\n }\n}\n"],"version":3}
@@ -3,10 +3,10 @@
3
3
  *
4
4
  * SPDX-License-Identifier: Apache-2.0
5
5
  */
6
- import { p as proxyCustomElement, H, h } from './p-2806fee1.js';
7
- import { d as defineCustomElement$2 } from './p-ba880369.js';
6
+ import { p as proxyCustomElement, H, h } from './p-50f85f75.js';
7
+ import { d as defineCustomElement$2 } from './p-72c09714.js';
8
8
 
9
- const loaderCss = ":host([hidden]){display:none!important}:host{display:inline-block}.qds-loader{border-radius:var(--qds-control-rounded-border-radius);box-sizing:border-box;color:var(--qds-theme-feedback-action-destructive-contrast)}[data-size=small]{height:var(--qds-control-small-icon-size);padding:var(--qds-signature-circle-progress-small-border-width);width:var(--qds-control-small-icon-size)}[data-size=standard]{height:var(--qds-control-standard-icon-size);padding:var(--qds-signature-circle-progress-standard-border-width);width:var(--qds-control-standard-icon-size)}[data-size=large]{height:var(--qds-control-large-icon-size);padding:var(--qds-signature-circle-progress-large-border-width);width:var(--qds-control-large-icon-size)}[data-size=jumbo]{height:var(--qds-control-jumbo-icon-size);padding:var(--qds-signature-circle-progress-jumbo-border-width);width:var(--qds-control-jumbo-icon-size)}[data-status=loading]{animation:a 1s linear infinite;background-image:var(--qds-theme-signature-circle-progress-indeterminate);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude}@keyframes a{to{transform:rotate(1turn)}}[data-status=success]{background-color:var(--qds-theme-feedback-result-success)}[data-status=warning]{background-color:var(--qds-theme-feedback-result-partial-success)}[data-status=error]{background-color:var(--qds-theme-feedback-result-failure)}";
9
+ const loaderCss = ":host([hidden]){display:none!important}:host{display:inline-block}.qds-loader{border-radius:var(--qds-control-rounded-border-radius);box-sizing:border-box;color:var(--qds-theme-feedback-action-destructive-contrast)}[data-size=small]{height:var(--qds-control-small-icon-size);padding:var(--qds-signature-circle-progress-small-border-width);width:var(--qds-control-small-icon-size)}[data-size=standard]{height:var(--qds-control-standard-icon-size);padding:var(--qds-signature-circle-progress-standard-border-width);width:var(--qds-control-standard-icon-size)}[data-size=large]{height:var(--qds-control-large-icon-size);padding:var(--qds-signature-circle-progress-large-border-width);width:var(--qds-control-large-icon-size)}[data-size=jumbo]{height:var(--qds-control-jumbo-icon-size);padding:var(--qds-signature-circle-progress-jumbo-border-width);width:var(--qds-control-jumbo-icon-size)}[data-status=loading]{animation:b 1s linear infinite;background-image:var(--qds-theme-signature-circle-progress-indeterminate);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude}@keyframes b{to{transform:rotate(1turn)}}[data-status=success]{background-color:var(--qds-theme-feedback-result-success)}[data-status=warning]{background-color:var(--qds-theme-feedback-result-partial-success)}[data-status=error]{background-color:var(--qds-theme-feedback-result-failure)}";
10
10
  const QdsLoaderStyle0 = loaderCss;
11
11
 
12
12
  // SPDX-FileCopyrightText: © 2024 Schneider Electric
@@ -3,10 +3,10 @@
3
3
  *
4
4
  * SPDX-License-Identifier: Apache-2.0
5
5
  */
6
- import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-2806fee1.js';
6
+ import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-50f85f75.js';
7
7
  import { p as pickFocusEventAttributes, i as inheritAriaAttributes } from './p-8abba29b.js';
8
- import { d as defineCustomElement$3 } from './p-ba880369.js';
9
- import { d as defineCustomElement$2 } from './p-c80f112a.js';
8
+ import { d as defineCustomElement$3 } from './p-72c09714.js';
9
+ import { d as defineCustomElement$2 } from './p-70d12c72.js';
10
10
 
11
11
  const navListItemCss = ":host([hidden]){display:none!important}:host{display:block}.qds-button,.qds-nav-list-item,.qds-texts{display:flex}.qds-button,.qds-texts{flex:1 0}.qds-icon,.qds-text{color:var(--qds-theme-title)}.qds-button{align-items:center;-webkit-appearance:none;appearance:none;background:none;border:none;cursor:pointer;text-align:initial}.qds-button:focus-visible{border-radius:var(--qds-focus-border-radius);outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width)}.qds-button:not(.qds-selected):hover{background-color:var(--qds-theme-interactive-background-hover)}.qds-button:not(.qds-selected):active{background-color:var(--qds-theme-interactive-background-pressed)}.qds-disabled{opacity:var(--qds-theme-disabled);pointer-events:none}.qds-subtext{color:var(--qds-theme-subtitle)}.qds-texts{flex-direction:column}.qds-button[data-size=small]{gap:var(--qds-list-item-small-gap-internal);min-height:var(--qds-list-item-small-height);padding-block:var(--qds-list-item-small-padding-vertical);padding-inline:var(--qds-list-item-small-padding-horizontal)}[data-size=small]>.qds-icon{font-size:var(--qds-list-item-small-icon-size)}[data-size=small]>.qds-texts{gap:var(--qds-list-item-small-titles-gap)}[data-size=small] .qds-text{font:var(--qds-list-item-small-title)}[data-size=small] .qds-subtext{font:var(--qds-list-item-small-subtitle)}.qds-button[data-size=standard]{gap:var(--qds-list-item-standard-gap-internal);min-height:var(--qds-list-item-standard-height);padding-block:var(--qds-list-item-standard-padding-vertical);padding-inline:var(--qds-list-item-standard-padding-horizontal)}[data-size=standard]>.qds-icon{font-size:var(--qds-list-item-standard-icon-size)}[data-size=standard]>.qds-texts{gap:var(--qds-list-item-standard-titles-gap)}[data-size=standard] .qds-text{font:var(--qds-list-item-standard-title)}[data-size=standard] .qds-subtext{font:var(--qds-list-item-standard-subtitle)}.qds-button[data-size=large]{gap:var(--qds-list-item-large-gap-internal);min-height:var(--qds-list-item-large-height);padding-block:var(--qds-list-item-large-padding-vertical);padding-inline:var(--qds-list-item-large-padding-horizontal)}[data-size=large]>.qds-icon{font-size:var(--qds-list-item-large-icon-size)}[data-size=large]>.qds-texts{gap:var(--qds-list-item-large-titles-gap)}[data-size=large] .qds-text{font:var(--qds-list-item-large-title)}[data-size=large] .qds-subtext{font:var(--qds-list-item-large-subtitle)}.qds-selected.qds-nav-list-item{background-color:var(\n --qds-theme-navigation-subsection-standard-background\n )}.qds-selected.qds-nav-list-item:after{background-color:var(--qds-theme-signature-color-default);border-radius:var(--qds-signature-line-connection-cap-radius);content:\"\";cursor:pointer;margin-right:calc(var(--qds-signature-line-connection-width)*-1/2);width:var(--qds-signature-line-connection-width)}.qds-selected .qds-icon{color:var(--qds-theme-signature-color-default)}.qds-selected[data-size=small] .qds-text{font:var(--qds-list-item-small-title-emphasized)}.qds-selected[data-size=standard] .qds-text{font:var(--qds-list-item-standard-title-emphasized)}.qds-selected[data-size=large] .qds-text{font:var(--qds-list-item-large-title-emphasized)}";
12
12
  const QdsNavListItemStyle0 = navListItemCss;
@@ -85,14 +85,14 @@ const NavListItem = /*@__PURE__*/ proxyCustomElement(class NavListItem extends H
85
85
  this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0');
86
86
  }
87
87
  render() {
88
- return (h(Host, { key: 'd8fa60da531b9bd93a16c3e21f8d3ac3986c61a0' }, h("li", { key: 'fc5237181a7ec072fa4643e5b6702b25843698ae', class: {
88
+ return (h(Host, { key: '861bd4dceb564cea7ef0deb6f3968a967f4a8ecd' }, h("li", { key: '85fb0ded3ffe45b3b492b5d46c07e9a72589fc81', class: {
89
89
  'qds-nav-list-item': true,
90
90
  'qds-disabled': this.disabled,
91
91
  'qds-selected': this.selected,
92
- }, ref: __classPrivateFieldGet(this, _NavListItem_liRef, "f"), ...this.inheritedAttributes }, h("button", { key: '07ed4f3b4b369565bfa3807969d0d45795c66694', class: {
92
+ }, ref: __classPrivateFieldGet(this, _NavListItem_liRef, "f"), ...this.inheritedAttributes }, h("button", { key: '7c105a685c879cb014cc0cfd514bfdf1c5a86888', class: {
93
93
  'qds-button': true,
94
94
  'qds-selected': this.selected,
95
- }, "data-size": __classPrivateFieldGet(this, _NavListItem_instances, "a", _NavListItem_computedSize_get), disabled: this.disabled, onBlur: __classPrivateFieldGet(this, _NavListItem_onBlur, "f"), onFocus: __classPrivateFieldGet(this, _NavListItem_onFocus, "f"), tabIndex: this.disabled ? undefined : this.tabIndex, type: "button" }, this.iconName !== undefined && this.iconName !== '' && (h("qds-icon", { key: '920ce703bd408a135c97d0efa29da86bb8b08bc2', "aria-hidden": "true", class: "qds-icon", library: this.iconLibrary, name: this.iconName })), !__classPrivateFieldGet(this, _NavListItem_instances, "a", _NavListItem_shouldCollapse_get) && this.text && this.renderText())), __classPrivateFieldGet(this, _NavListItem_instances, "a", _NavListItem_shouldCollapse_get) && this.text && (h("qds-tooltip", { key: '6cf3305f81a62bc2f1146298bfcd109f96ee7281', placement: "right", ref: __classPrivateFieldGet(this, _NavListItem_tooltipRef, "f") }, this.renderText()))));
95
+ }, "data-size": __classPrivateFieldGet(this, _NavListItem_instances, "a", _NavListItem_computedSize_get), disabled: this.disabled, onBlur: __classPrivateFieldGet(this, _NavListItem_onBlur, "f"), onFocus: __classPrivateFieldGet(this, _NavListItem_onFocus, "f"), tabIndex: this.disabled ? undefined : this.tabIndex, type: "button" }, this.iconName !== undefined && this.iconName !== '' && (h("qds-icon", { key: '2c0a4554e721bb64bb59af6aeb3f4e6efa1362b7', "aria-hidden": "true", class: "qds-icon", library: this.iconLibrary, name: this.iconName })), !__classPrivateFieldGet(this, _NavListItem_instances, "a", _NavListItem_shouldCollapse_get) && this.text && this.renderText())), __classPrivateFieldGet(this, _NavListItem_instances, "a", _NavListItem_shouldCollapse_get) && this.text && (h("qds-tooltip", { key: 'ec28ae83b18c2f6702e04331b09603085c77651b', placement: "right", ref: __classPrivateFieldGet(this, _NavListItem_tooltipRef, "f") }, this.renderText()))));
96
96
  }
97
97
  renderText() {
98
98
  return (h("div", { class: "qds-texts" }, h("div", { class: "qds-text" }, this.text), this.subtext !== undefined && this.subtext !== '' && (h("div", { class: "qds-subtext" }, this.subtext))));
@@ -3,9 +3,9 @@
3
3
  *
4
4
  * SPDX-License-Identifier: Apache-2.0
5
5
  */
6
- import { p as proxyCustomElement, H, h } from './p-2806fee1.js';
6
+ import { p as proxyCustomElement, H, h } from './p-50f85f75.js';
7
7
 
8
- const progressBarCss = ":host([hidden]){display:none!important}:host{display:block;width:100%}.qds-bar,.qds-track{overflow:hidden}.qds-track{background-color:var(--qds-theme-control-slider-track-inactive)}.qds-bar,.qds-track{border-radius:var(--qds-signature-line-progress-cap-radius)}.qds-bar{background-color:var(--qds-theme-signature-line-progress-determinate);transition:width .6s cubic-bezier(.83,0,.17,1)}@media (prefers-reduced-motion){.qds-bar{transition:none}}.qds-indeterminate{animation:b 2s linear infinite;background-color:initial;background-image:var(--qds-theme-signature-line-progress-indeterminate)}@keyframes b{0%{transform:translateX(-100%)}to{transform:translateX(200%)}}[data-size=small]{height:var(--qds-signature-line-progress-small-height)}[data-size=standard]{height:var(--qds-signature-line-progress-standard-height)}[data-size=large]{height:var(--qds-signature-line-progress-large-height)}";
8
+ const progressBarCss = ":host([hidden]){display:none!important}:host{display:block;width:100%}.qds-bar,.qds-track{overflow:hidden}.qds-track{background-color:var(--qds-theme-control-slider-track-inactive)}.qds-bar,.qds-track{border-radius:var(--qds-signature-line-progress-cap-radius)}.qds-bar{background-color:var(--qds-theme-signature-line-progress-determinate);transition:width .6s cubic-bezier(.83,0,.17,1)}@media (prefers-reduced-motion){.qds-bar{transition:none}}.qds-indeterminate{animation:a 2s linear infinite;background-color:initial;background-image:var(--qds-theme-signature-line-progress-indeterminate)}@keyframes a{0%{transform:translateX(-100%)}to{transform:translateX(200%)}}[data-size=small]{height:var(--qds-signature-line-progress-small-height)}[data-size=standard]{height:var(--qds-signature-line-progress-standard-height)}[data-size=large]{height:var(--qds-signature-line-progress-large-height)}";
9
9
  const QdsProgressBarStyle0 = progressBarCss;
10
10
 
11
11
  // SPDX-FileCopyrightText: © 2024 Schneider Electric
@@ -87,7 +87,7 @@ const ProgressBar = /*@__PURE__*/ proxyCustomElement(class ProgressBar extends H
87
87
  this.valueChanged();
88
88
  }
89
89
  render() {
90
- return (h("div", { key: 'a27fc224ae0a302c1303a7f8e3495b7085078b5f', "aria-hidden": "true", class: "qds-track", "data-size": __classPrivateFieldGet(this, _ProgressBar_instances, "a", _ProgressBar_computedSize_get) }, h("div", { key: '35b538fed23adf5c01bc92c00dd9cf220ddd0634', class: {
90
+ return (h("div", { key: '89fad7b1dd2348a3f4c8a2571fe916d342166acb', "aria-hidden": "true", class: "qds-track", "data-size": __classPrivateFieldGet(this, _ProgressBar_instances, "a", _ProgressBar_computedSize_get) }, h("div", { key: '84ffc7461e57cc90cb8889e16d5cbdf229f0b9f3', class: {
91
91
  'qds-bar': true,
92
92
  'qds-indeterminate': __classPrivateFieldGet(this, _ProgressBar_position, "f") === -1,
93
93
  }, "data-size": __classPrivateFieldGet(this, _ProgressBar_instances, "a", _ProgressBar_computedSize_get), style: { width: this.width } })));
@@ -3,13 +3,13 @@
3
3
  *
4
4
  * SPDX-License-Identifier: Apache-2.0
5
5
  */
6
- import { p as proxyCustomElement, H, c as createEvent, h } from './p-2806fee1.js';
6
+ import { p as proxyCustomElement, H, c as createEvent, h } from './p-50f85f75.js';
7
7
  import { p as pickFocusEventAttributes, c as invariant, i as inheritAriaAttributes } from './p-8abba29b.js';
8
- import { d as defineCustomElement$4 } from './p-ba880369.js';
9
- import { d as defineCustomElement$3 } from './p-a020ece3.js';
10
- import { d as defineCustomElement$2 } from './p-c80f112a.js';
8
+ import { d as defineCustomElement$4 } from './p-72c09714.js';
9
+ import { d as defineCustomElement$3 } from './p-b5608061.js';
10
+ import { d as defineCustomElement$2 } from './p-70d12c72.js';
11
11
 
12
- const radioCss = "[hidden].sc-qds-radio-h{display:none!important}.sc-qds-radio-h{display:inline-block;line-height:0}.qds-box.sc-qds-radio,.qds-icon.sc-qds-radio,.qds-radio.sc-qds-radio{grid-area:g;place-self:center}.qds-box.sc-qds-radio,.qds-icon.sc-qds-radio{display:none;pointer-events:none}.qds-box.sc-qds-radio{border-radius:var(--qds-control-rounded-border-radius)}.qds-container.sc-qds-radio{align-self:flex-start;display:grid;grid-template-areas:\"g\"}.qds-icon.sc-qds-radio{color:var(--qds-theme-signature-color-contrast)}.qds-label.sc-qds-radio{cursor:pointer;display:inline-flex}.qds-radio.sc-qds-radio{-webkit-appearance:none;appearance:none;background-color:var(--qds-theme-control-input-background);border:var(--qds-control-border-width) solid var(--qds-theme-control-border);border-radius:var(--qds-control-rounded-border-radius);cursor:pointer;margin:0;-webkit-print-color-adjust:exact;print-color-adjust:exact}.qds-radio.sc-qds-radio:focus-visible{outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width);outline-offset:var(--qds-focus-border-offset)}.qds-radio.sc-qds-radio:active~.qds-box.sc-qds-radio,.qds-radio.sc-qds-radio:hover~.qds-box.sc-qds-radio{display:block}.qds-radio.sc-qds-radio:hover~.qds-box.sc-qds-radio{background-color:var(--qds-theme-signature-color-hover)}.qds-radio.sc-qds-radio:active~.qds-box.sc-qds-radio{background-color:var(--qds-theme-signature-color-pressed)}.qds-radio.sc-qds-radio:checked{background-color:var(--qds-theme-signature-color-default);border-color:#0000}.qds-radio.sc-qds-radio:checked~.qds-icon.sc-qds-radio{display:block}.qds-radio.sc-qds-radio:checked:hover{background-color:var(--qds-theme-signature-color-hover)}.qds-radio.sc-qds-radio:checked:active{background-color:var(--qds-theme-signature-color-pressed)}[aria-disabled=true].sc-qds-radio{opacity:var(--qds-theme-disabled);pointer-events:none}.qds-radio[data-size=small].sc-qds-radio{height:var(--qds-control-toggle-box-small-size);width:var(--qds-control-toggle-box-small-size)}.qds-icon[data-size=small].sc-qds-radio{font-size:var(--qds-control-small-icon-size)}.qds-box[data-size=small].sc-qds-radio{height:var(--qds-control-toggle-indicator-small-size);width:var(--qds-control-toggle-indicator-small-size)}.qds-inline[data-size=small].sc-qds-radio{margin-block:var(--qds-control-small-padding-auto-height)}.qds-label[data-size=small].sc-qds-radio{gap:var(--qds-control-small-gap-siblings-related)}.qds-radio[data-size=standard].sc-qds-radio{height:var(--qds-control-toggle-box-standard-size);width:var(--qds-control-toggle-box-standard-size)}.qds-icon[data-size=standard].sc-qds-radio{font-size:var(--qds-control-standard-icon-size)}.qds-box[data-size=standard].sc-qds-radio{height:var(--qds-control-toggle-indicator-standard-size);width:var(--qds-control-toggle-indicator-standard-size)}.qds-inline[data-size=standard].sc-qds-radio{margin-block:var(--qds-control-standard-padding-auto-height)}.qds-label[data-size=standard].sc-qds-radio{gap:var(--qds-control-standard-gap-siblings-related)}.qds-radio[data-size=large].sc-qds-radio{height:var(--qds-control-toggle-box-large-size);width:var(--qds-control-toggle-box-large-size)}.qds-icon[data-size=large].sc-qds-radio{font-size:var(--qds-control-large-icon-size)}.qds-box[data-size=large].sc-qds-radio{height:var(--qds-control-toggle-indicator-large-size);width:var(--qds-control-toggle-indicator-large-size)}.qds-inline[data-size=large].sc-qds-radio{margin-block:var(--qds-control-large-padding-auto-height)}.qds-label[data-size=large].sc-qds-radio{gap:var(--qds-control-large-gap-siblings-related)}";
12
+ const radioCss = "[hidden].sc-qds-radio-h{display:none!important}.sc-qds-radio-h{display:inline-block;line-height:0}.qds-box.sc-qds-radio,.qds-icon.sc-qds-radio,.qds-radio.sc-qds-radio{grid-area:i;place-self:center}.qds-box.sc-qds-radio,.qds-icon.sc-qds-radio{display:none;pointer-events:none}.qds-box.sc-qds-radio{border-radius:var(--qds-control-rounded-border-radius)}.qds-container.sc-qds-radio{align-self:flex-start;display:grid;grid-template-areas:\"i\"}.qds-icon.sc-qds-radio{color:var(--qds-theme-signature-color-contrast)}.qds-label.sc-qds-radio{cursor:pointer;display:inline-flex;width:inherit}.qds-label-inner.sc-qds-radio{flex:1 1 auto;min-width:0}.qds-radio.sc-qds-radio{-webkit-appearance:none;appearance:none;background-color:var(--qds-theme-control-input-background);border:var(--qds-control-border-width) solid var(--qds-theme-control-border);border-radius:var(--qds-control-rounded-border-radius);cursor:pointer;margin:0;-webkit-print-color-adjust:exact;print-color-adjust:exact}.qds-radio.sc-qds-radio:focus-visible{outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width);outline-offset:var(--qds-focus-border-offset)}.qds-radio.sc-qds-radio:active~.qds-box.sc-qds-radio,.qds-radio.sc-qds-radio:hover~.qds-box.sc-qds-radio{display:block}.qds-radio.sc-qds-radio:hover~.qds-box.sc-qds-radio{background-color:var(--qds-theme-signature-color-hover)}.qds-radio.sc-qds-radio:active~.qds-box.sc-qds-radio{background-color:var(--qds-theme-signature-color-pressed)}.qds-radio.sc-qds-radio:checked{background-color:var(--qds-theme-signature-color-default);border-color:#0000}.qds-radio.sc-qds-radio:checked~.qds-icon.sc-qds-radio{display:block}.qds-radio.sc-qds-radio:checked:hover{background-color:var(--qds-theme-signature-color-hover)}.qds-radio.sc-qds-radio:checked:active{background-color:var(--qds-theme-signature-color-pressed)}[aria-disabled=true].sc-qds-radio{opacity:var(--qds-theme-disabled);pointer-events:none}.qds-radio[data-size=small].sc-qds-radio{height:var(--qds-control-toggle-box-small-size);width:var(--qds-control-toggle-box-small-size)}.qds-icon[data-size=small].sc-qds-radio{font-size:var(--qds-control-small-icon-size)}.qds-box[data-size=small].sc-qds-radio{height:var(--qds-control-toggle-indicator-small-size);width:var(--qds-control-toggle-indicator-small-size)}.qds-inline[data-size=small].sc-qds-radio{margin-block:var(--qds-control-small-padding-auto-height)}.qds-label[data-size=small].sc-qds-radio{gap:var(--qds-control-small-gap-siblings-related)}.qds-radio[data-size=standard].sc-qds-radio{height:var(--qds-control-toggle-box-standard-size);width:var(--qds-control-toggle-box-standard-size)}.qds-icon[data-size=standard].sc-qds-radio{font-size:var(--qds-control-standard-icon-size)}.qds-box[data-size=standard].sc-qds-radio{height:var(--qds-control-toggle-indicator-standard-size);width:var(--qds-control-toggle-indicator-standard-size)}.qds-inline[data-size=standard].sc-qds-radio{margin-block:var(--qds-control-standard-padding-auto-height)}.qds-label[data-size=standard].sc-qds-radio{gap:var(--qds-control-standard-gap-siblings-related)}.qds-radio[data-size=large].sc-qds-radio{height:var(--qds-control-toggle-box-large-size);width:var(--qds-control-toggle-box-large-size)}.qds-icon[data-size=large].sc-qds-radio{font-size:var(--qds-control-large-icon-size)}.qds-box[data-size=large].sc-qds-radio{height:var(--qds-control-toggle-indicator-large-size);width:var(--qds-control-toggle-indicator-large-size)}.qds-inline[data-size=large].sc-qds-radio{margin-block:var(--qds-control-large-padding-auto-height)}.qds-label[data-size=large].sc-qds-radio{gap:var(--qds-control-large-gap-siblings-related)}";
13
13
  const QdsRadioStyle0 = radioCss;
14
14
 
15
15
  // SPDX-FileCopyrightText: © 2024 Schneider Electric
@@ -86,10 +86,10 @@ const Radio = /*@__PURE__*/ proxyCustomElement(class Radio extends H {
86
86
  render() {
87
87
  return (
88
88
  // eslint-disable-next-line jsx-a11y/label-has-associated-control
89
- h("label", { key: 'f99d16e9047808d58a0b9df5c82def391b8f3225', "aria-disabled": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedDisabled_get) ? 'true' : undefined, class: {
89
+ h("label", { key: '667293f89507bd2e846c4ed1ed5e70076a93f0ed', "aria-disabled": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedDisabled_get) ? 'true' : undefined, class: {
90
90
  'qds-inline': this.inline,
91
91
  'qds-label': true,
92
- }, "data-size": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get) }, h("div", { key: 'e4c7d0fd23677892234d64a198847fef0232fc6b', class: "qds-container" }, h("input", { key: '4a8f523abc487d43ea23ec2f507c474ce19bb7ba', checked: this.checked, class: "qds-radio", "data-size": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get), disabled: this.disabled, form: this.form, name: this.name, onBlur: __classPrivateFieldGet(this, _Radio_onBlur, "f"), onChange: __classPrivateFieldGet(this, _Radio_onChange, "f"), onFocus: __classPrivateFieldGet(this, _Radio_onFocus, "f"), ref: __classPrivateFieldGet(this, _Radio_ref, "f"), required: this.required, tabIndex: __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedDisabled_get) ? undefined : this.tabIndex, type: "radio", value: this.value ?? undefined, ...__classPrivateFieldGet(this, _Radio_inheritedAttributes, "f") }), h("div", { key: 'b070acd21946c19f1aec067236a611767dc25caf', class: "qds-box", "data-size": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get) }), h("qds-icon", { key: '5e666d8584249258f5fdf21fa413e315c5e3950a', "aria-hidden": "true", class: "qds-icon", "data-size": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get), library: "core", name: "checked" })), __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_hasText_get) && (h("qds-label", { key: '7ad8a439c6144598b090192451f72f8b6f29d581', size: __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get), text: this.text }))));
92
+ }, "data-size": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get) }, h("div", { key: '956dccf841262856939cc29165642846f8f4ae01', class: "qds-container" }, h("input", { key: '8920f9888ad5b49e667e9517a5eaaad66434b82b', checked: this.checked, class: "qds-radio", "data-size": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get), disabled: this.disabled, form: this.form, name: this.name, onBlur: __classPrivateFieldGet(this, _Radio_onBlur, "f"), onChange: __classPrivateFieldGet(this, _Radio_onChange, "f"), onFocus: __classPrivateFieldGet(this, _Radio_onFocus, "f"), ref: __classPrivateFieldGet(this, _Radio_ref, "f"), required: this.required, tabIndex: __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedDisabled_get) ? undefined : this.tabIndex, type: "radio", value: this.value ?? undefined, ...__classPrivateFieldGet(this, _Radio_inheritedAttributes, "f") }), h("div", { key: 'efb2a7e06ec89d59e744f3ecddc606b719570f70', class: "qds-box", "data-size": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get) }), h("qds-icon", { key: '71851b402290456eeb9f467ff1efea93c4c0b1cd', "aria-hidden": "true", class: "qds-icon", "data-size": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get), library: "core", name: "checked" })), __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_hasText_get) && (h("qds-label", { key: '1b405bc19a6b884678a69b7adfff4a29cba2e6f0', class: "qds-label-inner", size: __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get), text: this.text }))));
93
93
  }
94
94
  get host() { return this; }
95
95
  static get watchers() { return {
@@ -1 +1 @@
1
- {"file":"qds-radio.js","mappings":"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","names":[],"sources":["src/components/radio/radio.css?tag=qds-radio&encapsulation=scoped","src/components/radio/radio.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2024 Schneider Electric\n *\n * SPDX-License-Identifier: Apache-2.0\n */\n\n@import url('../shared.css');\n\n:host {\n display: inline-block;\n line-height: 0;\n}\n\n.qds-radio,\n.qds-box,\n.qds-icon {\n grid-area: radio;\n place-self: center;\n}\n\n.qds-icon,\n.qds-box {\n display: none;\n pointer-events: none;\n}\n\n.qds-box {\n border-radius: var(--qds-control-rounded-border-radius);\n}\n\n.qds-container {\n display: grid;\n align-self: flex-start;\n grid-template-areas: 'radio';\n}\n\n.qds-icon {\n color: var(--qds-theme-signature-color-contrast);\n}\n\n.qds-label {\n cursor: pointer;\n display: inline-flex;\n}\n\n.qds-radio {\n appearance: none;\n background-color: var(--qds-theme-control-input-background);\n border-radius: var(--qds-control-rounded-border-radius);\n border: var(--qds-control-border-width) solid var(--qds-theme-control-border);\n cursor: pointer;\n margin: 0;\n print-color-adjust: exact;\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 &:hover ~ .qds-box,\n &:active ~ .qds-box {\n display: block;\n }\n\n &:hover ~ .qds-box {\n background-color: var(--qds-theme-signature-color-hover);\n }\n\n &:active ~ .qds-box {\n background-color: var(--qds-theme-signature-color-pressed);\n }\n\n &:checked {\n background-color: var(--qds-theme-signature-color-default);\n border-color: transparent;\n\n & ~ .qds-icon {\n display: block;\n }\n\n &:hover {\n background-color: var(--qds-theme-signature-color-hover);\n }\n\n &:active {\n background-color: var(--qds-theme-signature-color-pressed);\n }\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-radio {\n width: var(--qds-control-toggle-box-small-size);\n height: var(--qds-control-toggle-box-small-size);\n }\n\n &.qds-icon {\n font-size: var(--qds-control-small-icon-size);\n }\n\n &.qds-box {\n width: var(--qds-control-toggle-indicator-small-size);\n height: var(--qds-control-toggle-indicator-small-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\n[data-size='standard'] {\n &.qds-radio {\n width: var(--qds-control-toggle-box-standard-size);\n height: var(--qds-control-toggle-box-standard-size);\n }\n\n &.qds-icon {\n font-size: var(--qds-control-standard-icon-size);\n }\n\n &.qds-box {\n width: var(--qds-control-toggle-indicator-standard-size);\n height: var(--qds-control-toggle-indicator-standard-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\n[data-size='large'] {\n &.qds-radio {\n width: var(--qds-control-toggle-box-large-size);\n height: var(--qds-control-toggle-box-large-size);\n }\n\n &.qds-icon {\n font-size: var(--qds-control-large-icon-size);\n }\n\n &.qds-box {\n width: var(--qds-control-toggle-indicator-large-size);\n height: var(--qds-control-toggle-indicator-large-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","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface, EventEmitter } from '@stencil/core'\nimport {\n Component,\n Element,\n Event,\n h,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core'\n\nimport type { Attributes, QdsFocusEventDetail } from '../../helpers'\nimport {\n inheritAriaAttributes,\n invariant,\n pickFocusEventAttributes,\n} from '../../helpers'\nimport type { Value } from '../controls'\nimport type { Size } from '../shared'\n\n/**\n * `<qds-radio>` elements are rendered as circles that are filled when\n * selected. They are generally used in **radio groups** — collections of radio\n * buttons describing a set of related options.\n *\n * Only one radio button in a given radio group can be selected at the same\n * time.\n *\n * @see https://quartz.se.com/build/components/radio\n */\n@Component({\n tag: 'qds-radio',\n scoped: true,\n styleUrl: 'radio.css',\n})\nexport class Radio implements ComponentInterface {\n /**\n * Adds vertical margin to the radio 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 radio button's size.\n */\n @Prop() public readonly size?: Size = 'standard'\n\n /**\n * The radio button's text.\n */\n @Prop() public readonly text?: string\n\n /**\n * Sets the radio button's state.\n *\n * @webnative\n */\n @Prop({ mutable: true }) public checked?: boolean\n\n /**\n * Prevents the radio button from being interacted with: it cannot be pressed\n * or focused.\n *\n * @webnative\n */\n @Prop() public readonly disabled?: boolean\n\n /**\n * The [`<form>`](https://developer.mozilla.org/docs/Web/HTML/Element/form)\n * element to associate the radio button 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-radio>` is associated\n * with its ancestor `<form>` element, if any.\n *\n * This property lets you associate `<qds-radio>` 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 * Specify the radio group this radio button belongs to.\n *\n * Once a radio group is established, selecting any radio button in that\n * group automatically deselects any currently-selected radio button in the\n * same group.\n *\n * @webnative\n */\n @Prop() public readonly name?: string\n\n /**\n * Specify the group the radio button belongs to as required.\n *\n * If any radio button in a same-named group of radio buttons has the\n * `required` attribute, a radio button in that group must be checked,\n * although it doesn't have to be the one with the attribute applied.\n *\n * @webnative\n */\n @Prop() public readonly required?: boolean\n\n /**\n * The value of the radio button, submitted as a name/value pair with form\n * data.\n *\n * @webnative\n */\n @Prop({ mutable: true }) public value?: Value\n\n /**\n * Emitted when the radio button loses focus.\n */\n @Event({ eventName: 'qdsBlur', bubbles: false, cancelable: false })\n private readonly blurEmitter!: EventEmitter<QdsFocusEventDetail>\n\n /**\n * Emitted when the radio button is checked by the user.\n */\n @Event({ eventName: 'qdsChange', cancelable: false })\n private readonly changeEmitter!: EventEmitter<void>\n\n /**\n * Emitted when the radio button gains focus.\n */\n @Event({ eventName: 'qdsFocus', bubbles: false, cancelable: false })\n private readonly focusEmitter!: EventEmitter<QdsFocusEventDetail>\n\n @Element() private readonly host!: HTMLElement\n\n @State() private tabIndex?: number\n\n #inheritedAttributes: Attributes = {}\n\n #input?: HTMLInputElement\n\n get #computedDisabled(): boolean {\n return this.disabled ?? false\n }\n\n get #computedSize(): Size {\n switch (this.size) {\n case 'standard':\n case 'small':\n case 'large': {\n return this.size\n }\n default: {\n return 'standard'\n }\n }\n }\n\n get #hasText(): boolean {\n return this.text !== undefined && this.text !== ''\n }\n\n @Listen('click')\n protected onClick(event: MouseEvent): void {\n if (this.#computedDisabled) {\n event.stopImmediatePropagation()\n return\n }\n\n invariant(this.#input)\n\n this.checked = this.#input.checked\n }\n\n @Watch('tabindex')\n protected tabindexChanged(newValue: string): void {\n const parsedValue = Number.parseInt(newValue, 10)\n this.tabIndex =\n parsedValue === 0 || Number.isNaN(parsedValue) ? undefined : parsedValue\n }\n\n public componentWillLoad(): void {\n this.#inheritedAttributes = inheritAriaAttributes(this.host)\n this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0')\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' : undefined}\n class={{\n 'qds-inline': this.inline,\n 'qds-label': true,\n }}\n data-size={this.#computedSize}\n >\n <div class=\"qds-container\">\n <input\n checked={this.checked}\n class=\"qds-radio\"\n data-size={this.#computedSize}\n disabled={this.disabled}\n form={this.form}\n name={this.name}\n onBlur={this.#onBlur}\n onChange={this.#onChange}\n onFocus={this.#onFocus}\n ref={this.#ref}\n required={this.required}\n tabIndex={this.#computedDisabled ? undefined : this.tabIndex}\n type=\"radio\"\n value={this.value ?? undefined}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...this.#inheritedAttributes}\n />\n <div class=\"qds-box\" data-size={this.#computedSize} />\n <qds-icon\n aria-hidden=\"true\"\n class=\"qds-icon\"\n data-size={this.#computedSize}\n library=\"core\"\n name=\"checked\"\n />\n </div>\n {this.#hasText && (\n <qds-label size={this.#computedSize} text={this.text} />\n )}\n </label>\n )\n }\n\n readonly #ref = (input?: HTMLInputElement): void => {\n this.#input = input\n }\n\n readonly #onBlur = (event: FocusEvent): void => {\n this.blurEmitter.emit(pickFocusEventAttributes(event))\n }\n\n readonly #onChange = (): void => {\n this.changeEmitter.emit()\n }\n\n readonly #onFocus = (event: FocusEvent): void => {\n this.focusEmitter.emit(pickFocusEventAttributes(event))\n }\n}\n"],"version":3}
1
+ {"file":"qds-radio.js","mappings":"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","names":[],"sources":["src/components/radio/radio.css?tag=qds-radio&encapsulation=scoped","src/components/radio/radio.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2024 Schneider Electric\n *\n * SPDX-License-Identifier: Apache-2.0\n */\n\n@import url('../shared.css');\n\n:host {\n display: inline-block;\n line-height: 0;\n}\n\n.qds-radio,\n.qds-box,\n.qds-icon {\n grid-area: radio;\n place-self: center;\n}\n\n.qds-icon,\n.qds-box {\n display: none;\n pointer-events: none;\n}\n\n.qds-box {\n border-radius: var(--qds-control-rounded-border-radius);\n}\n\n.qds-container {\n display: grid;\n align-self: flex-start;\n grid-template-areas: 'radio';\n}\n\n.qds-icon {\n color: var(--qds-theme-signature-color-contrast);\n}\n\n.qds-label {\n cursor: pointer;\n display: inline-flex;\n width: inherit;\n}\n\n.qds-label-inner {\n flex: 1 1 auto;\n min-width: 0;\n}\n\n.qds-radio {\n appearance: none;\n background-color: var(--qds-theme-control-input-background);\n border-radius: var(--qds-control-rounded-border-radius);\n border: var(--qds-control-border-width) solid var(--qds-theme-control-border);\n cursor: pointer;\n margin: 0;\n print-color-adjust: exact;\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 &:hover ~ .qds-box,\n &:active ~ .qds-box {\n display: block;\n }\n\n &:hover ~ .qds-box {\n background-color: var(--qds-theme-signature-color-hover);\n }\n\n &:active ~ .qds-box {\n background-color: var(--qds-theme-signature-color-pressed);\n }\n\n &:checked {\n background-color: var(--qds-theme-signature-color-default);\n border-color: transparent;\n\n & ~ .qds-icon {\n display: block;\n }\n\n &:hover {\n background-color: var(--qds-theme-signature-color-hover);\n }\n\n &:active {\n background-color: var(--qds-theme-signature-color-pressed);\n }\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-radio {\n width: var(--qds-control-toggle-box-small-size);\n height: var(--qds-control-toggle-box-small-size);\n }\n\n &.qds-icon {\n font-size: var(--qds-control-small-icon-size);\n }\n\n &.qds-box {\n width: var(--qds-control-toggle-indicator-small-size);\n height: var(--qds-control-toggle-indicator-small-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\n[data-size='standard'] {\n &.qds-radio {\n width: var(--qds-control-toggle-box-standard-size);\n height: var(--qds-control-toggle-box-standard-size);\n }\n\n &.qds-icon {\n font-size: var(--qds-control-standard-icon-size);\n }\n\n &.qds-box {\n width: var(--qds-control-toggle-indicator-standard-size);\n height: var(--qds-control-toggle-indicator-standard-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\n[data-size='large'] {\n &.qds-radio {\n width: var(--qds-control-toggle-box-large-size);\n height: var(--qds-control-toggle-box-large-size);\n }\n\n &.qds-icon {\n font-size: var(--qds-control-large-icon-size);\n }\n\n &.qds-box {\n width: var(--qds-control-toggle-indicator-large-size);\n height: var(--qds-control-toggle-indicator-large-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","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface, EventEmitter } from '@stencil/core'\nimport {\n Component,\n Element,\n Event,\n h,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core'\n\nimport type { Attributes, QdsFocusEventDetail } from '../../helpers'\nimport {\n inheritAriaAttributes,\n invariant,\n pickFocusEventAttributes,\n} from '../../helpers'\nimport type { Value } from '../controls'\nimport type { Size } from '../shared'\n\n/**\n * `<qds-radio>` elements are rendered as circles that are filled when\n * selected. They are generally used in **radio groups** — collections of radio\n * buttons describing a set of related options.\n *\n * Only one radio button in a given radio group can be selected at the same\n * time.\n *\n * @see https://quartz.se.com/build/components/radio\n */\n@Component({\n tag: 'qds-radio',\n scoped: true,\n styleUrl: 'radio.css',\n})\nexport class Radio implements ComponentInterface {\n /**\n * Adds vertical margin to the radio 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 radio button's size.\n */\n @Prop() public readonly size?: Size = 'standard'\n\n /**\n * The radio button's text.\n */\n @Prop() public readonly text?: string\n\n /**\n * Sets the radio button's state.\n *\n * @webnative\n */\n @Prop({ mutable: true }) public checked?: boolean\n\n /**\n * Prevents the radio button from being interacted with: it cannot be pressed\n * or focused.\n *\n * @webnative\n */\n @Prop() public readonly disabled?: boolean\n\n /**\n * The [`<form>`](https://developer.mozilla.org/docs/Web/HTML/Element/form)\n * element to associate the radio button 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-radio>` is associated\n * with its ancestor `<form>` element, if any.\n *\n * This property lets you associate `<qds-radio>` 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 * Specify the radio group this radio button belongs to.\n *\n * Once a radio group is established, selecting any radio button in that\n * group automatically deselects any currently-selected radio button in the\n * same group.\n *\n * @webnative\n */\n @Prop() public readonly name?: string\n\n /**\n * Specify the group the radio button belongs to as required.\n *\n * If any radio button in a same-named group of radio buttons has the\n * `required` attribute, a radio button in that group must be checked,\n * although it doesn't have to be the one with the attribute applied.\n *\n * @webnative\n */\n @Prop() public readonly required?: boolean\n\n /**\n * The value of the radio button, submitted as a name/value pair with form\n * data.\n *\n * @webnative\n */\n @Prop({ mutable: true }) public value?: Value\n\n /**\n * Emitted when the radio button loses focus.\n */\n @Event({ eventName: 'qdsBlur', bubbles: false, cancelable: false })\n private readonly blurEmitter!: EventEmitter<QdsFocusEventDetail>\n\n /**\n * Emitted when the radio button is checked by the user.\n */\n @Event({ eventName: 'qdsChange', cancelable: false })\n private readonly changeEmitter!: EventEmitter<void>\n\n /**\n * Emitted when the radio button gains focus.\n */\n @Event({ eventName: 'qdsFocus', bubbles: false, cancelable: false })\n private readonly focusEmitter!: EventEmitter<QdsFocusEventDetail>\n\n @Element() private readonly host!: HTMLElement\n\n @State() private tabIndex?: number\n\n #inheritedAttributes: Attributes = {}\n\n #input?: HTMLInputElement\n\n get #computedDisabled(): boolean {\n return this.disabled ?? false\n }\n\n get #computedSize(): Size {\n switch (this.size) {\n case 'standard':\n case 'small':\n case 'large': {\n return this.size\n }\n default: {\n return 'standard'\n }\n }\n }\n\n get #hasText(): boolean {\n return this.text !== undefined && this.text !== ''\n }\n\n @Listen('click')\n protected onClick(event: MouseEvent): void {\n if (this.#computedDisabled) {\n event.stopImmediatePropagation()\n return\n }\n\n invariant(this.#input)\n\n this.checked = this.#input.checked\n }\n\n @Watch('tabindex')\n protected tabindexChanged(newValue: string): void {\n const parsedValue = Number.parseInt(newValue, 10)\n this.tabIndex =\n parsedValue === 0 || Number.isNaN(parsedValue) ? undefined : parsedValue\n }\n\n public componentWillLoad(): void {\n this.#inheritedAttributes = inheritAriaAttributes(this.host)\n this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0')\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' : undefined}\n class={{\n 'qds-inline': this.inline,\n 'qds-label': true,\n }}\n data-size={this.#computedSize}\n >\n <div class=\"qds-container\">\n <input\n checked={this.checked}\n class=\"qds-radio\"\n data-size={this.#computedSize}\n disabled={this.disabled}\n form={this.form}\n name={this.name}\n onBlur={this.#onBlur}\n onChange={this.#onChange}\n onFocus={this.#onFocus}\n ref={this.#ref}\n required={this.required}\n tabIndex={this.#computedDisabled ? undefined : this.tabIndex}\n type=\"radio\"\n value={this.value ?? undefined}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...this.#inheritedAttributes}\n />\n <div class=\"qds-box\" data-size={this.#computedSize} />\n <qds-icon\n aria-hidden=\"true\"\n class=\"qds-icon\"\n data-size={this.#computedSize}\n library=\"core\"\n name=\"checked\"\n />\n </div>\n {this.#hasText && (\n <qds-label\n class=\"qds-label-inner\"\n size={this.#computedSize}\n text={this.text}\n />\n )}\n </label>\n )\n }\n\n readonly #ref = (input?: HTMLInputElement): void => {\n this.#input = input\n }\n\n readonly #onBlur = (event: FocusEvent): void => {\n this.blurEmitter.emit(pickFocusEventAttributes(event))\n }\n\n readonly #onChange = (): void => {\n this.changeEmitter.emit()\n }\n\n readonly #onFocus = (event: FocusEvent): void => {\n this.focusEmitter.emit(pickFocusEventAttributes(event))\n }\n}\n"],"version":3}
@@ -3,12 +3,12 @@
3
3
  *
4
4
  * SPDX-License-Identifier: Apache-2.0
5
5
  */
6
- import { p as proxyCustomElement, H, c as createEvent, h } from './p-2806fee1.js';
6
+ import { p as proxyCustomElement, H, c as createEvent, h } from './p-50f85f75.js';
7
7
  import { c as invariant, p as pickFocusEventAttributes, h as pickInputEventAttributes, i as inheritAriaAttributes } from './p-8abba29b.js';
8
8
  import { V as VALID_STATE, C as CUSTOM_ERROR_FLAGS, N as NO_ERROR_FLAGS } from './p-d107c90c.js';
9
- import { d as defineCustomElement$2 } from './p-ba880369.js';
9
+ import { d as defineCustomElement$2 } from './p-72c09714.js';
10
10
 
11
- const selectCss = ":host([hidden]){display:none!important}:host{display:inline-block}slot{display:none}.qds-container{box-sizing:border-box;display:grid;grid-template-areas:\"h\"}.qds-container,.qds-select{width:inherit}.qds-icon,.qds-select{color:var(--qds-theme-control-text-standard);grid-area:h}.qds-icon{margin-inline-end:calc(var(--qds-control-input-padding-horizontal) + var(--qds-control-border-width));place-self:center end;pointer-events:none}.qds-select{-webkit-appearance:none;appearance:none;background-color:var(--qds-theme-control-input-background);border-color:var(--qds-theme-control-border);border-radius:var(\n --qds-control-border-radius-top-left,var(--qds-control-border-radius)\n ) var(--qds-control-border-radius-top-right,var(--qds-control-border-radius)) var(\n --qds-control-border-radius-bottom-right,var(--qds-control-border-radius)\n ) var(\n --qds-control-border-radius-bottom-left,var(--qds-control-border-radius)\n );border-style:solid;border-width:var(--qds-control-border-width) var(--qds-control-border-width-inline-end,var(--qds-control-border-width)) var(--qds-control-border-width-block-end,var(--qds-control-border-width)) var(--qds-control-border-width);margin:0;outline:0;padding-block:0;padding-inline:var(--qds-control-input-padding-horizontal);text-overflow:ellipsis}.qds-select:not(:focus):user-invalid{border-color:var(--qds-theme-feedback-result-failure)}.qds-select:disabled,.qds-select:disabled+.qds-icon{opacity:var(--qds-theme-disabled)}:is(::slotted(optgroup),::slotted(optgroup:not(:disabled)>option),::slotted(option)):disabled{opacity:var(--qds-theme-disabled)}::slotted(optgroup){font:var(--qds-accessory-section-title)}::slotted(optgroup>option),::slotted(option){font:var(--qds-list-item-label-main)}.qds-select[data-size=small]{font:var(--qds-control-small-text)}.qds-select[data-size=small]:not([multiple]){height:var(--qds-control-small-height);padding-inline-end:calc(var(--qds-control-small-icon-size) + var(--qds-text-icon-gap) + var(--qds-control-input-padding-horizontal))}.qds-icon[data-size=small]{height:var(--qds-control-small-icon-size);width:var(--qds-control-small-icon-size)}.qds-select[data-size=standard]{font:var(--qds-control-standard-text)}.qds-select[data-size=standard]:not([multiple]){height:var(--qds-control-standard-height);padding-inline-end:calc(var(--qds-control-standard-icon-size) + var(--qds-text-icon-gap) + var(--qds-control-input-padding-horizontal))}.qds-icon[data-size=standard]{height:var(--qds-control-standard-icon-size);width:var(--qds-control-standard-icon-size)}.qds-select[data-size=large]{font:var(--qds-control-large-text)}.qds-select[data-size=large]:not([multiple]){height:var(--qds-control-large-height);padding-inline-end:calc(var(--qds-control-large-icon-size) + var(--qds-text-icon-gap) + var(--qds-control-input-padding-horizontal))}.qds-icon[data-size=large]{height:var(--qds-control-large-icon-size);width:var(--qds-control-large-icon-size)}.qds-focus-ring{border-radius:max(1px,var(\n --qds-control-border-radius-top-left,var(--qds-control-border-radius)\n )) max(1px,var(\n --qds-control-border-radius-top-right,var(--qds-control-border-radius)\n )) max(1px,var(\n --qds-control-border-radius-bottom-right,var(--qds-control-border-radius)\n )) max(1px,var(\n --qds-control-border-radius-bottom-left,var(--qds-control-border-radius)\n ));grid-area:h;height:calc(100% + var(--qds-control-border-width) - var(--qds-control-border-width-block-end, var(--qds-control-border-width)));isolation:isolate;outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width);outline-offset:var(--qds-focus-border-offset);pointer-events:none;visibility:hidden;width:calc(100% + var(--qds-control-border-width) - var(\n --qds-control-border-width-inline-end,\n var(--qds-control-border-width)\n ))}.qds-select:focus-visible~.qds-focus-ring{visibility:visible}";
11
+ const selectCss = ":host([hidden]){display:none!important}:host{display:inline-block}slot{display:none}.qds-container{box-sizing:border-box;display:grid;grid-template-areas:\"d\"}.qds-container,.qds-select{width:inherit}.qds-icon,.qds-select{color:var(--qds-theme-control-text-standard);grid-area:d}.qds-icon{margin-inline-end:calc(var(--qds-control-input-padding-horizontal) + var(--qds-control-border-width));place-self:center end;pointer-events:none}.qds-select{-webkit-appearance:none;appearance:none;background-color:var(--qds-theme-control-input-background);border-color:var(--qds-theme-control-border);border-radius:var(\n --qds-control-border-radius-top-left,var(--qds-control-border-radius)\n ) var(--qds-control-border-radius-top-right,var(--qds-control-border-radius)) var(\n --qds-control-border-radius-bottom-right,var(--qds-control-border-radius)\n ) var(\n --qds-control-border-radius-bottom-left,var(--qds-control-border-radius)\n );border-style:solid;border-width:var(--qds-control-border-width) var(--qds-control-border-width-inline-end,var(--qds-control-border-width)) var(--qds-control-border-width-block-end,var(--qds-control-border-width)) var(--qds-control-border-width);margin:0;outline:0;padding-block:0;padding-inline:var(--qds-control-input-padding-horizontal);text-overflow:ellipsis}.qds-select:not(:focus):user-invalid{border-color:var(--qds-theme-feedback-result-failure)}.qds-select:disabled,.qds-select:disabled+.qds-icon{opacity:var(--qds-theme-disabled)}:is(::slotted(optgroup),::slotted(optgroup:not(:disabled)>option),::slotted(option)):disabled{opacity:var(--qds-theme-disabled)}::slotted(optgroup){font:var(--qds-accessory-section-title)}::slotted(optgroup>option),::slotted(option){font:var(--qds-list-item-label-main)}.qds-select[data-size=small]{font:var(--qds-control-small-text)}.qds-select[data-size=small]:not([multiple]){height:var(--qds-control-small-height);padding-inline-end:calc(var(--qds-control-small-icon-size) + var(--qds-text-icon-gap) + var(--qds-control-input-padding-horizontal))}.qds-icon[data-size=small]{height:var(--qds-control-small-icon-size);width:var(--qds-control-small-icon-size)}.qds-select[data-size=standard]{font:var(--qds-control-standard-text)}.qds-select[data-size=standard]:not([multiple]){height:var(--qds-control-standard-height);padding-inline-end:calc(var(--qds-control-standard-icon-size) + var(--qds-text-icon-gap) + var(--qds-control-input-padding-horizontal))}.qds-icon[data-size=standard]{height:var(--qds-control-standard-icon-size);width:var(--qds-control-standard-icon-size)}.qds-select[data-size=large]{font:var(--qds-control-large-text)}.qds-select[data-size=large]:not([multiple]){height:var(--qds-control-large-height);padding-inline-end:calc(var(--qds-control-large-icon-size) + var(--qds-text-icon-gap) + var(--qds-control-input-padding-horizontal))}.qds-icon[data-size=large]{height:var(--qds-control-large-icon-size);width:var(--qds-control-large-icon-size)}.qds-focus-ring{border-radius:max(1px,var(\n --qds-control-border-radius-top-left,var(--qds-control-border-radius)\n )) max(1px,var(\n --qds-control-border-radius-top-right,var(--qds-control-border-radius)\n )) max(1px,var(\n --qds-control-border-radius-bottom-right,var(--qds-control-border-radius)\n )) max(1px,var(\n --qds-control-border-radius-bottom-left,var(--qds-control-border-radius)\n ));grid-area:d;height:calc(100% + var(--qds-control-border-width) - var(--qds-control-border-width-block-end, var(--qds-control-border-width)));isolation:isolate;outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width);outline-offset:var(--qds-focus-border-offset);pointer-events:none;visibility:hidden;width:calc(100% + var(--qds-control-border-width) - var(\n --qds-control-border-width-inline-end,\n var(--qds-control-border-width)\n ))}.qds-select:focus-visible~.qds-focus-ring{visibility:visible}";
12
12
  const QdsSelectStyle0 = selectCss;
13
13
 
14
14
  // SPDX-FileCopyrightText: © 2024 Schneider Electric
@@ -3,9 +3,9 @@
3
3
  *
4
4
  * SPDX-License-Identifier: Apache-2.0
5
5
  */
6
- import { p as proxyCustomElement, H, c as createEvent, h } from './p-2806fee1.js';
6
+ import { p as proxyCustomElement, H, c as createEvent, h } from './p-50f85f75.js';
7
7
  import { a as attachInternals, p as pickFocusEventAttributes, g as determineLinkIcon } from './p-8abba29b.js';
8
- import { d as defineCustomElement$2 } from './p-ba880369.js';
8
+ import { d as defineCustomElement$2 } from './p-72c09714.js';
9
9
 
10
10
  const standaloneLinkCss = ":host([hidden]){display:none!important}:host{display:inline-block}.qds-icon-crop{align-items:center;display:flex;justify-content:center}.qds-icon{flex-shrink:0;transform:scaleX(var(--qds-direction-factor,1))}.qds-standalone-link{border-radius:var(--qds-focus-border-radius);box-sizing:border-box;display:inline-flex;justify-content:center;-webkit-print-color-adjust:exact;print-color-adjust:exact;-webkit-text-decoration:none;text-decoration:none;width:100%}.qds-standalone-link:focus-visible{outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width);outline-offset:var(--qds-focus-border-offset)}.qds-standalone-link:active,.qds-standalone-link:hover{-webkit-text-decoration:underline;text-decoration:underline}.qds-text{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}[data-importance=subdued]{color:var(--qds-theme-link-subdued-default)}.qds-visitable[data-importance=subdued]:visited{color:var(--qds-theme-link-visited-default)}[data-importance=subdued]:hover{color:var(--qds-theme-link-subdued-hover)}[data-importance=subdued]:active{color:var(--qds-theme-link-subdued-pressed)}.qds-visitable[data-importance=subdued]:visited:hover{color:var(--qds-theme-link-visited-hover)}.qds-visitable[data-importance=subdued]:visited:active{color:var(--qds-theme-link-visited-pressed)}[data-importance=standard]{color:var(--qds-theme-link-standard-default)}.qds-visitable[data-importance=standard]:visited{color:var(--qds-theme-link-visited-default)}[data-importance=standard]:hover{color:var(--qds-theme-link-standard-hover)}[data-importance=standard]:active{color:var(--qds-theme-link-standard-pressed)}.qds-visitable[data-importance=standard]:visited:hover{color:var(--qds-theme-link-visited-hover)}.qds-visitable[data-importance=standard]:visited:active{color:var(--qds-theme-link-visited-pressed)}[data-importance=emphasized]{color:var(--qds-theme-link-emphasized-default)}.qds-visitable[data-importance=emphasized]:visited{color:var(--qds-theme-link-visited-default)}[data-importance=emphasized]:hover{color:var(--qds-theme-link-emphasized-hover)}[data-importance=emphasized]:active{color:var(--qds-theme-link-emphasized-pressed)}.qds-visitable[data-importance=emphasized]:visited:hover{color:var(--qds-theme-link-visited-hover)}.qds-visitable[data-importance=emphasized]:visited:active{color:var(--qds-theme-link-visited-pressed)}.qds-disabled{opacity:var(--qds-theme-disabled);pointer-events:none}.qds-standalone-link[data-size=small]{font:var(--qds-control-small-link);gap:var(--qds-control-small-gap-internal);padding-block:var(--qds-control-small-padding-auto-height)}[data-size=small][data-importance=subdued]{font:var(--qds-control-small-text)}.qds-icon-crop[data-size=small]{height:var(--qds-control-small-icon-crop-height)}.qds-icon[data-size=small]{height:var(--qds-control-small-icon-size);width:var(--qds-control-small-icon-size)}.qds-standalone-link[data-size=standard]{font:var(--qds-control-standard-link);gap:var(--qds-control-standard-gap-internal);padding-block:var(--qds-control-standard-padding-auto-height)}[data-size=standard][data-importance=subdued]{font:var(--qds-control-standard-text)}.qds-icon-crop[data-size=standard]{height:var(--qds-control-standard-icon-crop-height)}.qds-icon[data-size=standard]{height:var(--qds-control-standard-icon-size);width:var(--qds-control-standard-icon-size)}.qds-standalone-link[data-size=large]{font:var(--qds-control-large-link);gap:var(--qds-control-large-gap-internal);padding-block:var(--qds-control-large-padding-auto-height)}[data-size=large][data-importance=subdued]{font:var(--qds-control-large-text)}.qds-icon-crop[data-size=large]{height:var(--qds-control-large-icon-crop-height)}.qds-icon[data-size=large]{height:var(--qds-control-large-icon-size);width:var(--qds-control-large-icon-size)}";
11
11
  const QdsStandaloneLinkStyle0 = standaloneLinkCss;
@@ -89,11 +89,11 @@ const StandaloneLink = /*@__PURE__*/ proxyCustomElement(class StandaloneLink ext
89
89
  __classPrivateFieldGet(this, _StandaloneLink_internals, "f").ariaLabel = this.host.textContent;
90
90
  }
91
91
  render() {
92
- return (h("a", { key: 'abab380cd9a22d00a0b504e0ed7cb5d5f1ca7ae2', "aria-hidden": "true", class: {
92
+ return (h("a", { key: '14185a27f43513328980dbd847da91f7c1d6778b', "aria-hidden": "true", class: {
93
93
  'qds-standalone-link': true,
94
94
  'qds-disabled': this.disabled,
95
95
  'qds-visitable': this.visitable,
96
- }, "data-importance": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedImportance_get), "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get), download: this.download, href: this.href?.toString(), hrefLang: this.hreflang, onBlur: __classPrivateFieldGet(this, _StandaloneLink_onBlur, "f"), onFocus: __classPrivateFieldGet(this, _StandaloneLink_onFocus, "f"), referrerPolicy: this.referrerPolicy, rel: this.rel, tabIndex: this.disabled ? -1 : this.tabIndex, target: this.target }, this.iconName !== undefined && this.iconName !== '' && (h("span", { key: '733f3a24a1755bfb7433e755b86694bbc57832a0', class: "qds-icon-crop", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get) }, h("qds-icon", { key: '99cf41fd72607d2b8c426b6aa249fe848d0650c4', class: "qds-icon", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get), library: this.iconLibrary, name: this.iconName }))), h("span", { key: '6a3d73fd1ddd338c7bf4de18828ed7c960cd86ea', class: "qds-text" }, h("slot", { key: '1e451614590865d9aa2bfe6175d0d82771e887c7', onSlotchange: __classPrivateFieldGet(this, _StandaloneLink_onSlotchange, "f") })), this.linkIcon && (h("span", { key: '8c340596a69219ef6378083141ff3febe0d26f4d', class: "qds-icon-crop", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get) }, h("qds-icon", { key: '9034e9e1265e04d53a3f8ed0c9c0756c1d94a673', class: "qds-icon", library: "core", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get), name: this.linkIcon }))), this.importance === 'emphasized' && (h("span", { key: '6b6aa6b82742965e1357422dbb78e022a28183bc', class: "qds-icon-crop", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get) }, h("qds-icon", { key: '239fe0a496827fe27d7b34a57e217b764e02407c', class: "qds-icon", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get), library: "core", name: "next" })))));
96
+ }, "data-importance": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedImportance_get), "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get), download: this.download, href: this.href?.toString(), hrefLang: this.hreflang, onBlur: __classPrivateFieldGet(this, _StandaloneLink_onBlur, "f"), onFocus: __classPrivateFieldGet(this, _StandaloneLink_onFocus, "f"), referrerPolicy: this.referrerPolicy, rel: this.rel, tabIndex: this.disabled ? -1 : this.tabIndex, target: this.target }, this.iconName !== undefined && this.iconName !== '' && (h("span", { key: '0afd80d2a64d2f82f97a4e834f76479feee27e91', class: "qds-icon-crop", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get) }, h("qds-icon", { key: '5806c1ad9b9ca5edb03283ed510f6130247ef71b', class: "qds-icon", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get), library: this.iconLibrary, name: this.iconName }))), h("span", { key: 'f0de78c7eb5db711c7800b2228d437a1cce37284', class: "qds-text" }, h("slot", { key: '5413b3ad914e928fc65d4fa25f0993cc9cf6c741', onSlotchange: __classPrivateFieldGet(this, _StandaloneLink_onSlotchange, "f") })), this.linkIcon && (h("span", { key: 'ab6d397dda7fc8fab3888bfd6c12788f37e35243', class: "qds-icon-crop", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get) }, h("qds-icon", { key: '97da13b5f8256f2d01fd6fc53787494912f7b5e1', class: "qds-icon", library: "core", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get), name: this.linkIcon }))), this.importance === 'emphasized' && (h("span", { key: '0839cd0aa78455482c200a6f756c88ad6621ead4', class: "qds-icon-crop", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get) }, h("qds-icon", { key: 'c8b20e77d7c1ddd5f3ac2d92a7e95e2b5937f857', class: "qds-icon", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get), library: "core", name: "next" })))));
97
97
  }
98
98
  static get delegatesFocus() { return true; }
99
99
  get host() { return this; }
@@ -3,11 +3,11 @@
3
3
  *
4
4
  * SPDX-License-Identifier: Apache-2.0
5
5
  */
6
- import { p as proxyCustomElement, H, c as createEvent, h } from './p-2806fee1.js';
6
+ import { p as proxyCustomElement, H, c as createEvent, h } from './p-50f85f75.js';
7
7
  import { p as pickFocusEventAttributes, i as inheritAriaAttributes } from './p-8abba29b.js';
8
8
  import { V as VALID_STATE, C as CUSTOM_ERROR_FLAGS, N as NO_ERROR_FLAGS } from './p-d107c90c.js';
9
9
 
10
- const switchCss = ":host([hidden]){display:none!important}:host{display:inline-block}.qds-knob,.qds-track{-webkit-print-color-adjust:exact;print-color-adjust:exact}.qds-track{align-items:center;background-color:var(--qds-theme-control-toggle-track-default);border-radius:var(--qds-control-toggle-track-border-radius);box-sizing:border-box;display:flex;flex-shrink:0;padding:var(--qds-control-toggle-track-padding)}.qds-track:hover{background-color:var(--qds-theme-control-toggle-track-hover)}.qds-track:active{background-color:var(--qds-theme-control-toggle-track-pressed)}.qds-knob{background-color:var(--qds-theme-control-input-background);border-radius:var(--qds-control-knob-border-radius);box-shadow:var(--qds-theme-accessory-elevation);box-sizing:border-box;margin:0}.qds-container{box-sizing:border-box;cursor:pointer;display:flex}.qds-switch{clip-path:inset(50%);height:1px;margin:0;position:absolute;white-space:nowrap;width:1px}.qds-switch:focus-visible~.qds-track{outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width);outline-offset:var(--qds-focus-border-offset)}.qds-switch:checked~.qds-track{background-color:var(--qds-theme-signature-color-default);justify-content:flex-end}.qds-switch:checked~.qds-track:hover{background-color:var(--qds-theme-signature-color-hover)}.qds-switch:checked~.qds-track:active{background-color:var(--qds-theme-signature-color-pressed)}.qds-disabled{opacity:var(--qds-theme-disabled);pointer-events:none}.qds-inline[data-size=small]{margin-block:var(--qds-control-small-padding-auto-height)}.qds-track[data-size=small]{height:var(--qds-control-toggle-track-small-size);width:var(--qds-control-toggle-track-small-width)}.qds-knob[data-size=small]{height:var(--qds-control-knob-small-size);width:var(--qds-control-knob-small-size)}.qds-inline[data-size=standard]{margin-block:var(--qds-control-standard-padding-auto-height)}.qds-track[data-size=standard]{height:var(--qds-control-toggle-track-standard-height);width:var(--qds-control-toggle-track-standard-width)}.qds-knob[data-size=standard]{height:var(--qds-control-knob-standard-size);width:var(--qds-control-knob-standard-size)}.qds-inline[data-size=large]{margin-block:var(--qds-control-large-padding-auto-height)}.qds-track[data-size=large]{height:var(--qds-control-toggle-track-large-height);width:calc(var(--qds-control-toggle-track-large-height)*2)}.qds-knob[data-size=large]{height:var(--qds-control-knob-large-size);width:var(--qds-control-knob-large-size)}";
10
+ const switchCss = ":host([hidden]){display:none!important}:host{display:inline-block}.qds-knob,.qds-track{-webkit-print-color-adjust:exact;print-color-adjust:exact}.qds-track{align-items:center;background-color:var(--qds-theme-control-toggle-track-default);border-radius:var(--qds-control-toggle-track-border-radius);box-sizing:border-box;display:flex;flex-shrink:0;padding:var(--qds-control-toggle-track-padding)}.qds-track:hover{background-color:var(--qds-theme-control-toggle-track-hover)}.qds-track:active{background-color:var(--qds-theme-control-toggle-track-pressed)}.qds-knob{background-color:var(--qds-theme-control-input-background);border-radius:var(--qds-control-knob-border-radius);box-shadow:var(--qds-theme-accessory-elevation);box-sizing:border-box;margin:0}.qds-container{box-sizing:border-box;cursor:pointer;display:flex}.qds-switch{clip-path:inset(50%);height:1px;margin:0;position:absolute;white-space:nowrap;width:1px}.qds-switch:focus-visible~.qds-track{outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width);outline-offset:var(--qds-focus-border-offset)}.qds-switch:checked~.qds-track{background-color:var(--qds-theme-signature-color-default);justify-content:flex-end}.qds-switch:checked~.qds-track:hover{background-color:var(--qds-theme-signature-color-hover)}.qds-switch:checked~.qds-track:active{background-color:var(--qds-theme-signature-color-pressed)}.qds-disabled{opacity:var(--qds-theme-disabled);pointer-events:none}.qds-inline[data-size=small]{margin-block:var(--qds-control-small-padding-auto-height)}.qds-track[data-size=small]{height:var(--qds-control-toggle-track-small-size);width:var(--qds-control-toggle-track-small-width)}.qds-knob[data-size=small]{height:var(--qds-control-knob-small-size);width:var(--qds-control-knob-small-size)}.qds-inline[data-size=standard]{margin-block:var(--qds-control-standard-padding-auto-height)}.qds-track[data-size=standard]{height:var(--qds-control-toggle-track-standard-height);width:var(--qds-control-toggle-track-standard-width)}.qds-knob[data-size=standard]{height:var(--qds-control-knob-standard-size);width:var(--qds-control-knob-standard-size)}.qds-inline[data-size=large]{margin-block:var(--qds-control-large-padding-auto-height)}.qds-track[data-size=large]{height:var(--qds-control-toggle-track-large-height);width:var(--qds-control-toggle-track-large-width)}.qds-knob[data-size=large]{height:var(--qds-control-knob-large-size);width:var(--qds-control-knob-large-size)}";
11
11
  const QdsSwitchStyle0 = switchCss;
12
12
 
13
13
  // SPDX-FileCopyrightText: © 2024 Schneider Electric
@@ -148,13 +148,13 @@ const Switch = /*@__PURE__*/ proxyCustomElement(class Switch extends H {
148
148
  this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0');
149
149
  }
150
150
  render() {
151
- return (h("div", { key: '342bf6f92bda0c26d06847b697962507f44ba66f', class: {
151
+ return (h("div", { key: '124a3b649baeeb3fb2dfea6a2fa45f8b41738157', class: {
152
152
  'qds-container': true,
153
153
  'qds-disabled': __classPrivateFieldGet(this, _Switch_instances, "a", _Switch_computedDisabled_get),
154
154
  'qds-inline': this.inline,
155
- }, "data-size": __classPrivateFieldGet(this, _Switch_instances, "a", _Switch_computedSize_get) }, h("input", { key: '101c463e6970cd79c3776cf7d8e9328e3c4d8fee', "aria-hidden": "true",
155
+ }, "data-size": __classPrivateFieldGet(this, _Switch_instances, "a", _Switch_computedSize_get) }, h("input", { key: '417acf660662c9f3987bba88886a8e6b4305b13a', "aria-hidden": "true",
156
156
  // eslint-disable-next-line jsx-a11y/no-autofocus
157
- autoFocus: this.host.autofocus, checked: this.checked, class: "qds-switch", disabled: this.disabled, onBlur: __classPrivateFieldGet(this, _Switch_onBlur, "f"), onFocus: __classPrivateFieldGet(this, _Switch_onFocus, "f"), tabIndex: __classPrivateFieldGet(this, _Switch_instances, "a", _Switch_computedDisabled_get) ? undefined : this.tabIndex, type: "checkbox", value: this.value ?? undefined, ...this.inheritedAttributes }), h("div", { key: '58a9e90c1b9df6aec5c7dec6b95544003bc82def', class: "qds-track", "data-size": __classPrivateFieldGet(this, _Switch_instances, "a", _Switch_computedSize_get) }, h("div", { key: '14745582855113a1015c7d076cb8e157298af6b9', class: "qds-knob", "data-size": __classPrivateFieldGet(this, _Switch_instances, "a", _Switch_computedSize_get) }))));
157
+ autoFocus: this.host.autofocus, checked: this.checked, class: "qds-switch", disabled: this.disabled, onBlur: __classPrivateFieldGet(this, _Switch_onBlur, "f"), onFocus: __classPrivateFieldGet(this, _Switch_onFocus, "f"), tabIndex: __classPrivateFieldGet(this, _Switch_instances, "a", _Switch_computedDisabled_get) ? undefined : this.tabIndex, type: "checkbox", value: this.value ?? undefined, ...this.inheritedAttributes }), h("div", { key: 'f922e507766279160da228c4a33630763bbd6acd', class: "qds-track", "data-size": __classPrivateFieldGet(this, _Switch_instances, "a", _Switch_computedSize_get) }, h("div", { key: '91c828ada2be4cc6a594b8b473548b3a8f34f1e9', class: "qds-knob", "data-size": __classPrivateFieldGet(this, _Switch_instances, "a", _Switch_computedSize_get) }))));
158
158
  }
159
159
  static get delegatesFocus() { return true; }
160
160
  static get formAssociated() { return true; }
@@ -1 +1 @@
1
- {"file":"qds-switch.js","mappings":"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","names":[],"sources":["src/components/switch/switch.css?tag=qds-switch&encapsulation=shadow","src/components/switch/switch.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2024 Schneider Electric\n *\n * SPDX-License-Identifier: Apache-2.0\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-track {\n align-items: center;\n border-radius: var(--qds-control-toggle-track-border-radius);\n display: flex;\n box-sizing: border-box;\n flex-shrink: 0;\n padding: var(--qds-control-toggle-track-padding);\n print-color-adjust: exact;\n background-color: var(--qds-theme-control-toggle-track-default);\n\n &:hover {\n background-color: var(--qds-theme-control-toggle-track-hover);\n }\n\n &:active {\n background-color: var(--qds-theme-control-toggle-track-pressed);\n }\n}\n\n.qds-knob {\n background-color: var(--qds-theme-control-input-background);\n border-radius: var(--qds-control-knob-border-radius);\n box-shadow: var(--qds-theme-accessory-elevation);\n box-sizing: border-box;\n margin: 0;\n}\n\n.qds-container {\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 &: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 &:checked ~ .qds-track {\n justify-content: flex-end;\n background-color: var(--qds-theme-signature-color-default);\n\n &:hover {\n background-color: var(--qds-theme-signature-color-hover);\n }\n\n &:active {\n background-color: var(--qds-theme-signature-color-pressed);\n }\n }\n}\n\n.qds-disabled {\n opacity: var(--qds-theme-disabled);\n pointer-events: none;\n}\n\n[data-size='small'] {\n &.qds-inline {\n margin-block: var(--qds-control-small-padding-auto-height);\n }\n\n &.qds-track {\n width: var(--qds-control-toggle-track-small-width);\n height: var(--qds-control-toggle-track-small-size);\n }\n\n &.qds-knob {\n height: var(--qds-control-knob-small-size);\n width: var(--qds-control-knob-small-size);\n }\n}\n\n[data-size='standard'] {\n &.qds-inline {\n margin-block: var(--qds-control-standard-padding-auto-height);\n }\n\n &.qds-track {\n width: var(--qds-control-toggle-track-standard-width);\n height: var(--qds-control-toggle-track-standard-height);\n }\n\n &.qds-knob {\n height: var(--qds-control-knob-standard-size);\n width: var(--qds-control-knob-standard-size);\n }\n}\n\n[data-size='large'] {\n &.qds-inline {\n margin-block: var(--qds-control-large-padding-auto-height);\n }\n\n &.qds-track {\n width: calc(var(--qds-control-toggle-track-large-height) * 2);\n height: var(--qds-control-toggle-track-large-height);\n }\n\n &.qds-knob {\n height: var(--qds-control-knob-large-size);\n width: var(--qds-control-knob-large-size);\n }\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface, EventEmitter } from '@stencil/core'\nimport {\n AttachInternals,\n Component,\n Element,\n Event,\n h,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core'\n\nimport type { Attributes, QdsFocusEventDetail } from '../../helpers'\nimport { inheritAriaAttributes, pickFocusEventAttributes } from '../../helpers'\nimport type { Value } from '../controls'\nimport { CUSTOM_ERROR_FLAGS, NO_ERROR_FLAGS, VALID_STATE } from '../controls'\nimport type { Size } from '../shared'\n\n/**\n * @see https://quartz.se.com/build/components/switch\n */\n@Component({\n tag: 'qds-switch',\n formAssociated: true,\n shadow: { delegatesFocus: 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 switches's size.\n */\n @Prop() public readonly size?: Size = 'standard'\n\n /**\n *Sets the switch's state.\n *\n * @webnative\n */\n @Prop({ mutable: 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() public readonly 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 // eslint-disable-next-line unicorn/no-null\n @Prop() public readonly form: ElementInternals['form'] | string = null\n\n /**\n * Returns a list of the [`<label>`][] elements associated with the\n * `qds-switch` element.\n *\n * [`<label>`]: https://developer.mozilla.org/docs/Web/HTML/Element/label\n *\n * @readonly\n * @webnative\n */\n // eslint-disable-next-line unicorn/no-null\n @Prop() public readonly labels: HTMLInputElement['labels'] = null\n\n /**\n * The name of the switch, which is submitted with the form data.\n *\n * @webnative\n */\n @Prop() public readonly name?: string\n\n /**\n * The value of the switch, submitted as a name/value pair with form data.\n *\n * @webnative\n */\n @Prop() public readonly value?: Value\n\n /**\n * The error message that would be shown to the user if the `<qds-switch>`\n * was to be checked for validity.\n *\n * @readonly\n * @webnative\n */\n @Prop()\n public readonly validationMessage: ElementInternals['validationMessage'] = ''\n\n /**\n * The [`ValidityState`][] object for this `<qds-switch>`.\n *\n * [`ValidityState`]: https://developer.mozilla.org/docs/Web/API/ValidityState\n *\n * @readonly\n * @webnative\n */\n @Prop() public readonly validity: ElementInternals['validity'] = VALID_STATE\n\n /**\n * True if `<qds-switch>` will be validated when the form is submitted;\n * false otherwise.\n *\n * @readonly\n * @webnative\n */\n @Prop() public readonly willValidate: ElementInternals['willValidate'] = false\n\n @AttachInternals() private readonly internals!: ElementInternals\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 host!: HTMLElement\n\n @State() private tabIndex?: number\n\n @State() private inheritedAttributes: Attributes = {}\n\n get #computedChecked(): boolean {\n return this.checked ?? false\n }\n\n get #computedDisabled(): boolean {\n return (\n (this.host.matches(':disabled') || (this.disabled ?? false)) &&\n this.host.getAttribute('disabled') !== 'false'\n )\n }\n\n get #computedSize(): Size {\n switch (this.size) {\n case 'standard':\n case 'small':\n case 'large': {\n return this.size\n }\n default: {\n return 'standard'\n }\n }\n }\n\n get #computedValue(): string | null {\n // eslint-disable-next-line unicorn/no-null\n return this.value == null ? null : this.value.toString()\n }\n\n @Listen('click')\n protected onClick(event: MouseEvent): void {\n if (this.#computedDisabled) {\n event.stopImmediatePropagation()\n return\n }\n\n event.preventDefault()\n\n this.checked = !this.#computedChecked\n this.changeEmitter.emit()\n }\n\n @Watch('checked')\n protected checkedChanged(): void {\n this.#updateFormValue()\n this.internals.ariaChecked = this.#computedChecked.toString()\n }\n\n @Watch('disabled')\n protected disabledChanged(): void {\n this.#updateFormValue()\n this.internals.ariaDisabled = this.#computedDisabled.toString()\n }\n\n @Watch('tabindex')\n protected tabindexChanged(newValue: string): void {\n const parsedValue = Number.parseInt(newValue, 10)\n this.tabIndex =\n parsedValue === 0 || Number.isNaN(parsedValue) ? undefined : parsedValue\n }\n\n @Watch('value')\n protected valueChanged(): void {\n this.#updateFormValue()\n }\n\n public componentWillLoad(): void {\n this.internals.role = 'switch'\n this.checkedChanged()\n this.disabledChanged()\n\n this.#defineGetter('form', () => this.internals.form)\n this.#defineGetter('labels', () => this.internals.labels)\n this.#defineGetter(\n 'validationMessage',\n () => this.internals.validationMessage,\n )\n this.#defineGetter('validity', () => this.internals.validity)\n this.#defineGetter('willValidate', () => this.internals.willValidate)\n\n this.inheritedAttributes = inheritAriaAttributes(this.host)\n this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0')\n }\n\n public render() {\n return (\n <div\n class={{\n 'qds-container': true,\n 'qds-disabled': this.#computedDisabled,\n 'qds-inline': this.inline,\n }}\n data-size={this.#computedSize}\n >\n <input\n aria-hidden=\"true\"\n // eslint-disable-next-line jsx-a11y/no-autofocus\n autoFocus={this.host.autofocus}\n checked={this.checked}\n class=\"qds-switch\"\n disabled={this.disabled}\n onBlur={this.#onBlur}\n onFocus={this.#onFocus}\n tabIndex={this.#computedDisabled ? undefined : this.tabIndex}\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.#computedSize}>\n <div class=\"qds-knob\" data-size={this.#computedSize} />\n </div>\n </div>\n )\n }\n\n public checkValidity: ElementInternals['checkValidity'] = () =>\n this.internals.checkValidity()\n\n public reportValidity: ElementInternals['reportValidity'] = () =>\n this.internals.reportValidity()\n\n public setCustomValidity: HTMLInputElement['setCustomValidity'] = (error) => {\n if (error) this.internals.setValidity(CUSTOM_ERROR_FLAGS, error, this.host)\n else this.internals.setValidity(NO_ERROR_FLAGS)\n }\n\n readonly #onBlur = (event: FocusEvent): void => {\n this.blurEmitter.emit(pickFocusEventAttributes(event))\n }\n\n readonly #onFocus = (event: FocusEvent): void => {\n this.focusEmitter.emit(pickFocusEventAttributes(event))\n }\n\n #defineGetter(p: PropertyKey, get: () => unknown): void {\n Object.defineProperty(this.host, p, { enumerable: true, get })\n }\n\n #updateFormValue(): void {\n this.internals.setFormValue(\n this.#computedChecked && !this.#computedDisabled\n ? this.#computedValue\n : // eslint-disable-next-line unicorn/no-null\n null,\n )\n }\n}\n"],"version":3}
1
+ {"file":"qds-switch.js","mappings":"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","names":[],"sources":["src/components/switch/switch.css?tag=qds-switch&encapsulation=shadow","src/components/switch/switch.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2024 Schneider Electric\n *\n * SPDX-License-Identifier: Apache-2.0\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-track {\n align-items: center;\n border-radius: var(--qds-control-toggle-track-border-radius);\n display: flex;\n box-sizing: border-box;\n flex-shrink: 0;\n padding: var(--qds-control-toggle-track-padding);\n print-color-adjust: exact;\n background-color: var(--qds-theme-control-toggle-track-default);\n\n &:hover {\n background-color: var(--qds-theme-control-toggle-track-hover);\n }\n\n &:active {\n background-color: var(--qds-theme-control-toggle-track-pressed);\n }\n}\n\n.qds-knob {\n background-color: var(--qds-theme-control-input-background);\n border-radius: var(--qds-control-knob-border-radius);\n box-shadow: var(--qds-theme-accessory-elevation);\n box-sizing: border-box;\n margin: 0;\n}\n\n.qds-container {\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 &: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 &:checked ~ .qds-track {\n justify-content: flex-end;\n background-color: var(--qds-theme-signature-color-default);\n\n &:hover {\n background-color: var(--qds-theme-signature-color-hover);\n }\n\n &:active {\n background-color: var(--qds-theme-signature-color-pressed);\n }\n }\n}\n\n.qds-disabled {\n opacity: var(--qds-theme-disabled);\n pointer-events: none;\n}\n\n[data-size='small'] {\n &.qds-inline {\n margin-block: var(--qds-control-small-padding-auto-height);\n }\n\n &.qds-track {\n width: var(--qds-control-toggle-track-small-width);\n height: var(--qds-control-toggle-track-small-size);\n }\n\n &.qds-knob {\n height: var(--qds-control-knob-small-size);\n width: var(--qds-control-knob-small-size);\n }\n}\n\n[data-size='standard'] {\n &.qds-inline {\n margin-block: var(--qds-control-standard-padding-auto-height);\n }\n\n &.qds-track {\n width: var(--qds-control-toggle-track-standard-width);\n height: var(--qds-control-toggle-track-standard-height);\n }\n\n &.qds-knob {\n height: var(--qds-control-knob-standard-size);\n width: var(--qds-control-knob-standard-size);\n }\n}\n\n[data-size='large'] {\n &.qds-inline {\n margin-block: var(--qds-control-large-padding-auto-height);\n }\n\n &.qds-track {\n width: var(--qds-control-toggle-track-large-width);\n height: var(--qds-control-toggle-track-large-height);\n }\n\n &.qds-knob {\n height: var(--qds-control-knob-large-size);\n width: var(--qds-control-knob-large-size);\n }\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface, EventEmitter } from '@stencil/core'\nimport {\n AttachInternals,\n Component,\n Element,\n Event,\n h,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core'\n\nimport type { Attributes, QdsFocusEventDetail } from '../../helpers'\nimport { inheritAriaAttributes, pickFocusEventAttributes } from '../../helpers'\nimport type { Value } from '../controls'\nimport { CUSTOM_ERROR_FLAGS, NO_ERROR_FLAGS, VALID_STATE } from '../controls'\nimport type { Size } from '../shared'\n\n/**\n * @see https://quartz.se.com/build/components/switch\n */\n@Component({\n tag: 'qds-switch',\n formAssociated: true,\n shadow: { delegatesFocus: 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 switches's size.\n */\n @Prop() public readonly size?: Size = 'standard'\n\n /**\n *Sets the switch's state.\n *\n * @webnative\n */\n @Prop({ mutable: 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() public readonly 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 // eslint-disable-next-line unicorn/no-null\n @Prop() public readonly form: ElementInternals['form'] | string = null\n\n /**\n * Returns a list of the [`<label>`][] elements associated with the\n * `qds-switch` element.\n *\n * [`<label>`]: https://developer.mozilla.org/docs/Web/HTML/Element/label\n *\n * @readonly\n * @webnative\n */\n // eslint-disable-next-line unicorn/no-null\n @Prop() public readonly labels: HTMLInputElement['labels'] = null\n\n /**\n * The name of the switch, which is submitted with the form data.\n *\n * @webnative\n */\n @Prop() public readonly name?: string\n\n /**\n * The value of the switch, submitted as a name/value pair with form data.\n *\n * @webnative\n */\n @Prop() public readonly value?: Value\n\n /**\n * The error message that would be shown to the user if the `<qds-switch>`\n * was to be checked for validity.\n *\n * @readonly\n * @webnative\n */\n @Prop()\n public readonly validationMessage: ElementInternals['validationMessage'] = ''\n\n /**\n * The [`ValidityState`][] object for this `<qds-switch>`.\n *\n * [`ValidityState`]: https://developer.mozilla.org/docs/Web/API/ValidityState\n *\n * @readonly\n * @webnative\n */\n @Prop() public readonly validity: ElementInternals['validity'] = VALID_STATE\n\n /**\n * True if `<qds-switch>` will be validated when the form is submitted;\n * false otherwise.\n *\n * @readonly\n * @webnative\n */\n @Prop() public readonly willValidate: ElementInternals['willValidate'] = false\n\n @AttachInternals() private readonly internals!: ElementInternals\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 host!: HTMLElement\n\n @State() private tabIndex?: number\n\n @State() private inheritedAttributes: Attributes = {}\n\n get #computedChecked(): boolean {\n return this.checked ?? false\n }\n\n get #computedDisabled(): boolean {\n return (\n (this.host.matches(':disabled') || (this.disabled ?? false)) &&\n this.host.getAttribute('disabled') !== 'false'\n )\n }\n\n get #computedSize(): Size {\n switch (this.size) {\n case 'standard':\n case 'small':\n case 'large': {\n return this.size\n }\n default: {\n return 'standard'\n }\n }\n }\n\n get #computedValue(): string | null {\n // eslint-disable-next-line unicorn/no-null\n return this.value == null ? null : this.value.toString()\n }\n\n @Listen('click')\n protected onClick(event: MouseEvent): void {\n if (this.#computedDisabled) {\n event.stopImmediatePropagation()\n return\n }\n\n event.preventDefault()\n\n this.checked = !this.#computedChecked\n this.changeEmitter.emit()\n }\n\n @Watch('checked')\n protected checkedChanged(): void {\n this.#updateFormValue()\n this.internals.ariaChecked = this.#computedChecked.toString()\n }\n\n @Watch('disabled')\n protected disabledChanged(): void {\n this.#updateFormValue()\n this.internals.ariaDisabled = this.#computedDisabled.toString()\n }\n\n @Watch('tabindex')\n protected tabindexChanged(newValue: string): void {\n const parsedValue = Number.parseInt(newValue, 10)\n this.tabIndex =\n parsedValue === 0 || Number.isNaN(parsedValue) ? undefined : parsedValue\n }\n\n @Watch('value')\n protected valueChanged(): void {\n this.#updateFormValue()\n }\n\n public componentWillLoad(): void {\n this.internals.role = 'switch'\n this.checkedChanged()\n this.disabledChanged()\n\n this.#defineGetter('form', () => this.internals.form)\n this.#defineGetter('labels', () => this.internals.labels)\n this.#defineGetter(\n 'validationMessage',\n () => this.internals.validationMessage,\n )\n this.#defineGetter('validity', () => this.internals.validity)\n this.#defineGetter('willValidate', () => this.internals.willValidate)\n\n this.inheritedAttributes = inheritAriaAttributes(this.host)\n this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0')\n }\n\n public render() {\n return (\n <div\n class={{\n 'qds-container': true,\n 'qds-disabled': this.#computedDisabled,\n 'qds-inline': this.inline,\n }}\n data-size={this.#computedSize}\n >\n <input\n aria-hidden=\"true\"\n // eslint-disable-next-line jsx-a11y/no-autofocus\n autoFocus={this.host.autofocus}\n checked={this.checked}\n class=\"qds-switch\"\n disabled={this.disabled}\n onBlur={this.#onBlur}\n onFocus={this.#onFocus}\n tabIndex={this.#computedDisabled ? undefined : this.tabIndex}\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.#computedSize}>\n <div class=\"qds-knob\" data-size={this.#computedSize} />\n </div>\n </div>\n )\n }\n\n public checkValidity: ElementInternals['checkValidity'] = () =>\n this.internals.checkValidity()\n\n public reportValidity: ElementInternals['reportValidity'] = () =>\n this.internals.reportValidity()\n\n public setCustomValidity: HTMLInputElement['setCustomValidity'] = (error) => {\n if (error) this.internals.setValidity(CUSTOM_ERROR_FLAGS, error, this.host)\n else this.internals.setValidity(NO_ERROR_FLAGS)\n }\n\n readonly #onBlur = (event: FocusEvent): void => {\n this.blurEmitter.emit(pickFocusEventAttributes(event))\n }\n\n readonly #onFocus = (event: FocusEvent): void => {\n this.focusEmitter.emit(pickFocusEventAttributes(event))\n }\n\n #defineGetter(p: PropertyKey, get: () => unknown): void {\n Object.defineProperty(this.host, p, { enumerable: true, get })\n }\n\n #updateFormValue(): void {\n this.internals.setFormValue(\n this.#computedChecked && !this.#computedDisabled\n ? this.#computedValue\n : // eslint-disable-next-line unicorn/no-null\n null,\n )\n }\n}\n"],"version":3}
@@ -3,14 +3,14 @@
3
3
  *
4
4
  * SPDX-License-Identifier: Apache-2.0
5
5
  */
6
- import { p as proxyCustomElement, H, c as createEvent, h } from './p-2806fee1.js';
6
+ import { p as proxyCustomElement, H, c as createEvent, h } from './p-50f85f75.js';
7
7
  import { p as pickFocusEventAttributes, r as resolveTarget, i as inheritAriaAttributes } from './p-8abba29b.js';
8
- import { d as defineCustomElement$7 } from './p-3c48ff53.js';
9
- import { d as defineCustomElement$6 } from './p-fed0d11f.js';
10
- import { d as defineCustomElement$5 } from './p-ba880369.js';
11
- import { d as defineCustomElement$4 } from './p-a6310886.js';
12
- import { d as defineCustomElement$3 } from './p-fac26e20.js';
13
- import { d as defineCustomElement$2 } from './p-c80f112a.js';
8
+ import { d as defineCustomElement$7 } from './p-e22dd76d.js';
9
+ import { d as defineCustomElement$6 } from './p-5570cc30.js';
10
+ import { d as defineCustomElement$5 } from './p-72c09714.js';
11
+ import { d as defineCustomElement$4 } from './p-ba860c62.js';
12
+ import { d as defineCustomElement$3 } from './p-a529eb5c.js';
13
+ import { d as defineCustomElement$2 } from './p-70d12c72.js';
14
14
 
15
15
  const tabCss = ":host([hidden]){display:none!important}:host{display:inline-block;line-height:0}[aria-disabled=true]{opacity:var(--qds-theme-disabled);pointer-events:none}.qds-target{-webkit-appearance:none;appearance:none;background-color:initial;border:none;cursor:pointer;padding:0;pointer-events:auto}.qds-target:disabled{pointer-events:none}.qds-target:focus-visible{border-radius:var(--qds-focus-border-radius);outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width);outline-offset:var(--qds-focus-border-offset)}.qds-target-icon{color:var(--qds-theme-control-text-standard)}.qds-icon,.qds-target-icon{flex-shrink:0}.qds-chevron{transform:rotate(180deg)}.qds-closable-wrapper,.qds-tab{position:relative}.qds-closable-tab,.qds-closable-wrapper,.qds-tab,.qds-target,.qds-texts{display:flex}.qds-texts{flex:1 0;flex-direction:column}.qds-icon,.qds-text{color:var(--qds-theme-title)}.qds-subtitle{color:var(--qds-theme-subtitle);font:var(--qds-control-tab-standard-subtitle)}.qds-indicator{inset-block-start:0;inset-inline-end:0;position:absolute;transform:translate(50%,-50%)}.qds-closable-wrapper[data-size=small],.qds-tab[data-size=small]{gap:var(--qds-control-tab-small-gap-internal);min-height:var(--qds-control-tab-small-height);padding-inline:var(--qds-control-tab-small-padding-horizontal)}.qds-collapse[data-size=small]{min-width:var(--qds-control-tab-small-height)}.qds-closable-tab[data-size=small]{gap:var(--qds-control-tab-small-gap-internal)}[data-size=small]>.qds-icon{font-size:var(--qds-control-tab-small-icon-size)}[data-size=small]>.qds-texts{gap:var(--qds-control-tab-small-titles-gap)}[data-size=small] .qds-text{font:var(--qds-control-tab-small-title)}[data-size=small] .qds-subtitle{font:var(--qds-control-tab-small-subtitle)}.qds-target-icon[data-size=small]{--qds-experimental-icon-click-target-size:var(--qds-control-small-height);height:var(--qds-control-small-icon-size);width:var(--qds-control-small-icon-size)}.qds-closable-wrapper[data-size=standard],.qds-tab[data-size=standard]{gap:var(--qds-control-tab-standard-gap-internal);min-height:var(--qds-control-tab-standard-height);padding-inline:var(--qds-control-tab-standard-padding-horizontal)}.qds-collapse[data-size=standard]{min-width:var(--qds-control-tab-standard-height)}.qds-closable-tab[data-size=standard]{gap:var(--qds-control-tab-standard-gap-internal)}[data-size=standard]>.qds-icon{font-size:var(--qds-control-tab-standard-icon-size)}[data-size=standard]>.qds-texts{gap:var(--qds-control-tab-standard-titles-gap)}[data-size=standard] .qds-text{font:var(--qds-control-tab-standard-title)}[data-size=standard] .qds-subtitle{font:var(--qds-control-tab-standard-subtitle)}.qds-target-icon[data-size=standard]{--qds-experimental-icon-click-target-size:var(\n --qds-control-standard-height\n );height:var(--qds-control-standard-icon-size);width:var(--qds-control-standard-icon-size)}.qds-closable-wrapper[data-size=large],.qds-tab[data-size=large]{gap:var(--qds-control-tab-large-gap-internal);min-height:var(--qds-control-tab-large-height);padding-inline:var(--qds-control-tab-large-padding-horizontal)}.qds-collapse[data-size=large]{min-width:var(--qds-control-tab-large-height)}.qds-closable-tab[data-size=large]{gap:var(--qds-control-tab-large-gap-internal)}[data-size=large]>.qds-icon{font-size:var(--qds-control-tab-large-icon-size)}[data-size=large]>.qds-texts{gap:var(--qds-control-tab-large-titles-gap)}[data-size=large] .qds-text{font:var(--qds-control-tab-large-title)}[data-size=large] .qds-subtext{font:var(--qds-control-tab-large-subtitle)}.qds-target-icon[data-size=large]{--qds-experimental-icon-click-target-size:var(--qds-control-large-height);height:var(--qds-control-large-icon-size);width:var(--qds-control-large-icon-size)}.qds-selected.qds-closable-wrapper[data-importance=emphasized],.qds-selected.qds-tab[data-importance=emphasized]{background-color:var(--qds-theme-control-background)}[data-importance=emphasized][data-size=standard] .qds-text{font:var(--qds-control-tab-standard-title-emphasized)}[data-importance=emphasized][data-size=small] .qds-text{font:var(--qds-control-tab-small-title-emphasized)}[data-importance=emphasized][data-size=large] .qds-text{font:var(--qds-control-tab-large-title-emphasized)}[data-importance=emphasized] .qds-icon,[data-importance=standard] .qds-selected .qds-icon{color:var(--qds-theme-signature-color-default)}:is(.qds-selected[data-importance=subdued],.qds-selected[data-importance=standard],.qds-selected[data-importance=emphasized],.qds-closable-wrapper[data-importance=subdued],.qds-closable-wrapper[data-importance=standard],.qds-closable-wrapper[data-importance=emphasized],[data-importance=subdued] .qds-tab:hover,[data-importance=standard] .qds-tab:hover,[data-importance=emphasized] .qds-tab:hover):after{border-radius:var(--qds-signature-line-connection-cap-radius);content:\"\";display:block;position:absolute}.qds-indicator-inline-end:is(.qds-selected[data-importance=subdued],.qds-selected[data-importance=standard],.qds-selected[data-importance=emphasized],.qds-closable-wrapper[data-importance=subdued],.qds-closable-wrapper[data-importance=standard],.qds-closable-wrapper[data-importance=emphasized],[data-importance=subdued] .qds-tab:hover,[data-importance=standard] .qds-tab:hover,[data-importance=emphasized] .qds-tab:hover):after,.qds-indicator-inline-start:is(.qds-selected[data-importance=subdued],.qds-selected[data-importance=standard],.qds-selected[data-importance=emphasized],.qds-closable-wrapper[data-importance=subdued],.qds-closable-wrapper[data-importance=standard],.qds-closable-wrapper[data-importance=emphasized],[data-importance=subdued] .qds-tab:hover,[data-importance=standard] .qds-tab:hover,[data-importance=emphasized] .qds-tab:hover):after{height:100%;width:var(--qds-signature-line-connection-width)}.qds-indicator-inline-end:is(.qds-selected[data-importance=subdued],.qds-selected[data-importance=standard],.qds-selected[data-importance=emphasized],.qds-closable-wrapper[data-importance=subdued],.qds-closable-wrapper[data-importance=standard],.qds-closable-wrapper[data-importance=emphasized],[data-importance=subdued] .qds-tab:hover,[data-importance=standard] .qds-tab:hover,[data-importance=emphasized] .qds-tab:hover):after{inset-inline-end:0}.qds-indicator-inline-start:is(.qds-selected[data-importance=subdued],.qds-selected[data-importance=standard],.qds-selected[data-importance=emphasized],.qds-closable-wrapper[data-importance=subdued],.qds-closable-wrapper[data-importance=standard],.qds-closable-wrapper[data-importance=emphasized],[data-importance=subdued] .qds-tab:hover,[data-importance=standard] .qds-tab:hover,[data-importance=emphasized] .qds-tab:hover):after{inset-inline-start:0}.qds-indicator-block-end:is(.qds-selected[data-importance=subdued],.qds-selected[data-importance=standard],.qds-selected[data-importance=emphasized],.qds-closable-wrapper[data-importance=subdued],.qds-closable-wrapper[data-importance=standard],.qds-closable-wrapper[data-importance=emphasized],[data-importance=subdued] .qds-tab:hover,[data-importance=standard] .qds-tab:hover,[data-importance=emphasized] .qds-tab:hover):after,.qds-indicator-block-start:is(.qds-selected[data-importance=subdued],.qds-selected[data-importance=standard],.qds-selected[data-importance=emphasized],.qds-closable-wrapper[data-importance=subdued],.qds-closable-wrapper[data-importance=standard],.qds-closable-wrapper[data-importance=emphasized],[data-importance=subdued] .qds-tab:hover,[data-importance=standard] .qds-tab:hover,[data-importance=emphasized] .qds-tab:hover):after{height:var(--qds-signature-line-connection-width);width:100%}.qds-indicator-block-end:is(.qds-selected[data-importance=subdued],.qds-selected[data-importance=standard],.qds-selected[data-importance=emphasized],.qds-closable-wrapper[data-importance=subdued],.qds-closable-wrapper[data-importance=standard],.qds-closable-wrapper[data-importance=emphasized],[data-importance=subdued] .qds-tab:hover,[data-importance=standard] .qds-tab:hover,[data-importance=emphasized] .qds-tab:hover):after{bottom:0}.qds-indicator-block-start:is(.qds-selected[data-importance=subdued],.qds-selected[data-importance=standard],.qds-selected[data-importance=emphasized],.qds-closable-wrapper[data-importance=subdued],.qds-closable-wrapper[data-importance=standard],.qds-closable-wrapper[data-importance=emphasized],[data-importance=subdued] .qds-tab:hover,[data-importance=standard] .qds-tab:hover,[data-importance=emphasized] .qds-tab:hover):after{top:0}.qds-selected[data-importance=standard][data-size=standard] .qds-text,.qds-selected[data-importance=subdued][data-size=standard] .qds-text{font:var(--qds-control-tab-standard-title-emphasized)}.qds-selected[data-importance=standard][data-size=small] .qds-text,.qds-selected[data-importance=subdued][data-size=small] .qds-text{font:var(--qds-control-tab-small-title-emphasized)}.qds-selected[data-importance=standard][data-size=large] .qds-text,.qds-selected[data-importance=subdued][data-size=large] .qds-text{font:var(--qds-control-tab-large-title-emphasized)}[data-importance=emphasized]:hover:after,[data-importance=standard]:hover:after{background-color:var(--qds-theme-signature-color-hover)}[data-importance=emphasized]:active:after,[data-importance=standard]:active:after{background-color:var(--qds-theme-signature-color-pressed)}.qds-selected[data-importance=emphasized]:after,.qds-selected[data-importance=standard]:after{background-color:var(--qds-theme-signature-color-default)}.qds-selected[data-importance=subdued]:after,[data-importance=subdued] :active:after{background-color:var(--qds-theme-link-subdued-pressed)}[data-importance=subdued]:hover:after{background-color:var(--qds-theme-link-subdued-hover)}.qds-tab.qds-icon-only{padding-inline:0}.qds-tab:focus-visible{border-radius:var(--qds-focus-border-radius);outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width);outline-offset:calc(var(--qds-focus-border-width)*-1 - var(--qds-focus-border-offset))}.qds-closable-tab{width:100%}.qds-closable-tab:focus-visible{border-radius:var(--qds-focus-border-radius);outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width)}.qds-closable-tab,.qds-closable-wrapper,.qds-tab{align-items:center;justify-content:center}.qds-closable-tab,.qds-tab{background-color:initial;border:none;cursor:pointer;text-align:initial}.qds-closable-tab:any-link,.qds-tab:any-link{-webkit-text-decoration:none;text-decoration:none}.qds-hidden{display:none}";
16
16
  const QdsTabStyle0 = tabCss;
@@ -3,14 +3,14 @@
3
3
  *
4
4
  * SPDX-License-Identifier: Apache-2.0
5
5
  */
6
- import { p as proxyCustomElement, H, c as createEvent, h } from './p-2806fee1.js';
6
+ import { p as proxyCustomElement, H, c as createEvent, h } from './p-50f85f75.js';
7
7
  import { c as invariant, i as inheritAriaAttributes } from './p-8abba29b.js';
8
- import { d as defineCustomElement$7 } from './p-3c48ff53.js';
9
- import { d as defineCustomElement$6 } from './p-fed0d11f.js';
10
- import { d as defineCustomElement$5 } from './p-adefd438.js';
11
- import { d as defineCustomElement$4 } from './p-b4c302d4.js';
12
- import { d as defineCustomElement$3 } from './p-ba880369.js';
13
- import { d as defineCustomElement$2 } from './p-c80f112a.js';
8
+ import { d as defineCustomElement$7 } from './p-e22dd76d.js';
9
+ import { d as defineCustomElement$6 } from './p-5570cc30.js';
10
+ import { d as defineCustomElement$5 } from './p-b6c04008.js';
11
+ import { d as defineCustomElement$4 } from './p-e2a9e441.js';
12
+ import { d as defineCustomElement$3 } from './p-72c09714.js';
13
+ import { d as defineCustomElement$2 } from './p-70d12c72.js';
14
14
 
15
15
  const tabbarCss = ":host([hidden]){display:none!important}:host{display:block}.qds-tabbar,.qds-tabs,.qds-vertical,.qds-vertical-divider{display:flex}.qds-tabbar,.qds-vertical-divider{width:inherit}.qds-arrow-start{transform:scaleX(var(--qds-direction-factor,1)) rotate(90deg)}.qds-arrow-end{transform:scaleX(var(--qds-direction-factor,1)) rotate(-90deg)}.qds-flex{display:flex}.qds-hidden{display:none}.qds-tabs{flex:1;margin-block:0;overflow:hidden;padding-inline-start:0;scroll-behavior:smooth}.qds-vertical{flex-direction:column}.qds-vertical-divider{flex-direction:row}[data-layer=main][data-level=root] .qds-tabs{gap:var(--qds-control-large-gap-siblings-related)}[data-layer=main][data-level=section] .qds-tabs{gap:var(--qds-control-standard-gap-siblings-related)}[data-layer=main][data-level=subsection] .qds-tabs{gap:var(--qds-control-small-gap-siblings-related)}[data-layer=popup][data-level=root] .qds-tabs{gap:var(--qds-control-standard-gap-siblings-related)}[data-layer=popup][data-level=section] .qds-tabs{gap:var(--qds-control-small-gap-siblings-related)}:is([data-layer=panel],[data-layer=accessory])[data-level=root] .qds-tabs{gap:var(--qds-control-small-gap-siblings-related)}";
16
16
  const QdsTabbarStyle0 = tabbarCss;