@quartzds/core 1.0.0-beta.91 → 1.0.0-beta.93

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-d6e52d0b.js → p-80d5edc6.js} +22 -14
  11. package/components/p-80d5edc6.js.map +1 -0
  12. package/components/{p-2bf0797c.js → p-8a540ec4.js} +7 -7
  13. package/components/p-8a540ec4.js.map +1 -0
  14. package/components/{p-a020ece3.js → p-b5608061.js} +10 -7
  15. package/components/p-b5608061.js.map +1 -0
  16. package/components/{p-a6310886.js → p-ba860c62.js} +10 -7
  17. package/components/p-ba860c62.js.map +1 -0
  18. package/components/{p-3c48ff53.js → p-e22dd76d.js} +2 -2
  19. package/components/{p-3c48ff53.js.map → p-e22dd76d.js.map} +1 -1
  20. package/components/{p-b4c302d4.js → p-e2a9e441.js} +3 -3
  21. package/components/{p-b4c302d4.js.map → p-e2a9e441.js.map} +1 -1
  22. package/components/{p-3baf75f4.js → p-fc31384f.js} +4 -4
  23. package/components/{p-3baf75f4.js.map → p-fc31384f.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 +51 -19
  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 +2 -2
  44. package/components/qds-nav-list-item.js +6 -6
  45. package/components/qds-progress-bar.js +2 -2
  46. package/components/qds-radio.js +7 -7
  47. package/components/qds-radio.js.map +1 -1
  48. package/components/qds-select.js +3 -3
  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 +17 -9
  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 +44 -13
  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 +1 -1
  92. package/dist/cjs/qds-nav-list-item.cjs.entry.js +4 -4
  93. package/dist/cjs/qds-progress-bar.cjs.entry.js +2 -2
  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 +2 -2
  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 +8 -5
  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 +60 -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 +17 -9
  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 +44 -13
  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 +1 -1
  144. package/dist/esm/qds-nav-list-item.entry.js +4 -4
  145. package/dist/esm/qds-progress-bar.entry.js +2 -2
  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 +2 -2
  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 +8 -5
  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 +143 -118
  169. package/hydrate/index.mjs +143 -118
  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
@@ -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-80d5edc6.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-8a540ec4.js';
7
7
 
8
8
  const QdsCheckbox = Checkbox;
9
9
  const defineCustomElement = defineCustomElement$1;
@@ -3,10 +3,10 @@
3
3
  *
4
4
  * SPDX-License-Identifier: Apache-2.0
5
5
  */
6
- import { p as proxyCustomElement, H, c as createEvent, h } 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, i as inheritAriaAttributes, c as invariant, b as isOverflowing } from './p-8abba29b.js';
8
- import { d as defineCustomElement$3 } from './p-ba880369.js';
9
- import { d as defineCustomElement$2 } from './p-c80f112a.js';
8
+ import { d as defineCustomElement$3 } from './p-72c09714.js';
9
+ import { d as defineCustomElement$2 } from './p-70d12c72.js';
10
10
 
11
11
  const chipCss = ":host([hidden]){display:none!important}:host{display:block}[aria-disabled=true]{opacity:var(--qds-theme-disabled);pointer-events:none}.qds-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.qds-label{display:flex}.qds-container{min-width:0}.qds-target{-webkit-appearance:none;appearance:none;background-color:initial;border:none;color:inherit;cursor:pointer;display:flex;outline:none;padding:0;pointer-events:auto}.qds-target:disabled{pointer-events:none}.qds-alignment{align-items:center;display:flex}.qds-cursor{cursor:pointer}.qds-icon{flex-shrink:0}.qds-closable-chip,.qds-container{align-items:center;-webkit-appearance:none;appearance:none;background-color:initial;border:var(--qds-control-border-width) solid var(--qds-theme-control-border);border-radius:var(--qds-control-rounded-border-radius);box-sizing:border-box;color:var(--qds-theme-control-text-standard);display:inline-flex;justify-content:center;padding-block:0;-webkit-user-select:none;user-select:none}.qds-closable-chip{pointer-events:none}.qds-closable-chip:focus-within{outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width);outline-offset:var(--qds-focus-border-offset)}.qds-container:hover{background-color:var(--qds-theme-interactive-background-hover)}.qds-checkbox:active~.qds-container,.qds-closable-chip:has(.qds-target:active),.qds-container.qds-pressed-state{background-color:var(--qds-theme-interactive-background-pressed)}.qds-container.qds-selected-state{background-color:var(--qds-theme-interactive-background-selected)}.qds-checkbox{clip-path:inset(50%);margin:0;position:absolute}.qds-checkbox:focus-visible~.qds-container{outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width);outline-offset:var(--qds-focus-border-offset)}.qds-closable-chip[data-size=small],.qds-container[data-size=small]{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]{--qds-experimental-icon-click-target-size:var(--qds-control-small-height);height:var(--qds-control-small-icon-size);width:var(--qds-control-small-icon-size)}.qds-text[data-size=small]{font:var(--qds-control-small-text);line-height:normal}.qds-closable-chip[data-size=standard],.qds-container[data-size=standard]{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]{--qds-experimental-icon-click-target-size:var(\n --qds-control-standard-height\n );height:var(--qds-control-standard-icon-size);width:var(--qds-control-standard-icon-size)}.qds-text[data-size=standard]{font:var(--qds-control-standard-text);line-height:normal}.qds-closable-chip[data-size=large],.qds-container[data-size=large]{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]{--qds-experimental-icon-click-target-size:var(--qds-control-large-height);height:var(--qds-control-large-icon-size);width:var(--qds-control-large-icon-size)}.qds-text[data-size=large]{font:var(--qds-control-large-text);line-height:normal}";
12
12
  const QdsChipStyle0 = chipCss;
@@ -175,7 +175,10 @@ const Chip = /*@__PURE__*/ proxyCustomElement(class Chip extends H {
175
175
  }
176
176
  componentDidLoad() {
177
177
  invariant(__classPrivateFieldGet(this, _Chip_span, "f"));
178
- this.tooltip = isOverflowing(__classPrivateFieldGet(this, _Chip_span, "f"));
178
+ const span = __classPrivateFieldGet(this, _Chip_span, "f");
179
+ readTask(() => {
180
+ this.tooltip = isOverflowing(span);
181
+ });
179
182
  __classPrivateFieldSet(this, _Chip_ro, new ResizeObserver(([spanEntry]) => {
180
183
  this.tooltip = isOverflowing(spanEntry.target);
181
184
  }), "f");
@@ -186,21 +189,21 @@ const Chip = /*@__PURE__*/ proxyCustomElement(class Chip extends H {
186
189
  __classPrivateFieldGet(this, _Chip_ro, "f").disconnect();
187
190
  }
188
191
  render() {
189
- return (h("div", { key: '7f0a1fe641b2e15f3ab3bf3f17970be852da3681', class: "qds-chip", ref: __classPrivateFieldGet(this, _Chip_chipRef, "f") }, __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedType_get) === 'closable' && (h("div", { key: 'c737c3890293d99a77422b024bd918691da1a948', "aria-disabled": __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedDisabled_get) ? 'true' : undefined, class: {
192
+ return (h("div", { key: '38e103b1adf48ce498541e48814bfc5201d1bf9d', class: "qds-chip", ref: __classPrivateFieldGet(this, _Chip_chipRef, "f") }, __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedType_get) === 'closable' && (h("div", { key: 'fde779252f3566ee87c9cf80eeccf6304dc5af0e', "aria-disabled": __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedDisabled_get) ? 'true' : undefined, class: {
190
193
  'qds-container': true,
191
194
  'qds-closable-chip': true,
192
195
  'qds-pressed-state': this.isPressed,
193
- }, "data-size": __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedSize_get) }, this.iconName !== undefined && this.iconName !== '' && (h("qds-icon", { key: '17b09b428db0f0fac2a9c81763249b4387ee97ba', "aria-hidden": "true", class: "qds-icon", "data-size": __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedSize_get), library: this.iconLibrary, name: this.iconName })), h("span", { key: '912867a4c7c1a6b239e21084e36b933dd9266129', class: "qds-text", "data-size": __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedSize_get), ref: __classPrivateFieldGet(this, _Chip_spanRef, "f") }, this.text), h("button", { key: '0dd278717916ffc8fc240e0a9eeef132b64130b1', "aria-label": __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_ariaLabel_get), class: "qds-target", "data-size": __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedSize_get), disabled: __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedDisabled_get), onClick: __classPrivateFieldGet(this, _Chip_onIconClick, "f"), tabIndex: __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedDisabled_get) ? undefined : this.tabIndex, type: "button", ...__classPrivateFieldGet(this, _Chip_inheritedAttributes, "f") }, h("qds-icon", { key: '4b36ddcd922c2c1f1f16a43cf744087ea9f6093e', "aria-hidden": "true", class: "qds-icon", "data-size": __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedSize_get), library: "core", name: "clear" })))), __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedType_get) === 'selectable' && (
196
+ }, "data-size": __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedSize_get) }, this.iconName !== undefined && this.iconName !== '' && (h("qds-icon", { key: '71e78c676f85f4cf9a4086ec58f889b923f56231', "aria-hidden": "true", class: "qds-icon", "data-size": __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedSize_get), library: this.iconLibrary, name: this.iconName })), h("span", { key: '5c63d83cbe0ebc064bbf244a67c798ae91b717da', class: "qds-text", "data-size": __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedSize_get), ref: __classPrivateFieldGet(this, _Chip_spanRef, "f") }, this.text), h("button", { key: 'c063e0d2015317f703decc3c6bc271d1e4758ecb', "aria-label": __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_ariaLabel_get), class: "qds-target", "data-size": __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedSize_get), disabled: __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedDisabled_get), onClick: __classPrivateFieldGet(this, _Chip_onIconClick, "f"), tabIndex: __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedDisabled_get) ? undefined : this.tabIndex, type: "button", ...__classPrivateFieldGet(this, _Chip_inheritedAttributes, "f") }, h("qds-icon", { key: '985982fceb4c44a74aa32bfe289e104ec6ceded2', "aria-hidden": "true", class: "qds-icon", "data-size": __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedSize_get), library: "core", name: "clear" })))), __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedType_get) === 'selectable' && (
194
197
  // eslint-disable-next-line jsx-a11y/label-has-associated-control
195
- h("label", { key: 'b673d4ef5df3661c2ba0e6d36351b60d6cba1cd0', "aria-disabled": __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedDisabled_get) ? 'true' : undefined, class: "qds-label" }, h("input", { key: '48db37e17d551552900ebf77789be503953bdd18',
198
+ h("label", { key: 'c21380e3727553860bd5d8ab743ab695e7cbf67e', "aria-disabled": __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedDisabled_get) ? 'true' : undefined, class: "qds-label" }, h("input", { key: 'f36b570313760fc17d59d3cb7c209c2d4ef6e12a',
196
199
  // eslint-disable-next-line jsx-a11y/no-autofocus
197
- autoFocus: this.host.autofocus, checked: this.checked, class: "qds-checkbox", "data-size": __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedSize_get), disabled: __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedDisabled_get), name: this.name, onBlur: __classPrivateFieldGet(this, _Chip_onBlur, "f"), onFocus: __classPrivateFieldGet(this, _Chip_onFocus, "f"), tabIndex: __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedDisabled_get) ? undefined : this.tabIndex, type: "checkbox", value: this.value ?? undefined, ...__classPrivateFieldGet(this, _Chip_inheritedAttributes, "f") }), h("div", { key: '87055dd30ca05fdde38070fbfc32551271bf8dcd', class: {
200
+ autoFocus: this.host.autofocus, checked: this.checked, class: "qds-checkbox", "data-size": __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedSize_get), disabled: __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedDisabled_get), name: this.name, onBlur: __classPrivateFieldGet(this, _Chip_onBlur, "f"), onFocus: __classPrivateFieldGet(this, _Chip_onFocus, "f"), tabIndex: __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedDisabled_get) ? undefined : this.tabIndex, type: "checkbox", value: this.value ?? undefined, ...__classPrivateFieldGet(this, _Chip_inheritedAttributes, "f") }), h("div", { key: '2c9fb79145632cfc9c6762a1eb938db6d358d6cc', class: {
198
201
  'qds-container': true,
199
202
  'qds-pressed-state': this.isPressed,
200
203
  'qds-selected-state': this.isSelected,
201
204
  'qds-padding-end': true,
202
205
  'qds-cursor': true,
203
- }, "data-size": __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedSize_get) }, (this.checked ?? false) && (h("qds-icon", { key: '9a27f7770c99ce8a54efddad2efe7689abae1b7f', "aria-hidden": "true", class: "qds-icon", "data-size": __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedSize_get), library: "core", name: "checked" })), this.iconName !== undefined && this.iconName !== '' && (h("qds-icon", { key: 'bd162591cba44ac9c28fdace2a39bd9904d0dece', "aria-hidden": "true", class: "qds-icon", "data-size": __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedSize_get), library: this.iconLibrary, name: this.iconName })), h("span", { key: '3df4aaddfd4316f69582818c9ffc163102c8f383', class: "qds-text", "data-size": __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedSize_get), ref: __classPrivateFieldGet(this, _Chip_spanRef, "f") }, this.text)))), this.tooltip && (h("qds-tooltip", { key: '4f19548c13dfb07a5d1e31cfcc453dbefe6efd6d', "aria-hidden": "true", ref: __classPrivateFieldGet(this, _Chip_tooltipRef, "f"), trigger: "pointerenter focusin" }, this.text))));
206
+ }, "data-size": __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedSize_get) }, (this.checked ?? false) && (h("qds-icon", { key: 'b111666a5f461a43c2eacaae8e08e52b62312887', "aria-hidden": "true", class: "qds-icon", "data-size": __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedSize_get), library: "core", name: "checked" })), this.iconName !== undefined && this.iconName !== '' && (h("qds-icon", { key: '104f950ab2b3ccb434eeb5c0db135f547f7eb795', "aria-hidden": "true", class: "qds-icon", "data-size": __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedSize_get), library: this.iconLibrary, name: this.iconName })), h("span", { key: '05977f456c30b7aa7c947345502c53ccdc06a412', class: "qds-text", "data-size": __classPrivateFieldGet(this, _Chip_instances, "a", _Chip_computedSize_get), ref: __classPrivateFieldGet(this, _Chip_spanRef, "f") }, this.text)))), this.tooltip && (h("qds-tooltip", { key: '7c4a28ce08c9244a854ce1d26c2c00c402c6713b', "aria-hidden": "true", ref: __classPrivateFieldGet(this, _Chip_tooltipRef, "f"), trigger: "pointerenter focusin" }, this.text))));
204
207
  }
205
208
  static get delegatesFocus() { return true; }
206
209
  static get formAssociated() { return true; }
@@ -1 +1 @@
1
- {"file":"qds-chip.js","mappings":"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","names":[],"sources":["src/components/chip/chip.css?tag=qds-chip&encapsulation=shadow","src/components/chip/chip.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[aria-disabled='true'] {\n opacity: var(--qds-theme-disabled);\n pointer-events: none;\n}\n\n.qds-text {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.qds-label {\n display: flex;\n}\n\n.qds-container {\n /* Avoid automatic minimum size on flex element: https://www.w3.org/TR/css-flexbox-1/#min-size-auto */\n min-width: 0;\n}\n\n.qds-target {\n appearance: none;\n display: flex;\n border: none;\n padding: 0;\n background-color: transparent;\n color: inherit;\n cursor: pointer;\n pointer-events: auto;\n outline: none;\n\n &:disabled {\n pointer-events: none;\n }\n}\n\n.qds-alignment {\n display: flex;\n align-items: center;\n}\n\n.qds-cursor {\n cursor: pointer;\n}\n\n.qds-icon {\n flex-shrink: 0;\n}\n\n.qds-closable-chip,\n.qds-container {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n padding-block: 0;\n user-select: none;\n border: var(--qds-control-border-width) solid var(--qds-theme-control-border);\n border-radius: var(--qds-control-rounded-border-radius);\n color: var(--qds-theme-control-text-standard);\n background-color: initial;\n appearance: none;\n box-sizing: border-box;\n}\n\n.qds-closable-chip {\n pointer-events: none;\n\n &:focus-within {\n outline: var(--qds-theme-focus-border) solid var(--qds-focus-border-width);\n outline-offset: var(--qds-focus-border-offset);\n }\n}\n\n.qds-container:hover {\n background-color: var(--qds-theme-interactive-background-hover);\n}\n\n.qds-checkbox:active ~ .qds-container,\n.qds-closable-chip:has(.qds-target:active),\n.qds-container.qds-pressed-state {\n background-color: var(--qds-theme-interactive-background-pressed);\n}\n\n.qds-container.qds-selected-state {\n background-color: var(--qds-theme-interactive-background-selected);\n}\n\n.qds-checkbox {\n clip-path: inset(50%);\n margin: 0;\n position: absolute;\n\n &:focus-visible ~ .qds-container {\n outline: var(--qds-theme-focus-border) solid var(--qds-focus-border-width);\n outline-offset: var(--qds-focus-border-offset);\n }\n}\n\n[data-size='small'] {\n &.qds-closable-chip,\n &.qds-container {\n height: var(--qds-control-small-height);\n padding-inline: var(--qds-control-chip-small-padding-horizontal);\n gap: var(--qds-control-small-gap-internal);\n }\n\n &.qds-icon {\n --qds-experimental-icon-click-target-size: var(--qds-control-small-height);\n\n height: var(--qds-control-small-icon-size);\n width: var(--qds-control-small-icon-size);\n }\n\n &.qds-text {\n font: var(--qds-control-small-text);\n line-height: normal;\n }\n}\n\n[data-size='standard'] {\n &.qds-closable-chip,\n &.qds-container {\n height: var(--qds-control-standard-height);\n padding-inline: var(--qds-control-chip-standard-padding-horizontal);\n gap: var(--qds-control-standard-gap-internal);\n }\n\n &.qds-icon {\n --qds-experimental-icon-click-target-size: var(\n --qds-control-standard-height\n );\n\n height: var(--qds-control-standard-icon-size);\n width: var(--qds-control-standard-icon-size);\n }\n\n &.qds-text {\n font: var(--qds-control-standard-text);\n line-height: normal;\n }\n}\n\n[data-size='large'] {\n &.qds-closable-chip,\n &.qds-container {\n height: var(--qds-control-large-height);\n padding-inline: var(--qds-control-chip-large-padding-horizontal);\n gap: var(--qds-control-large-gap-internal);\n }\n\n &.qds-icon {\n --qds-experimental-icon-click-target-size: var(--qds-control-large-height);\n\n height: var(--qds-control-large-icon-size);\n width: var(--qds-control-large-icon-size);\n }\n\n &.qds-text {\n font: var(--qds-control-large-text);\n line-height: normal;\n }\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface, EventEmitter } from '@stencil/core'\nimport {\n AttachInternals,\n Component,\n Element,\n Event,\n h,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core'\n\nimport type { Attributes, QdsFocusEventDetail } from '../../helpers'\nimport {\n inheritAriaAttributes,\n invariant,\n isOverflowing,\n pickFocusEventAttributes,\n} from '../../helpers'\nimport type { Value } from '../controls'\nimport type { Size } from '../shared'\n\nexport type ChipType = 'closable' | 'selectable'\n\n/**\n * `<qds-chip>` elements are interactive elements that represent selections.\n * Chips allow users to make a selection from a list of options or display\n * items like filters or tags.\n *\n * @see https://quartz.se.com/build/components/chip\n */\n@Component({\n tag: 'qds-chip',\n formAssociated: true,\n shadow: { delegatesFocus: true },\n styleUrl: 'chip.css',\n})\nexport class Chip 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 chip's size.\n */\n @Prop() public readonly size?: Size = 'standard'\n\n /**\n * The chip's type.\n */\n @Prop() public readonly type?: ChipType = 'selectable'\n\n /**\n * The chip's text.\n */\n @Prop() public readonly text?: string\n\n /**\n * Sets the selectable chip's state.\n *\n * @webnative\n */\n @Prop({ mutable: true }) public checked?: boolean\n\n /**\n * The [`<form>`](https://developer.mozilla.org/docs/Web/HTML/Element/form)\n * element to associate the chip with (its form owner).\n *\n * The value of this property must be the id of a `<form>` in the same\n * document. If this property is not set, the `<qds-chip>` is associated\n * with its ancestor `<form>` element, if any.\n *\n * This property lets you associate `<qds-chip>` elements to `<form>`s\n * anywhere in the document, not just inside a `<form>`. It can also override\n *an ancestor `<form>` element.\n *\n * @webnative\n */\n // eslint-disable-next-line unicorn/no-null\n @Prop() public readonly form: ElementInternals['form'] | string = null\n\n /**\n * Prevents the chip from being interacted with: it cannot be pressed or\n * focused.\n *\n */\n @Prop() public readonly disabled?: boolean\n\n /**\n * The name of the chip, which is submitted with the form data.\n *\n * @webnative\n */\n @Prop() public readonly name?: string\n\n /**\n * The value of the chip, submitted as a name/value pair with form data.\n *\n * @webnative\n */\n @Prop() public readonly value?: Value = 'on'\n\n /**\n * Emitted when the chip loses focus.\n */\n @Event({ eventName: 'qdsBlur', bubbles: false, cancelable: false })\n private readonly blurEmitter!: EventEmitter<QdsFocusEventDetail>\n\n /**\n * Emitted when the chip gains focus.\n */\n @Event({ eventName: 'qdsFocus', bubbles: false, cancelable: false })\n private readonly focusEmitter!: EventEmitter<QdsFocusEventDetail>\n\n /**\n * Emitted when the chip is closed.\n */\n @Event({ eventName: 'qdsClose', cancelable: false })\n private readonly closeEmitter!: EventEmitter<void>\n\n /**\n * Emitted when a change to the selectable chip's state is committed by the user.\n */\n @Event({ eventName: 'qdsChange', cancelable: false })\n private readonly changeEmitter!: EventEmitter<void>\n\n @Element() private readonly host!: HTMLElement\n\n @AttachInternals() private readonly internals!: ElementInternals\n\n @State() private isPressed = false\n\n @State() private isSelected = false\n\n @State() private tabIndex?: number\n\n @State() private tooltip = false\n\n #chip?: HTMLDivElement\n\n #span?: HTMLSpanElement\n\n #ro?: ResizeObserver\n\n #inheritedAttributes: Attributes = {}\n\n get #ariaLabel(): string {\n return `Delete ${this.text} selection`\n }\n\n get #computedDisabled(): boolean {\n return this.disabled ?? false\n }\n\n get #computedSize(): Size {\n switch (this.size) {\n case 'standard':\n case 'small':\n case 'large': {\n return this.size\n }\n default: {\n return 'standard'\n }\n }\n }\n\n get #computedType(): ChipType {\n switch (this.type) {\n case 'selectable':\n case 'closable': {\n return this.type\n }\n default: {\n return 'selectable'\n }\n }\n }\n\n get #computedChecked(): boolean {\n return this.checked ?? false\n }\n\n get #computedValue(): string | null {\n // eslint-disable-next-line unicorn/no-null\n return this.value == null ? null : this.value.toString()\n }\n\n @Listen('click')\n protected onClick(event: MouseEvent): void {\n if (this.#computedDisabled) {\n event.stopImmediatePropagation()\n return\n }\n\n event.preventDefault()\n\n if (this.#computedType === 'selectable') {\n this.checked = !this.#computedChecked\n this.changeEmitter.emit()\n }\n }\n\n @Listen('keydown')\n protected handleKeyDown(event: KeyboardEvent): void {\n if (this.#computedDisabled) {\n event.stopImmediatePropagation()\n return\n }\n\n if (event.key === ' ') {\n this.isPressed = true\n event.preventDefault()\n } else if (event.key === 'Enter' && this.internals.form) {\n this.internals.form.requestSubmit()\n event.preventDefault()\n }\n }\n\n @Listen('keyup')\n protected handleKeyUp(event: KeyboardEvent): void {\n if (event.key !== ' ') return\n\n this.isPressed = false\n if (this.#computedType === 'closable') this.closeEmitter.emit()\n else {\n this.checked = !this.#computedChecked\n this.changeEmitter.emit()\n }\n }\n\n @Watch('checked')\n protected checkedChanged(): void {\n this.isSelected = this.#computedChecked\n this.internals.setFormValue(\n this.#computedChecked && !this.#computedDisabled\n ? this.#computedValue\n : // eslint-disable-next-line unicorn/no-null\n null,\n )\n }\n\n @Watch('disabled')\n protected disabledChanged(): void {\n if (this.#computedChecked && !this.#computedDisabled)\n this.internals.setFormValue(this.#computedValue)\n // eslint-disable-next-line unicorn/no-null\n else this.internals.setFormValue(null)\n }\n\n @Watch('tabindex')\n protected tabindexChanged(newValue: string): void {\n const parsedValue = Number.parseInt(newValue, 10)\n this.tabIndex =\n parsedValue === 0 || Number.isNaN(parsedValue) ? undefined : parsedValue\n }\n\n @Watch('value')\n protected valueChanged(): void {\n if (this.#computedChecked && !this.#computedDisabled)\n this.internals.setFormValue(this.#computedValue)\n }\n\n public componentWillLoad(): void {\n this.valueChanged()\n\n Object.defineProperty(this.host, 'form', {\n enumerable: true,\n get: () => this.internals.form,\n })\n\n this.#inheritedAttributes = inheritAriaAttributes(this.host)\n this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0')\n }\n\n public componentDidLoad(): void {\n invariant(this.#span)\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 disconnectedCallback(): void {\n if (this.#ro) this.#ro.disconnect()\n }\n\n public render() {\n return (\n <div class=\"qds-chip\" ref={this.#chipRef}>\n {this.#computedType === 'closable' && (\n <div\n aria-disabled={this.#computedDisabled ? 'true' : undefined}\n class={{\n 'qds-container': true,\n 'qds-closable-chip': true,\n 'qds-pressed-state': this.isPressed,\n }}\n data-size={this.#computedSize}\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 <span\n class=\"qds-text\"\n data-size={this.#computedSize}\n ref={this.#spanRef}\n >\n {this.text}\n </span>\n <button\n aria-label={this.#ariaLabel}\n class=\"qds-target\"\n data-size={this.#computedSize}\n disabled={this.#computedDisabled}\n onClick={this.#onIconClick}\n tabIndex={this.#computedDisabled ? undefined : this.tabIndex}\n type=\"button\"\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...this.#inheritedAttributes}\n >\n <qds-icon\n aria-hidden=\"true\"\n class=\"qds-icon\"\n data-size={this.#computedSize}\n library=\"core\"\n name=\"clear\"\n />\n </button>\n </div>\n )}\n {this.#computedType === 'selectable' && (\n // eslint-disable-next-line jsx-a11y/label-has-associated-control\n <label\n aria-disabled={this.#computedDisabled ? 'true' : undefined}\n class=\"qds-label\"\n >\n <input\n // eslint-disable-next-line jsx-a11y/no-autofocus\n autoFocus={this.host.autofocus}\n checked={this.checked}\n class=\"qds-checkbox\"\n data-size={this.#computedSize}\n disabled={this.#computedDisabled}\n name={this.name}\n onBlur={this.#onBlur}\n onFocus={this.#onFocus}\n tabIndex={this.#computedDisabled ? undefined : this.tabIndex}\n type=\"checkbox\"\n value={this.value ?? undefined}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...this.#inheritedAttributes}\n />\n <div\n class={{\n 'qds-container': true,\n 'qds-pressed-state': this.isPressed,\n 'qds-selected-state': this.isSelected,\n 'qds-padding-end': true,\n 'qds-cursor': true,\n }}\n data-size={this.#computedSize}\n >\n {(this.checked ?? false) && (\n <qds-icon\n aria-hidden=\"true\"\n class=\"qds-icon\"\n data-size={this.#computedSize}\n library=\"core\"\n name=\"checked\"\n />\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\n <span\n class=\"qds-text\"\n data-size={this.#computedSize}\n ref={this.#spanRef}\n >\n {this.text}\n </span>\n </div>\n </label>\n )}\n {this.tooltip && (\n <qds-tooltip\n aria-hidden=\"true\"\n ref={this.#tooltipRef}\n trigger=\"pointerenter focusin\"\n >\n {this.text}\n </qds-tooltip>\n )}\n </div>\n )\n }\n\n readonly #onIconClick = (event: MouseEvent): void => {\n if (!event.defaultPrevented && this.#computedType === 'closable')\n this.closeEmitter.emit()\n }\n\n readonly #onFocus = (event: FocusEvent): void => {\n this.focusEmitter.emit(pickFocusEventAttributes(event))\n }\n\n readonly #onBlur = (event: FocusEvent): void => {\n this.blurEmitter.emit(pickFocusEventAttributes(event))\n }\n\n readonly #chipRef = (chip?: HTMLDivElement): void => {\n this.#chip = chip\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.#chip\n }\n}\n"],"version":3}
1
+ {"file":"qds-chip.js","mappings":"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","names":[],"sources":["src/components/chip/chip.css?tag=qds-chip&encapsulation=shadow","src/components/chip/chip.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[aria-disabled='true'] {\n opacity: var(--qds-theme-disabled);\n pointer-events: none;\n}\n\n.qds-text {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.qds-label {\n display: flex;\n}\n\n.qds-container {\n /* Avoid automatic minimum size on flex element: https://www.w3.org/TR/css-flexbox-1/#min-size-auto */\n min-width: 0;\n}\n\n.qds-target {\n appearance: none;\n display: flex;\n border: none;\n padding: 0;\n background-color: transparent;\n color: inherit;\n cursor: pointer;\n pointer-events: auto;\n outline: none;\n\n &:disabled {\n pointer-events: none;\n }\n}\n\n.qds-alignment {\n display: flex;\n align-items: center;\n}\n\n.qds-cursor {\n cursor: pointer;\n}\n\n.qds-icon {\n flex-shrink: 0;\n}\n\n.qds-closable-chip,\n.qds-container {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n padding-block: 0;\n user-select: none;\n border: var(--qds-control-border-width) solid var(--qds-theme-control-border);\n border-radius: var(--qds-control-rounded-border-radius);\n color: var(--qds-theme-control-text-standard);\n background-color: initial;\n appearance: none;\n box-sizing: border-box;\n}\n\n.qds-closable-chip {\n pointer-events: none;\n\n &:focus-within {\n outline: var(--qds-theme-focus-border) solid var(--qds-focus-border-width);\n outline-offset: var(--qds-focus-border-offset);\n }\n}\n\n.qds-container:hover {\n background-color: var(--qds-theme-interactive-background-hover);\n}\n\n.qds-checkbox:active ~ .qds-container,\n.qds-closable-chip:has(.qds-target:active),\n.qds-container.qds-pressed-state {\n background-color: var(--qds-theme-interactive-background-pressed);\n}\n\n.qds-container.qds-selected-state {\n background-color: var(--qds-theme-interactive-background-selected);\n}\n\n.qds-checkbox {\n clip-path: inset(50%);\n margin: 0;\n position: absolute;\n\n &:focus-visible ~ .qds-container {\n outline: var(--qds-theme-focus-border) solid var(--qds-focus-border-width);\n outline-offset: var(--qds-focus-border-offset);\n }\n}\n\n[data-size='small'] {\n &.qds-closable-chip,\n &.qds-container {\n height: var(--qds-control-small-height);\n padding-inline: var(--qds-control-chip-small-padding-horizontal);\n gap: var(--qds-control-small-gap-internal);\n }\n\n &.qds-icon {\n --qds-experimental-icon-click-target-size: var(--qds-control-small-height);\n\n height: var(--qds-control-small-icon-size);\n width: var(--qds-control-small-icon-size);\n }\n\n &.qds-text {\n font: var(--qds-control-small-text);\n line-height: normal;\n }\n}\n\n[data-size='standard'] {\n &.qds-closable-chip,\n &.qds-container {\n height: var(--qds-control-standard-height);\n padding-inline: var(--qds-control-chip-standard-padding-horizontal);\n gap: var(--qds-control-standard-gap-internal);\n }\n\n &.qds-icon {\n --qds-experimental-icon-click-target-size: var(\n --qds-control-standard-height\n );\n\n height: var(--qds-control-standard-icon-size);\n width: var(--qds-control-standard-icon-size);\n }\n\n &.qds-text {\n font: var(--qds-control-standard-text);\n line-height: normal;\n }\n}\n\n[data-size='large'] {\n &.qds-closable-chip,\n &.qds-container {\n height: var(--qds-control-large-height);\n padding-inline: var(--qds-control-chip-large-padding-horizontal);\n gap: var(--qds-control-large-gap-internal);\n }\n\n &.qds-icon {\n --qds-experimental-icon-click-target-size: var(--qds-control-large-height);\n\n height: var(--qds-control-large-icon-size);\n width: var(--qds-control-large-icon-size);\n }\n\n &.qds-text {\n font: var(--qds-control-large-text);\n line-height: normal;\n }\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface, EventEmitter } from '@stencil/core'\nimport {\n AttachInternals,\n Component,\n Element,\n Event,\n h,\n Listen,\n Prop,\n readTask,\n State,\n Watch,\n} from '@stencil/core'\n\nimport type { Attributes, QdsFocusEventDetail } from '../../helpers'\nimport {\n inheritAriaAttributes,\n invariant,\n isOverflowing,\n pickFocusEventAttributes,\n} from '../../helpers'\nimport type { Value } from '../controls'\nimport type { Size } from '../shared'\n\nexport type ChipType = 'closable' | 'selectable'\n\n/**\n * `<qds-chip>` elements are interactive elements that represent selections.\n * Chips allow users to make a selection from a list of options or display\n * items like filters or tags.\n *\n * @see https://quartz.se.com/build/components/chip\n */\n@Component({\n tag: 'qds-chip',\n formAssociated: true,\n shadow: { delegatesFocus: true },\n styleUrl: 'chip.css',\n})\nexport class Chip 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 chip's size.\n */\n @Prop() public readonly size?: Size = 'standard'\n\n /**\n * The chip's type.\n */\n @Prop() public readonly type?: ChipType = 'selectable'\n\n /**\n * The chip's text.\n */\n @Prop() public readonly text?: string\n\n /**\n * Sets the selectable chip's state.\n *\n * @webnative\n */\n @Prop({ mutable: true }) public checked?: boolean\n\n /**\n * The [`<form>`](https://developer.mozilla.org/docs/Web/HTML/Element/form)\n * element to associate the chip with (its form owner).\n *\n * The value of this property must be the id of a `<form>` in the same\n * document. If this property is not set, the `<qds-chip>` is associated\n * with its ancestor `<form>` element, if any.\n *\n * This property lets you associate `<qds-chip>` elements to `<form>`s\n * anywhere in the document, not just inside a `<form>`. It can also override\n *an ancestor `<form>` element.\n *\n * @webnative\n */\n // eslint-disable-next-line unicorn/no-null\n @Prop() public readonly form: ElementInternals['form'] | string = null\n\n /**\n * Prevents the chip from being interacted with: it cannot be pressed or\n * focused.\n *\n */\n @Prop() public readonly disabled?: boolean\n\n /**\n * The name of the chip, which is submitted with the form data.\n *\n * @webnative\n */\n @Prop() public readonly name?: string\n\n /**\n * The value of the chip, submitted as a name/value pair with form data.\n *\n * @webnative\n */\n @Prop() public readonly value?: Value = 'on'\n\n /**\n * Emitted when the chip loses focus.\n */\n @Event({ eventName: 'qdsBlur', bubbles: false, cancelable: false })\n private readonly blurEmitter!: EventEmitter<QdsFocusEventDetail>\n\n /**\n * Emitted when the chip gains focus.\n */\n @Event({ eventName: 'qdsFocus', bubbles: false, cancelable: false })\n private readonly focusEmitter!: EventEmitter<QdsFocusEventDetail>\n\n /**\n * Emitted when the chip is closed.\n */\n @Event({ eventName: 'qdsClose', cancelable: false })\n private readonly closeEmitter!: EventEmitter<void>\n\n /**\n * Emitted when a change to the selectable chip's state is committed by the user.\n */\n @Event({ eventName: 'qdsChange', cancelable: false })\n private readonly changeEmitter!: EventEmitter<void>\n\n @Element() private readonly host!: HTMLElement\n\n @AttachInternals() private readonly internals!: ElementInternals\n\n @State() private isPressed = false\n\n @State() private isSelected = false\n\n @State() private tabIndex?: number\n\n @State() private tooltip = false\n\n #chip?: HTMLDivElement\n\n #span?: HTMLSpanElement\n\n #ro?: ResizeObserver\n\n #inheritedAttributes: Attributes = {}\n\n get #ariaLabel(): string {\n return `Delete ${this.text} selection`\n }\n\n get #computedDisabled(): boolean {\n return this.disabled ?? false\n }\n\n get #computedSize(): Size {\n switch (this.size) {\n case 'standard':\n case 'small':\n case 'large': {\n return this.size\n }\n default: {\n return 'standard'\n }\n }\n }\n\n get #computedType(): ChipType {\n switch (this.type) {\n case 'selectable':\n case 'closable': {\n return this.type\n }\n default: {\n return 'selectable'\n }\n }\n }\n\n get #computedChecked(): boolean {\n return this.checked ?? false\n }\n\n get #computedValue(): string | null {\n // eslint-disable-next-line unicorn/no-null\n return this.value == null ? null : this.value.toString()\n }\n\n @Listen('click')\n protected onClick(event: MouseEvent): void {\n if (this.#computedDisabled) {\n event.stopImmediatePropagation()\n return\n }\n\n event.preventDefault()\n\n if (this.#computedType === 'selectable') {\n this.checked = !this.#computedChecked\n this.changeEmitter.emit()\n }\n }\n\n @Listen('keydown')\n protected handleKeyDown(event: KeyboardEvent): void {\n if (this.#computedDisabled) {\n event.stopImmediatePropagation()\n return\n }\n\n if (event.key === ' ') {\n this.isPressed = true\n event.preventDefault()\n } else if (event.key === 'Enter' && this.internals.form) {\n this.internals.form.requestSubmit()\n event.preventDefault()\n }\n }\n\n @Listen('keyup')\n protected handleKeyUp(event: KeyboardEvent): void {\n if (event.key !== ' ') return\n\n this.isPressed = false\n if (this.#computedType === 'closable') this.closeEmitter.emit()\n else {\n this.checked = !this.#computedChecked\n this.changeEmitter.emit()\n }\n }\n\n @Watch('checked')\n protected checkedChanged(): void {\n this.isSelected = this.#computedChecked\n this.internals.setFormValue(\n this.#computedChecked && !this.#computedDisabled\n ? this.#computedValue\n : // eslint-disable-next-line unicorn/no-null\n null,\n )\n }\n\n @Watch('disabled')\n protected disabledChanged(): void {\n if (this.#computedChecked && !this.#computedDisabled)\n this.internals.setFormValue(this.#computedValue)\n // eslint-disable-next-line unicorn/no-null\n else this.internals.setFormValue(null)\n }\n\n @Watch('tabindex')\n protected tabindexChanged(newValue: string): void {\n const parsedValue = Number.parseInt(newValue, 10)\n this.tabIndex =\n parsedValue === 0 || Number.isNaN(parsedValue) ? undefined : parsedValue\n }\n\n @Watch('value')\n protected valueChanged(): void {\n if (this.#computedChecked && !this.#computedDisabled)\n this.internals.setFormValue(this.#computedValue)\n }\n\n public componentWillLoad(): void {\n this.valueChanged()\n\n Object.defineProperty(this.host, 'form', {\n enumerable: true,\n get: () => this.internals.form,\n })\n\n this.#inheritedAttributes = inheritAriaAttributes(this.host)\n this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0')\n }\n\n public componentDidLoad(): void {\n invariant(this.#span)\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 disconnectedCallback(): void {\n if (this.#ro) this.#ro.disconnect()\n }\n\n public render() {\n return (\n <div class=\"qds-chip\" ref={this.#chipRef}>\n {this.#computedType === 'closable' && (\n <div\n aria-disabled={this.#computedDisabled ? 'true' : undefined}\n class={{\n 'qds-container': true,\n 'qds-closable-chip': true,\n 'qds-pressed-state': this.isPressed,\n }}\n data-size={this.#computedSize}\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 <span\n class=\"qds-text\"\n data-size={this.#computedSize}\n ref={this.#spanRef}\n >\n {this.text}\n </span>\n <button\n aria-label={this.#ariaLabel}\n class=\"qds-target\"\n data-size={this.#computedSize}\n disabled={this.#computedDisabled}\n onClick={this.#onIconClick}\n tabIndex={this.#computedDisabled ? undefined : this.tabIndex}\n type=\"button\"\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...this.#inheritedAttributes}\n >\n <qds-icon\n aria-hidden=\"true\"\n class=\"qds-icon\"\n data-size={this.#computedSize}\n library=\"core\"\n name=\"clear\"\n />\n </button>\n </div>\n )}\n {this.#computedType === 'selectable' && (\n // eslint-disable-next-line jsx-a11y/label-has-associated-control\n <label\n aria-disabled={this.#computedDisabled ? 'true' : undefined}\n class=\"qds-label\"\n >\n <input\n // eslint-disable-next-line jsx-a11y/no-autofocus\n autoFocus={this.host.autofocus}\n checked={this.checked}\n class=\"qds-checkbox\"\n data-size={this.#computedSize}\n disabled={this.#computedDisabled}\n name={this.name}\n onBlur={this.#onBlur}\n onFocus={this.#onFocus}\n tabIndex={this.#computedDisabled ? undefined : this.tabIndex}\n type=\"checkbox\"\n value={this.value ?? undefined}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...this.#inheritedAttributes}\n />\n <div\n class={{\n 'qds-container': true,\n 'qds-pressed-state': this.isPressed,\n 'qds-selected-state': this.isSelected,\n 'qds-padding-end': true,\n 'qds-cursor': true,\n }}\n data-size={this.#computedSize}\n >\n {(this.checked ?? false) && (\n <qds-icon\n aria-hidden=\"true\"\n class=\"qds-icon\"\n data-size={this.#computedSize}\n library=\"core\"\n name=\"checked\"\n />\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\n <span\n class=\"qds-text\"\n data-size={this.#computedSize}\n ref={this.#spanRef}\n >\n {this.text}\n </span>\n </div>\n </label>\n )}\n {this.tooltip && (\n <qds-tooltip\n aria-hidden=\"true\"\n ref={this.#tooltipRef}\n trigger=\"pointerenter focusin\"\n >\n {this.text}\n </qds-tooltip>\n )}\n </div>\n )\n }\n\n readonly #onIconClick = (event: MouseEvent): void => {\n if (!event.defaultPrevented && this.#computedType === 'closable')\n this.closeEmitter.emit()\n }\n\n readonly #onFocus = (event: FocusEvent): void => {\n this.focusEmitter.emit(pickFocusEventAttributes(event))\n }\n\n readonly #onBlur = (event: FocusEvent): void => {\n this.blurEmitter.emit(pickFocusEventAttributes(event))\n }\n\n readonly #chipRef = (chip?: HTMLDivElement): void => {\n this.#chip = chip\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.#chip\n }\n}\n"],"version":3}
@@ -3,10 +3,10 @@
3
3
  *
4
4
  * SPDX-License-Identifier: Apache-2.0
5
5
  */
6
- import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-2806fee1.js';
6
+ import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-50f85f75.js';
7
7
  import { c as invariant, i as inheritAriaAttributes } from './p-8abba29b.js';
8
8
 
9
- const dialogCss = ":host([hidden]){display:none!important}:host{display:none;height:-moz-fit-content;height:fit-content;inset:0;position:fixed;width:-moz-fit-content;width:fit-content}:host([open]){display:block}.qds-dialog{background-color:var(--qds-theme-popup-background);border:none;border-radius:var(--qds-popup-border-radius);box-shadow:var(--qds-theme-popup-elevation);height:inherit;padding:0;width:inherit}.qds-dialog::backdrop{background:initial}.qds-dialog[open]~.qds-backdrop{-webkit-backdrop-filter:blur(var(--qds-theme-popup-overlay-blur));backdrop-filter:blur(var(--qds-theme-popup-overlay-blur));background-color:var(--qds-theme-popup-overlay-background);inset:0;opacity:var(--qds-theme-popup-overlay-opacity);position:fixed}.qds-content{align-items:flex-start;display:flex;flex-direction:column;gap:var(--qds-popup-gap-children-related);height:calc(100% - var(--qds-popup-padding)*2);padding:var(--qds-popup-padding)}::slotted(blockquote),::slotted(button),::slotted(dd),::slotted(dl),::slotted(fieldset),::slotted(figure),::slotted(h1),::slotted(h2),::slotted(h3),::slotted(h4),::slotted(h5),::slotted(h6),::slotted(hr),::slotted(input),::slotted(menu),::slotted(ol),::slotted(p),::slotted(pre),::slotted(select),::slotted(textarea),::slotted(ul){margin:0}";
9
+ const dialogCss = ":host([hidden]){display:none!important}:host{display:none;height:-moz-fit-content;height:fit-content;inset:0;position:fixed;width:-moz-fit-content;width:fit-content}:host([open]){display:block}.qds-dialog{background-color:var(--qds-theme-popup-background);border:var(--qds-popup-border-width) solid var(--qds-theme-popup-border);border-radius:var(--qds-popup-border-radius);box-shadow:var(--qds-theme-popup-elevation);height:inherit;padding:0;width:inherit}.qds-dialog::backdrop{background:initial}.qds-dialog[open]~.qds-backdrop{-webkit-backdrop-filter:blur(var(--qds-theme-popup-overlay-blur));backdrop-filter:blur(var(--qds-theme-popup-overlay-blur));background-color:var(--qds-theme-popup-overlay-background);inset:0;opacity:var(--qds-theme-popup-overlay-opacity);position:fixed}.qds-content{align-items:flex-start;display:flex;flex-direction:column;gap:var(--qds-popup-gap-children-related);height:calc(100% - var(--qds-popup-padding)*2);padding:var(--qds-popup-padding)}::slotted(blockquote),::slotted(button),::slotted(dd),::slotted(dl),::slotted(fieldset),::slotted(figure),::slotted(h1),::slotted(h2),::slotted(h3),::slotted(h4),::slotted(h5),::slotted(h6),::slotted(hr),::slotted(input),::slotted(menu),::slotted(ol),::slotted(p),::slotted(pre),::slotted(select),::slotted(textarea),::slotted(ul){margin:0}";
10
10
  const QdsDialogStyle0 = dialogCss;
11
11
 
12
12
  // SPDX-FileCopyrightText: © 2024 Schneider Electric
@@ -82,7 +82,7 @@ const Dialog = /*@__PURE__*/ proxyCustomElement(class Dialog extends H {
82
82
  this.show();
83
83
  }
84
84
  render() {
85
- return (h(Host, { key: '29346ced1f939c79bd29ceda3567ef44a6e7fbae' }, h("dialog", { key: '694af8b162d1a54331b2fd252ea5c64db0444cfe', class: "qds-dialog", ref: __classPrivateFieldGet(this, _Dialog_ref, "f"), onCancel: __classPrivateFieldGet(this, _Dialog_onCancel, "f"), onClose: __classPrivateFieldGet(this, _Dialog_onClose, "f"), onSubmit: __classPrivateFieldGet(this, _Dialog_onSubmit, "f"), ...__classPrivateFieldGet(this, _Dialog_inheritedAttributes, "f") }, h("div", { key: '673df9f7738f0b4268fabc8cfd933d4fb425b062', class: "qds-content" }, h("slot", { key: '210ec0fd8c8951cd71f72c5f7f947a49e71900de' }))), h("div", { key: '50a645e89b9e692d4905cec55bd8a07337e4272d', class: "qds-backdrop" })));
85
+ return (h(Host, { key: 'df8850784f9ba96adf154cac3f8ca82070aa5e19' }, h("dialog", { key: '681f32ad65a07972c1e08dc7acde4e80c26df7f1', class: "qds-dialog", ref: __classPrivateFieldGet(this, _Dialog_ref, "f"), onCancel: __classPrivateFieldGet(this, _Dialog_onCancel, "f"), onClose: __classPrivateFieldGet(this, _Dialog_onClose, "f"), onSubmit: __classPrivateFieldGet(this, _Dialog_onSubmit, "f"), ...__classPrivateFieldGet(this, _Dialog_inheritedAttributes, "f") }, h("div", { key: 'aecfea14411b0873b7655c9df69ca7cba0f7b4f7', class: "qds-content" }, h("slot", { key: '161f6424d230f2deda000ef79267caa05a5dbab3' }))), h("div", { key: '805010898bcd1df5a9b6e52f13f24e9abb87df5d', class: "qds-backdrop" })));
86
86
  }
87
87
  show() {
88
88
  invariant(__classPrivateFieldGet(this, _Dialog_dialog, "f"));
@@ -1 +1 @@
1
- {"file":"qds-dialog.js","mappings":";;;;;;;;AAAA,MAAM,SAAS,GAAG,yuCAAyuC,CAAC;AAC5vC,wBAAe,SAAS;;ACDxB;AACA;AACA;;;;;;;;;;;;;;;;;;MAmBa,MAAM;IALnB;;;;;;;;;;;QAWiD,SAAI,GAAG,KAAK,CAAA;QAmB3D,sCAAmC,EAAE,EAAA;QAErC,iCAA2B;QAkDlB,sBAAO,CAAC,MAA0B;YACzC,uBAAA,IAAI,kBAAW,MAAM,MAAA,CAAA;SACtB,EAAA;QAEQ,2BAAY,CAAC,KAAY;YAChC,IAAI,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC,gBAAgB;gBAAE,KAAK,CAAC,cAAc,EAAE,CAAA;SACvE,EAAA;QAEQ,0BAAW;YAClB,SAAS,CAAC,uBAAA,IAAI,sBAAQ,CAAC,CAAA;YAEvB,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,CAAA;YACxB,IAAI,CAAC,IAAI,GAAG,uBAAA,IAAI,sBAAQ,CAAC,IAAI,CAAA;SAC9B,EAAA;QAEQ,2BAAY,CAAC,KAAY;YAChC,IACE,CAAC,KAAK,YAAY,WAAW;iBAC1B,KAAK,CAAC,SAAS,YAAY,iBAAiB;qBAC1C,KAAK,CAAC,SAAS,YAAY,gBAAgB;wBAC1C,KAAK,CAAC,SAAS,CAAC,UAAU,KAAK,QAAQ,CAAC,CAAC;iBAC9C,KAAK,CAAC,MAAM,YAAY,eAAe;oBACtC,KAAK,CAAC,MAAM,CAAC,MAAM,KAAK,QAAQ,CAAC,EACnC;gBACA,KAAK,CAAC,cAAc,EAAE,CAAA;gBACtB,IAAI,CAAC,KAAK,EAAE,CAAA;aACb;SACF,EAAA;KACF;IA3EW,WAAW;QACnB,IAAI,IAAI,CAAC,IAAI;YAAE,IAAI,CAAC,IAAI,EAAE,CAAA;;YACrB,IAAI,CAAC,KAAK,EAAE,CAAA;KAClB;IAEM,iBAAiB;QACtB,uBAAA,IAAI,+BAAwB,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,MAAA,CAAA;KAC7D;IAEM,gBAAgB;QACrB,IAAI,IAAI,CAAC,IAAI;YAAE,IAAI,CAAC,IAAI,EAAE,CAAA;KAC3B;IAEM,MAAM;QACX,QACE,EAAC,IAAI,uDACH,+DACE,KAAK,EAAC,YAAY,EAClB,GAAG,EAAE,uBAAA,IAAI,mBAAK,EACd,QAAQ,EAAE,uBAAA,IAAI,wBAAU,EACxB,OAAO,EAAE,uBAAA,IAAI,uBAAS,EACtB,QAAQ,EAAE,uBAAA,IAAI,wBAAU,KAEpB,uBAAA,IAAI,mCAAqB,IAE7B,4DAAK,KAAK,EAAC,aAAa,IACtB,8DAAQ,CACJ,CACC,EACT,4DAAK,KAAK,EAAC,cAAc,GAAG,CACvB,EACR;KACF;IAEM,IAAI;QACT,SAAS,CAAC,uBAAA,IAAI,sBAAQ,CAAC,CAAA;QAEvB,uBAAA,IAAI,sBAAQ,CAAC,SAAS,EAAE,CAAA;QACxB,IAAI,CAAC,IAAI,GAAG,uBAAA,IAAI,sBAAQ,CAAC,IAAI,CAAA;KAC9B;IAEM,KAAK;QACV,SAAS,CAAC,uBAAA,IAAI,sBAAQ,CAAC,CAAA;QAEvB,uBAAA,IAAI,sBAAQ,CAAC,KAAK,EAAE,CAAA;KACrB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/dialog/dialog.css?tag=qds-dialog&encapsulation=shadow","src/components/dialog/dialog.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: none;\n position: fixed;\n inset: 0;\n width: fit-content;\n height: fit-content;\n}\n\n:host([open]) {\n display: block;\n}\n\n.qds-dialog {\n background-color: var(--qds-theme-popup-background);\n border-radius: var(--qds-popup-border-radius);\n border: none;\n box-shadow: var(--qds-theme-popup-elevation);\n height: inherit;\n padding: 0;\n width: inherit;\n\n &::backdrop {\n background: initial;\n }\n\n &[open] ~ .qds-backdrop {\n backdrop-filter: blur(var(--qds-theme-popup-overlay-blur));\n background-color: var(--qds-theme-popup-overlay-background);\n inset: 0;\n opacity: var(--qds-theme-popup-overlay-opacity);\n position: fixed;\n }\n}\n\n.qds-content {\n align-items: flex-start;\n display: flex;\n flex-direction: column;\n gap: var(--qds-popup-gap-children-related);\n padding: var(--qds-popup-padding);\n height: calc(100% - 2 * var(--qds-popup-padding));\n}\n\n::slotted(blockquote),\n::slotted(button),\n::slotted(dd),\n::slotted(dl),\n::slotted(fieldset),\n::slotted(figure),\n::slotted(h1),\n::slotted(h2),\n::slotted(h3),\n::slotted(h4),\n::slotted(h5),\n::slotted(h6),\n::slotted(hr),\n::slotted(input),\n::slotted(menu),\n::slotted(ol),\n::slotted(p),\n::slotted(pre),\n::slotted(select),\n::slotted(textarea),\n::slotted(ul) {\n margin: 0;\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface, EventEmitter } from '@stencil/core'\nimport { Component, Element, Event, h, Host, Prop, Watch } from '@stencil/core'\n\nimport type { Attributes } from '../../helpers'\nimport { inheritAriaAttributes, invariant } from '../../helpers'\n\n/**\n * The `<qds-dialog>` element represent a dialog box or other interactive\n * component, such as a dismissible alert, inspector, or subwindow.\n *\n * @see https://quartz.se.com/build/components/dialog\n */\n@Component({\n tag: 'qds-dialog',\n shadow: true,\n styleUrl: 'dialog.css',\n})\nexport class Dialog implements ComponentInterface {\n /**\n * Indicates whether or not the dialog is open. You can toggle this attribute\n * to show and hide the dialog, or you can use the `show()` and `close()`\n * methods and this attribute will reflect the dialog’s open state.\n */\n @Prop({ mutable: true, reflect: true }) public open = false\n\n @Element() private readonly host!: HTMLElement\n\n /**\n * Emitted when the user instructs the browser that they wish to dismiss the\n * currently open dialog. The browser fires this event when the user presses\n * the `Esc` key.\n *\n * When a dialog is dismissed with the `Esc` key, both the `qdsCancel` and\n * `qdsClose` events are fired.\n */\n @Event({ eventName: 'qdsCancel', bubbles: false, composed: false })\n private readonly cancelEmitter!: EventEmitter<void>\n\n /** Emitted when the dialog has been closed. */\n @Event({ eventName: 'qdsClose', bubbles: false, cancelable: false })\n private readonly closeEmitter!: EventEmitter<void>\n\n #inheritedAttributes: Attributes = {}\n\n #dialog?: HTMLDialogElement\n\n @Watch('open')\n protected openChanged(): void {\n if (this.open) this.show()\n else this.close()\n }\n\n public componentWillLoad(): void {\n this.#inheritedAttributes = inheritAriaAttributes(this.host)\n }\n\n public componentDidLoad(): void {\n if (this.open) this.show()\n }\n\n public render() {\n return (\n <Host>\n <dialog\n class=\"qds-dialog\"\n ref={this.#ref}\n onCancel={this.#onCancel}\n onClose={this.#onClose}\n onSubmit={this.#onSubmit}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...this.#inheritedAttributes}\n >\n <div class=\"qds-content\">\n <slot />\n </div>\n </dialog>\n <div class=\"qds-backdrop\" />\n </Host>\n )\n }\n\n public show(): void {\n invariant(this.#dialog)\n\n this.#dialog.showModal()\n this.open = this.#dialog.open\n }\n\n public close(): void {\n invariant(this.#dialog)\n\n this.#dialog.close()\n }\n\n readonly #ref = (dialog?: HTMLDialogElement): void => {\n this.#dialog = dialog\n }\n\n readonly #onCancel = (event: Event): void => {\n if (this.cancelEmitter.emit().defaultPrevented) event.preventDefault()\n }\n\n readonly #onClose = (): void => {\n invariant(this.#dialog)\n\n this.closeEmitter.emit()\n this.open = this.#dialog.open\n }\n\n readonly #onSubmit = (event: Event): void => {\n if (\n (event instanceof SubmitEvent &&\n (event.submitter instanceof HTMLButtonElement ||\n (event.submitter instanceof HTMLInputElement &&\n event.submitter.formMethod === 'dialog'))) ||\n (event.target instanceof HTMLFormElement &&\n event.target.method === 'dialog')\n ) {\n event.preventDefault()\n this.close()\n }\n }\n}\n"],"version":3}
1
+ {"file":"qds-dialog.js","mappings":";;;;;;;;AAAA,MAAM,SAAS,GAAG,syCAAsyC,CAAC;AACzzC,wBAAe,SAAS;;ACDxB;AACA;AACA;;;;;;;;;;;;;;;;;;MAmBa,MAAM;IALnB;;;;;;;;;;;QAWiD,SAAI,GAAG,KAAK,CAAA;QAmB3D,sCAAmC,EAAE,EAAA;QAErC,iCAA2B;QAkDlB,sBAAO,CAAC,MAA0B;YACzC,uBAAA,IAAI,kBAAW,MAAM,MAAA,CAAA;SACtB,EAAA;QAEQ,2BAAY,CAAC,KAAY;YAChC,IAAI,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC,gBAAgB;gBAAE,KAAK,CAAC,cAAc,EAAE,CAAA;SACvE,EAAA;QAEQ,0BAAW;YAClB,SAAS,CAAC,uBAAA,IAAI,sBAAQ,CAAC,CAAA;YAEvB,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,CAAA;YACxB,IAAI,CAAC,IAAI,GAAG,uBAAA,IAAI,sBAAQ,CAAC,IAAI,CAAA;SAC9B,EAAA;QAEQ,2BAAY,CAAC,KAAY;YAChC,IACE,CAAC,KAAK,YAAY,WAAW;iBAC1B,KAAK,CAAC,SAAS,YAAY,iBAAiB;qBAC1C,KAAK,CAAC,SAAS,YAAY,gBAAgB;wBAC1C,KAAK,CAAC,SAAS,CAAC,UAAU,KAAK,QAAQ,CAAC,CAAC;iBAC9C,KAAK,CAAC,MAAM,YAAY,eAAe;oBACtC,KAAK,CAAC,MAAM,CAAC,MAAM,KAAK,QAAQ,CAAC,EACnC;gBACA,KAAK,CAAC,cAAc,EAAE,CAAA;gBACtB,IAAI,CAAC,KAAK,EAAE,CAAA;aACb;SACF,EAAA;KACF;IA3EW,WAAW;QACnB,IAAI,IAAI,CAAC,IAAI;YAAE,IAAI,CAAC,IAAI,EAAE,CAAA;;YACrB,IAAI,CAAC,KAAK,EAAE,CAAA;KAClB;IAEM,iBAAiB;QACtB,uBAAA,IAAI,+BAAwB,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,MAAA,CAAA;KAC7D;IAEM,gBAAgB;QACrB,IAAI,IAAI,CAAC,IAAI;YAAE,IAAI,CAAC,IAAI,EAAE,CAAA;KAC3B;IAEM,MAAM;QACX,QACE,EAAC,IAAI,uDACH,+DACE,KAAK,EAAC,YAAY,EAClB,GAAG,EAAE,uBAAA,IAAI,mBAAK,EACd,QAAQ,EAAE,uBAAA,IAAI,wBAAU,EACxB,OAAO,EAAE,uBAAA,IAAI,uBAAS,EACtB,QAAQ,EAAE,uBAAA,IAAI,wBAAU,KAEpB,uBAAA,IAAI,mCAAqB,IAE7B,4DAAK,KAAK,EAAC,aAAa,IACtB,8DAAQ,CACJ,CACC,EACT,4DAAK,KAAK,EAAC,cAAc,GAAG,CACvB,EACR;KACF;IAEM,IAAI;QACT,SAAS,CAAC,uBAAA,IAAI,sBAAQ,CAAC,CAAA;QAEvB,uBAAA,IAAI,sBAAQ,CAAC,SAAS,EAAE,CAAA;QACxB,IAAI,CAAC,IAAI,GAAG,uBAAA,IAAI,sBAAQ,CAAC,IAAI,CAAA;KAC9B;IAEM,KAAK;QACV,SAAS,CAAC,uBAAA,IAAI,sBAAQ,CAAC,CAAA;QAEvB,uBAAA,IAAI,sBAAQ,CAAC,KAAK,EAAE,CAAA;KACrB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/dialog/dialog.css?tag=qds-dialog&encapsulation=shadow","src/components/dialog/dialog.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: none;\n position: fixed;\n inset: 0;\n width: fit-content;\n height: fit-content;\n}\n\n:host([open]) {\n display: block;\n}\n\n.qds-dialog {\n background-color: var(--qds-theme-popup-background);\n border-radius: var(--qds-popup-border-radius);\n border: var(--qds-popup-border-width) solid var(--qds-theme-popup-border);\n box-shadow: var(--qds-theme-popup-elevation);\n height: inherit;\n padding: 0;\n width: inherit;\n\n &::backdrop {\n background: initial;\n }\n\n &[open] ~ .qds-backdrop {\n backdrop-filter: blur(var(--qds-theme-popup-overlay-blur));\n background-color: var(--qds-theme-popup-overlay-background);\n inset: 0;\n opacity: var(--qds-theme-popup-overlay-opacity);\n position: fixed;\n }\n}\n\n.qds-content {\n align-items: flex-start;\n display: flex;\n flex-direction: column;\n gap: var(--qds-popup-gap-children-related);\n padding: var(--qds-popup-padding);\n height: calc(100% - 2 * var(--qds-popup-padding));\n}\n\n::slotted(blockquote),\n::slotted(button),\n::slotted(dd),\n::slotted(dl),\n::slotted(fieldset),\n::slotted(figure),\n::slotted(h1),\n::slotted(h2),\n::slotted(h3),\n::slotted(h4),\n::slotted(h5),\n::slotted(h6),\n::slotted(hr),\n::slotted(input),\n::slotted(menu),\n::slotted(ol),\n::slotted(p),\n::slotted(pre),\n::slotted(select),\n::slotted(textarea),\n::slotted(ul) {\n margin: 0;\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface, EventEmitter } from '@stencil/core'\nimport { Component, Element, Event, h, Host, Prop, Watch } from '@stencil/core'\n\nimport type { Attributes } from '../../helpers'\nimport { inheritAriaAttributes, invariant } from '../../helpers'\n\n/**\n * The `<qds-dialog>` element represent a dialog box or other interactive\n * component, such as a dismissible alert, inspector, or subwindow.\n *\n * @see https://quartz.se.com/build/components/dialog\n */\n@Component({\n tag: 'qds-dialog',\n shadow: true,\n styleUrl: 'dialog.css',\n})\nexport class Dialog implements ComponentInterface {\n /**\n * Indicates whether or not the dialog is open. You can toggle this attribute\n * to show and hide the dialog, or you can use the `show()` and `close()`\n * methods and this attribute will reflect the dialog’s open state.\n */\n @Prop({ mutable: true, reflect: true }) public open = false\n\n @Element() private readonly host!: HTMLElement\n\n /**\n * Emitted when the user instructs the browser that they wish to dismiss the\n * currently open dialog. The browser fires this event when the user presses\n * the `Esc` key.\n *\n * When a dialog is dismissed with the `Esc` key, both the `qdsCancel` and\n * `qdsClose` events are fired.\n */\n @Event({ eventName: 'qdsCancel', bubbles: false, composed: false })\n private readonly cancelEmitter!: EventEmitter<void>\n\n /** Emitted when the dialog has been closed. */\n @Event({ eventName: 'qdsClose', bubbles: false, cancelable: false })\n private readonly closeEmitter!: EventEmitter<void>\n\n #inheritedAttributes: Attributes = {}\n\n #dialog?: HTMLDialogElement\n\n @Watch('open')\n protected openChanged(): void {\n if (this.open) this.show()\n else this.close()\n }\n\n public componentWillLoad(): void {\n this.#inheritedAttributes = inheritAriaAttributes(this.host)\n }\n\n public componentDidLoad(): void {\n if (this.open) this.show()\n }\n\n public render() {\n return (\n <Host>\n <dialog\n class=\"qds-dialog\"\n ref={this.#ref}\n onCancel={this.#onCancel}\n onClose={this.#onClose}\n onSubmit={this.#onSubmit}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...this.#inheritedAttributes}\n >\n <div class=\"qds-content\">\n <slot />\n </div>\n </dialog>\n <div class=\"qds-backdrop\" />\n </Host>\n )\n }\n\n public show(): void {\n invariant(this.#dialog)\n\n this.#dialog.showModal()\n this.open = this.#dialog.open\n }\n\n public close(): void {\n invariant(this.#dialog)\n\n this.#dialog.close()\n }\n\n readonly #ref = (dialog?: HTMLDialogElement): void => {\n this.#dialog = dialog\n }\n\n readonly #onCancel = (event: Event): void => {\n if (this.cancelEmitter.emit().defaultPrevented) event.preventDefault()\n }\n\n readonly #onClose = (): void => {\n invariant(this.#dialog)\n\n this.closeEmitter.emit()\n this.open = this.#dialog.open\n }\n\n readonly #onSubmit = (event: Event): void => {\n if (\n (event instanceof SubmitEvent &&\n (event.submitter instanceof HTMLButtonElement ||\n (event.submitter instanceof HTMLInputElement &&\n event.submitter.formMethod === 'dialog'))) ||\n (event.target instanceof HTMLFormElement &&\n event.target.method === 'dialog')\n ) {\n event.preventDefault()\n this.close()\n }\n }\n}\n"],"version":3}
@@ -3,7 +3,7 @@
3
3
  *
4
4
  * SPDX-License-Identifier: Apache-2.0
5
5
  */
6
- import { D as Divider, d as defineCustomElement$1 } from './p-b4c302d4.js';
6
+ import { D as Divider, d as defineCustomElement$1 } from './p-e2a9e441.js';
7
7
 
8
8
  const QdsDivider = Divider;
9
9
  const defineCustomElement = defineCustomElement$1;
@@ -3,7 +3,7 @@
3
3
  *
4
4
  * SPDX-License-Identifier: Apache-2.0
5
5
  */
6
- import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-2806fee1.js';
6
+ import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-50f85f75.js';
7
7
  import { o as offset, f as flip, s as shift, l as limitShift, c as computePosition, a as autoUpdate } from './p-fdd0abae.js';
8
8
  import { r as resolveTarget, d as propertyToPx, e as roundByDPR, f as ignorePromise } from './p-8abba29b.js';
9
9
 
@@ -186,11 +186,11 @@ const Dropdown = /*@__PURE__*/ proxyCustomElement(class Dropdown extends H {
186
186
  __classPrivateFieldGet(this, _Dropdown_instances, "m", _Dropdown_disconnectReferenceElement).call(this);
187
187
  }
188
188
  render() {
189
- return (h(Host, { key: 'c192187f4fbe9fa2e166cb86b435c45c9d6d2a26', "aria-labelledby": this.hostAriaLabelledBy, onKeyDown: __classPrivateFieldGet(this, _Dropdown_onKeydown, "f"), onFocusout: __classPrivateFieldGet(this, _Dropdown_onFocusout, "f"), style: {
189
+ return (h(Host, { key: 'b6482f2301362787df929ced74c873328d62d4e3', "aria-labelledby": this.hostAriaLabelledBy, onKeyDown: __classPrivateFieldGet(this, _Dropdown_onKeydown, "f"), onFocusout: __classPrivateFieldGet(this, _Dropdown_onFocusout, "f"), style: {
190
190
  display: this.hostDisplay,
191
191
  position: this.hostPosition,
192
192
  transform: this.hostTransform,
193
- } }, h("slot", { key: '41a6332566fe8e7e935f8f638367c3f0d9571cbe' })));
193
+ } }, h("slot", { key: '428c9e2feffecf27c5da62afcac6da87f035fa39' })));
194
194
  }
195
195
  show() {
196
196
  if (__classPrivateFieldGet(this, _Dropdown_open, "f"))
@@ -3,9 +3,9 @@
3
3
  *
4
4
  * SPDX-License-Identifier: Apache-2.0
5
5
  */
6
- import { p as proxyCustomElement, H, h } from './p-2806fee1.js';
6
+ import { p as proxyCustomElement, H, h } from './p-50f85f75.js';
7
7
  import { i as inheritAriaAttributes } from './p-8abba29b.js';
8
- import { d as defineCustomElement$2 } from './p-ba880369.js';
8
+ import { d as defineCustomElement$2 } from './p-72c09714.js';
9
9
 
10
10
  const formMessageCss = ":host([hidden]){display:none!important}:host{display:inline-block;line-height:0}.qds-form-message{color:var(--qds-theme-control-text-standard);display:inline-flex;gap:var(--qds-text-icon-gap)}.qds-icon-background,.qds-icon-container{align-items:center;display:flex}.qds-icon-background{border-radius:var(--qds-control-rounded-border-radius)}.qds-icon{color:var(--qds-theme-feedback-action-destructive-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-size=small]{font:var(--qds-control-small-text)}.qds-icon-container[data-size=small]{height:var(--qds-control-small-icon-crop-height)}.qds-icon[data-size=small]{height:var(--qds-control-small-icon-size);width:var(--qds-control-small-icon-size)}.qds-inline[data-size=small]{margin-block:var(--qds-control-small-padding-auto-height)}[data-size=standard]{font:var(--qds-control-standard-text)}.qds-icon-container[data-size=standard]{height:var(--qds-control-standard-icon-crop-height)}.qds-icon[data-size=standard]{height:var(--qds-control-standard-icon-size);width:var(--qds-control-standard-icon-size)}.qds-inline[data-size=standard]{margin-block:var(--qds-control-standard-padding-auto-height)}[data-size=large]{font:var(--qds-control-large-text)}.qds-icon-container[data-size=large]{height:var(--qds-control-large-icon-crop-height)}.qds-icon[data-size=large]{height:var(--qds-control-large-icon-size);width:var(--qds-control-large-icon-size)}.qds-inline[data-size=large]{margin-block:var(--qds-control-large-padding-auto-height)}.qds-icon-background[data-status=error]{background-color:var(--qds-theme-feedback-result-failure)}.qds-text[data-status=error]{color:var(--qds-theme-feedback-result-failure)}[data-status=info].qds-icon-background{background-color:var(--qds-theme-feedback-message-informational)}.qds-icon-background[data-status=success]{background-color:var(--qds-theme-feedback-result-success)}.qds-text[data-status=success]{color:var(--qds-theme-feedback-result-success)}[data-status=warning].qds-icon-background{background-color:var(--qds-theme-feedback-result-partial-success)}";
11
11
  const QdsFormMessageStyle0 = formMessageCss;
@@ -57,10 +57,10 @@ const FormMessage = /*@__PURE__*/ proxyCustomElement(class FormMessage extends H
57
57
  __classPrivateFieldSet(this, _FormMessage_inheritedAttributes, inheritAriaAttributes(this.host), "f");
58
58
  }
59
59
  render() {
60
- return (h("span", { key: '4ef649d8c5a28d6e7fdd40701808c7e11c5f5d1b', class: {
60
+ return (h("span", { key: 'aeb311865eb9da355ea37a1b521094dd2c06c0d8', class: {
61
61
  'qds-form-message': true,
62
62
  'qds-inline': this.inline,
63
- }, "data-size": __classPrivateFieldGet(this, _FormMessage_instances, "a", _FormMessage_computedSize_get), ...__classPrivateFieldGet(this, _FormMessage_inheritedAttributes, "f") }, h("div", { key: '5b4c24c3212a1be080b984b7980ae9007b0d4058', class: "qds-icon-container", "data-size": __classPrivateFieldGet(this, _FormMessage_instances, "a", _FormMessage_computedSize_get) }, h("div", { key: '4ad9113efb96a0a838e1d7c7e74c696a1fd39d10', class: "qds-icon-background", "data-size": __classPrivateFieldGet(this, _FormMessage_instances, "a", _FormMessage_computedSize_get), "data-status": this.status }, h("qds-icon", { key: '20d176ec6474585c36c6357931f047e6dd49b352', "aria-hidden": "true", class: "qds-icon", "data-size": __classPrivateFieldGet(this, _FormMessage_instances, "a", _FormMessage_computedSize_get), name: `status-${this.status}`, library: "core" }), h("span", { key: 'e3e573bede77a2c328fa954fbe6897624b4743c8', class: "qds-sr-only" }, this.statusDescription))), h("span", { key: '90f50abc3abd90e5e33bff33ec9530696a62a8e8', class: "qds-text", "data-status": __classPrivateFieldGet(this, _FormMessage_instances, "a", _FormMessage_computedStatus_get) }, this.text)));
63
+ }, "data-size": __classPrivateFieldGet(this, _FormMessage_instances, "a", _FormMessage_computedSize_get), ...__classPrivateFieldGet(this, _FormMessage_inheritedAttributes, "f") }, h("div", { key: '6491c3777546e3bed953d9da85423ac67bfb3135', class: "qds-icon-container", "data-size": __classPrivateFieldGet(this, _FormMessage_instances, "a", _FormMessage_computedSize_get) }, h("div", { key: 'ed683b8f1f1b84f39743f18e53ba442cda9e2996', class: "qds-icon-background", "data-size": __classPrivateFieldGet(this, _FormMessage_instances, "a", _FormMessage_computedSize_get), "data-status": this.status }, h("qds-icon", { key: 'e004a19a36d721158a7ddf861ee90b69b18a5060', "aria-hidden": "true", class: "qds-icon", "data-size": __classPrivateFieldGet(this, _FormMessage_instances, "a", _FormMessage_computedSize_get), name: `status-${this.status}`, library: "core" }), h("span", { key: '4d607a5ed476d9de870083a3ff17e0060187c6af', class: "qds-sr-only" }, this.statusDescription))), h("span", { key: 'c5bc5b5590d77aa4639dcb2f6729fb2624b22925', class: "qds-text", "data-status": __classPrivateFieldGet(this, _FormMessage_instances, "a", _FormMessage_computedStatus_get) }, this.text)));
64
64
  }
65
65
  get host() { return this; }
66
66
  static get style() { return QdsFormMessageStyle0; }
@@ -3,7 +3,7 @@
3
3
  *
4
4
  * SPDX-License-Identifier: Apache-2.0
5
5
  */
6
- import { I as Icon, d as defineCustomElement$1 } from './p-ba880369.js';
6
+ import { I as Icon, d as defineCustomElement$1 } from './p-72c09714.js';
7
7
 
8
8
  const QdsIcon = Icon;
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, c as createEvent, h } from './p-2806fee1.js';
6
+ import { p as proxyCustomElement, H, c as createEvent, h } from './p-50f85f75.js';
7
7
  import { a as attachInternals, p as pickFocusEventAttributes, g as determineLinkIcon } from './p-8abba29b.js';
8
- import { d as defineCustomElement$2 } from './p-ba880369.js';
8
+ import { d as defineCustomElement$2 } from './p-72c09714.js';
9
9
 
10
10
  const inlineLinkCss = ":host([hidden]){display:none!important}:host{display:inline-block}.qds-icon{flex-shrink:0;height:1.25em;width:1.25em}.qds-inline-link{align-items:center;border-radius:var(--qds-focus-border-radius);display:inline-flex;gap:var(--qds-text-icon-gap);max-width:inherit;width:inherit}.qds-inline-link:focus-visible{outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width);outline-offset:var(--qds-focus-border-offset)}.qds-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.qds-disabled{opacity:var(--qds-theme-disabled);pointer-events:none}[data-importance=subdued]{color:var(--qds-theme-link-subdued-default)}[data-importance=subdued]:visited{color:var(--qds-theme-link-visited-default)}[data-importance=subdued]:hover{color:var(--qds-theme-link-subdued-hover)}[data-importance=subdued]:active{color:var(--qds-theme-link-subdued-pressed)}[data-importance=subdued]:visited:hover{color:var(--qds-theme-link-visited-hover)}[data-importance=subdued]:visited:active{color:var(--qds-theme-link-visited-pressed)}[data-importance=standard]{color:var(--qds-theme-link-standard-default)}[data-importance=standard]:visited{color:var(--qds-theme-link-visited-default)}[data-importance=standard]:hover{color:var(--qds-theme-link-standard-hover)}[data-importance=standard]:active{color:var(--qds-theme-link-standard-pressed)}[data-importance=standard]:visited:hover{color:var(--qds-theme-link-visited-hover)}[data-importance=standard]:visited:active{color:var(--qds-theme-link-visited-pressed)}[data-importance=emphasized]{color:var(--qds-theme-link-emphasized-default)}[data-importance=emphasized]:visited{color:var(--qds-theme-link-visited-default)}[data-importance=emphasized]:hover{color:var(--qds-theme-link-emphasized-hover)}[data-importance=emphasized]:active{color:var(--qds-theme-link-emphasized-pressed)}[data-importance=emphasized]:visited:hover{color:var(--qds-theme-link-visited-hover)}[data-importance=emphasized]:visited:active{color:var(--qds-theme-link-visited-pressed)}";
11
11
  const QdsInlineLinkStyle0 = inlineLinkCss;
@@ -81,10 +81,10 @@ const InlineLink = /*@__PURE__*/ proxyCustomElement(class InlineLink extends H {
81
81
  __classPrivateFieldGet(this, _InlineLink_internals, "f").ariaLabel = this.host.textContent;
82
82
  }
83
83
  render() {
84
- return (h("a", { key: 'f839676a41fc544de59e0863b1f01090648a6e40', "aria-hidden": "true", class: {
84
+ return (h("a", { key: '593d9b45039467c0de9bd9daecb548472858b834', "aria-hidden": "true", class: {
85
85
  'qds-inline-link': true,
86
86
  'qds-disabled': this.disabled,
87
- }, "data-importance": __classPrivateFieldGet(this, _InlineLink_instances, "a", _InlineLink_computedImportance_get), download: this.download, href: this.href?.toString(), hrefLang: this.hreflang, onBlur: __classPrivateFieldGet(this, _InlineLink_onBlur, "f"), onFocus: __classPrivateFieldGet(this, _InlineLink_onFocus, "f"), referrerPolicy: this.referrerPolicy, rel: this.rel, tabIndex: this.disabled ? -1 : this.tabIndex, target: this.target }, this.iconName !== undefined && this.iconName !== '' && (h("qds-icon", { key: 'e2046cd8ec2aaaf2b4b367d4e3321098fa7d6a8e', class: "qds-icon", library: this.iconLibrary, name: this.iconName })), h("span", { key: '88079c1b08b6e56ae578f73e392330e313db02bc', class: "qds-text" }, h("slot", { key: 'fd9c072da3e2364a6233b8ad1cc7f50e43684d61', onSlotchange: __classPrivateFieldGet(this, _InlineLink_onSlotchange, "f") })), this.linkIcon && (h("qds-icon", { key: 'bb1bf6c08631539894bbef5c9b87c675d94c853d', class: "qds-icon", library: "core", name: this.linkIcon }))));
87
+ }, "data-importance": __classPrivateFieldGet(this, _InlineLink_instances, "a", _InlineLink_computedImportance_get), download: this.download, href: this.href?.toString(), hrefLang: this.hreflang, onBlur: __classPrivateFieldGet(this, _InlineLink_onBlur, "f"), onFocus: __classPrivateFieldGet(this, _InlineLink_onFocus, "f"), referrerPolicy: this.referrerPolicy, rel: this.rel, tabIndex: this.disabled ? -1 : this.tabIndex, target: this.target }, this.iconName !== undefined && this.iconName !== '' && (h("qds-icon", { key: '8fd5a5c068c3d5f2cb5d40f0e7ff67454bd4178c', class: "qds-icon", library: this.iconLibrary, name: this.iconName })), h("span", { key: '1e12f58546ea74ac4676f1c9565f3f99a14115b5', class: "qds-text" }, h("slot", { key: 'fac69d2d273b598e7c7c5ff22b10d90dc7d13892', onSlotchange: __classPrivateFieldGet(this, _InlineLink_onSlotchange, "f") })), this.linkIcon && (h("qds-icon", { key: '17798d667b2deb5724695ad158cf960784b939b2', class: "qds-icon", library: "core", name: this.linkIcon }))));
88
88
  }
89
89
  static get delegatesFocus() { return true; }
90
90
  get host() { return this; }