@quartzds/core 1.0.0-beta.91 → 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 (181) 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-2bf0797c.js → p-9ffb4b49.js} +7 -7
  11. package/components/p-9ffb4b49.js.map +1 -0
  12. package/components/{p-3baf75f4.js → p-a529eb5c.js} +3 -3
  13. package/components/{p-3baf75f4.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-d6e52d0b.js → p-b6c04008.js} +21 -13
  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 +5 -5
  43. package/components/qds-loader.js +3 -3
  44. package/components/qds-nav-list-item.js +6 -6
  45. package/components/qds-progress-bar.js +3 -3
  46. package/components/qds-radio.js +7 -7
  47. package/components/qds-radio.js.map +1 -1
  48. package/components/qds-select.js +2 -2
  49. package/components/qds-standalone-link.js +4 -4
  50. package/components/qds-switch.js +5 -5
  51. package/components/qds-switch.js.map +1 -1
  52. package/components/qds-tab.js +7 -7
  53. package/components/qds-tabbar.js +7 -7
  54. package/components/qds-table-body.js +2 -2
  55. package/components/qds-table-cell.js +2 -2
  56. package/components/qds-table-head-cell.js +1 -1
  57. package/components/qds-table-head.js +2 -2
  58. package/components/qds-table-row.js +2 -2
  59. package/components/qds-table.js +2 -2
  60. package/components/qds-tag.js +1 -1
  61. package/components/qds-textarea.js +1 -1
  62. package/components/qds-title.js +1 -1
  63. package/components/qds-tooltip.js +1 -1
  64. package/dist/cjs/{index-523dd2e0.js → index-dbcccf98.js} +6 -29
  65. package/dist/cjs/index-dbcccf98.js.map +1 -0
  66. package/dist/cjs/index.cjs.js +2 -2
  67. package/dist/cjs/{library-41b19b9e.js → library-23467d99.js} +8 -2
  68. package/dist/cjs/library-23467d99.js.map +1 -0
  69. package/dist/cjs/loader.cjs.js +2 -2
  70. package/dist/cjs/qds-badge-counter_2.cjs.entry.js +1 -1
  71. package/dist/cjs/qds-breadcrumb-item.cjs.entry.js +6 -3
  72. package/dist/cjs/qds-breadcrumb-item.cjs.entry.js.map +1 -1
  73. package/dist/cjs/qds-button.cjs.entry.js +16 -8
  74. package/dist/cjs/qds-button.cjs.entry.js.map +1 -1
  75. package/dist/cjs/qds-checkbox.cjs.entry.js +3 -3
  76. package/dist/cjs/qds-checkbox.cjs.entry.js.map +1 -1
  77. package/dist/cjs/qds-chip.cjs.entry.js +10 -7
  78. package/dist/cjs/qds-chip.cjs.entry.js.map +1 -1
  79. package/dist/cjs/qds-dialog.cjs.entry.js +3 -3
  80. package/dist/cjs/qds-dialog.cjs.entry.js.map +1 -1
  81. package/dist/cjs/qds-divider.cjs.entry.js +2 -2
  82. package/dist/cjs/qds-dropdown.cjs.entry.js +3 -3
  83. package/dist/cjs/qds-form-message.cjs.entry.js +3 -3
  84. package/dist/cjs/qds-icon.cjs.entry.js +3 -3
  85. package/dist/cjs/qds-inline-link.cjs.entry.js +3 -3
  86. package/dist/cjs/qds-input.cjs.entry.js +36 -11
  87. package/dist/cjs/qds-input.cjs.entry.js.map +1 -1
  88. package/dist/cjs/qds-label.cjs.entry.js +8 -5
  89. package/dist/cjs/qds-label.cjs.entry.js.map +1 -1
  90. package/dist/cjs/qds-list-item.cjs.entry.js +1 -1
  91. package/dist/cjs/qds-loader.cjs.entry.js +2 -2
  92. package/dist/cjs/qds-nav-list-item.cjs.entry.js +4 -4
  93. package/dist/cjs/qds-progress-bar.cjs.entry.js +3 -3
  94. package/dist/cjs/qds-radio.cjs.entry.js +4 -4
  95. package/dist/cjs/qds-radio.cjs.entry.js.map +1 -1
  96. package/dist/cjs/qds-select.cjs.entry.js +1 -1
  97. package/dist/cjs/qds-standalone-link.cjs.entry.js +3 -3
  98. package/dist/cjs/qds-switch.cjs.entry.js +5 -5
  99. package/dist/cjs/qds-switch.cjs.entry.js.map +1 -1
  100. package/dist/cjs/qds-tab.cjs.entry.js +1 -1
  101. package/dist/cjs/qds-tabbar.cjs.entry.js +1 -1
  102. package/dist/cjs/qds-table-body.cjs.entry.js +2 -2
  103. package/dist/cjs/qds-table-cell.cjs.entry.js +2 -2
  104. package/dist/cjs/qds-table-head-cell.cjs.entry.js +1 -1
  105. package/dist/cjs/qds-table-head.cjs.entry.js +2 -2
  106. package/dist/cjs/qds-table-row.cjs.entry.js +2 -2
  107. package/dist/cjs/qds-table.cjs.entry.js +2 -2
  108. package/dist/cjs/qds-tag_2.cjs.entry.js +7 -4
  109. package/dist/cjs/qds-tag_2.cjs.entry.js.map +1 -1
  110. package/dist/cjs/qds-textarea.cjs.entry.js +1 -1
  111. package/dist/cjs/qds-tooltip.cjs.entry.js +6 -21
  112. package/dist/cjs/qds-tooltip.cjs.entry.js.map +1 -1
  113. package/dist/cjs/qds.cjs.js +2 -2
  114. package/dist/custom-elements.json +50 -20
  115. package/dist/docs.json +1 -1
  116. package/dist/esm/{index-b1d6acd2.js → index-bc9462c1.js} +6 -30
  117. package/dist/esm/index-bc9462c1.js.map +1 -0
  118. package/dist/esm/index.js +2 -2
  119. package/dist/esm/{library-2e5458af.js → library-52ae166a.js} +8 -2
  120. package/dist/esm/library-52ae166a.js.map +1 -0
  121. package/dist/esm/loader.js +3 -3
  122. package/dist/esm/qds-badge-counter_2.entry.js +1 -1
  123. package/dist/esm/qds-breadcrumb-item.entry.js +6 -3
  124. package/dist/esm/qds-breadcrumb-item.entry.js.map +1 -1
  125. package/dist/esm/qds-button.entry.js +16 -8
  126. package/dist/esm/qds-button.entry.js.map +1 -1
  127. package/dist/esm/qds-checkbox.entry.js +3 -3
  128. package/dist/esm/qds-checkbox.entry.js.map +1 -1
  129. package/dist/esm/qds-chip.entry.js +10 -7
  130. package/dist/esm/qds-chip.entry.js.map +1 -1
  131. package/dist/esm/qds-dialog.entry.js +3 -3
  132. package/dist/esm/qds-dialog.entry.js.map +1 -1
  133. package/dist/esm/qds-divider.entry.js +2 -2
  134. package/dist/esm/qds-dropdown.entry.js +3 -3
  135. package/dist/esm/qds-form-message.entry.js +3 -3
  136. package/dist/esm/qds-icon.entry.js +3 -3
  137. package/dist/esm/qds-inline-link.entry.js +3 -3
  138. package/dist/esm/qds-input.entry.js +36 -11
  139. package/dist/esm/qds-input.entry.js.map +1 -1
  140. package/dist/esm/qds-label.entry.js +8 -5
  141. package/dist/esm/qds-label.entry.js.map +1 -1
  142. package/dist/esm/qds-list-item.entry.js +1 -1
  143. package/dist/esm/qds-loader.entry.js +2 -2
  144. package/dist/esm/qds-nav-list-item.entry.js +4 -4
  145. package/dist/esm/qds-progress-bar.entry.js +3 -3
  146. package/dist/esm/qds-radio.entry.js +4 -4
  147. package/dist/esm/qds-radio.entry.js.map +1 -1
  148. package/dist/esm/qds-select.entry.js +1 -1
  149. package/dist/esm/qds-standalone-link.entry.js +3 -3
  150. package/dist/esm/qds-switch.entry.js +5 -5
  151. package/dist/esm/qds-switch.entry.js.map +1 -1
  152. package/dist/esm/qds-tab.entry.js +1 -1
  153. package/dist/esm/qds-tabbar.entry.js +1 -1
  154. package/dist/esm/qds-table-body.entry.js +2 -2
  155. package/dist/esm/qds-table-cell.entry.js +2 -2
  156. package/dist/esm/qds-table-head-cell.entry.js +1 -1
  157. package/dist/esm/qds-table-head.entry.js +2 -2
  158. package/dist/esm/qds-table-row.entry.js +2 -2
  159. package/dist/esm/qds-table.entry.js +2 -2
  160. package/dist/esm/qds-tag_2.entry.js +7 -4
  161. package/dist/esm/qds-tag_2.entry.js.map +1 -1
  162. package/dist/esm/qds-textarea.entry.js +1 -1
  163. package/dist/esm/qds-tooltip.entry.js +6 -21
  164. package/dist/esm/qds-tooltip.entry.js.map +1 -1
  165. package/dist/esm/qds.js +3 -3
  166. package/dist/types/components/input/input.d.ts +1 -0
  167. package/dist/types/components/tooltip/tooltip.d.ts +0 -2
  168. package/hydrate/index.js +134 -115
  169. package/hydrate/index.mjs +134 -115
  170. package/package.json +1 -1
  171. package/components/p-2806fee1.js.map +0 -1
  172. package/components/p-2bf0797c.js.map +0 -1
  173. package/components/p-a020ece3.js.map +0 -1
  174. package/components/p-a6310886.js.map +0 -1
  175. package/components/p-ba880369.js.map +0 -1
  176. package/components/p-c80f112a.js.map +0 -1
  177. package/components/p-d6e52d0b.js.map +0 -1
  178. package/dist/cjs/index-523dd2e0.js.map +0 -1
  179. package/dist/cjs/library-41b19b9e.js.map +0 -1
  180. package/dist/esm/index-b1d6acd2.js.map +0 -1
  181. package/dist/esm/library-2e5458af.js.map +0 -1
@@ -0,0 +1 @@
1
+ {"file":"p-b5608061.js","mappings":";;;;;;;;;AAAA,MAAM,QAAQ,GAAG,kgCAAkgC,CAAC;AACphC,uBAAe,QAAQ;;ACDvB;AACA;AACA;;;;;;;;;;;;;;;;;;MAkBa,KAAK;IALlB;;;;;;;;;;;QAY0B,WAAM,GAAY,KAAK,CAAA;;;;QAKvB,aAAQ,GAAY,KAAK,CAAA;;;;QAKzB,SAAI,GAAU,UAAU,CAAA;QAO/B,YAAO,GAAG,KAAK,CAAA;QAEhC,+BAAwB;QAExB,4BAAoB;QAEpB,8BAAuB;QAgEd,0BAAY,CAAC,KAAuB;YAC3C,uBAAA,IAAI,gBAAU,KAAK,MAAA,CAAA;SACpB,EAAA;QAEQ,yBAAW,CAAC,IAAsB;YACzC,uBAAA,IAAI,eAAS,IAAI,MAAA,CAAA;SAClB,EAAA;QAEQ,4BAAc,CAAC,OAA+B;YACrD,IAAI,OAAO;;gBAET,OAAO,CAAC,MAAM,GAAG,uBAAA,IAAI,oBAAO,CAAA;SAC/B,EAAA;KACF;IA7DW,WAAW;QACnB,IAAI,uBAAA,IAAI,iBAAI;YAAE,uBAAA,IAAI,iBAAI,CAAC,UAAU,EAAE,CAAA;QAEnC,IAAI,CAAC,uBAAA,IAAI,mBAAM;YAAE,OAAM;QAEvB,MAAM,IAAI,GAAG,uBAAA,IAAI,mBAAM,CAAA;QACvB,QAAQ,CAAC;YACP,IAAI,CAAC,OAAO,GAAG,aAAa,CAAC,IAAI,CAAC,CAAA;SACnC,CAAC,CAAA;QACF,uBAAA,IAAI,aAAO,IAAI,cAAc,CAAC,CAAC,CAAC,SAAS,CAAC;YACxC,IAAI,CAAC,OAAO,GAAG,aAAa,CAAC,SAAS,CAAC,MAAM,CAAC,CAAA;SAC/C,CAAC,MAAA,CAAA;QACF,uBAAA,IAAI,iBAAI,CAAC,OAAO,CAAC,uBAAA,IAAI,mBAAM,CAAC,CAAA;KAC7B;IAEM,gBAAgB;QACrB,IAAI,CAAC,WAAW,EAAE,CAAA;KACnB;IAEM,oBAAoB;QACzB,IAAI,uBAAA,IAAI,iBAAI;YAAE,uBAAA,IAAI,iBAAI,CAAC,UAAU,EAAE,CAAA;KACpC;IAEM,MAAM;QACX,QACE,6DACE,KAAK,EAAE;gBACL,YAAY,EAAE,IAAI,CAAC,MAAM;gBACzB,WAAW,EAAE,IAAI;aAClB,eACU,uBAAA,IAAI,iDAAc,EAC7B,GAAG,EAAE,uBAAA,IAAI,uBAAU;;YAEnB,QAAQ,EAAE,IAAI,CAAC,OAAO,GAAG,CAAC,GAAG,SAAS,IAErC,IAAI,CAAC,QAAQ,IAAI,6DAAM,KAAK,EAAC,cAAc,QAAS,EACrD,6DAAM,KAAK,EAAC,UAAU,EAAC,GAAG,EAAE,uBAAA,IAAI,sBAAS,IACtC,IAAI,CAAC,IAAI,CACL,EACN,IAAI,CAAC,OAAO,KACX,mFAAyB,MAAM,EAAC,GAAG,EAAE,uBAAA,IAAI,yBAAY,IAClD,IAAI,CAAC,IAAI,CACE,CACf,CACI,EACR;KACF;;;;;;;;;;;;;;;IA3DC,QAAQ,IAAI,CAAC,IAAI;QACf,KAAK,UAAU,CAAC;QAChB,KAAK,OAAO,CAAC;QACb,KAAK,OAAO,EAAE;YACZ,OAAO,IAAI,CAAC,IAAI,CAAA;SACjB;QACD,SAAS;YACP,OAAO,UAAU,CAAA;SAClB;KACF;AACH,CAAC;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/label/label.css?tag=qds-label&encapsulation=shadow","src/components/label/label.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-label {\n box-sizing: border-box;\n color: var(--qds-theme-control-text-standard);\n display: inline-flex;\n gap: var(--qds-text-icon-gap);\n width: 100%;\n\n &:focus-visible {\n outline: var(--qds-focus-border-width) solid var(--qds-theme-focus-border);\n outline-offset: var(--qds-focus-border-offset);\n border-radius: var(--qds-focus-border-radius);\n }\n}\n\n.qds-text {\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 2;\n overflow: hidden;\n}\n\n.qds-required {\n color: var(--qds-theme-feedback-field-required);\n user-select: none;\n}\n\n[data-size='small'] {\n font: var(--qds-control-small-text);\n\n &.qds-inline {\n margin-block: var(--qds-control-small-padding-auto-height);\n }\n}\n\n[data-size='standard'] {\n font: var(--qds-control-standard-text);\n\n &.qds-inline {\n margin-block: var(--qds-control-standard-padding-auto-height);\n }\n}\n\n[data-size='large'] {\n font: var(--qds-control-large-text);\n\n &.qds-inline {\n margin-block: var(--qds-control-large-padding-auto-height);\n }\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface } from '@stencil/core'\nimport { Component, h, Prop, readTask, State, Watch } from '@stencil/core'\n\nimport { isOverflowing } from '../../helpers'\nimport type { Size } from '../shared'\n\n/**\n * `<qds-label>` elements represent a caption for an item in a user interface.\n *\n * @see https://quartz.se.com/build/components/label\n */\n@Component({\n tag: 'qds-label',\n shadow: true,\n styleUrl: 'label.css',\n})\nexport class Label implements ComponentInterface {\n /**\n * Adds vertical margin to the label 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 * Specify the labelled item as required by appending a red asterisk (*).\n */\n @Prop() public readonly required: boolean = false\n\n /**\n * The label's size.\n */\n @Prop() public readonly size?: Size = 'standard'\n\n /**\n * The label's text.\n */\n @Prop() public readonly text?: string\n\n @State() private tooltip = false\n\n #label?: HTMLSpanElement\n\n #ro?: ResizeObserver\n\n #span?: HTMLSpanElement\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 @Watch('text')\n protected textChanged(): void {\n if (this.#ro) this.#ro.disconnect()\n\n if (!this.#span) return\n\n const span = this.#span\n readTask(() => {\n this.tooltip = isOverflowing(span)\n })\n this.#ro = new ResizeObserver(([spanEntry]) => {\n this.tooltip = isOverflowing(spanEntry.target)\n })\n this.#ro.observe(this.#span)\n }\n\n public componentDidLoad(): void {\n this.textChanged()\n }\n\n public disconnectedCallback(): void {\n if (this.#ro) this.#ro.disconnect()\n }\n\n public render() {\n return (\n <span\n class={{\n 'qds-inline': this.inline,\n 'qds-label': true,\n }}\n data-size={this.#computedSize}\n ref={this.#labelRef}\n // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n tabIndex={this.tooltip ? 0 : undefined}\n >\n {this.required && <span class=\"qds-required\">*</span>}\n <span class=\"qds-text\" ref={this.#spanRef}>\n {this.text}\n </span>\n {this.tooltip && (\n <qds-tooltip aria-hidden=\"true\" ref={this.#tooltipRef}>\n {this.text}\n </qds-tooltip>\n )}\n </span>\n )\n }\n\n readonly #labelRef = (label?: HTMLSpanElement): void => {\n this.#label = label\n }\n\n readonly #spanRef = (span?: HTMLSpanElement): void => {\n this.#span = span\n }\n\n readonly #tooltipRef = (tooltip?: HTMLQdsTooltipElement): void => {\n if (tooltip)\n // eslint-disable-next-line no-param-reassign\n tooltip.target = this.#label\n }\n}\n"],"version":3}
@@ -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, r as readTask, h } from './p-50f85f75.js';
7
7
  import { p as pickFocusEventAttributes, b as isOverflowing } 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$4 } from './p-3c48ff53.js';
10
- import { d as defineCustomElement$3 } from './p-fed0d11f.js';
11
- import { d as defineCustomElement$2 } from './p-ba880369.js';
12
- import { d as defineCustomElement$1 } from './p-c80f112a.js';
9
+ import { d as defineCustomElement$4 } from './p-e22dd76d.js';
10
+ import { d as defineCustomElement$3 } from './p-5570cc30.js';
11
+ import { d as defineCustomElement$2 } from './p-72c09714.js';
12
+ import { d as defineCustomElement$1 } from './p-70d12c72.js';
13
13
 
14
14
  const buttonCss = ":host([hidden]){display:none!important}:host{display:inline-block}.qds-button:disabled,.qds-disabled{opacity:var(--qds-theme-disabled);pointer-events:none}.qds-overflow{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.qds-overflow[data-size=hero]{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;white-space:normal}.qds-action{transform:scaleX(var(--qds-direction-factor,1))}.qds-container{display:grid;grid-template-areas:\"b\"}.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:b;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-button{align-items:center;-webkit-appearance:none;appearance:none;background-color:initial;border:none;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 );box-sizing:border-box;cursor:pointer;display:inline-flex;grid-area:b;justify-content:center;min-width:0;outline:none;padding-block:0;position:relative;-webkit-print-color-adjust:exact;print-color-adjust:exact;text-align:center;-webkit-user-select:none;user-select:none}.qds-button:any-link{-webkit-text-decoration:none;text-decoration:none}.qds-button:focus-visible~.qds-focus-ring{visibility:visible}.qds-icon{flex-shrink:0}.qds-indicator{inset-block-start:0;inset-inline-end:0;position:absolute;transform:translate(50%,-50%)}[data-size=small]{font:var(--qds-control-small-text)}.qds-button[data-size=small]{gap:var(--qds-control-small-gap-internal);height:var(--qds-control-small-height);padding-inline:var(--qds-control-button-small-padding-horizontal)}.qds-button.qds-icon-only[data-size=small]{width:var(--qds-control-small-height)}.qds-icon[data-size=small]{font-size:var(--qds-control-small-icon-size)}[data-size=standard]{font:var(--qds-control-standard-text)}.qds-button[data-size=standard]{gap:var(--qds-control-standard-gap-internal);height:var(--qds-control-standard-height);padding-inline:var(--qds-control-button-standard-padding-horizontal)}.qds-button.qds-icon-only[data-size=standard]{width:var(--qds-control-standard-height)}.qds-icon[data-size=standard]{font-size:var(--qds-control-standard-icon-size)}[data-size=large]{font:var(--qds-control-large-text)}.qds-button[data-size=large]{gap:var(--qds-control-large-gap-internal);height:var(--qds-control-large-height);padding-inline:var(--qds-control-button-large-padding-horizontal)}.qds-button.qds-icon-only[data-size=large]{width:var(--qds-control-large-height)}.qds-icon[data-size=large]{font-size:var(--qds-control-large-icon-size)}[data-size=large],[data-size=small],[data-size=standard]{line-height:normal}.qds-button.qds-icon-only[data-size=large],.qds-button.qds-icon-only[data-size=small],.qds-button.qds-icon-only[data-size=standard]{padding-inline:0}[data-size=hero]{font:var(--qds-control-hero-text)}.qds-button[data-size=hero]{border-radius:var(\n --qds-control-border-radius-top-left,var(--qds-control-hero-border-radius)\n ) var(\n --qds-control-border-radius-top-right,var(--qds-control-hero-border-radius)\n ) var(\n --qds-control-border-radius-bottom-right,var(--qds-control-hero-border-radius)\n ) var(\n --qds-control-border-radius-bottom-left,var(--qds-control-hero-border-radius)\n );gap:var(--qds-control-hero-gap-internal);padding-block:var(--qds-control-hero-padding-auto-height);padding-inline:var(--qds-control-button-hero-padding-horizontal)}.qds-button.qds-icon-only[data-size=hero]{height:var(--qds-control-hero-height);padding-inline:0;width:var(--qds-control-hero-height)}.qds-focus-ring[data-size=hero]{border-radius:max(1px,var(\n --qds-control-border-radius-top-left,var(--qds-control-hero-border-radius)\n )) max(1px,var(\n --qds-control-border-radius-top-right,var(--qds-control-hero-border-radius)\n )) max(1px,var(\n --qds-control-border-radius-bottom-right,var(--qds-control-hero-border-radius)\n )) max(1px,var(\n --qds-control-border-radius-bottom-left,var(--qds-control-hero-border-radius)\n ))}.qds-icon[data-size=hero]{font-size:var(--qds-control-hero-icon-size)}[data-importance=subdued]{color:var(--qds-theme-link-standard-default)}.qds-button[data-importance=subdued]{border-block-end:var(--qds-control-border-width) solid #0000;padding-inline:0}.qds-button[data-importance=subdued]:hover{border-block-end:var(--qds-control-border-width) solid var(--qds-theme-link-standard-hover);color:var(--qds-theme-link-standard-hover)}.qds-button[data-importance=subdued]:active{border-block-end:var(--qds-control-border-width) solid var(--qds-theme-link-standard-pressed);color:var(--qds-theme-link-standard-pressed)}.qds-button[data-importance=subdued]:not(.qds-icon-only){border-radius:0}.qds-button.qds-icon-only[data-importance=subdued]{border:none;color:var(--qds-theme-control-text-standard)}.qds-button.qds-icon-only[data-importance=subdued]:hover{background-color:var(--qds-theme-interactive-background-hover)}.qds-button.qds-icon-only[data-importance=subdued]:active{background-color:var(--qds-theme-interactive-background-pressed)}[data-importance=standard]{color:var(--qds-theme-control-text-standard)}.qds-button[data-importance=standard]{border-color:var(--qds-theme-control-border);border-style:solid;border-width:var(--qds-control-border-width) var(\n --qds-control-border-width-inline-end,var(--qds-control-border-width)\n ) var(--qds-control-border-width-block-end,var(--qds-control-border-width)) var(--qds-control-border-width)}.qds-button[data-importance=standard]:hover{background-color:var(--qds-theme-interactive-background-hover)}.qds-button[data-importance=standard]:active{background-color:var(--qds-theme-interactive-background-pressed)}.qds-button[data-importance=emphasized]{background-color:var(--qds-theme-signature-color-default);color:var(--qds-theme-signature-color-contrast)}.qds-button[data-importance=emphasized]:hover{background-color:var(--qds-theme-signature-color-hover)}.qds-button[data-importance=emphasized]:active{background-color:var(--qds-theme-signature-color-pressed)}.qds-button[data-importance=destructive]{background-color:var(--qds-theme-feedback-action-destructive-default);color:var(--qds-theme-feedback-action-destructive-contrast)}.qds-button[data-importance=destructive]:hover{background-color:var(--qds-theme-feedback-action-destructive-hover)}.qds-button[data-importance=destructive]:active{background-color:var(--qds-theme-feedback-action-destructive-pressed)}[data-importance=subdued-destructive]{color:var(--qds-theme-feedback-action-destructive-default)}.qds-button[data-importance=subdued-destructive]{border-block-end:var(--qds-control-border-width) solid #0000;padding-inline:0}.qds-button[data-importance=subdued-destructive]:hover{border-block-end:var(--qds-control-border-width) solid var(--qds-theme-feedback-action-destructive-hover);color:var(--qds-theme-feedback-action-destructive-hover)}.qds-button[data-importance=subdued-destructive]:active{border-block-end:var(--qds-control-border-width) solid var(--qds-theme-feedback-action-destructive-pressed);color:var(--qds-theme-feedback-action-destructive-pressed)}.qds-button[data-importance=subdued-destructive]:not(.qds-icon-only){border-radius:0}.qds-button.qds-icon-only[data-importance=subdued-destructive]{border:none}.qds-button.qds-icon-only[data-importance=subdued-destructive]:hover{background-color:var(--qds-theme-interactive-background-hover);color:var(--qds-theme-feedback-action-destructive-default)}.qds-button.qds-icon-only[data-importance=subdued-destructive]:active{background-color:var(--qds-theme-interactive-background-pressed);color:var(--qds-theme-feedback-action-destructive-default)}:is([data-action=dropdown],[data-action=dropdown-close]) .qds-action{margin-inline-start:auto;transition-duration:.3s;transition-property:transform}[data-importance=standard]:is([data-action=dropdown],[data-action=dropdown-close]){background-color:var(--qds-theme-control-input-background)}:is([data-action=dropdown],[data-action=dropdown-close]):not([data-importance=subdued]):not([data-importance=subdued-destructive]){padding-inline:var(--qds-control-input-padding-horizontal)}[data-action=dropdown-close] .qds-action{transform:rotate(-180deg)}";
15
15
  const QdsButtonStyle0 = buttonCss;
@@ -33,7 +33,7 @@ var __classPrivateFieldSet = (undefined && undefined.__classPrivateFieldSet) ||
33
33
  throw new TypeError("Cannot write private member to an object whose class did not declare it");
34
34
  return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
35
35
  };
36
- var _Button_instances, _Button_button, _Button_span, _Button_ro, _Button_buttonType_get, _Button_iconOnly_get, _Button_computedAction_get, _Button_computedActionIcon_get, _Button_computedDisabled_get, _Button_computedImportance_get, _Button_computedSize_get, _Button_onBlur, _Button_onFocus, _Button_buttonRef, _Button_spanRef, _Button_tooltipRef, _Button_defineGetter;
36
+ var _Button_instances, _Button_button, _Button_span, _Button_ro, _Button_buttonType_get, _Button_iconOnly_get, _Button_computedAction_get, _Button_computedActionIcon_get, _Button_computedDisabled_get, _Button_computedImportance_get, _Button_computedSize_get, _Button_onBlur, _Button_onFocus, _Button_buttonRef, _Button_spanRef, _Button_tooltipRef, _Button_onClick, _Button_defineGetter;
37
37
  const isCounter = (value) => typeof value === 'string'
38
38
  ? !Number.isNaN(Number.parseFloat(value))
39
39
  : typeof value === 'number';
@@ -192,6 +192,11 @@ const Button = /*@__PURE__*/ proxyCustomElement(class Button extends H {
192
192
  // eslint-disable-next-line no-param-reassign
193
193
  tooltip.target = __classPrivateFieldGet(this, _Button_button, "f");
194
194
  });
195
+ _Button_onClick.set(this, (event) => {
196
+ if (__classPrivateFieldGet(this, _Button_instances, "a", _Button_computedDisabled_get)) {
197
+ event.stopImmediatePropagation();
198
+ }
199
+ });
195
200
  }
196
201
  onClick(event) {
197
202
  if (__classPrivateFieldGet(this, _Button_instances, "a", _Button_computedDisabled_get)) {
@@ -222,7 +227,10 @@ const Button = /*@__PURE__*/ proxyCustomElement(class Button extends H {
222
227
  __classPrivateFieldGet(this, _Button_ro, "f").disconnect();
223
228
  if (!__classPrivateFieldGet(this, _Button_span, "f"))
224
229
  return;
225
- this.tooltip = isOverflowing(__classPrivateFieldGet(this, _Button_span, "f"));
230
+ const span = __classPrivateFieldGet(this, _Button_span, "f");
231
+ readTask(() => {
232
+ this.tooltip = isOverflowing(span);
233
+ });
226
234
  __classPrivateFieldSet(this, _Button_ro, new ResizeObserver(([spanEntry]) => {
227
235
  this.tooltip = isOverflowing(spanEntry.target);
228
236
  }), "f");
@@ -251,16 +259,16 @@ const Button = /*@__PURE__*/ proxyCustomElement(class Button extends H {
251
259
  const ariaLabel = hasBadgeProperties
252
260
  ? `${this.text} ${this.badge} ${this.badgeDescription}`
253
261
  : this.text;
254
- return (h("div", { key: 'fa26ab96409ab7594ea6cfeda85a5ab5bc246f3b', class: "qds-container" }, h(Tag, { key: '8b1afcffde6991b7265e4222ca7e2c820d336caa', "aria-hidden": "true", class: {
262
+ return (h("div", { key: 'f45c1caa74aad6de1925b1420269dd80778aa481', class: "qds-container", onClick: __classPrivateFieldGet(this, _Button_onClick, "f"), "aria-hidden": "true" }, h(Tag, { key: 'ff1c91a47ce157c2060678634e85bbfc86a4799b', "aria-hidden": "true", class: {
255
263
  'qds-button': true,
256
264
  'qds-disabled': Tag === 'a' ? __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedDisabled_get) : false,
257
265
  'qds-icon-only': __classPrivateFieldGet(this, _Button_instances, "a", _Button_iconOnly_get),
258
- }, "data-importance": __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedImportance_get), "data-size": __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedSize_get), "data-action": __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedAction_get), disabled: Tag === 'a' ? undefined : this.disabled, download: Tag === 'a' ? this.download : undefined, formAction: this.formAction, formMethod: this.formMethod, formNoValidate: this.formNoValidate, formTarget: this.formTarget, href: Tag === 'a' ? this.href : undefined, name: Tag === 'a' ? undefined : this.name, onBlur: __classPrivateFieldGet(this, _Button_onBlur, "f"), onFocus: __classPrivateFieldGet(this, _Button_onFocus, "f"), ref: __classPrivateFieldGet(this, _Button_buttonRef, "f"), rel: Tag === 'a' ? this.rel : undefined, tabIndex: __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedDisabled_get) ? disabledTabIndex : this.tabIndex, target: Tag === 'a' ? this.target : undefined, type: Tag === 'a' ? undefined : __classPrivateFieldGet(this, _Button_instances, "a", _Button_buttonType_get), value: Tag === 'a' ? undefined : this.value, "aria-label": __classPrivateFieldGet(this, _Button_instances, "a", _Button_iconOnly_get) ? ariaLabel : undefined }, this.iconName !== undefined && this.iconName !== '' && (h("qds-icon", { key: 'df3e21439511c2bdaa92449cf5d9f39d595e68ef', "aria-hidden": "true", class: "qds-icon", "data-size": __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedSize_get), library: this.iconLibrary, name: this.iconName })), !__classPrivateFieldGet(this, _Button_instances, "a", _Button_iconOnly_get) && (h("span", { key: '7ac4c5771ee0f9bbc4a2b9693e8e0638bd401299', class: "qds-overflow", "data-size": __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedSize_get), ref: __classPrivateFieldGet(this, _Button_spanRef, "f") }, this.text)), isIndicator(this.badge) && (h("qds-badge-indicator", { key: '173fcf4fdfbfcd38c065ae6cb07a72ecd73130d6', class: "qds-indicator", status: this.badgeIndicatorStatus, description: this.badgeDescription, size: __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedSize_get), strokeRing: true })), isCounter(this.badge) && (h("qds-badge-counter", { key: '41beedd254b4497d9475a7bb9ae0c0f322e6b0f3', class: {
266
+ }, "data-importance": __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedImportance_get), "data-size": __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedSize_get), "data-action": __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedAction_get), disabled: Tag === 'a' ? undefined : this.disabled, download: Tag === 'a' ? this.download : undefined, formAction: this.formAction, formMethod: this.formMethod, formNoValidate: this.formNoValidate, formTarget: this.formTarget, href: Tag === 'a' ? this.href : undefined, name: Tag === 'a' ? undefined : this.name, onBlur: __classPrivateFieldGet(this, _Button_onBlur, "f"), onFocus: __classPrivateFieldGet(this, _Button_onFocus, "f"), ref: __classPrivateFieldGet(this, _Button_buttonRef, "f"), rel: Tag === 'a' ? this.rel : undefined, tabIndex: __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedDisabled_get) ? disabledTabIndex : this.tabIndex, target: Tag === 'a' ? this.target : undefined, type: Tag === 'a' ? undefined : __classPrivateFieldGet(this, _Button_instances, "a", _Button_buttonType_get), value: Tag === 'a' ? undefined : this.value, "aria-label": __classPrivateFieldGet(this, _Button_instances, "a", _Button_iconOnly_get) ? ariaLabel : undefined }, this.iconName !== undefined && this.iconName !== '' && (h("qds-icon", { key: '3de49085a736485d89ebe09d035b95ebf0db1431', "aria-hidden": "true", class: "qds-icon", "data-size": __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedSize_get), library: this.iconLibrary, name: this.iconName })), !__classPrivateFieldGet(this, _Button_instances, "a", _Button_iconOnly_get) && (h("span", { key: '112c6846fe1e0dbfab3228583f2d19e2a320479d', class: "qds-overflow", "data-size": __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedSize_get), ref: __classPrivateFieldGet(this, _Button_spanRef, "f") }, this.text)), isIndicator(this.badge) && (h("qds-badge-indicator", { key: 'b2f02a783ec8803666c95fca1c833340cec9586e', class: "qds-indicator", status: this.badgeIndicatorStatus, description: this.badgeDescription, size: __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedSize_get), strokeRing: true })), isCounter(this.badge) && (h("qds-badge-counter", { key: '5932deee9a291c7820cd4bdb25dc676e76752808', class: {
259
267
  'qds-indicator': __classPrivateFieldGet(this, _Button_instances, "a", _Button_iconOnly_get),
260
- }, description: this.badgeDescription, importance: __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedImportance_get), size: __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedSize_get), strokeRing: true, value: this.badge })), __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedActionIcon_get) !== undefined && (h("qds-icon", { key: 'c320c3eb40238c2e00727c0e9d4c971786778c02', "aria-hidden": "true", class: "qds-icon qds-action", "data-size": __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedSize_get), library: "core", name: __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedActionIcon_get) }))), h("div", { key: '84a9ae565f296a4bfeaa649ea1394c5ba70c89ea', class: {
268
+ }, description: this.badgeDescription, importance: __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedImportance_get), size: __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedSize_get), strokeRing: true, value: this.badge })), __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedActionIcon_get) !== undefined && (h("qds-icon", { key: '4a00d253213e8a8f02c2fccbff0811e2375a45bf', "aria-hidden": "true", class: "qds-icon qds-action", "data-size": __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedSize_get), library: "core", name: __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedActionIcon_get) }))), h("div", { key: '700f9ecf34b4193d6566ae7a515d463ccc29cb6b', class: {
261
269
  'qds-focus-ring': true,
262
270
  'qds-icon-only': __classPrivateFieldGet(this, _Button_instances, "a", _Button_iconOnly_get),
263
- }, "data-importance": __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedImportance_get), "data-size": __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedSize_get) }), this.tooltip && (h("qds-tooltip", { key: '518348c9c25b932589cc1d1a0d48c5c6bee8f583', "aria-hidden": "true", ref: __classPrivateFieldGet(this, _Button_tooltipRef, "f") }, this.text))));
271
+ }, "data-importance": __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedImportance_get), "data-size": __classPrivateFieldGet(this, _Button_instances, "a", _Button_computedSize_get) }), this.tooltip && (h("qds-tooltip", { key: '56020215ee6c18b8362c3e85f60f00864d06ec98', "aria-hidden": "true", ref: __classPrivateFieldGet(this, _Button_tooltipRef, "f") }, this.text))));
264
272
  }
265
273
  static get delegatesFocus() { return true; }
266
274
  static get formAssociated() { return true; }
@@ -306,7 +314,7 @@ const Button = /*@__PURE__*/ proxyCustomElement(class Button extends H {
306
314
  "tabindex": ["tabindexChanged"],
307
315
  "text": ["textChanged"]
308
316
  }]);
309
- _Button_button = new WeakMap(), _Button_span = new WeakMap(), _Button_ro = new WeakMap(), _Button_onBlur = new WeakMap(), _Button_onFocus = new WeakMap(), _Button_buttonRef = new WeakMap(), _Button_spanRef = new WeakMap(), _Button_tooltipRef = new WeakMap(), _Button_instances = new WeakSet(), _Button_buttonType_get = function _Button_buttonType_get() {
317
+ _Button_button = new WeakMap(), _Button_span = new WeakMap(), _Button_ro = new WeakMap(), _Button_onBlur = new WeakMap(), _Button_onFocus = new WeakMap(), _Button_buttonRef = new WeakMap(), _Button_spanRef = new WeakMap(), _Button_tooltipRef = new WeakMap(), _Button_onClick = new WeakMap(), _Button_instances = new WeakSet(), _Button_buttonType_get = function _Button_buttonType_get() {
310
318
  if (this.type === undefined)
311
319
  return this.internals.form ? 'submit' : 'button';
312
320
  return this.type;
@@ -401,4 +409,4 @@ function defineCustomElement() {
401
409
 
402
410
  export { Button as B, defineCustomElement as d };
403
411
 
404
- //# sourceMappingURL=p-d6e52d0b.js.map
412
+ //# sourceMappingURL=p-b6c04008.js.map
@@ -0,0 +1 @@
1
+ {"file":"p-b6c04008.js","mappings":"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","names":[],"sources":["src/components/button/button.css?tag=qds-button&encapsulation=shadow","src/components/button/button.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-button:disabled,\n.qds-disabled {\n opacity: var(--qds-theme-disabled);\n pointer-events: none;\n}\n\n.qds-overflow {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n\n &[data-size='hero'] {\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 2;\n white-space: normal;\n }\n}\n\n.qds-action {\n transform: scaleX(var(--qds-direction-factor, 1));\n}\n\n.qds-container {\n display: grid;\n grid-template-areas: 'button';\n}\n\n.qds-focus-ring {\n border-radius: max(\n 1px,\n var(\n --qds-control-border-radius-top-left,\n var(--qds-control-border-radius)\n )\n )\n max(\n 1px,\n var(\n --qds-control-border-radius-top-right,\n var(--qds-control-border-radius)\n )\n )\n max(\n 1px,\n var(\n --qds-control-border-radius-bottom-right,\n var(--qds-control-border-radius)\n )\n )\n max(\n 1px,\n var(\n --qds-control-border-radius-bottom-left,\n var(--qds-control-border-radius)\n )\n );\n grid-area: button;\n isolation: isolate;\n outline: var(--qds-theme-focus-border) solid var(--qds-focus-border-width);\n outline-offset: var(--qds-focus-border-offset);\n pointer-events: none;\n visibility: hidden;\n width: calc(\n 100% + var(--qds-control-border-width) -\n var(\n --qds-control-border-width-inline-end,\n var(--qds-control-border-width)\n )\n );\n height: calc(\n 100% + var(--qds-control-border-width) -\n var(--qds-control-border-width-block-end, var(--qds-control-border-width))\n );\n}\n\n.qds-button {\n position: relative;\n align-items: center;\n appearance: none;\n\n /* Avoid automatic minimum size on flex element: https://www.w3.org/TR/css-flexbox-1/#min-size-auto */\n min-width: 0;\n background-color: initial;\n border: none;\n border-radius: var(\n --qds-control-border-radius-top-left,\n var(--qds-control-border-radius)\n )\n var(--qds-control-border-radius-top-right, var(--qds-control-border-radius))\n var(\n --qds-control-border-radius-bottom-right,\n var(--qds-control-border-radius)\n )\n var(\n --qds-control-border-radius-bottom-left,\n var(--qds-control-border-radius)\n );\n box-sizing: border-box;\n cursor: pointer;\n display: inline-flex;\n grid-area: button;\n justify-content: center;\n outline: none;\n padding-block: 0;\n print-color-adjust: exact;\n text-align: center;\n user-select: none;\n\n &:any-link {\n text-decoration: none;\n }\n\n &:focus-visible ~ .qds-focus-ring {\n visibility: visible;\n }\n}\n\n.qds-icon {\n flex-shrink: 0;\n}\n\n.qds-indicator {\n position: absolute;\n inset-block-start: 0;\n inset-inline-end: 0;\n transform: translate(50%, -50%);\n}\n\n[data-size='small'] {\n font: var(--qds-control-small-text);\n\n &.qds-button {\n gap: var(--qds-control-small-gap-internal);\n height: var(--qds-control-small-height);\n padding-inline: var(--qds-control-button-small-padding-horizontal);\n\n &.qds-icon-only {\n width: var(--qds-control-small-height);\n }\n }\n\n &.qds-icon {\n font-size: var(--qds-control-small-icon-size);\n }\n}\n\n[data-size='standard'] {\n font: var(--qds-control-standard-text);\n\n &.qds-button {\n gap: var(--qds-control-standard-gap-internal);\n height: var(--qds-control-standard-height);\n padding-inline: var(--qds-control-button-standard-padding-horizontal);\n\n &.qds-icon-only {\n width: var(--qds-control-standard-height);\n }\n }\n\n &.qds-icon {\n font-size: var(--qds-control-standard-icon-size);\n }\n}\n\n[data-size='large'] {\n font: var(--qds-control-large-text);\n\n &.qds-button {\n gap: var(--qds-control-large-gap-internal);\n height: var(--qds-control-large-height);\n padding-inline: var(--qds-control-button-large-padding-horizontal);\n\n &.qds-icon-only {\n width: var(--qds-control-large-height);\n }\n }\n\n &.qds-icon {\n font-size: var(--qds-control-large-icon-size);\n }\n}\n\n[data-size='small'],\n[data-size='standard'],\n[data-size='large'] {\n line-height: normal;\n\n &.qds-button.qds-icon-only {\n padding-inline: 0;\n }\n}\n\n[data-size='hero'] {\n font: var(--qds-control-hero-text);\n\n &.qds-button {\n border-radius: var(\n --qds-control-border-radius-top-left,\n var(--qds-control-hero-border-radius)\n )\n var(\n --qds-control-border-radius-top-right,\n var(--qds-control-hero-border-radius)\n )\n var(\n --qds-control-border-radius-bottom-right,\n var(--qds-control-hero-border-radius)\n )\n var(\n --qds-control-border-radius-bottom-left,\n var(--qds-control-hero-border-radius)\n );\n gap: var(--qds-control-hero-gap-internal);\n padding-block: var(--qds-control-hero-padding-auto-height);\n padding-inline: var(--qds-control-button-hero-padding-horizontal);\n\n &.qds-icon-only {\n height: var(--qds-control-hero-height);\n padding-inline: 0;\n width: var(--qds-control-hero-height);\n }\n }\n\n &.qds-focus-ring {\n border-radius: max(\n 1px,\n var(\n --qds-control-border-radius-top-left,\n var(--qds-control-hero-border-radius)\n )\n )\n max(\n 1px,\n var(\n --qds-control-border-radius-top-right,\n var(--qds-control-hero-border-radius)\n )\n )\n max(\n 1px,\n var(\n --qds-control-border-radius-bottom-right,\n var(--qds-control-hero-border-radius)\n )\n )\n max(\n 1px,\n var(\n --qds-control-border-radius-bottom-left,\n var(--qds-control-hero-border-radius)\n )\n );\n }\n\n &.qds-icon {\n font-size: var(--qds-control-hero-icon-size);\n }\n}\n\n[data-importance='subdued'] {\n color: var(--qds-theme-link-standard-default);\n\n &.qds-button {\n border-block-end: var(--qds-control-border-width) solid transparent;\n padding-inline: 0;\n\n &:hover {\n border-block-end: var(--qds-control-border-width) solid\n var(--qds-theme-link-standard-hover);\n color: var(--qds-theme-link-standard-hover);\n }\n\n &:active {\n border-block-end: var(--qds-control-border-width) solid\n var(--qds-theme-link-standard-pressed);\n color: var(--qds-theme-link-standard-pressed);\n }\n\n &:not(.qds-icon-only) {\n border-radius: 0;\n }\n\n &.qds-icon-only {\n border: none;\n color: var(--qds-theme-control-text-standard);\n\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 }\n}\n\n[data-importance='standard'] {\n color: var(--qds-theme-control-text-standard);\n\n &.qds-button {\n border-color: var(--qds-theme-control-border);\n border-style: solid;\n border-width: var(--qds-control-border-width)\n var(\n --qds-control-border-width-inline-end,\n var(--qds-control-border-width)\n )\n var(--qds-control-border-width-block-end, var(--qds-control-border-width))\n var(--qds-control-border-width);\n\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}\n\n[data-importance='emphasized'] {\n &.qds-button {\n background-color: var(--qds-theme-signature-color-default);\n color: var(--qds-theme-signature-color-contrast);\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[data-importance='destructive'] {\n &.qds-button {\n background-color: var(--qds-theme-feedback-action-destructive-default);\n color: var(--qds-theme-feedback-action-destructive-contrast);\n\n &:hover {\n background-color: var(--qds-theme-feedback-action-destructive-hover);\n }\n\n &:active {\n background-color: var(--qds-theme-feedback-action-destructive-pressed);\n }\n }\n}\n\n[data-importance='subdued-destructive'] {\n color: var(--qds-theme-feedback-action-destructive-default);\n\n &.qds-button {\n border-block-end: var(--qds-control-border-width) solid transparent;\n padding-inline: 0;\n\n &:hover {\n border-block-end: var(--qds-control-border-width) solid\n var(--qds-theme-feedback-action-destructive-hover);\n color: var(--qds-theme-feedback-action-destructive-hover);\n }\n\n &:active {\n border-block-end: var(--qds-control-border-width) solid\n var(--qds-theme-feedback-action-destructive-pressed);\n color: var(--qds-theme-feedback-action-destructive-pressed);\n }\n\n &:not(.qds-icon-only) {\n border-radius: 0;\n }\n\n &.qds-icon-only {\n border: none;\n\n &:hover {\n background-color: var(--qds-theme-interactive-background-hover);\n color: var(--qds-theme-feedback-action-destructive-default);\n }\n\n &:active {\n background-color: var(--qds-theme-interactive-background-pressed);\n color: var(--qds-theme-feedback-action-destructive-default);\n }\n }\n }\n}\n\n:is([data-action='dropdown'], [data-action='dropdown-close']) {\n .qds-action {\n margin-inline-start: auto;\n transition-duration: 0.3s;\n transition-property: transform;\n }\n\n &[data-importance='standard'] {\n background-color: var(--qds-theme-control-input-background);\n }\n\n &:not([data-importance='subdued'], [data-importance='subdued-destructive']) {\n padding-inline: var(--qds-control-input-padding-horizontal);\n }\n}\n\n[data-action='dropdown-close'] .qds-action {\n transform: rotate(-180deg);\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 readTask,\n State,\n Watch,\n} from '@stencil/core'\nimport type { LiteralUnion } from 'type-fest'\n\nimport type { QdsFocusEventDetail } from '../../helpers'\nimport { isOverflowing, pickFocusEventAttributes } from '../../helpers'\nimport { CUSTOM_ERROR_FLAGS, NO_ERROR_FLAGS, VALID_STATE } from '../controls'\nimport type { Importance, Size } from '../shared'\n\nexport type Action = 'dropdown-close' | 'dropdown' | 'next'\nexport type ButtonImportance =\n | Importance\n | 'destructive'\n | 'subdued-destructive'\nexport type ButtonSize = Size | 'hero'\nexport type ButtonTarget = '_blank' | '_parent' | '_self' | '_top'\nexport type ButtonType = 'button' | 'reset' | 'submit'\nexport type FormMethod = 'dialog' | 'get' | 'post'\n\nconst isCounter = (value: unknown): value is number =>\n typeof value === 'string'\n ? !Number.isNaN(Number.parseFloat(value))\n : typeof value === 'number'\n\nconst isIndicator = (value: unknown): value is '' | true =>\n value === '' || value === true\n\n/**\n * The `<qds-button>` element is an interactive element activated by a user\n * with a mouse, keyboard, finger, voice command, or other assistive technology.\n * Once activated, it then performs a programmable action, such as submitting a\n * [form](https://developer.mozilla.org/docs/Learn/Forms)\n * or opening a dialog.\n *\n * @see https://quartz.se.com/build/components/button\n */\n@Component({\n tag: 'qds-button',\n formAssociated: true,\n shadow: { delegatesFocus: true },\n styleUrl: 'button.css',\n})\nexport class Button implements ComponentInterface {\n /**\n * The name of the action icon to render.\n */\n @Prop() public readonly action?: Action\n\n /**\n * Displays an indicator if `true` or the empty string. Otherwise, displays a\n * counter badge if a number or string representing a number is used.\n *\n * @webnative\n */\n @Prop() public readonly badge?: number | string | true\n\n /**\n * The indicator or counter badge's accessible text that will be used by\n * screen readers.\n */\n @Prop() public readonly badgeDescription?: string\n\n /**\n * The indicator's status.\n */\n @Prop()\n public readonly badgeIndicatorStatus?: HTMLQdsBadgeIndicatorElement['status'] =\n 'neutral'\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 * The button's importance.\n */\n @Prop() public readonly importance?: ButtonImportance = 'standard'\n\n /**\n * The button's size.\n */\n @Prop() public readonly size?: Size | 'hero' = 'standard'\n\n /**\n * The button's text.\n */\n @Prop() public readonly text!: string\n\n /**\n * Sets if button is icon only.\n */\n @Prop() public readonly iconOnly: boolean = false\n\n /**\n * Prevents the button from being interacted with: it cannot be pressed or\n * focused.\n *\n * @webnative\n */\n @Prop()\n public readonly disabled?: boolean\n\n /**\n * Tells the browser to download the linked file as this filename. Only used\n * when `href` is set.\n *\n * @webnative\n */\n @Prop() public readonly download?: string\n\n /**\n * The [`<form>`][] element to associate the button with (its form owner).\n *\n * The value of this attribute must be the id of a `<form>` in the same\n * document. If this attribute is not set, the `<qds-button>` is associated\n * with its ancestor `<form>` element, if any.\n *\n * This attribute lets you associate `<qds-button>` elements to `<form>`s\n * anywhere in the document, not just inside a `<form>`. It can also override\n * an ancestor `<form>` element.\n *\n * [`<form>`]: https://developer.mozilla.org/docs/Web/HTML/Element/form\n *\n * @readonly\n * @webnative\n */\n // eslint-disable-next-line unicorn/no-null\n @Prop() public readonly form: ElementInternals['form'] | string = null\n\n /**\n * The URL that processes the information submitted by the button. Overrides\n * the [`action`](https://developer.mozilla.org/docs/Web/HTML/Element/button#attr-formaction)\n * attribute of the button's form owner. Does nothing if there is no form owner.\n *\n * @webnative\n */\n @Prop({ attribute: 'formaction' }) public readonly formAction?: string\n\n /**\n * If the button is a submit button (it's inside/associated with a `<form>`\n * and doesn't have `type=\"button\"`), this attribute specifies the\n * [HTTP method][] used to submit the form, or `dialog` which won't submit\n * the form. Possible values:\n *\n * - `get`: The form data are appended to the form's action URL, with a ? as\n * a separator, and the resulting URL is sent to the server. Use this method\n * when the form has no side effects, like search forms.\n * - `post`: The data from the form are included in the body of the HTTP\n * request when sent to the server. Use when the form contains information\n * that shouldn't be public, like login credentials.\n * - `dialog`: Close the dialog box in which the button finds itself, if any,\n * and do not submit the button's form owner.\n *\n * If specified, this attribute overrides the `method` attribute of the\n * button's form owner.\n *\n * [HTTP method]: https://developer.mozilla.org/docs/Web/HTTP/Methods\n *\n * @webnative\n */\n @Prop({ attribute: 'formmethod' }) public readonly formMethod?: FormMethod\n\n /**\n * If the button is a submit button, this attribute specifies that the form\n * is not to be\n * [validated](https://developer.mozilla.org/docs/Learn/Forms/Form_validation)\n * when it is submitted. If this attribute is specified, it overrides the\n * [`novalidate`](https://developer.mozilla.org/docs/Web/HTML/Element/form#attr-novalidate)\n * attribute of the button's form owner.\n *\n * @webnative\n */\n @Prop({ attribute: 'formnovalidate' })\n public readonly formNoValidate: boolean = false\n\n /**\n * If the button is a submit button, this attribute is an author-defined name\n * or standardized, underscore-prefixed keyword indicating where to display\n * the response from submitting the form. This is the `name` of, or keyword\n * for, a browsing context (a tab, window, or\n * [`<iframe>`](https://developer.mozilla.org/docs/Web/HTML/Element/iframe)).\n * If this attribute is specified, it overrides the\n * [`target`](https://developer.mozilla.org/docs/Web/HTML/Element/form#attr-target)\n * attribute of the button's form owner. The following keywords have special\n * meanings:\n *\n * - `_blank`: Load the response into a new unnamed browsing context — usually\n * a new tab or window, depending on the user's browser settings.\n * - `_parent`: Load the response into the parent browsing context of the\n * current one. If there is no parent, this option behaves the same way as\n * `_self`.\n * - `_self`: Load the response into the same browsing context as the current\n * one.\n * - `_top`: Load the response into the top-level browsing context (that is,\n * the browsing context that is an ancestor of the current one, and has no\n * parent). If there is no parent, this option behaves the same way as\n * `_self`.\n *\n * @webnative\n */\n @Prop({ attribute: 'formtarget' })\n public readonly formTarget: LiteralUnion<ButtonTarget, string> = '_self'\n\n /**\n * When set, the underlying button will be rendered as an `<a>` with this\n * `href` instead of a `<button>`.\n *\n * @webnative\n */\n @Prop() public readonly href?: string\n\n /**\n * Returns a list of the [`<label>`][] elements associated with the\n * `qds-button` element.\n *\n * [`<label>`]: https://developer.mozilla.org/docs/Web/HTML/Element/label\n *\n * @readonly\n * @webnative\n */\n @Prop() public readonly labels: ElementInternals['labels'] =\n {} as ElementInternals['labels']\n\n /**\n * When href is define and the button act as a link (`<a>`), the `rel` will be added to the element.\n *\n * @webnative\n */\n @Prop() public readonly rel?: string = 'noopener'\n\n /**\n * The name of the button, submitted as a pair with the button's `value` as\n * part of the form data, when that button is used to submit the form.\n * Ignored when `href` is set.\n *\n * @webnative\n */\n @Prop() public readonly name?: string\n\n /**\n * Where to display the linked URL, as the name for a browsing context (a\n * tab, window, or\n * [`<iframe>`](https://developer.mozilla.org/docs/Web/HTML/Element/iframe).\n * The following keywords have special meanings for where to load the URL:\n *\n * - `_blank`: usually a new tab, but users can configure browsers to open a new\n * window instead.\n * - `_parent`: the parent browsing context of the current one. If no parent,\n * behaves as `_self`.\n * - `_self`: the current browsing context.\n * - `_top`: the topmost browsing context (the \"highest\" context that's an\n * ancestor of the current one). If no ancestors, behaves as `_self`.\n *\n * @webnative\n */\n @Prop() public readonly target?: LiteralUnion<ButtonTarget, string>\n\n /**\n * The type of button.\n *\n * `button`: The button has no default behavior, and does nothing when\n * pressed by default. It can have client-side scripts listen to the\n * element's events, which are triggered when the events occur.\n *\n * `submit`: The button submits the form data to the server. This is the\n * default if the attribute is not specified for buttons associated with a\n * `<form>`, or if the attribute is an empty or invalid value.\n *\n * `reset`: The button resets all the controls to their initial values.\n *\n * @webnative\n */\n @Prop() public readonly type?: ButtonType\n\n /**\n * The error message that would be shown to the user if the `<qds-button>`\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-button>`.\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 * Defines the value associated with the button's `name` when it's submitted\n * with the form data. This value is passed to the server in params when the\n * form is submitted using this button. Ignored when `href` is set.\n *\n * @webnative\n */\n @Prop() public readonly value?: string\n\n /**\n * True if `<qds-button>` will be validated when the form is submitted; false\n * otherwise.\n *\n * @readonly\n * @webnative\n */\n @Prop() public readonly willValidate: ElementInternals['willValidate'] = false\n\n /**\n * Emitted when the button loses focus.\n */\n @Event({ eventName: 'qdsBlur', bubbles: false, cancelable: false })\n private readonly blurEmitter!: EventEmitter<QdsFocusEventDetail>\n\n /**\n * Emitted when the button gains focus.\n */\n @Event({ eventName: 'qdsFocus', bubbles: false, cancelable: false })\n private readonly focusEmitter!: EventEmitter<QdsFocusEventDetail>\n\n @Element() private readonly host!: HTMLQdsButtonElement\n\n @State() private tabIndex?: number\n\n @State() private tooltip = false\n\n @AttachInternals() private readonly internals!: ElementInternals\n\n #button?: HTMLAnchorElement | HTMLButtonElement\n\n #span?: HTMLSpanElement\n\n #ro?: ResizeObserver\n\n get #buttonType(): ButtonType {\n if (this.type === undefined)\n return this.internals.form ? 'submit' : 'button'\n return this.type\n }\n\n get #iconOnly(): boolean {\n const hasIcon = this.iconName !== undefined && this.iconName !== ''\n\n return hasIcon && this.iconOnly\n }\n\n get #computedAction(): Action | undefined {\n switch (this.action) {\n case 'dropdown':\n case 'dropdown-close':\n case 'next': {\n return this.action\n }\n default: {\n return undefined\n }\n }\n }\n\n get #computedActionIcon(): Exclude<Action, 'dropdown-close'> | undefined {\n switch (this.action) {\n case 'dropdown':\n case 'next': {\n return this.action\n }\n case 'dropdown-close': {\n return 'dropdown'\n }\n default: {\n return undefined\n }\n }\n }\n\n get #computedDisabled(): boolean {\n return this.disabled ?? false\n }\n\n get #computedImportance(): ButtonImportance {\n switch (this.importance) {\n case 'emphasized':\n case 'subdued':\n case 'destructive':\n case 'subdued-destructive': {\n return this.importance\n }\n default: {\n return 'standard'\n }\n }\n }\n\n get #computedSize(): ButtonSize {\n switch (this.size) {\n case 'small':\n case 'large':\n case 'hero': {\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.#computedDisabled) {\n event.stopImmediatePropagation()\n return\n }\n\n if (this.#buttonType === 'button' || !this.internals.form) return\n if (this.#buttonType === 'reset') {\n this.internals.form.reset()\n } else {\n this.internals.form.requestSubmit()\n }\n event.preventDefault()\n }\n\n @Watch('disabled')\n protected disabledChanged(): void {\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('text')\n protected textChanged(): void {\n this.internals.ariaLabel = this.text\n\n if (this.#ro) this.#ro.disconnect()\n if (!this.#span) return\n\n const span = this.#span\n readTask(() => {\n this.tooltip = isOverflowing(span)\n })\n this.#ro = new ResizeObserver(([spanEntry]) => {\n this.tooltip = isOverflowing(spanEntry.target)\n })\n this.#ro.observe(this.#span)\n }\n\n public componentWillLoad(): void {\n this.internals.role = 'button'\n this.#defineGetter('form', () => this.internals.form)\n this.#defineGetter('willValidate', () => this.internals.willValidate)\n this.#defineGetter('validity', () => this.internals.validity)\n this.#defineGetter(\n 'validationMessage',\n () => this.internals.validationMessage,\n )\n this.#defineGetter('labels', () => this.internals.labels)\n\n this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0')\n }\n\n public componentDidLoad(): void {\n this.textChanged()\n }\n\n public disconnectedCallback(): void {\n if (this.#ro) this.#ro.disconnect()\n }\n\n public render() {\n const Tag = this.href === undefined ? 'button' : 'a'\n const disabledTabIndex = Tag === 'a' ? -1 : undefined\n const hasBadgeProperties =\n this.badgeDescription !== undefined && this.badge !== undefined\n const ariaLabel = hasBadgeProperties\n ? `${this.text} ${this.badge} ${this.badgeDescription}`\n : this.text\n\n return (\n <div class=\"qds-container\" onClick={this.#onClick} aria-hidden=\"true\">\n <Tag\n aria-hidden=\"true\"\n class={{\n 'qds-button': true,\n 'qds-disabled': Tag === 'a' ? this.#computedDisabled : false,\n 'qds-icon-only': this.#iconOnly,\n }}\n data-importance={this.#computedImportance}\n data-size={this.#computedSize}\n data-action={this.#computedAction}\n disabled={Tag === 'a' ? undefined : this.disabled}\n download={Tag === 'a' ? this.download : undefined}\n formAction={this.formAction}\n formMethod={this.formMethod}\n formNoValidate={this.formNoValidate}\n formTarget={this.formTarget}\n href={Tag === 'a' ? this.href : undefined}\n name={Tag === 'a' ? undefined : this.name}\n onBlur={this.#onBlur}\n onFocus={this.#onFocus}\n ref={this.#buttonRef}\n rel={Tag === 'a' ? this.rel : undefined}\n tabIndex={this.#computedDisabled ? disabledTabIndex : this.tabIndex}\n target={Tag === 'a' ? this.target : undefined}\n type={Tag === 'a' ? undefined : this.#buttonType}\n value={Tag === 'a' ? undefined : this.value}\n aria-label={this.#iconOnly ? ariaLabel : undefined}\n >\n {this.iconName !== undefined && this.iconName !== '' && (\n <qds-icon\n aria-hidden=\"true\"\n class=\"qds-icon\"\n data-size={this.#computedSize}\n library={this.iconLibrary}\n name={this.iconName}\n />\n )}\n {!this.#iconOnly && (\n <span\n class=\"qds-overflow\"\n data-size={this.#computedSize}\n ref={this.#spanRef}\n >\n {this.text}\n </span>\n )}\n {isIndicator(this.badge) && (\n <qds-badge-indicator\n class=\"qds-indicator\"\n status={this.badgeIndicatorStatus}\n description={this.badgeDescription}\n size={this.#computedSize}\n strokeRing\n />\n )}\n {isCounter(this.badge) && (\n <qds-badge-counter\n class={{\n 'qds-indicator': this.#iconOnly,\n }}\n description={this.badgeDescription}\n importance={this.#computedImportance}\n size={this.#computedSize}\n strokeRing\n value={this.badge}\n />\n )}\n {this.#computedActionIcon !== undefined && (\n <qds-icon\n aria-hidden=\"true\"\n class=\"qds-icon qds-action\"\n data-size={this.#computedSize}\n library=\"core\"\n name={this.#computedActionIcon}\n />\n )}\n </Tag>\n <div\n class={{\n 'qds-focus-ring': true,\n 'qds-icon-only': this.#iconOnly,\n }}\n data-importance={this.#computedImportance}\n data-size={this.#computedSize}\n />\n {this.tooltip && (\n <qds-tooltip aria-hidden=\"true\" ref={this.#tooltipRef}>\n {this.text}\n </qds-tooltip>\n )}\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: HTMLButtonElement['setCustomValidity'] = (\n error,\n ) => {\n if (error)\n this.internals.setValidity(CUSTOM_ERROR_FLAGS, error, this.#button)\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 readonly #buttonRef = (\n button?: HTMLAnchorElement | HTMLButtonElement,\n ): void => {\n this.#button = button\n }\n\n readonly #spanRef = (span?: HTMLSpanElement): void => {\n this.#span = span\n }\n\n readonly #tooltipRef = (tooltip?: HTMLQdsTooltipElement): void => {\n if (tooltip)\n // eslint-disable-next-line no-param-reassign\n tooltip.target = this.#button\n }\n\n readonly #onClick = (event: MouseEvent): void => {\n if (this.#computedDisabled) {\n event.stopImmediatePropagation()\n }\n }\n\n #defineGetter(p: PropertyKey, get: () => unknown): void {\n Object.defineProperty(this.host, p, { enumerable: true, get })\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, h, F as Fragment } from './p-2806fee1.js';
6
+ import { p as proxyCustomElement, H, h, F as Fragment } from './p-50f85f75.js';
7
7
  import { i as inheritAriaAttributes } from './p-8abba29b.js';
8
- import { d as defineCustomElement$2 } from './p-fed0d11f.js';
9
- import { d as defineCustomElement$1 } from './p-ba880369.js';
8
+ import { d as defineCustomElement$2 } from './p-5570cc30.js';
9
+ import { d as defineCustomElement$1 } from './p-72c09714.js';
10
10
 
11
- const tagCss = ":host([hidden]){display:none!important}:host{display:inline-block}.qds-tag{align-items:center;border-radius:var(--qds-control-rounded-border-radius);box-sizing:border-box;display:inline-flex;justify-content:center;max-width:inherit;min-width:inherit;width:inherit}.qds-text{text-overflow:ellipsis}.qds-sr-only,.qds-text{overflow:hidden;white-space:nowrap}.qds-sr-only{clip:rect(0 0 0 0);height:1px;margin:-1px;padding:0;position:absolute;width:1px}.qds-icon{flex-shrink:0}[data-status=error]{color:var(--qds-theme-feedback-message-critical)}[data-status=success]{color:var(--qds-theme-feedback-message-success)}[data-status=warning]{color:var(--qds-theme-feedback-message-important)}[data-status=info]{color:var(--qds-theme-feedback-message-informational)}[data-status=neutral]{color:var(--qds-theme-feedback-message-neutral)}[data-importance=subdued] .qds-text{color:var(--qds-theme-control-text-standard)}[data-importance=standard][data-status=error]{background-color:var(--qds-theme-feedback-message-critical-dimmed)}[data-importance=standard][data-status=success]{background-color:var(--qds-theme-feedback-message-success-dimmed)}[data-importance=standard][data-status=warning]{background-color:var(--qds-theme-feedback-message-important-dimmed)}[data-importance=standard][data-status=info]{background-color:var(--qds-theme-feedback-message-informational-dimmed)}[data-importance=standard][data-status=neutral]{background-color:var(--qds-theme-feedback-message-neutral-dimmed)}[data-importance=emphasized][data-status=error]{background-color:var(--qds-theme-feedback-message-critical);color:var(--qds-theme-feedback-message-critical-contrast)}[data-importance=emphasized][data-status=success]{background-color:var(--qds-theme-feedback-message-success);color:var(--qds-theme-feedback-message-success-contrast)}[data-importance=emphasized][data-status=warning]{background-color:var(--qds-theme-feedback-message-important);color:var(--qds-theme-feedback-message-important-contrast)}[data-importance=emphasized][data-status=info]{background-color:var(--qds-theme-feedback-message-informational);color:var(--qds-theme-feedback-message-informational-contrast)}[data-importance=emphasized][data-status=neutral]{background-color:var(--qds-theme-feedback-message-neutral);color:var(--qds-theme-feedback-message-neutral-contrast)}.qds-tag[data-size=small]{font:var(--qds-control-small-text);gap:var(--qds-control-small-gap-internal);height:var(--qds-control-small-height);padding-inline:var(--qds-control-chip-small-padding-horizontal)}.qds-icon[data-size=small]{height:var(--qds-control-small-icon-size);width:var(--qds-control-small-icon-size)}.qds-tag[data-size=standard]{font:var(--qds-control-standard-text);gap:var(--qds-control-standard-gap-internal);height:var(--qds-control-standard-height);padding-inline:var(--qds-control-chip-standard-padding-horizontal)}.qds-icon[data-size=standard]{height:var(--qds-control-standard-icon-size);width:var(--qds-control-standard-icon-size)}.qds-tag[data-size=large]{font:var(--qds-control-large-text);gap:var(--qds-control-large-gap-internal);height:var(--qds-control-large-height);padding-inline:var(--qds-control-chip-large-padding-horizontal)}.qds-icon[data-size=large]{height:var(--qds-control-large-icon-size);width:var(--qds-control-large-icon-size)}";
11
+ const tagCss = ":host([hidden]){display:none!important}:host{display:inline-block}.qds-tag{align-items:center;border-radius:var(--qds-control-rounded-border-radius);box-sizing:border-box;display:inline-flex;justify-content:center;max-width:inherit;min-width:inherit;width:inherit}.qds-text{text-overflow:ellipsis}.qds-sr-only,.qds-text{overflow:hidden;white-space:nowrap}.qds-sr-only{clip:rect(0 0 0 0);height:1px;margin:-1px;padding:0;position:absolute;width:1px}.qds-icon{flex-shrink:0}[data-status=error]{color:var(--qds-theme-feedback-message-critical)}[data-status=success]{color:var(--qds-theme-feedback-message-success)}[data-status=warning]{color:var(--qds-theme-feedback-message-important)}[data-status=info]{color:var(--qds-theme-feedback-message-informational)}[data-status=neutral]{color:var(--qds-theme-feedback-message-neutral)}[data-importance=subdued] .qds-text{color:var(--qds-theme-control-text-standard)}[data-importance=standard][data-status=error]{background-color:var(--qds-theme-feedback-message-critical-dimmed)}[data-importance=standard][data-status=success]{background-color:var(--qds-theme-feedback-message-success-dimmed)}[data-importance=standard][data-status=warning]{background-color:var(--qds-theme-feedback-message-important-dimmed)}[data-importance=standard][data-status=info]{background-color:var(--qds-theme-feedback-message-informational-dimmed)}[data-importance=standard][data-status=neutral]{background-color:var(--qds-theme-feedback-message-neutral-dimmed)}[data-importance=emphasized][data-status=error]{background-color:var(--qds-theme-feedback-message-critical);color:var(--qds-theme-feedback-message-critical-contrast)}[data-importance=emphasized][data-status=success]{background-color:var(--qds-theme-feedback-message-success);color:var(--qds-theme-feedback-message-success-contrast)}[data-importance=emphasized][data-status=warning]{background-color:var(--qds-theme-feedback-message-important);color:var(--qds-theme-feedback-message-important-contrast)}[data-importance=emphasized][data-status=info]{background-color:var(--qds-theme-feedback-message-informational);color:var(--qds-theme-feedback-message-informational-contrast)}[data-importance=emphasized][data-status=neutral]{background-color:var(--qds-theme-feedback-message-neutral);color:var(--qds-theme-feedback-message-neutral-contrast)}.qds-tag[data-size=small]{font:var(--qds-control-small-text);gap:var(--qds-control-small-gap-internal);height:var(--qds-control-small-height)}.qds-padding[data-size=small]{padding-inline:var(--qds-control-chip-small-padding-horizontal)}.qds-icon[data-size=small]{height:var(--qds-control-small-icon-size);width:var(--qds-control-small-icon-size)}.qds-tag[data-size=standard]{font:var(--qds-control-standard-text);gap:var(--qds-control-standard-gap-internal);height:var(--qds-control-standard-height)}.qds-padding[data-size=standard]{padding-inline:var(--qds-control-chip-standard-padding-horizontal)}.qds-icon[data-size=standard]{height:var(--qds-control-standard-icon-size);width:var(--qds-control-standard-icon-size)}.qds-tag[data-size=large]{font:var(--qds-control-large-text);gap:var(--qds-control-large-gap-internal);height:var(--qds-control-large-height)}.qds-padding[data-size=large]{padding-inline:var(--qds-control-chip-large-padding-horizontal)}.qds-icon[data-size=large]{height:var(--qds-control-large-icon-size);width:var(--qds-control-large-icon-size)}";
12
12
  const QdsTagStyle0 = tagCss;
13
13
 
14
14
  // SPDX-FileCopyrightText: © 2024 Schneider Electric
@@ -63,8 +63,11 @@ const Tag = /*@__PURE__*/ proxyCustomElement(class Tag extends H {
63
63
  __classPrivateFieldSet(this, _Tag_inheritedAttributes, inheritAriaAttributes(this.host), "f");
64
64
  }
65
65
  render() {
66
- return (h("span", { key: '85725dcb77777d3611e29f89858b98523a121fef', class: "qds-tag", "data-importance": __classPrivateFieldGet(this, _Tag_instances, "a", _Tag_computedImportance_get), "data-size": __classPrivateFieldGet(this, _Tag_instances, "a", _Tag_computedSize_get), "data-status": __classPrivateFieldGet(this, _Tag_instances, "a", _Tag_computedStatus_get), ...__classPrivateFieldGet(this, _Tag_inheritedAttributes, "f") }, this.iconName !== undefined && this.iconName !== '' ? (h(Fragment, null, this.iconDescription !== undefined &&
67
- this.iconDescription !== '' && (h("span", { class: "qds-sr-only" }, this.iconDescription)), h("qds-icon", { "aria-hidden": "true", class: "qds-icon", "data-size": __classPrivateFieldGet(this, _Tag_instances, "a", _Tag_computedSize_get), library: this.iconLibrary, name: this.iconName }))) : (__classPrivateFieldGet(this, _Tag_instances, "a", _Tag_hasBadge_get) && (h("qds-badge-indicator", { status: __classPrivateFieldGet(this, _Tag_instances, "a", _Tag_computedStatus_get), description: this.badgeDescription, size: __classPrivateFieldGet(this, _Tag_instances, "a", _Tag_computedSize_get), strokeRing: true }))), h("span", { key: 'e585f7b37f91ff96586676b65d52bce026df9d10', class: "qds-text" }, this.text)));
66
+ return (h("span", { key: '60e2278d0dc1a67f55b56269a88030efc10d8b7c', class: {
67
+ 'qds-tag': true,
68
+ 'qds-padding': this.importance !== 'subdued',
69
+ }, "data-importance": __classPrivateFieldGet(this, _Tag_instances, "a", _Tag_computedImportance_get), "data-size": __classPrivateFieldGet(this, _Tag_instances, "a", _Tag_computedSize_get), "data-status": __classPrivateFieldGet(this, _Tag_instances, "a", _Tag_computedStatus_get), ...__classPrivateFieldGet(this, _Tag_inheritedAttributes, "f") }, this.iconName !== undefined && this.iconName !== '' ? (h(Fragment, null, this.iconDescription !== undefined &&
70
+ this.iconDescription !== '' && (h("span", { class: "qds-sr-only" }, this.iconDescription)), h("qds-icon", { "aria-hidden": "true", class: "qds-icon", "data-size": __classPrivateFieldGet(this, _Tag_instances, "a", _Tag_computedSize_get), library: this.iconLibrary, name: this.iconName }))) : (__classPrivateFieldGet(this, _Tag_instances, "a", _Tag_hasBadge_get) && (h("qds-badge-indicator", { status: __classPrivateFieldGet(this, _Tag_instances, "a", _Tag_computedStatus_get), description: this.badgeDescription, size: __classPrivateFieldGet(this, _Tag_instances, "a", _Tag_computedSize_get), strokeRing: true }))), h("span", { key: 'fc666a3f4dcfeb01c5309d3f54d41ce6c1a8f532', class: "qds-text" }, this.text)));
68
71
  }
69
72
  get host() { return this; }
70
73
  static get style() { return QdsTagStyle0; }
@@ -141,4 +144,4 @@ function defineCustomElement() {
141
144
 
142
145
  export { Tag as T, defineCustomElement as d };
143
146
 
144
- //# sourceMappingURL=p-a6310886.js.map
147
+ //# sourceMappingURL=p-ba860c62.js.map
@@ -0,0 +1 @@
1
+ {"file":"p-ba860c62.js","mappings":";;;;;;;;;;AAAA,MAAM,MAAM,GAAG,+zGAA+zG,CAAC;AAC/0G,qBAAe,MAAM;;ACDrB;AACA;AACA;;;;;;;;;;;;;;;;;;MAsBa,GAAG;IALhB;;;;;;;;QAgB0B,gBAAW,GAAW,SAAS,CAAA;;;;QAK/B,eAAU,GAAgB,UAAU,CAAA;;;;QAKpC,WAAM,GAAe,SAAS,CAAA;;;;QAK9B,SAAI,GAAU,UAAU,CAAA;;;;QAexB,UAAK,GAAa,KAAK,CAAA;QAU/C,mCAAmC,EAAE,EAAA;KA0FtC;IA7CQ,iBAAiB;QACtB,uBAAA,IAAI,4BAAwB,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,MAAA,CAAA;KAC7D;IAEM,MAAM;QACX,QACE,6DACE,KAAK,EAAE;gBACL,SAAS,EAAE,IAAI;gBACf,aAAa,EAAE,IAAI,CAAC,UAAU,KAAK,SAAS;aAC7C,qBACgB,uBAAA,IAAI,mDAAoB,eAC9B,uBAAA,IAAI,6CAAc,iBAChB,uBAAA,IAAI,+CAAgB,KAE7B,uBAAA,IAAI,gCAAqB,IAE5B,IAAI,CAAC,QAAQ,KAAK,SAAS,IAAI,IAAI,CAAC,QAAQ,KAAK,EAAE,IAClD,kBACG,IAAI,CAAC,eAAe,KAAK,SAAS;YACjC,IAAI,CAAC,eAAe,KAAK,EAAE,KACzB,YAAM,KAAK,EAAC,aAAa,IAAE,IAAI,CAAC,eAAe,CAAQ,CACxD,EACH,+BACc,MAAM,EAClB,KAAK,EAAC,UAAU,eACL,uBAAA,IAAI,6CAAc,EAC7B,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,IAAI,EAAE,IAAI,CAAC,QAAQ,GACnB,CACD,KAEH,uBAAA,IAAI,yCAAU,KACZ,2BACE,MAAM,EAAE,uBAAA,IAAI,+CAAgB,EAC5B,WAAW,EAAE,IAAI,CAAC,gBAAgB,EAClC,IAAI,EAAE,uBAAA,IAAI,6CAAc,EACxB,UAAU,SACV,CACH,CACF,EACD,6DAAM,KAAK,EAAC,UAAU,IAAE,IAAI,CAAC,IAAI,CAAQ,CACpC,EACR;KACF;;;;;;;;;;;;;;;IAtFC,QAAQ,IAAI,CAAC,UAAU;QACrB,KAAK,SAAS,CAAC;QACf,KAAK,YAAY,EAAE;YACjB,OAAO,IAAI,CAAC,UAAU,CAAA;SACvB;QACD,SAAS;YACP,OAAO,UAAU,CAAA;SAClB;KACF;AACH,CAAC;IAGC,QAAQ,IAAI,CAAC,IAAI;QACf,KAAK,UAAU,CAAC;QAChB,KAAK,OAAO,CAAC;QACb,KAAK,OAAO,EAAE;YACZ,OAAO,IAAI,CAAC,IAAI,CAAA;SACjB;QACD,SAAS;YACP,OAAO,UAAU,CAAA;SAClB;KACF;AACH,CAAC;IAGC,QAAQ,IAAI,CAAC,MAAM;QACjB,KAAK,OAAO,CAAC;QACb,KAAK,MAAM,CAAC;QACZ,KAAK,SAAS,CAAC;QACf,KAAK,SAAS,EAAE;YACd,OAAO,IAAI,CAAC,MAAM,CAAA;SACnB;QACD,SAAS;YACP,OAAO,SAAS,CAAA;SACjB;KACF;AACH,CAAC;IAGC,OAAO,CAAC,IAAI,CAAC,KAAK,IAAI,KAAK,KAAK,IAAI,CAAC,UAAU,KAAK,YAAY,CAAA;AAClE,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/tag/tag.css?tag=qds-tag&encapsulation=shadow","src/components/tag/tag.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-tag {\n align-items: center;\n border-radius: var(--qds-control-rounded-border-radius);\n box-sizing: border-box;\n display: inline-flex;\n justify-content: center;\n max-width: inherit;\n min-width: inherit;\n width: inherit;\n}\n\n.qds-text {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.qds-sr-only {\n clip: rect(0 0 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n.qds-icon {\n flex-shrink: 0;\n}\n\n[data-status='error'] {\n color: var(--qds-theme-feedback-message-critical);\n}\n\n[data-status='success'] {\n color: var(--qds-theme-feedback-message-success);\n}\n\n[data-status='warning'] {\n color: var(--qds-theme-feedback-message-important);\n}\n\n[data-status='info'] {\n color: var(--qds-theme-feedback-message-informational);\n}\n\n[data-status='neutral'] {\n color: var(--qds-theme-feedback-message-neutral);\n}\n\n[data-importance='subdued'] .qds-text {\n color: var(--qds-theme-control-text-standard);\n}\n\n[data-importance='standard'] {\n &[data-status='error'] {\n background-color: var(--qds-theme-feedback-message-critical-dimmed);\n }\n\n &[data-status='success'] {\n background-color: var(--qds-theme-feedback-message-success-dimmed);\n }\n\n &[data-status='warning'] {\n background-color: var(--qds-theme-feedback-message-important-dimmed);\n }\n\n &[data-status='info'] {\n background-color: var(--qds-theme-feedback-message-informational-dimmed);\n }\n\n &[data-status='neutral'] {\n background-color: var(--qds-theme-feedback-message-neutral-dimmed);\n }\n}\n\n[data-importance='emphasized'] {\n &[data-status='error'] {\n background-color: var(--qds-theme-feedback-message-critical);\n color: var(--qds-theme-feedback-message-critical-contrast);\n }\n\n &[data-status='success'] {\n background-color: var(--qds-theme-feedback-message-success);\n color: var(--qds-theme-feedback-message-success-contrast);\n }\n\n &[data-status='warning'] {\n background-color: var(--qds-theme-feedback-message-important);\n color: var(--qds-theme-feedback-message-important-contrast);\n }\n\n &[data-status='info'] {\n background-color: var(--qds-theme-feedback-message-informational);\n color: var(--qds-theme-feedback-message-informational-contrast);\n }\n\n &[data-status='neutral'] {\n background-color: var(--qds-theme-feedback-message-neutral);\n color: var(--qds-theme-feedback-message-neutral-contrast);\n }\n}\n\n[data-size='small'] {\n &.qds-tag {\n font: var(--qds-control-small-text);\n gap: var(--qds-control-small-gap-internal);\n height: var(--qds-control-small-height);\n }\n\n &.qds-padding {\n padding-inline: var(--qds-control-chip-small-padding-horizontal);\n }\n\n &.qds-icon {\n width: var(--qds-control-small-icon-size);\n height: var(--qds-control-small-icon-size);\n }\n}\n\n[data-size='standard'] {\n &.qds-tag {\n font: var(--qds-control-standard-text);\n gap: var(--qds-control-standard-gap-internal);\n height: var(--qds-control-standard-height);\n }\n\n &.qds-padding {\n padding-inline: var(--qds-control-chip-standard-padding-horizontal);\n }\n\n &.qds-icon {\n width: var(--qds-control-standard-icon-size);\n height: var(--qds-control-standard-icon-size);\n }\n}\n\n[data-size='large'] {\n &.qds-tag {\n font: var(--qds-control-large-text);\n gap: var(--qds-control-large-gap-internal);\n height: var(--qds-control-large-height);\n }\n\n &.qds-padding {\n padding-inline: var(--qds-control-chip-large-padding-horizontal);\n }\n\n &.qds-icon {\n width: var(--qds-control-large-icon-size);\n height: var(--qds-control-large-icon-size);\n }\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface } from '@stencil/core'\nimport { Component, Element, Fragment, h, Prop } from '@stencil/core'\n\nimport type { Attributes } from '../../helpers'\nimport { inheritAriaAttributes } from '../../helpers'\nimport type { Importance, Size, Status } from '../shared'\n\nexport type TagStatus = Status | 'neutral'\n\n/**\n * The `<qds-tag>` element is a static descriptor used for items that need to\n * be labeled, categorized, or organized using keywords that describe them.\n *\n * @see https://quartz.se.com/build/components/tag\n */\n@Component({\n tag: 'qds-tag',\n shadow: true,\n styleUrl: 'tag.css',\n})\nexport class Tag implements ComponentInterface {\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 * The tag's importance.\n */\n @Prop() public readonly importance?: Importance = 'standard'\n\n /**\n * The tag's status.\n */\n @Prop() public readonly status?: TagStatus = 'neutral'\n\n /**\n * The tag's size.\n */\n @Prop() public readonly size?: Size = 'standard'\n\n /**\n * The tag's text.\n */\n @Prop() public readonly text?: string\n\n /**\n * Provides a text description of the icon for screen readers.\n */\n @Prop() public readonly iconDescription?: string\n\n /**\n * Displays an indicator if `true`.\n */\n @Prop() public readonly badge?: boolean = false\n\n /**\n * The indicator badge's accessible text that will be used by\n * screen readers.\n */\n @Prop() public readonly badgeDescription?: string\n\n @Element() private readonly host!: HTMLElement\n\n #inheritedAttributes: Attributes = {}\n\n get #computedImportance(): Importance {\n switch (this.importance) {\n case 'subdued':\n case 'emphasized': {\n return this.importance\n }\n default: {\n return 'standard'\n }\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 #computedStatus(): TagStatus {\n switch (this.status) {\n case 'error':\n case 'info':\n case 'success':\n case 'warning': {\n return this.status\n }\n default: {\n return 'neutral'\n }\n }\n }\n\n get #hasBadge(): boolean {\n return (this.badge ?? false) && this.importance !== 'emphasized'\n }\n\n public componentWillLoad(): void {\n this.#inheritedAttributes = inheritAriaAttributes(this.host)\n }\n\n public render() {\n return (\n <span\n class={{\n 'qds-tag': true,\n 'qds-padding': this.importance !== 'subdued',\n }}\n data-importance={this.#computedImportance}\n data-size={this.#computedSize}\n data-status={this.#computedStatus}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...this.#inheritedAttributes}\n >\n {this.iconName !== undefined && this.iconName !== '' ? (\n <>\n {this.iconDescription !== undefined &&\n this.iconDescription !== '' && (\n <span class=\"qds-sr-only\">{this.iconDescription}</span>\n )}\n <qds-icon\n aria-hidden=\"true\"\n class=\"qds-icon\"\n data-size={this.#computedSize}\n library={this.iconLibrary}\n name={this.iconName}\n />\n </>\n ) : (\n this.#hasBadge && (\n <qds-badge-indicator\n status={this.#computedStatus}\n description={this.badgeDescription}\n size={this.#computedSize}\n strokeRing\n />\n )\n )}\n <span class=\"qds-text\">{this.text}</span>\n </span>\n )\n }\n}\n"],"version":3}
@@ -3,7 +3,7 @@
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
8
  const badgeCounterCss = ":host([hidden]){display:none!important}:host{display:inline-block}.qds-badge-counter{align-items:center;background-color:var(--qds-theme-feedback-message-neutral);border-radius:var(--qds-control-toggle-indicator-rounded-border-radius);color:var(--qds-theme-feedback-message-neutral-contrast);display:flex;font:var(--qds-badge-standard-text);height:var(--qds-badge-counter-standard-height);justify-content:center;margin:0;padding-inline:var(--qds-badge-standard-padding-horizontal);text-align:center}.qds-stroke-ring{border:var(--qds-badge-border-width) solid var(--qds-theme-feedback-message-neutral-contrast)}.qds-sr-only{clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}[data-importance=emphasized]{background-color:var(--qds-theme-signature-color-contrast);color:var(--qds-theme-signature-color-default)}.qds-stroke-ring[data-importance=emphasized]{border-color:var(--qds-theme-signature-color-default)}[data-importance=subdued]{background-color:var(--qds-theme-feedback-message-informational);color:var(--qds-theme-feedback-message-informational-contrast)}.qds-stroke-ring[data-importance=subdued]{border-color:var(--qds-theme-feedback-message-informational-contrast)}[data-importance=destructive]{background-color:var(--qds-theme-feedback-message-critical-contrast);color:var(--qds-theme-feedback-message-critical)}.qds-stroke-ring[data-importance=destructive]{border-color:var(--qds-theme-feedback-message-critical)}[data-importance=subdued-destructive]{background-color:var(--qds-theme-feedback-message-critical);color:var(--qds-theme-feedback-message-critical-contrast)}.qds-stroke-ring[data-importance=subdued-destructive]{border-color:var(--qds-theme-feedback-message-critical-contrast)}[data-size=small]{font:var(--qds-badge-small-text);height:var(--qds-badge-counter-small-height);padding-inline:var(--qds-badge-small-padding-horizontal)}[data-size=large]{font:var(--qds-badge-large-text);height:var(--qds-badge-counter-large-height);padding-inline:var(--qds-badge-large-padding-horizontal)}[data-size=hero]{font:var(--qds-badge-hero-text);height:var(--qds-badge-counter-hero-height);padding-inline:var(--qds-badge-hero-padding-horizontal)}";
9
9
  const QdsBadgeCounterStyle0 = badgeCounterCss;
@@ -100,4 +100,4 @@ function defineCustomElement() {
100
100
 
101
101
  export { BadgeCounter as B, defineCustomElement as d };
102
102
 
103
- //# sourceMappingURL=p-3c48ff53.js.map
103
+ //# sourceMappingURL=p-e22dd76d.js.map
@@ -1 +1 @@
1
- {"file":"p-3c48ff53.js","mappings":";;;;;;;AAAA,MAAM,eAAe,GAAG,4qEAA4qE,CAAC;AACrsE,8BAAe,eAAe;;ACD9B;AACA;AACA;;;;;;;;;MAwBa,YAAY;IALzB;;;;;;;;QAmB0B,eAAU,GAA4B,UAAU,CAAA;;;;QAKhD,SAAI,GAAsB,UAAU,CAAA;;;;QAKpC,eAAU,GAAY,KAAK,CAAA;KA4DpD;IAfQ,MAAM;QACX,QACE,6DACE,KAAK,EAAE;gBACL,mBAAmB,EAAE,IAAI;gBACzB,iBAAiB,EAAE,IAAI,CAAC,UAAU;aACnC,qBACgB,uBAAA,IAAI,qEAAoB,eAC9B,uBAAA,IAAI,+DAAc,IAE5B,uBAAA,IAAI,gEAAe,EACpB,6DAAM,KAAK,EAAC,aAAa,IAAE,IAAI,CAAC,WAAW,CAAQ,CAC9C,EACR;KACF;;;;;;;;;;IAnDC,MAAM,KAAK,GACT,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ;UAC1B,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,EAAE,EAAE,CAAC;;aAE9B,IAAI,CAAC,KAAK,IAAI,MAAM,CAAC,GAAG,CAAC,CAAA;IAChC,IAAI,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,KAAK,GAAG,CAAC;QAAE,OAAO,EAAE,CAAA;IAE/C,OAAO,KAAK,GAAG,GAAG,GAAG,KAAK,CAAC,QAAQ,EAAE,GAAG,KAAK,CAAA;AAC/C,CAAC;IAGC,QAAQ,IAAI,CAAC,UAAU;QACrB,KAAK,SAAS,CAAC;QACf,KAAK,aAAa,CAAC;QACnB,KAAK,qBAAqB,CAAC;QAC3B,KAAK,YAAY,EAAE;YACjB,OAAO,IAAI,CAAC,UAAU,CAAA;SACvB;QACD,SAAS;YACP,OAAO,UAAU,CAAA;SAClB;KACF;AACH,CAAC;IAGC,QAAQ,IAAI,CAAC,IAAI;QACf,KAAK,MAAM,CAAC;QACZ,KAAK,OAAO,CAAC;QACb,KAAK,OAAO,EAAE;YACZ,OAAO,IAAI,CAAC,IAAI,CAAA;SACjB;QACD,SAAS;YACP,OAAO,UAAU,CAAA;SAClB;KACF;AACH,CAAC;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/badge-counter/badge-counter.css?tag=qds-badge-counter&encapsulation=shadow","src/components/badge-counter/badge-counter.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-badge-counter {\n align-items: center;\n background-color: var(--qds-theme-feedback-message-neutral);\n border-radius: var(--qds-control-toggle-indicator-rounded-border-radius);\n color: var(--qds-theme-feedback-message-neutral-contrast);\n display: flex;\n font: var(--qds-badge-standard-text);\n height: var(--qds-badge-counter-standard-height);\n justify-content: center;\n margin: 0;\n padding-inline: var(--qds-badge-standard-padding-horizontal);\n text-align: center;\n}\n\n.qds-stroke-ring {\n border: var(--qds-badge-border-width) solid\n var(--qds-theme-feedback-message-neutral-contrast);\n}\n\n.qds-sr-only {\n clip: rect(0 0 0 0);\n height: 1px;\n width: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n}\n\n[data-importance='emphasized'] {\n background-color: var(--qds-theme-signature-color-contrast);\n color: var(--qds-theme-signature-color-default);\n\n &.qds-stroke-ring {\n border-color: var(--qds-theme-signature-color-default);\n }\n}\n\n[data-importance='subdued'] {\n background-color: var(--qds-theme-feedback-message-informational);\n color: var(--qds-theme-feedback-message-informational-contrast);\n\n &.qds-stroke-ring {\n border-color: var(--qds-theme-feedback-message-informational-contrast);\n }\n}\n\n[data-importance='destructive'] {\n background-color: var(--qds-theme-feedback-message-critical-contrast);\n color: var(--qds-theme-feedback-message-critical);\n\n &.qds-stroke-ring {\n border-color: var(--qds-theme-feedback-message-critical);\n }\n}\n\n[data-importance='subdued-destructive'] {\n color: var(--qds-theme-feedback-message-critical-contrast);\n background-color: var(--qds-theme-feedback-message-critical);\n\n &.qds-stroke-ring {\n border-color: var(--qds-theme-feedback-message-critical-contrast);\n }\n}\n\n[data-size='small'] {\n font: var(--qds-badge-small-text);\n height: var(--qds-badge-counter-small-height);\n padding-inline: var(--qds-badge-small-padding-horizontal);\n}\n\n[data-size='large'] {\n font: var(--qds-badge-large-text);\n height: var(--qds-badge-counter-large-height);\n padding-inline: var(--qds-badge-large-padding-horizontal);\n}\n\n[data-size='hero'] {\n font: var(--qds-badge-hero-text);\n height: var(--qds-badge-counter-hero-height);\n padding-inline: var(--qds-badge-hero-padding-horizontal);\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface } from '@stencil/core'\nimport { Component, h, Prop } from '@stencil/core'\n\nimport type { Importance, Size } from '../shared'\n\nexport type BadgeCounterImportance =\n | Importance\n | 'destructive'\n | 'subdued-destructive'\nexport type BadgeCounterSize = Size | 'hero'\n\n/**\n * The `<qds-badge-counter>` element is a small, rounded UI element used to\n * display numerical values or counts. It is designed to draw the user's eye to\n * important or dynamic content by providing a visual cue that a countable\n * event or item has occurred or is waiting to be addressed.\n */\n@Component({\n tag: 'qds-badge-counter',\n shadow: true,\n styleUrl: 'badge-counter.css',\n})\nexport class BadgeCounter implements ComponentInterface {\n /**\n * Adds accessible text to the qds-badge-counter that will be used by screen\n * readers.\n *\n * @example\n * <qds-badge-counter value={2} description=\"new notifications\"></qds-badge-counter>\n * // This qds-badge-counter will be read by screen readers as \"two new notifications\"\n */\n @Prop() public readonly description?: string\n\n /**\n * The badge counter's importance.\n */\n @Prop() public readonly importance?: BadgeCounterImportance = 'standard'\n\n /**\n * The badge counter's size.\n */\n @Prop() public readonly size?: BadgeCounterSize = 'standard'\n\n /**\n * Shows a stroke ring around the component for better visibility\n */\n @Prop() public readonly strokeRing: boolean = false\n\n /**\n * The badge-counter's value.\n */\n @Prop() public readonly value!: number | string\n\n get #computedValue(): string {\n const value =\n typeof this.value === 'string'\n ? Number.parseInt(this.value, 10)\n : // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n (this.value ?? Number.NaN)\n if (Number.isNaN(value) || value < 0) return ''\n\n return value < 100 ? value.toString() : '99+'\n }\n\n get #computedImportance(): BadgeCounterImportance {\n switch (this.importance) {\n case 'subdued':\n case 'destructive':\n case 'subdued-destructive':\n case 'emphasized': {\n return this.importance\n }\n default: {\n return 'standard'\n }\n }\n }\n\n get #computedSize(): BadgeCounterSize {\n switch (this.size) {\n case 'hero':\n case 'large':\n case 'small': {\n return this.size\n }\n default: {\n return 'standard'\n }\n }\n }\n\n public render() {\n return (\n <span\n class={{\n 'qds-badge-counter': true,\n 'qds-stroke-ring': this.strokeRing,\n }}\n data-importance={this.#computedImportance}\n data-size={this.#computedSize}\n >\n {this.#computedValue}\n <span class=\"qds-sr-only\">{this.description}</span>\n </span>\n )\n }\n}\n"],"version":3}
1
+ {"file":"p-e22dd76d.js","mappings":";;;;;;;AAAA,MAAM,eAAe,GAAG,4qEAA4qE,CAAC;AACrsE,8BAAe,eAAe;;ACD9B;AACA;AACA;;;;;;;;;MAwBa,YAAY;IALzB;;;;;;;;QAmB0B,eAAU,GAA4B,UAAU,CAAA;;;;QAKhD,SAAI,GAAsB,UAAU,CAAA;;;;QAKpC,eAAU,GAAY,KAAK,CAAA;KA4DpD;IAfQ,MAAM;QACX,QACE,6DACE,KAAK,EAAE;gBACL,mBAAmB,EAAE,IAAI;gBACzB,iBAAiB,EAAE,IAAI,CAAC,UAAU;aACnC,qBACgB,uBAAA,IAAI,qEAAoB,eAC9B,uBAAA,IAAI,+DAAc,IAE5B,uBAAA,IAAI,gEAAe,EACpB,6DAAM,KAAK,EAAC,aAAa,IAAE,IAAI,CAAC,WAAW,CAAQ,CAC9C,EACR;KACF;;;;;;;;;;IAnDC,MAAM,KAAK,GACT,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ;UAC1B,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,EAAE,EAAE,CAAC;;aAE9B,IAAI,CAAC,KAAK,IAAI,MAAM,CAAC,GAAG,CAAC,CAAA;IAChC,IAAI,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,KAAK,GAAG,CAAC;QAAE,OAAO,EAAE,CAAA;IAE/C,OAAO,KAAK,GAAG,GAAG,GAAG,KAAK,CAAC,QAAQ,EAAE,GAAG,KAAK,CAAA;AAC/C,CAAC;IAGC,QAAQ,IAAI,CAAC,UAAU;QACrB,KAAK,SAAS,CAAC;QACf,KAAK,aAAa,CAAC;QACnB,KAAK,qBAAqB,CAAC;QAC3B,KAAK,YAAY,EAAE;YACjB,OAAO,IAAI,CAAC,UAAU,CAAA;SACvB;QACD,SAAS;YACP,OAAO,UAAU,CAAA;SAClB;KACF;AACH,CAAC;IAGC,QAAQ,IAAI,CAAC,IAAI;QACf,KAAK,MAAM,CAAC;QACZ,KAAK,OAAO,CAAC;QACb,KAAK,OAAO,EAAE;YACZ,OAAO,IAAI,CAAC,IAAI,CAAA;SACjB;QACD,SAAS;YACP,OAAO,UAAU,CAAA;SAClB;KACF;AACH,CAAC;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/badge-counter/badge-counter.css?tag=qds-badge-counter&encapsulation=shadow","src/components/badge-counter/badge-counter.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-badge-counter {\n align-items: center;\n background-color: var(--qds-theme-feedback-message-neutral);\n border-radius: var(--qds-control-toggle-indicator-rounded-border-radius);\n color: var(--qds-theme-feedback-message-neutral-contrast);\n display: flex;\n font: var(--qds-badge-standard-text);\n height: var(--qds-badge-counter-standard-height);\n justify-content: center;\n margin: 0;\n padding-inline: var(--qds-badge-standard-padding-horizontal);\n text-align: center;\n}\n\n.qds-stroke-ring {\n border: var(--qds-badge-border-width) solid\n var(--qds-theme-feedback-message-neutral-contrast);\n}\n\n.qds-sr-only {\n clip: rect(0 0 0 0);\n height: 1px;\n width: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n}\n\n[data-importance='emphasized'] {\n background-color: var(--qds-theme-signature-color-contrast);\n color: var(--qds-theme-signature-color-default);\n\n &.qds-stroke-ring {\n border-color: var(--qds-theme-signature-color-default);\n }\n}\n\n[data-importance='subdued'] {\n background-color: var(--qds-theme-feedback-message-informational);\n color: var(--qds-theme-feedback-message-informational-contrast);\n\n &.qds-stroke-ring {\n border-color: var(--qds-theme-feedback-message-informational-contrast);\n }\n}\n\n[data-importance='destructive'] {\n background-color: var(--qds-theme-feedback-message-critical-contrast);\n color: var(--qds-theme-feedback-message-critical);\n\n &.qds-stroke-ring {\n border-color: var(--qds-theme-feedback-message-critical);\n }\n}\n\n[data-importance='subdued-destructive'] {\n color: var(--qds-theme-feedback-message-critical-contrast);\n background-color: var(--qds-theme-feedback-message-critical);\n\n &.qds-stroke-ring {\n border-color: var(--qds-theme-feedback-message-critical-contrast);\n }\n}\n\n[data-size='small'] {\n font: var(--qds-badge-small-text);\n height: var(--qds-badge-counter-small-height);\n padding-inline: var(--qds-badge-small-padding-horizontal);\n}\n\n[data-size='large'] {\n font: var(--qds-badge-large-text);\n height: var(--qds-badge-counter-large-height);\n padding-inline: var(--qds-badge-large-padding-horizontal);\n}\n\n[data-size='hero'] {\n font: var(--qds-badge-hero-text);\n height: var(--qds-badge-counter-hero-height);\n padding-inline: var(--qds-badge-hero-padding-horizontal);\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface } from '@stencil/core'\nimport { Component, h, Prop } from '@stencil/core'\n\nimport type { Importance, Size } from '../shared'\n\nexport type BadgeCounterImportance =\n | Importance\n | 'destructive'\n | 'subdued-destructive'\nexport type BadgeCounterSize = Size | 'hero'\n\n/**\n * The `<qds-badge-counter>` element is a small, rounded UI element used to\n * display numerical values or counts. It is designed to draw the user's eye to\n * important or dynamic content by providing a visual cue that a countable\n * event or item has occurred or is waiting to be addressed.\n */\n@Component({\n tag: 'qds-badge-counter',\n shadow: true,\n styleUrl: 'badge-counter.css',\n})\nexport class BadgeCounter implements ComponentInterface {\n /**\n * Adds accessible text to the qds-badge-counter that will be used by screen\n * readers.\n *\n * @example\n * <qds-badge-counter value={2} description=\"new notifications\"></qds-badge-counter>\n * // This qds-badge-counter will be read by screen readers as \"two new notifications\"\n */\n @Prop() public readonly description?: string\n\n /**\n * The badge counter's importance.\n */\n @Prop() public readonly importance?: BadgeCounterImportance = 'standard'\n\n /**\n * The badge counter's size.\n */\n @Prop() public readonly size?: BadgeCounterSize = 'standard'\n\n /**\n * Shows a stroke ring around the component for better visibility\n */\n @Prop() public readonly strokeRing: boolean = false\n\n /**\n * The badge-counter's value.\n */\n @Prop() public readonly value!: number | string\n\n get #computedValue(): string {\n const value =\n typeof this.value === 'string'\n ? Number.parseInt(this.value, 10)\n : // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n (this.value ?? Number.NaN)\n if (Number.isNaN(value) || value < 0) return ''\n\n return value < 100 ? value.toString() : '99+'\n }\n\n get #computedImportance(): BadgeCounterImportance {\n switch (this.importance) {\n case 'subdued':\n case 'destructive':\n case 'subdued-destructive':\n case 'emphasized': {\n return this.importance\n }\n default: {\n return 'standard'\n }\n }\n }\n\n get #computedSize(): BadgeCounterSize {\n switch (this.size) {\n case 'hero':\n case 'large':\n case 'small': {\n return this.size\n }\n default: {\n return 'standard'\n }\n }\n }\n\n public render() {\n return (\n <span\n class={{\n 'qds-badge-counter': true,\n 'qds-stroke-ring': this.strokeRing,\n }}\n data-importance={this.#computedImportance}\n data-size={this.#computedSize}\n >\n {this.#computedValue}\n <span class=\"qds-sr-only\">{this.description}</span>\n </span>\n )\n }\n}\n"],"version":3}
@@ -3,7 +3,7 @@
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
  import { a as attachInternals } from './p-8abba29b.js';
8
8
 
9
9
  const dividerCss = ":host([hidden]){display:none!important}:host{display:block}.qds-divider{border:none;height:var(--qds-control-border-width);margin:0;width:100%}.qds-vertical{height:100%;width:var(--qds-control-border-width)}[data-importance=standard]{background-color:var(--qds-theme-divider-standard)}[data-importance=emphasized]{background-color:var(--qds-theme-divider-emphasized)}[data-importance=subdued]{background-color:var(--qds-theme-divider-subdued)}";
@@ -46,7 +46,7 @@ const Divider = /*@__PURE__*/ proxyCustomElement(class Divider extends H {
46
46
  this.verticalChanged();
47
47
  }
48
48
  render() {
49
- return (h("hr", { key: '5391bfd56f5a2244bc9c9941fef808ed86a181d5', class: {
49
+ return (h("hr", { key: '94c7922480ed8aff5973dec5a5ffa5a9586c7d3a', class: {
50
50
  'qds-divider': true,
51
51
  'qds-vertical': this.vertical,
52
52
  }, "aria-hidden": "true", "data-importance": __classPrivateFieldGet(this, _Divider_instances, "a", _Divider_computedImportance_get) }));
@@ -88,4 +88,4 @@ function defineCustomElement() {
88
88
 
89
89
  export { Divider as D, defineCustomElement as d };
90
90
 
91
- //# sourceMappingURL=p-b4c302d4.js.map
91
+ //# sourceMappingURL=p-e2a9e441.js.map
@@ -1 +1 @@
1
- {"file":"p-b4c302d4.js","mappings":";;;;;;;;AAAA,MAAM,UAAU,GAAG,6bAA6b,CAAC;AACjd,yBAAe,UAAU;;ACDzB;AACA;AACA;;;;;;;;;MAsBa,OAAO;IALpB;;;;;;;;QAS0B,eAAU,GAAgB,UAAU,CAAA;;;;QAKpC,aAAQ,GAAY,KAAK,CAAA;;QAGxC,6BAA+B,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,EAAA;KAsCnE;IAvBW,eAAe;QACvB,uBAAA,IAAI,0BAAW,CAAC,eAAe,GAAG,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,YAAY,CAAA;KAC5E;IAEM,iBAAiB;QACtB,uBAAA,IAAI,0BAAW,CAAC,IAAI,GAAG,WAAW,CAAA;QAClC,uBAAA,IAAI,0BAAW,CAAC,UAAU,GAAG,MAAM,CAAA;QAEnC,IAAI,CAAC,eAAe,EAAE,CAAA;KACvB;IAEM,MAAM;QACX,QACE,2DACE,KAAK,EAAE;gBACL,aAAa,EAAE,IAAI;gBACnB,cAAc,EAAE,IAAI,CAAC,QAAQ;aAC9B,iBACW,MAAM,qBACD,uBAAA,IAAI,2DAAoB,GACzC,EACH;KACF;;;;;;;;;;;;IAlCC,QAAQ,IAAI,CAAC,UAAU;QACrB,KAAK,YAAY,CAAC;QAClB,KAAK,SAAS,EAAE;YACd,OAAO,IAAI,CAAC,UAAU,CAAA;SACvB;QACD,SAAS;YACP,OAAO,UAAU,CAAA;SAClB;KACF;AACH,CAAC;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/divider/divider.css?tag=qds-divider&encapsulation=shadow","src/components/divider/divider.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-divider {\n border: none;\n height: var(--qds-control-border-width);\n margin: 0;\n width: 100%;\n}\n\n.qds-vertical {\n height: 100%;\n width: var(--qds-control-border-width);\n}\n\n[data-importance='standard'] {\n background-color: var(--qds-theme-divider-standard);\n}\n\n[data-importance='emphasized'] {\n background-color: var(--qds-theme-divider-emphasized);\n}\n\n[data-importance='subdued'] {\n background-color: var(--qds-theme-divider-subdued);\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface } from '@stencil/core'\nimport { Component, h, Prop, Watch } from '@stencil/core'\n\nimport { attachInternals } from '../../helpers'\nimport type { Importance } from '../shared'\n\n/**\n * The `<qds-divider>` element a thematic break between paragraph-level\n * elements: for example, a change of scene in a story, or a shift of topic\n * within a section.\n *\n * Dividers can also be used to group menu items in `<qds-dropdown>` elements.\n *\n * @see https://quartz.se.com/build/components/divider\n */\n@Component({\n tag: 'qds-divider',\n shadow: true,\n styleUrl: 'divider.css',\n})\nexport class Divider implements ComponentInterface {\n /**\n * The divider's importance.\n */\n @Prop() public readonly importance?: Importance = 'standard'\n\n /**\n * Display the divider in vertical orientation.\n */\n @Prop() public readonly vertical: boolean = false\n\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n readonly #internals: ElementInternals = attachInternals.call(this)\n\n get #computedImportance(): Importance {\n switch (this.importance) {\n case 'emphasized':\n case 'subdued': {\n return this.importance\n }\n default: {\n return 'standard'\n }\n }\n }\n\n @Watch('vertical')\n protected verticalChanged(): void {\n this.#internals.ariaOrientation = this.vertical ? 'vertical' : 'horizontal'\n }\n\n public componentWillLoad(): void {\n this.#internals.role = 'separator'\n this.#internals.ariaHidden = 'true'\n\n this.verticalChanged()\n }\n\n public render() {\n return (\n <hr\n class={{\n 'qds-divider': true,\n 'qds-vertical': this.vertical,\n }}\n aria-hidden=\"true\"\n data-importance={this.#computedImportance}\n />\n )\n }\n}\n"],"version":3}
1
+ {"file":"p-e2a9e441.js","mappings":";;;;;;;;AAAA,MAAM,UAAU,GAAG,6bAA6b,CAAC;AACjd,yBAAe,UAAU;;ACDzB;AACA;AACA;;;;;;;;;MAsBa,OAAO;IALpB;;;;;;;;QAS0B,eAAU,GAAgB,UAAU,CAAA;;;;QAKpC,aAAQ,GAAY,KAAK,CAAA;;QAGxC,6BAA+B,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,EAAA;KAsCnE;IAvBW,eAAe;QACvB,uBAAA,IAAI,0BAAW,CAAC,eAAe,GAAG,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,YAAY,CAAA;KAC5E;IAEM,iBAAiB;QACtB,uBAAA,IAAI,0BAAW,CAAC,IAAI,GAAG,WAAW,CAAA;QAClC,uBAAA,IAAI,0BAAW,CAAC,UAAU,GAAG,MAAM,CAAA;QAEnC,IAAI,CAAC,eAAe,EAAE,CAAA;KACvB;IAEM,MAAM;QACX,QACE,2DACE,KAAK,EAAE;gBACL,aAAa,EAAE,IAAI;gBACnB,cAAc,EAAE,IAAI,CAAC,QAAQ;aAC9B,iBACW,MAAM,qBACD,uBAAA,IAAI,2DAAoB,GACzC,EACH;KACF;;;;;;;;;;;;IAlCC,QAAQ,IAAI,CAAC,UAAU;QACrB,KAAK,YAAY,CAAC;QAClB,KAAK,SAAS,EAAE;YACd,OAAO,IAAI,CAAC,UAAU,CAAA;SACvB;QACD,SAAS;YACP,OAAO,UAAU,CAAA;SAClB;KACF;AACH,CAAC;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/divider/divider.css?tag=qds-divider&encapsulation=shadow","src/components/divider/divider.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-divider {\n border: none;\n height: var(--qds-control-border-width);\n margin: 0;\n width: 100%;\n}\n\n.qds-vertical {\n height: 100%;\n width: var(--qds-control-border-width);\n}\n\n[data-importance='standard'] {\n background-color: var(--qds-theme-divider-standard);\n}\n\n[data-importance='emphasized'] {\n background-color: var(--qds-theme-divider-emphasized);\n}\n\n[data-importance='subdued'] {\n background-color: var(--qds-theme-divider-subdued);\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface } from '@stencil/core'\nimport { Component, h, Prop, Watch } from '@stencil/core'\n\nimport { attachInternals } from '../../helpers'\nimport type { Importance } from '../shared'\n\n/**\n * The `<qds-divider>` element a thematic break between paragraph-level\n * elements: for example, a change of scene in a story, or a shift of topic\n * within a section.\n *\n * Dividers can also be used to group menu items in `<qds-dropdown>` elements.\n *\n * @see https://quartz.se.com/build/components/divider\n */\n@Component({\n tag: 'qds-divider',\n shadow: true,\n styleUrl: 'divider.css',\n})\nexport class Divider implements ComponentInterface {\n /**\n * The divider's importance.\n */\n @Prop() public readonly importance?: Importance = 'standard'\n\n /**\n * Display the divider in vertical orientation.\n */\n @Prop() public readonly vertical: boolean = false\n\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n readonly #internals: ElementInternals = attachInternals.call(this)\n\n get #computedImportance(): Importance {\n switch (this.importance) {\n case 'emphasized':\n case 'subdued': {\n return this.importance\n }\n default: {\n return 'standard'\n }\n }\n }\n\n @Watch('vertical')\n protected verticalChanged(): void {\n this.#internals.ariaOrientation = this.vertical ? 'vertical' : 'horizontal'\n }\n\n public componentWillLoad(): void {\n this.#internals.role = 'separator'\n this.#internals.ariaHidden = 'true'\n\n this.verticalChanged()\n }\n\n public render() {\n return (\n <hr\n class={{\n 'qds-divider': true,\n 'qds-vertical': this.vertical,\n }}\n aria-hidden=\"true\"\n data-importance={this.#computedImportance}\n />\n )\n }\n}\n"],"version":3}
@@ -3,7 +3,7 @@
3
3
  *
4
4
  * SPDX-License-Identifier: Apache-2.0
5
5
  */
6
- import { B as BadgeCounter, d as defineCustomElement$1 } from './p-3c48ff53.js';
6
+ import { B as BadgeCounter, d as defineCustomElement$1 } from './p-e22dd76d.js';
7
7
 
8
8
  const QdsBadgeCounter = BadgeCounter;
9
9
  const defineCustomElement = defineCustomElement$1;
@@ -3,7 +3,7 @@
3
3
  *
4
4
  * SPDX-License-Identifier: Apache-2.0
5
5
  */
6
- import { B as BadgeIndicator, d as defineCustomElement$1 } from './p-fed0d11f.js';
6
+ import { B as BadgeIndicator, d as defineCustomElement$1 } from './p-5570cc30.js';
7
7
 
8
8
  const QdsBadgeIndicator = BadgeIndicator;
9
9
  const defineCustomElement = defineCustomElement$1;
@@ -3,9 +3,9 @@
3
3
  *
4
4
  * SPDX-License-Identifier: Apache-2.0
5
5
  */
6
- import { p as proxyCustomElement, H, h, F as Fragment } from './p-2806fee1.js';
6
+ import { p as proxyCustomElement, H, r as readTask, h, F as Fragment } from './p-50f85f75.js';
7
7
  import { a as attachInternals, b as isOverflowing } from './p-8abba29b.js';
8
- import { d as defineCustomElement$2 } from './p-c80f112a.js';
8
+ import { d as defineCustomElement$2 } from './p-70d12c72.js';
9
9
 
10
10
  const breadcrumbItemCss = ":host([hidden]){display:none!important}:host{display:inline-block}.qds-anchor{-webkit-text-decoration:none;text-decoration:none}.qds-anchor:hover{-webkit-text-decoration:underline;text-decoration:underline}.qds-breadcrumb-item{align-items:center;display:inline-flex;font:var(--qds-control-standard-text);gap:var(--qds-control-standard-gap-siblings-related);height:var(--qds-control-standard-height);width:inherit}.qds-divider{margin-inline:auto}.qds-overflow{line-height:normal;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.qds-anchor,.qds-breadcrumb-item{color:var(--qds-theme-control-text-standard)}.qds-anchor:focus-visible,.qds-breadcrumb-item:focus-visible{border-radius:var(--qds-focus-border-radius);outline:var(--qds-focus-border-width) solid var(--qds-theme-focus-border);outline-offset:var(--qds-focus-border-offset)}";
11
11
  const QdsBreadcrumbItemStyle0 = breadcrumbItemCss;
@@ -59,7 +59,10 @@ const QdsBreadcrumbItem$1 = /*@__PURE__*/ proxyCustomElement(class QdsBreadcrumb
59
59
  __classPrivateFieldGet(this, _QdsBreadcrumbItem_ro, "f").disconnect();
60
60
  if (!__classPrivateFieldGet(this, _QdsBreadcrumbItem_span, "f"))
61
61
  return;
62
- this.tooltip = isOverflowing(__classPrivateFieldGet(this, _QdsBreadcrumbItem_span, "f"));
62
+ const span = __classPrivateFieldGet(this, _QdsBreadcrumbItem_span, "f");
63
+ readTask(() => {
64
+ this.tooltip = isOverflowing(span);
65
+ });
63
66
  __classPrivateFieldSet(this, _QdsBreadcrumbItem_ro, new ResizeObserver(([spanEntry]) => {
64
67
  this.tooltip = isOverflowing(spanEntry.target);
65
68
  }), "f");
@@ -76,7 +79,7 @@ const QdsBreadcrumbItem$1 = /*@__PURE__*/ proxyCustomElement(class QdsBreadcrumb
76
79
  __classPrivateFieldGet(this, _QdsBreadcrumbItem_ro, "f").disconnect();
77
80
  }
78
81
  render() {
79
- return (h("div", { key: '7640d08e7afe853363af70eae0e9ea3b3ec4a1f3', class: "qds-breadcrumb-item", ref: this.href === undefined ? __classPrivateFieldGet(this, _QdsBreadcrumbItem_breadcrumbItemRef, "f") : undefined, tabIndex: this.tooltip && this.href === undefined ? 0 : undefined }, this.href === undefined ? __classPrivateFieldGet(this, _QdsBreadcrumbItem_instances, "m", _QdsBreadcrumbItem_renderText).call(this) : __classPrivateFieldGet(this, _QdsBreadcrumbItem_instances, "m", _QdsBreadcrumbItem_renderAnchor).call(this), this.tooltip && (h("qds-tooltip", { key: 'feb66781c919e1139bb92b6174bada2f59e3bb45', "aria-hidden": "true", ref: __classPrivateFieldGet(this, _QdsBreadcrumbItem_tooltipRef, "f") }, this.text))));
82
+ return (h("div", { key: '4f9f59ac89630bc02ee25e98530908100201258b', class: "qds-breadcrumb-item", ref: this.href === undefined ? __classPrivateFieldGet(this, _QdsBreadcrumbItem_breadcrumbItemRef, "f") : undefined, tabIndex: this.tooltip && this.href === undefined ? 0 : undefined }, this.href === undefined ? __classPrivateFieldGet(this, _QdsBreadcrumbItem_instances, "m", _QdsBreadcrumbItem_renderText).call(this) : __classPrivateFieldGet(this, _QdsBreadcrumbItem_instances, "m", _QdsBreadcrumbItem_renderAnchor).call(this), this.tooltip && (h("qds-tooltip", { key: '133e4a568e37e8d17939e614e861385f35a7c3d4', "aria-hidden": "true", ref: __classPrivateFieldGet(this, _QdsBreadcrumbItem_tooltipRef, "f") }, this.text))));
80
83
  }
81
84
  static get delegatesFocus() { return true; }
82
85
  static get watchers() { return {
@@ -1 +1 @@
1
- {"file":"qds-breadcrumb-item.js","mappings":"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","names":["QdsBreadcrumbItem"],"sources":["src/components/breadcrumb-item/breadcrumb-item.css?tag=qds-breadcrumb-item&encapsulation=shadow","src/components/breadcrumb-item/breadcrumb-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: inline-block;\n}\n\n.qds-anchor {\n text-decoration: none;\n\n &:hover {\n text-decoration: underline;\n }\n}\n\n.qds-breadcrumb-item {\n align-items: center;\n display: inline-flex;\n font: var(--qds-control-standard-text);\n gap: var(--qds-control-standard-gap-siblings-related);\n height: var(--qds-control-standard-height);\n width: inherit;\n}\n\n.qds-divider {\n margin-inline: auto;\n}\n\n.qds-overflow {\n line-height: normal;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.qds-anchor,\n.qds-breadcrumb-item {\n color: var(--qds-theme-control-text-standard);\n\n &:focus-visible {\n outline: var(--qds-focus-border-width) solid var(--qds-theme-focus-border);\n outline-offset: var(--qds-focus-border-offset);\n border-radius: var(--qds-focus-border-radius);\n }\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface, JSX } from '@stencil/core'\nimport { Component, Fragment, h, Prop, State, Watch } from '@stencil/core'\nimport type { LiteralUnion } from 'type-fest'\n\nimport { attachInternals, isOverflowing } from '../../helpers'\n\nexport type BreadcrumbTarget = '_blank' | '_parent' | '_self' | '_top'\n\n/**\n * The `<qds-breadcrumb-item>` element is used as a navigational aid that is\n * typically placed between a site's header and the main content, displaying\n * either a hierarchy of the current page in relation to the site's structure,\n * from top level to current page, or a list of the links the user followed to\n * get to the current page, in the order visited.\n *\n * @see https://quartz.se.com/build/components/breadcrumb\n */\n@Component({\n tag: 'qds-breadcrumb-item',\n styleUrl: 'breadcrumb-item.css',\n shadow: { delegatesFocus: true },\n})\nexport class QdsBreadcrumbItem implements ComponentInterface {\n /**\n * The breadcrumb item's text.\n */\n @Prop() public readonly text!: string\n\n /**\n * The URL that the inline link points to. Inline links are not restricted to\n * HTTP-based URLs — they can use any URL scheme supported by browsers:\n *\n * - Sections of a page with document fragments\n * - While web browsers may not support other URL schemes, websites can with\n * [`registerProtocolHandler()`](https://developer.mozilla.org/docs/Web/API/Navigator/registerProtocolHandler)\n *\n * @webnative\n */\n @Prop() public readonly href?: string\n\n /**\n * Hints at the human language of the linked URL. No built-in functionality.\n * Allowed values are the same as\n * [the global `lang` attribute](https://developer.mozilla.org/docs/Web/HTML/Global_attributes/lang).\n *\n * @webnative\n */\n @Prop() public readonly hreflang?: string\n\n /**\n * How much of the\n * [referrer](https://developer.mozilla.org/docs/Web/HTTP/Headers/Referer)\n * to send when following the inline link.\n *\n * - `no-referrer`: The\n * [`Referer`](https://developer.mozilla.org/docs/Web/HTTP/Headers/Referer)\n * header will not be sent.\n * - `no-referrer-when-downgrade`: The\n * [`Referer`](https://developer.mozilla.org/docs/Web/HTTP/Headers/Referer)\n * header will not be sent to\n * [origin](https://developer.mozilla.org/docs/Glossary/Origin)s\n * without [TLS](https://developer.mozilla.org/docs/Glossary/TLS)\n * ([HTTPS](https://developer.mozilla.org/docs/Glossary/HTTPS)).\n * - `origin`: The sent referrer will be limited to the origin of the\n * referring page: its\n * [scheme](https://developer.mozilla.org/docs/Learn/Common_questions/What_is_a_URL),\n * [host](https://developer.mozilla.org/docs/Glossary/Host), and\n * [port](https://developer.mozilla.org/docs/Glossary/Port).\n * - `origin-when-cross-origin`: The referrer sent to other origins will be\n * limited to the scheme, the host, and the port. Navigations on the same\n * origin will still include the path.\n * - `same-origin`: A referrer will be sent for\n * [same origin](https://developer.mozilla.org/docs/Glossary/Same-origin_policy),\n * but cross-origin requests will contain no referrer information.\n * - `strict-origin`: Only send the origin of the document as the referrer\n * when the protocol security level stays the same (HTTPS→HTTPS), but don't\n * send it to a less secure destination (HTTPS→HTTP).\n * - `strict-origin-when-cross-origin` (default): Send a full URL when\n * performing a same-origin request, only send the origin when the protocol\n * security level stays the same (HTTPS→HTTPS), and send no header to a less\n * secure destination (HTTPS→HTTP).\n * - `unsafe-url`: The referrer will include the origin and the path (but not the\n * [fragment](https://developer.mozilla.org/docs/Web/API/HTMLAnchorElement/hash),\n * [password](https://developer.mozilla.org/docs/Web/API/HTMLAnchorElement/password),\n * or [username](https://developer.mozilla.org/docs/Web/API/HTMLAnchorElement/username)).\n * **This value is unsafe** because it leaks origins and paths from\n * TLS-protected resources to insecure origins.\n *\n * @webnative\n */\n @Prop({ attribute: 'referrerpolicy' })\n public readonly referrerPolicy?: ReferrerPolicy\n\n /**\n * The relationship of the linked URL as space-separated\n * [link types](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel).\n *\n * The following list includes some of the most important existing keywords.\n * Every keyword within a space-separated value should be unique within that\n * value.\n *\n * - [`alternate`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel#attr-alternate):\n * Alternate representations of the current document.\n * - [`author`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel#attr-author):\n * Author of the current document or article.\n * - [`bookmark`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel#attr-bookmark):\n * Permalink for the nearest ancestor section.\n * - [`external`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel#attr-external):\n * The referenced document is not part of the same site as the current\n * document. An icon will be rendered next to the text if this value is\n * specified.\n * - [`help`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel#attr-help):\n * Link to context-sensitive help.\n * - [`license`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel#attr-license):\n * Indicates that the main content of the current document is covered by the\n * copyright license described by the referenced document.\n * - [`me`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel/me):\n * Indicates that the current document represents the person who owns the\n * linked content.\n * - [`next`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel#attr-next):\n * Indicates that the current document is a part of a series and that the\n * next document in the series is the referenced document.\n * - [`nofollow`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel#attr-nofollow):\n * Indicates that the current document's original author or publisher does\n * not endorse the referenced document.\n * - [`noopener`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel/noopener):\n * Creates a top-level browsing context that is not an auxiliary browsing\n * context if the hyperlink would create either of those, to begin with (i.e.,\n * has an appropriate `target` attribute value).\n * - [`noreferrer`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel#attr-noreferrer):\n * No `Referer` header will be included. Additionally, has the same effect as\n * `noopener`.\n * - [`opener`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel#attr-opener):\n * Creates an auxiliary browsing context if the hyperlink would otherwise\n * create a top-level browsing context that is not an auxiliary browsing\n * context (i.e., has \"`_blank`\" as `target` attribute value).\n * - [`prev`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel#attr-prev):\n * Indicates that the current document is a part of a series and that the\n * previous document in the series is the referenced document.\n * - [`search`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel#attr-search):\n * Gives a link to a resource that can be used to search through the current\n * document and its related pages.\n * - [`tag`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel#attr-tag):\n * Gives a tag (identified by the given address) that applies to the current\n * document.\n *\n * @webnative\n */\n @Prop() public readonly rel?: string\n\n /**\n * Where to display the linked URL, as the name for a browsing context (a\n * tab, window, or\n * [`<iframe>`](https://developer.mozilla.org/docs/Web/HTML/Element/iframe).\n * The following keywords have special meanings for where to load the URL:\n *\n * - `_blank`: usually a new tab, but users can configure browsers to open a new\n * window instead.\n * - `_parent`: the parent browsing context of the current one. If no parent,\n * behaves as `_self`.\n * - `_self`: the current browsing context.\n * - `_top`: the topmost browsing context (the \"highest\" context that's an\n * ancestor of the current one). If no ancestors, behaves as `_self`.\n *\n * @webnative\n */\n @Prop() public readonly target?: LiteralUnion<BreadcrumbTarget, string>\n\n @State() private tooltip = false\n\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n readonly #internals: ElementInternals = attachInternals.call(this)\n\n #breadcrumbItem?: HTMLAnchorElement | HTMLDivElement\n\n #ro?: ResizeObserver\n\n #span?: HTMLSpanElement\n\n @Watch('text')\n protected textChanged(): void {\n if (this.#ro) this.#ro.disconnect()\n\n if (!this.#span) return\n\n this.tooltip = isOverflowing(this.#span)\n this.#ro = new ResizeObserver(([spanEntry]) => {\n this.tooltip = isOverflowing(spanEntry.target)\n })\n this.#ro.observe(this.#span)\n }\n\n public componentWillLoad(): void {\n this.#internals.role = 'listitem'\n }\n\n public componentDidLoad(): void {\n this.textChanged()\n }\n\n public disconnectedCallback(): void {\n if (this.#ro) this.#ro.disconnect()\n }\n\n public render() {\n return (\n <div\n class=\"qds-breadcrumb-item\"\n ref={this.href === undefined ? this.#breadcrumbItemRef : undefined}\n tabIndex={this.tooltip && this.href === undefined ? 0 : undefined}\n >\n {this.href === undefined ? this.#renderText() : this.#renderAnchor()}\n {this.tooltip && (\n <qds-tooltip aria-hidden=\"true\" ref={this.#tooltipRef}>\n {this.text}\n </qds-tooltip>\n )}\n </div>\n )\n }\n\n #renderAnchor(): JSX.Element {\n return (\n <>\n <span class=\"qds-overflow\" ref={this.#spanRef}>\n <a\n class=\"qds-anchor\"\n href={this.href}\n hrefLang={this.hreflang}\n referrerPolicy={this.referrerPolicy}\n rel={this.rel}\n ref={this.href === undefined ? undefined : this.#breadcrumbItemRef}\n target={this.target}\n >\n {this.text}\n </a>\n </span>\n <span aria-hidden=\"true\" class=\"qds-divider\">\n /\n </span>\n </>\n )\n }\n\n #renderText(): JSX.Element {\n return (\n <span class=\"qds-overflow\" ref={this.#spanRef}>\n {this.text}\n </span>\n )\n }\n\n readonly #breadcrumbItemRef = (\n breadcrumbItem?: HTMLAnchorElement | HTMLDivElement,\n ): void => {\n this.#breadcrumbItem = breadcrumbItem\n }\n\n readonly #spanRef = (span?: HTMLSpanElement): void => {\n this.#span = span\n }\n\n readonly #tooltipRef = (tooltip?: HTMLQdsTooltipElement): void => {\n if (tooltip)\n // eslint-disable-next-line no-param-reassign\n tooltip.target = this.#breadcrumbItem\n }\n}\n"],"version":3}
1
+ {"file":"qds-breadcrumb-item.js","mappings":"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","names":["QdsBreadcrumbItem"],"sources":["src/components/breadcrumb-item/breadcrumb-item.css?tag=qds-breadcrumb-item&encapsulation=shadow","src/components/breadcrumb-item/breadcrumb-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: inline-block;\n}\n\n.qds-anchor {\n text-decoration: none;\n\n &:hover {\n text-decoration: underline;\n }\n}\n\n.qds-breadcrumb-item {\n align-items: center;\n display: inline-flex;\n font: var(--qds-control-standard-text);\n gap: var(--qds-control-standard-gap-siblings-related);\n height: var(--qds-control-standard-height);\n width: inherit;\n}\n\n.qds-divider {\n margin-inline: auto;\n}\n\n.qds-overflow {\n line-height: normal;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.qds-anchor,\n.qds-breadcrumb-item {\n color: var(--qds-theme-control-text-standard);\n\n &:focus-visible {\n outline: var(--qds-focus-border-width) solid var(--qds-theme-focus-border);\n outline-offset: var(--qds-focus-border-offset);\n border-radius: var(--qds-focus-border-radius);\n }\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface, JSX } from '@stencil/core'\nimport {\n Component,\n Fragment,\n h,\n Prop,\n readTask,\n State,\n Watch,\n} from '@stencil/core'\nimport type { LiteralUnion } from 'type-fest'\n\nimport { attachInternals, isOverflowing } from '../../helpers'\n\nexport type BreadcrumbTarget = '_blank' | '_parent' | '_self' | '_top'\n\n/**\n * The `<qds-breadcrumb-item>` element is used as a navigational aid that is\n * typically placed between a site's header and the main content, displaying\n * either a hierarchy of the current page in relation to the site's structure,\n * from top level to current page, or a list of the links the user followed to\n * get to the current page, in the order visited.\n *\n * @see https://quartz.se.com/build/components/breadcrumb\n */\n@Component({\n tag: 'qds-breadcrumb-item',\n styleUrl: 'breadcrumb-item.css',\n shadow: { delegatesFocus: true },\n})\nexport class QdsBreadcrumbItem implements ComponentInterface {\n /**\n * The breadcrumb item's text.\n */\n @Prop() public readonly text!: string\n\n /**\n * The URL that the inline link points to. Inline links are not restricted to\n * HTTP-based URLs — they can use any URL scheme supported by browsers:\n *\n * - Sections of a page with document fragments\n * - While web browsers may not support other URL schemes, websites can with\n * [`registerProtocolHandler()`](https://developer.mozilla.org/docs/Web/API/Navigator/registerProtocolHandler)\n *\n * @webnative\n */\n @Prop() public readonly href?: string\n\n /**\n * Hints at the human language of the linked URL. No built-in functionality.\n * Allowed values are the same as\n * [the global `lang` attribute](https://developer.mozilla.org/docs/Web/HTML/Global_attributes/lang).\n *\n * @webnative\n */\n @Prop() public readonly hreflang?: string\n\n /**\n * How much of the\n * [referrer](https://developer.mozilla.org/docs/Web/HTTP/Headers/Referer)\n * to send when following the inline link.\n *\n * - `no-referrer`: The\n * [`Referer`](https://developer.mozilla.org/docs/Web/HTTP/Headers/Referer)\n * header will not be sent.\n * - `no-referrer-when-downgrade`: The\n * [`Referer`](https://developer.mozilla.org/docs/Web/HTTP/Headers/Referer)\n * header will not be sent to\n * [origin](https://developer.mozilla.org/docs/Glossary/Origin)s\n * without [TLS](https://developer.mozilla.org/docs/Glossary/TLS)\n * ([HTTPS](https://developer.mozilla.org/docs/Glossary/HTTPS)).\n * - `origin`: The sent referrer will be limited to the origin of the\n * referring page: its\n * [scheme](https://developer.mozilla.org/docs/Learn/Common_questions/What_is_a_URL),\n * [host](https://developer.mozilla.org/docs/Glossary/Host), and\n * [port](https://developer.mozilla.org/docs/Glossary/Port).\n * - `origin-when-cross-origin`: The referrer sent to other origins will be\n * limited to the scheme, the host, and the port. Navigations on the same\n * origin will still include the path.\n * - `same-origin`: A referrer will be sent for\n * [same origin](https://developer.mozilla.org/docs/Glossary/Same-origin_policy),\n * but cross-origin requests will contain no referrer information.\n * - `strict-origin`: Only send the origin of the document as the referrer\n * when the protocol security level stays the same (HTTPS→HTTPS), but don't\n * send it to a less secure destination (HTTPS→HTTP).\n * - `strict-origin-when-cross-origin` (default): Send a full URL when\n * performing a same-origin request, only send the origin when the protocol\n * security level stays the same (HTTPS→HTTPS), and send no header to a less\n * secure destination (HTTPS→HTTP).\n * - `unsafe-url`: The referrer will include the origin and the path (but not the\n * [fragment](https://developer.mozilla.org/docs/Web/API/HTMLAnchorElement/hash),\n * [password](https://developer.mozilla.org/docs/Web/API/HTMLAnchorElement/password),\n * or [username](https://developer.mozilla.org/docs/Web/API/HTMLAnchorElement/username)).\n * **This value is unsafe** because it leaks origins and paths from\n * TLS-protected resources to insecure origins.\n *\n * @webnative\n */\n @Prop({ attribute: 'referrerpolicy' })\n public readonly referrerPolicy?: ReferrerPolicy\n\n /**\n * The relationship of the linked URL as space-separated\n * [link types](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel).\n *\n * The following list includes some of the most important existing keywords.\n * Every keyword within a space-separated value should be unique within that\n * value.\n *\n * - [`alternate`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel#attr-alternate):\n * Alternate representations of the current document.\n * - [`author`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel#attr-author):\n * Author of the current document or article.\n * - [`bookmark`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel#attr-bookmark):\n * Permalink for the nearest ancestor section.\n * - [`external`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel#attr-external):\n * The referenced document is not part of the same site as the current\n * document. An icon will be rendered next to the text if this value is\n * specified.\n * - [`help`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel#attr-help):\n * Link to context-sensitive help.\n * - [`license`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel#attr-license):\n * Indicates that the main content of the current document is covered by the\n * copyright license described by the referenced document.\n * - [`me`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel/me):\n * Indicates that the current document represents the person who owns the\n * linked content.\n * - [`next`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel#attr-next):\n * Indicates that the current document is a part of a series and that the\n * next document in the series is the referenced document.\n * - [`nofollow`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel#attr-nofollow):\n * Indicates that the current document's original author or publisher does\n * not endorse the referenced document.\n * - [`noopener`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel/noopener):\n * Creates a top-level browsing context that is not an auxiliary browsing\n * context if the hyperlink would create either of those, to begin with (i.e.,\n * has an appropriate `target` attribute value).\n * - [`noreferrer`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel#attr-noreferrer):\n * No `Referer` header will be included. Additionally, has the same effect as\n * `noopener`.\n * - [`opener`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel#attr-opener):\n * Creates an auxiliary browsing context if the hyperlink would otherwise\n * create a top-level browsing context that is not an auxiliary browsing\n * context (i.e., has \"`_blank`\" as `target` attribute value).\n * - [`prev`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel#attr-prev):\n * Indicates that the current document is a part of a series and that the\n * previous document in the series is the referenced document.\n * - [`search`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel#attr-search):\n * Gives a link to a resource that can be used to search through the current\n * document and its related pages.\n * - [`tag`](https://developer.mozilla.org/docs/Web/HTML/Attributes/rel#attr-tag):\n * Gives a tag (identified by the given address) that applies to the current\n * document.\n *\n * @webnative\n */\n @Prop() public readonly rel?: string\n\n /**\n * Where to display the linked URL, as the name for a browsing context (a\n * tab, window, or\n * [`<iframe>`](https://developer.mozilla.org/docs/Web/HTML/Element/iframe).\n * The following keywords have special meanings for where to load the URL:\n *\n * - `_blank`: usually a new tab, but users can configure browsers to open a new\n * window instead.\n * - `_parent`: the parent browsing context of the current one. If no parent,\n * behaves as `_self`.\n * - `_self`: the current browsing context.\n * - `_top`: the topmost browsing context (the \"highest\" context that's an\n * ancestor of the current one). If no ancestors, behaves as `_self`.\n *\n * @webnative\n */\n @Prop() public readonly target?: LiteralUnion<BreadcrumbTarget, string>\n\n @State() private tooltip = false\n\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n readonly #internals: ElementInternals = attachInternals.call(this)\n\n #breadcrumbItem?: HTMLAnchorElement | HTMLDivElement\n\n #ro?: ResizeObserver\n\n #span?: HTMLSpanElement\n\n @Watch('text')\n protected textChanged(): void {\n if (this.#ro) this.#ro.disconnect()\n\n if (!this.#span) return\n\n const span = this.#span\n readTask(() => {\n this.tooltip = isOverflowing(span)\n })\n this.#ro = new ResizeObserver(([spanEntry]) => {\n this.tooltip = isOverflowing(spanEntry.target)\n })\n this.#ro.observe(this.#span)\n }\n\n public componentWillLoad(): void {\n this.#internals.role = 'listitem'\n }\n\n public componentDidLoad(): void {\n this.textChanged()\n }\n\n public disconnectedCallback(): void {\n if (this.#ro) this.#ro.disconnect()\n }\n\n public render() {\n return (\n <div\n class=\"qds-breadcrumb-item\"\n ref={this.href === undefined ? this.#breadcrumbItemRef : undefined}\n tabIndex={this.tooltip && this.href === undefined ? 0 : undefined}\n >\n {this.href === undefined ? this.#renderText() : this.#renderAnchor()}\n {this.tooltip && (\n <qds-tooltip aria-hidden=\"true\" ref={this.#tooltipRef}>\n {this.text}\n </qds-tooltip>\n )}\n </div>\n )\n }\n\n #renderAnchor(): JSX.Element {\n return (\n <>\n <span class=\"qds-overflow\" ref={this.#spanRef}>\n <a\n class=\"qds-anchor\"\n href={this.href}\n hrefLang={this.hreflang}\n referrerPolicy={this.referrerPolicy}\n rel={this.rel}\n ref={this.href === undefined ? undefined : this.#breadcrumbItemRef}\n target={this.target}\n >\n {this.text}\n </a>\n </span>\n <span aria-hidden=\"true\" class=\"qds-divider\">\n /\n </span>\n </>\n )\n }\n\n #renderText(): JSX.Element {\n return (\n <span class=\"qds-overflow\" ref={this.#spanRef}>\n {this.text}\n </span>\n )\n }\n\n readonly #breadcrumbItemRef = (\n breadcrumbItem?: HTMLAnchorElement | HTMLDivElement,\n ): void => {\n this.#breadcrumbItem = breadcrumbItem\n }\n\n readonly #spanRef = (span?: HTMLSpanElement): void => {\n this.#span = span\n }\n\n readonly #tooltipRef = (tooltip?: HTMLQdsTooltipElement): void => {\n if (tooltip)\n // eslint-disable-next-line no-param-reassign\n tooltip.target = this.#breadcrumbItem\n }\n}\n"],"version":3}
@@ -3,7 +3,7 @@
3
3
  *
4
4
  * SPDX-License-Identifier: Apache-2.0
5
5
  */
6
- import { B as Button, d as defineCustomElement$1 } from './p-d6e52d0b.js';
6
+ import { B as Button, d as defineCustomElement$1 } from './p-b6c04008.js';
7
7
 
8
8
  const QdsButton = Button;
9
9
  const defineCustomElement = defineCustomElement$1;
@@ -3,7 +3,7 @@
3
3
  *
4
4
  * SPDX-License-Identifier: Apache-2.0
5
5
  */
6
- import { C as Checkbox, d as defineCustomElement$1 } from './p-2bf0797c.js';
6
+ import { C as Checkbox, d as defineCustomElement$1 } from './p-9ffb4b49.js';
7
7
 
8
8
  const QdsCheckbox = Checkbox;
9
9
  const defineCustomElement = defineCustomElement$1;