@quartzds/core 1.0.0-beta.120 → 1.0.0-beta.121
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.
- package/CHANGELOG.md +24 -0
- package/components/index.js +1 -1
- package/components/{p-eFhV8w2l.js → p-5dwtV5iH.js} +4 -4
- package/components/{p-eFhV8w2l.js.map → p-5dwtV5iH.js.map} +1 -1
- package/components/{p-Dsc0-aXK.js → p-B2ZVUvk9.js} +5 -5
- package/components/{p-Dsc0-aXK.js.map → p-B2ZVUvk9.js.map} +1 -1
- package/components/{p-5RFBIepu.js → p-C1c4JVlg.js} +4 -4
- package/components/{p-5RFBIepu.js.map → p-C1c4JVlg.js.map} +1 -1
- package/components/{p-CXP6q9Mr.js → p-CURs27Ur.js} +11 -6
- package/components/p-CURs27Ur.js.map +1 -0
- package/components/{p-DwxIJEUj.js → p-CjVnGhSO.js} +3 -3
- package/components/{p-DwxIJEUj.js.map → p-CjVnGhSO.js.map} +1 -1
- package/components/{p-DeRqCYmp.js → p-CkUTS1aU.js} +6 -6
- package/components/{p-DeRqCYmp.js.map → p-CkUTS1aU.js.map} +1 -1
- package/components/{p-CFVg7I9T.js → p-CkyaV9az.js} +5 -5
- package/components/{p-CFVg7I9T.js.map → p-CkyaV9az.js.map} +1 -1
- package/components/{p-B03FWheS.js → p-D82sb4oJ.js} +4 -4
- package/components/{p-B03FWheS.js.map → p-D82sb4oJ.js.map} +1 -1
- package/components/{p-Bnc7Puxx.js → p-D9pW936J.js} +10 -10
- package/components/{p-Bnc7Puxx.js.map → p-D9pW936J.js.map} +1 -1
- package/components/{p-BkBJDD6Y.js → p-DNHI4C-W.js} +6 -6
- package/components/{p-BkBJDD6Y.js.map → p-DNHI4C-W.js.map} +1 -1
- package/components/{p-DnZdwX0l.js → p-DR79BVX5.js} +6 -6
- package/components/{p-DnZdwX0l.js.map → p-DR79BVX5.js.map} +1 -1
- package/components/{p-BkgfW_tl.js → p-DtxwXYGb.js} +5 -5
- package/components/p-DtxwXYGb.js.map +1 -0
- package/components/{p-CRVPDKfO.js → p-laE-pGH7.js} +6 -6
- package/components/{p-CRVPDKfO.js.map → p-laE-pGH7.js.map} +1 -1
- package/components/qds-action-item.js +4 -4
- package/components/qds-action-item.js.map +1 -1
- package/components/qds-avatar-media.js +1 -1
- package/components/qds-breadcrumb-item.js +4 -4
- package/components/qds-breadcrumb-item.js.map +1 -1
- package/components/qds-button.js +3 -3
- package/components/qds-checkbox.js +1 -1
- package/components/qds-chip.js +5 -5
- package/components/qds-chip.js.map +1 -1
- package/components/qds-dialog.js +6 -6
- package/components/qds-dialog.js.map +1 -1
- package/components/qds-divider.js +1 -1
- package/components/qds-dropdown.js +1 -1
- package/components/qds-form-message.js +2 -2
- package/components/qds-icon-button.js +1 -1
- package/components/qds-icon-tab.js +5 -5
- package/components/qds-icon-tab.js.map +1 -1
- package/components/qds-icon.js +1 -1
- package/components/qds-inline-link.js +4 -4
- package/components/qds-input.js +42 -15
- package/components/qds-input.js.map +1 -1
- package/components/qds-label.js +1 -1
- package/components/qds-list-item.js +13 -13
- package/components/qds-loader.js +2 -2
- package/components/qds-menu-item.js +6 -6
- package/components/qds-mini-button.js +1 -1
- package/components/qds-progress-bar.js +2 -2
- package/components/qds-radio.js +1 -1
- package/components/qds-select.js +27 -9
- package/components/qds-select.js.map +1 -1
- package/components/qds-standalone-link.js +4 -4
- package/components/qds-switch.js +5 -5
- package/components/qds-tab.js +8 -8
- package/components/qds-tab.js.map +1 -1
- package/components/qds-tabbar.js +9 -9
- package/components/qds-table-cell.js +2 -2
- package/components/qds-table-head-cell.js +2 -2
- package/components/qds-table-row.js +1 -1
- package/components/qds-table.js +1 -1
- package/components/qds-tag.js +1 -1
- package/components/qds-textarea.js +4 -4
- package/components/qds-textarea.js.map +1 -1
- package/components/qds-title.js +1 -1
- package/components/qds-tooltip.js +1 -1
- package/dist/cjs/{helpers-BIL8yXqA.js → helpers-Qs3cpKiI.js} +11 -6
- package/dist/cjs/{helpers-BIL8yXqA.js.map → helpers-Qs3cpKiI.js.map} +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/qds-action-item.cjs.entry.js +2 -2
- package/dist/cjs/qds-action-item.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-avatar-media_3.cjs.entry.js +6 -6
- package/dist/cjs/qds-breadcrumb-item.cjs.entry.js +2 -2
- package/dist/cjs/qds-breadcrumb-item.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-button.cjs.entry.js +1 -1
- package/dist/cjs/qds-chip.cjs.entry.js +2 -2
- package/dist/cjs/qds-chip.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-dialog.cjs.entry.js +3 -3
- package/dist/cjs/qds-dialog.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-divider_2.cjs.entry.js +2 -2
- package/dist/cjs/qds-dropdown.cjs.entry.js +2 -2
- package/dist/cjs/qds-form-message.cjs.entry.js +1 -1
- package/dist/cjs/qds-icon-tab.cjs.entry.js +2 -2
- package/dist/cjs/qds-icon-tab.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-icon.cjs.entry.js +3 -3
- package/dist/cjs/qds-icon.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-inline-link.cjs.entry.js +3 -3
- package/dist/cjs/qds-input.cjs.entry.js +39 -13
- package/dist/cjs/qds-input.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-label.cjs.entry.js +3 -3
- package/dist/cjs/qds-list-item.cjs.entry.js +4 -4
- package/dist/cjs/qds-loader.cjs.entry.js +1 -1
- package/dist/cjs/qds-menu-item.cjs.entry.js +3 -3
- package/dist/cjs/qds-mini-button.cjs.entry.js +2 -2
- package/dist/cjs/qds-progress-bar.cjs.entry.js +2 -2
- package/dist/cjs/qds-select.cjs.entry.js +23 -7
- package/dist/cjs/qds-select.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-standalone-link.cjs.entry.js +3 -3
- package/dist/cjs/qds-switch.cjs.entry.js +4 -4
- package/dist/cjs/qds-tab.cjs.entry.js +5 -5
- package/dist/cjs/qds-tab.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-tabbar.cjs.entry.js +5 -5
- package/dist/cjs/qds-table-cell.cjs.entry.js +2 -2
- package/dist/cjs/qds-table-head-cell.cjs.entry.js +2 -2
- package/dist/cjs/qds-table-row.cjs.entry.js +1 -1
- package/dist/cjs/qds-table.cjs.entry.js +1 -1
- package/dist/cjs/qds-tag.cjs.entry.js +3 -3
- package/dist/cjs/qds-textarea.cjs.entry.js +4 -4
- package/dist/cjs/qds-textarea.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-title.cjs.entry.js +3 -3
- package/dist/cjs/qds-tooltip.cjs.entry.js +2 -2
- package/dist/cjs/qds.cjs.js +1 -1
- package/dist/custom-elements.json +95 -3
- package/dist/docs.json +85 -2
- package/dist/esm/{helpers-BgaJNF9u.js → helpers-eFD8hV6J.js} +11 -6
- package/dist/esm/{helpers-BgaJNF9u.js.map → helpers-eFD8hV6J.js.map} +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/qds-action-item.entry.js +2 -2
- package/dist/esm/qds-action-item.entry.js.map +1 -1
- package/dist/esm/qds-avatar-media_3.entry.js +6 -6
- package/dist/esm/qds-breadcrumb-item.entry.js +2 -2
- package/dist/esm/qds-breadcrumb-item.entry.js.map +1 -1
- package/dist/esm/qds-button.entry.js +1 -1
- package/dist/esm/qds-chip.entry.js +2 -2
- package/dist/esm/qds-chip.entry.js.map +1 -1
- package/dist/esm/qds-dialog.entry.js +3 -3
- package/dist/esm/qds-dialog.entry.js.map +1 -1
- package/dist/esm/qds-divider_2.entry.js +2 -2
- package/dist/esm/qds-dropdown.entry.js +2 -2
- package/dist/esm/qds-form-message.entry.js +1 -1
- package/dist/esm/qds-icon-tab.entry.js +2 -2
- package/dist/esm/qds-icon-tab.entry.js.map +1 -1
- package/dist/esm/qds-icon.entry.js +3 -3
- package/dist/esm/qds-icon.entry.js.map +1 -1
- package/dist/esm/qds-inline-link.entry.js +3 -3
- package/dist/esm/qds-input.entry.js +39 -13
- package/dist/esm/qds-input.entry.js.map +1 -1
- package/dist/esm/qds-label.entry.js +3 -3
- package/dist/esm/qds-list-item.entry.js +4 -4
- package/dist/esm/qds-loader.entry.js +1 -1
- package/dist/esm/qds-menu-item.entry.js +3 -3
- package/dist/esm/qds-mini-button.entry.js +2 -2
- package/dist/esm/qds-progress-bar.entry.js +2 -2
- package/dist/esm/qds-select.entry.js +23 -7
- package/dist/esm/qds-select.entry.js.map +1 -1
- package/dist/esm/qds-standalone-link.entry.js +3 -3
- package/dist/esm/qds-switch.entry.js +4 -4
- package/dist/esm/qds-tab.entry.js +5 -5
- package/dist/esm/qds-tab.entry.js.map +1 -1
- package/dist/esm/qds-tabbar.entry.js +5 -5
- package/dist/esm/qds-table-cell.entry.js +2 -2
- package/dist/esm/qds-table-head-cell.entry.js +2 -2
- package/dist/esm/qds-table-row.entry.js +1 -1
- package/dist/esm/qds-table.entry.js +1 -1
- package/dist/esm/qds-tag.entry.js +3 -3
- package/dist/esm/qds-textarea.entry.js +4 -4
- package/dist/esm/qds-textarea.entry.js.map +1 -1
- package/dist/esm/qds-title.entry.js +3 -3
- package/dist/esm/qds-tooltip.entry.js +2 -2
- package/dist/esm/qds.js +1 -1
- package/dist/types/components/input/input.d.ts +10 -0
- package/dist/types/components/select/select.d.ts +7 -1
- package/dist/types/components.d.ts +22 -4
- package/dist/vscode.html-custom-data.json +20 -1
- package/hydrate/index.js +127 -78
- package/hydrate/index.mjs +127 -78
- package/package.json +1 -1
- package/components/p-BkgfW_tl.js.map +0 -1
- package/components/p-CXP6q9Mr.js.map +0 -1
|
@@ -4,9 +4,9 @@
|
|
|
4
4
|
* SPDX-License-Identifier: Apache-2.0
|
|
5
5
|
*/
|
|
6
6
|
import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-Hg1Liloy.js';
|
|
7
|
-
import { i as invariant, c as inheritAriaAttributes } from './helpers-
|
|
7
|
+
import { i as invariant, c as inheritAriaAttributes } from './helpers-eFD8hV6J.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:var(--qds-popup-border-width) solid var(--qds-theme-popup-border);border-radius:var(--qds-popup-border-radius);box-shadow:var(--qds-popup-elevation);color:inherit;height:inherit;padding:0;width:inherit}.qds-dialog::backdrop{background:initial}.qds-dialog[open]~.qds-backdrop{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-heading{align-items:center;display:flex;padding:var(--qds-popup-padding-top) var(--qds-popup-padding-end) var(--qds-popup-section-padding-bottom) var(--qds-popup-padding-start)}.qds-close-button{margin-left:auto}.qds-footer{padding:var(--qds-popup-section-padding-top) var(--qds-popup-padding-end) var(--qds-popup-padding-bottom) var(--qds-popup-padding-start)}.qds-content{align-items:flex-start;display:flex;flex-direction:column;gap:var(--qds-popup-gap-children-related);height:
|
|
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-popup-elevation);color:inherit;height:inherit;padding:0;width:inherit}.qds-dialog::backdrop{background:initial}.qds-dialog[open]~.qds-backdrop{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-heading{align-items:center;display:flex;padding:var(--qds-popup-padding-top) var(--qds-popup-padding-end) var(--qds-popup-section-padding-bottom) var(--qds-popup-padding-start)}.qds-close-button{margin-left:auto}.qds-footer{padding:var(--qds-popup-section-padding-top) var(--qds-popup-padding-end) var(--qds-popup-padding-bottom) var(--qds-popup-padding-start)}.qds-content{align-items:flex-start;display:flex;flex-direction:column;gap:var(--qds-popup-gap-children-related);height:auto;padding:var(--qds-popup-section-padding-top) var(--qds-popup-padding-end) var(--qds-popup-section-padding-bottom) var(--qds-popup-padding-start)}::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
|
|
|
11
11
|
// SPDX-FileCopyrightText: © 2024 Schneider Electric
|
|
12
12
|
//
|
|
@@ -109,7 +109,7 @@ const Dialog = class {
|
|
|
109
109
|
}
|
|
110
110
|
render() {
|
|
111
111
|
const hasHeading = this.hasTitleSlot || this.closable === true;
|
|
112
|
-
return (h(Host, { key: '
|
|
112
|
+
return (h(Host, { key: 'f313722f78e3f980b74660bac5768007549ae621' }, h("dialog", { key: 'fc46abf07f8fccbae8d623a5999e4ad11f7f5501', 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"), "aria-labelledby": this.hasTitleSlot ? __classPrivateFieldGet(this, _Dialog_titleId, "f") : undefined }, hasHeading && (h("div", { key: '8ace06b599301b3ef3e7d8be4ba909dd1e3ba742', class: "qds-heading" }, this.hasTitleSlot && (h("div", { key: 'e94ee93590cddb1684ee84dfebe74224bb02292d', id: __classPrivateFieldGet(this, _Dialog_titleId, "f") }, h("slot", { key: 'b00cbbf5e62b2ca2731fa0b6e75a069e8e13cc21', name: "title" }))), this.closable === true && (h("qds-icon-button", { key: '3044cae955df2c8adaceddcb07d9254d12106ad3', text: "close dialog", class: "qds-close-button", importance: "subdued", iconName: "close", iconLibrary: "core", onClick: __classPrivateFieldGet(this, _Dialog_handleCloseClick, "f"), ref: __classPrivateFieldGet(this, _Dialog_closeButtonRef, "f") })))), h("div", { key: 'e62a1b6b1a2a4babc08af96cf7445e35298cc2b1', class: "qds-content" }, h("slot", { key: 'f5c6d8733e00a39520584f9883c81287fb7edcc2' })), this.hasFooterSlot && (h("div", { key: 'b812ec757d9afd4a18e82b12ffa3af2157acbf0b', class: "qds-footer" }, h("slot", { key: '4b460b404bca6e97492ce4d5f26d6e74889717fc', name: "footer" })))), h("div", { key: '2d1ef9f26a25beeec31fb5c42c0a0f6635f265e6', class: "qds-backdrop" })));
|
|
113
113
|
}
|
|
114
114
|
show() {
|
|
115
115
|
invariant(__classPrivateFieldGet(this, _Dialog_dialog, "f"));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"qds-dialog.entry.js","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-popup-elevation);\n color: inherit;\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-heading {\n display: flex;\n align-items: center;\n padding: var(--qds-popup-padding-top) var(--qds-popup-padding-end)\n var(--qds-popup-section-padding-bottom) var(--qds-popup-padding-start);\n}\n\n.qds-close-button {\n margin-left: auto;\n}\n\n.qds-footer {\n padding: var(--qds-popup-section-padding-top) var(--qds-popup-padding-end)\n var(--qds-popup-padding-bottom) var(--qds-popup-padding-start);\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 height: calc(\n 100% - var(--qds-popup-section-padding-top) -\n var(--qds-popup-section-padding-bottom)\n );\n padding: var(--qds-popup-section-padding-top) var(--qds-popup-padding-end)\n var(--qds-popup-section-padding-bottom) var(--qds-popup-padding-start);\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 {\n Component,\n Element,\n Event,\n h,\n Host,\n Prop,\n State,\n Watch,\n} from '@stencil/core'\n\nimport type { Attributes } from '../../helpers'\nimport { inheritAriaAttributes, invariant } from '../../helpers'\n\nlet autoIncrementingId = 0\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 /**\n * Adds a close button to the dialog.\n */\n @Prop() public closable?: boolean\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 @State() private hasTitleSlot = false\n\n @State() private hasFooterSlot = false\n\n #inheritedAttributes: Attributes = {}\n\n #dialog?: HTMLDialogElement\n\n #titleId?: string\n\n #closeButton?: HTMLQdsIconButtonElement\n\n @Watch('open')\n protected openChanged(): void {\n if (this.open) this.show()\n else this.close()\n }\n\n public componentWillRender(): void {\n this.hasTitleSlot = !!this.host.querySelector('[slot=\"title\"]')\n this.hasFooterSlot = !!this.host.querySelector('[slot=\"footer\"]')\n }\n\n public componentWillLoad(): void {\n this.#inheritedAttributes = inheritAriaAttributes(this.host)\n\n autoIncrementingId += 1\n this.#titleId = `qds-dialog-title-${autoIncrementingId}`\n }\n\n public componentDidLoad(): void {\n if (this.open) this.show()\n }\n\n public render() {\n const hasHeading = this.hasTitleSlot || this.closable === true\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 aria-labelledby={this.hasTitleSlot ? this.#titleId : undefined}\n >\n {hasHeading && (\n <div class=\"qds-heading\">\n {this.hasTitleSlot && (\n <div id={this.#titleId}>\n <slot name=\"title\" />\n </div>\n )}\n {this.closable === true && (\n <qds-icon-button\n text=\"close dialog\"\n class=\"qds-close-button\"\n importance=\"subdued\"\n iconName=\"close\"\n iconLibrary=\"core\"\n onClick={this.#handleCloseClick}\n ref={this.#closeButtonRef}\n />\n )}\n </div>\n )}\n\n <div class=\"qds-content\">\n <slot />\n </div>\n\n {this.hasFooterSlot && (\n <div class=\"qds-footer\">\n <slot name=\"footer\" />\n </div>\n )}\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 requestAnimationFrame(() => {\n this.#handleFocus()\n })\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 #handleCloseClick = (): void => {\n this.close()\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 readonly #closeButtonRef = (button?: HTMLQdsIconButtonElement): void => {\n this.#closeButton = button\n }\n\n readonly #handleFocus = (): void => {\n if (!this.open) return\n\n const autofocusTarget = this.host.querySelector('[autofocus]')\n if (autofocusTarget instanceof HTMLElement) {\n autofocusTarget.focus()\n return\n }\n if (this.closable === true && this.#closeButton) {\n this.#closeButton.focus()\n }\n }\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"qds-dialog.entry.js","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-popup-elevation);\n color: inherit;\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-heading {\n display: flex;\n align-items: center;\n padding: var(--qds-popup-padding-top) var(--qds-popup-padding-end)\n var(--qds-popup-section-padding-bottom) var(--qds-popup-padding-start);\n}\n\n.qds-close-button {\n margin-left: auto;\n}\n\n.qds-footer {\n padding: var(--qds-popup-section-padding-top) var(--qds-popup-padding-end)\n var(--qds-popup-padding-bottom) var(--qds-popup-padding-start);\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 height: auto;\n padding: var(--qds-popup-section-padding-top) var(--qds-popup-padding-end)\n var(--qds-popup-section-padding-bottom) var(--qds-popup-padding-start);\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 {\n Component,\n Element,\n Event,\n h,\n Host,\n Prop,\n State,\n Watch,\n} from '@stencil/core'\n\nimport type { Attributes } from '../../helpers'\nimport { inheritAriaAttributes, invariant } from '../../helpers'\n\nlet autoIncrementingId = 0\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 /**\n * Adds a close button to the dialog.\n */\n @Prop() public closable?: boolean\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 @State() private hasTitleSlot = false\n\n @State() private hasFooterSlot = false\n\n #inheritedAttributes: Attributes = {}\n\n #dialog?: HTMLDialogElement\n\n #titleId?: string\n\n #closeButton?: HTMLQdsIconButtonElement\n\n @Watch('open')\n protected openChanged(): void {\n if (this.open) this.show()\n else this.close()\n }\n\n public componentWillRender(): void {\n this.hasTitleSlot = !!this.host.querySelector('[slot=\"title\"]')\n this.hasFooterSlot = !!this.host.querySelector('[slot=\"footer\"]')\n }\n\n public componentWillLoad(): void {\n this.#inheritedAttributes = inheritAriaAttributes(this.host)\n\n autoIncrementingId += 1\n this.#titleId = `qds-dialog-title-${autoIncrementingId}`\n }\n\n public componentDidLoad(): void {\n if (this.open) this.show()\n }\n\n public render() {\n const hasHeading = this.hasTitleSlot || this.closable === true\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 aria-labelledby={this.hasTitleSlot ? this.#titleId : undefined}\n >\n {hasHeading && (\n <div class=\"qds-heading\">\n {this.hasTitleSlot && (\n <div id={this.#titleId}>\n <slot name=\"title\" />\n </div>\n )}\n {this.closable === true && (\n <qds-icon-button\n text=\"close dialog\"\n class=\"qds-close-button\"\n importance=\"subdued\"\n iconName=\"close\"\n iconLibrary=\"core\"\n onClick={this.#handleCloseClick}\n ref={this.#closeButtonRef}\n />\n )}\n </div>\n )}\n\n <div class=\"qds-content\">\n <slot />\n </div>\n\n {this.hasFooterSlot && (\n <div class=\"qds-footer\">\n <slot name=\"footer\" />\n </div>\n )}\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 requestAnimationFrame(() => {\n this.#handleFocus()\n })\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 #handleCloseClick = (): void => {\n this.close()\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 readonly #closeButtonRef = (button?: HTMLQdsIconButtonElement): void => {\n this.#closeButton = button\n }\n\n readonly #handleFocus = (): void => {\n if (!this.open) return\n\n const autofocusTarget = this.host.querySelector('[autofocus]')\n if (autofocusTarget instanceof HTMLElement) {\n autofocusTarget.focus()\n return\n }\n if (this.closable === true && this.#closeButton) {\n this.#closeButton.focus()\n }\n }\n}\n"],"names":[],"mappings":";;;;;;;;AAAA,MAAM,SAAS,GAAG,uqDAAuqD;;ACAzrD;AACA;AACA;;;;;;;;;;;;;;;;;;AAiBA,IAAI,kBAAkB,GAAG,CAAC;MAab,MAAM,GAAA,MAAA;AALnB,IAAA,WAAA,CAAA,OAAA,EAAA;;;;AAME;;;;AAIG;AAC4C,QAAA,IAAI,CAAA,IAAA,GAAG,KAAK;AAwB1C,QAAA,IAAY,CAAA,YAAA,GAAG,KAAK;AAEpB,QAAA,IAAa,CAAA,aAAA,GAAG,KAAK;AAEtC,QAAA,2BAAA,CAAA,GAAA,CAAA,IAAA,EAAmC,EAAE,CAAA;QAErC,cAA2B,CAAA,GAAA,CAAA,IAAA,EAAA,MAAA,CAAA;QAE3B,eAAiB,CAAA,GAAA,CAAA,IAAA,EAAA,MAAA,CAAA;QAEjB,mBAAuC,CAAA,GAAA,CAAA,IAAA,EAAA,MAAA,CAAA;QA0F9B,WAAO,CAAA,GAAA,CAAA,IAAA,EAAA,CAAC,MAA0B,KAAU;YACnD,sBAAA,CAAA,IAAI,EAAA,cAAA,EAAW,MAAM,EAAA,GAAA,CAAA;AACvB,SAAC,CAAA;QAEQ,gBAAY,CAAA,GAAA,CAAA,IAAA,EAAA,CAAC,KAAY,KAAU;AAC1C,YAAA,IAAI,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC,gBAAgB;gBAAE,KAAK,CAAC,cAAc,EAAE;AACxE,SAAC,CAAA;AAEQ,QAAA,eAAA,CAAA,GAAA,CAAA,IAAA,EAAW,MAAW;YAC7B,SAAS,CAAC,sBAAA,CAAA,IAAI,EAAA,cAAA,EAAA,GAAA,CAAQ,CAAC;AAEvB,YAAA,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE;AACxB,YAAA,IAAI,CAAC,IAAI,GAAG,sBAAA,CAAA,IAAI,EAAQ,cAAA,EAAA,GAAA,CAAA,CAAC,IAAI;AAC/B,SAAC,CAAA;AAEQ,QAAA,wBAAA,CAAA,GAAA,CAAA,IAAA,EAAoB,MAAW;YACtC,IAAI,CAAC,KAAK,EAAE;AACd,SAAC,CAAA;QAEQ,gBAAY,CAAA,GAAA,CAAA,IAAA,EAAA,CAAC,KAAY,KAAU;YAC1C,IACE,CAAC,KAAK,YAAY,WAAW;AAC3B,iBAAC,KAAK,CAAC,SAAS,YAAY,iBAAiB;AAC3C,qBAAC,KAAK,CAAC,SAAS,YAAY,gBAAgB;wBAC1C,KAAK,CAAC,SAAS,CAAC,UAAU,KAAK,QAAQ,CAAC,CAAC;AAC/C,iBAAC,KAAK,CAAC,MAAM,YAAY,eAAe;oBACtC,KAAK,CAAC,MAAM,CAAC,MAAM,KAAK,QAAQ,CAAC,EACnC;gBACA,KAAK,CAAC,cAAc,EAAE;gBACtB,IAAI,CAAC,KAAK,EAAE;;AAEhB,SAAC,CAAA;QAEQ,sBAAkB,CAAA,GAAA,CAAA,IAAA,EAAA,CAAC,MAAiC,KAAU;YACrE,sBAAA,CAAA,IAAI,EAAA,mBAAA,EAAgB,MAAM,EAAA,GAAA,CAAA;AAC5B,SAAC,CAAA;AAEQ,QAAA,mBAAA,CAAA,GAAA,CAAA,IAAA,EAAe,MAAW;YACjC,IAAI,CAAC,IAAI,CAAC,IAAI;gBAAE;YAEhB,MAAM,eAAe,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,aAAa,CAAC;AAC9D,YAAA,IAAI,eAAe,YAAY,WAAW,EAAE;gBAC1C,eAAe,CAAC,KAAK,EAAE;gBACvB;;AAEF,YAAA,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,IAAI,sBAAA,CAAA,IAAI,EAAa,mBAAA,EAAA,GAAA,CAAA,EAAE;gBAC/C,sBAAA,CAAA,IAAI,EAAA,mBAAA,EAAA,GAAA,CAAa,CAAC,KAAK,EAAE;;AAE7B,SAAC,CAAA;AACF;IAxIW,WAAW,GAAA;QACnB,IAAI,IAAI,CAAC,IAAI;YAAE,IAAI,CAAC,IAAI,EAAE;;YACrB,IAAI,CAAC,KAAK,EAAE;;IAGZ,mBAAmB,GAAA;AACxB,QAAA,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,gBAAgB,CAAC;AAC/D,QAAA,IAAI,CAAC,aAAa,GAAG,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,iBAAiB,CAAC;;IAG5D,iBAAiB,GAAA;AACtB,QAAA,sBAAA,CAAA,IAAI,+BAAwB,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,EAAA,GAAA,CAAA;QAE5D,kBAAkB,IAAI,CAAC;QACvB,sBAAA,CAAA,IAAI,EAAY,eAAA,EAAA,CAAoB,iBAAA,EAAA,kBAAkB,CAAE,CAAA,MAAA;;IAGnD,gBAAgB,GAAA;QACrB,IAAI,IAAI,CAAC,IAAI;YAAE,IAAI,CAAC,IAAI,EAAE;;IAGrB,MAAM,GAAA;QACX,MAAM,UAAU,GAAG,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI;AAC9D,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CACE,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,YAAY,EAClB,GAAG,EAAE,sBAAA,CAAA,IAAI,EAAK,WAAA,EAAA,GAAA,CAAA,EACd,QAAQ,EAAE,sBAAA,CAAA,IAAI,EAAU,gBAAA,EAAA,GAAA,CAAA,EACxB,OAAO,EAAE,sBAAA,CAAA,IAAI,EAAS,eAAA,EAAA,GAAA,CAAA,EACtB,QAAQ,EAAE,sBAAA,CAAA,IAAI,EAAU,gBAAA,EAAA,GAAA,CAAA,EAAA,GAEpB,uBAAA,IAAI,EAAA,2BAAA,EAAA,GAAA,CAAqB,qBACZ,IAAI,CAAC,YAAY,GAAG,sBAAA,CAAA,IAAI,uBAAS,GAAG,SAAS,EAAA,EAE7D,UAAU,KACT,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,aAAa,EAAA,EACrB,IAAI,CAAC,YAAY,KAChB,4DAAK,EAAE,EAAE,sBAAA,CAAA,IAAI,EAAS,eAAA,EAAA,GAAA,CAAA,EAAA,EACpB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,OAAO,EAAA,CAAG,CACjB,CACP,EACA,IAAI,CAAC,QAAQ,KAAK,IAAI,KACrB,wEACE,IAAI,EAAC,cAAc,EACnB,KAAK,EAAC,kBAAkB,EACxB,UAAU,EAAC,SAAS,EACpB,QAAQ,EAAC,OAAO,EAChB,WAAW,EAAC,MAAM,EAClB,OAAO,EAAE,sBAAA,CAAA,IAAI,gCAAkB,EAC/B,GAAG,EAAE,sBAAA,CAAA,IAAI,8BAAgB,EACzB,CAAA,CACH,CACG,CACP,EAED,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,aAAa,EAAA,EACtB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAQ,CACJ,EAEL,IAAI,CAAC,aAAa,KACjB,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,YAAY,EAAA,EACrB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,QAAQ,EAAG,CAAA,CAClB,CACP,CACM,EACT,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,cAAc,EAAG,CAAA,CACvB;;IAIJ,IAAI,GAAA;QACT,SAAS,CAAC,sBAAA,CAAA,IAAI,EAAA,cAAA,EAAA,GAAA,CAAQ,CAAC;QAEvB,sBAAA,CAAA,IAAI,EAAA,cAAA,EAAA,GAAA,CAAQ,CAAC,SAAS,EAAE;AACxB,QAAA,IAAI,CAAC,IAAI,GAAG,sBAAA,CAAA,IAAI,EAAQ,cAAA,EAAA,GAAA,CAAA,CAAC,IAAI;QAC7B,qBAAqB,CAAC,MAAK;AACzB,YAAA,sBAAA,CAAA,IAAI,EAAA,mBAAA,EAAA,GAAA,CAAa,CAAjB,IAAA,CAAA,IAAI,CAAe;AACrB,SAAC,CAAC;;IAGG,KAAK,GAAA;QACV,SAAS,CAAC,sBAAA,CAAA,IAAI,EAAA,cAAA,EAAA,GAAA,CAAQ,CAAC;QAEvB,sBAAA,CAAA,IAAI,EAAA,cAAA,EAAA,GAAA,CAAQ,CAAC,KAAK,EAAE;;;;;;;;;;;;"}
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
* SPDX-License-Identifier: Apache-2.0
|
|
5
5
|
*/
|
|
6
6
|
import { r as registerInstance, h, c as createEvent, g as getElement } from './index-Hg1Liloy.js';
|
|
7
|
-
import { p as pickFocusEventAttributes } from './helpers-
|
|
7
|
+
import { p as pickFocusEventAttributes } from './helpers-eFD8hV6J.js';
|
|
8
8
|
|
|
9
9
|
const dividerCss = ":host([hidden]){display:none!important}:host{display:block}.qds-divider{border:none;height:var(--qds-control-border-width);margin:0;width:100%}.qds-vertical{height:100%;width:var(--qds-control-border-width)}[data-importance=standard]{background-color:var(--qds-theme-divider-standard)}[data-importance=emphasized]{background-color:var(--qds-theme-divider-emphasized)}[data-importance=subdued]{background-color:var(--qds-theme-divider-subdued)}";
|
|
10
10
|
|
|
@@ -48,7 +48,7 @@ const Divider = class {
|
|
|
48
48
|
this.verticalChanged();
|
|
49
49
|
}
|
|
50
50
|
render() {
|
|
51
|
-
return (h("hr", { key: '
|
|
51
|
+
return (h("hr", { key: '377320d6db82fa0188749625cf808243462fc790', class: {
|
|
52
52
|
'qds-divider': true,
|
|
53
53
|
'qds-vertical': this.vertical,
|
|
54
54
|
}, "aria-hidden": "true", "data-importance": __classPrivateFieldGet$1(this, _Divider_instances, "a", _Divider_computedImportance_get) }));
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
*/
|
|
6
6
|
import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-Hg1Liloy.js';
|
|
7
7
|
import { o as offset, f as flip, s as shift, c as computePosition, a as autoUpdate, l as limitShift } from './floating-ui.dom-Bv2vPjgL.js';
|
|
8
|
-
import { h as closestElement, V as VERTICAL_MOVE_KEYS, j as ignorePromise, k as propertyToPx, r as resolveTarget } from './helpers-
|
|
8
|
+
import { h as closestElement, V as VERTICAL_MOVE_KEYS, j as ignorePromise, k as propertyToPx, r as resolveTarget } from './helpers-eFD8hV6J.js';
|
|
9
9
|
|
|
10
10
|
const dropdownCss = ":host([hidden]){display:none!important}:host{background-color:var(--qds-theme-popup-background);border:none;border-radius:var(--qds-popup-border-radius);box-shadow:var(--qds-popup-elevation);box-sizing:border-box;display:inline-block;inset:unset;margin:0;overflow:initial;padding:0}";
|
|
11
11
|
|
|
@@ -340,7 +340,7 @@ const Dropdown = class {
|
|
|
340
340
|
__classPrivateFieldGet(this, _Dropdown_instances, "m", _Dropdown_disconnectReferenceElement).call(this);
|
|
341
341
|
}
|
|
342
342
|
render() {
|
|
343
|
-
return (h(Host, { key: '
|
|
343
|
+
return (h(Host, { key: '818208411addc4dea30191c3d4941b214144def0', onKeyDown: __classPrivateFieldGet(this, _Dropdown_onKeydown, "f"), onFocusout: __classPrivateFieldGet(this, _Dropdown_onFocusout, "f") }, h("slot", { key: 'd909ca090df9e4eaca458b00984d59ecd63cc7da', onSlotchange: __classPrivateFieldGet(this, _Dropdown_onSlotchange, "f") })));
|
|
344
344
|
}
|
|
345
345
|
static get delegatesFocus() { return true; }
|
|
346
346
|
get host() { return getElement(this); }
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
* SPDX-License-Identifier: Apache-2.0
|
|
5
5
|
*/
|
|
6
6
|
import { r as registerInstance, h, g as getElement } from './index-Hg1Liloy.js';
|
|
7
|
-
import { c as inheritAriaAttributes } from './helpers-
|
|
7
|
+
import { c as inheritAriaAttributes } from './helpers-eFD8hV6J.js';
|
|
8
8
|
|
|
9
9
|
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-form-message.qds-inline{align-items:flex-start}.qds-icon-background,.qds-icon-container{align-items:center;display:flex}.qds-icon-background{background-color:var(--qds-theme-feedback-action-destructive-contrast);border-radius:var(--qds-control-rounded-border-radius)}.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-form-small-text)}.qds-icon-container[data-size=small]{height:var(--qds-control-small-icon-crop-height)}.qds-icon[data-size=small]{height:var(--qds-form-small-icon-size);width:var(--qds-form-small-icon-size)}.qds-inline[data-size=small]{min-height:var(--qds-form-input-small-height);padding-block:var(--qds-control-small-padding-auto-height)}[data-size=standard]{font:var(--qds-form-standard-text)}.qds-icon-container[data-size=standard]{height:var(--qds-control-standard-icon-crop-height)}.qds-icon[data-size=standard]{height:var(--qds-form-standard-icon-size);width:var(--qds-form-standard-icon-size)}.qds-inline[data-size=standard]{min-height:var(--qds-form-input-standard-height);padding-block:var(--qds-control-standard-padding-auto-height)}[data-size=large]{font:var(--qds-form-large-text)}.qds-icon-container[data-size=large]{height:var(--qds-control-large-icon-crop-height)}.qds-icon[data-size=large]{height:var(--qds-form-large-icon-size);width:var(--qds-form-large-icon-size)}.qds-inline[data-size=large]{min-height:var(--qds-form-input-large-height);padding-block:var(--qds-control-large-padding-auto-height)}.qds-icon[data-status=error],.qds-text[data-status=error]{color:var(--qds-theme-feedback-result-failure)}[data-status=info].qds-icon{color:var(--qds-theme-feedback-message-informational)}.qds-icon[data-status=success],.qds-text[data-status=success]{color:var(--qds-theme-feedback-result-success)}[data-status=warning].qds-icon{color:var(--qds-theme-feedback-result-partial-success)}[data-status=neutral]{color:var(--qds-theme-text-subdued)}";
|
|
10
10
|
|
|
@@ -4,9 +4,9 @@
|
|
|
4
4
|
* SPDX-License-Identifier: Apache-2.0
|
|
5
5
|
*/
|
|
6
6
|
import { r as registerInstance, c as createEvent, h, g as getElement } from './index-Hg1Liloy.js';
|
|
7
|
-
import { p as pickFocusEventAttributes, r as resolveTarget } from './helpers-
|
|
7
|
+
import { p as pickFocusEventAttributes, r as resolveTarget } from './helpers-eFD8hV6J.js';
|
|
8
8
|
|
|
9
|
-
const iconTabCss = ":host([hidden]){display:none!important}:host{display:inline-block;line-height:0}[aria-disabled=true]{opacity:var(--qds-theme-disabled);pointer-events:none}:host(:focus-visible){border-radius:var(--qds-focus-border-radius);outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width);outline-offset:calc(var(--qds-focus-border-width)*-1 - var(--qds-focus-border-offset))}.qds-
|
|
9
|
+
const iconTabCss = ":host([hidden]){display:none!important}:host{display:inline-block;line-height:0}[aria-disabled=true]{opacity:var(--qds-theme-disabled);pointer-events:none}:host(:focus-visible){border-radius:var(--qds-focus-border-radius);outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width);outline-offset:calc(var(--qds-focus-border-width)*-1 - var(--qds-focus-border-offset))}.qds-icon-container{align-items:center;display:flex;justify-content:center;position:relative}.qds-icon{flex-shrink:0}.qds-icon:hover{background-color:initial}.qds-selected:active{background-color:var(--qds-theme-interactive-background-selected-pressed)}.qds-icon,.qds-text{color:var(--qds-theme-title)}.qds-badge-indicator{inset-block-start:0;inset-inline-end:0;position:absolute}.qds-badge-counter{inset-block-start:-2px;inset-inline-end:-2px;position:absolute}.qds-icon-tab[data-size=small]{gap:var(--qds-nav-element-small-gap-internal);min-height:var(--qds-nav-element-small-height);min-width:var(--qds-nav-element-small-height)}[data-size=small] .qds-icon-container{height:var(--qds-control-small-height);width:var(--qds-control-small-height)}[data-size=small] .qds-icon-container>.qds-icon{height:var(--qds-nav-element-small-icon-size);width:var(--qds-nav-element-small-icon-size)}.qds-icon-tab[data-size=standard]{gap:var(--qds-nav-element-standard-gap-internal);min-height:var(--qds-nav-element-standard-height);min-width:var(--qds-nav-element-standard-height)}[data-size=standard] .qds-icon-container{height:var(--qds-control-standard-height);width:var(--qds-control-standard-height)}[data-size=standard] .qds-icon-container>.qds-icon{height:var(--qds-nav-element-standard-icon-size);width:var(--qds-nav-element-standard-icon-size)}.qds-icon-tab[data-size=large]{gap:var(--qds-nav-element-large-gap-internal);min-height:var(--qds-nav-element-large-height);min-width:var(--qds-nav-element-large-height)}[data-size=large] .qds-icon-container{height:var(--qds-control-large-height);width:var(--qds-control-large-height)}[data-size=large] .qds-icon-container>.qds-icon{height:var(--qds-nav-element-large-icon-size);width:var(--qds-nav-element-large-icon-size)}.qds-selected[data-importance=standard]:after,.qds-selected[data-importance=subdued]:after{border-radius:var(--qds-signature-line-connection-cap-radius);content:\"\";display:block;position:absolute}.qds-selected.qds-indicator-inline-end[data-importance=standard]:after,.qds-selected.qds-indicator-inline-end[data-importance=subdued]:after,.qds-selected.qds-indicator-inline-start[data-importance=standard]:after,.qds-selected.qds-indicator-inline-start[data-importance=subdued]:after{height:100%;width:var(--qds-signature-line-connection-width)}.qds-selected.qds-indicator-inline-end[data-importance=standard]:after,.qds-selected.qds-indicator-inline-end[data-importance=subdued]:after{inset-inline-end:0}.qds-selected.qds-indicator-inline-start[data-importance=standard]:after,.qds-selected.qds-indicator-inline-start[data-importance=subdued]:after{inset-inline-start:0}.qds-selected.qds-indicator-block-end[data-importance=standard]:after,.qds-selected.qds-indicator-block-end[data-importance=subdued]:after,.qds-selected.qds-indicator-block-start[data-importance=standard]:after,.qds-selected.qds-indicator-block-start[data-importance=subdued]:after{height:var(--qds-signature-line-connection-width);width:100%}.qds-selected.qds-indicator-block-end[data-importance=standard]:after,.qds-selected.qds-indicator-block-end[data-importance=subdued]:after{bottom:0}.qds-selected.qds-indicator-block-start[data-importance=standard]:after,.qds-selected.qds-indicator-block-start[data-importance=subdued]:after{top:0}[data-importance=standard]:hover:after{background-color:var(--qds-theme-signature-color-hover)}[data-importance=standard]:active:after{background-color:var(--qds-theme-signature-color-pressed)}.qds-selected[data-importance=standard]:after{background-color:var(--qds-theme-signature-color-default)}[data-importance=standard] .qds-selected .qds-icon{color:var(--qds-theme-title)}.qds-selected[data-importance=subdued]:after,[data-importance=subdued] :active:after{background-color:var(--qds-theme-link-subdued-pressed)}[data-importance=subdued]:hover:after{background-color:var(--qds-theme-link-subdued-hover)}.qds-selected[data-importance=subdued]:after{background-color:var(\n --qds-theme-nav-element-selection-indicator-background-subdued\n )}.qds-icon-tab{align-items:center;background-color:initial;border:none;cursor:pointer;display:flex;justify-content:center;position:relative;text-align:initial}.qds-icon-tab:any-link{-webkit-text-decoration:none;text-decoration:none}.qds-icon-tab:hover{background-color:var(--qds-theme-interactive-background-hover)}.qds-icon-tab:active{background-color:var(--qds-theme-interactive-background-pressed)}.qds-icon-tab:focus-visible{border-radius:var(--qds-focus-border-radius);outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width);outline-offset:calc(var(--qds-focus-border-width)*-1 - var(--qds-focus-border-offset))}.qds-hidden{display:none}";
|
|
10
10
|
|
|
11
11
|
// SPDX-FileCopyrightText: © 2026 Schneider Electric
|
|
12
12
|
//
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"qds-icon-tab.entry.js","sources":["src/components/icon-tab/icon-tab.css?tag=qds-icon-tab&encapsulation=shadow","src/components/icon-tab/icon-tab.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2026 Schneider Electric\n *\n * SPDX-License-Identifier: Apache-2.0\n */\n\n@import url('../shared.css');\n\n:host {\n display: inline-block;\n line-height: 0;\n}\n\n[aria-disabled='true'] {\n opacity: var(--qds-theme-disabled);\n pointer-events: none;\n}\n\n:host(:focus-visible) {\n outline: var(--qds-theme-focus-border) solid var(--qds-focus-border-width);\n border-radius: var(--qds-focus-border-radius);\n outline-offset: calc(\n -1 * var(--qds-focus-border-width) - var(--qds-focus-border-offset)\n );\n}\n\n.qds-target {\n appearance: none;\n border: none;\n padding: 0;\n cursor: pointer;\n pointer-events: auto;\n background-color: transparent;\n\n &:disabled {\n pointer-events: none;\n }\n\n &:focus-visible {\n outline: var(--qds-theme-focus-border) solid var(--qds-focus-border-width);\n border-radius: var(--qds-focus-border-radius);\n outline-offset: var(--qds-focus-border-offset);\n }\n}\n\n.qds-icon-container {\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.qds-icon:hover {\n background-color: transparent;\n}\n\n.qds-target-icon {\n color: var(--qds-theme-control-text-standard);\n}\n\n.qds-icon,\n.qds-target-icon {\n flex-shrink: 0;\n}\n\n.qds-selected {\n &:active {\n background-color: var(--qds-theme-interactive-background-selected-pressed);\n }\n}\n\n.qds-target,\n.qds-icon-tab {\n display: flex;\n}\n\n.qds-icon,\n.qds-text {\n color: var(--qds-theme-title);\n}\n\n.qds-badge-indicator {\n position: absolute;\n inset-block-start: 0;\n inset-inline-end: 0;\n}\n\n.qds-badge-counter {\n position: absolute;\n inset-block-start: -2px;\n inset-inline-end: -2px;\n}\n\n[data-size='small'] {\n &.qds-icon-tab {\n min-height: var(--qds-nav-element-small-height);\n min-width: var(--qds-nav-element-small-height);\n gap: var(--qds-nav-element-small-gap-internal);\n }\n\n &.qds-target-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-icon-container {\n height: var(--qds-control-small-height);\n width: var(--qds-control-small-height);\n\n & > .qds-icon {\n height: var(--qds-nav-element-small-icon-size);\n width: var(--qds-nav-element-small-icon-size);\n }\n }\n}\n\n[data-size='standard'] {\n &.qds-icon-tab {\n min-height: var(--qds-nav-element-standard-height);\n min-width: var(--qds-nav-element-standard-height);\n gap: var(--qds-nav-element-standard-gap-internal);\n }\n\n &.qds-target-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-icon-container {\n height: var(--qds-control-standard-height);\n width: var(--qds-control-standard-height);\n\n & > .qds-icon {\n height: var(--qds-nav-element-standard-icon-size);\n width: var(--qds-nav-element-standard-icon-size);\n }\n }\n}\n\n[data-size='large'] {\n &.qds-icon-tab {\n min-height: var(--qds-nav-element-large-height);\n min-width: var(--qds-nav-element-large-height);\n gap: var(--qds-nav-element-large-gap-internal);\n }\n\n &.qds-target-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-icon-container {\n height: var(--qds-control-large-height);\n width: var(--qds-control-large-height);\n\n & > .qds-icon {\n height: var(--qds-nav-element-large-icon-size);\n width: var(--qds-nav-element-large-icon-size);\n }\n }\n}\n\n[data-importance='subdued'],\n[data-importance='standard'] {\n &.qds-selected {\n &::after {\n border-radius: var(--qds-signature-line-connection-cap-radius);\n content: '';\n display: block;\n position: absolute;\n }\n\n &.qds-indicator-inline-end::after,\n &.qds-indicator-inline-start::after {\n width: var(--qds-signature-line-connection-width);\n height: 100%;\n }\n\n &.qds-indicator-inline-end::after {\n inset-inline-end: 0;\n }\n\n &.qds-indicator-inline-start::after {\n inset-inline-start: 0;\n }\n\n &.qds-indicator-block-end::after,\n &.qds-indicator-block-start::after {\n width: 100%;\n height: var(--qds-signature-line-connection-width);\n }\n\n &.qds-indicator-block-end::after {\n bottom: 0;\n }\n\n &.qds-indicator-block-start::after {\n top: 0;\n }\n }\n}\n\n[data-importance='standard'] {\n &:hover {\n &::after {\n background-color: var(--qds-theme-signature-color-hover);\n }\n }\n\n &:active {\n &::after {\n background-color: var(--qds-theme-signature-color-pressed);\n }\n }\n\n &.qds-selected {\n &::after {\n background-color: var(--qds-theme-signature-color-default);\n }\n }\n\n .qds-selected .qds-icon {\n color: var(--qds-theme-title);\n }\n}\n\n[data-importance='subdued'] {\n &.qds-selected,\n :active {\n &::after {\n background-color: var(--qds-theme-link-subdued-pressed);\n }\n }\n\n &:hover {\n &::after {\n background-color: var(--qds-theme-link-subdued-hover);\n }\n }\n\n &.qds-selected::after {\n background-color: var(\n --qds-theme-nav-element-selection-indicator-background-subdued\n );\n }\n}\n\n.qds-icon-tab {\n position: relative;\n align-items: center;\n justify-content: center;\n border: none;\n background-color: transparent;\n cursor: pointer;\n text-align: initial;\n\n &:any-link {\n text-decoration: none;\n }\n\n &:hover {\n background-color: var(--qds-theme-interactive-background-hover);\n }\n\n &:active {\n background-color: var(--qds-theme-interactive-background-pressed);\n }\n\n &:focus-visible {\n outline: var(--qds-theme-focus-border) solid var(--qds-focus-border-width);\n border-radius: var(--qds-focus-border-radius);\n outline-offset: calc(\n -1 * var(--qds-focus-border-width) - var(--qds-focus-border-offset)\n );\n }\n}\n\n.qds-hidden {\n display: none;\n}\n","// SPDX-FileCopyrightText: © 2026 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 { QdsFocusEventDetail } from '../../helpers'\nimport { pickFocusEventAttributes, resolveTarget } from '../../helpers'\nimport type { Importance, Size } from '../shared'\n\nexport type Placement = 'bottom' | 'left' | 'right' | 'top'\n\nexport type IndicatorPosition =\n | 'block-end'\n | 'block-start'\n | 'inline-end'\n | 'inline-start'\n\nexport type IconTabImportance = Exclude<Importance, 'emphasized'>\n\nconst isCounter = (value: unknown): value is number =>\n typeof value === 'string'\n ? !Number.isNaN(Number.parseFloat(value))\n : typeof value === 'number'\n\nconst isIndicator = (value: unknown): value is '' | true =>\n value === '' || value === true\n\nlet autoIncrementingId = 1\n\n/**\n * <qds-icon-tab> is a navigational element that is used in different horizontal or vertical navigation bars\n * (Main Navigation, secondary navigation, Tab bar, etc.)\n * as trigger points for opening a menu list or switching content in Tab bar.\n *\n * @see https://quartz.se.com/build/components/icon-tab\n */\n@Component({\n tag: 'qds-icon-tab',\n shadow: true,\n styleUrl: 'icon-tab.css',\n})\nexport class IconTab implements ComponentInterface {\n /**\n * Displays an indicator if `true` or the empty string. Otherwise, displays a\n * counter badge if a number or string representing a number is used.\n */\n @Prop() public readonly badge?: number | string | true\n\n /**\n * The tab's counter importance.\n */\n @Prop()\n public readonly badgeCounterImportance?: HTMLQdsBadgeCounterElement['importance'] =\n 'standard'\n\n /**\n * The indicator or counter badge's accessible text that will be used by\n * screen readers.\n */\n @Prop() public readonly badgeDescription?: string\n\n /**\n * The indicator's status.\n */\n @Prop()\n public readonly badgeIndicatorStatus?: HTMLQdsBadgeIndicatorElement['status'] =\n 'neutral'\n\n /**\n * Prevents the tab from being interacted with: it cannot be\n * selected or focused.\n */\n @Prop() public readonly disabled?: boolean\n\n /**\n * The name of a registered icon library.\n */\n @Prop() public readonly iconLibrary: string = 'default'\n\n /**\n * The name of the icon to render.\n *\n * Available names depend on the icon library being used.\n */\n @Prop() public readonly iconName!: string\n\n /**\n * The tab's importance.\n */\n @Prop() public readonly importance?: IconTabImportance = 'standard'\n\n /**\n * The tab's indicator position.\n */\n @Prop() public readonly indicatorPosition?: IndicatorPosition = 'block-end'\n\n /**\n * The tab panel element associated with this tab. The `panel` specified\n * can be any of the following:\n *\n * - A CSS selector string\n * - A reference to an [`Element`][]\n * - A function returning a reference to an [`Element`][] or a CSS selector\n * string\n *\n * [`Element`]: https://developer.mozilla.org/docs/Web/API/Element\n */\n @Prop() public readonly panel!: Element | string | (() => Element | string)\n\n /**\n * Whether or not the tab is selected.\n */\n @Prop() public selected = false\n\n /**\n * The tab's size.\n */\n @Prop() public readonly size?: Size = 'standard'\n\n /**\n * Icon tab's accessible name.\n */\n @Prop() public readonly text?: string\n\n /**\n * When set, the underlying tab will be rendered as an `<a>` with this\n * `href` instead of a `<button>`.\n *\n * This property has no effect if the tab has an `action`.\n *\n * @webnative\n */\n @Prop() public readonly href?: string\n\n /**\n * Emitted when the tab loses focus.\n */\n @Event({ eventName: 'qdsBlur', bubbles: false, cancelable: false })\n private readonly blurEmitter!: EventEmitter<QdsFocusEventDetail>\n\n /**\n * Emitted when the tab gains focus.\n */\n @Event({ eventName: 'qdsFocus', bubbles: false, cancelable: false })\n private readonly focusEmitter!: EventEmitter<QdsFocusEventDetail>\n\n @Element() private readonly host!: HTMLElement\n\n @State() private tabIndex?: number\n\n @State() private isIndicatorOnTop = false\n\n @AttachInternals() private readonly internals!: ElementInternals\n\n #div?: HTMLDivElement\n\n #panel?: Element\n\n #iconTab?: HTMLElement\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 #computedImportance(): IconTabImportance {\n return this.importance ?? 'standard'\n }\n\n get #parentLayer(): string {\n return this.host.closest('qds-tabbar')?.layer ?? 'main'\n }\n\n get #parentLevel(): string {\n return this.host.closest('qds-tabbar')?.level ?? 'root'\n }\n\n get #computedDisabled(): boolean {\n return this.disabled ?? false\n }\n\n get #placement(): Placement {\n switch (this.indicatorPosition) {\n case 'inline-start': {\n return 'left'\n }\n case 'inline-end': {\n return 'right'\n }\n case 'block-start': {\n return 'top'\n }\n default: {\n return 'bottom'\n }\n }\n }\n\n @Watch('panel')\n protected panelChanged(): void {\n this.disconnectedCallback()\n\n const panel = resolveTarget(this.panel)\n if (!(panel instanceof globalThis.Element)) return\n this.#panel = panel\n\n const tab = this.host.shadowRoot?.querySelector('[role=\"tab\"]')\n if (tab) tab.setAttribute('aria-controls', this.#panel.id)\n\n if (this.#panel.role === null) this.#panel.role = 'tabpanel'\n if (this.#panel.getAttribute('aria-labelledby') === null)\n this.#panel.setAttribute('aria-labelledby', this.host.id)\n this.#panel.setAttribute(\n 'tabindex',\n this.#panel.getAttribute('tabindex') ?? '0',\n )\n }\n\n @Listen('click')\n protected onClick(event: MouseEvent): void {\n if (this.#computedDisabled) event.stopImmediatePropagation()\n }\n\n @Watch('tabindex')\n protected tabindexChanged(newValue: string): void {\n const parsedValue = Number.parseInt(newValue, 10)\n this.tabIndex =\n parsedValue === 0 || Number.isNaN(parsedValue) ? undefined : parsedValue\n }\n\n public componentWillLoad(): void {\n this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0')\n this.host.id ||= `qds-icon-tab-${autoIncrementingId}`\n autoIncrementingId += 1\n\n this.#defineTab()\n }\n\n public componentWillRender(): void {\n const isPanelRoot =\n this.#parentLayer === 'panel' && this.#parentLevel === 'root'\n const isMainSubsection =\n this.#parentLayer === 'main' && this.#parentLevel === 'subsection'\n\n this.isIndicatorOnTop = isPanelRoot || isMainSubsection\n }\n\n public componentDidLoad(): void {\n this.panelChanged()\n }\n\n public disconnectedCallback(): void {\n if (!this.#panel) return\n\n const tab = this.host.shadowRoot?.querySelector('[role=\"tab\"]')\n if (tab) tab.removeAttribute('aria-controls')\n\n if (this.#panel.role === 'tabpanel')\n // eslint-disable-next-line unicorn/no-null\n this.#panel.role = null\n if (this.#panel.getAttribute('aria-labelledby') === this.host.id)\n this.#panel.removeAttribute('aria-labelledby')\n this.#panel.removeAttribute('tabindex')\n }\n\n public render() {\n const isLink =\n this.href === undefined ? this.indicatorPosition : 'block-start'\n const Tag = isLink ? 'a' : 'div'\n return (\n <div\n aria-disabled={this.#computedDisabled ? 'true' : undefined}\n class={{\n 'qds-selected': this.selected,\n }}\n data-size={this.#computedSize}\n data-importance={this.#computedImportance}\n ref={this.#ref}\n >\n <Tag\n ref={this.#iconTabRef}\n aria-disabled={this.#computedDisabled ? 'true' : undefined}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...(isLink ? undefined : { disabled: this.disabled })}\n onBlur={this.#onBlur}\n onFocus={this.#onFocus}\n class={{\n 'qds-icon-tab': true,\n 'qds-selected': this.selected,\n [`qds-indicator-${this.indicatorPosition}`]: true,\n }}\n role={isLink ? undefined : 'tab'}\n aria-current={isLink && this.selected ? 'true' : undefined}\n aria-expanded={isLink ? undefined : this.selected ? 'true' : 'false'}\n data-importance={this.#computedImportance}\n data-size={this.#computedSize}\n href={isLink ? this.href : undefined}\n >\n <div class=\"qds-icon-container\">\n <qds-icon\n aria-hidden=\"true\"\n class=\"qds-icon\"\n library={this.iconLibrary}\n name={this.iconName}\n />\n {isIndicator(this.badge) && (\n <qds-badge-indicator\n class=\"qds-badge-indicator\"\n status={this.badgeIndicatorStatus}\n description={this.badgeDescription}\n size={this.#computedSize}\n strokeRing\n />\n )}\n {isCounter(this.badge) && (\n <qds-badge-counter\n class=\"qds-badge-counter\"\n description={this.badgeDescription}\n importance={this.badgeCounterImportance}\n size={this.#computedSize}\n strokeRing\n value={this.badge}\n />\n )}\n </div>\n </Tag>\n <qds-tooltip placement={this.#placement} ref={this.#tooltipRef}>\n <qds-title layer=\"accessory\" level=\"root\">\n {this.text}\n </qds-title>\n </qds-tooltip>\n </div>\n )\n }\n\n readonly #ref = (div?: HTMLDivElement): void => {\n this.#div = div\n }\n\n readonly #iconTabRef = (tab?: HTMLElement): void => {\n this.#iconTab = tab\n }\n\n readonly #tooltipRef = (tooltip?: HTMLQdsTooltipElement): void => {\n if (tooltip)\n // eslint-disable-next-line no-param-reassign\n tooltip.target = this.#div\n }\n\n readonly #onBlur = (event: FocusEvent): void => {\n this.blurEmitter.emit(pickFocusEventAttributes(event))\n }\n\n readonly #onFocus = (event: FocusEvent): void => {\n this.focusEmitter.emit(pickFocusEventAttributes(event))\n }\n\n readonly #defineTab = (): void => {\n this.internals.role = 'tab'\n this.#defineGetter('tab', () => this.#iconTab)\n }\n\n #defineGetter(p: PropertyKey, get: () => unknown): void {\n Object.defineProperty(this.host, p, { enumerable: true, get })\n }\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"qds-icon-tab.entry.js","sources":["src/components/icon-tab/icon-tab.css?tag=qds-icon-tab&encapsulation=shadow","src/components/icon-tab/icon-tab.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2026 Schneider Electric\n *\n * SPDX-License-Identifier: Apache-2.0\n */\n\n@import url('../shared.css');\n\n:host {\n display: inline-block;\n line-height: 0;\n}\n\n[aria-disabled='true'] {\n opacity: var(--qds-theme-disabled);\n pointer-events: none;\n}\n\n:host(:focus-visible) {\n outline: var(--qds-theme-focus-border) solid var(--qds-focus-border-width);\n border-radius: var(--qds-focus-border-radius);\n outline-offset: calc(\n -1 * var(--qds-focus-border-width) - var(--qds-focus-border-offset)\n );\n}\n\n.qds-icon-container {\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.qds-icon {\n flex-shrink: 0;\n}\n\n.qds-icon:hover {\n background-color: transparent;\n}\n\n.qds-selected {\n &:active {\n background-color: var(--qds-theme-interactive-background-selected-pressed);\n }\n}\n\n.qds-icon,\n.qds-text {\n color: var(--qds-theme-title);\n}\n\n.qds-badge-indicator {\n position: absolute;\n inset-block-start: 0;\n inset-inline-end: 0;\n}\n\n.qds-badge-counter {\n position: absolute;\n inset-block-start: -2px;\n inset-inline-end: -2px;\n}\n\n[data-size='small'] {\n &.qds-icon-tab {\n min-height: var(--qds-nav-element-small-height);\n min-width: var(--qds-nav-element-small-height);\n gap: var(--qds-nav-element-small-gap-internal);\n }\n\n .qds-icon-container {\n height: var(--qds-control-small-height);\n width: var(--qds-control-small-height);\n\n & > .qds-icon {\n height: var(--qds-nav-element-small-icon-size);\n width: var(--qds-nav-element-small-icon-size);\n }\n }\n}\n\n[data-size='standard'] {\n &.qds-icon-tab {\n min-height: var(--qds-nav-element-standard-height);\n min-width: var(--qds-nav-element-standard-height);\n gap: var(--qds-nav-element-standard-gap-internal);\n }\n\n .qds-icon-container {\n height: var(--qds-control-standard-height);\n width: var(--qds-control-standard-height);\n\n & > .qds-icon {\n height: var(--qds-nav-element-standard-icon-size);\n width: var(--qds-nav-element-standard-icon-size);\n }\n }\n}\n\n[data-size='large'] {\n &.qds-icon-tab {\n min-height: var(--qds-nav-element-large-height);\n min-width: var(--qds-nav-element-large-height);\n gap: var(--qds-nav-element-large-gap-internal);\n }\n\n .qds-icon-container {\n height: var(--qds-control-large-height);\n width: var(--qds-control-large-height);\n\n & > .qds-icon {\n height: var(--qds-nav-element-large-icon-size);\n width: var(--qds-nav-element-large-icon-size);\n }\n }\n}\n\n[data-importance='subdued'],\n[data-importance='standard'] {\n &.qds-selected {\n &::after {\n border-radius: var(--qds-signature-line-connection-cap-radius);\n content: '';\n display: block;\n position: absolute;\n }\n\n &.qds-indicator-inline-end::after,\n &.qds-indicator-inline-start::after {\n width: var(--qds-signature-line-connection-width);\n height: 100%;\n }\n\n &.qds-indicator-inline-end::after {\n inset-inline-end: 0;\n }\n\n &.qds-indicator-inline-start::after {\n inset-inline-start: 0;\n }\n\n &.qds-indicator-block-end::after,\n &.qds-indicator-block-start::after {\n width: 100%;\n height: var(--qds-signature-line-connection-width);\n }\n\n &.qds-indicator-block-end::after {\n bottom: 0;\n }\n\n &.qds-indicator-block-start::after {\n top: 0;\n }\n }\n}\n\n[data-importance='standard'] {\n &:hover {\n &::after {\n background-color: var(--qds-theme-signature-color-hover);\n }\n }\n\n &:active {\n &::after {\n background-color: var(--qds-theme-signature-color-pressed);\n }\n }\n\n &.qds-selected {\n &::after {\n background-color: var(--qds-theme-signature-color-default);\n }\n }\n\n .qds-selected .qds-icon {\n color: var(--qds-theme-title);\n }\n}\n\n[data-importance='subdued'] {\n &.qds-selected,\n :active {\n &::after {\n background-color: var(--qds-theme-link-subdued-pressed);\n }\n }\n\n &:hover {\n &::after {\n background-color: var(--qds-theme-link-subdued-hover);\n }\n }\n\n &.qds-selected::after {\n background-color: var(\n --qds-theme-nav-element-selection-indicator-background-subdued\n );\n }\n}\n\n.qds-icon-tab {\n display: flex;\n position: relative;\n align-items: center;\n justify-content: center;\n border: none;\n background-color: transparent;\n cursor: pointer;\n text-align: initial;\n\n &:any-link {\n text-decoration: none;\n }\n\n &:hover {\n background-color: var(--qds-theme-interactive-background-hover);\n }\n\n &:active {\n background-color: var(--qds-theme-interactive-background-pressed);\n }\n\n &:focus-visible {\n outline: var(--qds-theme-focus-border) solid var(--qds-focus-border-width);\n border-radius: var(--qds-focus-border-radius);\n outline-offset: calc(\n -1 * var(--qds-focus-border-width) - var(--qds-focus-border-offset)\n );\n }\n}\n\n.qds-hidden {\n display: none;\n}\n","// SPDX-FileCopyrightText: © 2026 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 { QdsFocusEventDetail } from '../../helpers'\nimport { pickFocusEventAttributes, resolveTarget } from '../../helpers'\nimport type { Importance, Size } from '../shared'\n\nexport type Placement = 'bottom' | 'left' | 'right' | 'top'\n\nexport type IndicatorPosition =\n | 'block-end'\n | 'block-start'\n | 'inline-end'\n | 'inline-start'\n\nexport type IconTabImportance = Exclude<Importance, 'emphasized'>\n\nconst isCounter = (value: unknown): value is number =>\n typeof value === 'string'\n ? !Number.isNaN(Number.parseFloat(value))\n : typeof value === 'number'\n\nconst isIndicator = (value: unknown): value is '' | true =>\n value === '' || value === true\n\nlet autoIncrementingId = 1\n\n/**\n * <qds-icon-tab> is a navigational element that is used in different horizontal or vertical navigation bars\n * (Main Navigation, secondary navigation, Tab bar, etc.)\n * as trigger points for opening a menu list or switching content in Tab bar.\n *\n * @see https://quartz.se.com/build/components/icon-tab\n */\n@Component({\n tag: 'qds-icon-tab',\n shadow: true,\n styleUrl: 'icon-tab.css',\n})\nexport class IconTab implements ComponentInterface {\n /**\n * Displays an indicator if `true` or the empty string. Otherwise, displays a\n * counter badge if a number or string representing a number is used.\n */\n @Prop() public readonly badge?: number | string | true\n\n /**\n * The tab's counter importance.\n */\n @Prop()\n public readonly badgeCounterImportance?: HTMLQdsBadgeCounterElement['importance'] =\n 'standard'\n\n /**\n * The indicator or counter badge's accessible text that will be used by\n * screen readers.\n */\n @Prop() public readonly badgeDescription?: string\n\n /**\n * The indicator's status.\n */\n @Prop()\n public readonly badgeIndicatorStatus?: HTMLQdsBadgeIndicatorElement['status'] =\n 'neutral'\n\n /**\n * Prevents the tab from being interacted with: it cannot be\n * selected or focused.\n */\n @Prop() public readonly disabled?: boolean\n\n /**\n * The name of a registered icon library.\n */\n @Prop() public readonly iconLibrary: string = 'default'\n\n /**\n * The name of the icon to render.\n *\n * Available names depend on the icon library being used.\n */\n @Prop() public readonly iconName!: string\n\n /**\n * The tab's importance.\n */\n @Prop() public readonly importance?: IconTabImportance = 'standard'\n\n /**\n * The tab's indicator position.\n */\n @Prop() public readonly indicatorPosition?: IndicatorPosition = 'block-end'\n\n /**\n * The tab panel element associated with this tab. The `panel` specified\n * can be any of the following:\n *\n * - A CSS selector string\n * - A reference to an [`Element`][]\n * - A function returning a reference to an [`Element`][] or a CSS selector\n * string\n *\n * [`Element`]: https://developer.mozilla.org/docs/Web/API/Element\n */\n @Prop() public readonly panel!: Element | string | (() => Element | string)\n\n /**\n * Whether or not the tab is selected.\n */\n @Prop() public selected = false\n\n /**\n * The tab's size.\n */\n @Prop() public readonly size?: Size = 'standard'\n\n /**\n * Icon tab's accessible name.\n */\n @Prop() public readonly text?: string\n\n /**\n * When set, the underlying tab will be rendered as an `<a>` with this\n * `href` instead of a `<button>`.\n *\n * This property has no effect if the tab has an `action`.\n *\n * @webnative\n */\n @Prop() public readonly href?: string\n\n /**\n * Emitted when the tab loses focus.\n */\n @Event({ eventName: 'qdsBlur', bubbles: false, cancelable: false })\n private readonly blurEmitter!: EventEmitter<QdsFocusEventDetail>\n\n /**\n * Emitted when the tab gains focus.\n */\n @Event({ eventName: 'qdsFocus', bubbles: false, cancelable: false })\n private readonly focusEmitter!: EventEmitter<QdsFocusEventDetail>\n\n @Element() private readonly host!: HTMLElement\n\n @State() private tabIndex?: number\n\n @State() private isIndicatorOnTop = false\n\n @AttachInternals() private readonly internals!: ElementInternals\n\n #div?: HTMLDivElement\n\n #panel?: Element\n\n #iconTab?: HTMLElement\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 #computedImportance(): IconTabImportance {\n return this.importance ?? 'standard'\n }\n\n get #parentLayer(): string {\n return this.host.closest('qds-tabbar')?.layer ?? 'main'\n }\n\n get #parentLevel(): string {\n return this.host.closest('qds-tabbar')?.level ?? 'root'\n }\n\n get #computedDisabled(): boolean {\n return this.disabled ?? false\n }\n\n get #placement(): Placement {\n switch (this.indicatorPosition) {\n case 'inline-start': {\n return 'left'\n }\n case 'inline-end': {\n return 'right'\n }\n case 'block-start': {\n return 'top'\n }\n default: {\n return 'bottom'\n }\n }\n }\n\n @Watch('panel')\n protected panelChanged(): void {\n this.disconnectedCallback()\n\n const panel = resolveTarget(this.panel)\n if (!(panel instanceof globalThis.Element)) return\n this.#panel = panel\n\n const tab = this.host.shadowRoot?.querySelector('[role=\"tab\"]')\n if (tab) tab.setAttribute('aria-controls', this.#panel.id)\n\n if (this.#panel.role === null) this.#panel.role = 'tabpanel'\n if (this.#panel.getAttribute('aria-labelledby') === null)\n this.#panel.setAttribute('aria-labelledby', this.host.id)\n this.#panel.setAttribute(\n 'tabindex',\n this.#panel.getAttribute('tabindex') ?? '0',\n )\n }\n\n @Listen('click')\n protected onClick(event: MouseEvent): void {\n if (this.#computedDisabled) event.stopImmediatePropagation()\n }\n\n @Watch('tabindex')\n protected tabindexChanged(newValue: string): void {\n const parsedValue = Number.parseInt(newValue, 10)\n this.tabIndex =\n parsedValue === 0 || Number.isNaN(parsedValue) ? undefined : parsedValue\n }\n\n public componentWillLoad(): void {\n this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0')\n this.host.id ||= `qds-icon-tab-${autoIncrementingId}`\n autoIncrementingId += 1\n\n this.#defineTab()\n }\n\n public componentWillRender(): void {\n const isPanelRoot =\n this.#parentLayer === 'panel' && this.#parentLevel === 'root'\n const isMainSubsection =\n this.#parentLayer === 'main' && this.#parentLevel === 'subsection'\n\n this.isIndicatorOnTop = isPanelRoot || isMainSubsection\n }\n\n public componentDidLoad(): void {\n this.panelChanged()\n }\n\n public disconnectedCallback(): void {\n if (!this.#panel) return\n\n const tab = this.host.shadowRoot?.querySelector('[role=\"tab\"]')\n if (tab) tab.removeAttribute('aria-controls')\n\n if (this.#panel.role === 'tabpanel')\n // eslint-disable-next-line unicorn/no-null\n this.#panel.role = null\n if (this.#panel.getAttribute('aria-labelledby') === this.host.id)\n this.#panel.removeAttribute('aria-labelledby')\n this.#panel.removeAttribute('tabindex')\n }\n\n public render() {\n const isLink =\n this.href === undefined ? this.indicatorPosition : 'block-start'\n const Tag = isLink ? 'a' : 'div'\n return (\n <div\n aria-disabled={this.#computedDisabled ? 'true' : undefined}\n class={{\n 'qds-selected': this.selected,\n }}\n data-size={this.#computedSize}\n data-importance={this.#computedImportance}\n ref={this.#ref}\n >\n <Tag\n ref={this.#iconTabRef}\n aria-disabled={this.#computedDisabled ? 'true' : undefined}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...(isLink ? undefined : { disabled: this.disabled })}\n onBlur={this.#onBlur}\n onFocus={this.#onFocus}\n class={{\n 'qds-icon-tab': true,\n 'qds-selected': this.selected,\n [`qds-indicator-${this.indicatorPosition}`]: true,\n }}\n role={isLink ? undefined : 'tab'}\n aria-current={isLink && this.selected ? 'true' : undefined}\n aria-expanded={isLink ? undefined : this.selected ? 'true' : 'false'}\n data-importance={this.#computedImportance}\n data-size={this.#computedSize}\n href={isLink ? this.href : undefined}\n >\n <div class=\"qds-icon-container\">\n <qds-icon\n aria-hidden=\"true\"\n class=\"qds-icon\"\n library={this.iconLibrary}\n name={this.iconName}\n />\n {isIndicator(this.badge) && (\n <qds-badge-indicator\n class=\"qds-badge-indicator\"\n status={this.badgeIndicatorStatus}\n description={this.badgeDescription}\n size={this.#computedSize}\n strokeRing\n />\n )}\n {isCounter(this.badge) && (\n <qds-badge-counter\n class=\"qds-badge-counter\"\n description={this.badgeDescription}\n importance={this.badgeCounterImportance}\n size={this.#computedSize}\n strokeRing\n value={this.badge}\n />\n )}\n </div>\n </Tag>\n <qds-tooltip placement={this.#placement} ref={this.#tooltipRef}>\n <qds-title layer=\"accessory\" level=\"root\">\n {this.text}\n </qds-title>\n </qds-tooltip>\n </div>\n )\n }\n\n readonly #ref = (div?: HTMLDivElement): void => {\n this.#div = div\n }\n\n readonly #iconTabRef = (tab?: HTMLElement): void => {\n this.#iconTab = tab\n }\n\n readonly #tooltipRef = (tooltip?: HTMLQdsTooltipElement): void => {\n if (tooltip)\n // eslint-disable-next-line no-param-reassign\n tooltip.target = this.#div\n }\n\n readonly #onBlur = (event: FocusEvent): void => {\n this.blurEmitter.emit(pickFocusEventAttributes(event))\n }\n\n readonly #onFocus = (event: FocusEvent): void => {\n this.focusEmitter.emit(pickFocusEventAttributes(event))\n }\n\n readonly #defineTab = (): void => {\n this.internals.role = 'tab'\n this.#defineGetter('tab', () => this.#iconTab)\n }\n\n #defineGetter(p: PropertyKey, get: () => unknown): void {\n Object.defineProperty(this.host, p, { enumerable: true, get })\n }\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
* SPDX-License-Identifier: Apache-2.0
|
|
5
5
|
*/
|
|
6
6
|
import { r as registerInstance, c as createEvent, h, g as getElement } from './index-Hg1Liloy.js';
|
|
7
|
-
import { c as inheritAriaAttributes } from './helpers-
|
|
7
|
+
import { c as inheritAriaAttributes } from './helpers-eFD8hV6J.js';
|
|
8
8
|
import { g as getIconLibrary } from './library-CBfntPWH.js';
|
|
9
9
|
|
|
10
10
|
// SPDX-FileCopyrightText: © 2024 Schneider Electric
|
|
@@ -35,7 +35,7 @@ const requestIcon = (url) => {
|
|
|
35
35
|
return iconPromise;
|
|
36
36
|
};
|
|
37
37
|
|
|
38
|
-
const iconCss = ":host([hidden]){display:none!important}:host{display:inline-block;height:1em;width:1em}.qds-container{position:relative}.qds-icon-wrapper{display:contents}svg{display:block;fill:currentcolor;height:100%;width:100%}
|
|
38
|
+
const iconCss = ":host([hidden]){display:none!important}:host{display:inline-block;height:1em;width:1em}.qds-container{position:relative}.qds-icon-wrapper{display:contents}svg{display:block;fill:currentcolor;height:100%;width:100%}";
|
|
39
39
|
|
|
40
40
|
// SPDX-FileCopyrightText: © 2024 Schneider Electric
|
|
41
41
|
//
|
|
@@ -115,7 +115,7 @@ const Icon = class {
|
|
|
115
115
|
await this.setIcon();
|
|
116
116
|
}
|
|
117
117
|
render() {
|
|
118
|
-
return (h("div", { key: '
|
|
118
|
+
return (h("div", { key: 'e34db03445b6466673f0a5007e56565db0607dad', class: "qds-container" }, h("span", { key: 'ae17bef072c530670209c28570db6f0021d58168', class: "qds-icon-wrapper", innerHTML: this.svg })));
|
|
119
119
|
}
|
|
120
120
|
get host() { return getElement(this); }
|
|
121
121
|
static get watchers() { return {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"qds-icon.entry.js","sources":["src/components/icon/request.ts","src/components/icon/icon.css?tag=qds-icon&encapsulation=shadow","src/components/icon/icon.tsx"],"sourcesContent":["// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\ninterface IconResponse {\n ok: boolean\n status: number\n data: string\n}\n\nconst cachedIconRequests = new Map<\n string,\n IconResponse | Promise<IconResponse>\n>()\n\nconst requestIcon = (url: string): Promise<IconResponse> => {\n const cachedIconRequest = cachedIconRequests.get(url)\n if (cachedIconRequest) return Promise.resolve(cachedIconRequest)\n\n const iconPromise = fetch(url, { mode: 'cors' }).then(async (response) => {\n const iconResponse: IconResponse = {\n ok: response.ok,\n status: response.status,\n data: await response.text(),\n }\n if (response.ok) {\n const div = document.createElement('div')\n div.innerHTML = iconResponse.data\n const child = div.firstElementChild\n iconResponse.data =\n child?.tagName.toLowerCase() === 'svg' ? child.outerHTML : ''\n }\n\n cachedIconRequests.set(url, iconResponse)\n return iconResponse\n })\n cachedIconRequests.set(url, iconPromise)\n return iconPromise\n}\n\nexport default requestIcon\n","/*\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 height: 1em;\n width: 1em;\n}\n\n.qds-container {\n position: relative;\n}\n\n.qds-icon-wrapper {\n display: contents;\n}\n\nsvg {\n display: block;\n fill: currentcolor;\n height: 100%;\n width: 100%;\n}\n
|
|
1
|
+
{"version":3,"file":"qds-icon.entry.js","sources":["src/components/icon/request.ts","src/components/icon/icon.css?tag=qds-icon&encapsulation=shadow","src/components/icon/icon.tsx"],"sourcesContent":["// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\ninterface IconResponse {\n ok: boolean\n status: number\n data: string\n}\n\nconst cachedIconRequests = new Map<\n string,\n IconResponse | Promise<IconResponse>\n>()\n\nconst requestIcon = (url: string): Promise<IconResponse> => {\n const cachedIconRequest = cachedIconRequests.get(url)\n if (cachedIconRequest) return Promise.resolve(cachedIconRequest)\n\n const iconPromise = fetch(url, { mode: 'cors' }).then(async (response) => {\n const iconResponse: IconResponse = {\n ok: response.ok,\n status: response.status,\n data: await response.text(),\n }\n if (response.ok) {\n const div = document.createElement('div')\n div.innerHTML = iconResponse.data\n const child = div.firstElementChild\n iconResponse.data =\n child?.tagName.toLowerCase() === 'svg' ? child.outerHTML : ''\n }\n\n cachedIconRequests.set(url, iconResponse)\n return iconResponse\n })\n cachedIconRequests.set(url, iconPromise)\n return iconPromise\n}\n\nexport default requestIcon\n","/*\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 height: 1em;\n width: 1em;\n}\n\n.qds-container {\n position: relative;\n}\n\n.qds-icon-wrapper {\n display: contents;\n}\n\nsvg {\n display: block;\n fill: currentcolor;\n height: 100%;\n width: 100%;\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, Prop, State, Watch } from '@stencil/core'\n\nimport type { Attributes } from '../../helpers'\nimport { inheritAriaAttributes } from '../../helpers'\nimport { getIconLibrary } from './library'\nimport requestIcon from './request'\n\nlet parser: DOMParser | undefined\n\n/**\n * @experimental\n */\n@Component({\n tag: 'qds-icon',\n shadow: true,\n styleUrl: 'icon.css',\n})\nexport class Icon 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 name!: string\n\n /**\n * The name of a registered icon library.\n */\n @Prop() public readonly library: string = 'default'\n\n /**\n * Emitted when the icon has loaded.\n */\n @Event({ eventName: 'qdsLoad', cancelable: false })\n private readonly loadEmitter!: EventEmitter<void>\n\n /**\n * Emitted when the icon fails to load due to an error.\n */\n @Event({ eventName: 'qdsError', cancelable: false })\n private readonly errorEmitter!: EventEmitter<void>\n\n @Element() private readonly host!: HTMLElement\n\n @State() private svg = ''\n\n #inheritedAttributes: Attributes = {}\n\n @Watch('name')\n @Watch('library')\n private async setIcon(): Promise<void> {\n if (!this.name) return\n\n const library = getIconLibrary(this.library)\n if (!library) return\n\n const url = library.resolver(this.name)\n if (!url) {\n this.svg = ''\n return\n }\n\n try {\n const request = await requestIcon(url)\n if (!request.ok) {\n this.svg = ''\n this.errorEmitter.emit()\n return\n }\n\n // Create an instance of the DOM parser. We do it here instead of at the\n // top-level to support SSR while maintaining a single parser instance\n // for optimal performance.\n parser ||= new DOMParser()\n const document = parser.parseFromString(request.data, 'text/html')\n const svgElement = document.body.querySelector('svg')\n if (svgElement === null) {\n this.svg = ''\n this.errorEmitter.emit()\n } else {\n for (const [key, value] of Object.entries(this.#inheritedAttributes))\n if (value !== undefined) svgElement.setAttribute(key, value)\n this.svg = svgElement.outerHTML\n this.loadEmitter.emit()\n }\n } catch {\n this.errorEmitter.emit()\n }\n }\n\n public async componentWillLoad(): Promise<void> {\n this.#inheritedAttributes = inheritAriaAttributes(this.host)\n await this.setIcon()\n }\n\n public render() {\n return (\n <div class=\"qds-container\">\n <span class=\"qds-icon-wrapper\" innerHTML={this.svg} />\n </div>\n )\n }\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
* SPDX-License-Identifier: Apache-2.0
|
|
5
5
|
*/
|
|
6
6
|
import { r as registerInstance, c as createEvent, h, g as getElement } from './index-Hg1Liloy.js';
|
|
7
|
-
import { p as pickFocusEventAttributes, i as invariant, d as determineLinkIcon } from './helpers-
|
|
7
|
+
import { p as pickFocusEventAttributes, i as invariant, d as determineLinkIcon } from './helpers-eFD8hV6J.js';
|
|
8
8
|
|
|
9
9
|
const inlineLinkCss = ":host([hidden]){display:none!important}:host{display:inline-block}:host(:focus-visible){border-radius:var(--qds-control-border-radius);box-shadow:0 0 0 var(--qds-focus-heavy-border-width) var(--qds-theme-focus-border);outline:var(--qds-theme-focus-border-contrast) solid var(--qds-focus-light-border-width);outline-offset:0}.qds-icon{height:var(--qds-control-hero-icon-size);width:var(--qds-control-hero-icon-size)}.qds-inline-link{align-items:center;display:flex;gap:var(--qds-text-icon-gap)}.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)}";
|
|
10
10
|
|
|
@@ -115,10 +115,10 @@ const InlineLink = class {
|
|
|
115
115
|
__classPrivateFieldGet(this, _InlineLink_updateAriaLabelElements, "f").call(this);
|
|
116
116
|
}
|
|
117
117
|
render() {
|
|
118
|
-
return (h("a", { key: '
|
|
118
|
+
return (h("a", { key: '3411bcbb89281e52a96f8e2a42380c4b28563cd0', "aria-hidden": "true", class: {
|
|
119
119
|
'qds-inline-link': true,
|
|
120
120
|
'qds-disabled': this.disabled,
|
|
121
|
-
}, "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: -1, target: this.target, ref: __classPrivateFieldGet(this, _InlineLink_linkRef, "f") }, this.iconName !== undefined && this.iconName !== '' && (h("qds-icon", { key: '
|
|
121
|
+
}, "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: -1, target: this.target, ref: __classPrivateFieldGet(this, _InlineLink_linkRef, "f") }, this.iconName !== undefined && this.iconName !== '' && (h("qds-icon", { key: 'e931203750a48ebb52ffbab861b78c194a0ae20b', class: "qds-icon", "aria-hidden": "true", library: this.iconLibrary, name: this.iconName })), h("slot", { key: '795b019b877c1d66d0811b9475af3176a2504806', onSlotchange: __classPrivateFieldGet(this, _InlineLink_onSlotchange, "f") }), this.linkIcon && (h("qds-icon", { key: 'a3edf8126b78e986672c314ea8be78a7d8c0f988', "aria-hidden": "true", class: "qds-icon", library: "core", name: this.linkIcon }))));
|
|
122
122
|
}
|
|
123
123
|
get host() { return getElement(this); }
|
|
124
124
|
static get watchers() { return {
|