@solid-design-system/components 6.0.0-next.17 → 6.0.0-next.18
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/custom-elements.json +1 -1
- package/cdn/web-types.json +1 -1
- package/cdn-versioned/chunks/chunk.22CCXPHJ.js +2 -2
- package/cdn-versioned/chunks/chunk.2NVSBN54.js +2 -2
- package/cdn-versioned/chunks/chunk.2VJYV5BY.js +1 -1
- package/cdn-versioned/chunks/chunk.2YGJH25L.js +2 -2
- package/cdn-versioned/chunks/chunk.3DMGMET2.js +1 -1
- package/cdn-versioned/chunks/chunk.4EVW5NQN.js +2 -2
- package/cdn-versioned/chunks/chunk.4U7ZECWB.js +2 -2
- package/cdn-versioned/chunks/chunk.62US4TJV.js +3 -3
- package/cdn-versioned/chunks/chunk.77FHAJLL.js +1 -1
- package/cdn-versioned/chunks/chunk.7H4P4PDT.js +2 -2
- package/cdn-versioned/chunks/chunk.7O3MPE7X.js +2 -2
- package/cdn-versioned/chunks/chunk.7PP3ESWS.js +2 -2
- package/cdn-versioned/chunks/chunk.AAHU44T4.js +2 -2
- package/cdn-versioned/chunks/chunk.ALCI4HY2.js +1 -1
- package/cdn-versioned/chunks/chunk.AMEM2SO3.js +1 -1
- package/cdn-versioned/chunks/chunk.BQUBETLX.js +2 -2
- package/cdn-versioned/chunks/chunk.BTDO4QHS.js +2 -2
- package/cdn-versioned/chunks/chunk.BZTTDLZU.js +2 -2
- package/cdn-versioned/chunks/chunk.CDP46OS4.js +1 -1
- package/cdn-versioned/chunks/chunk.CRURCGRK.js +2 -2
- package/cdn-versioned/chunks/chunk.CRWDTBDK.js +2 -2
- package/cdn-versioned/chunks/chunk.CWK7H3FQ.js +2 -2
- package/cdn-versioned/chunks/chunk.D6VARJ7Y.js +2 -2
- package/cdn-versioned/chunks/chunk.EB3THMQR.js +1 -1
- package/cdn-versioned/chunks/chunk.F6QCZ4MZ.js +2 -2
- package/cdn-versioned/chunks/chunk.FBDWZOOZ.js +2 -2
- package/cdn-versioned/chunks/chunk.FIA7TCHK.js +5 -5
- package/cdn-versioned/chunks/chunk.FLPQA4BU.js +3 -3
- package/cdn-versioned/chunks/chunk.FLXHLGUA.js +1 -1
- package/cdn-versioned/chunks/chunk.FRLH4VF3.js +1 -1
- package/cdn-versioned/chunks/chunk.H5CQDX46.js +5 -5
- package/cdn-versioned/chunks/chunk.I5MPXCAO.js +8 -8
- package/cdn-versioned/chunks/chunk.IYZBVAA7.js +2 -2
- package/cdn-versioned/chunks/chunk.JS2HQ2N4.js +1 -1
- package/cdn-versioned/chunks/chunk.K4LRVK2B.js +2 -2
- package/cdn-versioned/chunks/chunk.K4VSKKMO.js +1 -1
- package/cdn-versioned/chunks/chunk.LA7LFFT4.js +2 -2
- package/cdn-versioned/chunks/chunk.LRQ24UAJ.js +2 -2
- package/cdn-versioned/chunks/chunk.MIVJN2QZ.js +2 -2
- package/cdn-versioned/chunks/chunk.MTLVNKRG.js +2 -2
- package/cdn-versioned/chunks/chunk.OAYLOD6C.js +2 -2
- package/cdn-versioned/chunks/chunk.OXXHRKP2.js +2 -2
- package/cdn-versioned/chunks/chunk.P3Q4ZXYZ.js +2 -2
- package/cdn-versioned/chunks/chunk.PESXZHIR.js +2 -2
- package/cdn-versioned/chunks/chunk.QGEF6LTQ.js +2 -2
- package/cdn-versioned/chunks/chunk.RDFW6FZP.js +2 -2
- package/cdn-versioned/chunks/chunk.RRJE4KPF.js +2 -2
- package/cdn-versioned/chunks/chunk.SPAZJMG4.js +2 -2
- package/cdn-versioned/chunks/chunk.SPP6MW2X.js +2 -2
- package/cdn-versioned/chunks/chunk.TP4BG34O.js +2 -2
- package/cdn-versioned/chunks/chunk.URGWTDWY.js +2 -2
- package/cdn-versioned/chunks/chunk.VTDQOKJM.js +2 -2
- package/cdn-versioned/chunks/chunk.W7A3TU2Z.js +1 -1
- package/cdn-versioned/chunks/chunk.WPFGUIZ3.js +2 -2
- package/cdn-versioned/chunks/chunk.WXUF65Q3.js +2 -2
- package/cdn-versioned/chunks/chunk.XHNB4GKM.js +2 -2
- package/cdn-versioned/chunks/chunk.XPPKJJGY.js +2 -2
- package/cdn-versioned/chunks/chunk.XVBBYULT.js +1 -1
- package/cdn-versioned/chunks/chunk.YCUW3CQB.js +2 -2
- package/cdn-versioned/chunks/chunk.YJC7AXB7.js +2 -2
- package/cdn-versioned/chunks/chunk.YKHV5TNT.js +2 -2
- package/cdn-versioned/chunks/chunk.YUO4QWBT.js +1 -1
- package/cdn-versioned/chunks/chunk.Z5DGSF5Q.js +2 -2
- package/cdn-versioned/chunks/chunk.ZVQLZBSU.js +1 -1
- 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/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 +250 -250
- package/cdn-versioned/internal/form.js +3 -3
- package/cdn-versioned/solid-components.bundle.js +79 -79
- package/cdn-versioned/solid-components.css +2 -2
- package/cdn-versioned/solid-components.iife.js +79 -79
- package/cdn-versioned/vscode.html-custom-data.json +95 -95
- package/cdn-versioned/web-types.json +164 -164
- package/dist/custom-elements.json +1 -1
- package/dist/web-types.json +1 -1
- package/dist-versioned/chunks/chunk.2W5MM7HR.js +6 -6
- package/dist-versioned/chunks/chunk.3DZRUVDI.js +5 -5
- package/dist-versioned/chunks/chunk.3UREZKLQ.js +2 -2
- package/dist-versioned/chunks/chunk.4LMIOELP.js +2 -2
- package/dist-versioned/chunks/chunk.5YR4L6ZG.js +2 -2
- package/dist-versioned/chunks/chunk.76LE4BPL.js +4 -4
- package/dist-versioned/chunks/chunk.76YV6AY5.js +8 -8
- package/dist-versioned/chunks/chunk.AUNSZRBQ.js +1 -1
- package/dist-versioned/chunks/chunk.AUWFJ6KR.js +2 -2
- package/dist-versioned/chunks/chunk.AYA7WMLI.js +1 -1
- package/dist-versioned/chunks/chunk.BT4V2WPS.js +5 -5
- package/dist-versioned/chunks/chunk.BVGYMFAR.js +5 -5
- package/dist-versioned/chunks/chunk.BWFAN5T4.js +5 -5
- package/dist-versioned/chunks/chunk.DUPO2RAV.js +3 -3
- package/dist-versioned/chunks/chunk.EGZ57KTV.js +3 -3
- package/dist-versioned/chunks/chunk.EPZFBHM5.js +2 -2
- package/dist-versioned/chunks/chunk.F3WAQKPZ.js +4 -4
- package/dist-versioned/chunks/chunk.FJXMO4AJ.js +3 -3
- package/dist-versioned/chunks/chunk.FTQNZE7U.js +3 -3
- package/dist-versioned/chunks/chunk.G327Z3UW.js +2 -2
- package/dist-versioned/chunks/chunk.G4LU2DPT.js +7 -7
- package/dist-versioned/chunks/chunk.GLKP6FBY.js +2 -2
- package/dist-versioned/chunks/chunk.GTG5NCJH.js +7 -7
- package/dist-versioned/chunks/chunk.GUAIWPL4.js +1 -1
- package/dist-versioned/chunks/chunk.HC6LHKKU.js +5 -5
- package/dist-versioned/chunks/chunk.HHKPFIAB.js +1 -1
- package/dist-versioned/chunks/chunk.HOQ7HWJ2.js +4 -4
- package/dist-versioned/chunks/chunk.HPCBK4U6.js +11 -11
- package/dist-versioned/chunks/chunk.IJLFM2YE.js +8 -8
- package/dist-versioned/chunks/chunk.IP6WZTQB.js +2 -2
- package/dist-versioned/chunks/chunk.J2JUTR3O.js +4 -4
- package/dist-versioned/chunks/chunk.J3LIXAL2.js +8 -8
- package/dist-versioned/chunks/chunk.JE5DROBO.js +1 -1
- package/dist-versioned/chunks/chunk.K3WOPEVW.js +6 -6
- package/dist-versioned/chunks/chunk.KEJFWGZI.js +4 -4
- package/dist-versioned/chunks/chunk.LZEWZD6Z.js +4 -4
- package/dist-versioned/chunks/chunk.MGI5NELL.js +3 -3
- package/dist-versioned/chunks/chunk.N4OTT34O.js +4 -4
- package/dist-versioned/chunks/chunk.NLVFG55I.js +3 -3
- package/dist-versioned/chunks/chunk.O3GL2NJZ.js +3 -3
- package/dist-versioned/chunks/chunk.P3AEQTO4.js +8 -8
- package/dist-versioned/chunks/chunk.PXABEZTS.js +26 -26
- package/dist-versioned/chunks/chunk.QBW7TVOK.js +26 -26
- package/dist-versioned/chunks/chunk.QDGO562V.js +3 -3
- package/dist-versioned/chunks/chunk.QLNTXQ74.js +1 -1
- package/dist-versioned/chunks/chunk.QMAANEK5.js +12 -12
- package/dist-versioned/chunks/chunk.RN3MHCKA.js +1 -1
- package/dist-versioned/chunks/chunk.RSHUGRW4.js +2 -2
- package/dist-versioned/chunks/chunk.RYXJEAJP.js +24 -24
- package/dist-versioned/chunks/chunk.RZYPRKWX.js +3 -3
- package/dist-versioned/chunks/chunk.TANNWOC5.js +1 -1
- package/dist-versioned/chunks/chunk.U2BN2DBY.js +4 -4
- package/dist-versioned/chunks/chunk.UAKAZZQ5.js +12 -12
- package/dist-versioned/chunks/chunk.UE4M2UDJ.js +4 -4
- package/dist-versioned/chunks/chunk.UIQBHPD3.js +2 -2
- package/dist-versioned/chunks/chunk.ULHJFA5A.js +4 -4
- package/dist-versioned/chunks/chunk.VHCJ4ERI.js +2 -2
- package/dist-versioned/chunks/chunk.XCCVIHHK.js +14 -14
- package/dist-versioned/chunks/chunk.XCQC3F3H.js +3 -3
- package/dist-versioned/chunks/chunk.XMHLFXNP.js +1 -1
- package/dist-versioned/chunks/chunk.XPXWMXEZ.js +4 -4
- package/dist-versioned/chunks/chunk.XXOSIGGH.js +4 -4
- package/dist-versioned/chunks/chunk.YNEDC56F.js +2 -2
- package/dist-versioned/chunks/chunk.YV6TLAQG.js +1 -1
- 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/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 +250 -250
- package/dist-versioned/internal/form.js +3 -3
- package/dist-versioned/solid-components.css +2 -2
- package/dist-versioned/vscode.html-custom-data.json +95 -95
- package/dist-versioned/web-types.json +164 -164
- package/package.json +1 -1
|
@@ -42,9 +42,9 @@ var SdTeaserMedia = class extends SolidElement {
|
|
|
42
42
|
"absolute inset-0",
|
|
43
43
|
{
|
|
44
44
|
white: "bg-white/[.8] group-hover:bg-white/90",
|
|
45
|
-
"neutral-100": "sd-6-0-0-next-
|
|
45
|
+
"neutral-100": "sd-6-0-0-next-18-teaser-media--neutral-100-color-background group-hover:sd-6-0-0-next-18-teaser-media--neutral-100--hover-color-background",
|
|
46
46
|
primary: "bg-primary/[.8] text-white group-hover:bg-primary/90",
|
|
47
|
-
"primary-100": "sd-6-0-0-next-
|
|
47
|
+
"primary-100": "sd-6-0-0-next-18-teaser-media--primary-100-color-background group-hover:sd-6-0-0-next-18-teaser-media--primary-100--hover-color-background",
|
|
48
48
|
"gradient-light": "bg-gradient-to-t from-white/90 to-white/[.8]",
|
|
49
49
|
"gradient-dark": "bg-gradient-to-t from-primary-800/90 to-primary-800/[.8]"
|
|
50
50
|
}[this.variant]
|
|
@@ -69,7 +69,7 @@ __decorateClass([
|
|
|
69
69
|
query('[part="base"]')
|
|
70
70
|
], SdTeaserMedia.prototype, "teaserMedia", 2);
|
|
71
71
|
SdTeaserMedia = __decorateClass([
|
|
72
|
-
customElement("sd-6-0-0-next-
|
|
72
|
+
customElement("sd-6-0-0-next-18-teaser-media")
|
|
73
73
|
], SdTeaserMedia);
|
|
74
74
|
|
|
75
75
|
export {
|
|
@@ -183,7 +183,7 @@ var SdDialog = class extends SolidElement {
|
|
|
183
183
|
)}"><div part="overlay" class="fixed inset-0 overlay-color-background opacity-90" @click="${() => this.requestClose("overlay")}" tabindex="-1"></div><div part="panel" class="${cx(
|
|
184
184
|
"panel-color-border border flex flex-col z-20 bg-white py-4 sm:py-8 relative gap-6 focus-visible:focus-outline-inverted overflow-y-auto",
|
|
185
185
|
this.open && "flex opacity-100"
|
|
186
|
-
)}" role="dialog" aria-modal="true" aria-hidden="${this.open ? "false" : "true"}" aria-label="${ifDefined(this.headline ? this.headline : void 0)}" aria-labelledby="${ifDefined(!this.headline ? "title" : void 0)}" tabindex="0"><header part="header" class="flex flex-grow-0 flex-shrink-0 basis-auto px-6 sm:px-10"><h2 part="title" class="flex-auto m-0" id="title">${this.headline.length > 0 ? html`<span class="sd-headline sd-headline--size-3xl leading-tight">${this.headline}</span>` : html`<slot name="headline"></slot>`}</h2>${!this.noCloseButton ? html`<sd-6-0-0-next-
|
|
186
|
+
)}" role="dialog" aria-modal="true" aria-hidden="${this.open ? "false" : "true"}" aria-label="${ifDefined(this.headline ? this.headline : void 0)}" aria-labelledby="${ifDefined(!this.headline ? "title" : void 0)}" tabindex="0"><header part="header" class="flex flex-grow-0 flex-shrink-0 basis-auto px-6 sm:px-10"><h2 part="title" class="flex-auto m-0" id="title">${this.headline.length > 0 ? html`<span class="sd-headline sd-headline--size-3xl leading-tight">${this.headline}</span>` : html`<slot name="headline"></slot>`}</h2>${!this.noCloseButton ? html`<sd-6-0-0-next-18-button part="close-button" variant="tertiary" exportparts="base:close-button__base" class="${cx("absolute top-2 right-2")}" name="x-lg" @click="${() => this.requestClose("close-button")}" type="button"><sd-6-0-0-next-18-icon label="${this.localize.term("close")}" name="close" library="_internal" color="currentColor"></sd-6-0-0-next-18-icon></sd-6-0-0-next-18-button>` : ""}</header><main part="body" class="flex flex-auto overflow-auto w-full px-6 sm:px-10"><slot></slot></main><footer part="footer" class="flex flex-grow-0 flex-shrink-0 basis-auto ml-auto gap-4 px-6 sm:px-10"><slot name="footer"></slot></footer></div></div>`;
|
|
187
187
|
}
|
|
188
188
|
};
|
|
189
189
|
SdDialog.styles = [
|
|
@@ -213,7 +213,7 @@ __decorateClass([
|
|
|
213
213
|
watch("open", { waitUntilFirstUpdate: true })
|
|
214
214
|
], SdDialog.prototype, "handleOpenChange", 1);
|
|
215
215
|
SdDialog = __decorateClass([
|
|
216
|
-
customElement("sd-6-0-0-next-
|
|
216
|
+
customElement("sd-6-0-0-next-18-dialog")
|
|
217
217
|
], SdDialog);
|
|
218
218
|
setDefaultAnimation("dialog.show", {
|
|
219
219
|
keyframes: [
|
|
@@ -403,10 +403,10 @@ var SdInput = class extends SolidElement {
|
|
|
403
403
|
!isFloatingLabelActive || !hasValue && (this.readonly || this.visuallyDisabled) ? "text-base" : "text-xs",
|
|
404
404
|
(this.visuallyDisabled || this.disabled) && "text-neutral-500",
|
|
405
405
|
isFloatingLabelActive && !this.visuallyDisabled && !this.disabled && "form-control--filled__floating-label-color-text"
|
|
406
|
-
)}">${this.label}</span></label>` : null} ${hasClearIcon ? html`<button part="clear-button" class="${cx("flex justify-center", iconMarginLeft)}" type="button" aria-label="${this.localize.term("clearEntry")}" @click="${this.handleClearClick}" tabindex="-1"><slot name="clear-icon"><sd-6-0-0-next-
|
|
406
|
+
)}">${this.label}</span></label>` : null} ${hasClearIcon ? html`<button part="clear-button" class="${cx("flex justify-center", iconMarginLeft)}" type="button" aria-label="${this.localize.term("clearEntry")}" @click="${this.handleClearClick}" tabindex="-1"><slot name="clear-icon"><sd-6-0-0-next-18-icon class="${cx(
|
|
407
407
|
this.disabled || this.visuallyDisabled ? "text-neutral-500" : "text-neutral-700",
|
|
408
408
|
iconSize
|
|
409
|
-
)}" library="_internal" name="closing-round"></sd-6-0-0-next-
|
|
409
|
+
)}" library="_internal" name="closing-round"></sd-6-0-0-next-18-icon></slot></button>` : ""} ${this.passwordToggle && this.type === "password" ? html`<button aria-label="${this.localize.term(this.passwordVisible ? "hidePassword" : "showPassword")}" part="password-toggle-button" class="${cx("flex items-center sd-interactive", iconMarginLeft)}" type="button" @click="${this.handlePasswordToggle}">${this.passwordVisible ? html`<slot name="show-password-icon"><sd-6-0-0-next-18-icon class="${cx(iconColor, iconSize)}" library="_internal" name="eye"></sd-6-0-0-next-18-icon></slot>` : html`<slot name="hide-password-icon"><sd-6-0-0-next-18-icon class="${cx(iconColor, iconSize)}" library="_internal" name="eye-crossed-out"></sd-6-0-0-next-18-icon></slot>`}</button>` : ""} ${(this.type === "date" || this.type === "datetime-local") && !isFirefox ? html`<sd-6-0-0-next-18-icon class="${cx(iconColor, iconMarginLeft, iconSize)}" library="_internal" name="calendar"></sd-6-0-0-next-18-icon>` : ""} ${this.type === "time" ? html`<sd-6-0-0-next-18-icon class="${cx(iconColor, iconMarginLeft, iconSize)}" library="_internal" name="clock"></sd-6-0-0-next-18-icon>` : ""} ${this.type === "search" ? html`<button class="${cx("flex items-center sd-interactive", iconMarginLeft)}" type="button" @click="${this.handleSearchClick}"><sd-6-0-0-next-18-icon class="${cx(iconColor, iconSize)}" library="_internal" name="magnifying-glass" label="${this.localize.term("search")}"></sd-6-0-0-next-18-icon></button>` : ""} ${this.showInvalidStyle ? html`<sd-6-0-0-next-18-icon part="invalid-icon" class="${cx("text-error", iconMarginLeft, iconSize)}" library="_internal" name="risk"></sd-6-0-0-next-18-icon>` : ""} ${this.showValidStyle && this.styleOnValid ? html`<sd-6-0-0-next-18-icon class="${cx("text-success flex-shrink-0", iconMarginLeft, iconSize)}" library="_internal" name="confirm-circle" part="valid-icon"></sd-6-0-0-next-18-icon>` : ""} ${slots["right"] ? html`<slot name="right" part="right" class="${cx("inline-flex", iconColor, iconMarginLeft, iconSize)}"></slot>` : ""} ${this.type === "number" && this.spinButtons ? html`<div part="stepper" class="flex items-center"><button part="decrement-number-stepper" class="stepper-button flex" type="button" ?disabled="${this.isDecrementDisabled()}" aria-hidden="true" ${longPress({ start: () => this.handleStepDown(), end: () => this.handleChange() })} tabindex="-1"><slot name="decrement-number-stepper"><sd-6-0-0-next-18-icon library="_internal" name="minus-circle" label="Decrease value" class="${cx(iconColor, iconMarginLeft, iconSize)}"></sd-6-0-0-next-18-icon></slot></button> <button part="increment-number-stepper" class="stepper-button flex" type="button" ?disabled="${this.isIncrementDisabled()}" aria-hidden="true" ${longPress({ start: () => this.handleStepUp(), end: () => this.handleChange() })} tabindex="-1"><slot name="increment-number-stepper"><sd-6-0-0-next-18-icon library="_internal" name="plus-circle" label="Decrease value" class="${cx(iconColor, iconMarginLeft, iconSize)}"></sd-6-0-0-next-18-icon></slot></button></div>` : ""}</div></div><slot name="help-text" part="form-control-help-text" id="help-text" class="${cx("text-sm text-neutral-700 mt-1", hasHelpText && !this.showInvalidStyle ? "block" : "hidden")}" aria-hidden="${!hasHelpText || this.showInvalidStyle}">${this.helpText}</slot></div>${this.formControlController.renderInvalidMessage()}`;
|
|
410
410
|
}
|
|
411
411
|
};
|
|
412
412
|
/**
|
|
@@ -415,7 +415,7 @@ var SdInput = class extends SolidElement {
|
|
|
415
415
|
SdInput.styles = [
|
|
416
416
|
...SolidElement.styles,
|
|
417
417
|
css`/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
|
|
418
|
-
:host{position:relative;box-sizing:border-box;display:inline-block;width:100%;text-align:left}:host([vertical]){display:block}:host([required]) :is(#label,#floating-label)::after{content:' *'}:host([visually-disabled]) input{caret-color:transparent}details summary::-webkit-details-marker{display:none}input::-webkit-inner-spin-button,input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}input[type=time]::-webkit-calendar-picker-indicator{background:0 0}details summary::-webkit-details-marker,input[type=date]::-webkit-calendar-picker-indicator,input[type=datetime-local]::-webkit-calendar-picker-indicator,input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration,input[type=search]::-webkit-search-results-button,input[type=search]::-webkit-search-results-decoration{display:none}.stepper-button[disabled] sd-6-0-0-next-
|
|
418
|
+
:host{position:relative;box-sizing:border-box;display:inline-block;width:100%;text-align:left}:host([vertical]){display:block}:host([required]) :is(#label,#floating-label)::after{content:' *'}:host([visually-disabled]) input{caret-color:transparent}details summary::-webkit-details-marker{display:none}input::-webkit-inner-spin-button,input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}input[type=time]::-webkit-calendar-picker-indicator{background:0 0}details summary::-webkit-details-marker,input[type=date]::-webkit-calendar-picker-indicator,input[type=datetime-local]::-webkit-calendar-picker-indicator,input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration,input[type=search]::-webkit-search-results-button,input[type=search]::-webkit-search-results-decoration{display:none}.stepper-button[disabled] sd-6-0-0-next-18-icon{color:rgba(var(--sd-color-text-neutral-500))}`
|
|
419
419
|
];
|
|
420
420
|
__decorateClass([
|
|
421
421
|
query("#input")
|
|
@@ -548,7 +548,7 @@ __decorateClass([
|
|
|
548
548
|
watch("value", { waitUntilFirstUpdate: true })
|
|
549
549
|
], SdInput.prototype, "handleValueChange", 1);
|
|
550
550
|
SdInput = __decorateClass([
|
|
551
|
-
customElement("sd-6-0-0-next-
|
|
551
|
+
customElement("sd-6-0-0-next-18-input")
|
|
552
552
|
], SdInput);
|
|
553
553
|
|
|
554
554
|
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-0-0-next-
|
|
34
|
+
this.expandable ? "sd-6-0-0-next-18-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-0-0-next-
|
|
39
|
+
)}"><slot name="expand-icon" class="${cx(this.open && "hidden")}"><sd-6-0-0-next-18-icon library="_internal" name="chevron-down" class="group-hover:text-primary-500 transition-colors ease-in-out duration-medium"></sd-6-0-0-next-18-icon></slot><slot name="collapse-icon" class="${cx(!this.open && "hidden")}"><sd-6-0-0-next-18-icon library="_internal" name="chevron-down" class="group-hover:text-primary-500 transition-colors ease-in-out duration-medium"></sd-6-0-0-next-18-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-0-0-next-
|
|
51
|
+
customElement("sd-6-0-0-next-18-quickfact")
|
|
52
52
|
], SdQuickfact);
|
|
53
53
|
setDefaultAnimation("quickfact.show", {
|
|
54
54
|
keyframes: [{ height: "0" }, { height: "auto" }],
|
|
@@ -22,7 +22,7 @@ var SdDivider = class extends SolidElement {
|
|
|
22
22
|
}
|
|
23
23
|
render() {
|
|
24
24
|
return html`<hr part="main" aria-orientation="${this.orientation}" class="${cx(
|
|
25
|
-
this.inverted ? "sd-6-0-0-next-
|
|
25
|
+
this.inverted ? "sd-6-0-0-next-18-divider--inverted-color-border" : "border-neutral-400",
|
|
26
26
|
this.orientation === "horizontal" ? "border-t w-full" : " border-l h-full"
|
|
27
27
|
)}">`;
|
|
28
28
|
}
|
|
@@ -33,7 +33,7 @@ var SdDivider = class extends SolidElement {
|
|
|
33
33
|
SdDivider.styles = [
|
|
34
34
|
...SolidElement.styles,
|
|
35
35
|
css`/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
|
|
36
|
-
:host{margin:calc(var(--sd-spacing-1) * 0)}:host(sd-6-0-0-next-
|
|
36
|
+
:host{margin:calc(var(--sd-spacing-1) * 0)}:host(sd-6-0-0-next-18-divider[orientation=horizontal]){display:block}:host(sd-6-0-0-next-18-divider[orientation=vertical]){display:inline-block}`
|
|
37
37
|
];
|
|
38
38
|
__decorateClass([
|
|
39
39
|
property({ type: String, reflect: true })
|
|
@@ -42,7 +42,7 @@ __decorateClass([
|
|
|
42
42
|
property({ type: Boolean, reflect: true })
|
|
43
43
|
], SdDivider.prototype, "inverted", 2);
|
|
44
44
|
SdDivider = __decorateClass([
|
|
45
|
-
customElement("sd-6-0-0-next-
|
|
45
|
+
customElement("sd-6-0-0-next-18-divider")
|
|
46
46
|
], SdDivider);
|
|
47
47
|
|
|
48
48
|
export {
|
|
@@ -98,7 +98,7 @@ var SdVideo = class extends SolidElement {
|
|
|
98
98
|
this.playing ? "opacity-0" : "opacity-100",
|
|
99
99
|
this.isBelowBreakpoint ? "w-[48px] h-[48px]" : "w-[96px] h-[96px]",
|
|
100
100
|
"absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 p-4 bg-white/75 rounded-full play-pause-transition group-focus-visible:outline-2 group-focus-visible:outline-offset-2"
|
|
101
|
-
)}"><slot name="play-icon" part="play-icon" class="${cx(this.isBelowBreakpoint ? "text-[2rem]" : "text-[4rem]")}"><sd-6-0-0-next-
|
|
101
|
+
)}"><slot name="play-icon" part="play-icon" class="${cx(this.isBelowBreakpoint ? "text-[2rem]" : "text-[4rem]")}"><sd-6-0-0-next-18-icon id="default-play-icon" library="_internal" name="start"></sd-6-0-0-next-18-icon></slot></div></button> ${this.hasSlotController.test("poster") ? html`<div part="poster-wrapper" class="absolute left-0 top-0 w-full z-10 overflow-hidden"><slot name="poster" role="presentation"></slot></div>` : null}<slot></slot></div>`;
|
|
102
102
|
}
|
|
103
103
|
};
|
|
104
104
|
SdVideo.styles = [
|
|
@@ -116,7 +116,7 @@ __decorateClass([
|
|
|
116
116
|
property({ type: Boolean })
|
|
117
117
|
], SdVideo.prototype, "isBelowBreakpoint", 2);
|
|
118
118
|
SdVideo = __decorateClass([
|
|
119
|
-
customElement("sd-6-0-0-next-
|
|
119
|
+
customElement("sd-6-0-0-next-18-video")
|
|
120
120
|
], SdVideo);
|
|
121
121
|
|
|
122
122
|
export {
|
|
@@ -60,7 +60,7 @@ var SdCarousel = class extends SolidElement {
|
|
|
60
60
|
this.pausedAutoplay = false;
|
|
61
61
|
this.autoplayController = new AutoplayController(this, () => this.next());
|
|
62
62
|
this.scrollController = new ScrollController(this);
|
|
63
|
-
this.slides = this.getElementsByTagName("sd-6-0-0-next-
|
|
63
|
+
this.slides = this.getElementsByTagName("sd-6-0-0-next-18-carousel-item");
|
|
64
64
|
// determines which slide is displayed
|
|
65
65
|
// A map containing the state of all the slides
|
|
66
66
|
this.intersectionObserverEntries = /* @__PURE__ */ new Map();
|
|
@@ -449,7 +449,7 @@ var SdCarousel = class extends SolidElement {
|
|
|
449
449
|
)}" aria-label="${this.localize.term("previousSlide")}" aria-controls="scroll-container" aria-disabled="${prevEnabled ? "false" : "true"}" @focus="${this.handleFocus}" @blur="${this.handleBlur}" @click="${prevEnabled ? (e) => {
|
|
450
450
|
this.previous();
|
|
451
451
|
this.unblockAutoplay(e, this.previousButton);
|
|
452
|
-
} : null}"><slot name="previous-icon"><sd-6-0-0-next-
|
|
452
|
+
} : null}"><slot name="previous-icon"><sd-6-0-0-next-18-icon class="${cx("h-6 w-6 rotate-90 grid place-items-center")}" library="_internal" name="${isLtr ? "chevron-down" : "chevron-up"}"></sd-6-0-0-next-18-icon></slot></button> ${this.variant === "dot" ? html`<div part="pagination-dot" role="tablist" class="${cx("carousel__pagination dot flex wrap items-center gap-2")}" aria-controls="scroll-container">${map(range(pagesCount), (index) => {
|
|
453
453
|
const isActive = index + 1 === currentPage;
|
|
454
454
|
return html`<button part="pagination-item ${isActive ? "pagination-item--active" : ""}" class="${cx(
|
|
455
455
|
"carousel__pagination-item",
|
|
@@ -460,7 +460,7 @@ var SdCarousel = class extends SolidElement {
|
|
|
460
460
|
this.goToSlide(index * slidesPerMove);
|
|
461
461
|
this.unblockAutoplay(e, this.paginationItems[index]);
|
|
462
462
|
}}" @keydown="${this.handleKeyDown}"><span class="${cx(
|
|
463
|
-
"h-4 w-4 block border sd-6-0-0-next-
|
|
463
|
+
"h-4 w-4 block border sd-6-0-0-next-18-carousel__pager-dot-border-width hover:border-primary-500 rounded-full transition-colors duration-slow hover:duration-fast ease-in-out",
|
|
464
464
|
this.inverted ? "border-white hover:border-primary-500" : "border-primary",
|
|
465
465
|
isActive && "bg-accent border-none",
|
|
466
466
|
isActive ? this.inverted ? "hover:bg-accent-300" : "hover:bg-accent-550" : ""
|
|
@@ -472,7 +472,7 @@ var SdCarousel = class extends SolidElement {
|
|
|
472
472
|
)}" aria-label="${this.localize.term("nextSlide")}" aria-controls="scroll-container" aria-disabled="${nextEnabled ? "false" : "true"}" @focus="${this.handleFocus}" @blur="${this.handleBlur}" @click="${nextEnabled ? (e) => {
|
|
473
473
|
this.next();
|
|
474
474
|
this.unblockAutoplay(e, this.nextButton);
|
|
475
|
-
} : null}"><slot name="next-icon"><sd-6-0-0-next-
|
|
475
|
+
} : null}"><slot name="next-icon"><sd-6-0-0-next-18-icon class="${cx("h-6 w-6 rotate-90 grid place-items-center")}" library="_internal" name="${isLtr ? "chevron-up" : "chevron-down"}"></sd-6-0-0-next-18-icon></slot></button></div><button class="${cx(
|
|
476
476
|
"ml-6 !rounded-sm",
|
|
477
477
|
"!absolute !right-0 sd-interactive",
|
|
478
478
|
this.inverted ? "sd-interactive--inverted" : "sd-interactive--reset",
|
|
@@ -482,13 +482,13 @@ var SdCarousel = class extends SolidElement {
|
|
|
482
482
|
if (e.detail) {
|
|
483
483
|
this.autoplayControls.blur();
|
|
484
484
|
}
|
|
485
|
-
}}"><slot name="autoplay-start" class="${cx(!this.pausedAutoplay ? "hidden" : "")}"><sd-6-0-0-next-
|
|
485
|
+
}}"><slot name="autoplay-start" class="${cx(!this.pausedAutoplay ? "hidden" : "")}"><sd-6-0-0-next-18-icon class="h-6 w-6 grid place-items-center" library="_internal" name="start"></sd-6-0-0-next-18-icon></slot><slot name="autoplay-pause" class="${cx(this.pausedAutoplay ? "hidden" : "")}"><sd-6-0-0-next-18-icon class="h-6 w-6 grid place-items-center" library="_internal" name="pause"></sd-6-0-0-next-18-icon></slot></button></div></div>`;
|
|
486
486
|
}
|
|
487
487
|
};
|
|
488
488
|
SdCarousel.styles = [
|
|
489
489
|
...SolidElement.styles,
|
|
490
490
|
css`/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
|
|
491
|
-
:host{--slide-gap:var(--sl-spacing-medium, 1rem);--scroll-hint:0px;display:flex}.carousel{grid-template-areas:'. slides .' '. pagination .'}.carousel__pagination{grid-area:pagination}.carousel__slides{grid-area:slides;scrollbar-width:none;--slide-size:calc((100% - (var(--slides-per-page) - 1) * var(--slide-gap)) / var(--slides-per-page));grid-auto-columns:var(--slide-size);-moz-column-gap:var(--slide-gap);column-gap:var(--slide-gap);scroll-padding-inline:var(--scroll-hint);padding-inline:var(--scroll-hint)}.carousel__slides::-webkit-scrollbar{display:none}:host([fade]){--carousel-height:auto}:host([fade]) .carousel__slides{position:relative;display:block;overflow:hidden;height:var(--carousel-height)}@media (prefers-reduced-motion){:where(.carousel__slides){scroll-behavior:auto}}.carousel__navigation{grid-area:navigation}sd-6-0-0-next-
|
|
491
|
+
:host{--slide-gap:var(--sl-spacing-medium, 1rem);--scroll-hint:0px;display:flex}.carousel{grid-template-areas:'. slides .' '. pagination .'}.carousel__pagination{grid-area:pagination}.carousel__slides{grid-area:slides;scrollbar-width:none;--slide-size:calc((100% - (var(--slides-per-page) - 1) * var(--slide-gap)) / var(--slides-per-page));grid-auto-columns:var(--slide-size);-moz-column-gap:var(--slide-gap);column-gap:var(--slide-gap);scroll-padding-inline:var(--scroll-hint);padding-inline:var(--scroll-hint)}.carousel__slides::-webkit-scrollbar{display:none}:host([fade]){--carousel-height:auto}:host([fade]) .carousel__slides{position:relative;display:block;overflow:hidden;height:var(--carousel-height)}@media (prefers-reduced-motion){:where(.carousel__slides){scroll-behavior:auto}}.carousel__navigation{grid-area:navigation}sd-6-0-0-next-18-button::part(label){pointer-events:none;display:flex;flex:auto;align-items:center}#carousel__navigation-button--next,#carousel__navigation-button--previous{color:rgba(var(--sd-color-icon-fill-primary))}#carousel__navigation-button--next:disabled,#carousel__navigation-button--previous:disabled{color:rgba(var(--sd-color-icon-fill-neutral-500))}:host([inverted]) #carousel__navigation-button--next,:host([inverted]) #carousel__navigation-button--previous{color:rgba(var(--sd-color-icon-fill-white))}:host([inverted]) #carousel__navigation-button--next:disabled,:host([inverted]) #carousel__navigation-button--previous:disabled{color:rgba(var(--sd-color-icon-fill-neutral-600))}`
|
|
492
492
|
];
|
|
493
493
|
__decorateClass([
|
|
494
494
|
query('[part~="autoplay-controls"]')
|
|
@@ -561,7 +561,7 @@ __decorateClass([
|
|
|
561
561
|
watch("autoplay")
|
|
562
562
|
], SdCarousel.prototype, "handleAutoplayChange", 1);
|
|
563
563
|
SdCarousel = __decorateClass([
|
|
564
|
-
customElement("sd-6-0-0-next-
|
|
564
|
+
customElement("sd-6-0-0-next-18-carousel")
|
|
565
565
|
], SdCarousel);
|
|
566
566
|
|
|
567
567
|
export {
|
|
@@ -18,7 +18,7 @@ var SdTabPanel = class extends SolidElement {
|
|
|
18
18
|
constructor() {
|
|
19
19
|
super(...arguments);
|
|
20
20
|
this.attrId = ++id;
|
|
21
|
-
this.componentId = `sd-6-0-0-next-
|
|
21
|
+
this.componentId = `sd-6-0-0-next-18-tab-panel-${this.attrId}`;
|
|
22
22
|
this.name = "";
|
|
23
23
|
this.active = false;
|
|
24
24
|
}
|
|
@@ -49,7 +49,7 @@ __decorateClass([
|
|
|
49
49
|
watch("active")
|
|
50
50
|
], SdTabPanel.prototype, "handleActiveChange", 1);
|
|
51
51
|
SdTabPanel = __decorateClass([
|
|
52
|
-
customElement("sd-6-0-0-next-
|
|
52
|
+
customElement("sd-6-0-0-next-18-tab-panel")
|
|
53
53
|
], SdTabPanel);
|
|
54
54
|
|
|
55
55
|
export {
|
|
@@ -71,7 +71,7 @@ var SdRadio = class extends SolidElement {
|
|
|
71
71
|
}
|
|
72
72
|
render() {
|
|
73
73
|
return html`<span part="base" class="${cx(
|
|
74
|
-
"sd-6-0-0-next-
|
|
74
|
+
"sd-6-0-0-next-18-radio group flex items-center text-base leading-normal text-black cursor-pointer",
|
|
75
75
|
(this.disabled || this.visuallyDisabled) && "hover:cursor-not-allowed",
|
|
76
76
|
{
|
|
77
77
|
/* sizes, fonts */
|
|
@@ -80,15 +80,15 @@ var SdRadio = class extends SolidElement {
|
|
|
80
80
|
lg: "text-base"
|
|
81
81
|
}[this.size]
|
|
82
82
|
)}"><span part="${`${this.checked ? "control--checked" : "control--unchecked"}`}" class="${cx(
|
|
83
|
-
"flex-initial shrink-0 relative inline-flex items-center justify-center border sd-6-0-0-next-
|
|
83
|
+
"flex-initial shrink-0 relative inline-flex items-center justify-center border sd-6-0-0-next-18-radio-border-width rounded-full bg-white h-4 w-4 duration-fast ease-in-out",
|
|
84
84
|
this.disabled || this.visuallyDisabled ? "border-neutral-500" : this.invalid ? cx(
|
|
85
85
|
"border-error hover:border-error-400 group-hover:border-error-400",
|
|
86
|
-
this.checked ? "sd-6-0-0-next-
|
|
87
|
-
) : this.checked ? "sd-6-0-0-next-
|
|
86
|
+
this.checked ? "sd-6-0-0-next-18-radio--checked--invalid--default-color-background" : "sd-6-0-0-next-18-radio--default--invalid-color-background"
|
|
87
|
+
) : this.checked ? "sd-6-0-0-next-18-radio--checked--default-color-background hover:sd-6-0-0-next-18-radio--checked--hover-color-background group-hover:sd-6-0-0-next-18-radio--checked--hover-color-background border-accent hover:border-accent-550 group-hover:border-accent-550" : "form-control-color-border hover:bg-neutral-200 group-hover:bg-neutral-200"
|
|
88
88
|
)}"><span part="checked" class="${cx(
|
|
89
|
-
"rounded-full inline-flex text-white sd-6-0-0-next-
|
|
89
|
+
"rounded-full inline-flex text-white sd-6-0-0-next-18-radio--checked--default__icon-color-background h-2.5 w-2.5 transition-[transform, colors] duration-medium ease-in-out",
|
|
90
90
|
this.checked ? "scale-100" : "scale-0",
|
|
91
|
-
this.disabled ? "bg-neutral-500" : this.visuallyDisabled ? "bg-white" : this.invalid ? "sd-6-0-0-next-
|
|
91
|
+
this.disabled ? "bg-neutral-500" : this.visuallyDisabled ? "bg-white" : this.invalid ? "sd-6-0-0-next-18-radio--checked--invalid--default__icon-color-background hover:sd-6-0-0-next-18-radio--checked--invalid--hover__icon-color-background group-hover:sd-6-0-0-next-18-radio--checked--invalid--hover__icon-color-background" : this.checked ? "sd-6-0-0-next-18-radio--checked--default__icon-color-background hover:sd-6-0-0-next-18-radio--checked--hover__icon-color-background group-hover:sd-6-0-0-next-18-radio--checked--hover__icon-color-background" : "bg-neutral-800"
|
|
92
92
|
)}"></span></span><slot part="label" class="${cx(
|
|
93
93
|
"ml-2 select-none inline-block",
|
|
94
94
|
this.disabled || this.visuallyDisabled ? "text-neutral-500" : this.invalid ? "text-error" : "text-black"
|
|
@@ -131,7 +131,7 @@ __decorateClass([
|
|
|
131
131
|
watch(["disabled", "visually-disabled"], { waitUntilFirstUpdate: true })
|
|
132
132
|
], SdRadio.prototype, "handleDisabledChange", 1);
|
|
133
133
|
SdRadio = __decorateClass([
|
|
134
|
-
customElement("sd-6-0-0-next-
|
|
134
|
+
customElement("sd-6-0-0-next-18-radio")
|
|
135
135
|
], SdRadio);
|
|
136
136
|
|
|
137
137
|
export {
|
|
@@ -206,16 +206,16 @@ var SdTooltip = class extends SolidElement {
|
|
|
206
206
|
render() {
|
|
207
207
|
const isStart = this.placement.endsWith("-start");
|
|
208
208
|
const isEnd = this.placement.endsWith("-end");
|
|
209
|
-
return html`<sd-6-0-0-next-
|
|
209
|
+
return html`<sd-6-0-0-next-18-popup part="base" exportparts="
|
|
210
210
|
popup:base__popup,
|
|
211
211
|
arrow:base__arrow
|
|
212
|
-
" class="${cx(this.open && "tooltip--open")}" placement="${this.placement}" distance="10" skidding="${{ start: 2, end: -2, default: 0 }[isStart ? "start" : isEnd ? "end" : "default"] * (this.size === "sm" ? -1 : 1)}" strategy="${this.hoist ? "fixed" : "absolute"}" flip shift arrow auto-size="vertical" arrow-padding="0">${this.hasCustomTrigger ? html`<slot slot="anchor"></slot>` : html`<button slot="anchor" aria-describedby="tooltip" class="${cx("flex sd-interactive rounded-full", this.size === "lg" ? "text-xl" : "text-base")}" ?disabled="${this.disabled}" aria-expanded="${this.open}" aria-controls="tooltip"><sd-6-0-0-next-
|
|
212
|
+
" class="${cx(this.open && "tooltip--open")}" placement="${this.placement}" distance="10" skidding="${{ start: 2, end: -2, default: 0 }[isStart ? "start" : isEnd ? "end" : "default"] * (this.size === "sm" ? -1 : 1)}" strategy="${this.hoist ? "fixed" : "absolute"}" flip shift arrow auto-size="vertical" arrow-padding="0">${this.hasCustomTrigger ? html`<slot slot="anchor"></slot>` : html`<button slot="anchor" aria-describedby="tooltip" class="${cx("flex sd-interactive rounded-full", this.size === "lg" ? "text-xl" : "text-base")}" ?disabled="${this.disabled}" aria-expanded="${this.open}" aria-controls="tooltip"><sd-6-0-0-next-18-icon library="_internal" name="info-circle" label="Tooltip" class="${cx(this.disabled && "sd-interactive--disabled")}"></sd-6-0-0-next-18-icon></button>`}<slot name="content" part="body" id="tooltip" class="sd-6-0-0-next-18-tooltip-color-background sd-6-0-0-next-18-tooltip-color-text py-3 px-4 block rounded-none text-sm text-left" role="tooltip" aria-label="${this.content}" aria-live="${this.open ? "polite" : "off"}">${this.content}</slot></sd-6-0-0-next-18-popup>`;
|
|
213
213
|
}
|
|
214
214
|
};
|
|
215
215
|
SdTooltip.styles = [
|
|
216
216
|
...SolidElement.styles,
|
|
217
217
|
css`/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
|
|
218
|
-
:host{--hide-delay:0ms;--show-delay:150ms;display:contents}sd-6-0-0-next-
|
|
218
|
+
:host{--hide-delay:0ms;--show-delay:150ms;display:contents}sd-6-0-0-next-18-popup{--arrow-color:rgba(var(--sd-tooltip-color-background));--arrow-size:10px}sd-6-0-0-next-18-popup::part(popup){pointer-events:none;z-index:10;--tw-shadow:var(--sd-shadow);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}sd-6-0-0-next-18-popup::part(arrow){--tw-shadow:var(--sd-shadow, 0px 1px 3px 0px rgb(81 81 81 / 75%));--tw-shadow-colored:0px 1px 3px 0px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}sd-6-0-0-next-18-popup[placement^=top]::part(popup){transform-origin:bottom}sd-6-0-0-next-18-popup[placement^=bottom]::part(popup){transform-origin:top}#tooltip{max-width:var(--max-width)}::slotted([slot=content]){overflow:auto;max-width:var(--auto-size-available-width)!important;max-height:var(--auto-size-available-height)!important}:host [slot=anchor]{color:rgba(var(--sd-form-control__tooltip-color-icon))}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}`
|
|
219
219
|
];
|
|
220
220
|
__decorateClass([
|
|
221
221
|
query("slot:not([name])")
|
|
@@ -224,7 +224,7 @@ __decorateClass([
|
|
|
224
224
|
query("#tooltip")
|
|
225
225
|
], SdTooltip.prototype, "body", 2);
|
|
226
226
|
__decorateClass([
|
|
227
|
-
query("sd-6-0-0-next-
|
|
227
|
+
query("sd-6-0-0-next-18-popup")
|
|
228
228
|
], SdTooltip.prototype, "popup", 2);
|
|
229
229
|
__decorateClass([
|
|
230
230
|
property({ type: String, reflect: true })
|
|
@@ -257,7 +257,7 @@ __decorateClass([
|
|
|
257
257
|
watch("disabled")
|
|
258
258
|
], SdTooltip.prototype, "handleDisabledChange", 1);
|
|
259
259
|
SdTooltip = __decorateClass([
|
|
260
|
-
customElement("sd-6-0-0-next-
|
|
260
|
+
customElement("sd-6-0-0-next-18-tooltip")
|
|
261
261
|
], SdTooltip);
|
|
262
262
|
setDefaultAnimation("tooltip.show", {
|
|
263
263
|
keyframes: [{ opacity: 0 }, { opacity: 1 }],
|
|
@@ -324,7 +324,7 @@ __decorateClass([
|
|
|
324
324
|
property({ attribute: "auto-size-padding", type: Number })
|
|
325
325
|
], SdPopup.prototype, "autoSizePadding", 2);
|
|
326
326
|
SdPopup = __decorateClass([
|
|
327
|
-
customElement("sd-6-0-0-next-
|
|
327
|
+
customElement("sd-6-0-0-next-18-popup")
|
|
328
328
|
], SdPopup);
|
|
329
329
|
|
|
330
330
|
export {
|
|
@@ -78,7 +78,7 @@ var SdRange = class extends SolidElement {
|
|
|
78
78
|
var _a, _b;
|
|
79
79
|
const tooltip = thumb.parentElement;
|
|
80
80
|
await tooltip.updateComplete;
|
|
81
|
-
(_b = (_a = tooltip.shadowRoot) == null ? void 0 : _a.querySelector("sd-6-0-0-next-
|
|
81
|
+
(_b = (_a = tooltip.shadowRoot) == null ? void 0 : _a.querySelector("sd-6-0-0-next-18-popup")) == null ? void 0 : _b.setAttribute("distance", "14");
|
|
82
82
|
});
|
|
83
83
|
}
|
|
84
84
|
willUpdate(changedProperties) {
|
|
@@ -411,10 +411,10 @@ var SdRange = class extends SolidElement {
|
|
|
411
411
|
ariaLabel = this.tooltipFormatter(value);
|
|
412
412
|
}
|
|
413
413
|
}
|
|
414
|
-
return html`<sd-6-0-0-next-
|
|
414
|
+
return html`<sd-6-0-0-next-18-tooltip hoist trigger="${this.tooltip === "on-interaction" ? "focus" : "manual"}" disabled="${ifDefined(this.disabled || this.visuallyDisabled || this.tooltip === "hidden" ? true : void 0)}"><div id="${id}" part="thumb" role="slider" tabindex="${this.disabled || this.visuallyDisabled ? -1 : 0}" aria-disabled="${ifDefined(this.disabled || this.visuallyDisabled ? "true" : void 0)}" aria-labelledby="${ariaLabeledBy}" aria-label="${ariaLabel}" aria-valuemax="${this.max}" aria-valuemin="${this.min}" aria-valuenow="${value}" aria-valuetext="${this.tooltipFormatter(value)}" data-range-id="${rangeId}" data-disabled="${ifDefined(this.disabled || this.visuallyDisabled || void 0)}" @pointerdown="${this.onClickThumb}" @pointermove="${this.onDragThumb}" @pointerup="${this.onReleaseThumb}" @pointercancel="${this.onReleaseThumb}" @pointerleave="${this.onReleaseThumb}" @keydown="${this.onKeyPress}" @focus="${this.onFocusThumb}" class="${cx(
|
|
415
415
|
"rounded-full absolute top-0 size-4 hover:cursor-grab after:-inset-2",
|
|
416
416
|
this.disabled || this.visuallyDisabled ? "outline-none" : "cursor-pointer focus-visible:focus-outline"
|
|
417
|
-
)}"></div></sd-6-0-0-next-
|
|
417
|
+
)}"></div></sd-6-0-0-next-18-tooltip>`;
|
|
418
418
|
});
|
|
419
419
|
}
|
|
420
420
|
render() {
|
|
@@ -484,7 +484,7 @@ __decorateClass([
|
|
|
484
484
|
property({ type: String })
|
|
485
485
|
], SdRange.prototype, "value", 1);
|
|
486
486
|
SdRange = __decorateClass([
|
|
487
|
-
customElement("sd-6-0-0-next-
|
|
487
|
+
customElement("sd-6-0-0-next-18-range")
|
|
488
488
|
], SdRange);
|
|
489
489
|
|
|
490
490
|
export {
|
|
@@ -17,19 +17,19 @@ var SdButtonGroup = class extends SolidElement {
|
|
|
17
17
|
}
|
|
18
18
|
handleFocus(event) {
|
|
19
19
|
const button = findButton(event.target);
|
|
20
|
-
button == null ? void 0 : button.classList.add("sd-6-0-0-next-
|
|
20
|
+
button == null ? void 0 : button.classList.add("sd-6-0-0-next-18-button-group__button--focus");
|
|
21
21
|
}
|
|
22
22
|
handleBlur(event) {
|
|
23
23
|
const button = findButton(event.target);
|
|
24
|
-
button == null ? void 0 : button.classList.remove("sd-6-0-0-next-
|
|
24
|
+
button == null ? void 0 : button.classList.remove("sd-6-0-0-next-18-button-group__button--focus");
|
|
25
25
|
}
|
|
26
26
|
handleMouseOver(event) {
|
|
27
27
|
const button = findButton(event.target);
|
|
28
|
-
button == null ? void 0 : button.classList.add("sd-6-0-0-next-
|
|
28
|
+
button == null ? void 0 : button.classList.add("sd-6-0-0-next-18-button-group__button--hover");
|
|
29
29
|
}
|
|
30
30
|
handleMouseOut(event) {
|
|
31
31
|
const button = findButton(event.target);
|
|
32
|
-
button == null ? void 0 : button.classList.remove("sd-6-0-0-next-
|
|
32
|
+
button == null ? void 0 : button.classList.remove("sd-6-0-0-next-18-button-group__button--hover");
|
|
33
33
|
}
|
|
34
34
|
handleSlotChange() {
|
|
35
35
|
const slottedElements = [...this.defaultSlot.assignedElements({ flatten: true })];
|
|
@@ -37,11 +37,11 @@ var SdButtonGroup = class extends SolidElement {
|
|
|
37
37
|
const index = slottedElements.indexOf(el);
|
|
38
38
|
const button = findButton(el);
|
|
39
39
|
if (button !== null) {
|
|
40
|
-
button.classList.add("sd-6-0-0-next-
|
|
41
|
-
button.classList.toggle("sd-6-0-0-next-
|
|
42
|
-
button.classList.toggle("sd-6-0-0-next-
|
|
43
|
-
button.classList.toggle("sd-6-0-0-next-
|
|
44
|
-
button.classList.toggle("sd-6-0-0-next-
|
|
40
|
+
button.classList.add("sd-6-0-0-next-18-button-group__button");
|
|
41
|
+
button.classList.toggle("sd-6-0-0-next-18-button-group__button--first", index === 0);
|
|
42
|
+
button.classList.toggle("sd-6-0-0-next-18-button-group__button--inner", index > 0 && index < slottedElements.length - 1);
|
|
43
|
+
button.classList.toggle("sd-6-0-0-next-18-button-group__button--last", index === slottedElements.length - 1);
|
|
44
|
+
button.classList.toggle("sd-6-0-0-next-18-button-group__button--radio", button.tagName.toLowerCase() === "sd-6-0-0-next-18-radio-button");
|
|
45
45
|
}
|
|
46
46
|
});
|
|
47
47
|
}
|
|
@@ -64,11 +64,11 @@ __decorateClass([
|
|
|
64
64
|
property({ type: String, reflect: true })
|
|
65
65
|
], SdButtonGroup.prototype, "label", 2);
|
|
66
66
|
SdButtonGroup = __decorateClass([
|
|
67
|
-
customElement("sd-6-0-0-next-
|
|
67
|
+
customElement("sd-6-0-0-next-18-button-group")
|
|
68
68
|
], SdButtonGroup);
|
|
69
69
|
function findButton(el) {
|
|
70
70
|
var _a;
|
|
71
|
-
const selector = "sd-6-0-0-next-
|
|
71
|
+
const selector = "sd-6-0-0-next-18-button, sd-6-0-0-next-18-radio-button";
|
|
72
72
|
return (_a = el.closest(selector)) != null ? _a : el.querySelector(selector);
|
|
73
73
|
}
|
|
74
74
|
|
|
@@ -129,7 +129,7 @@ var SdScrollable = class extends SolidElement {
|
|
|
129
129
|
down: this.upButton
|
|
130
130
|
}[direction];
|
|
131
131
|
const label = reachedStart ? `${this.localize.term("scrolled")}. ${this.localize.term("scrollToEnd")}` : `${this.localize.term("scrolled")}. ${this.localize.term("scrollToStart")}`;
|
|
132
|
-
(_c = oppositeButton == null ? void 0 : oppositeButton.querySelector("sd-6-0-0-next-
|
|
132
|
+
(_c = oppositeButton == null ? void 0 : oppositeButton.querySelector("sd-6-0-0-next-18-icon")) == null ? void 0 : _c.setAttribute("label", label);
|
|
133
133
|
if (isKeyboardTriggered) {
|
|
134
134
|
oppositeButton == null ? void 0 : oppositeButton.focus();
|
|
135
135
|
} else {
|
|
@@ -141,7 +141,7 @@ var SdScrollable = class extends SolidElement {
|
|
|
141
141
|
const scrollTo = ["left", "up"].includes(direction) ? "start" : "end";
|
|
142
142
|
const label = scrollTo === "start" ? this.localize.term("scrollToStart") : this.localize.term("scrollToEnd");
|
|
143
143
|
const button = e.target;
|
|
144
|
-
(_a = button.querySelector("sd-6-0-0-next-
|
|
144
|
+
(_a = button.querySelector("sd-6-0-0-next-18-icon")) == null ? void 0 : _a.setAttribute("label", label);
|
|
145
145
|
}
|
|
146
146
|
render() {
|
|
147
147
|
const scrollButtonClasses = "relative p-0 border-0 bg-transparent cursor-pointer w-5 h-5 flex items-center justify-center sd-interactive rounded-md flex text-lg";
|
|
@@ -158,16 +158,16 @@ var SdScrollable = class extends SolidElement {
|
|
|
158
158
|
)}" @scroll="${this.handleContainerScroll}" tabindex="0"><div id="announcement-container" role="status" class="sr-only"></div><div part="scroll-content" class="flex-1"><slot></slot></div></div>${this.buttons ? html`${this.isScrollHorizontalEnabled ? html`<div part="button-left" class="${cx(
|
|
159
159
|
"absolute z-10 flex items-center justify-center top-0 left-0 h-full w-8 transition-opacity duration-medium ease-in-out",
|
|
160
160
|
!this.canScroll.left && "opacity-0 pointer-events-none"
|
|
161
|
-
)}"><button part="button-start" class="${cx(scrollButtonClasses)}" aria-hidden="${ifDefined(!this.canScroll.left || void 0)}" tabindex="${ifDefined(!this.canScroll.left ? -1 : void 0)}" @click="${(e) => this.handleScroll("left", e)}" @blur="${(e) => this.handleButtonBlur("left", e)}"><slot name="icon-start"><sd-6-0-0-next-
|
|
161
|
+
)}"><button part="button-start" class="${cx(scrollButtonClasses)}" aria-hidden="${ifDefined(!this.canScroll.left || void 0)}" tabindex="${ifDefined(!this.canScroll.left ? -1 : void 0)}" @click="${(e) => this.handleScroll("left", e)}" @blur="${(e) => this.handleButtonBlur("left", e)}"><slot name="icon-start"><sd-6-0-0-next-18-icon library="_internal" name="chevron-up" class="rotate-[-90deg]" label="${this.localize.term("scrollToStart")}"></sd-6-0-0-next-18-icon></slot></button></div><div part="button-right" class="${cx(
|
|
162
162
|
"absolute z-10 flex items-center justify-center top-0 right-0 h-full w-8 transition-opacity duration-medium ease-in-out",
|
|
163
163
|
!this.canScroll.right && "opacity-0 pointer-events-none"
|
|
164
|
-
)}"><button part="button-end" class="${cx(scrollButtonClasses)}" aria-hidden="${ifDefined(!this.canScroll.right || void 0)}" tabindex="${ifDefined(!this.canScroll.right ? -1 : void 0)}" @click="${(e) => this.handleScroll("right", e)}" @blur="${(e) => this.handleButtonBlur("right", e)}"><slot name="icon-end"><sd-6-0-0-next-
|
|
164
|
+
)}"><button part="button-end" class="${cx(scrollButtonClasses)}" aria-hidden="${ifDefined(!this.canScroll.right || void 0)}" tabindex="${ifDefined(!this.canScroll.right ? -1 : void 0)}" @click="${(e) => this.handleScroll("right", e)}" @blur="${(e) => this.handleButtonBlur("right", e)}"><slot name="icon-end"><sd-6-0-0-next-18-icon library="_internal" name="chevron-down" class="rotate-[-90deg]" label="${this.localize.term("scrollToEnd")}"></sd-6-0-0-next-18-icon></slot></button></div>` : null} ${this.isScrollVerticalEnabled ? html`<div part="button-top" class="${cx(
|
|
165
165
|
"absolute z-10 flex items-center justify-center top-0 left-0 w-full h-8 transition-opacity duration-medium ease-in-out",
|
|
166
166
|
!this.canScroll.up && "opacity-0 pointer-events-none"
|
|
167
|
-
)}"><button part="button-start" class="${cx(scrollButtonClasses)}" aria-hidden="${ifDefined(!this.canScroll.up || void 0)}" tabindex="${ifDefined(!this.canScroll.up ? -1 : void 0)}" @click="${(e) => this.handleScroll("up", e)}" @blur="${(e) => this.handleButtonBlur("up", e)}"><slot name="icon-start"><sd-6-0-0-next-
|
|
167
|
+
)}"><button part="button-start" class="${cx(scrollButtonClasses)}" aria-hidden="${ifDefined(!this.canScroll.up || void 0)}" tabindex="${ifDefined(!this.canScroll.up ? -1 : void 0)}" @click="${(e) => this.handleScroll("up", e)}" @blur="${(e) => this.handleButtonBlur("up", e)}"><slot name="icon-start"><sd-6-0-0-next-18-icon library="_internal" name="chevron-up" label="${this.localize.term("scrollToStart")}"></sd-6-0-0-next-18-icon></slot></button></div><div part="button-bottom" class="${cx(
|
|
168
168
|
"absolute z-10 flex items-center justify-center bottom-0 left-0 w-full h-8 transition-opacity duration-medium ease-in-out",
|
|
169
169
|
!this.canScroll.down && "opacity-0 pointer-events-none"
|
|
170
|
-
)}"><button part="button-end" class="${cx(scrollButtonClasses)}" aria-hidden="${ifDefined(!this.canScroll.down || void 0)}" tabindex="${ifDefined(!this.canScroll.down ? -1 : void 0)}" @click="${(e) => this.handleScroll("down", e)}" @blur="${(e) => this.handleButtonBlur("down", e)}"><slot name="icon-end"><sd-6-0-0-next-
|
|
170
|
+
)}"><button part="button-end" class="${cx(scrollButtonClasses)}" aria-hidden="${ifDefined(!this.canScroll.down || void 0)}" tabindex="${ifDefined(!this.canScroll.down ? -1 : void 0)}" @click="${(e) => this.handleScroll("down", e)}" @blur="${(e) => this.handleButtonBlur("down", e)}"><slot name="icon-end"><sd-6-0-0-next-18-icon library="_internal" name="chevron-down" label="${this.localize.term("scrollToEnd")}"></sd-6-0-0-next-18-icon></slot></button></div>` : null}` : null} ${this.shadows ? html`${this.isScrollHorizontalEnabled ? html`<div part="shadow-left" class="${cx(
|
|
171
171
|
"left top-0 left-0 w-[6px] h-full",
|
|
172
172
|
scrollShadowClasses,
|
|
173
173
|
this.canScroll.left ? "opacity-100" : "opacity-0"
|
|
@@ -189,7 +189,7 @@ var SdScrollable = class extends SolidElement {
|
|
|
189
189
|
SdScrollable.styles = [
|
|
190
190
|
...SolidElement.styles,
|
|
191
191
|
css`/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
|
|
192
|
-
:host{--gradient-color:transparent;--gradient:var(--gradient-color) 0%,rgba(var(--sd-color-background-white, rgba(var(--sd-color-white)))) 80%,rgba(var(--sd-color-background-white, rgba(var(--sd-color-white)))) 100%;position:relative;display:flex;overflow:hidden}.hide-scrollbars{scrollbar-width:none;-ms-overflow-style:none}.hide-scrollbars::-webkit-scrollbar{display:none}.scroll-container::-webkit-scrollbar-thumb{background-color:transparent}.scroll-container:hover::-webkit-scrollbar-thumb{background:var(--background-neutral-400,#c3c3c3);border-radius:var(--sd-radius-sm)}.scroll-container::-webkit-scrollbar{height:var(--sd-spacing-1);width:var(--sd-spacing-1)}.scroll-auto{overflow:auto}[part=button-left]{background:linear-gradient(270deg,var(--gradient))}[part=button-right]{background:linear-gradient(90deg,var(--gradient))}[part=button-top]{background:linear-gradient(0deg,var(--gradient))}[part=button-bottom]{background:linear-gradient(180deg,var(--gradient))}[part=shadow-left]{background:linear-gradient(270deg,transparent 50%,rgba(24,24,24,.4) 100%)}[part=shadow-right]{background:linear-gradient(90deg,transparent 50%,rgba(24,24,24,.4) 100%)}[part=shadow-top]{background:linear-gradient(0deg,transparent 50%,rgba(24,24,24,.4) 100%)}[part=shadow-bottom]{background:linear-gradient(180deg,transparent 50%,rgba(24,24,24,.4) 100%)}.sd-6-0-0-next-
|
|
192
|
+
:host{--gradient-color:transparent;--gradient:var(--gradient-color) 0%,rgba(var(--sd-color-background-white, rgba(var(--sd-color-white)))) 80%,rgba(var(--sd-color-background-white, rgba(var(--sd-color-white)))) 100%;position:relative;display:flex;overflow:hidden}.hide-scrollbars{scrollbar-width:none;-ms-overflow-style:none}.hide-scrollbars::-webkit-scrollbar{display:none}.scroll-container::-webkit-scrollbar-thumb{background-color:transparent}.scroll-container:hover::-webkit-scrollbar-thumb{background:var(--background-neutral-400,#c3c3c3);border-radius:var(--sd-radius-sm)}.scroll-container::-webkit-scrollbar{height:var(--sd-spacing-1);width:var(--sd-spacing-1)}.scroll-auto{overflow:auto}[part=button-left]{background:linear-gradient(270deg,var(--gradient))}[part=button-right]{background:linear-gradient(90deg,var(--gradient))}[part=button-top]{background:linear-gradient(0deg,var(--gradient))}[part=button-bottom]{background:linear-gradient(180deg,var(--gradient))}[part=shadow-left]{background:linear-gradient(270deg,transparent 50%,rgba(24,24,24,.4) 100%)}[part=shadow-right]{background:linear-gradient(90deg,transparent 50%,rgba(24,24,24,.4) 100%)}[part=shadow-top]{background:linear-gradient(0deg,transparent 50%,rgba(24,24,24,.4) 100%)}[part=shadow-bottom]{background:linear-gradient(180deg,transparent 50%,rgba(24,24,24,.4) 100%)}.sd-6-0-0-next-18-icon--top{align-self:flex-start}.sd-6-0-0-next-18-icon--down{align-self:flex-end}`
|
|
193
193
|
];
|
|
194
194
|
__decorateClass([
|
|
195
195
|
query('[part="button-right"] button')
|
|
@@ -237,7 +237,7 @@ __decorateClass([
|
|
|
237
237
|
state()
|
|
238
238
|
], SdScrollable.prototype, "isScrollVerticalEnabled", 2);
|
|
239
239
|
SdScrollable = __decorateClass([
|
|
240
|
-
customElement("sd-6-0-0-next-
|
|
240
|
+
customElement("sd-6-0-0-next-18-scrollable")
|
|
241
241
|
], SdScrollable);
|
|
242
242
|
|
|
243
243
|
export {
|
|
@@ -100,7 +100,7 @@ var SdIcon = class extends SolidElement {
|
|
|
100
100
|
}
|
|
101
101
|
}
|
|
102
102
|
render() {
|
|
103
|
-
return html`<sd-6-0-0-next-
|
|
103
|
+
return html`<sd-6-0-0-next-18-theme-listener></sd-6-0-0-next-18-theme-listener>${unsafeSVG(this.svg)}`;
|
|
104
104
|
}
|
|
105
105
|
};
|
|
106
106
|
SdIcon.styles = [
|
|
@@ -133,7 +133,7 @@ __decorateClass([
|
|
|
133
133
|
watch(["name", "src", "library"])
|
|
134
134
|
], SdIcon.prototype, "setIcon", 1);
|
|
135
135
|
SdIcon = __decorateClass([
|
|
136
|
-
customElement("sd-6-0-0-next-
|
|
136
|
+
customElement("sd-6-0-0-next-18-icon")
|
|
137
137
|
], SdIcon);
|
|
138
138
|
|
|
139
139
|
export {
|
|
@@ -115,13 +115,13 @@ var SdSwitch = class extends SolidElement {
|
|
|
115
115
|
`relative flex flex-initial items-center justify-center border rounded-full h-4 w-8 transition-colors ease duration-100
|
|
116
116
|
peer-focus-visible:outline peer-focus-visible:outline-2 peer-focus-visible:outline-offset-2
|
|
117
117
|
peer-focus-visible:outline-primary transition-colors ease-in-out duration-medium hover:duration-fast`,
|
|
118
|
-
this.disabled && this.checked ? "bg-neutral-500" : this.disabled ? "border-neutral-500" : this.showInvalidStyle ? this.checked ? "border-error bg-error hover:bg-error-400 hover:border-error-400 group-hover:border-error-400 group-hover:bg-error-400" : "border-error bg-white hover:border-error-400 hover:bg-white group-hover:border-error-400 group-hover:bg-white" : this.checked ? "border-accent hover:sd-6-0-0-next-
|
|
118
|
+
this.disabled && this.checked ? "bg-neutral-500" : this.disabled ? "border-neutral-500" : this.showInvalidStyle ? this.checked ? "border-error bg-error hover:bg-error-400 hover:border-error-400 group-hover:border-error-400 group-hover:bg-error-400" : "border-error bg-white hover:border-error-400 hover:bg-white group-hover:border-error-400 group-hover:bg-white" : this.checked ? "border-accent hover:sd-6-0-0-next-18-switch--checked--hover-color-background bg-accent hover:border-accent-550 group-hover:sd-6-0-0-next-18-switch--checked--hover-color-background" : "sd-6-0-0-next-18-switch--unchecked-color-border bg-white hover:bg-neutral-200 group-hover:bg-neutral-200"
|
|
119
119
|
)}"><span id="thumb" part="thumb" class="${cx(
|
|
120
120
|
"w-2.5 h-2.5 rounded-full transition[transform,colors] ease-in-out duration-medium",
|
|
121
|
-
this.disabled && this.checked ? "translate-x-2" : this.disabled ? "-translate-x-2" : this.showInvalidStyle ? this.checked ? "translate-x-2" : "bg-error -translate-x-2 hover:bg-error-400 hover:border-error-400 group-hover:border-error-400 group-hover:bg-error-400" : this.checked ? "translate-x-2" : "-translate-x-2 sd-6-0-0-next-
|
|
121
|
+
this.disabled && this.checked ? "translate-x-2" : this.disabled ? "-translate-x-2" : this.showInvalidStyle ? this.checked ? "translate-x-2" : "bg-error -translate-x-2 hover:bg-error-400 hover:border-error-400 group-hover:border-error-400 group-hover:bg-error-400" : this.checked ? "translate-x-2" : "-translate-x-2 sd-6-0-0-next-18-switch--unchecked__icon-color-background"
|
|
122
122
|
)}"></span> </span><span part="label" id="label" class="${cx(
|
|
123
123
|
"select-none inline-block ml-2",
|
|
124
|
-
this.disabled ? "text-neutral-500" : this.showInvalidStyle ? "text-error" : "sd-6-0-0-next-
|
|
124
|
+
this.disabled ? "text-neutral-500" : this.showInvalidStyle ? "text-error" : "sd-6-0-0-next-18-switch-color-text"
|
|
125
125
|
)}"><slot></slot></span></label> ${this.hasSlotController.test("tooltip") ? html`<slot name="tooltip"></slot>` : null}</div>${this.formControlController.renderInvalidMessage()}`;
|
|
126
126
|
}
|
|
127
127
|
};
|
|
@@ -173,7 +173,7 @@ __decorateClass([
|
|
|
173
173
|
watch(["checked"], { waitUntilFirstUpdate: true })
|
|
174
174
|
], SdSwitch.prototype, "handleStateChange", 1);
|
|
175
175
|
SdSwitch = __decorateClass([
|
|
176
|
-
customElement("sd-6-0-0-next-
|
|
176
|
+
customElement("sd-6-0-0-next-18-switch")
|
|
177
177
|
], SdSwitch);
|
|
178
178
|
|
|
179
179
|
export {
|