@solid-design-system/components 7.0.0-next.6 → 7.0.0-next.7
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.NB6QF25Q.js +2 -0
- package/cdn/components/header/header.d.ts +1 -0
- package/cdn/components/header/header.js +1 -1
- package/cdn/custom-elements.json +24 -4
- package/cdn/solid-components.bundle.js +33 -33
- package/cdn/solid-components.iife.js +31 -31
- package/cdn/solid-components.js +1 -1
- package/cdn/vscode.html-custom-data.json +7 -2
- package/cdn/web-types.json +14 -4
- package/cdn-versioned/chunks/chunk.2G3IPD56.js +2 -2
- package/cdn-versioned/chunks/chunk.3NQGT32X.js +2 -2
- package/cdn-versioned/chunks/chunk.3TH3ZR3I.js +2 -2
- package/cdn-versioned/chunks/chunk.43BVYRG3.js +2 -2
- package/cdn-versioned/chunks/chunk.4D6X7ON2.js +2 -2
- package/cdn-versioned/chunks/chunk.4RJE4TI4.js +2 -2
- package/cdn-versioned/chunks/chunk.4SDWX3GC.js +1 -1
- package/cdn-versioned/chunks/chunk.4UZPAOHT.js +2 -2
- package/cdn-versioned/chunks/chunk.4V7ZA4G4.js +2 -2
- package/cdn-versioned/chunks/chunk.4VWHE6IJ.js +2 -2
- package/cdn-versioned/chunks/chunk.5GCVGJ23.js +2 -2
- package/cdn-versioned/chunks/chunk.626XPPWD.js +2 -2
- package/cdn-versioned/chunks/chunk.64ZBR7T2.js +2 -2
- package/cdn-versioned/chunks/chunk.7HGJUXD2.js +2 -2
- package/cdn-versioned/chunks/chunk.7X2WZGVP.js +3 -3
- package/cdn-versioned/chunks/chunk.AFIMLGBS.js +3 -3
- package/cdn-versioned/chunks/chunk.B5TIWX7C.js +2 -2
- package/cdn-versioned/chunks/chunk.C45254AN.js +2 -2
- package/cdn-versioned/chunks/chunk.C4BSOGLY.js +1 -1
- package/cdn-versioned/chunks/chunk.D6JILLMB.js +3 -3
- package/cdn-versioned/chunks/chunk.DK2NRNHC.js +2 -2
- package/cdn-versioned/chunks/chunk.DSKB3SEU.js +1 -1
- package/cdn-versioned/chunks/chunk.EDB7WM3C.js +2 -2
- package/cdn-versioned/chunks/chunk.EW3C6EAI.js +1 -1
- package/cdn-versioned/chunks/chunk.GTAM35BO.js +2 -2
- package/cdn-versioned/chunks/chunk.H6DSYZZ5.js +2 -2
- package/cdn-versioned/chunks/chunk.HPSXEVMH.js +2 -2
- package/cdn-versioned/chunks/chunk.IHNJ7SE7.js +2 -2
- package/cdn-versioned/chunks/chunk.INUOCLNI.js +1 -1
- package/cdn-versioned/chunks/chunk.IPT2IS3C.js +2 -2
- package/cdn-versioned/chunks/chunk.IUTTUDYG.js +2 -2
- package/cdn-versioned/chunks/chunk.KFO7GTE5.js +2 -2
- package/cdn-versioned/chunks/chunk.KGIRFMVB.js +2 -2
- package/cdn-versioned/chunks/chunk.KIKLU2QF.js +2 -2
- package/cdn-versioned/chunks/chunk.LZRL7OLU.js +1 -1
- package/cdn-versioned/chunks/chunk.MCV2O2DW.js +2 -2
- package/cdn-versioned/chunks/chunk.MMSVMSOT.js +1 -1
- package/cdn-versioned/chunks/chunk.NB6QF25Q.js +2 -0
- package/cdn-versioned/chunks/chunk.NIP2E7XF.js +2 -2
- package/cdn-versioned/chunks/chunk.O45L6PM3.js +5 -5
- package/cdn-versioned/chunks/chunk.ONEC2JGA.js +2 -2
- package/cdn-versioned/chunks/chunk.OR425KE3.js +2 -2
- package/cdn-versioned/chunks/chunk.PINAEP5F.js +2 -2
- package/cdn-versioned/chunks/chunk.Q235YK2W.js +2 -2
- package/cdn-versioned/chunks/chunk.Q7MQTMXO.js +2 -2
- package/cdn-versioned/chunks/chunk.RHWN47DZ.js +2 -2
- package/cdn-versioned/chunks/chunk.SDWSZX52.js +10 -10
- package/cdn-versioned/chunks/chunk.SPIJDZMD.js +2 -2
- package/cdn-versioned/chunks/chunk.SS7M4TZ3.js +2 -2
- package/cdn-versioned/chunks/chunk.SXCJQBLJ.js +2 -2
- package/cdn-versioned/chunks/chunk.TEZ5ERKR.js +5 -5
- package/cdn-versioned/chunks/chunk.TQIQNEOY.js +1 -1
- package/cdn-versioned/chunks/chunk.UQD7EJTJ.js +2 -2
- package/cdn-versioned/chunks/chunk.V65AWGU4.js +1 -1
- package/cdn-versioned/chunks/chunk.VGGACO4K.js +2 -2
- package/cdn-versioned/chunks/chunk.VUEVAYFK.js +2 -2
- package/cdn-versioned/chunks/chunk.W7A3TU2Z.js +1 -1
- package/cdn-versioned/chunks/chunk.WUMIGCKG.js +2 -2
- package/cdn-versioned/chunks/chunk.X66Q6CFQ.js +2 -2
- package/cdn-versioned/chunks/chunk.XYOC42VA.js +2 -2
- package/cdn-versioned/chunks/chunk.Y22AL5IU.js +2 -2
- package/cdn-versioned/chunks/chunk.Z4LHGWSU.js +1 -1
- package/cdn-versioned/chunks/chunk.ZDVA3JMZ.js +1 -1
- package/cdn-versioned/chunks/chunk.ZHYZWUO3.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 +2 -1
- package/cdn-versioned/components/header/header.js +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/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 +283 -263
- package/cdn-versioned/internal/form.js +2 -2
- package/cdn-versioned/solid-components.bundle.js +84 -84
- package/cdn-versioned/solid-components.css +3 -3
- package/cdn-versioned/solid-components.iife.js +84 -84
- package/cdn-versioned/solid-components.js +1 -1
- package/cdn-versioned/vscode.html-custom-data.json +120 -115
- package/cdn-versioned/web-types.json +182 -172
- package/dist/chunks/{chunk.4KUVWN2I.js → chunk.5HSSTHMW.js} +5 -1
- package/dist/components/header/header.d.ts +1 -0
- package/dist/components/header/header.js +1 -1
- package/dist/custom-elements.json +24 -4
- package/dist/solid-components.js +6 -6
- package/dist/vscode.html-custom-data.json +7 -2
- package/dist/web-types.json +14 -4
- package/dist-versioned/chunks/{chunk.4KUVWN2I.js → chunk.5HSSTHMW.js} +7 -3
- package/dist-versioned/chunks/chunk.6ETKGDC3.js +13 -13
- package/dist-versioned/chunks/chunk.6O4N7F3K.js +3 -3
- package/dist-versioned/chunks/chunk.6UABH73N.js +23 -23
- package/dist-versioned/chunks/chunk.742523X2.js +6 -6
- package/dist-versioned/chunks/chunk.7MHQG3BX.js +1 -1
- package/dist-versioned/chunks/chunk.7PKQECKN.js +5 -5
- package/dist-versioned/chunks/chunk.7QL6Y47O.js +3 -3
- package/dist-versioned/chunks/chunk.7WPBGXB4.js +1 -1
- package/dist-versioned/chunks/chunk.AMARMKJU.js +3 -3
- package/dist-versioned/chunks/chunk.BDDLMKAK.js +1 -1
- package/dist-versioned/chunks/chunk.C3WIBDGG.js +2 -2
- package/dist-versioned/chunks/chunk.D3Q6NREV.js +1 -1
- package/dist-versioned/chunks/chunk.DC2F6ZIN.js +12 -12
- package/dist-versioned/chunks/chunk.DCUIQILU.js +7 -7
- package/dist-versioned/chunks/chunk.DMQ52GO3.js +2 -2
- package/dist-versioned/chunks/chunk.DZ77XUG2.js +11 -11
- package/dist-versioned/chunks/chunk.E7RWXJJE.js +11 -11
- package/dist-versioned/chunks/chunk.EH7PG7IH.js +2 -2
- package/dist-versioned/chunks/chunk.EKH7JJ3U.js +25 -25
- package/dist-versioned/chunks/chunk.GVPPHUUS.js +5 -5
- package/dist-versioned/chunks/chunk.GWWM46XG.js +7 -7
- package/dist-versioned/chunks/chunk.HB3VBJFC.js +10 -10
- package/dist-versioned/chunks/chunk.K22CCY63.js +3 -3
- package/dist-versioned/chunks/chunk.K4ZSZPTN.js +2 -2
- package/dist-versioned/chunks/chunk.KEJFWGZI.js +4 -4
- package/dist-versioned/chunks/chunk.KYX4HLN2.js +7 -7
- package/dist-versioned/chunks/chunk.LDTZNWTZ.js +6 -6
- package/dist-versioned/chunks/chunk.LUR5ATJB.js +6 -6
- package/dist-versioned/chunks/chunk.MEMOQ3W7.js +5 -5
- package/dist-versioned/chunks/chunk.MJ6KXGSO.js +5 -5
- package/dist-versioned/chunks/chunk.N5OTEAT2.js +6 -6
- package/dist-versioned/chunks/chunk.NPYCKWWW.js +10 -10
- package/dist-versioned/chunks/chunk.NXG4DNKU.js +12 -12
- package/dist-versioned/chunks/chunk.PUT4P7PK.js +2 -2
- package/dist-versioned/chunks/chunk.QGERTGJH.js +4 -4
- package/dist-versioned/chunks/chunk.RZXU2X5Z.js +2 -2
- package/dist-versioned/chunks/chunk.S3DD4YSN.js +4 -4
- package/dist-versioned/chunks/chunk.SCWFNFSN.js +4 -4
- package/dist-versioned/chunks/chunk.SOX43MJ5.js +4 -4
- package/dist-versioned/chunks/chunk.T2ZFQMV6.js +8 -8
- package/dist-versioned/chunks/chunk.TNLAM4ZT.js +3 -3
- package/dist-versioned/chunks/chunk.UGIF26DH.js +2 -2
- package/dist-versioned/chunks/chunk.UIQBHPD3.js +2 -2
- package/dist-versioned/chunks/chunk.V4ILSVMF.js +4 -4
- package/dist-versioned/chunks/chunk.V54VIV3V.js +1 -1
- package/dist-versioned/chunks/chunk.VDQBK7ZK.js +2 -2
- package/dist-versioned/chunks/chunk.VLMSLPLL.js +10 -10
- package/dist-versioned/chunks/chunk.VWGMR2Y5.js +5 -5
- package/dist-versioned/chunks/chunk.VYBHDB7F.js +11 -11
- package/dist-versioned/chunks/chunk.WIKRI7YB.js +5 -5
- package/dist-versioned/chunks/chunk.WKUNYCQZ.js +3 -3
- package/dist-versioned/chunks/chunk.X32Z3OP3.js +14 -14
- package/dist-versioned/chunks/chunk.XQBLC5E4.js +5 -5
- package/dist-versioned/chunks/chunk.Y6MMHW4A.js +1 -1
- package/dist-versioned/chunks/chunk.YAI4GVXU.js +6 -6
- package/dist-versioned/chunks/chunk.YFUYD54K.js +42 -42
- package/dist-versioned/chunks/chunk.YVAYTWVV.js +1 -1
- package/dist-versioned/chunks/chunk.Z4X2ORYU.js +5 -5
- package/dist-versioned/chunks/chunk.Z7VTXC25.js +2 -2
- package/dist-versioned/chunks/chunk.ZMCHJLGT.js +10 -10
- package/dist-versioned/chunks/chunk.ZWSPJTPP.js +5 -5
- package/dist-versioned/chunks/chunk.ZXPU2CGW.js +3 -3
- package/dist-versioned/chunks/chunk.ZXTMNMQT.js +2 -2
- 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 +2 -1
- package/dist-versioned/components/header/header.js +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/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 +283 -263
- package/dist-versioned/internal/form.js +2 -2
- package/dist-versioned/solid-components.css +3 -3
- package/dist-versioned/solid-components.js +6 -6
- package/dist-versioned/vscode.html-custom-data.json +120 -115
- package/dist-versioned/web-types.json +182 -172
- package/package.json +1 -1
- package/cdn/chunks/chunk.YQHNJLIR.js +0 -2
- package/cdn-versioned/chunks/chunk.YQHNJLIR.js +0 -2
|
@@ -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-7-0-0-next-
|
|
13
|
+
const popup = document.createElement("sd-7-0-0-next-7-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");
|
|
@@ -23,7 +23,7 @@ function setupAutocomplete(selector, { setValueOnSelection, scrollSelectionIntoV
|
|
|
23
23
|
popup.sync = "width";
|
|
24
24
|
}
|
|
25
25
|
const styles = css`/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
|
|
26
|
-
sd-7-0-0-next-
|
|
26
|
+
sd-7-0-0-next-7-popup::part(popup){z-index:var(--sd-z-index-dropdown,900);overflow-y:scroll;border-bottom-right-radius:var(--sd-radius);border-bottom-left-radius:var(--sd-radius);border-style:var(--tw-border-style);border-width:var(--sd-border-width-2);border-top-style:var(--tw-border-style);border-top-width:0;border-color:rgba(var(--sd-color-border-primary));background-color:rgba(var(--sd-color-background-white));padding-inline:var(--sd-spacing-2);padding-block:var(--sd-spacing-3);--tw-shadow:var(--sd-shadow);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}sd-7-0-0-next-7-popup li{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function,cubic-bezier(.4,0,.2,1)));transition-duration:var(--tw-duration,var(--default-transition-duration,150ms))}sd-7-0-0-next-7-popup li:hover:not([disabled]){background-color:rgba(var(--sd-color-background-neutral-100))}sd-7-0-0-next-7-popup li{list-style-type:''}sd-7-0-0-next-7-popup li mark{background-color:transparent;--tw-font-weight:var(--sd-font-weight-bold);font-weight:var(--sd-font-weight-bold)}sd-7-0-0-next-7-popup li:not(:has(sd-7-0-0-next-7-option)){cursor:pointer;padding-inline:var(--sd-spacing-4);padding-block:var(--sd-spacing-3);font-size:var(--sd-text-base);line-height:var(--tw-leading,var(--text-base--line-height,calc(1.5 / 1)));color:rgba(var(--sd-color-text-black))}sd-7-0-0-next-7-popup li:not(:has(sd-7-0-0-next-7-option)):hover{background-color:rgba(var(--sd-color-background-neutral-200))}sd-7-0-0-next-7-popup li[aria-selected=true]{background-color:rgba(var(--sd-color-background-neutral-200))}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-font-weight{syntax:"*";inherits:false}`;
|
|
27
27
|
const styleSheet = new CSSStyleSheet();
|
|
28
28
|
styleSheet.replaceSync(styles);
|
|
29
29
|
sdInput.shadowRoot.adoptedStyleSheets = [...sdInput.shadowRoot.adoptedStyleSheets, styleSheet];
|
|
@@ -36,13 +36,13 @@ sd-7-0-0-next-6-popup::part(popup){z-index:var(--sd-z-index-dropdown,900);overfl
|
|
|
36
36
|
}
|
|
37
37
|
input.addEventListener("open", () => {
|
|
38
38
|
var _a, _b, _c, _d, _e, _f;
|
|
39
|
-
(_b = (_a = sdInput.shadowRoot) == null ? void 0 : _a.querySelector("sd-7-0-0-next-
|
|
39
|
+
(_b = (_a = sdInput.shadowRoot) == null ? void 0 : _a.querySelector("sd-7-0-0-next-7-popup")) == null ? void 0 : _b.setAttribute("active", "true");
|
|
40
40
|
(_d = (_c = sdInput.shadowRoot) == null ? void 0 : _c.querySelector('[part="border"]')) == null ? void 0 : _d.classList.add("rounded-b-none");
|
|
41
41
|
(_f = (_e = sdInput.shadowRoot) == null ? void 0 : _e.querySelector('[part="form-control"]')) == null ? void 0 : _f.classList.add("z-50");
|
|
42
42
|
});
|
|
43
43
|
input.addEventListener("close", () => {
|
|
44
44
|
var _a, _b, _c, _d, _e, _f;
|
|
45
|
-
(_b = (_a = sdInput.shadowRoot) == null ? void 0 : _a.querySelector("sd-7-0-0-next-
|
|
45
|
+
(_b = (_a = sdInput.shadowRoot) == null ? void 0 : _a.querySelector("sd-7-0-0-next-7-popup")) == null ? void 0 : _b.removeAttribute("active");
|
|
46
46
|
(_d = (_c = sdInput.shadowRoot) == null ? void 0 : _c.querySelector('[part="border"]')) == null ? void 0 : _d.classList.remove("rounded-b-none");
|
|
47
47
|
(_f = (_e = sdInput.shadowRoot) == null ? void 0 : _e.querySelector('[part="form-control"]')) == null ? void 0 : _f.classList.remove("z-50");
|
|
48
48
|
});
|
|
@@ -18,7 +18,7 @@ var SdTabPanel = class extends SolidElement {
|
|
|
18
18
|
constructor() {
|
|
19
19
|
super(...arguments);
|
|
20
20
|
this.attrId = ++id;
|
|
21
|
-
this.componentId = `sd-7-0-0-next-
|
|
21
|
+
this.componentId = `sd-7-0-0-next-7-tab-panel-${this.attrId}`;
|
|
22
22
|
this.name = "";
|
|
23
23
|
this.active = false;
|
|
24
24
|
}
|
|
@@ -49,7 +49,7 @@ __decorateClass([
|
|
|
49
49
|
watch("active")
|
|
50
50
|
], SdTabPanel.prototype, "handleActiveChange", 1);
|
|
51
51
|
SdTabPanel = __decorateClass([
|
|
52
|
-
customElement("sd-7-0-0-next-
|
|
52
|
+
customElement("sd-7-0-0-next-7-tab-panel")
|
|
53
53
|
], SdTabPanel);
|
|
54
54
|
|
|
55
55
|
export {
|
|
@@ -102,18 +102,18 @@ var SdMenuItem = class extends SolidElement {
|
|
|
102
102
|
};
|
|
103
103
|
return html`<div id="anchor" part="base" class="${cx(
|
|
104
104
|
"relative flex items-stretch whitespace-nowrap py-3 px-4 no-wrap !navigable-border-radius",
|
|
105
|
-
this.disabled ? "outline-none cursor-not-allowed sd-7-0-0-next-
|
|
105
|
+
this.disabled ? "outline-none cursor-not-allowed sd-7-0-0-next-7-menu--disabled-color-text hover:bg-transparent" : "cursor-pointer sd-7-0-0-next-7-menu-color-text hover:bg-neutral-200",
|
|
106
106
|
this.isSubmenu() && isSubmenuExpanded && "submenu-expanded"
|
|
107
107
|
)}" .disabled="${this.disabled}" ?aria-haspopup="${this.isSubmenu()}" ?aria-expanded="${isSubmenuExpanded ? true : false}">${this.type === "checkbox" ? html`<span part="checked-icon" class="${cx(
|
|
108
108
|
"flex items-center justify-center grow-0 shrink-0 basis-auto",
|
|
109
109
|
this.checked ? "visible" : "invisible"
|
|
110
|
-
)}"><sd-7-0-0-next-
|
|
110
|
+
)}"><sd-7-0-0-next-7-icon name="status-check" library="sd-status-assets" aria-hidden="true"></sd-7-0-0-next-7-icon></span>` : ""} ${slots.iconIndent ? html`<slot name="icon-indent" part="icon-indent" class="flex items-center grow-0 shrink-0 basis-auto mr-2"></slot>` : ""}<slot part="label" class="inline-flex grow shrink basis-auto text-ellipsis overflow-hidden" @slotchange="${this.handleDefaultSlotChange}"></slot>${this.chevron || this.isSubmenu() ? html`<span part="submenu-icon" class="flex items-center justify-center grow-0 shrink-0 basis-auto ml-3"><sd-7-0-0-next-7-icon name="chevron-right" library="_internal" aria-hidden="true" class="h-6 w-6"></sd-7-0-0-next-7-icon></span>` : ""} ${this.submenuController.renderSubmenu()}</div>`;
|
|
111
111
|
}
|
|
112
112
|
};
|
|
113
113
|
SdMenuItem.styles = [
|
|
114
114
|
...SolidElement.styles,
|
|
115
115
|
css`/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
|
|
116
|
-
:host{--submenu-offset:-6px;display:block}:host(:focus-visible){--tw-outline-style:none;outline-style:none}::slotted(sd-7-0-0-next-
|
|
116
|
+
:host{--submenu-offset:-6px;display:block}:host(:focus-visible){--tw-outline-style:none;outline-style:none}::slotted(sd-7-0-0-next-7-icon){height:var(--sd-spacing-6);width:var(--sd-spacing-6)}[part=checked-icon]{margin-right:var(--sd-spacing-3)}.submenu-expanded::after{position:fixed;top:0;right:0;bottom:0;left:0;z-index:calc(var(z-dropdown) - 1);--tw-content:'';content:var(--tw-content);clip-path:polygon(var(--safe-triangle-cursor-x,0) var(--safe-triangle-cursor-y,0),var(--safe-triangle-submenu-start-x,0) var(--safe-triangle-submenu-start-y,0),var(--safe-triangle-submenu-end-x,0) var(--safe-triangle-submenu-end-y,0))}:host(:hover:not([aria-disabled=true],:focus-visible)) [part=base]{background-color:rgba(var(--sd-color-background-neutral-200));--tw-outline-style:none;outline-style:none}:host(:focus-visible:not([aria-disabled=true])) [part=base]{outline-style:solid;outline-offset:2px;outline-width:2px;outline-color:var(--outline-color-primary);outline-offset:-2px}:host(.menu-item-focus) [part=base]{outline-style:solid;outline-offset:2px;outline-width:2px;outline-color:var(--outline-color-primary);outline-offset:-2px}:host(:hover) [part=base]{--tw-outline-style:none;outline-style:none}//TODO clean up sd-7-0-0-next-7-menu-color-icon variable replacing with sd-7-0-0-next-7-menu-item-color-icon-fill (breakingchange) :host [part=icon-indent],:host [part=checked-icon],:host [part=submenu-icon]{color:rgba(var(--sd-menu-color-icon,var(--sd-menu-item-color-icon-fill)))}//TODO clean up sd-7-0-0-next-7-menu--disabled-color-icon variable replacing with sd-7-0-0-next-7-menu-item--disabled-color-icon-fill (breakingchange) :host([aria-disabled=true]) [part=icon-indent]{color:rgba(var(--sd-menu--disabled-color-icon,var(--sd-menu-item--disabled-color-icon-fill)))}sd-7-0-0-next-7-popup::part(popup){z-index:var(--sd-z-index-dropdown,900);background-color:rgba(var(--sd-color-background-white));margin-left:var(--submenu-offset)}::slotted(sd-7-0-0-next-7-menu){max-width:var(--auto-size-available-width)!important;max-height:var(--auto-size-available-height)!important}.sd-7-0-0-next-7-menu-color-text{color:rgba(var(--sd-menu-color-text,var(--sd-menu-item-color-text)))}.sd-7-0-0-next-7-menu--disabled-color-text{color:rgba(var(--sd-menu--disabled-color-text,var(--sd-menu-item--disabled-color-text)))}@property --tw-content{syntax:"*";inherits:false;initial-value:""}`
|
|
117
117
|
];
|
|
118
118
|
__decorateClass([
|
|
119
119
|
query("slot:not([name])")
|
|
@@ -146,7 +146,7 @@ __decorateClass([
|
|
|
146
146
|
watch("type")
|
|
147
147
|
], SdMenuItem.prototype, "handleTypeChange", 1);
|
|
148
148
|
SdMenuItem = __decorateClass([
|
|
149
|
-
customElement("sd-7-0-0-next-
|
|
149
|
+
customElement("sd-7-0-0-next-7-menu-item")
|
|
150
150
|
], SdMenuItem);
|
|
151
151
|
|
|
152
152
|
export {
|
|
@@ -64,9 +64,9 @@ var SdRadioButton = class extends SolidElement {
|
|
|
64
64
|
const hasIconSlot = this.hasSlotController.test("icon");
|
|
65
65
|
const buttonSizeClass = `${this.size}-${hasDefaultSlot ? "label" : "no-label"}`;
|
|
66
66
|
return html`<div part="base" role="presentation" class="relative"><button part="${`button${this.checked ? " button--checked" : ""}`}" role="radio" aria-checked="${this.checked}" class="${cx(
|
|
67
|
-
"relative text-center sd-7-0-0-next-
|
|
67
|
+
"relative text-center sd-7-0-0-next-7-radio-button-border-radius transition-all ease-in-out duration-100 items-center justify-center focus-visible:focus-outline choice-control-font-weight",
|
|
68
68
|
this.size === "sm" ? "text-sm" : "text-base",
|
|
69
|
-
this.checked && !this.disabled && !this.visuallyDisabled ? "sd-7-0-0-next-
|
|
69
|
+
this.checked && !this.disabled && !this.visuallyDisabled ? "sd-7-0-0-next-7-button--primary--default-color-background sd-7-0-0-next-7-button--primary--default-color-text hover:sd-7-0-0-next-7-button--primary--hover-color-background hover:text-primary-100" : !this.checked && (this.disabled || this.visuallyDisabled) ? "text-neutral-500 hover:cursor-not-allowed" : this.checked && (this.disabled || this.visuallyDisabled) ? "bg-neutral-400 text-white hover:cursor-not-allowed " : "bg-transparent sd-7-0-0-next-7-radio-button-color-text border-primary cursor-pointer hover:sd-7-0-0-next-7-radio-button--hover-color-background hover:sd-7-0-0-next-7-radio-button--hover-color-text",
|
|
70
70
|
hasDefaultSlot && {
|
|
71
71
|
sm: "px-3",
|
|
72
72
|
md: "px-4",
|
|
@@ -89,7 +89,7 @@ var SdRadioButton = class extends SolidElement {
|
|
|
89
89
|
SdRadioButton.styles = [
|
|
90
90
|
...SolidElement.styles,
|
|
91
91
|
css`/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
|
|
92
|
-
:host{display:block;width:-moz-min-content;width:min-content}.hidden-input{all:unset;position:absolute;inset:0;z-index:calc(10 * -1);opacity:var(--sd-opacity-0);outline-style:var(--tw-outline-style);outline-width:1px;outline-color:rgba(var(--sd-color-border-error,var(--sd-color-error)));--tw-outline-style:dotted;outline-style:dotted}.lg-label{height:46px}.lg-no-label{height:46px;padding-inline:calc(var(--sd-spacing-1) * 5)}.md-label{height:38px}.md-no-label{height:38px;padding-inline:var(--sd-spacing-4)}.sm-label{height:30px}.sm-no-label{height:30px;padding-inline:var(--sd-spacing-3)}:host([size=lg].sd-7-0-0-next-
|
|
92
|
+
:host{display:block;width:-moz-min-content;width:min-content}.hidden-input{all:unset;position:absolute;inset:0;z-index:calc(10 * -1);opacity:var(--sd-opacity-0);outline-style:var(--tw-outline-style);outline-width:1px;outline-color:rgba(var(--sd-color-border-error,var(--sd-color-error)));--tw-outline-style:dotted;outline-style:dotted}.lg-label{height:46px}.lg-no-label{height:46px;padding-inline:calc(var(--sd-spacing-1) * 5)}.md-label{height:38px}.md-no-label{height:38px;padding-inline:var(--sd-spacing-4)}.sm-label{height:30px}.sm-no-label{height:30px;padding-inline:var(--sd-spacing-3)}:host([size=lg].sd-7-0-0-next-7-button-group__button:not(.sd-7-0-0-next-7-button-group__button--first)){margin-inline-start:calc(var(--sd-spacing-3) * -1)}:host([size=md].sd-7-0-0-next-7-button-group__button:not(.sd-7-0-0-next-7-button-group__button--first)){margin-inline-start:calc(var(--sd-spacing-2) * -1)}:host([size=sm].sd-7-0-0-next-7-button-group__button:not(.sd-7-0-0-next-7-button-group__button--first)){margin-inline-start:calc(var(--sd-spacing-1) * -1)}:host(.sd-7-0-0-next-7-button-group__button--hover){z-index:20}:host(.sd-7-0-0-next-7-button-group__button--focus){z-index:30}:host(.sd-7-0-0-next-7-button-group__button[checked]){z-index:40}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}`
|
|
93
93
|
];
|
|
94
94
|
__decorateClass([
|
|
95
95
|
query(".button")
|
|
@@ -119,7 +119,7 @@ __decorateClass([
|
|
|
119
119
|
watch(["disabled", "visually-disabled"], { waitUntilFirstUpdate: true })
|
|
120
120
|
], SdRadioButton.prototype, "handleDisabledChange", 1);
|
|
121
121
|
SdRadioButton = __decorateClass([
|
|
122
|
-
customElement("sd-7-0-0-next-
|
|
122
|
+
customElement("sd-7-0-0-next-7-radio-button")
|
|
123
123
|
], SdRadioButton);
|
|
124
124
|
|
|
125
125
|
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-7-0-0-next-
|
|
28
|
+
* Syncs the disabled prop for all slotted sd-7-0-0-next-7-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-7-0-0-next-
|
|
32
|
+
this.defaultSlot.assignedElements().filter((opt) => opt.tagName.toLowerCase() === "sd-7-0-0-next-7-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-7-0-0-next-
|
|
41
|
+
return html`<div role="${disabled ? "presentation" : "group"}" class="${cx(this.disabled ? "text-neutral-500" : "")}" part="base" aria-labelledby="group-label"><sd-7-0-0-next-7-divider id="divider" class="pt-2 pb-4" part="divider"></sd-7-0-0-next-7-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 = [
|
|
@@ -59,7 +59,7 @@ __decorateClass([
|
|
|
59
59
|
watch("disabled", { waitUntilFirstUpdate: true })
|
|
60
60
|
], SdOptgroup.prototype, "handleDisabledChange", 1);
|
|
61
61
|
SdOptgroup = __decorateClass([
|
|
62
|
-
customElement("sd-7-0-0-next-
|
|
62
|
+
customElement("sd-7-0-0-next-7-optgroup")
|
|
63
63
|
], SdOptgroup);
|
|
64
64
|
|
|
65
65
|
export {
|
|
@@ -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-7-0-0-next-
|
|
132
|
+
(_c = oppositeButton == null ? void 0 : oppositeButton.querySelector("sd-7-0-0-next-7-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-7-0-0-next-
|
|
144
|
+
(_a = button.querySelector("sd-7-0-0-next-7-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-7-0-0-next-
|
|
161
|
+
)}"><button part="button-start" class="${cx(scrollButtonClasses)}" aria-hidden="${ifDefined(!this.canScroll.left || void 0)}" tabindex="${ifDefined(!this.canScroll.left ? -1 : void 0)}" @click="${(e) => this.handleScroll("left", e)}" @blur="${(e) => this.handleButtonBlur("left", e)}"><slot name="icon-start"><sd-7-0-0-next-7-icon library="_internal" name="chevron-up" class="rotate-[-90deg]" label="${this.localize.term("scrollToStart")}"></sd-7-0-0-next-7-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-7-0-0-next-
|
|
164
|
+
)}"><button part="button-end" class="${cx(scrollButtonClasses)}" aria-hidden="${ifDefined(!this.canScroll.right || void 0)}" tabindex="${ifDefined(!this.canScroll.right ? -1 : void 0)}" @click="${(e) => this.handleScroll("right", e)}" @blur="${(e) => this.handleButtonBlur("right", e)}"><slot name="icon-end"><sd-7-0-0-next-7-icon library="_internal" name="chevron-down" class="rotate-[-90deg]" label="${this.localize.term("scrollToEnd")}"></sd-7-0-0-next-7-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-7-0-0-next-
|
|
167
|
+
)}"><button part="button-start" class="${cx(scrollButtonClasses)}" aria-hidden="${ifDefined(!this.canScroll.up || void 0)}" tabindex="${ifDefined(!this.canScroll.up ? -1 : void 0)}" @click="${(e) => this.handleScroll("up", e)}" @blur="${(e) => this.handleButtonBlur("up", e)}"><slot name="icon-start"><sd-7-0-0-next-7-icon library="_internal" name="chevron-up" label="${this.localize.term("scrollToStart")}"></sd-7-0-0-next-7-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-7-0-0-next-
|
|
170
|
+
)}"><button part="button-end" class="${cx(scrollButtonClasses)}" aria-hidden="${ifDefined(!this.canScroll.down || void 0)}" tabindex="${ifDefined(!this.canScroll.down ? -1 : void 0)}" @click="${(e) => this.handleScroll("down", e)}" @blur="${(e) => this.handleButtonBlur("down", e)}"><slot name="icon-end"><sd-7-0-0-next-7-icon library="_internal" name="chevron-down" label="${this.localize.term("scrollToEnd")}"></sd-7-0-0-next-7-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.2 | 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-7-0-0-next-
|
|
192
|
+
:host{--gradient-color:transparent;--gradient:var(--gradient-color) 0%,rgba(var(--sd-color-background-white, rgba(var(--sd-color-white)))) 80%,rgba(var(--sd-color-background-white, rgba(var(--sd-color-white)))) 100%;position:relative;display:flex;overflow:hidden}.hide-scrollbars{scrollbar-width:none;-ms-overflow-style:none}.hide-scrollbars::-webkit-scrollbar{display:none}.scroll-container::-webkit-scrollbar-thumb{background-color:transparent}.scroll-container:hover::-webkit-scrollbar-thumb{background:var(--background-neutral-400,#c3c3c3);border-radius:var(--sd-radius-sm)}.scroll-container::-webkit-scrollbar{height:var(--sd-spacing-1);width:var(--sd-spacing-1)}.scroll-auto{overflow:auto}[part=button-left]{background:linear-gradient(270deg,var(--gradient))}[part=button-right]{background:linear-gradient(90deg,var(--gradient))}[part=button-top]{background:linear-gradient(0deg,var(--gradient))}[part=button-bottom]{background:linear-gradient(180deg,var(--gradient))}[part=shadow-left]{background:linear-gradient(270deg,transparent 50%,rgba(24,24,24,.4) 100%)}[part=shadow-right]{background:linear-gradient(90deg,transparent 50%,rgba(24,24,24,.4) 100%)}[part=shadow-top]{background:linear-gradient(0deg,transparent 50%,rgba(24,24,24,.4) 100%)}[part=shadow-bottom]{background:linear-gradient(180deg,transparent 50%,rgba(24,24,24,.4) 100%)}.sd-7-0-0-next-7-icon--top{align-self:flex-start}.sd-7-0-0-next-7-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-7-0-0-next-
|
|
240
|
+
customElement("sd-7-0-0-next-7-scrollable")
|
|
241
241
|
], SdScrollable);
|
|
242
242
|
|
|
243
243
|
export {
|
|
@@ -147,13 +147,13 @@ var SdDialog = class extends SolidElement {
|
|
|
147
147
|
return waitForEvent(this, "sd-after-hide");
|
|
148
148
|
}
|
|
149
149
|
render() {
|
|
150
|
-
return html`<sd-7-0-0-next-
|
|
150
|
+
return html`<sd-7-0-0-next-7-theme-listener></sd-7-0-0-next-7-theme-listener><dialog part="base" class="${cx(
|
|
151
151
|
"flex items-center justify-center p-0 m-auto bg-transparent border-none overflow-visible",
|
|
152
152
|
this.hasSlotController.test("footer") && "dialog--has-footer"
|
|
153
153
|
)}"><div part="overlay" class="fixed inset-0" @click="${() => this.requestClose("overlay")}"></div><div part="panel" class="${cx(
|
|
154
154
|
"panel-color-border border flex flex-col z-20 bg-white py-4 sm:py-8 relative gap-6 focus-visible:focus-outline-inverted overflow-y-auto",
|
|
155
155
|
this.open && "flex opacity-100"
|
|
156
|
-
)}" 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-7-0-0-next-
|
|
156
|
+
)}" 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-7-0-0-next-7-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-7-0-0-next-7-icon label="${this.localize.term("close")}" name="close" library="_internal" color="currentColor"></sd-7-0-0-next-7-icon></sd-7-0-0-next-7-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></dialog>`;
|
|
157
157
|
}
|
|
158
158
|
};
|
|
159
159
|
SdDialog.styles = [
|
|
@@ -183,7 +183,7 @@ __decorateClass([
|
|
|
183
183
|
watch("open", { waitUntilFirstUpdate: true })
|
|
184
184
|
], SdDialog.prototype, "handleOpenChange", 1);
|
|
185
185
|
SdDialog = __decorateClass([
|
|
186
|
-
customElement("sd-7-0-0-next-
|
|
186
|
+
customElement("sd-7-0-0-next-7-dialog")
|
|
187
187
|
], SdDialog);
|
|
188
188
|
setDefaultAnimation("dialog.show", {
|
|
189
189
|
keyframes: [
|
|
@@ -62,7 +62,7 @@ var SdStepGroup = class extends SolidElement {
|
|
|
62
62
|
});
|
|
63
63
|
}
|
|
64
64
|
getAllSteps() {
|
|
65
|
-
return [...this.body.assignedElements()].filter((el) => el.tagName.toLowerCase() === "sd-7-0-0-next-
|
|
65
|
+
return [...this.body.assignedElements()].filter((el) => el.tagName.toLowerCase() === "sd-7-0-0-next-7-step");
|
|
66
66
|
}
|
|
67
67
|
/**
|
|
68
68
|
* Sets the active step.
|
|
@@ -137,7 +137,7 @@ __decorateClass([
|
|
|
137
137
|
watch("notInteractive")
|
|
138
138
|
], SdStepGroup.prototype, "handleInteractivityChange", 1);
|
|
139
139
|
SdStepGroup = __decorateClass([
|
|
140
|
-
customElement("sd-7-0-0-next-
|
|
140
|
+
customElement("sd-7-0-0-next-7-step-group")
|
|
141
141
|
], SdStepGroup);
|
|
142
142
|
|
|
143
143
|
export {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
// src/components/combobox/utils.ts
|
|
2
2
|
var getAssignedElementsForSlot = (slot) => Array.from(slot.assignedElements({ flatten: true }));
|
|
3
|
-
var getOptionOrNestedOptions = (item) => item.tagName.toLocaleLowerCase() === "sd-7-0-0-next-
|
|
4
|
-
var isOptgroup = (item) => item.tagName.toLocaleLowerCase() === "sd-7-0-0-next-
|
|
3
|
+
var getOptionOrNestedOptions = (item) => item.tagName.toLocaleLowerCase() === "sd-7-0-0-next-7-option" ? item : Array.from(item.querySelectorAll(":scope > sd-7-0-0-next-7-option"));
|
|
4
|
+
var isOptgroup = (item) => item.tagName.toLocaleLowerCase() === "sd-7-0-0-next-7-optgroup";
|
|
5
5
|
var getAllOptions = (items) => items.map(getOptionOrNestedOptions);
|
|
6
6
|
var filterOnlyOptgroups = (items) => items.filter(isOptgroup);
|
|
7
7
|
var normalizeString = (str) => str.normalize("NFD").replace(/[\u0300-\u036f]/g, "").toLowerCase();
|
|
@@ -22,9 +22,9 @@ var SdBadge = class extends SolidElement {
|
|
|
22
22
|
"inline-flex items-center justify-center gap-x-[1px] text-center font-bold whitespace-nowrap border rounded-full select-none cursor-[inherit]",
|
|
23
23
|
{
|
|
24
24
|
/* variants */
|
|
25
|
-
blue: !this.inverted ? "text-white sd-7-0-0-next-
|
|
26
|
-
green: !this.inverted ? "text-white sd-7-0-0-next-
|
|
27
|
-
red: !this.inverted ? "text-white sd-7-0-0-next-
|
|
25
|
+
blue: !this.inverted ? "text-white sd-7-0-0-next-7-badge--blue-color-background border-white" : "sd-7-0-0-next-7-badge--blue--inverted-color-text sd-7-0-0-next-7-badge--blue--inverted-color-background sd-7-0-0-next-7-badge--inverted-color-border",
|
|
26
|
+
green: !this.inverted ? "text-white sd-7-0-0-next-7-badge--green-color-background border-white" : "sd-7-0-0-next-7-badge--green-color--inverted-text sd-7-0-0-next-7-badge--green-color--inverted-background sd-7-0-0-next-7-badge--inverted-color-border",
|
|
27
|
+
red: !this.inverted ? "text-white sd-7-0-0-next-7-badge--red-color-background border-white" : "sd-7-0-0-next-7-badge--red--inverted-text sd-7-0-0-next-7-badge--red--inverted-background sd-7-0-0-next-7-badge--inverted-color-border"
|
|
28
28
|
}[this.variant]
|
|
29
29
|
)}"><span id="content" part="content" class="${cx(this.size === "sm" && "sr-only")}"><slot></slot></span></span>`;
|
|
30
30
|
}
|
|
@@ -44,7 +44,7 @@ __decorateClass([
|
|
|
44
44
|
property({ type: Boolean, reflect: true })
|
|
45
45
|
], SdBadge.prototype, "inverted", 2);
|
|
46
46
|
SdBadge = __decorateClass([
|
|
47
|
-
customElement("sd-7-0-0-next-
|
|
47
|
+
customElement("sd-7-0-0-next-7-badge")
|
|
48
48
|
], SdBadge);
|
|
49
49
|
|
|
50
50
|
export {
|
|
@@ -53,7 +53,7 @@ SdThemeListener.styles = [
|
|
|
53
53
|
:host{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border-width:0}`
|
|
54
54
|
];
|
|
55
55
|
SdThemeListener = __decorateClass([
|
|
56
|
-
customElement("sd-7-0-0-next-
|
|
56
|
+
customElement("sd-7-0-0-next-7-theme-listener")
|
|
57
57
|
], SdThemeListener);
|
|
58
58
|
|
|
59
59
|
export {
|
|
@@ -100,7 +100,7 @@ var SdIcon = class extends SolidElement {
|
|
|
100
100
|
}
|
|
101
101
|
}
|
|
102
102
|
render() {
|
|
103
|
-
return html`<sd-7-0-0-next-
|
|
103
|
+
return html`<sd-7-0-0-next-7-theme-listener></sd-7-0-0-next-7-theme-listener>${unsafeSVG(this.svg)}`;
|
|
104
104
|
}
|
|
105
105
|
};
|
|
106
106
|
SdIcon.styles = [
|
|
@@ -133,7 +133,7 @@ __decorateClass([
|
|
|
133
133
|
watch(["name", "src", "library"])
|
|
134
134
|
], SdIcon.prototype, "setIcon", 1);
|
|
135
135
|
SdIcon = __decorateClass([
|
|
136
|
-
customElement("sd-7-0-0-next-
|
|
136
|
+
customElement("sd-7-0-0-next-7-icon")
|
|
137
137
|
], SdIcon);
|
|
138
138
|
|
|
139
139
|
export {
|
|
@@ -64,7 +64,7 @@ var SdCarousel = class extends SolidElement {
|
|
|
64
64
|
if (!this.isFocused) this.next();
|
|
65
65
|
});
|
|
66
66
|
this.scrollController = new ScrollController(this);
|
|
67
|
-
this.slides = this.getElementsByTagName("sd-7-0-0-next-
|
|
67
|
+
this.slides = this.getElementsByTagName("sd-7-0-0-next-7-carousel-item");
|
|
68
68
|
// determines which slide is displayed
|
|
69
69
|
// A map containing the state of all the slides
|
|
70
70
|
this.intersectionObserverEntries = /* @__PURE__ */ new Map();
|
|
@@ -476,7 +476,7 @@ var SdCarousel = class extends SolidElement {
|
|
|
476
476
|
if (e.detail) {
|
|
477
477
|
this.autoplayControls.blur();
|
|
478
478
|
}
|
|
479
|
-
}}"><slot name="autoplay-start" class="${cx(!this.pausedAutoplay ? "hidden" : "")}"><sd-7-0-0-next-
|
|
479
|
+
}}"><slot name="autoplay-start" class="${cx(!this.pausedAutoplay ? "hidden" : "")}"><sd-7-0-0-next-7-icon class="h-6 w-6 grid place-items-center" library="_internal" name="start"></sd-7-0-0-next-7-icon></slot><slot name="autoplay-pause" class="${cx(this.pausedAutoplay ? "hidden" : "")}"><sd-7-0-0-next-7-icon class="h-6 w-6 grid place-items-center" library="_internal" name="pause"></sd-7-0-0-next-7-icon></slot></button><div class="carousel__announcement sr-only" aria-live="${!this.autoplay || this.pausedAutoplay || this.isFocused ? "polite" : "off"}" aria-atomic="true"></div><div id="scroll-container" part="scroll-container" class="${cx(
|
|
480
480
|
`carousel__slides mb-6 max-h-full w-full items-center justify-items-center`,
|
|
481
481
|
this.inverted ? "focus-visible:focus-outline-inverted" : "focus-visible:focus-outline",
|
|
482
482
|
this.fade ? "relative overflow-hidden" : `grid overflow-auto overscroll-x-contain grid-flow-col auto-rows-[100%] snap-x snap-mandatory overflow-y-hidden`
|
|
@@ -490,7 +490,7 @@ var SdCarousel = class extends SolidElement {
|
|
|
490
490
|
)}" aria-label="${this.localize.term("previousSlide")}" aria-controls="scroll-container" aria-disabled="${prevEnabled ? "false" : "true"}" @click="${prevEnabled ? (e) => {
|
|
491
491
|
this.previous();
|
|
492
492
|
this.unblockAutoplay(e, this.previousButton);
|
|
493
|
-
} : null}"><slot name="previous-icon"><sd-7-0-0-next-
|
|
493
|
+
} : null}"><slot name="previous-icon"><sd-7-0-0-next-7-icon class="${cx("h-6 w-6 rotate-90 grid place-items-center")}" library="_internal" name="${isLtr ? "chevron-down" : "chevron-up"}"></sd-7-0-0-next-7-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) => {
|
|
494
494
|
const isActive = index + 1 === currentPage;
|
|
495
495
|
return html`<button part="pagination-item ${isActive ? "pagination-item--active" : ""}" class="${cx(
|
|
496
496
|
"carousel__pagination-item",
|
|
@@ -501,14 +501,14 @@ var SdCarousel = class extends SolidElement {
|
|
|
501
501
|
this.goToSlide(index * slidesPerMove);
|
|
502
502
|
this.unblockAutoplay(e, this.paginationItems[index]);
|
|
503
503
|
}}"><span class="${cx(
|
|
504
|
-
"h-4 w-4 block border sd-7-0-0-next-
|
|
505
|
-
this.inverted ? "sd-7-0-0-next-
|
|
504
|
+
"h-4 w-4 block border sd-7-0-0-next-7-carousel__pager-dot-border-width rounded-full transition-colors duration-slow hover:duration-fast ease-in-out",
|
|
505
|
+
this.inverted ? "sd-7-0-0-next-7-carousel__pager-dot--inverted-border hover:border-primary-200" : "border-primary hover:border-primary-500",
|
|
506
506
|
isActive && "border-none",
|
|
507
|
-
isActive ? this.inverted ? "sd-7-0-0-next-
|
|
507
|
+
isActive ? this.inverted ? "sd-7-0-0-next-7-carousel__pager-dot--inverted-background hover:sd-7-0-0-next-7-carousel__pager-dot--inverted--hovered-background" : "sd-7-0-0-next-7-carousel__pager-dot-background hover:bg-accent-550" : ""
|
|
508
508
|
)}"></span></button>`;
|
|
509
509
|
})}</div>` : html`<span part="pagination-number" class="carousel__pagination number flex gap-0.5 cursor-default select-none" aria-controls="scroll-container"><span part="pagination-item" class="${cx(
|
|
510
510
|
"w-5 text-center border-b-2",
|
|
511
|
-
this.inverted ? "text-white sd-7-0-0-next-
|
|
511
|
+
this.inverted ? "text-white sd-7-0-0-next-7-carousel--active--inverted-color-border" : "text-black sd-7-0-0-next-7-carousel--active-color-border"
|
|
512
512
|
)}">${currentPage}</span> <span part="pagination-divider" class="${cx("scale-y-[1.5]", "text-center", this.inverted ? "text-white" : "text-black")}">/</span> <span part="pagination-item" class="${cx("w-5 text-center", this.inverted ? "text-white" : "text-black")}">${pagesCount}</span></span>`} <button part="navigation-button navigation-button--next" id="carousel__navigation-button--next" ?disabled="${!nextEnabled ? true : false}" class="${cx(
|
|
513
513
|
"!ml-6 !rounded-sm sd-interactive transition-colors duration-fast ease-in-out",
|
|
514
514
|
!nextEnabled && "sd-interactive--disabled",
|
|
@@ -516,13 +516,13 @@ var SdCarousel = class extends SolidElement {
|
|
|
516
516
|
)}" aria-label="${this.localize.term("nextSlide")}" aria-controls="scroll-container" aria-disabled="${nextEnabled ? "false" : "true"}" @click="${nextEnabled ? (e) => {
|
|
517
517
|
this.next();
|
|
518
518
|
this.unblockAutoplay(e, this.nextButton);
|
|
519
|
-
} : null}"><slot name="next-icon"><sd-7-0-0-next-
|
|
519
|
+
} : null}"><slot name="next-icon"><sd-7-0-0-next-7-icon class="${cx("h-6 w-6 rotate-90 grid place-items-center")}" library="_internal" name="${isLtr ? "chevron-up" : "chevron-down"}"></sd-7-0-0-next-7-icon></slot></button></div></div></div>`;
|
|
520
520
|
}
|
|
521
521
|
};
|
|
522
522
|
SdCarousel.styles = [
|
|
523
523
|
...SolidElement.styles,
|
|
524
524
|
css`/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
|
|
525
|
-
:host{--slide-gap:var(--sl-spacing-medium, 1rem);--scroll-hint:0px;display:flex}.carousel{grid-template-areas:'. slides .' '. pagination .'}.carousel__pagination{grid-area:pagination}.carousel__slides{grid-area:slides;scrollbar-width:none;--slide-size:calc((100% - (var(--slides-per-page) - 1) * var(--slide-gap)) / var(--slides-per-page));grid-auto-columns:var(--slide-size);-moz-column-gap:var(--slide-gap);column-gap:var(--slide-gap);scroll-padding-inline:var(--scroll-hint);padding-inline:var(--scroll-hint)}.carousel__slides::-webkit-scrollbar{display:none}[part=autoplay-controls]{z-index:1}:host([fade]){--carousel-height:auto}:host([fade]) .carousel__slides{position:relative;display:block;overflow:hidden;height:var(--carousel-height)}@media (prefers-reduced-motion){:where(.carousel__slides){scroll-behavior:auto}}.carousel__navigation{grid-area:navigation}sd-7-0-0-next-
|
|
525
|
+
:host{--slide-gap:var(--sl-spacing-medium, 1rem);--scroll-hint:0px;display:flex}.carousel{grid-template-areas:'. slides .' '. pagination .'}.carousel__pagination{grid-area:pagination}.carousel__slides{grid-area:slides;scrollbar-width:none;--slide-size:calc((100% - (var(--slides-per-page) - 1) * var(--slide-gap)) / var(--slides-per-page));grid-auto-columns:var(--slide-size);-moz-column-gap:var(--slide-gap);column-gap:var(--slide-gap);scroll-padding-inline:var(--scroll-hint);padding-inline:var(--scroll-hint)}.carousel__slides::-webkit-scrollbar{display:none}[part=autoplay-controls]{z-index:1}:host([fade]){--carousel-height:auto}:host([fade]) .carousel__slides{position:relative;display:block;overflow:hidden;height:var(--carousel-height)}@media (prefers-reduced-motion){:where(.carousel__slides){scroll-behavior:auto}}.carousel__navigation{grid-area:navigation}sd-7-0-0-next-7-button::part(label){pointer-events:none;display:flex;flex:auto;align-items:center}`
|
|
526
526
|
];
|
|
527
527
|
__decorateClass([
|
|
528
528
|
query('[part~="autoplay-controls"]')
|
|
@@ -607,7 +607,7 @@ __decorateClass([
|
|
|
607
607
|
watch("autoplayInterval")
|
|
608
608
|
], SdCarousel.prototype, "handleautoplayIntervalChange", 1);
|
|
609
609
|
SdCarousel = __decorateClass([
|
|
610
|
-
customElement("sd-7-0-0-next-
|
|
610
|
+
customElement("sd-7-0-0-next-7-carousel")
|
|
611
611
|
], SdCarousel);
|
|
612
612
|
|
|
613
613
|
export {
|
|
@@ -112,14 +112,14 @@ var SdSwitch = class extends SolidElement {
|
|
|
112
112
|
"group flex items-center text-base leading-normal text-black cursor-pointer",
|
|
113
113
|
this.disabled && "hover:cursor-not-allowed"
|
|
114
114
|
)}"><input id="input" class="peer absolute opacity-0 p-0 m-0 pointer-events-none" type="checkbox" role="switch" title="${this.title}" name="${this.name}" value="${ifDefined(this.value)}" .checked="${live(this.checked)}" .disabled="${this.disabled}" .required="${this.required}" aria-checked="${this.checked ? "true" : "false"}" aria-invalid="${this.showInvalidStyle}" aria-describedby="invalid-message" @click="${this.handleClick}" @input="${this.handleInput}" @invalid="${this.handleInvalid}" @blur="${this.handleBlur}" @focus="${this.handleFocus}"> <span id="control" part="control ${this.checked ? " control--checked" : "control--unchecked"}" class="${cx(
|
|
115
|
-
`relative flex flex-initial items-center justify-center sd-7-0-0-next-
|
|
115
|
+
`relative flex flex-initial items-center justify-center sd-7-0-0-next-7-switch-border-width rounded-full h-4 w-8 transition-colors ease duration-100
|
|
116
116
|
peer-focus-visible:outline peer-focus-visible:outline-2 peer-focus-visible:outline-offset-2
|
|
117
117
|
peer-focus-visible:outline-primary outline-transparent transition-colors ease-in-out duration-medium hover:duration-fast`,
|
|
118
|
-
this.disabled && this.checked ? "bg-neutral-500" : this.disabled ? "border-neutral-500" : this.showInvalidStyle ? this.checked ? "border-error bg-error hover:bg-error-400 hover:border-error-400 group-hover:border-error-400 group-hover:bg-error-400" : "border-error bg-white hover:border-error-400 hover:bg-white group-hover:border-error-400 group-hover:bg-white" : this.checked ? "border-accent hover:sd-7-0-0-next-
|
|
118
|
+
this.disabled && this.checked ? "bg-neutral-500" : this.disabled ? "border-neutral-500" : this.showInvalidStyle ? this.checked ? "border-error bg-error hover:bg-error-400 hover:border-error-400 group-hover:border-error-400 group-hover:bg-error-400" : "border-error bg-white hover:border-error-400 hover:bg-white group-hover:border-error-400 group-hover:bg-white" : this.checked ? "border-accent hover:sd-7-0-0-next-7-switch--checked--hover-color-background bg-accent hover:border-accent-550 group-hover:border-accent-550 group-hover:sd-7-0-0-next-7-switch--checked--hover-color-background" : "sd-7-0-0-next-7-switch--unchecked-color-border bg-white hover:sd-7-0-0-next-7-switch--unchecked--hover-color-background group-hover:sd-7-0-0-next-7-switch--unchecked--hover-color-background"
|
|
119
119
|
)}"><span id="thumb" part="thumb" class="${cx(
|
|
120
120
|
"w-2.5 h-2.5 rounded-full transition[transform,colors] ease-in-out duration-medium",
|
|
121
|
-
this.disabled && this.checked ? "translate-x-2" : this.disabled ? "-translate-x-2" : this.showInvalidStyle ? this.checked ? "translate-x-2" : "bg-error -translate-x-2 hover:bg-error-400 hover:border-error-400 group-hover:border-error-400 group-hover:bg-error-400" : this.checked ? "translate-x-2" : "-translate-x-2 sd-7-0-0-next-
|
|
122
|
-
)}"></span> </span><span part="label" id="label" class="${cx("select-none inline-block ml-2", this.disabled ? "text-neutral-500" : "sd-7-0-0-next-
|
|
121
|
+
this.disabled && this.checked ? "translate-x-2" : this.disabled ? "-translate-x-2" : this.showInvalidStyle ? this.checked ? "translate-x-2" : "bg-error -translate-x-2 hover:bg-error-400 hover:border-error-400 group-hover:border-error-400 group-hover:bg-error-400" : this.checked ? "translate-x-2" : "-translate-x-2 sd-7-0-0-next-7-switch--unchecked__icon-color-background"
|
|
122
|
+
)}"></span> </span><span part="label" id="label" class="${cx("select-none inline-block ml-2", this.disabled ? "text-neutral-500" : "sd-7-0-0-next-7-switch-color-text")}"><slot></slot></span></label> ${this.hasSlotController.test("tooltip") ? html`<slot name="tooltip"></slot>` : null}</div><div part="invalid-icon-message" class="flex items-center gap-2 mt-2">${this.showInvalidStyle ? html`<sd-7-0-0-next-7-icon part="invalid-icon" class="${cx("text-error")}" library="_internal" name="risk"></sd-7-0-0-next-7-icon>` : ""} ${this.formControlController.renderInvalidMessage("lg")}</div>`;
|
|
123
123
|
}
|
|
124
124
|
};
|
|
125
125
|
/**
|
|
@@ -170,7 +170,7 @@ __decorateClass([
|
|
|
170
170
|
watch(["checked"], { waitUntilFirstUpdate: true })
|
|
171
171
|
], SdSwitch.prototype, "handleStateChange", 1);
|
|
172
172
|
SdSwitch = __decorateClass([
|
|
173
|
-
customElement("sd-7-0-0-next-
|
|
173
|
+
customElement("sd-7-0-0-next-7-switch")
|
|
174
174
|
], SdSwitch);
|
|
175
175
|
|
|
176
176
|
export {
|
|
@@ -17,19 +17,19 @@ var SdButtonGroup = class extends SolidElement {
|
|
|
17
17
|
}
|
|
18
18
|
handleFocus(event) {
|
|
19
19
|
const button = findButton(event.target);
|
|
20
|
-
button == null ? void 0 : button.classList.add("sd-7-0-0-next-
|
|
20
|
+
button == null ? void 0 : button.classList.add("sd-7-0-0-next-7-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-7-0-0-next-
|
|
24
|
+
button == null ? void 0 : button.classList.remove("sd-7-0-0-next-7-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-7-0-0-next-
|
|
28
|
+
button == null ? void 0 : button.classList.add("sd-7-0-0-next-7-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-7-0-0-next-
|
|
32
|
+
button == null ? void 0 : button.classList.remove("sd-7-0-0-next-7-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-7-0-0-next-
|
|
41
|
-
button.classList.toggle("sd-7-0-0-next-
|
|
42
|
-
button.classList.toggle("sd-7-0-0-next-
|
|
43
|
-
button.classList.toggle("sd-7-0-0-next-
|
|
44
|
-
button.classList.toggle("sd-7-0-0-next-
|
|
40
|
+
button.classList.add("sd-7-0-0-next-7-button-group__button");
|
|
41
|
+
button.classList.toggle("sd-7-0-0-next-7-button-group__button--first", index === 0);
|
|
42
|
+
button.classList.toggle("sd-7-0-0-next-7-button-group__button--inner", index > 0 && index < slottedElements.length - 1);
|
|
43
|
+
button.classList.toggle("sd-7-0-0-next-7-button-group__button--last", index === slottedElements.length - 1);
|
|
44
|
+
button.classList.toggle("sd-7-0-0-next-7-button-group__button--radio", button.tagName.toLowerCase() === "sd-7-0-0-next-7-radio-button");
|
|
45
45
|
}
|
|
46
46
|
});
|
|
47
47
|
}
|
|
@@ -64,11 +64,11 @@ __decorateClass([
|
|
|
64
64
|
property({ type: String, reflect: true })
|
|
65
65
|
], SdButtonGroup.prototype, "label", 2);
|
|
66
66
|
SdButtonGroup = __decorateClass([
|
|
67
|
-
customElement("sd-7-0-0-next-
|
|
67
|
+
customElement("sd-7-0-0-next-7-button-group")
|
|
68
68
|
], SdButtonGroup);
|
|
69
69
|
function findButton(el) {
|
|
70
70
|
var _a;
|
|
71
|
-
const selector = "sd-7-0-0-next-
|
|
71
|
+
const selector = "sd-7-0-0-next-7-button, sd-7-0-0-next-7-radio-button";
|
|
72
72
|
return (_a = el.closest(selector)) != null ? _a : el.querySelector(selector);
|
|
73
73
|
}
|
|
74
74
|
|
|
@@ -91,14 +91,14 @@ var SdOption = class extends SolidElement {
|
|
|
91
91
|
this.disabled && "border-neutral-500 top-1",
|
|
92
92
|
!this.disabled && this.hasHover ? "h-full top-0" : "top-1"
|
|
93
93
|
)}"></span> ${this.checkbox ? html`<span id="control" part="control ${this.selected ? " control--checked" : "control--unchecked"}" class="${cx(
|
|
94
|
-
"relative flex flex-shrink-0 items-center justify-center border sd-7-0-0-next-
|
|
94
|
+
"relative flex flex-shrink-0 items-center justify-center border sd-7-0-0-next-7-checkbox-border-width rounded-sm h-4 w-4 mr-2",
|
|
95
95
|
{
|
|
96
96
|
sm: "mt-0.5",
|
|
97
97
|
md: "mt-1",
|
|
98
98
|
lg: "mt-1"
|
|
99
99
|
}[this.size],
|
|
100
|
-
this.disabled ? "sd-7-0-0-next-
|
|
101
|
-
)}">${this.selected ? html`<sd-7-0-0-next-
|
|
100
|
+
this.disabled ? "sd-7-0-0-next-7-option--disabled-color-border" : this.selected ? "bg-accent border-accent" : "bg-white form-control-color-border"
|
|
101
|
+
)}">${this.selected ? html`<sd-7-0-0-next-7-icon part="checked-icon" class="text-white w-3 h-3" library="_internal" name="status-check"></sd-7-0-0-next-7-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>`;
|
|
102
102
|
}
|
|
103
103
|
};
|
|
104
104
|
/**
|
|
@@ -107,7 +107,7 @@ var SdOption = class extends SolidElement {
|
|
|
107
107
|
SdOption.styles = [
|
|
108
108
|
...SolidElement.styles,
|
|
109
109
|
css`/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
|
|
110
|
-
:host{position:relative;display:block;width:100%;--tw-outline-style:none!important;outline-style:none!important}.focus-outline-offset{outline-offset:-2px}.sd-7-0-0-next-
|
|
110
|
+
:host{position:relative;display:block;width:100%;--tw-outline-style:none!important;outline-style:none!important}.focus-outline-offset{outline-offset:-2px}.sd-7-0-0-next-7-option--disabled-color-border{border-color:rgb(var(--sd-option--disabled-color-border))}`
|
|
111
111
|
];
|
|
112
112
|
__decorateClass([
|
|
113
113
|
query('[part="base"]')
|
|
@@ -146,7 +146,7 @@ __decorateClass([
|
|
|
146
146
|
watch("value")
|
|
147
147
|
], SdOption.prototype, "handleValueChange", 1);
|
|
148
148
|
SdOption = __decorateClass([
|
|
149
|
-
customElement("sd-7-0-0-next-
|
|
149
|
+
customElement("sd-7-0-0-next-7-option")
|
|
150
150
|
], SdOption);
|
|
151
151
|
|
|
152
152
|
export {
|