@quartzds/core 1.0.0-beta.121 → 1.0.0-beta.122
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +44 -0
- package/components/index.js +1 -1
- package/components/{p-CURs27Ur.js → p-BalM52S_.js} +3 -3
- package/components/{p-CURs27Ur.js.map → p-BalM52S_.js.map} +1 -1
- package/components/{p-CkyaV9az.js → p-C0VgKX4J.js} +9 -9
- package/components/p-C0VgKX4J.js.map +1 -0
- package/components/{p-DtxwXYGb.js → p-C9R8N06B.js} +5 -31
- package/components/p-C9R8N06B.js.map +1 -0
- package/components/{p-DR79BVX5.js → p-CKp062X8.js} +6 -6
- package/components/p-CKp062X8.js.map +1 -0
- package/components/{p-CjVnGhSO.js → p-CVuTVnQo.js} +3 -3
- package/components/{p-CjVnGhSO.js.map → p-CVuTVnQo.js.map} +1 -1
- package/components/{p-CkUTS1aU.js → p-Ck9w5WIb.js} +6 -6
- package/components/p-Ck9w5WIb.js.map +1 -0
- package/components/p-DCAlWquR.js +200 -0
- package/components/p-DCAlWquR.js.map +1 -0
- package/components/{p-DNHI4C-W.js → p-DRcxeXWE.js} +58 -22
- package/components/p-DRcxeXWE.js.map +1 -0
- package/components/{p-B2ZVUvk9.js → p-DgYrfIr_.js} +5 -5
- package/components/{p-B2ZVUvk9.js.map → p-DgYrfIr_.js.map} +1 -1
- package/components/{p-CDRwHAIT.js → p-XP2CY_fo.js} +3 -3
- package/components/p-XP2CY_fo.js.map +1 -0
- package/components/{p-C1c4JVlg.js → p-io1iVgY1.js} +47 -28
- package/components/p-io1iVgY1.js.map +1 -0
- package/components/{p-D82sb4oJ.js → p-oqmnh-8P.js} +4 -4
- package/components/{p-D82sb4oJ.js.map → p-oqmnh-8P.js.map} +1 -1
- package/components/{p-5dwtV5iH.js → p-yb0Kv4Y6.js} +24 -6
- package/components/p-yb0Kv4Y6.js.map +1 -0
- package/components/qds-action-item.js +4 -4
- package/components/qds-action-item.js.map +1 -1
- package/components/qds-avatar-media.js +1 -1
- package/components/qds-badge-counter.js +1 -1
- package/components/qds-breadcrumb-item.js +5 -5
- package/components/qds-breadcrumb-item.js.map +1 -1
- package/components/qds-button.js +5 -5
- package/components/qds-button.js.map +1 -1
- package/components/qds-checkbox.js +1 -1
- package/components/qds-chip.js +9 -9
- package/components/qds-chip.js.map +1 -1
- package/components/qds-dialog.js +6 -6
- package/components/qds-divider.js +1 -1
- package/components/qds-dropdown.js +1 -1
- package/components/qds-form-message.js +4 -4
- package/components/qds-form-message.js.map +1 -1
- package/components/qds-icon-button.js +1 -1
- package/components/qds-icon-tab.js +8 -8
- package/components/qds-icon.js +1 -1
- package/components/qds-inline-link.js +4 -4
- package/components/qds-inline-link.js.map +1 -1
- package/components/qds-input.js +17 -13
- package/components/qds-input.js.map +1 -1
- package/components/qds-label.js +153 -1
- package/components/qds-label.js.map +1 -1
- package/components/qds-list-item.js +25 -29
- package/components/qds-list-item.js.map +1 -1
- package/components/qds-loader.js +2 -2
- package/components/qds-loader.js.map +1 -1
- package/components/qds-menu-item.js +6 -6
- package/components/qds-mini-button.js +1 -1
- package/components/qds-progress-bar.js +1 -1
- package/components/qds-radio.js +1 -1
- package/components/qds-select.js +6 -6
- package/components/qds-select.js.map +1 -1
- package/components/qds-standalone-link.js +5 -5
- package/components/qds-standalone-link.js.map +1 -1
- package/components/qds-switch.js +5 -5
- package/components/qds-tab.js +20 -15
- package/components/qds-tab.js.map +1 -1
- package/components/qds-tabbar.js +95 -34
- package/components/qds-tabbar.js.map +1 -1
- package/components/qds-table-cell.js +32 -4
- package/components/qds-table-cell.js.map +1 -1
- package/components/qds-table-head-cell.js +32 -4
- package/components/qds-table-head-cell.js.map +1 -1
- package/components/qds-table-row.js +2 -2
- package/components/qds-table-row.js.map +1 -1
- package/components/qds-table.js +1 -1
- package/components/qds-tag.js +1 -1
- package/components/qds-textarea.js +4 -4
- package/components/qds-textarea.js.map +1 -1
- package/components/qds-title.js +1 -1
- package/components/qds-tooltip.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/qds-action-item.cjs.entry.js +1 -1
- package/dist/cjs/qds-action-item.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-avatar-media.qds-checkbox.qds-radio.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-avatar-media_3.cjs.entry.js +144 -41
- package/dist/cjs/qds-badge-counter.qds-badge-indicator.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-badge-counter_2.cjs.entry.js +1 -1
- package/dist/cjs/qds-breadcrumb-item.cjs.entry.js +2 -2
- package/dist/cjs/qds-breadcrumb-item.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-button.cjs.entry.js +1 -1
- package/dist/cjs/qds-button.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-chip.cjs.entry.js +5 -5
- package/dist/cjs/qds-chip.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-dialog.cjs.entry.js +1 -1
- package/dist/cjs/qds-divider.qds-icon-button.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-divider_2.cjs.entry.js +4 -4
- package/dist/cjs/qds-dropdown.cjs.entry.js +21 -3
- package/dist/cjs/qds-dropdown.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-form-message.cjs.entry.js +2 -2
- package/dist/cjs/qds-form-message.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-icon-tab.cjs.entry.js +3 -3
- package/dist/cjs/qds-icon.cjs.entry.js +9 -29
- package/dist/cjs/qds-icon.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-inline-link.cjs.entry.js +2 -2
- package/dist/cjs/qds-inline-link.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-input.cjs.entry.js +14 -10
- package/dist/cjs/qds-input.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-label.cjs.entry.js +2 -2
- package/dist/cjs/qds-list-item.cjs.entry.js +6 -4
- package/dist/cjs/qds-list-item.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-loader.cjs.entry.js +1 -1
- package/dist/cjs/qds-loader.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-menu-item.cjs.entry.js +2 -2
- package/dist/cjs/qds-mini-button.cjs.entry.js +1 -1
- package/dist/cjs/qds-progress-bar.cjs.entry.js +1 -1
- package/dist/cjs/qds-select.cjs.entry.js +4 -4
- package/dist/cjs/qds-select.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-standalone-link.cjs.entry.js +3 -3
- package/dist/cjs/qds-standalone-link.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-switch.cjs.entry.js +3 -3
- package/dist/cjs/qds-tab.cjs.entry.js +15 -10
- package/dist/cjs/qds-tab.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-tabbar.cjs.entry.js +83 -27
- package/dist/cjs/qds-tabbar.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-table-cell.cjs.entry.js +30 -3
- package/dist/cjs/qds-table-cell.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-table-head-cell.cjs.entry.js +30 -3
- package/dist/cjs/qds-table-head-cell.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-table-row.cjs.entry.js +2 -2
- package/dist/cjs/qds-table-row.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-table.cjs.entry.js +1 -1
- package/dist/cjs/qds-tag.cjs.entry.js +2 -2
- package/dist/cjs/qds-tag.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-textarea.cjs.entry.js +3 -3
- package/dist/cjs/qds-textarea.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-title.cjs.entry.js +3 -3
- package/dist/cjs/qds-title.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-tooltip.cjs.entry.js +1 -1
- package/dist/cjs/qds.cjs.js +1 -1
- package/dist/custom-elements.json +365 -30
- package/dist/docs.json +319 -63
- package/dist/esm/{helpers-eFD8hV6J.js → helpers-Fe2AA6uo.js} +3 -3
- package/dist/esm/{helpers-eFD8hV6J.js.map → helpers-Fe2AA6uo.js.map} +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/qds-action-item.entry.js +2 -2
- package/dist/esm/qds-action-item.entry.js.map +1 -1
- package/dist/esm/qds-avatar-media.qds-checkbox.qds-radio.entry.js.map +1 -1
- package/dist/esm/qds-avatar-media_3.entry.js +146 -43
- package/dist/esm/qds-badge-counter.qds-badge-indicator.entry.js.map +1 -1
- package/dist/esm/qds-badge-counter_2.entry.js +1 -1
- package/dist/esm/qds-breadcrumb-item.entry.js +3 -3
- package/dist/esm/qds-breadcrumb-item.entry.js.map +1 -1
- package/dist/esm/qds-button.entry.js +2 -2
- package/dist/esm/qds-button.entry.js.map +1 -1
- package/dist/esm/qds-chip.entry.js +6 -6
- package/dist/esm/qds-chip.entry.js.map +1 -1
- package/dist/esm/qds-dialog.entry.js +2 -2
- package/dist/esm/qds-divider.qds-icon-button.entry.js.map +1 -1
- package/dist/esm/qds-divider_2.entry.js +5 -5
- package/dist/esm/qds-dropdown.entry.js +22 -4
- package/dist/esm/qds-dropdown.entry.js.map +1 -1
- package/dist/esm/qds-form-message.entry.js +3 -3
- package/dist/esm/qds-form-message.entry.js.map +1 -1
- package/dist/esm/qds-icon-tab.entry.js +4 -4
- package/dist/esm/qds-icon.entry.js +10 -30
- package/dist/esm/qds-icon.entry.js.map +1 -1
- package/dist/esm/qds-inline-link.entry.js +3 -3
- package/dist/esm/qds-inline-link.entry.js.map +1 -1
- package/dist/esm/qds-input.entry.js +15 -11
- package/dist/esm/qds-input.entry.js.map +1 -1
- package/dist/esm/qds-label.entry.js +3 -3
- package/dist/esm/qds-list-item.entry.js +7 -5
- package/dist/esm/qds-list-item.entry.js.map +1 -1
- package/dist/esm/qds-loader.entry.js +1 -1
- package/dist/esm/qds-loader.entry.js.map +1 -1
- package/dist/esm/qds-menu-item.entry.js +3 -3
- package/dist/esm/qds-mini-button.entry.js +2 -2
- package/dist/esm/qds-progress-bar.entry.js +1 -1
- package/dist/esm/qds-select.entry.js +5 -5
- package/dist/esm/qds-select.entry.js.map +1 -1
- package/dist/esm/qds-standalone-link.entry.js +4 -4
- package/dist/esm/qds-standalone-link.entry.js.map +1 -1
- package/dist/esm/qds-switch.entry.js +4 -4
- package/dist/esm/qds-tab.entry.js +16 -11
- package/dist/esm/qds-tab.entry.js.map +1 -1
- package/dist/esm/qds-tabbar.entry.js +84 -28
- package/dist/esm/qds-tabbar.entry.js.map +1 -1
- package/dist/esm/qds-table-cell.entry.js +30 -3
- package/dist/esm/qds-table-cell.entry.js.map +1 -1
- package/dist/esm/qds-table-head-cell.entry.js +30 -3
- package/dist/esm/qds-table-head-cell.entry.js.map +1 -1
- package/dist/esm/qds-table-row.entry.js +2 -2
- package/dist/esm/qds-table-row.entry.js.map +1 -1
- package/dist/esm/qds-table.entry.js +1 -1
- package/dist/esm/qds-tag.entry.js +3 -3
- package/dist/esm/qds-tag.entry.js.map +1 -1
- package/dist/esm/qds-textarea.entry.js +4 -4
- package/dist/esm/qds-textarea.entry.js.map +1 -1
- package/dist/esm/qds-title.entry.js +3 -3
- package/dist/esm/qds-title.entry.js.map +1 -1
- package/dist/esm/qds-tooltip.entry.js +2 -2
- package/dist/esm/qds.js +1 -1
- package/dist/types/components/avatar-media/avatar-media.d.ts +14 -5
- package/dist/types/components/checkbox/checkbox.d.ts +4 -0
- package/dist/types/components/icon/icon.d.ts +1 -2
- package/dist/types/components/radio/radio.d.ts +4 -0
- package/dist/types/components/tab/tab.d.ts +1 -1
- package/dist/types/components/tabbar/tabbar.d.ts +27 -1
- package/dist/types/components/table-cell/table-cell.d.ts +6 -0
- package/dist/types/components/table-head-cell/table-head-cell.d.ts +6 -0
- package/dist/types/components.d.ts +72 -15
- package/dist/vscode.html-custom-data.json +79 -4
- package/hydrate/index.js +962 -732
- package/hydrate/index.mjs +962 -732
- package/package.json +1 -1
- package/styles/core.css +24 -22
- package/components/p-5dwtV5iH.js.map +0 -1
- package/components/p-C1c4JVlg.js.map +0 -1
- package/components/p-CDRwHAIT.js.map +0 -1
- package/components/p-CkUTS1aU.js.map +0 -1
- package/components/p-CkyaV9az.js.map +0 -1
- package/components/p-D9pW936J.js +0 -164
- package/components/p-D9pW936J.js.map +0 -1
- package/components/p-DNHI4C-W.js.map +0 -1
- package/components/p-DR79BVX5.js.map +0 -1
- package/components/p-DtxwXYGb.js.map +0 -1
- package/components/p-laE-pGH7.js +0 -163
- package/components/p-laE-pGH7.js.map +0 -1
|
@@ -4,9 +4,9 @@
|
|
|
4
4
|
* SPDX-License-Identifier: Apache-2.0
|
|
5
5
|
*/
|
|
6
6
|
import { r as registerInstance, c as createEvent, h, g as getElement } from './index-Hg1Liloy.js';
|
|
7
|
-
import { i as invariant, V as VERTICAL_MOVE_KEYS, H as HORIZONTAL_MOVE_KEYS, c as inheritAriaAttributes, f as resolvePanelElement, g as componentOnReady } from './helpers-
|
|
7
|
+
import { i as invariant, V as VERTICAL_MOVE_KEYS, H as HORIZONTAL_MOVE_KEYS, c as inheritAriaAttributes, f as resolvePanelElement, g as componentOnReady } from './helpers-Fe2AA6uo.js';
|
|
8
8
|
|
|
9
|
-
const tabbarCss = ":host([hidden]){display:none!important}:host{display:block}.qds-tabbar,.qds-tabs,.qds-vertical,.qds-vertical-divider{display:flex}.qds-tabbar,.qds-vertical-divider{width:inherit}.qds-arrow-start{transform:scaleX(var(--qds-direction-factor,1)) rotate(180deg)}.qds-align-center{align-content:center}.qds-hidden{display:none}.qds-centered{justify-content:center}.qds-tabs{flex:1;margin-block:0;overflow:auto;padding-inline-start:0;scroll-behavior:smooth}.qds-vertical{flex-direction:column}.qds-vertical-divider{flex-direction:row}[data-layer=main][data-level=root] .qds-tabs{gap:var(--qds-control-large-gap-siblings-related)}[data-layer=main][data-level=section] .qds-tabs{gap:var(--qds-control-standard-gap-siblings-related)}[data-layer=main][data-level=subsection] .qds-tabs{gap:var(--qds-control-small-gap-siblings-related)}[data-layer=popup][data-level=root] .qds-tabs{gap:var(--qds-control-standard-gap-siblings-related)}[data-layer=popup][data-level=section] .qds-tabs{gap:var(--qds-control-small-gap-siblings-related)}:is([data-layer=panel],[data-layer=accessory])[data-level=root] .qds-tabs{gap:var(--qds-control-small-gap-siblings-related)}";
|
|
9
|
+
const tabbarCss = ":host([hidden]){display:none!important}:host{display:block}.qds-tabbar,.qds-tabs,.qds-vertical,.qds-vertical-divider{display:flex}.qds-tabbar,.qds-vertical-divider{width:inherit}.qds-arrow-start{transform:scaleX(var(--qds-direction-factor,1)) rotate(180deg)}.qds-align-center{align-content:center}.qds-hidden{display:none}.qds-centered{justify-content:center}.qds-tabs{flex:1;margin-block:0;overflow:auto;padding-inline-start:0;scroll-behavior:smooth}.qds-vertical{flex-direction:column}.qds-vertical-divider{flex-direction:row}[data-size=small]{gap:var(--qds-control-small-gap-siblings-related)}[data-size=standard]{gap:var(--qds-control-standard-gap-siblings-related)}[data-layer=main][data-level=root] .qds-tabs,[data-size=large]{gap:var(--qds-control-large-gap-siblings-related)}[data-layer=main][data-level=section] .qds-tabs{gap:var(--qds-control-standard-gap-siblings-related)}[data-layer=main][data-level=subsection] .qds-tabs{gap:var(--qds-control-small-gap-siblings-related)}[data-layer=popup][data-level=root] .qds-tabs{gap:var(--qds-control-standard-gap-siblings-related)}[data-layer=popup][data-level=section] .qds-tabs{gap:var(--qds-control-small-gap-siblings-related)}:is([data-layer=panel],[data-layer=accessory])[data-level=root] .qds-tabs{gap:var(--qds-control-small-gap-siblings-related)}";
|
|
10
10
|
|
|
11
11
|
// SPDX-FileCopyrightText: © 2024 Schneider Electric
|
|
12
12
|
//
|
|
@@ -27,7 +27,7 @@ var __classPrivateFieldSet = (undefined && undefined.__classPrivateFieldSet) ||
|
|
|
27
27
|
throw new TypeError("Cannot write private member to an object whose class did not declare it");
|
|
28
28
|
return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
|
|
29
29
|
};
|
|
30
|
-
var _Tabbar_instances, _Tabbar_tabs, _Tabbar_ro, _Tabbar_tabbar, _Tabbar_inheritedAttributes, _Tabbar_computeDividerVisible_get, _Tabbar_scrollToStart, _Tabbar_scrollToEnd, _Tabbar_setActiveTab, _Tabbar_switchTabPanel, _Tabbar_handleTabActivation, _Tabbar_getCurrentTab, _Tabbar_setCurrentTab, _Tabbar_onClick, _Tabbar_onKeyDown, _Tabbar_onMouseDown, _Tabbar_onScroll, _Tabbar_onViewportCrop, _Tabbar_updateTabsCache, _Tabbar_onSlotchange;
|
|
30
|
+
var _Tabbar_instances, _Tabbar_tabs, _Tabbar_ro, _Tabbar_tabbar, _Tabbar_inheritedAttributes, _Tabbar_computedImportance_get, _Tabbar_computedSize_get, _Tabbar_computedPlacement_get, _Tabbar_computeDividerVisible_get, _Tabbar_scrollToStart, _Tabbar_scrollToEnd, _Tabbar_setActiveTab, _Tabbar_switchTabPanel, _Tabbar_handleTabActivation, _Tabbar_getCurrentTab, _Tabbar_setCurrentTab, _Tabbar_isVerticalPlacement, _Tabbar_isHorizontalPlacement, _Tabbar_onClick, _Tabbar_onKeyDown, _Tabbar_onMouseDown, _Tabbar_onScroll, _Tabbar_onViewportCrop, _Tabbar_updateTabsCache, _Tabbar_setTabSettings, _Tabbar_onSlotchange;
|
|
31
31
|
const TAB_SETTINGS = {
|
|
32
32
|
'main-root': {
|
|
33
33
|
importance: 'standard',
|
|
@@ -80,16 +80,33 @@ const Tabbar = class {
|
|
|
80
80
|
_Tabbar_instances.add(this);
|
|
81
81
|
/**
|
|
82
82
|
* The tabbar's layer.
|
|
83
|
+
*
|
|
84
|
+
* @deprecated The property layer is deprecated. Please use `size` property instead.
|
|
85
|
+
* Please do not use `layer` and `size` at the same time.
|
|
83
86
|
*/
|
|
84
87
|
this.layer = 'main';
|
|
85
88
|
/**
|
|
86
89
|
* The tabbar's level.
|
|
90
|
+
*
|
|
91
|
+
* @deprecated The property level is deprecated. Please use `size` property instead.
|
|
92
|
+
* Please do not use `level` and `size` at the same time.
|
|
87
93
|
*/
|
|
88
94
|
this.level = 'root';
|
|
95
|
+
/**
|
|
96
|
+
* The tabbar's size. This controls the size of the tabs within the tabbar.
|
|
97
|
+
*/
|
|
98
|
+
this.size = 'standard';
|
|
89
99
|
/**
|
|
90
100
|
* The tabbar's orientation.
|
|
101
|
+
*
|
|
102
|
+
* @deprecated Please use the `placement` property instead. Do not use
|
|
103
|
+
* `orientation` and `placement` at the same time.
|
|
91
104
|
*/
|
|
92
105
|
this.orientation = 'horizontal';
|
|
106
|
+
/**
|
|
107
|
+
* The tabbar's placement.
|
|
108
|
+
*/
|
|
109
|
+
this.placement = 'top';
|
|
93
110
|
/**
|
|
94
111
|
* Displays a divider line.
|
|
95
112
|
*/
|
|
@@ -97,7 +114,7 @@ const Tabbar = class {
|
|
|
97
114
|
/**
|
|
98
115
|
* The alignment of tabs. Only applicable for horizontal orientation.
|
|
99
116
|
*/
|
|
100
|
-
this.alignment = '
|
|
117
|
+
this.alignment = 'start';
|
|
101
118
|
this.disableEndArrow = false;
|
|
102
119
|
this.disableStartArrow = false;
|
|
103
120
|
_Tabbar_tabs.set(this, []);
|
|
@@ -122,6 +139,8 @@ const Tabbar = class {
|
|
|
122
139
|
: __classPrivateFieldGet(this, _Tabbar_tabbar, "f").scrollLeft + __classPrivateFieldGet(this, _Tabbar_tabbar, "f").clientWidth,
|
|
123
140
|
});
|
|
124
141
|
});
|
|
142
|
+
_Tabbar_isVerticalPlacement.set(this, () => this.placement === 'start' || this.placement === 'end');
|
|
143
|
+
_Tabbar_isHorizontalPlacement.set(this, () => this.placement === 'top' || this.placement === 'bottom');
|
|
125
144
|
_Tabbar_onClick.set(this, (event) => {
|
|
126
145
|
const { target } = event;
|
|
127
146
|
if (!(target instanceof HTMLElement))
|
|
@@ -133,7 +152,7 @@ const Tabbar = class {
|
|
|
133
152
|
__classPrivateFieldGet(this, _Tabbar_instances, "m", _Tabbar_setActiveTab).call(this, tab);
|
|
134
153
|
});
|
|
135
154
|
_Tabbar_onKeyDown.set(this, (event) => {
|
|
136
|
-
const isVertical = this.orientation === 'vertical';
|
|
155
|
+
const isVertical = this.orientation === 'vertical' || __classPrivateFieldGet(this, _Tabbar_isVerticalPlacement, "f").call(this);
|
|
137
156
|
const MOVE_SELECTION_KEYS = isVertical
|
|
138
157
|
? VERTICAL_MOVE_KEYS
|
|
139
158
|
: HORIZONTAL_MOVE_KEYS;
|
|
@@ -216,10 +235,14 @@ const Tabbar = class {
|
|
|
216
235
|
__classPrivateFieldGet(this, _Tabbar_instances, "m", _Tabbar_setCurrentTab).call(this, __classPrivateFieldGet(this, _Tabbar_tabs, "f")[0]);
|
|
217
236
|
});
|
|
218
237
|
}
|
|
238
|
+
settingChanged() {
|
|
239
|
+
__classPrivateFieldGet(this, _Tabbar_instances, "m", _Tabbar_setTabSettings).call(this);
|
|
240
|
+
}
|
|
219
241
|
windowResize() {
|
|
220
242
|
__classPrivateFieldGet(this, _Tabbar_onViewportCrop, "f").call(this);
|
|
221
243
|
}
|
|
222
244
|
componentWillLoad() {
|
|
245
|
+
this.settingChanged();
|
|
223
246
|
__classPrivateFieldSet(this, _Tabbar_inheritedAttributes, inheritAriaAttributes(this.host), "f");
|
|
224
247
|
const tabs = [
|
|
225
248
|
...this.host.querySelectorAll('qds-tab'),
|
|
@@ -233,18 +256,7 @@ const Tabbar = class {
|
|
|
233
256
|
componentDidRender() {
|
|
234
257
|
if (this.activeTab)
|
|
235
258
|
__classPrivateFieldGet(this, _Tabbar_instances, "m", _Tabbar_switchTabPanel).call(this, this.activeTab);
|
|
236
|
-
|
|
237
|
-
if (!settings)
|
|
238
|
-
return;
|
|
239
|
-
for (const tab of this.host.querySelectorAll('qds-tab')) {
|
|
240
|
-
/* eslint-disable @typescript-eslint/no-unsafe-member-access */
|
|
241
|
-
tab.importance = settings.importance;
|
|
242
|
-
tab.size = settings.size;
|
|
243
|
-
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
|
|
244
|
-
tab.indicatorPosition =
|
|
245
|
-
this.orientation === 'vertical' ? 'inline-end' : tab.indicatorPosition;
|
|
246
|
-
/* eslint-enable @typescript-eslint/no-unsafe-member-access */
|
|
247
|
-
}
|
|
259
|
+
this.settingChanged();
|
|
248
260
|
}
|
|
249
261
|
componentDidLoad() {
|
|
250
262
|
invariant(__classPrivateFieldGet(this, _Tabbar_tabbar, "f"));
|
|
@@ -256,34 +268,64 @@ const Tabbar = class {
|
|
|
256
268
|
__classPrivateFieldGet(this, _Tabbar_ro, "f").disconnect();
|
|
257
269
|
}
|
|
258
270
|
render() {
|
|
259
|
-
return (h("div", { key: '
|
|
271
|
+
return (h("div", { key: '47ac9cd0bc096758c6c2797393010c0a9693fa88', class: {
|
|
272
|
+
'qds-vertical-divider': this.orientation === 'vertical' || __classPrivateFieldGet(this, _Tabbar_isVerticalPlacement, "f").call(this),
|
|
273
|
+
}, "data-layer": this.layer, "data-level": this.level, "data-importance": __classPrivateFieldGet(this, _Tabbar_instances, "a", _Tabbar_computedImportance_get) }, h("div", { key: '2421469125db014dfa6be6012daaf06a354e1466', class: "qds-tabbar" }, h("div", { key: '1def1f43dc9ecc8680634fa2d5f330c803c82054', class: {
|
|
260
274
|
'qds-align-center': true,
|
|
261
275
|
'qds-hidden': (this.disableEndArrow && this.disableStartArrow) ||
|
|
262
|
-
this.orientation === 'vertical'
|
|
263
|
-
|
|
276
|
+
this.orientation === 'vertical' ||
|
|
277
|
+
__classPrivateFieldGet(this, _Tabbar_isVerticalPlacement, "f").call(this),
|
|
278
|
+
} }, h("qds-icon-button", { key: '539fe2ec4cd5a91cf1a35ead239eebd2eda981e4', text: "show previous tab", importance: "subdued", iconName: "next", iconLibrary: "core", class: "qds-arrow-start", onClick: __classPrivateFieldGet(this, _Tabbar_scrollToStart, "f"), disabled: this.disableStartArrow })), h("ul", { key: '05ff03b99f92f9e85f4703dcc6eca96220d6e1ee', class: {
|
|
264
279
|
'qds-tabs': true,
|
|
265
|
-
'qds-vertical': this.orientation === 'vertical',
|
|
266
|
-
'qds-centered': this.alignment === '
|
|
267
|
-
this.orientation === 'horizontal'
|
|
280
|
+
'qds-vertical': this.orientation === 'vertical' || __classPrivateFieldGet(this, _Tabbar_isVerticalPlacement, "f").call(this),
|
|
281
|
+
'qds-centered': this.alignment === 'center' &&
|
|
282
|
+
(this.orientation === 'horizontal' ||
|
|
283
|
+
__classPrivateFieldGet(this, _Tabbar_isHorizontalPlacement, "f").call(this)) &&
|
|
268
284
|
this.disableEndArrow &&
|
|
269
285
|
this.disableStartArrow,
|
|
270
286
|
}, role: "tablist", "aria-label": this.tablistDescription, ref: (element) => {
|
|
271
287
|
__classPrivateFieldSet(this, _Tabbar_tabbar, element, "f");
|
|
272
|
-
}, onClick: __classPrivateFieldGet(this, _Tabbar_onClick, "f"), onKeyDown: __classPrivateFieldGet(this, _Tabbar_onKeyDown, "f"), onMouseDown: __classPrivateFieldGet(this, _Tabbar_onMouseDown, "f"), onScroll: __classPrivateFieldGet(this, _Tabbar_onScroll, "f"), ...__classPrivateFieldGet(this, _Tabbar_inheritedAttributes, "f") }, h("slot", { key: '
|
|
288
|
+
}, onClick: __classPrivateFieldGet(this, _Tabbar_onClick, "f"), onKeyDown: __classPrivateFieldGet(this, _Tabbar_onKeyDown, "f"), onMouseDown: __classPrivateFieldGet(this, _Tabbar_onMouseDown, "f"), onScroll: __classPrivateFieldGet(this, _Tabbar_onScroll, "f"), ...__classPrivateFieldGet(this, _Tabbar_inheritedAttributes, "f") }, h("slot", { key: '4ccd64f11587556c7af2b0d4c571ee8162dbba70', onSlotchange: __classPrivateFieldGet(this, _Tabbar_onSlotchange, "f") })), h("div", { key: 'c5b64348ca4c65bb4894ec0dec6b6b89c411f958', class: {
|
|
273
289
|
'qds-align-center': true,
|
|
274
290
|
'qds-hidden': (this.disableEndArrow && this.disableStartArrow) ||
|
|
275
|
-
this.orientation === 'vertical'
|
|
276
|
-
|
|
291
|
+
this.orientation === 'vertical' ||
|
|
292
|
+
__classPrivateFieldGet(this, _Tabbar_isVerticalPlacement, "f").call(this),
|
|
293
|
+
} }, h("qds-icon-button", { key: 'edcb7e2054454edb2f949332ad62998a2e34a368', text: "show next tab", iconName: "next", iconLibrary: "core", importance: "subdued", onClick: __classPrivateFieldGet(this, _Tabbar_scrollToEnd, "f"), disabled: this.disableEndArrow }))), __classPrivateFieldGet(this, _Tabbar_instances, "a", _Tabbar_computeDividerVisible_get) && (h("qds-divider", { key: 'bfafcfbcaaa50341778498e9887b71a548209178', vertical: this.orientation === 'vertical' || __classPrivateFieldGet(this, _Tabbar_isVerticalPlacement, "f").call(this) }))));
|
|
277
294
|
}
|
|
278
295
|
static get delegatesFocus() { return true; }
|
|
279
296
|
get host() { return getElement(this); }
|
|
297
|
+
static get watchers() { return {
|
|
298
|
+
"importance": ["settingChanged"]
|
|
299
|
+
}; }
|
|
280
300
|
};
|
|
281
|
-
_Tabbar_tabs = new WeakMap(), _Tabbar_ro = new WeakMap(), _Tabbar_tabbar = new WeakMap(), _Tabbar_inheritedAttributes = new WeakMap(), _Tabbar_scrollToStart = new WeakMap(), _Tabbar_scrollToEnd = new WeakMap(), _Tabbar_onClick = new WeakMap(), _Tabbar_onKeyDown = new WeakMap(), _Tabbar_onMouseDown = new WeakMap(), _Tabbar_onScroll = new WeakMap(), _Tabbar_onViewportCrop = new WeakMap(), _Tabbar_onSlotchange = new WeakMap(), _Tabbar_instances = new WeakSet(),
|
|
301
|
+
_Tabbar_tabs = new WeakMap(), _Tabbar_ro = new WeakMap(), _Tabbar_tabbar = new WeakMap(), _Tabbar_inheritedAttributes = new WeakMap(), _Tabbar_scrollToStart = new WeakMap(), _Tabbar_scrollToEnd = new WeakMap(), _Tabbar_isVerticalPlacement = new WeakMap(), _Tabbar_isHorizontalPlacement = new WeakMap(), _Tabbar_onClick = new WeakMap(), _Tabbar_onKeyDown = new WeakMap(), _Tabbar_onMouseDown = new WeakMap(), _Tabbar_onScroll = new WeakMap(), _Tabbar_onViewportCrop = new WeakMap(), _Tabbar_onSlotchange = new WeakMap(), _Tabbar_instances = new WeakSet(), _Tabbar_computedImportance_get = function _Tabbar_computedImportance_get() {
|
|
302
|
+
return this.importance;
|
|
303
|
+
}, _Tabbar_computedSize_get = function _Tabbar_computedSize_get() {
|
|
304
|
+
return this.size ?? undefined;
|
|
305
|
+
}, _Tabbar_computedPlacement_get = function _Tabbar_computedPlacement_get() {
|
|
306
|
+
switch (this.placement) {
|
|
307
|
+
case 'top': {
|
|
308
|
+
return 'block-end';
|
|
309
|
+
}
|
|
310
|
+
case 'end': {
|
|
311
|
+
return 'inline-start';
|
|
312
|
+
}
|
|
313
|
+
case 'bottom': {
|
|
314
|
+
return 'block-start';
|
|
315
|
+
}
|
|
316
|
+
case 'start': {
|
|
317
|
+
return 'inline-end';
|
|
318
|
+
}
|
|
319
|
+
default: {
|
|
320
|
+
return undefined;
|
|
321
|
+
}
|
|
322
|
+
}
|
|
323
|
+
}, _Tabbar_computeDividerVisible_get = function _Tabbar_computeDividerVisible_get() {
|
|
282
324
|
if (this.layer === 'panel')
|
|
283
325
|
return false;
|
|
284
326
|
if (this.layer === 'main' &&
|
|
285
327
|
this.level === 'subsection' &&
|
|
286
|
-
this.orientation === 'horizontal')
|
|
328
|
+
(this.orientation === 'horizontal' || __classPrivateFieldGet(this, _Tabbar_isVerticalPlacement, "f").call(this)))
|
|
287
329
|
return false;
|
|
288
330
|
return this.showDivider === true;
|
|
289
331
|
}, _Tabbar_setActiveTab = function _Tabbar_setActiveTab(tab) {
|
|
@@ -335,6 +377,20 @@ _Tabbar_tabs = new WeakMap(), _Tabbar_ro = new WeakMap(), _Tabbar_tabbar = new W
|
|
|
335
377
|
__classPrivateFieldSet(this, _Tabbar_tabs, slot
|
|
336
378
|
? [...slot.assignedElements({ flatten: true })].filter((element) => isEnabledTabItem(element))
|
|
337
379
|
: [], "f");
|
|
380
|
+
}, _Tabbar_setTabSettings = function _Tabbar_setTabSettings() {
|
|
381
|
+
const settings = TAB_SETTINGS[`${this.layer}-${this.level}`];
|
|
382
|
+
if (!settings)
|
|
383
|
+
return;
|
|
384
|
+
for (const tab of this.host.querySelectorAll('qds-tab')) {
|
|
385
|
+
/* eslint-disable @typescript-eslint/no-unsafe-member-access */
|
|
386
|
+
tab.importance = __classPrivateFieldGet(this, _Tabbar_instances, "a", _Tabbar_computedImportance_get) ?? settings.importance;
|
|
387
|
+
tab.size = __classPrivateFieldGet(this, _Tabbar_instances, "a", _Tabbar_computedSize_get) ?? settings.size;
|
|
388
|
+
tab.indicatorPosition =
|
|
389
|
+
this.orientation === 'vertical'
|
|
390
|
+
? 'inline-end'
|
|
391
|
+
: (__classPrivateFieldGet(this, _Tabbar_instances, "a", _Tabbar_computedPlacement_get) ?? settings.indicatorPosition);
|
|
392
|
+
/* eslint-enable @typescript-eslint/no-unsafe-member-access */
|
|
393
|
+
}
|
|
338
394
|
};
|
|
339
395
|
Tabbar.style = tabbarCss;
|
|
340
396
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"qds-tabbar.entry.js","sources":["src/components/tabbar/tabbar.css?tag=qds-tabbar&encapsulation=shadow","src/components/tabbar/tabbar.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2024 Schneider Electric\n *\n * SPDX-License-Identifier: Apache-2.0\n */\n\n@import url('../shared.css');\n\n:host {\n display: block;\n}\n\n.qds-vertical,\n.qds-vertical-divider,\n.qds-tabbar,\n.qds-tabs {\n display: flex;\n}\n\n.qds-vertical-divider,\n.qds-tabbar {\n width: inherit;\n}\n\n.qds-arrow-start {\n transform: scaleX(var(--qds-direction-factor, 1)) rotate(180deg);\n}\n\n.qds-align-center {\n align-content: center;\n}\n\n.qds-hidden {\n display: none;\n}\n\n.qds-centered {\n justify-content: center;\n}\n\n.qds-tabs {\n flex: 1;\n margin-block: 0;\n overflow: auto;\n padding-inline-start: 0;\n scroll-behavior: smooth;\n}\n\n.qds-vertical {\n flex-direction: column;\n}\n\n.qds-vertical-divider {\n flex-direction: row;\n}\n\n[data-layer='main'] {\n &[data-level='root'] .qds-tabs {\n gap: var(--qds-control-large-gap-siblings-related);\n }\n\n &[data-level='section'] .qds-tabs {\n gap: var(--qds-control-standard-gap-siblings-related);\n }\n\n &[data-level='subsection'] .qds-tabs {\n gap: var(--qds-control-small-gap-siblings-related);\n }\n}\n\n[data-layer='popup'] {\n &[data-level='root'] .qds-tabs {\n gap: var(--qds-control-standard-gap-siblings-related);\n }\n\n &[data-level='section'] .qds-tabs {\n gap: var(--qds-control-small-gap-siblings-related);\n }\n}\n\n:is([data-layer='panel'], [data-layer='accessory'])[data-level='root']\n .qds-tabs {\n gap: var(--qds-control-small-gap-siblings-related);\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface, EventEmitter } from '@stencil/core'\nimport {\n Component,\n Element,\n Event,\n h,\n Listen,\n Prop,\n State,\n} from '@stencil/core'\n\nimport type { Attributes } from '../../helpers'\nimport {\n componentOnReady,\n HORIZONTAL_MOVE_KEYS,\n inheritAriaAttributes,\n invariant,\n resolvePanelElement,\n VERTICAL_MOVE_KEYS,\n} from '../../helpers'\nimport type { Tab } from '../tab/tab'\n\nexport type Layer = 'accessory' | 'main' | 'panel' | 'popup'\nexport type Level = 'root' | 'section' | 'subsection'\nexport type Orientation = 'horizontal' | 'vertical'\nexport type Alignment = 'centered' | 'left'\n\nconst TAB_SETTINGS: Record<\n string,\n Pick<Tab, 'importance' | 'indicatorPosition' | 'size'> | undefined\n> = {\n 'main-root': {\n importance: 'standard',\n size: 'large',\n indicatorPosition: 'block-end',\n },\n 'main-section': {\n importance: 'standard',\n size: 'standard',\n indicatorPosition: 'block-end',\n },\n 'popup-root': {\n importance: 'standard',\n size: 'standard',\n indicatorPosition: 'block-end',\n },\n 'main-subsection': {\n importance: 'subdued',\n size: 'small',\n indicatorPosition: 'block-start',\n },\n 'popup-section': {\n importance: 'subdued',\n size: 'small',\n indicatorPosition: 'inline-start',\n },\n 'panel-root': {\n importance: 'standard',\n size: 'small',\n indicatorPosition: 'block-start',\n },\n 'accessory-root': {\n importance: 'subdued',\n size: 'small',\n indicatorPosition: 'block-end',\n },\n}\n\nconst isEnabledTabItem = (item: unknown): item is HTMLQdsTabElement => {\n if (!(item instanceof HTMLElement)) return false\n const tagName = item.tagName.toLowerCase()\n\n return (\n (!item.inert && tagName === 'qds-tab') ||\n (item as HTMLQdsTabElement).disabled !== true\n )\n}\n\n/**\n * `<qds-tabbar>` is the component that facilitates navigation between the groups\n * of related content within the page.\n * It allows users to switch between groups by clicking on Tabs without going to another page.\n */\n@Component({\n tag: 'qds-tabbar',\n shadow: { delegatesFocus: true },\n styleUrl: 'tabbar.css',\n})\nexport class Tabbar implements ComponentInterface {\n /**\n * The tabbar's layer.\n */\n @Prop() public layer?: Layer = 'main'\n\n /**\n * The tabbar's level.\n */\n @Prop() public level?: Level = 'root'\n\n /**\n * The tabbar's orientation.\n */\n @Prop() public orientation?: Orientation = 'horizontal'\n\n /**\n * the tablist Description\n */\n @Prop() public readonly tablistDescription?: string\n\n /**\n * Displays a divider line.\n */\n @Prop() public showDivider?: boolean = false\n\n /**\n * The alignment of tabs. Only applicable for horizontal orientation.\n */\n @Prop() public readonly alignment?: Alignment = 'left'\n\n /**\n * Emitted when the user selects the tab.\n */\n @Event({ eventName: 'qdsTabShow', cancelable: false })\n private readonly showEmitter!: EventEmitter<HTMLElement>\n\n /**\n * Emitted when the user selects the tab.\n */\n @Event({ eventName: 'qdsTabHide', cancelable: false })\n private readonly hideEmitter!: EventEmitter<HTMLElement>\n\n @Element() private readonly host!: HTMLElement\n\n @State() private disableEndArrow = false\n\n @State() private disableStartArrow = false\n\n @State() private activeTab?: HTMLQdsTabElement\n\n #tabs: HTMLQdsTabElement[] = []\n\n #ro: ResizeObserver | undefined\n\n #tabbar?: HTMLElement\n\n #inheritedAttributes: Attributes = {}\n\n get #computeDividerVisible(): boolean {\n if (this.layer === 'panel') return false\n if (\n this.layer === 'main' &&\n this.level === 'subsection' &&\n this.orientation === 'horizontal'\n )\n return false\n return this.showDivider === true\n }\n\n @Listen('resize', { target: 'window' })\n protected windowResize(): void {\n this.#onViewportCrop()\n }\n\n public componentWillLoad(): void {\n this.#inheritedAttributes = inheritAriaAttributes(this.host)\n\n const tabs = [\n ...this.host.querySelectorAll('qds-tab'),\n ] as HTMLQdsTabElement[]\n const preselectedTab = tabs.find((tab) => tab.selected)\n if (preselectedTab) this.#setActiveTab(preselectedTab)\n else if (tabs.length > 0) this.#setActiveTab(tabs[0])\n }\n\n public componentDidRender(): void {\n if (this.activeTab) this.#switchTabPanel(this.activeTab)\n\n const settings = TAB_SETTINGS[`${this.layer}-${this.level}`]\n if (!settings) return\n\n for (const tab of this.host.querySelectorAll('qds-tab')) {\n /* eslint-disable @typescript-eslint/no-unsafe-member-access */\n tab.importance = settings.importance\n tab.size = settings.size\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n tab.indicatorPosition =\n this.orientation === 'vertical' ? 'inline-end' : tab.indicatorPosition\n /* eslint-enable @typescript-eslint/no-unsafe-member-access */\n }\n }\n\n public componentDidLoad(): void {\n invariant(this.#tabbar)\n\n this.#ro = new ResizeObserver(this.#onScroll)\n this.#ro.observe(this.#tabbar)\n }\n\n public disconnectedCallback(): void {\n if (this.#ro) this.#ro.disconnect()\n }\n\n public render() {\n return (\n <div\n class={{ 'qds-vertical-divider': this.orientation === 'vertical' }}\n data-layer={this.layer}\n data-level={this.level}\n >\n <div class=\"qds-tabbar\">\n <div\n class={{\n 'qds-align-center': true,\n 'qds-hidden':\n (this.disableEndArrow && this.disableStartArrow) ||\n this.orientation === 'vertical',\n }}\n >\n <qds-icon-button\n text=\"show previous tab\"\n importance=\"subdued\"\n iconName=\"next\"\n iconLibrary=\"core\"\n class=\"qds-arrow-start\"\n onClick={this.#scrollToStart}\n disabled={this.disableStartArrow}\n />\n </div>\n <ul\n class={{\n 'qds-tabs': true,\n 'qds-vertical': this.orientation === 'vertical',\n 'qds-centered':\n this.alignment === 'centered' &&\n this.orientation === 'horizontal' &&\n this.disableEndArrow &&\n this.disableStartArrow,\n }}\n role=\"tablist\"\n aria-label={this.tablistDescription}\n ref={(element) => {\n this.#tabbar = element\n }}\n onClick={this.#onClick}\n onKeyDown={this.#onKeyDown}\n onMouseDown={this.#onMouseDown}\n onScroll={this.#onScroll}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...this.#inheritedAttributes}\n >\n <slot onSlotchange={this.#onSlotchange} />\n </ul>\n <div\n class={{\n 'qds-align-center': true,\n 'qds-hidden':\n (this.disableEndArrow && this.disableStartArrow) ||\n this.orientation === 'vertical',\n }}\n >\n <qds-icon-button\n text=\"show next tab\"\n iconName=\"next\"\n iconLibrary=\"core\"\n importance=\"subdued\"\n onClick={this.#scrollToEnd}\n disabled={this.disableEndArrow}\n />\n </div>\n </div>\n {this.#computeDividerVisible && (\n <qds-divider vertical={this.orientation === 'vertical'} />\n )}\n </div>\n )\n }\n\n readonly #scrollToStart = (): void => {\n invariant(this.#tabbar)\n\n const isRTL = globalThis.getComputedStyle(this.host).direction === 'rtl'\n this.#tabbar.scroll({\n left: isRTL\n ? this.#tabbar.scrollLeft + this.#tabbar.clientWidth\n : this.#tabbar.scrollLeft - this.#tabbar.clientWidth,\n })\n }\n\n readonly #scrollToEnd = (): void => {\n invariant(this.#tabbar)\n\n const isRTL = globalThis.getComputedStyle(this.host).direction === 'rtl'\n this.#tabbar.scroll({\n left: isRTL\n ? this.#tabbar.scrollLeft - this.#tabbar.clientWidth\n : this.#tabbar.scrollLeft + this.#tabbar.clientWidth,\n })\n }\n\n #setActiveTab(tab: HTMLQdsTabElement): void {\n this.activeTab = tab\n\n for (const t of this.host.querySelectorAll('qds-tab')) {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-member-access\n const target = t.tab\n const isSelected = t === tab\n // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n t.selected = isSelected\n if (target instanceof globalThis.Element)\n target.ariaSelected = isSelected.toString()\n }\n }\n\n #switchTabPanel(activeTab: HTMLQdsTabElement): void {\n for (const tab of this.#tabs) {\n const panel = resolvePanelElement(tab)\n if (panel) {\n panel.hidden = tab !== activeTab\n }\n }\n }\n\n #handleTabActivation(tab: HTMLQdsTabElement): void {\n const previousTab = this.activeTab\n if (previousTab === tab) return\n\n this.activeTab = tab\n\n this.hideEmitter.emit(previousTab)\n\n this.showEmitter.emit(tab)\n this.#setCurrentTab(tab)\n this.#switchTabPanel(tab)\n }\n\n #getCurrentTab(): HTMLQdsTabElement | undefined {\n return this.#tabs.find((tab) => tab.tab.getAttribute('tabindex') === '0')\n }\n\n #setCurrentTab(tab: HTMLQdsTabElement): void {\n for (const t of this.#tabs) {\n const isCurrent = t === tab\n\n componentOnReady(t, (element: HTMLQdsTabElement | undefined) => {\n const target = element?.tab\n if (target === undefined) return\n const isDisabled = target.getAttribute('aria-disabled') === 'true'\n const shouldActivateTab = isCurrent && !isDisabled\n const tabindex = shouldActivateTab ? '0' : '-1'\n target.setAttribute('tabindex', tabindex)\n if (shouldActivateTab) this.#handleTabActivation(t)\n })\n }\n }\n\n readonly #onClick = (event: MouseEvent): void => {\n const { target } = event\n if (!(target instanceof HTMLElement)) return\n const tab = target.closest('qds-tab')\n if (!tab || tab.disabled === true || tab.inert) return\n\n this.#handleTabActivation(tab)\n this.#setActiveTab(tab)\n }\n\n readonly #onKeyDown = (event: KeyboardEvent): void => {\n const isVertical = this.orientation === 'vertical'\n const MOVE_SELECTION_KEYS = isVertical\n ? VERTICAL_MOVE_KEYS\n : HORIZONTAL_MOVE_KEYS\n if (!MOVE_SELECTION_KEYS.has(event.key)) return\n\n const tabs = this.#tabs\n if (tabs.length === 0) return\n\n event.preventDefault()\n event.stopPropagation()\n\n const activeTab = this.#getCurrentTab()\n let index = activeTab ? tabs.indexOf(activeTab) : 0\n\n const isRTL = globalThis.getComputedStyle(this.host).direction === 'rtl'\n\n let nextTab: HTMLQdsTabElement | undefined\n do {\n switch (event.key) {\n case 'ArrowLeft':\n case 'ArrowUp': {\n index = (isRTL ? index < tabs.length - 1 : index > 0)\n ? index - (isRTL ? -1 : 1)\n : isRTL\n ? 0\n : tabs.length - 1\n break\n }\n case 'ArrowRight':\n case 'ArrowDown': {\n index = (isRTL ? index > 0 : index < tabs.length - 1)\n ? index + (isRTL ? -1 : 1)\n : isRTL\n ? tabs.length - 1\n : 0\n break\n }\n case 'Home': {\n index = isRTL ? tabs.length - 1 : 0\n break\n }\n case 'End': {\n index = isRTL ? 0 : tabs.length - 1\n break\n }\n default:\n }\n nextTab = tabs[index]\n } while (nextTab.disabled === true)\n\n this.#setCurrentTab(nextTab)\n\n const target = nextTab.tab\n target.focus({ preventScroll: true })\n if (!isVertical) target.scrollIntoView()\n this.#handleTabActivation(nextTab)\n this.#setActiveTab(nextTab)\n }\n\n readonly #onMouseDown = (event: MouseEvent): void => {\n const { target } = event\n\n if (isEnabledTabItem(target)) this.#setCurrentTab(target)\n }\n\n readonly #onScroll = (): void => {\n if (!this.#tabbar) return\n\n const { clientWidth, scrollWidth, scrollLeft } = this.#tabbar\n\n const isRTL = globalThis.getComputedStyle(this.host).direction === 'rtl'\n this.disableStartArrow = scrollLeft === 0\n this.disableEndArrow = isRTL\n ? scrollWidth + scrollLeft <= clientWidth\n : scrollWidth - clientWidth - scrollLeft <= 1\n }\n\n readonly #onViewportCrop = (): void => {\n if (!this.#tabbar) return\n\n const { scrollWidth, clientWidth } = this.#tabbar\n\n if (scrollWidth > clientWidth) {\n this.#onScroll()\n }\n }\n\n #updateTabsCache(): void {\n const slot = this.host.shadowRoot?.querySelector('slot')\n this.#tabs = slot\n ? [...slot.assignedElements({ flatten: true })].filter<HTMLQdsTabElement>(\n (element) => isEnabledTabItem(element),\n )\n : []\n }\n\n readonly #onSlotchange = (): void => {\n this.#updateTabsCache()\n\n if (this.#tabs.length > 0) this.#setCurrentTab(this.#tabs[0])\n }\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"qds-tabbar.entry.js","sources":["src/components/tabbar/tabbar.css?tag=qds-tabbar&encapsulation=shadow","src/components/tabbar/tabbar.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2024 Schneider Electric\n *\n * SPDX-License-Identifier: Apache-2.0\n */\n\n@import url('../shared.css');\n\n:host {\n display: block;\n}\n\n.qds-vertical,\n.qds-vertical-divider,\n.qds-tabbar,\n.qds-tabs {\n display: flex;\n}\n\n.qds-vertical-divider,\n.qds-tabbar {\n width: inherit;\n}\n\n.qds-arrow-start {\n transform: scaleX(var(--qds-direction-factor, 1)) rotate(180deg);\n}\n\n.qds-align-center {\n align-content: center;\n}\n\n.qds-hidden {\n display: none;\n}\n\n.qds-centered {\n justify-content: center;\n}\n\n.qds-tabs {\n flex: 1;\n margin-block: 0;\n overflow: auto;\n padding-inline-start: 0;\n scroll-behavior: smooth;\n}\n\n.qds-vertical {\n flex-direction: column;\n}\n\n.qds-vertical-divider {\n flex-direction: row;\n}\n\n[data-size='small'] {\n gap: var(--qds-control-small-gap-siblings-related);\n}\n\n[data-size='standard'] {\n gap: var(--qds-control-standard-gap-siblings-related);\n}\n\n[data-size='large'] {\n gap: var(--qds-control-large-gap-siblings-related);\n}\n\n[data-layer='main'] {\n &[data-level='root'] .qds-tabs {\n gap: var(--qds-control-large-gap-siblings-related);\n }\n\n &[data-level='section'] .qds-tabs {\n gap: var(--qds-control-standard-gap-siblings-related);\n }\n\n &[data-level='subsection'] .qds-tabs {\n gap: var(--qds-control-small-gap-siblings-related);\n }\n}\n\n[data-layer='popup'] {\n &[data-level='root'] .qds-tabs {\n gap: var(--qds-control-standard-gap-siblings-related);\n }\n\n &[data-level='section'] .qds-tabs {\n gap: var(--qds-control-small-gap-siblings-related);\n }\n}\n\n:is([data-layer='panel'], [data-layer='accessory'])[data-level='root']\n .qds-tabs {\n gap: var(--qds-control-small-gap-siblings-related);\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface, EventEmitter } from '@stencil/core'\nimport {\n Component,\n Element,\n Event,\n h,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core'\n\nimport type { Attributes } from '../../helpers'\nimport {\n componentOnReady,\n HORIZONTAL_MOVE_KEYS,\n inheritAriaAttributes,\n invariant,\n resolvePanelElement,\n VERTICAL_MOVE_KEYS,\n} from '../../helpers'\nimport type { IndicatorPosition } from '../icon-tab/icon-tab'\nimport type { Importance, Size } from '../shared'\nimport type { Tab } from '../tab/tab'\n\nexport type Layer = 'accessory' | 'main' | 'panel' | 'popup'\nexport type Level = 'root' | 'section' | 'subsection'\nexport type TabbarSize = Size | undefined\nexport type TabbarImportance = Exclude<Importance, 'emphasized'> | undefined\nexport type Orientation = 'horizontal' | 'vertical'\nexport type Placement = 'bottom' | 'end' | 'start' | 'top'\nexport type Alignment = 'center' | 'start'\n\nconst TAB_SETTINGS: Record<\n string,\n Pick<Tab, 'importance' | 'indicatorPosition' | 'size'> | undefined\n> = {\n 'main-root': {\n importance: 'standard',\n size: 'large',\n indicatorPosition: 'block-end',\n },\n 'main-section': {\n importance: 'standard',\n size: 'standard',\n indicatorPosition: 'block-end',\n },\n 'popup-root': {\n importance: 'standard',\n size: 'standard',\n indicatorPosition: 'block-end',\n },\n 'main-subsection': {\n importance: 'subdued',\n size: 'small',\n indicatorPosition: 'block-start',\n },\n 'popup-section': {\n importance: 'subdued',\n size: 'small',\n indicatorPosition: 'inline-start',\n },\n 'panel-root': {\n importance: 'standard',\n size: 'small',\n indicatorPosition: 'block-start',\n },\n 'accessory-root': {\n importance: 'subdued',\n size: 'small',\n indicatorPosition: 'block-end',\n },\n}\n\nconst isEnabledTabItem = (item: unknown): item is HTMLQdsTabElement => {\n if (!(item instanceof HTMLElement)) return false\n const tagName = item.tagName.toLowerCase()\n\n return (\n (!item.inert && tagName === 'qds-tab') ||\n (item as HTMLQdsTabElement).disabled !== true\n )\n}\n\n/**\n * `<qds-tabbar>` is the component that facilitates navigation between the groups\n * of related content within the page.\n * It allows users to switch between groups by clicking on Tabs without going to another page.\n */\n@Component({\n tag: 'qds-tabbar',\n shadow: { delegatesFocus: true },\n styleUrl: 'tabbar.css',\n})\nexport class Tabbar implements ComponentInterface {\n /**\n * The tabbar's layer.\n *\n * @deprecated The property layer is deprecated. Please use `size` property instead.\n * Please do not use `layer` and `size` at the same time.\n */\n @Prop() public layer?: Layer = 'main'\n\n /**\n * The tabbar's level.\n *\n * @deprecated The property level is deprecated. Please use `size` property instead.\n * Please do not use `level` and `size` at the same time.\n */\n @Prop() public level?: Level = 'root'\n\n /**\n * The tabbar's size. This controls the size of the tabs within the tabbar.\n */\n @Prop() public size?: Size = 'standard'\n\n /**\n * The tabbar's orientation.\n *\n * @deprecated Please use the `placement` property instead. Do not use\n * `orientation` and `placement` at the same time.\n */\n @Prop() public orientation?: Orientation = 'horizontal'\n\n /**\n * The tabbar's placement.\n */\n @Prop() public placement?: Placement = 'top'\n\n /**\n * the tablist Description\n */\n @Prop() public readonly tablistDescription?: string\n\n /**\n * Displays a divider line.\n */\n @Prop() public showDivider?: boolean = false\n\n /**\n * The alignment of tabs. Only applicable for horizontal orientation.\n */\n @Prop() public readonly alignment?: Alignment = 'start'\n\n /**\n * The importance of the tabbar. This controls the visual emphasis of the tabs within the tabbar.\n */\n @Prop() public importance?: TabbarImportance\n\n /**\n * Emitted when the user selects the tab.\n */\n @Event({ eventName: 'qdsTabShow', cancelable: false })\n private readonly showEmitter!: EventEmitter<HTMLElement>\n\n /**\n * Emitted when the user selects the tab.\n */\n @Event({ eventName: 'qdsTabHide', cancelable: false })\n private readonly hideEmitter!: EventEmitter<HTMLElement>\n\n @Element() private readonly host!: HTMLElement\n\n @State() private disableEndArrow = false\n\n @State() private disableStartArrow = false\n\n @State() private activeTab?: HTMLQdsTabElement\n\n #tabs: HTMLQdsTabElement[] = []\n\n #ro: ResizeObserver | undefined\n\n #tabbar?: HTMLElement\n\n #inheritedAttributes: Attributes = {}\n\n get #computedImportance(): TabbarImportance {\n return this.importance\n }\n\n get #computedSize(): Size | undefined {\n return this.size ?? undefined\n }\n\n get #computedPlacement(): IndicatorPosition | undefined {\n switch (this.placement) {\n case 'top': {\n return 'block-end'\n }\n case 'end': {\n return 'inline-start'\n }\n case 'bottom': {\n return 'block-start'\n }\n case 'start': {\n return 'inline-end'\n }\n default: {\n return undefined\n }\n }\n }\n\n get #computeDividerVisible(): boolean {\n if (this.layer === 'panel') return false\n if (\n this.layer === 'main' &&\n this.level === 'subsection' &&\n (this.orientation === 'horizontal' || this.#isVerticalPlacement())\n )\n return false\n return this.showDivider === true\n }\n\n @Watch('importance')\n protected settingChanged(): void {\n this.#setTabSettings()\n }\n\n @Listen('resize', { target: 'window' })\n protected windowResize(): void {\n this.#onViewportCrop()\n }\n\n public componentWillLoad(): void {\n this.settingChanged()\n this.#inheritedAttributes = inheritAriaAttributes(this.host)\n const tabs = [\n ...this.host.querySelectorAll('qds-tab'),\n ] as HTMLQdsTabElement[]\n const preselectedTab = tabs.find((tab) => tab.selected)\n if (preselectedTab) this.#setActiveTab(preselectedTab)\n else if (tabs.length > 0) this.#setActiveTab(tabs[0])\n }\n\n public componentDidRender(): void {\n if (this.activeTab) this.#switchTabPanel(this.activeTab)\n this.settingChanged()\n }\n\n public componentDidLoad(): void {\n invariant(this.#tabbar)\n\n this.#ro = new ResizeObserver(this.#onScroll)\n this.#ro.observe(this.#tabbar)\n }\n\n public disconnectedCallback(): void {\n if (this.#ro) this.#ro.disconnect()\n }\n\n public render() {\n return (\n <div\n class={{\n 'qds-vertical-divider':\n this.orientation === 'vertical' || this.#isVerticalPlacement(),\n }}\n data-layer={this.layer}\n data-level={this.level}\n data-importance={this.#computedImportance}\n >\n <div class=\"qds-tabbar\">\n <div\n class={{\n 'qds-align-center': true,\n 'qds-hidden':\n (this.disableEndArrow && this.disableStartArrow) ||\n this.orientation === 'vertical' ||\n this.#isVerticalPlacement(),\n }}\n >\n <qds-icon-button\n text=\"show previous tab\"\n importance=\"subdued\"\n iconName=\"next\"\n iconLibrary=\"core\"\n class=\"qds-arrow-start\"\n onClick={this.#scrollToStart}\n disabled={this.disableStartArrow}\n />\n </div>\n <ul\n class={{\n 'qds-tabs': true,\n 'qds-vertical':\n this.orientation === 'vertical' || this.#isVerticalPlacement(),\n 'qds-centered':\n this.alignment === 'center' &&\n (this.orientation === 'horizontal' ||\n this.#isHorizontalPlacement()) &&\n this.disableEndArrow &&\n this.disableStartArrow,\n }}\n role=\"tablist\"\n aria-label={this.tablistDescription}\n ref={(element) => {\n this.#tabbar = element\n }}\n onClick={this.#onClick}\n onKeyDown={this.#onKeyDown}\n onMouseDown={this.#onMouseDown}\n onScroll={this.#onScroll}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...this.#inheritedAttributes}\n >\n <slot onSlotchange={this.#onSlotchange} />\n </ul>\n <div\n class={{\n 'qds-align-center': true,\n 'qds-hidden':\n (this.disableEndArrow && this.disableStartArrow) ||\n this.orientation === 'vertical' ||\n this.#isVerticalPlacement(),\n }}\n >\n <qds-icon-button\n text=\"show next tab\"\n iconName=\"next\"\n iconLibrary=\"core\"\n importance=\"subdued\"\n onClick={this.#scrollToEnd}\n disabled={this.disableEndArrow}\n />\n </div>\n </div>\n {this.#computeDividerVisible && (\n <qds-divider\n vertical={\n this.orientation === 'vertical' || this.#isVerticalPlacement()\n }\n />\n )}\n </div>\n )\n }\n\n readonly #scrollToStart = (): void => {\n invariant(this.#tabbar)\n\n const isRTL = globalThis.getComputedStyle(this.host).direction === 'rtl'\n this.#tabbar.scroll({\n left: isRTL\n ? this.#tabbar.scrollLeft + this.#tabbar.clientWidth\n : this.#tabbar.scrollLeft - this.#tabbar.clientWidth,\n })\n }\n\n readonly #scrollToEnd = (): void => {\n invariant(this.#tabbar)\n\n const isRTL = globalThis.getComputedStyle(this.host).direction === 'rtl'\n this.#tabbar.scroll({\n left: isRTL\n ? this.#tabbar.scrollLeft - this.#tabbar.clientWidth\n : this.#tabbar.scrollLeft + this.#tabbar.clientWidth,\n })\n }\n\n #setActiveTab(tab: HTMLQdsTabElement): void {\n this.activeTab = tab\n\n for (const t of this.host.querySelectorAll('qds-tab')) {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-member-access\n const target = t.tab\n const isSelected = t === tab\n // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n t.selected = isSelected\n if (target instanceof globalThis.Element)\n target.ariaSelected = isSelected.toString()\n }\n }\n\n #switchTabPanel(activeTab: HTMLQdsTabElement): void {\n for (const tab of this.#tabs) {\n const panel = resolvePanelElement(tab)\n if (panel) {\n panel.hidden = tab !== activeTab\n }\n }\n }\n\n #handleTabActivation(tab: HTMLQdsTabElement): void {\n const previousTab = this.activeTab\n if (previousTab === tab) return\n\n this.activeTab = tab\n\n this.hideEmitter.emit(previousTab)\n\n this.showEmitter.emit(tab)\n this.#setCurrentTab(tab)\n this.#switchTabPanel(tab)\n }\n\n #getCurrentTab(): HTMLQdsTabElement | undefined {\n return this.#tabs.find((tab) => tab.tab.getAttribute('tabindex') === '0')\n }\n\n #setCurrentTab(tab: HTMLQdsTabElement): void {\n for (const t of this.#tabs) {\n const isCurrent = t === tab\n\n componentOnReady(t, (element: HTMLQdsTabElement | undefined) => {\n const target = element?.tab\n if (target === undefined) return\n const isDisabled = target.getAttribute('aria-disabled') === 'true'\n const shouldActivateTab = isCurrent && !isDisabled\n const tabindex = shouldActivateTab ? '0' : '-1'\n target.setAttribute('tabindex', tabindex)\n if (shouldActivateTab) this.#handleTabActivation(t)\n })\n }\n }\n\n readonly #isVerticalPlacement = (): boolean =>\n this.placement === 'start' || this.placement === 'end'\n\n readonly #isHorizontalPlacement = (): boolean =>\n this.placement === 'top' || this.placement === 'bottom'\n\n readonly #onClick = (event: MouseEvent): void => {\n const { target } = event\n if (!(target instanceof HTMLElement)) return\n const tab = target.closest('qds-tab')\n if (!tab || tab.disabled === true || tab.inert) return\n\n this.#handleTabActivation(tab)\n this.#setActiveTab(tab)\n }\n\n readonly #onKeyDown = (event: KeyboardEvent): void => {\n const isVertical =\n this.orientation === 'vertical' || this.#isVerticalPlacement()\n const MOVE_SELECTION_KEYS = isVertical\n ? VERTICAL_MOVE_KEYS\n : HORIZONTAL_MOVE_KEYS\n if (!MOVE_SELECTION_KEYS.has(event.key)) return\n\n const tabs = this.#tabs\n if (tabs.length === 0) return\n\n event.preventDefault()\n event.stopPropagation()\n\n const activeTab = this.#getCurrentTab()\n let index = activeTab ? tabs.indexOf(activeTab) : 0\n\n const isRTL = globalThis.getComputedStyle(this.host).direction === 'rtl'\n\n let nextTab: HTMLQdsTabElement | undefined\n do {\n switch (event.key) {\n case 'ArrowLeft':\n case 'ArrowUp': {\n index = (isRTL ? index < tabs.length - 1 : index > 0)\n ? index - (isRTL ? -1 : 1)\n : isRTL\n ? 0\n : tabs.length - 1\n break\n }\n case 'ArrowRight':\n case 'ArrowDown': {\n index = (isRTL ? index > 0 : index < tabs.length - 1)\n ? index + (isRTL ? -1 : 1)\n : isRTL\n ? tabs.length - 1\n : 0\n break\n }\n case 'Home': {\n index = isRTL ? tabs.length - 1 : 0\n break\n }\n case 'End': {\n index = isRTL ? 0 : tabs.length - 1\n break\n }\n default:\n }\n nextTab = tabs[index]\n } while (nextTab.disabled === true)\n\n this.#setCurrentTab(nextTab)\n\n const target = nextTab.tab\n target.focus({ preventScroll: true })\n if (!isVertical) target.scrollIntoView()\n this.#handleTabActivation(nextTab)\n this.#setActiveTab(nextTab)\n }\n\n readonly #onMouseDown = (event: MouseEvent): void => {\n const { target } = event\n\n if (isEnabledTabItem(target)) this.#setCurrentTab(target)\n }\n\n readonly #onScroll = (): void => {\n if (!this.#tabbar) return\n\n const { clientWidth, scrollWidth, scrollLeft } = this.#tabbar\n\n const isRTL = globalThis.getComputedStyle(this.host).direction === 'rtl'\n this.disableStartArrow = scrollLeft === 0\n this.disableEndArrow = isRTL\n ? scrollWidth + scrollLeft <= clientWidth\n : scrollWidth - clientWidth - scrollLeft <= 1\n }\n\n readonly #onViewportCrop = (): void => {\n if (!this.#tabbar) return\n\n const { scrollWidth, clientWidth } = this.#tabbar\n\n if (scrollWidth > clientWidth) {\n this.#onScroll()\n }\n }\n\n #updateTabsCache(): void {\n const slot = this.host.shadowRoot?.querySelector('slot')\n this.#tabs = slot\n ? [...slot.assignedElements({ flatten: true })].filter<HTMLQdsTabElement>(\n (element) => isEnabledTabItem(element),\n )\n : []\n }\n\n #setTabSettings(): void {\n const settings = TAB_SETTINGS[`${this.layer}-${this.level}`]\n if (!settings) return\n\n for (const tab of this.host.querySelectorAll('qds-tab')) {\n /* eslint-disable @typescript-eslint/no-unsafe-member-access */\n tab.importance = this.#computedImportance ?? settings.importance\n tab.size = this.#computedSize ?? settings.size\n\n tab.indicatorPosition =\n this.orientation === 'vertical'\n ? 'inline-end'\n : (this.#computedPlacement ?? settings.indicatorPosition)\n /* eslint-enable @typescript-eslint/no-unsafe-member-access */\n }\n }\n\n readonly #onSlotchange = (): void => {\n this.#updateTabsCache()\n\n if (this.#tabs.length > 0) this.#setCurrentTab(this.#tabs[0])\n }\n}\n"],"names":[],"mappings":";;;;;;;;AAAA,MAAM,SAAS,GAAG,6xCAA6xC;;ACA/yC;AACA;AACA;;;;;;;;;;;;;;;;;;AAmCA,MAAM,YAAY,GAGd;AACF,IAAA,WAAW,EAAE;AACX,QAAA,UAAU,EAAE,UAAU;AACtB,QAAA,IAAI,EAAE,OAAO;AACb,QAAA,iBAAiB,EAAE,WAAW;AAC/B,KAAA;AACD,IAAA,cAAc,EAAE;AACd,QAAA,UAAU,EAAE,UAAU;AACtB,QAAA,IAAI,EAAE,UAAU;AAChB,QAAA,iBAAiB,EAAE,WAAW;AAC/B,KAAA;AACD,IAAA,YAAY,EAAE;AACZ,QAAA,UAAU,EAAE,UAAU;AACtB,QAAA,IAAI,EAAE,UAAU;AAChB,QAAA,iBAAiB,EAAE,WAAW;AAC/B,KAAA;AACD,IAAA,iBAAiB,EAAE;AACjB,QAAA,UAAU,EAAE,SAAS;AACrB,QAAA,IAAI,EAAE,OAAO;AACb,QAAA,iBAAiB,EAAE,aAAa;AACjC,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,UAAU,EAAE,SAAS;AACrB,QAAA,IAAI,EAAE,OAAO;AACb,QAAA,iBAAiB,EAAE,cAAc;AAClC,KAAA;AACD,IAAA,YAAY,EAAE;AACZ,QAAA,UAAU,EAAE,UAAU;AACtB,QAAA,IAAI,EAAE,OAAO;AACb,QAAA,iBAAiB,EAAE,aAAa;AACjC,KAAA;AACD,IAAA,gBAAgB,EAAE;AAChB,QAAA,UAAU,EAAE,SAAS;AACrB,QAAA,IAAI,EAAE,OAAO;AACb,QAAA,iBAAiB,EAAE,WAAW;AAC/B,KAAA;CACF;AAED,MAAM,gBAAgB,GAAG,CAAC,IAAa,KAA+B;AACpE,IAAA,IAAI,EAAE,IAAI,YAAY,WAAW,CAAC;AAAE,QAAA,OAAO,KAAK;IAChD,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE;IAE1C,QACE,CAAC,CAAC,IAAI,CAAC,KAAK,IAAI,OAAO,KAAK,SAAS;AACpC,QAAA,IAA0B,CAAC,QAAQ,KAAK,IAAI;AAEjD,CAAC;MAYY,MAAM,GAAA,MAAA;AALnB,IAAA,WAAA,CAAA,OAAA,EAAA;;;;;AAME;;;;;AAKG;AACY,QAAA,IAAK,CAAA,KAAA,GAAW,MAAM;AAErC;;;;;AAKG;AACY,QAAA,IAAK,CAAA,KAAA,GAAW,MAAM;AAErC;;AAEG;AACY,QAAA,IAAI,CAAA,IAAA,GAAU,UAAU;AAEvC;;;;;AAKG;AACY,QAAA,IAAW,CAAA,WAAA,GAAiB,YAAY;AAEvD;;AAEG;AACY,QAAA,IAAS,CAAA,SAAA,GAAe,KAAK;AAO5C;;AAEG;AACY,QAAA,IAAW,CAAA,WAAA,GAAa,KAAK;AAE5C;;AAEG;AACqB,QAAA,IAAS,CAAA,SAAA,GAAe,OAAO;AAqBtC,QAAA,IAAe,CAAA,eAAA,GAAG,KAAK;AAEvB,QAAA,IAAiB,CAAA,iBAAA,GAAG,KAAK;AAI1C,QAAA,YAAA,CAAA,GAAA,CAAA,IAAA,EAA6B,EAAE,CAAA;QAE/B,UAA+B,CAAA,GAAA,CAAA,IAAA,EAAA,MAAA,CAAA;QAE/B,cAAqB,CAAA,GAAA,CAAA,IAAA,EAAA,MAAA,CAAA;AAErB,QAAA,2BAAA,CAAA,GAAA,CAAA,IAAA,EAAmC,EAAE,CAAA;AAqK5B,QAAA,qBAAA,CAAA,GAAA,CAAA,IAAA,EAAiB,MAAW;YACnC,SAAS,CAAC,sBAAA,CAAA,IAAI,EAAA,cAAA,EAAA,GAAA,CAAQ,CAAC;AAEvB,YAAA,MAAM,KAAK,GAAG,UAAU,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,SAAS,KAAK,KAAK;YACxE,sBAAA,CAAA,IAAI,EAAA,cAAA,EAAA,GAAA,CAAQ,CAAC,MAAM,CAAC;AAClB,gBAAA,IAAI,EAAE;sBACF,sBAAA,CAAA,IAAI,EAAQ,cAAA,EAAA,GAAA,CAAA,CAAC,UAAU,GAAG,sBAAA,CAAA,IAAI,EAAQ,cAAA,EAAA,GAAA,CAAA,CAAC;sBACvC,sBAAA,CAAA,IAAI,EAAQ,cAAA,EAAA,GAAA,CAAA,CAAC,UAAU,GAAG,sBAAA,CAAA,IAAI,EAAQ,cAAA,EAAA,GAAA,CAAA,CAAC,WAAW;AACvD,aAAA,CAAC;AACJ,SAAC,CAAA;AAEQ,QAAA,mBAAA,CAAA,GAAA,CAAA,IAAA,EAAe,MAAW;YACjC,SAAS,CAAC,sBAAA,CAAA,IAAI,EAAA,cAAA,EAAA,GAAA,CAAQ,CAAC;AAEvB,YAAA,MAAM,KAAK,GAAG,UAAU,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,SAAS,KAAK,KAAK;YACxE,sBAAA,CAAA,IAAI,EAAA,cAAA,EAAA,GAAA,CAAQ,CAAC,MAAM,CAAC;AAClB,gBAAA,IAAI,EAAE;sBACF,sBAAA,CAAA,IAAI,EAAQ,cAAA,EAAA,GAAA,CAAA,CAAC,UAAU,GAAG,sBAAA,CAAA,IAAI,EAAQ,cAAA,EAAA,GAAA,CAAA,CAAC;sBACvC,sBAAA,CAAA,IAAI,EAAQ,cAAA,EAAA,GAAA,CAAA,CAAC,UAAU,GAAG,sBAAA,CAAA,IAAI,EAAQ,cAAA,EAAA,GAAA,CAAA,CAAC,WAAW;AACvD,aAAA,CAAC;AACJ,SAAC,CAAA;QA0DQ,2BAAA,CAAA,GAAA,CAAA,IAAA,EAAuB,MAC9B,IAAI,CAAC,SAAS,KAAK,OAAO,IAAI,IAAI,CAAC,SAAS,KAAK,KAAK,CAAA;QAE/C,6BAAA,CAAA,GAAA,CAAA,IAAA,EAAyB,MAChC,IAAI,CAAC,SAAS,KAAK,KAAK,IAAI,IAAI,CAAC,SAAS,KAAK,QAAQ,CAAA;QAEhD,eAAW,CAAA,GAAA,CAAA,IAAA,EAAA,CAAC,KAAiB,KAAU;AAC9C,YAAA,MAAM,EAAE,MAAM,EAAE,GAAG,KAAK;AACxB,YAAA,IAAI,EAAE,MAAM,YAAY,WAAW,CAAC;gBAAE;YACtC,MAAM,GAAG,GAAG,MAAM,CAAC,OAAO,CAAC,SAAS,CAAC;YACrC,IAAI,CAAC,GAAG,IAAI,GAAG,CAAC,QAAQ,KAAK,IAAI,IAAI,GAAG,CAAC,KAAK;gBAAE;AAEhD,YAAA,sBAAA,CAAA,IAAI,EAAqB,iBAAA,EAAA,GAAA,EAAA,2BAAA,CAAA,CAAA,IAAA,CAAzB,IAAI,EAAsB,GAAG,CAAC;AAC9B,YAAA,sBAAA,CAAA,IAAI,EAAc,iBAAA,EAAA,GAAA,EAAA,oBAAA,CAAA,CAAA,IAAA,CAAlB,IAAI,EAAe,GAAG,CAAC;AACzB,SAAC,CAAA;QAEQ,iBAAa,CAAA,GAAA,CAAA,IAAA,EAAA,CAAC,KAAoB,KAAU;YACnD,MAAM,UAAU,GACd,IAAI,CAAC,WAAW,KAAK,UAAU,IAAI,sBAAA,CAAA,IAAI,EAAA,2BAAA,EAAA,GAAA,CAAqB,CAAzB,IAAA,CAAA,IAAI,CAAuB;YAChE,MAAM,mBAAmB,GAAG;AAC1B,kBAAE;kBACA,oBAAoB;YACxB,IAAI,CAAC,mBAAmB,CAAC,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC;gBAAE;YAEzC,MAAM,IAAI,GAAG,sBAAA,CAAA,IAAI,oBAAM;AACvB,YAAA,IAAI,IAAI,CAAC,MAAM,KAAK,CAAC;gBAAE;YAEvB,KAAK,CAAC,cAAc,EAAE;YACtB,KAAK,CAAC,eAAe,EAAE;AAEvB,YAAA,MAAM,SAAS,GAAG,sBAAA,CAAA,IAAI,gDAAe,CAAnB,IAAA,CAAA,IAAI,CAAiB;AACvC,YAAA,IAAI,KAAK,GAAG,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC;AAEnD,YAAA,MAAM,KAAK,GAAG,UAAU,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,SAAS,KAAK,KAAK;AAExE,YAAA,IAAI,OAAsC;AAC1C,YAAA,GAAG;AACD,gBAAA,QAAQ,KAAK,CAAC,GAAG;AACf,oBAAA,KAAK,WAAW;oBAChB,KAAK,SAAS,EAAE;AACd,wBAAA,KAAK,GAAG,CAAC,KAAK,GAAG,KAAK,GAAG,IAAI,CAAC,MAAM,GAAG,CAAC,GAAG,KAAK,GAAG,CAAC;AAClD,8BAAE,KAAK,IAAI,KAAK,GAAG,EAAE,GAAG,CAAC;AACzB,8BAAE;AACA,kCAAE;AACF,kCAAE,IAAI,CAAC,MAAM,GAAG,CAAC;wBACrB;;AAEF,oBAAA,KAAK,YAAY;oBACjB,KAAK,WAAW,EAAE;AAChB,wBAAA,KAAK,GAAG,CAAC,KAAK,GAAG,KAAK,GAAG,CAAC,GAAG,KAAK,GAAG,IAAI,CAAC,MAAM,GAAG,CAAC;AAClD,8BAAE,KAAK,IAAI,KAAK,GAAG,EAAE,GAAG,CAAC;AACzB,8BAAE;AACA,kCAAE,IAAI,CAAC,MAAM,GAAG;kCACd,CAAC;wBACP;;oBAEF,KAAK,MAAM,EAAE;AACX,wBAAA,KAAK,GAAG,KAAK,GAAG,IAAI,CAAC,MAAM,GAAG,CAAC,GAAG,CAAC;wBACnC;;oBAEF,KAAK,KAAK,EAAE;AACV,wBAAA,KAAK,GAAG,KAAK,GAAG,CAAC,GAAG,IAAI,CAAC,MAAM,GAAG,CAAC;wBACnC;;;AAIJ,gBAAA,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC;AACvB,aAAC,QAAQ,OAAO,CAAC,QAAQ,KAAK,IAAI;AAElC,YAAA,sBAAA,CAAA,IAAI,EAAe,iBAAA,EAAA,GAAA,EAAA,qBAAA,CAAA,CAAA,IAAA,CAAnB,IAAI,EAAgB,OAAO,CAAC;AAE5B,YAAA,MAAM,MAAM,GAAG,OAAO,CAAC,GAAG;YAC1B,MAAM,CAAC,KAAK,CAAC,EAAE,aAAa,EAAE,IAAI,EAAE,CAAC;AACrC,YAAA,IAAI,CAAC,UAAU;gBAAE,MAAM,CAAC,cAAc,EAAE;AACxC,YAAA,sBAAA,CAAA,IAAI,EAAqB,iBAAA,EAAA,GAAA,EAAA,2BAAA,CAAA,CAAA,IAAA,CAAzB,IAAI,EAAsB,OAAO,CAAC;AAClC,YAAA,sBAAA,CAAA,IAAI,EAAc,iBAAA,EAAA,GAAA,EAAA,oBAAA,CAAA,CAAA,IAAA,CAAlB,IAAI,EAAe,OAAO,CAAC;AAC7B,SAAC,CAAA;QAEQ,mBAAe,CAAA,GAAA,CAAA,IAAA,EAAA,CAAC,KAAiB,KAAU;AAClD,YAAA,MAAM,EAAE,MAAM,EAAE,GAAG,KAAK;YAExB,IAAI,gBAAgB,CAAC,MAAM,CAAC;AAAE,gBAAA,sBAAA,CAAA,IAAI,EAAe,iBAAA,EAAA,GAAA,EAAA,qBAAA,CAAA,CAAA,IAAA,CAAnB,IAAI,EAAgB,MAAM,CAAC;AAC3D,SAAC,CAAA;AAEQ,QAAA,gBAAA,CAAA,GAAA,CAAA,IAAA,EAAY,MAAW;YAC9B,IAAI,CAAC,sBAAA,CAAA,IAAI,EAAQ,cAAA,EAAA,GAAA,CAAA;gBAAE;AAEnB,YAAA,MAAM,EAAE,WAAW,EAAE,WAAW,EAAE,UAAU,EAAE,GAAG,sBAAA,CAAA,IAAI,EAAA,cAAA,EAAA,GAAA,CAAQ;AAE7D,YAAA,MAAM,KAAK,GAAG,UAAU,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,SAAS,KAAK,KAAK;AACxE,YAAA,IAAI,CAAC,iBAAiB,GAAG,UAAU,KAAK,CAAC;YACzC,IAAI,CAAC,eAAe,GAAG;AACrB,kBAAE,WAAW,GAAG,UAAU,IAAI;kBAC5B,WAAW,GAAG,WAAW,GAAG,UAAU,IAAI,CAAC;AACjD,SAAC,CAAA;AAEQ,QAAA,sBAAA,CAAA,GAAA,CAAA,IAAA,EAAkB,MAAW;YACpC,IAAI,CAAC,sBAAA,CAAA,IAAI,EAAQ,cAAA,EAAA,GAAA,CAAA;gBAAE;AAEnB,YAAA,MAAM,EAAE,WAAW,EAAE,WAAW,EAAE,GAAG,sBAAA,CAAA,IAAI,EAAA,cAAA,EAAA,GAAA,CAAQ;AAEjD,YAAA,IAAI,WAAW,GAAG,WAAW,EAAE;AAC7B,gBAAA,sBAAA,CAAA,IAAI,EAAA,gBAAA,EAAA,GAAA,CAAU,CAAd,IAAA,CAAA,IAAI,CAAY;;AAEpB,SAAC,CAAA;AA4BQ,QAAA,oBAAA,CAAA,GAAA,CAAA,IAAA,EAAgB,MAAW;AAClC,YAAA,sBAAA,CAAA,IAAI,EAAA,iBAAA,EAAA,GAAA,EAAA,uBAAA,CAAiB,CAArB,IAAA,CAAA,IAAI,CAAmB;YAEvB,IAAI,uBAAA,IAAI,EAAA,YAAA,EAAA,GAAA,CAAM,CAAC,MAAM,GAAG,CAAC;gBAAE,sBAAA,CAAA,IAAI,EAAA,iBAAA,EAAA,GAAA,EAAA,qBAAA,CAAe,CAAnB,IAAA,CAAA,IAAI,EAAgB,sBAAA,CAAA,IAAI,EAAA,YAAA,EAAA,GAAA,CAAM,CAAC,CAAC,CAAC,CAAC;AAC/D,SAAC,CAAA;AACF;IAlVW,cAAc,GAAA;AACtB,QAAA,sBAAA,CAAA,IAAI,EAAA,iBAAA,EAAA,GAAA,EAAA,sBAAA,CAAgB,CAApB,IAAA,CAAA,IAAI,CAAkB;;IAId,YAAY,GAAA;AACpB,QAAA,sBAAA,CAAA,IAAI,EAAA,sBAAA,EAAA,GAAA,CAAgB,CAApB,IAAA,CAAA,IAAI,CAAkB;;IAGjB,iBAAiB,GAAA;QACtB,IAAI,CAAC,cAAc,EAAE;AACrB,QAAA,sBAAA,CAAA,IAAI,+BAAwB,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,EAAA,GAAA,CAAA;AAC5D,QAAA,MAAM,IAAI,GAAG;AACX,YAAA,GAAG,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,SAAS,CAAC;SAClB;AACxB,QAAA,MAAM,cAAc,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,QAAQ,CAAC;AACvD,QAAA,IAAI,cAAc;AAAE,YAAA,sBAAA,CAAA,IAAI,EAAc,iBAAA,EAAA,GAAA,EAAA,oBAAA,CAAA,CAAA,IAAA,CAAlB,IAAI,EAAe,cAAc,CAAC;AACjD,aAAA,IAAI,IAAI,CAAC,MAAM,GAAG,CAAC;AAAE,YAAA,sBAAA,CAAA,IAAI,EAAc,iBAAA,EAAA,GAAA,EAAA,oBAAA,CAAA,CAAA,IAAA,CAAlB,IAAI,EAAe,IAAI,CAAC,CAAC,CAAC,CAAC;;IAGhD,kBAAkB,GAAA;QACvB,IAAI,IAAI,CAAC,SAAS;AAAE,YAAA,sBAAA,CAAA,IAAI,iDAAgB,CAApB,IAAA,CAAA,IAAI,EAAiB,IAAI,CAAC,SAAS,CAAC;QACxD,IAAI,CAAC,cAAc,EAAE;;IAGhB,gBAAgB,GAAA;QACrB,SAAS,CAAC,sBAAA,CAAA,IAAI,EAAA,cAAA,EAAA,GAAA,CAAQ,CAAC;QAEvB,sBAAA,CAAA,IAAI,EAAO,UAAA,EAAA,IAAI,cAAc,CAAC,uBAAA,IAAI,EAAA,gBAAA,EAAA,GAAA,CAAU,CAAC,EAAA,GAAA,CAAA;AAC7C,QAAA,sBAAA,CAAA,IAAI,kBAAI,CAAC,OAAO,CAAC,sBAAA,CAAA,IAAI,EAAQ,cAAA,EAAA,GAAA,CAAA,CAAC;;IAGzB,oBAAoB,GAAA;AACzB,QAAA,IAAI,sBAAA,CAAA,IAAI,EAAI,UAAA,EAAA,GAAA,CAAA;YAAE,sBAAA,CAAA,IAAI,EAAA,UAAA,EAAA,GAAA,CAAI,CAAC,UAAU,EAAE;;IAG9B,MAAM,GAAA;QACX,QACE,CACE,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE;AACL,gBAAA,sBAAsB,EACpB,IAAI,CAAC,WAAW,KAAK,UAAU,IAAI,sBAAA,CAAA,IAAI,EAAA,2BAAA,EAAA,GAAA,CAAqB,CAAzB,IAAA,CAAA,IAAI,CAAuB;aACjE,EACW,YAAA,EAAA,IAAI,CAAC,KAAK,EACV,YAAA,EAAA,IAAI,CAAC,KAAK,EAAA,iBAAA,EACL,sBAAA,CAAA,IAAI,EAAoB,iBAAA,EAAA,GAAA,EAAA,8BAAA,CAAA,EAAA,EAEzC,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,YAAY,EAAA,EACrB,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE;AACL,gBAAA,kBAAkB,EAAE,IAAI;gBACxB,YAAY,EACV,CAAC,IAAI,CAAC,eAAe,IAAI,IAAI,CAAC,iBAAiB;oBAC/C,IAAI,CAAC,WAAW,KAAK,UAAU;oBAC/B,sBAAA,CAAA,IAAI,EAAA,2BAAA,EAAA,GAAA,CAAqB,CAAzB,IAAA,CAAA,IAAI,CAAuB;AAC9B,aAAA,EAAA,EAED,CAAA,CAAA,iBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,IAAI,EAAC,mBAAmB,EACxB,UAAU,EAAC,SAAS,EACpB,QAAQ,EAAC,MAAM,EACf,WAAW,EAAC,MAAM,EAClB,KAAK,EAAC,iBAAiB,EACvB,OAAO,EAAE,uBAAA,IAAI,EAAA,qBAAA,EAAA,GAAA,CAAe,EAC5B,QAAQ,EAAE,IAAI,CAAC,iBAAiB,GAChC,CACE,EACN,CAAA,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE;AACL,gBAAA,UAAU,EAAE,IAAI;AAChB,gBAAA,cAAc,EACZ,IAAI,CAAC,WAAW,KAAK,UAAU,IAAI,sBAAA,CAAA,IAAI,EAAA,2BAAA,EAAA,GAAA,CAAqB,CAAzB,IAAA,CAAA,IAAI,CAAuB;AAChE,gBAAA,cAAc,EACZ,IAAI,CAAC,SAAS,KAAK,QAAQ;AAC3B,qBAAC,IAAI,CAAC,WAAW,KAAK,YAAY;AAChC,wBAAA,sBAAA,CAAA,IAAI,EAAA,6BAAA,EAAA,GAAA,CAAuB,CAA3B,IAAA,CAAA,IAAI,CAAyB,CAAC;AAChC,oBAAA,IAAI,CAAC,eAAe;AACpB,oBAAA,IAAI,CAAC,iBAAiB;AACzB,aAAA,EACD,IAAI,EAAC,SAAS,EAAA,YAAA,EACF,IAAI,CAAC,kBAAkB,EACnC,GAAG,EAAE,CAAC,OAAO,KAAI;gBACf,sBAAA,CAAA,IAAI,EAAA,cAAA,EAAW,OAAO,EAAA,GAAA,CAAA;AACxB,aAAC,EACD,OAAO,EAAE,sBAAA,CAAA,IAAI,EAAS,eAAA,EAAA,GAAA,CAAA,EACtB,SAAS,EAAE,sBAAA,CAAA,IAAI,EAAW,iBAAA,EAAA,GAAA,CAAA,EAC1B,WAAW,EAAE,sBAAA,CAAA,IAAI,EAAa,mBAAA,EAAA,GAAA,CAAA,EAC9B,QAAQ,EAAE,sBAAA,CAAA,IAAI,EAAU,gBAAA,EAAA,GAAA,CAAA,EAAA,GAEpB,sBAAA,CAAA,IAAI,EAAqB,2BAAA,EAAA,GAAA,CAAA,EAAA,EAE7B,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,YAAY,EAAE,sBAAA,CAAA,IAAI,EAAA,oBAAA,EAAA,GAAA,CAAc,GAAI,CACvC,EACL,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE;AACL,gBAAA,kBAAkB,EAAE,IAAI;gBACxB,YAAY,EACV,CAAC,IAAI,CAAC,eAAe,IAAI,IAAI,CAAC,iBAAiB;oBAC/C,IAAI,CAAC,WAAW,KAAK,UAAU;oBAC/B,sBAAA,CAAA,IAAI,EAAA,2BAAA,EAAA,GAAA,CAAqB,CAAzB,IAAA,CAAA,IAAI,CAAuB;aAC9B,EAAA,EAED,CAAA,CAAA,iBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,IAAI,EAAC,eAAe,EACpB,QAAQ,EAAC,MAAM,EACf,WAAW,EAAC,MAAM,EAClB,UAAU,EAAC,SAAS,EACpB,OAAO,EAAE,sBAAA,CAAA,IAAI,EAAa,mBAAA,EAAA,GAAA,CAAA,EAC1B,QAAQ,EAAE,IAAI,CAAC,eAAe,EAAA,CAC9B,CACE,CACF,EACL,sBAAA,CAAA,IAAI,4DAAuB,KAC1B,oEACE,QAAQ,EACN,IAAI,CAAC,WAAW,KAAK,UAAU,IAAI,sBAAA,CAAA,IAAI,EAAA,2BAAA,EAAA,GAAA,CAAqB,CAAzB,IAAA,CAAA,IAAI,CAAuB,EAEhE,CAAA,CACH,CACG;;;;;;;;;IA9JR,OAAO,IAAI,CAAC,UAAU;AACxB,CAAC,EAAA,wBAAA,GAAA,SAAA,wBAAA,GAAA;AAGC,IAAA,OAAO,IAAI,CAAC,IAAI,IAAI,SAAS;AAC/B,CAAC,EAAA,6BAAA,GAAA,SAAA,6BAAA,GAAA;AAGC,IAAA,QAAQ,IAAI,CAAC,SAAS;QACpB,KAAK,KAAK,EAAE;AACV,YAAA,OAAO,WAAW;;QAEpB,KAAK,KAAK,EAAE;AACV,YAAA,OAAO,cAAc;;QAEvB,KAAK,QAAQ,EAAE;AACb,YAAA,OAAO,aAAa;;QAEtB,KAAK,OAAO,EAAE;AACZ,YAAA,OAAO,YAAY;;QAErB,SAAS;AACP,YAAA,OAAO,SAAS;;;AAGtB,CAAC,EAAA,iCAAA,GAAA,SAAA,iCAAA,GAAA;AAGC,IAAA,IAAI,IAAI,CAAC,KAAK,KAAK,OAAO;AAAE,QAAA,OAAO,KAAK;AACxC,IAAA,IACE,IAAI,CAAC,KAAK,KAAK,MAAM;QACrB,IAAI,CAAC,KAAK,KAAK,YAAY;AAC3B,SAAC,IAAI,CAAC,WAAW,KAAK,YAAY,IAAI,sBAAA,CAAA,IAAI,EAAqB,2BAAA,EAAA,GAAA,CAAA,CAAA,IAAA,CAAzB,IAAI,CAAuB,CAAC;AAElE,QAAA,OAAO,KAAK;AACd,IAAA,OAAO,IAAI,CAAC,WAAW,KAAK,IAAI;AAClC,CAAC,uDAoJa,GAAsB,EAAA;AAClC,IAAA,IAAI,CAAC,SAAS,GAAG,GAAG;AAEpB,IAAA,KAAK,MAAM,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,SAAS,CAAC,EAAE;;AAErD,QAAA,MAAM,MAAM,GAAG,CAAC,CAAC,GAAG;AACpB,QAAA,MAAM,UAAU,GAAG,CAAC,KAAK,GAAG;;AAE5B,QAAA,CAAC,CAAC,QAAQ,GAAG,UAAU;AACvB,QAAA,IAAI,MAAM,YAAY,UAAU,CAAC,OAAO;AACtC,YAAA,MAAM,CAAC,YAAY,GAAG,UAAU,CAAC,QAAQ,EAAE;;AAEjD,CAAC,2DAEe,SAA4B,EAAA;AAC1C,IAAA,KAAK,MAAM,GAAG,IAAI,uBAAA,IAAI,EAAA,YAAA,EAAA,GAAA,CAAM,EAAE;AAC5B,QAAA,MAAM,KAAK,GAAG,mBAAmB,CAAC,GAAG,CAAC;QACtC,IAAI,KAAK,EAAE;AACT,YAAA,KAAK,CAAC,MAAM,GAAG,GAAG,KAAK,SAAS;;;AAGtC,CAAC,qEAEoB,GAAsB,EAAA;AACzC,IAAA,MAAM,WAAW,GAAG,IAAI,CAAC,SAAS;IAClC,IAAI,WAAW,KAAK,GAAG;QAAE;AAEzB,IAAA,IAAI,CAAC,SAAS,GAAG,GAAG;AAEpB,IAAA,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,WAAW,CAAC;AAElC,IAAA,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,GAAG,CAAC;AAC1B,IAAA,sBAAA,CAAA,IAAI,EAAe,iBAAA,EAAA,GAAA,EAAA,qBAAA,CAAA,CAAA,IAAA,CAAnB,IAAI,EAAgB,GAAG,CAAC;AACxB,IAAA,sBAAA,CAAA,IAAI,EAAgB,iBAAA,EAAA,GAAA,EAAA,sBAAA,CAAA,CAAA,IAAA,CAApB,IAAI,EAAiB,GAAG,CAAC;AAC3B,CAAC,EAAA,qBAAA,GAAA,SAAA,qBAAA,GAAA;IAGC,OAAO,sBAAA,CAAA,IAAI,EAAM,YAAA,EAAA,GAAA,CAAA,CAAC,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,GAAG,CAAC,YAAY,CAAC,UAAU,CAAC,KAAK,GAAG,CAAC;AAC3E,CAAC,yDAEc,GAAsB,EAAA;AACnC,IAAA,KAAK,MAAM,CAAC,IAAI,uBAAA,IAAI,EAAA,YAAA,EAAA,GAAA,CAAM,EAAE;AAC1B,QAAA,MAAM,SAAS,GAAG,CAAC,KAAK,GAAG;AAE3B,QAAA,gBAAgB,CAAC,CAAC,EAAE,CAAC,OAAsC,KAAI;AAC7D,YAAA,MAAM,MAAM,GAAG,OAAO,EAAE,GAAG;YAC3B,IAAI,MAAM,KAAK,SAAS;gBAAE;YAC1B,MAAM,UAAU,GAAG,MAAM,CAAC,YAAY,CAAC,eAAe,CAAC,KAAK,MAAM;AAClE,YAAA,MAAM,iBAAiB,GAAG,SAAS,IAAI,CAAC,UAAU;YAClD,MAAM,QAAQ,GAAG,iBAAiB,GAAG,GAAG,GAAG,IAAI;AAC/C,YAAA,MAAM,CAAC,YAAY,CAAC,UAAU,EAAE,QAAQ,CAAC;AACzC,YAAA,IAAI,iBAAiB;AAAE,gBAAA,sBAAA,CAAA,IAAI,EAAqB,iBAAA,EAAA,GAAA,EAAA,2BAAA,CAAA,CAAA,IAAA,CAAzB,IAAI,EAAsB,CAAC,CAAC;AACrD,SAAC,CAAC;;AAEN,CAAC,EAAA,uBAAA,GAAA,SAAA,uBAAA,GAAA;AA6GC,IAAA,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE,aAAa,CAAC,MAAM,CAAC;AACxD,IAAA,sBAAA,CAAA,IAAI,gBAAS;UACT,CAAC,GAAG,IAAI,CAAC,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,MAAM,CAClD,CAAC,OAAO,KAAK,gBAAgB,CAAC,OAAO,CAAC;AAE1C,UAAE,EAAE,EAAA,GAAA,CAAA;AACR,CAAC,EAAA,sBAAA,GAAA,SAAA,sBAAA,GAAA;AAGC,IAAA,MAAM,QAAQ,GAAG,YAAY,CAAC,GAAG,IAAI,CAAC,KAAK,CAAA,CAAA,EAAI,IAAI,CAAC,KAAK,CAAA,CAAE,CAAC;AAC5D,IAAA,IAAI,CAAC,QAAQ;QAAE;AAEf,IAAA,KAAK,MAAM,GAAG,IAAI,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,SAAS,CAAC,EAAE;;AAEvD,QAAA,GAAG,CAAC,UAAU,GAAG,sBAAA,CAAA,IAAI,yDAAoB,IAAI,QAAQ,CAAC,UAAU;AAChE,QAAA,GAAG,CAAC,IAAI,GAAG,sBAAA,CAAA,IAAI,mDAAc,IAAI,QAAQ,CAAC,IAAI;AAE9C,QAAA,GAAG,CAAC,iBAAiB;YACnB,IAAI,CAAC,WAAW,KAAK;AACnB,kBAAE;AACF,mBAAG,sBAAA,CAAA,IAAI,EAAA,iBAAA,EAAA,GAAA,EAAA,6BAAA,CAAmB,IAAI,QAAQ,CAAC,iBAAiB,CAAC;;;AAGjE,CAAC;;;;;"}
|
|
@@ -5,8 +5,19 @@
|
|
|
5
5
|
*/
|
|
6
6
|
import { r as registerInstance, h } from './index-Hg1Liloy.js';
|
|
7
7
|
|
|
8
|
-
const tableCellCss = ":host([hidden]){display:none!important}:host{display:contents}.qds-table-cell{box-sizing:border-box;color:var(--qds-theme-title);font:var(--qds-
|
|
8
|
+
const tableCellCss = ":host([hidden]){display:none!important}:host{display:contents}.qds-table-cell{box-sizing:border-box;color:var(--qds-theme-text-standard);padding-block:0;text-align:inherit;vertical-align:middle;width:inherit}[data-size=small]{font:var(--qds-table-cell-small-title);min-height:var(--qds-table-cell-small-height);padding-inline:var(--qds-table-cell-small-padding-horizontal)}[data-size=standard]{font:var(--qds-table-cell-standard-title);min-height:var(--qds-table-cell-standard-height);padding-inline:var(--qds-table-cell-standard-padding-horizontal)}[data-size=large]{font:var(--qds-table-cell-large-title);min-height:var(--qds-table-cell-large-height);padding-inline:var(--qds-table-cell-large-padding-horizontal)}";
|
|
9
9
|
|
|
10
|
+
// SPDX-FileCopyrightText: © 2024 Schneider Electric
|
|
11
|
+
//
|
|
12
|
+
// SPDX-License-Identifier: Apache-2.0
|
|
13
|
+
var __classPrivateFieldGet = (undefined && undefined.__classPrivateFieldGet) || function (receiver, state, kind, f) {
|
|
14
|
+
if (kind === "a" && !f)
|
|
15
|
+
throw new TypeError("Private accessor was defined without a getter");
|
|
16
|
+
if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
|
|
17
|
+
throw new TypeError("Cannot read private member from an object whose class did not declare it");
|
|
18
|
+
return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
|
|
19
|
+
};
|
|
20
|
+
var _TableCell_instances, _TableCell_computedSize_get;
|
|
10
21
|
const TableCell = class {
|
|
11
22
|
constructor(hostRef) {
|
|
12
23
|
registerInstance(this, hostRef);
|
|
@@ -17,6 +28,11 @@ const TableCell = class {
|
|
|
17
28
|
this.internals = hostRef.$hostElement$.attachInternals();
|
|
18
29
|
hostRef.$hostElement$["s-ei"] = this.internals;
|
|
19
30
|
}
|
|
31
|
+
_TableCell_instances.add(this);
|
|
32
|
+
/**
|
|
33
|
+
* The table cell's size.
|
|
34
|
+
*/
|
|
35
|
+
this.size = 'standard';
|
|
20
36
|
}
|
|
21
37
|
colSpanChanged(newValue) {
|
|
22
38
|
this.internals.ariaColSpan =
|
|
@@ -44,15 +60,26 @@ const TableCell = class {
|
|
|
44
60
|
render() {
|
|
45
61
|
return (
|
|
46
62
|
// eslint-disable-next-line jsx-a11y/control-has-associated-label
|
|
47
|
-
h("td", { key: '
|
|
63
|
+
h("td", { key: '92bc078c48ec5f41e1751a19bdbf2f95eb33d996', class: "qds-table-cell", "data-size": __classPrivateFieldGet(this, _TableCell_instances, "a", _TableCell_computedSize_get), colSpan: this.colSpan, rowSpan: this.rowSpan,
|
|
48
64
|
// eslint-disable-next-line jsx-a11y/no-interactive-element-to-noninteractive-role
|
|
49
|
-
role: "none" }, h("slot", { key: '
|
|
65
|
+
role: "none" }, h("slot", { key: 'cf016b76dd2a13a2768180d3f7f8cb22d9189876' })));
|
|
50
66
|
}
|
|
51
67
|
static get watchers() { return {
|
|
52
68
|
"colSpan": ["colSpanChanged"],
|
|
53
69
|
"rowSpan": ["rowSpanChanged"]
|
|
54
70
|
}; }
|
|
55
71
|
};
|
|
72
|
+
_TableCell_instances = new WeakSet(), _TableCell_computedSize_get = function _TableCell_computedSize_get() {
|
|
73
|
+
switch (this.size) {
|
|
74
|
+
case 'large':
|
|
75
|
+
case 'small': {
|
|
76
|
+
return this.size;
|
|
77
|
+
}
|
|
78
|
+
default: {
|
|
79
|
+
return 'standard';
|
|
80
|
+
}
|
|
81
|
+
}
|
|
82
|
+
};
|
|
56
83
|
TableCell.style = tableCellCss;
|
|
57
84
|
|
|
58
85
|
export { TableCell as qds_table_cell };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"qds-table-cell.entry.js","sources":["src/components/table-cell/table-cell.css?tag=qds-table-cell&encapsulation=shadow","src/components/table-cell/table-cell.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2024 Schneider Electric\n *\n * SPDX-License-Identifier: Apache-2.0\n */\n\n@import url('../shared.css');\n\n:host {\n display: contents;\n}\n\n.qds-table-cell {\n box-sizing: border-box;\n color: var(--qds-theme-title);\n font: var(--qds-
|
|
1
|
+
{"version":3,"file":"qds-table-cell.entry.js","sources":["src/components/table-cell/table-cell.css?tag=qds-table-cell&encapsulation=shadow","src/components/table-cell/table-cell.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2024 Schneider Electric\n *\n * SPDX-License-Identifier: Apache-2.0\n */\n\n@import url('../shared.css');\n\n:host {\n display: contents;\n}\n\n.qds-table-cell {\n box-sizing: border-box;\n color: var(--qds-theme-text-standard);\n padding-block: 0;\n text-align: inherit;\n vertical-align: middle;\n width: inherit;\n}\n\n[data-size='small'] {\n font: var(--qds-table-cell-small-title);\n min-height: var(--qds-table-cell-small-height);\n padding-inline: var(--qds-table-cell-small-padding-horizontal);\n}\n\n[data-size='standard'] {\n font: var(--qds-table-cell-standard-title);\n min-height: var(--qds-table-cell-standard-height);\n padding-inline: var(--qds-table-cell-standard-padding-horizontal);\n}\n\n[data-size='large'] {\n font: var(--qds-table-cell-large-title);\n min-height: var(--qds-table-cell-large-height);\n padding-inline: var(--qds-table-cell-large-padding-horizontal);\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface } from '@stencil/core'\nimport { AttachInternals, Component, h, Prop, Watch } from '@stencil/core'\n\nimport type { Size } from '../shared'\n\n/**\n * The `<qds-table-cell>` element defines a cell of a table that contains data.\n * It participates in the *table model*.\n *\n * @see https://quartz.se.com/build/components/table\n */\n@Component({\n tag: 'qds-table-cell',\n shadow: true,\n styleUrl: 'table-cell.css',\n})\nexport class TableCell implements ComponentInterface {\n /**\n * Non-negative integer value that indicates for how many columns the cell\n * extends. Its default value is `1`. Values higher than 1000 will be\n * considered as incorrect and will be set to the default value (1).\n *\n * @webnative\n */\n @Prop({ attribute: 'colspan' }) public readonly colSpan?: number\n\n /**\n * Non-negative integer value that indicates for how many rows the cell\n * extends. Its default value is `1`; if its value is set to `0`, it extends\n * until the end of the table section (`<qds-table-head>` or\n * `<qds-table-body>`, even if implicitly defined), that the cell belongs to.\n * Values higher than 65534 are clipped down to 65534.\n *\n * @webnative\n */\n @Prop({ attribute: 'rowspan' }) public readonly rowSpan?: number\n\n /**\n * The table cell's size.\n */\n @Prop() public readonly size?: Size = 'standard'\n\n @AttachInternals() private readonly internals!: ElementInternals\n\n get #computedSize(): Size {\n switch (this.size) {\n case 'large':\n case 'small': {\n return this.size\n }\n default: {\n return 'standard'\n }\n }\n }\n\n @Watch('colSpan')\n protected colSpanChanged(newValue: number | undefined): void {\n this.internals.ariaColSpan =\n newValue === undefined ||\n Number.isNaN(newValue) ||\n newValue < 1 ||\n newValue > 1000\n ? '1'\n : newValue.toString()\n }\n\n @Watch('rowSpan')\n protected rowSpanChanged(newValue: number | undefined): void {\n this.internals.ariaRowSpan =\n newValue === undefined ||\n Number.isNaN(newValue) ||\n newValue < 1 ||\n newValue > 65_534\n ? '1'\n : newValue.toString()\n }\n\n public componentWillLoad(): void {\n this.internals.role = 'cell'\n this.colSpanChanged(this.colSpan)\n this.rowSpanChanged(this.rowSpan)\n }\n\n public render() {\n return (\n // eslint-disable-next-line jsx-a11y/control-has-associated-label\n <td\n class=\"qds-table-cell\"\n data-size={this.#computedSize}\n colSpan={this.colSpan}\n rowSpan={this.rowSpan}\n // eslint-disable-next-line jsx-a11y/no-interactive-element-to-noninteractive-role\n role=\"none\"\n >\n <slot />\n </td>\n )\n }\n}\n"],"names":[],"mappings":";;;;;;;AAAA,MAAM,YAAY,GAAG,6sBAA6sB;;ACAluB;AACA;AACA;;;;;;;;;MAkBa,SAAS,GAAA,MAAA;AALtB,IAAA,WAAA,CAAA,OAAA,EAAA;;;;;;;;;;AA0BE;;AAEG;AACqB,QAAA,IAAI,CAAA,IAAA,GAAU,UAAU;AA2DjD;AA1CW,IAAA,cAAc,CAAC,QAA4B,EAAA;QACnD,IAAI,CAAC,SAAS,CAAC,WAAW;AACxB,YAAA,QAAQ,KAAK,SAAS;AACtB,gBAAA,MAAM,CAAC,KAAK,CAAC,QAAQ,CAAC;AACtB,gBAAA,QAAQ,GAAG,CAAC;AACZ,gBAAA,QAAQ,GAAG;AACT,kBAAE;AACF,kBAAE,QAAQ,CAAC,QAAQ,EAAE;;AAIjB,IAAA,cAAc,CAAC,QAA4B,EAAA;QACnD,IAAI,CAAC,SAAS,CAAC,WAAW;AACxB,YAAA,QAAQ,KAAK,SAAS;AACtB,gBAAA,MAAM,CAAC,KAAK,CAAC,QAAQ,CAAC;AACtB,gBAAA,QAAQ,GAAG,CAAC;AACZ,gBAAA,QAAQ,GAAG;AACT,kBAAE;AACF,kBAAE,QAAQ,CAAC,QAAQ,EAAE;;IAGpB,iBAAiB,GAAA;AACtB,QAAA,IAAI,CAAC,SAAS,CAAC,IAAI,GAAG,MAAM;AAC5B,QAAA,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,OAAO,CAAC;AACjC,QAAA,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,OAAO,CAAC;;IAG5B,MAAM,GAAA;QACX;;AAEE,QAAA,CAAA,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,gBAAgB,eACX,sBAAA,CAAA,IAAI,yDAAc,EAC7B,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,OAAO,EAAE,IAAI,CAAC,OAAO;;AAErB,YAAA,IAAI,EAAC,MAAM,EAAA,EAEX,CAAQ,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACL;;;;;;;;AAnDP,IAAA,QAAQ,IAAI,CAAC,IAAI;AACf,QAAA,KAAK,OAAO;QACZ,KAAK,OAAO,EAAE;YACZ,OAAO,IAAI,CAAC,IAAI;;QAElB,SAAS;AACP,YAAA,OAAO,UAAU;;;AAGvB,CAAC;;;;;"}
|
|
@@ -5,8 +5,19 @@
|
|
|
5
5
|
*/
|
|
6
6
|
import { r as registerInstance, h } from './index-Hg1Liloy.js';
|
|
7
7
|
|
|
8
|
-
const tableHeadCellCss = ":host([hidden]){display:none!important}:host{display:contents}.qds-table-head-cell{box-sizing:border-box;color:var(--qds-theme-
|
|
8
|
+
const tableHeadCellCss = ":host([hidden]){display:none!important}:host{display:contents}.qds-table-head-cell{box-sizing:border-box;color:var(--qds-theme-text-standard);padding-block:0;text-align:inherit;vertical-align:middle;width:inherit}[data-size=small]{font:var(--qds-table-cell-small-title);min-height:var(--qds-table-cell-small-height);padding-inline:var(--qds-table-cell-small-padding-horizontal)}[data-size=standard]{font:var(--qds-table-cell-standard-title);min-height:var(--qds-table-cell-standard-height);padding-inline:var(--qds-table-cell-standard-padding-horizontal)}[data-size=large]{font:var(--qds-table-cell-large-title);min-height:var(--qds-table-cell-large-height);padding-inline:var(--qds-table-cell-large-padding-horizontal)}";
|
|
9
9
|
|
|
10
|
+
// SPDX-FileCopyrightText: © 2024 Schneider Electric
|
|
11
|
+
//
|
|
12
|
+
// SPDX-License-Identifier: Apache-2.0
|
|
13
|
+
var __classPrivateFieldGet = (undefined && undefined.__classPrivateFieldGet) || function (receiver, state, kind, f) {
|
|
14
|
+
if (kind === "a" && !f)
|
|
15
|
+
throw new TypeError("Private accessor was defined without a getter");
|
|
16
|
+
if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
|
|
17
|
+
throw new TypeError("Cannot read private member from an object whose class did not declare it");
|
|
18
|
+
return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
|
|
19
|
+
};
|
|
20
|
+
var _TableHeadCell_instances, _TableHeadCell_computedSize_get;
|
|
10
21
|
const TableHeadCell = class {
|
|
11
22
|
constructor(hostRef) {
|
|
12
23
|
registerInstance(this, hostRef);
|
|
@@ -17,6 +28,11 @@ const TableHeadCell = class {
|
|
|
17
28
|
this.internals = hostRef.$hostElement$.attachInternals();
|
|
18
29
|
hostRef.$hostElement$["s-ei"] = this.internals;
|
|
19
30
|
}
|
|
31
|
+
_TableHeadCell_instances.add(this);
|
|
32
|
+
/**
|
|
33
|
+
* The table header cell's size.
|
|
34
|
+
*/
|
|
35
|
+
this.size = 'standard';
|
|
20
36
|
}
|
|
21
37
|
colSpanChanged(newValue) {
|
|
22
38
|
this.internals.ariaColSpan =
|
|
@@ -47,9 +63,9 @@ const TableHeadCell = class {
|
|
|
47
63
|
render() {
|
|
48
64
|
return (
|
|
49
65
|
// eslint-disable-next-line jsx-a11y/control-has-associated-label
|
|
50
|
-
h("th", { key: '
|
|
66
|
+
h("th", { key: '0d385fba48aa553f9a968b310bd6cafc8cac8659', class: "qds-table-head-cell", "data-size": __classPrivateFieldGet(this, _TableHeadCell_instances, "a", _TableHeadCell_computedSize_get), colSpan: this.colSpan, rowSpan: this.rowSpan, scope: this.scope,
|
|
51
67
|
// eslint-disable-next-line jsx-a11y/no-interactive-element-to-noninteractive-role
|
|
52
|
-
role: "none" }, h("slot", { key: '
|
|
68
|
+
role: "none" }, h("slot", { key: '7aa120d507fa6cbb80ef6acf92ba88d29545b82c' })));
|
|
53
69
|
}
|
|
54
70
|
static get watchers() { return {
|
|
55
71
|
"colSpan": ["colSpanChanged"],
|
|
@@ -57,6 +73,17 @@ const TableHeadCell = class {
|
|
|
57
73
|
"scope": ["scopeChanged"]
|
|
58
74
|
}; }
|
|
59
75
|
};
|
|
76
|
+
_TableHeadCell_instances = new WeakSet(), _TableHeadCell_computedSize_get = function _TableHeadCell_computedSize_get() {
|
|
77
|
+
switch (this.size) {
|
|
78
|
+
case 'large':
|
|
79
|
+
case 'small': {
|
|
80
|
+
return this.size;
|
|
81
|
+
}
|
|
82
|
+
default: {
|
|
83
|
+
return 'standard';
|
|
84
|
+
}
|
|
85
|
+
}
|
|
86
|
+
};
|
|
60
87
|
TableHeadCell.style = tableHeadCellCss;
|
|
61
88
|
|
|
62
89
|
export { TableHeadCell as qds_table_head_cell };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"qds-table-head-cell.entry.js","sources":["src/components/table-head-cell/table-head-cell.css?tag=qds-table-head-cell&encapsulation=shadow","src/components/table-head-cell/table-head-cell.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2024 Schneider Electric\n *\n * SPDX-License-Identifier: Apache-2.0\n */\n\n@import url('../shared.css');\n\n:host {\n display: contents;\n}\n\n.qds-table-head-cell {\n box-sizing: border-box;\n color: var(--qds-theme-
|
|
1
|
+
{"version":3,"file":"qds-table-head-cell.entry.js","sources":["src/components/table-head-cell/table-head-cell.css?tag=qds-table-head-cell&encapsulation=shadow","src/components/table-head-cell/table-head-cell.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2024 Schneider Electric\n *\n * SPDX-License-Identifier: Apache-2.0\n */\n\n@import url('../shared.css');\n\n:host {\n display: contents;\n}\n\n.qds-table-head-cell {\n box-sizing: border-box;\n color: var(--qds-theme-text-standard);\n padding-block: 0;\n text-align: inherit;\n vertical-align: middle;\n width: inherit;\n}\n\n[data-size='small'] {\n font: var(--qds-table-cell-small-title);\n min-height: var(--qds-table-cell-small-height);\n padding-inline: var(--qds-table-cell-small-padding-horizontal);\n}\n\n[data-size='standard'] {\n font: var(--qds-table-cell-standard-title);\n min-height: var(--qds-table-cell-standard-height);\n padding-inline: var(--qds-table-cell-standard-padding-horizontal);\n}\n\n[data-size='large'] {\n font: var(--qds-table-cell-large-title);\n min-height: var(--qds-table-cell-large-height);\n padding-inline: var(--qds-table-cell-large-padding-horizontal);\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface } from '@stencil/core'\nimport { AttachInternals, Component, h, Prop, Watch } from '@stencil/core'\n\nimport type { Size } from '../shared'\n\nexport type Scope = 'col' | 'row'\n\n/**\n * The `<qds-table-head-cell>` element defines a cell as the header of a group\n * of table cells. The exact nature of this group is defined by the `scope`\n * attribute.\n *\n * @see https://quartz.se.com/build/components/table\n */\n@Component({\n tag: 'qds-table-head-cell',\n shadow: true,\n styleUrl: 'table-head-cell.css',\n})\nexport class TableHeadCell implements ComponentInterface {\n /**\n * Non-negative integer value that indicates for how many columns the cell\n * extends. Its default value is `1`. Values higher than 1000 will be\n * considered as incorrect and will be set to the default value (1).\n *\n * @webnative\n */\n @Prop({ attribute: 'colspan' }) public readonly colSpan?: number\n\n /**\n * Non-negative integer value that indicates for how many rows the cell\n * extends. Its default value is `1`; if its value is set to `0`, it extends\n * until the end of the table section (`<qds-table-head>` or\n * `<qds-table-body>`, even if implicitly defined), that the cell belongs to.\n * Values higher than 65534 are clipped down to 65534.\n *\n * @webnative\n */\n @Prop({ attribute: 'rowspan' }) public readonly rowSpan?: number\n\n /**\n * Defines the cells that the header element relates to. It may have the\n * following values:\n *\n * - `row`: The header relates to all cells of the row it belongs to.\n * - `col`: The header relates to all cells of the column it belongs to.\n *\n * If the `scope` attribute is not specified, or its value is not `row` or\n * `col`, then browsers automatically select the set of cells to which the\n * header cell applies.\n *\n * @webnative\n */\n @Prop() public readonly scope?: Scope\n\n /**\n * The table header cell's size.\n */\n @Prop() public readonly size?: Size = 'standard'\n\n @AttachInternals() private readonly internals!: ElementInternals\n\n get #computedSize(): Size {\n switch (this.size) {\n case 'large':\n case 'small': {\n return this.size\n }\n default: {\n return 'standard'\n }\n }\n }\n\n @Watch('colSpan')\n protected colSpanChanged(newValue: number | undefined): void {\n this.internals.ariaColSpan =\n newValue === undefined ||\n Number.isNaN(newValue) ||\n newValue < 1 ||\n newValue > 1000\n ? '1'\n : newValue.toString()\n }\n\n @Watch('rowSpan')\n protected rowSpanChanged(newValue: number | undefined): void {\n this.internals.ariaRowSpan =\n newValue === undefined ||\n Number.isNaN(newValue) ||\n newValue < 1 ||\n newValue > 65_534\n ? '1'\n : newValue.toString()\n }\n\n @Watch('scope')\n protected scopeChanged(newValue: Scope | undefined): void {\n this.internals.role = newValue === 'row' ? 'rowheader' : 'columnheader'\n }\n\n public componentWillLoad(): void {\n this.colSpanChanged(this.colSpan)\n this.rowSpanChanged(this.rowSpan)\n this.scopeChanged(this.scope)\n }\n\n public render() {\n return (\n // eslint-disable-next-line jsx-a11y/control-has-associated-label\n <th\n class=\"qds-table-head-cell\"\n data-size={this.#computedSize}\n colSpan={this.colSpan}\n rowSpan={this.rowSpan}\n scope={this.scope}\n // eslint-disable-next-line jsx-a11y/no-interactive-element-to-noninteractive-role\n role=\"none\"\n >\n <slot />\n </th>\n )\n }\n}\n"],"names":[],"mappings":";;;;;;;AAAA,MAAM,gBAAgB,GAAG,ktBAAktB;;ACA3uB;AACA;AACA;;;;;;;;;MAqBa,aAAa,GAAA,MAAA;AAL1B,IAAA,WAAA,CAAA,OAAA,EAAA;;;;;;;;;;AAyCE;;AAEG;AACqB,QAAA,IAAI,CAAA,IAAA,GAAU,UAAU;AAiEjD;AAhDW,IAAA,cAAc,CAAC,QAA4B,EAAA;QACnD,IAAI,CAAC,SAAS,CAAC,WAAW;AACxB,YAAA,QAAQ,KAAK,SAAS;AACtB,gBAAA,MAAM,CAAC,KAAK,CAAC,QAAQ,CAAC;AACtB,gBAAA,QAAQ,GAAG,CAAC;AACZ,gBAAA,QAAQ,GAAG;AACT,kBAAE;AACF,kBAAE,QAAQ,CAAC,QAAQ,EAAE;;AAIjB,IAAA,cAAc,CAAC,QAA4B,EAAA;QACnD,IAAI,CAAC,SAAS,CAAC,WAAW;AACxB,YAAA,QAAQ,KAAK,SAAS;AACtB,gBAAA,MAAM,CAAC,KAAK,CAAC,QAAQ,CAAC;AACtB,gBAAA,QAAQ,GAAG,CAAC;AACZ,gBAAA,QAAQ,GAAG;AACT,kBAAE;AACF,kBAAE,QAAQ,CAAC,QAAQ,EAAE;;AAIjB,IAAA,YAAY,CAAC,QAA2B,EAAA;AAChD,QAAA,IAAI,CAAC,SAAS,CAAC,IAAI,GAAG,QAAQ,KAAK,KAAK,GAAG,WAAW,GAAG,cAAc;;IAGlE,iBAAiB,GAAA;AACtB,QAAA,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,OAAO,CAAC;AACjC,QAAA,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,OAAO,CAAC;AACjC,QAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC;;IAGxB,MAAM,GAAA;QACX;;AAEE,QAAA,CACE,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,qBAAqB,EAChB,WAAA,EAAA,sBAAA,CAAA,IAAI,EAAc,wBAAA,EAAA,GAAA,EAAA,+BAAA,CAAA,EAC7B,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,KAAK,EAAE,IAAI,CAAC,KAAK;;AAEjB,YAAA,IAAI,EAAC,MAAM,EAAA,EAEX,CAAQ,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACL;;;;;;;;;AAzDP,IAAA,QAAQ,IAAI,CAAC,IAAI;AACf,QAAA,KAAK,OAAO;QACZ,KAAK,OAAO,EAAE;YACZ,OAAO,IAAI,CAAC,IAAI;;QAElB,SAAS;AACP,YAAA,OAAO,UAAU;;;AAGvB,CAAC;;;;;"}
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
*/
|
|
6
6
|
import { r as registerInstance, h } from './index-Hg1Liloy.js';
|
|
7
7
|
|
|
8
|
-
const tableRowCss = ":host([hidden]){display:none!important}:host{display:contents}.qds-table-row{border-block-end:var(--qds-
|
|
8
|
+
const tableRowCss = ":host([hidden]){display:none!important}:host{display:contents}.qds-table-row{border-block-end:var(--qds-table-border-width) solid var(--qds-theme-divider-standard);box-sizing:border-box}";
|
|
9
9
|
|
|
10
10
|
const TableRow = class {
|
|
11
11
|
constructor(hostRef) {
|
|
@@ -23,7 +23,7 @@ const TableRow = class {
|
|
|
23
23
|
}
|
|
24
24
|
// eslint-disable-next-line @typescript-eslint/class-methods-use-this
|
|
25
25
|
render() {
|
|
26
|
-
return (h("tr", { key: '
|
|
26
|
+
return (h("tr", { key: 'f2ebf28bc79f5b8043ba5309e0f5d67b2e29dccc', class: "qds-table-row", role: "none" }, h("slot", { key: '3a16ecf6721c2decf2fc050db6abb1c0feabc45e' })));
|
|
27
27
|
}
|
|
28
28
|
};
|
|
29
29
|
TableRow.style = tableRowCss;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"qds-table-row.entry.js","sources":["src/components/table-row/table-row.css?tag=qds-table-row&encapsulation=shadow","src/components/table-row/table-row.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2024 Schneider Electric\n *\n * SPDX-License-Identifier: Apache-2.0\n */\n\n@import url('../shared.css');\n\n:host {\n display: contents;\n}\n\n.qds-table-row {\n border-block-end: var(--qds-
|
|
1
|
+
{"version":3,"file":"qds-table-row.entry.js","sources":["src/components/table-row/table-row.css?tag=qds-table-row&encapsulation=shadow","src/components/table-row/table-row.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2024 Schneider Electric\n *\n * SPDX-License-Identifier: Apache-2.0\n */\n\n@import url('../shared.css');\n\n:host {\n display: contents;\n}\n\n.qds-table-row {\n border-block-end: var(--qds-table-border-width) solid\n var(--qds-theme-divider-standard);\n box-sizing: border-box;\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface } from '@stencil/core'\nimport { AttachInternals, Component, h } from '@stencil/core'\n\n/**\n * The `<qds-table-row>` element defines a row of cells in a table. The row's\n * cells can then be established using a mix of `<qds-table-cell>` (data cell)\n * and `<qds-table-head-cell>` (header cell) elements.\n *\n * @see https://quartz.se.com/build/components/table\n */\n@Component({\n tag: 'qds-table-row',\n shadow: true,\n styleUrl: 'table-row.css',\n})\nexport class TableRow implements ComponentInterface {\n @AttachInternals() private readonly internals!: ElementInternals\n\n public componentWillLoad(): void {\n this.internals.role = 'row'\n }\n\n // eslint-disable-next-line @typescript-eslint/class-methods-use-this\n public render() {\n return (\n <tr class=\"qds-table-row\" role=\"none\">\n <slot />\n </tr>\n )\n }\n}\n"],"names":[],"mappings":";;;;;;;AAAA,MAAM,WAAW,GAAG,4LAA4L;;MCmBnM,QAAQ,GAAA,MAAA;;;;;;;;;;;IAGZ,iBAAiB,GAAA;AACtB,QAAA,IAAI,CAAC,SAAS,CAAC,IAAI,GAAG,KAAK;;;IAItB,MAAM,GAAA;AACX,QAAA,QACE,2DAAI,KAAK,EAAC,eAAe,EAAC,IAAI,EAAC,MAAM,EAAA,EACnC,CAAQ,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACL;;;;;;;"}
|
|
@@ -23,7 +23,7 @@ const Table = class {
|
|
|
23
23
|
}
|
|
24
24
|
// eslint-disable-next-line @typescript-eslint/class-methods-use-this
|
|
25
25
|
render() {
|
|
26
|
-
return h("slot", { key: '
|
|
26
|
+
return h("slot", { key: 'e48b0a5845e41ac83900ddbd3baf9c5a38b01d9a' });
|
|
27
27
|
}
|
|
28
28
|
};
|
|
29
29
|
Table.style = tableCss;
|