@quartzds/core 1.0.0-beta.9 → 1.0.0-beta.91
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/README.md +5 -5
- package/components/index.d.ts +48 -0
- package/components/index.js +60 -28
- package/components/index.js.map +1 -1
- package/components/p-2806fee1.js +1887 -0
- package/components/p-2806fee1.js.map +1 -0
- package/components/p-2bf0797c.js +272 -0
- package/components/p-2bf0797c.js.map +1 -0
- package/components/p-3baf75f4.js +111 -0
- package/components/p-3baf75f4.js.map +1 -0
- package/components/p-3c48ff53.js +103 -0
- package/components/p-3c48ff53.js.map +1 -0
- package/components/p-8abba29b.js +204 -0
- package/components/p-8abba29b.js.map +1 -0
- package/components/p-a020ece3.js +142 -0
- package/components/p-a020ece3.js.map +1 -0
- package/components/p-a6310886.js +144 -0
- package/components/p-a6310886.js.map +1 -0
- package/components/p-b4c302d4.js +91 -0
- package/components/p-b4c302d4.js.map +1 -0
- package/components/p-ba880369.js +256 -0
- package/components/p-ba880369.js.map +1 -0
- package/components/p-c80f112a.js +408 -0
- package/components/p-c80f112a.js.map +1 -0
- package/components/p-d107c90c.js +27 -0
- package/components/p-d107c90c.js.map +1 -0
- package/components/p-d6e52d0b.js +404 -0
- package/components/p-d6e52d0b.js.map +1 -0
- package/components/{floating-ui.dom.esm.js → p-fdd0abae.js} +468 -416
- package/components/p-fdd0abae.js.map +1 -0
- package/components/p-fed0d11f.js +94 -0
- package/components/p-fed0d11f.js.map +1 -0
- package/components/qds-badge-counter.d.ts +11 -0
- package/components/qds-badge-counter.js +13 -0
- package/components/qds-badge-counter.js.map +1 -0
- package/components/qds-badge-indicator.d.ts +11 -0
- package/components/qds-badge-indicator.js +13 -0
- package/components/qds-badge-indicator.js.map +1 -0
- package/components/qds-breadcrumb-item.d.ts +11 -0
- package/components/qds-breadcrumb-item.js +126 -0
- package/components/qds-breadcrumb-item.js.map +1 -0
- package/components/qds-button.d.ts +2 -2
- package/components/qds-button.js +3 -138
- package/components/qds-button.js.map +1 -1
- package/components/qds-checkbox.d.ts +2 -2
- package/components/qds-checkbox.js +3 -146
- package/components/qds-checkbox.js.map +1 -1
- package/components/qds-chip.d.ts +11 -0
- package/components/qds-chip.js +296 -0
- package/components/qds-chip.js.map +1 -0
- package/components/qds-dialog.d.ts +11 -0
- package/components/qds-dialog.js +126 -0
- package/components/qds-dialog.js.map +1 -0
- package/components/qds-divider.d.ts +2 -2
- package/components/qds-divider.js +3 -39
- package/components/qds-divider.js.map +1 -1
- package/components/qds-dropdown.d.ts +2 -2
- package/components/qds-dropdown.js +273 -239
- package/components/qds-dropdown.js.map +1 -1
- package/components/qds-form-message.d.ts +11 -0
- package/components/qds-form-message.js +112 -0
- package/components/qds-form-message.js.map +1 -0
- package/components/qds-icon.d.ts +2 -2
- package/components/qds-icon.js +3 -3
- package/components/qds-inline-link.d.ts +2 -2
- package/components/qds-inline-link.js +136 -73
- package/components/qds-inline-link.js.map +1 -1
- package/components/qds-input.d.ts +2 -2
- package/components/qds-input.js +489 -230
- package/components/qds-input.js.map +1 -1
- package/components/qds-label.d.ts +2 -2
- package/components/qds-label.js +3 -3
- package/components/qds-list-item.d.ts +11 -0
- package/components/qds-list-item.js +212 -0
- package/components/qds-list-item.js.map +1 -0
- package/components/qds-loader.d.ts +11 -0
- package/components/qds-loader.js +113 -0
- package/components/qds-loader.js.map +1 -0
- package/components/qds-nav-list-item.d.ts +11 -0
- package/components/qds-nav-list-item.js +162 -0
- package/components/qds-nav-list-item.js.map +1 -0
- package/components/qds-progress-bar.d.ts +11 -0
- package/components/qds-progress-bar.js +153 -0
- package/components/qds-progress-bar.js.map +1 -0
- package/components/qds-radio.d.ts +2 -2
- package/components/qds-radio.js +147 -93
- package/components/qds-radio.js.map +1 -1
- package/components/qds-select.d.ts +11 -0
- package/components/qds-select.js +361 -0
- package/components/qds-select.js.map +1 -0
- package/components/qds-standalone-link.d.ts +11 -0
- package/components/qds-standalone-link.js +174 -0
- package/components/qds-standalone-link.js.map +1 -0
- package/components/qds-switch.d.ts +2 -2
- package/components/qds-switch.js +221 -105
- package/components/qds-switch.js.map +1 -1
- package/components/qds-tab.d.ts +11 -0
- package/components/qds-tab.js +379 -0
- package/components/qds-tab.js.map +1 -0
- package/components/qds-tabbar.d.ts +11 -0
- package/components/qds-tabbar.js +407 -0
- package/components/qds-tabbar.js.map +1 -0
- package/components/qds-table-body.d.ts +11 -0
- package/components/qds-table-body.js +68 -0
- package/components/qds-table-body.js.map +1 -0
- package/components/qds-table-cell.d.ts +11 -0
- package/components/qds-table-cell.js +71 -0
- package/components/qds-table-cell.js.map +1 -0
- package/components/qds-table-head-cell.d.ts +11 -0
- package/components/qds-table-head-cell.js +73 -0
- package/components/qds-table-head-cell.js.map +1 -0
- package/components/qds-table-head.d.ts +11 -0
- package/components/qds-table-head.js +68 -0
- package/components/qds-table-head.js.map +1 -0
- package/components/qds-table-row.d.ts +11 -0
- package/components/qds-table-row.js +68 -0
- package/components/qds-table-row.js.map +1 -0
- package/components/qds-table.d.ts +11 -0
- package/components/qds-table.js +68 -0
- package/components/qds-table.js.map +1 -0
- package/components/qds-tag.d.ts +11 -0
- package/components/qds-tag.js +13 -0
- package/components/qds-tag.js.map +1 -0
- package/components/qds-textarea.d.ts +2 -2
- package/components/qds-textarea.js +331 -193
- package/components/qds-textarea.js.map +1 -1
- package/components/qds-title.d.ts +2 -2
- package/components/qds-title.js +3 -84
- package/components/qds-title.js.map +1 -1
- package/components/qds-tooltip.d.ts +2 -2
- package/components/qds-tooltip.js +3 -315
- package/components/qds-tooltip.js.map +1 -1
- package/dist/cjs/app-globals-c4cf08df.js +12 -0
- package/dist/cjs/app-globals-c4cf08df.js.map +1 -0
- package/dist/cjs/controls-ee3d2ec8.js +31 -0
- package/dist/cjs/controls-ee3d2ec8.js.map +1 -0
- package/dist/cjs/{floating-ui.dom.esm-71fa96af.js → floating-ui.dom.esm-19b2b933.js} +468 -416
- package/dist/cjs/floating-ui.dom.esm-19b2b933.js.map +1 -0
- package/dist/cjs/helpers-10154521.js +217 -0
- package/dist/cjs/helpers-10154521.js.map +1 -0
- package/dist/cjs/index-523dd2e0.js +2149 -0
- package/dist/cjs/index-523dd2e0.js.map +1 -0
- package/dist/cjs/index.cjs.js +39 -27
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/cjs/library-41b19b9e.js +117 -0
- package/dist/cjs/library-41b19b9e.js.map +1 -0
- package/dist/cjs/loader.cjs.js +8 -6
- package/dist/cjs/loader.cjs.js.map +1 -1
- package/dist/cjs/qds-badge-counter_2.cjs.entry.js +151 -0
- package/dist/cjs/qds-badge-counter_2.cjs.entry.js.map +1 -0
- package/dist/cjs/qds-breadcrumb-item.cjs.entry.js +96 -0
- package/dist/cjs/qds-breadcrumb-item.cjs.entry.js.map +1 -0
- package/dist/cjs/qds-button.cjs.entry.js +321 -90
- package/dist/cjs/qds-button.cjs.entry.js.map +1 -1
- package/dist/cjs/qds-checkbox.cjs.entry.js +212 -100
- package/dist/cjs/qds-checkbox.cjs.entry.js.map +1 -1
- package/dist/cjs/qds-chip.cjs.entry.js +256 -0
- package/dist/cjs/qds-chip.cjs.entry.js.map +1 -0
- package/dist/cjs/qds-dialog.cjs.entry.js +108 -0
- package/dist/cjs/qds-dialog.cjs.entry.js.map +1 -0
- package/dist/cjs/qds-divider.cjs.entry.js +60 -18
- package/dist/cjs/qds-divider.cjs.entry.js.map +1 -1
- package/dist/cjs/qds-dropdown.cjs.entry.js +232 -206
- package/dist/cjs/qds-dropdown.cjs.entry.js.map +1 -1
- package/dist/cjs/qds-form-message.cjs.entry.js +86 -0
- package/dist/cjs/qds-form-message.cjs.entry.js.map +1 -0
- package/dist/cjs/qds-icon.cjs.entry.js +113 -90
- package/dist/cjs/qds-icon.cjs.entry.js.map +1 -1
- package/dist/cjs/qds-inline-link.cjs.entry.js +99 -46
- package/dist/cjs/qds-inline-link.cjs.entry.js.map +1 -1
- package/dist/cjs/qds-input.cjs.entry.js +404 -185
- package/dist/cjs/qds-input.cjs.entry.js.map +1 -1
- package/dist/cjs/qds-label.cjs.entry.js +102 -24
- package/dist/cjs/qds-label.cjs.entry.js.map +1 -1
- package/dist/cjs/qds-list-item.cjs.entry.js +157 -0
- package/dist/cjs/qds-list-item.cjs.entry.js.map +1 -0
- package/dist/cjs/qds-loader.cjs.entry.js +94 -0
- package/dist/cjs/qds-loader.cjs.entry.js.map +1 -0
- package/dist/cjs/qds-nav-list-item.cjs.entry.js +124 -0
- package/dist/cjs/qds-nav-list-item.cjs.entry.js.map +1 -0
- package/dist/cjs/qds-progress-bar.cjs.entry.js +135 -0
- package/dist/cjs/qds-progress-bar.cjs.entry.js.map +1 -0
- package/dist/cjs/qds-radio.cjs.entry.js +102 -57
- package/dist/cjs/qds-radio.cjs.entry.js.map +1 -1
- package/dist/cjs/qds-select.cjs.entry.js +323 -0
- package/dist/cjs/qds-select.cjs.entry.js.map +1 -0
- package/dist/cjs/qds-standalone-link.cjs.entry.js +134 -0
- package/dist/cjs/qds-standalone-link.cjs.entry.js.map +1 -0
- package/dist/cjs/qds-switch.cjs.entry.js +193 -64
- package/dist/cjs/qds-switch.cjs.entry.js.map +1 -1
- package/dist/cjs/qds-tab.cjs.entry.js +299 -0
- package/dist/cjs/qds-tab.cjs.entry.js.map +1 -0
- package/dist/cjs/qds-tabbar.cjs.entry.js +349 -0
- package/dist/cjs/qds-tabbar.cjs.entry.js.map +1 -0
- package/dist/cjs/qds-table-body.cjs.entry.js +54 -0
- package/dist/cjs/qds-table-body.cjs.entry.js.map +1 -0
- package/dist/cjs/qds-table-cell.cjs.entry.js +54 -0
- package/dist/cjs/qds-table-cell.cjs.entry.js.map +1 -0
- package/dist/cjs/qds-table-head-cell.cjs.entry.js +54 -0
- package/dist/cjs/qds-table-head-cell.cjs.entry.js.map +1 -0
- package/dist/cjs/qds-table-head.cjs.entry.js +54 -0
- package/dist/cjs/qds-table-head.cjs.entry.js.map +1 -0
- package/dist/cjs/qds-table-row.cjs.entry.js +54 -0
- package/dist/cjs/qds-table-row.cjs.entry.js.map +1 -0
- package/dist/cjs/qds-table.cjs.entry.js +54 -0
- package/dist/cjs/qds-table.cjs.entry.js.map +1 -0
- package/dist/cjs/qds-tag_2.cjs.entry.js +181 -0
- package/dist/cjs/qds-tag_2.cjs.entry.js.map +1 -0
- package/dist/cjs/qds-textarea.cjs.entry.js +288 -153
- package/dist/cjs/qds-textarea.cjs.entry.js.map +1 -1
- package/dist/cjs/qds-tooltip.cjs.entry.js +332 -260
- package/dist/cjs/qds-tooltip.cjs.entry.js.map +1 -1
- package/dist/cjs/qds.cjs.js +15 -13
- package/dist/cjs/qds.cjs.js.map +1 -1
- package/dist/custom-elements.json +8727 -2151
- package/dist/docs.d.ts +344 -240
- package/dist/docs.json +9364 -2903
- package/dist/esm/app-globals-8ced3a41.js +10 -0
- package/dist/esm/app-globals-8ced3a41.js.map +1 -0
- package/dist/esm/controls-a4768aaf.js +27 -0
- package/dist/esm/controls-a4768aaf.js.map +1 -0
- package/dist/esm/{floating-ui.dom.esm-f96ac766.js → floating-ui.dom.esm-61986f35.js} +468 -416
- package/dist/esm/floating-ui.dom.esm-61986f35.js.map +1 -0
- package/dist/esm/helpers-2e4ca34d.js +204 -0
- package/dist/esm/helpers-2e4ca34d.js.map +1 -0
- package/dist/esm/index-b1d6acd2.js +2118 -0
- package/dist/esm/index-b1d6acd2.js.map +1 -0
- package/dist/esm/index.js +39 -28
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/library-2e5458af.js +113 -0
- package/dist/esm/library-2e5458af.js.map +1 -0
- package/dist/esm/loader.js +9 -7
- package/dist/esm/loader.js.map +1 -1
- package/dist/esm/qds-badge-counter_2.entry.js +146 -0
- package/dist/esm/qds-badge-counter_2.entry.js.map +1 -0
- package/dist/esm/qds-breadcrumb-item.entry.js +92 -0
- package/dist/esm/qds-breadcrumb-item.entry.js.map +1 -0
- package/dist/esm/qds-button.entry.js +321 -90
- package/dist/esm/qds-button.entry.js.map +1 -1
- package/dist/esm/qds-checkbox.entry.js +212 -100
- package/dist/esm/qds-checkbox.entry.js.map +1 -1
- package/dist/esm/qds-chip.entry.js +252 -0
- package/dist/esm/qds-chip.entry.js.map +1 -0
- package/dist/esm/qds-dialog.entry.js +104 -0
- package/dist/esm/qds-dialog.entry.js.map +1 -0
- package/dist/esm/qds-divider.entry.js +60 -18
- package/dist/esm/qds-divider.entry.js.map +1 -1
- package/dist/esm/qds-dropdown.entry.js +232 -206
- package/dist/esm/qds-dropdown.entry.js.map +1 -1
- package/dist/esm/qds-form-message.entry.js +82 -0
- package/dist/esm/qds-form-message.entry.js.map +1 -0
- package/dist/esm/qds-icon.entry.js +113 -90
- package/dist/esm/qds-icon.entry.js.map +1 -1
- package/dist/esm/qds-inline-link.entry.js +99 -46
- package/dist/esm/qds-inline-link.entry.js.map +1 -1
- package/dist/esm/qds-input.entry.js +404 -185
- package/dist/esm/qds-input.entry.js.map +1 -1
- package/dist/esm/qds-label.entry.js +102 -24
- package/dist/esm/qds-label.entry.js.map +1 -1
- package/dist/esm/qds-list-item.entry.js +153 -0
- package/dist/esm/qds-list-item.entry.js.map +1 -0
- package/dist/esm/qds-loader.entry.js +90 -0
- package/dist/esm/qds-loader.entry.js.map +1 -0
- package/dist/esm/qds-nav-list-item.entry.js +120 -0
- package/dist/esm/qds-nav-list-item.entry.js.map +1 -0
- package/dist/esm/qds-progress-bar.entry.js +131 -0
- package/dist/esm/qds-progress-bar.entry.js.map +1 -0
- package/dist/esm/qds-radio.entry.js +102 -57
- package/dist/esm/qds-radio.entry.js.map +1 -1
- package/dist/esm/qds-select.entry.js +319 -0
- package/dist/esm/qds-select.entry.js.map +1 -0
- package/dist/esm/qds-standalone-link.entry.js +130 -0
- package/dist/esm/qds-standalone-link.entry.js.map +1 -0
- package/dist/esm/qds-switch.entry.js +193 -64
- package/dist/esm/qds-switch.entry.js.map +1 -1
- package/dist/esm/qds-tab.entry.js +295 -0
- package/dist/esm/qds-tab.entry.js.map +1 -0
- package/dist/esm/qds-tabbar.entry.js +345 -0
- package/dist/esm/qds-tabbar.entry.js.map +1 -0
- package/dist/esm/qds-table-body.entry.js +50 -0
- package/dist/esm/qds-table-body.entry.js.map +1 -0
- package/dist/esm/qds-table-cell.entry.js +50 -0
- package/dist/esm/qds-table-cell.entry.js.map +1 -0
- package/dist/esm/qds-table-head-cell.entry.js +50 -0
- package/dist/esm/qds-table-head-cell.entry.js.map +1 -0
- package/dist/esm/qds-table-head.entry.js +50 -0
- package/dist/esm/qds-table-head.entry.js.map +1 -0
- package/dist/esm/qds-table-row.entry.js +50 -0
- package/dist/esm/qds-table-row.entry.js.map +1 -0
- package/dist/esm/qds-table.entry.js +50 -0
- package/dist/esm/qds-table.entry.js.map +1 -0
- package/dist/esm/qds-tag_2.entry.js +176 -0
- package/dist/esm/qds-tag_2.entry.js.map +1 -0
- package/dist/esm/qds-textarea.entry.js +288 -153
- package/dist/esm/qds-textarea.entry.js.map +1 -1
- package/dist/esm/qds-tooltip.entry.js +332 -260
- package/dist/esm/qds-tooltip.entry.js.map +1 -1
- package/dist/esm/qds.js +16 -14
- package/dist/esm/qds.js.map +1 -1
- package/dist/types/components/badge-counter/badge-counter.d.ts +40 -0
- package/dist/types/components/badge-indicator/badge-indicator.d.ts +36 -0
- package/dist/types/components/breadcrumb-item/breadcrumb-item.d.ts +160 -0
- package/dist/types/components/button/button.d.ts +272 -194
- package/dist/types/components/checkbox/checkbox.d.ts +137 -124
- package/dist/types/components/chip/chip.d.ts +109 -0
- package/dist/types/components/controls.d.ts +4 -1
- package/dist/types/components/dialog/dialog.d.ts +35 -0
- package/dist/types/components/divider/divider.d.ts +13 -9
- package/dist/types/components/dropdown/dropdown.d.ts +107 -125
- package/dist/types/components/form-message/form-message.d.ts +42 -0
- package/dist/types/components/icon/icon.d.ts +24 -24
- package/dist/types/components/icon/library.d.ts +3 -3
- package/dist/types/components/icon/request.d.ts +5 -9
- package/dist/types/components/inline-link/inline-link.d.ts +208 -191
- package/dist/types/components/input/input.d.ts +415 -368
- package/dist/types/components/label/label.d.ts +26 -24
- package/dist/types/components/list-item/list-item.d.ts +100 -0
- package/dist/types/components/loader/loader.d.ts +27 -0
- package/dist/types/components/nav-list-item/nav-list-item.d.ts +67 -0
- package/dist/types/components/progress-bar/progress-bar.d.ts +60 -0
- package/dist/types/components/radio/radio.d.ts +90 -95
- package/dist/types/components/select/select.d.ts +203 -0
- package/dist/types/components/shared.d.ts +6 -0
- package/dist/types/components/standalone-link/standalone-link.d.ts +233 -0
- package/dist/types/components/switch/switch.d.ts +114 -107
- package/dist/types/components/tab/tab.d.ts +160 -0
- package/dist/types/components/tabbar/tabbar.d.ts +47 -0
- package/dist/types/components/table/table.d.ts +15 -0
- package/dist/types/components/table-body/table-body.d.ts +15 -0
- package/dist/types/components/table-cell/table-cell.d.ts +32 -0
- package/dist/types/components/table-head/table-head.d.ts +15 -0
- package/dist/types/components/table-head-cell/table-head-cell.d.ts +56 -0
- package/dist/types/components/table-row/table-row.d.ts +15 -0
- package/dist/types/components/tag/tag.d.ts +55 -0
- package/dist/types/components/textarea/textarea.d.ts +285 -300
- package/dist/types/components/title/title.d.ts +39 -32
- package/dist/types/components/tooltip/tooltip.d.ts +123 -137
- package/dist/types/components.d.ts +3957 -833
- package/dist/types/helpers.d.ts +15 -16
- package/dist/types/index.d.ts +2 -1
- package/dist/types/interface-overrides.d.ts +211 -0
- package/dist/types/qds-test.d.ts +22 -11
- package/dist/types/stencil-public-runtime.d.ts +55 -15
- package/dist/types/utils.d.ts +11 -4
- package/dist/vscode.html-custom-data.json +1528 -210
- package/hydrate/index.d.ts +59 -18
- package/hydrate/index.js +25724 -9014
- package/hydrate/index.mjs +26627 -0
- package/hydrate/package.json +7 -1
- package/loader/cdn.js +3 -4
- package/loader/index.cjs.js +3 -4
- package/loader/index.d.ts +4 -1
- package/loader/index.es2017.js +3 -4
- package/loader/index.js +3 -4
- package/package.json +53 -89
- package/styles/core.css +137 -14
- package/components/floating-ui.dom.esm.js.map +0 -1
- package/components/helpers.js +0 -175
- package/components/helpers.js.map +0 -1
- package/components/icon.js +0 -175
- package/components/icon.js.map +0 -1
- package/components/label.js +0 -55
- package/components/label.js.map +0 -1
- package/dist/cjs/floating-ui.dom.esm-71fa96af.js.map +0 -1
- package/dist/cjs/helpers-452256e8.js +0 -185
- package/dist/cjs/helpers-452256e8.js.map +0 -1
- package/dist/cjs/index-d181f952.js +0 -2039
- package/dist/cjs/index-d181f952.js.map +0 -1
- package/dist/cjs/library-0a619eeb.js +0 -62
- package/dist/cjs/library-0a619eeb.js.map +0 -1
- package/dist/cjs/qds-title.cjs.entry.js +0 -66
- package/dist/cjs/qds-title.cjs.entry.js.map +0 -1
- package/dist/esm/floating-ui.dom.esm-f96ac766.js.map +0 -1
- package/dist/esm/helpers-76b84f45.js +0 -175
- package/dist/esm/helpers-76b84f45.js.map +0 -1
- package/dist/esm/index-d7183092.js +0 -2009
- package/dist/esm/index-d7183092.js.map +0 -1
- package/dist/esm/library-021aca11.js +0 -58
- package/dist/esm/library-021aca11.js.map +0 -1
- package/dist/esm/polyfills/core-js.js +0 -11
- package/dist/esm/polyfills/dom.js +0 -79
- package/dist/esm/polyfills/es5-html-element.js +0 -1
- package/dist/esm/polyfills/index.js +0 -34
- package/dist/esm/polyfills/system.js +0 -6
- package/dist/esm/qds-title.entry.js +0 -62
- package/dist/esm/qds-title.entry.js.map +0 -1
- package/dist/types/components/create-story.d.ts +0 -5
|
@@ -0,0 +1,90 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* SPDX-FileCopyrightText: © 2025 Schneider Electric
|
|
3
|
+
*
|
|
4
|
+
* SPDX-License-Identifier: Apache-2.0
|
|
5
|
+
*/
|
|
6
|
+
import { r as registerInstance, h, a as getElement } from './index-b1d6acd2.js';
|
|
7
|
+
|
|
8
|
+
const loaderCss = ":host([hidden]){display:none!important}:host{display:inline-block}.qds-loader{border-radius:var(--qds-control-rounded-border-radius);box-sizing:border-box;color:var(--qds-theme-feedback-action-destructive-contrast)}[data-size=small]{height:var(--qds-control-small-icon-size);padding:var(--qds-signature-circle-progress-small-border-width);width:var(--qds-control-small-icon-size)}[data-size=standard]{height:var(--qds-control-standard-icon-size);padding:var(--qds-signature-circle-progress-standard-border-width);width:var(--qds-control-standard-icon-size)}[data-size=large]{height:var(--qds-control-large-icon-size);padding:var(--qds-signature-circle-progress-large-border-width);width:var(--qds-control-large-icon-size)}[data-size=jumbo]{height:var(--qds-control-jumbo-icon-size);padding:var(--qds-signature-circle-progress-jumbo-border-width);width:var(--qds-control-jumbo-icon-size)}[data-status=loading]{animation:a 1s linear infinite;background-image:var(--qds-theme-signature-circle-progress-indeterminate);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude}@keyframes a{to{transform:rotate(1turn)}}[data-status=success]{background-color:var(--qds-theme-feedback-result-success)}[data-status=warning]{background-color:var(--qds-theme-feedback-result-partial-success)}[data-status=error]{background-color:var(--qds-theme-feedback-result-failure)}";
|
|
9
|
+
const QdsLoaderStyle0 = loaderCss;
|
|
10
|
+
|
|
11
|
+
// SPDX-FileCopyrightText: © 2024 Schneider Electric
|
|
12
|
+
//
|
|
13
|
+
// SPDX-License-Identifier: Apache-2.0
|
|
14
|
+
var __classPrivateFieldGet = (undefined && undefined.__classPrivateFieldGet) || function (receiver, state, kind, f) {
|
|
15
|
+
if (kind === "a" && !f)
|
|
16
|
+
throw new TypeError("Private accessor was defined without a getter");
|
|
17
|
+
if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
|
|
18
|
+
throw new TypeError("Cannot read private member from an object whose class did not declare it");
|
|
19
|
+
return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
|
|
20
|
+
};
|
|
21
|
+
var _Loader_instances, _Loader_computedSize_get, _Loader_computedStatus_get, _Loader_defineGetter;
|
|
22
|
+
const Loader = class {
|
|
23
|
+
constructor(hostRef) {
|
|
24
|
+
registerInstance(this, hostRef);
|
|
25
|
+
if (hostRef.$hostElement$["s-ei"]) {
|
|
26
|
+
this.internals = hostRef.$hostElement$["s-ei"];
|
|
27
|
+
}
|
|
28
|
+
else {
|
|
29
|
+
this.internals = hostRef.$hostElement$.attachInternals();
|
|
30
|
+
hostRef.$hostElement$["s-ei"] = this.internals;
|
|
31
|
+
}
|
|
32
|
+
_Loader_instances.add(this);
|
|
33
|
+
/**
|
|
34
|
+
* The loader's size.
|
|
35
|
+
*/
|
|
36
|
+
this.size = 'standard';
|
|
37
|
+
}
|
|
38
|
+
statusChanged() {
|
|
39
|
+
this.internals.ariaValueNow =
|
|
40
|
+
__classPrivateFieldGet(this, _Loader_instances, "a", _Loader_computedStatus_get) === 'loading'
|
|
41
|
+
? // eslint-disable-next-line unicorn/no-null
|
|
42
|
+
null
|
|
43
|
+
: this.internals.ariaValueMax;
|
|
44
|
+
}
|
|
45
|
+
componentWillLoad() {
|
|
46
|
+
this.internals.role = 'progressbar';
|
|
47
|
+
this.internals.ariaValueMin = this.host.ariaValueMin ?? '0';
|
|
48
|
+
this.internals.ariaValueMax = this.host.ariaValueMax ?? '1';
|
|
49
|
+
__classPrivateFieldGet(this, _Loader_instances, "m", _Loader_defineGetter).call(this, 'labels', () => this.internals.labels);
|
|
50
|
+
this.statusChanged();
|
|
51
|
+
}
|
|
52
|
+
render() {
|
|
53
|
+
return __classPrivateFieldGet(this, _Loader_instances, "a", _Loader_computedStatus_get) === 'loading' ? (h("div", { "aria-hidden": "true", class: "qds-loader", "data-size": __classPrivateFieldGet(this, _Loader_instances, "a", _Loader_computedSize_get), "data-status": __classPrivateFieldGet(this, _Loader_instances, "a", _Loader_computedStatus_get) })) : (h("qds-icon", { "aria-hidden": "true", class: "qds-loader", "data-size": __classPrivateFieldGet(this, _Loader_instances, "a", _Loader_computedSize_get), "data-status": __classPrivateFieldGet(this, _Loader_instances, "a", _Loader_computedStatus_get), library: "core", name: `status-${this.status}` }));
|
|
54
|
+
}
|
|
55
|
+
static get formAssociated() { return true; }
|
|
56
|
+
get host() { return getElement(this); }
|
|
57
|
+
static get watchers() { return {
|
|
58
|
+
"status": ["statusChanged"]
|
|
59
|
+
}; }
|
|
60
|
+
};
|
|
61
|
+
_Loader_instances = new WeakSet(), _Loader_computedSize_get = function _Loader_computedSize_get() {
|
|
62
|
+
switch (this.size) {
|
|
63
|
+
case 'small':
|
|
64
|
+
case 'large':
|
|
65
|
+
case 'jumbo': {
|
|
66
|
+
return this.size;
|
|
67
|
+
}
|
|
68
|
+
default: {
|
|
69
|
+
return 'standard';
|
|
70
|
+
}
|
|
71
|
+
}
|
|
72
|
+
}, _Loader_computedStatus_get = function _Loader_computedStatus_get() {
|
|
73
|
+
switch (this.status) {
|
|
74
|
+
case 'error':
|
|
75
|
+
case 'success':
|
|
76
|
+
case 'warning': {
|
|
77
|
+
return this.status;
|
|
78
|
+
}
|
|
79
|
+
default: {
|
|
80
|
+
return 'loading';
|
|
81
|
+
}
|
|
82
|
+
}
|
|
83
|
+
}, _Loader_defineGetter = function _Loader_defineGetter(p, get) {
|
|
84
|
+
Object.defineProperty(this.host, p, { enumerable: true, get });
|
|
85
|
+
};
|
|
86
|
+
Loader.style = QdsLoaderStyle0;
|
|
87
|
+
|
|
88
|
+
export { Loader as qds_loader };
|
|
89
|
+
|
|
90
|
+
//# sourceMappingURL=qds-loader.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"qds-loader.entry.js","mappings":";;;;;;;AAAA,MAAM,SAAS,GAAG,29CAA29C,CAAC;AAC9+C,wBAAe,SAAS;;ACDxB;AACA;AACA;;;;;;;;;MA6Ba,MAAM;IANnB;;;;;;;;;;;;;QAU0B,SAAI,GAAgB,UAAU,CAAA;KA8EvD;IAxCW,aAAa;QACrB,IAAI,CAAC,SAAS,CAAC,YAAY;YACzB,uBAAA,IAAI,qDAAgB,KAAK,SAAS;;oBAE9B,IAAI;kBACJ,IAAI,CAAC,SAAS,CAAC,YAAY,CAAA;KAClC;IAEM,iBAAiB;QACtB,IAAI,CAAC,SAAS,CAAC,IAAI,GAAG,aAAa,CAAA;QACnC,IAAI,CAAC,SAAS,CAAC,YAAY,GAAG,IAAI,CAAC,IAAI,CAAC,YAAY,IAAI,GAAG,CAAA;QAC3D,IAAI,CAAC,SAAS,CAAC,YAAY,GAAG,IAAI,CAAC,IAAI,CAAC,YAAY,IAAI,GAAG,CAAA;QAC3D,uBAAA,IAAI,+CAAc,MAAlB,IAAI,EAAe,QAAQ,EAAE,MAAM,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CAAA;QAEzD,IAAI,CAAC,aAAa,EAAE,CAAA;KACrB;IAEM,MAAM;QACX,OAAO,uBAAA,IAAI,qDAAgB,KAAK,SAAS,IACvC,0BACc,MAAM,EAClB,KAAK,EAAC,YAAY,eACP,uBAAA,IAAI,mDAAc,iBAChB,uBAAA,IAAI,qDAAgB,GACjC,KAEF,+BACc,MAAM,EAClB,KAAK,EAAC,YAAY,eACP,uBAAA,IAAI,mDAAc,iBAChB,uBAAA,IAAI,qDAAgB,EACjC,OAAO,EAAC,MAAM,EACd,IAAI,EAAE,UAAU,IAAI,CAAC,MAAM,EAAE,GAC7B,CACH,CAAA;KACF;;;;;;;;IA7DC,QAAQ,IAAI,CAAC,IAAI;QACf,KAAK,OAAO,CAAC;QACb,KAAK,OAAO,CAAC;QACb,KAAK,OAAO,EAAE;YACZ,OAAO,IAAI,CAAC,IAAI,CAAA;SACjB;QACD,SAAS;YACP,OAAO,UAAU,CAAA;SAClB;KACF;AACH,CAAC;IAGC,QAAQ,IAAI,CAAC,MAAM;QACjB,KAAK,OAAO,CAAC;QACb,KAAK,SAAS,CAAC;QACf,KAAK,SAAS,EAAE;YACd,OAAO,IAAI,CAAC,MAAM,CAAA;SACnB;QACD,SAAS;YACP,OAAO,SAAS,CAAA;SACjB;KACF;AACH,CAAC,uDAwCa,CAAc,EAAE,GAAkB;IAC9C,MAAM,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAE,CAAC,CAAA;AAChE,CAAC;;;;;","names":[],"sources":["src/components/loader/loader.css?tag=qds-loader&encapsulation=shadow","src/components/loader/loader.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-loader {\n border-radius: var(--qds-control-rounded-border-radius);\n box-sizing: border-box;\n color: var(--qds-theme-feedback-action-destructive-contrast);\n}\n\n[data-size='small'] {\n padding: var(--qds-signature-circle-progress-small-border-width);\n height: var(--qds-control-small-icon-size);\n width: var(--qds-control-small-icon-size);\n}\n\n[data-size='standard'] {\n padding: var(--qds-signature-circle-progress-standard-border-width);\n height: var(--qds-control-standard-icon-size);\n width: var(--qds-control-standard-icon-size);\n}\n\n[data-size='large'] {\n padding: var(--qds-signature-circle-progress-large-border-width);\n height: var(--qds-control-large-icon-size);\n width: var(--qds-control-large-icon-size);\n}\n\n[data-size='jumbo'] {\n padding: var(--qds-signature-circle-progress-jumbo-border-width);\n height: var(--qds-control-jumbo-icon-size);\n width: var(--qds-control-jumbo-icon-size);\n}\n\n[data-status='loading'] {\n animation: loading 1s linear infinite;\n background-image: var(--qds-theme-signature-circle-progress-indeterminate);\n /* stylelint-disable color-no-hex, declaration-property-value-no-unknown */\n mask:\n linear-gradient(#fff 0 0) content-box,\n linear-gradient(#fff 0 0);\n /* stylelint-enable color-no-hex, declaration-property-value-no-unknown */\n mask-composite: exclude;\n}\n\n@keyframes loading {\n to {\n transform: rotate(1turn);\n }\n}\n\n[data-status='success'] {\n background-color: var(--qds-theme-feedback-result-success);\n}\n\n[data-status='warning'] {\n background-color: var(--qds-theme-feedback-result-partial-success);\n}\n\n[data-status='error'] {\n background-color: var(--qds-theme-feedback-result-failure);\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface } from '@stencil/core'\nimport {\n AttachInternals,\n Component,\n Element,\n h,\n Prop,\n Watch,\n} from '@stencil/core'\n\nimport type { Size } from '../shared'\n\nexport type LoaderSize = Size | 'jumbo'\nexport type LoaderStatus = 'error' | 'success' | 'warning'\n\n/**\n * The `<qds-loader>` element displays an indicator showing that content is\n * being loaded or processed.\n *\n * @see https://quartz.se.com/build/components/loader\n */\n@Component({\n tag: 'qds-loader',\n formAssociated: true,\n shadow: true,\n styleUrl: 'loader.css',\n})\nexport class Loader implements ComponentInterface {\n /**\n * The loader's size.\n */\n @Prop() public readonly size?: LoaderSize = 'standard'\n\n /**\n * The loader's status.\n */\n @Prop() public readonly status?: LoaderStatus\n\n @Element() private readonly host!: HTMLElement\n\n @AttachInternals() private readonly internals!: ElementInternals\n\n get #computedSize(): LoaderSize {\n switch (this.size) {\n case 'small':\n case 'large':\n case 'jumbo': {\n return this.size\n }\n default: {\n return 'standard'\n }\n }\n }\n\n get #computedStatus(): LoaderStatus | 'loading' {\n switch (this.status) {\n case 'error':\n case 'success':\n case 'warning': {\n return this.status\n }\n default: {\n return 'loading'\n }\n }\n }\n\n @Watch('status')\n protected statusChanged(): void {\n this.internals.ariaValueNow =\n this.#computedStatus === 'loading'\n ? // eslint-disable-next-line unicorn/no-null\n null\n : this.internals.ariaValueMax\n }\n\n public componentWillLoad(): void {\n this.internals.role = 'progressbar'\n this.internals.ariaValueMin = this.host.ariaValueMin ?? '0'\n this.internals.ariaValueMax = this.host.ariaValueMax ?? '1'\n this.#defineGetter('labels', () => this.internals.labels)\n\n this.statusChanged()\n }\n\n public render() {\n return this.#computedStatus === 'loading' ? (\n <div\n aria-hidden=\"true\"\n class=\"qds-loader\"\n data-size={this.#computedSize}\n data-status={this.#computedStatus}\n />\n ) : (\n <qds-icon\n aria-hidden=\"true\"\n class=\"qds-loader\"\n data-size={this.#computedSize}\n data-status={this.#computedStatus}\n library=\"core\"\n name={`status-${this.status}`}\n />\n )\n }\n\n #defineGetter(p: PropertyKey, get: () => unknown): void {\n Object.defineProperty(this.host, p, { enumerable: true, get })\n }\n}\n"],"version":3}
|
|
@@ -0,0 +1,120 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* SPDX-FileCopyrightText: © 2025 Schneider Electric
|
|
3
|
+
*
|
|
4
|
+
* SPDX-License-Identifier: Apache-2.0
|
|
5
|
+
*/
|
|
6
|
+
import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-b1d6acd2.js';
|
|
7
|
+
import { p as pickFocusEventAttributes, b as inheritAriaAttributes } from './helpers-2e4ca34d.js';
|
|
8
|
+
|
|
9
|
+
const navListItemCss = ":host([hidden]){display:none!important}:host{display:block}.qds-button,.qds-nav-list-item,.qds-texts{display:flex}.qds-button,.qds-texts{flex:1 0}.qds-icon,.qds-text{color:var(--qds-theme-title)}.qds-button{align-items:center;-webkit-appearance:none;appearance:none;background:none;border:none;cursor:pointer;text-align:initial}.qds-button:focus-visible{border-radius:var(--qds-focus-border-radius);outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width)}.qds-button:not(.qds-selected):hover{background-color:var(--qds-theme-interactive-background-hover)}.qds-button:not(.qds-selected):active{background-color:var(--qds-theme-interactive-background-pressed)}.qds-disabled{opacity:var(--qds-theme-disabled);pointer-events:none}.qds-subtext{color:var(--qds-theme-subtitle)}.qds-texts{flex-direction:column}.qds-button[data-size=small]{gap:var(--qds-list-item-small-gap-internal);min-height:var(--qds-list-item-small-height);padding-block:var(--qds-list-item-small-padding-vertical);padding-inline:var(--qds-list-item-small-padding-horizontal)}[data-size=small]>.qds-icon{font-size:var(--qds-list-item-small-icon-size)}[data-size=small]>.qds-texts{gap:var(--qds-list-item-small-titles-gap)}[data-size=small] .qds-text{font:var(--qds-list-item-small-title)}[data-size=small] .qds-subtext{font:var(--qds-list-item-small-subtitle)}.qds-button[data-size=standard]{gap:var(--qds-list-item-standard-gap-internal);min-height:var(--qds-list-item-standard-height);padding-block:var(--qds-list-item-standard-padding-vertical);padding-inline:var(--qds-list-item-standard-padding-horizontal)}[data-size=standard]>.qds-icon{font-size:var(--qds-list-item-standard-icon-size)}[data-size=standard]>.qds-texts{gap:var(--qds-list-item-standard-titles-gap)}[data-size=standard] .qds-text{font:var(--qds-list-item-standard-title)}[data-size=standard] .qds-subtext{font:var(--qds-list-item-standard-subtitle)}.qds-button[data-size=large]{gap:var(--qds-list-item-large-gap-internal);min-height:var(--qds-list-item-large-height);padding-block:var(--qds-list-item-large-padding-vertical);padding-inline:var(--qds-list-item-large-padding-horizontal)}[data-size=large]>.qds-icon{font-size:var(--qds-list-item-large-icon-size)}[data-size=large]>.qds-texts{gap:var(--qds-list-item-large-titles-gap)}[data-size=large] .qds-text{font:var(--qds-list-item-large-title)}[data-size=large] .qds-subtext{font:var(--qds-list-item-large-subtitle)}.qds-selected.qds-nav-list-item{background-color:var(\n --qds-theme-navigation-subsection-standard-background\n )}.qds-selected.qds-nav-list-item:after{background-color:var(--qds-theme-signature-color-default);border-radius:var(--qds-signature-line-connection-cap-radius);content:\"\";cursor:pointer;margin-right:calc(var(--qds-signature-line-connection-width)*-1/2);width:var(--qds-signature-line-connection-width)}.qds-selected .qds-icon{color:var(--qds-theme-signature-color-default)}.qds-selected[data-size=small] .qds-text{font:var(--qds-list-item-small-title-emphasized)}.qds-selected[data-size=standard] .qds-text{font:var(--qds-list-item-standard-title-emphasized)}.qds-selected[data-size=large] .qds-text{font:var(--qds-list-item-large-title-emphasized)}";
|
|
10
|
+
const QdsNavListItemStyle0 = navListItemCss;
|
|
11
|
+
|
|
12
|
+
// SPDX-FileCopyrightText: © 2024 Schneider Electric
|
|
13
|
+
//
|
|
14
|
+
// SPDX-License-Identifier: Apache-2.0
|
|
15
|
+
var __classPrivateFieldGet = (undefined && undefined.__classPrivateFieldGet) || function (receiver, state, kind, f) {
|
|
16
|
+
if (kind === "a" && !f)
|
|
17
|
+
throw new TypeError("Private accessor was defined without a getter");
|
|
18
|
+
if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
|
|
19
|
+
throw new TypeError("Cannot read private member from an object whose class did not declare it");
|
|
20
|
+
return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
|
|
21
|
+
};
|
|
22
|
+
var _NavListItem_instances, _NavListItem_computedSize_get, _NavListItem_shouldCollapse_get, _NavListItem_liRef, _NavListItem_tooltipRef, _NavListItem_onBlur, _NavListItem_onFocus;
|
|
23
|
+
const NavListItem = class {
|
|
24
|
+
constructor(hostRef) {
|
|
25
|
+
registerInstance(this, hostRef);
|
|
26
|
+
this.blurEmitter = createEvent(this, "qdsBlur", 2);
|
|
27
|
+
this.focusEmitter = createEvent(this, "qdsFocus", 2);
|
|
28
|
+
_NavListItem_instances.add(this);
|
|
29
|
+
/**
|
|
30
|
+
* Displays the navigation list item in a collapsed state without its text.
|
|
31
|
+
* The text will be displayed in a tooltip instead.
|
|
32
|
+
*
|
|
33
|
+
* This property has no effect if the navigation list item does not have an
|
|
34
|
+
* icon set.
|
|
35
|
+
*/
|
|
36
|
+
this.collapsed = false;
|
|
37
|
+
/**
|
|
38
|
+
* Prevents the navigation list item from being interacted with: it cannot be
|
|
39
|
+
* selected or focused.
|
|
40
|
+
*/
|
|
41
|
+
this.disabled = false;
|
|
42
|
+
/**
|
|
43
|
+
* The name of a registered icon library.
|
|
44
|
+
*/
|
|
45
|
+
this.iconLibrary = 'default';
|
|
46
|
+
/**
|
|
47
|
+
* The navigation list items's size.
|
|
48
|
+
*/
|
|
49
|
+
this.size = 'standard';
|
|
50
|
+
/**
|
|
51
|
+
* Whether or not the navigation list item is selected.
|
|
52
|
+
*/
|
|
53
|
+
this.selected = false;
|
|
54
|
+
this.inheritedAttributes = {};
|
|
55
|
+
_NavListItem_liRef.set(this, (li) => {
|
|
56
|
+
this.li = li;
|
|
57
|
+
});
|
|
58
|
+
_NavListItem_tooltipRef.set(this, (tooltip) => {
|
|
59
|
+
if (tooltip)
|
|
60
|
+
// eslint-disable-next-line no-param-reassign
|
|
61
|
+
tooltip.target = this.li;
|
|
62
|
+
});
|
|
63
|
+
_NavListItem_onBlur.set(this, (event) => {
|
|
64
|
+
this.blurEmitter.emit(pickFocusEventAttributes(event));
|
|
65
|
+
});
|
|
66
|
+
_NavListItem_onFocus.set(this, (event) => {
|
|
67
|
+
this.focusEmitter.emit(pickFocusEventAttributes(event));
|
|
68
|
+
});
|
|
69
|
+
}
|
|
70
|
+
onClick(event) {
|
|
71
|
+
if (this.disabled)
|
|
72
|
+
event.stopImmediatePropagation();
|
|
73
|
+
}
|
|
74
|
+
tabindexChanged(newValue) {
|
|
75
|
+
const parsedValue = Number.parseInt(newValue, 10);
|
|
76
|
+
this.tabIndex =
|
|
77
|
+
parsedValue === 0 || Number.isNaN(parsedValue) ? undefined : parsedValue;
|
|
78
|
+
}
|
|
79
|
+
componentWillLoad() {
|
|
80
|
+
this.inheritedAttributes = inheritAriaAttributes(this.host);
|
|
81
|
+
this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0');
|
|
82
|
+
}
|
|
83
|
+
render() {
|
|
84
|
+
return (h(Host, { key: 'd8fa60da531b9bd93a16c3e21f8d3ac3986c61a0' }, h("li", { key: 'fc5237181a7ec072fa4643e5b6702b25843698ae', class: {
|
|
85
|
+
'qds-nav-list-item': true,
|
|
86
|
+
'qds-disabled': this.disabled,
|
|
87
|
+
'qds-selected': this.selected,
|
|
88
|
+
}, ref: __classPrivateFieldGet(this, _NavListItem_liRef, "f"), ...this.inheritedAttributes }, h("button", { key: '07ed4f3b4b369565bfa3807969d0d45795c66694', class: {
|
|
89
|
+
'qds-button': true,
|
|
90
|
+
'qds-selected': this.selected,
|
|
91
|
+
}, "data-size": __classPrivateFieldGet(this, _NavListItem_instances, "a", _NavListItem_computedSize_get), disabled: this.disabled, onBlur: __classPrivateFieldGet(this, _NavListItem_onBlur, "f"), onFocus: __classPrivateFieldGet(this, _NavListItem_onFocus, "f"), tabIndex: this.disabled ? undefined : this.tabIndex, type: "button" }, this.iconName !== undefined && this.iconName !== '' && (h("qds-icon", { key: '920ce703bd408a135c97d0efa29da86bb8b08bc2', "aria-hidden": "true", class: "qds-icon", library: this.iconLibrary, name: this.iconName })), !__classPrivateFieldGet(this, _NavListItem_instances, "a", _NavListItem_shouldCollapse_get) && this.text && this.renderText())), __classPrivateFieldGet(this, _NavListItem_instances, "a", _NavListItem_shouldCollapse_get) && this.text && (h("qds-tooltip", { key: '6cf3305f81a62bc2f1146298bfcd109f96ee7281', placement: "right", ref: __classPrivateFieldGet(this, _NavListItem_tooltipRef, "f") }, this.renderText()))));
|
|
92
|
+
}
|
|
93
|
+
renderText() {
|
|
94
|
+
return (h("div", { class: "qds-texts" }, h("div", { class: "qds-text" }, this.text), this.subtext !== undefined && this.subtext !== '' && (h("div", { class: "qds-subtext" }, this.subtext))));
|
|
95
|
+
}
|
|
96
|
+
static get delegatesFocus() { return true; }
|
|
97
|
+
get host() { return getElement(this); }
|
|
98
|
+
static get watchers() { return {
|
|
99
|
+
"tabindex": ["tabindexChanged"]
|
|
100
|
+
}; }
|
|
101
|
+
};
|
|
102
|
+
_NavListItem_liRef = new WeakMap(), _NavListItem_tooltipRef = new WeakMap(), _NavListItem_onBlur = new WeakMap(), _NavListItem_onFocus = new WeakMap(), _NavListItem_instances = new WeakSet(), _NavListItem_computedSize_get = function _NavListItem_computedSize_get() {
|
|
103
|
+
switch (this.size) {
|
|
104
|
+
case 'standard':
|
|
105
|
+
case 'small':
|
|
106
|
+
case 'large': {
|
|
107
|
+
return this.size;
|
|
108
|
+
}
|
|
109
|
+
default: {
|
|
110
|
+
return 'standard';
|
|
111
|
+
}
|
|
112
|
+
}
|
|
113
|
+
}, _NavListItem_shouldCollapse_get = function _NavListItem_shouldCollapse_get() {
|
|
114
|
+
return this.collapsed && this.iconName !== undefined && this.iconName !== '';
|
|
115
|
+
};
|
|
116
|
+
NavListItem.style = QdsNavListItemStyle0;
|
|
117
|
+
|
|
118
|
+
export { NavListItem as qds_nav_list_item };
|
|
119
|
+
|
|
120
|
+
//# sourceMappingURL=qds-nav-list-item.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"qds-nav-list-item.entry.js","mappings":"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","names":[],"sources":["src/components/nav-list-item/nav-list-item.css?tag=qds-nav-list-item&encapsulation=shadow","src/components/nav-list-item/nav-list-item.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-button,\n.qds-nav-list-item,\n.qds-texts {\n display: flex;\n}\n\n.qds-button,\n.qds-texts {\n flex: 1 0;\n}\n\n.qds-icon,\n.qds-text {\n color: var(--qds-theme-title);\n}\n\n.qds-button {\n align-items: center;\n appearance: none;\n background: none;\n border: none;\n cursor: pointer;\n text-align: initial;\n\n &:focus-visible {\n outline: var(--qds-theme-focus-border) solid var(--qds-focus-border-width);\n border-radius: var(--qds-focus-border-radius);\n }\n\n &:not(.qds-selected) {\n &:hover {\n background-color: var(--qds-theme-interactive-background-hover);\n }\n\n &:active {\n background-color: var(--qds-theme-interactive-background-pressed);\n }\n }\n}\n\n.qds-disabled {\n opacity: var(--qds-theme-disabled);\n pointer-events: none;\n}\n\n.qds-subtext {\n color: var(--qds-theme-subtitle);\n}\n\n.qds-texts {\n flex-direction: column;\n}\n\n[data-size='small'] {\n &.qds-button {\n gap: var(--qds-list-item-small-gap-internal);\n min-height: var(--qds-list-item-small-height);\n padding-block: var(--qds-list-item-small-padding-vertical);\n padding-inline: var(--qds-list-item-small-padding-horizontal);\n }\n\n & > .qds-icon {\n font-size: var(--qds-list-item-small-icon-size);\n }\n\n & > .qds-texts {\n gap: var(--qds-list-item-small-titles-gap);\n }\n\n & .qds-text {\n font: var(--qds-list-item-small-title);\n }\n\n & .qds-subtext {\n font: var(--qds-list-item-small-subtitle);\n }\n}\n\n[data-size='standard'] {\n &.qds-button {\n gap: var(--qds-list-item-standard-gap-internal);\n min-height: var(--qds-list-item-standard-height);\n padding-block: var(--qds-list-item-standard-padding-vertical);\n padding-inline: var(--qds-list-item-standard-padding-horizontal);\n }\n\n & > .qds-icon {\n font-size: var(--qds-list-item-standard-icon-size);\n }\n\n & > .qds-texts {\n gap: var(--qds-list-item-standard-titles-gap);\n }\n\n & .qds-text {\n font: var(--qds-list-item-standard-title);\n }\n\n & .qds-subtext {\n font: var(--qds-list-item-standard-subtitle);\n }\n}\n\n[data-size='large'] {\n &.qds-button {\n gap: var(--qds-list-item-large-gap-internal);\n min-height: var(--qds-list-item-large-height);\n padding-block: var(--qds-list-item-large-padding-vertical);\n padding-inline: var(--qds-list-item-large-padding-horizontal);\n }\n\n & > .qds-icon {\n font-size: var(--qds-list-item-large-icon-size);\n }\n\n & > .qds-texts {\n gap: var(--qds-list-item-large-titles-gap);\n }\n\n & .qds-text {\n font: var(--qds-list-item-large-title);\n }\n\n & .qds-subtext {\n font: var(--qds-list-item-large-subtitle);\n }\n}\n\n.qds-selected {\n &.qds-nav-list-item {\n background-color: var(\n --qds-theme-navigation-subsection-standard-background\n );\n\n &::after {\n background-color: var(--qds-theme-signature-color-default);\n border-radius: var(--qds-signature-line-connection-cap-radius);\n content: '';\n cursor: pointer;\n margin-right: calc(-1 * var(--qds-signature-line-connection-width) / 2);\n width: var(--qds-signature-line-connection-width);\n }\n }\n\n & .qds-icon {\n color: var(--qds-theme-signature-color-default);\n }\n\n &[data-size='small'] .qds-text {\n font: var(--qds-list-item-small-title-emphasized);\n }\n\n &[data-size='standard'] .qds-text {\n font: var(--qds-list-item-standard-title-emphasized);\n }\n\n &[data-size='large'] .qds-text {\n font: var(--qds-list-item-large-title-emphasized);\n }\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface, EventEmitter, JSX } from '@stencil/core'\nimport {\n Component,\n Element,\n Event,\n h,\n Host,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core'\n\nimport type { Attributes, QdsFocusEventDetail } from '../../helpers'\nimport { inheritAriaAttributes, pickFocusEventAttributes } from '../../helpers'\nimport type { Size } from '../shared'\n\n/**\n *\n *\n * @see https://quartz.se.com/build/components/nav-list-item\n */\n@Component({\n tag: 'qds-nav-list-item',\n shadow: { delegatesFocus: true },\n styleUrl: 'nav-list-item.css',\n})\nexport class NavListItem implements ComponentInterface {\n /**\n * Displays the navigation list item in a collapsed state without its text.\n * The text will be displayed in a tooltip instead.\n *\n * This property has no effect if the navigation list item does not have an\n * icon set.\n */\n @Prop() public readonly collapsed: boolean = false\n\n /**\n * Prevents the navigation list item from being interacted with: it cannot be\n * selected or focused.\n */\n @Prop() public readonly disabled: boolean = false\n\n /**\n * The name of the icon to render.\n *\n * Available names depend on the icon library being used.\n */\n @Prop() public readonly iconName?: string\n\n /**\n * The name of a registered icon library.\n */\n @Prop() public readonly iconLibrary: string = 'default'\n\n /**\n * The navigation list items's size.\n */\n @Prop() public readonly size?: Size = 'standard'\n\n /**\n * Whether or not the navigation list item is selected.\n */\n @Prop() public readonly selected: boolean = false\n\n /**\n * Text to display for the subtext.\n */\n @Prop() public readonly subtext?: string\n\n /**\n * Primary text to display.\n */\n @Prop() public readonly text!: string\n\n /**\n * Emitted when the navigation list item loses focus.\n */\n @Event({ eventName: 'qdsBlur', bubbles: false, cancelable: false })\n private readonly blurEmitter!: EventEmitter<QdsFocusEventDetail>\n\n /**\n * Emitted when the navigation list item gains focus.\n */\n @Event({ eventName: 'qdsFocus', bubbles: false, cancelable: false })\n private readonly focusEmitter!: EventEmitter<QdsFocusEventDetail>\n\n @Element() private readonly host!: HTMLElement\n\n @State() private tabIndex?: number\n\n private inheritedAttributes: Attributes = {}\n\n private li?: HTMLLIElement\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 #shouldCollapse(): boolean {\n return this.collapsed && this.iconName !== undefined && this.iconName !== ''\n }\n\n @Listen('click')\n protected onClick(event: MouseEvent): void {\n if (this.disabled) event.stopImmediatePropagation()\n }\n\n @Watch('tabindex')\n protected tabindexChanged(newValue: string): void {\n const parsedValue = Number.parseInt(newValue, 10)\n this.tabIndex =\n parsedValue === 0 || Number.isNaN(parsedValue) ? undefined : parsedValue\n }\n\n public componentWillLoad(): void {\n this.inheritedAttributes = inheritAriaAttributes(this.host)\n this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0')\n }\n\n public render() {\n return (\n <Host>\n <li\n class={{\n 'qds-nav-list-item': true,\n 'qds-disabled': this.disabled,\n 'qds-selected': this.selected,\n }}\n ref={this.#liRef}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...this.inheritedAttributes}\n >\n <button\n class={{\n 'qds-button': true,\n 'qds-selected': this.selected,\n }}\n data-size={this.#computedSize}\n disabled={this.disabled}\n onBlur={this.#onBlur}\n onFocus={this.#onFocus}\n tabIndex={this.disabled ? undefined : this.tabIndex}\n type=\"button\"\n >\n {this.iconName !== undefined && this.iconName !== '' && (\n <qds-icon\n aria-hidden=\"true\"\n class=\"qds-icon\"\n library={this.iconLibrary}\n name={this.iconName}\n />\n )}\n {!this.#shouldCollapse && this.text && this.renderText()}\n </button>\n </li>\n {this.#shouldCollapse && this.text && (\n <qds-tooltip placement=\"right\" ref={this.#tooltipRef}>\n {this.renderText()}\n </qds-tooltip>\n )}\n </Host>\n )\n }\n\n private renderText(): JSX.Element {\n return (\n <div class=\"qds-texts\">\n <div class=\"qds-text\">{this.text}</div>\n {this.subtext !== undefined && this.subtext !== '' && (\n <div class=\"qds-subtext\">{this.subtext}</div>\n )}\n </div>\n )\n }\n\n readonly #liRef = (li?: HTMLLIElement): void => {\n this.li = li\n }\n\n readonly #tooltipRef = (tooltip?: HTMLQdsTooltipElement): void => {\n if (tooltip)\n // eslint-disable-next-line no-param-reassign\n tooltip.target = this.li\n }\n\n readonly #onBlur = (event: FocusEvent): void => {\n this.blurEmitter.emit(pickFocusEventAttributes(event))\n }\n\n readonly #onFocus = (event: FocusEvent): void => {\n this.focusEmitter.emit(pickFocusEventAttributes(event))\n }\n}\n"],"version":3}
|
|
@@ -0,0 +1,131 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* SPDX-FileCopyrightText: © 2025 Schneider Electric
|
|
3
|
+
*
|
|
4
|
+
* SPDX-License-Identifier: Apache-2.0
|
|
5
|
+
*/
|
|
6
|
+
import { r as registerInstance, h, a as getElement } from './index-b1d6acd2.js';
|
|
7
|
+
|
|
8
|
+
const progressBarCss = ":host([hidden]){display:none!important}:host{display:block;width:100%}.qds-bar,.qds-track{overflow:hidden}.qds-track{background-color:var(--qds-theme-control-slider-track-inactive)}.qds-bar,.qds-track{border-radius:var(--qds-signature-line-progress-cap-radius)}.qds-bar{background-color:var(--qds-theme-signature-line-progress-determinate);transition:width .6s cubic-bezier(.83,0,.17,1)}@media (prefers-reduced-motion){.qds-bar{transition:none}}.qds-indeterminate{animation:b 2s linear infinite;background-color:initial;background-image:var(--qds-theme-signature-line-progress-indeterminate)}@keyframes b{0%{transform:translateX(-100%)}to{transform:translateX(200%)}}[data-size=small]{height:var(--qds-signature-line-progress-small-height)}[data-size=standard]{height:var(--qds-signature-line-progress-standard-height)}[data-size=large]{height:var(--qds-signature-line-progress-large-height)}";
|
|
9
|
+
const QdsProgressBarStyle0 = progressBarCss;
|
|
10
|
+
|
|
11
|
+
// SPDX-FileCopyrightText: © 2024 Schneider Electric
|
|
12
|
+
//
|
|
13
|
+
// SPDX-License-Identifier: Apache-2.0
|
|
14
|
+
var __classPrivateFieldSet = (undefined && undefined.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
|
|
15
|
+
if (kind === "m")
|
|
16
|
+
throw new TypeError("Private method is not writable");
|
|
17
|
+
if (kind === "a" && !f)
|
|
18
|
+
throw new TypeError("Private accessor was defined without a setter");
|
|
19
|
+
if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
|
|
20
|
+
throw new TypeError("Cannot write private member to an object whose class did not declare it");
|
|
21
|
+
return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
|
|
22
|
+
};
|
|
23
|
+
var __classPrivateFieldGet = (undefined && undefined.__classPrivateFieldGet) || function (receiver, state, kind, f) {
|
|
24
|
+
if (kind === "a" && !f)
|
|
25
|
+
throw new TypeError("Private accessor was defined without a getter");
|
|
26
|
+
if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
|
|
27
|
+
throw new TypeError("Cannot read private member from an object whose class did not declare it");
|
|
28
|
+
return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
|
|
29
|
+
};
|
|
30
|
+
var _ProgressBar_instances, _ProgressBar_localMax, _ProgressBar_localValue, _ProgressBar_position, _ProgressBar_computedSize_get, _ProgressBar_positionChanged, _ProgressBar_defineGetter;
|
|
31
|
+
const ProgressBar = class {
|
|
32
|
+
constructor(hostRef) {
|
|
33
|
+
registerInstance(this, hostRef);
|
|
34
|
+
if (hostRef.$hostElement$["s-ei"]) {
|
|
35
|
+
this.internals = hostRef.$hostElement$["s-ei"];
|
|
36
|
+
}
|
|
37
|
+
else {
|
|
38
|
+
this.internals = hostRef.$hostElement$.attachInternals();
|
|
39
|
+
hostRef.$hostElement$["s-ei"] = this.internals;
|
|
40
|
+
}
|
|
41
|
+
_ProgressBar_instances.add(this);
|
|
42
|
+
/**
|
|
43
|
+
* The progress bar's size.
|
|
44
|
+
*/
|
|
45
|
+
this.size = 'standard';
|
|
46
|
+
/**
|
|
47
|
+
* Returns a list of the [`<label>`][] elements associated with the
|
|
48
|
+
* `qds-progress-bar` element.
|
|
49
|
+
*
|
|
50
|
+
* [`<label>`]: https://developer.mozilla.org/docs/Web/HTML/Element/label
|
|
51
|
+
*
|
|
52
|
+
* @readonly
|
|
53
|
+
* @webnative
|
|
54
|
+
*/
|
|
55
|
+
this.labels = {};
|
|
56
|
+
/**
|
|
57
|
+
* Returns the result of dividing the current value (`value`) by the maximum
|
|
58
|
+
* value (`max`); if the progress bar is an indeterminate progress bar, it
|
|
59
|
+
* returns `-1`.
|
|
60
|
+
*
|
|
61
|
+
* @readonly
|
|
62
|
+
* @webnative
|
|
63
|
+
*/
|
|
64
|
+
this.position = -1;
|
|
65
|
+
this.width = '0%';
|
|
66
|
+
_ProgressBar_localMax.set(this, 1);
|
|
67
|
+
_ProgressBar_localValue.set(this, 0);
|
|
68
|
+
_ProgressBar_position.set(this, -1);
|
|
69
|
+
}
|
|
70
|
+
maxChanged() {
|
|
71
|
+
const max = typeof this.max === 'string' ? Number.parseFloat(this.max) : this.max;
|
|
72
|
+
__classPrivateFieldSet(this, _ProgressBar_localMax, max === undefined || Number.isNaN(max) || max < 0 ? 1 : max, "f");
|
|
73
|
+
this.internals.ariaValueMax = __classPrivateFieldGet(this, _ProgressBar_localMax, "f").toString();
|
|
74
|
+
__classPrivateFieldGet(this, _ProgressBar_instances, "m", _ProgressBar_positionChanged).call(this);
|
|
75
|
+
}
|
|
76
|
+
valueChanged() {
|
|
77
|
+
const value = typeof this.value === 'string'
|
|
78
|
+
? Number.parseFloat(this.value)
|
|
79
|
+
: this.value;
|
|
80
|
+
__classPrivateFieldSet(this, _ProgressBar_localValue, value === undefined || Number.isNaN(value) || value < 0 ? 0 : value, "f");
|
|
81
|
+
this.internals.ariaValueNow =
|
|
82
|
+
// eslint-disable-next-line unicorn/no-null
|
|
83
|
+
this.value === undefined ? null : __classPrivateFieldGet(this, _ProgressBar_localValue, "f").toString();
|
|
84
|
+
__classPrivateFieldGet(this, _ProgressBar_instances, "m", _ProgressBar_positionChanged).call(this);
|
|
85
|
+
}
|
|
86
|
+
componentWillLoad() {
|
|
87
|
+
this.internals.role = 'progressbar';
|
|
88
|
+
__classPrivateFieldGet(this, _ProgressBar_instances, "m", _ProgressBar_defineGetter).call(this, 'labels', () => this.internals.labels);
|
|
89
|
+
__classPrivateFieldGet(this, _ProgressBar_instances, "m", _ProgressBar_defineGetter).call(this, 'position', () => __classPrivateFieldGet(this, _ProgressBar_position, "f"));
|
|
90
|
+
this.maxChanged();
|
|
91
|
+
this.valueChanged();
|
|
92
|
+
}
|
|
93
|
+
render() {
|
|
94
|
+
return (h("div", { key: 'a27fc224ae0a302c1303a7f8e3495b7085078b5f', "aria-hidden": "true", class: "qds-track", "data-size": __classPrivateFieldGet(this, _ProgressBar_instances, "a", _ProgressBar_computedSize_get) }, h("div", { key: '35b538fed23adf5c01bc92c00dd9cf220ddd0634', class: {
|
|
95
|
+
'qds-bar': true,
|
|
96
|
+
'qds-indeterminate': __classPrivateFieldGet(this, _ProgressBar_position, "f") === -1,
|
|
97
|
+
}, "data-size": __classPrivateFieldGet(this, _ProgressBar_instances, "a", _ProgressBar_computedSize_get), style: { width: this.width } })));
|
|
98
|
+
}
|
|
99
|
+
static get formAssociated() { return true; }
|
|
100
|
+
get host() { return getElement(this); }
|
|
101
|
+
static get watchers() { return {
|
|
102
|
+
"max": ["maxChanged"],
|
|
103
|
+
"value": ["valueChanged"]
|
|
104
|
+
}; }
|
|
105
|
+
};
|
|
106
|
+
_ProgressBar_localMax = new WeakMap(), _ProgressBar_localValue = new WeakMap(), _ProgressBar_position = new WeakMap(), _ProgressBar_instances = new WeakSet(), _ProgressBar_computedSize_get = function _ProgressBar_computedSize_get() {
|
|
107
|
+
switch (this.size) {
|
|
108
|
+
case 'small':
|
|
109
|
+
case 'large': {
|
|
110
|
+
return this.size;
|
|
111
|
+
}
|
|
112
|
+
default: {
|
|
113
|
+
return 'standard';
|
|
114
|
+
}
|
|
115
|
+
}
|
|
116
|
+
}, _ProgressBar_positionChanged = function _ProgressBar_positionChanged() {
|
|
117
|
+
if (this.value === undefined) {
|
|
118
|
+
__classPrivateFieldSet(this, _ProgressBar_position, -1, "f");
|
|
119
|
+
this.width = '50%';
|
|
120
|
+
return;
|
|
121
|
+
}
|
|
122
|
+
__classPrivateFieldSet(this, _ProgressBar_position, __classPrivateFieldGet(this, _ProgressBar_localValue, "f") / __classPrivateFieldGet(this, _ProgressBar_localMax, "f"), "f");
|
|
123
|
+
this.width = `${Math.min(__classPrivateFieldGet(this, _ProgressBar_position, "f") * 100, 100)}%`;
|
|
124
|
+
}, _ProgressBar_defineGetter = function _ProgressBar_defineGetter(p, get) {
|
|
125
|
+
Object.defineProperty(this.host, p, { enumerable: true, get });
|
|
126
|
+
};
|
|
127
|
+
ProgressBar.style = QdsProgressBarStyle0;
|
|
128
|
+
|
|
129
|
+
export { ProgressBar as qds_progress_bar };
|
|
130
|
+
|
|
131
|
+
//# sourceMappingURL=qds-progress-bar.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"qds-progress-bar.entry.js","mappings":"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","names":[],"sources":["src/components/progress-bar/progress-bar.css?tag=qds-progress-bar&encapsulation=shadow","src/components/progress-bar/progress-bar.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 width: 100%;\n}\n\n.qds-track,\n.qds-bar {\n overflow: hidden;\n}\n\n.qds-track {\n background-color: var(--qds-theme-control-slider-track-inactive);\n border-radius: var(--qds-signature-line-progress-cap-radius);\n}\n\n.qds-bar {\n background-color: var(--qds-theme-signature-line-progress-determinate);\n border-radius: var(--qds-signature-line-progress-cap-radius);\n transition: width 0.6s cubic-bezier(0.83, 0, 0.17, 1);\n}\n\n@media (prefers-reduced-motion) {\n .qds-bar {\n transition: none;\n }\n}\n\n.qds-indeterminate {\n animation: indeterminate 2s linear infinite;\n background-color: transparent;\n background-image: var(--qds-theme-signature-line-progress-indeterminate);\n}\n\n@keyframes indeterminate {\n from {\n transform: translateX(-100%);\n }\n\n to {\n transform: translateX(200%);\n }\n}\n\n[data-size='small'] {\n height: var(--qds-signature-line-progress-small-height);\n}\n\n[data-size='standard'] {\n height: var(--qds-signature-line-progress-standard-height);\n}\n\n[data-size='large'] {\n height: var(--qds-signature-line-progress-large-height);\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface } from '@stencil/core'\nimport {\n AttachInternals,\n Component,\n Element,\n h,\n Prop,\n State,\n Watch,\n} from '@stencil/core'\n\nimport type { Size } from '../shared'\n\n/**\n * The `<qds-progress-bar>` element displays an indicator showing the\n * completion progress of a task.\n *\n * @see https://quartz.se.com/build/components/progress-bar\n */\n@Component({\n tag: 'qds-progress-bar',\n formAssociated: true,\n shadow: true,\n styleUrl: 'progress-bar.css',\n})\nexport class ProgressBar implements ComponentInterface {\n /**\n * The progress bar's size.\n */\n @Prop() public readonly size?: Size = 'standard'\n\n /**\n * Returns a list of the [`<label>`][] elements associated with the\n * `qds-progress-bar` element.\n *\n * [`<label>`]: https://developer.mozilla.org/docs/Web/HTML/Element/label\n *\n * @readonly\n * @webnative\n */\n @Prop() public readonly labels: ElementInternals['labels'] =\n {} as ElementInternals['labels']\n\n /**\n * Specifies how much work the task indicated by the progress bar requires.\n * `max` must have a value greater than 0 and be a valid floating point\n * number.\n *\n * @webnative\n */\n @Prop() public readonly max?: number | string\n\n /**\n * Returns the result of dividing the current value (`value`) by the maximum\n * value (`max`); if the progress bar is an indeterminate progress bar, it\n * returns `-1`.\n *\n * @readonly\n * @webnative\n */\n @Prop() public readonly position: number = -1\n\n /**\n * Specifies how much of the task has been completed. It must be a valid\n * floating point number between `0` and `max`, or between `0` and `1` if\n * `max` is omitted. If this attribute is not specified, the progress bar is\n * indeterminate; this indicates that an activity is ongoing with no\n * indication of how long it is expected to take.\n *\n * @webnative\n */\n @Prop() public readonly value?: number | string\n\n @Element() private readonly host!: HTMLElement\n\n @AttachInternals() private readonly internals!: ElementInternals\n\n @State() private width = '0%'\n\n #localMax = 1\n\n #localValue = 0\n\n #position = -1\n\n get #computedSize(): Size {\n switch (this.size) {\n case 'small':\n case 'large': {\n return this.size\n }\n default: {\n return 'standard'\n }\n }\n }\n\n @Watch('max')\n protected maxChanged(): void {\n const max =\n typeof this.max === 'string' ? Number.parseFloat(this.max) : this.max\n this.#localMax = max === undefined || Number.isNaN(max) || max < 0 ? 1 : max\n\n this.internals.ariaValueMax = this.#localMax.toString()\n\n this.#positionChanged()\n }\n\n @Watch('value')\n protected valueChanged(): void {\n const value =\n typeof this.value === 'string'\n ? Number.parseFloat(this.value)\n : this.value\n this.#localValue =\n value === undefined || Number.isNaN(value) || value < 0 ? 0 : value\n\n this.internals.ariaValueNow =\n // eslint-disable-next-line unicorn/no-null\n this.value === undefined ? null : this.#localValue.toString()\n\n this.#positionChanged()\n }\n\n public componentWillLoad(): void {\n this.internals.role = 'progressbar'\n this.#defineGetter('labels', () => this.internals.labels)\n this.#defineGetter('position', () => this.#position)\n\n this.maxChanged()\n this.valueChanged()\n }\n\n public render() {\n return (\n <div aria-hidden=\"true\" class=\"qds-track\" data-size={this.#computedSize}>\n <div\n class={{\n 'qds-bar': true,\n 'qds-indeterminate': this.#position === -1,\n }}\n data-size={this.#computedSize}\n style={{ width: this.width }}\n />\n </div>\n )\n }\n\n #positionChanged(): void {\n if (this.value === undefined) {\n this.#position = -1\n this.width = '50%'\n return\n }\n\n this.#position = this.#localValue / this.#localMax\n this.width = `${Math.min(this.#position * 100, 100)}%`\n }\n\n #defineGetter(p: PropertyKey, get: () => unknown): void {\n Object.defineProperty(this.host, p, { enumerable: true, get })\n }\n}\n"],"version":3}
|
|
@@ -1,69 +1,114 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* SPDX-FileCopyrightText: ©
|
|
2
|
+
* SPDX-FileCopyrightText: © 2025 Schneider Electric
|
|
3
3
|
*
|
|
4
|
-
* SPDX-License-Identifier:
|
|
4
|
+
* SPDX-License-Identifier: Apache-2.0
|
|
5
5
|
*/
|
|
6
|
-
import { r as registerInstance, c as createEvent, h, a as getElement } from './index-
|
|
7
|
-
import { p as pickFocusEventAttributes,
|
|
6
|
+
import { r as registerInstance, c as createEvent, h, a as getElement } from './index-b1d6acd2.js';
|
|
7
|
+
import { p as pickFocusEventAttributes, c as invariant, b as inheritAriaAttributes } from './helpers-2e4ca34d.js';
|
|
8
8
|
|
|
9
|
-
const radioCss = ".sc-qds-radio-h{
|
|
9
|
+
const radioCss = "[hidden].sc-qds-radio-h{display:none!important}.sc-qds-radio-h{display:inline-block;line-height:0}.qds-box.sc-qds-radio,.qds-icon.sc-qds-radio,.qds-radio.sc-qds-radio{grid-area:i;place-self:center}.qds-box.sc-qds-radio,.qds-icon.sc-qds-radio{display:none;pointer-events:none}.qds-box.sc-qds-radio{border-radius:var(--qds-control-rounded-border-radius)}.qds-container.sc-qds-radio{align-self:flex-start;display:grid;grid-template-areas:\"i\"}.qds-icon.sc-qds-radio{color:var(--qds-theme-signature-color-contrast)}.qds-label.sc-qds-radio{cursor:pointer;display:inline-flex}.qds-radio.sc-qds-radio{-webkit-appearance:none;appearance:none;background-color:var(--qds-theme-control-input-background);border:var(--qds-control-border-width) solid var(--qds-theme-control-border);border-radius:var(--qds-control-rounded-border-radius);cursor:pointer;margin:0;-webkit-print-color-adjust:exact;print-color-adjust:exact}.qds-radio.sc-qds-radio:focus-visible{outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width);outline-offset:var(--qds-focus-border-offset)}.qds-radio.sc-qds-radio:active~.qds-box.sc-qds-radio,.qds-radio.sc-qds-radio:hover~.qds-box.sc-qds-radio{display:block}.qds-radio.sc-qds-radio:hover~.qds-box.sc-qds-radio{background-color:var(--qds-theme-signature-color-hover)}.qds-radio.sc-qds-radio:active~.qds-box.sc-qds-radio{background-color:var(--qds-theme-signature-color-pressed)}.qds-radio.sc-qds-radio:checked{background-color:var(--qds-theme-signature-color-default);border-color:#0000}.qds-radio.sc-qds-radio:checked~.qds-icon.sc-qds-radio{display:block}.qds-radio.sc-qds-radio:checked:hover{background-color:var(--qds-theme-signature-color-hover)}.qds-radio.sc-qds-radio:checked:active{background-color:var(--qds-theme-signature-color-pressed)}[aria-disabled=true].sc-qds-radio{opacity:var(--qds-theme-disabled);pointer-events:none}.qds-radio[data-size=small].sc-qds-radio{height:var(--qds-control-toggle-box-small-size);width:var(--qds-control-toggle-box-small-size)}.qds-icon[data-size=small].sc-qds-radio{font-size:var(--qds-control-small-icon-size)}.qds-box[data-size=small].sc-qds-radio{height:var(--qds-control-toggle-indicator-small-size);width:var(--qds-control-toggle-indicator-small-size)}.qds-inline[data-size=small].sc-qds-radio{margin-block:var(--qds-control-small-padding-auto-height)}.qds-label[data-size=small].sc-qds-radio{gap:var(--qds-control-small-gap-siblings-related)}.qds-radio[data-size=standard].sc-qds-radio{height:var(--qds-control-toggle-box-standard-size);width:var(--qds-control-toggle-box-standard-size)}.qds-icon[data-size=standard].sc-qds-radio{font-size:var(--qds-control-standard-icon-size)}.qds-box[data-size=standard].sc-qds-radio{height:var(--qds-control-toggle-indicator-standard-size);width:var(--qds-control-toggle-indicator-standard-size)}.qds-inline[data-size=standard].sc-qds-radio{margin-block:var(--qds-control-standard-padding-auto-height)}.qds-label[data-size=standard].sc-qds-radio{gap:var(--qds-control-standard-gap-siblings-related)}.qds-radio[data-size=large].sc-qds-radio{height:var(--qds-control-toggle-box-large-size);width:var(--qds-control-toggle-box-large-size)}.qds-icon[data-size=large].sc-qds-radio{font-size:var(--qds-control-large-icon-size)}.qds-box[data-size=large].sc-qds-radio{height:var(--qds-control-toggle-indicator-large-size);width:var(--qds-control-toggle-indicator-large-size)}.qds-inline[data-size=large].sc-qds-radio{margin-block:var(--qds-control-large-padding-auto-height)}.qds-label[data-size=large].sc-qds-radio{gap:var(--qds-control-large-gap-siblings-related)}";
|
|
10
|
+
const QdsRadioStyle0 = radioCss;
|
|
10
11
|
|
|
12
|
+
// SPDX-FileCopyrightText: © 2024 Schneider Electric
|
|
13
|
+
//
|
|
14
|
+
// SPDX-License-Identifier: Apache-2.0
|
|
15
|
+
var __classPrivateFieldGet = (undefined && undefined.__classPrivateFieldGet) || function (receiver, state, kind, f) {
|
|
16
|
+
if (kind === "a" && !f)
|
|
17
|
+
throw new TypeError("Private accessor was defined without a getter");
|
|
18
|
+
if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
|
|
19
|
+
throw new TypeError("Cannot read private member from an object whose class did not declare it");
|
|
20
|
+
return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
|
|
21
|
+
};
|
|
22
|
+
var __classPrivateFieldSet = (undefined && undefined.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
|
|
23
|
+
if (kind === "m")
|
|
24
|
+
throw new TypeError("Private method is not writable");
|
|
25
|
+
if (kind === "a" && !f)
|
|
26
|
+
throw new TypeError("Private accessor was defined without a setter");
|
|
27
|
+
if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
|
|
28
|
+
throw new TypeError("Cannot write private member to an object whose class did not declare it");
|
|
29
|
+
return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
|
|
30
|
+
};
|
|
31
|
+
var _Radio_instances, _Radio_inheritedAttributes, _Radio_input, _Radio_computedDisabled_get, _Radio_computedSize_get, _Radio_hasText_get, _Radio_ref, _Radio_onBlur, _Radio_onChange, _Radio_onFocus;
|
|
11
32
|
const Radio = class {
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
33
|
+
constructor(hostRef) {
|
|
34
|
+
registerInstance(this, hostRef);
|
|
35
|
+
this.blurEmitter = createEvent(this, "qdsBlur", 2);
|
|
36
|
+
this.changeEmitter = createEvent(this, "qdsChange", 6);
|
|
37
|
+
this.focusEmitter = createEvent(this, "qdsFocus", 2);
|
|
38
|
+
_Radio_instances.add(this);
|
|
39
|
+
/**
|
|
40
|
+
* Adds vertical margin to the radio for alignment.
|
|
41
|
+
*
|
|
42
|
+
* This is useful when creating inline layouts so that the first lines have
|
|
43
|
+
* the correct vertical centering.
|
|
44
|
+
*/
|
|
45
|
+
this.inline = false;
|
|
46
|
+
/**
|
|
47
|
+
* The radio button's size.
|
|
48
|
+
*/
|
|
49
|
+
this.size = 'standard';
|
|
50
|
+
_Radio_inheritedAttributes.set(this, {});
|
|
51
|
+
_Radio_input.set(this, void 0);
|
|
52
|
+
_Radio_ref.set(this, (input) => {
|
|
53
|
+
__classPrivateFieldSet(this, _Radio_input, input, "f");
|
|
54
|
+
});
|
|
55
|
+
_Radio_onBlur.set(this, (event) => {
|
|
56
|
+
this.blurEmitter.emit(pickFocusEventAttributes(event));
|
|
57
|
+
});
|
|
58
|
+
_Radio_onChange.set(this, () => {
|
|
59
|
+
this.changeEmitter.emit();
|
|
60
|
+
});
|
|
61
|
+
_Radio_onFocus.set(this, (event) => {
|
|
62
|
+
this.focusEmitter.emit(pickFocusEventAttributes(event));
|
|
63
|
+
});
|
|
64
|
+
}
|
|
65
|
+
onClick(event) {
|
|
66
|
+
if (__classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedDisabled_get)) {
|
|
67
|
+
event.stopImmediatePropagation();
|
|
68
|
+
return;
|
|
69
|
+
}
|
|
70
|
+
invariant(__classPrivateFieldGet(this, _Radio_input, "f"));
|
|
71
|
+
this.checked = __classPrivateFieldGet(this, _Radio_input, "f").checked;
|
|
72
|
+
}
|
|
73
|
+
tabindexChanged(newValue) {
|
|
74
|
+
const parsedValue = Number.parseInt(newValue, 10);
|
|
75
|
+
this.tabIndex =
|
|
76
|
+
parsedValue === 0 || Number.isNaN(parsedValue) ? undefined : parsedValue;
|
|
77
|
+
}
|
|
78
|
+
componentWillLoad() {
|
|
79
|
+
__classPrivateFieldSet(this, _Radio_inheritedAttributes, inheritAriaAttributes(this.host), "f");
|
|
80
|
+
this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0');
|
|
81
|
+
}
|
|
82
|
+
render() {
|
|
83
|
+
return (
|
|
84
|
+
// eslint-disable-next-line jsx-a11y/label-has-associated-control
|
|
85
|
+
h("label", { key: 'f99d16e9047808d58a0b9df5c82def391b8f3225', "aria-disabled": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedDisabled_get) ? 'true' : undefined, class: {
|
|
86
|
+
'qds-inline': this.inline,
|
|
87
|
+
'qds-label': true,
|
|
88
|
+
}, "data-size": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get) }, h("div", { key: 'e4c7d0fd23677892234d64a198847fef0232fc6b', class: "qds-container" }, h("input", { key: '4a8f523abc487d43ea23ec2f507c474ce19bb7ba', checked: this.checked, class: "qds-radio", "data-size": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get), disabled: this.disabled, form: this.form, name: this.name, onBlur: __classPrivateFieldGet(this, _Radio_onBlur, "f"), onChange: __classPrivateFieldGet(this, _Radio_onChange, "f"), onFocus: __classPrivateFieldGet(this, _Radio_onFocus, "f"), ref: __classPrivateFieldGet(this, _Radio_ref, "f"), required: this.required, tabIndex: __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedDisabled_get) ? undefined : this.tabIndex, type: "radio", value: this.value ?? undefined, ...__classPrivateFieldGet(this, _Radio_inheritedAttributes, "f") }), h("div", { key: 'b070acd21946c19f1aec067236a611767dc25caf', class: "qds-box", "data-size": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get) }), h("qds-icon", { key: '5e666d8584249258f5fdf21fa413e315c5e3950a', "aria-hidden": "true", class: "qds-icon", "data-size": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get), library: "core", name: "checked" })), __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_hasText_get) && (h("qds-label", { key: '7ad8a439c6144598b090192451f72f8b6f29d581', size: __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get), text: this.text }))));
|
|
89
|
+
}
|
|
90
|
+
get host() { return getElement(this); }
|
|
91
|
+
static get watchers() { return {
|
|
92
|
+
"tabindex": ["tabindexChanged"]
|
|
93
|
+
}; }
|
|
94
|
+
};
|
|
95
|
+
_Radio_inheritedAttributes = new WeakMap(), _Radio_input = new WeakMap(), _Radio_ref = new WeakMap(), _Radio_onBlur = new WeakMap(), _Radio_onChange = new WeakMap(), _Radio_onFocus = new WeakMap(), _Radio_instances = new WeakSet(), _Radio_computedDisabled_get = function _Radio_computedDisabled_get() {
|
|
41
96
|
return this.disabled ?? false;
|
|
42
|
-
|
|
43
|
-
|
|
97
|
+
}, _Radio_computedSize_get = function _Radio_computedSize_get() {
|
|
98
|
+
switch (this.size) {
|
|
99
|
+
case 'standard':
|
|
100
|
+
case 'small':
|
|
101
|
+
case 'large': {
|
|
102
|
+
return this.size;
|
|
103
|
+
}
|
|
104
|
+
default: {
|
|
105
|
+
return 'standard';
|
|
106
|
+
}
|
|
107
|
+
}
|
|
108
|
+
}, _Radio_hasText_get = function _Radio_hasText_get() {
|
|
44
109
|
return this.text !== undefined && this.text !== '';
|
|
45
|
-
}
|
|
46
|
-
onClick() {
|
|
47
|
-
invariant(this.input);
|
|
48
|
-
this.checked = this.input.checked;
|
|
49
|
-
}
|
|
50
|
-
componentWillLoad() {
|
|
51
|
-
this.inheritedAttributes = {
|
|
52
|
-
...inheritAriaAttributes(this.element),
|
|
53
|
-
...inheritAttributes(this.element, ['tabindex']),
|
|
54
|
-
};
|
|
55
|
-
}
|
|
56
|
-
render() {
|
|
57
|
-
return (
|
|
58
|
-
// eslint-disable-next-line jsx-a11y/label-has-associated-control
|
|
59
|
-
h("label", { "aria-disabled": this.computedDisabled ? 'true' : 'false', class: {
|
|
60
|
-
inline: this.inline,
|
|
61
|
-
label: true,
|
|
62
|
-
}, "data-size": this.size }, h("input", { checked: this.checked, class: "radio", "data-size": this.size, disabled: this.disabled, form: this.form, name: this.name, onBlur: this.onBlur, onChange: this.onChange, onFocus: this.onFocus, ref: this.ref, required: this.required, type: "radio", value: this.value ?? undefined, ...this.inheritedAttributes }), h("qds-icon", { "aria-hidden": "true", class: "icon", "data-size": this.size, library: "core", name: "checked" }), this.hasText && h("qds-label", { size: this.size, text: this.text })));
|
|
63
|
-
}
|
|
64
|
-
get element() { return getElement(this); }
|
|
65
110
|
};
|
|
66
|
-
Radio.style =
|
|
111
|
+
Radio.style = QdsRadioStyle0;
|
|
67
112
|
|
|
68
113
|
export { Radio as qds_radio };
|
|
69
114
|
|