q2-tecton-elements 1.67.1 → 1.67.2
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/dist/bundle-report.json +23 -68
- package/dist/cjs/click-elsewhere.q2-option-list.q2-popover.entry.cjs.js.map +1 -1
- package/dist/cjs/click-elsewhere_3.cjs.entry.js +17 -28
- package/dist/cjs/click-elsewhere_3.cjs.entry.js.map +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/q2-action-group_2.cjs.entry.js +2 -2
- package/dist/cjs/q2-action-sheet.cjs.entry.js +1 -1
- package/dist/cjs/q2-avatar.cjs.entry.js +1 -1
- package/dist/cjs/q2-card-image.cjs.entry.js +2 -2
- package/dist/cjs/q2-carousel-pane.cjs.entry.js +2 -2
- package/dist/cjs/q2-chart-area.cjs.entry.js +1 -1
- package/dist/cjs/q2-chart-bar.cjs.entry.js +1 -1
- package/dist/cjs/q2-chart-donut.cjs.entry.js +1 -1
- package/dist/cjs/q2-checkbox-group.cjs.entry.js +1 -1
- package/dist/cjs/q2-checkbox.q2-tag.entry.cjs.js.map +1 -1
- package/dist/cjs/q2-checkbox_2.cjs.entry.js +41 -11
- package/dist/cjs/q2-checkbox_2.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-context.cjs.entry.js +1 -1
- package/dist/cjs/q2-currency.cjs.entry.js +1 -1
- package/dist/cjs/q2-data-table.cjs.entry.js +1 -1
- package/dist/cjs/q2-detail.cjs.entry.js +1 -1
- package/dist/cjs/q2-dropdown.cjs.entry.js +1 -1
- package/dist/cjs/q2-editable-field.cjs.entry.js +1 -1
- package/dist/cjs/q2-example.cjs.entry.js +1 -1
- package/dist/cjs/q2-form.cjs.entry.js +1 -1
- package/dist/cjs/q2-formatted-text.cjs.entry.js +1 -1
- package/dist/cjs/q2-input.cjs.entry.js +1 -1
- package/dist/cjs/q2-item.cjs.entry.js +1 -1
- package/dist/cjs/q2-legend.cjs.entry.js +1 -1
- package/dist/cjs/q2-link_2.cjs.entry.js +1 -1
- package/dist/cjs/q2-message.cjs.entry.js +1 -1
- package/dist/cjs/q2-meter.cjs.entry.js +1 -1
- package/dist/cjs/q2-modal.cjs.entry.js +1 -1
- package/dist/cjs/q2-month-picker.cjs.entry.js +2 -2
- package/dist/cjs/q2-mutation-observer.cjs.entry.js +1 -1
- package/dist/cjs/q2-optgroup.cjs.entry.js +1 -1
- package/dist/cjs/q2-pagination.cjs.entry.js +3 -3
- package/dist/cjs/q2-pill.cjs.entry.js +1 -1
- package/dist/cjs/q2-radio-group.cjs.entry.js +1 -1
- package/dist/cjs/q2-radio.cjs.entry.js +1 -1
- package/dist/cjs/q2-relative-time.cjs.entry.js +1 -1
- package/dist/cjs/q2-section.cjs.entry.js +2 -2
- package/dist/cjs/q2-select.cjs.entry.js +1 -1
- package/dist/cjs/q2-stepper-pane.cjs.entry.js +1 -1
- package/dist/cjs/q2-stepper-vertical.cjs.entry.js +1 -1
- package/dist/cjs/q2-stepper.cjs.entry.js +1 -1
- package/dist/cjs/q2-tab-container.cjs.entry.js +1 -1
- package/dist/cjs/q2-tab-pane.cjs.entry.js +1 -1
- package/dist/cjs/q2-tecton-elements.cjs.js +1 -1
- package/dist/cjs/q2-textarea.cjs.entry.js +1 -1
- package/dist/cjs/tecton-tab-pane.cjs.entry.js +2 -2
- package/dist/collection/components/q2-action-group/q2-action-group.js +1 -1
- package/dist/collection/components/q2-action-sheet/q2-action-sheet.js +1 -1
- package/dist/collection/components/q2-avatar/q2-avatar.js +1 -1
- package/dist/collection/components/q2-calendar/q2-month-picker.js +2 -2
- package/dist/collection/components/q2-card-image/q2-card-image.js +2 -2
- package/dist/collection/components/q2-carousel-pane/q2-carousel-pane.js +2 -2
- package/dist/collection/components/q2-chart-area/q2-chart-area.js +1 -1
- package/dist/collection/components/q2-chart-bar/q2-chart-bar.js +1 -1
- package/dist/collection/components/q2-chart-donut/q2-chart-donut.js +1 -1
- package/dist/collection/components/q2-checkbox/q2-checkbox.css +5 -1
- package/dist/collection/components/q2-checkbox/q2-checkbox.js +45 -10
- package/dist/collection/components/q2-checkbox/q2-checkbox.js.map +1 -1
- package/dist/collection/components/q2-checkbox-group/q2-checkbox-group.js +1 -1
- package/dist/collection/components/q2-context/q2-context.js +1 -1
- package/dist/collection/components/q2-currency/q2-currency.js +1 -1
- package/dist/collection/components/q2-data-table/q2-data-table.js +1 -1
- package/dist/collection/components/q2-detail/q2-detail.js +1 -1
- package/dist/collection/components/q2-dropdown/q2-dropdown.js +1 -1
- package/dist/collection/components/q2-editable-field/q2-editable-field.js +1 -1
- package/dist/collection/components/q2-example/q2-example.js +1 -1
- package/dist/collection/components/q2-form/q2-form.js +1 -1
- package/dist/collection/components/q2-formatted-text/q2-formatted-text.js +1 -1
- package/dist/collection/components/q2-input/q2-input.js +1 -1
- package/dist/collection/components/q2-item/q2-item.js +1 -1
- package/dist/collection/components/q2-legend/q2-legend.js +1 -1
- package/dist/collection/components/q2-list/q2-list.js +1 -1
- package/dist/collection/components/q2-message/q2-message.js +1 -1
- package/dist/collection/components/q2-meter/q2-meter.js +1 -1
- package/dist/collection/components/q2-modal/q2-modal.js +1 -1
- package/dist/collection/components/q2-mutation-observer/q2-mutation-observer.js +1 -1
- package/dist/collection/components/q2-optgroup/q2-optgroup.js +1 -1
- package/dist/collection/components/q2-pagination/q2-pagination.js +3 -3
- package/dist/collection/components/q2-pill/q2-pill.js +1 -1
- package/dist/collection/components/q2-popover/q2-popover.js +17 -48
- package/dist/collection/components/q2-popover/q2-popover.js.map +1 -1
- package/dist/collection/components/q2-radio/q2-radio.js +1 -1
- package/dist/collection/components/q2-radio-group/q2-radio-group.js +1 -1
- package/dist/collection/components/q2-relative-time/q2-relative-time.js +1 -1
- package/dist/collection/components/q2-resize-observer/q2-resize-observer.js +1 -1
- package/dist/collection/components/q2-section/q2-section.js +2 -2
- package/dist/collection/components/q2-select/q2-select.js +1 -1
- package/dist/collection/components/q2-stepper/q2-stepper.js +1 -1
- package/dist/collection/components/q2-stepper-pane/q2-stepper-pane.js +1 -1
- package/dist/collection/components/q2-stepper-vertical/q2-stepper-vertical.js +1 -1
- package/dist/collection/components/q2-tab-container/q2-tab-container.js +1 -1
- package/dist/collection/components/q2-tab-pane/q2-tab-pane.js +1 -1
- package/dist/collection/components/q2-tag/q2-tag.js +1 -1
- package/dist/collection/components/q2-textarea/q2-textarea.js +1 -1
- package/dist/collection/components/tecton-tab-pane/tecton-tab-pane.js +2 -2
- package/dist/components/q2-action-group2.js +1 -1
- package/dist/components/q2-action-sheet.js +1 -1
- package/dist/components/q2-avatar2.js +1 -1
- package/dist/components/q2-card-image.js +2 -2
- package/dist/components/q2-carousel-pane.js +2 -2
- package/dist/components/q2-chart-area.js +1 -1
- package/dist/components/q2-chart-bar.js +1 -1
- package/dist/components/q2-chart-donut.js +1 -1
- package/dist/components/q2-checkbox-group.js +1 -1
- package/dist/components/q2-checkbox2.js +42 -11
- package/dist/components/q2-checkbox2.js.map +1 -1
- package/dist/components/q2-context.js +1 -1
- package/dist/components/q2-currency.js +1 -1
- package/dist/components/q2-data-table.js +1 -1
- package/dist/components/q2-detail.js +1 -1
- package/dist/components/q2-dropdown.js +1 -1
- package/dist/components/q2-editable-field.js +1 -1
- package/dist/components/q2-example.js +1 -1
- package/dist/components/q2-form.js +1 -1
- package/dist/components/q2-formatted-text.js +1 -1
- package/dist/components/q2-input2.js +1 -1
- package/dist/components/q2-item2.js +1 -1
- package/dist/components/q2-legend2.js +1 -1
- package/dist/components/q2-list2.js +1 -1
- package/dist/components/q2-message2.js +1 -1
- package/dist/components/q2-meter.js +1 -1
- package/dist/components/q2-modal.js +1 -1
- package/dist/components/q2-month-picker.js +2 -2
- package/dist/components/q2-mutation-observer.js +1 -1
- package/dist/components/q2-optgroup2.js +1 -1
- package/dist/components/q2-pagination.js +3 -3
- package/dist/components/q2-pill.js +1 -1
- package/dist/components/q2-popover2.js +17 -29
- package/dist/components/q2-popover2.js.map +1 -1
- package/dist/components/q2-radio-group.js +1 -1
- package/dist/components/q2-radio.js +1 -1
- package/dist/components/q2-relative-time.js +1 -1
- package/dist/components/q2-resize-observer2.js +1 -1
- package/dist/components/q2-section.js +2 -2
- package/dist/components/q2-select2.js +1 -1
- package/dist/components/q2-stepper-pane.js +1 -1
- package/dist/components/q2-stepper-vertical.js +1 -1
- package/dist/components/q2-stepper.js +1 -1
- package/dist/components/q2-tab-container.js +1 -1
- package/dist/components/q2-tab-pane.js +1 -1
- package/dist/components/q2-tag2.js +1 -1
- package/dist/components/q2-textarea.js +1 -1
- package/dist/components/tecton-tab-pane.js +2 -2
- package/dist/esm/click-elsewhere.q2-option-list.q2-popover.entry.js.map +1 -1
- package/dist/esm/click-elsewhere_3.entry.js +17 -28
- package/dist/esm/click-elsewhere_3.entry.js.map +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/q2-action-group_2.entry.js +2 -2
- package/dist/esm/q2-action-sheet.entry.js +1 -1
- package/dist/esm/q2-avatar.entry.js +1 -1
- package/dist/esm/q2-card-image.entry.js +2 -2
- package/dist/esm/q2-carousel-pane.entry.js +2 -2
- package/dist/esm/q2-chart-area.entry.js +1 -1
- package/dist/esm/q2-chart-bar.entry.js +1 -1
- package/dist/esm/q2-chart-donut.entry.js +1 -1
- package/dist/esm/q2-checkbox-group.entry.js +1 -1
- package/dist/esm/q2-checkbox.q2-tag.entry.js.map +1 -1
- package/dist/esm/q2-checkbox_2.entry.js +41 -11
- package/dist/esm/q2-checkbox_2.entry.js.map +1 -1
- package/dist/esm/q2-context.entry.js +1 -1
- package/dist/esm/q2-currency.entry.js +1 -1
- package/dist/esm/q2-data-table.entry.js +1 -1
- package/dist/esm/q2-detail.entry.js +1 -1
- package/dist/esm/q2-dropdown.entry.js +1 -1
- package/dist/esm/q2-editable-field.entry.js +1 -1
- package/dist/esm/q2-example.entry.js +1 -1
- package/dist/esm/q2-form.entry.js +1 -1
- package/dist/esm/q2-formatted-text.entry.js +1 -1
- package/dist/esm/q2-input.entry.js +1 -1
- package/dist/esm/q2-item.entry.js +1 -1
- package/dist/esm/q2-legend.entry.js +1 -1
- package/dist/esm/q2-link_2.entry.js +1 -1
- package/dist/esm/q2-message.entry.js +1 -1
- package/dist/esm/q2-meter.entry.js +1 -1
- package/dist/esm/q2-modal.entry.js +1 -1
- package/dist/esm/q2-month-picker.entry.js +2 -2
- package/dist/esm/q2-mutation-observer.entry.js +1 -1
- package/dist/esm/q2-optgroup.entry.js +1 -1
- package/dist/esm/q2-pagination.entry.js +3 -3
- package/dist/esm/q2-pill.entry.js +1 -1
- package/dist/esm/q2-radio-group.entry.js +1 -1
- package/dist/esm/q2-radio.entry.js +1 -1
- package/dist/esm/q2-relative-time.entry.js +1 -1
- package/dist/esm/q2-section.entry.js +2 -2
- package/dist/esm/q2-select.entry.js +1 -1
- package/dist/esm/q2-stepper-pane.entry.js +1 -1
- package/dist/esm/q2-stepper-vertical.entry.js +1 -1
- package/dist/esm/q2-stepper.entry.js +1 -1
- package/dist/esm/q2-tab-container.entry.js +1 -1
- package/dist/esm/q2-tab-pane.entry.js +1 -1
- package/dist/esm/q2-tecton-elements.js +1 -1
- package/dist/esm/q2-textarea.entry.js +1 -1
- package/dist/esm/tecton-tab-pane.entry.js +2 -2
- package/dist/q2-tecton-elements/click-elsewhere.q2-option-list.q2-popover.entry.esm.js.map +1 -1
- package/dist/q2-tecton-elements/click-elsewhere_3.entry.js +32 -39
- package/dist/q2-tecton-elements/click-elsewhere_3.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-action-group_2.entry.js +4 -4
- package/dist/q2-tecton-elements/q2-action-sheet.entry.js +40 -40
- package/dist/q2-tecton-elements/q2-avatar.entry.js +8 -8
- package/dist/q2-tecton-elements/q2-card-image.entry.js +2 -2
- package/dist/q2-tecton-elements/q2-carousel-pane.entry.js +3 -3
- package/dist/q2-tecton-elements/q2-chart-area.entry.js +6 -6
- package/dist/q2-tecton-elements/q2-chart-bar.entry.js +2 -2
- package/dist/q2-tecton-elements/q2-chart-donut.entry.js +6 -6
- package/dist/q2-tecton-elements/q2-checkbox-group.entry.js +6 -6
- package/dist/q2-tecton-elements/q2-checkbox.q2-tag.entry.esm.js.map +1 -1
- package/dist/q2-tecton-elements/q2-checkbox_2.entry.js +70 -28
- package/dist/q2-tecton-elements/q2-checkbox_2.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-context.entry.js +15 -15
- package/dist/q2-tecton-elements/q2-currency.entry.js +8 -8
- package/dist/q2-tecton-elements/q2-data-table.entry.js +3 -3
- package/dist/q2-tecton-elements/q2-detail.entry.js +3 -3
- package/dist/q2-tecton-elements/q2-dropdown.entry.js +17 -17
- package/dist/q2-tecton-elements/q2-editable-field.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-example.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-form.entry.js +7 -7
- package/dist/q2-tecton-elements/q2-formatted-text.entry.js +2 -2
- package/dist/q2-tecton-elements/q2-input.entry.js +3 -3
- package/dist/q2-tecton-elements/q2-item.entry.js +13 -13
- package/dist/q2-tecton-elements/q2-legend.entry.js +2 -2
- package/dist/q2-tecton-elements/q2-link_2.entry.js +6 -6
- package/dist/q2-tecton-elements/q2-message.entry.js +6 -6
- package/dist/q2-tecton-elements/q2-meter.entry.js +13 -13
- package/dist/q2-tecton-elements/q2-modal.entry.js +46 -46
- package/dist/q2-tecton-elements/q2-month-picker.entry.js +30 -30
- package/dist/q2-tecton-elements/q2-mutation-observer.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-optgroup.entry.js +4 -4
- package/dist/q2-tecton-elements/q2-pagination.entry.js +26 -26
- package/dist/q2-tecton-elements/q2-pill.entry.js +12 -12
- package/dist/q2-tecton-elements/q2-radio-group.entry.js +21 -21
- package/dist/q2-tecton-elements/q2-radio.entry.js +8 -8
- package/dist/q2-tecton-elements/q2-relative-time.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-section.entry.js +21 -21
- package/dist/q2-tecton-elements/q2-select.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-stepper-pane.entry.js +11 -11
- package/dist/q2-tecton-elements/q2-stepper-vertical.entry.js +4 -4
- package/dist/q2-tecton-elements/q2-stepper.entry.js +12 -12
- package/dist/q2-tecton-elements/q2-tab-container.entry.js +17 -17
- package/dist/q2-tecton-elements/q2-tab-pane.entry.js +2 -2
- package/dist/q2-tecton-elements/q2-tecton-elements.esm.js +1 -1
- package/dist/q2-tecton-elements/q2-textarea.entry.js +2 -2
- package/dist/q2-tecton-elements/tecton-tab-pane.entry.js +6 -6
- package/dist/types/components/q2-checkbox/q2-checkbox.d.ts +8 -1
- package/dist/types/components/q2-popover/q2-popover.d.ts +0 -6
- package/dist/types/components.d.ts +0 -10
- package/package.json +3 -3
|
@@ -83,16 +83,16 @@ const i = class {
|
|
|
83
83
|
const i = (this.name || this.initials) && (!this.src || this.badSrc);
|
|
84
84
|
const o = !this.name && !this.initials && (!this.src || this.badSrc);
|
|
85
85
|
return t("div", {
|
|
86
|
-
key: "
|
|
86
|
+
key: "905b33762261d024a3fc93b855f41ad34cd3ebb9",
|
|
87
87
|
class: `avatar-wrapper size-${this.size}`
|
|
88
88
|
}, this.hasDecorator && t("div", {
|
|
89
|
-
key: "
|
|
89
|
+
key: "2f56e72f62c7dc93e46861fedcb23dbb3b9f356a",
|
|
90
90
|
class: "decorator"
|
|
91
91
|
}, t("slot", {
|
|
92
|
-
key: "
|
|
92
|
+
key: "367d339e3cb1d7cb967588c9f16aaac43fb113ae",
|
|
93
93
|
name: "decorator"
|
|
94
94
|
})), r && t("img", {
|
|
95
|
-
key: "
|
|
95
|
+
key: "aa8d8377e42e1dfbf23f293a94f4098b5048ed7a",
|
|
96
96
|
class: `${e ? "avatar-img" : "avatar-img-default"}`,
|
|
97
97
|
"test-id": "userImage",
|
|
98
98
|
src: this.src,
|
|
@@ -100,7 +100,7 @@ const i = class {
|
|
|
100
100
|
onLoad: this.onLoad,
|
|
101
101
|
alt: this.name || ""
|
|
102
102
|
}), i && t("svg", {
|
|
103
|
-
key: "
|
|
103
|
+
key: "01b678b18936040e367c6ccb1e693109058ec65b",
|
|
104
104
|
viewBox: "0 0 100 100",
|
|
105
105
|
preserveAspectRatio: "xMidYMid meet",
|
|
106
106
|
"test-id": "userInitials",
|
|
@@ -108,18 +108,18 @@ const i = class {
|
|
|
108
108
|
"aria-label": this.name,
|
|
109
109
|
"aria-hidden": !this.name && "true"
|
|
110
110
|
}, t("text", {
|
|
111
|
-
key: "
|
|
111
|
+
key: "00e6e13fff99f79ed2c1aef06706a46b8db39836",
|
|
112
112
|
x: "50",
|
|
113
113
|
y: "50",
|
|
114
114
|
"dominant-baseline": "central",
|
|
115
115
|
"text-anchor": "middle",
|
|
116
116
|
"aria-hidden": "true"
|
|
117
117
|
}, a)), o && t("div", {
|
|
118
|
-
key: "
|
|
118
|
+
key: "8b11436b66465ff1894129484bb245f80a36ffbe",
|
|
119
119
|
"test-id": "fallbackIcon",
|
|
120
120
|
class: "fallback"
|
|
121
121
|
}, t("q2-icon", {
|
|
122
|
-
key: "
|
|
122
|
+
key: "4813df821c1e7d89b338885f791db2cd3bbf0e8b",
|
|
123
123
|
type: this.icon
|
|
124
124
|
})));
|
|
125
125
|
}
|
|
@@ -442,14 +442,14 @@ const n = class {
|
|
|
442
442
|
}, this.renderCardContent()) : this.renderCardContent();
|
|
443
443
|
const a = !!this.cardStatus && this.size === "large";
|
|
444
444
|
return i(e, {
|
|
445
|
-
key: "
|
|
445
|
+
key: "f8ff5ff3349340873c965ac61f4411575fea0e7a",
|
|
446
446
|
class: {
|
|
447
447
|
[`${this.orientation}`]: true,
|
|
448
448
|
"has-action": this.hasActionSlotContent,
|
|
449
449
|
"has-banner": a
|
|
450
450
|
}
|
|
451
451
|
}, this.renderStatusBanner(), i("div", {
|
|
452
|
-
key: "
|
|
452
|
+
key: "e665a74e47232275906e499e02d513ea20cdd21b",
|
|
453
453
|
class: "card-wrapper"
|
|
454
454
|
}, t, this.renderAction()));
|
|
455
455
|
}
|
|
@@ -100,7 +100,7 @@ const l = class {
|
|
|
100
100
|
render() {
|
|
101
101
|
const {label: e} = this;
|
|
102
102
|
return t(r, {
|
|
103
|
-
key: "
|
|
103
|
+
key: "82eb1502a11ae372d979f81043dc2defc4bb45ac",
|
|
104
104
|
class: this.generatePaneClass(this.currentPaneIndex),
|
|
105
105
|
tabIndex: this.isActivePane ? 0 : -1,
|
|
106
106
|
role: "group",
|
|
@@ -109,10 +109,10 @@ const l = class {
|
|
|
109
109
|
"aria-label": e ? n(e) : n("tecton.element.carousel.itemDescription", [ (this.currentPaneIndex + 1).toString(), (this.siblingCount || 0).toString() ]),
|
|
110
110
|
onClick: this.paneClicked
|
|
111
111
|
}, t("article", {
|
|
112
|
-
key: "
|
|
112
|
+
key: "1d67b902248a3fec6cdca88199f3f206c9702188",
|
|
113
113
|
class: "q2-carousel-pane-main-content"
|
|
114
114
|
}, t("slot", {
|
|
115
|
-
key: "
|
|
115
|
+
key: "d22aac4e2004baa840182c119751923c023dde29"
|
|
116
116
|
})));
|
|
117
117
|
}
|
|
118
118
|
get hostElement() {
|
|
@@ -4,9 +4,9 @@ import { o as a, l as o } from "./index-C4PILj1_.js";
|
|
|
4
4
|
|
|
5
5
|
import { m as r } from "./mirror-emit-DUjY_ucm.js";
|
|
6
6
|
|
|
7
|
-
import { L as h, a as n, p as l, u as p, i as d, g as c, b as f, f as u, c as m, d as g, e as
|
|
7
|
+
import { L as h, a as n, p as l, u as p, i as d, g as c, b as f, f as u, c as m, d as g, e as w } from "./charting-BNYmzAlx.js";
|
|
8
8
|
|
|
9
|
-
import { d as
|
|
9
|
+
import { d as b, i as y, a as x } from "./universalTransition-Cjjdkq64.js";
|
|
10
10
|
|
|
11
11
|
import "./install-qbdIiszz.js";
|
|
12
12
|
|
|
@@ -29,12 +29,12 @@ function install(t) {
|
|
|
29
29
|
}
|
|
30
30
|
});
|
|
31
31
|
// Down sample after filter
|
|
32
|
-
t.registerProcessor(t.PRIORITY.PROCESSOR.STATISTIC,
|
|
32
|
+
t.registerProcessor(t.PRIORITY.PROCESSOR.STATISTIC, b("line"));
|
|
33
33
|
}
|
|
34
34
|
|
|
35
35
|
const v = "*{box-sizing:border-box}*:active{outline:none}*:focus-visible{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{width:var(--tct-area-chart-width, 100%);height:var(--tct-area-chart-height, 100%);display:block}.container{width:100%;height:100%}.chart-container{width:100%;height:100%}";
|
|
36
36
|
|
|
37
|
-
p([ m, install, g, y, x,
|
|
37
|
+
p([ m, install, g, y, x, w ]);
|
|
38
38
|
|
|
39
39
|
const U = class {
|
|
40
40
|
constructor(i) {
|
|
@@ -260,10 +260,10 @@ const U = class {
|
|
|
260
260
|
// #region Render Methods
|
|
261
261
|
render() {
|
|
262
262
|
return i("div", {
|
|
263
|
-
key: "
|
|
263
|
+
key: "37129ccaf8f459d8a600de7f0c4a2d28a0d8acc3",
|
|
264
264
|
class: "container"
|
|
265
265
|
}, i("div", {
|
|
266
|
-
key: "
|
|
266
|
+
key: "eb1e9f5290cc300f848721e093eac01efd5f52f6",
|
|
267
267
|
ref: t => this.chartContainer = t,
|
|
268
268
|
class: "chart-container",
|
|
269
269
|
role: "img",
|
|
@@ -203,10 +203,10 @@ const U = class {
|
|
|
203
203
|
// #region Render Methods
|
|
204
204
|
render() {
|
|
205
205
|
return s("div", {
|
|
206
|
-
key: "
|
|
206
|
+
key: "e0ef7177ebb56392ef550b5190a28d34bd93c1a2",
|
|
207
207
|
class: "container"
|
|
208
208
|
}, s("div", {
|
|
209
|
-
key: "
|
|
209
|
+
key: "8be60d7c6c0ca570fb3515998a47862aa6a29676",
|
|
210
210
|
ref: t => this.chartContainer = t,
|
|
211
211
|
class: "chart-container",
|
|
212
212
|
role: "img",
|
|
@@ -858,15 +858,15 @@ const F = class {
|
|
|
858
858
|
}
|
|
859
859
|
render() {
|
|
860
860
|
return n("click-elsewhere", {
|
|
861
|
-
key: "
|
|
861
|
+
key: "eb78727bb8c480478cde795c1e6bd744f988480f",
|
|
862
862
|
onChange: this.onClickElsewhere
|
|
863
863
|
}, n("figure", {
|
|
864
|
-
key: "
|
|
864
|
+
key: "041df945c97ac0e291340123b54b3c0c14d2981e"
|
|
865
865
|
}, n("div", {
|
|
866
|
-
key: "
|
|
866
|
+
key: "550a9445398812293af981ff10d4109ed23657c9",
|
|
867
867
|
class: "container"
|
|
868
868
|
}, n("div", {
|
|
869
|
-
key: "
|
|
869
|
+
key: "48d7a6a9639c4a3f19ec1534d08d456474a206d7",
|
|
870
870
|
ref: t => this.chartContainer = t,
|
|
871
871
|
"aria-describedby": !this.isClickable ? "center-card-description" : undefined,
|
|
872
872
|
class: "chart-container",
|
|
@@ -876,9 +876,9 @@ const F = class {
|
|
|
876
876
|
tabIndex: !this.isClickable ? 0 : undefined,
|
|
877
877
|
onKeyDown: !this.isClickable ? this.onButtonKeyDown : undefined
|
|
878
878
|
}), this.renderCenterBlock()), this.showLegend && n("figcaption", {
|
|
879
|
-
key: "
|
|
879
|
+
key: "7764c5810953930a594449817e2906699346df6c"
|
|
880
880
|
}, n("q2-legend", {
|
|
881
|
-
key: "
|
|
881
|
+
key: "7674d2cfd8da31367f4e1b56d42f09b79f4ba99b",
|
|
882
882
|
class: "legend",
|
|
883
883
|
data: this.legendData,
|
|
884
884
|
format: this.format,
|
|
@@ -127,23 +127,23 @@ const h = class {
|
|
|
127
127
|
const t = this.label || this.optional || this.readonly;
|
|
128
128
|
const e = t && !this.hideLabel || this.hasError;
|
|
129
129
|
return r(o, {
|
|
130
|
-
key: "
|
|
130
|
+
key: "4e9159cc489b8c2ed9adf3c8263355994364780e"
|
|
131
131
|
}, e && r("div", {
|
|
132
|
-
key: "
|
|
132
|
+
key: "85c21ddc03d2abaf4e78b1922dcf3705ec673fc9",
|
|
133
133
|
class: "label-row"
|
|
134
134
|
}, t && !this.hideLabel && r("div", {
|
|
135
|
-
key: "
|
|
135
|
+
key: "071eb3359b048a5e7f89f7c525362e065707a8fe",
|
|
136
136
|
class: "group-legend"
|
|
137
137
|
}, c(this)), this.hasError && r("q2-icon", {
|
|
138
|
-
key: "
|
|
138
|
+
key: "76a591fb52671d43351322faa488608128320183",
|
|
139
139
|
type: "error",
|
|
140
140
|
"test-id": "iconError"
|
|
141
141
|
})), r("fieldset", {
|
|
142
|
-
key: "
|
|
142
|
+
key: "0bcc9a5419df7ab0bf2abfc6189983e6cf5bd779",
|
|
143
143
|
onChange: this.onInnerCheckboxChange,
|
|
144
144
|
"aria-invalid": this.hasError ? `${this.hasError}` : undefined
|
|
145
145
|
}, t && r("legend", {
|
|
146
|
-
key: "
|
|
146
|
+
key: "c6a5f3ec8289091b6d113a36d2fed9b83a5c7088",
|
|
147
147
|
class: "sr-only"
|
|
148
148
|
}, c(this)), this.inputDom()));
|
|
149
149
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"q2-checkbox.q2-tag.entry.esm.js","sources":["src/components/q2-checkbox/q2-checkbox.scss?tag=q2-checkbox&encapsulation=shadow","src/components/q2-checkbox/q2-checkbox.tsx","src/components/q2-tag/q2-tag.scss?tag=q2-tag&encapsulation=shadow","src/components/q2-tag/q2-tag.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n\n:host {\n --comp-checkbox-padding: #{var-list(\n --tct-checkbox-padding,\n unquote('#{var-list(var-prefixer(checkbox-vertical-padding), 8px)} 0')\n )};\n\n display: block;\n position: relative;\n padding: var(--comp-checkbox-padding);\n --comp-default-checkbox-margin: #{var-list(var-prefixer(checkbox-margin-top), 0px) 0\n var-list(var-prefixer(checkbox-margin-bottom), 0px)};\n margin: var-list(--tct-checkbox-margin, --comp-default-checkbox-margin);\n}\n\n.container {\n --comp-checkbox-size: #{var-list(var-prefixer(checkbox-size), 24px)};\n --comp-checkbox-default-column-gap: var(--app-scale-2x, 10px);\n --comp-checkbox-default-row-gap: 0;\n --comp-checkbox-default-gap: #{var(--comp-checkbox-default-row-gap) var(--comp-checkbox-default-column-gap)};\n --comp-checkbox-tween: #{var-list(--tct-tween-1, --app-tween-1, unquote('0.2s ease'))};\n --comp-checkbox-toggle-width: #{var-list(var-prefixer(checkbox-toggle-width), 38px)};\n\n --comp-checkbox-toggle-track-fill: #{var-list(\n --tct-checkbox-toggle-track-fill,\n --tct-checkbox-toggle-track-color,\n transparent\n )};\n --comp-checkbox-toggle-track-fill-active: #{var-list(\n --tct-checkbox-toggle-active-track-fill,\n --tct-checkbox-toggle-active-track-color,\n --tct-checkbox-toggle-active-color,\n --t-primary-l1,\n #7755af\n )};\n --comp-checkbox-toggle-track-fill-hover: #{var-list(\n --tct-checkbox-toggle-hover-track-fill,\n --tct-checkbox-toggle-hover-track-color,\n --comp-checkbox-toggle-track-fill\n )};\n --comp-checkbox-toggle-track-fill-error: #{var-list(\n --tct-checkbox-toggle-error-track-fill,\n --tct-checkbox-toggle-error-track-color,\n --comp-checkbox-toggle-track-fill\n )};\n --comp-checkbox-toggle-track-fill-error-hover: #{var-list(\n --tct-checkbox-toggle-error-hover-track-fill,\n --tct-checkbox-toggle-error-hover-track-color,\n --comp-checkbox-toggle-track-fill-error\n )};\n --comp-checkbox-toggle-track-fill-error-active: #{var-list(\n --tct-checkbox-toggle-error-active-track-fill,\n --tct-checkbox-toggle-error-active-track-color,\n --comp-checkbox-toggle-track-fill-error\n )};\n\n --comp-checkbox-toggle-error-color: #{var-list(--tct-checkbox-toggle-error-color, --comp-checkbox-error-color)};\n --comp-checkbox-toggle-color: #{var-list(--tct-checkbox-toggle-color, --t-gray-8, #808080)};\n --comp-checkbox-gap: #{var-list(var-prefixer(checkbox-gap), --comp-checkbox-default-gap)};\n --comp-checkbox-outer-stroke-color: #{var-list(\n var-prefixer(checkbox-outer-stroke-color),\n --t-a11y-gray-color-AA,\n #949494\n )};\n --comp-checkbox-outer-fill-color: #{var-list(\n var-prefixer(checkbox-outer-fill-color),\n --tct-white,\n --app-white,\n #ffffff\n )};\n --comp-checkbox-checked-fill-color: #{var-list(\n --tct-checkbox-checked-fill-color,\n --t-primary,\n #040404\n )};\n --comp-checkbox-checked-color: #{var-list(\n --tct-checkbox-checked-stroke-color,\n --tct-white,\n --app-white,\n #FFFFFF\n )};\n --comp-control-width: var(--comp-checkbox-size);\n --comp-checkbox-error-color: #{var-list(--tct-stoplight-error, --const-stoplight-alert, #d20a0a)};\n\n --comp-checkbox-bold-fallback-stroke-width: #{var-list(--tct-checkbox-bold-fallback-stroke-width, 0.7px)};\n --comp-checkbox-stroke-width: #{var-list(--tct-checkbox-stroke-width, unset)};\n --comp-checkbox-checked-stroke-width: #{var-list(\n --tct-checkbox-checked-stroke-width,\n --comp-checkbox-bold-fallback-stroke-width\n )};\n --comp-checkbox-hover-stroke-width: #{var-list(--tct-checkbox-hover-stroke-width, unset)};\n --comp-checkbox-focused-stroke-width: #{var-list(--tct-checkbox-focused-stroke-width, unset)};\n --comp-checkbox-checked-hover-stroke-width: #{var-list(\n --tct-checkbox-checked-hover-stroke-width,\n --comp-checkbox-bold-fallback-stroke-width\n )};\n --comp-checkbox-checked-focused-stroke-width: #{var-list(\n --tct-checkbox-checked-focused-stroke-width,\n --comp-checkbox-bold-fallback-stroke-width\n )};\n --comp-checkbox-description-stroke-width: #{var-list(\n --tct-checkbox-description-stroke-width,\n --comp-checkbox-bold-fallback-stroke-width\n )};\n --comp-checkbox-description-focused-stroke-width: #{var-list(\n --tct-checkbox-description-focused-stroke-width,\n --comp-checkbox-bold-fallback-stroke-width\n )};\n --comp-checkbox-description-hover-stroke-width: #{var-list(\n --tct-checkbox-description-hover-stroke-width,\n --comp-checkbox-bold-fallback-stroke-width\n )};\n\n :host([type='favorite']) & {\n --comp-checkbox-favorite-stroke-color: #{var-list(\n var-prefixer(checkbox-favorite-stroke-color),\n --t-a11y-gray-color-AA,\n #949494\n )};\n --comp-checkbox-favorite-fill-color: #{var-list(var-prefixer(checkbox-favorite-fill-color), #db7d24)};\n }\n\n display: grid;\n grid-template-areas:\n 'svg label'\n 'svg description';\n align-items: center;\n gap: var(--comp-checkbox-gap);\n grid-template-columns: var(--comp-control-width) calc(\n 100% - var(--comp-control-width) - var(--comp-checkbox-default-column-gap)\n );\n\n :host([hide-label]:not([hide-label='false'])) & {\n grid-template-areas: 'svg';\n grid-template-columns: var(--comp-control-width);\n }\n\n :host([type='toggle']) & {\n --comp-control-width: var(--comp-checkbox-toggle-width);\n }\n\n :host([alignment='right']) &,\n :host([type='toggle']:not([alignment])) & {\n grid-template-areas:\n 'label svg'\n 'description svg';\n grid-template-columns: calc(100% - var(--comp-control-width) - var(--comp-checkbox-default-column-gap)) var(\n --comp-control-width\n );\n }\n}\n\n.label-control {\n align-items: center;\n display: flex;\n}\n\n.label-text {\n grid-area: label;\n\n :host([description]) & {\n -webkit-text-stroke-width: var(--comp-checkbox-description-stroke-width);\n text-stroke-width: var(--comp-checkbox-description-stroke-width);\n }\n :host([checked]:not([checked='false'])) & {\n -webkit-text-stroke-width: var(--comp-checkbox-checked-stroke-width);\n text-stroke-width: var(--comp-checkbox-checked-stroke-width);\n }\n :host(:hover) & {\n -webkit-text-stroke-width: var(--comp-checkbox-hover-stroke-width);\n text-stroke-width: var(--comp-checkbox-hover-stroke-width);\n }\n :host(:focus-within) & {\n -webkit-text-stroke-width: var(--comp-checkbox-focused-stroke-width);\n text-stroke-width: var(--comp-checkbox-focused-stroke-width);\n }\n :host([description]:hover) & {\n -webkit-text-stroke-width: var(--comp-checkbox-description-hover-stroke-width);\n text-stroke-width: var(--comp-checkbox-description-hover-stroke-width);\n }\n :host([checked]:not([checked='false']):hover) & {\n -webkit-text-stroke-width: var(--comp-checkbox-checked-hover-stroke-width);\n text-stroke-width: var(--comp-checkbox-checked-hover-stroke-width);\n }\n :host([description]:focus-within) & {\n -webkit-text-stroke-width: var(--comp-checkbox-description-focused-stroke-width);\n text-stroke-width: var(--comp-checkbox-description-focused-stroke-width);\n }\n :host([checked]:not([checked='false']):focus-within) & {\n -webkit-text-stroke-width: var(--comp-checkbox-checked-focused-stroke-width);\n text-stroke-width: var(--comp-checkbox-checked-focused-stroke-width);\n }\n :host(:active) & {\n -webkit-text-stroke-width: var(--tct-checkbox-active-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-active-stroke-width, unset);\n }\n :host([checked]:not([checked='false']):active) & {\n -webkit-text-stroke-width: var(--tct-checkbox-checked-active-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-checked-active-stroke-width, unset);\n }\n :host([has-error]:not([has-error='false']):hover) & {\n -webkit-text-stroke-width: var(--tct-checkbox-error-hover-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-error-hover-stroke-width, unset);\n }\n :host([has-error]:not([has-error='false']):focus-within) & {\n -webkit-text-stroke-width: var(--tct-checkbox-error-focused-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-error-focused-stroke-width, unset);\n }\n :host([has-error]:not([has-error='false']):active) & {\n -webkit-text-stroke-width: var(--tct-checkbox-error-active-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-error-active-stroke-width, unset);\n }\n :host([checked]:not([checked='false'])[has-error]:not([has-error='false']):hover) & {\n -webkit-text-stroke-width: var(--tct-checkbox-checked-error-hover-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-checked-error-hover-stroke-width, unset);\n }\n :host([checked]:not([checked='false'])[has-error]:not([has-error='false']):focus-within) & {\n -webkit-text-stroke-width: var(--tct-checkbox-checked-error-focused-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-checked-error-focused-stroke-width, unset);\n }\n :host([checked]:not([checked='false'])[has-error]:not([has-error='false']):active) & {\n -webkit-text-stroke-width: var(--tct-checkbox-checked-error-active-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-checked-error-active-stroke-width, unset);\n }\n\n label {\n line-height: var-list(--tct-checkbox-label-line-height, 24px);\n .label-content {\n display: inline;\n font-size: var(--tct-checkbox-label-font-size, inherit);\n }\n }\n}\n\n.description-text {\n grid-area: description;\n font-weight: var-list(var-prefixer(checkbox-description-font-weight), 400);\n\n :host(:hover) & {\n font-weight: var-list(\n --tct-checkbox-hover-description-font-weight,\n var-prefixer(checkbox-description-font-weight),\n 400\n );\n }\n}\n\nlabel {\n color: var-list(--tct-checkbox-label-color);\n cursor: pointer;\n hyphens: var-list(--tct-checkbox-label-hyphens, auto);\n word-break: var-list(--tct-checkbox-label-word-break, break-word);\n word-wrap: var-list(--tct-checkbox-label-word-wrap, break-word);\n}\n\n.checkbox-icon {\n width: var(--comp-checkbox-size);\n height: var(--comp-checkbox-size);\n border-radius: var-list(\n var-prefixer(checkbox-outer-border-radius),\n --tct-border-radius-1,\n --app-border-radius-1,\n 4px\n );\n stroke: var(--comp-checkbox-outer-stroke-color);\n fill: var(--comp-checkbox-outer-fill-color);\n stroke-width: var-list(var-prefixer(checkbox-outer-stroke-width), 2);\n flex-shrink: 0;\n box-shadow: var(--tct-checkbox-box-shadow);\n\n rect {\n transition: fill var-list(--tct-checkbox-tween, --app-tween-2, unquote('0.4s ease'));\n }\n\n :host([checked]:not([checked='false']):not([type='favorite'])) & {\n stroke: var-list(\n --comp-checkbox-checked-fill-color,\n var-prefixer(checkbox-checked-outer-stroke-color),\n --comp-checkbox-outer-stroke-color\n );\n\n rect {\n fill: var(--comp-checkbox-checked-fill-color);\n }\n }\n\n :host([has-error]:not([has-error='false']):not([type='favorite'])) & {\n stroke: var-list(--tct-checkbox-error-outer-stroke-color, --comp-checkbox-error-color);\n box-shadow: var-list(--tct-checkbox-error-box-shadow, --tct-checkbox-box-shadow);\n\n rect {\n fill: var-list(--tct-checkbox-error-outer-fill-color, --comp-checkbox-outer-fill-color);\n }\n }\n\n :host([has-error]:not([has-error='false']):not([type='favorite'])[checked]:not([checked='false'])) & {\n rect {\n fill: var-list(--tct-checkbox-error-checked-outer-fill-color);\n }\n }\n\n :host([indeterminate]:not([indeterminate='false']):not([type='favorite'])) & {\n stroke: var-list(\n --comp-checkbox-checked-fill-color,\n var-prefixer(checkbox-checked-outer-stroke-color),\n --comp-checkbox-outer-stroke-color\n );\n\n rect {\n fill: var(--comp-checkbox-checked-fill-color);\n }\n }\n\n :host(:hover:not([type='favorite'])) & {\n stroke: var-list(--tct-checkbox-hover-outer-stroke-color, --comp-checkbox-outer-stroke-color);\n box-shadow: var-list(--tct-checkbox-hover-box-shadow, --tct-checkbox-box-shadow);\n rect {\n fill: var-list(--tct-checkbox-hover-outer-fill-color, --comp-checkbox-outer-fill-color);\n }\n }\n :host(:hover[has-error]:not([has-error='false']):not([type='favorite'])) & {\n stroke: var-list(\n --tct-checkbox-error-hover-outer-stroke-color,\n --tct-checkbox-error-outer-stroke-color,\n --comp-checkbox-error-color\n );\n box-shadow: var-list(\n --tct-checkbox-error-hover-box-shadow,\n --tct-checkbox-error-box-shadow,\n --tct-checkbox-hover-box-shadow,\n --tct-checkbox-box-shadow\n );\n rect {\n fill: var-list(\n --tct-checkbox-error-hover-outer-fill-color,\n --tct-checkbox-error-outer-fill-color,\n --comp-checkbox-outer-fill-color\n );\n }\n }\n\n :host(:focus-within:not([type='favorite'])) & {\n --comp-checkbox-focused-box-shadow: #{var(--const-double-focus-ring),\n var-list(--tct-global-focus, unquote('0 0 0 2px #33b4ff'))};\n\n stroke: var-list(var-prefixer(checkbox-focused-outer-stroke-color), --comp-checkbox-outer-stroke-color);\n fill: var-list(--tct-checkbox-focused-outer-fill-color, --comp-checkbox-outer-fill-color);\n box-shadow: var-list(\n --tct-checkbox-focused-box-shadow,\n --tct-checkbox-box-shadow,\n --comp-checkbox-focused-box-shadow\n );\n }\n :host(:focus-within[has-error]:not([has-error='false']):not([type='favorite'])) & {\n stroke: var-list(\n --tct-checkbox-error-focused-outer-stroke-color,\n --tct-checkbox-error-outer-stroke-color,\n --comp-checkbox-error-color\n );\n fill: var-list(\n --tct-checkbox-error-focused-outer-fill-color,\n --tct-checkbox-error-outer-fill-color,\n --comp-checkbox-outer-fill-color\n );\n box-shadow: var-list(\n --tct-checkbox-error-focused-box-shadow,\n --tct-checkbox-error-box-shadow,\n --tct-checkbox-box-shadow,\n --comp-checkbox-focused-box-shadow\n );\n }\n\n // Favorite\n :host([type='favorite']) & {\n --tct-icon-stroke-width: #{var-list(var-prefixer(checkbox-favorite-stroke-width), 1)};\n --tct-icon-stroke-primary: var(--comp-checkbox-favorite-stroke-color);\n transition:\n fill var(--comp-checkbox-tween),\n color var(--comp-checkbox-tween),\n stroke var(--comp-checkbox-tween);\n }\n\n :host(:hover[type='favorite']) & {\n --tct-icon-stroke-primary: #{var-list(\n --tct-checkbox-favorite-hover-stroke-color,\n --comp-checkbox-favorite-fill-color\n )};\n --tct-icon-stroke-width: #{var-list(var-prefixer(checkbox-favorite-hover-stroke-width), 2)};\n }\n\n :host([type='favorite']:focus-within) & {\n --tct-icon-stroke-primary: #{var-list(\n --tct-checkbox-favorite-focused-stroke-color,\n --comp-checkbox-favorite-fill-color\n )};\n --tct-icon-stroke-width: #{var-list(var-prefixer(checkbox-favorite-hover-stroke-width), 2)};\n }\n\n // Checked favorite\n :host([checked]:not([checked='false'])[type='favorite']) & {\n --tct-icon-stroke-primary: #{var-list(\n --tct-checkbox-favorite-checked-stroke-color,\n --tct-checkbox-favorite-stroke-color,\n --comp-checkbox-favorite-fill-color\n )};\n fill: var-list(--tct-checkbox-favorite-checked-fill-color, --comp-checkbox-favorite-fill-color);\n transition:\n fill var(--comp-checkbox-tween),\n color var(--comp-checkbox-tween),\n stroke var(--comp-checkbox-tween);\n }\n\n :host([checked]:not([checked='false'])[type='favorite']:hover) & {\n --tct-icon-stroke-primary: #{var-list(\n --tct-checkbox-favorite-checked-hover-stroke-color,\n --tct-checkbox-favorite-hover-stroke-color,\n --comp-checkbox-favorite-stroke-color\n )};\n --tct-icon-fill-primary: #{var-list(\n --tct-checkbox-favorite-checked-fill-color,\n --comp-checkbox-favorite-fill-color\n )};\n --tct-icon-stroke-width: #{var-list(var-prefixer(checkbox-favorite-hover-stroke-width), 2)};\n }\n\n :host([checked]:not([checked='false'])[type='favorite']:focus-within) & {\n --tct-icon-stroke-primary: #{var-list(\n --tct-checkbox-favorite-checked-focused-stroke-color,\n --tct-checkbox-favorite-focused-stroke-color,\n --comp-checkbox-favorite-stroke-color\n )};\n --tct-icon-stroke-width: #{var-list(var-prefixer(checkbox-favorite-hover-stroke-width), 2)};\n }\n\n :host([has-error]:not([has-error='false'])[type='favorite']) & {\n --tct-icon-stroke-primary: #{var-list(--tct-checkbox-favorite-error-stroke-color, --comp-checkbox-error-color)};\n }\n :host([has-error]:not([has-error='false'])[type='favorite'][checked]:not([checked='false'])) & {\n --tct-icon-stroke-primary: #{var-list(--tct-checkbox-favorite-error-stroke-color, --comp-checkbox-error-color)};\n }\n}\n\n.checkbox-fill {\n fill: none;\n stroke: var-list(--comp-checkbox-checked-color);\n stroke-width: var-list(var-prefixer(checkbox-check-stroke-width), 2.5);\n stroke-linecap: round;\n stroke-linejoin: round;\n\n :host([has-error]:not([has-error='false']):not([type='favorite'])) & {\n stroke: var(--tct-checkbox-error-checkmark-stroke-color, #d20a0a);\n stroke-width: var(--tct-checkbox-error-checkmark-stroke-width, 2.5);\n }\n}\n\n.checked-fill {\n stroke-dasharray: 16;\n stroke-dashoffset: 16;\n animation-name: draw-checkmark;\n animation-duration: var-list(--tct-checkbox-animation-duration, --t-tween-time-in-4, 300ms);\n animation-timing-function: var-list(--tct-checkbox-animation-timing-function, ease-out);\n animation-fill-mode: var-list(--tct-checkbox-animation-fill-mode, forwards);\n}\n\n@keyframes draw-checkmark {\n to {\n stroke-dashoffset: 0;\n }\n}\n\n.indeterminate-fill {\n stroke-width: var-list(var-prefixer(checkbox-indeterminate-stroke-width), 3.5);\n}\n\n.toggle-svg-container {\n height: 30px;\n width: var(--comp-checkbox-toggle-width);\n position: relative;\n text-align: initial;\n}\n\n.toggle-indicator,\n.toggle-track {\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n}\n.toggle-indicator {\n transition:\n left var(--comp-checkbox-tween),\n height var(--comp-checkbox-tween),\n width var(--comp-checkbox-tween);\n height: 16px;\n width: 16px;\n left: 4px;\n border-radius: 50%;\n}\n\n.toggle-track {\n --comp-default-track-box-shadow: inset 0 0 0 1px var(--comp-checkbox-toggle-color);\n height: 24px;\n width: 38px;\n fill: var(--comp-checkbox-toggle-track-fill);\n border-radius: var(--app-border-radius-3, 12px);\n box-shadow: var-list(--tct-checkbox-toggle-track-box-shadow, --comp-default-track-box-shadow);\n transition:\n fill var(--comp-checkbox-tween),\n box-shadow var(--comp-checkbox-tween);\n}\n\n.toggle-circle {\n mask: url(#xMask);\n fill: var(--comp-checkbox-toggle-color);\n transition: fill var(--comp-checkbox-tween);\n}\n\n.toggle-icon {\n stroke-linecap: round;\n stroke-linejoin: round;\n stroke-width: var(--tct-checkbox-toggle-icon-stroke-width, 2);\n stroke: black;\n}\n\n:host(:is(:not([checked]), [checked='false'])) {\n &:host(:is(:not([disabled]), [disabled='false']):is(:not([group-disabled]), [group-disabled='false'])) {\n :hover,\n :focus-within {\n .toggle-track {\n --comp-default-hover-track-box-shadow: inset 0 0 0 2px var(--comp-checkbox-toggle-color);\n box-shadow: var-list(\n --tct-checkbox-toggle-hover-track-box-shadow,\n --comp-default-hover-track-box-shadow\n );\n fill: var(--comp-checkbox-toggle-track-fill-hover);\n }\n .toggle-indicator {\n height: 18px;\n width: 18px;\n }\n .toggle-circle {\n fill: var-list(--tct-checkbox-toggle-hover-circle-color, --t-primary-d1, --t-gray-6, #4d4d4d);\n }\n .label-text {\n color: var(--tct-checkbox-label-hover-color, inherit);\n }\n .description-text {\n color: var(--tct-checkbox-description-hover-color, inherit);\n -webkit-text-stroke-width: var(--tct-checkbox-description-hover-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-description-hover-stroke-width, unset);\n }\n }\n :active {\n .toggle-circle {\n fill: var(--comp-checkbox-toggle-track-fill-active);\n }\n .label-text {\n color: var(--tct-checkbox-label-active-color, inherit);\n }\n .description-text {\n color: var(--tct-checkbox-description-active-color, inherit);\n -webkit-text-stroke-width: var(--tct-checkbox-description-active-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-description-active-stroke-width, unset);\n }\n }\n }\n\n &:host([has-error]:not([has-error='false'])) {\n .toggle-track {\n box-shadow: inset 0 0 0 1px var(--comp-checkbox-toggle-error-color);\n fill: var(--comp-checkbox-toggle-track-fill-error);\n }\n .toggle-circle {\n fill: var(--comp-checkbox-toggle-error-color);\n }\n\n &:host(:is(:not([disabled]), [disabled='false']):is(:not([group-disabled]), [group-disabled='false'])) {\n :hover,\n :focus-within {\n .toggle-track {\n box-shadow: inset 0 0 0 2px var(--comp-checkbox-toggle-error-color);\n fill: var(--comp-checkbox-toggle-track-fill-error-hover);\n }\n .toggle-circle {\n fill: var-list(--tct-checkbox-toggle-error-hover-color, --comp-checkbox-toggle-error-color);\n }\n .label-text {\n color: var(--tct-checkbox-label-hover-color, inherit);\n }\n .description-text {\n color: var(--tct-checkbox-description-hover-color, inherit);\n -webkit-text-stroke-width: var(--tct-checkbox-description-hover-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-description-hover-stroke-width, unset);\n }\n }\n :active {\n .toggle-track {\n fill: var(--comp-checkbox-toggle-track-fill-error-active);\n }\n .toggle-circle {\n fill: var-list(--tct-checkbox-toggle-error-active-color, --comp-checkbox-toggle-error-color);\n }\n .label-text {\n color: var(--tct-checkbox-error-label-active-color, inherit);\n }\n .description-text {\n color: var(--tct-checkbox-error-description-active-color, inherit);\n -webkit-text-stroke-width: var(--tct-checkbox-error-description-active-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-error-description-active-stroke-width, unset);\n }\n }\n }\n }\n}\n\n:host([checked]:not([checked='false'])) {\n .toggle-indicator {\n left: 18px;\n }\n\n .toggle-track {\n fill: var-list(--tct-checkbox-toggle-checked-track-color, --t-primary, #6a4a9e);\n border: none;\n }\n .toggle-circle {\n mask: url(#checkMask);\n fill: var-list(--tct-checkbox-toggle-checked-circle-color, --t-base, #ffffff);\n }\n\n &:host(:is(:not([disabled]), [disabled='false']):is(:not([group-disabled]), [group-disabled='false'])) {\n :hover,\n :focus-within {\n .toggle-track {\n fill: var-list(--tct-checkbox-toggle-checked-hover-track-color, --t-primary-d1, #5f438e);\n }\n .toggle-indicator {\n height: 18px;\n width: 18px;\n }\n .label-text {\n color: var(--tct-checkbox-checked-label-hover-color, inherit);\n }\n .description-text {\n color: var(--tct-checkbox-checked-description-hover-color, inherit);\n -webkit-text-stroke-width: var(--tct-checkbox-checked-description-hover-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-checked-description-hover-stroke-width, unset);\n }\n }\n\n :active {\n .toggle-track {\n fill: var-list(--tct-checkbox-toggle-checked-active-track-color, --t-primary-l1, #7755af);\n }\n .toggle-indicator {\n height: 18px;\n width: 18px;\n }\n .label-text {\n color: var(--tct-checkbox-checked-label-active-color, inherit);\n }\n .description-text {\n color: var(--tct-checkbox-checked-description-active-color, inherit);\n -webkit-text-stroke-width: var(--tct-checkbox-checked-description-active-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-checked-description-active-stroke-width, unset);\n }\n }\n }\n\n &:host([has-error]:not([has-error='false'])) {\n .toggle-track {\n fill: var-list(--tct-checkbox-toggle-checked-error-track-color, --comp-checkbox-toggle-error-color);\n }\n &:host(:is(:not([disabled]), [disabled='false']):is(:not([group-disabled]), [group-disabled='false'])) {\n :hover,\n :focus-within {\n .toggle-track {\n fill: var-list(\n --tct-checkbox-toggle-checked-error-hover-track-color,\n --comp-checkbox-toggle-error-color\n );\n }\n .label-text {\n color: var(--tct-checkbox-checked-error-label-hover-color, inherit);\n }\n .description-text {\n color: var(--tct-checkbox-checked-error-description-hover-color, inherit);\n -webkit-text-stroke-width: var(--tct-checkbox-checked-error-description-hover-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-checked-error-description-hover-stroke-width, unset);\n }\n }\n\n :active {\n .toggle-track {\n fill: var-list(\n --tct-checkbox-toggle-checked-error-active-track-color,\n --comp-checkbox-toggle-error-color\n );\n }\n .label-text {\n color: var(--tct-checkbox-checked-error-label-active-color, inherit);\n }\n .description-text {\n color: var(--tct-checkbox-checked-error-description-active-color, inherit);\n -webkit-text-stroke-width: var(--tct-checkbox-checked-error-description-active-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-checked-error-description-active-stroke-width, unset);\n }\n }\n }\n }\n}\n\n:host(:is([disabled]:not([disabled='false']), [group-disabled]:not([group-disabled='false']))) {\n cursor: not-allowed;\n opacity: var-list(var-prefixer(checkbox-disabled-opacity), --tct-disabled-opacity, --app-disabled-opacity, 0.4);\n label {\n cursor: not-allowed;\n }\n}\n","import { Component, ComponentInterface, Prop, Element, Listen, Watch, Event, EventEmitter, h } from '@stencil/core';\nimport { createGuid, handleAriaLabel, isEventFromElement, loc, overrideFocus } from 'src/utils';\nimport mirrorEmit from '@/utils/mirror-emit';\n\n/**\n * @name Checkbox\n * @category Forms\n * @summary Use as a single binary choice; nest within a Checkbox Group for grouped selection.\n */\n@Component({ tag: 'q2-checkbox', shadow: true, styleUrl: 'q2-checkbox.scss' })\nexport class Q2Checkbox implements ComponentInterface {\n // #region Own Properties\n\n _id: string = `checkbox-${createGuid()}`;\n inputElement: HTMLInputElement;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region Public Property API\n\n /**\n * @private\n * Tooltip text set by a parent q2-tooltip component for accessibility.\n */\n @Prop()\n _tooltip: string;\n\n /** Determine which side of the label the checkbox will render on. */\n @Prop({ reflect: true })\n alignment: string;\n\n /** @deprecated */\n @Prop({ reflect: true, mutable: true })\n ariaLabel: string;\n\n /** The state of the checkbox. This modifies the visual appearance of the element. */\n @Prop({ reflect: true, mutable: true })\n checked: boolean = false;\n\n /**\n * Populates a description that is displayed beneath the label.\n * @localizable\n */\n @Prop({ reflect: true })\n description: string;\n\n /** Disables the checkbox and prevents interaction. */\n @Prop({ reflect: true })\n disabled: boolean;\n\n /**\n * Used by q2-checkbox-group to disable all checkboxes in the group\n * @private\n */\n @Prop({ reflect: true })\n groupDisabled: boolean;\n\n /** Determines if the component should display in an errant state. */\n @Prop({ reflect: true })\n hasError: boolean = false;\n\n /**\n * Hide's the field's `<label>` element from view.\n *\n * @warning\n * Only use when a visible label is impractical.\n */\n @Prop({ reflect: true, mutable: true })\n hideLabel: boolean;\n\n /**\n * Used on a parent checkbox in a checkbox group (e.g. \"Select All\") to indicate that some, but not all, checkboxes in a group are checked.\n *\n * When `true`, the \"indeterminate\" selection style is applied.\n * To apply the standard \"checked\" selection style, `checked` must be true, and `indeterminate` must be `false`.\n */\n @Prop({ reflect: true })\n indeterminate: boolean;\n\n /**\n * The visible label text for the checkbox. Appears to the right of the box for 'default' and 'favorite' checkboxes, and to the left for 'toggle' checkboxes.\n * Yielded content will be adjacent to this text.\n * @localizable\n */\n @Prop({ reflect: true, mutable: true })\n label: string;\n\n /** A static string used to establish a symbolic relationship between checkboxes. */\n @Prop({ reflect: true })\n name: string;\n\n /** The field is not interactive, but remains focusable. */\n @Prop({ reflect: true })\n readonly: boolean;\n\n /** The field is not interactive, but remains focusable. */\n @Prop({ reflect: true })\n slotReadonly: boolean;\n\n /** The visual style of the checkbox. This does not need to be defined for a standard checkbox. */\n @Prop({ reflect: true })\n type: 'favorite' | 'toggle';\n\n /** A static reference value for the checkbox. */\n @Prop({ reflect: true })\n value: string;\n\n // #endregion\n // #region Events\n\n /**\n * Emitted when the checkbox is toggled.\n * @deprecated Use 'tctChange' instead\n * @legacyEvent\n */\n @Event()\n change: EventEmitter<{ value: string; checked: boolean }>;\n\n /**\n * Emitted when the checkbox is toggled.\n * @legacyEvent\n */\n @Event()\n tctChange: EventEmitter<{ value: string; checked: boolean }>;\n\n // #endregion\n // #region Component Lifecycle Events\n\n componentWillLoad() {\n handleAriaLabel(this);\n }\n\n componentDidLoad(): void {\n overrideFocus(this.hostElement);\n this.hostElement.click = () => this.inputElement.click();\n }\n\n // #endregion\n // #region Listeners\n\n @Listen('change')\n defaultChangeHandler(event: CustomEvent) {\n // We use setTimeout to give an opportunity to call preventDefault\n setTimeout(() => this.handleChangeEvent(event), 0);\n }\n\n @Listen('focus')\n delegateFocus(event: FocusEvent) {\n if (!isEventFromElement(event, this.hostElement)) return;\n this.hostElement.shadowRoot.querySelector('input').focus();\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('ariaLabel')\n ariaLabelObserver() {\n handleAriaLabel(this);\n }\n\n // #endregion\n // #region Local Methods\n\n get composedAriaLabel(): string | undefined {\n const baseText = loc(this.label) || undefined;\n if (!this._tooltip && !baseText) return undefined;\n if (!this._tooltip) return baseText;\n if (!baseText) return this._tooltip;\n return `${baseText} - ${this._tooltip}`;\n }\n\n handleChangeEvent(event: CustomEvent<{ checked: boolean; value: string }>) {\n if (\n this.readonly ||\n this.disabled ||\n this.hostElement.onchange ||\n event.defaultPrevented ||\n event.target !== this.hostElement ||\n !event.detail\n ) {\n return;\n }\n this.checked = event.detail.checked;\n }\n\n onInputClick = (event: Event) => {\n event.stopPropagation();\n event.preventDefault();\n\n const isNotInteractive = this.disabled || this.readonly || this.slotReadonly;\n if (isNotInteractive) return;\n if (!(event.target instanceof HTMLInputElement)) return;\n const { value, checked } = event.target;\n\n mirrorEmit(this, ['change', 'tctChange'], {\n value,\n checked,\n });\n this.inputElement.focus();\n };\n\n // #endregion\n // #region Render Methods\n\n renderCheckboxSVG() {\n if (this.type === 'favorite') {\n return (\n <q2-icon\n type=\"star\"\n class=\"checkbox-icon\"\n />\n );\n }\n\n if (this.type === 'toggle') {\n return this.renderToggleSVG();\n }\n\n return (\n <svg\n aria-hidden=\"true\"\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n class=\"checkbox-icon\"\n focusable=\"false\"\n >\n <rect\n x=\"1\"\n y=\"1\"\n width=\"18\"\n height=\"18\"\n rx=\"3\"\n />\n {(this.checked || this.indeterminate) && this.renderCheckBoxSVGFill()}\n </svg>\n );\n }\n\n renderCheckBoxSVGFill() {\n if (this.indeterminate) {\n return (\n <line\n class=\"checkbox-fill indeterminate-fill\"\n x1=\"4\"\n y1=\"10\"\n x2=\"16\"\n y2=\"10\"\n />\n );\n }\n return (\n <polyline\n class=\"checkbox-fill checked-fill\"\n points=\"5 11 8.5 14.5 15 6\"\n key={`checkmark-${this.checked}`}\n />\n );\n }\n\n renderToggleSVG() {\n return (\n <div class=\"toggle-svg-container\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n viewBox=\"0 0 38 24\"\n class=\"toggle-track\"\n test-id=\"toggleTrack\"\n >\n <rect\n width=\"38\"\n height=\"24\"\n rx=\"12\"\n ></rect>\n </svg>\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n viewBox=\"0 0 18 18\"\n class=\"toggle-indicator\"\n test-id=\"toggleIndicator\"\n >\n <defs>\n {/* Mask for the X icon */}\n <mask\n id=\"xMask\"\n maskUnits=\"userSpaceOnUse\"\n >\n <rect\n width=\"18\"\n height=\"18\"\n fill=\"white\"\n ></rect>\n <line\n class=\"toggle-icon\"\n x1=\"6.5\"\n y1=\"6.5\"\n x2=\"11.5\"\n y2=\"11.5\"\n stroke=\"black\"\n stroke-width=\"2\"\n ></line>\n <line\n class=\"toggle-icon\"\n x1=\"6.5\"\n y1=\"11.5\"\n x2=\"11.5\"\n y2=\"6.5\"\n stroke=\"black\"\n stroke-width=\"2\"\n ></line>\n </mask>\n {/* Mask for the checkmark icon */}\n <mask id=\"checkMask\">\n <rect\n width=\"18\"\n height=\"18\"\n fill=\"white\"\n />\n <polyline\n class=\"toggle-icon\"\n points=\"6,8.5 8.5,11 12.5,6.5\"\n fill=\"none\"\n />\n </mask>\n </defs>\n <circle\n class=\"toggle-circle\"\n cx=\"9\"\n cy=\"9\"\n r=\"9\"\n mask=\"url(#xMask)\"\n ></circle>\n </svg>\n </div>\n );\n }\n\n render() {\n const textLabelClasses = ['label-text'];\n if (this.hideLabel) textLabelClasses.push('sr');\n return (\n <div class=\"container\">\n <input\n ref={el => (this.inputElement = el)}\n aria-describedby={this.description ? 'description' : undefined}\n aria-invalid={this.hasError === undefined ? undefined : `${this.hasError}`}\n checked={this.indeterminate || this.checked || false}\n class=\"sr\"\n disabled={!!this.disabled || !!this.groupDisabled}\n id={this._id}\n name={this.name || this._id}\n onClick={this.onInputClick}\n test-id=\"q2CheckboxInnerCheckBox\"\n type=\"checkbox\"\n value={this.value}\n />\n <label\n htmlFor={this._id}\n class=\"label-control\"\n test-id=\"checkboxButton\"\n aria-label={this.composedAriaLabel}\n >\n {this.renderCheckboxSVG()}\n </label>\n <div class={textLabelClasses.join(' ')}>\n <label\n test-id=\"checkboxLabel\"\n htmlFor={this._id}\n aria-hidden=\"true\"\n >\n <div class=\"label-content\">\n {loc(this.label)}\n <slot />\n </div>\n </label>\n </div>\n {this.description && (\n <div\n class=\"description-text\"\n test-id=\"checkboxDescription\"\n id=\"description\"\n >\n {loc(this.description)}\n </div>\n )}\n </div>\n );\n }\n\n // #endregion\n}\n","@import '../../styles/host.scss';\n@import '../../styles/functions';\n\n:host {\n display: inline-block;\n position: relative;\n line-height: 0;\n}\n\n:host(:not(:last-child)) {\n margin-inline-end: var-list(var-prefixer(tag-margin), --app-scale-2x, 10px);\n}\n\n.tag-wrapper {\n --comp-tag-btn-size: #{var-list(var-prefixer(tag-btn-size), --app-scale-6x, 30px)};\n --comp-tag-background: #{var-list(var-prefixer(tag-background), --t-gray-13, #e6e6e6)};\n --comp-tag-color: #{var-list(var-prefixer(tag-color), --t-gray-3, #262626)};\n --comp-tag-border-color: #{var-list(--tct-tag-border-color, transparent)};\n background: var(--comp-tag-background);\n color: var(--comp-tag-color);\n border-radius: var-list(var-prefixer(tag-border-radius), --app-border-radius-1, 4px);\n border-width: var-list(--tct-tag-border-width, 0);\n border-style: var-list(--tct-tag-border-style, 0);\n border-color: var(--comp-tag-border-color);\n font-size: var(--tct-tag-font-size, inherit);\n font-weight: var(--tct-tag-font-weight, inherit);\n position: relative;\n\n :host([theme='primary']) & {\n --comp-tag-background: #{var-list(--tct-tag-primary-background, --t-primary, #0079c1)};\n --comp-tag-color: #{var-list(--tct-tag-primary-font-color, --t-primary-text, #ffffff)};\n --comp-tag-border-color: #{var-list(--tct-tag-primary-border-color, --t-primary, #0079c1)};\n }\n\n :host([theme='secondary']) & {\n --comp-tag-background: #{var-list(--tct-tag-secondary-background, --t-secondary, #b3c2cc)};\n --comp-tag-color: #{var-list(--tct-tag-secondary-font-color, --t-secondary-text, #141414)};\n --comp-tag-border-color: #{var-list(--tct-tag-secondary-border-color, --t-secondary, #b3c2cc)};\n }\n\n :host([theme='tertiary']) & {\n --comp-tag-background: #{var-list(--tct-tag-tertiary-background, --t-tertiary, #e8f5fc)};\n --comp-tag-color: #{var-list(--tct-tag-tertiary-font-color, --t-tertiary-text, #141414)};\n --comp-tag-border-color: #{var-list(--tct-tag-tertiary-border-color, --t-tertiary, #e8f5fc)};\n }\n\n &:focus-visible {\n box-shadow: var-list(--tct-tag-focus-visible-box-shadow, --const-double-focus-ring);\n }\n}\n\n.tag {\n display: flex;\n align-items: center;\n width: max-content;\n gap: 6px;\n height: var-list(var-prefixer(tag-height), --app-scale-6x, 30px);\n line-height: var-list(var-prefixer(tag-height), --app-scale-6x, 30px);\n padding-inline: var-list(var-prefixer(tag-padding-inline), --app-scale-3x, 15px);\n\n ::slotted(q2-icon[slot='decorator']) {\n --tct-icon-size: 1em;\n --tct-icon-stroke-primary: var(--tct-tag-decorator-icon-primary-stroke);\n --tct-icon-stroke-secondary: var(--tct-tag-decorator-icon-secondary-stroke);\n }\n\n :host([theme=\"primary\"]) & ::slotted(q2-icon[slot='decorator']) {\n --tct-icon-stroke-primary: var(--tct-tag-primary-decorator-icon-primary-stroke);\n --tct-icon-stroke-secondary: var(--tct-tag-primary-decorator-icon-secondary-stroke);\n }\n\n ::slotted(q2-badge[slot='decorator']) {\n --tct-badge-height: 1em;\n --tct-badge-line-height: 30px;\n }\n}\n\n.tag.has-options {\n padding-right: 6px;\n}\n\n.btn-wrapper {\n --comp-tag-clickable-size: #{var-list(var-prefixer(tag-clickable-size), 44px)};\n --comp-tag-btn-offset: calc(calc(calc(var(--comp-tag-clickable-size) - var(--comp-tag-btn-size)) / 2) * -1);\n --comp-tag-background: #{var-list(var-prefixer(tag-background), --t-gray-13, #e6e6e6)};\n height: var(--comp-tag-clickable-size);\n display: flex;\n align-items: center;\n justify-content: center;\n position: relative;\n right: var(--comp-tag-btn-offset);\n top: var(--comp-tag-btn-offset);\n cursor: pointer;\n}\n\nbutton {\n height: var(--comp-tag-btn-size);\n stroke: var(--comp-tag-color);\n --tct-icon-stroke-primary: var(--comp-tag-color);\n cursor: pointer;\n border: 0;\n background: transparent;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0;\n padding-right: 6px;\n --tct-icon-size: 18px;\n}\n","import {\n Component,\n State,\n Prop,\n h,\n ComponentInterface,\n Host,\n Listen,\n Method,\n Element,\n EventEmitter,\n Event,\n Fragment,\n} from '@stencil/core';\nimport { isEventFromElement, loc, overrideFocus, waitForNextPaint } from 'src/utils';\nimport mirrorEmit from '@/utils/mirror-emit';\nimport { shouldShowActionSheet, showActionSheetList } from 'src/utils/action-sheet';\n\n/**\n * @name Tag\n * @category Display\n * @summary Use for displaying metadata labels or categories on content.\n * @slot decorator - An optional slot that supports either an [Icon](https://tecton.q2developer.com/design-system/q2-icon) or [Badge](https://tecton.q2developer.com/design-system/q2-badge) to be displayed with the tag content.\n * This is **not** available when using [Multiple Options](https://tecton.q2developer.com/design-system/q2-tag#multiple-options).\n */\n@Component({ tag: 'q2-tag', shadow: true, styleUrl: 'q2-tag.scss' })\nexport class Q2Tag implements ComponentInterface {\n // #region Own Properties\n\n dropdownBtn: HTMLButtonElement;\n mutationObserver: MutationObserver;\n optionList: HTMLQ2OptionListElement;\n popoverElement: HTMLQ2PopoverElement;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region State Properties\n\n @State()\n optionCount: number;\n\n // #endregion\n // #region Public Property API\n\n /**\n * Instructs the component to use the action sheet workflow for displaying its options.\n *\n * For more information, see [Action Sheets](https://tecton.q2developer.com/guides/action-sheets/).\n */\n @Prop()\n hoist: boolean = !!window.Tecton?.useActionSheets;\n\n /**\n * The text that populates the label.\n * @localizable\n */\n @Prop({ reflect: true })\n label: string;\n\n /**\n * Determine whether the popover is open or closed.\n *\n * @readonly\n */\n @Prop({ reflect: true, mutable: true })\n open: boolean;\n\n /** Determines the label that is applied to the option list for accessibility purposes. */\n @Prop()\n optionListLabel: string = 'options';\n\n /** Aligns the popover dropdown to the left or right side of the input field. */\n @Prop({ mutable: true })\n popoverAlignment: 'left' | 'right' = 'right';\n\n /**\n * Force the direction of the popover dropdown when it opens.\n * If no value is passed, the component will auto-detect the direction based on available space.\n */\n @Prop()\n popoverDirection: 'up' | 'down';\n\n /**\n * Force the maximum height of the popover. This value will be interpreted as pixels.\n * If no value is passed, or the value exceeds available space, the component will auto-detect the maximum height based on available space.\n */\n @Prop()\n popoverMaxHeight: number;\n\n /** @deprecated */\n @Prop()\n popoverMinHeight: number;\n\n /** The color of the element. */\n @Prop({ reflect: true })\n theme: 'primary' | 'secondary' | 'tertiary';\n\n // #endregion\n // #region Events\n\n /**\n * Emitted when a provided option is clicked.\n *\n * Requires at least one option to be provided.\n * @deprecated Use 'tctClick' instead\n */\n @Event()\n click: EventEmitter<{ value: string }>;\n\n /**\n * Emitted when a provided option is clicked.\n *\n * Requires at least one option to be provided.\n */\n @Event()\n tctClick: EventEmitter<{ value: string }>;\n\n // #endregion\n // #region Component Lifecycle Events\n\n disconnectedCallback() {\n this.mutationObserver?.disconnect();\n this.mutationObserver = null;\n }\n\n componentWillLoad() {\n this.initMutationObserver();\n this.determineOptionCount();\n }\n\n componentDidLoad(): void {\n overrideFocus(this.hostElement);\n this.filterSlottedElements();\n }\n\n // #endregion\n // #region Listeners\n\n @Listen('focus')\n delegateFocus(event: FocusEvent) {\n if (!isEventFromElement(event, this.hostElement)) return;\n if (!this.optionCount) return;\n this.dropdownBtn.focus();\n }\n\n @Listen('popoverStateChanged')\n popoverStateHandler({ detail: { open } }: CustomEvent<{ open: boolean }>) {\n if (this.open !== open) this.open = open;\n if (open) return;\n this.optionList.setActiveElement(null);\n }\n\n // #endregion\n // #region Public Methods API\n\n /**\n * Emulates clicking the tag to close the popover when options are provided and the popover is open.\n * @testonly\n */\n @Method()\n async closePopover() {\n if (!this.optionCount || !this.open) return;\n this._togglePopover();\n }\n\n /**\n * Emulates clicking the tag to open the popover when options are provided and the popover is closed.\n * @testonly\n */\n @Method()\n async openPopover() {\n if (!this.optionCount || this.open) return;\n this._togglePopover();\n }\n\n /**\n * Emulates selecting an option matching the passed value.\n *\n * If the popover is closed, this will open it before selecting the option.\n *\n * If there are not options, or the passed value does not match any option's value, this method does nothing.\n * @testonly\n */\n @Method()\n async selectOption(value) {\n if (!this.optionCount) return;\n await this.openPopover();\n await waitForNextPaint();\n const allOptions = await this.optionList.getOptions();\n const desiredOption = allOptions.find(option => option.value === value);\n desiredOption?.click();\n }\n\n // #endregion\n // #region Local Methods\n\n _togglePopover() {\n const { dropdownBtn } = this;\n dropdownBtn?.click();\n dropdownBtn?.focus();\n dropdownBtn.dispatchEvent(new FocusEvent('focus'));\n }\n\n determineOptionCount = () => {\n const numberOfOptions = this.hostElement.querySelectorAll('q2-option').length;\n this.optionCount = numberOfOptions;\n };\n\n filterSlottedElements = () => {\n if (!('HTMLSlotElement' in window)) return;\n const slot: HTMLSlotElement = this.hostElement.shadowRoot.querySelector('slot[name=\"decorator\"]');\n const assignedElements = Array.from(slot?.assignedElements() || []);\n if (!assignedElements.length) return;\n\n const approvedElements = ['Q2-ICON', 'Q2-BADGE'];\n assignedElements.forEach((element, index) => {\n if (!approvedElements.includes(element.tagName) || index > 0) {\n element.remove();\n }\n });\n };\n\n handleButtonFocusout = async (event: FocusEvent) => {\n const relatedTarget = event.relatedTarget as HTMLElement;\n if (this.popoverElement?.contains(relatedTarget)) return;\n if (this.hostElement.contains(relatedTarget)) return;\n this.open = false;\n };\n\n handleChange = event => {\n event.stopPropagation();\n if (!this.optionCount) return;\n const { value } = event.detail;\n\n mirrorEmit(this, ['click', 'tctClick'], { value });\n };\n\n handleClick = async (event: MouseEvent) => {\n event.stopPropagation();\n this.popoverElement.controlElement = this.dropdownBtn;\n if (shouldShowActionSheet(this)) {\n const { value } = await showActionSheetList(this, event);\n this.dropdownBtn.focus();\n mirrorEmit(this, ['click', 'tctClick'], { value });\n } else {\n await this.popoverElement.toggle();\n }\n };\n\n handleKeydown = async (event: KeyboardEvent) => {\n const isTabMetaOrCtrl = event.metaKey || event.ctrlKey || event.key === 'Tab';\n if (isTabMetaOrCtrl) return;\n\n event.preventDefault();\n this.popoverElement.controlElement = this.dropdownBtn;\n if (shouldShowActionSheet(this, event)) {\n const { value } = await showActionSheetList(this, event);\n this.dropdownBtn.focus();\n mirrorEmit(this, ['click', 'tctClick'], { value });\n } else {\n this.optionList.handleExternalKeydown(event);\n }\n };\n\n handleWrapperClick = () => {\n this.dropdownBtn.focus();\n this.dropdownBtn.click();\n };\n\n initMutationObserver = () => {\n if (!('MutationObserver' in window)) return;\n const observer = new MutationObserver(this.onMutationObserved);\n observer.observe(this.hostElement, { childList: true, attributes: true });\n this.mutationObserver = observer;\n };\n\n onClickElsewhere = (event: CustomEvent) => {\n const target = event.target as HTMLClickElsewhereElement;\n if (target.localName === 'click-elsewhere') {\n event.stopPropagation();\n const { popoverElement } = this;\n if (!popoverElement) return;\n popoverElement.open = false;\n }\n };\n\n onMutationObserved = () => {\n this.determineOptionCount();\n this.filterSlottedElements();\n };\n\n // #endregion\n // #region Render Methods\n\n renderHiddenElement() {\n return (\n <div\n id=\"option-description\"\n class=\"sr\"\n aria-hidden=\"true\"\n >\n {loc('tecton.element.optionList.optionCount', [this.optionCount])}\n </div>\n );\n }\n\n render() {\n const { open } = this;\n const wrapperClassNames = ['tag'];\n if (this.optionCount) wrapperClassNames.push('has-options');\n const shouldShowOptions = this.optionCount > 0;\n\n return (\n <Host>\n <click-elsewhere onChange={this.onClickElsewhere}>\n {shouldShowOptions ? (\n <Fragment>\n <div\n class=\"btn-wrapper\"\n onClick={this.handleWrapperClick}\n >\n <button\n class=\"tag-wrapper\"\n ref={el => (this.dropdownBtn = el)}\n test-id=\"btn-control\"\n type=\"button\"\n role=\"combobox\"\n onClick={this.handleClick}\n onKeyDown={this.handleKeydown}\n onFocusout={this.handleButtonFocusout}\n aria-controls=\"option-list\"\n aria-expanded={open ? 'true' : 'false'}\n aria-describedby=\"option-description\"\n aria-label={loc(this.label)}\n >\n <div class={wrapperClassNames.join(' ')}>{loc(this.label)}</div>\n <q2-icon type=\"options\"></q2-icon>\n </button>\n </div>\n {this.renderHiddenElement()}\n </Fragment>\n ) : (\n <div\n class=\"tag-wrapper\"\n onClick={e => e.stopPropagation()}\n >\n <div class={wrapperClassNames.join(' ')}>\n <slot name=\"decorator\" />\n {loc(this.label)}\n </div>\n </div>\n )}\n\n {shouldShowOptions && (\n <q2-popover\n ref={el => (this.popoverElement = el)}\n controlElement={this.dropdownBtn}\n open={this.open}\n maxHeight={this.popoverMaxHeight}\n minHeight={this.popoverMinHeight}\n direction={this.popoverDirection}\n align={this.popoverAlignment}\n >\n <q2-option-list\n id=\"option-list\"\n ref={el => (this.optionList = el)}\n onChange={this.handleChange}\n type=\"menu\"\n align=\"right\"\n label={loc('tecton.element.optionList.label', [this.optionListLabel])}\n no-select\n >\n <slot />\n </q2-option-list>\n </q2-popover>\n )}\n </click-elsewhere>\n </Host>\n );\n }\n\n // #endregion\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"q2-checkbox.q2-tag.entry.esm.js","sources":["src/components/q2-checkbox/q2-checkbox.scss?tag=q2-checkbox&encapsulation=shadow","src/components/q2-checkbox/q2-checkbox.tsx","src/components/q2-tag/q2-tag.scss?tag=q2-tag&encapsulation=shadow","src/components/q2-tag/q2-tag.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n\n:host {\n --comp-checkbox-padding: #{var-list(\n --tct-checkbox-padding,\n unquote('#{var-list(var-prefixer(checkbox-vertical-padding), 8px)} 0')\n )};\n\n display: block;\n position: relative;\n padding: var(--comp-checkbox-padding);\n --comp-default-checkbox-margin: #{var-list(var-prefixer(checkbox-margin-top), 0px) 0\n var-list(var-prefixer(checkbox-margin-bottom), 0px)};\n margin: var-list(--tct-checkbox-margin, --comp-default-checkbox-margin);\n}\n\n.container {\n --comp-checkbox-size: #{var-list(var-prefixer(checkbox-size), 24px)};\n --comp-checkbox-default-column-gap: var(--app-scale-2x, 10px);\n --comp-checkbox-default-row-gap: 0;\n --comp-checkbox-default-gap: #{var(--comp-checkbox-default-row-gap) var(--comp-checkbox-default-column-gap)};\n --comp-checkbox-tween: #{var-list(--tct-tween-1, --app-tween-1, unquote('0.2s ease'))};\n --comp-checkbox-toggle-width: #{var-list(var-prefixer(checkbox-toggle-width), 38px)};\n\n --comp-checkbox-toggle-track-fill: #{var-list(\n --tct-checkbox-toggle-track-fill,\n --tct-checkbox-toggle-track-color,\n transparent\n )};\n --comp-checkbox-toggle-track-fill-active: #{var-list(\n --tct-checkbox-toggle-active-track-fill,\n --tct-checkbox-toggle-active-track-color,\n --tct-checkbox-toggle-active-color,\n --t-primary-l1,\n #7755af\n )};\n --comp-checkbox-toggle-track-fill-hover: #{var-list(\n --tct-checkbox-toggle-hover-track-fill,\n --tct-checkbox-toggle-hover-track-color,\n --comp-checkbox-toggle-track-fill\n )};\n --comp-checkbox-toggle-track-fill-error: #{var-list(\n --tct-checkbox-toggle-error-track-fill,\n --tct-checkbox-toggle-error-track-color,\n --comp-checkbox-toggle-track-fill\n )};\n --comp-checkbox-toggle-track-fill-error-hover: #{var-list(\n --tct-checkbox-toggle-error-hover-track-fill,\n --tct-checkbox-toggle-error-hover-track-color,\n --comp-checkbox-toggle-track-fill-error\n )};\n --comp-checkbox-toggle-track-fill-error-active: #{var-list(\n --tct-checkbox-toggle-error-active-track-fill,\n --tct-checkbox-toggle-error-active-track-color,\n --comp-checkbox-toggle-track-fill-error\n )};\n\n --comp-checkbox-toggle-error-color: #{var-list(--tct-checkbox-toggle-error-color, --comp-checkbox-error-color)};\n --comp-checkbox-toggle-color: #{var-list(--tct-checkbox-toggle-color, --t-gray-8, #808080)};\n --comp-checkbox-gap: #{var-list(var-prefixer(checkbox-gap), --comp-checkbox-default-gap)};\n --comp-checkbox-outer-stroke-color: #{var-list(\n var-prefixer(checkbox-outer-stroke-color),\n --t-a11y-gray-color-AA,\n #949494\n )};\n --comp-checkbox-outer-fill-color: #{var-list(\n var-prefixer(checkbox-outer-fill-color),\n --tct-white,\n --app-white,\n #ffffff\n )};\n --comp-checkbox-checked-fill-color: #{var-list(\n --tct-checkbox-checked-fill-color,\n --t-primary,\n #040404\n )};\n --comp-checkbox-checked-color: #{var-list(\n --tct-checkbox-checked-stroke-color,\n --tct-white,\n --app-white,\n #FFFFFF\n )};\n --comp-control-width: var(--comp-checkbox-size);\n --comp-checkbox-error-color: #{var-list(--tct-stoplight-error, --const-stoplight-alert, #d20a0a)};\n\n --comp-checkbox-bold-fallback-stroke-width: #{var-list(--tct-checkbox-bold-fallback-stroke-width, 0.7px)};\n --comp-checkbox-stroke-width: #{var-list(--tct-checkbox-stroke-width, unset)};\n --comp-checkbox-checked-stroke-width: #{var-list(\n --tct-checkbox-checked-stroke-width,\n --comp-checkbox-bold-fallback-stroke-width\n )};\n --comp-checkbox-hover-stroke-width: #{var-list(--tct-checkbox-hover-stroke-width, unset)};\n --comp-checkbox-focused-stroke-width: #{var-list(--tct-checkbox-focused-stroke-width, unset)};\n --comp-checkbox-checked-hover-stroke-width: #{var-list(\n --tct-checkbox-checked-hover-stroke-width,\n --comp-checkbox-bold-fallback-stroke-width\n )};\n --comp-checkbox-checked-focused-stroke-width: #{var-list(\n --tct-checkbox-checked-focused-stroke-width,\n --comp-checkbox-bold-fallback-stroke-width\n )};\n --comp-checkbox-description-stroke-width: #{var-list(\n --tct-checkbox-description-stroke-width,\n --comp-checkbox-bold-fallback-stroke-width\n )};\n --comp-checkbox-description-focused-stroke-width: #{var-list(\n --tct-checkbox-description-focused-stroke-width,\n --comp-checkbox-bold-fallback-stroke-width\n )};\n --comp-checkbox-description-hover-stroke-width: #{var-list(\n --tct-checkbox-description-hover-stroke-width,\n --comp-checkbox-bold-fallback-stroke-width\n )};\n\n --comp-checkbox-toggle-circle-fill-active: #{var-list(\n --tct-checkbox-toggle-active-fill,\n --tct-checkbox-toggle-active-color,\n --comp-checkbox-toggle-color\n )};\n\n :host([type='favorite']) & {\n --comp-checkbox-favorite-stroke-color: #{var-list(\n var-prefixer(checkbox-favorite-stroke-color),\n --t-a11y-gray-color-AA,\n #949494\n )};\n --comp-checkbox-favorite-fill-color: #{var-list(var-prefixer(checkbox-favorite-fill-color), #db7d24)};\n }\n\n display: grid;\n grid-template-areas:\n 'svg label'\n 'svg description';\n align-items: start;\n gap: var(--comp-checkbox-gap);\n grid-template-columns: var(--comp-control-width) calc(\n 100% - var(--comp-control-width) - var(--comp-checkbox-default-column-gap)\n );\n\n :host([hide-label]:not([hide-label='false'])) & {\n grid-template-areas: 'svg';\n grid-template-columns: var(--comp-control-width);\n }\n\n :host([type='toggle']) & {\n --comp-control-width: var(--comp-checkbox-toggle-width);\n }\n\n :host([alignment='right']) &,\n :host([type='toggle']:not([alignment])) & {\n grid-template-areas:\n 'label svg'\n 'description svg';\n grid-template-columns: calc(100% - var(--comp-control-width) - var(--comp-checkbox-default-column-gap)) var(\n --comp-control-width\n );\n }\n}\n\n.label-control {\n align-items: center;\n display: flex;\n}\n\n.label-text {\n grid-area: label;\n\n :host([description]) & {\n -webkit-text-stroke-width: var(--comp-checkbox-description-stroke-width);\n text-stroke-width: var(--comp-checkbox-description-stroke-width);\n }\n :host([checked]:not([checked='false'])) & {\n -webkit-text-stroke-width: var(--comp-checkbox-checked-stroke-width);\n text-stroke-width: var(--comp-checkbox-checked-stroke-width);\n }\n :host(:hover) & {\n -webkit-text-stroke-width: var(--comp-checkbox-hover-stroke-width);\n text-stroke-width: var(--comp-checkbox-hover-stroke-width);\n }\n :host(:focus-within) & {\n -webkit-text-stroke-width: var(--comp-checkbox-focused-stroke-width);\n text-stroke-width: var(--comp-checkbox-focused-stroke-width);\n }\n :host([description]:hover) & {\n -webkit-text-stroke-width: var(--comp-checkbox-description-hover-stroke-width);\n text-stroke-width: var(--comp-checkbox-description-hover-stroke-width);\n }\n :host([checked]:not([checked='false']):hover) & {\n -webkit-text-stroke-width: var(--comp-checkbox-checked-hover-stroke-width);\n text-stroke-width: var(--comp-checkbox-checked-hover-stroke-width);\n }\n :host([description]:focus-within) & {\n -webkit-text-stroke-width: var(--comp-checkbox-description-focused-stroke-width);\n text-stroke-width: var(--comp-checkbox-description-focused-stroke-width);\n }\n :host([checked]:not([checked='false']):focus-within) & {\n -webkit-text-stroke-width: var(--comp-checkbox-checked-focused-stroke-width);\n text-stroke-width: var(--comp-checkbox-checked-focused-stroke-width);\n }\n :host(:active) & {\n -webkit-text-stroke-width: var(--tct-checkbox-active-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-active-stroke-width, unset);\n }\n :host([checked]:not([checked='false']):active) & {\n -webkit-text-stroke-width: var(--tct-checkbox-checked-active-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-checked-active-stroke-width, unset);\n }\n :host([has-error]:not([has-error='false']):hover) & {\n -webkit-text-stroke-width: var(--tct-checkbox-error-hover-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-error-hover-stroke-width, unset);\n }\n :host([has-error]:not([has-error='false']):focus-within) & {\n -webkit-text-stroke-width: var(--tct-checkbox-error-focused-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-error-focused-stroke-width, unset);\n }\n :host([has-error]:not([has-error='false']):active) & {\n -webkit-text-stroke-width: var(--tct-checkbox-error-active-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-error-active-stroke-width, unset);\n }\n :host([checked]:not([checked='false'])[has-error]:not([has-error='false']):hover) & {\n -webkit-text-stroke-width: var(--tct-checkbox-checked-error-hover-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-checked-error-hover-stroke-width, unset);\n }\n :host([checked]:not([checked='false'])[has-error]:not([has-error='false']):focus-within) & {\n -webkit-text-stroke-width: var(--tct-checkbox-checked-error-focused-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-checked-error-focused-stroke-width, unset);\n }\n :host([checked]:not([checked='false'])[has-error]:not([has-error='false']):active) & {\n -webkit-text-stroke-width: var(--tct-checkbox-checked-error-active-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-checked-error-active-stroke-width, unset);\n }\n\n label {\n line-height: var-list(--tct-checkbox-label-line-height, 24px);\n .label-content {\n display: inline;\n font-size: var(--tct-checkbox-label-font-size, inherit);\n }\n }\n}\n\n.description-text {\n grid-area: description;\n font-weight: var-list(var-prefixer(checkbox-description-font-weight), 400);\n\n :host(:hover) & {\n font-weight: var-list(\n --tct-checkbox-hover-description-font-weight,\n var-prefixer(checkbox-description-font-weight),\n 400\n );\n }\n}\n\nlabel {\n color: var-list(--tct-checkbox-label-color);\n cursor: pointer;\n hyphens: var-list(--tct-checkbox-label-hyphens, auto);\n word-break: var-list(--tct-checkbox-label-word-break, break-word);\n word-wrap: var-list(--tct-checkbox-label-word-wrap, break-word);\n}\n\n.checkbox-icon {\n width: var(--comp-checkbox-size);\n height: var(--comp-checkbox-size);\n border-radius: var-list(\n var-prefixer(checkbox-outer-border-radius),\n --tct-border-radius-1,\n --app-border-radius-1,\n 4px\n );\n stroke: var(--comp-checkbox-outer-stroke-color);\n fill: var(--comp-checkbox-outer-fill-color);\n stroke-width: var-list(var-prefixer(checkbox-outer-stroke-width), 2);\n flex-shrink: 0;\n box-shadow: var(--tct-checkbox-box-shadow);\n\n rect {\n transition: fill var-list(--tct-checkbox-tween, --app-tween-2, unquote('0.4s ease'));\n }\n\n :host([checked]:not([checked='false']):not([type='favorite'])) & {\n stroke: var-list(\n --comp-checkbox-checked-fill-color,\n var-prefixer(checkbox-checked-outer-stroke-color),\n --comp-checkbox-outer-stroke-color\n );\n\n rect {\n fill: var(--comp-checkbox-checked-fill-color);\n }\n }\n\n :host([has-error]:not([has-error='false']):not([type='favorite'])) & {\n stroke: var-list(--tct-checkbox-error-outer-stroke-color, --comp-checkbox-error-color);\n box-shadow: var-list(--tct-checkbox-error-box-shadow, --tct-checkbox-box-shadow);\n\n rect {\n fill: var-list(--tct-checkbox-error-outer-fill-color, --comp-checkbox-outer-fill-color);\n }\n }\n\n :host([has-error]:not([has-error='false']):not([type='favorite'])[checked]:not([checked='false'])) & {\n rect {\n fill: var-list(--tct-checkbox-error-checked-outer-fill-color);\n }\n }\n\n :host([indeterminate]:not([indeterminate='false']):not([type='favorite'])) & {\n stroke: var-list(\n --comp-checkbox-checked-fill-color,\n var-prefixer(checkbox-checked-outer-stroke-color),\n --comp-checkbox-outer-stroke-color\n );\n\n rect {\n fill: var(--comp-checkbox-checked-fill-color);\n }\n }\n\n :host(:hover:not([type='favorite'])) & {\n stroke: var-list(--tct-checkbox-hover-outer-stroke-color, --comp-checkbox-outer-stroke-color);\n box-shadow: var-list(--tct-checkbox-hover-box-shadow, --tct-checkbox-box-shadow);\n rect {\n fill: var-list(--tct-checkbox-hover-outer-fill-color, --comp-checkbox-outer-fill-color);\n }\n }\n :host(:hover[has-error]:not([has-error='false']):not([type='favorite'])) & {\n stroke: var-list(\n --tct-checkbox-error-hover-outer-stroke-color,\n --tct-checkbox-error-outer-stroke-color,\n --comp-checkbox-error-color\n );\n box-shadow: var-list(\n --tct-checkbox-error-hover-box-shadow,\n --tct-checkbox-error-box-shadow,\n --tct-checkbox-hover-box-shadow,\n --tct-checkbox-box-shadow\n );\n rect {\n fill: var-list(\n --tct-checkbox-error-hover-outer-fill-color,\n --tct-checkbox-error-outer-fill-color,\n --comp-checkbox-outer-fill-color\n );\n }\n }\n\n :host(:focus-within:not([type='favorite'])) & {\n --comp-checkbox-focused-box-shadow: #{var(--const-double-focus-ring),\n var-list(--tct-global-focus, unquote('0 0 0 2px #33b4ff'))};\n\n stroke: var-list(var-prefixer(checkbox-focused-outer-stroke-color), --comp-checkbox-outer-stroke-color);\n fill: var-list(--tct-checkbox-focused-outer-fill-color, --comp-checkbox-outer-fill-color);\n box-shadow: var-list(\n --tct-checkbox-focused-box-shadow,\n --tct-checkbox-box-shadow,\n --comp-checkbox-focused-box-shadow\n );\n }\n :host(:focus-within[has-error]:not([has-error='false']):not([type='favorite'])) & {\n stroke: var-list(\n --tct-checkbox-error-focused-outer-stroke-color,\n --tct-checkbox-error-outer-stroke-color,\n --comp-checkbox-error-color\n );\n fill: var-list(\n --tct-checkbox-error-focused-outer-fill-color,\n --tct-checkbox-error-outer-fill-color,\n --comp-checkbox-outer-fill-color\n );\n box-shadow: var-list(\n --tct-checkbox-error-focused-box-shadow,\n --tct-checkbox-error-box-shadow,\n --tct-checkbox-box-shadow,\n --comp-checkbox-focused-box-shadow\n );\n }\n\n // Favorite\n :host([type='favorite']) & {\n --tct-icon-stroke-width: #{var-list(var-prefixer(checkbox-favorite-stroke-width), 1)};\n --tct-icon-stroke-primary: var(--comp-checkbox-favorite-stroke-color);\n transition:\n fill var(--comp-checkbox-tween),\n color var(--comp-checkbox-tween),\n stroke var(--comp-checkbox-tween);\n }\n\n :host(:hover[type='favorite']) & {\n --tct-icon-stroke-primary: #{var-list(\n --tct-checkbox-favorite-hover-stroke-color,\n --comp-checkbox-favorite-fill-color\n )};\n --tct-icon-stroke-width: #{var-list(var-prefixer(checkbox-favorite-hover-stroke-width), 2)};\n }\n\n :host([type='favorite']:focus-within) & {\n --tct-icon-stroke-primary: #{var-list(\n --tct-checkbox-favorite-focused-stroke-color,\n --comp-checkbox-favorite-fill-color\n )};\n --tct-icon-stroke-width: #{var-list(var-prefixer(checkbox-favorite-hover-stroke-width), 2)};\n }\n\n // Checked favorite\n :host([checked]:not([checked='false'])[type='favorite']) & {\n --tct-icon-stroke-primary: #{var-list(\n --tct-checkbox-favorite-checked-stroke-color,\n --tct-checkbox-favorite-stroke-color,\n --comp-checkbox-favorite-fill-color\n )};\n fill: var-list(--tct-checkbox-favorite-checked-fill-color, --comp-checkbox-favorite-fill-color);\n transition:\n fill var(--comp-checkbox-tween),\n color var(--comp-checkbox-tween),\n stroke var(--comp-checkbox-tween);\n }\n\n :host([checked]:not([checked='false'])[type='favorite']:hover) & {\n --tct-icon-stroke-primary: #{var-list(\n --tct-checkbox-favorite-checked-hover-stroke-color,\n --tct-checkbox-favorite-hover-stroke-color,\n --comp-checkbox-favorite-stroke-color\n )};\n --tct-icon-fill-primary: #{var-list(\n --tct-checkbox-favorite-checked-fill-color,\n --comp-checkbox-favorite-fill-color\n )};\n --tct-icon-stroke-width: #{var-list(var-prefixer(checkbox-favorite-hover-stroke-width), 2)};\n }\n\n :host([checked]:not([checked='false'])[type='favorite']:focus-within) & {\n --tct-icon-stroke-primary: #{var-list(\n --tct-checkbox-favorite-checked-focused-stroke-color,\n --tct-checkbox-favorite-focused-stroke-color,\n --comp-checkbox-favorite-stroke-color\n )};\n --tct-icon-stroke-width: #{var-list(var-prefixer(checkbox-favorite-hover-stroke-width), 2)};\n }\n\n :host([has-error]:not([has-error='false'])[type='favorite']) & {\n --tct-icon-stroke-primary: #{var-list(--tct-checkbox-favorite-error-stroke-color, --comp-checkbox-error-color)};\n }\n :host([has-error]:not([has-error='false'])[type='favorite'][checked]:not([checked='false'])) & {\n --tct-icon-stroke-primary: #{var-list(--tct-checkbox-favorite-error-stroke-color, --comp-checkbox-error-color)};\n }\n}\n\n.checkbox-fill {\n fill: none;\n stroke: var-list(--comp-checkbox-checked-color);\n stroke-width: var-list(var-prefixer(checkbox-check-stroke-width), 2.5);\n stroke-linecap: round;\n stroke-linejoin: round;\n\n :host([has-error]:not([has-error='false']):not([type='favorite'])) & {\n stroke: var(--tct-checkbox-error-checkmark-stroke-color, #d20a0a);\n stroke-width: var(--tct-checkbox-error-checkmark-stroke-width, 2.5);\n }\n}\n\n.checked-fill {\n stroke-dasharray: 16;\n stroke-dashoffset: 16;\n animation-name: draw-checkmark;\n animation-duration: var-list(--tct-checkbox-animation-duration, --t-tween-time-in-4, 300ms);\n animation-timing-function: var-list(--tct-checkbox-animation-timing-function, ease-out);\n animation-fill-mode: var-list(--tct-checkbox-animation-fill-mode, forwards);\n}\n\n@keyframes draw-checkmark {\n to {\n stroke-dashoffset: 0;\n }\n}\n\n.indeterminate-fill {\n stroke-width: var-list(var-prefixer(checkbox-indeterminate-stroke-width), 3.5);\n}\n\n.toggle-svg-container {\n height: 30px;\n width: var(--comp-checkbox-toggle-width);\n position: relative;\n text-align: initial;\n}\n\n.toggle-indicator,\n.toggle-track {\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n}\n.toggle-indicator {\n transition:\n left var(--comp-checkbox-tween),\n height var(--comp-checkbox-tween),\n width var(--comp-checkbox-tween);\n height: 16px;\n width: 16px;\n left: 4px;\n border-radius: 50%;\n}\n\n.toggle-track {\n --comp-default-track-box-shadow: inset 0 0 0 1px var(--comp-checkbox-toggle-color);\n height: 24px;\n width: 38px;\n fill: var(--comp-checkbox-toggle-track-fill);\n border-radius: var(--app-border-radius-3, 12px);\n box-shadow: var-list(--tct-checkbox-toggle-track-box-shadow, --comp-default-track-box-shadow);\n transition:\n fill var(--comp-checkbox-tween),\n box-shadow var(--comp-checkbox-tween);\n}\n\n.toggle-circle {\n mask: url(#xMask);\n fill: var(--comp-checkbox-toggle-color);\n transition: fill var(--comp-checkbox-tween);\n}\n\n.toggle-icon {\n stroke-linecap: round;\n stroke-linejoin: round;\n stroke-width: var(--tct-checkbox-toggle-icon-stroke-width, 2);\n stroke: black;\n}\n\n:host(:is(:not([checked]), [checked='false'])) {\n &:host(:is(:not([disabled]), [disabled='false']):is(:not([group-disabled]), [group-disabled='false'])) {\n :hover,\n :focus-within {\n .toggle-track {\n --comp-default-hover-track-box-shadow: inset 0 0 0 2px var(--comp-checkbox-toggle-color);\n box-shadow: var-list(\n --tct-checkbox-toggle-hover-track-box-shadow,\n --comp-default-hover-track-box-shadow\n );\n fill: var(--comp-checkbox-toggle-track-fill-hover);\n }\n .toggle-indicator {\n height: 18px;\n width: 18px;\n }\n .toggle-circle {\n fill: var-list(--tct-checkbox-toggle-hover-circle-color, --t-primary-d1, --t-gray-6, #4d4d4d);\n }\n .label-text {\n color: var(--tct-checkbox-label-hover-color, inherit);\n }\n .description-text {\n color: var(--tct-checkbox-description-hover-color, inherit);\n -webkit-text-stroke-width: var(--tct-checkbox-description-hover-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-description-hover-stroke-width, unset);\n }\n }\n :active {\n .toggle-circle {\n fill: var(--comp-checkbox-toggle-track-fill-active);\n }\n .label-text {\n color: var(--tct-checkbox-label-active-color, inherit);\n }\n .description-text {\n color: var(--tct-checkbox-description-active-color, inherit);\n -webkit-text-stroke-width: var(--tct-checkbox-description-active-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-description-active-stroke-width, unset);\n }\n .toggle-circle {\n fill: var(--comp-checkbox-toggle-circle-fill-active);\n }\n }\n }\n\n &:host([has-error]:not([has-error='false'])) {\n .toggle-track {\n box-shadow: inset 0 0 0 1px var(--comp-checkbox-toggle-error-color);\n fill: var(--comp-checkbox-toggle-track-fill-error);\n }\n .toggle-circle {\n fill: var(--comp-checkbox-toggle-error-color);\n }\n\n &:host(:is(:not([disabled]), [disabled='false']):is(:not([group-disabled]), [group-disabled='false'])) {\n :hover,\n :focus-within {\n .toggle-track {\n box-shadow: inset 0 0 0 2px var(--comp-checkbox-toggle-error-color);\n fill: var(--comp-checkbox-toggle-track-fill-error-hover);\n }\n .toggle-circle {\n fill: var-list(--tct-checkbox-toggle-error-hover-color, --comp-checkbox-toggle-error-color);\n }\n .label-text {\n color: var(--tct-checkbox-label-hover-color, inherit);\n }\n .description-text {\n color: var(--tct-checkbox-description-hover-color, inherit);\n -webkit-text-stroke-width: var(--tct-checkbox-description-hover-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-description-hover-stroke-width, unset);\n }\n }\n :active {\n .toggle-track {\n fill: var(--comp-checkbox-toggle-track-fill-error-active);\n }\n .toggle-circle {\n fill: var-list(--tct-checkbox-toggle-error-active-color, --comp-checkbox-toggle-error-color);\n }\n .label-text {\n color: var(--tct-checkbox-error-label-active-color, inherit);\n }\n .description-text {\n color: var(--tct-checkbox-error-description-active-color, inherit);\n -webkit-text-stroke-width: var(--tct-checkbox-error-description-active-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-error-description-active-stroke-width, unset);\n }\n }\n }\n }\n}\n\n:host([checked]:not([checked='false'])) {\n .toggle-indicator {\n left: 18px;\n }\n\n .toggle-track {\n fill: var-list(--tct-checkbox-toggle-checked-track-color, --t-primary, #6a4a9e);\n border: none;\n }\n .toggle-circle {\n mask: url(#checkMask);\n fill: var-list(--tct-checkbox-toggle-checked-circle-color, --t-base, #ffffff);\n }\n\n &:host(:is(:not([disabled]), [disabled='false']):is(:not([group-disabled]), [group-disabled='false'])) {\n :hover,\n :focus-within {\n .toggle-track {\n fill: var-list(--tct-checkbox-toggle-checked-hover-track-color, --t-primary-d1, #5f438e);\n }\n .toggle-indicator {\n height: 18px;\n width: 18px;\n }\n .label-text {\n color: var(--tct-checkbox-checked-label-hover-color, inherit);\n }\n .description-text {\n color: var(--tct-checkbox-checked-description-hover-color, inherit);\n -webkit-text-stroke-width: var(--tct-checkbox-checked-description-hover-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-checked-description-hover-stroke-width, unset);\n }\n }\n\n :active {\n .toggle-track {\n fill: var-list(--tct-checkbox-toggle-checked-active-track-color, --t-primary-l1, #7755af);\n }\n .toggle-indicator {\n height: 18px;\n width: 18px;\n }\n .label-text {\n color: var(--tct-checkbox-checked-label-active-color, inherit);\n }\n .description-text {\n color: var(--tct-checkbox-checked-description-active-color, inherit);\n -webkit-text-stroke-width: var(--tct-checkbox-checked-description-active-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-checked-description-active-stroke-width, unset);\n }\n }\n }\n\n &:host([has-error]:not([has-error='false'])) {\n .toggle-track {\n fill: var-list(--tct-checkbox-toggle-checked-error-track-color, --comp-checkbox-toggle-error-color);\n }\n &:host(:is(:not([disabled]), [disabled='false']):is(:not([group-disabled]), [group-disabled='false'])) {\n :hover,\n :focus-within {\n .toggle-track {\n fill: var-list(\n --tct-checkbox-toggle-checked-error-hover-track-color,\n --comp-checkbox-toggle-error-color\n );\n }\n .label-text {\n color: var(--tct-checkbox-checked-error-label-hover-color, inherit);\n }\n .description-text {\n color: var(--tct-checkbox-checked-error-description-hover-color, inherit);\n -webkit-text-stroke-width: var(--tct-checkbox-checked-error-description-hover-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-checked-error-description-hover-stroke-width, unset);\n }\n }\n\n :active {\n .toggle-track {\n fill: var-list(\n --tct-checkbox-toggle-checked-error-active-track-color,\n --comp-checkbox-toggle-error-color\n );\n }\n .label-text {\n color: var(--tct-checkbox-checked-error-label-active-color, inherit);\n }\n .description-text {\n color: var(--tct-checkbox-checked-error-description-active-color, inherit);\n -webkit-text-stroke-width: var(--tct-checkbox-checked-error-description-active-stroke-width, unset);\n text-stroke-width: var(--tct-checkbox-checked-error-description-active-stroke-width, unset);\n }\n }\n }\n }\n}\n\n:host(:is([disabled]:not([disabled='false']), [group-disabled]:not([group-disabled='false']))) {\n cursor: not-allowed;\n opacity: var-list(var-prefixer(checkbox-disabled-opacity), --tct-disabled-opacity, --app-disabled-opacity, 0.4);\n label {\n cursor: not-allowed;\n }\n}\n","import {\n Component,\n ComponentInterface,\n Element,\n Event,\n EventEmitter,\n h,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { createGuid, handleAriaLabel, isEventFromElement, loc, overrideFocus } from 'src/utils';\nimport mirrorEmit from '@/utils/mirror-emit';\n\n/**\n * @name Checkbox\n * @category Forms\n * @summary Use as a single binary choice; nest within a Checkbox Group for grouped selection.\n */\n@Component({ tag: 'q2-checkbox', shadow: true, styleUrl: 'q2-checkbox.scss' })\nexport class Q2Checkbox implements ComponentInterface {\n // #region Own Properties\n\n _id: string = `checkbox-${createGuid()}`;\n descriptionObserver: MutationObserver;\n inputElement: HTMLInputElement;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region State Properties\n\n @State()\n hasDescription: boolean = false;\n\n // #endregion\n // #region Public Property API\n\n /**\n * @private\n * Tooltip text set by a parent q2-tooltip component for accessibility.\n */\n @Prop()\n _tooltip: string;\n\n /** Determine which side of the label the checkbox will render on. */\n @Prop({ reflect: true })\n alignment: string;\n\n /** @deprecated */\n @Prop({ reflect: true, mutable: true })\n ariaLabel: string;\n\n /** The state of the checkbox. This modifies the visual appearance of the element. */\n @Prop({ reflect: true, mutable: true })\n checked: boolean = false;\n\n /**\n * Populates a description that is displayed beneath the label.\n * @localizable\n */\n @Prop({ reflect: true })\n description: string;\n\n /** Disables the checkbox and prevents interaction. */\n @Prop({ reflect: true })\n disabled: boolean;\n\n /**\n * Used by q2-checkbox-group to disable all checkboxes in the group\n * @private\n */\n @Prop({ reflect: true })\n groupDisabled: boolean;\n\n /** Determines if the component should display in an errant state. */\n @Prop({ reflect: true })\n hasError: boolean = false;\n\n /**\n * Hide's the field's `<label>` element from view.\n *\n * @warning\n * Only use when a visible label is impractical.\n */\n @Prop({ reflect: true, mutable: true })\n hideLabel: boolean;\n\n /**\n * Used on a parent checkbox in a checkbox group (e.g. \"Select All\") to indicate that some, but not all, checkboxes in a group are checked.\n *\n * When `true`, the \"indeterminate\" selection style is applied.\n * To apply the standard \"checked\" selection style, `checked` must be true, and `indeterminate` must be `false`.\n */\n @Prop({ reflect: true })\n indeterminate: boolean;\n\n /**\n * The visible label text for the checkbox. Appears to the right of the box for 'default' and 'favorite' checkboxes, and to the left for 'toggle' checkboxes.\n * Yielded content will be adjacent to this text.\n * @localizable\n */\n @Prop({ reflect: true, mutable: true })\n label: string;\n\n /** A static string used to establish a symbolic relationship between checkboxes. */\n @Prop({ reflect: true })\n name: string;\n\n /** The field is not interactive, but remains focusable. */\n @Prop({ reflect: true })\n readonly: boolean;\n\n /** The field is not interactive, but remains focusable. */\n @Prop({ reflect: true })\n slotReadonly: boolean;\n\n /** The visual style of the checkbox. This does not need to be defined for a standard checkbox. */\n @Prop({ reflect: true })\n type: 'favorite' | 'toggle';\n\n /** A static reference value for the checkbox. */\n @Prop({ reflect: true })\n value: string;\n\n // #endregion\n // #region Events\n\n /**\n * Emitted when the checkbox is toggled.\n * @deprecated Use 'tctChange' instead\n * @legacyEvent\n */\n @Event()\n change: EventEmitter<{ value: string; checked: boolean }>;\n\n /**\n * Emitted when the checkbox is toggled.\n * @legacyEvent\n */\n @Event()\n tctChange: EventEmitter<{ value: string; checked: boolean }>;\n\n // #endregion\n // #region Component Lifecycle Events\n\n disconnectedCallback(): void {\n this.descriptionObserver?.disconnect();\n }\n\n componentWillLoad() {\n handleAriaLabel(this);\n this.checkForDescription();\n }\n\n componentDidLoad(): void {\n overrideFocus(this.hostElement);\n this.hostElement.click = () => this.inputElement.click();\n this.setupDescriptionObserver();\n }\n\n // #endregion\n // #region Listeners\n\n @Listen('change')\n defaultChangeHandler(event: CustomEvent) {\n // We use setTimeout to give an opportunity to call preventDefault\n setTimeout(() => this.handleChangeEvent(event), 0);\n }\n\n @Listen('focus')\n delegateFocus(event: FocusEvent) {\n if (!isEventFromElement(event, this.hostElement)) return;\n this.hostElement.shadowRoot.querySelector('input').focus();\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('ariaLabel')\n ariaLabelObserver() {\n handleAriaLabel(this);\n }\n\n // #endregion\n // #region Local Methods\n\n get ariaLabelledBy(): string | undefined {\n const hasLabel =\n !!loc(this.label) ||\n !!this.hostElement.querySelector('[slot=\"label\"]') ||\n Array.from(this.hostElement.childNodes).some(\n node => !(node instanceof HTMLElement && node.getAttribute('slot')) && !!node.textContent?.trim()\n );\n if (!hasLabel && !this._tooltip) return undefined;\n const ids = [];\n if (hasLabel) ids.push(this.labelId);\n if (this._tooltip) ids.push(this.tooltipId);\n return ids.join(' ');\n }\n\n get labelId(): string {\n return `label-${this._id}`;\n }\n\n get tooltipId(): string {\n return `tooltip-${this._id}`;\n }\n\n checkForDescription() {\n this.hasDescription = !!this.description || !!this.hostElement.querySelector('[slot=\"description\"]');\n }\n\n handleChangeEvent(event: CustomEvent<{ checked: boolean; value: string }>) {\n if (\n this.readonly ||\n this.disabled ||\n this.hostElement.onchange ||\n event.defaultPrevented ||\n event.target !== this.hostElement ||\n !event.detail\n ) {\n return;\n }\n this.checked = event.detail.checked;\n }\n\n onInputClick = (event: Event) => {\n event.stopPropagation();\n event.preventDefault();\n\n const isNotInteractive = this.disabled || this.readonly || this.slotReadonly;\n if (isNotInteractive) return;\n if (!(event.target instanceof HTMLInputElement)) return;\n const { value, checked } = event.target;\n\n mirrorEmit(this, ['change', 'tctChange'], {\n value,\n checked,\n });\n this.inputElement.focus();\n };\n\n setupDescriptionObserver() {\n this.descriptionObserver = new MutationObserver(() => {\n this.checkForDescription();\n });\n\n this.descriptionObserver.observe(this.hostElement, {\n childList: true,\n subtree: true,\n });\n }\n\n // #endregion\n // #region Render Methods\n\n renderCheckboxSVG() {\n if (this.type === 'favorite') {\n return (\n <q2-icon\n type=\"star\"\n class=\"checkbox-icon\"\n />\n );\n }\n\n if (this.type === 'toggle') {\n return this.renderToggleSVG();\n }\n\n return (\n <svg\n aria-hidden=\"true\"\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n class=\"checkbox-icon\"\n focusable=\"false\"\n >\n <rect\n x=\"1\"\n y=\"1\"\n width=\"18\"\n height=\"18\"\n rx=\"3\"\n />\n {(this.checked || this.indeterminate) && this.renderCheckBoxSVGFill()}\n </svg>\n );\n }\n\n renderCheckBoxSVGFill() {\n if (this.indeterminate) {\n return (\n <line\n class=\"checkbox-fill indeterminate-fill\"\n x1=\"4\"\n y1=\"10\"\n x2=\"16\"\n y2=\"10\"\n />\n );\n }\n return (\n <polyline\n class=\"checkbox-fill checked-fill\"\n points=\"5 11 8.5 14.5 15 6\"\n key={`checkmark-${this.checked}`}\n />\n );\n }\n\n renderToggleSVG() {\n return (\n <div class=\"toggle-svg-container\">\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n viewBox=\"0 0 38 24\"\n class=\"toggle-track\"\n test-id=\"toggleTrack\"\n >\n <rect\n width=\"38\"\n height=\"24\"\n rx=\"12\"\n ></rect>\n </svg>\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n viewBox=\"0 0 18 18\"\n class=\"toggle-indicator\"\n test-id=\"toggleIndicator\"\n >\n <defs>\n {/* Mask for the X icon */}\n <mask\n id=\"xMask\"\n maskUnits=\"userSpaceOnUse\"\n >\n <rect\n width=\"18\"\n height=\"18\"\n fill=\"white\"\n ></rect>\n <line\n class=\"toggle-icon\"\n x1=\"6.5\"\n y1=\"6.5\"\n x2=\"11.5\"\n y2=\"11.5\"\n stroke=\"black\"\n stroke-width=\"2\"\n ></line>\n <line\n class=\"toggle-icon\"\n x1=\"6.5\"\n y1=\"11.5\"\n x2=\"11.5\"\n y2=\"6.5\"\n stroke=\"black\"\n stroke-width=\"2\"\n ></line>\n </mask>\n {/* Mask for the checkmark icon */}\n <mask id=\"checkMask\">\n <rect\n width=\"18\"\n height=\"18\"\n fill=\"white\"\n />\n <polyline\n class=\"toggle-icon\"\n points=\"6,8.5 8.5,11 12.5,6.5\"\n fill=\"none\"\n />\n </mask>\n </defs>\n <circle\n class=\"toggle-circle\"\n cx=\"9\"\n cy=\"9\"\n r=\"9\"\n mask=\"url(#xMask)\"\n ></circle>\n </svg>\n </div>\n );\n }\n\n render() {\n const textLabelClasses = ['label-text'];\n if (this.hideLabel) textLabelClasses.push('sr');\n return (\n <div class=\"container\">\n <input\n ref={el => (this.inputElement = el)}\n aria-describedby={this.hasDescription ? 'description' : undefined}\n aria-invalid={this.hasError === undefined ? undefined : `${this.hasError}`}\n aria-labelledby={this.ariaLabelledBy}\n checked={this.indeterminate || this.checked || false}\n class=\"sr\"\n disabled={!!this.disabled || !!this.groupDisabled}\n id={this._id}\n name={this.name || this._id}\n onClick={this.onInputClick}\n test-id=\"q2CheckboxInnerCheckBox\"\n type=\"checkbox\"\n value={this.value}\n />\n <label\n htmlFor={this._id}\n class=\"label-control\"\n test-id=\"checkboxButton\"\n aria-hidden=\"true\"\n >\n {this.renderCheckboxSVG()}\n </label>\n <div class={textLabelClasses.join(' ')}>\n <label\n test-id=\"checkboxLabel\"\n htmlFor={this._id}\n id={this.labelId}\n >\n <div class=\"label-content\">\n {loc(this.label)}\n <slot />\n <slot name=\"label\" />\n </div>\n </label>\n </div>\n {this._tooltip && (\n <span\n id={this.tooltipId}\n class=\"sr\"\n test-id=\"checkboxTooltipText\"\n >\n {this._tooltip}\n </span>\n )}\n {this.hasDescription && (\n <div\n class=\"description-text\"\n test-id=\"checkboxDescription\"\n id=\"description\"\n >\n {loc(this.description)}\n <slot name=\"description\" />\n </div>\n )}\n </div>\n );\n }\n\n // #endregion\n}\n","@import '../../styles/host.scss';\n@import '../../styles/functions';\n\n:host {\n display: inline-block;\n position: relative;\n line-height: 0;\n}\n\n:host(:not(:last-child)) {\n margin-inline-end: var-list(var-prefixer(tag-margin), --app-scale-2x, 10px);\n}\n\n.tag-wrapper {\n --comp-tag-btn-size: #{var-list(var-prefixer(tag-btn-size), --app-scale-6x, 30px)};\n --comp-tag-background: #{var-list(var-prefixer(tag-background), --t-gray-13, #e6e6e6)};\n --comp-tag-color: #{var-list(var-prefixer(tag-color), --t-gray-3, #262626)};\n --comp-tag-border-color: #{var-list(--tct-tag-border-color, transparent)};\n background: var(--comp-tag-background);\n color: var(--comp-tag-color);\n border-radius: var-list(var-prefixer(tag-border-radius), --app-border-radius-1, 4px);\n border-width: var-list(--tct-tag-border-width, 0);\n border-style: var-list(--tct-tag-border-style, 0);\n border-color: var(--comp-tag-border-color);\n font-size: var(--tct-tag-font-size, inherit);\n font-weight: var(--tct-tag-font-weight, inherit);\n position: relative;\n\n :host([theme='primary']) & {\n --comp-tag-background: #{var-list(--tct-tag-primary-background, --t-primary, #0079c1)};\n --comp-tag-color: #{var-list(--tct-tag-primary-font-color, --t-primary-text, #ffffff)};\n --comp-tag-border-color: #{var-list(--tct-tag-primary-border-color, --t-primary, #0079c1)};\n }\n\n :host([theme='secondary']) & {\n --comp-tag-background: #{var-list(--tct-tag-secondary-background, --t-secondary, #b3c2cc)};\n --comp-tag-color: #{var-list(--tct-tag-secondary-font-color, --t-secondary-text, #141414)};\n --comp-tag-border-color: #{var-list(--tct-tag-secondary-border-color, --t-secondary, #b3c2cc)};\n }\n\n :host([theme='tertiary']) & {\n --comp-tag-background: #{var-list(--tct-tag-tertiary-background, --t-tertiary, #e8f5fc)};\n --comp-tag-color: #{var-list(--tct-tag-tertiary-font-color, --t-tertiary-text, #141414)};\n --comp-tag-border-color: #{var-list(--tct-tag-tertiary-border-color, --t-tertiary, #e8f5fc)};\n }\n\n &:focus-visible {\n box-shadow: var-list(--tct-tag-focus-visible-box-shadow, --const-double-focus-ring);\n }\n}\n\n.tag {\n display: flex;\n align-items: center;\n width: max-content;\n gap: 6px;\n height: var-list(var-prefixer(tag-height), --app-scale-6x, 30px);\n line-height: var-list(var-prefixer(tag-height), --app-scale-6x, 30px);\n padding-inline: var-list(var-prefixer(tag-padding-inline), --app-scale-3x, 15px);\n\n ::slotted(q2-icon[slot='decorator']) {\n --tct-icon-size: 1em;\n --tct-icon-stroke-primary: var(--tct-tag-decorator-icon-primary-stroke);\n --tct-icon-stroke-secondary: var(--tct-tag-decorator-icon-secondary-stroke);\n }\n\n :host([theme=\"primary\"]) & ::slotted(q2-icon[slot='decorator']) {\n --tct-icon-stroke-primary: var(--tct-tag-primary-decorator-icon-primary-stroke);\n --tct-icon-stroke-secondary: var(--tct-tag-primary-decorator-icon-secondary-stroke);\n }\n\n ::slotted(q2-badge[slot='decorator']) {\n --tct-badge-height: 1em;\n --tct-badge-line-height: 30px;\n }\n}\n\n.tag.has-options {\n padding-right: 6px;\n}\n\n.btn-wrapper {\n --comp-tag-clickable-size: #{var-list(var-prefixer(tag-clickable-size), 44px)};\n --comp-tag-btn-offset: calc(calc(calc(var(--comp-tag-clickable-size) - var(--comp-tag-btn-size)) / 2) * -1);\n --comp-tag-background: #{var-list(var-prefixer(tag-background), --t-gray-13, #e6e6e6)};\n height: var(--comp-tag-clickable-size);\n display: flex;\n align-items: center;\n justify-content: center;\n position: relative;\n right: var(--comp-tag-btn-offset);\n top: var(--comp-tag-btn-offset);\n cursor: pointer;\n}\n\nbutton {\n height: var(--comp-tag-btn-size);\n stroke: var(--comp-tag-color);\n --tct-icon-stroke-primary: var(--comp-tag-color);\n cursor: pointer;\n border: 0;\n background: transparent;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0;\n padding-right: 6px;\n --tct-icon-size: 18px;\n}\n","import {\n Component,\n State,\n Prop,\n h,\n ComponentInterface,\n Host,\n Listen,\n Method,\n Element,\n EventEmitter,\n Event,\n Fragment,\n} from '@stencil/core';\nimport { isEventFromElement, loc, overrideFocus, waitForNextPaint } from 'src/utils';\nimport mirrorEmit from '@/utils/mirror-emit';\nimport { shouldShowActionSheet, showActionSheetList } from 'src/utils/action-sheet';\n\n/**\n * @name Tag\n * @category Display\n * @summary Use for displaying metadata labels or categories on content.\n * @slot decorator - An optional slot that supports either an [Icon](https://tecton.q2developer.com/design-system/q2-icon) or [Badge](https://tecton.q2developer.com/design-system/q2-badge) to be displayed with the tag content.\n * This is **not** available when using [Multiple Options](https://tecton.q2developer.com/design-system/q2-tag#multiple-options).\n */\n@Component({ tag: 'q2-tag', shadow: true, styleUrl: 'q2-tag.scss' })\nexport class Q2Tag implements ComponentInterface {\n // #region Own Properties\n\n dropdownBtn: HTMLButtonElement;\n mutationObserver: MutationObserver;\n optionList: HTMLQ2OptionListElement;\n popoverElement: HTMLQ2PopoverElement;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region State Properties\n\n @State()\n optionCount: number;\n\n // #endregion\n // #region Public Property API\n\n /**\n * Instructs the component to use the action sheet workflow for displaying its options.\n *\n * For more information, see [Action Sheets](https://tecton.q2developer.com/guides/action-sheets/).\n */\n @Prop()\n hoist: boolean = !!window.Tecton?.useActionSheets;\n\n /**\n * The text that populates the label.\n * @localizable\n */\n @Prop({ reflect: true })\n label: string;\n\n /**\n * Determine whether the popover is open or closed.\n *\n * @readonly\n */\n @Prop({ reflect: true, mutable: true })\n open: boolean;\n\n /** Determines the label that is applied to the option list for accessibility purposes. */\n @Prop()\n optionListLabel: string = 'options';\n\n /** Aligns the popover dropdown to the left or right side of the input field. */\n @Prop({ mutable: true })\n popoverAlignment: 'left' | 'right' = 'right';\n\n /**\n * Force the direction of the popover dropdown when it opens.\n * If no value is passed, the component will auto-detect the direction based on available space.\n */\n @Prop()\n popoverDirection: 'up' | 'down';\n\n /**\n * Force the maximum height of the popover. This value will be interpreted as pixels.\n * If no value is passed, or the value exceeds available space, the component will auto-detect the maximum height based on available space.\n */\n @Prop()\n popoverMaxHeight: number;\n\n /** @deprecated */\n @Prop()\n popoverMinHeight: number;\n\n /** The color of the element. */\n @Prop({ reflect: true })\n theme: 'primary' | 'secondary' | 'tertiary';\n\n // #endregion\n // #region Events\n\n /**\n * Emitted when a provided option is clicked.\n *\n * Requires at least one option to be provided.\n * @deprecated Use 'tctClick' instead\n */\n @Event()\n click: EventEmitter<{ value: string }>;\n\n /**\n * Emitted when a provided option is clicked.\n *\n * Requires at least one option to be provided.\n */\n @Event()\n tctClick: EventEmitter<{ value: string }>;\n\n // #endregion\n // #region Component Lifecycle Events\n\n disconnectedCallback() {\n this.mutationObserver?.disconnect();\n this.mutationObserver = null;\n }\n\n componentWillLoad() {\n this.initMutationObserver();\n this.determineOptionCount();\n }\n\n componentDidLoad(): void {\n overrideFocus(this.hostElement);\n this.filterSlottedElements();\n }\n\n // #endregion\n // #region Listeners\n\n @Listen('focus')\n delegateFocus(event: FocusEvent) {\n if (!isEventFromElement(event, this.hostElement)) return;\n if (!this.optionCount) return;\n this.dropdownBtn.focus();\n }\n\n @Listen('popoverStateChanged')\n popoverStateHandler({ detail: { open } }: CustomEvent<{ open: boolean }>) {\n if (this.open !== open) this.open = open;\n if (open) return;\n this.optionList.setActiveElement(null);\n }\n\n // #endregion\n // #region Public Methods API\n\n /**\n * Emulates clicking the tag to close the popover when options are provided and the popover is open.\n * @testonly\n */\n @Method()\n async closePopover() {\n if (!this.optionCount || !this.open) return;\n this._togglePopover();\n }\n\n /**\n * Emulates clicking the tag to open the popover when options are provided and the popover is closed.\n * @testonly\n */\n @Method()\n async openPopover() {\n if (!this.optionCount || this.open) return;\n this._togglePopover();\n }\n\n /**\n * Emulates selecting an option matching the passed value.\n *\n * If the popover is closed, this will open it before selecting the option.\n *\n * If there are not options, or the passed value does not match any option's value, this method does nothing.\n * @testonly\n */\n @Method()\n async selectOption(value) {\n if (!this.optionCount) return;\n await this.openPopover();\n await waitForNextPaint();\n const allOptions = await this.optionList.getOptions();\n const desiredOption = allOptions.find(option => option.value === value);\n desiredOption?.click();\n }\n\n // #endregion\n // #region Local Methods\n\n _togglePopover() {\n const { dropdownBtn } = this;\n dropdownBtn?.click();\n dropdownBtn?.focus();\n dropdownBtn.dispatchEvent(new FocusEvent('focus'));\n }\n\n determineOptionCount = () => {\n const numberOfOptions = this.hostElement.querySelectorAll('q2-option').length;\n this.optionCount = numberOfOptions;\n };\n\n filterSlottedElements = () => {\n if (!('HTMLSlotElement' in window)) return;\n const slot: HTMLSlotElement = this.hostElement.shadowRoot.querySelector('slot[name=\"decorator\"]');\n const assignedElements = Array.from(slot?.assignedElements() || []);\n if (!assignedElements.length) return;\n\n const approvedElements = ['Q2-ICON', 'Q2-BADGE'];\n assignedElements.forEach((element, index) => {\n if (!approvedElements.includes(element.tagName) || index > 0) {\n element.remove();\n }\n });\n };\n\n handleButtonFocusout = async (event: FocusEvent) => {\n const relatedTarget = event.relatedTarget as HTMLElement;\n if (this.popoverElement?.contains(relatedTarget)) return;\n if (this.hostElement.contains(relatedTarget)) return;\n this.open = false;\n };\n\n handleChange = event => {\n event.stopPropagation();\n if (!this.optionCount) return;\n const { value } = event.detail;\n\n mirrorEmit(this, ['click', 'tctClick'], { value });\n };\n\n handleClick = async (event: MouseEvent) => {\n event.stopPropagation();\n this.popoverElement.controlElement = this.dropdownBtn;\n if (shouldShowActionSheet(this)) {\n const { value } = await showActionSheetList(this, event);\n this.dropdownBtn.focus();\n mirrorEmit(this, ['click', 'tctClick'], { value });\n } else {\n await this.popoverElement.toggle();\n }\n };\n\n handleKeydown = async (event: KeyboardEvent) => {\n const isTabMetaOrCtrl = event.metaKey || event.ctrlKey || event.key === 'Tab';\n if (isTabMetaOrCtrl) return;\n\n event.preventDefault();\n this.popoverElement.controlElement = this.dropdownBtn;\n if (shouldShowActionSheet(this, event)) {\n const { value } = await showActionSheetList(this, event);\n this.dropdownBtn.focus();\n mirrorEmit(this, ['click', 'tctClick'], { value });\n } else {\n this.optionList.handleExternalKeydown(event);\n }\n };\n\n handleWrapperClick = () => {\n this.dropdownBtn.focus();\n this.dropdownBtn.click();\n };\n\n initMutationObserver = () => {\n if (!('MutationObserver' in window)) return;\n const observer = new MutationObserver(this.onMutationObserved);\n observer.observe(this.hostElement, { childList: true, attributes: true });\n this.mutationObserver = observer;\n };\n\n onClickElsewhere = (event: CustomEvent) => {\n const target = event.target as HTMLClickElsewhereElement;\n if (target.localName === 'click-elsewhere') {\n event.stopPropagation();\n const { popoverElement } = this;\n if (!popoverElement) return;\n popoverElement.open = false;\n }\n };\n\n onMutationObserved = () => {\n this.determineOptionCount();\n this.filterSlottedElements();\n };\n\n // #endregion\n // #region Render Methods\n\n renderHiddenElement() {\n return (\n <div\n id=\"option-description\"\n class=\"sr\"\n aria-hidden=\"true\"\n >\n {loc('tecton.element.optionList.optionCount', [this.optionCount])}\n </div>\n );\n }\n\n render() {\n const { open } = this;\n const wrapperClassNames = ['tag'];\n if (this.optionCount) wrapperClassNames.push('has-options');\n const shouldShowOptions = this.optionCount > 0;\n\n return (\n <Host>\n <click-elsewhere onChange={this.onClickElsewhere}>\n {shouldShowOptions ? (\n <Fragment>\n <div\n class=\"btn-wrapper\"\n onClick={this.handleWrapperClick}\n >\n <button\n class=\"tag-wrapper\"\n ref={el => (this.dropdownBtn = el)}\n test-id=\"btn-control\"\n type=\"button\"\n role=\"combobox\"\n onClick={this.handleClick}\n onKeyDown={this.handleKeydown}\n onFocusout={this.handleButtonFocusout}\n aria-controls=\"option-list\"\n aria-expanded={open ? 'true' : 'false'}\n aria-describedby=\"option-description\"\n aria-label={loc(this.label)}\n >\n <div class={wrapperClassNames.join(' ')}>{loc(this.label)}</div>\n <q2-icon type=\"options\"></q2-icon>\n </button>\n </div>\n {this.renderHiddenElement()}\n </Fragment>\n ) : (\n <div\n class=\"tag-wrapper\"\n onClick={e => e.stopPropagation()}\n >\n <div class={wrapperClassNames.join(' ')}>\n <slot name=\"decorator\" />\n {loc(this.label)}\n </div>\n </div>\n )}\n\n {shouldShowOptions && (\n <q2-popover\n ref={el => (this.popoverElement = el)}\n controlElement={this.dropdownBtn}\n open={this.open}\n maxHeight={this.popoverMaxHeight}\n minHeight={this.popoverMinHeight}\n direction={this.popoverDirection}\n align={this.popoverAlignment}\n >\n <q2-option-list\n id=\"option-list\"\n ref={el => (this.optionList = el)}\n onChange={this.handleChange}\n type=\"menu\"\n align=\"right\"\n label={loc('tecton.element.optionList.label', [this.optionListLabel])}\n no-select\n >\n <slot />\n </q2-option-list>\n </q2-popover>\n )}\n </click-elsewhere>\n </Host>\n );\n }\n\n // #endregion\n}\n"],"names":[],"mappings":"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"}
|