@solid-design-system/components 6.25.0 → 6.25.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/custom-elements.json +1 -1
- package/cdn/web-types.json +1 -1
- package/cdn-versioned/chunks/chunk.2FRV4JI3.js +1 -1
- package/cdn-versioned/chunks/chunk.2TCDQYYC.js +2 -2
- package/cdn-versioned/chunks/chunk.32WSNOK5.js +2 -2
- package/cdn-versioned/chunks/chunk.36LY3DX3.js +2 -2
- package/cdn-versioned/chunks/chunk.3FXWTJNG.js +2 -2
- package/cdn-versioned/chunks/chunk.3HJR4W7S.js +2 -2
- package/cdn-versioned/chunks/chunk.3NV5EFHF.js +9 -9
- package/cdn-versioned/chunks/chunk.4PBTCGFX.js +2 -2
- package/cdn-versioned/chunks/chunk.4TEHVEJ5.js +2 -2
- package/cdn-versioned/chunks/chunk.5B4C742P.js +2 -2
- package/cdn-versioned/chunks/chunk.5D2QLOPO.js +2 -2
- package/cdn-versioned/chunks/chunk.5LQXIFL5.js +1 -1
- package/cdn-versioned/chunks/chunk.6ZVU7R22.js +2 -2
- package/cdn-versioned/chunks/chunk.7EYPTWOC.js +2 -2
- package/cdn-versioned/chunks/chunk.A3QRJ5ME.js +2 -2
- package/cdn-versioned/chunks/chunk.BJGMSYKC.js +1 -1
- package/cdn-versioned/chunks/chunk.BMOWDQOV.js +2 -2
- package/cdn-versioned/chunks/chunk.BS3GML7W.js +3 -3
- package/cdn-versioned/chunks/chunk.CIRCXXWS.js +2 -2
- package/cdn-versioned/chunks/chunk.CPEHJK3R.js +1 -1
- package/cdn-versioned/chunks/chunk.D4KX4Q6E.js +2 -2
- package/cdn-versioned/chunks/chunk.DSKB3SEU.js +1 -1
- package/cdn-versioned/chunks/chunk.E3RBLJOD.js +2 -2
- package/cdn-versioned/chunks/chunk.EDVI5WKO.js +3 -3
- package/cdn-versioned/chunks/chunk.FK2QE2LJ.js +2 -2
- package/cdn-versioned/chunks/chunk.GCCUJ5RI.js +3 -3
- package/cdn-versioned/chunks/chunk.GICLEIQR.js +1 -1
- package/cdn-versioned/chunks/chunk.GNQ2AH6R.js +5 -5
- package/cdn-versioned/chunks/chunk.GWINLIF6.js +2 -2
- package/cdn-versioned/chunks/chunk.HA4FSESN.js +2 -2
- package/cdn-versioned/chunks/chunk.ISEX6JDK.js +2 -2
- package/cdn-versioned/chunks/chunk.IXCKRXZP.js +2 -2
- package/cdn-versioned/chunks/chunk.KJ4O2AAU.js +2 -2
- package/cdn-versioned/chunks/chunk.KQBMEX4Q.js +2 -2
- package/cdn-versioned/chunks/chunk.L7DV2MLH.js +1 -1
- package/cdn-versioned/chunks/chunk.LVX7YSFZ.js +2 -2
- package/cdn-versioned/chunks/chunk.LWNOAXVZ.js +2 -2
- package/cdn-versioned/chunks/chunk.LZRL7OLU.js +1 -1
- package/cdn-versioned/chunks/chunk.MXPGGLKX.js +2 -2
- package/cdn-versioned/chunks/chunk.NXUXZCC5.js +1 -1
- package/cdn-versioned/chunks/chunk.OFQAFMQN.js +2 -2
- package/cdn-versioned/chunks/chunk.OJN4DDNN.js +2 -2
- package/cdn-versioned/chunks/chunk.OW556SXG.js +2 -2
- package/cdn-versioned/chunks/chunk.P4GZNPGK.js +1 -1
- package/cdn-versioned/chunks/chunk.PQIUYCLY.js +2 -2
- package/cdn-versioned/chunks/chunk.PZSKPF3M.js +2 -2
- package/cdn-versioned/chunks/chunk.R3CFPFL7.js +2 -2
- package/cdn-versioned/chunks/chunk.RJ7RNCAD.js +2 -2
- package/cdn-versioned/chunks/chunk.SK3BEBJX.js +2 -2
- package/cdn-versioned/chunks/chunk.SW3IDYJO.js +1 -1
- package/cdn-versioned/chunks/chunk.TNHTS2QZ.js +2 -2
- package/cdn-versioned/chunks/chunk.TQXBNN2G.js +2 -2
- package/cdn-versioned/chunks/chunk.TTYJJ4T5.js +2 -2
- package/cdn-versioned/chunks/chunk.TYVGKCJX.js +2 -2
- package/cdn-versioned/chunks/chunk.U2Q5EORY.js +2 -2
- package/cdn-versioned/chunks/chunk.VMZSSKC5.js +1 -1
- package/cdn-versioned/chunks/chunk.VSRBSS6K.js +2 -2
- package/cdn-versioned/chunks/chunk.W7A3TU2Z.js +1 -1
- package/cdn-versioned/chunks/chunk.WB2ATZAO.js +5 -5
- package/cdn-versioned/chunks/chunk.XND4CVBN.js +2 -2
- package/cdn-versioned/chunks/chunk.XQ2AM7JO.js +2 -2
- package/cdn-versioned/chunks/chunk.YDZ7FOAV.js +2 -2
- package/cdn-versioned/chunks/chunk.YGYXL3BZ.js +2 -2
- package/cdn-versioned/chunks/chunk.ZC3U3HHB.js +2 -2
- package/cdn-versioned/chunks/chunk.ZFTFC2P4.js +2 -2
- package/cdn-versioned/components/accordion/accordion.d.ts +1 -1
- package/cdn-versioned/components/accordion-group/accordion-group.d.ts +1 -1
- package/cdn-versioned/components/animation/animation.d.ts +1 -1
- package/cdn-versioned/components/audio/audio.d.ts +1 -1
- package/cdn-versioned/components/badge/badge.d.ts +1 -1
- package/cdn-versioned/components/brandshape/brandshape.d.ts +1 -1
- package/cdn-versioned/components/breadcrumb/breadcrumb.d.ts +1 -1
- package/cdn-versioned/components/breadcrumb-item/breadcrumb-item.d.ts +1 -1
- package/cdn-versioned/components/button/button.d.ts +1 -1
- package/cdn-versioned/components/button-group/button-group.d.ts +1 -1
- package/cdn-versioned/components/carousel/carousel.d.ts +1 -1
- package/cdn-versioned/components/carousel-item/carousel-item.d.ts +1 -1
- package/cdn-versioned/components/checkbox/checkbox.d.ts +1 -1
- package/cdn-versioned/components/checkbox-group/checkbox-group.d.ts +1 -1
- package/cdn-versioned/components/combobox/combobox.d.ts +1 -1
- package/cdn-versioned/components/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/progress-bar/progress-bar.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 +253 -253
- package/cdn-versioned/internal/form.js +2 -2
- package/cdn-versioned/solid-components.bundle.js +81 -81
- package/cdn-versioned/solid-components.css +2 -2
- package/cdn-versioned/solid-components.iife.js +81 -81
- package/cdn-versioned/vscode.html-custom-data.json +109 -109
- package/cdn-versioned/web-types.json +165 -165
- package/dist/custom-elements.json +1 -1
- package/dist/web-types.json +1 -1
- package/dist-versioned/chunks/chunk.2KU6UVWZ.js +2 -2
- package/dist-versioned/chunks/chunk.2N4PQ34O.js +11 -11
- package/dist-versioned/chunks/chunk.4F4N3QQ6.js +4 -4
- package/dist-versioned/chunks/chunk.4QZT4Y6W.js +3 -3
- package/dist-versioned/chunks/chunk.4SNDWIKF.js +2 -2
- package/dist-versioned/chunks/chunk.5XP6OIKT.js +3 -3
- package/dist-versioned/chunks/chunk.6DDIBH76.js +14 -14
- package/dist-versioned/chunks/chunk.6MMNEOUE.js +2 -2
- package/dist-versioned/chunks/chunk.6V7SKGRY.js +4 -4
- package/dist-versioned/chunks/chunk.AIG5N2FZ.js +1 -1
- package/dist-versioned/chunks/chunk.AXZSMHWW.js +4 -4
- package/dist-versioned/chunks/chunk.BCZIRWVM.js +3 -3
- package/dist-versioned/chunks/chunk.BIYQLL42.js +11 -11
- package/dist-versioned/chunks/chunk.BVWAKEFC.js +1 -1
- package/dist-versioned/chunks/chunk.C3WIBDGG.js +2 -2
- package/dist-versioned/chunks/chunk.CTVKYPFB.js +5 -5
- package/dist-versioned/chunks/chunk.D3CLWL6Z.js +13 -13
- package/dist-versioned/chunks/chunk.D6W4R7CF.js +12 -12
- package/dist-versioned/chunks/chunk.DDBIUIIK.js +6 -6
- package/dist-versioned/chunks/chunk.DGV5QTN6.js +5 -5
- package/dist-versioned/chunks/chunk.EAJ3CM6N.js +4 -4
- package/dist-versioned/chunks/chunk.EHIUARAT.js +2 -2
- package/dist-versioned/chunks/chunk.EIHPDMVS.js +5 -5
- package/dist-versioned/chunks/chunk.EYTDOBZ4.js +6 -6
- package/dist-versioned/chunks/chunk.FMLTJI4Z.js +7 -7
- package/dist-versioned/chunks/chunk.FWMPHWGG.js +10 -10
- package/dist-versioned/chunks/chunk.G5PJCSSV.js +7 -7
- package/dist-versioned/chunks/chunk.GAQZ5NES.js +5 -5
- package/dist-versioned/chunks/chunk.GQ4ENMDG.js +10 -10
- package/dist-versioned/chunks/chunk.GUTW4VQD.js +5 -5
- package/dist-versioned/chunks/chunk.GUWNLJ7W.js +25 -25
- package/dist-versioned/chunks/chunk.JHGRQU5N.js +6 -6
- package/dist-versioned/chunks/chunk.JHHNBCX5.js +10 -10
- package/dist-versioned/chunks/chunk.JYUKVPUJ.js +1 -1
- package/dist-versioned/chunks/chunk.KEJFWGZI.js +4 -4
- package/dist-versioned/chunks/chunk.KEUBCTKM.js +8 -8
- package/dist-versioned/chunks/chunk.KGQHJROJ.js +3 -3
- package/dist-versioned/chunks/chunk.LKDQ3TXG.js +2 -2
- package/dist-versioned/chunks/chunk.LMXGFI7F.js +11 -11
- package/dist-versioned/chunks/chunk.M52SSKFL.js +10 -10
- package/dist-versioned/chunks/chunk.MUOLK3RU.js +33 -33
- package/dist-versioned/chunks/chunk.N7WMSLKA.js +1 -1
- package/dist-versioned/chunks/chunk.NIKLDQ35.js +2 -2
- package/dist-versioned/chunks/chunk.NNMBBWIU.js +2 -2
- package/dist-versioned/chunks/chunk.OXCSSHRT.js +10 -10
- package/dist-versioned/chunks/chunk.P7RNSWL3.js +1 -1
- package/dist-versioned/chunks/chunk.QWPXBE3R.js +3 -3
- package/dist-versioned/chunks/chunk.R3ZRRK4P.js +4 -4
- package/dist-versioned/chunks/chunk.R6M52RPI.js +5 -5
- package/dist-versioned/chunks/chunk.RQN4WSFL.js +5 -5
- package/dist-versioned/chunks/chunk.RWGWOZ23.js +1 -1
- package/dist-versioned/chunks/chunk.SLLHUOTL.js +2 -2
- package/dist-versioned/chunks/chunk.SUQL6D3H.js +5 -5
- package/dist-versioned/chunks/chunk.TEHKQWUZ.js +6 -6
- package/dist-versioned/chunks/chunk.TEHS57B5.js +2 -2
- package/dist-versioned/chunks/chunk.TRG462TJ.js +1 -1
- package/dist-versioned/chunks/chunk.UIQBHPD3.js +2 -2
- package/dist-versioned/chunks/chunk.WASJNAOH.js +25 -25
- package/dist-versioned/chunks/chunk.XFU4IJSC.js +5 -5
- package/dist-versioned/chunks/chunk.XRYVTNMS.js +3 -3
- package/dist-versioned/chunks/chunk.YEO5QKA7.js +2 -2
- package/dist-versioned/chunks/chunk.YNVPCLKL.js +5 -5
- package/dist-versioned/chunks/chunk.YSZ7WBON.js +1 -1
- package/dist-versioned/chunks/chunk.ZCOV36IT.js +2 -2
- package/dist-versioned/chunks/chunk.ZF4JCUFV.js +6 -6
- 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/progress-bar/progress-bar.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 +253 -253
- package/dist-versioned/internal/form.js +2 -2
- package/dist-versioned/solid-components.css +2 -2
- package/dist-versioned/vscode.html-custom-data.json +109 -109
- package/dist-versioned/web-types.json +165 -165
- package/package.json +1 -1
|
@@ -1245,7 +1245,7 @@ var SdDatepicker = class extends SolidElement {
|
|
|
1245
1245
|
this.open ? "block shadow-listbox" : "hidden",
|
|
1246
1246
|
((_b = this.currentPlacement) == null ? void 0 : _b.startsWith("bottom")) ? "border-r-2 border-b-2 border-l-2 form-control__listbox-border-bottom-right-radius form-control__listbox-border-bottom-left-radius" : "border-r-2 border-t-2 border-l-2 form-control__listbox-border-top-right-radius form-control__listbox-border-top-left-radius",
|
|
1247
1247
|
"border-primary"
|
|
1248
|
-
)}"><div class="flex flex-row items-center w-full justify-between mb-3" part="header"><div class="flex items-center"><button type="button" tabindex="0" class="nav prev w-6 h-6 hover:cursor-pointer sd-interactive" part="prev-year-button" @click="${() => this.setYear(-1)}" @keydown="${(ev) => this.handleHeaderKeyDown(ev, "year", -1, false)}" aria-label="${this.localize.term("previousYear")}"><sd-6-25-
|
|
1248
|
+
)}"><div class="flex flex-row items-center w-full justify-between mb-3" part="header"><div class="flex items-center"><button type="button" tabindex="0" class="nav prev w-6 h-6 hover:cursor-pointer sd-interactive" part="prev-year-button" @click="${() => this.setYear(-1)}" @keydown="${(ev) => this.handleHeaderKeyDown(ev, "year", -1, false)}" aria-label="${this.localize.term("previousYear")}"><sd-6-25-1-icon library="_internal" name="chevrons-sm-left" class="h-6 w-6"></sd-6-25-1-icon></button> <button type="button" tabindex="0" class="nav prev w-6 h-6 hover:cursor-pointer sd-interactive" part="prev-month-button" @click="${() => this.setMonth(-1)}" @keydown="${(ev) => this.handleHeaderKeyDown(ev, "month", -1, false)}" aria-label="${this.localize.term("previousMonth")}"><sd-6-25-1-icon library="_internal" name="chevron-sm-left" class="h-6 w-6"></sd-6-25-1-icon></button></div><div tabindex="-1" class="month-label flex justify-center sd-headline sd-headline--size-base" part="month-label" aria-live="polite">${monthLabel}</div><div class="flex items-center"><button type="button" tabindex="0" class="nav next w-6 h-6 hover:cursor-pointer sd-interactive" part="next-month-button" @click="${() => this.setMonth(1)}" @keydown="${(ev) => this.handleHeaderKeyDown(ev, "month", 1, false)}" aria-label="${this.localize.term("nextMonth")}"><sd-6-25-1-icon library="_internal" name="chevron-sm-right" class="h-6 w-6"></sd-6-25-1-icon></button> <button type="button" tabindex="0" class="nav next w-6 h-6 hover:cursor-pointer sd-interactive" part="next-year-button" @click="${() => this.setYear(1)}" @keydown="${(ev) => this.handleHeaderKeyDown(ev, "year", 1, true)}" aria-label="${this.localize.term("nextYear")}"><sd-6-25-1-icon library="_internal" name="chevrons-sm-right" class="h-6 w-6"></sd-6-25-1-icon></button></div></div><sd-6-25-1-divider></sd-6-25-1-divider><div class="sr-only" aria-live="polite" aria-atomic="true">${this.statusNavText}</div><div class="sr-only" aria-live="assertive" aria-atomic="true">${this.statusSelectText}</div><div class="sr-only" id="keyboard-hint">${this.localize.term("datePickerInfo")}</div><div class="grid mt-2" role="grid" aria-describedby="keyboard-hint" aria-label="${monthLabel}" part="grid" @mouseleave="${this.onGridMouseLeave}" @focusin="${() => {
|
|
1249
1249
|
this.tabbingIntoGrid = false;
|
|
1250
1250
|
}}"><div class="grid-row grid-head grid grid-cols-7 gap-y-[1px]" role="row">${weekdays.map(
|
|
1251
1251
|
(w, colIndex) => html`<div role="columnheader" aria-colindex="${colIndex + 1}" part="weekday" class="cell head flex items-center justify-center font-bold text-black text-sm leading-none h-8" aria-label="${w}" title="${w}" id="${"col-" + (colIndex + 1)}">${w}</div>`
|
|
@@ -1278,14 +1278,14 @@ var SdDatepicker = class extends SolidElement {
|
|
|
1278
1278
|
return html`<button type="button" part="day" class="${cx(
|
|
1279
1279
|
"cell day flex items-center justify-center focus-visible:outline focus:outline-2 focus:outline-primary -outline-offset-2 rounded w-[36px]",
|
|
1280
1280
|
this.size === "sm" ? "text-sm h-6" : "text-base h-8",
|
|
1281
|
-
isRangeStart || isRangeEnd ? !isFocused ? "outline-none sd-6-25-
|
|
1282
|
-
!isRangeStart && !isRangeEnd && !inSelectedRange && "hover:sd-6-25-
|
|
1283
|
-
isSelectedSingle ? "selected outline-none border-primary sd-6-25-
|
|
1281
|
+
isRangeStart || isRangeEnd ? !isFocused ? "outline-none sd-6-25-1-datepicker__date-item--selected-color-background sd-6-25-1-datepicker__date-item--selected-color-text hover:sd-6-25-1-datepicker__date-item--selected--hover-color-background hover:sd-6-25-1-datepicker__date-item--selected--hover-color-text" : "outline-none sd-6-25-1-datepicker__date-item--selected--hover-color-background sd-6-25-1-datepicker__date-item--selected--hover-color-text" : "hover:sd-6-25-1-datepicker__date-item--hover--default-color-text",
|
|
1282
|
+
!isRangeStart && !isRangeEnd && !inSelectedRange && "hover:sd-6-25-1-datepicker__date-item--hover--default-color-background",
|
|
1283
|
+
isSelectedSingle ? "selected outline-none border-primary sd-6-25-1-datepicker__date-item--selected-color-background sd-6-25-1-datepicker__date-item--selected-color-text hover:sd-6-25-1-datepicker__date-item--selected--hover-color-text hover:sd-6-25-1-datepicker__date-item--selected--hover-color-background" : !inMonth ? this.disabledWeekends && isWeekendDay ? "out-month weekend-day text-neutral-500" : isWeekendDay ? "out-month weekend-day text-neutral-700" : "out-month text-neutral-700 hover:sd-6-25-1-datepicker__date-item--hover--prev-next-color-text hover:sd-6-25-1-datepicker__date-item--hover--prev-next-color-background" : this.isInDisabledDates(day) || !this.inMinMax(day) ? "out-month text-neutral-500" : this.disabledWeekends && isWeekendDay ? "weekend-day text-neutral-500" : "in-month sd-6-25-1-datepicker__date-item--default-color-text",
|
|
1284
1284
|
isRangeStart ? "rounded-l-md rounded-r-none" : "",
|
|
1285
1285
|
isRangeEnd ? "range-end rounded-r-md rounded-l-none" : "",
|
|
1286
|
-
inSelectedRange && !isRangeStart && !isRangeEnd ? "in-range selected sd-6-25-
|
|
1286
|
+
inSelectedRange && !isRangeStart && !isRangeEnd ? "in-range selected sd-6-25-1-datepicker__date-item--range-color-background rounded-none hover:sd-6-25-1-datepicker__date-item--selected--hover-color-background hover:sd-6-25-1-datepicker__date-item--selected--hover-color-text" : "",
|
|
1287
1287
|
!inSelectedRange && inPreviewRange && !isRangeStart && !isRangeEnd ? "in-preview-range bg-primary-100 text-primary-500 rounded-none" : "",
|
|
1288
|
-
isToday && !isSelectedSingle && !isRangeStart && !isRangeEnd && isFocused ? "today border-[1px] border-primary sd-6-25-
|
|
1288
|
+
isToday && !isSelectedSingle && !isRangeStart && !isRangeEnd && isFocused ? "today border-[1px] border-primary sd-6-25-1-datepicker__date-item--current-font-weight" : "",
|
|
1289
1289
|
disabled ? "disabled cursor-not-allowed hover:bg-transparent" : "cursor-pointer",
|
|
1290
1290
|
isFocused && !isToday ? "focused outline outline-2 outline-primary" : ""
|
|
1291
1291
|
)}" role="gridcell" aria-colindex="${colIndex + 1}" aria-labelledby="${"col-" + (colIndex + 1)}" .tabIndex="${tabIndex}" ?disabled="${disabled || this.disabled || this.readonly}" aria-disabled="${disabled || this.visuallyDisabled || this.disabled || this.readonly ? "true" : "false"}" aria-selected="${isSelectedSingle || inSelectedRange || isRangeStart || isRangeEnd ? "true" : "false"}" aria-current="${isToday ? "date" : nothing}" aria-label="${label}" aria-roledescription="${roleDesc != null ? roleDesc : nothing}" @focus="${() => this.focusedDate = DateUtils.startOfDayLocal(day)}" @mouseenter="${() => this.onDayMouseEnter(day)}" @keydown="${this.onKeyDown}" @click="${() => {
|
|
@@ -1347,7 +1347,7 @@ var SdDatepicker = class extends SolidElement {
|
|
|
1347
1347
|
"absolute top-0 w-full h-full pointer-events-none border form-control-border-radius z-10 transition-[border] duration-medium ease-in-out",
|
|
1348
1348
|
borderColor,
|
|
1349
1349
|
this.open && (((_a = this.currentPlacement) == null ? void 0 : _a.startsWith("bottom")) ? this.open && this.alignment === "left" ? "rounded-bl-none" : "rounded-br-none" : this.open && this.alignment === "left" ? "rounded-tl-none" : "rounded-tr-none")
|
|
1350
|
-
)}"></div><sd-6-25-
|
|
1350
|
+
)}"></div><sd-6-25-1-popup @sd-current-placement="${this.handleCurrentPlacement}" class="${cx(
|
|
1351
1351
|
"inline-flex relative w-full",
|
|
1352
1352
|
((_b = this.currentPlacement) == null ? void 0 : _b.startsWith("bottom")) ? "origin-top" : "origin-bottom"
|
|
1353
1353
|
)}" placement="${this.alignment === "left" ? `${this.placement}-start` : `${this.placement}-end`}" flip shift auto-size="vertical" auto-size-padding="10" exportparts="popup:popup__content,"><div part="base" class="${cx(
|
|
@@ -1363,7 +1363,7 @@ var SdDatepicker = class extends SolidElement {
|
|
|
1363
1363
|
{ sm: "h-8", md: "h-10", lg: "h-12" }[this.size],
|
|
1364
1364
|
textSize,
|
|
1365
1365
|
this.floatingLabel && "mt-4"
|
|
1366
|
-
)}" autocomplete="off" spellcheck="false" placeholder="${!this.floatingLabel || isFloatingLabelActive ? this.placeholder || this.localize.term(this.range ? "dateRangePlaceholder" : "datePlaceholder") : ""}" ?disabled="${this.disabled}" ?required="${this.required}" ?readonly="${this.readonly || this.visuallyDisabled}" @input="${this.handleInput}" @click="${this.handleMouseDown}" @keydown="${this.handleInputKeyDown}" @focus="${this.handleFocus}" @blur="${this.handleInputBlur}" @invalid="${this.handleInvalid}"> ${this.showInvalidStyle ? html`<sd-6-25-
|
|
1366
|
+
)}" autocomplete="off" spellcheck="false" placeholder="${!this.floatingLabel || isFloatingLabelActive ? this.placeholder || this.localize.term(this.range ? "dateRangePlaceholder" : "datePlaceholder") : ""}" ?disabled="${this.disabled}" ?required="${this.required}" ?readonly="${this.readonly || this.visuallyDisabled}" @input="${this.handleInput}" @click="${this.handleMouseDown}" @keydown="${this.handleInputKeyDown}" @focus="${this.handleFocus}" @blur="${this.handleInputBlur}" @invalid="${this.handleInvalid}"> ${this.showInvalidStyle ? html`<sd-6-25-1-icon part="invalid-icon" class="${cx("text-error", iconMarginLeft, iconSize)}" library="_internal" name="risk"></sd-6-25-1-icon>` : ""} ${this.showValidStyle && this.styleOnValid ? html`<sd-6-25-1-icon class="${cx("text-success shrink-0", iconMarginLeft, iconSize)}" library="_internal" name="confirm-circle" part="valid-icon"></sd-6-25-1-icon>` : ""}<sd-6-25-1-icon class="${cx(iconColor, iconMarginLeft, iconSize, "hover:cursor-pointer")}" library="_internal" name="calendar" @click="${this.show}"></sd-6-25-1-icon></div>${this.renderCalendar()}</sd-6-25-1-popup></div><slot name="help-text" part="form-control-help-text" id="help-text" class="${cx(
|
|
1367
1367
|
"text-sm mt-1",
|
|
1368
1368
|
hasHelpText ? "block" : "hidden",
|
|
1369
1369
|
this.visuallyDisabled || this.disabled ? "text-neutral-500" : "text-neutral-700"
|
|
@@ -1493,7 +1493,7 @@ __decorateClass([
|
|
|
1493
1493
|
state()
|
|
1494
1494
|
], SdDatepicker.prototype, "inputValue", 2);
|
|
1495
1495
|
__decorateClass([
|
|
1496
|
-
query("sd-6-25-
|
|
1496
|
+
query("sd-6-25-1-popup")
|
|
1497
1497
|
], SdDatepicker.prototype, "popup", 2);
|
|
1498
1498
|
__decorateClass([
|
|
1499
1499
|
query("#invalid-message")
|
|
@@ -1527,7 +1527,7 @@ __decorateClass([
|
|
|
1527
1527
|
watch(["size", "floatingLabel"])
|
|
1528
1528
|
], SdDatepicker.prototype, "handleSizeChange", 1);
|
|
1529
1529
|
SdDatepicker = __decorateClass([
|
|
1530
|
-
customElement("sd-6-25-
|
|
1530
|
+
customElement("sd-6-25-1-datepicker")
|
|
1531
1531
|
], SdDatepicker);
|
|
1532
1532
|
|
|
1533
1533
|
export {
|
|
@@ -84,7 +84,7 @@ var SdRange = class extends SolidElement {
|
|
|
84
84
|
var _a, _b;
|
|
85
85
|
const tooltip = thumb.parentElement;
|
|
86
86
|
await tooltip.updateComplete;
|
|
87
|
-
(_b = (_a = tooltip.shadowRoot) == null ? void 0 : _a.querySelector("sd-6-25-
|
|
87
|
+
(_b = (_a = tooltip.shadowRoot) == null ? void 0 : _a.querySelector("sd-6-25-1-popup")) == null ? void 0 : _b.setAttribute("distance", "14");
|
|
88
88
|
});
|
|
89
89
|
}
|
|
90
90
|
willUpdate(changedProperties) {
|
|
@@ -260,7 +260,7 @@ var SdRange = class extends SolidElement {
|
|
|
260
260
|
_preventTextSelection() {
|
|
261
261
|
if (!this._dragStyleElement) {
|
|
262
262
|
const style = document.createElement("style");
|
|
263
|
-
style.setAttribute("data-sd-6-25-
|
|
263
|
+
style.setAttribute("data-sd-6-25-1-range-drag", "");
|
|
264
264
|
style.textContent = "*, *::before, *::after { user-select: none !important; -webkit-user-select: none !important; }";
|
|
265
265
|
document.head.appendChild(style);
|
|
266
266
|
this._dragStyleElement = style;
|
|
@@ -445,10 +445,10 @@ var SdRange = class extends SolidElement {
|
|
|
445
445
|
ariaLabel = this.tooltipFormatter(value);
|
|
446
446
|
}
|
|
447
447
|
}
|
|
448
|
-
return html`<sd-6-25-
|
|
448
|
+
return html`<sd-6-25-1-tooltip 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}" @keydown="${this.onKeyPress}" @focus="${this.onFocusThumb}" class="${cx(
|
|
449
449
|
"rounded-full absolute top-0 size-4 hover:cursor-grab after:-inset-2",
|
|
450
450
|
this.disabled || this.visuallyDisabled ? "outline-none" : "cursor-pointer focus-visible:focus-outline"
|
|
451
|
-
)}"></div></sd-6-25-
|
|
451
|
+
)}"></div></sd-6-25-1-tooltip>`;
|
|
452
452
|
});
|
|
453
453
|
}
|
|
454
454
|
render() {
|
|
@@ -518,7 +518,7 @@ __decorateClass([
|
|
|
518
518
|
property({ type: String })
|
|
519
519
|
], SdRange.prototype, "value", 1);
|
|
520
520
|
SdRange = __decorateClass([
|
|
521
|
-
customElement("sd-6-25-
|
|
521
|
+
customElement("sd-6-25-1-range")
|
|
522
522
|
], SdRange);
|
|
523
523
|
|
|
524
524
|
export {
|
|
@@ -98,11 +98,11 @@ var SdCombobox = class extends SolidElement {
|
|
|
98
98
|
return normalizedOption.includes(normalizedQuery) || normalizedOptionLabel.includes(normalizedQuery);
|
|
99
99
|
};
|
|
100
100
|
this.getTag = (option) => {
|
|
101
|
-
return html`<sd-6-25-
|
|
101
|
+
return html`<sd-6-25-1-tag class="min-w-0 max-w-full" ?disabled="${this.disabled}" part="tag" exportparts="
|
|
102
102
|
base:tag__base,
|
|
103
103
|
content:tag__content,
|
|
104
104
|
removable-indicator:tag__removable-indicator,
|
|
105
|
-
" size="${this.size === "sm" ? "sm" : "lg"}" removable @keydown="${(event) => this.handleTagKeyDown(event, option)}" @sd-remove="${(event) => this.handleTagRemove(event, option)}">${option.getTextLabel()}</sd-6-25-
|
|
105
|
+
" size="${this.size === "sm" ? "sm" : "lg"}" removable @keydown="${(event) => this.handleTagKeyDown(event, option)}" @sd-remove="${(event) => this.handleTagRemove(event, option)}">${option.getTextLabel()}</sd-6-25-1-tag>`;
|
|
106
106
|
};
|
|
107
107
|
this.handleDocumentFocusIn = (event) => {
|
|
108
108
|
const path = event.composedPath();
|
|
@@ -241,9 +241,9 @@ var SdCombobox = class extends SolidElement {
|
|
|
241
241
|
return html`${typeof optionHtml === "string" ? unsafeHTML(optionHtml) : optionHtml}`;
|
|
242
242
|
};
|
|
243
243
|
return this.filteredOptions.map((item) => {
|
|
244
|
-
if (item.tagName.toLowerCase() === "sd-6-25-
|
|
244
|
+
if (item.tagName.toLowerCase() === "sd-6-25-1-optgroup") {
|
|
245
245
|
Array.from(item.children).forEach((option) => {
|
|
246
|
-
if (option.tagName.toLowerCase() === "sd-6-25-
|
|
246
|
+
if (option.tagName.toLowerCase() === "sd-6-25-1-option") {
|
|
247
247
|
renderOption(option);
|
|
248
248
|
}
|
|
249
249
|
});
|
|
@@ -263,11 +263,11 @@ var SdCombobox = class extends SolidElement {
|
|
|
263
263
|
});
|
|
264
264
|
} else {
|
|
265
265
|
return [
|
|
266
|
-
html`<sd-6-25-
|
|
266
|
+
html`<sd-6-25-1-tag class="min-w-0 max-w-full" ?disabled="${this.disabled}" part="tag" exportparts="
|
|
267
267
|
base:tag__base,
|
|
268
268
|
content:tag__content,
|
|
269
269
|
removable-indicator:tag__removable-indicator,
|
|
270
|
-
" size="${this.size === "sm" ? "sm" : "lg"}" removable @keydown="${(event) => this.handleTagMaxOptionsKeyDown(event)}" @sd-remove="${(event) => this.handleTagRemove(event)}">${this.selectedOptions.length} ${this.localize.term("tagsSelected")}</sd-6-25-
|
|
270
|
+
" size="${this.size === "sm" ? "sm" : "lg"}" removable @keydown="${(event) => this.handleTagMaxOptionsKeyDown(event)}" @sd-remove="${(event) => this.handleTagRemove(event)}">${this.selectedOptions.length} ${this.localize.term("tagsSelected")}</sd-6-25-1-tag>`
|
|
271
271
|
];
|
|
272
272
|
}
|
|
273
273
|
}
|
|
@@ -403,7 +403,7 @@ var SdCombobox = class extends SolidElement {
|
|
|
403
403
|
}
|
|
404
404
|
handleOptionClick(event) {
|
|
405
405
|
const target = event.target;
|
|
406
|
-
const option = target.closest("sd-6-25-
|
|
406
|
+
const option = target.closest("sd-6-25-1-option");
|
|
407
407
|
const oldValue = this.value;
|
|
408
408
|
if (option && !option.disabled) {
|
|
409
409
|
if (this.multiple) {
|
|
@@ -455,7 +455,7 @@ var SdCombobox = class extends SolidElement {
|
|
|
455
455
|
scrollIntoView(this.getCurrentOption(), this.listbox, "vertical", "auto");
|
|
456
456
|
}
|
|
457
457
|
getAllFilteredOptions() {
|
|
458
|
-
return [...this.filteredWrapper.querySelectorAll("sd-6-25-
|
|
458
|
+
return [...this.filteredWrapper.querySelectorAll("sd-6-25-1-option")];
|
|
459
459
|
}
|
|
460
460
|
getCurrentOption() {
|
|
461
461
|
return this.getAllFilteredOptions().find((option) => option.current);
|
|
@@ -585,7 +585,7 @@ var SdCombobox = class extends SolidElement {
|
|
|
585
585
|
clonedOption.selected = option.selected;
|
|
586
586
|
clonedOption.checkbox = option.checkbox;
|
|
587
587
|
clonedOption.size = option.size;
|
|
588
|
-
const hasOptgroup = ((_b = option.parentElement) == null ? void 0 : _b.tagName.toLowerCase()) === "sd-6-25-
|
|
588
|
+
const hasOptgroup = ((_b = option.parentElement) == null ? void 0 : _b.tagName.toLowerCase()) === "sd-6-25-1-optgroup";
|
|
589
589
|
if (!hasOptgroup) {
|
|
590
590
|
return clonedOption;
|
|
591
591
|
}
|
|
@@ -609,7 +609,7 @@ var SdCombobox = class extends SolidElement {
|
|
|
609
609
|
this.formControlController.emitInvalidEvent(event);
|
|
610
610
|
this.invalidMessage.textContent = event.target.validationMessage;
|
|
611
611
|
}
|
|
612
|
-
/** Receives incoming event detail from sd-6-25-
|
|
612
|
+
/** Receives incoming event detail from sd-6-25-1-popup and updates local state for conditional styling. */
|
|
613
613
|
handleCurrentPlacement(e) {
|
|
614
614
|
const incomingPlacement = e.detail;
|
|
615
615
|
if (incomingPlacement) {
|
|
@@ -621,7 +621,7 @@ var SdCombobox = class extends SolidElement {
|
|
|
621
621
|
}
|
|
622
622
|
handleUseTagsChange() {
|
|
623
623
|
const allOptions = this.getAllFilteredOptions();
|
|
624
|
-
if (customElements.get("sd-6-25-
|
|
624
|
+
if (customElements.get("sd-6-25-1-option")) {
|
|
625
625
|
allOptions.forEach((option) => {
|
|
626
626
|
option.checkbox = this.multiple;
|
|
627
627
|
});
|
|
@@ -750,8 +750,8 @@ var SdCombobox = class extends SolidElement {
|
|
|
750
750
|
return filterOnlyOptgroups(getAssignedElementsForSlot(this.defaultSlot));
|
|
751
751
|
}
|
|
752
752
|
async handleDefaultSlotChange() {
|
|
753
|
-
if (!customElements.get("sd-6-25-
|
|
754
|
-
customElements.whenDefined("sd-6-25-
|
|
753
|
+
if (!customElements.get("sd-6-25-1-option")) {
|
|
754
|
+
customElements.whenDefined("sd-6-25-1-option").then(() => this.handleDefaultSlotChange());
|
|
755
755
|
return;
|
|
756
756
|
}
|
|
757
757
|
const slottedOptions = this.getSlottedOptions();
|
|
@@ -763,10 +763,10 @@ var SdCombobox = class extends SolidElement {
|
|
|
763
763
|
if (this.multiple) {
|
|
764
764
|
option.checkbox = true;
|
|
765
765
|
}
|
|
766
|
-
option.id = option.id || `sd-6-25-
|
|
766
|
+
option.id = option.id || `sd-6-25-1-combobox-option-${index}`;
|
|
767
767
|
});
|
|
768
768
|
slottedOptgroups.forEach((optgroup, index) => {
|
|
769
|
-
optgroup.id = optgroup.id || `sd-6-25-
|
|
769
|
+
optgroup.id = optgroup.id || `sd-6-25-1-combobox-optgroup-${index}`;
|
|
770
770
|
});
|
|
771
771
|
await this.syncSelectedOptionsAndValue();
|
|
772
772
|
if (this.multiple) {
|
|
@@ -790,7 +790,7 @@ var SdCombobox = class extends SolidElement {
|
|
|
790
790
|
const isFloatingLabelActive = this.floatingLabel && hasLabel && (this.hasFocus || hasValue);
|
|
791
791
|
const selectState = this.disabled ? "disabled" : this.visuallyDisabled && !this.hasFocus ? "visuallyDisabled" : this.hasFocus && this.showInvalidStyle ? "activeInvalid" : this.hasFocus && this.styleOnValid && this.showValidStyle ? "activeValid" : this.hasFocus || this.open ? "active" : this.showInvalidStyle ? "invalid" : this.styleOnValid && this.showValidStyle ? "valid" : "default";
|
|
792
792
|
const cursorStyles = this.disabled || this.visuallyDisabled ? "cursor-not-allowed" : "cursor-pointer";
|
|
793
|
-
const iconColor = this.disabled || this.visuallyDisabled ? "text-neutral-500" : "sd-6-25-
|
|
793
|
+
const iconColor = this.disabled || this.visuallyDisabled ? "text-neutral-500" : "sd-6-25-1-icon-fill-primary";
|
|
794
794
|
const iconMarginLeft = { sm: "ml-1", md: "ml-2", lg: "ml-2" }[this.size];
|
|
795
795
|
const iconMarginRight = { sm: "mr-1", md: "mr-2", lg: "mr-2" }[this.size];
|
|
796
796
|
const iconSize = {
|
|
@@ -831,7 +831,7 @@ var SdCombobox = class extends SolidElement {
|
|
|
831
831
|
default: "form-control-color-border"
|
|
832
832
|
}[selectState],
|
|
833
833
|
this.open && (this.currentPlacement === "bottom" ? "rounded-bl-none rounded-br-none" : "rounded-tl-none rounded-tr-none")
|
|
834
|
-
)}"></div><sd-6-25-
|
|
834
|
+
)}"></div><sd-6-25-1-popup @sd-current-placement="${this.handleCurrentPlacement}" class="${cx(
|
|
835
835
|
"inline-flex relative w-full",
|
|
836
836
|
this.currentPlacement === "bottom" ? "origin-top" : "origin-bottom"
|
|
837
837
|
)}" placement="${this.placement}" strategy="${this.hoist ? "fixed" : "absolute"}" flip shift sync="width" auto-size="vertical" auto-size-padding="10" exportparts="
|
|
@@ -860,18 +860,18 @@ var SdCombobox = class extends SolidElement {
|
|
|
860
860
|
"flex justify-center",
|
|
861
861
|
iconMarginLeft,
|
|
862
862
|
this.value.length > 0 ? "visible" : "invisible"
|
|
863
|
-
)}" type="button" aria-label="${this.localize.term("clearEntry")}" @mousedown="${this.preventLoosingFocus}" @click="${this.handleClearClick}" tabindex="-1"><slot name="clear-icon"><sd-6-25-
|
|
863
|
+
)}" type="button" aria-label="${this.localize.term("clearEntry")}" @mousedown="${this.preventLoosingFocus}" @click="${this.handleClearClick}" tabindex="-1"><slot name="clear-icon"><sd-6-25-1-icon class="${cx("text-neutral-700", iconSize)}" name="closing-round" library="_internal"></sd-6-25-1-icon></slot></button>` : ""} ${this.showInvalidStyle ? html`<sd-6-25-1-icon part="invalid-icon" class="${cx(iconMarginLeft, iconSize, "text-error")}" library="_internal" name="risk"></sd-6-25-1-icon>` : ""} ${this.styleOnValid && this.showValidStyle ? html`<sd-6-25-1-icon part="valid-icon" class="${cx("flex-shrink-0 text-success", iconMarginLeft, iconSize)}" library="_internal" name="confirm-circle"></sd-6-25-1-icon>` : ""}<slot name="right" part="right" class="${cx(
|
|
864
864
|
"inline-flex ml-2 leading-[0]",
|
|
865
|
-
this.disabled || this.visuallyDisabled ? "text-neutral-500" : "sd-6-25-
|
|
865
|
+
this.disabled || this.visuallyDisabled ? "text-neutral-500" : "sd-6-25-1-icon-fill-primary",
|
|
866
866
|
iconSize
|
|
867
|
-
)}">${this.type !== "search" ? html`<sd-6-25-
|
|
867
|
+
)}">${this.type !== "search" ? html`<sd-6-25-1-icon class="${cx(
|
|
868
868
|
"transition-transform duration-medium ease-in-out",
|
|
869
869
|
this.open ? "rotate-180" : "rotate-0"
|
|
870
|
-
)}" name="chevron-down" part="chevron" library="_internal" color="currentColor" label="${this.localize.term("open")}"></sd-6-25-
|
|
870
|
+
)}" name="chevron-down" part="chevron" library="_internal" color="currentColor" label="${this.localize.term("open")}"></sd-6-25-1-icon>` : ""}</slot>${this.type === "search" ? html`<button class="${cx("flex items-center sd-interactive", iconMarginLeft)}" type="button" @mousedown="${this.preventLoosingFocus}" @click="${this.handleSearchClick}"><sd-6-25-1-icon class="${cx(iconColor, iconSize)}" library="_internal" name="magnifying-glass" label="${this.localize.term("search")}"></sd-6-25-1-icon></button>` : html`<button class="sd-interactive combobox-button absolute top-2 sd-color-icon-fill-primary" tabindex="-1" aria-hidden="true" @keydown="${this.handleComboboxMouseDown}" type="button"><span class="sr-only">${this.localize.term("open")}</span></button>`}</div><div id="listbox" role="${ifDefined(!this.multiple ? "listbox" : void 0)}" aria-expanded="${this.open}" aria-multiselectable="${this.multiple}" aria-labelledby="label" part="listbox" class="${cx(
|
|
871
871
|
"bg-white px-2 py-3 relative border-primary overflow-y-auto",
|
|
872
872
|
this.open && "shadow-listbox transition-shadow duration-medium ease-in-out",
|
|
873
873
|
this.currentPlacement === "bottom" ? "border-r-2 border-b-2 border-l-2 form-control__listbox-border-bottom-right-radius form-control__listbox-border-bottom-left-radius" : "border-r-2 border-t-2 border-l-2 form-control__listbox-border-top-right-radius form-control__listbox-border-top-left-radius"
|
|
874
|
-
)}" tabindex="-1" @mousedown="${this.preventLoosingFocus}" @mouseup="${this.handleOptionClick}"><div part="filtered-listbox">${this.filteredOptions.length === 0 ? html`<span id="noResults" class="px-4 flex items-center w-full transition-all text-left text-base relative text-black py-3" aria-hidden="true" @click="${this.handleNoResultsClick}">${this.localize.term("noResults")}</span>` : this.options}</div><slot id="defaultOptionsSlot" class="hidden" @slotchange="${this.handleDefaultSlotChange}"></slot></div></sd-6-25-
|
|
874
|
+
)}" tabindex="-1" @mousedown="${this.preventLoosingFocus}" @mouseup="${this.handleOptionClick}"><div part="filtered-listbox">${this.filteredOptions.length === 0 ? html`<span id="noResults" class="px-4 flex items-center w-full transition-all text-left text-base relative text-black py-3" aria-hidden="true" @click="${this.handleNoResultsClick}">${this.localize.term("noResults")}</span>` : this.options}</div><slot id="defaultOptionsSlot" class="hidden" @slotchange="${this.handleDefaultSlotChange}"></slot></div></sd-6-25-1-popup></div><slot name="help-text" part="form-control-help-text" id="help-text" class="${cx(
|
|
875
875
|
"text-sm mt-1",
|
|
876
876
|
hasHelpText ? "block" : "hidden",
|
|
877
877
|
this.visuallyDisabled || this.disabled ? "text-neutral-500" : "text-neutral-700"
|
|
@@ -881,10 +881,10 @@ var SdCombobox = class extends SolidElement {
|
|
|
881
881
|
SdCombobox.styles = [
|
|
882
882
|
...SolidElement.styles,
|
|
883
883
|
css`/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
|
|
884
|
-
:host{position:relative;display:block;width:100%}:host([required]) #label::after{content:' *'}:host([disabled]) ::-moz-placeholder,:host([visually-disabled]) ::-moz-placeholder{color:rgba(var(--sd-color-text-neutral-500))}:host([disabled]) ::placeholder,:host([visually-disabled]) ::placeholder{color:rgba(var(--sd-color-text-neutral-500))}:host([visually-disabled]) input{caret-color:transparent}:host([size=sm]) .combobox-button{right:var(--sd-spacing-4);height:var(--sd-spacing-4);width:var(--sd-spacing-4)}:host([size=md]) .combobox-button{right:.85rem;height:var(--sd-spacing-6);width:var(--sd-spacing-6)}:host([size=lg]) .combobox-button{right:var(--sd-spacing-3);height:var(--sd-spacing-8);width:var(--sd-spacing-8)}[part=listbox]{max-height:var(--auto-size-available-height,auto)}sd-6-25-
|
|
884
|
+
:host{position:relative;display:block;width:100%}:host([required]) #label::after{content:' *'}:host([disabled]) ::-moz-placeholder,:host([visually-disabled]) ::-moz-placeholder{color:rgba(var(--sd-color-text-neutral-500))}:host([disabled]) ::placeholder,:host([visually-disabled]) ::placeholder{color:rgba(var(--sd-color-text-neutral-500))}:host([visually-disabled]) input{caret-color:transparent}:host([size=sm]) .combobox-button{right:var(--sd-spacing-4);height:var(--sd-spacing-4);width:var(--sd-spacing-4)}:host([size=md]) .combobox-button{right:.85rem;height:var(--sd-spacing-6);width:var(--sd-spacing-6)}:host([size=lg]) .combobox-button{right:var(--sd-spacing-3);height:var(--sd-spacing-8);width:var(--sd-spacing-8)}[part=listbox]{max-height:var(--auto-size-available-height,auto)}sd-6-25-1-popup::part(popup){z-index:var(--sd-z-index-dropdown,900)}sd-6-25-1-tag::part(base){border-radius:var(--sd-radius);border-width:var(--sd-combobox__tag-border-width,var(--sd-spacing-0\\.25));padding-inline:var(--sd-spacing-1)}sd-6-25-1-tag::part(content){display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:var(--tag-max-width,15ch)}sd-6-25-1-tag[size=lg]::part(base){padding-inline:var(--sd-spacing-2)}sd-6-25-1-tag[disabled=false]::part(base):hover{background-color:rgba(var(--sd-color-background-primary-100))}[part=filtered-listbox] sd-6-25-1-optgroup:first-of-type{--display-divider:none}mark{background-color:transparent;--tw-font-weight:var(--sd-font-weight-bold);font-weight:var(--sd-font-weight-bold);color:inherit}[part=chevron]{color:rgb(var(--sd-color-icon-fill-primary))}:host([disabled])::part(chevron),:host([visually-disabled])::part(chevron){color:rgba(var(--sd-color-icon-fill-neutral-500,--sd-color-neutral-500))}@property --tw-font-weight{syntax:"*";inherits:false}`
|
|
885
885
|
];
|
|
886
886
|
__decorateClass([
|
|
887
|
-
query("sd-6-25-
|
|
887
|
+
query("sd-6-25-1-popup")
|
|
888
888
|
], SdCombobox.prototype, "popup", 2);
|
|
889
889
|
__decorateClass([
|
|
890
890
|
query('[part="combobox"]')
|
|
@@ -1048,7 +1048,7 @@ __decorateClass([
|
|
|
1048
1048
|
watch(["size", "floatingLabel"])
|
|
1049
1049
|
], SdCombobox.prototype, "handleSizeChange", 1);
|
|
1050
1050
|
SdCombobox = __decorateClass([
|
|
1051
|
-
customElement("sd-6-25-
|
|
1051
|
+
customElement("sd-6-25-1-combobox")
|
|
1052
1052
|
], SdCombobox);
|
|
1053
1053
|
setDefaultAnimation("combobox.show", {
|
|
1054
1054
|
keyframes: [{ opacity: 0 }, { opacity: 1 }],
|
|
@@ -22,7 +22,7 @@ var SdBreadcrumb = class extends SolidElement {
|
|
|
22
22
|
this.isTruncated = false;
|
|
23
23
|
}
|
|
24
24
|
get items() {
|
|
25
|
-
return this.querySelectorAll("sd-6-25-
|
|
25
|
+
return this.querySelectorAll("sd-6-25-1-breadcrumb-item");
|
|
26
26
|
}
|
|
27
27
|
cacheItemPositions() {
|
|
28
28
|
this.items.forEach((item) => {
|
|
@@ -67,12 +67,12 @@ var SdBreadcrumb = class extends SolidElement {
|
|
|
67
67
|
}
|
|
68
68
|
handleMobileChevron() {
|
|
69
69
|
var _a, _b, _c;
|
|
70
|
-
const icon = document.createElement("sd-6-25-
|
|
70
|
+
const icon = document.createElement("sd-6-25-1-icon");
|
|
71
71
|
icon.setAttribute("slot", "icon-left");
|
|
72
72
|
icon.setAttribute("library", "_internal");
|
|
73
73
|
icon.setAttribute("name", "chevron-left");
|
|
74
74
|
icon.setAttribute("class", "text-base me-1 lg:hidden");
|
|
75
|
-
(_c = (_b = (_a = Array.from(this.items).at(-2)) == null ? void 0 : _a.shadowRoot) == null ? void 0 : _b.querySelector("sd-6-25-
|
|
75
|
+
(_c = (_b = (_a = Array.from(this.items).at(-2)) == null ? void 0 : _a.shadowRoot) == null ? void 0 : _b.querySelector("sd-6-25-1-link")) == null ? void 0 : _c.appendChild(icon);
|
|
76
76
|
}
|
|
77
77
|
handleSlotChange() {
|
|
78
78
|
this.handleMobileChevron();
|
|
@@ -87,13 +87,13 @@ var SdBreadcrumb = class extends SolidElement {
|
|
|
87
87
|
this.resizeObserver.unobserve(this);
|
|
88
88
|
}
|
|
89
89
|
render() {
|
|
90
|
-
return html`<nav part="base" class="flex items-center pb-1" aria-label="${this.label}"><sd-6-25-
|
|
90
|
+
return html`<nav part="base" class="flex items-center pb-1" aria-label="${this.label}"><sd-6-25-1-dropdown part="truncated" class="${cx(!this.isTruncated && "absolute opacity-0 pointer-events-none")}"><button slot="trigger" tabindex="${this.isTruncated ? "0" : "-1"}" aria-label="${this.localize.term("truncatedBreadcrumbs")}" aria-expanded="false" aria-haspopup="true" class="flex sd-interactive">[...]</button><ol part="truncated-dropdown" class="flex flex-col gap-4 px-2 py-3 min-w-40"></ol></sd-6-25-1-dropdown><ol part="list" class="flex items-center"><slot @slotchange="${this.handleSlotChange}"></slot></ol></nav>`;
|
|
91
91
|
}
|
|
92
92
|
};
|
|
93
93
|
SdBreadcrumb.styles = [
|
|
94
94
|
...SolidElement.styles,
|
|
95
95
|
css`/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
|
|
96
|
-
:host{position:relative;display:block}::slotted(sd-6-25-
|
|
96
|
+
:host{position:relative;display:block}::slotted(sd-6-25-1-breadcrumb-item:not(:last-of-type))::after,sd-6-25-1-dropdown::after{margin-inline:var(--sd-spacing-2);display:none;height:var(--sd-spacing-1);width:var(--sd-spacing-1);border-radius:var(--sd-radius-full);background-color:rgba(var(--sd-breadcrumb__separator-color,rgba(var(--sd-color-neutral-400))));--tw-content:'';content:var(--tw-content)}@media (width >= 64rem){::slotted(sd-6-25-1-breadcrumb-item:not(:last-of-type))::after,sd-6-25-1-dropdown::after{display:inline-block}}::slotted(sd-6-25-1-breadcrumb-item:nth-last-child(2)){display:flex}@media (width >= 64rem){::slotted(sd-6-25-1-breadcrumb-item:nth-last-child(2))::after{background-color:rgba(var(--sd-breadcrumb__separator--current-color,rgba(var(--sd-color-accent))))}}::slotted(sd-6-25-1-breadcrumb-item),sd-6-25-1-dropdown{display:none;align-items:center;font-size:var(--sd-text-sm);line-height:var(--tw-leading,var(--text-sm--line-height,calc(1.25 / .875)))}@media (width >= 64rem){::slotted(sd-6-25-1-breadcrumb-item),sd-6-25-1-dropdown{display:flex}}@property --tw-content{syntax:"*";inherits:false;initial-value:""}`
|
|
97
97
|
];
|
|
98
98
|
__decorateClass([
|
|
99
99
|
query('[part="base"]')
|
|
@@ -117,7 +117,7 @@ __decorateClass([
|
|
|
117
117
|
state()
|
|
118
118
|
], SdBreadcrumb.prototype, "isTruncated", 2);
|
|
119
119
|
SdBreadcrumb = __decorateClass([
|
|
120
|
-
customElement("sd-6-25-
|
|
120
|
+
customElement("sd-6-25-1-breadcrumb")
|
|
121
121
|
], SdBreadcrumb);
|
|
122
122
|
|
|
123
123
|
export {
|
|
@@ -54,7 +54,7 @@ var SdNavigationItem = class extends SolidElement {
|
|
|
54
54
|
}
|
|
55
55
|
if (node.nodeType === Node.ELEMENT_NODE) {
|
|
56
56
|
const element = node;
|
|
57
|
-
return element.tagName.toLowerCase() === "sd-6-25-
|
|
57
|
+
return element.tagName.toLowerCase() === "sd-6-25-1-icon";
|
|
58
58
|
}
|
|
59
59
|
return false;
|
|
60
60
|
});
|
|
@@ -130,8 +130,8 @@ var SdNavigationItem = class extends SolidElement {
|
|
|
130
130
|
const root = html`<${tag} part="base" class="${cx(
|
|
131
131
|
"flex items-center cursor-pointer relative focus-visible:focus-outline group hover:bg-neutral-200 transition-colors duration-fast ease-in-out min-h-[48px] navigable-border-radius",
|
|
132
132
|
this.isStackedHorizontal ? "text-xs leading-4.5" : { md: "navigable-font-size", lg: "text-lg", sm: "text-[14px]" }[this.size],
|
|
133
|
-
this.disabled ? "text-neutral-500 pointer-events-none" : "sd-6-25-
|
|
134
|
-
this.current && !this.disabled && "sd-6-25-
|
|
133
|
+
this.disabled ? "text-neutral-500 pointer-events-none" : "sd-6-25-1-navigation-item-color-text",
|
|
134
|
+
this.current && !this.disabled && "sd-6-25-1-navigation-item--current-color-text",
|
|
135
135
|
this.current && !this.isStackedHorizontal && "font-bold",
|
|
136
136
|
!this.current && !this.isStackedHorizontal && "choice-control-font-weight",
|
|
137
137
|
!isAccordion && "w-full",
|
|
@@ -153,25 +153,25 @@ var SdNavigationItem = class extends SolidElement {
|
|
|
153
153
|
slots["description"] && "pt-3",
|
|
154
154
|
!slots["description"] && !this.separated && horizontalPadding,
|
|
155
155
|
this.calculatePaddingX
|
|
156
|
-
)}">${this.divider && this.vertical ? html`<sd-6-25-
|
|
156
|
+
)}">${this.divider && this.vertical ? html`<sd-6-25-1-divider part="divider" class="${cx("w-full transition-all absolute -top-0.25 left-0", this.calculatePaddingX)}"></sd-6-25-1-divider>` : ""} <span id="content" part="content-container" class="${cx(
|
|
157
157
|
"inline-flex items-center",
|
|
158
158
|
this.vertical ? "flex-auto gap-2" : this.isStackedHorizontal ? "text-center" : "flex-auto flex-col justify-center gap-1 text-center"
|
|
159
159
|
)}"><slot part="content" class="${cx(
|
|
160
160
|
"inline-flex items-center",
|
|
161
161
|
this.vertical ? "gap-2" : this.isStackedHorizontal ? "flex-col justify-center gap-1 text-center" : "justify-center gap-1 text-center"
|
|
162
|
-
)}"></slot></span>${this.chevron || slots["children"] && this.vertical && !this.separated ? html`<sd-6-25-
|
|
162
|
+
)}"></slot></span>${this.chevron || slots["children"] && this.vertical && !this.separated ? html`<sd-6-25-1-icon name="chevron-down" part="chevron" library="_internal" color="currentColor" class="${cx(
|
|
163
163
|
"h-6 w-6 ml-2 transition-all",
|
|
164
164
|
isAccordion ? this.open ? "rotate-180" : "rotate-0" : "rotate-[270deg]"
|
|
165
|
-
)}"></sd-6-25-
|
|
165
|
+
)}"></sd-6-25-1-icon>` : ""} </span>${slots["description"] && this.vertical ? html`<slot id="description" name="description" part="description" class="${cx(
|
|
166
166
|
"inline-block text-sm text-left font-normal text-black pb-3",
|
|
167
167
|
isAccordion || this.separated ? "grow" : "w-full",
|
|
168
168
|
this.calculatePaddingX
|
|
169
169
|
)}"></slot>` : ""}</div></${tag}>`;
|
|
170
170
|
if (this.separated) {
|
|
171
|
-
return html`<div part="details" id="navigation-item-details" class="relative flex flex-col"><div class="flex items-start">${root} ${slots["children"] && this.vertical ? html`<button type="button" title="${this.open ? this.localize.term("collapseNavigationItem") : this.localize.term("expandNavigationItem")}" class="sd-interactive sd-interactive--reset -mt-1" @click="${this.handleClickSummary}"><sd-6-25-
|
|
171
|
+
return html`<div part="details" id="navigation-item-details" class="relative flex flex-col"><div class="flex items-start">${root} ${slots["children"] && this.vertical ? html`<button type="button" title="${this.open ? this.localize.term("collapseNavigationItem") : this.localize.term("expandNavigationItem")}" class="sd-interactive sd-interactive--reset -mt-1" @click="${this.handleClickSummary}"><sd-6-25-1-icon name="chevron-down" part="chevron" library="_internal" color="currentColor" class="${cx(
|
|
172
172
|
"m-4 h-6 w-6 transition-all",
|
|
173
173
|
isAccordion || this.separated ? this.open ? "rotate-180" : "rotate-0" : "rotate-[270deg]"
|
|
174
|
-
)}"></sd-6-25-
|
|
174
|
+
)}"></sd-6-25-1-icon></button>` : ""}</div>${this.open ? html`<slot name="children"></slot>` : ""}</div>`;
|
|
175
175
|
}
|
|
176
176
|
if (isAccordion) {
|
|
177
177
|
return html`<details aria-expanded="${this.open}" part="details" id="navigation-item-details" ?open="${this.open}" class="relative">${root}<slot name="children"></slot></details>`;
|
|
@@ -185,7 +185,7 @@ var SdNavigationItem = class extends SolidElement {
|
|
|
185
185
|
SdNavigationItem.styles = [
|
|
186
186
|
...SolidElement.styles,
|
|
187
187
|
css`/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
|
|
188
|
-
:host{position:relative;box-sizing:border-box;display:inline-block}:host([vertical]){display:block}:host([stacked]:not([vertical])) ::slotted(sd-6-25-
|
|
188
|
+
:host{position:relative;box-sizing:border-box;display:inline-block}:host([vertical]){display:block}:host([stacked]:not([vertical])) ::slotted(sd-6-25-1-icon){height:var(--sd-spacing-6);width:var(--sd-spacing-6)}.sd-6-25-1-navigation-item--current-color-text{color:rgb(var(--sd-navigation-item--current-color-text,var(--sd-navigation-item-color-text)))}details summary::-webkit-details-marker{display:none}[part=current-indicator]{--tw-scale-x:0%;--tw-scale-y:0%;--tw-scale-z:0%;scale:var(--tw-scale-x) var(--tw-scale-y);opacity:var(--sd-opacity-0);--tw-duration:var(--sd-duration-fast, 150ms);transition-duration:var(--sd-duration-fast,150ms);transition:width var(--sd-duration-fast) ease-in-out,height var(--sd-duration-fast) ease-in-out,left var(--sd-duration-fast) ease-in-out,top var(--sd-duration-fast) ease-in-out,opacity var(--sd-duration-fast) ease-in-out,transform var(--sd-duration-fast) ease-in-out var(--sd-duration-fast)}:host([current]) [part=current-indicator]{--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x) var(--tw-scale-y);opacity:var(--sd-opacity-100);transition:width var(--sd-duration-fast) ease-in-out,height var(--sd-duration-fast) ease-in-out,left var(--sd-duration-fast) ease-in-out,top var(--sd-duration-fast) ease-in-out,transform var(--sd-duration-fast) ease-in-out}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}@property --tw-duration{syntax:"*";inherits:false}`
|
|
189
189
|
];
|
|
190
190
|
__decorateClass([
|
|
191
191
|
query('[part="base"]')
|
|
@@ -236,7 +236,7 @@ __decorateClass([
|
|
|
236
236
|
property({ type: Boolean, reflect: true })
|
|
237
237
|
], SdNavigationItem.prototype, "separated", 2);
|
|
238
238
|
SdNavigationItem = __decorateClass([
|
|
239
|
-
customElement("sd-6-25-
|
|
239
|
+
customElement("sd-6-25-1-navigation-item")
|
|
240
240
|
], SdNavigationItem);
|
|
241
241
|
|
|
242
242
|
export {
|
|
@@ -48,7 +48,7 @@ var SubmenuController = class {
|
|
|
48
48
|
if (event.target === this.host) {
|
|
49
49
|
event.preventDefault();
|
|
50
50
|
event.stopPropagation();
|
|
51
|
-
} else if (event.target instanceof Element && (event.target.tagName === "sd-6-25-
|
|
51
|
+
} else if (event.target instanceof Element && (event.target.tagName === "sd-6-25-1-menu-item" || ((_a = event.target.role) == null ? void 0 : _a.startsWith("menuitem")))) {
|
|
52
52
|
const type = event.target.getAttribute("type");
|
|
53
53
|
if (type !== "checkbox") {
|
|
54
54
|
this.disableSubmenu();
|
|
@@ -69,7 +69,7 @@ var SubmenuController = class {
|
|
|
69
69
|
// Set the safe triangle values for the submenu when the position changes
|
|
70
70
|
this.handlePopupReposition = () => {
|
|
71
71
|
const submenuSlot = this.host.renderRoot.querySelector("slot[name='submenu']");
|
|
72
|
-
const menu = submenuSlot == null ? void 0 : submenuSlot.assignedElements({ flatten: true }).filter((el) => el.localName === "sd-6-25-
|
|
72
|
+
const menu = submenuSlot == null ? void 0 : submenuSlot.assignedElements({ flatten: true }).filter((el) => el.localName === "sd-6-25-1-menu")[0];
|
|
73
73
|
const isRtl = getComputedStyle(this.host).direction === "rtl";
|
|
74
74
|
if (!menu) {
|
|
75
75
|
return;
|
|
@@ -141,7 +141,7 @@ var SubmenuController = class {
|
|
|
141
141
|
}
|
|
142
142
|
let menuItems = null;
|
|
143
143
|
for (const elt of submenuSlot.assignedElements()) {
|
|
144
|
-
menuItems = elt.querySelectorAll("sd-6-25-
|
|
144
|
+
menuItems = elt.querySelectorAll("sd-6-25-1-menu-item, [role^='menuitem']");
|
|
145
145
|
if (menuItems.length !== 0) {
|
|
146
146
|
break;
|
|
147
147
|
}
|
|
@@ -220,7 +220,7 @@ var SubmenuController = class {
|
|
|
220
220
|
if (!this.isConnected) {
|
|
221
221
|
return html`<slot name="submenu" hidden></slot>`;
|
|
222
222
|
}
|
|
223
|
-
return html`<sd-6-25-
|
|
223
|
+
return html`<sd-6-25-1-popup ${ref(this.popupRef)} placement="${isRtl ? "left-start" : "right-start"}" anchor="anchor" flip flip-fallback-strategy="best-fit" skidding="${this.skidding}" strategy="fixed" auto-size="vertical" auto-size-padding="10"><slot name="submenu"></slot></sd-6-25-1-popup>`;
|
|
224
224
|
}
|
|
225
225
|
};
|
|
226
226
|
|
|
@@ -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-25-
|
|
132
|
+
(_c = oppositeButton == null ? void 0 : oppositeButton.querySelector("sd-6-25-1-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-25-
|
|
144
|
+
(_a = button.querySelector("sd-6-25-1-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-25-
|
|
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-25-1-icon library="_internal" name="chevron-up" class="rotate-[-90deg]" label="${this.localize.term("scrollToStart")}"></sd-6-25-1-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-25-
|
|
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-25-1-icon library="_internal" name="chevron-down" class="rotate-[-90deg]" label="${this.localize.term("scrollToEnd")}"></sd-6-25-1-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-25-
|
|
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-25-1-icon library="_internal" name="chevron-up" label="${this.localize.term("scrollToStart")}"></sd-6-25-1-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-25-
|
|
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-25-1-icon library="_internal" name="chevron-down" label="${this.localize.term("scrollToEnd")}"></sd-6-25-1-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.3.0 | 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-25-
|
|
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-25-1-icon--top{align-self:flex-start}.sd-6-25-1-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-25-
|
|
240
|
+
customElement("sd-6-25-1-scrollable")
|
|
241
241
|
], SdScrollable);
|
|
242
242
|
|
|
243
243
|
export {
|
|
@@ -42,16 +42,16 @@ var SdAccordionGroup = class extends SolidElement {
|
|
|
42
42
|
SdAccordionGroup.styles = [
|
|
43
43
|
...SolidElement.styles,
|
|
44
44
|
css`/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
|
|
45
|
-
:host{display:block}::slotted(sd-6-25-
|
|
45
|
+
:host{display:block}::slotted(sd-6-25-1-accordion:not(:first-of-type)){margin-top:calc(-1 * var(--sd-accordion-border-width))!important}`
|
|
46
46
|
];
|
|
47
47
|
__decorateClass([
|
|
48
|
-
queryAssignedElements({ selector: "sd-6-25-
|
|
48
|
+
queryAssignedElements({ selector: "sd-6-25-1-accordion" })
|
|
49
49
|
], SdAccordionGroup.prototype, "_accordionsInDefaultSlot", 2);
|
|
50
50
|
__decorateClass([
|
|
51
51
|
property({ attribute: "close-others", type: Boolean, reflect: true })
|
|
52
52
|
], SdAccordionGroup.prototype, "closeOthers", 2);
|
|
53
53
|
SdAccordionGroup = __decorateClass([
|
|
54
|
-
customElement("sd-6-25-
|
|
54
|
+
customElement("sd-6-25-1-accordion-group")
|
|
55
55
|
], SdAccordionGroup);
|
|
56
56
|
|
|
57
57
|
export {
|