@quartzds/core 1.0.0-beta.125 → 1.0.0-beta.127
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 +27 -0
- package/components/index.d.ts +2 -0
- package/components/index.js +2 -1
- package/components/index.js.map +1 -1
- package/components/{p-2tdMcXmA.js → p--fUtCWTJ.js} +6 -6
- package/components/{p-2tdMcXmA.js.map → p--fUtCWTJ.js.map} +1 -1
- package/components/{p-B_CYrw-t.js → p-B2794xy3.js} +3 -3
- package/components/{p-B_CYrw-t.js.map → p-B2794xy3.js.map} +1 -1
- package/components/{p-BRpaYGSM.js → p-BIt0dDIJ.js} +4 -4
- package/components/{p-BRpaYGSM.js.map → p-BIt0dDIJ.js.map} +1 -1
- package/components/p-CHINI0hi.js +124 -0
- package/components/p-CHINI0hi.js.map +1 -0
- package/components/{p-CgQQYnEy.js → p-CIoYTw7w.js} +23 -12
- package/components/p-CIoYTw7w.js.map +1 -0
- package/components/{p-ox2syNht.js → p-CS-MebAm.js} +6 -6
- package/components/{p-ox2syNht.js.map → p-CS-MebAm.js.map} +1 -1
- package/components/{p-DTMrBXCl.js → p-CVa_aaUh.js} +20 -11
- package/components/p-CVa_aaUh.js.map +1 -0
- package/components/{p-B6ToH-uM.js → p-CeqWiFUg.js} +3 -3
- package/components/{p-B6ToH-uM.js.map → p-CeqWiFUg.js.map} +1 -1
- package/components/{p-CG_jPYOl.js → p-CgD-5rh_.js} +39 -19
- package/components/p-CgD-5rh_.js.map +1 -0
- package/components/{p-EjoVBa5a.js → p-CtPHn4AQ.js} +3 -3
- package/components/{p-EjoVBa5a.js.map → p-CtPHn4AQ.js.map} +1 -1
- package/components/{p-BuCcV5P1.js → p-D03cCQ_7.js} +8 -8
- package/components/{p-BuCcV5P1.js.map → p-D03cCQ_7.js.map} +1 -1
- package/components/{p-BceRDckL.js → p-epc3kt-8.js} +25 -21
- package/components/p-epc3kt-8.js.map +1 -0
- package/components/qds-action-item.js +2 -2
- package/components/qds-avatar-media.js +1 -1
- package/components/qds-avatar.d.ts +11 -0
- package/components/qds-avatar.js +120 -0
- package/components/qds-avatar.js.map +1 -0
- package/components/qds-badge-indicator.js +1 -1
- package/components/qds-breadcrumb-item.js +5 -5
- package/components/qds-button.js +34 -10
- package/components/qds-button.js.map +1 -1
- package/components/qds-checkbox.js +1 -1
- package/components/qds-chip.js +8 -8
- package/components/qds-dialog.js +5 -5
- package/components/qds-divider.js +1 -1
- package/components/qds-dropdown.js +1 -1
- package/components/qds-form-message.js +3 -3
- package/components/qds-icon-button.js +1 -1
- package/components/qds-icon-tab.js +7 -7
- package/components/qds-icon.js +1 -1
- package/components/qds-inline-link.js +3 -3
- package/components/qds-input.js +5 -5
- package/components/qds-input.js.map +1 -1
- package/components/qds-label.js +3 -3
- package/components/qds-list-item.js +13 -13
- package/components/qds-loader.js +1 -1
- package/components/qds-menu-item.js +9 -9
- package/components/qds-menu-item.js.map +1 -1
- package/components/qds-mini-button.js +1 -1
- package/components/qds-progress-bar.js +1 -1
- package/components/qds-radio.js +1 -1
- package/components/qds-select.js +11 -15
- package/components/qds-select.js.map +1 -1
- package/components/qds-standalone-link.js +3 -3
- package/components/qds-switch.js +4 -4
- package/components/qds-tab.js +7 -7
- package/components/qds-tabbar.js +10 -10
- 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 +3 -3
- 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/loader.cjs.js +1 -1
- package/dist/cjs/qds-avatar-media.cjs.entry.js +105 -0
- package/dist/cjs/qds-avatar-media.entry.cjs.js.map +1 -0
- package/dist/cjs/qds-avatar.cjs.entry.js +70 -0
- package/dist/cjs/qds-avatar.entry.cjs.js.map +1 -0
- package/dist/cjs/qds-badge-counter.qds-badge-indicator.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-badge-counter_2.cjs.entry.js +27 -5
- package/dist/cjs/qds-breadcrumb-item.cjs.entry.js +3 -3
- package/dist/cjs/qds-button.cjs.entry.js +30 -7
- package/dist/cjs/qds-button.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-checkbox.qds-radio.entry.cjs.js.map +1 -0
- package/dist/cjs/{qds-avatar-media_3.cjs.entry.js → qds-checkbox_2.cjs.entry.js} +22 -104
- package/dist/cjs/qds-chip.cjs.entry.js +5 -5
- package/dist/cjs/qds-dialog.cjs.entry.js +1 -1
- package/dist/cjs/qds-divider.qds-icon-button.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-divider_2.cjs.entry.js +33 -14
- package/dist/cjs/qds-dropdown.cjs.entry.js +18 -9
- package/dist/cjs/qds-dropdown.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-form-message.cjs.entry.js +2 -2
- package/dist/cjs/qds-icon-tab.cjs.entry.js +3 -3
- package/dist/cjs/qds-icon.cjs.entry.js +1 -1
- package/dist/cjs/qds-inline-link.cjs.entry.js +2 -2
- package/dist/cjs/qds-input.cjs.entry.js +3 -3
- package/dist/cjs/qds-input.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-label.cjs.entry.js +2 -2
- package/dist/cjs/qds-list-item.cjs.entry.js +4 -4
- package/dist/cjs/qds-menu-item.cjs.entry.js +5 -5
- package/dist/cjs/qds-menu-item.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-mini-button.cjs.entry.js +1 -1
- package/dist/cjs/qds-progress-bar.cjs.entry.js +1 -1
- package/dist/cjs/qds-select.cjs.entry.js +10 -14
- package/dist/cjs/qds-select.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-standalone-link.cjs.entry.js +2 -2
- package/dist/cjs/qds-switch.cjs.entry.js +3 -3
- package/dist/cjs/qds-tab.cjs.entry.js +3 -3
- 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 +2 -2
- package/dist/cjs/qds-textarea.cjs.entry.js +3 -3
- 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 +1 -1
- package/dist/cjs/qds.cjs.js +1 -1
- package/dist/custom-elements.json +338 -14
- package/dist/docs.json +468 -19
- package/dist/esm/loader.js +1 -1
- package/dist/esm/qds-avatar-media.entry.js +103 -0
- package/dist/esm/qds-avatar-media.entry.js.map +1 -0
- package/dist/esm/qds-avatar.entry.js +68 -0
- package/dist/esm/qds-avatar.entry.js.map +1 -0
- package/dist/esm/qds-badge-counter.qds-badge-indicator.entry.js.map +1 -1
- package/dist/esm/qds-badge-counter_2.entry.js +27 -5
- package/dist/esm/qds-breadcrumb-item.entry.js +3 -3
- package/dist/esm/qds-button.entry.js +30 -7
- package/dist/esm/qds-button.entry.js.map +1 -1
- package/dist/esm/qds-checkbox.qds-radio.entry.js.map +1 -0
- package/dist/esm/{qds-avatar-media_3.entry.js → qds-checkbox_2.entry.js} +24 -105
- package/dist/esm/qds-chip.entry.js +5 -5
- package/dist/esm/qds-dialog.entry.js +1 -1
- package/dist/esm/qds-divider.qds-icon-button.entry.js.map +1 -1
- package/dist/esm/qds-divider_2.entry.js +33 -14
- package/dist/esm/qds-dropdown.entry.js +18 -9
- package/dist/esm/qds-dropdown.entry.js.map +1 -1
- package/dist/esm/qds-form-message.entry.js +2 -2
- package/dist/esm/qds-icon-tab.entry.js +3 -3
- package/dist/esm/qds-icon.entry.js +1 -1
- package/dist/esm/qds-inline-link.entry.js +2 -2
- package/dist/esm/qds-input.entry.js +3 -3
- package/dist/esm/qds-input.entry.js.map +1 -1
- package/dist/esm/qds-label.entry.js +2 -2
- package/dist/esm/qds-list-item.entry.js +4 -4
- package/dist/esm/qds-menu-item.entry.js +6 -6
- package/dist/esm/qds-menu-item.entry.js.map +1 -1
- package/dist/esm/qds-mini-button.entry.js +1 -1
- package/dist/esm/qds-progress-bar.entry.js +1 -1
- package/dist/esm/qds-select.entry.js +10 -14
- package/dist/esm/qds-select.entry.js.map +1 -1
- package/dist/esm/qds-standalone-link.entry.js +2 -2
- package/dist/esm/qds-switch.entry.js +3 -3
- package/dist/esm/qds-tab.entry.js +3 -3
- 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 +2 -2
- package/dist/esm/qds-textarea.entry.js +3 -3
- 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 +1 -1
- package/dist/esm/qds.js +1 -1
- package/dist/types/components/avatar/avatar.d.ts +61 -0
- package/dist/types/components/avatar-media/avatar-media.d.ts +0 -1
- package/dist/types/components/badge-indicator/badge-indicator.d.ts +1 -1
- package/dist/types/components/button/button.d.ts +1 -0
- package/dist/types/components/checkbox/checkbox.d.ts +1 -0
- package/dist/types/components/icon-button/icon-button.d.ts +1 -0
- package/dist/types/components/select/select.d.ts +1 -1
- package/dist/types/components.d.ts +139 -6
- package/dist/vscode.html-custom-data.json +99 -0
- package/hydrate/index.js +312 -143
- package/hydrate/index.mjs +312 -143
- package/package.json +1 -1
- package/components/p-BceRDckL.js.map +0 -1
- package/components/p-CG_jPYOl.js.map +0 -1
- package/components/p-CgQQYnEy.js.map +0 -1
- package/components/p-DTMrBXCl.js.map +0 -1
- package/components/p-U2Q0vF-d.js +0 -96
- package/components/p-U2Q0vF-d.js.map +0 -1
- package/dist/cjs/qds-avatar-media.qds-checkbox.qds-radio.entry.cjs.js.map +0 -1
- package/dist/esm/qds-avatar-media.qds-checkbox.qds-radio.entry.js.map +0 -1
|
@@ -229,18 +229,18 @@ const ListItem = class {
|
|
|
229
229
|
this.subtitleChanged();
|
|
230
230
|
}
|
|
231
231
|
render() {
|
|
232
|
-
return (index.h(index.Host, { key: '
|
|
232
|
+
return (index.h(index.Host, { key: '4d09719a8b92bd1bd16ac819e1350a9370f0f648' }, index.h("div", { key: 'e834cf3e518a01f9f7371a993e235e58994853eb', class: {
|
|
233
233
|
'qds-list-item': true,
|
|
234
234
|
'qds-has-submenu': __classPrivateFieldGet(this, _ListItem_instances, "a", _ListItem_hasSubmenu_get),
|
|
235
235
|
'qds-disabled': this.disabled,
|
|
236
236
|
'qds-selected': __classPrivateFieldGet(this, _ListItem_instances, "a", _ListItem_computedSelected_get),
|
|
237
237
|
'qds-static': __classPrivateFieldGet(this, _ListItem_instances, "a", _ListItem_computedListAction_get) === 'none',
|
|
238
|
-
}, "data-size": __classPrivateFieldGet(this, _ListItem_instances, "a", _ListItem_computedSize_get) }, index.h("div", { key: '
|
|
238
|
+
}, "data-size": __classPrivateFieldGet(this, _ListItem_instances, "a", _ListItem_computedSize_get) }, index.h("div", { key: '64f5d7796de062bb8043ca0c53a162bee63fbf72', class: {
|
|
239
239
|
'qds-indented-content': true,
|
|
240
240
|
'qds-cursor-pointer': !this.disabled && __classPrivateFieldGet(this, _ListItem_instances, "a", _ListItem_computedListAction_get) !== 'none',
|
|
241
|
-
} }, __classPrivateFieldGet(this, _ListItem_instances, "a", _ListItem_computedListAction_get) === 'multiselect' && (index.h("qds-checkbox", { key: '
|
|
241
|
+
} }, __classPrivateFieldGet(this, _ListItem_instances, "a", _ListItem_computedListAction_get) === 'multiselect' && (index.h("qds-checkbox", { key: 'a6e08ee6e4f02be7eaf826016e68f60f73b79678', checked: this.selected, indeterminate: this.indeterminate, size: this.size, text: this.text, disabled: this.disabled, checkboxOnly: true, onQdsChange: stopImmediatePropagation, ref: __classPrivateFieldGet(this, _ListItem_checkboxRef, "f") })), __classPrivateFieldGet(this, _ListItem_instances, "a", _ListItem_computedListAction_get) === 'radio' && (index.h("qds-radio", { key: '0014445604c21bc1b322a4bb3cd285799812979a', checked: this.selected, size: this.size, onQdsChange: __classPrivateFieldGet(this, _ListItem_onSelect, "f"), disabled: this.disabled, "aria-label": this.text, ref: __classPrivateFieldGet(this, _ListItem_radioRef, "f") })), this.host.draggable && (index.h("qds-icon", { key: 'f90356dee4cb32fbafcb4a1580ea1f325b114d9f', class: "qds-icon qds-list-action qds-draggable", library: "core", name: "draggable" })), this.imageSrc !== undefined && this.imageSrc !== '' && (index.h("img", { key: '1e9efb8918c452649e9dcc44d797d377d103bd01', class: "qds-picture", src: this.imageSrc, alt: "" })), this.iconName !== undefined && this.iconName !== '' && (index.h("qds-icon", { key: '110c75be71a3d09171582454b8e933304f2a0c91', class: "qds-main-icon", library: this.iconLibrary, name: this.iconName })), this.avatarSrc !== undefined && this.avatarSrc !== '' && (index.h("qds-avatar-media", { key: '14f1ac38bdc47901ec6450e1964bc0df471c8a65', class: "qds-picture", src: this.avatarSrc })), index.h("div", { key: 'e936c1c06077bfd2eb531d0a22c15073d5ee3880', class: "qds-texts", role: __classPrivateFieldGet(this, _ListItem_instances, "a", _ListItem_computedListAction_get) === 'select' ? 'option' : undefined, tabIndex: __classPrivateFieldGet(this, _ListItem_instances, "a", _ListItem_computedListAction_get) === 'select' && !this.disabled
|
|
242
242
|
? 0
|
|
243
|
-
: undefined, onFocus: __classPrivateFieldGet(this, _ListItem_onFocus, "f"), onBlur: __classPrivateFieldGet(this, _ListItem_onBlur, "f") }, this.kicker !== undefined && this.kicker !== '' && (index.h("div", { key: '
|
|
243
|
+
: undefined, onFocus: __classPrivateFieldGet(this, _ListItem_onFocus, "f"), onBlur: __classPrivateFieldGet(this, _ListItem_onBlur, "f") }, this.kicker !== undefined && this.kicker !== '' && (index.h("div", { key: '122d26660e62e4c35572037ee382ca44838b2b0a', class: "qds-kicker" }, this.kicker)), index.h("div", { key: '21e96e949ef2f89d2399d29ae72f56e7f5e8f858', class: "qds-title", ref: __classPrivateFieldGet(this, _ListItem_divTitleRef, "f") }, this.text), this.subtitle !== undefined && this.subtitle !== '' && (index.h("div", { key: '95b13e521436d694c37925fd4ada2d61f1fc2068', class: "qds-subtitle", ref: __classPrivateFieldGet(this, _ListItem_divSubtitleRef, "f") }, this.subtitle))), this.badge !== undefined && this.badge !== '' && (index.h("qds-badge-counter", { key: '35eed39bcbb06d69f03d66e90e1d8d22a8ae56ff', size: __classPrivateFieldGet(this, _ListItem_instances, "a", _ListItem_computedSize_get), strokeRing: true, value: this.badge, description: this.badgeDescription })), __classPrivateFieldGet(this, _ListItem_instances, "a", _ListItem_hasSubmenu_get) && (index.h("qds-icon-button", { key: 'b8935175371857fc514df2d9ae33601715c94d53', iconName: "dots-3-vertical", importance: "subdued", "aria-label": "more actions", disabled: this.disabled, ref: __classPrivateFieldGet(this, _ListItem_iconButtonRef, "f") })), __classPrivateFieldGet(this, _ListItem_instances, "a", _ListItem_computedDestination_get) !== undefined && (index.h("qds-icon", { key: 'ef3f943d2a51320bd84a2aa22911c2170d507da2', class: "qds-icon qds-destination", library: "core", name: __classPrivateFieldGet(this, _ListItem_instances, "a", _ListItem_computedDestination_get) }))), __classPrivateFieldGet(this, _ListItem_instances, "a", _ListItem_hasSubmenu_get) && (index.h("qds-dropdown", { key: 'e74f1cf5b1428bba054c8d7e5b5d66237bc03871', class: "qds-accessory qds-related", placement: "right-start", target: __classPrivateFieldGet(this, _ListItem_iconButtonRef, "f"), role: "menu" }, index.h("slot", { key: 'a399a6cd9075975f92af208c2bca2c33584108b9', onSlotchange: __classPrivateFieldGet(this, _ListItem_onSlotChange, "f") }))), this.showDivider && index.h("qds-divider", { key: '3fb38cb08dc93ad5f1ac451b60bc7b38ce75f1cd' }), (this.textTooltip || this.subtitleTooltip) && (index.h("qds-tooltip", { key: '38a0a2fd46a1dab5fa874b9f679f1b08a9e47aad', "aria-hidden": "true", ref: __classPrivateFieldGet(this, _ListItem_textTooltipRef, "f") }, index.h("div", { key: 'e5d859c99b4615bab764579620684d4d79a73f84', class: "qds-tooltip-kicker" }, this.kicker), index.h("div", { key: '4d10a39bc0034b3be8cd501727941db7123d1713', class: "qds-tooltip-title" }, this.text), index.h("div", { key: '50e58c10c993c6951f0ef66e2c3d31f3295f7bd9', class: "qds-tooltip-subtitle" }, this.subtitle))))));
|
|
244
244
|
}
|
|
245
245
|
get host() { return index.getElement(this); }
|
|
246
246
|
static get watchers() { return {
|
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
var index = require('./index-DIY7gpXM.js');
|
|
9
9
|
var helpers = require('./helpers-DjUgyTKn.js');
|
|
10
10
|
|
|
11
|
-
const menuItemCss = ":host([hidden]){display:none!important}:host{display: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-menu-item-container{align-items:center;display:flex}.qds-disabled{cursor:not-allowed;opacity:var(--qds-theme-disabled);pointer-events:none}.qds-icon{color:var(--qds-theme-text-standard);transform:scaleX(var(--qds-direction-factor,1))}.
|
|
11
|
+
const menuItemCss = ":host([hidden]){display:none!important}:host{display: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-menu-item-container{align-items:center;display:flex;flex-grow:1}.qds-disabled{cursor:not-allowed;opacity:var(--qds-theme-disabled);pointer-events:none}.qds-icon{color:var(--qds-theme-text-standard);transform:scaleX(var(--qds-direction-factor,1))}.qds-text{color:var(--qds-theme-title);flex-grow:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.qds-shortcut{color:var(--qds-theme-text-subdued)}[data-size=small] .qds-menu-item-container{gap:var(--qds-list-item-small-gap-internal);padding-block:var(--qds-list-item-small-padding-vertical);padding-inline:var(--qds-list-item-small-padding-horizontal)}[data-size=small] .menu-item-checkable,[data-size=small] .qds-icon{height:var(--qds-control-small-icon-size);width:var(--qds-control-small-icon-size)}[data-size=small] .qds-text{font:var(--qds-list-item-small-title)}[data-size=standard] .qds-menu-item-container{gap:var(--qds-list-item-standard-gap-internal);padding-block:var(--qds-list-item-standard-padding-vertical);padding-inline:var(--qds-list-item-standard-padding-horizontal)}[data-size=standard] .menu-item-checkable,[data-size=standard] .qds-icon{height:var(--qds-control-standard-icon-size);width:var(--qds-control-standard-icon-size)}[data-size=standard] .qds-text{font:var(--qds-list-item-standard-title)}[data-size=large] .qds-menu-item-container{gap:var(--qds-list-item-large-gap-internal);padding-block:var(--qds-list-item-large-padding-vertical);padding-inline:var(--qds-list-item-large-padding-horizontal)}[data-size=large] .menu-item-checkable,[data-size=large] .qds-icon{height:var(--qds-control-large-icon-size);width:var(--qds-control-large-icon-size)}[data-size=large] .qds-text{font:var(--qds-list-item-large-title)}.qds-menu-item{align-items:center;-webkit-appearance:none;appearance:none;border:none;border-radius:var(--qds-control-border-radius);box-sizing:border-box;color:var(--qds-theme-text-standard);cursor:pointer;display:flex;flex-grow:1;text-align:initial;-webkit-text-decoration:none;text-decoration:none}.qds-menu-item:not(.qds-selected):not(.qds-disabled):hover{background-color:var(--qds-theme-interactive-background-hover)}.qds-menu-item:not(.qds-selected):not(.qds-disabled):active{background-color:var(--qds-theme-interactive-background-pressed)}";
|
|
12
12
|
|
|
13
13
|
// SPDX-FileCopyrightText: © 2025 Schneider Electric
|
|
14
14
|
//
|
|
@@ -140,13 +140,13 @@ const MenuItem = class {
|
|
|
140
140
|
this.disabledChanged();
|
|
141
141
|
}
|
|
142
142
|
render() {
|
|
143
|
-
return (index.h("div", { key: '
|
|
143
|
+
return (index.h(index.Host, { key: 'f59fc1aa593b8f2a96708e3a8e1ea7a616605876' }, index.h("div", { key: 'f60c27a0d0fbd2466808eb4acb8ec014f3e46a05', class: {
|
|
144
144
|
'qds-menu-item': true,
|
|
145
145
|
'qds-disabled': __classPrivateFieldGet(this, _MenuItem_instances, "a", _MenuItem_computedDisabled_get),
|
|
146
|
-
'qds-has-submenu':
|
|
147
|
-
}, ref: __classPrivateFieldGet(this, _MenuItem_menuitemDivRef, "f"), "data-size": __classPrivateFieldGet(this, _MenuItem_instances, "a", _MenuItem_computedSize_get), "aria-hidden": "true" }, index.h("div", { key: '
|
|
146
|
+
'qds-has-submenu': this.hasSubmenuSlot,
|
|
147
|
+
}, ref: __classPrivateFieldGet(this, _MenuItem_menuitemDivRef, "f"), "data-size": __classPrivateFieldGet(this, _MenuItem_instances, "a", _MenuItem_computedSize_get), "aria-hidden": "true" }, index.h("div", { key: '6568198d5d6cce60288526d6d90be4896d1d7087', class: "qds-menu-item-container" }, __classPrivateFieldGet(this, _MenuItem_instances, "a", _MenuItem_computedCheckable_get) && !__classPrivateFieldGet(this, _MenuItem_instances, "a", _MenuItem_computedChecked_get) && (index.h("span", { key: '3b17235c25ca6244bb1afc2fd8e3a17d6844da16', class: "menu-item-checkable" })), __classPrivateFieldGet(this, _MenuItem_instances, "a", _MenuItem_computedChecked_get) && (index.h("qds-icon", { key: '36433c135b0a381ae74a0b2250d5d160e23fe180', class: "qds-icon", library: "core", name: "checked" })), this.iconName !== undefined && this.iconName !== '' && (index.h("qds-icon", { key: '9a46e96e66e87effba507f7ee8e82aacc2cc03da', class: "qds-icon", library: this.iconLibrary, name: this.iconName })), index.h("span", { key: 'ad4864a046632c01ba79c2b90d5899a413855042', class: "qds-text", ref: __classPrivateFieldGet(this, _MenuItem_spanRef, "f") }, this.text), this.shortcut !== undefined && this.shortcut !== '' && (index.h("span", { key: 'bc4325728cfa74e4c229e7c69fb8b83baacf7220', class: "qds-shortcut" }, this.shortcut)), __classPrivateFieldGet(this, _MenuItem_instances, "a", _MenuItem_hasSubmenu_get) && (index.h("qds-icon", { key: '320a0b4ac80b1feaa9602b22df748e05aa30d52c', class: "qds-icon", library: "core", name: "navigation" })))), __classPrivateFieldGet(this, _MenuItem_instances, "a", _MenuItem_hasSubmenu_get) && (index.h("qds-dropdown", { key: '529440eb657c8401ba92dcd4bdc3a065a72e51f9', class: "qds-accessory qds-related", target: __classPrivateFieldGet(this, _MenuItem_menuitemDivRef, "f"), ref: (element) => {
|
|
148
148
|
__classPrivateFieldSet(this, _MenuItem_submenuDropdown, element, "f");
|
|
149
|
-
} }, index.h("slot", { key: '
|
|
149
|
+
} }, index.h("slot", { key: 'a415b02332197ff35f588279e4469eaac24ecee2' }))), this.tooltip && (index.h("qds-tooltip", { key: '5406ce00bca96d747f62216baff27058f85132dd', ref: __classPrivateFieldGet(this, _MenuItem_tooltipRef, "f") }, this.text))));
|
|
150
150
|
}
|
|
151
151
|
get host() { return index.getElement(this); }
|
|
152
152
|
static get watchers() { return {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"qds-menu-item.entry.cjs.js","sources":["src/components/menu-item/menu-item.css?tag=qds-menu-item&encapsulation=shadow","src/components/menu-item/menu-item.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2025 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:host(:focus-visible) {\n /* inner ring */\n outline: var(--qds-theme-focus-border-contrast) solid\n var(--qds-focus-light-border-width);\n outline-offset: 0;\n\n /* outer ring */\n box-shadow: 0 0 0 var(--qds-focus-heavy-border-width)\n var(--qds-theme-focus-border);\n border-radius: var(--qds-control-border-radius);\n}\n\n.qds-menu-item-container {\n display: flex;\n align-items: center;\n}\n\n.qds-disabled {\n opacity: var(--qds-theme-disabled);\n pointer-events: none;\n cursor: not-allowed;\n}\n\n.qds-icon {\n color: var(--qds-theme-text-standard);\n transform: scaleX(var(--qds-direction-factor, 1));\n}\n\n.qds-icon,\n.menu-item-checkable {\n flex-shrink: 0;\n}\n\n.qds-text {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--qds-theme-title);\n flex-grow: 1;\n}\n\n.qds-shortcut {\n color: var(--qds-theme-text-subdued);\n}\n\n[data-size='small'] {\n .qds-menu-item-container {\n gap: var(--qds-list-item-small-gap-internal);\n padding-inline: var(--qds-list-item-small-padding-horizontal);\n padding-block: var(--qds-list-item-small-padding-vertical);\n }\n\n .menu-item-checkable,\n .qds-icon {\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-list-item-small-title);\n }\n}\n\n[data-size='standard'] {\n .qds-menu-item-container {\n gap: var(--qds-list-item-standard-gap-internal);\n padding-inline: var(--qds-list-item-standard-padding-horizontal);\n padding-block: var(--qds-list-item-standard-padding-vertical);\n }\n\n .menu-item-checkable,\n .qds-icon {\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-list-item-standard-title);\n }\n}\n\n[data-size='large'] {\n .qds-menu-item-container {\n gap: var(--qds-list-item-large-gap-internal);\n padding-inline: var(--qds-list-item-large-padding-horizontal);\n padding-block: var(--qds-list-item-large-padding-vertical);\n }\n\n .menu-item-checkable,\n .qds-icon {\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-list-item-large-title);\n }\n}\n\n.qds-menu-item {\n box-sizing: border-box;\n align-items: center;\n appearance: none;\n border: none;\n border-radius: var(--qds-control-border-radius);\n cursor: pointer;\n text-align: initial;\n text-decoration: none;\n color: var(--qds-theme-text-standard);\n\n &:not(.qds-selected, .qds-disabled) {\n &:hover {\n background-color: var(--qds-theme-interactive-background-hover);\n }\n\n &:active {\n background-color: var(--qds-theme-interactive-background-pressed);\n }\n }\n}\n","// SPDX-FileCopyrightText: © 2025 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 { QdsFocusEventDetail } from '../../helpers'\nimport {\n getSubmenuOpenKey,\n invariant,\n isEllipsisActive,\n isRTL,\n pickFocusEventAttributes,\n} from '../../helpers'\nimport type { Size } from '../shared'\n\nexport type Type = 'checkbox' | undefined\n\n/**\n *\n *\n * @see https://quartz.se.com/build/components/menu-item\n */\n@Component({\n tag: 'qds-menu-item',\n shadow: true,\n styleUrl: 'menu-item.css',\n})\nexport class MenuItem implements ComponentInterface {\n /**\n * Prevents the menu item from being interacted with: it cannot be clicked\n * or focused.\n */\n @Prop() public readonly disabled?: boolean = false\n\n /**\n * The name of the icon to render.\n *\n * Available names depend on the icon library being used.\n */\n @Prop() public readonly iconName?: string\n\n /**\n * The name of a registered icon library.\n */\n @Prop() public readonly iconLibrary: string = 'default'\n\n /**\n * The menu item's size.\n */\n @Prop() public readonly size?: Size = 'standard'\n\n /**\n * Whether or not the menu item should be selectable.\n */\n @Prop() public type: Type\n\n /**\n * Whether or not the menu item is checked.\n */\n @Prop({ mutable: true }) public checked?: boolean\n\n /**\n * The menu item's text\n */\n @Prop() public readonly text!: string\n\n /**\n * The shortcut of the action.\n */\n @Prop() public readonly shortcut?: string\n\n @State() private hasSubmenuSlot = false\n\n @State() private tooltip = false\n\n /**\n * Emitted when the menu item loses focus.\n */\n @Event({ eventName: 'qdsBlur', bubbles: false, cancelable: false })\n private readonly blurEmitter!: EventEmitter<QdsFocusEventDetail>\n\n /**\n * Emitted when the menu item gains focus.\n */\n @Event({ eventName: 'qdsFocus', bubbles: false, cancelable: false })\n private readonly focusEmitter!: EventEmitter<QdsFocusEventDetail>\n\n /**\n * Emitted when the menu item is checked.\n */\n @Event({ eventName: 'qdsSelect', cancelable: false })\n private readonly selectEmitter!: EventEmitter<void>\n\n @Element() private readonly host!: HTMLElement\n\n @AttachInternals() private readonly internals!: ElementInternals\n\n #ro?: ResizeObserver\n\n #menuItem!: HTMLDivElement\n\n #span?: HTMLSpanElement\n\n #submenuDropdown?: HTMLQdsDropdownElement\n\n get #submenuPlacement(): 'left-start' | 'right-start' {\n return isRTL(this.host) ? 'left-start' : 'right-start'\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(): Type {\n return this.type ?? undefined\n }\n\n get #computedCheckable(): boolean {\n return this.#computedType === 'checkbox'\n }\n\n get #computedChecked(): boolean {\n return (\n (this.#computedCheckable && !this.#hasSubmenu && this.checked) ?? false\n )\n }\n\n get #computedDisabled(): boolean {\n return this.disabled ?? false\n }\n\n get #hasSubmenu(): boolean {\n return this.hasSubmenuSlot\n }\n\n @Listen('blur')\n protected onBlur(event: FocusEvent): void {\n this.blurEmitter.emit(pickFocusEventAttributes(event))\n }\n\n @Listen('focus')\n protected onFocus(event: FocusEvent): void {\n this.focusEmitter.emit(pickFocusEventAttributes(event))\n }\n\n @Listen('click')\n protected onClick(event: MouseEvent): void {\n if (this.#computedDisabled) {\n event.stopImmediatePropagation()\n return\n }\n\n if (this.#computedCheckable) {\n this.checked = !this.#computedChecked\n this.selectEmitter.emit()\n }\n\n if (this.#hasSubmenu && this.#submenuDropdown) {\n this.#submenuDropdown.placement = isRTL(this.host)\n ? this.#submenuPlacement\n : this.#submenuPlacement\n }\n }\n\n @Listen('keydown')\n protected async onKeydown(event: KeyboardEvent): Promise<void> {\n if (!this.#hasSubmenu || !this.#submenuDropdown) return\n\n const openKey = getSubmenuOpenKey(this.host)\n if (event.key === openKey || event.key === ' ' || event.key === 'Enter') {\n event.preventDefault()\n event.stopPropagation()\n this.#submenuDropdown.placement =\n event.key === openKey ? this.#submenuPlacement : this.#submenuPlacement\n await this.#submenuDropdown.show()\n await this.#submenuDropdown.focusFirstItem()\n }\n }\n\n @Watch('disabled')\n protected disabledChanged(): void {\n this.internals.ariaDisabled = this.#computedDisabled.toString()\n }\n\n @Watch('checked')\n protected checkedChanged(): void {\n this.internals.ariaChecked = this.#computedChecked.toString()\n }\n\n public componentDidLoad(): void {\n this.checkedChanged()\n invariant(this.#span)\n\n const span = this.#span\n readTask(() => {\n this.tooltip = isEllipsisActive(span)\n })\n this.#ro = new ResizeObserver(([spanEntry]) => {\n this.tooltip = isEllipsisActive(spanEntry.target as HTMLSpanElement)\n })\n this.#ro.observe(this.#span)\n }\n\n public componentWillLoad(): void {\n this.hasSubmenuSlot = this.host.hasChildNodes()\n\n this.internals.role = this.hasSubmenuSlot\n ? 'menu'\n : this.type === 'checkbox'\n ? 'menuitemcheckbox'\n : 'menuitem'\n\n this.disabledChanged()\n }\n\n public render() {\n return (\n <div\n class={{\n 'qds-menu-item': true,\n 'qds-disabled': this.#computedDisabled,\n 'qds-has-submenu': this.#hasSubmenu,\n }}\n ref={this.#menuitemDivRef}\n data-size={this.#computedSize}\n aria-hidden=\"true\"\n >\n <div class=\"qds-menu-item-container\">\n {this.#computedCheckable && !this.#computedChecked && (\n <span class=\"menu-item-checkable\" />\n )}\n {this.#computedChecked && (\n <qds-icon class=\"qds-icon\" library=\"core\" name=\"checked\" />\n )}\n {this.iconName !== undefined && this.iconName !== '' && (\n <qds-icon\n class=\"qds-icon\"\n library={this.iconLibrary}\n name={this.iconName}\n />\n )}\n <span class=\"qds-text\" ref={this.#spanRef}>\n {this.text}\n </span>\n {this.shortcut !== undefined && this.shortcut !== '' && (\n <span class=\"qds-shortcut\">{this.shortcut}</span>\n )}\n {this.#hasSubmenu && (\n <qds-icon class=\"qds-icon\" library=\"core\" name=\"navigation\" />\n )}\n </div>\n {this.#hasSubmenu && (\n <qds-dropdown\n class=\"qds-accessory qds-related\"\n target={this.#menuitemDivRef}\n ref={(element: HTMLQdsDropdownElement | undefined) => {\n this.#submenuDropdown = element\n }}\n >\n <slot />\n </qds-dropdown>\n )}\n {this.tooltip && (\n <qds-tooltip ref={this.#tooltipRef}>{this.text}</qds-tooltip>\n )}\n </div>\n )\n }\n\n readonly #menuitemDivRef = (menuItem?: HTMLDivElement): HTMLDivElement => {\n if (menuItem) {\n this.#menuItem = menuItem\n }\n\n return this.#menuItem\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.#menuItem\n }\n}\n"],"names":["pickFocusEventAttributes","isRTL","getSubmenuOpenKey","invariant","readTask","isEllipsisActive","h"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"qds-menu-item.entry.cjs.js","sources":["src/components/menu-item/menu-item.css?tag=qds-menu-item&encapsulation=shadow","src/components/menu-item/menu-item.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2025 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:host(:focus-visible) {\n /* inner ring */\n outline: var(--qds-theme-focus-border-contrast) solid\n var(--qds-focus-light-border-width);\n outline-offset: 0;\n\n /* outer ring */\n box-shadow: 0 0 0 var(--qds-focus-heavy-border-width)\n var(--qds-theme-focus-border);\n border-radius: var(--qds-control-border-radius);\n}\n\n.qds-menu-item-container {\n display: flex;\n align-items: center;\n flex-grow: 1;\n}\n\n.qds-disabled {\n opacity: var(--qds-theme-disabled);\n pointer-events: none;\n cursor: not-allowed;\n}\n\n.qds-icon {\n color: var(--qds-theme-text-standard);\n transform: scaleX(var(--qds-direction-factor, 1));\n}\n\n.qds-text {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--qds-theme-title);\n flex-grow: 1;\n}\n\n.qds-shortcut {\n color: var(--qds-theme-text-subdued);\n}\n\n[data-size='small'] {\n .qds-menu-item-container {\n gap: var(--qds-list-item-small-gap-internal);\n padding-inline: var(--qds-list-item-small-padding-horizontal);\n padding-block: var(--qds-list-item-small-padding-vertical);\n }\n\n .menu-item-checkable,\n .qds-icon {\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-list-item-small-title);\n }\n}\n\n[data-size='standard'] {\n .qds-menu-item-container {\n gap: var(--qds-list-item-standard-gap-internal);\n padding-inline: var(--qds-list-item-standard-padding-horizontal);\n padding-block: var(--qds-list-item-standard-padding-vertical);\n }\n\n .menu-item-checkable,\n .qds-icon {\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-list-item-standard-title);\n }\n}\n\n[data-size='large'] {\n .qds-menu-item-container {\n gap: var(--qds-list-item-large-gap-internal);\n padding-inline: var(--qds-list-item-large-padding-horizontal);\n padding-block: var(--qds-list-item-large-padding-vertical);\n }\n\n .menu-item-checkable,\n .qds-icon {\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-list-item-large-title);\n }\n}\n\n.qds-menu-item {\n box-sizing: border-box;\n display: flex;\n flex-grow: 1;\n align-items: center;\n appearance: none;\n border: none;\n border-radius: var(--qds-control-border-radius);\n cursor: pointer;\n text-align: initial;\n text-decoration: none;\n color: var(--qds-theme-text-standard);\n\n &:not(.qds-selected, .qds-disabled) {\n &:hover {\n background-color: var(--qds-theme-interactive-background-hover);\n }\n\n &:active {\n background-color: var(--qds-theme-interactive-background-pressed);\n }\n }\n}\n","// SPDX-FileCopyrightText: © 2025 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 Host,\n Listen,\n Prop,\n readTask,\n State,\n Watch,\n} from '@stencil/core'\n\nimport type { QdsFocusEventDetail } from '../../helpers'\nimport {\n getSubmenuOpenKey,\n invariant,\n isEllipsisActive,\n isRTL,\n pickFocusEventAttributes,\n} from '../../helpers'\nimport type { Size } from '../shared'\n\nexport type Type = 'checkbox' | undefined\n\n/**\n *\n *\n * @see https://quartz.se.com/build/components/menu-item\n */\n@Component({\n tag: 'qds-menu-item',\n shadow: true,\n styleUrl: 'menu-item.css',\n})\nexport class MenuItem implements ComponentInterface {\n /**\n * Prevents the menu item from being interacted with: it cannot be clicked\n * or focused.\n */\n @Prop() public readonly disabled?: boolean = false\n\n /**\n * The name of the icon to render.\n *\n * Available names depend on the icon library being used.\n */\n @Prop() public readonly iconName?: string\n\n /**\n * The name of a registered icon library.\n */\n @Prop() public readonly iconLibrary: string = 'default'\n\n /**\n * The menu item's size.\n */\n @Prop() public readonly size?: Size = 'standard'\n\n /**\n * Whether or not the menu item should be selectable.\n */\n @Prop() public type: Type\n\n /**\n * Whether or not the menu item is checked.\n */\n @Prop({ mutable: true }) public checked?: boolean\n\n /**\n * The menu item's text\n */\n @Prop() public readonly text!: string\n\n /**\n * The shortcut of the action.\n */\n @Prop() public readonly shortcut?: string\n\n @State() private hasSubmenuSlot = false\n\n @State() private tooltip = false\n\n /**\n * Emitted when the menu item loses focus.\n */\n @Event({ eventName: 'qdsBlur', bubbles: false, cancelable: false })\n private readonly blurEmitter!: EventEmitter<QdsFocusEventDetail>\n\n /**\n * Emitted when the menu item gains focus.\n */\n @Event({ eventName: 'qdsFocus', bubbles: false, cancelable: false })\n private readonly focusEmitter!: EventEmitter<QdsFocusEventDetail>\n\n /**\n * Emitted when the menu item is checked.\n */\n @Event({ eventName: 'qdsSelect', cancelable: false })\n private readonly selectEmitter!: EventEmitter<void>\n\n @Element() private readonly host!: HTMLElement\n\n @AttachInternals() private readonly internals!: ElementInternals\n\n #ro?: ResizeObserver\n\n #menuItem!: HTMLDivElement\n\n #span?: HTMLSpanElement\n\n #submenuDropdown?: HTMLQdsDropdownElement\n\n get #submenuPlacement(): 'left-start' | 'right-start' {\n return isRTL(this.host) ? 'left-start' : 'right-start'\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(): Type {\n return this.type ?? undefined\n }\n\n get #computedCheckable(): boolean {\n return this.#computedType === 'checkbox'\n }\n\n get #computedChecked(): boolean {\n return (\n (this.#computedCheckable && !this.#hasSubmenu && this.checked) ?? false\n )\n }\n\n get #computedDisabled(): boolean {\n return this.disabled ?? false\n }\n\n get #hasSubmenu(): boolean {\n return this.hasSubmenuSlot\n }\n\n @Listen('blur')\n protected onBlur(event: FocusEvent): void {\n this.blurEmitter.emit(pickFocusEventAttributes(event))\n }\n\n @Listen('focus')\n protected onFocus(event: FocusEvent): void {\n this.focusEmitter.emit(pickFocusEventAttributes(event))\n }\n\n @Listen('click')\n protected onClick(event: MouseEvent): void {\n if (this.#computedDisabled) {\n event.stopImmediatePropagation()\n return\n }\n\n if (this.#computedCheckable) {\n this.checked = !this.#computedChecked\n this.selectEmitter.emit()\n }\n\n if (this.#hasSubmenu && this.#submenuDropdown) {\n this.#submenuDropdown.placement = isRTL(this.host)\n ? this.#submenuPlacement\n : this.#submenuPlacement\n }\n }\n\n @Listen('keydown')\n protected async onKeydown(event: KeyboardEvent): Promise<void> {\n if (!this.#hasSubmenu || !this.#submenuDropdown) return\n\n const openKey = getSubmenuOpenKey(this.host)\n if (event.key === openKey || event.key === ' ' || event.key === 'Enter') {\n event.preventDefault()\n event.stopPropagation()\n this.#submenuDropdown.placement =\n event.key === openKey ? this.#submenuPlacement : this.#submenuPlacement\n await this.#submenuDropdown.show()\n await this.#submenuDropdown.focusFirstItem()\n }\n }\n\n @Watch('disabled')\n protected disabledChanged(): void {\n this.internals.ariaDisabled = this.#computedDisabled.toString()\n }\n\n @Watch('checked')\n protected checkedChanged(): void {\n this.internals.ariaChecked = this.#computedChecked.toString()\n }\n\n public componentDidLoad(): void {\n this.checkedChanged()\n invariant(this.#span)\n\n const span = this.#span\n readTask(() => {\n this.tooltip = isEllipsisActive(span)\n })\n this.#ro = new ResizeObserver(([spanEntry]) => {\n this.tooltip = isEllipsisActive(spanEntry.target as HTMLSpanElement)\n })\n this.#ro.observe(this.#span)\n }\n\n public componentWillLoad(): void {\n this.hasSubmenuSlot = this.host.hasChildNodes()\n\n this.internals.role = this.hasSubmenuSlot\n ? 'menu'\n : this.type === 'checkbox'\n ? 'menuitemcheckbox'\n : 'menuitem'\n\n this.disabledChanged()\n }\n\n public render() {\n return (\n <Host>\n <div\n class={{\n 'qds-menu-item': true,\n 'qds-disabled': this.#computedDisabled,\n 'qds-has-submenu': this.hasSubmenuSlot,\n }}\n ref={this.#menuitemDivRef}\n data-size={this.#computedSize}\n aria-hidden=\"true\"\n >\n <div class=\"qds-menu-item-container\">\n {this.#computedCheckable && !this.#computedChecked && (\n <span class=\"menu-item-checkable\" />\n )}\n {this.#computedChecked && (\n <qds-icon class=\"qds-icon\" library=\"core\" name=\"checked\" />\n )}\n {this.iconName !== undefined && this.iconName !== '' && (\n <qds-icon\n class=\"qds-icon\"\n library={this.iconLibrary}\n name={this.iconName}\n />\n )}\n <span class=\"qds-text\" ref={this.#spanRef}>\n {this.text}\n </span>\n {this.shortcut !== undefined && this.shortcut !== '' && (\n <span class=\"qds-shortcut\">{this.shortcut}</span>\n )}\n {this.#hasSubmenu && (\n <qds-icon class=\"qds-icon\" library=\"core\" name=\"navigation\" />\n )}\n </div>\n </div>\n {this.#hasSubmenu && (\n <qds-dropdown\n class=\"qds-accessory qds-related\"\n target={this.#menuitemDivRef}\n ref={(element: HTMLQdsDropdownElement | undefined) => {\n this.#submenuDropdown = element\n }}\n >\n <slot />\n </qds-dropdown>\n )}\n {this.tooltip && (\n <qds-tooltip ref={this.#tooltipRef}>{this.text}</qds-tooltip>\n )}\n </Host>\n )\n }\n\n readonly #menuitemDivRef = (menuItem?: HTMLDivElement): HTMLDivElement => {\n if (menuItem) {\n this.#menuItem = menuItem\n }\n\n return this.#menuItem\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.#menuItem\n }\n}\n"],"names":["pickFocusEventAttributes","isRTL","getSubmenuOpenKey","invariant","readTask","isEllipsisActive","h","Host"],"mappings":"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"}
|
|
@@ -110,7 +110,7 @@ const MiniButton = class {
|
|
|
110
110
|
}
|
|
111
111
|
render() {
|
|
112
112
|
const Tag = this.href === undefined ? 'button' : 'a';
|
|
113
|
-
return (index.h(Tag, { key: '
|
|
113
|
+
return (index.h(Tag, { key: '1c1c2344dd8c927be55340feaf199ac8dc1f04b3', type: Tag === 'a' ? undefined : 'button', class: "qds-mini-button", href: Tag === 'a' ? this.href : undefined, rel: Tag === 'a' ? this.rel : undefined, disabled: __classPrivateFieldGet(this, _MiniButton_instances, "a", _MiniButton_computedDisabled_get), "aria-hidden": "true", onKeyDown: preventDefault, onKeyUp: preventDefault, onKeyPress: preventDefault, tabIndex: -1 }, index.h("qds-icon", { key: 'e322050630186d8c656d699505ddfe893a47168e', class: "qds-icon", library: this.library, name: this.name })));
|
|
114
114
|
}
|
|
115
115
|
static get formAssociated() { return true; }
|
|
116
116
|
get host() { return index.getElement(this); }
|
|
@@ -92,7 +92,7 @@ const ProgressBar = class {
|
|
|
92
92
|
this.valueChanged();
|
|
93
93
|
}
|
|
94
94
|
render() {
|
|
95
|
-
return (index.h("div", { key: '
|
|
95
|
+
return (index.h("div", { key: '993497784f4ad0ce61e85ad0c8c1e5d2c4bffa68', "aria-hidden": "true", class: "qds-track", "data-size": __classPrivateFieldGet(this, _ProgressBar_instances, "a", _ProgressBar_computedSize_get) }, index.h("div", { key: 'e90842401ae26f81601711994d94ed945c98b6b1', class: {
|
|
96
96
|
'qds-bar': true,
|
|
97
97
|
'qds-indeterminate': __classPrivateFieldGet(this, _ProgressBar_position, "f") === -1,
|
|
98
98
|
}, "data-size": __classPrivateFieldGet(this, _ProgressBar_instances, "a", _ProgressBar_computedSize_get), style: { width: this.width } })));
|
|
@@ -9,7 +9,7 @@ var index = require('./index-DIY7gpXM.js');
|
|
|
9
9
|
var helpers = require('./helpers-DjUgyTKn.js');
|
|
10
10
|
var controls = require('./controls-DKGeNyr5.js');
|
|
11
11
|
|
|
12
|
-
const selectCss = ":host([hidden]){display:none!important}:host{display:inline-block}slot{display:none}.qds-container{box-sizing:border-box;display:grid;grid-template-areas:\"
|
|
12
|
+
const selectCss = ":host([hidden]){display:none!important}:host{display:inline-block}slot{display:none}.qds-container{box-sizing:border-box;display:grid;grid-template-areas:\"j\"}.qds-container,.qds-select{letter-spacing:inherit;width:inherit;word-spacing:inherit}.qds-icon,.qds-select{color:var(--qds-theme-form-input-text-active);grid-area:j}.qds-icon{place-self:center end;pointer-events:none}.qds-select{-webkit-appearance:none;appearance:none;background-color:var(--qds-theme-form-input-background-default);border-color:var(--qds-theme-form-input-border-default);border-radius:var(\n --qds-form-input-border-radius-top-left,var(--qds-form-input-border-radius)\n ) var(\n --qds-form-input-border-radius-top-right,var(--qds-form-input-border-radius)\n ) var(\n --qds-form-input-border-radius-bottom-right,var(--qds-form-input-border-radius)\n ) var(\n --qds-form-input-border-radius-bottom-left,var(--qds-form-input-border-radius)\n );border-style:solid;border-width:var(--qds-form-input-border-width-default) var(\n --qds-form-input-border-width-inline-end,var(--qds-form-input-border-width-default)\n ) var(\n --qds-form-input-border-width-block-end,var(--qds-form-input-border-width-default)\n ) var(--qds-form-input-border-width-default);margin:0;outline:0;padding-block:0;text-overflow:ellipsis}.qds-select:enabled:hover{background-color:var(--qds-theme-form-input-background-hover);border-color:var(--qds-theme-form-input-border-hover)}.qds-select:enabled:active{background-color:var(--qds-theme-form-input-background-active);color:var(--qds-theme-form-input-text-active)}.qds-select:not(:focus):user-invalid{border-color:var(--qds-theme-feedback-result-failure)}.qds-select[data-status]{border-width:var(--qds-form-input-border-width-status) var(\n --qds-form-input-border-width-inline-end,var(--qds-form-input-border-width-status)\n ) var(\n --qds-form-input-border-width-block-end,var(--qds-form-input-border-width-status)\n ) var(--qds-form-input-border-width-status)}.qds-select[data-status=success]{border-color:var(--qds-theme-form-input-border-success)}.qds-select[data-status=warning]{border-color:var(--qds-theme-form-input-border-warning)}.qds-select :not(:focus):user-invalid,.qds-select[data-status=error]{border-color:var(--qds-theme-form-input-border-error)}.qds-select:disabled,.qds-select:disabled+.qds-icon{opacity:var(--qds-theme-disabled)}:is(::slotted(optgroup),::slotted(optgroup:not(:disabled)>option),::slotted(option)):disabled{opacity:var(--qds-theme-disabled)}::slotted(optgroup){font:var(--qds-accessory-section-title)}::slotted(optgroup>option),::slotted(option){font:var(--qds-list-item-label-main)}.qds-select[data-size=small]{font:var(--qds-form-small-text);padding-inline:var(--qds-form-input-small-padding-start) var(--qds-form-input-small-padding-end)}.qds-select[data-size=small]:not([multiple]){min-height:var(--qds-form-input-small-height);padding-inline-end:calc(var(--qds-control-small-icon-size) + var(--qds-form-input-small-gap-internal) + var(--qds-form-input-small-padding-end))}.qds-icon[data-size=small]{height:var(--qds-control-small-icon-size);margin-inline-end:calc(var(--qds-form-input-small-padding-end) + var(--qds-form-input-border-width-default));width:var(--qds-control-small-icon-size)}.qds-select[data-size=standard]{font:var(--qds-form-standard-text);padding-inline:var(--qds-form-input-standard-padding-start) var(--qds-form-input-standard-padding-end)}.qds-select[data-size=standard]:not([multiple]){min-height:var(--qds-form-input-standard-height);padding-inline-end:calc(var(--qds-control-standard-icon-size) + var(--qds-form-input-standard-gap-internal) + var(--qds-form-input-standard-padding-end))}.qds-icon[data-size=standard]{height:var(--qds-control-standard-icon-size);margin-inline-end:calc(var(--qds-form-input-standard-padding-end) + var(--qds-form-input-border-width-default));width:var(--qds-control-standard-icon-size)}.qds-select[data-size=large]{font:var(--qds-form-large-text);padding-inline:var(--qds-form-input-large-padding-start) var(--qds-form-input-large-padding-end)}.qds-select[data-size=large]:not([multiple]){min-height:var(--qds-form-input-large-height);padding-inline-end:calc(var(--qds-control-large-icon-size) + var(--qds-form-input-large-gap-internal) + var(--qds-form-input-large-padding-end))}.qds-icon[data-size=large]{height:var(--qds-control-large-icon-size);margin-inline-end:calc(var(--qds-form-input-large-padding-end) + var(--qds-form-input-border-width-default));width:var(--qds-control-large-icon-size)}.qds-focus-ring{border-radius:max(1px,var(\n --qds-form-input-border-radius-top-left,var(--qds-form-input-border-radius)\n )) max(1px,var(\n --qds-form-input-border-radius-top-right,var(--qds-form-input-border-radius)\n )) max(1px,var(\n --qds-form-input-border-radius-bottom-right,var(--qds-form-input-border-radius)\n )) max(1px,var(\n --qds-form-input-border-radius-bottom-left,var(--qds-form-input-border-radius)\n ));box-shadow:0 0 0 var(--qds-focus-heavy-border-width) var(--qds-theme-focus-border);grid-area:j;height:calc(100% + var(--qds-form-input-border-width-default) - var(\n --qds-form-input-border-width-block-end,\n var(--qds-form-input-border-width-default)\n ));isolation:isolate;outline:var(--qds-theme-focus-border-contrast) solid var(--qds-focus-light-border-width);outline-offset:0;pointer-events:none;visibility:hidden;width:calc(100% + var(--qds-form-input-border-width-default) - var(\n --qds-form-input-border-width-inline-end,\n var(--qds-form-input-border-width-default)\n ))}.qds-select:focus-visible~.qds-focus-ring{visibility:visible}";
|
|
13
13
|
|
|
14
14
|
// SPDX-FileCopyrightText: © 2024 Schneider Electric
|
|
15
15
|
//
|
|
@@ -150,15 +150,6 @@ const Select = class {
|
|
|
150
150
|
* @webnative
|
|
151
151
|
*/
|
|
152
152
|
this.validity = controls.VALID_STATE;
|
|
153
|
-
/**
|
|
154
|
-
* The `value` property of the first selected [`<option>`][] element, or the
|
|
155
|
-
* empty string if no options are selected.
|
|
156
|
-
*
|
|
157
|
-
* [`<option>`]: https://developer.mozilla.org/docs/Web/HTML/Element/option
|
|
158
|
-
*
|
|
159
|
-
* @webnative
|
|
160
|
-
*/
|
|
161
|
-
this.value = '';
|
|
162
153
|
/**
|
|
163
154
|
* True if `<qds-select>` will be validated when the form is submitted;
|
|
164
155
|
* false otherwise.
|
|
@@ -217,6 +208,7 @@ const Select = class {
|
|
|
217
208
|
const { currentTarget } = event;
|
|
218
209
|
helpers.invariant(currentTarget instanceof HTMLSlotElement);
|
|
219
210
|
__classPrivateFieldGet(this, _Select_select, "f").replaceChildren(...currentTarget.assignedNodes().map((node) => node.cloneNode(true)));
|
|
211
|
+
this.validationChanged();
|
|
220
212
|
});
|
|
221
213
|
}
|
|
222
214
|
onClick(event) {
|
|
@@ -241,8 +233,12 @@ const Select = class {
|
|
|
241
233
|
}
|
|
242
234
|
validationChanged() {
|
|
243
235
|
helpers.invariant(__classPrivateFieldGet(this, _Select_select, "f"));
|
|
244
|
-
|
|
236
|
+
if (this.value !== undefined)
|
|
237
|
+
__classPrivateFieldGet(this, _Select_select, "f").value = __classPrivateFieldGet(this, _Select_instances, "a", _Select_computedValue_get);
|
|
238
|
+
this.value = __classPrivateFieldGet(this, _Select_select, "f").value;
|
|
239
|
+
this.selectedIndex = __classPrivateFieldGet(this, _Select_select, "f").selectedIndex;
|
|
245
240
|
__classPrivateFieldGet(this, _Select_select, "f").required = this.required ?? false;
|
|
241
|
+
this.disabledChanged();
|
|
246
242
|
const { valid } = __classPrivateFieldGet(this, _Select_select, "f").validity;
|
|
247
243
|
if (valid)
|
|
248
244
|
this.internals.setValidity(controls.NO_ERROR_FLAGS, undefined, __classPrivateFieldGet(this, _Select_select, "f"));
|
|
@@ -271,12 +267,12 @@ const Select = class {
|
|
|
271
267
|
this.selectedIndex = __classPrivateFieldGet(this, _Select_select, "f").selectedIndex;
|
|
272
268
|
}
|
|
273
269
|
render() {
|
|
274
|
-
return (index.h("div", { key: '
|
|
270
|
+
return (index.h("div", { key: '7ec5716068098204bef753a2a3638cbe6dc3b6e2', class: {
|
|
275
271
|
'qds-container': true,
|
|
276
272
|
'qds-multiple': this.multiple ?? false,
|
|
277
|
-
}, "data-size": __classPrivateFieldGet(this, _Select_instances, "a", _Select_computedSize_get) }, index.h("select", { key: '
|
|
273
|
+
}, "data-size": __classPrivateFieldGet(this, _Select_instances, "a", _Select_computedSize_get) }, index.h("select", { key: '2223f9305b8815f706098b6cf547f473679b1d4e', autoComplete: this.autoComplete,
|
|
278
274
|
// eslint-disable-next-line jsx-a11y/no-autofocus
|
|
279
|
-
autoFocus: this.host.autofocus, class: "qds-select", "data-size": __classPrivateFieldGet(this, _Select_instances, "a", _Select_computedSize_get), "data-status": __classPrivateFieldGet(this, _Select_instances, "a", _Select_computedStatus_get), disabled: __classPrivateFieldGet(this, _Select_instances, "a", _Select_computedDisabled_get), multiple: this.multiple, name: this.name, onBlur: __classPrivateFieldGet(this, _Select_onBlur, "f"), onChange: __classPrivateFieldGet(this, _Select_onChange, "f"), onFocus: __classPrivateFieldGet(this, _Select_onFocus, "f"), onInput: __classPrivateFieldGet(this, _Select_onInput, "f"), ref: __classPrivateFieldGet(this, _Select_ref, "f"), required: this.required, tabIndex: __classPrivateFieldGet(this, _Select_instances, "a", _Select_computedDisabled_get) ? undefined : this.tabIndex, ...__classPrivateFieldGet(this, _Select_inheritedAttributes, "f") }), this.multiple !== true && (index.h("qds-icon", { key: '
|
|
275
|
+
autoFocus: this.host.autofocus, class: "qds-select", "data-size": __classPrivateFieldGet(this, _Select_instances, "a", _Select_computedSize_get), "data-status": __classPrivateFieldGet(this, _Select_instances, "a", _Select_computedStatus_get), disabled: __classPrivateFieldGet(this, _Select_instances, "a", _Select_computedDisabled_get), multiple: this.multiple, name: this.name, onBlur: __classPrivateFieldGet(this, _Select_onBlur, "f"), onChange: __classPrivateFieldGet(this, _Select_onChange, "f"), onFocus: __classPrivateFieldGet(this, _Select_onFocus, "f"), onInput: __classPrivateFieldGet(this, _Select_onInput, "f"), ref: __classPrivateFieldGet(this, _Select_ref, "f"), required: this.required, tabIndex: __classPrivateFieldGet(this, _Select_instances, "a", _Select_computedDisabled_get) ? undefined : this.tabIndex, ...__classPrivateFieldGet(this, _Select_inheritedAttributes, "f") }), this.multiple !== true && (index.h("qds-icon", { key: 'b1272954bda840e88ab22f593ed3d66878b72a12', class: "qds-icon", "data-size": __classPrivateFieldGet(this, _Select_instances, "a", _Select_computedSize_get), library: "core", name: "dropdown" })), index.h("slot", { key: 'e790b0bd0a31ae42857e1f1b4aef16869c9b2198', onSlotchange: __classPrivateFieldGet(this, _Select_onSlotchange, "f") }), index.h("div", { key: 'a8bcffcfc020618494737f6d0d70867857b8d905', class: "qds-focus-ring" })));
|
|
280
276
|
}
|
|
281
277
|
static get delegatesFocus() { return true; }
|
|
282
278
|
static get formAssociated() { return true; }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"qds-select.entry.cjs.js","sources":["src/components/select/select.css?tag=qds-select&encapsulation=shadow","src/components/select/select.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\nslot {\n display: none;\n}\n\n.qds-container {\n box-sizing: border-box;\n display: grid;\n grid-template-areas: 'select';\n}\n\n.qds-container,\n.qds-select {\n width: inherit;\n}\n\n.qds-icon,\n.qds-select {\n color: var(--qds-theme-form-input-text-active);\n grid-area: select;\n}\n\n.qds-icon {\n place-self: center end;\n pointer-events: none;\n}\n\n.qds-select {\n appearance: none;\n background-color: var(--qds-theme-form-input-background-default);\n border-color: var(--qds-theme-form-input-border-default);\n border-radius: var(\n --qds-form-input-border-radius-top-left,\n var(--qds-form-input-border-radius)\n )\n var(\n --qds-form-input-border-radius-top-right,\n var(--qds-form-input-border-radius)\n )\n var(\n --qds-form-input-border-radius-bottom-right,\n var(--qds-form-input-border-radius)\n )\n var(\n --qds-form-input-border-radius-bottom-left,\n var(--qds-form-input-border-radius)\n );\n border-style: solid;\n border-width: var(--qds-form-input-border-width-default)\n var(\n --qds-form-input-border-width-inline-end,\n var(--qds-form-input-border-width-default)\n )\n var(\n --qds-form-input-border-width-block-end,\n var(--qds-form-input-border-width-default)\n )\n var(--qds-form-input-border-width-default);\n margin: 0;\n outline: 0;\n padding-block: 0;\n text-overflow: ellipsis;\n\n &:enabled:hover {\n background-color: var(--qds-theme-form-input-background-hover);\n border-color: var(--qds-theme-form-input-border-hover);\n }\n\n &:enabled:active {\n background-color: var(--qds-theme-form-input-background-active);\n color: var(--qds-theme-form-input-text-active);\n }\n\n &:not(:focus):user-invalid {\n border-color: var(--qds-theme-feedback-result-failure);\n }\n\n &[data-status] {\n border-width: var(--qds-form-input-border-width-status)\n var(\n --qds-form-input-border-width-inline-end,\n var(--qds-form-input-border-width-status)\n )\n var(\n --qds-form-input-border-width-block-end,\n var(--qds-form-input-border-width-status)\n )\n var(--qds-form-input-border-width-status);\n }\n\n &[data-status='success'] {\n border-color: var(--qds-theme-form-input-border-success);\n }\n\n &[data-status='warning'] {\n border-color: var(--qds-theme-form-input-border-warning);\n }\n\n &[data-status='error'],\n :not(:focus):user-invalid {\n border-color: var(--qds-theme-form-input-border-error);\n }\n}\n\n.qds-select:disabled,\n.qds-select:disabled + .qds-icon {\n opacity: var(--qds-theme-disabled);\n}\n\n:is(\n ::slotted(optgroup),\n ::slotted(optgroup:not(:disabled) > option),\n ::slotted(option)\n):disabled {\n opacity: var(--qds-theme-disabled);\n}\n\n::slotted(optgroup) {\n font: var(--qds-accessory-section-title);\n}\n\n::slotted(optgroup > option),\n::slotted(option) {\n font: var(--qds-list-item-label-main);\n}\n\n[data-size='small'] {\n &.qds-select {\n font: var(--qds-form-small-text);\n padding-inline: var(--qds-form-input-small-padding-start)\n var(--qds-form-input-small-padding-end);\n\n &:not([multiple]) {\n min-height: var(--qds-form-input-small-height);\n padding-inline-end: calc(\n var(--qds-control-small-icon-size) +\n var(--qds-form-input-small-gap-internal) +\n var(--qds-form-input-small-padding-end)\n );\n }\n }\n\n &.qds-icon {\n margin-inline-end: calc(\n var(--qds-form-input-small-padding-end) +\n var(--qds-form-input-border-width-default)\n );\n height: var(--qds-control-small-icon-size);\n width: var(--qds-control-small-icon-size);\n }\n}\n\n[data-size='standard'] {\n &.qds-select {\n font: var(--qds-form-standard-text);\n padding-inline: var(--qds-form-input-standard-padding-start)\n var(--qds-form-input-standard-padding-end);\n\n &:not([multiple]) {\n min-height: var(--qds-form-input-standard-height);\n padding-inline-end: calc(\n var(--qds-control-standard-icon-size) +\n var(--qds-form-input-standard-gap-internal) +\n var(--qds-form-input-standard-padding-end)\n );\n }\n }\n\n &.qds-icon {\n margin-inline-end: calc(\n var(--qds-form-input-standard-padding-end) +\n var(--qds-form-input-border-width-default)\n );\n height: var(--qds-control-standard-icon-size);\n width: var(--qds-control-standard-icon-size);\n }\n}\n\n[data-size='large'] {\n &.qds-select {\n font: var(--qds-form-large-text);\n padding-inline: var(--qds-form-input-large-padding-start)\n var(--qds-form-input-large-padding-end);\n\n &:not([multiple]) {\n min-height: var(--qds-form-input-large-height);\n padding-inline-end: calc(\n var(--qds-control-large-icon-size) +\n var(--qds-form-input-large-gap-internal) +\n var(--qds-form-input-large-padding-end)\n );\n }\n }\n\n &.qds-icon {\n margin-inline-end: calc(\n var(--qds-form-input-large-padding-end) +\n var(--qds-form-input-border-width-default)\n );\n height: var(--qds-control-large-icon-size);\n width: var(--qds-control-large-icon-size);\n }\n}\n\n.qds-focus-ring {\n border-radius: max(\n 1px,\n var(\n --qds-form-input-border-radius-top-left,\n var(--qds-form-input-border-radius)\n )\n )\n max(\n 1px,\n var(\n --qds-form-input-border-radius-top-right,\n var(--qds-form-input-border-radius)\n )\n )\n max(\n 1px,\n var(\n --qds-form-input-border-radius-bottom-right,\n var(--qds-form-input-border-radius)\n )\n )\n max(\n 1px,\n var(\n --qds-form-input-border-radius-bottom-left,\n var(--qds-form-input-border-radius)\n )\n );\n grid-area: select;\n isolation: isolate;\n\n /* inner ring */\n outline: var(--qds-theme-focus-border-contrast) solid\n var(--qds-focus-light-border-width);\n outline-offset: 0;\n\n /* outer ring */\n box-shadow: 0 0 0 var(--qds-focus-heavy-border-width)\n var(--qds-theme-focus-border);\n pointer-events: none;\n visibility: hidden;\n width: calc(\n 100% + var(--qds-form-input-border-width-default) -\n var(\n --qds-form-input-border-width-inline-end,\n var(--qds-form-input-border-width-default)\n )\n );\n height: calc(\n 100% + var(--qds-form-input-border-width-default) -\n var(\n --qds-form-input-border-width-block-end,\n var(--qds-form-input-border-width-default)\n )\n );\n}\n\n.qds-select:focus-visible ~ .qds-focus-ring {\n visibility: visible;\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 {\n Attributes,\n QdsFocusEventDetail,\n QdsInputEventDetail,\n} from '../../helpers'\nimport {\n inheritAriaAttributes,\n invariant,\n pickFocusEventAttributes,\n pickInputEventAttributes,\n} from '../../helpers'\nimport type { AutoComplete } from '../controls'\nimport { CUSTOM_ERROR_FLAGS, NO_ERROR_FLAGS, VALID_STATE } from '../controls'\nimport type { Size, Status } from '../shared'\n\nexport type SelectType = 'select-multiple' | 'select-one'\nexport type SelectStatus = Exclude<Status, 'info'>\n\nconst throwError = (): never => {\n invariant(false)\n}\nconst EMPTY_OPTIONS_COLLECTION: HTMLSelectElement['options'] = {\n length: 0,\n selectedIndex: -1,\n add: throwError,\n remove: throwError,\n item: throwError,\n namedItem: throwError,\n [Symbol.iterator]: throwError,\n}\n\n/**\n * The `<qds-select>` element represents a control that provides a menu of\n * options.\n *\n * @see https://quartz.se.com/build/components/select\n */\n@Component({\n tag: 'qds-select',\n formAssociated: true,\n shadow: { delegatesFocus: true },\n styleUrl: 'select.css',\n})\nexport class Select implements ComponentInterface {\n /**\n * The select's status.\n */\n @Prop() public readonly status?: SelectStatus\n\n /**\n * The select's size.\n *\n * > ***NOTE:*** The native [`size` HTML attribute] is not supported. CSS\n * `height` should be used instead if this functionality is needed.\n *\n * [`size` HTML attribute]: https://developer.mozilla.org/docs/Web/HTML/Attributes/size\n */\n @Prop() public readonly size?: Size = 'standard'\n\n /**\n * Provides a hint for a [user agent's][] autocomplete feature. See\n * [the HTML `autocomplete` attribute][] for a complete list of values and\n * details on how to use `autoComplete`.\n *\n * [user agent's]: https://developer.mozilla.org/docs/Glossary/User_agent\n * [the HTML `autocomplete` attribute]: https://developer.mozilla.org/docs/Web/HTML/Attributes/autocomplete\n *\n * @webnative\n */\n @Prop({ attribute: 'autocomplete' })\n public readonly autoComplete?: AutoComplete\n\n /**\n * Prevents the select from being interacted with: it cannot be pressed or\n * focused.\n *\n * @webnative\n */\n @Prop() public readonly disabled?: boolean\n\n /**\n * The [`<form>`][] element to associate the select with (its form owner).\n *\n * The value of this attribute must be the id of a `<form>` in the same\n * document. If this attribute is not set, the `<qds-select>` is associated\n * with its ancestor `<form>` element, if any.\n *\n * This attribute lets you associate `<qds-select>` elements to `<form>`s\n * anywhere in the document, not just inside a `<form>`. It can also override\n * an ancestor `<form>` element.\n *\n * [`<form>`]: https://developer.mozilla.org/docs/Web/HTML/Element/form\n *\n * @readonly\n * @webnative\n */\n // eslint-disable-next-line unicorn/no-null\n @Prop() public readonly form: ElementInternals['form'] | string = null\n\n /**\n * Returns the number of elements in the [`<option>`s collection][].\n *\n * [`<option>`s collection]: https://developer.mozilla.org/docs/Web/API/HTMLOptionsCollection\n *\n * @readonly\n * @webnative\n */\n @Prop() public readonly length: HTMLSelectElement['length'] = 0\n\n /**\n * Indicates that multiple options can be selected in the list. If it is not\n * specified, then only one option can be selected at a time. When `multiple`\n * is specified, most browsers will show a scrolling list box instead of a\n * single line dropdown.\n *\n * @webnative\n */\n @Prop() public multiple?: boolean\n\n /**\n * The name of the select, which is submitted with the form data.\n *\n * @webnative\n */\n @Prop() public readonly name?: string\n\n /**\n * An [`HTMLOptionsCollection`][] of the [`<option>`][] elements contained by\n * the `<qds-select>` element.\n *\n * [`HTMLOptionsCollection`]: https://developer.mozilla.org/docs/Web/API/HTMLOptionsCollection\n * [`<option>`]: https://developer.mozilla.org/docs/Web/HTML/Element/option\n *\n * @readonly\n * @webnative\n */\n @Prop() public readonly options: HTMLSelectElement['options'] =\n EMPTY_OPTIONS_COLLECTION\n\n /**\n * An `<option>` with a non-empty string value must be selected before this\n * select can be submitted.\n *\n * See [Client-side validation] and the [HTML attribute: `required`] for more\n * information.\n *\n * [Client-side validation]: https://developer.mozilla.org/docs/Web/HTML/Element/input#client-side_validation\n * [HTML attribute: `required`]: https://developer.mozilla.org/docs/Web/HTML/Attributes/required\n *\n * @webnative\n */\n @Prop() public readonly required?: boolean\n\n /**\n * The index of the first or last selected [`<option>`][] element, depending\n * on the value of `multiple`. The value `-1` indicates that no element is\n * selected.\n *\n * [`<option>`]: https://developer.mozilla.org/docs/Web/HTML/Element/option\n *\n * @webnative\n */\n @Prop({ mutable: true })\n public selectedIndex: HTMLSelectElement['selectedIndex'] = -1\n\n /**\n * Collection of the [`<option>`][] elements contained within the\n * `<qds-select>` element that are currently selected.\n *\n * [`<option>`]: https://developer.mozilla.org/docs/Web/HTML/Element/option\n *\n * @readonly\n * @webnative\n */\n @Prop()\n public readonly selectedOptions: HTMLSelectElement['selectedOptions'] =\n EMPTY_OPTIONS_COLLECTION\n\n /**\n * Returns `select-multiple` if the `multiple` attribute is true;\n * `select-one` otherwise.\n *\n * @readonly\n * @webnative\n */\n @Prop() public readonly type: SelectType = 'select-one'\n\n /**\n * The error message that would be shown to the user if the `<qds-select>`\n * was to be checked for validity.\n *\n * @readonly\n * @webnative\n */\n @Prop()\n public readonly validationMessage: ElementInternals['validationMessage'] = ''\n\n /**\n * The [`ValidityState`][] object for this `<qds-select>`.\n *\n * [`ValidityState`]: https://developer.mozilla.org/docs/Web/API/ValidityState\n *\n * @readonly\n * @webnative\n */\n @Prop() public readonly validity: ElementInternals['validity'] = VALID_STATE\n\n /**\n * The `value` property of the first selected [`<option>`][] element, or the\n * empty string if no options are selected.\n *\n * [`<option>`]: https://developer.mozilla.org/docs/Web/HTML/Element/option\n *\n * @webnative\n */\n @Prop({ mutable: true }) public value? = ''\n\n /**\n * True if `<qds-select>` will be validated when the form is submitted;\n * false otherwise.\n *\n * @readonly\n * @webnative\n */\n @Prop() public readonly willValidate: ElementInternals['willValidate'] = false\n\n @AttachInternals() private readonly internals!: ElementInternals\n\n /**\n * Emitted when the select loses focus.\n */\n @Event({ eventName: 'qdsBlur', bubbles: false, cancelable: false })\n private readonly blurEmitter!: EventEmitter<QdsFocusEventDetail>\n\n /**\n * Emitted when an alteration to the select's value is committed by the\n * user.\n */\n @Event({ eventName: 'qdsChange', cancelable: false })\n private readonly changeEmitter!: EventEmitter<void>\n\n /**\n * Emitted when the select gains focus.\n */\n @Event({ eventName: 'qdsFocus', bubbles: false, cancelable: false })\n private readonly focusEmitter!: EventEmitter<QdsFocusEventDetail>\n\n /**\n * Emitted when the select's value changes.\n */\n @Event({ eventName: 'qdsInput', cancelable: false })\n private readonly inputEmitter!: EventEmitter<QdsInputEventDetail>\n\n @Element() private readonly host!: HTMLElement\n\n @State() private tabIndex?: number\n\n #inheritedAttributes: Attributes = {}\n\n #select?: HTMLSelectElement\n\n get #computedDisabled(): boolean {\n return (\n (this.host.matches(':disabled') || (this.disabled ?? false)) &&\n this.host.getAttribute('disabled') !== 'false'\n )\n }\n\n get #computedOptions(): HTMLSelectElement['options'] {\n invariant(this.#select)\n\n return this.#select.options\n }\n\n get #computedStatus(): SelectStatus | undefined {\n switch (this.status) {\n case 'error':\n case 'success':\n case 'warning': {\n return this.status\n }\n default: {\n return undefined\n }\n }\n }\n\n get #computedSize(): Size {\n switch (this.size) {\n case 'standard':\n case 'small':\n case 'large': {\n return this.size\n }\n default: {\n return 'standard'\n }\n }\n }\n\n get #computedType(): HTMLSelectElement['type'] {\n invariant(this.#select)\n\n return this.#select.type\n }\n\n get #computedValue(): string {\n return this.value ?? ''\n }\n\n get #computedSelectedOptions(): HTMLSelectElement['selectedOptions'] {\n invariant(this.#select)\n\n return this.#select.selectedOptions\n }\n\n @Listen('click')\n protected onClick(event: MouseEvent): void {\n if (this.#computedDisabled) event.stopImmediatePropagation()\n }\n\n @Watch('disabled')\n protected disabledChanged(): void {\n if (this.#computedDisabled)\n // eslint-disable-next-line unicorn/no-null\n this.internals.setFormValue(null)\n else this.internals.setFormValue(this.#computedValue)\n }\n\n @Watch('selectedIndex')\n protected selectedIndexChanged(): void {\n invariant(this.#select)\n\n this.#select.selectedIndex = this.selectedIndex\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('required')\n @Watch('value')\n protected validationChanged(): void {\n invariant(this.#select)\n\n this.#select.value = this.#computedValue\n this.#select.required = this.required ?? false\n\n const { valid } = this.#select.validity\n if (valid)\n this.internals.setValidity(NO_ERROR_FLAGS, undefined, this.#select)\n else\n this.internals.setValidity(\n this.#select.validity,\n this.#select.validationMessage,\n this.#select,\n )\n }\n\n @Watch('status')\n protected statusChanged(): void {\n this.internals.ariaInvalid = (this.#computedStatus === 'error').toString()\n }\n\n public componentWillLoad(): void {\n this.#defineGetter('form', () => this.internals.form)\n this.#defineGetter('willValidate', () => this.internals.willValidate)\n this.#defineGetter('validity', () => this.internals.validity)\n this.#defineGetter(\n 'validationMessage',\n () => this.internals.validationMessage,\n )\n\n this.#defineGetter('type', () => this.#computedType)\n this.#defineGetter('options', () => this.#computedOptions)\n this.#defineGetter('length', () => this.#computedOptions.length)\n this.#defineGetter('selectedOptions', () => this.#computedSelectedOptions)\n\n this.#inheritedAttributes = inheritAriaAttributes(this.host)\n this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0')\n this.statusChanged()\n }\n\n public componentDidLoad(): void {\n invariant(this.#select)\n\n this.validationChanged()\n this.selectedIndex = this.#select.selectedIndex\n }\n\n public render() {\n return (\n <div\n class={{\n 'qds-container': true,\n 'qds-multiple': this.multiple ?? false,\n }}\n data-size={this.#computedSize}\n >\n <select\n autoComplete={this.autoComplete}\n // eslint-disable-next-line jsx-a11y/no-autofocus\n autoFocus={this.host.autofocus}\n class=\"qds-select\"\n data-size={this.#computedSize}\n data-status={this.#computedStatus}\n disabled={this.#computedDisabled}\n multiple={this.multiple}\n name={this.name}\n onBlur={this.#onBlur}\n onChange={this.#onChange}\n onFocus={this.#onFocus}\n onInput={this.#onInput}\n ref={this.#ref}\n required={this.required}\n tabIndex={this.#computedDisabled ? undefined : this.tabIndex}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...this.#inheritedAttributes}\n />\n {this.multiple !== true && (\n <qds-icon\n class=\"qds-icon\"\n data-size={this.#computedSize}\n library=\"core\"\n name=\"dropdown\"\n />\n )}\n <slot onSlotchange={this.#onSlotchange} />\n <div class=\"qds-focus-ring\" />\n </div>\n )\n }\n\n public checkValidity: ElementInternals['checkValidity'] = () =>\n this.internals.checkValidity()\n\n public reportValidity: ElementInternals['reportValidity'] = () =>\n this.internals.reportValidity()\n\n public setCustomValidity: HTMLSelectElement['setCustomValidity'] = (\n error,\n ) => {\n invariant(this.#select)\n\n this.#select.setCustomValidity(error)\n if (error)\n this.internals.setValidity(CUSTOM_ERROR_FLAGS, error, this.#select)\n else this.internals.setValidity(NO_ERROR_FLAGS)\n }\n\n public addItem: HTMLSelectElement['add'] = (element, before) => {\n invariant(this.#select)\n\n this.#select.add(element, before)\n }\n\n public removeItem = (index: number): void => {\n invariant(this.#select)\n\n this.#select.remove(index)\n }\n\n public item: HTMLSelectElement['item'] = (index) => {\n invariant(this.#select)\n\n return this.#select.item(index)\n }\n\n public namedItem: HTMLSelectElement['namedItem'] = (name) => {\n invariant(this.#select)\n\n return this.#select.namedItem(name)\n }\n\n readonly #ref = (select?: HTMLSelectElement): void => {\n this.#select = select\n }\n\n readonly #onBlur = (event: FocusEvent): void => {\n this.blurEmitter.emit(pickFocusEventAttributes(event))\n }\n\n readonly #onChange = (): void => {\n this.changeEmitter.emit()\n }\n\n readonly #onFocus = (event: FocusEvent): void => {\n this.focusEmitter.emit(pickFocusEventAttributes(event))\n }\n\n readonly #onInput = (event: InputEvent): void => {\n invariant(this.#select)\n\n this.value = this.#select.value\n this.inputEmitter.emit(pickInputEventAttributes(event))\n }\n\n readonly #onSlotchange = (event: Event): void => {\n invariant(this.#select)\n const { currentTarget } = event\n invariant(currentTarget instanceof HTMLSlotElement)\n\n this.#select.replaceChildren(\n ...currentTarget.assignedNodes().map((node) => node.cloneNode(true)),\n )\n }\n\n #defineGetter(p: PropertyKey, get: () => unknown): void {\n Object.defineProperty(this.host, p, { enumerable: true, get })\n }\n}\n"],"names":["invariant","VALID_STATE","CUSTOM_ERROR_FLAGS","NO_ERROR_FLAGS","pickFocusEventAttributes","pickInputEventAttributes","inheritAriaAttributes","h"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"qds-select.entry.cjs.js","sources":["src/components/select/select.css?tag=qds-select&encapsulation=shadow","src/components/select/select.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\nslot {\n display: none;\n}\n\n.qds-container {\n box-sizing: border-box;\n display: grid;\n grid-template-areas: 'select';\n}\n\n.qds-container,\n.qds-select {\n width: inherit;\n letter-spacing: inherit;\n word-spacing: inherit;\n}\n\n.qds-icon,\n.qds-select {\n color: var(--qds-theme-form-input-text-active);\n grid-area: select;\n}\n\n.qds-icon {\n place-self: center end;\n pointer-events: none;\n}\n\n.qds-select {\n appearance: none;\n background-color: var(--qds-theme-form-input-background-default);\n border-color: var(--qds-theme-form-input-border-default);\n border-radius: var(\n --qds-form-input-border-radius-top-left,\n var(--qds-form-input-border-radius)\n )\n var(\n --qds-form-input-border-radius-top-right,\n var(--qds-form-input-border-radius)\n )\n var(\n --qds-form-input-border-radius-bottom-right,\n var(--qds-form-input-border-radius)\n )\n var(\n --qds-form-input-border-radius-bottom-left,\n var(--qds-form-input-border-radius)\n );\n border-style: solid;\n border-width: var(--qds-form-input-border-width-default)\n var(\n --qds-form-input-border-width-inline-end,\n var(--qds-form-input-border-width-default)\n )\n var(\n --qds-form-input-border-width-block-end,\n var(--qds-form-input-border-width-default)\n )\n var(--qds-form-input-border-width-default);\n margin: 0;\n outline: 0;\n padding-block: 0;\n text-overflow: ellipsis;\n\n &:enabled:hover {\n background-color: var(--qds-theme-form-input-background-hover);\n border-color: var(--qds-theme-form-input-border-hover);\n }\n\n &:enabled:active {\n background-color: var(--qds-theme-form-input-background-active);\n color: var(--qds-theme-form-input-text-active);\n }\n\n &:not(:focus):user-invalid {\n border-color: var(--qds-theme-feedback-result-failure);\n }\n\n &[data-status] {\n border-width: var(--qds-form-input-border-width-status)\n var(\n --qds-form-input-border-width-inline-end,\n var(--qds-form-input-border-width-status)\n )\n var(\n --qds-form-input-border-width-block-end,\n var(--qds-form-input-border-width-status)\n )\n var(--qds-form-input-border-width-status);\n }\n\n &[data-status='success'] {\n border-color: var(--qds-theme-form-input-border-success);\n }\n\n &[data-status='warning'] {\n border-color: var(--qds-theme-form-input-border-warning);\n }\n\n &[data-status='error'],\n :not(:focus):user-invalid {\n border-color: var(--qds-theme-form-input-border-error);\n }\n}\n\n.qds-select:disabled,\n.qds-select:disabled + .qds-icon {\n opacity: var(--qds-theme-disabled);\n}\n\n:is(\n ::slotted(optgroup),\n ::slotted(optgroup:not(:disabled) > option),\n ::slotted(option)\n):disabled {\n opacity: var(--qds-theme-disabled);\n}\n\n::slotted(optgroup) {\n font: var(--qds-accessory-section-title);\n}\n\n::slotted(optgroup > option),\n::slotted(option) {\n font: var(--qds-list-item-label-main);\n}\n\n[data-size='small'] {\n &.qds-select {\n font: var(--qds-form-small-text);\n padding-inline: var(--qds-form-input-small-padding-start)\n var(--qds-form-input-small-padding-end);\n\n &:not([multiple]) {\n min-height: var(--qds-form-input-small-height);\n padding-inline-end: calc(\n var(--qds-control-small-icon-size) +\n var(--qds-form-input-small-gap-internal) +\n var(--qds-form-input-small-padding-end)\n );\n }\n }\n\n &.qds-icon {\n margin-inline-end: calc(\n var(--qds-form-input-small-padding-end) +\n var(--qds-form-input-border-width-default)\n );\n height: var(--qds-control-small-icon-size);\n width: var(--qds-control-small-icon-size);\n }\n}\n\n[data-size='standard'] {\n &.qds-select {\n font: var(--qds-form-standard-text);\n padding-inline: var(--qds-form-input-standard-padding-start)\n var(--qds-form-input-standard-padding-end);\n\n &:not([multiple]) {\n min-height: var(--qds-form-input-standard-height);\n padding-inline-end: calc(\n var(--qds-control-standard-icon-size) +\n var(--qds-form-input-standard-gap-internal) +\n var(--qds-form-input-standard-padding-end)\n );\n }\n }\n\n &.qds-icon {\n margin-inline-end: calc(\n var(--qds-form-input-standard-padding-end) +\n var(--qds-form-input-border-width-default)\n );\n height: var(--qds-control-standard-icon-size);\n width: var(--qds-control-standard-icon-size);\n }\n}\n\n[data-size='large'] {\n &.qds-select {\n font: var(--qds-form-large-text);\n padding-inline: var(--qds-form-input-large-padding-start)\n var(--qds-form-input-large-padding-end);\n\n &:not([multiple]) {\n min-height: var(--qds-form-input-large-height);\n padding-inline-end: calc(\n var(--qds-control-large-icon-size) +\n var(--qds-form-input-large-gap-internal) +\n var(--qds-form-input-large-padding-end)\n );\n }\n }\n\n &.qds-icon {\n margin-inline-end: calc(\n var(--qds-form-input-large-padding-end) +\n var(--qds-form-input-border-width-default)\n );\n height: var(--qds-control-large-icon-size);\n width: var(--qds-control-large-icon-size);\n }\n}\n\n.qds-focus-ring {\n border-radius: max(\n 1px,\n var(\n --qds-form-input-border-radius-top-left,\n var(--qds-form-input-border-radius)\n )\n )\n max(\n 1px,\n var(\n --qds-form-input-border-radius-top-right,\n var(--qds-form-input-border-radius)\n )\n )\n max(\n 1px,\n var(\n --qds-form-input-border-radius-bottom-right,\n var(--qds-form-input-border-radius)\n )\n )\n max(\n 1px,\n var(\n --qds-form-input-border-radius-bottom-left,\n var(--qds-form-input-border-radius)\n )\n );\n grid-area: select;\n isolation: isolate;\n\n /* inner ring */\n outline: var(--qds-theme-focus-border-contrast) solid\n var(--qds-focus-light-border-width);\n outline-offset: 0;\n\n /* outer ring */\n box-shadow: 0 0 0 var(--qds-focus-heavy-border-width)\n var(--qds-theme-focus-border);\n pointer-events: none;\n visibility: hidden;\n width: calc(\n 100% + var(--qds-form-input-border-width-default) -\n var(\n --qds-form-input-border-width-inline-end,\n var(--qds-form-input-border-width-default)\n )\n );\n height: calc(\n 100% + var(--qds-form-input-border-width-default) -\n var(\n --qds-form-input-border-width-block-end,\n var(--qds-form-input-border-width-default)\n )\n );\n}\n\n.qds-select:focus-visible ~ .qds-focus-ring {\n visibility: visible;\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 {\n Attributes,\n QdsFocusEventDetail,\n QdsInputEventDetail,\n} from '../../helpers'\nimport {\n inheritAriaAttributes,\n invariant,\n pickFocusEventAttributes,\n pickInputEventAttributes,\n} from '../../helpers'\nimport type { AutoComplete } from '../controls'\nimport { CUSTOM_ERROR_FLAGS, NO_ERROR_FLAGS, VALID_STATE } from '../controls'\nimport type { Size, Status } from '../shared'\n\nexport type SelectType = 'select-multiple' | 'select-one'\nexport type SelectStatus = Exclude<Status, 'info'>\n\nconst throwError = (): never => {\n invariant(false)\n}\nconst EMPTY_OPTIONS_COLLECTION: HTMLSelectElement['options'] = {\n length: 0,\n selectedIndex: -1,\n add: throwError,\n remove: throwError,\n item: throwError,\n namedItem: throwError,\n [Symbol.iterator]: throwError,\n}\n\n/**\n * The `<qds-select>` element represents a control that provides a menu of\n * options.\n *\n * @see https://quartz.se.com/build/components/select\n */\n@Component({\n tag: 'qds-select',\n formAssociated: true,\n shadow: { delegatesFocus: true },\n styleUrl: 'select.css',\n})\nexport class Select implements ComponentInterface {\n /**\n * The select's status.\n */\n @Prop() public readonly status?: SelectStatus\n\n /**\n * The select's size.\n *\n * > ***NOTE:*** The native [`size` HTML attribute] is not supported. CSS\n * `height` should be used instead if this functionality is needed.\n *\n * [`size` HTML attribute]: https://developer.mozilla.org/docs/Web/HTML/Attributes/size\n */\n @Prop() public readonly size?: Size = 'standard'\n\n /**\n * Provides a hint for a [user agent's][] autocomplete feature. See\n * [the HTML `autocomplete` attribute][] for a complete list of values and\n * details on how to use `autoComplete`.\n *\n * [user agent's]: https://developer.mozilla.org/docs/Glossary/User_agent\n * [the HTML `autocomplete` attribute]: https://developer.mozilla.org/docs/Web/HTML/Attributes/autocomplete\n *\n * @webnative\n */\n @Prop({ attribute: 'autocomplete' })\n public readonly autoComplete?: AutoComplete\n\n /**\n * Prevents the select from being interacted with: it cannot be pressed or\n * focused.\n *\n * @webnative\n */\n @Prop() public readonly disabled?: boolean\n\n /**\n * The [`<form>`][] element to associate the select with (its form owner).\n *\n * The value of this attribute must be the id of a `<form>` in the same\n * document. If this attribute is not set, the `<qds-select>` is associated\n * with its ancestor `<form>` element, if any.\n *\n * This attribute lets you associate `<qds-select>` elements to `<form>`s\n * anywhere in the document, not just inside a `<form>`. It can also override\n * an ancestor `<form>` element.\n *\n * [`<form>`]: https://developer.mozilla.org/docs/Web/HTML/Element/form\n *\n * @readonly\n * @webnative\n */\n // eslint-disable-next-line unicorn/no-null\n @Prop() public readonly form: ElementInternals['form'] | string = null\n\n /**\n * Returns the number of elements in the [`<option>`s collection][].\n *\n * [`<option>`s collection]: https://developer.mozilla.org/docs/Web/API/HTMLOptionsCollection\n *\n * @readonly\n * @webnative\n */\n @Prop() public readonly length: HTMLSelectElement['length'] = 0\n\n /**\n * Indicates that multiple options can be selected in the list. If it is not\n * specified, then only one option can be selected at a time. When `multiple`\n * is specified, most browsers will show a scrolling list box instead of a\n * single line dropdown.\n *\n * @webnative\n */\n @Prop() public multiple?: boolean\n\n /**\n * The name of the select, which is submitted with the form data.\n *\n * @webnative\n */\n @Prop() public readonly name?: string\n\n /**\n * An [`HTMLOptionsCollection`][] of the [`<option>`][] elements contained by\n * the `<qds-select>` element.\n *\n * [`HTMLOptionsCollection`]: https://developer.mozilla.org/docs/Web/API/HTMLOptionsCollection\n * [`<option>`]: https://developer.mozilla.org/docs/Web/HTML/Element/option\n *\n * @readonly\n * @webnative\n */\n @Prop() public readonly options: HTMLSelectElement['options'] =\n EMPTY_OPTIONS_COLLECTION\n\n /**\n * An `<option>` with a non-empty string value must be selected before this\n * select can be submitted.\n *\n * See [Client-side validation] and the [HTML attribute: `required`] for more\n * information.\n *\n * [Client-side validation]: https://developer.mozilla.org/docs/Web/HTML/Element/input#client-side_validation\n * [HTML attribute: `required`]: https://developer.mozilla.org/docs/Web/HTML/Attributes/required\n *\n * @webnative\n */\n @Prop() public readonly required?: boolean\n\n /**\n * The index of the first or last selected [`<option>`][] element, depending\n * on the value of `multiple`. The value `-1` indicates that no element is\n * selected.\n *\n * [`<option>`]: https://developer.mozilla.org/docs/Web/HTML/Element/option\n *\n * @webnative\n */\n @Prop({ mutable: true })\n public selectedIndex: HTMLSelectElement['selectedIndex'] = -1\n\n /**\n * Collection of the [`<option>`][] elements contained within the\n * `<qds-select>` element that are currently selected.\n *\n * [`<option>`]: https://developer.mozilla.org/docs/Web/HTML/Element/option\n *\n * @readonly\n * @webnative\n */\n @Prop()\n public readonly selectedOptions: HTMLSelectElement['selectedOptions'] =\n EMPTY_OPTIONS_COLLECTION\n\n /**\n * Returns `select-multiple` if the `multiple` attribute is true;\n * `select-one` otherwise.\n *\n * @readonly\n * @webnative\n */\n @Prop() public readonly type: SelectType = 'select-one'\n\n /**\n * The error message that would be shown to the user if the `<qds-select>`\n * was to be checked for validity.\n *\n * @readonly\n * @webnative\n */\n @Prop()\n public readonly validationMessage: ElementInternals['validationMessage'] = ''\n\n /**\n * The [`ValidityState`][] object for this `<qds-select>`.\n *\n * [`ValidityState`]: https://developer.mozilla.org/docs/Web/API/ValidityState\n *\n * @readonly\n * @webnative\n */\n @Prop() public readonly validity: ElementInternals['validity'] = VALID_STATE\n\n /**\n * The `value` property of the first selected [`<option>`][] element, or the\n * empty string if no options are selected.\n *\n * [`<option>`]: https://developer.mozilla.org/docs/Web/HTML/Element/option\n *\n * @webnative\n */\n @Prop({ mutable: true }) public value?: string\n\n /**\n * True if `<qds-select>` will be validated when the form is submitted;\n * false otherwise.\n *\n * @readonly\n * @webnative\n */\n @Prop() public readonly willValidate: ElementInternals['willValidate'] = false\n\n @AttachInternals() private readonly internals!: ElementInternals\n\n /**\n * Emitted when the select loses focus.\n */\n @Event({ eventName: 'qdsBlur', bubbles: false, cancelable: false })\n private readonly blurEmitter!: EventEmitter<QdsFocusEventDetail>\n\n /**\n * Emitted when an alteration to the select's value is committed by the\n * user.\n */\n @Event({ eventName: 'qdsChange', cancelable: false })\n private readonly changeEmitter!: EventEmitter<void>\n\n /**\n * Emitted when the select gains focus.\n */\n @Event({ eventName: 'qdsFocus', bubbles: false, cancelable: false })\n private readonly focusEmitter!: EventEmitter<QdsFocusEventDetail>\n\n /**\n * Emitted when the select's value changes.\n */\n @Event({ eventName: 'qdsInput', cancelable: false })\n private readonly inputEmitter!: EventEmitter<QdsInputEventDetail>\n\n @Element() private readonly host!: HTMLElement\n\n @State() private tabIndex?: number\n\n #inheritedAttributes: Attributes = {}\n\n #select?: HTMLSelectElement\n\n get #computedDisabled(): boolean {\n return (\n (this.host.matches(':disabled') || (this.disabled ?? false)) &&\n this.host.getAttribute('disabled') !== 'false'\n )\n }\n\n get #computedOptions(): HTMLSelectElement['options'] {\n invariant(this.#select)\n\n return this.#select.options\n }\n\n get #computedStatus(): SelectStatus | undefined {\n switch (this.status) {\n case 'error':\n case 'success':\n case 'warning': {\n return this.status\n }\n default: {\n return undefined\n }\n }\n }\n\n get #computedSize(): Size {\n switch (this.size) {\n case 'standard':\n case 'small':\n case 'large': {\n return this.size\n }\n default: {\n return 'standard'\n }\n }\n }\n\n get #computedType(): HTMLSelectElement['type'] {\n invariant(this.#select)\n\n return this.#select.type\n }\n\n get #computedValue(): string {\n return this.value ?? ''\n }\n\n get #computedSelectedOptions(): HTMLSelectElement['selectedOptions'] {\n invariant(this.#select)\n\n return this.#select.selectedOptions\n }\n\n @Listen('click')\n protected onClick(event: MouseEvent): void {\n if (this.#computedDisabled) event.stopImmediatePropagation()\n }\n\n @Watch('disabled')\n protected disabledChanged(): void {\n if (this.#computedDisabled)\n // eslint-disable-next-line unicorn/no-null\n this.internals.setFormValue(null)\n else this.internals.setFormValue(this.#computedValue)\n }\n\n @Watch('selectedIndex')\n protected selectedIndexChanged(): void {\n invariant(this.#select)\n\n this.#select.selectedIndex = this.selectedIndex\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('required')\n @Watch('value')\n protected validationChanged(): void {\n invariant(this.#select)\n\n if (this.value !== undefined) this.#select.value = this.#computedValue\n\n this.value = this.#select.value\n this.selectedIndex = this.#select.selectedIndex\n this.#select.required = this.required ?? false\n this.disabledChanged()\n\n const { valid } = this.#select.validity\n if (valid)\n this.internals.setValidity(NO_ERROR_FLAGS, undefined, this.#select)\n else\n this.internals.setValidity(\n this.#select.validity,\n this.#select.validationMessage,\n this.#select,\n )\n }\n\n @Watch('status')\n protected statusChanged(): void {\n this.internals.ariaInvalid = (this.#computedStatus === 'error').toString()\n }\n\n public componentWillLoad(): void {\n this.#defineGetter('form', () => this.internals.form)\n this.#defineGetter('willValidate', () => this.internals.willValidate)\n this.#defineGetter('validity', () => this.internals.validity)\n this.#defineGetter(\n 'validationMessage',\n () => this.internals.validationMessage,\n )\n\n this.#defineGetter('type', () => this.#computedType)\n this.#defineGetter('options', () => this.#computedOptions)\n this.#defineGetter('length', () => this.#computedOptions.length)\n this.#defineGetter('selectedOptions', () => this.#computedSelectedOptions)\n\n this.#inheritedAttributes = inheritAriaAttributes(this.host)\n this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0')\n this.statusChanged()\n }\n\n public componentDidLoad(): void {\n invariant(this.#select)\n\n this.validationChanged()\n this.selectedIndex = this.#select.selectedIndex\n }\n\n public render() {\n return (\n <div\n class={{\n 'qds-container': true,\n 'qds-multiple': this.multiple ?? false,\n }}\n data-size={this.#computedSize}\n >\n <select\n autoComplete={this.autoComplete}\n // eslint-disable-next-line jsx-a11y/no-autofocus\n autoFocus={this.host.autofocus}\n class=\"qds-select\"\n data-size={this.#computedSize}\n data-status={this.#computedStatus}\n disabled={this.#computedDisabled}\n multiple={this.multiple}\n name={this.name}\n onBlur={this.#onBlur}\n onChange={this.#onChange}\n onFocus={this.#onFocus}\n onInput={this.#onInput}\n ref={this.#ref}\n required={this.required}\n tabIndex={this.#computedDisabled ? undefined : this.tabIndex}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...this.#inheritedAttributes}\n />\n {this.multiple !== true && (\n <qds-icon\n class=\"qds-icon\"\n data-size={this.#computedSize}\n library=\"core\"\n name=\"dropdown\"\n />\n )}\n <slot onSlotchange={this.#onSlotchange} />\n <div class=\"qds-focus-ring\" />\n </div>\n )\n }\n\n public checkValidity: ElementInternals['checkValidity'] = () =>\n this.internals.checkValidity()\n\n public reportValidity: ElementInternals['reportValidity'] = () =>\n this.internals.reportValidity()\n\n public setCustomValidity: HTMLSelectElement['setCustomValidity'] = (\n error,\n ) => {\n invariant(this.#select)\n\n this.#select.setCustomValidity(error)\n if (error)\n this.internals.setValidity(CUSTOM_ERROR_FLAGS, error, this.#select)\n else this.internals.setValidity(NO_ERROR_FLAGS)\n }\n\n public addItem: HTMLSelectElement['add'] = (element, before) => {\n invariant(this.#select)\n\n this.#select.add(element, before)\n }\n\n public removeItem = (index: number): void => {\n invariant(this.#select)\n\n this.#select.remove(index)\n }\n\n public item: HTMLSelectElement['item'] = (index) => {\n invariant(this.#select)\n\n return this.#select.item(index)\n }\n\n public namedItem: HTMLSelectElement['namedItem'] = (name) => {\n invariant(this.#select)\n\n return this.#select.namedItem(name)\n }\n\n readonly #ref = (select?: HTMLSelectElement): void => {\n this.#select = select\n }\n\n readonly #onBlur = (event: FocusEvent): void => {\n this.blurEmitter.emit(pickFocusEventAttributes(event))\n }\n\n readonly #onChange = (): void => {\n this.changeEmitter.emit()\n }\n\n readonly #onFocus = (event: FocusEvent): void => {\n this.focusEmitter.emit(pickFocusEventAttributes(event))\n }\n\n readonly #onInput = (event: InputEvent): void => {\n invariant(this.#select)\n\n this.value = this.#select.value\n this.inputEmitter.emit(pickInputEventAttributes(event))\n }\n\n readonly #onSlotchange = (event: Event): void => {\n invariant(this.#select)\n const { currentTarget } = event\n invariant(currentTarget instanceof HTMLSlotElement)\n\n this.#select.replaceChildren(\n ...currentTarget.assignedNodes().map((node) => node.cloneNode(true)),\n )\n this.validationChanged()\n }\n\n #defineGetter(p: PropertyKey, get: () => unknown): void {\n Object.defineProperty(this.host, p, { enumerable: true, get })\n }\n}\n"],"names":["invariant","VALID_STATE","CUSTOM_ERROR_FLAGS","NO_ERROR_FLAGS","pickFocusEventAttributes","pickInputEventAttributes","inheritAriaAttributes","h"],"mappings":"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"}
|
|
@@ -125,11 +125,11 @@ const StandaloneLink = class {
|
|
|
125
125
|
__classPrivateFieldGet(this, _StandaloneLink_updateAriaLabelElements, "f").call(this);
|
|
126
126
|
}
|
|
127
127
|
render() {
|
|
128
|
-
return (index.h("a", { key: '
|
|
128
|
+
return (index.h("a", { key: 'de7fba7e41470523fc502b00283a67d2dab47bf3', "aria-hidden": "true", class: {
|
|
129
129
|
'qds-standalone-link': true,
|
|
130
130
|
'qds-disabled': this.disabled,
|
|
131
131
|
'qds-visitable': this.visitable,
|
|
132
|
-
}, "data-importance": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedImportance_get), "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get), download: this.download, href: this.href?.toString(), hrefLang: this.hreflang, onBlur: __classPrivateFieldGet(this, _StandaloneLink_onBlur, "f"), onFocus: __classPrivateFieldGet(this, _StandaloneLink_onFocus, "f"), referrerPolicy: this.referrerPolicy, rel: this.rel, tabIndex: -1, target: this.target, ref: __classPrivateFieldGet(this, _StandaloneLink_linkRef, "f") }, this.iconName !== undefined && this.iconName !== '' && (index.h("span", { key: '
|
|
132
|
+
}, "data-importance": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedImportance_get), "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get), download: this.download, href: this.href?.toString(), hrefLang: this.hreflang, onBlur: __classPrivateFieldGet(this, _StandaloneLink_onBlur, "f"), onFocus: __classPrivateFieldGet(this, _StandaloneLink_onFocus, "f"), referrerPolicy: this.referrerPolicy, rel: this.rel, tabIndex: -1, target: this.target, ref: __classPrivateFieldGet(this, _StandaloneLink_linkRef, "f") }, this.iconName !== undefined && this.iconName !== '' && (index.h("span", { key: '59a0e4c5422d358d70eea9201d2d2404f3e78dcc', class: "qds-icon-crop", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get) }, index.h("qds-icon", { key: '82e8a9b4b6f0a111994326cb98df5f482bdbd3bc', class: "qds-icon", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get), library: this.iconLibrary, name: this.iconName }))), index.h("span", { key: '592f8644d1e13681341914b5bb9d63a6657e8960', class: "qds-text" }, index.h("slot", { key: 'e9613ab67c7dfcb2b752a00dbd8fbde3755cded4', onSlotchange: __classPrivateFieldGet(this, _StandaloneLink_onSlotchange, "f") })), this.linkIcon && (index.h("span", { key: 'f7627f05e9a5e2e49b3d4e366d13e04a08e87194', class: "qds-icon-crop", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get) }, index.h("qds-icon", { key: '00e5632a77811b0e9665c06b8b28ba8d73989955', class: "qds-icon", library: "core", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get), name: this.linkIcon }))), this.importance === 'emphasized' && (index.h("span", { key: '852c6f6d4e7044bff3a3d90c957c70cb57abecd7', class: "qds-icon-crop", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get) }, index.h("qds-icon", { key: '151cf3b62163d694080e5f6b6196f7a5ad9ad3b0', class: "qds-icon", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get), library: "core", name: "next" })))));
|
|
133
133
|
}
|
|
134
134
|
get host() { return index.getElement(this); }
|
|
135
135
|
static get watchers() { return {
|
|
@@ -183,13 +183,13 @@ const Switch = class {
|
|
|
183
183
|
this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0');
|
|
184
184
|
}
|
|
185
185
|
render() {
|
|
186
|
-
return (index.h("div", { key: '
|
|
186
|
+
return (index.h("div", { key: '55ea1bc3c5bec0d92ccf158d5c211460ca50e084', class: {
|
|
187
187
|
'qds-container': true,
|
|
188
188
|
'qds-disabled': __classPrivateFieldGet(this, _Switch_instances, "a", _Switch_computedDisabled_get),
|
|
189
189
|
'qds-inline': this.inline,
|
|
190
|
-
}, "data-size": __classPrivateFieldGet(this, _Switch_instances, "a", _Switch_computedSize_get), "aria-hidden": "true" }, index.h("input", { key: '
|
|
190
|
+
}, "data-size": __classPrivateFieldGet(this, _Switch_instances, "a", _Switch_computedSize_get), "aria-hidden": "true" }, index.h("input", { key: 'b952d84b223ba05aa461810b0994024419d3ecec', "aria-hidden": "true",
|
|
191
191
|
// eslint-disable-next-line jsx-a11y/no-autofocus
|
|
192
|
-
autoFocus: this.host.autofocus, checked: this.checked, class: "qds-switch", disabled: this.disabled, type: "checkbox", value: this.value ?? undefined, tabIndex: -1 }), index.h("div", { key: '
|
|
192
|
+
autoFocus: this.host.autofocus, checked: this.checked, class: "qds-switch", disabled: this.disabled, type: "checkbox", value: this.value ?? undefined, tabIndex: -1 }), index.h("div", { key: '7e80b579beffaed62ebbbf881a84454fb5ec9325', class: "qds-track", "data-size": __classPrivateFieldGet(this, _Switch_instances, "a", _Switch_computedSize_get) }, !this.noIndicator && __classPrivateFieldGet(this, _Switch_instances, "a", _Switch_computedChecked_get) && (index.h("div", { key: '1ad4f8ac0543937bac0bde252834d3003323ac81', class: "qds-indicator", "data-size": __classPrivateFieldGet(this, _Switch_instances, "a", _Switch_computedSize_get) }, index.h("qds-icon", { key: '751585d82fb8ad3dc21f50cda0ac63de01f7c7ec', class: "qds-icon", name: "toggle-on", library: "core" }))), index.h("div", { key: '3b86e7fb8e6b7c536c97ee1a15fbe13a7868f557', class: "qds-knob-container" }, index.h("div", { key: '1ca86813679d5cdd796a5c7fe90b6eb5bc7c4f3a', class: "qds-knob", "data-size": __classPrivateFieldGet(this, _Switch_instances, "a", _Switch_computedSize_get) })), !this.noIndicator && !__classPrivateFieldGet(this, _Switch_instances, "a", _Switch_computedChecked_get) && (index.h("div", { key: '3062225dbb4742dfe24eaaf0893101d332e8a5f8', class: "qds-indicator", "data-size": __classPrivateFieldGet(this, _Switch_instances, "a", _Switch_computedSize_get) }, index.h("qds-icon", { key: '68c8681d5be9d4232c4a1edb65085753280b99b8', class: "qds-icon", name: "toggle-off", library: "core" }))))));
|
|
193
193
|
}
|
|
194
194
|
static get formAssociated() { return true; }
|
|
195
195
|
get host() { return index.getElement(this); }
|
|
@@ -184,11 +184,11 @@ const Tab = class {
|
|
|
184
184
|
: __classPrivateFieldGet(this, _Tab_instances, "a", _Tab_computedAction_get) === 'expandable'
|
|
185
185
|
? 'button'
|
|
186
186
|
: 'div';
|
|
187
|
-
return (index.h("div", { key: '
|
|
187
|
+
return (index.h("div", { key: '27feee86d7cfe7803258013941ae010c8f52ddd4', "aria-disabled": __classPrivateFieldGet(this, _Tab_instances, "a", _Tab_computedDisabled_get) ? 'true' : undefined, class: {
|
|
188
188
|
'qds-closable-wrapper': __classPrivateFieldGet(this, _Tab_instances, "a", _Tab_computedAction_get) === 'closable',
|
|
189
189
|
'qds-selected': this.selected,
|
|
190
190
|
[`qds-indicator-${this.indicatorPosition}`]: __classPrivateFieldGet(this, _Tab_instances, "a", _Tab_computedAction_get) === 'closable',
|
|
191
|
-
}, "data-size": __classPrivateFieldGet(this, _Tab_instances, "a", _Tab_computedSize_get), "data-importance": __classPrivateFieldGet(this, _Tab_instances, "a", _Tab_computedImportance_get) }, index.h(Tag, { key: '
|
|
191
|
+
}, "data-size": __classPrivateFieldGet(this, _Tab_instances, "a", _Tab_computedSize_get), "data-importance": __classPrivateFieldGet(this, _Tab_instances, "a", _Tab_computedImportance_get) }, index.h(Tag, { key: '119a51ce7015fad718925fcd1a890228e4c801b4', ref: __classPrivateFieldGet(this, _Tab_tabRef, "f"), disabled: isLink ? undefined : this.disabled, onBlur: __classPrivateFieldGet(this, _Tab_onBlur, "f"), onFocus: __classPrivateFieldGet(this, _Tab_onFocus, "f"), class: {
|
|
192
192
|
'qds-tab': __classPrivateFieldGet(this, _Tab_instances, "a", _Tab_computedAction_get) !== 'closable',
|
|
193
193
|
'qds-closable-tab': __classPrivateFieldGet(this, _Tab_instances, "a", _Tab_computedAction_get) === 'closable',
|
|
194
194
|
'qds-selected': this.selected,
|
|
@@ -198,7 +198,7 @@ const Tab = class {
|
|
|
198
198
|
? 'true'
|
|
199
199
|
: 'false'
|
|
200
200
|
: undefined, "data-importance": __classPrivateFieldGet(this, _Tab_instances, "a", _Tab_computedImportance_get), "data-action": __classPrivateFieldGet(this, _Tab_instances, "a", _Tab_computedAction_get), "data-size": __classPrivateFieldGet(this, _Tab_instances, "a", _Tab_computedSize_get), href: isLink ? this.href : undefined }, ((this.tagText !== undefined && this.tagText !== '') ||
|
|
201
|
-
(this.tagIconName !== undefined && this.tagIconName !== '')) && (index.h("qds-tag", { key: '
|
|
201
|
+
(this.tagIconName !== undefined && this.tagIconName !== '')) && (index.h("qds-tag", { key: '0a6edda23a52137ae9a132914b297a794fbe74ad', text: this.tagText, status: this.tagStatus, size: __classPrivateFieldGet(this, _Tab_instances, "a", _Tab_computedSize_get), importance: this.tagImportance, "icon-library": this.tagIconLibrary, "icon-name": this.tagIconName, "icon-description": this.tagIconDescription })), this.iconName !== undefined && this.iconName !== '' && (index.h("qds-icon", { key: '73f9d18f022080d08a5df3cbec528908808e8534', "aria-hidden": "true", class: "qds-icon", library: this.iconLibrary, name: this.iconName })), this.text && __classPrivateFieldGet(this, _Tab_instances, "m", _Tab_renderText).call(this), isIndicator(this.badge) && (index.h("qds-badge-indicator", { key: '11a67f8be99c0b50f4eeb2722c10041ca3ddd4c2', status: this.badgeIndicatorStatus, description: this.badgeDescription, size: __classPrivateFieldGet(this, _Tab_instances, "a", _Tab_computedSize_get), strokeRing: true })), isCounter(this.badge) && (index.h("qds-badge-counter", { key: '0f8351a7960a2b31237df340b2e1e77a31ec6f03', description: this.badgeDescription, importance: this.badgeCounterImportance, size: __classPrivateFieldGet(this, _Tab_instances, "a", _Tab_computedSize_get), strokeRing: true, value: this.badge })), __classPrivateFieldGet(this, _Tab_instances, "a", _Tab_computedAction_get) === 'expandable' && (index.h("qds-icon", { key: 'de917eda9fd9051090a34d973992ba42be344f9a', class: { 'qds-target-icon': true, 'qds-chevron': this.selected }, "data-size": __classPrivateFieldGet(this, _Tab_instances, "a", _Tab_computedSize_get), library: "core", name: "dropdown" }))), __classPrivateFieldGet(this, _Tab_instances, "a", _Tab_computedAction_get) === 'closable' && (index.h("qds-mini-button", { key: '54df8f80eb5b146129b46bb3abacab02c8e5d043', name: "close", library: "core", text: __classPrivateFieldGet(this, _Tab_instances, "a", _Tab_ariaLabel_get), "data-size": __classPrivateFieldGet(this, _Tab_instances, "a", _Tab_computedSize_get), disabled: __classPrivateFieldGet(this, _Tab_instances, "a", _Tab_computedDisabled_get), onClick: __classPrivateFieldGet(this, _Tab_onIconClick, "f"), tabIndex: __classPrivateFieldGet(this, _Tab_instances, "a", _Tab_computeCloseButtonTabIndex_get) }))));
|
|
202
202
|
}
|
|
203
203
|
get host() { return index.getElement(this); }
|
|
204
204
|
static get watchers() { return {
|