@quartzds/core 1.0.0-beta.121 → 1.0.0-beta.123
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 +66 -0
- package/components/index.js +1 -1
- package/components/{p-CkyaV9az.js → p-B7s906mS.js} +9 -9
- package/components/p-B7s906mS.js.map +1 -0
- package/components/p-BZlKeCFb.js +200 -0
- package/components/p-BZlKeCFb.js.map +1 -0
- 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-C1c4JVlg.js → p-BoSYRCNp.js} +47 -28
- package/components/p-BoSYRCNp.js.map +1 -0
- package/components/p-BvRd7jA2.js +102 -0
- package/components/p-BvRd7jA2.js.map +1 -0
- package/components/{p-B2ZVUvk9.js → p-C93kOEAe.js} +7 -9
- package/components/p-C93kOEAe.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-D82sb4oJ.js → p-CbY4T0d2.js} +5 -5
- package/components/p-CbY4T0d2.js.map +1 -0
- package/components/{p-DNHI4C-W.js → p-CowZ-pDD.js} +58 -22
- package/components/p-CowZ-pDD.js.map +1 -0
- package/components/{p-CDRwHAIT.js → p-XP2CY_fo.js} +3 -3
- package/components/p-XP2CY_fo.js.map +1 -0
- 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 +10 -10
- 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 +3 -3
- 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 +2 -2
- 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 +6 -6
- package/components/qds-switch.js.map +1 -1
- 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 +6 -6
- 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 +2 -2
- 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 +3 -5
- package/dist/cjs/qds-mini-button.entry.cjs.js.map +1 -1
- package/dist/cjs/qds-progress-bar.cjs.entry.js +2 -2
- 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 +4 -4
- package/dist/cjs/qds-switch.entry.cjs.js.map +1 -1
- 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 +2 -2
- package/dist/cjs/qds-tooltip.entry.cjs.js.map +1 -1
- package/dist/cjs/qds.cjs.js +1 -1
- package/dist/custom-elements.json +365 -30
- package/dist/docs.json +320 -64
- 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 +7 -7
- 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 +2 -2
- 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 +4 -6
- package/dist/esm/qds-mini-button.entry.js.map +1 -1
- package/dist/esm/qds-progress-bar.entry.js +2 -2
- 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 +5 -5
- package/dist/esm/qds-switch.entry.js.map +1 -1
- 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 +3 -3
- package/dist/esm/qds-tooltip.entry.js.map +1 -1
- 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 +969 -741
- package/hydrate/index.mjs +969 -741
- package/package.json +1 -2
- package/styles/core.css +24 -22
- package/components/p-5dwtV5iH.js.map +0 -1
- package/components/p-B2ZVUvk9.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 +0 -102
- package/components/p-CkUTS1aU.js.map +0 -1
- package/components/p-CkyaV9az.js.map +0 -1
- package/components/p-D82sb4oJ.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
|
@@ -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;
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
* SPDX-License-Identifier: Apache-2.0
|
|
5
5
|
*/
|
|
6
6
|
import { r as registerInstance, h, F as Fragment, g as getElement } from './index-Hg1Liloy.js';
|
|
7
|
-
import { c as inheritAriaAttributes } from './helpers-
|
|
7
|
+
import { c as inheritAriaAttributes } from './helpers-Fe2AA6uo.js';
|
|
8
8
|
|
|
9
9
|
const tagCss = ":host([hidden]){display:none!important}:host{display:inline-block}.qds-tag{align-items:center;box-sizing:border-box;display:inline-flex;justify-content:center;max-width:inherit;min-width:inherit;width:inherit}.qds-text{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:5}.qds-sr-only{clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.qds-icon{flex-shrink:0}[data-status=error]{color:var(--qds-theme-feedback-message-critical)}[data-status=success]{color:var(--qds-theme-feedback-message-success)}[data-status=warning]{color:var(--qds-theme-feedback-message-important)}[data-status=info]{color:var(--qds-theme-feedback-message-informational)}[data-status=neutral]{color:var(--qds-theme-feedback-message-neutral)}[data-importance=subdued] .qds-text{color:var(--qds-theme-text-standard)}[data-importance=standard][data-status=error]{background-color:var(--qds-theme-feedback-message-critical-dimmed)}[data-importance=standard][data-status=success]{background-color:var(--qds-theme-feedback-message-success-dimmed)}[data-importance=standard][data-status=warning]{background-color:var(--qds-theme-feedback-message-important-dimmed)}[data-importance=standard][data-status=info]{background-color:var(--qds-theme-feedback-message-informational-dimmed)}[data-importance=standard][data-status=neutral]{background-color:var(--qds-theme-feedback-message-neutral-dimmed)}[data-importance=emphasized][data-status=error]{background-color:var(--qds-theme-feedback-message-critical);color:var(--qds-theme-feedback-message-critical-contrast)}[data-importance=emphasized][data-status=success]{background-color:var(--qds-theme-feedback-message-success);color:var(--qds-theme-feedback-message-success-contrast)}[data-importance=emphasized][data-status=warning]{background-color:var(--qds-theme-feedback-message-important);color:var(--qds-theme-feedback-message-important-contrast)}[data-importance=emphasized][data-status=info]{background-color:var(--qds-theme-feedback-message-informational);color:var(--qds-theme-feedback-message-informational-contrast)}[data-importance=emphasized][data-status=neutral]{background-color:var(--qds-theme-feedback-message-neutral);color:var(--qds-theme-feedback-message-neutral-contrast)}.qds-tag[data-size=small]{border-radius:var(--qds-feedback-tag-small-border-radius);font:var(--qds-feedback-tag-small-text);gap:var(--qds-feedback-tag-small-gap-internal);min-height:var(--qds-feedback-tag-small-height)}.qds-padding[data-size=small]{padding:var(--qds-feedback-tag-small-padding-vertical) var(--qds-feedback-tag-small-padding-horizontal)}.qds-icon[data-size=small]{height:var(--qds-feedback-tag-small-icon-size);width:var(--qds-feedback-tag-small-icon-size)}.qds-tag[data-size=standard]{border-radius:var(--qds-feedback-tag-standard-border-radius);font:var(--qds-feedback-tag-standard-text);gap:var(--qds-feedback-tag-standard-gap-internal);min-height:var(--qds-feedback-tag-standard-height)}.qds-padding[data-size=standard]{padding:var(--qds-feedback-tag-large-padding-vertical) var(--qds-feedback-tag-standard-padding-horizontal)}.qds-icon[data-size=standard]{height:var(--qds-feedback-tag-standard-icon-size);width:var(--qds-feedback-tag-standard-icon-size)}.qds-tag[data-size=large]{border-radius:var(--qds-feedback-tag-large-border-radius);font:var(--qds-feedback-tag-large-text);gap:var(--qds-feedback-tag-large-gap-internal);min-height:var(--qds-feedback-tag-large-height)}.qds-padding[data-size=large]{padding:var(--qds-feedback-tag-large-padding-vertical) var(--qds-feedback-tag-large-padding-horizontal)}.qds-icon[data-size=large]{height:var(--qds-feedback-tag-large-icon-size);width:var(--qds-feedback-tag-large-icon-size)}";
|
|
10
10
|
|
|
@@ -58,11 +58,11 @@ const Tag = class {
|
|
|
58
58
|
__classPrivateFieldSet(this, _Tag_inheritedAttributes, inheritAriaAttributes(this.host), "f");
|
|
59
59
|
}
|
|
60
60
|
render() {
|
|
61
|
-
return (h("span", { key: '
|
|
61
|
+
return (h("span", { key: 'dbda480ae5220ac8393a33a1b05970e099a1594b', class: {
|
|
62
62
|
'qds-tag': true,
|
|
63
63
|
'qds-padding': this.importance !== 'subdued',
|
|
64
64
|
}, "data-importance": __classPrivateFieldGet(this, _Tag_instances, "a", _Tag_computedImportance_get), "data-size": __classPrivateFieldGet(this, _Tag_instances, "a", _Tag_computedSize_get), "data-status": __classPrivateFieldGet(this, _Tag_instances, "a", _Tag_computedStatus_get), ...__classPrivateFieldGet(this, _Tag_inheritedAttributes, "f") }, this.iconName !== undefined && this.iconName !== '' ? (h(Fragment, null, this.iconDescription !== undefined &&
|
|
65
|
-
this.iconDescription !== '' && (h("span", { class: "qds-sr-only" }, this.iconDescription)), h("qds-icon", {
|
|
65
|
+
this.iconDescription !== '' && (h("span", { class: "qds-sr-only" }, this.iconDescription)), h("qds-icon", { class: "qds-icon", "data-size": __classPrivateFieldGet(this, _Tag_instances, "a", _Tag_computedSize_get), library: this.iconLibrary, name: this.iconName }))) : (__classPrivateFieldGet(this, _Tag_instances, "a", _Tag_hasBadge_get) && (h("qds-badge-indicator", { status: __classPrivateFieldGet(this, _Tag_instances, "a", _Tag_computedStatus_get), description: this.badgeDescription, size: __classPrivateFieldGet(this, _Tag_instances, "a", _Tag_computedSize_get), strokeRing: true }))), h("span", { key: '2bb48b6e991ad7bda93971b3556b3b9689a05c43', class: "qds-text" }, this.text)));
|
|
66
66
|
}
|
|
67
67
|
get host() { return getElement(this); }
|
|
68
68
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"qds-tag.entry.js","sources":["src/components/tag/tag.css?tag=qds-tag&encapsulation=shadow","src/components/tag/tag.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2024 Schneider Electric\n *\n * SPDX-License-Identifier: Apache-2.0\n */\n\n@import url('../shared.css');\n\n:host {\n display: inline-block;\n}\n\n.qds-tag {\n align-items: center;\n box-sizing: border-box;\n display: inline-flex;\n justify-content: center;\n max-width: inherit;\n min-width: inherit;\n width: inherit;\n}\n\n.qds-text {\n overflow: hidden;\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 5;\n}\n\n.qds-sr-only {\n clip: rect(0 0 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n.qds-icon {\n flex-shrink: 0;\n}\n\n[data-status='error'] {\n color: var(--qds-theme-feedback-message-critical);\n}\n\n[data-status='success'] {\n color: var(--qds-theme-feedback-message-success);\n}\n\n[data-status='warning'] {\n color: var(--qds-theme-feedback-message-important);\n}\n\n[data-status='info'] {\n color: var(--qds-theme-feedback-message-informational);\n}\n\n[data-status='neutral'] {\n color: var(--qds-theme-feedback-message-neutral);\n}\n\n[data-importance='subdued'] .qds-text {\n color: var(--qds-theme-text-standard);\n}\n\n[data-importance='standard'] {\n &[data-status='error'] {\n background-color: var(--qds-theme-feedback-message-critical-dimmed);\n }\n\n &[data-status='success'] {\n background-color: var(--qds-theme-feedback-message-success-dimmed);\n }\n\n &[data-status='warning'] {\n background-color: var(--qds-theme-feedback-message-important-dimmed);\n }\n\n &[data-status='info'] {\n background-color: var(--qds-theme-feedback-message-informational-dimmed);\n }\n\n &[data-status='neutral'] {\n background-color: var(--qds-theme-feedback-message-neutral-dimmed);\n }\n}\n\n[data-importance='emphasized'] {\n &[data-status='error'] {\n background-color: var(--qds-theme-feedback-message-critical);\n color: var(--qds-theme-feedback-message-critical-contrast);\n }\n\n &[data-status='success'] {\n background-color: var(--qds-theme-feedback-message-success);\n color: var(--qds-theme-feedback-message-success-contrast);\n }\n\n &[data-status='warning'] {\n background-color: var(--qds-theme-feedback-message-important);\n color: var(--qds-theme-feedback-message-important-contrast);\n }\n\n &[data-status='info'] {\n background-color: var(--qds-theme-feedback-message-informational);\n color: var(--qds-theme-feedback-message-informational-contrast);\n }\n\n &[data-status='neutral'] {\n background-color: var(--qds-theme-feedback-message-neutral);\n color: var(--qds-theme-feedback-message-neutral-contrast);\n }\n}\n\n[data-size='small'] {\n &.qds-tag {\n font: var(--qds-feedback-tag-small-text);\n gap: var(--qds-feedback-tag-small-gap-internal);\n min-height: var(--qds-feedback-tag-small-height);\n border-radius: var(--qds-feedback-tag-small-border-radius);\n }\n\n &.qds-padding {\n padding: var(--qds-feedback-tag-small-padding-vertical)\n var(--qds-feedback-tag-small-padding-horizontal);\n }\n\n &.qds-icon {\n width: var(--qds-feedback-tag-small-icon-size);\n height: var(--qds-feedback-tag-small-icon-size);\n }\n}\n\n[data-size='standard'] {\n &.qds-tag {\n font: var(--qds-feedback-tag-standard-text);\n gap: var(--qds-feedback-tag-standard-gap-internal);\n min-height: var(--qds-feedback-tag-standard-height);\n border-radius: var(--qds-feedback-tag-standard-border-radius);\n }\n\n &.qds-padding {\n padding: var(--qds-feedback-tag-large-padding-vertical)\n var(--qds-feedback-tag-standard-padding-horizontal);\n }\n\n &.qds-icon {\n width: var(--qds-feedback-tag-standard-icon-size);\n height: var(--qds-feedback-tag-standard-icon-size);\n }\n}\n\n[data-size='large'] {\n &.qds-tag {\n font: var(--qds-feedback-tag-large-text);\n gap: var(--qds-feedback-tag-large-gap-internal);\n min-height: var(--qds-feedback-tag-large-height);\n border-radius: var(--qds-feedback-tag-large-border-radius);\n }\n\n &.qds-padding {\n padding: var(--qds-feedback-tag-large-padding-vertical)\n var(--qds-feedback-tag-large-padding-horizontal);\n }\n\n &.qds-icon {\n width: var(--qds-feedback-tag-large-icon-size);\n height: var(--qds-feedback-tag-large-icon-size);\n }\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface } from '@stencil/core'\nimport { Component, Element, Fragment, h, Prop } from '@stencil/core'\n\nimport type { Attributes } from '../../helpers'\nimport { inheritAriaAttributes } from '../../helpers'\nimport type { Importance, Size, Status } from '../shared'\n\nexport type TagStatus = Status | 'neutral'\n\n/**\n * The `<qds-tag>` element is a static descriptor used for items that need to\n * be labeled, categorized, or organized using keywords that describe them.\n *\n * @see https://quartz.se.com/build/components/tag\n */\n@Component({\n tag: 'qds-tag',\n shadow: true,\n styleUrl: 'tag.css',\n})\nexport class Tag implements ComponentInterface {\n /**\n * The name of the icon to render.\n *\n * Available names depend on the icon library being used.\n */\n @Prop() public readonly iconName?: string\n\n /**\n * The name of a registered icon library.\n */\n @Prop() public readonly iconLibrary: string = 'default'\n\n /**\n * The tag's importance.\n */\n @Prop() public readonly importance?: Importance = 'standard'\n\n /**\n * The tag's status.\n */\n @Prop() public readonly status?: TagStatus = 'neutral'\n\n /**\n * The tag's size.\n */\n @Prop() public readonly size?: Size = 'standard'\n\n /**\n * The tag's text.\n */\n @Prop() public readonly text?: string\n\n /**\n * Provides a text description of the icon for screen readers.\n */\n @Prop() public readonly iconDescription?: string\n\n /**\n * Displays an indicator if `true`.\n */\n @Prop() public readonly badge?: boolean = false\n\n /**\n * The indicator badge's accessible text that will be used by\n * screen readers.\n */\n @Prop() public readonly badgeDescription?: string\n\n @Element() private readonly host!: HTMLElement\n\n #inheritedAttributes: Attributes = {}\n\n get #computedImportance(): Importance {\n switch (this.importance) {\n case 'subdued':\n case 'emphasized': {\n return this.importance\n }\n default: {\n return 'standard'\n }\n }\n }\n\n get #computedSize(): Size {\n switch (this.size) {\n case 'standard':\n case 'small':\n case 'large': {\n return this.size\n }\n default: {\n return 'standard'\n }\n }\n }\n\n get #computedStatus(): TagStatus {\n switch (this.status) {\n case 'error':\n case 'info':\n case 'success':\n case 'warning': {\n return this.status\n }\n default: {\n return 'neutral'\n }\n }\n }\n\n get #hasBadge(): boolean {\n return (this.badge ?? false) && this.importance !== 'emphasized'\n }\n\n public componentWillLoad(): void {\n this.#inheritedAttributes = inheritAriaAttributes(this.host)\n }\n\n public render() {\n return (\n <span\n class={{\n 'qds-tag': true,\n 'qds-padding': this.importance !== 'subdued',\n }}\n data-importance={this.#computedImportance}\n data-size={this.#computedSize}\n data-status={this.#computedStatus}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...this.#inheritedAttributes}\n >\n {this.iconName !== undefined && this.iconName !== '' ? (\n <>\n {this.iconDescription !== undefined &&\n this.iconDescription !== '' && (\n <span class=\"qds-sr-only\">{this.iconDescription}</span>\n )}\n <qds-icon\n aria-hidden=\"true\"\n class=\"qds-icon\"\n data-size={this.#computedSize}\n library={this.iconLibrary}\n name={this.iconName}\n />\n </>\n ) : (\n this.#hasBadge && (\n <qds-badge-indicator\n status={this.#computedStatus}\n description={this.badgeDescription}\n size={this.#computedSize}\n strokeRing\n />\n )\n )}\n <span class=\"qds-text\">{this.text}</span>\n </span>\n )\n }\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"qds-tag.entry.js","sources":["src/components/tag/tag.css?tag=qds-tag&encapsulation=shadow","src/components/tag/tag.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2024 Schneider Electric\n *\n * SPDX-License-Identifier: Apache-2.0\n */\n\n@import url('../shared.css');\n\n:host {\n display: inline-block;\n}\n\n.qds-tag {\n align-items: center;\n box-sizing: border-box;\n display: inline-flex;\n justify-content: center;\n max-width: inherit;\n min-width: inherit;\n width: inherit;\n}\n\n.qds-text {\n overflow: hidden;\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 5;\n}\n\n.qds-sr-only {\n clip: rect(0 0 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n.qds-icon {\n flex-shrink: 0;\n}\n\n[data-status='error'] {\n color: var(--qds-theme-feedback-message-critical);\n}\n\n[data-status='success'] {\n color: var(--qds-theme-feedback-message-success);\n}\n\n[data-status='warning'] {\n color: var(--qds-theme-feedback-message-important);\n}\n\n[data-status='info'] {\n color: var(--qds-theme-feedback-message-informational);\n}\n\n[data-status='neutral'] {\n color: var(--qds-theme-feedback-message-neutral);\n}\n\n[data-importance='subdued'] .qds-text {\n color: var(--qds-theme-text-standard);\n}\n\n[data-importance='standard'] {\n &[data-status='error'] {\n background-color: var(--qds-theme-feedback-message-critical-dimmed);\n }\n\n &[data-status='success'] {\n background-color: var(--qds-theme-feedback-message-success-dimmed);\n }\n\n &[data-status='warning'] {\n background-color: var(--qds-theme-feedback-message-important-dimmed);\n }\n\n &[data-status='info'] {\n background-color: var(--qds-theme-feedback-message-informational-dimmed);\n }\n\n &[data-status='neutral'] {\n background-color: var(--qds-theme-feedback-message-neutral-dimmed);\n }\n}\n\n[data-importance='emphasized'] {\n &[data-status='error'] {\n background-color: var(--qds-theme-feedback-message-critical);\n color: var(--qds-theme-feedback-message-critical-contrast);\n }\n\n &[data-status='success'] {\n background-color: var(--qds-theme-feedback-message-success);\n color: var(--qds-theme-feedback-message-success-contrast);\n }\n\n &[data-status='warning'] {\n background-color: var(--qds-theme-feedback-message-important);\n color: var(--qds-theme-feedback-message-important-contrast);\n }\n\n &[data-status='info'] {\n background-color: var(--qds-theme-feedback-message-informational);\n color: var(--qds-theme-feedback-message-informational-contrast);\n }\n\n &[data-status='neutral'] {\n background-color: var(--qds-theme-feedback-message-neutral);\n color: var(--qds-theme-feedback-message-neutral-contrast);\n }\n}\n\n[data-size='small'] {\n &.qds-tag {\n font: var(--qds-feedback-tag-small-text);\n gap: var(--qds-feedback-tag-small-gap-internal);\n min-height: var(--qds-feedback-tag-small-height);\n border-radius: var(--qds-feedback-tag-small-border-radius);\n }\n\n &.qds-padding {\n padding: var(--qds-feedback-tag-small-padding-vertical)\n var(--qds-feedback-tag-small-padding-horizontal);\n }\n\n &.qds-icon {\n width: var(--qds-feedback-tag-small-icon-size);\n height: var(--qds-feedback-tag-small-icon-size);\n }\n}\n\n[data-size='standard'] {\n &.qds-tag {\n font: var(--qds-feedback-tag-standard-text);\n gap: var(--qds-feedback-tag-standard-gap-internal);\n min-height: var(--qds-feedback-tag-standard-height);\n border-radius: var(--qds-feedback-tag-standard-border-radius);\n }\n\n &.qds-padding {\n padding: var(--qds-feedback-tag-large-padding-vertical)\n var(--qds-feedback-tag-standard-padding-horizontal);\n }\n\n &.qds-icon {\n width: var(--qds-feedback-tag-standard-icon-size);\n height: var(--qds-feedback-tag-standard-icon-size);\n }\n}\n\n[data-size='large'] {\n &.qds-tag {\n font: var(--qds-feedback-tag-large-text);\n gap: var(--qds-feedback-tag-large-gap-internal);\n min-height: var(--qds-feedback-tag-large-height);\n border-radius: var(--qds-feedback-tag-large-border-radius);\n }\n\n &.qds-padding {\n padding: var(--qds-feedback-tag-large-padding-vertical)\n var(--qds-feedback-tag-large-padding-horizontal);\n }\n\n &.qds-icon {\n width: var(--qds-feedback-tag-large-icon-size);\n height: var(--qds-feedback-tag-large-icon-size);\n }\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface } from '@stencil/core'\nimport { Component, Element, Fragment, h, Prop } from '@stencil/core'\n\nimport type { Attributes } from '../../helpers'\nimport { inheritAriaAttributes } from '../../helpers'\nimport type { Importance, Size, Status } from '../shared'\n\nexport type TagStatus = Status | 'neutral'\n\n/**\n * The `<qds-tag>` element is a static descriptor used for items that need to\n * be labeled, categorized, or organized using keywords that describe them.\n *\n * @see https://quartz.se.com/build/components/tag\n */\n@Component({\n tag: 'qds-tag',\n shadow: true,\n styleUrl: 'tag.css',\n})\nexport class Tag implements ComponentInterface {\n /**\n * The name of the icon to render.\n *\n * Available names depend on the icon library being used.\n */\n @Prop() public readonly iconName?: string\n\n /**\n * The name of a registered icon library.\n */\n @Prop() public readonly iconLibrary: string = 'default'\n\n /**\n * The tag's importance.\n */\n @Prop() public readonly importance?: Importance = 'standard'\n\n /**\n * The tag's status.\n */\n @Prop() public readonly status?: TagStatus = 'neutral'\n\n /**\n * The tag's size.\n */\n @Prop() public readonly size?: Size = 'standard'\n\n /**\n * The tag's text.\n */\n @Prop() public readonly text?: string\n\n /**\n * Provides a text description of the icon for screen readers.\n */\n @Prop() public readonly iconDescription?: string\n\n /**\n * Displays an indicator if `true`.\n */\n @Prop() public readonly badge?: boolean = false\n\n /**\n * The indicator badge's accessible text that will be used by\n * screen readers.\n */\n @Prop() public readonly badgeDescription?: string\n\n @Element() private readonly host!: HTMLElement\n\n #inheritedAttributes: Attributes = {}\n\n get #computedImportance(): Importance {\n switch (this.importance) {\n case 'subdued':\n case 'emphasized': {\n return this.importance\n }\n default: {\n return 'standard'\n }\n }\n }\n\n get #computedSize(): Size {\n switch (this.size) {\n case 'standard':\n case 'small':\n case 'large': {\n return this.size\n }\n default: {\n return 'standard'\n }\n }\n }\n\n get #computedStatus(): TagStatus {\n switch (this.status) {\n case 'error':\n case 'info':\n case 'success':\n case 'warning': {\n return this.status\n }\n default: {\n return 'neutral'\n }\n }\n }\n\n get #hasBadge(): boolean {\n return (this.badge ?? false) && this.importance !== 'emphasized'\n }\n\n public componentWillLoad(): void {\n this.#inheritedAttributes = inheritAriaAttributes(this.host)\n }\n\n public render() {\n return (\n <span\n class={{\n 'qds-tag': true,\n 'qds-padding': this.importance !== 'subdued',\n }}\n data-importance={this.#computedImportance}\n data-size={this.#computedSize}\n data-status={this.#computedStatus}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...this.#inheritedAttributes}\n >\n {this.iconName !== undefined && this.iconName !== '' ? (\n <>\n {this.iconDescription !== undefined &&\n this.iconDescription !== '' && (\n <span class=\"qds-sr-only\">{this.iconDescription}</span>\n )}\n <qds-icon\n class=\"qds-icon\"\n data-size={this.#computedSize}\n library={this.iconLibrary}\n name={this.iconName}\n />\n </>\n ) : (\n this.#hasBadge && (\n <qds-badge-indicator\n status={this.#computedStatus}\n description={this.badgeDescription}\n size={this.#computedSize}\n strokeRing\n />\n )\n )}\n <span class=\"qds-text\">{this.text}</span>\n </span>\n )\n }\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -4,10 +4,10 @@
|
|
|
4
4
|
* SPDX-License-Identifier: Apache-2.0
|
|
5
5
|
*/
|
|
6
6
|
import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-Hg1Liloy.js';
|
|
7
|
-
import { i as invariant, p as pickFocusEventAttributes, e as pickInputEventAttributes, c as inheritAriaAttributes } from './helpers-
|
|
7
|
+
import { i as invariant, p as pickFocusEventAttributes, e as pickInputEventAttributes, c as inheritAriaAttributes } from './helpers-Fe2AA6uo.js';
|
|
8
8
|
import { V as VALID_STATE, C as CUSTOM_ERROR_FLAGS, N as NO_ERROR_FLAGS } from './controls-CZRW1LV_.js';
|
|
9
9
|
|
|
10
|
-
const textareaCss = ":host([hidden]){display:none!important}:host{display:inline-block;resize:both}slot{display:none}.qds-textarea{background-color:var(--qds-theme-form-input-background-active);border:var(--qds-form-input-border-width-default) solid var(--qds-theme-form-input-border-default);border-radius:var(--qds-form-input-border-radius);box-sizing:border-box;color:var(--qds-theme-
|
|
10
|
+
const textareaCss = ":host([hidden]){display:none!important}:host{display:inline-block;resize:both}slot{display:none}.qds-textarea{background-color:var(--qds-theme-form-input-background-active);border:var(--qds-form-input-border-width-default) solid var(--qds-theme-form-input-border-default);border-radius:var(--qds-form-input-border-radius);box-sizing:border-box;color:var(--qds-theme-form-input-text-active);height:100%;padding-inline:var(--qds-control-input-padding-horizontal);resize:inherit;width:100%}.qds-textarea:hover{background-color:var(--qds-theme-form-input-background-hover);border-color:var(--qds-theme-form-input-border-hover)}.qds-textarea:disabled{background-color:var(--qds-theme-form-input-background-default);opacity:var(--qds-theme-disabled);pointer-events:none}.qds-textarea:read-only{background-color:var(--qds-theme-form-input-background-read-only);border-color:var(--qds-theme-form-input-border-disabled)}.qds-textarea:focus-visible{box-shadow:0 0 0 var(--qds-focus-heavy-border-width) var(--qds-theme-focus-border);outline:var(--qds-theme-focus-border-contrast) solid var(--qds-focus-light-border-width);outline-offset:0}.qds-textarea:placeholder-shown{color:var(--qds-theme-control-text-placeholder)}.qds-textarea:not(:focus):user-invalid{border-color:var(--qds-theme-form-input-border-error)}.qds-textarea[data-status]{border-width:var(--qds-form-input-border-width-status) var(\n --qds-form-input-border-width-inline-end,var(--qds-form-input-border-width-status)\n ) var(\n --qds-form-input-border-width-block-end,var(--qds-form-input-border-width-status)\n ) var(--qds-form-input-border-width-status)}.qds-textarea[data-status=success]{border-color:var(--qds-theme-form-input-border-success)}.qds-textarea[data-status=warning]{border-color:var(--qds-theme-form-input-border-warning)}.qds-textarea[data-status=error]{border-color:var(--qds-theme-form-input-border-error)}[data-size=small]{font:var(--qds-control-small-text);padding-block:var(--qds-control-small-padding-auto-height)}[data-size=standard]{font:var(--qds-control-standard-text);padding-block:var(--qds-control-standard-padding-auto-height)}[data-size=large]{font:var(--qds-control-large-text);padding-block:var(--qds-control-large-padding-auto-height)}";
|
|
11
11
|
|
|
12
12
|
// SPDX-FileCopyrightText: © 2024 Schneider Electric
|
|
13
13
|
//
|
|
@@ -266,9 +266,9 @@ const TextArea = class {
|
|
|
266
266
|
this.valueChanged();
|
|
267
267
|
}
|
|
268
268
|
render() {
|
|
269
|
-
return (h(Host, { key: '
|
|
269
|
+
return (h(Host, { key: '3aa4b8a2f3cf4b591a13f6bf029adfe3691087e7' }, h("textarea", { key: 'ba6281ce9a79274d6132c82ec0da48cf25361489', autoCapitalize: this.host.autocapitalize, autoComplete: this.autoComplete,
|
|
270
270
|
// eslint-disable-next-line jsx-a11y/no-autofocus
|
|
271
|
-
autoFocus: this.host.autofocus, class: "qds-textarea", cols: this.cols, "data-size": this.size ?? 'standard', "data-status": __classPrivateFieldGet(this, _TextArea_instances, "a", _TextArea_computedStatus_get), disabled: this.disabled, enterKeyHint: this.enterkeyhint, inputMode: this.inputmode, maxLength: this.maxLength, minLength: this.minLength, onBlur: __classPrivateFieldGet(this, _TextArea_onBlur, "f"), onChange: __classPrivateFieldGet(this, _TextArea_onChange, "f"), onFocus: __classPrivateFieldGet(this, _TextArea_onFocus, "f"), onInput: __classPrivateFieldGet(this, _TextArea_onInput, "f"), placeholder: this.placeholder, ref: __classPrivateFieldGet(this, _TextArea_ref, "f"), readOnly: this.readonly, rows: this.rows, spellcheck: this.host.spellcheck, tabIndex: __classPrivateFieldGet(this, _TextArea_instances, "a", _TextArea_computedDisabled_get) ? undefined : this.tabIndex, wrap: this.wrap, ...__classPrivateFieldGet(this, _TextArea_inheritedAttributes, "f") }), h("slot", { key: '
|
|
271
|
+
autoFocus: this.host.autofocus, class: "qds-textarea", cols: this.cols, "data-size": this.size ?? 'standard', "data-status": __classPrivateFieldGet(this, _TextArea_instances, "a", _TextArea_computedStatus_get), disabled: this.disabled, enterKeyHint: this.enterkeyhint, inputMode: this.inputmode, maxLength: this.maxLength, minLength: this.minLength, onBlur: __classPrivateFieldGet(this, _TextArea_onBlur, "f"), onChange: __classPrivateFieldGet(this, _TextArea_onChange, "f"), onFocus: __classPrivateFieldGet(this, _TextArea_onFocus, "f"), onInput: __classPrivateFieldGet(this, _TextArea_onInput, "f"), placeholder: this.placeholder, ref: __classPrivateFieldGet(this, _TextArea_ref, "f"), readOnly: this.readonly, rows: this.rows, spellcheck: this.host.spellcheck, tabIndex: __classPrivateFieldGet(this, _TextArea_instances, "a", _TextArea_computedDisabled_get) ? undefined : this.tabIndex, wrap: this.wrap, ...__classPrivateFieldGet(this, _TextArea_inheritedAttributes, "f") }), h("slot", { key: '6b3adf605ea2b899ad2f69e7b03505db56682a20', onSlotchange: __classPrivateFieldGet(this, _TextArea_onSlotchange, "f") })));
|
|
272
272
|
}
|
|
273
273
|
static get delegatesFocus() { return true; }
|
|
274
274
|
static get formAssociated() { return true; }
|