@solid-design-system/components 6.12.0 → 6.12.1
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/cdn/chunks/{chunk.NOXJ72G5.js → chunk.DSVAD7WA.js} +2 -2
- package/cdn/components/combobox/combobox.js +1 -1
- package/cdn/custom-elements.json +1 -1
- package/cdn/solid-components.bundle.js +1 -1
- package/cdn/solid-components.iife.js +1 -1
- package/cdn/solid-components.js +1 -1
- package/cdn/web-types.json +1 -1
- package/cdn-versioned/chunks/chunk.2OSCB6XW.js +2 -2
- package/cdn-versioned/chunks/chunk.2XY2M6QX.js +2 -2
- package/cdn-versioned/chunks/chunk.3RO5EKVU.js +1 -1
- package/cdn-versioned/chunks/chunk.4275NGRN.js +2 -2
- package/cdn-versioned/chunks/chunk.4RPUAIQK.js +2 -2
- package/cdn-versioned/chunks/chunk.5DNOSYG7.js +1 -1
- package/cdn-versioned/chunks/chunk.5FYGQOXL.js +2 -2
- package/cdn-versioned/chunks/chunk.5X4GK4PS.js +1 -1
- package/cdn-versioned/chunks/chunk.5YHGT34K.js +2 -2
- package/cdn-versioned/chunks/chunk.6AEASXXL.js +2 -2
- package/cdn-versioned/chunks/chunk.AMWHBFTM.js +2 -2
- package/cdn-versioned/chunks/chunk.B46EHYIM.js +3 -3
- package/cdn-versioned/chunks/chunk.BAY7BKUC.js +1 -1
- package/cdn-versioned/chunks/chunk.BOVFUPAB.js +2 -2
- package/cdn-versioned/chunks/chunk.C7XYQGPF.js +2 -2
- package/cdn-versioned/chunks/chunk.DS2YD552.js +2 -2
- package/cdn-versioned/chunks/{chunk.NOXJ72G5.js → chunk.DSVAD7WA.js} +5 -5
- package/cdn-versioned/chunks/chunk.EMB5EOVL.js +2 -2
- package/cdn-versioned/chunks/chunk.ENQH3ZMT.js +2 -2
- package/cdn-versioned/chunks/chunk.ETAZT232.js +2 -2
- package/cdn-versioned/chunks/chunk.F6Z7C6GC.js +2 -2
- package/cdn-versioned/chunks/chunk.FC5OZ6LQ.js +2 -2
- package/cdn-versioned/chunks/chunk.FIUQMO6Q.js +2 -2
- package/cdn-versioned/chunks/chunk.FJ4YRN4X.js +2 -2
- package/cdn-versioned/chunks/chunk.FTCO66N2.js +2 -2
- package/cdn-versioned/chunks/chunk.G5PT3ZUT.js +2 -2
- package/cdn-versioned/chunks/chunk.H76VWBAF.js +1 -1
- package/cdn-versioned/chunks/chunk.HL52A333.js +2 -2
- package/cdn-versioned/chunks/chunk.HR5FZLRC.js +2 -2
- package/cdn-versioned/chunks/chunk.HUYURJ76.js +2 -2
- package/cdn-versioned/chunks/chunk.HWUUJJP3.js +1 -1
- package/cdn-versioned/chunks/chunk.INALKJVG.js +5 -5
- package/cdn-versioned/chunks/chunk.IXPIV7FA.js +2 -2
- package/cdn-versioned/chunks/chunk.JMZGGLJF.js +1 -1
- package/cdn-versioned/chunks/chunk.JZVRJWMV.js +2 -2
- package/cdn-versioned/chunks/chunk.KS4OSR2A.js +3 -3
- package/cdn-versioned/chunks/chunk.R3BQNXHR.js +2 -2
- package/cdn-versioned/chunks/chunk.RAP66B6O.js +1 -1
- package/cdn-versioned/chunks/chunk.REOCLYOU.js +2 -2
- package/cdn-versioned/chunks/chunk.SIVZ2S6B.js +1 -1
- package/cdn-versioned/chunks/chunk.TPSMY4DZ.js +1 -1
- package/cdn-versioned/chunks/chunk.TWQLXQ5K.js +2 -2
- package/cdn-versioned/chunks/chunk.TYKWEXBI.js +1 -1
- package/cdn-versioned/chunks/chunk.UYDZYQM5.js +2 -2
- package/cdn-versioned/chunks/chunk.V3TGYVID.js +2 -2
- package/cdn-versioned/chunks/chunk.V4BUIKPF.js +2 -2
- package/cdn-versioned/chunks/chunk.VNKXLA5X.js +2 -2
- package/cdn-versioned/chunks/chunk.VR5GAI7K.js +2 -2
- package/cdn-versioned/chunks/chunk.W7A3TU2Z.js +1 -1
- package/cdn-versioned/chunks/chunk.WBIJL62F.js +2 -2
- package/cdn-versioned/chunks/chunk.WNJTMU6J.js +1 -1
- package/cdn-versioned/chunks/chunk.WTZQJFYM.js +2 -2
- package/cdn-versioned/chunks/chunk.WZAWV2ED.js +2 -2
- package/cdn-versioned/chunks/chunk.XG7G63I4.js +2 -2
- package/cdn-versioned/chunks/chunk.XKUWNSWT.js +2 -2
- package/cdn-versioned/chunks/chunk.Y3LTN4CF.js +2 -2
- package/cdn-versioned/chunks/chunk.Y4QI2OPY.js +2 -2
- package/cdn-versioned/chunks/chunk.YF6TETRU.js +2 -2
- package/cdn-versioned/chunks/chunk.YPTZDABK.js +1 -1
- package/cdn-versioned/chunks/chunk.YQOLB2PJ.js +9 -9
- package/cdn-versioned/chunks/chunk.YWOD5MYX.js +2 -2
- package/cdn-versioned/chunks/chunk.ZIVWE443.js +1 -1
- package/cdn-versioned/chunks/chunk.ZRNSYCFR.js +2 -2
- package/cdn-versioned/chunks/chunk.ZSAXC4EQ.js +2 -2
- package/cdn-versioned/components/accordion/accordion.d.ts +1 -1
- package/cdn-versioned/components/accordion-group/accordion-group.d.ts +1 -1
- package/cdn-versioned/components/animation/animation.d.ts +1 -1
- package/cdn-versioned/components/audio/audio.d.ts +1 -1
- package/cdn-versioned/components/badge/badge.d.ts +1 -1
- package/cdn-versioned/components/brandshape/brandshape.d.ts +1 -1
- package/cdn-versioned/components/breadcrumb/breadcrumb.d.ts +1 -1
- package/cdn-versioned/components/breadcrumb-item/breadcrumb-item.d.ts +1 -1
- package/cdn-versioned/components/button/button.d.ts +1 -1
- package/cdn-versioned/components/button-group/button-group.d.ts +1 -1
- package/cdn-versioned/components/carousel/carousel.d.ts +1 -1
- package/cdn-versioned/components/carousel-item/carousel-item.d.ts +1 -1
- package/cdn-versioned/components/checkbox/checkbox.d.ts +1 -1
- package/cdn-versioned/components/checkbox-group/checkbox-group.d.ts +1 -1
- package/cdn-versioned/components/combobox/combobox.d.ts +1 -1
- package/cdn-versioned/components/combobox/combobox.js +1 -1
- package/cdn-versioned/components/datepicker/datepicker.d.ts +1 -1
- package/cdn-versioned/components/dialog/dialog.d.ts +1 -1
- package/cdn-versioned/components/divider/divider.d.ts +1 -1
- package/cdn-versioned/components/drawer/drawer.d.ts +1 -1
- package/cdn-versioned/components/dropdown/dropdown.d.ts +1 -1
- package/cdn-versioned/components/expandable/expandable.d.ts +1 -1
- package/cdn-versioned/components/flipcard/flipcard.d.ts +1 -1
- package/cdn-versioned/components/header/header.d.ts +1 -1
- package/cdn-versioned/components/icon/icon.d.ts +1 -1
- package/cdn-versioned/components/include/include.d.ts +1 -1
- package/cdn-versioned/components/input/input.d.ts +1 -1
- package/cdn-versioned/components/link/link.d.ts +1 -1
- package/cdn-versioned/components/loader/loader.d.ts +1 -1
- package/cdn-versioned/components/map-marker/map-marker.d.ts +1 -1
- package/cdn-versioned/components/menu/menu.d.ts +1 -1
- package/cdn-versioned/components/menu-item/menu-item.d.ts +1 -1
- package/cdn-versioned/components/navigation-item/navigation-item.d.ts +1 -1
- package/cdn-versioned/components/notification/notification.d.ts +1 -1
- package/cdn-versioned/components/optgroup/optgroup.d.ts +1 -1
- package/cdn-versioned/components/option/option.d.ts +1 -1
- package/cdn-versioned/components/popup/popup.d.ts +1 -1
- package/cdn-versioned/components/quickfact/quickfact.d.ts +1 -1
- package/cdn-versioned/components/radio/radio.d.ts +1 -1
- package/cdn-versioned/components/radio-button/radio-button.d.ts +1 -1
- package/cdn-versioned/components/radio-group/radio-group.d.ts +1 -1
- package/cdn-versioned/components/range/range.d.ts +1 -1
- package/cdn-versioned/components/range-tick/range-tick.d.ts +1 -1
- package/cdn-versioned/components/scrollable/scrollable.d.ts +1 -1
- package/cdn-versioned/components/select/select.d.ts +1 -1
- package/cdn-versioned/components/skeleton/skeleton.d.ts +1 -1
- package/cdn-versioned/components/spinner/spinner.d.ts +1 -1
- package/cdn-versioned/components/step/step.d.ts +1 -1
- package/cdn-versioned/components/step-group/step-group.d.ts +1 -1
- package/cdn-versioned/components/switch/switch.d.ts +1 -1
- package/cdn-versioned/components/tab/tab.d.ts +1 -1
- package/cdn-versioned/components/tab-group/tab-group.d.ts +1 -1
- package/cdn-versioned/components/tab-panel/tab-panel.d.ts +1 -1
- package/cdn-versioned/components/tag/tag.d.ts +1 -1
- package/cdn-versioned/components/textarea/textarea.d.ts +1 -1
- package/cdn-versioned/components/theme-listener/theme-listener.d.ts +1 -1
- package/cdn-versioned/components/tooltip/tooltip.d.ts +1 -1
- package/cdn-versioned/components/video/video.d.ts +1 -1
- package/cdn-versioned/custom-elements.json +246 -246
- package/cdn-versioned/internal/form.js +2 -2
- package/cdn-versioned/solid-components.bundle.js +80 -80
- package/cdn-versioned/solid-components.css +2 -2
- package/cdn-versioned/solid-components.iife.js +80 -80
- package/cdn-versioned/solid-components.js +1 -1
- package/cdn-versioned/vscode.html-custom-data.json +107 -107
- package/cdn-versioned/web-types.json +157 -157
- package/dist/chunks/{chunk.OWQ3YI2X.js → chunk.SCBHL45L.js} +2 -0
- package/dist/components/combobox/combobox.js +1 -1
- package/dist/custom-elements.json +1 -1
- package/dist/solid-components.js +1 -1
- package/dist/web-types.json +1 -1
- package/dist-versioned/chunks/chunk.2CU6QOL7.js +4 -4
- package/dist-versioned/chunks/chunk.35EQJ5SV.js +8 -8
- package/dist-versioned/chunks/chunk.4C33XKR5.js +4 -4
- package/dist-versioned/chunks/chunk.4GXGCVAT.js +4 -4
- package/dist-versioned/chunks/chunk.4TOOTTT7.js +3 -3
- package/dist-versioned/chunks/chunk.5IGIZXCC.js +12 -12
- package/dist-versioned/chunks/chunk.5V4ZLM46.js +2 -2
- package/dist-versioned/chunks/chunk.6ZTH3QOK.js +5 -5
- package/dist-versioned/chunks/chunk.77QMG2JK.js +1 -1
- package/dist-versioned/chunks/chunk.7NPVZGYG.js +10 -10
- package/dist-versioned/chunks/chunk.C3WIBDGG.js +2 -2
- package/dist-versioned/chunks/chunk.CGHNKRSG.js +2 -2
- package/dist-versioned/chunks/chunk.CPEBS32D.js +1 -1
- package/dist-versioned/chunks/chunk.CQPHP72G.js +5 -5
- package/dist-versioned/chunks/chunk.DVHTNKCQ.js +3 -3
- package/dist-versioned/chunks/chunk.DXOZDLN3.js +5 -5
- package/dist-versioned/chunks/chunk.EORDFUN5.js +8 -8
- package/dist-versioned/chunks/chunk.F733OTL5.js +2 -2
- package/dist-versioned/chunks/chunk.FN3QPQKW.js +6 -6
- package/dist-versioned/chunks/chunk.GUPU7Y4R.js +2 -2
- package/dist-versioned/chunks/chunk.HDB5VQ6T.js +3 -3
- package/dist-versioned/chunks/chunk.HMYRJJSA.js +1 -1
- package/dist-versioned/chunks/chunk.HSLR5EL7.js +2 -2
- package/dist-versioned/chunks/chunk.HWSQMDBV.js +2 -2
- package/dist-versioned/chunks/chunk.IYIDHG44.js +2 -2
- package/dist-versioned/chunks/chunk.J7P25XPS.js +1 -1
- package/dist-versioned/chunks/chunk.JBLVT4GJ.js +4 -4
- package/dist-versioned/chunks/chunk.JSHWJIQJ.js +5 -5
- package/dist-versioned/chunks/chunk.JVFY4KAV.js +4 -4
- package/dist-versioned/chunks/chunk.JZ4LAYZZ.js +1 -1
- package/dist-versioned/chunks/chunk.K33P42FK.js +1 -1
- package/dist-versioned/chunks/chunk.K5MFIQWD.js +12 -12
- package/dist-versioned/chunks/chunk.KEJFWGZI.js +4 -4
- package/dist-versioned/chunks/chunk.KH2LWYO6.js +1 -1
- package/dist-versioned/chunks/chunk.KMMZFIBW.js +3 -3
- package/dist-versioned/chunks/chunk.KNFZPKTF.js +3 -3
- package/dist-versioned/chunks/chunk.LRKBZ2PI.js +5 -5
- package/dist-versioned/chunks/chunk.MAECKDRE.js +9 -9
- package/dist-versioned/chunks/chunk.MJU6BUDN.js +4 -4
- package/dist-versioned/chunks/chunk.NDY2F6JA.js +14 -14
- package/dist-versioned/chunks/chunk.OA6QSAEX.js +28 -28
- package/dist-versioned/chunks/chunk.OYSZH2PZ.js +25 -25
- package/dist-versioned/chunks/chunk.P4H32F7J.js +8 -8
- package/dist-versioned/chunks/chunk.PU6VCTT2.js +3 -3
- package/dist-versioned/chunks/chunk.PZZI7LIX.js +3 -3
- package/dist-versioned/chunks/chunk.Q2YJAMQO.js +6 -6
- package/dist-versioned/chunks/chunk.QMQD2SCQ.js +7 -7
- package/dist-versioned/chunks/chunk.REYEB3D7.js +11 -11
- package/dist-versioned/chunks/{chunk.OWQ3YI2X.js → chunk.SCBHL45L.js} +25 -23
- package/dist-versioned/chunks/chunk.SQKCQFZY.js +2 -2
- package/dist-versioned/chunks/chunk.TAR64H3A.js +4 -4
- package/dist-versioned/chunks/chunk.TEHZN5K4.js +1 -1
- package/dist-versioned/chunks/chunk.UIQBHPD3.js +2 -2
- package/dist-versioned/chunks/chunk.URTSQLC4.js +3 -3
- package/dist-versioned/chunks/chunk.UZPDIPPZ.js +2 -2
- package/dist-versioned/chunks/chunk.V5VJQQ73.js +2 -2
- package/dist-versioned/chunks/chunk.VFLTCSUA.js +5 -5
- package/dist-versioned/chunks/chunk.VJNVCYUG.js +4 -4
- package/dist-versioned/chunks/chunk.WIXKV24T.js +1 -1
- package/dist-versioned/chunks/chunk.XVLJVMWL.js +5 -5
- package/dist-versioned/chunks/chunk.Y3THGL6Z.js +3 -3
- package/dist-versioned/chunks/chunk.Z5DZQTVN.js +1 -1
- package/dist-versioned/chunks/chunk.ZRHUI65H.js +5 -5
- package/dist-versioned/chunks/chunk.ZXKZDONO.js +5 -5
- package/dist-versioned/components/accordion/accordion.d.ts +1 -1
- package/dist-versioned/components/accordion-group/accordion-group.d.ts +1 -1
- package/dist-versioned/components/animation/animation.d.ts +1 -1
- package/dist-versioned/components/audio/audio.d.ts +1 -1
- package/dist-versioned/components/badge/badge.d.ts +1 -1
- package/dist-versioned/components/brandshape/brandshape.d.ts +1 -1
- package/dist-versioned/components/breadcrumb/breadcrumb.d.ts +1 -1
- package/dist-versioned/components/breadcrumb-item/breadcrumb-item.d.ts +1 -1
- package/dist-versioned/components/button/button.d.ts +1 -1
- package/dist-versioned/components/button-group/button-group.d.ts +1 -1
- package/dist-versioned/components/carousel/carousel.d.ts +1 -1
- package/dist-versioned/components/carousel-item/carousel-item.d.ts +1 -1
- package/dist-versioned/components/checkbox/checkbox.d.ts +1 -1
- package/dist-versioned/components/checkbox-group/checkbox-group.d.ts +1 -1
- package/dist-versioned/components/combobox/combobox.d.ts +1 -1
- package/dist-versioned/components/combobox/combobox.js +1 -1
- package/dist-versioned/components/datepicker/datepicker.d.ts +1 -1
- package/dist-versioned/components/dialog/dialog.d.ts +1 -1
- package/dist-versioned/components/divider/divider.d.ts +1 -1
- package/dist-versioned/components/drawer/drawer.d.ts +1 -1
- package/dist-versioned/components/dropdown/dropdown.d.ts +1 -1
- package/dist-versioned/components/expandable/expandable.d.ts +1 -1
- package/dist-versioned/components/flipcard/flipcard.d.ts +1 -1
- package/dist-versioned/components/header/header.d.ts +1 -1
- package/dist-versioned/components/icon/icon.d.ts +1 -1
- package/dist-versioned/components/include/include.d.ts +1 -1
- package/dist-versioned/components/input/input.d.ts +1 -1
- package/dist-versioned/components/link/link.d.ts +1 -1
- package/dist-versioned/components/loader/loader.d.ts +1 -1
- package/dist-versioned/components/map-marker/map-marker.d.ts +1 -1
- package/dist-versioned/components/menu/menu.d.ts +1 -1
- package/dist-versioned/components/menu-item/menu-item.d.ts +1 -1
- package/dist-versioned/components/navigation-item/navigation-item.d.ts +1 -1
- package/dist-versioned/components/notification/notification.d.ts +1 -1
- package/dist-versioned/components/optgroup/optgroup.d.ts +1 -1
- package/dist-versioned/components/option/option.d.ts +1 -1
- package/dist-versioned/components/popup/popup.d.ts +1 -1
- package/dist-versioned/components/quickfact/quickfact.d.ts +1 -1
- package/dist-versioned/components/radio/radio.d.ts +1 -1
- package/dist-versioned/components/radio-button/radio-button.d.ts +1 -1
- package/dist-versioned/components/radio-group/radio-group.d.ts +1 -1
- package/dist-versioned/components/range/range.d.ts +1 -1
- package/dist-versioned/components/range-tick/range-tick.d.ts +1 -1
- package/dist-versioned/components/scrollable/scrollable.d.ts +1 -1
- package/dist-versioned/components/select/select.d.ts +1 -1
- package/dist-versioned/components/skeleton/skeleton.d.ts +1 -1
- package/dist-versioned/components/spinner/spinner.d.ts +1 -1
- package/dist-versioned/components/step/step.d.ts +1 -1
- package/dist-versioned/components/step-group/step-group.d.ts +1 -1
- package/dist-versioned/components/switch/switch.d.ts +1 -1
- package/dist-versioned/components/tab/tab.d.ts +1 -1
- package/dist-versioned/components/tab-group/tab-group.d.ts +1 -1
- package/dist-versioned/components/tab-panel/tab-panel.d.ts +1 -1
- package/dist-versioned/components/tag/tag.d.ts +1 -1
- package/dist-versioned/components/textarea/textarea.d.ts +1 -1
- package/dist-versioned/components/theme-listener/theme-listener.d.ts +1 -1
- package/dist-versioned/components/tooltip/tooltip.d.ts +1 -1
- package/dist-versioned/components/video/video.d.ts +1 -1
- package/dist-versioned/custom-elements.json +246 -246
- package/dist-versioned/internal/form.js +2 -2
- package/dist-versioned/solid-components.css +2 -2
- package/dist-versioned/solid-components.js +1 -1
- package/dist-versioned/vscode.html-custom-data.json +107 -107
- package/dist-versioned/web-types.json +157 -157
- package/package.json +1 -1
|
@@ -60,10 +60,10 @@ var SdTeaser = class extends SolidElement {
|
|
|
60
60
|
"flex",
|
|
61
61
|
{
|
|
62
62
|
white: "bg-white",
|
|
63
|
-
"white border-neutral-400": "bg-white border sd-6-12-
|
|
64
|
-
"neutral-100": "sd-6-12-
|
|
63
|
+
"white border-neutral-400": "bg-white border sd-6-12-1-teaser--neutral-400-color-border",
|
|
64
|
+
"neutral-100": "sd-6-12-1-teaser--neutral-100-color-background",
|
|
65
65
|
primary: "bg-primary text-white",
|
|
66
|
-
"primary-100": "sd-6-12-
|
|
66
|
+
"primary-100": "sd-6-12-1-teaser--primary-100-color-background"
|
|
67
67
|
}[this.variant],
|
|
68
68
|
this._orientation === "vertical" && "flex-col",
|
|
69
69
|
this._orientation === "horizontal" && "flex-row gap-8",
|
|
@@ -105,7 +105,7 @@ __decorateClass([
|
|
|
105
105
|
state()
|
|
106
106
|
], SdTeaser.prototype, "_orientation", 2);
|
|
107
107
|
SdTeaser = __decorateClass([
|
|
108
|
-
customElement("sd-6-12-
|
|
108
|
+
customElement("sd-6-12-1-teaser")
|
|
109
109
|
], SdTeaser);
|
|
110
110
|
|
|
111
111
|
export {
|
|
@@ -37,8 +37,8 @@ var SdTabGroup = class extends SolidElement {
|
|
|
37
37
|
}
|
|
38
38
|
connectedCallback() {
|
|
39
39
|
const whenAllDefined = Promise.all([
|
|
40
|
-
customElements.whenDefined("sd-6-12-
|
|
41
|
-
customElements.whenDefined("sd-6-12-
|
|
40
|
+
customElements.whenDefined("sd-6-12-1-tab"),
|
|
41
|
+
customElements.whenDefined("sd-6-12-1-tab-panel")
|
|
42
42
|
]);
|
|
43
43
|
super.connectedCallback();
|
|
44
44
|
this.resizeObserver = new ResizeObserver(() => {
|
|
@@ -86,20 +86,20 @@ var SdTabGroup = class extends SolidElement {
|
|
|
86
86
|
}
|
|
87
87
|
getAllTabs(options = { includeDisabled: true }) {
|
|
88
88
|
const slot = this.shadowRoot.querySelector('slot[name="nav"]');
|
|
89
|
-
return Array.from(slot.assignedElements()).map((el) => el.tagName.toLocaleLowerCase() === "sd-6-12-
|
|
90
|
-
return el && options.includeDisabled ? el.tagName.toLowerCase() === "sd-6-12-
|
|
89
|
+
return Array.from(slot.assignedElements()).map((el) => el.tagName.toLocaleLowerCase() === "sd-6-12-1-tab" ? el : el.querySelector("sd-6-12-1-tab")).filter((el) => {
|
|
90
|
+
return el && options.includeDisabled ? el.tagName.toLowerCase() === "sd-6-12-1-tab" : el.tagName.toLowerCase() === "sd-6-12-1-tab" && !el.disabled;
|
|
91
91
|
});
|
|
92
92
|
}
|
|
93
93
|
getAllPanels() {
|
|
94
|
-
return [...this.body.assignedElements()].filter((el) => el.tagName.toLowerCase() === "sd-6-12-
|
|
94
|
+
return [...this.body.assignedElements()].filter((el) => el.tagName.toLowerCase() === "sd-6-12-1-tab-panel");
|
|
95
95
|
}
|
|
96
96
|
getActiveTab() {
|
|
97
97
|
return this.tabs.find((t) => t.matches(":focus"));
|
|
98
98
|
}
|
|
99
99
|
handleClick(event) {
|
|
100
100
|
const target = event.target;
|
|
101
|
-
const tab = target.closest("sd-6-12-
|
|
102
|
-
const tabGroup = tab == null ? void 0 : tab.closest("sd-6-12-
|
|
101
|
+
const tab = target.closest("sd-6-12-1-tab");
|
|
102
|
+
const tabGroup = tab == null ? void 0 : tab.closest("sd-6-12-1-tab-group");
|
|
103
103
|
if (tabGroup !== this) {
|
|
104
104
|
return;
|
|
105
105
|
}
|
|
@@ -109,8 +109,8 @@ var SdTabGroup = class extends SolidElement {
|
|
|
109
109
|
}
|
|
110
110
|
handleKeyDown(event) {
|
|
111
111
|
const target = event.target;
|
|
112
|
-
const tab = target.closest("sd-6-12-
|
|
113
|
-
const tabGroup = tab == null ? void 0 : tab.closest("sd-6-12-
|
|
112
|
+
const tab = target.closest("sd-6-12-1-tab");
|
|
113
|
+
const tabGroup = tab == null ? void 0 : tab.closest("sd-6-12-1-tab-group");
|
|
114
114
|
if (tabGroup !== this) {
|
|
115
115
|
return;
|
|
116
116
|
}
|
|
@@ -137,7 +137,7 @@ var SdTabGroup = class extends SolidElement {
|
|
|
137
137
|
if (["ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown", "Home", "End"].includes(event.key)) {
|
|
138
138
|
const activeEl = this.tabs.find((t) => t.matches(":focus"));
|
|
139
139
|
const isRtl = this.localize.dir() === "rtl";
|
|
140
|
-
if ((activeEl == null ? void 0 : activeEl.tagName.toLowerCase()) === "sd-6-12-
|
|
140
|
+
if ((activeEl == null ? void 0 : activeEl.tagName.toLowerCase()) === "sd-6-12-1-tab") {
|
|
141
141
|
let index = this.tabs.indexOf(activeEl);
|
|
142
142
|
if (event.key === "Home") {
|
|
143
143
|
index = 0;
|
|
@@ -258,16 +258,16 @@ var SdTabGroup = class extends SolidElement {
|
|
|
258
258
|
return html`<div part="base" class="${cx("flex flex-col rounded-none")}" @click="${this.handleClick}" @keydown="${this.handleKeyDown}"><div part="nav" class="${cx(this.hasScrollControls && "relative py-0 px-12")}">${this.hasScrollControls ? html`<button part="scroll-button--start" exportparts="base:scroll-button__base" tabindex="-1" aria-hidden="true" disabled="${ifDefined(!this.canScroll.left || void 0)}" class="${cx(
|
|
259
259
|
"sd-interactive flex items-center justify-center absolute top-0 bottom-0 left-0 !outline-offset-0 border-b border-neutral-400 z-10",
|
|
260
260
|
this.localize.dir() === "rtl" && "left-auto right-0"
|
|
261
|
-
)}" @click="${this.handleScrollToStart}"><sd-6-12-
|
|
261
|
+
)}" @click="${this.handleScrollToStart}"><sd-6-12-1-icon library="_internal" name="${isRtl ? "chevron-up" : "chevron-down"}" label="previous" class="${cx("h-6 w-12 rotate-90 grid place-items-center")}"></sd-6-12-1-icon></button>` : ""}<div part="scroll-container" class="flex overflow-x-auto focus-visible:focus-outline !outline-offset-0"><div part="tabs" class="${cx("flex flex-auto relative flex-row")}" role="tablist">${((_a = this.activeTab) == null ? void 0 : _a.variant) !== "container" ? html`<div part="active-tab-indicator" id="indicator" class="absolute h-1 bg-accent bottom-0 transition-[transform,width] duration-medium ease-in-out z-30 navigable__current-indicator-height navigable__current-indicator-border-radius"></div>` : ""}<div part="separation" class="border-neutral-400 absolute w-full h-0.25 bottom-0 border-b z-10"></div><slot name="nav" @slotchange="${this.syncTabsAndPanels}"></slot></div></div>${this.hasScrollControls ? html`<button part="scroll-button--end" exportparts="base:scroll-button__base" tabindex="-1" aria-hidden="true" disabled="${ifDefined(!this.canScroll.right || void 0)}" class="${cx(
|
|
262
262
|
"sd-interactive flex items-center justify-center absolute top-0 bottom-0 right-0 !outline-offset-0 border-b border-neutral-400 z-10",
|
|
263
263
|
this.localize.dir() === "rtl" && "right-auto left-0"
|
|
264
|
-
)}" @click="${this.handleScrollToEnd}"><sd-6-12-
|
|
264
|
+
)}" @click="${this.handleScrollToEnd}"><sd-6-12-1-icon library="_internal" name="${isRtl ? "chevron-down" : "chevron-up"}" label="next" class="${cx("h-6 w-12 rotate-90 grid place-items-center")}"></sd-6-12-1-icon></button>` : ""}</div><slot part="body" class="${cx("block auto py-8 px-6", this.variant === "container" && "border border-neutral-400 border-t-0")}" @slotchange="${this.syncTabsAndPanels}"></slot></div>`;
|
|
265
265
|
}
|
|
266
266
|
};
|
|
267
267
|
SdTabGroup.styles = [
|
|
268
268
|
...SolidElement.styles,
|
|
269
269
|
css`/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
|
|
270
|
-
:host{box-sizing:border-box;display:block}[part=scroll-container]{scrollbar-width:none}[part=scroll-container]::-webkit-scrollbar{height:calc(var(--sd-spacing-1) * 0);width:calc(var(--sd-spacing-1) * 0)}::slotted(sd-6-12-
|
|
270
|
+
:host{box-sizing:border-box;display:block}[part=scroll-container]{scrollbar-width:none}[part=scroll-container]::-webkit-scrollbar{height:calc(var(--sd-spacing-1) * 0);width:calc(var(--sd-spacing-1) * 0)}::slotted(sd-6-12-1-tab-panel){--padding:1rem 0}::slotted(sd-6-12-1-tab-panel:focus-visible){outline-style:solid;outline-offset:2px;outline-width:2px;outline-color:rgba(var(--outline-color-primary))}`
|
|
271
271
|
];
|
|
272
272
|
__decorateClass([
|
|
273
273
|
query("[part=base]")
|
|
@@ -300,7 +300,7 @@ __decorateClass([
|
|
|
300
300
|
debounce(20)
|
|
301
301
|
], SdTabGroup.prototype, "handleScroll", 1);
|
|
302
302
|
SdTabGroup = __decorateClass([
|
|
303
|
-
customElement("sd-6-12-
|
|
303
|
+
customElement("sd-6-12-1-tab-group")
|
|
304
304
|
], SdTabGroup);
|
|
305
305
|
|
|
306
306
|
export {
|
|
@@ -163,48 +163,48 @@ var SdButton = class extends SolidElement {
|
|
|
163
163
|
* */
|
|
164
164
|
{
|
|
165
165
|
/* sizes, fonts */
|
|
166
|
-
sm: `sd-6-12-
|
|
167
|
-
md: `sd-6-12-
|
|
168
|
-
lg: `sd-6-12-
|
|
166
|
+
sm: `sd-6-12-1-button--size-sm-font-size sd-6-12-1-button-font-weight sd-6-12-1-button--size-sm-border-radius varspacing-8 ${hasBorder ? "py-[0.281rem] px-[0.938rem]" : "sd-6-12-1-button--size-sm-padding-block px-4"}`,
|
|
167
|
+
md: `sd-6-12-1-button--size-md-font-size sd-6-12-1-button-font-weight sd-6-12-1-button--size-md-border-radius varspacing-10 ${hasBorder ? "py-[0.438rem] px-[0.938rem]" : "sd-6-12-1-button--size-md-padding-block px-4"}`,
|
|
168
|
+
lg: `sd-6-12-1-button--size-lg-font-size sd-6-12-1-button-font-weight sd-6-12-1-button--size-lg-border-radius varspacing-12 ${hasBorder ? "py-[0.688rem] px-[0.938rem]" : "sd-6-12-1-button--size-lg-padding-block px-4"}`
|
|
169
169
|
}[this.size],
|
|
170
170
|
{
|
|
171
171
|
/* variants */
|
|
172
|
-
primary: !this.inverted ? `${this.visuallyDisabled ? "bg-neutral-500 border-neutral-500 hover:bg-neutral-500 text-white" : "sd-6-12-
|
|
173
|
-
disabled:bg-neutral-500 disabled:text-white` : `${this.visuallyDisabled ? "bg-neutral-500 text-white border-neutral-500 hover:bg-neutral-500 active:bg-neutral-500" : "sd-6-12-
|
|
174
|
-
disabled:sd-6-12-
|
|
175
|
-
secondary: !this.inverted ? `border ${this.visuallyDisabled ? "sd-6-12-
|
|
176
|
-
disabled:sd-6-12-
|
|
177
|
-
disabled:sd-6-12-
|
|
178
|
-
tertiary: !this.inverted ? `border-transparent ${this.visuallyDisabled ? "sd-6-12-
|
|
179
|
-
disabled:sd-6-12-
|
|
180
|
-
disabled:sd-6-12-
|
|
172
|
+
primary: !this.inverted ? `${this.visuallyDisabled ? "bg-neutral-500 border-neutral-500 hover:bg-neutral-500 text-white" : "sd-6-12-1-button--primary--default-color-background border-transparent sd-6-12-1-button--primary--default-color-text hover:text-primary-100 active:sd-6-12-1-button--primary--active-color-text"}
|
|
173
|
+
disabled:bg-neutral-500 disabled:text-white` : `${this.visuallyDisabled ? "bg-neutral-500 text-white border-neutral-500 hover:bg-neutral-500 active:bg-neutral-500" : "sd-6-12-1-button--primary--inverted--default-color-text sd-6-12-1-button--primary--inverted--default-color-background border-white hover:sd-6-12-1-button--primary--inverted--hover-color-text active:sd-6-12-1-button--primary--inverted--active-color-text active:sd-6-12-1-button--primary--inverted--active-color-background"}
|
|
174
|
+
disabled:sd-6-12-1-button--inverted--disabled-color-background disabled:sd-6-12-1-button--inverted--disabled-color-border disabled:text-white`,
|
|
175
|
+
secondary: !this.inverted ? `border ${this.visuallyDisabled ? "sd-6-12-1-button--secondary--disabled-color-text border-neutral-500 hover:text-neutral-500 hover:border-neutral-500 active:text-neutral-500 active:border-neutral-500" : "sd-6-12-1-button--secondary--default-color-text border-primary hover:text-primary-500 hover:border-primary-500 active:text-primary-800 active:border-primary-800"}
|
|
176
|
+
disabled:sd-6-12-1-button--secondary--disabled-color-text disabled:border-neutral-500` : `border ${this.visuallyDisabled ? "text-neutral-600 border-neutral-600 hover:text-neutral-600 hover:border-neutral-600 active:text-neutral-600 active:border-neutral-600" : "text-white sd-6-12-1-button--secondary--inverted--color-border hover:sd-6-12-1-button--secondary--inverted--hover-color-text hover:border-primary-100 active:text-primary-200"}
|
|
177
|
+
disabled:sd-6-12-1-button--inverted--disabled-color-border disabled:sd-6-12-1-button--inverted--disabled-color-text`,
|
|
178
|
+
tertiary: !this.inverted ? `border-transparent ${this.visuallyDisabled ? "sd-6-12-1-button--tertiary--disabled-color-text hover:text-neutral-500 active:text-neutral-500" : "sd-6-12-1-button--tertiary--default-color-text hover:text-primary-500 active:text-primary-800"}
|
|
179
|
+
disabled:sd-6-12-1-button--tertiary--disabled-color-text` : `border-transparent ${this.visuallyDisabled ? "text-neutral-600 hover:text-neutral-600 active:text-neutral-600" : "text-white hover:sd-6-12-1-button--tertiary--inverted--hover-color-text hover:sd-6-12-1-button--tertiary--inverted--hover-color-background active:text-primary-200"}
|
|
180
|
+
disabled:sd-6-12-1-button--inverted--disabled-color-text`,
|
|
181
181
|
cta: `${this.visuallyDisabled ? "bg-neutral-500 border-neutral-500 hover:bg-neutral-500 active:bg-neutral-500" : "bg-accent border-transparent"}
|
|
182
|
-
${!this.inverted ? "text-white disabled:bg-neutral-500 disabled:border-neutral-500 disabled:text-white" : "sd-6-12-
|
|
182
|
+
${!this.inverted ? "text-white disabled:bg-neutral-500 disabled:border-neutral-500 disabled:text-white" : "sd-6-12-1-button--cta--inverted--default-color-background sd-6-12-1-button--cta--inverted--default-color-text hover:sd-6-12-1-button--cta--inverted--hover-color-text active:sd-6-12-1-button--cta--inverted--active-color-text disabled:sd-6-12-1-button--inverted--disabled-color-background disabled:sd-6-12-1-button--inverted--disabled-color-border disabled:text-white"}`
|
|
183
183
|
}[this.variant]
|
|
184
184
|
)}" ?disabled="${ifDefined(isLink ? void 0 : this.disabled)}" type="${ifDefined(isLink ? void 0 : this.type)}" title="${this.title}" name="${ifDefined(isLink ? void 0 : this.name)}" value="${ifDefined(isLink ? void 0 : this.value)}" href="${ifDefined(isLink ? this.href : void 0)}" target="${ifDefined(isLink ? this.target : void 0)}" download="${ifDefined(isLink ? this.download : void 0)}" rel="${ifDefined(isLink && this.target ? "noreferrer noopener" : void 0)}" role="${ifDefined(isLink ? void 0 : "button")}" aria-disabled="${this.disabled || this.visuallyDisabled ? "true" : "false"}" aria-labelledby="content" tabindex="${this.disabled ? "-1" : "0"}" @blur="${this.handleBlur}" @focus="${this.handleFocus}" @invalid="${this.isButton() ? this.handleInvalid : null}" @click="${this.handleClick}"><div part="motion-wrapper" class="${cx(
|
|
185
185
|
"absolute inset-0 -z-10 overflow-hidden pointer-events-none ",
|
|
186
186
|
(this.disabled || this.visuallyDisabled) && "hidden",
|
|
187
187
|
{
|
|
188
188
|
/* sizes, fonts */
|
|
189
|
-
sm: `sd-6-12-
|
|
190
|
-
md: `sd-6-12-
|
|
191
|
-
lg: `sd-6-12-
|
|
189
|
+
sm: `sd-6-12-1-button--size-sm-border-radius`,
|
|
190
|
+
md: `sd-6-12-1-button--size-md-border-radius`,
|
|
191
|
+
lg: `sd-6-12-1-button--size-lg-border-radius`
|
|
192
192
|
}[this.size]
|
|
193
193
|
)}"><div class="absolute inset-0 w-full h-full transition-all duration-fast translate-y-full group-hover:translate-y-0 group-hover:mt-[-22%] mt-[11%]"><div class="${cx(
|
|
194
194
|
"absolute right-0 min-w-full min-h-full aspect-square skew-y-[-11deg] mt-[11%]",
|
|
195
195
|
{
|
|
196
|
-
primary: !this.inverted ? "sd-6-12-
|
|
197
|
-
secondary: !this.inverted ? "sd-6-12-
|
|
198
|
-
tertiary: !this.inverted ? "sd-6-12-
|
|
199
|
-
cta: !this.inverted ? "bg-accent-550 group-active:bg-accent-700" : "sd-6-12-
|
|
196
|
+
primary: !this.inverted ? "sd-6-12-1-button--primary--hover-color-background group-active:bg-primary-800" : "sd-6-12-1-button--primary--inverted--hover-color-background group-active:bg-primary-200",
|
|
197
|
+
secondary: !this.inverted ? "sd-6-12-1-button--secondary--hover-color-background group-active:sd-6-12-1-button--secondary--active-color-background" : "bg-primary-500 group-active:sd-6-12-1-button--secondary--inverted--active-color-background",
|
|
198
|
+
tertiary: !this.inverted ? "sd-6-12-1-button--tertiary--hover-color-background group-active:sd-6-12-1-button--tertiary--active-color-background" : "bg-primary-500 group-active:sd-6-12-1-button--tertiary--inverted--active-color-background",
|
|
199
|
+
cta: !this.inverted ? "bg-accent-550 group-active:bg-accent-700" : "sd-6-12-1-button--cta--inverted--hover-color-background group-active:sd-6-12-1-button--cta--inverted--active-color-background"
|
|
200
200
|
}[this.variant]
|
|
201
201
|
)}"></div><div class="${cx(
|
|
202
202
|
"absolute w-full h-full mt-[22%]",
|
|
203
203
|
{
|
|
204
|
-
primary: !this.inverted ? "sd-6-12-
|
|
205
|
-
secondary: !this.inverted ? "sd-6-12-
|
|
206
|
-
tertiary: !this.inverted ? "sd-6-12-
|
|
207
|
-
cta: !this.inverted ? "bg-accent-550 group-active:bg-accent-700" : "sd-6-12-
|
|
204
|
+
primary: !this.inverted ? "sd-6-12-1-button--primary--hover-color-background group-active:bg-primary-800" : "sd-6-12-1-button--primary--inverted--hover-color-background group-active:bg-primary-200",
|
|
205
|
+
secondary: !this.inverted ? "sd-6-12-1-button--secondary--hover-color-background group-active:sd-6-12-1-button--secondary--active-color-background" : "bg-primary-500 group-active:sd-6-12-1-button--secondary--inverted--active-color-background",
|
|
206
|
+
tertiary: !this.inverted ? "sd-6-12-1-button--tertiary--hover-color-background group-active:sd-6-12-1-button--tertiary--active-color-background" : "bg-primary-500 group-active:sd-6-12-1-button--tertiary--inverted--active-color-background",
|
|
207
|
+
cta: !this.inverted ? "bg-accent-550 group-active:bg-accent-700" : "sd-6-12-1-button--cta--inverted--hover-color-background group-active:sd-6-12-1-button--cta--inverted--active-color-background"
|
|
208
208
|
}[this.variant]
|
|
209
209
|
)}"></div></div></div><slot name="icon-left" part="icon-left" class="${cx(
|
|
210
210
|
"flex flex-auto items-center justify-end pointer-events-none",
|
|
@@ -228,7 +228,7 @@ var SdButton = class extends SolidElement {
|
|
|
228
228
|
md: "ml-2",
|
|
229
229
|
lg: "ml-2"
|
|
230
230
|
}[this.size]
|
|
231
|
-
)}"></slot>${this.loading ? html`<sd-6-12-
|
|
231
|
+
)}"></slot>${this.loading ? html`<sd-6-12-1-loader class="${cx("absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2")}"></sd-6-12-1-loader>` : ""}</${tag}>`;
|
|
232
232
|
}
|
|
233
233
|
};
|
|
234
234
|
/**
|
|
@@ -237,13 +237,13 @@ var SdButton = class extends SolidElement {
|
|
|
237
237
|
SdButton.styles = [
|
|
238
238
|
...SolidElement.styles,
|
|
239
239
|
css`/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
|
|
240
|
-
:host{position:relative;z-index:0;display:inline-block;width:auto;cursor:pointer}::slotted(sd-6-12-
|
|
240
|
+
:host{position:relative;z-index:0;display:inline-block;width:auto;cursor:pointer}::slotted(sd-6-12-1-badge){pointer-events:none;position:absolute;top:calc(var(--sd-spacing-1) * 0);right:calc(var(--sd-spacing-1) * 0);--tw-translate-x:calc(1 / 2 * 100%)!important;--tw-translate-y:calc(calc(1 / 2 * 100%) * -1)!important;translate:var(--tw-translate-x) var(--tw-translate-y)!important}::slotted(sd-6-12-1-icon),sd-6-12-1-loader{font-size:calc(var(--tw-varspacing)/ 2)}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}`
|
|
241
241
|
];
|
|
242
242
|
__decorateClass([
|
|
243
243
|
query("a, button")
|
|
244
244
|
], SdButton.prototype, "button", 2);
|
|
245
245
|
__decorateClass([
|
|
246
|
-
queryAssignedElements({ selector: "sd-6-12-
|
|
246
|
+
queryAssignedElements({ selector: "sd-6-12-1-icon" })
|
|
247
247
|
], SdButton.prototype, "_iconsInDefaultSlot", 2);
|
|
248
248
|
__decorateClass([
|
|
249
249
|
state()
|
|
@@ -309,7 +309,7 @@ __decorateClass([
|
|
|
309
309
|
watch("disabled", { waitUntilFirstUpdate: true })
|
|
310
310
|
], SdButton.prototype, "handleDisabledChange", 1);
|
|
311
311
|
SdButton = __decorateClass([
|
|
312
|
-
customElement("sd-6-12-
|
|
312
|
+
customElement("sd-6-12-1-button")
|
|
313
313
|
], SdButton);
|
|
314
314
|
|
|
315
315
|
export {
|
|
@@ -77,11 +77,11 @@ var SdSelect = class extends SolidElement {
|
|
|
77
77
|
this.styleOnValid = false;
|
|
78
78
|
this.hoist = false;
|
|
79
79
|
this.getTag = (option) => {
|
|
80
|
-
return html`<sd-6-12-
|
|
80
|
+
return html`<sd-6-12-1-tag class="relative z-10 min-w-0 max-w-full" ?disabled="${this.disabled}" part="tag" exportparts="
|
|
81
81
|
base:tag__base,
|
|
82
82
|
content:tag__content,
|
|
83
83
|
removable-indicator:tag__removable-indicator,
|
|
84
|
-
" size="${this.size === "sm" ? "sm" : "lg"}" removable @keydown="${(event) => this.handleTagKeyDown(event, option)}" @sd-remove="${(event) => this.handleTagRemove(event, option)}">${option.getTextLabel()}</sd-6-12-
|
|
84
|
+
" size="${this.size === "sm" ? "sm" : "lg"}" removable @keydown="${(event) => this.handleTagKeyDown(event, option)}" @sd-remove="${(event) => this.handleTagRemove(event, option)}">${option.getTextLabel()}</sd-6-12-1-tag>`;
|
|
85
85
|
};
|
|
86
86
|
this.handleDocumentFocusIn = (event) => {
|
|
87
87
|
const path = event.composedPath();
|
|
@@ -92,7 +92,7 @@ var SdSelect = class extends SolidElement {
|
|
|
92
92
|
this.handleDocumentKeyDown = (event) => {
|
|
93
93
|
const target = event.target;
|
|
94
94
|
const isClearButton = target.closest(".select__clear") !== null;
|
|
95
|
-
const isIconButton = target.closest("sd-6-12-
|
|
95
|
+
const isIconButton = target.closest("sd-6-12-1-icon-button") !== null;
|
|
96
96
|
if (isClearButton || isIconButton) {
|
|
97
97
|
return;
|
|
98
98
|
}
|
|
@@ -227,8 +227,8 @@ var SdSelect = class extends SolidElement {
|
|
|
227
227
|
event.preventDefault();
|
|
228
228
|
event.stopPropagation();
|
|
229
229
|
const tagParent = (_a = event.currentTarget) == null ? void 0 : _a.parentElement;
|
|
230
|
-
const previousTag = (_b = tagParent == null ? void 0 : tagParent.previousElementSibling) == null ? void 0 : _b.querySelector("sd-6-12-
|
|
231
|
-
const nextTag = (_c = tagParent == null ? void 0 : tagParent.nextElementSibling) == null ? void 0 : _c.querySelector("sd-6-12-
|
|
230
|
+
const previousTag = (_b = tagParent == null ? void 0 : tagParent.previousElementSibling) == null ? void 0 : _b.querySelector("sd-6-12-1-tag");
|
|
231
|
+
const nextTag = (_c = tagParent == null ? void 0 : tagParent.nextElementSibling) == null ? void 0 : _c.querySelector("sd-6-12-1-tag");
|
|
232
232
|
this.handleTagRemove(new CustomEvent("sd-remove"), option);
|
|
233
233
|
this.updateComplete.then(() => {
|
|
234
234
|
if (nextTag) {
|
|
@@ -248,7 +248,7 @@ var SdSelect = class extends SolidElement {
|
|
|
248
248
|
this.handleTagRemove(new CustomEvent("sd-remove"), this.selectedOptions[this.selectedOptions.length - 1]);
|
|
249
249
|
this.updateComplete.then(() => {
|
|
250
250
|
var _a;
|
|
251
|
-
const tags = (_a = this.shadowRoot) == null ? void 0 : _a.querySelectorAll("sd-6-12-
|
|
251
|
+
const tags = (_a = this.shadowRoot) == null ? void 0 : _a.querySelectorAll("sd-6-12-1-tag");
|
|
252
252
|
if (tags && tags.length > 0) {
|
|
253
253
|
tags == null ? void 0 : tags[(tags == null ? void 0 : tags.length) - 1].focus();
|
|
254
254
|
} else {
|
|
@@ -294,7 +294,7 @@ var SdSelect = class extends SolidElement {
|
|
|
294
294
|
}
|
|
295
295
|
handleOptionClick(event) {
|
|
296
296
|
const target = event.target;
|
|
297
|
-
const option = target.closest("sd-6-12-
|
|
297
|
+
const option = target.closest("sd-6-12-1-option");
|
|
298
298
|
const oldValue = this.value;
|
|
299
299
|
if (option && !option.disabled) {
|
|
300
300
|
if (this.multiple) {
|
|
@@ -319,7 +319,7 @@ var SdSelect = class extends SolidElement {
|
|
|
319
319
|
const allOptions = this.getAllOptions();
|
|
320
320
|
const value = Array.isArray(this.value) ? this.value : [this.value];
|
|
321
321
|
const values = [];
|
|
322
|
-
if (customElements.get("sd-6-12-
|
|
322
|
+
if (customElements.get("sd-6-12-1-option")) {
|
|
323
323
|
allOptions.forEach((option) => {
|
|
324
324
|
if (this.multiple) {
|
|
325
325
|
option.checkbox = true;
|
|
@@ -328,7 +328,7 @@ var SdSelect = class extends SolidElement {
|
|
|
328
328
|
});
|
|
329
329
|
this.setSelectedOptions(allOptions.filter((el) => value.includes(el.value)));
|
|
330
330
|
} else {
|
|
331
|
-
customElements.whenDefined("sd-6-12-
|
|
331
|
+
customElements.whenDefined("sd-6-12-1-option").then(() => this.handleDefaultSlotChange());
|
|
332
332
|
}
|
|
333
333
|
}
|
|
334
334
|
handleTagRemove(event, option) {
|
|
@@ -345,13 +345,13 @@ var SdSelect = class extends SolidElement {
|
|
|
345
345
|
});
|
|
346
346
|
}
|
|
347
347
|
}
|
|
348
|
-
// Gets an array of all <sd-6-12-
|
|
348
|
+
// Gets an array of all <sd-6-12-1-option> elements
|
|
349
349
|
getAllOptions() {
|
|
350
|
-
return [...this.querySelectorAll("sd-6-12-
|
|
350
|
+
return [...this.querySelectorAll("sd-6-12-1-option")];
|
|
351
351
|
}
|
|
352
|
-
// Gets the first <sd-6-12-
|
|
352
|
+
// Gets the first <sd-6-12-1-option> element
|
|
353
353
|
getFirstOption() {
|
|
354
|
-
return this.querySelector("sd-6-12-
|
|
354
|
+
return this.querySelector("sd-6-12-1-option");
|
|
355
355
|
}
|
|
356
356
|
// Sets the current option, which is the option the user is currently interacting with (e.g. via keyboard). Only one
|
|
357
357
|
// option may be "current" at a time.
|
|
@@ -450,11 +450,11 @@ var SdSelect = class extends SolidElement {
|
|
|
450
450
|
});
|
|
451
451
|
} else {
|
|
452
452
|
return [
|
|
453
|
-
html`<sd-6-12-
|
|
453
|
+
html`<sd-6-12-1-tag class="z-10 min-w-0 max-w-full" ?disabled="${this.disabled}" part="tag" exportparts="
|
|
454
454
|
base:tag__base,
|
|
455
455
|
content:tag__content,
|
|
456
456
|
removable-indicator:tag__removable-indicator,
|
|
457
|
-
" size="${this.size === "sm" ? "sm" : "lg"}" removable @keydown="${(event) => this.handleTagMaxOptionsKeyDown(event)}" @sd-remove="${(event) => this.handleTagRemove(event)}">${this.selectedOptions.length} ${this.localize.term("tagsSelected")}</sd-6-12-
|
|
457
|
+
" size="${this.size === "sm" ? "sm" : "lg"}" removable @keydown="${(event) => this.handleTagMaxOptionsKeyDown(event)}" @sd-remove="${(event) => this.handleTagRemove(event)}">${this.selectedOptions.length} ${this.localize.term("tagsSelected")}</sd-6-12-1-tag>`
|
|
458
458
|
];
|
|
459
459
|
}
|
|
460
460
|
}
|
|
@@ -463,7 +463,7 @@ var SdSelect = class extends SolidElement {
|
|
|
463
463
|
this.formControlController.emitInvalidEvent(event);
|
|
464
464
|
this.invalidMessage.textContent = event.target.validationMessage;
|
|
465
465
|
}
|
|
466
|
-
/** Receives incoming event detail from sd-6-12-
|
|
466
|
+
/** Receives incoming event detail from sd-6-12-1-popup and updates local state for conditional styling. */
|
|
467
467
|
handleCurrentPlacement(e) {
|
|
468
468
|
const incomingPlacement = e.detail;
|
|
469
469
|
if (incomingPlacement) {
|
|
@@ -472,7 +472,7 @@ var SdSelect = class extends SolidElement {
|
|
|
472
472
|
}
|
|
473
473
|
handleUseTagsChange() {
|
|
474
474
|
const allOptions = this.getAllOptions();
|
|
475
|
-
if (customElements.get("sd-6-12-
|
|
475
|
+
if (customElements.get("sd-6-12-1-option")) {
|
|
476
476
|
allOptions.forEach((option) => {
|
|
477
477
|
option.checkbox = this.multiple;
|
|
478
478
|
});
|
|
@@ -629,7 +629,7 @@ var SdSelect = class extends SolidElement {
|
|
|
629
629
|
default: "form-control-color-border"
|
|
630
630
|
}[selectState],
|
|
631
631
|
this.open && (this.currentPlacement === "bottom" ? "rounded-bl-none rounded-br-none" : "rounded-tl-none rounded-tr-none")
|
|
632
|
-
)}"></div><sd-6-12-
|
|
632
|
+
)}"></div><sd-6-12-1-popup @sd-current-placement="${this.handleCurrentPlacement}" class="${cx(
|
|
633
633
|
"inline-flex relative w-full",
|
|
634
634
|
this.currentPlacement === "bottom" ? "origin-top" : "origin-bottom"
|
|
635
635
|
)}" placement="${this.placement}" strategy="${this.hoist ? "fixed" : "absolute"}" flip sync="width" auto-size="vertical" auto-size-padding="10" exportparts="
|
|
@@ -656,12 +656,12 @@ var SdSelect = class extends SolidElement {
|
|
|
656
656
|
"select__clear flex justify-center",
|
|
657
657
|
iconMarginLeft,
|
|
658
658
|
this.value.length > 0 ? "visible" : "hidden"
|
|
659
|
-
)}" type="button" aria-label="${this.localize.term("clearEntry")}" @mousedown="${this.handleClearMouseDown}" @click="${this.handleClearClick}" tabindex="-1"><slot name="clear-icon"><sd-6-12-
|
|
659
|
+
)}" type="button" aria-label="${this.localize.term("clearEntry")}" @mousedown="${this.handleClearMouseDown}" @click="${this.handleClearClick}" tabindex="-1"><slot name="clear-icon"><sd-6-12-1-icon class="${cx("text-neutral-700 z-10", iconSize)}" library="_internal" name="closing-round"></sd-6-12-1-icon></slot></button>` : ""} ${this.showInvalidStyle ? html`<sd-6-12-1-icon part="invalid-icon" class="${cx(iconMarginLeft, iconSize, "text-error")}" library="_internal" name="risk"></sd-6-12-1-icon>` : ""} ${this.styleOnValid && this.showValidStyle ? html`<sd-6-12-1-icon part="valid-icon" class="${cx("flex-shrink-0 text-success", iconMarginLeft, iconSize)}" library="_internal" name="confirm-circle"></sd-6-12-1-icon>` : ""}<slot name="expand-icon" part="expand-icon" class="${cx(
|
|
660
660
|
"inline-flex ml-2 items-center transition-transform duration-medium ease-in-out",
|
|
661
661
|
this.open ? "rotate-180" : "rotate-0",
|
|
662
662
|
this.disabled || this.visuallyDisabled ? "text-neutral-500" : "text-primary",
|
|
663
663
|
iconSize
|
|
664
|
-
)}"><sd-6-12-
|
|
664
|
+
)}"><sd-6-12-1-icon name="chevron-down" part="chevron" library="_internal" color="currentColor"></sd-6-12-1-icon></slot></div><button part="combobox" class="${cx(
|
|
665
665
|
"relative w-full px-4 flex flex-row items-center rounded-default focus-visible:outline-none",
|
|
666
666
|
cursorStyles,
|
|
667
667
|
this.open && "shadow transition-shadow duration-medium ease-in-out",
|
|
@@ -674,7 +674,7 @@ var SdSelect = class extends SolidElement {
|
|
|
674
674
|
"bg-white px-2 py-3 relative border-primary overflow-y-auto",
|
|
675
675
|
this.open && "shadow transition-shadow duration-medium ease-in-out",
|
|
676
676
|
this.currentPlacement === "bottom" ? "border-r-2 border-b-2 border-l-2 rounded-br-default rounded-bl-default" : "border-r-2 border-t-2 border-l-2 rounded-tr-default rounded-tl-default"
|
|
677
|
-
)}" tabindex="-1" @mouseup="${this.handleOptionClick}" @slotchange="${this.handleDefaultSlotChange}"><slot></slot></div></sd-6-12-
|
|
677
|
+
)}" tabindex="-1" @mouseup="${this.handleOptionClick}" @slotchange="${this.handleDefaultSlotChange}"><slot></slot></div></sd-6-12-1-popup></div><div class="text-sm text-neutral-700 mt-1" part="form-control-help-text" id="help-text" aria-hidden="${hasHelpText ? "false" : "true"}"><slot name="help-text">${this.helpText}</slot></div></div>${this.formControlController.renderInvalidMessage(this.size)}`;
|
|
678
678
|
}
|
|
679
679
|
};
|
|
680
680
|
/**
|
|
@@ -683,13 +683,13 @@ var SdSelect = class extends SolidElement {
|
|
|
683
683
|
SdSelect.styles = [
|
|
684
684
|
...SolidElement.styles,
|
|
685
685
|
css`/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
|
|
686
|
-
:host{position:relative;display:block;width:auto}:host([required]) #label::after{content:' *'}:host([disabled]) ::-moz-placeholder,:host([visually-disabled]) ::-moz-placeholder{color:rgba(var(--sd-color-text-neutral-500))}:host([disabled]) ::placeholder,:host([visually-disabled]) ::placeholder{color:rgba(var(--sd-color-text-neutral-500))}[part=listbox]{max-height:var(--auto-size-available-height,auto)}.input-container,[part=combobox]{grid-column:1/1;grid-row:1/1}sd-6-12-
|
|
686
|
+
:host{position:relative;display:block;width:auto}:host([required]) #label::after{content:' *'}:host([disabled]) ::-moz-placeholder,:host([visually-disabled]) ::-moz-placeholder{color:rgba(var(--sd-color-text-neutral-500))}:host([disabled]) ::placeholder,:host([visually-disabled]) ::placeholder{color:rgba(var(--sd-color-text-neutral-500))}[part=listbox]{max-height:var(--auto-size-available-height,auto)}.input-container,[part=combobox]{grid-column:1/1;grid-row:1/1}sd-6-12-1-popup::part(popup){z-index:var(--sd-z-index-dropdown,900)}sd-6-12-1-tag::part(base){border-radius:var(--sd-radius);padding-inline:var(--sd-spacing-1)}sd-6-12-1-tag::part(content){display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:var(--tag-max-width,15ch)}sd-6-12-1-tag[size=lg]::part(base){padding-inline:var(--sd-spacing-2)}sd-6-12-1-tag[disabled=false]::part(base):hover{background-color:rgba(var(--sd-color-background-primary-100))}`
|
|
687
687
|
];
|
|
688
688
|
__decorateClass([
|
|
689
|
-
queryAssignedElements({ selector: "sd-6-12-
|
|
689
|
+
queryAssignedElements({ selector: "sd-6-12-1-option" })
|
|
690
690
|
], SdSelect.prototype, "_optionsInDefaultSlot", 2);
|
|
691
691
|
__decorateClass([
|
|
692
|
-
query("sd-6-12-
|
|
692
|
+
query("sd-6-12-1-popup")
|
|
693
693
|
], SdSelect.prototype, "popup", 2);
|
|
694
694
|
__decorateClass([
|
|
695
695
|
query('[part="combobox"]')
|
|
@@ -817,7 +817,7 @@ __decorateClass([
|
|
|
817
817
|
watch(["size", "floatingLabel"])
|
|
818
818
|
], SdSelect.prototype, "handleSizeChange", 1);
|
|
819
819
|
SdSelect = __decorateClass([
|
|
820
|
-
customElement("sd-6-12-
|
|
820
|
+
customElement("sd-6-12-1-select")
|
|
821
821
|
], SdSelect);
|
|
822
822
|
setDefaultAnimation("select.show", {
|
|
823
823
|
keyframes: [{ opacity: 0 }, { opacity: 1 }],
|
|
@@ -53,7 +53,7 @@ var SdNavigationItem = class extends SolidElement {
|
|
|
53
53
|
}
|
|
54
54
|
if (node.nodeType === Node.ELEMENT_NODE) {
|
|
55
55
|
const element = node;
|
|
56
|
-
return element.tagName.toLowerCase() === "sd-6-12-
|
|
56
|
+
return element.tagName.toLowerCase() === "sd-6-12-1-icon";
|
|
57
57
|
}
|
|
58
58
|
return false;
|
|
59
59
|
});
|
|
@@ -126,8 +126,8 @@ var SdNavigationItem = class extends SolidElement {
|
|
|
126
126
|
const root = html`<${tag} part="base" class="${cx(
|
|
127
127
|
"flex items-center cursor-pointer relative focus-visible:focus-outline group hover:bg-neutral-200 transition-colors duration-fast ease-in-out min-h-[48px] navigable-border-radius",
|
|
128
128
|
{ md: "navigable-font-size", lg: "text-lg", sm: "text-[14px]" }[this.size],
|
|
129
|
-
this.disabled ? "text-neutral-500 pointer-events-none" : "sd-6-12-
|
|
130
|
-
this.current && "font-bold sd-6-12-
|
|
129
|
+
this.disabled ? "text-neutral-500 pointer-events-none" : "sd-6-12-1-navigation-item-color-text",
|
|
130
|
+
this.current && "font-bold sd-6-12-1-navigation-item--current-color-text",
|
|
131
131
|
!isAccordion && "w-full",
|
|
132
132
|
this.divider && this.vertical && "mt-0.25",
|
|
133
133
|
!this.vertical && "inline-flex items-center",
|
|
@@ -143,19 +143,19 @@ var SdNavigationItem = class extends SolidElement {
|
|
|
143
143
|
slots["description"] && "pt-3",
|
|
144
144
|
!slots["description"] && !this.separated && horizontalPadding,
|
|
145
145
|
this.calculatePaddingX
|
|
146
|
-
)}">${this.divider && this.vertical ? html`<sd-6-12-
|
|
146
|
+
)}">${this.divider && this.vertical ? html`<sd-6-12-1-divider part="divider" class="${cx("w-full transition-all absolute -top-0.25 left-0", this.calculatePaddingX)}"></sd-6-12-1-divider>` : ""} <span id="content" part="content-container" class="inline-flex items-center flex-auto"><slot part="content" class="inline-flex text-start"></slot></span>${this.chevron || slots["children"] && this.vertical && !this.separated ? html`<sd-6-12-1-icon name="chevron-down" part="chevron" library="_internal" color="currentColor" class="${cx(
|
|
147
147
|
"h-6 w-6 ml-2 transition-all",
|
|
148
148
|
isAccordion ? this.open ? "rotate-180" : "rotate-0" : "rotate-[270deg]"
|
|
149
|
-
)}"></sd-6-12-
|
|
149
|
+
)}"></sd-6-12-1-icon>` : ""} </span>${slots["description"] && this.vertical ? html`<slot id="description" name="description" part="description" class="${cx(
|
|
150
150
|
"inline-block text-sm text-left font-normal text-black pb-3",
|
|
151
151
|
isAccordion || this.separated ? "grow" : "w-full",
|
|
152
152
|
this.calculatePaddingX
|
|
153
153
|
)}"></slot>` : ""}</div></${tag}>`;
|
|
154
154
|
if (this.separated) {
|
|
155
|
-
return html`<div part="details" id="navigation-item-details" class="relative flex flex-col"><div class="flex items-start">${root} ${slots["children"] && this.vertical ? html`<button type="button" title="${this.open ? this.localize.term("collapseNavigationItem") : this.localize.term("expandNavigationItem")}" class="sd-interactive sd-interactive--reset -mt-1" @click="${this.handleClickSummary}"><sd-6-12-
|
|
155
|
+
return html`<div part="details" id="navigation-item-details" class="relative flex flex-col"><div class="flex items-start">${root} ${slots["children"] && this.vertical ? html`<button type="button" title="${this.open ? this.localize.term("collapseNavigationItem") : this.localize.term("expandNavigationItem")}" class="sd-interactive sd-interactive--reset -mt-1" @click="${this.handleClickSummary}"><sd-6-12-1-icon name="chevron-down" part="chevron" library="_internal" color="currentColor" class="${cx(
|
|
156
156
|
"m-4 h-6 w-6 transition-all",
|
|
157
157
|
isAccordion || this.separated ? this.open ? "rotate-180" : "rotate-0" : "rotate-[270deg]"
|
|
158
|
-
)}"></sd-6-12-
|
|
158
|
+
)}"></sd-6-12-1-icon></button>` : ""}</div>${this.open ? html`<slot name="children"></slot>` : ""}</div>`;
|
|
159
159
|
}
|
|
160
160
|
if (isAccordion) {
|
|
161
161
|
return html`<details aria-expanded="${this.open}" part="details" id="navigation-item-details" ?open="${this.open}" class="relative">${root}<slot name="children"></slot></details>`;
|
|
@@ -217,7 +217,7 @@ __decorateClass([
|
|
|
217
217
|
property({ type: Boolean, reflect: true })
|
|
218
218
|
], SdNavigationItem.prototype, "separated", 2);
|
|
219
219
|
SdNavigationItem = __decorateClass([
|
|
220
|
-
customElement("sd-6-12-
|
|
220
|
+
customElement("sd-6-12-1-navigation-item")
|
|
221
221
|
], SdNavigationItem);
|
|
222
222
|
|
|
223
223
|
export {
|
|
@@ -31,12 +31,12 @@ var SdQuickfact = class extends SdAccordion {
|
|
|
31
31
|
this.expandable && "cursor-pointer select-none"
|
|
32
32
|
)}" role="${ifDefined(this.expandable ? "button" : void 0)}" aria-expanded="${ifDefined(this.expandable ? this.open ? "true" : "false" : void 0)}" aria-controls="${ifDefined(this.expandable ? "content" : void 0)}" tabindex="${this.expandable ? "0" : "-1"}" @click="${this.expandable ? this.handleSummaryClick : null}" @keydown="${this.expandable ? this.handleSummaryKeyDown : null}"><div part="icon" class="${cx("flex flex-grow-0 flex-shrink-0 flex-auto items-center", !this.expandable && "cursor-default")}"><slot name="icon"></slot></div><slot name="summary" part="summary" class="${cx(
|
|
33
33
|
"flex flex-auto items-start text-left text-base leading-normal font-normal sm:leading-tight sm:text-3xl sm:text-center",
|
|
34
|
-
this.expandable ? "sd-6-12-
|
|
34
|
+
this.expandable ? "sd-6-12-1-quickfact--expandable-color-text" : "text-black cursor-default"
|
|
35
35
|
)}">${this.summary}</slot><span part="summary-icon" class="${cx(
|
|
36
36
|
"flex flex-grow-0 flex-shrink-0 flex-auto self-start sm:self-center transition-transform ease-in-out duration-medium text-xl sm:mt-2",
|
|
37
37
|
this.open && "rotate-180",
|
|
38
38
|
!this.expandable && "hidden"
|
|
39
|
-
)}"><slot name="expand-icon" class="${cx(this.open && "hidden")}"><sd-6-12-
|
|
39
|
+
)}"><slot name="expand-icon" class="${cx(this.open && "hidden")}"><sd-6-12-1-icon library="_internal" name="chevron-down" class="group-hover:text-primary-500 transition-colors ease-in-out duration-medium"></sd-6-12-1-icon></slot><slot name="collapse-icon" class="${cx(!this.open && "hidden")}"><sd-6-12-1-icon library="_internal" name="chevron-down" class="group-hover:text-primary-500 transition-colors ease-in-out duration-medium"></sd-6-12-1-icon></slot></span></${header}><div part="content" id="content" class="${cx("overflow-hidden", !this.expandable && "hidden")}"><slot part="content__slot" class="block" role="region" aria-labelledby="header"></slot></div></${base}>`;
|
|
40
40
|
}
|
|
41
41
|
};
|
|
42
42
|
SdQuickfact.styles = [
|
|
@@ -48,7 +48,7 @@ __decorateClass([
|
|
|
48
48
|
property({ type: Boolean, reflect: true })
|
|
49
49
|
], SdQuickfact.prototype, "expandable", 2);
|
|
50
50
|
SdQuickfact = __decorateClass([
|
|
51
|
-
customElement("sd-6-12-
|
|
51
|
+
customElement("sd-6-12-1-quickfact")
|
|
52
52
|
], SdQuickfact);
|
|
53
53
|
setDefaultAnimation("quickfact.show", {
|
|
54
54
|
keyframes: [{ height: "0" }, { height: "auto" }],
|
|
@@ -42,16 +42,16 @@ var SdAccordionGroup = class extends SolidElement {
|
|
|
42
42
|
SdAccordionGroup.styles = [
|
|
43
43
|
...SolidElement.styles,
|
|
44
44
|
css`/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
|
|
45
|
-
:host{display:block}::slotted(sd-6-12-
|
|
45
|
+
:host{display:block}::slotted(sd-6-12-1-accordion:not(:first-of-type)){margin-top:calc(-1 * var(--sd-accordion-border-width))!important}`
|
|
46
46
|
];
|
|
47
47
|
__decorateClass([
|
|
48
|
-
queryAssignedElements({ selector: "sd-6-12-
|
|
48
|
+
queryAssignedElements({ selector: "sd-6-12-1-accordion" })
|
|
49
49
|
], SdAccordionGroup.prototype, "_accordionsInDefaultSlot", 2);
|
|
50
50
|
__decorateClass([
|
|
51
51
|
property({ attribute: "close-others", type: Boolean, reflect: true })
|
|
52
52
|
], SdAccordionGroup.prototype, "closeOthers", 2);
|
|
53
53
|
SdAccordionGroup = __decorateClass([
|
|
54
|
-
customElement("sd-6-12-
|
|
54
|
+
customElement("sd-6-12-1-accordion-group")
|
|
55
55
|
], SdAccordionGroup);
|
|
56
56
|
|
|
57
57
|
export {
|
|
@@ -22,7 +22,7 @@ var SdBreadcrumb = class extends SolidElement {
|
|
|
22
22
|
this.isTruncated = false;
|
|
23
23
|
}
|
|
24
24
|
get items() {
|
|
25
|
-
return this.querySelectorAll("sd-6-12-
|
|
25
|
+
return this.querySelectorAll("sd-6-12-1-breadcrumb-item");
|
|
26
26
|
}
|
|
27
27
|
cacheItemPositions() {
|
|
28
28
|
this.items.forEach((item) => {
|
|
@@ -67,12 +67,12 @@ var SdBreadcrumb = class extends SolidElement {
|
|
|
67
67
|
}
|
|
68
68
|
handleMobileChevron() {
|
|
69
69
|
var _a, _b, _c;
|
|
70
|
-
const icon = document.createElement("sd-6-12-
|
|
70
|
+
const icon = document.createElement("sd-6-12-1-icon");
|
|
71
71
|
icon.setAttribute("slot", "icon-left");
|
|
72
72
|
icon.setAttribute("library", "_internal");
|
|
73
73
|
icon.setAttribute("name", "chevron-left");
|
|
74
74
|
icon.setAttribute("class", "text-base me-1 lg:hidden");
|
|
75
|
-
(_c = (_b = (_a = Array.from(this.items).at(-2)) == null ? void 0 : _a.shadowRoot) == null ? void 0 : _b.querySelector("sd-6-12-
|
|
75
|
+
(_c = (_b = (_a = Array.from(this.items).at(-2)) == null ? void 0 : _a.shadowRoot) == null ? void 0 : _b.querySelector("sd-6-12-1-link")) == null ? void 0 : _c.appendChild(icon);
|
|
76
76
|
}
|
|
77
77
|
handleSlotChange() {
|
|
78
78
|
this.handleMobileChevron();
|
|
@@ -87,13 +87,13 @@ var SdBreadcrumb = class extends SolidElement {
|
|
|
87
87
|
this.resizeObserver.unobserve(this);
|
|
88
88
|
}
|
|
89
89
|
render() {
|
|
90
|
-
return html`<nav part="base" class="flex items-center pb-1" aria-label="${this.label}"><sd-6-12-
|
|
90
|
+
return html`<nav part="base" class="flex items-center pb-1" aria-label="${this.label}"><sd-6-12-1-dropdown part="truncated" class="${cx(!this.isTruncated && "absolute opacity-0 pointer-events-none")}"><button slot="trigger" tabindex="${this.isTruncated ? "0" : "-1"}" aria-label="${this.localize.term("truncatedBreadcrumbs")}" aria-expanded="false" aria-haspopup="true" class="flex sd-interactive">[...]</button><ol part="truncated-dropdown" class="flex flex-col gap-4 px-2 py-3 min-w-40"></ol></sd-6-12-1-dropdown><ol part="list" class="flex items-center"><slot @slotchange="${this.handleSlotChange}"></slot></ol></nav>`;
|
|
91
91
|
}
|
|
92
92
|
};
|
|
93
93
|
SdBreadcrumb.styles = [
|
|
94
94
|
...SolidElement.styles,
|
|
95
95
|
css`/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
|
|
96
|
-
:host{position:relative;display:block}::slotted(sd-6-12-
|
|
96
|
+
:host{position:relative;display:block}::slotted(sd-6-12-1-breadcrumb-item:not(:last-of-type))::after,sd-6-12-1-dropdown::after{margin-inline:var(--sd-spacing-2);display:none;height:var(--sd-spacing-1);width:var(--sd-spacing-1);border-radius:var(--sd-radius-full);background-color:rgba(var(--sd-breadcrumb__separator-color,rgba(var(--sd-color-neutral-400))));--tw-content:'';content:var(--tw-content)}@media (width >= 64rem){::slotted(sd-6-12-1-breadcrumb-item:not(:last-of-type))::after,sd-6-12-1-dropdown::after{display:inline-block}}::slotted(sd-6-12-1-breadcrumb-item:nth-last-child(2)){display:flex}@media (width >= 64rem){::slotted(sd-6-12-1-breadcrumb-item:nth-last-child(2))::after{background-color:rgba(var(--sd-color-background-accent))}}::slotted(sd-6-12-1-breadcrumb-item),sd-6-12-1-dropdown{display:none;align-items:center;font-size:var(--sd-text-sm);line-height:var(--tw-leading,var(--text-sm--line-height,calc(1.25 / .875)))}@media (width >= 64rem){::slotted(sd-6-12-1-breadcrumb-item),sd-6-12-1-dropdown{display:flex}}@property --tw-content{syntax:"*";inherits:false;initial-value:""}`
|
|
97
97
|
];
|
|
98
98
|
__decorateClass([
|
|
99
99
|
query('[part="base"]')
|
|
@@ -117,7 +117,7 @@ __decorateClass([
|
|
|
117
117
|
state()
|
|
118
118
|
], SdBreadcrumb.prototype, "isTruncated", 2);
|
|
119
119
|
SdBreadcrumb = __decorateClass([
|
|
120
|
-
customElement("sd-6-12-
|
|
120
|
+
customElement("sd-6-12-1-breadcrumb")
|
|
121
121
|
], SdBreadcrumb);
|
|
122
122
|
|
|
123
123
|
export {
|