@solid-design-system/components 5.15.0 → 5.15.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.QEIRLXKH.js → chunk.Y6QP3CKR.js} +1 -1
- package/cdn/components/navigation-item/navigation-item.js +1 -1
- package/cdn/custom-elements.json +224 -224
- 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/vscode.html-custom-data.json +42 -42
- package/cdn/web-types.json +66 -66
- package/cdn-versioned/chunks/chunk.2FN4O4QC.js +1 -1
- package/cdn-versioned/chunks/chunk.35Q2HMDE.js +1 -1
- package/cdn-versioned/chunks/chunk.3G25QQJC.js +1 -1
- package/cdn-versioned/chunks/chunk.3HSQ2Z2H.js +1 -1
- package/cdn-versioned/chunks/chunk.3NXEOOQY.js +1 -1
- package/cdn-versioned/chunks/chunk.3QQBA7ZB.js +1 -1
- package/cdn-versioned/chunks/chunk.5NCRVBOH.js +1 -1
- package/cdn-versioned/chunks/chunk.5WKY435J.js +1 -1
- package/cdn-versioned/chunks/chunk.64FNEKLV.js +1 -1
- package/cdn-versioned/chunks/chunk.75YRQDIX.js +1 -1
- package/cdn-versioned/chunks/chunk.7JV32P5Q.js +1 -1
- package/cdn-versioned/chunks/chunk.A3ATIGVC.js +1 -1
- package/cdn-versioned/chunks/chunk.AVDTGVC2.js +1 -1
- package/cdn-versioned/chunks/chunk.B3ARBH5A.js +4 -4
- package/cdn-versioned/chunks/chunk.BUJEQKP4.js +1 -1
- package/cdn-versioned/chunks/chunk.BVQEQFOI.js +1 -1
- package/cdn-versioned/chunks/chunk.CBATEBTB.js +1 -1
- package/cdn-versioned/chunks/chunk.CEVVDV52.js +1 -1
- package/cdn-versioned/chunks/chunk.CLJGWFHA.js +1 -1
- package/cdn-versioned/chunks/chunk.DKI2UXRQ.js +1 -1
- package/cdn-versioned/chunks/chunk.F4HX43DG.js +1 -1
- package/cdn-versioned/chunks/chunk.FT6CHNH7.js +1 -1
- package/cdn-versioned/chunks/chunk.FVYMXJRE.js +1 -1
- package/cdn-versioned/chunks/chunk.GKULTMOH.js +1 -1
- package/cdn-versioned/chunks/chunk.GYYHNTEP.js +1 -1
- package/cdn-versioned/chunks/chunk.HMHMBWUC.js +1 -1
- package/cdn-versioned/chunks/chunk.IARZ5WX7.js +2 -2
- package/cdn-versioned/chunks/chunk.IHKACSKZ.js +1 -1
- package/cdn-versioned/chunks/chunk.KD5YA4NW.js +1 -1
- package/cdn-versioned/chunks/chunk.KEJGWWON.js +1 -1
- package/cdn-versioned/chunks/chunk.KTS2L7KB.js +1 -1
- package/cdn-versioned/chunks/chunk.KUNW6IVR.js +1 -1
- package/cdn-versioned/chunks/chunk.KVLS3OE7.js +1 -1
- package/cdn-versioned/chunks/chunk.LMYU4GM4.js +1 -1
- package/cdn-versioned/chunks/chunk.MCRPEKBH.js +1 -1
- package/cdn-versioned/chunks/chunk.N7TPWVK3.js +1 -1
- package/cdn-versioned/chunks/chunk.NMJKLBZG.js +1 -1
- package/cdn-versioned/chunks/chunk.NMZIXMMF.js +1 -1
- package/cdn-versioned/chunks/chunk.NOCXFEZL.js +1 -1
- package/cdn-versioned/chunks/chunk.NQF6SSZQ.js +1 -1
- package/cdn-versioned/chunks/chunk.O7S6H4U5.js +1 -1
- package/cdn-versioned/chunks/chunk.OGCPYUUV.js +1 -1
- package/cdn-versioned/chunks/chunk.P46TXTLQ.js +1 -1
- package/cdn-versioned/chunks/chunk.PM5HD6JE.js +1 -1
- package/cdn-versioned/chunks/chunk.QHS7ZRVI.js +1 -1
- package/cdn-versioned/chunks/chunk.QY23RB35.js +1 -1
- package/cdn-versioned/chunks/chunk.R4E7AJDS.js +1 -1
- package/cdn-versioned/chunks/chunk.S2746Y7L.js +1 -1
- package/cdn-versioned/chunks/chunk.SX7AMKP2.js +2 -2
- package/cdn-versioned/chunks/chunk.TPVQ7ZU3.js +1 -1
- package/cdn-versioned/chunks/chunk.VINV25A7.js +1 -1
- package/cdn-versioned/chunks/chunk.VPECZPLY.js +1 -1
- package/cdn-versioned/chunks/chunk.VVM6Q5W5.js +4 -4
- package/cdn-versioned/chunks/chunk.W7A3TU2Z.js +1 -1
- package/cdn-versioned/chunks/chunk.WOVNF4UB.js +1 -1
- package/cdn-versioned/chunks/chunk.X67M4VEV.js +1 -1
- package/cdn-versioned/chunks/{chunk.QEIRLXKH.js → chunk.Y6QP3CKR.js} +1 -1
- package/cdn-versioned/chunks/chunk.YGMAKCAO.js +1 -1
- package/cdn-versioned/chunks/chunk.Z2YNXRLX.js +1 -1
- package/cdn-versioned/chunks/chunk.Z5LJ5HLC.js +1 -1
- package/cdn-versioned/chunks/chunk.ZEI6MVG3.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/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/navigation-item/navigation-item.js +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/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/tooltip/tooltip.d.ts +1 -1
- package/cdn-versioned/components/video/video.d.ts +1 -1
- package/cdn-versioned/custom-elements.json +457 -457
- package/cdn-versioned/internal/form.js +3 -3
- package/cdn-versioned/solid-components.bundle.js +14 -14
- package/cdn-versioned/solid-components.css +2 -2
- package/cdn-versioned/solid-components.iife.js +14 -14
- package/cdn-versioned/solid-components.js +1 -1
- package/cdn-versioned/vscode.html-custom-data.json +131 -131
- package/cdn-versioned/web-types.json +217 -217
- package/dist/chunks/{chunk.RQVQQ7ZE.js → chunk.T5YQM2UK.js} +1 -1
- package/dist/components/navigation-item/navigation-item.js +1 -1
- package/dist/custom-elements.json +224 -224
- package/dist/solid-components.js +1 -1
- package/dist/vscode.html-custom-data.json +42 -42
- package/dist/web-types.json +66 -66
- package/dist-versioned/chunks/chunk.26VYQIOD.js +3 -3
- package/dist-versioned/chunks/chunk.2MJJHZR4.js +24 -24
- package/dist-versioned/chunks/chunk.32WTYFY6.js +4 -4
- package/dist-versioned/chunks/chunk.37LBEMXS.js +12 -12
- package/dist-versioned/chunks/chunk.37TNCACC.js +2 -2
- package/dist-versioned/chunks/chunk.3EQ2WOVC.js +2 -2
- package/dist-versioned/chunks/chunk.4FYYKKBL.js +3 -3
- package/dist-versioned/chunks/chunk.4I4QBVGB.js +3 -3
- package/dist-versioned/chunks/chunk.5KQPPIBZ.js +2 -2
- package/dist-versioned/chunks/chunk.5LLVB6R3.js +5 -5
- package/dist-versioned/chunks/chunk.5PM33S4N.js +2 -2
- package/dist-versioned/chunks/chunk.6DKXZWRN.js +4 -4
- package/dist-versioned/chunks/chunk.7YQJWIYJ.js +1 -1
- package/dist-versioned/chunks/chunk.AE3WPKVR.js +1 -1
- package/dist-versioned/chunks/chunk.AHMEVJMX.js +1 -1
- package/dist-versioned/chunks/chunk.ALVVYYIR.js +1 -1
- package/dist-versioned/chunks/chunk.ANOMYZE3.js +11 -11
- package/dist-versioned/chunks/chunk.B3PDWSAO.js +2 -2
- package/dist-versioned/chunks/chunk.B4AW33FC.js +1 -1
- package/dist-versioned/chunks/chunk.B6FL47S6.js +2 -2
- package/dist-versioned/chunks/chunk.BA3MSKPQ.js +5 -5
- package/dist-versioned/chunks/chunk.BDUEFRPO.js +2 -2
- package/dist-versioned/chunks/chunk.BJ6QDKVA.js +4 -4
- package/dist-versioned/chunks/chunk.BMFACTFH.js +3 -3
- package/dist-versioned/chunks/chunk.C332XERU.js +2 -2
- package/dist-versioned/chunks/chunk.CNDCBFFV.js +1 -1
- package/dist-versioned/chunks/chunk.CS6G3MPN.js +2 -2
- package/dist-versioned/chunks/chunk.DIXRYCRP.js +1 -1
- package/dist-versioned/chunks/chunk.EYGJ6QWJ.js +1 -1
- package/dist-versioned/chunks/chunk.GGCTLJ4D.js +2 -2
- package/dist-versioned/chunks/chunk.GIS5TWPR.js +1 -1
- package/dist-versioned/chunks/chunk.HMK6KRAR.js +6 -6
- package/dist-versioned/chunks/chunk.HV3AJIJO.js +1 -1
- package/dist-versioned/chunks/chunk.I2LO4IGY.js +3 -3
- package/dist-versioned/chunks/chunk.JQJXSQKT.js +3 -3
- package/dist-versioned/chunks/chunk.JW5YX4GK.js +2 -2
- package/dist-versioned/chunks/chunk.K2DJQDJ4.js +1 -1
- package/dist-versioned/chunks/chunk.KEJFWGZI.js +4 -4
- package/dist-versioned/chunks/chunk.KNWAH4Z5.js +1 -1
- package/dist-versioned/chunks/chunk.KPWKRZGL.js +14 -14
- package/dist-versioned/chunks/chunk.KQLO4TZ5.js +2 -2
- package/dist-versioned/chunks/chunk.LGELFCZP.js +2 -2
- package/dist-versioned/chunks/chunk.MHLZ7GKR.js +12 -12
- package/dist-versioned/chunks/chunk.NAFCDIL3.js +26 -26
- package/dist-versioned/chunks/chunk.NFY6NE6Z.js +2 -2
- package/dist-versioned/chunks/chunk.NXS7DO7N.js +1 -1
- package/dist-versioned/chunks/chunk.PBEPE2U7.js +2 -2
- package/dist-versioned/chunks/chunk.QCA2GRRO.js +5 -5
- package/dist-versioned/chunks/chunk.RUNTBTHS.js +1 -1
- package/dist-versioned/chunks/chunk.SGJLP4HM.js +2 -2
- package/dist-versioned/chunks/chunk.SMMMT4SZ.js +8 -8
- package/dist-versioned/chunks/chunk.SRLNYSZB.js +5 -5
- package/dist-versioned/chunks/chunk.SV7PKNLF.js +4 -4
- package/dist-versioned/chunks/{chunk.RQVQQ7ZE.js → chunk.T5YQM2UK.js} +7 -7
- package/dist-versioned/chunks/chunk.UIQBHPD3.js +2 -2
- package/dist-versioned/chunks/chunk.VGC5A42Q.js +1 -1
- package/dist-versioned/chunks/chunk.WFIIU6PJ.js +3 -3
- package/dist-versioned/chunks/chunk.WUIOLD72.js +6 -6
- package/dist-versioned/chunks/chunk.XCQC3F3H.js +3 -3
- package/dist-versioned/chunks/chunk.XWZNY4BH.js +3 -3
- package/dist-versioned/chunks/chunk.ZK4EFZJB.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/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/navigation-item/navigation-item.js +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/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/tooltip/tooltip.d.ts +1 -1
- package/dist-versioned/components/video/video.d.ts +1 -1
- package/dist-versioned/custom-elements.json +457 -457
- package/dist-versioned/internal/form.js +3 -3
- package/dist-versioned/solid-components.css +2 -2
- package/dist-versioned/solid-components.js +1 -1
- package/dist-versioned/vscode.html-custom-data.json +131 -131
- package/dist-versioned/web-types.json +217 -217
- package/package.json +1 -1
|
@@ -206,15 +206,15 @@ 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-5-15-
|
|
209
|
+
return html`<sd-5-15-1-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-5-15-
|
|
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-5-15-1-icon library="_internal" name="info-circle" label="Tooltip" class="${cx(this.disabled && "sd-interactive--disabled")}"></sd-5-15-1-icon></button>`}<slot name="content" part="body" id="tooltip" class="bg-primary text-white 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-5-15-1-popup>`;
|
|
213
213
|
}
|
|
214
214
|
};
|
|
215
215
|
SdTooltip.styles = [
|
|
216
216
|
...SolidElement.styles,
|
|
217
|
-
css`:host{--hide-delay:0ms;--show-delay:150ms;display:contents}sd-5-15-
|
|
217
|
+
css`:host{--hide-delay:0ms;--show-delay:150ms;display:contents}sd-5-15-1-popup{--arrow-color:rgb(var(--sd-color-primary,0 53 142)/1);--arrow-size:10px}sd-5-15-1-popup::part(popup){pointer-events:none;z-index:10;--tw-shadow:var(--sd-shadow,0px 1px 3px 0px rgba(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-5-15-1-popup::part(arrow){--tw-shadow:var(--sd-shadow,0px 1px 3px 0px rgba(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-5-15-1-popup[placement^=top]::part(popup){transform-origin:bottom}sd-5-15-1-popup[placement^=bottom]::part(popup){transform-origin:top}#tooltip{max-width:var(--max-width)}::slotted([slot=content]){max-height:var(--auto-size-available-height)!important;max-width:var(--auto-size-available-width)!important;overflow:auto}`
|
|
218
218
|
];
|
|
219
219
|
__decorateClass([
|
|
220
220
|
query("slot:not([name])")
|
|
@@ -223,7 +223,7 @@ __decorateClass([
|
|
|
223
223
|
query("#tooltip")
|
|
224
224
|
], SdTooltip.prototype, "body", 2);
|
|
225
225
|
__decorateClass([
|
|
226
|
-
query("sd-5-15-
|
|
226
|
+
query("sd-5-15-1-popup")
|
|
227
227
|
], SdTooltip.prototype, "popup", 2);
|
|
228
228
|
__decorateClass([
|
|
229
229
|
property({ type: String, reflect: true })
|
|
@@ -256,7 +256,7 @@ __decorateClass([
|
|
|
256
256
|
watch("disabled")
|
|
257
257
|
], SdTooltip.prototype, "handleDisabledChange", 1);
|
|
258
258
|
SdTooltip = __decorateClass([
|
|
259
|
-
customElement("sd-5-15-
|
|
259
|
+
customElement("sd-5-15-1-tooltip")
|
|
260
260
|
], SdTooltip);
|
|
261
261
|
setDefaultAnimation("tooltip.show", {
|
|
262
262
|
keyframes: [{ opacity: 0 }, { opacity: 1 }],
|
|
@@ -88,7 +88,7 @@ var SdRadioButton = class extends SolidElement {
|
|
|
88
88
|
};
|
|
89
89
|
SdRadioButton.styles = [
|
|
90
90
|
...SolidElement.styles,
|
|
91
|
-
css`:host{display:block;width:-moz-min-content;width:min-content}.hidden-input{all:unset;inset:var(--sd-spacing-0,0);opacity:var(--sd-opacity-0,0);outline-color:rgb(var(--sd-color-error,204 25 55)/1);outline-style:dotted;outline-width:1px;position:absolute;z-index:-10}.lg-label,.lg-no-label{height:var(--sd-spacing-12,3rem)}.lg-no-label{padding-left:var(--sd-spacing-5,1.25rem);padding-right:var(--sd-spacing-5,1.25rem)}.md-label,.md-no-label{height:var(--sd-spacing-10,2.5rem)}.md-no-label{padding-left:var(--sd-spacing-4,1rem);padding-right:var(--sd-spacing-4,1rem)}.sm-label,.sm-no-label{height:var(--sd-spacing-8,2rem)}.sm-no-label{padding-left:var(--sd-spacing-3,.75rem);padding-right:var(--sd-spacing-3,.75rem)}:host([size=lg].sd-5-15-
|
|
91
|
+
css`:host{display:block;width:-moz-min-content;width:min-content}.hidden-input{all:unset;inset:var(--sd-spacing-0,0);opacity:var(--sd-opacity-0,0);outline-color:rgb(var(--sd-color-error,204 25 55)/1);outline-style:dotted;outline-width:1px;position:absolute;z-index:-10}.lg-label,.lg-no-label{height:var(--sd-spacing-12,3rem)}.lg-no-label{padding-left:var(--sd-spacing-5,1.25rem);padding-right:var(--sd-spacing-5,1.25rem)}.md-label,.md-no-label{height:var(--sd-spacing-10,2.5rem)}.md-no-label{padding-left:var(--sd-spacing-4,1rem);padding-right:var(--sd-spacing-4,1rem)}.sm-label,.sm-no-label{height:var(--sd-spacing-8,2rem)}.sm-no-label{padding-left:var(--sd-spacing-3,.75rem);padding-right:var(--sd-spacing-3,.75rem)}:host([size=lg].sd-5-15-1-button-group__button:not(.sd-5-15-1-button-group__button--first)){margin-inline-start:calc(var(--sd-spacing-3,.75rem)*-1)}:host([size=md].sd-5-15-1-button-group__button:not(.sd-5-15-1-button-group__button--first)){margin-inline-start:calc(var(--sd-spacing-2,.5rem)*-1)}:host([size=sm].sd-5-15-1-button-group__button:not(.sd-5-15-1-button-group__button--first)){margin-inline-start:calc(var(--sd-spacing-1,.25rem)*-1)}:host(.sd-5-15-1-button-group__button--hover){z-index:20}:host(.sd-5-15-1-button-group__button--focus),:host(.sd-5-15-1-button-group__button[checked]){z-index:10}`
|
|
92
92
|
];
|
|
93
93
|
__decorateClass([
|
|
94
94
|
query(".button")
|
|
@@ -118,7 +118,7 @@ __decorateClass([
|
|
|
118
118
|
watch(["disabled", "visually-disabled"], { waitUntilFirstUpdate: true })
|
|
119
119
|
], SdRadioButton.prototype, "handleDisabledChange", 1);
|
|
120
120
|
SdRadioButton = __decorateClass([
|
|
121
|
-
customElement("sd-5-15-
|
|
121
|
+
customElement("sd-5-15-1-radio-button")
|
|
122
122
|
], SdRadioButton);
|
|
123
123
|
|
|
124
124
|
export {
|
|
@@ -10,7 +10,7 @@ function setupAutocomplete(selector, { setValueOnSelection, scrollSelectionIntoV
|
|
|
10
10
|
var _a, _b;
|
|
11
11
|
const ul = (_a = sdInput.shadowRoot) == null ? void 0 : _a.querySelector("ul");
|
|
12
12
|
ul == null ? void 0 : ul.setAttribute("part", "listbox");
|
|
13
|
-
const popup = document.createElement("sd-5-15-
|
|
13
|
+
const popup = document.createElement("sd-5-15-1-popup");
|
|
14
14
|
popup.appendChild(ul);
|
|
15
15
|
(_b = sdInput.shadowRoot) == null ? void 0 : _b.appendChild(popup);
|
|
16
16
|
popup == null ? void 0 : popup.setAttribute("exportparts", "popup__content");
|
|
@@ -22,7 +22,7 @@ function setupAutocomplete(selector, { setValueOnSelection, scrollSelectionIntoV
|
|
|
22
22
|
popup.anchor = sdInput;
|
|
23
23
|
popup.sync = "width";
|
|
24
24
|
}
|
|
25
|
-
const styles = css`sd-5-15-
|
|
25
|
+
const styles = css`sd-5-15-1-popup::part(popup){border-bottom-left-radius:var(--sd-border-radius-default,.25rem);border-bottom-right-radius:var(--sd-border-radius-default,.25rem);border-width:0 2px 2px;overflow-y:scroll;z-index:var(--sd-z-index-dropdown,900);--tw-border-opacity:1;border-color:rgb(var(--sd-color-primary,0 53 142)/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(var(--sd-color-white,255 255 255)/var(--tw-bg-opacity,1));padding:var(--sd-spacing-3,.75rem) var(--sd-spacing-2,.5rem);--tw-shadow:var(--sd-shadow,0px 1px 3px 0px rgba(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-5-15-1-popup li{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}sd-5-15-1-popup li:hover:not([disabled]){--tw-bg-opacity:1;background-color:rgb(var(--sd-color-neutral-100,246 246 246)/var(--tw-bg-opacity,1))}sd-5-15-1-popup li{list-style-type:""}sd-5-15-1-popup li mark{background-color:transparent;font-weight:700}sd-5-15-1-popup li:not(:has(sd-5-15-1-option)){cursor:pointer;font-size:var(--sd-font-size-base,1rem);padding:var(--sd-spacing-3,.75rem) var(--sd-spacing-4,1rem);--tw-text-opacity:1;color:rgb(var(--sd-color-black,24 24 24)/var(--tw-text-opacity,1))}sd-5-15-1-popup li:not(:has(sd-5-15-1-option)):hover{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-neutral-200,233 233 233)/var(--tw-bg-opacity,1))}sd-5-15-1-popup li[aria-selected=true]{--tw-bg-opacity:1;background-color:rgb(var(--sd-color-neutral-200,233 233 233)/var(--tw-bg-opacity,1))}`;
|
|
26
26
|
const styleSheet = new CSSStyleSheet();
|
|
27
27
|
styleSheet.replaceSync(styles);
|
|
28
28
|
sdInput.shadowRoot.adoptedStyleSheets = [...sdInput.shadowRoot.adoptedStyleSheets, styleSheet];
|
|
@@ -35,13 +35,13 @@ function setupAutocomplete(selector, { setValueOnSelection, scrollSelectionIntoV
|
|
|
35
35
|
}
|
|
36
36
|
input.addEventListener("open", () => {
|
|
37
37
|
var _a, _b, _c, _d, _e, _f;
|
|
38
|
-
(_b = (_a = sdInput.shadowRoot) == null ? void 0 : _a.querySelector("sd-5-15-
|
|
38
|
+
(_b = (_a = sdInput.shadowRoot) == null ? void 0 : _a.querySelector("sd-5-15-1-popup")) == null ? void 0 : _b.setAttribute("active", "true");
|
|
39
39
|
(_d = (_c = sdInput.shadowRoot) == null ? void 0 : _c.querySelector('[part="border"]')) == null ? void 0 : _d.classList.add("rounded-b-none");
|
|
40
40
|
(_f = (_e = sdInput.shadowRoot) == null ? void 0 : _e.querySelector('[part="form-control"]')) == null ? void 0 : _f.classList.add("z-50");
|
|
41
41
|
});
|
|
42
42
|
input.addEventListener("close", () => {
|
|
43
43
|
var _a, _b, _c, _d, _e, _f;
|
|
44
|
-
(_b = (_a = sdInput.shadowRoot) == null ? void 0 : _a.querySelector("sd-5-15-
|
|
44
|
+
(_b = (_a = sdInput.shadowRoot) == null ? void 0 : _a.querySelector("sd-5-15-1-popup")) == null ? void 0 : _b.removeAttribute("active");
|
|
45
45
|
(_d = (_c = sdInput.shadowRoot) == null ? void 0 : _c.querySelector('[part="border"]')) == null ? void 0 : _d.classList.remove("rounded-b-none");
|
|
46
46
|
(_f = (_e = sdInput.shadowRoot) == null ? void 0 : _e.querySelector('[part="form-control"]')) == null ? void 0 : _f.classList.remove("z-50");
|
|
47
47
|
});
|
|
@@ -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-5-15-
|
|
20
|
+
button == null ? void 0 : button.classList.add("sd-5-15-1-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-5-15-
|
|
24
|
+
button == null ? void 0 : button.classList.remove("sd-5-15-1-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-5-15-
|
|
28
|
+
button == null ? void 0 : button.classList.add("sd-5-15-1-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-5-15-
|
|
32
|
+
button == null ? void 0 : button.classList.remove("sd-5-15-1-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-5-15-
|
|
41
|
-
button.classList.toggle("sd-5-15-
|
|
42
|
-
button.classList.toggle("sd-5-15-
|
|
43
|
-
button.classList.toggle("sd-5-15-
|
|
44
|
-
button.classList.toggle("sd-5-15-
|
|
40
|
+
button.classList.add("sd-5-15-1-button-group__button");
|
|
41
|
+
button.classList.toggle("sd-5-15-1-button-group__button--first", index === 0);
|
|
42
|
+
button.classList.toggle("sd-5-15-1-button-group__button--inner", index > 0 && index < slottedElements.length - 1);
|
|
43
|
+
button.classList.toggle("sd-5-15-1-button-group__button--last", index === slottedElements.length - 1);
|
|
44
|
+
button.classList.toggle("sd-5-15-1-button-group__button--radio", button.tagName.toLowerCase() === "sd-5-15-1-radio-button");
|
|
45
45
|
}
|
|
46
46
|
});
|
|
47
47
|
}
|
|
@@ -63,11 +63,11 @@ __decorateClass([
|
|
|
63
63
|
property({ type: String, reflect: true })
|
|
64
64
|
], SdButtonGroup.prototype, "label", 2);
|
|
65
65
|
SdButtonGroup = __decorateClass([
|
|
66
|
-
customElement("sd-5-15-
|
|
66
|
+
customElement("sd-5-15-1-button-group")
|
|
67
67
|
], SdButtonGroup);
|
|
68
68
|
function findButton(el) {
|
|
69
69
|
var _a;
|
|
70
|
-
const selector = "sd-5-15-
|
|
70
|
+
const selector = "sd-5-15-1-button, sd-5-15-1-radio-button";
|
|
71
71
|
return (_a = el.closest(selector)) != null ? _a : el.querySelector(selector);
|
|
72
72
|
}
|
|
73
73
|
|
|
@@ -176,7 +176,7 @@ var SdDialog = class extends SolidElement {
|
|
|
176
176
|
)}"><div part="overlay" class="fixed inset-0 bg-primary-800 opacity-90" @click="${() => this.requestClose("overlay")}" tabindex="-1"></div><div part="panel" class="${cx(
|
|
177
177
|
"flex flex-col z-20 bg-white py-4 sm:py-8 relative gap-6 focus-visible:focus-outline-inverted overflow-y-auto",
|
|
178
178
|
this.open && "flex opacity-100"
|
|
179
|
-
)}" 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-5-15-
|
|
179
|
+
)}" 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-5-15-1-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-5-15-1-icon label="${this.localize.term("close")}" name="close" library="_internal" color="currentColor"></sd-5-15-1-icon></sd-5-15-1-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>`;
|
|
180
180
|
}
|
|
181
181
|
};
|
|
182
182
|
SdDialog.styles = [
|
|
@@ -205,7 +205,7 @@ __decorateClass([
|
|
|
205
205
|
watch("open", { waitUntilFirstUpdate: true })
|
|
206
206
|
], SdDialog.prototype, "handleOpenChange", 1);
|
|
207
207
|
SdDialog = __decorateClass([
|
|
208
|
-
customElement("sd-5-15-
|
|
208
|
+
customElement("sd-5-15-1-dialog")
|
|
209
209
|
], SdDialog);
|
|
210
210
|
setDefaultAnimation("dialog.show", {
|
|
211
211
|
keyframes: [
|
|
@@ -323,7 +323,7 @@ __decorateClass([
|
|
|
323
323
|
property({ attribute: "auto-size-padding", type: Number })
|
|
324
324
|
], SdPopup.prototype, "autoSizePadding", 2);
|
|
325
325
|
SdPopup = __decorateClass([
|
|
326
|
-
customElement("sd-5-15-
|
|
326
|
+
customElement("sd-5-15-1-popup")
|
|
327
327
|
], SdPopup);
|
|
328
328
|
|
|
329
329
|
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 bg-opacity-75 rounded-full play-pause-transition outline-2 outline-offset-2 group-focus-visible:outline"
|
|
101
|
-
)}"><slot name="play-icon" part="play-icon" class="${cx(this.isBelowBreakpoint ? "text-[2rem]" : "text-[4rem]")}"><sd-5-15-
|
|
101
|
+
)}"><slot name="play-icon" part="play-icon" class="${cx(this.isBelowBreakpoint ? "text-[2rem]" : "text-[4rem]")}"><sd-5-15-1-icon id="default-play-icon" library="_internal" name="start"></sd-5-15-1-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 = [
|
|
@@ -115,7 +115,7 @@ __decorateClass([
|
|
|
115
115
|
property({ type: Boolean })
|
|
116
116
|
], SdVideo.prototype, "isBelowBreakpoint", 2);
|
|
117
117
|
SdVideo = __decorateClass([
|
|
118
|
-
customElement("sd-5-15-
|
|
118
|
+
customElement("sd-5-15-1-video")
|
|
119
119
|
], SdVideo);
|
|
120
120
|
|
|
121
121
|
export {
|
|
@@ -26,7 +26,7 @@ var SdCheckboxGroup = class extends SolidElement {
|
|
|
26
26
|
this.helpText = "";
|
|
27
27
|
}
|
|
28
28
|
getAllCheckboxes() {
|
|
29
|
-
return [...this.querySelectorAll("sd-5-15-
|
|
29
|
+
return [...this.querySelectorAll("sd-5-15-1-checkbox")];
|
|
30
30
|
}
|
|
31
31
|
async syncCheckboxElements() {
|
|
32
32
|
const checkboxes = this.getAllCheckboxes();
|
|
@@ -39,10 +39,10 @@ var SdCheckboxGroup = class extends SolidElement {
|
|
|
39
39
|
);
|
|
40
40
|
}
|
|
41
41
|
syncCheckboxes() {
|
|
42
|
-
if (customElements.get("sd-5-15-
|
|
42
|
+
if (customElements.get("sd-5-15-1-checkbox")) {
|
|
43
43
|
this.syncCheckboxElements();
|
|
44
44
|
} else {
|
|
45
|
-
customElements.whenDefined("sd-5-15-
|
|
45
|
+
customElements.whenDefined("sd-5-15-1-checkbox").then(() => this.syncCheckboxes());
|
|
46
46
|
}
|
|
47
47
|
}
|
|
48
48
|
handleSizeChange() {
|
|
@@ -79,7 +79,7 @@ var SdCheckboxGroup = class extends SolidElement {
|
|
|
79
79
|
*/
|
|
80
80
|
SdCheckboxGroup.styles = [
|
|
81
81
|
...SolidElement.styles,
|
|
82
|
-
css`:host{display:block}:host([orientation=vertical]) ::slotted(sd-5-15-
|
|
82
|
+
css`:host{display:block}:host([orientation=vertical]) ::slotted(sd-5-15-1-checkbox){display:flex;margin-bottom:var(--sd-spacing-2,.5rem)}:host([orientation=vertical]) ::slotted(sd-5-15-1-checkbox:last-of-type){margin-bottom:var(--sd-spacing-0,0)}:host([orientation=horizontal]) ::slotted(sd-5-15-1-checkbox){margin-right:var(--sd-spacing-6,1.5rem)}:host([orientation=horizontal]) ::slotted(sd-5-15-1-checkbox:last-of-type){margin-right:var(--sd-spacing-0,0)}:host([orientation=horizontal]):host([size=sm]) ::slotted(sd-5-15-1-checkbox){margin-right:var(--sd-spacing-4,1rem)}:host([orientation=horizontal]):host([size=sm]) ::slotted(sd-5-15-1-checkbox:last-of-type){margin-right:var(--sd-spacing-0,0)}`
|
|
83
83
|
];
|
|
84
84
|
__decorateClass([
|
|
85
85
|
property({ type: String, reflect: true })
|
|
@@ -100,7 +100,7 @@ __decorateClass([
|
|
|
100
100
|
watch("invalid", { waitUntilFirstUpdate: true })
|
|
101
101
|
], SdCheckboxGroup.prototype, "handleInvalid", 1);
|
|
102
102
|
SdCheckboxGroup = __decorateClass([
|
|
103
|
-
customElement("sd-5-15-
|
|
103
|
+
customElement("sd-5-15-1-checkbox-group")
|
|
104
104
|
], SdCheckboxGroup);
|
|
105
105
|
|
|
106
106
|
export {
|
|
@@ -80,7 +80,7 @@ var SdTag = class extends SolidElement {
|
|
|
80
80
|
!this.removable ? "hover:border-primary-500 hover:bg-neutral-100 hover:text-primary-500" : "has-[button:hover]:border-primary-500 has-[button:hover]:bg-neutral-100 has-[button:hover]:text-primary-500"
|
|
81
81
|
) : "bg-primary border-primary text-white hover:bg-primary-500 hover:border-primary-500 disabled:bg-neutral-500 disabled:border-neutral-500",
|
|
82
82
|
this.disabled && !isLink && "cursor-not-allowed"
|
|
83
|
-
)}"><slot id="content" part="content"></slot>${this.removable && !isLink ? html`<button class="sd-interactive flex items-center" type="button" @click="${this.handleRemove}"><slot part="removable-indicator" name="removable-indicator"><sd-5-15-
|
|
83
|
+
)}"><slot id="content" part="content"></slot>${this.removable && !isLink ? html`<button class="sd-interactive flex items-center" type="button" @click="${this.handleRemove}"><slot part="removable-indicator" name="removable-indicator"><sd-5-15-1-icon library="_internal" name="close" label="${this.localize.term("remove")}"></sd-5-15-1-icon></slot></button>` : ""}</${tag}>`;
|
|
84
84
|
}
|
|
85
85
|
};
|
|
86
86
|
SdTag.styles = [
|
|
@@ -115,7 +115,7 @@ __decorateClass([
|
|
|
115
115
|
property({ reflect: true })
|
|
116
116
|
], SdTag.prototype, "download", 2);
|
|
117
117
|
SdTag = __decorateClass([
|
|
118
|
-
customElement("sd-5-15-
|
|
118
|
+
customElement("sd-5-15-1-tag")
|
|
119
119
|
], SdTag);
|
|
120
120
|
|
|
121
121
|
export {
|
|
@@ -25,11 +25,11 @@ var SdOptgroup = class extends SolidElement {
|
|
|
25
25
|
this.label = "";
|
|
26
26
|
}
|
|
27
27
|
/**
|
|
28
|
-
* Syncs the disabled prop for all slotted sd-5-15-
|
|
28
|
+
* Syncs the disabled prop for all slotted sd-5-15-1-options when it is triggered
|
|
29
29
|
*/
|
|
30
30
|
handleDisableOptions() {
|
|
31
31
|
const { disabled } = this;
|
|
32
|
-
this.defaultSlot.assignedElements().filter((opt) => opt.tagName.toLowerCase() === "sd-5-15-
|
|
32
|
+
this.defaultSlot.assignedElements().filter((opt) => opt.tagName.toLowerCase() === "sd-5-15-1-option").forEach((opt) => {
|
|
33
33
|
opt.disabled = disabled;
|
|
34
34
|
});
|
|
35
35
|
}
|
|
@@ -38,7 +38,7 @@ var SdOptgroup = class extends SolidElement {
|
|
|
38
38
|
}
|
|
39
39
|
render() {
|
|
40
40
|
const { disabled } = this;
|
|
41
|
-
return html`<div role="${disabled ? "presentation" : "group"}" class="${cx(this.disabled ? "text-neutral-500" : "")}" part="base" aria-labelledby="group-label"><sd-5-15-
|
|
41
|
+
return html`<div role="${disabled ? "presentation" : "group"}" class="${cx(this.disabled ? "text-neutral-500" : "")}" part="base" aria-labelledby="group-label"><sd-5-15-1-divider id="divider" class="pt-2 pb-4" part="divider"></sd-5-15-1-divider><div part="label-container" class="${cx(this.disabled ? "text-neutral-500" : "text-black")} px-4 font-bold text-left" role="presentation" id="group-label"><slot name="label"><span>${this.label}</span></slot></div><div role="listbox" part="options" aria-label="${this.localize.term("optionGroup")}"><slot @slotchange="${this.handleDisableOptions}"></slot></div></div>`;
|
|
42
42
|
}
|
|
43
43
|
};
|
|
44
44
|
SdOptgroup.styles = [
|
|
@@ -58,7 +58,7 @@ __decorateClass([
|
|
|
58
58
|
watch("disabled", { waitUntilFirstUpdate: true })
|
|
59
59
|
], SdOptgroup.prototype, "handleDisabledChange", 1);
|
|
60
60
|
SdOptgroup = __decorateClass([
|
|
61
|
-
customElement("sd-5-15-
|
|
61
|
+
customElement("sd-5-15-1-optgroup")
|
|
62
62
|
], SdOptgroup);
|
|
63
63
|
|
|
64
64
|
export {
|
|
@@ -38,12 +38,12 @@ var SdBreadcrumbItem = class extends SolidElement {
|
|
|
38
38
|
requestAnimationFrame(() => this.handleCurrentChange());
|
|
39
39
|
}
|
|
40
40
|
render() {
|
|
41
|
-
return html`<sd-5-15-
|
|
41
|
+
return html`<sd-5-15-1-link part="base" href="${ifDefined(!this.current ? this.href : void 0)}" target="${this.target}" standalone class="text-nowrap"><slot></slot></sd-5-15-1-link>`;
|
|
42
42
|
}
|
|
43
43
|
};
|
|
44
44
|
SdBreadcrumbItem.styles = [
|
|
45
45
|
...SolidElement.styles,
|
|
46
|
-
css`:host{align-items:center;display:inline-flex}sd-5-15-
|
|
46
|
+
css`:host{align-items:center;display:inline-flex}sd-5-15-1-link::part(base){align-items:center}sd-5-15-1-link::part(icon-left){display:inline-flex;margin-right:var(--sd-spacing-0,0)}sd-5-15-1-link sd-5-15-1-icon{margin:var(--sd-spacing-0,0)}:host([current]) sd-5-15-1-link::part(base){--tw-text-opacity:1;color:rgb(var(--sd-color-neutral-700,104 104 104)/var(--tw-text-opacity,1))}:host([current]) sd-5-15-1-link::part(label){text-decoration-line:none}`
|
|
47
47
|
];
|
|
48
48
|
__decorateClass([
|
|
49
49
|
query('[part="base"]')
|
|
@@ -61,7 +61,7 @@ __decorateClass([
|
|
|
61
61
|
watch("current")
|
|
62
62
|
], SdBreadcrumbItem.prototype, "handleCurrentChange", 1);
|
|
63
63
|
SdBreadcrumbItem = __decorateClass([
|
|
64
|
-
customElement("sd-5-15-
|
|
64
|
+
customElement("sd-5-15-1-breadcrumb-item")
|
|
65
65
|
], SdBreadcrumbItem);
|
|
66
66
|
|
|
67
67
|
export {
|
|
@@ -93,7 +93,7 @@ var SdOption = class extends SolidElement {
|
|
|
93
93
|
)}"></span> ${this.checkbox ? html`<span id="control" part="control ${this.selected ? " control--checked" : "control--unchecked"}" class="${cx(
|
|
94
94
|
"relative flex flex-shrink-0 items-center justify-center border rounded-sm h-4 w-4 mr-2",
|
|
95
95
|
this.disabled ? "border-neutral-500" : this.selected ? "bg-accent border-accent" : "bg-white border-neutral-800"
|
|
96
|
-
)}">${this.selected ? html`<sd-5-15-
|
|
96
|
+
)}">${this.selected ? html`<sd-5-15-1-icon part="checked-icon" class="text-white w-3 h-3" library="_internal" name="status-check"></sd-5-15-1-icon>` : ""}</span>` : ""} ${slots["left"] ? html`<slot name="left" part="left" class="inline-flex mr-2"></slot>` : ""}<slot part="label" class="inline-block flex-grow" @slotchange="${this.handleDefaultSlotChange}"></slot>${slots["right"] ? html`<slot name="right" part="right" class="inline-flex ml-2"></slot>` : ""}</div>`;
|
|
97
97
|
}
|
|
98
98
|
};
|
|
99
99
|
/**
|
|
@@ -140,7 +140,7 @@ __decorateClass([
|
|
|
140
140
|
watch("value")
|
|
141
141
|
], SdOption.prototype, "handleValueChange", 1);
|
|
142
142
|
SdOption = __decorateClass([
|
|
143
|
-
customElement("sd-5-15-
|
|
143
|
+
customElement("sd-5-15-1-option")
|
|
144
144
|
], SdOption);
|
|
145
145
|
|
|
146
146
|
export {
|
|
@@ -24,7 +24,7 @@ var SdTab = class extends SolidElement {
|
|
|
24
24
|
constructor() {
|
|
25
25
|
super(...arguments);
|
|
26
26
|
this.attrId = ++id;
|
|
27
|
-
this.componentId = `sd-5-15-
|
|
27
|
+
this.componentId = `sd-5-15-1-tab-${this.attrId}`;
|
|
28
28
|
this.hasSlotController = new HasSlotController(this, "left");
|
|
29
29
|
this.localize = new LocalizeController(this);
|
|
30
30
|
this.variant = "default";
|
|
@@ -107,7 +107,7 @@ __decorateClass([
|
|
|
107
107
|
watch(["disabled", "visually-disabled"])
|
|
108
108
|
], SdTab.prototype, "handleDisabledChange", 1);
|
|
109
109
|
SdTab = __decorateClass([
|
|
110
|
-
customElement("sd-5-15-
|
|
110
|
+
customElement("sd-5-15-1-tab")
|
|
111
111
|
], SdTab);
|
|
112
112
|
|
|
113
113
|
export {
|
|
@@ -55,7 +55,7 @@ var SdStepGroup = class extends SolidElement {
|
|
|
55
55
|
});
|
|
56
56
|
}
|
|
57
57
|
getAllSteps() {
|
|
58
|
-
return [...this.body.assignedElements()].filter((el) => el.tagName.toLowerCase() === "sd-5-15-
|
|
58
|
+
return [...this.body.assignedElements()].filter((el) => el.tagName.toLowerCase() === "sd-5-15-1-step");
|
|
59
59
|
}
|
|
60
60
|
/**
|
|
61
61
|
* Sets the active step.
|
|
@@ -120,7 +120,7 @@ __decorateClass([
|
|
|
120
120
|
watch("notInteractive")
|
|
121
121
|
], SdStepGroup.prototype, "handleInteractivityChange", 1);
|
|
122
122
|
SdStepGroup = __decorateClass([
|
|
123
|
-
customElement("sd-5-15-
|
|
123
|
+
customElement("sd-5-15-1-step-group")
|
|
124
124
|
], SdStepGroup);
|
|
125
125
|
|
|
126
126
|
export {
|
|
@@ -208,7 +208,7 @@ __decorateClass([
|
|
|
208
208
|
watch("playbackRate")
|
|
209
209
|
], SdAnimation.prototype, "handlePlaybackRateChange", 1);
|
|
210
210
|
SdAnimation = __decorateClass([
|
|
211
|
-
customElement("sd-5-15-
|
|
211
|
+
customElement("sd-5-15-1-animation")
|
|
212
212
|
], SdAnimation);
|
|
213
213
|
|
|
214
214
|
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-5-15-
|
|
63
|
+
this.slides = this.getElementsByTagName("sd-5-15-1-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();
|
|
@@ -433,7 +433,7 @@ var SdCarousel = class extends SolidElement {
|
|
|
433
433
|
)}" aria-label="${this.localize.term("previousSlide")}" aria-controls="scroll-container" aria-disabled="${prevEnabled ? "false" : "true"}" @focus="${this.handleFocus}" @blur="${this.handleBlur}" @click="${prevEnabled ? (e) => {
|
|
434
434
|
this.previous();
|
|
435
435
|
this.unblockAutoplay(e, this.previousButton);
|
|
436
|
-
} : null}"><slot name="previous-icon"><sd-5-15-
|
|
436
|
+
} : null}"><slot name="previous-icon"><sd-5-15-1-icon class="${cx("h-6 w-6 rotate-90 grid place-items-center")}" library="_internal" name="${isLtr ? "chevron-down" : "chevron-up"}"></sd-5-15-1-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) => {
|
|
437
437
|
const isActive = index + 1 === currentPage;
|
|
438
438
|
return html`<button part="pagination-item ${isActive ? "pagination-item--active" : ""}" class="${cx(
|
|
439
439
|
"carousel__pagination-item",
|
|
@@ -456,7 +456,7 @@ var SdCarousel = class extends SolidElement {
|
|
|
456
456
|
)}" aria-label="${this.localize.term("nextSlide")}" aria-controls="scroll-container" aria-disabled="${nextEnabled ? "false" : "true"}" @focus="${this.handleFocus}" @blur="${this.handleBlur}" @click="${nextEnabled ? (e) => {
|
|
457
457
|
this.next();
|
|
458
458
|
this.unblockAutoplay(e, this.nextButton);
|
|
459
|
-
} : null}"><slot name="next-icon"><sd-5-15-
|
|
459
|
+
} : null}"><slot name="next-icon"><sd-5-15-1-icon class="${cx("h-6 w-6 rotate-90 grid place-items-center")}" library="_internal" name="${isLtr ? "chevron-up" : "chevron-down"}"></sd-5-15-1-icon></slot></button></div><button class="${cx(
|
|
460
460
|
"ml-6 !rounded-sm",
|
|
461
461
|
"!absolute !right-0 sd-interactive",
|
|
462
462
|
this.inverted ? "sd-interactive--inverted" : "sd-interactive--reset",
|
|
@@ -466,12 +466,12 @@ var SdCarousel = class extends SolidElement {
|
|
|
466
466
|
if (e.detail) {
|
|
467
467
|
this.autoplayControls.blur();
|
|
468
468
|
}
|
|
469
|
-
}}"><slot name="autoplay-start" class="${cx(!this.pausedAutoplay ? "hidden" : "")}"><sd-5-15-
|
|
469
|
+
}}"><slot name="autoplay-start" class="${cx(!this.pausedAutoplay ? "hidden" : "")}"><sd-5-15-1-icon class="h-6 w-6 grid place-items-center" library="_internal" name="start"></sd-5-15-1-icon></slot><slot name="autoplay-pause" class="${cx(this.pausedAutoplay ? "hidden" : "")}"><sd-5-15-1-icon class="h-6 w-6 grid place-items-center" library="_internal" name="pause"></sd-5-15-1-icon></slot></button></div></div>`;
|
|
470
470
|
}
|
|
471
471
|
};
|
|
472
472
|
SdCarousel.styles = [
|
|
473
473
|
...SolidElement.styles,
|
|
474
|
-
css`: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));-moz-column-gap:var(--slide-gap);column-gap:var(--slide-gap);grid-auto-columns:var(--slide-size);padding-inline:var(--scroll-hint);scroll-padding-inline:var(--scroll-hint)}.carousel__slides::-webkit-scrollbar{display:none}:host([fade]){--carousel-height:auto}:host([fade]) .carousel__slides{display:block;height:var(--carousel-height);overflow:hidden;position:relative}@media (prefers-reduced-motion){:where(.carousel__slides){scroll-behavior:auto}}.carousel__navigation{grid-area:navigation}sd-5-15-
|
|
474
|
+
css`: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));-moz-column-gap:var(--slide-gap);column-gap:var(--slide-gap);grid-auto-columns:var(--slide-size);padding-inline:var(--scroll-hint);scroll-padding-inline:var(--scroll-hint)}.carousel__slides::-webkit-scrollbar{display:none}:host([fade]){--carousel-height:auto}:host([fade]) .carousel__slides{display:block;height:var(--carousel-height);overflow:hidden;position:relative}@media (prefers-reduced-motion){:where(.carousel__slides){scroll-behavior:auto}}.carousel__navigation{grid-area:navigation}sd-5-15-1-button::part(label){align-items:center;display:flex;flex:1 1 auto;pointer-events:none}`
|
|
475
475
|
];
|
|
476
476
|
__decorateClass([
|
|
477
477
|
query('[part~="autoplay-controls"]')
|
|
@@ -544,7 +544,7 @@ __decorateClass([
|
|
|
544
544
|
watch("autoplay")
|
|
545
545
|
], SdCarousel.prototype, "handleAutoplayChange", 1);
|
|
546
546
|
SdCarousel = __decorateClass([
|
|
547
|
-
customElement("sd-5-15-
|
|
547
|
+
customElement("sd-5-15-1-carousel")
|
|
548
548
|
], SdCarousel);
|
|
549
549
|
|
|
550
550
|
export {
|
|
@@ -97,7 +97,7 @@ var SdMenu = class extends SolidElement {
|
|
|
97
97
|
}
|
|
98
98
|
isMenuItem(item) {
|
|
99
99
|
var _a;
|
|
100
|
-
return item.tagName.toLowerCase() === "sd-5-15-
|
|
100
|
+
return item.tagName.toLowerCase() === "sd-5-15-1-menu-item" || ["menuitem", "menuitemcheckbox", "menuitemradio"].includes((_a = item.getAttribute("role")) != null ? _a : "");
|
|
101
101
|
}
|
|
102
102
|
/** @internal Gets all slotted menu items, ignoring dividers, headers, and other elements. */
|
|
103
103
|
getAllItems() {
|
|
@@ -131,13 +131,13 @@ var SdMenu = class extends SolidElement {
|
|
|
131
131
|
};
|
|
132
132
|
SdMenu.styles = [
|
|
133
133
|
...SolidElement.styles,
|
|
134
|
-
css`:host{border-radius:var(--sd-border-radius-md,.375rem);display:block;overflow:auto;overscroll-behavior:auto;padding:var(--sd-spacing-3,.75rem) var(--sd-spacing-2,.5rem);position:relative;--tw-shadow:var(--sd-shadow,0px 1px 3px 0px rgba(81,81,81,.75))!important;--tw-shadow-colored:0px 1px 3px 0px var(--tw-shadow-color)!important;box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)!important}::slotted(sd-5-15-
|
|
134
|
+
css`:host{border-radius:var(--sd-border-radius-md,.375rem);display:block;overflow:auto;overscroll-behavior:auto;padding:var(--sd-spacing-3,.75rem) var(--sd-spacing-2,.5rem);position:relative;--tw-shadow:var(--sd-shadow,0px 1px 3px 0px rgba(81,81,81,.75))!important;--tw-shadow-colored:0px 1px 3px 0px var(--tw-shadow-color)!important;box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)!important}::slotted(sd-5-15-1-divider){padding-bottom:var(--sd-spacing-3,.75rem);padding-top:var(--sd-spacing-3,.75rem)}`
|
|
135
135
|
];
|
|
136
136
|
__decorateClass([
|
|
137
137
|
query("slot")
|
|
138
138
|
], SdMenu.prototype, "defaultSlot", 2);
|
|
139
139
|
SdMenu = __decorateClass([
|
|
140
|
-
customElement("sd-5-15-
|
|
140
|
+
customElement("sd-5-15-1-menu")
|
|
141
141
|
], SdMenu);
|
|
142
142
|
|
|
143
143
|
export {
|
|
@@ -118,7 +118,7 @@ var SdCheckbox = class extends SolidElement {
|
|
|
118
118
|
render() {
|
|
119
119
|
const checkboxState = this.disabled && this.indeterminate ? "disabledIndeterminate" : this.disabled && this.checked ? "disabledChecked" : this.disabled ? "disabled" : this.visuallyDisabled ? "visuallyDisabled" : this.showInvalidStyle && this.indeterminate ? "invalidIndeterminate" : this.showInvalidStyle ? "invalid" : this.checked || this.indeterminate ? "filled" : "default";
|
|
120
120
|
return html`<label part="base" class="${cx(
|
|
121
|
-
"sd-5-15-
|
|
121
|
+
"sd-5-15-1-checkbox group flex items-start text-base leading-normal text-black cursor-pointer",
|
|
122
122
|
(this.disabled || this.visuallyDisabled) && "hover:cursor-not-allowed",
|
|
123
123
|
{
|
|
124
124
|
/* sizes, fonts */
|
|
@@ -157,7 +157,7 @@ var SdCheckbox = class extends SolidElement {
|
|
|
157
157
|
filled: "bg-accent group-hover:bg-accent-550",
|
|
158
158
|
default: "hover:bg-neutral-200 group-hover:bg-neutral-200 bg-white"
|
|
159
159
|
}[checkboxState]
|
|
160
|
-
)}"></div></div>${this.checked ? html`<sd-5-15-
|
|
160
|
+
)}"></div></div>${this.checked ? html`<sd-5-15-1-icon part="checked-icon" class="text-white w-3 h-3" library="_internal" name="status-check"></sd-5-15-1-icon>` : ""} ${!this.checked && this.indeterminate ? html`<sd-5-15-1-icon part="indeterminate-icon" class="text-white w-3 h-3" library="_internal" name="status-minus"></sd-5-15-1-icon>` : ""} </span><span part="label" id="label" class="${cx(
|
|
161
161
|
"select-none inline-block ml-2",
|
|
162
162
|
this.disabled || this.visuallyDisabled ? "text-neutral-500" : this.showInvalidStyle ? "text-error" : "text-black"
|
|
163
163
|
)}"><slot></slot></span></label> ${this.formControlController.renderInvalidMessage()}`;
|
|
@@ -219,7 +219,7 @@ __decorateClass([
|
|
|
219
219
|
watch(["checked", "indeterminate"], { waitUntilFirstUpdate: true })
|
|
220
220
|
], SdCheckbox.prototype, "handleStateChange", 1);
|
|
221
221
|
SdCheckbox = __decorateClass([
|
|
222
|
-
customElement("sd-5-15-
|
|
222
|
+
customElement("sd-5-15-1-checkbox")
|
|
223
223
|
], SdCheckbox);
|
|
224
224
|
|
|
225
225
|
export {
|