@solid-design-system/components 6.8.0 → 6.9.0
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.V4FZAAD4.js → chunk.MV77IJ5K.js} +4 -4
- package/cdn/components/combobox/combobox.js +1 -1
- package/cdn/custom-elements.json +1 -1
- package/cdn/solid-components.bundle.js +1 -1
- package/cdn/solid-components.iife.js +1 -1
- package/cdn/solid-components.js +1 -1
- package/cdn/web-types.json +1 -1
- package/cdn-versioned/chunks/chunk.25DRFJMC.js +2 -2
- package/cdn-versioned/chunks/chunk.2TRMFN6U.js +2 -2
- package/cdn-versioned/chunks/chunk.2VGJBR73.js +2 -2
- package/cdn-versioned/chunks/chunk.34BRLWBM.js +3 -3
- package/cdn-versioned/chunks/chunk.3M4RKO34.js +2 -2
- package/cdn-versioned/chunks/chunk.3VYZIXD7.js +2 -2
- package/cdn-versioned/chunks/chunk.3YATPZKE.js +1 -1
- package/cdn-versioned/chunks/chunk.4AR6H2QH.js +2 -2
- package/cdn-versioned/chunks/chunk.4BMBQGU3.js +2 -2
- package/cdn-versioned/chunks/chunk.4NKCD6HL.js +2 -2
- package/cdn-versioned/chunks/chunk.4YNC3XSD.js +2 -2
- package/cdn-versioned/chunks/chunk.6MUTKG7S.js +2 -2
- package/cdn-versioned/chunks/chunk.6UVLIGA7.js +1 -1
- package/cdn-versioned/chunks/chunk.6WZKUQIK.js +2 -2
- package/cdn-versioned/chunks/chunk.AAJIGG4R.js +2 -2
- package/cdn-versioned/chunks/chunk.AX6IEBJ2.js +2 -2
- package/cdn-versioned/chunks/chunk.B35GXAKI.js +1 -1
- package/cdn-versioned/chunks/chunk.CRLGS4QF.js +1 -1
- package/cdn-versioned/chunks/chunk.DLO5GMBQ.js +2 -2
- package/cdn-versioned/chunks/chunk.DTAYHASV.js +2 -2
- package/cdn-versioned/chunks/chunk.EDWO5QHC.js +2 -2
- package/cdn-versioned/chunks/chunk.EFO4PKGN.js +2 -2
- package/cdn-versioned/chunks/chunk.G4KULB76.js +2 -2
- package/cdn-versioned/chunks/chunk.GEGKRESG.js +1 -1
- package/cdn-versioned/chunks/chunk.GIP7V3SN.js +2 -2
- package/cdn-versioned/chunks/chunk.H3DQRUKN.js +2 -2
- package/cdn-versioned/chunks/chunk.HE5IYQC2.js +2 -2
- package/cdn-versioned/chunks/chunk.JAV26Y4S.js +2 -2
- package/cdn-versioned/chunks/chunk.JSZK2BUE.js +2 -2
- package/cdn-versioned/chunks/chunk.LBHLY2UU.js +2 -2
- package/cdn-versioned/chunks/chunk.LYNWHGS3.js +2 -2
- package/cdn-versioned/chunks/{chunk.V4FZAAD4.js → chunk.MV77IJ5K.js} +5 -5
- package/cdn-versioned/chunks/chunk.N3QINXLL.js +2 -2
- package/cdn-versioned/chunks/chunk.N7SVA6X3.js +2 -2
- package/cdn-versioned/chunks/chunk.NBPJQ3OT.js +2 -2
- package/cdn-versioned/chunks/chunk.O3ECZ2CR.js +1 -1
- package/cdn-versioned/chunks/chunk.O7PJIDMP.js +2 -2
- package/cdn-versioned/chunks/chunk.OJA4LU7S.js +2 -2
- package/cdn-versioned/chunks/chunk.PPLEJM75.js +1 -1
- package/cdn-versioned/chunks/chunk.PPUIAWDA.js +1 -1
- package/cdn-versioned/chunks/chunk.PWJSPZBR.js +3 -3
- package/cdn-versioned/chunks/chunk.RAP66B6O.js +1 -1
- package/cdn-versioned/chunks/chunk.RXKIZ2UI.js +2 -2
- package/cdn-versioned/chunks/chunk.RZLPP7DP.js +2 -2
- package/cdn-versioned/chunks/chunk.SA5SIXVH.js +1 -1
- package/cdn-versioned/chunks/chunk.TEPKQR4P.js +5 -5
- package/cdn-versioned/chunks/chunk.TJA62EZW.js +2 -2
- package/cdn-versioned/chunks/chunk.TJZECQLN.js +2 -2
- package/cdn-versioned/chunks/chunk.TTU2AZHQ.js +2 -2
- package/cdn-versioned/chunks/chunk.V6TDPNCR.js +2 -2
- package/cdn-versioned/chunks/chunk.VKDXPIJT.js +2 -2
- package/cdn-versioned/chunks/chunk.VQBTMNY2.js +2 -2
- package/cdn-versioned/chunks/chunk.VTXEZEW4.js +9 -9
- package/cdn-versioned/chunks/chunk.VZJMYD3T.js +2 -2
- package/cdn-versioned/chunks/chunk.W2WCYRB2.js +2 -2
- package/cdn-versioned/chunks/chunk.W7A3TU2Z.js +1 -1
- package/cdn-versioned/chunks/chunk.WRCC4UIS.js +2 -2
- package/cdn-versioned/chunks/chunk.WXRHAPLA.js +1 -1
- package/cdn-versioned/chunks/chunk.XFHFUV4B.js +1 -1
- package/cdn-versioned/chunks/chunk.YAIU6HLJ.js +2 -2
- package/cdn-versioned/chunks/chunk.YPTZDABK.js +1 -1
- package/cdn-versioned/chunks/chunk.ZBAP3VO3.js +2 -2
- package/cdn-versioned/chunks/chunk.ZDHTVWJF.js +1 -1
- package/cdn-versioned/chunks/chunk.ZVCMF6VL.js +2 -2
- package/cdn-versioned/components/accordion/accordion.d.ts +1 -1
- package/cdn-versioned/components/accordion-group/accordion-group.d.ts +1 -1
- package/cdn-versioned/components/animation/animation.d.ts +1 -1
- package/cdn-versioned/components/audio/audio.d.ts +1 -1
- package/cdn-versioned/components/badge/badge.d.ts +1 -1
- package/cdn-versioned/components/brandshape/brandshape.d.ts +1 -1
- package/cdn-versioned/components/breadcrumb/breadcrumb.d.ts +1 -1
- package/cdn-versioned/components/breadcrumb-item/breadcrumb-item.d.ts +1 -1
- package/cdn-versioned/components/button/button.d.ts +1 -1
- package/cdn-versioned/components/button-group/button-group.d.ts +1 -1
- package/cdn-versioned/components/carousel/carousel.d.ts +1 -1
- package/cdn-versioned/components/carousel-item/carousel-item.d.ts +1 -1
- package/cdn-versioned/components/checkbox/checkbox.d.ts +1 -1
- package/cdn-versioned/components/checkbox-group/checkbox-group.d.ts +1 -1
- package/cdn-versioned/components/combobox/combobox.d.ts +1 -1
- package/cdn-versioned/components/combobox/combobox.js +1 -1
- package/cdn-versioned/components/datepicker/datepicker.d.ts +1 -1
- package/cdn-versioned/components/dialog/dialog.d.ts +1 -1
- package/cdn-versioned/components/divider/divider.d.ts +1 -1
- package/cdn-versioned/components/drawer/drawer.d.ts +1 -1
- package/cdn-versioned/components/dropdown/dropdown.d.ts +1 -1
- package/cdn-versioned/components/expandable/expandable.d.ts +1 -1
- package/cdn-versioned/components/flipcard/flipcard.d.ts +1 -1
- package/cdn-versioned/components/header/header.d.ts +1 -1
- package/cdn-versioned/components/icon/icon.d.ts +1 -1
- package/cdn-versioned/components/include/include.d.ts +1 -1
- package/cdn-versioned/components/input/input.d.ts +1 -1
- package/cdn-versioned/components/link/link.d.ts +1 -1
- package/cdn-versioned/components/loader/loader.d.ts +1 -1
- package/cdn-versioned/components/map-marker/map-marker.d.ts +1 -1
- package/cdn-versioned/components/menu/menu.d.ts +1 -1
- package/cdn-versioned/components/menu-item/menu-item.d.ts +1 -1
- package/cdn-versioned/components/navigation-item/navigation-item.d.ts +1 -1
- package/cdn-versioned/components/notification/notification.d.ts +1 -1
- package/cdn-versioned/components/optgroup/optgroup.d.ts +1 -1
- package/cdn-versioned/components/option/option.d.ts +1 -1
- package/cdn-versioned/components/popup/popup.d.ts +1 -1
- package/cdn-versioned/components/quickfact/quickfact.d.ts +1 -1
- package/cdn-versioned/components/radio/radio.d.ts +1 -1
- package/cdn-versioned/components/radio-button/radio-button.d.ts +1 -1
- package/cdn-versioned/components/radio-group/radio-group.d.ts +1 -1
- package/cdn-versioned/components/range/range.d.ts +1 -1
- package/cdn-versioned/components/range-tick/range-tick.d.ts +1 -1
- package/cdn-versioned/components/scrollable/scrollable.d.ts +1 -1
- package/cdn-versioned/components/select/select.d.ts +1 -1
- package/cdn-versioned/components/skeleton/skeleton.d.ts +1 -1
- package/cdn-versioned/components/spinner/spinner.d.ts +1 -1
- package/cdn-versioned/components/step/step.d.ts +1 -1
- package/cdn-versioned/components/step-group/step-group.d.ts +1 -1
- package/cdn-versioned/components/switch/switch.d.ts +1 -1
- package/cdn-versioned/components/tab/tab.d.ts +1 -1
- package/cdn-versioned/components/tab-group/tab-group.d.ts +1 -1
- package/cdn-versioned/components/tab-panel/tab-panel.d.ts +1 -1
- package/cdn-versioned/components/tag/tag.d.ts +1 -1
- package/cdn-versioned/components/textarea/textarea.d.ts +1 -1
- package/cdn-versioned/components/theme-listener/theme-listener.d.ts +1 -1
- package/cdn-versioned/components/tooltip/tooltip.d.ts +1 -1
- package/cdn-versioned/components/video/video.d.ts +1 -1
- package/cdn-versioned/custom-elements.json +244 -244
- package/cdn-versioned/internal/form.js +3 -3
- package/cdn-versioned/solid-components.bundle.js +80 -80
- package/cdn-versioned/solid-components.css +2 -2
- package/cdn-versioned/solid-components.iife.js +80 -80
- package/cdn-versioned/solid-components.js +1 -1
- package/cdn-versioned/vscode.html-custom-data.json +94 -94
- package/cdn-versioned/web-types.json +157 -157
- package/dist/chunks/{chunk.JKCYKEO5.js → chunk.DJEWCXYR.js} +4 -0
- package/dist/components/combobox/combobox.js +1 -1
- package/dist/custom-elements.json +1 -1
- package/dist/solid-components.js +1 -1
- package/dist/web-types.json +1 -1
- package/dist-versioned/chunks/chunk.2AIOG6MZ.js +1 -1
- package/dist-versioned/chunks/chunk.3AXFD44E.js +1 -1
- package/dist-versioned/chunks/chunk.47VYEPC7.js +5 -5
- package/dist-versioned/chunks/chunk.55DM73XI.js +1 -1
- package/dist-versioned/chunks/chunk.5MCEFEDU.js +2 -2
- package/dist-versioned/chunks/chunk.5MPE743H.js +4 -4
- package/dist-versioned/chunks/chunk.5OTIJW46.js +12 -12
- package/dist-versioned/chunks/chunk.5RQUMMVO.js +28 -28
- package/dist-versioned/chunks/chunk.5X6LFFKU.js +1 -1
- package/dist-versioned/chunks/chunk.B3QW57TB.js +26 -26
- package/dist-versioned/chunks/chunk.B5JP55MU.js +4 -4
- package/dist-versioned/chunks/chunk.C3WIBDGG.js +3 -3
- package/dist-versioned/chunks/chunk.CGIINI3U.js +2 -2
- package/dist-versioned/chunks/chunk.CPWWEXBN.js +14 -14
- package/dist-versioned/chunks/chunk.CTTLYNGB.js +5 -5
- package/dist-versioned/chunks/chunk.CYUQUE4B.js +2 -2
- package/dist-versioned/chunks/chunk.DILSJX2P.js +3 -3
- package/dist-versioned/chunks/{chunk.JKCYKEO5.js → chunk.DJEWCXYR.js} +28 -24
- package/dist-versioned/chunks/chunk.DZ2VDJQR.js +8 -8
- package/dist-versioned/chunks/chunk.EJ7ZDGWQ.js +1 -1
- package/dist-versioned/chunks/chunk.F5SY46WN.js +5 -5
- package/dist-versioned/chunks/chunk.FCQKJZ3Q.js +3 -3
- package/dist-versioned/chunks/chunk.GHCI43SX.js +3 -3
- package/dist-versioned/chunks/chunk.GJQGI7TR.js +3 -3
- package/dist-versioned/chunks/chunk.GQ5YYHTD.js +4 -4
- package/dist-versioned/chunks/chunk.GRANIL4Q.js +6 -6
- package/dist-versioned/chunks/chunk.I53S7NHV.js +2 -2
- package/dist-versioned/chunks/chunk.IKVZ463R.js +3 -3
- package/dist-versioned/chunks/chunk.INHXFMS2.js +11 -11
- package/dist-versioned/chunks/chunk.IPCTQ6PF.js +4 -4
- package/dist-versioned/chunks/chunk.JQTAMOYF.js +2 -2
- package/dist-versioned/chunks/chunk.KCPMJRGB.js +2 -2
- package/dist-versioned/chunks/chunk.KEJFWGZI.js +4 -4
- package/dist-versioned/chunks/chunk.LIQBUDFE.js +1 -1
- package/dist-versioned/chunks/chunk.LZARRB2N.js +6 -6
- package/dist-versioned/chunks/chunk.MUI6ZGSD.js +1 -1
- package/dist-versioned/chunks/chunk.N6JFPCVN.js +1 -1
- package/dist-versioned/chunks/chunk.NHJ6T7AP.js +3 -3
- package/dist-versioned/chunks/chunk.NQSFAYCE.js +6 -6
- package/dist-versioned/chunks/chunk.OFV5F7EL.js +12 -12
- package/dist-versioned/chunks/chunk.PZQ6H5Y4.js +9 -9
- package/dist-versioned/chunks/chunk.PZYRZZ2R.js +3 -3
- package/dist-versioned/chunks/chunk.QFWRJIAT.js +1 -1
- package/dist-versioned/chunks/chunk.RBO5CDRH.js +8 -8
- package/dist-versioned/chunks/chunk.RKY7KPDX.js +3 -3
- package/dist-versioned/chunks/chunk.SMT5CXN7.js +5 -5
- package/dist-versioned/chunks/chunk.SNTZFQ72.js +5 -5
- package/dist-versioned/chunks/chunk.SNVCUPPA.js +2 -2
- package/dist-versioned/chunks/chunk.T3YIJ2AA.js +4 -4
- package/dist-versioned/chunks/chunk.U3G5KSOH.js +10 -10
- package/dist-versioned/chunks/chunk.UIQBHPD3.js +2 -2
- package/dist-versioned/chunks/chunk.UQT5XXVS.js +5 -5
- package/dist-versioned/chunks/chunk.V7GR76PZ.js +7 -7
- package/dist-versioned/chunks/chunk.VWORQHO2.js +4 -4
- package/dist-versioned/chunks/chunk.W5KWIGMY.js +8 -8
- package/dist-versioned/chunks/chunk.WFZUFPF7.js +2 -2
- package/dist-versioned/chunks/chunk.WRQJ6H5M.js +3 -3
- package/dist-versioned/chunks/chunk.XCFU7XC7.js +4 -4
- package/dist-versioned/chunks/chunk.XFYTZRFZ.js +2 -2
- package/dist-versioned/chunks/chunk.XPXDWU3H.js +1 -1
- package/dist-versioned/chunks/chunk.XRVF3H64.js +2 -2
- package/dist-versioned/chunks/chunk.XWLSRHC5.js +4 -4
- package/dist-versioned/chunks/chunk.Y5QCYID3.js +5 -5
- package/dist-versioned/chunks/chunk.ZNJFZAOB.js +4 -4
- package/dist-versioned/components/accordion/accordion.d.ts +1 -1
- package/dist-versioned/components/accordion-group/accordion-group.d.ts +1 -1
- package/dist-versioned/components/animation/animation.d.ts +1 -1
- package/dist-versioned/components/audio/audio.d.ts +1 -1
- package/dist-versioned/components/badge/badge.d.ts +1 -1
- package/dist-versioned/components/brandshape/brandshape.d.ts +1 -1
- package/dist-versioned/components/breadcrumb/breadcrumb.d.ts +1 -1
- package/dist-versioned/components/breadcrumb-item/breadcrumb-item.d.ts +1 -1
- package/dist-versioned/components/button/button.d.ts +1 -1
- package/dist-versioned/components/button-group/button-group.d.ts +1 -1
- package/dist-versioned/components/carousel/carousel.d.ts +1 -1
- package/dist-versioned/components/carousel-item/carousel-item.d.ts +1 -1
- package/dist-versioned/components/checkbox/checkbox.d.ts +1 -1
- package/dist-versioned/components/checkbox-group/checkbox-group.d.ts +1 -1
- package/dist-versioned/components/combobox/combobox.d.ts +1 -1
- package/dist-versioned/components/combobox/combobox.js +1 -1
- package/dist-versioned/components/datepicker/datepicker.d.ts +1 -1
- package/dist-versioned/components/dialog/dialog.d.ts +1 -1
- package/dist-versioned/components/divider/divider.d.ts +1 -1
- package/dist-versioned/components/drawer/drawer.d.ts +1 -1
- package/dist-versioned/components/dropdown/dropdown.d.ts +1 -1
- package/dist-versioned/components/expandable/expandable.d.ts +1 -1
- package/dist-versioned/components/flipcard/flipcard.d.ts +1 -1
- package/dist-versioned/components/header/header.d.ts +1 -1
- package/dist-versioned/components/icon/icon.d.ts +1 -1
- package/dist-versioned/components/include/include.d.ts +1 -1
- package/dist-versioned/components/input/input.d.ts +1 -1
- package/dist-versioned/components/link/link.d.ts +1 -1
- package/dist-versioned/components/loader/loader.d.ts +1 -1
- package/dist-versioned/components/map-marker/map-marker.d.ts +1 -1
- package/dist-versioned/components/menu/menu.d.ts +1 -1
- package/dist-versioned/components/menu-item/menu-item.d.ts +1 -1
- package/dist-versioned/components/navigation-item/navigation-item.d.ts +1 -1
- package/dist-versioned/components/notification/notification.d.ts +1 -1
- package/dist-versioned/components/optgroup/optgroup.d.ts +1 -1
- package/dist-versioned/components/option/option.d.ts +1 -1
- package/dist-versioned/components/popup/popup.d.ts +1 -1
- package/dist-versioned/components/quickfact/quickfact.d.ts +1 -1
- package/dist-versioned/components/radio/radio.d.ts +1 -1
- package/dist-versioned/components/radio-button/radio-button.d.ts +1 -1
- package/dist-versioned/components/radio-group/radio-group.d.ts +1 -1
- package/dist-versioned/components/range/range.d.ts +1 -1
- package/dist-versioned/components/range-tick/range-tick.d.ts +1 -1
- package/dist-versioned/components/scrollable/scrollable.d.ts +1 -1
- package/dist-versioned/components/select/select.d.ts +1 -1
- package/dist-versioned/components/skeleton/skeleton.d.ts +1 -1
- package/dist-versioned/components/spinner/spinner.d.ts +1 -1
- package/dist-versioned/components/step/step.d.ts +1 -1
- package/dist-versioned/components/step-group/step-group.d.ts +1 -1
- package/dist-versioned/components/switch/switch.d.ts +1 -1
- package/dist-versioned/components/tab/tab.d.ts +1 -1
- package/dist-versioned/components/tab-group/tab-group.d.ts +1 -1
- package/dist-versioned/components/tab-panel/tab-panel.d.ts +1 -1
- package/dist-versioned/components/tag/tag.d.ts +1 -1
- package/dist-versioned/components/textarea/textarea.d.ts +1 -1
- package/dist-versioned/components/theme-listener/theme-listener.d.ts +1 -1
- package/dist-versioned/components/tooltip/tooltip.d.ts +1 -1
- package/dist-versioned/components/video/video.d.ts +1 -1
- package/dist-versioned/custom-elements.json +244 -244
- package/dist-versioned/internal/form.js +3 -3
- package/dist-versioned/solid-components.css +2 -2
- package/dist-versioned/solid-components.js +1 -1
- package/dist-versioned/vscode.html-custom-data.json +94 -94
- package/dist-versioned/web-types.json +157 -157
- package/package.json +1 -1
|
@@ -143,6 +143,10 @@ var SdCombobox = class extends SolidElement {
|
|
|
143
143
|
this.updateComplete.then(() => this.displayInput.focus({ preventScroll: true }));
|
|
144
144
|
return;
|
|
145
145
|
}
|
|
146
|
+
if (!this.multiple && (event.key === "Backspace" || event.key === "Delete")) {
|
|
147
|
+
this.clearCombobox();
|
|
148
|
+
return;
|
|
149
|
+
}
|
|
146
150
|
if (event.key === "Enter") {
|
|
147
151
|
const currentOption = this.getCurrentOption();
|
|
148
152
|
const hasModifier = event.metaKey || event.ctrlKey || event.shiftKey || event.altKey;
|
|
@@ -22544,7 +22544,7 @@
|
|
|
22544
22544
|
"package": {
|
|
22545
22545
|
"name": "@solid-design-system/components",
|
|
22546
22546
|
"description": "Solid Design System: Components",
|
|
22547
|
-
"version": "6.
|
|
22547
|
+
"version": "6.9.0",
|
|
22548
22548
|
"author": "Union Investment",
|
|
22549
22549
|
"homepage": "https://solid-design-system.fe.union-investment.de/docs/",
|
|
22550
22550
|
"license": "MIT"
|
package/dist/solid-components.js
CHANGED
package/dist/web-types.json
CHANGED
|
@@ -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-6-
|
|
56
|
+
customElement("sd-6-9-0-theme-listener")
|
|
57
57
|
], SdThemeListener);
|
|
58
58
|
|
|
59
59
|
export {
|
|
@@ -26,7 +26,7 @@ SdCarouselItem.styles = [
|
|
|
26
26
|
:host{aspect-ratio:var(--aspect-ratio);scroll-snap-align:start;scroll-snap-stop:always;display:flex;height:100%;width:100%;flex-direction:column;align-items:center;justify-content:center}::slotted(img){height:100%;width:100%;-o-object-fit:cover;object-fit:cover}`
|
|
27
27
|
];
|
|
28
28
|
SdCarouselItem = __decorateClass([
|
|
29
|
-
customElement("sd-6-
|
|
29
|
+
customElement("sd-6-9-0-carousel-item")
|
|
30
30
|
], SdCarouselItem);
|
|
31
31
|
|
|
32
32
|
export {
|
|
@@ -46,9 +46,9 @@ var SdTeaserMedia = class extends SolidElement {
|
|
|
46
46
|
"absolute inset-0 pointer-events-none",
|
|
47
47
|
{
|
|
48
48
|
white: "bg-white/[.8] group-hover:bg-white/90",
|
|
49
|
-
"neutral-100": "sd-6-
|
|
49
|
+
"neutral-100": "sd-6-9-0-teaser-media--neutral-100-color-background group-hover:sd-6-9-0-teaser-media--neutral-100--hover-color-background",
|
|
50
50
|
primary: "bg-primary/[.8] text-white group-hover:bg-primary/90",
|
|
51
|
-
"primary-100": "sd-6-
|
|
51
|
+
"primary-100": "sd-6-9-0-teaser-media--primary-100-color-background group-hover:sd-6-9-0-teaser-media--primary-100--hover-color-background",
|
|
52
52
|
"gradient-light": "bg-gradient-to-t from-white/90 to-white/[.8]",
|
|
53
53
|
"gradient-dark": "bg-gradient-to-t from-primary-800/90 to-primary-800/[.8]"
|
|
54
54
|
}[this.variant]
|
|
@@ -56,11 +56,11 @@ var SdTeaserMedia = class extends SolidElement {
|
|
|
56
56
|
"mt-3 transition-opacity duration-300",
|
|
57
57
|
!this.open && "hidden",
|
|
58
58
|
this.open ? "opacity-100" : "opacity-0"
|
|
59
|
-
)}" part="expandable" aria-hidden="true"><slot name="expandable"></slot></div>${slots["teaser-has-expandable"] ? html`<button part="toggle" class="sd-interactive sd-interactive--reset mt-2" @click="${this.onToggleClick}" aria-expanded="${this.open}" aria-label="${this.open ? "Collapse content" : "Expand content"}"><div class="h-full justify-start flex items-start"><sd-6-
|
|
59
|
+
)}" part="expandable" aria-hidden="true"><slot name="expandable"></slot></div>${slots["teaser-has-expandable"] ? html`<button part="toggle" class="sd-interactive sd-interactive--reset mt-2" @click="${this.onToggleClick}" aria-expanded="${this.open}" aria-label="${this.open ? "Collapse content" : "Expand content"}"><div class="h-full justify-start flex items-start"><sd-6-9-0-icon class="${cx(
|
|
60
60
|
"w-6 h-6 transition-transform",
|
|
61
61
|
this.open && "rotate-180",
|
|
62
62
|
["primary", "gradient-dark"].includes(this.variant) ? "text-white" : "text-primary"
|
|
63
|
-
)}" library="_internal" name="chevron-down"></sd-6-
|
|
63
|
+
)}" library="_internal" name="chevron-down"></sd-6-9-0-icon></div></button>` : null}</div></div></div><div class="${cx("mb-4 -z-10", !slots["teaser-has-media"] && "hidden")}" part="media"><slot name="media"></slot></div></div>`;
|
|
64
64
|
}
|
|
65
65
|
};
|
|
66
66
|
SdTeaserMedia.styles = [
|
|
@@ -81,7 +81,7 @@ __decorateClass([
|
|
|
81
81
|
query('[part="base"]')
|
|
82
82
|
], SdTeaserMedia.prototype, "teaserMedia", 2);
|
|
83
83
|
SdTeaserMedia = __decorateClass([
|
|
84
|
-
customElement("sd-6-
|
|
84
|
+
customElement("sd-6-9-0-teaser-media")
|
|
85
85
|
], SdTeaserMedia);
|
|
86
86
|
|
|
87
87
|
export {
|
|
@@ -54,7 +54,7 @@ var SdHeader = class extends SolidElement {
|
|
|
54
54
|
}
|
|
55
55
|
}
|
|
56
56
|
render() {
|
|
57
|
-
return html`<header class="w-full sd-6-
|
|
57
|
+
return html`<header class="w-full sd-6-9-0-header-color-background relative" role="banner"><div part="main" class="relative mx-auto my-0 box-border"><slot></slot></div></header>`;
|
|
58
58
|
}
|
|
59
59
|
};
|
|
60
60
|
SdHeader.styles = [
|
|
@@ -72,7 +72,7 @@ __decorateClass([
|
|
|
72
72
|
debounce(100)
|
|
73
73
|
], SdHeader.prototype, "updateCalculatedHeight", 1);
|
|
74
74
|
SdHeader = __decorateClass([
|
|
75
|
-
customElement("sd-6-
|
|
75
|
+
customElement("sd-6-9-0-header")
|
|
76
76
|
], SdHeader);
|
|
77
77
|
|
|
78
78
|
export {
|
|
@@ -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 bg-primary-500 border-white" : "sd-6-
|
|
26
|
-
green: !this.inverted ? "text-white sd-6-
|
|
27
|
-
red: !this.inverted ? "text-white sd-6-
|
|
25
|
+
blue: !this.inverted ? "text-white bg-primary-500 border-white" : "sd-6-9-0-badge--blue--inverted-color-text sd-6-9-0-badge--blue--inverted-color-background sd-6-9-0-badge--inverted-color-border",
|
|
26
|
+
green: !this.inverted ? "text-white sd-6-9-0-badge--green-color-background border-white" : "sd-6-9-0-badge--green-color--inverted-text sd-6-9-0-badge--green-color--inverted-background sd-6-9-0-badge--inverted-color-border",
|
|
27
|
+
red: !this.inverted ? "text-white sd-6-9-0-badge--red-color-background border-white" : "sd-6-9-0-badge--red--inverted-text sd-6-9-0-badge--red--inverted-background sd-6-9-0-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-6-
|
|
47
|
+
customElement("sd-6-9-0-badge")
|
|
48
48
|
], SdBadge);
|
|
49
49
|
|
|
50
50
|
export {
|
|
@@ -73,10 +73,10 @@ var SdRadioGroup = class extends SolidElement {
|
|
|
73
73
|
this.formControlController.updateValidity();
|
|
74
74
|
}
|
|
75
75
|
getAllRadios() {
|
|
76
|
-
return [...this.querySelectorAll("sd-6-
|
|
76
|
+
return [...this.querySelectorAll("sd-6-9-0-radio, sd-6-9-0-radio-button")];
|
|
77
77
|
}
|
|
78
78
|
handleRadioClick(event) {
|
|
79
|
-
const target = event.target.closest("sd-6-
|
|
79
|
+
const target = event.target.closest("sd-6-9-0-radio, sd-6-9-0-radio-button");
|
|
80
80
|
const radios = this.getAllRadios();
|
|
81
81
|
const oldValue = this.value;
|
|
82
82
|
if (target.disabled) {
|
|
@@ -153,7 +153,7 @@ var SdRadioGroup = class extends SolidElement {
|
|
|
153
153
|
}
|
|
154
154
|
})
|
|
155
155
|
);
|
|
156
|
-
this.hasButtonGroup = radios.some((radio) => radio.tagName.toLowerCase() === "sd-6-
|
|
156
|
+
this.hasButtonGroup = radios.some((radio) => radio.tagName.toLowerCase() === "sd-6-9-0-radio-button");
|
|
157
157
|
if (!radios.some((radio) => radio.checked)) {
|
|
158
158
|
if (this.hasButtonGroup) {
|
|
159
159
|
const buttonRadio = (_a = radios[0].shadowRoot) == null ? void 0 : _a.querySelector("button");
|
|
@@ -165,26 +165,26 @@ var SdRadioGroup = class extends SolidElement {
|
|
|
165
165
|
}
|
|
166
166
|
}
|
|
167
167
|
if (this.hasButtonGroup) {
|
|
168
|
-
const buttonGroup = (_b = this.shadowRoot) == null ? void 0 : _b.querySelector("sd-6-
|
|
168
|
+
const buttonGroup = (_b = this.shadowRoot) == null ? void 0 : _b.querySelector("sd-6-9-0-button-group");
|
|
169
169
|
if (buttonGroup) {
|
|
170
170
|
buttonGroup.disableRole = true;
|
|
171
171
|
}
|
|
172
172
|
}
|
|
173
173
|
}
|
|
174
174
|
syncRadios() {
|
|
175
|
-
if (customElements.get("sd-6-
|
|
175
|
+
if (customElements.get("sd-6-9-0-radio") && customElements.get("sd-6-9-0-radio-button")) {
|
|
176
176
|
this.syncRadioElements();
|
|
177
177
|
return;
|
|
178
178
|
}
|
|
179
|
-
if (customElements.get("sd-6-
|
|
179
|
+
if (customElements.get("sd-6-9-0-radio")) {
|
|
180
180
|
this.syncRadioElements();
|
|
181
181
|
} else {
|
|
182
|
-
customElements.whenDefined("sd-6-
|
|
182
|
+
customElements.whenDefined("sd-6-9-0-radio").then(() => this.syncRadios());
|
|
183
183
|
}
|
|
184
|
-
if (customElements.get("sd-6-
|
|
184
|
+
if (customElements.get("sd-6-9-0-radio-button")) {
|
|
185
185
|
this.syncRadioElements();
|
|
186
186
|
} else {
|
|
187
|
-
customElements.whenDefined("sd-6-
|
|
187
|
+
customElements.whenDefined("sd-6-9-0-radio-button").then(() => this.syncRadios());
|
|
188
188
|
}
|
|
189
189
|
}
|
|
190
190
|
updateCheckedRadio() {
|
|
@@ -259,7 +259,7 @@ var SdRadioGroup = class extends SolidElement {
|
|
|
259
259
|
vertical: "flex-col",
|
|
260
260
|
horizontal: "flex-row"
|
|
261
261
|
}[this.orientation]
|
|
262
|
-
)}"><div class="sr-only"><label><input id="validation-input" type="text" ?required="${this.required}" aria-labelledby="label" tabindex="-1" hidden @invalid="${this.handleInvalid}"></label></div>${this.hasButtonGroup ? html`<sd-6-
|
|
262
|
+
)}"><div class="sr-only"><label><input id="validation-input" type="text" ?required="${this.required}" aria-labelledby="label" tabindex="-1" hidden @invalid="${this.handleInvalid}"></label></div>${this.hasButtonGroup ? html`<sd-6-9-0-button-group class="border border-primary sd-6-9-0-radio-button-group-border-radius sd-6-9-0-radio-button-group-border-width sd-6-9-0-radio-button-group-padding" part="button-group" exportparts="base:button-group__base" role="presentation">${defaultSlot}</sd-6-9-0-button-group>` : defaultSlot}</div></fieldset><slot name="help-text" part="form-control-help-text" id="help-text" class="${cx("text-sm text-neutral-700 mt-2", hasHelpText ? "block" : "hidden")}" aria-hidden="${!hasHelpText}">${this.helpText}</slot><div part="invalid-icon-message" class="flex items-center gap-2 mt-2">${this.showInvalidStyle ? html`<sd-6-9-0-icon part="invalid-icon" class="${cx("text-error")}" library="_internal" name="risk"></sd-6-9-0-icon>` : ""} ${this.formControlController.renderInvalidMessage(this.size)}</div>`;
|
|
263
263
|
}
|
|
264
264
|
};
|
|
265
265
|
/**
|
|
@@ -268,7 +268,7 @@ var SdRadioGroup = class extends SolidElement {
|
|
|
268
268
|
SdRadioGroup.styles = [
|
|
269
269
|
...SolidElement.styles,
|
|
270
270
|
css`/*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
|
|
271
|
-
:host{display:block}:host([orientation=vertical]) ::slotted(sd-6-
|
|
271
|
+
:host{display:block}:host([orientation=vertical]) ::slotted(sd-6-9-0-radio){margin-bottom:var(--sd-spacing-2);display:flex}:host([orientation=vertical]) ::slotted(sd-6-9-0-radio:last-of-type){margin-bottom:calc(var(--sd-spacing-1) * 0)}:host([orientation=horizontal]) ::slotted(sd-6-9-0-radio){margin-right:var(--sd-spacing-6)}:host([orientation=horizontal]) ::slotted(sd-6-9-0-radio:last-of-type){margin-right:calc(var(--sd-spacing-1) * 0)}:host([orientation=horizontal]):host([size=sm]) ::slotted(sd-6-9-0-radio){margin-right:var(--sd-spacing-4)}:host([orientation=horizontal]):host([size=sm]) ::slotted(sd-6-9-0-radio:last-of-type){margin-right:calc(var(--sd-spacing-1) * 0)}:host([required]) #label::after{content:' *'}:host:has(sd-6-9-0-button-group){display:inline-flex}`
|
|
272
272
|
];
|
|
273
273
|
__decorateClass([
|
|
274
274
|
query("slot:not([name])")
|
|
@@ -322,7 +322,7 @@ __decorateClass([
|
|
|
322
322
|
watch("value")
|
|
323
323
|
], SdRadioGroup.prototype, "handleValueChange", 1);
|
|
324
324
|
SdRadioGroup = __decorateClass([
|
|
325
|
-
customElement("sd-6-
|
|
325
|
+
customElement("sd-6-9-0-radio-group")
|
|
326
326
|
], SdRadioGroup);
|
|
327
327
|
|
|
328
328
|
export {
|
|
@@ -163,48 +163,48 @@ var SdButton = class extends SolidElement {
|
|
|
163
163
|
* */
|
|
164
164
|
{
|
|
165
165
|
/* sizes, fonts */
|
|
166
|
-
sm: `sd-6-
|
|
167
|
-
md: `sd-6-
|
|
168
|
-
lg: `sd-6-
|
|
166
|
+
sm: `sd-6-9-0-button--size-sm-font-size sd-6-9-0-button-font-weight sd-6-9-0-button--size-sm-border-radius varspacing-8 ${hasBorder ? "py-[0.281rem] px-[0.938rem]" : "sd-6-9-0-button--size-sm-padding-block px-4"}`,
|
|
167
|
+
md: `sd-6-9-0-button--size-md-font-size sd-6-9-0-button-font-weight sd-6-9-0-button--size-md-border-radius varspacing-10 ${hasBorder ? "py-[0.438rem] px-[0.938rem]" : "sd-6-9-0-button--size-md-padding-block px-4"}`,
|
|
168
|
+
lg: `sd-6-9-0-button--size-lg-font-size sd-6-9-0-button-font-weight sd-6-9-0-button--size-lg-border-radius varspacing-12 ${hasBorder ? "py-[0.688rem] px-[0.938rem]" : "sd-6-9-0-button--size-lg-padding-block px-4"}`
|
|
169
169
|
}[this.size],
|
|
170
170
|
{
|
|
171
171
|
/* variants */
|
|
172
|
-
primary: !this.inverted ? `${this.visuallyDisabled ? "bg-neutral-500 border-neutral-500 hover:bg-neutral-500 text-white" : "sd-6-
|
|
173
|
-
disabled:bg-neutral-500 disabled:text-white` : `${this.visuallyDisabled ? "bg-neutral-500 text-white border-neutral-500 hover:bg-neutral-500 active:bg-neutral-500" : "sd-6-
|
|
174
|
-
disabled:sd-6-
|
|
175
|
-
secondary: !this.inverted ? `border ${this.visuallyDisabled ? "sd-6-
|
|
176
|
-
disabled:sd-6-
|
|
177
|
-
disabled:sd-6-
|
|
178
|
-
tertiary: !this.inverted ? `border-transparent ${this.visuallyDisabled ? "sd-6-
|
|
179
|
-
disabled:sd-6-
|
|
180
|
-
disabled:sd-6-
|
|
172
|
+
primary: !this.inverted ? `${this.visuallyDisabled ? "bg-neutral-500 border-neutral-500 hover:bg-neutral-500 text-white" : "sd-6-9-0-button--primary--default-color-background border-transparent sd-6-9-0-button--primary--default-color-text hover:text-primary-100 active:sd-6-9-0-button--primary--active-color-text"}
|
|
173
|
+
disabled:bg-neutral-500 disabled:text-white` : `${this.visuallyDisabled ? "bg-neutral-500 text-white border-neutral-500 hover:bg-neutral-500 active:bg-neutral-500" : "sd-6-9-0-button--primary--inverted--default-color-text sd-6-9-0-button--primary--inverted--default-color-background border-white hover:sd-6-9-0-button--primary--inverted--hover-color-text active:sd-6-9-0-button--primary--inverted--active-color-text active:sd-6-9-0-button--primary--inverted--active-color-background"}
|
|
174
|
+
disabled:sd-6-9-0-button--inverted--disabled-color-background disabled:sd-6-9-0-button--inverted--disabled-color-border disabled:text-white`,
|
|
175
|
+
secondary: !this.inverted ? `border ${this.visuallyDisabled ? "sd-6-9-0-button--secondary--disabled-color-text border-neutral-500 hover:text-neutral-500 hover:border-neutral-500 active:text-neutral-500 active:border-neutral-500" : "sd-6-9-0-button--secondary--default-color-text border-primary hover:text-primary-500 hover:border-primary-500 active:text-primary-800 active:border-primary-800"}
|
|
176
|
+
disabled:sd-6-9-0-button--secondary--disabled-color-text disabled:border-neutral-500` : `border ${this.visuallyDisabled ? "text-neutral-600 border-neutral-600 hover:text-neutral-600 hover:border-neutral-600 active:text-neutral-600 active:border-neutral-600" : "text-white sd-6-9-0-button--secondary--inverted--color-border hover:sd-6-9-0-button--secondary--inverted--hover-color-text hover:border-primary-100 active:text-primary-200"}
|
|
177
|
+
disabled:sd-6-9-0-button--inverted--disabled-color-border disabled:sd-6-9-0-button--inverted--disabled-color-text`,
|
|
178
|
+
tertiary: !this.inverted ? `border-transparent ${this.visuallyDisabled ? "sd-6-9-0-button--tertiary--disabled-color-text hover:text-neutral-500 active:text-neutral-500" : "sd-6-9-0-button--tertiary--default-color-text hover:text-primary-500 active:text-primary-800"}
|
|
179
|
+
disabled:sd-6-9-0-button--tertiary--disabled-color-text` : `border-transparent ${this.visuallyDisabled ? "text-neutral-600 hover:text-neutral-600 active:text-neutral-600" : "text-white hover:sd-6-9-0-button--tertiary--inverted--hover-color-text hover:sd-6-9-0-button--tertiary--inverted--hover-color-background active:text-primary-200"}
|
|
180
|
+
disabled:sd-6-9-0-button--inverted--disabled-color-text`,
|
|
181
181
|
cta: `${this.visuallyDisabled ? "bg-neutral-500 border-neutral-500 hover:bg-neutral-500 active:bg-neutral-500" : "bg-accent border-transparent"}
|
|
182
|
-
${!this.inverted ? "text-white disabled:bg-neutral-500 disabled:border-neutral-500 disabled:text-white" : "sd-6-
|
|
182
|
+
${!this.inverted ? "text-white disabled:bg-neutral-500 disabled:border-neutral-500 disabled:text-white" : "sd-6-9-0-button--cta--inverted--default-color-background sd-6-9-0-button--cta--inverted--default-color-text hover:sd-6-9-0-button--cta--inverted--hover-color-text active:sd-6-9-0-button--cta--inverted--active-color-text disabled:sd-6-9-0-button--inverted--disabled-color-background disabled:sd-6-9-0-button--inverted--disabled-color-border disabled:text-white"}`
|
|
183
183
|
}[this.variant]
|
|
184
184
|
)}" ?disabled="${ifDefined(isLink ? void 0 : this.disabled)}" type="${ifDefined(isLink ? void 0 : this.type)}" title="${this.title}" name="${ifDefined(isLink ? void 0 : this.name)}" value="${ifDefined(isLink ? void 0 : this.value)}" href="${ifDefined(isLink ? this.href : void 0)}" target="${ifDefined(isLink ? this.target : void 0)}" download="${ifDefined(isLink ? this.download : void 0)}" rel="${ifDefined(isLink && this.target ? "noreferrer noopener" : void 0)}" role="${ifDefined(isLink ? void 0 : "button")}" aria-disabled="${this.disabled || this.visuallyDisabled ? "true" : "false"}" aria-labelledby="content" tabindex="${this.disabled ? "-1" : "0"}" @blur="${this.handleBlur}" @focus="${this.handleFocus}" @invalid="${this.isButton() ? this.handleInvalid : null}" @click="${this.handleClick}"><div part="motion-wrapper" class="${cx(
|
|
185
185
|
"absolute inset-0 -z-10 overflow-hidden pointer-events-none ",
|
|
186
186
|
(this.disabled || this.visuallyDisabled) && "hidden",
|
|
187
187
|
{
|
|
188
188
|
/* sizes, fonts */
|
|
189
|
-
sm: `sd-6-
|
|
190
|
-
md: `sd-6-
|
|
191
|
-
lg: `sd-6-
|
|
189
|
+
sm: `sd-6-9-0-button--size-sm-border-radius`,
|
|
190
|
+
md: `sd-6-9-0-button--size-md-border-radius`,
|
|
191
|
+
lg: `sd-6-9-0-button--size-lg-border-radius`
|
|
192
192
|
}[this.size]
|
|
193
193
|
)}"><div class="absolute inset-0 w-full h-full transition-all duration-fast translate-y-full group-hover:translate-y-0 group-hover:mt-[-22%] mt-[11%]"><div class="${cx(
|
|
194
194
|
"absolute right-0 min-w-full min-h-full aspect-square skew-y-[-11deg] mt-[11%]",
|
|
195
195
|
{
|
|
196
|
-
primary: !this.inverted ? "sd-6-
|
|
197
|
-
secondary: !this.inverted ? "sd-6-
|
|
198
|
-
tertiary: !this.inverted ? "sd-6-
|
|
199
|
-
cta: !this.inverted ? "bg-accent-550 group-active:bg-accent-700" : "sd-6-
|
|
196
|
+
primary: !this.inverted ? "sd-6-9-0-button--primary--hover-color-background group-active:bg-primary-800" : "sd-6-9-0-button--primary--inverted--hover-color-background group-active:bg-primary-200",
|
|
197
|
+
secondary: !this.inverted ? "sd-6-9-0-button--secondary--hover-color-background group-active:sd-6-9-0-button--secondary--active-color-background" : "bg-primary-500 group-active:sd-6-9-0-button--secondary--inverted--active-color-background",
|
|
198
|
+
tertiary: !this.inverted ? "sd-6-9-0-button--tertiary--hover-color-background group-active:sd-6-9-0-button--tertiary--active-color-background" : "bg-primary-500 group-active:sd-6-9-0-button--tertiary--inverted--active-color-background",
|
|
199
|
+
cta: !this.inverted ? "bg-accent-550 group-active:bg-accent-700" : "sd-6-9-0-button--cta--inverted--hover-color-background group-active:sd-6-9-0-button--cta--inverted--active-color-background"
|
|
200
200
|
}[this.variant]
|
|
201
201
|
)}"></div><div class="${cx(
|
|
202
202
|
"absolute w-full h-full mt-[22%]",
|
|
203
203
|
{
|
|
204
|
-
primary: !this.inverted ? "sd-6-
|
|
205
|
-
secondary: !this.inverted ? "sd-6-
|
|
206
|
-
tertiary: !this.inverted ? "sd-6-
|
|
207
|
-
cta: !this.inverted ? "bg-accent-550 group-active:bg-accent-700" : "sd-6-
|
|
204
|
+
primary: !this.inverted ? "sd-6-9-0-button--primary--hover-color-background group-active:bg-primary-800" : "sd-6-9-0-button--primary--inverted--hover-color-background group-active:bg-primary-200",
|
|
205
|
+
secondary: !this.inverted ? "sd-6-9-0-button--secondary--hover-color-background group-active:sd-6-9-0-button--secondary--active-color-background" : "bg-primary-500 group-active:sd-6-9-0-button--secondary--inverted--active-color-background",
|
|
206
|
+
tertiary: !this.inverted ? "sd-6-9-0-button--tertiary--hover-color-background group-active:sd-6-9-0-button--tertiary--active-color-background" : "bg-primary-500 group-active:sd-6-9-0-button--tertiary--inverted--active-color-background",
|
|
207
|
+
cta: !this.inverted ? "bg-accent-550 group-active:bg-accent-700" : "sd-6-9-0-button--cta--inverted--hover-color-background group-active:sd-6-9-0-button--cta--inverted--active-color-background"
|
|
208
208
|
}[this.variant]
|
|
209
209
|
)}"></div></div></div><slot name="icon-left" part="icon-left" class="${cx(
|
|
210
210
|
"flex flex-auto items-center justify-end pointer-events-none",
|
|
@@ -228,7 +228,7 @@ var SdButton = class extends SolidElement {
|
|
|
228
228
|
md: "ml-2",
|
|
229
229
|
lg: "ml-2"
|
|
230
230
|
}[this.size]
|
|
231
|
-
)}"></slot>${this.loading ? html`<sd-6-
|
|
231
|
+
)}"></slot>${this.loading ? html`<sd-6-9-0-loader class="${cx("absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2")}"></sd-6-9-0-loader>` : ""}</${tag}>`;
|
|
232
232
|
}
|
|
233
233
|
};
|
|
234
234
|
/**
|
|
@@ -237,13 +237,13 @@ var SdButton = class extends SolidElement {
|
|
|
237
237
|
SdButton.styles = [
|
|
238
238
|
...SolidElement.styles,
|
|
239
239
|
css`/*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
|
|
240
|
-
:host{position:relative;z-index:0;display:inline-block;width:auto;cursor:pointer}::slotted(sd-6-
|
|
240
|
+
:host{position:relative;z-index:0;display:inline-block;width:auto;cursor:pointer}::slotted(sd-6-9-0-badge){pointer-events:none;position:absolute;top:calc(var(--sd-spacing-1) * 0);right:calc(var(--sd-spacing-1) * 0);--tw-translate-x:calc(1/2 * 100%)!important;--tw-translate-y:calc(calc(1/2 * 100%) * -1)!important;translate:var(--tw-translate-x) var(--tw-translate-y)!important}::slotted(sd-6-9-0-icon),sd-6-9-0-loader{font-size:calc(var(--tw-varspacing)/ 2)}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}`
|
|
241
241
|
];
|
|
242
242
|
__decorateClass([
|
|
243
243
|
query("a, button")
|
|
244
244
|
], SdButton.prototype, "button", 2);
|
|
245
245
|
__decorateClass([
|
|
246
|
-
queryAssignedElements({ selector: "sd-6-
|
|
246
|
+
queryAssignedElements({ selector: "sd-6-9-0-icon" })
|
|
247
247
|
], SdButton.prototype, "_iconsInDefaultSlot", 2);
|
|
248
248
|
__decorateClass([
|
|
249
249
|
state()
|
|
@@ -309,7 +309,7 @@ __decorateClass([
|
|
|
309
309
|
watch("disabled", { waitUntilFirstUpdate: true })
|
|
310
310
|
], SdButton.prototype, "handleDisabledChange", 1);
|
|
311
311
|
SdButton = __decorateClass([
|
|
312
|
-
customElement("sd-6-
|
|
312
|
+
customElement("sd-6-9-0-button")
|
|
313
313
|
], SdButton);
|
|
314
314
|
|
|
315
315
|
export {
|
|
@@ -44,7 +44,7 @@ var SdSelect = class extends SolidElement {
|
|
|
44
44
|
constructor() {
|
|
45
45
|
super(...arguments);
|
|
46
46
|
this.formControlController = new FormControlController(this, {
|
|
47
|
-
assumeInteractionOn: ["sd-blur", "sd-6-
|
|
47
|
+
assumeInteractionOn: ["sd-blur", "sd-6-9-0-input"]
|
|
48
48
|
});
|
|
49
49
|
this.hasSlotController = new HasSlotController(this, "help-text", "label");
|
|
50
50
|
this.localize = new LocalizeController(this);
|
|
@@ -77,11 +77,11 @@ var SdSelect = class extends SolidElement {
|
|
|
77
77
|
this.styleOnValid = false;
|
|
78
78
|
this.hoist = false;
|
|
79
79
|
this.getTag = (option) => {
|
|
80
|
-
return html`<sd-6-
|
|
80
|
+
return html`<sd-6-9-0-tag class="relative z-10 min-w-0 max-w-full" ?disabled="${this.disabled}" part="tag" exportparts="
|
|
81
81
|
base:tag__base,
|
|
82
82
|
content:tag__content,
|
|
83
83
|
removable-indicator:tag__removable-indicator,
|
|
84
|
-
" size="${this.size === "sm" ? "sm" : "lg"}" removable @keydown="${(event) => this.handleTagKeyDown(event, option)}" @sd-remove="${(event) => this.handleTagRemove(event, option)}">${option.getTextLabel()}</sd-6-
|
|
84
|
+
" size="${this.size === "sm" ? "sm" : "lg"}" removable @keydown="${(event) => this.handleTagKeyDown(event, option)}" @sd-remove="${(event) => this.handleTagRemove(event, option)}">${option.getTextLabel()}</sd-6-9-0-tag>`;
|
|
85
85
|
};
|
|
86
86
|
this.handleDocumentFocusIn = (event) => {
|
|
87
87
|
const path = event.composedPath();
|
|
@@ -92,7 +92,7 @@ var SdSelect = class extends SolidElement {
|
|
|
92
92
|
this.handleDocumentKeyDown = (event) => {
|
|
93
93
|
const target = event.target;
|
|
94
94
|
const isClearButton = target.closest(".select__clear") !== null;
|
|
95
|
-
const isIconButton = target.closest("sd-6-
|
|
95
|
+
const isIconButton = target.closest("sd-6-9-0-icon-button") !== null;
|
|
96
96
|
if (isClearButton || isIconButton) {
|
|
97
97
|
return;
|
|
98
98
|
}
|
|
@@ -227,8 +227,8 @@ var SdSelect = class extends SolidElement {
|
|
|
227
227
|
event.preventDefault();
|
|
228
228
|
event.stopPropagation();
|
|
229
229
|
const tagParent = (_a = event.currentTarget) == null ? void 0 : _a.parentElement;
|
|
230
|
-
const previousTag = (_b = tagParent == null ? void 0 : tagParent.previousElementSibling) == null ? void 0 : _b.querySelector("sd-6-
|
|
231
|
-
const nextTag = (_c = tagParent == null ? void 0 : tagParent.nextElementSibling) == null ? void 0 : _c.querySelector("sd-6-
|
|
230
|
+
const previousTag = (_b = tagParent == null ? void 0 : tagParent.previousElementSibling) == null ? void 0 : _b.querySelector("sd-6-9-0-tag");
|
|
231
|
+
const nextTag = (_c = tagParent == null ? void 0 : tagParent.nextElementSibling) == null ? void 0 : _c.querySelector("sd-6-9-0-tag");
|
|
232
232
|
this.handleTagRemove(new CustomEvent("sd-remove"), option);
|
|
233
233
|
this.updateComplete.then(() => {
|
|
234
234
|
if (nextTag) {
|
|
@@ -248,7 +248,7 @@ var SdSelect = class extends SolidElement {
|
|
|
248
248
|
this.handleTagRemove(new CustomEvent("sd-remove"), this.selectedOptions[this.selectedOptions.length - 1]);
|
|
249
249
|
this.updateComplete.then(() => {
|
|
250
250
|
var _a;
|
|
251
|
-
const tags = (_a = this.shadowRoot) == null ? void 0 : _a.querySelectorAll("sd-6-
|
|
251
|
+
const tags = (_a = this.shadowRoot) == null ? void 0 : _a.querySelectorAll("sd-6-9-0-tag");
|
|
252
252
|
if (tags && tags.length > 0) {
|
|
253
253
|
tags == null ? void 0 : tags[(tags == null ? void 0 : tags.length) - 1].focus();
|
|
254
254
|
} else {
|
|
@@ -294,7 +294,7 @@ var SdSelect = class extends SolidElement {
|
|
|
294
294
|
}
|
|
295
295
|
handleOptionClick(event) {
|
|
296
296
|
const target = event.target;
|
|
297
|
-
const option = target.closest("sd-6-
|
|
297
|
+
const option = target.closest("sd-6-9-0-option");
|
|
298
298
|
const oldValue = this.value;
|
|
299
299
|
if (option && !option.disabled) {
|
|
300
300
|
if (this.multiple) {
|
|
@@ -319,7 +319,7 @@ var SdSelect = class extends SolidElement {
|
|
|
319
319
|
const allOptions = this.getAllOptions();
|
|
320
320
|
const value = Array.isArray(this.value) ? this.value : [this.value];
|
|
321
321
|
const values = [];
|
|
322
|
-
if (customElements.get("sd-6-
|
|
322
|
+
if (customElements.get("sd-6-9-0-option")) {
|
|
323
323
|
allOptions.forEach((option) => {
|
|
324
324
|
if (this.multiple) {
|
|
325
325
|
option.checkbox = true;
|
|
@@ -328,7 +328,7 @@ var SdSelect = class extends SolidElement {
|
|
|
328
328
|
});
|
|
329
329
|
this.setSelectedOptions(allOptions.filter((el) => value.includes(el.value)));
|
|
330
330
|
} else {
|
|
331
|
-
customElements.whenDefined("sd-6-
|
|
331
|
+
customElements.whenDefined("sd-6-9-0-option").then(() => this.handleDefaultSlotChange());
|
|
332
332
|
}
|
|
333
333
|
}
|
|
334
334
|
handleTagRemove(event, option) {
|
|
@@ -345,13 +345,13 @@ var SdSelect = class extends SolidElement {
|
|
|
345
345
|
});
|
|
346
346
|
}
|
|
347
347
|
}
|
|
348
|
-
// Gets an array of all <sd-6-
|
|
348
|
+
// Gets an array of all <sd-6-9-0-option> elements
|
|
349
349
|
getAllOptions() {
|
|
350
|
-
return [...this.querySelectorAll("sd-6-
|
|
350
|
+
return [...this.querySelectorAll("sd-6-9-0-option")];
|
|
351
351
|
}
|
|
352
|
-
// Gets the first <sd-6-
|
|
352
|
+
// Gets the first <sd-6-9-0-option> element
|
|
353
353
|
getFirstOption() {
|
|
354
|
-
return this.querySelector("sd-6-
|
|
354
|
+
return this.querySelector("sd-6-9-0-option");
|
|
355
355
|
}
|
|
356
356
|
// Sets the current option, which is the option the user is currently interacting with (e.g. via keyboard). Only one
|
|
357
357
|
// option may be "current" at a time.
|
|
@@ -450,11 +450,11 @@ var SdSelect = class extends SolidElement {
|
|
|
450
450
|
});
|
|
451
451
|
} else {
|
|
452
452
|
return [
|
|
453
|
-
html`<sd-6-
|
|
453
|
+
html`<sd-6-9-0-tag class="z-10 min-w-0 max-w-full" ?disabled="${this.disabled}" part="tag" exportparts="
|
|
454
454
|
base:tag__base,
|
|
455
455
|
content:tag__content,
|
|
456
456
|
removable-indicator:tag__removable-indicator,
|
|
457
|
-
" size="${this.size === "sm" ? "sm" : "lg"}" removable @keydown="${(event) => this.handleTagMaxOptionsKeyDown(event)}" @sd-remove="${(event) => this.handleTagRemove(event)}">${this.selectedOptions.length} ${this.localize.term("tagsSelected")}</sd-6-
|
|
457
|
+
" size="${this.size === "sm" ? "sm" : "lg"}" removable @keydown="${(event) => this.handleTagMaxOptionsKeyDown(event)}" @sd-remove="${(event) => this.handleTagRemove(event)}">${this.selectedOptions.length} ${this.localize.term("tagsSelected")}</sd-6-9-0-tag>`
|
|
458
458
|
];
|
|
459
459
|
}
|
|
460
460
|
}
|
|
@@ -463,7 +463,7 @@ var SdSelect = class extends SolidElement {
|
|
|
463
463
|
this.formControlController.emitInvalidEvent(event);
|
|
464
464
|
this.invalidMessage.textContent = event.target.validationMessage;
|
|
465
465
|
}
|
|
466
|
-
/** Receives incoming event detail from sd-6-
|
|
466
|
+
/** Receives incoming event detail from sd-6-9-0-popup and updates local state for conditional styling. */
|
|
467
467
|
handleCurrentPlacement(e) {
|
|
468
468
|
const incomingPlacement = e.detail;
|
|
469
469
|
if (incomingPlacement) {
|
|
@@ -472,7 +472,7 @@ var SdSelect = class extends SolidElement {
|
|
|
472
472
|
}
|
|
473
473
|
handleUseTagsChange() {
|
|
474
474
|
const allOptions = this.getAllOptions();
|
|
475
|
-
if (customElements.get("sd-6-
|
|
475
|
+
if (customElements.get("sd-6-9-0-option")) {
|
|
476
476
|
allOptions.forEach((option) => {
|
|
477
477
|
option.checkbox = this.multiple;
|
|
478
478
|
});
|
|
@@ -629,7 +629,7 @@ var SdSelect = class extends SolidElement {
|
|
|
629
629
|
default: "form-control-color-border"
|
|
630
630
|
}[selectState],
|
|
631
631
|
this.open && (this.currentPlacement === "bottom" ? "rounded-bl-none rounded-br-none" : "rounded-tl-none rounded-tr-none")
|
|
632
|
-
)}"></div><sd-6-
|
|
632
|
+
)}"></div><sd-6-9-0-popup @sd-current-placement="${this.handleCurrentPlacement}" class="${cx(
|
|
633
633
|
"inline-flex relative w-full",
|
|
634
634
|
this.currentPlacement === "bottom" ? "origin-top" : "origin-bottom"
|
|
635
635
|
)}" placement="${this.placement}" strategy="${this.hoist ? "fixed" : "absolute"}" flip sync="width" auto-size="vertical" auto-size-padding="10" exportparts="
|
|
@@ -656,12 +656,12 @@ var SdSelect = class extends SolidElement {
|
|
|
656
656
|
"select__clear flex justify-center",
|
|
657
657
|
iconMarginLeft,
|
|
658
658
|
this.value.length > 0 ? "visible" : "hidden"
|
|
659
|
-
)}" type="button" aria-label="${this.localize.term("clearEntry")}" @mousedown="${this.handleClearMouseDown}" @click="${this.handleClearClick}" tabindex="-1"><slot name="clear-icon"><sd-6-
|
|
659
|
+
)}" type="button" aria-label="${this.localize.term("clearEntry")}" @mousedown="${this.handleClearMouseDown}" @click="${this.handleClearClick}" tabindex="-1"><slot name="clear-icon"><sd-6-9-0-icon class="${cx("text-neutral-700 z-10", iconSize)}" library="_internal" name="closing-round"></sd-6-9-0-icon></slot></button>` : ""} ${this.showInvalidStyle ? html`<sd-6-9-0-icon part="invalid-icon" class="${cx(iconMarginLeft, iconSize, "text-error")}" library="_internal" name="risk"></sd-6-9-0-icon>` : ""} ${this.styleOnValid && this.showValidStyle ? html`<sd-6-9-0-icon part="valid-icon" class="${cx("flex-shrink-0 text-success", iconMarginLeft, iconSize)}" library="_internal" name="confirm-circle"></sd-6-9-0-icon>` : ""}<slot name="expand-icon" part="expand-icon" class="${cx(
|
|
660
660
|
"inline-flex ml-2 items-center transition-transform duration-medium ease-in-out",
|
|
661
661
|
this.open ? "rotate-180" : "rotate-0",
|
|
662
662
|
this.disabled || this.visuallyDisabled ? "text-neutral-500" : "text-primary",
|
|
663
663
|
iconSize
|
|
664
|
-
)}"><sd-6-
|
|
664
|
+
)}"><sd-6-9-0-icon name="chevron-down" part="chevron" library="_internal" color="currentColor"></sd-6-9-0-icon></slot></div><button part="combobox" class="${cx(
|
|
665
665
|
"relative w-full px-4 flex flex-row items-center rounded-default focus-visible:outline-none",
|
|
666
666
|
cursorStyles,
|
|
667
667
|
this.open && "shadow transition-shadow duration-medium ease-in-out",
|
|
@@ -674,7 +674,7 @@ var SdSelect = class extends SolidElement {
|
|
|
674
674
|
"bg-white px-2 py-3 relative border-primary overflow-y-auto",
|
|
675
675
|
this.open && "shadow transition-shadow duration-medium ease-in-out",
|
|
676
676
|
this.currentPlacement === "bottom" ? "border-r-2 border-b-2 border-l-2 rounded-br-default rounded-bl-default" : "border-r-2 border-t-2 border-l-2 rounded-tr-default rounded-tl-default"
|
|
677
|
-
)}" tabindex="-1" @mouseup="${this.handleOptionClick}" @slotchange="${this.handleDefaultSlotChange}"><slot></slot></div></sd-6-
|
|
677
|
+
)}" tabindex="-1" @mouseup="${this.handleOptionClick}" @slotchange="${this.handleDefaultSlotChange}"><slot></slot></div></sd-6-9-0-popup></div><div class="text-sm text-neutral-700 mt-1" part="form-control-help-text" id="help-text" aria-hidden="${hasHelpText ? "false" : "true"}"><slot name="help-text">${this.helpText}</slot></div></div>${this.formControlController.renderInvalidMessage(this.size)}`;
|
|
678
678
|
}
|
|
679
679
|
};
|
|
680
680
|
/**
|
|
@@ -683,13 +683,13 @@ var SdSelect = class extends SolidElement {
|
|
|
683
683
|
SdSelect.styles = [
|
|
684
684
|
...SolidElement.styles,
|
|
685
685
|
css`/*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
|
|
686
|
-
:host{position:relative;display:block;width:auto}:host([required]) #label::after{content:' *'}:host([disabled]) ::-moz-placeholder,:host([visually-disabled]) ::-moz-placeholder{color:rgba(var(--sd-color-text-neutral-500))}:host([disabled]) ::placeholder,:host([visually-disabled]) ::placeholder{color:rgba(var(--sd-color-text-neutral-500))}[part=listbox]{max-height:var(--auto-size-available-height,auto)}.input-container,[part=combobox]{grid-column:1/1;grid-row:1/1}sd-6-
|
|
686
|
+
:host{position:relative;display:block;width:auto}:host([required]) #label::after{content:' *'}:host([disabled]) ::-moz-placeholder,:host([visually-disabled]) ::-moz-placeholder{color:rgba(var(--sd-color-text-neutral-500))}:host([disabled]) ::placeholder,:host([visually-disabled]) ::placeholder{color:rgba(var(--sd-color-text-neutral-500))}[part=listbox]{max-height:var(--auto-size-available-height,auto)}.input-container,[part=combobox]{grid-column:1/1;grid-row:1/1}sd-6-9-0-popup::part(popup){z-index:var(--sd-z-index-dropdown,900)}sd-6-9-0-tag::part(base){border-radius:var(--sd-radius);padding-inline:var(--sd-spacing-1)}sd-6-9-0-tag::part(content){display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:var(--tag-max-width,15ch)}sd-6-9-0-tag[size=lg]::part(base){padding-inline:var(--sd-spacing-2)}sd-6-9-0-tag[disabled=false]::part(base):hover{background-color:rgba(var(--sd-color-background-primary-100))}`
|
|
687
687
|
];
|
|
688
688
|
__decorateClass([
|
|
689
|
-
queryAssignedElements({ selector: "sd-6-
|
|
689
|
+
queryAssignedElements({ selector: "sd-6-9-0-option" })
|
|
690
690
|
], SdSelect.prototype, "_optionsInDefaultSlot", 2);
|
|
691
691
|
__decorateClass([
|
|
692
|
-
query("sd-6-
|
|
692
|
+
query("sd-6-9-0-popup")
|
|
693
693
|
], SdSelect.prototype, "popup", 2);
|
|
694
694
|
__decorateClass([
|
|
695
695
|
query('[part="combobox"]')
|
|
@@ -817,7 +817,7 @@ __decorateClass([
|
|
|
817
817
|
watch(["size", "floatingLabel"])
|
|
818
818
|
], SdSelect.prototype, "handleSizeChange", 1);
|
|
819
819
|
SdSelect = __decorateClass([
|
|
820
|
-
customElement("sd-6-
|
|
820
|
+
customElement("sd-6-9-0-select")
|
|
821
821
|
], SdSelect);
|
|
822
822
|
setDefaultAnimation("select.show", {
|
|
823
823
|
keyframes: [{ opacity: 0 }, { opacity: 1 }],
|
|
@@ -135,14 +135,14 @@ var SdAccordion = class extends SolidElement {
|
|
|
135
135
|
}
|
|
136
136
|
render() {
|
|
137
137
|
return html`<details part="base" class="border-neutral-400"><summary part="header" id="header" class="${cx(
|
|
138
|
-
"flex text-base gap-4 font-bold items-center cursor-pointer select-none px-4 sd-6-
|
|
138
|
+
"flex text-base gap-4 font-bold items-center cursor-pointer select-none px-4 sd-6-9-0-accordion-padding-block focus-visible:focus-outline focus-visible:z-10 sd-6-9-0-accordion-color-text relative group transition-colors ease-in-out duration-fast hover:bg-neutral-200"
|
|
139
139
|
)}" aria-expanded="${this.open ? "true" : "false"}" aria-controls="content" tabindex="0" @click="${this.handleSummaryClick}" @keydown="${this.handleSummaryKeyDown}"><div part="summary-border" class="${cx(
|
|
140
140
|
!this.open && "opacity-0",
|
|
141
|
-
"w-1 sd-6-
|
|
141
|
+
"w-1 sd-6-9-0-accordion__indicator-color absolute left-0 transition-height duration-fast ease-in-out h-[calc(100%-16px)] group-hover:h-full"
|
|
142
142
|
)}"></div><slot name="summary" part="summary" class="flex flex-auto items-center text-left">${this.summary}</slot><span part="summary-icon" class="${cx(
|
|
143
143
|
"flex flex-grow-0 flex-shrink-0 flex-auto items-center transition-all ease-in-out duration-medium text-xl",
|
|
144
144
|
this.open && "rotate-180"
|
|
145
|
-
)}"><slot name="expand-icon" class="${cx(this.open && "hidden")}"><sd-6-
|
|
145
|
+
)}"><slot name="expand-icon" class="${cx(this.open && "hidden")}"><sd-6-9-0-icon library="_internal" name="chevron-down"></sd-6-9-0-icon></slot><slot name="collapse-icon" class="${cx(!this.open && "hidden")}"><sd-6-9-0-icon library="_internal" name="chevron-down"></sd-6-9-0-icon></slot></span></summary><div part="content" id="content" class="overflow-hidden"><slot part="content__slot" class="block px-4 py-6" role="region" aria-labelledby="header"></slot></div></details>`;
|
|
146
146
|
}
|
|
147
147
|
};
|
|
148
148
|
SdAccordion.styles = [
|
|
@@ -169,7 +169,7 @@ __decorateClass([
|
|
|
169
169
|
watch("open", { waitUntilFirstUpdate: true })
|
|
170
170
|
], SdAccordion.prototype, "handleOpenChange", 1);
|
|
171
171
|
SdAccordion = __decorateClass([
|
|
172
|
-
customElement("sd-6-
|
|
172
|
+
customElement("sd-6-9-0-accordion")
|
|
173
173
|
], SdAccordion);
|
|
174
174
|
setDefaultAnimation("accordion.show", {
|
|
175
175
|
keyframes: [
|