@solid-design-system/components 6.27.0 → 6.27.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cdn/custom-elements.json +169 -169
- package/cdn/solid-components.js +1 -1
- package/cdn/vscode.html-custom-data.json +22 -22
- package/cdn/web-types.json +46 -46
- package/cdn-versioned/chunks/chunk.2NOYGNXE.js +2 -2
- package/cdn-versioned/chunks/chunk.2SYX234H.js +2 -2
- package/cdn-versioned/chunks/chunk.2U4TAJUC.js +2 -2
- package/cdn-versioned/chunks/chunk.3JIMAV3K.js +2 -2
- package/cdn-versioned/chunks/chunk.5HUX5VFB.js +2 -2
- package/cdn-versioned/chunks/chunk.7QOVVO7A.js +2 -2
- package/cdn-versioned/chunks/chunk.7SNWTFKD.js +9 -9
- package/cdn-versioned/chunks/chunk.7ZVQLLM7.js +2 -2
- package/cdn-versioned/chunks/chunk.A7OKDFGO.js +2 -2
- package/cdn-versioned/chunks/chunk.AO6SNRNL.js +2 -2
- package/cdn-versioned/chunks/chunk.AOLUHUSF.js +2 -2
- package/cdn-versioned/chunks/chunk.AVVZHYFS.js +3 -3
- package/cdn-versioned/chunks/chunk.BCJZHMRU.js +2 -2
- package/cdn-versioned/chunks/chunk.BJ6LURC2.js +2 -2
- package/cdn-versioned/chunks/chunk.BTWK37K2.js +2 -2
- package/cdn-versioned/chunks/chunk.DJ527NKP.js +2 -2
- package/cdn-versioned/chunks/chunk.DLSBHX3L.js +2 -2
- package/cdn-versioned/chunks/chunk.DPRDJHG4.js +2 -2
- package/cdn-versioned/chunks/chunk.DSKB3SEU.js +1 -1
- package/cdn-versioned/chunks/chunk.DUAVYRMV.js +2 -2
- package/cdn-versioned/chunks/chunk.E3RBLJOD.js +2 -2
- package/cdn-versioned/chunks/chunk.ENGQY5PQ.js +1 -1
- package/cdn-versioned/chunks/chunk.FIN34FFZ.js +2 -2
- package/cdn-versioned/chunks/chunk.FUONGVWC.js +2 -2
- package/cdn-versioned/chunks/chunk.GANINSPD.js +1 -1
- package/cdn-versioned/chunks/chunk.GAWWLECF.js +2 -2
- package/cdn-versioned/chunks/chunk.GJHFXIDQ.js +2 -2
- package/cdn-versioned/chunks/chunk.HQVTWWED.js +2 -2
- package/cdn-versioned/chunks/chunk.J7HKJOBT.js +1 -1
- package/cdn-versioned/chunks/chunk.KBNYCL2A.js +2 -2
- package/cdn-versioned/chunks/chunk.KDUC23NC.js +2 -2
- package/cdn-versioned/chunks/chunk.L7ERUBEO.js +2 -2
- package/cdn-versioned/chunks/chunk.LS7DRXQL.js +2 -2
- package/cdn-versioned/chunks/chunk.LZRL7OLU.js +1 -1
- package/cdn-versioned/chunks/chunk.MINBYM3X.js +2 -2
- package/cdn-versioned/chunks/chunk.MRKCTLHO.js +2 -2
- package/cdn-versioned/chunks/chunk.MWPUIVNY.js +2 -2
- package/cdn-versioned/chunks/chunk.NMQWMKA4.js +2 -2
- package/cdn-versioned/chunks/chunk.NO37AAPJ.js +2 -2
- package/cdn-versioned/chunks/chunk.NVBDCLSB.js +5 -5
- package/cdn-versioned/chunks/chunk.OFME6DWX.js +2 -2
- package/cdn-versioned/chunks/chunk.QZ4TINX7.js +5 -5
- package/cdn-versioned/chunks/chunk.RBIHJJJH.js +1 -1
- package/cdn-versioned/chunks/chunk.RJBMCBBF.js +1 -1
- package/cdn-versioned/chunks/chunk.SP3LJOKF.js +2 -2
- package/cdn-versioned/chunks/chunk.STDRBG54.js +1 -1
- package/cdn-versioned/chunks/chunk.TFVRFH37.js +1 -1
- package/cdn-versioned/chunks/chunk.TJDPWAVB.js +2 -2
- package/cdn-versioned/chunks/chunk.TOGRTI4R.js +2 -2
- package/cdn-versioned/chunks/chunk.TPFV72LH.js +1 -1
- package/cdn-versioned/chunks/chunk.UEFD3UMC.js +2 -2
- package/cdn-versioned/chunks/chunk.UMMMHVGK.js +2 -2
- package/cdn-versioned/chunks/chunk.UUT3RNXX.js +2 -2
- package/cdn-versioned/chunks/chunk.VHNBQXBQ.js +2 -2
- package/cdn-versioned/chunks/chunk.VQZJSHKG.js +3 -3
- package/cdn-versioned/chunks/chunk.W7A3TU2Z.js +1 -1
- package/cdn-versioned/chunks/chunk.WCUOYX2O.js +2 -2
- package/cdn-versioned/chunks/chunk.WKRUSUP5.js +2 -2
- package/cdn-versioned/chunks/chunk.WKWRMAYZ.js +2 -2
- package/cdn-versioned/chunks/chunk.WMNN34G7.js +1 -1
- package/cdn-versioned/chunks/chunk.XLOQLF7T.js +2 -2
- package/cdn-versioned/chunks/chunk.XRBLVTS7.js +3 -3
- package/cdn-versioned/chunks/chunk.YHEOMQ3U.js +2 -2
- package/cdn-versioned/chunks/chunk.ZB3TIOGA.js +1 -1
- package/cdn-versioned/chunks/chunk.ZWU3HKO7.js +2 -2
- package/cdn-versioned/components/accordion/accordion.d.ts +1 -1
- package/cdn-versioned/components/accordion-group/accordion-group.d.ts +1 -1
- package/cdn-versioned/components/animation/animation.d.ts +1 -1
- package/cdn-versioned/components/audio/audio.d.ts +1 -1
- package/cdn-versioned/components/badge/badge.d.ts +1 -1
- package/cdn-versioned/components/brandshape/brandshape.d.ts +1 -1
- package/cdn-versioned/components/breadcrumb/breadcrumb.d.ts +1 -1
- package/cdn-versioned/components/breadcrumb-item/breadcrumb-item.d.ts +1 -1
- package/cdn-versioned/components/button/button.d.ts +1 -1
- package/cdn-versioned/components/button-group/button-group.d.ts +1 -1
- package/cdn-versioned/components/carousel/carousel.d.ts +1 -1
- package/cdn-versioned/components/carousel-item/carousel-item.d.ts +1 -1
- package/cdn-versioned/components/checkbox/checkbox.d.ts +1 -1
- package/cdn-versioned/components/checkbox-group/checkbox-group.d.ts +1 -1
- package/cdn-versioned/components/combobox/combobox.d.ts +1 -1
- package/cdn-versioned/components/datepicker/datepicker.d.ts +1 -1
- package/cdn-versioned/components/dialog/dialog.d.ts +1 -1
- package/cdn-versioned/components/divider/divider.d.ts +1 -1
- package/cdn-versioned/components/drawer/drawer.d.ts +1 -1
- package/cdn-versioned/components/dropdown/dropdown.d.ts +1 -1
- package/cdn-versioned/components/expandable/expandable.d.ts +1 -1
- package/cdn-versioned/components/flipcard/flipcard.d.ts +1 -1
- package/cdn-versioned/components/header/header.d.ts +1 -1
- package/cdn-versioned/components/icon/icon.d.ts +1 -1
- package/cdn-versioned/components/include/include.d.ts +1 -1
- package/cdn-versioned/components/input/input.d.ts +1 -1
- package/cdn-versioned/components/link/link.d.ts +1 -1
- package/cdn-versioned/components/loader/loader.d.ts +1 -1
- package/cdn-versioned/components/map-marker/map-marker.d.ts +1 -1
- package/cdn-versioned/components/menu/menu.d.ts +1 -1
- package/cdn-versioned/components/menu-item/menu-item.d.ts +1 -1
- package/cdn-versioned/components/navigation-item/navigation-item.d.ts +1 -1
- package/cdn-versioned/components/notification/notification.d.ts +1 -1
- package/cdn-versioned/components/optgroup/optgroup.d.ts +1 -1
- package/cdn-versioned/components/option/option.d.ts +1 -1
- package/cdn-versioned/components/popup/popup.d.ts +1 -1
- package/cdn-versioned/components/progress-bar/progress-bar.d.ts +1 -1
- package/cdn-versioned/components/quickfact/quickfact.d.ts +1 -1
- package/cdn-versioned/components/radio/radio.d.ts +1 -1
- package/cdn-versioned/components/radio-button/radio-button.d.ts +1 -1
- package/cdn-versioned/components/radio-group/radio-group.d.ts +1 -1
- package/cdn-versioned/components/range/range.d.ts +1 -1
- package/cdn-versioned/components/range-tick/range-tick.d.ts +1 -1
- package/cdn-versioned/components/scrollable/scrollable.d.ts +1 -1
- package/cdn-versioned/components/select/select.d.ts +1 -1
- package/cdn-versioned/components/skeleton/skeleton.d.ts +1 -1
- package/cdn-versioned/components/spinner/spinner.d.ts +1 -1
- package/cdn-versioned/components/step/step.d.ts +1 -1
- package/cdn-versioned/components/step-group/step-group.d.ts +1 -1
- package/cdn-versioned/components/switch/switch.d.ts +1 -1
- package/cdn-versioned/components/tab/tab.d.ts +1 -1
- package/cdn-versioned/components/tab-group/tab-group.d.ts +1 -1
- package/cdn-versioned/components/tab-panel/tab-panel.d.ts +1 -1
- package/cdn-versioned/components/tag/tag.d.ts +1 -1
- package/cdn-versioned/components/textarea/textarea.d.ts +1 -1
- package/cdn-versioned/components/theme-listener/theme-listener.d.ts +1 -1
- package/cdn-versioned/components/tooltip/tooltip.d.ts +1 -1
- package/cdn-versioned/components/video/video.d.ts +1 -1
- package/cdn-versioned/custom-elements.json +420 -420
- package/cdn-versioned/internal/form.js +2 -2
- package/cdn-versioned/solid-components.bundle.js +81 -81
- package/cdn-versioned/solid-components.css +2 -2
- package/cdn-versioned/solid-components.iife.js +81 -81
- package/cdn-versioned/solid-components.js +1 -1
- package/cdn-versioned/vscode.html-custom-data.json +134 -134
- package/cdn-versioned/web-types.json +211 -211
- package/dist/custom-elements.json +1 -1
- package/dist/solid-components.js +3 -3
- package/dist/web-types.json +1 -1
- package/dist-versioned/chunks/chunk.22QJOKRT.js +2 -2
- package/dist-versioned/chunks/chunk.2GY5X74S.js +25 -25
- package/dist-versioned/chunks/chunk.2JVBNRAE.js +11 -11
- package/dist-versioned/chunks/chunk.2QLV3FGQ.js +1 -1
- package/dist-versioned/chunks/chunk.32PMIHHH.js +10 -10
- package/dist-versioned/chunks/chunk.3AZV733X.js +1 -1
- package/dist-versioned/chunks/chunk.3JGLYKUT.js +1 -1
- package/dist-versioned/chunks/chunk.3UAYIX4K.js +5 -5
- package/dist-versioned/chunks/chunk.3YRBYYHB.js +14 -14
- package/dist-versioned/chunks/chunk.43WIFSAV.js +8 -8
- package/dist-versioned/chunks/chunk.4CYE55LF.js +1 -1
- package/dist-versioned/chunks/chunk.4QQTPWQK.js +2 -2
- package/dist-versioned/chunks/chunk.5SP53TRC.js +7 -7
- package/dist-versioned/chunks/chunk.67RQILIX.js +3 -3
- package/dist-versioned/chunks/chunk.6LUXWBVQ.js +2 -2
- package/dist-versioned/chunks/chunk.6QITMMHT.js +1 -1
- package/dist-versioned/chunks/chunk.6VONS4GH.js +5 -5
- package/dist-versioned/chunks/chunk.76H4PKGT.js +11 -11
- package/dist-versioned/chunks/chunk.7DSVL7JH.js +2 -2
- package/dist-versioned/chunks/chunk.ATPMJXDV.js +7 -7
- package/dist-versioned/chunks/chunk.C3WIBDGG.js +2 -2
- package/dist-versioned/chunks/chunk.DFSINDVF.js +2 -2
- package/dist-versioned/chunks/chunk.DPOFFN22.js +5 -5
- package/dist-versioned/chunks/chunk.E32D3Z6I.js +1 -1
- package/dist-versioned/chunks/chunk.EAJ3CM6N.js +4 -4
- package/dist-versioned/chunks/chunk.EQKXEQYI.js +6 -6
- package/dist-versioned/chunks/chunk.EWBPFI7O.js +3 -3
- package/dist-versioned/chunks/chunk.FDOJX6W4.js +3 -3
- package/dist-versioned/chunks/chunk.FO2XDPBY.js +1 -1
- package/dist-versioned/chunks/chunk.FTLHBRJ7.js +2 -2
- package/dist-versioned/chunks/chunk.FZW355YU.js +4 -4
- package/dist-versioned/chunks/chunk.GIYK2K7S.js +3 -3
- package/dist-versioned/chunks/chunk.GURHKBOS.js +4 -4
- package/dist-versioned/chunks/chunk.H6AYJU2Z.js +6 -6
- package/dist-versioned/chunks/chunk.HFD4GVQH.js +6 -6
- package/dist-versioned/chunks/chunk.HFUPD442.js +2 -2
- package/dist-versioned/chunks/chunk.HSMX4JWE.js +12 -12
- package/dist-versioned/chunks/chunk.ISDCFN2T.js +2 -2
- package/dist-versioned/chunks/chunk.KEJFWGZI.js +4 -4
- package/dist-versioned/chunks/chunk.KNNHUZRK.js +5 -5
- package/dist-versioned/chunks/chunk.LFY6FLC7.js +11 -11
- package/dist-versioned/chunks/chunk.LIHFBMY3.js +5 -5
- package/dist-versioned/chunks/chunk.LMAZLSWN.js +5 -5
- package/dist-versioned/chunks/chunk.LVUKQ7ZS.js +7 -7
- package/dist-versioned/chunks/chunk.MIDB4P4Z.js +5 -5
- package/dist-versioned/chunks/chunk.NF6TENBG.js +13 -13
- package/dist-versioned/chunks/chunk.NQD4454U.js +5 -5
- package/dist-versioned/chunks/chunk.ON7JW7DZ.js +4 -4
- package/dist-versioned/chunks/chunk.P7WF3BP4.js +12 -12
- package/dist-versioned/chunks/chunk.PAGXROMQ.js +6 -6
- package/dist-versioned/chunks/chunk.PGR6OZIM.js +1 -1
- package/dist-versioned/chunks/chunk.QH4PJIEK.js +10 -10
- package/dist-versioned/chunks/chunk.QWPTKRZY.js +2 -2
- package/dist-versioned/chunks/chunk.RIMF3V3U.js +10 -10
- package/dist-versioned/chunks/chunk.RJD5JWEE.js +6 -6
- package/dist-versioned/chunks/chunk.TVVA3SEO.js +3 -3
- package/dist-versioned/chunks/chunk.U4ES752F.js +4 -4
- package/dist-versioned/chunks/chunk.UIQBHPD3.js +2 -2
- package/dist-versioned/chunks/chunk.VMOVHC54.js +2 -2
- package/dist-versioned/chunks/chunk.WALY6H2S.js +5 -5
- package/dist-versioned/chunks/chunk.WC6QJGPY.js +3 -3
- package/dist-versioned/chunks/chunk.XAFXRA3O.js +33 -33
- package/dist-versioned/chunks/chunk.YVNA2ZV6.js +2 -2
- package/dist-versioned/chunks/chunk.Z4VNO3XB.js +23 -23
- package/dist-versioned/chunks/chunk.ZCK2AJ6F.js +10 -10
- package/dist-versioned/components/accordion/accordion.d.ts +1 -1
- package/dist-versioned/components/accordion-group/accordion-group.d.ts +1 -1
- package/dist-versioned/components/animation/animation.d.ts +1 -1
- package/dist-versioned/components/audio/audio.d.ts +1 -1
- package/dist-versioned/components/badge/badge.d.ts +1 -1
- package/dist-versioned/components/brandshape/brandshape.d.ts +1 -1
- package/dist-versioned/components/breadcrumb/breadcrumb.d.ts +1 -1
- package/dist-versioned/components/breadcrumb-item/breadcrumb-item.d.ts +1 -1
- package/dist-versioned/components/button/button.d.ts +1 -1
- package/dist-versioned/components/button-group/button-group.d.ts +1 -1
- package/dist-versioned/components/carousel/carousel.d.ts +1 -1
- package/dist-versioned/components/carousel-item/carousel-item.d.ts +1 -1
- package/dist-versioned/components/checkbox/checkbox.d.ts +1 -1
- package/dist-versioned/components/checkbox-group/checkbox-group.d.ts +1 -1
- package/dist-versioned/components/combobox/combobox.d.ts +1 -1
- package/dist-versioned/components/datepicker/datepicker.d.ts +1 -1
- package/dist-versioned/components/dialog/dialog.d.ts +1 -1
- package/dist-versioned/components/divider/divider.d.ts +1 -1
- package/dist-versioned/components/drawer/drawer.d.ts +1 -1
- package/dist-versioned/components/dropdown/dropdown.d.ts +1 -1
- package/dist-versioned/components/expandable/expandable.d.ts +1 -1
- package/dist-versioned/components/flipcard/flipcard.d.ts +1 -1
- package/dist-versioned/components/header/header.d.ts +1 -1
- package/dist-versioned/components/icon/icon.d.ts +1 -1
- package/dist-versioned/components/include/include.d.ts +1 -1
- package/dist-versioned/components/input/input.d.ts +1 -1
- package/dist-versioned/components/link/link.d.ts +1 -1
- package/dist-versioned/components/loader/loader.d.ts +1 -1
- package/dist-versioned/components/map-marker/map-marker.d.ts +1 -1
- package/dist-versioned/components/menu/menu.d.ts +1 -1
- package/dist-versioned/components/menu-item/menu-item.d.ts +1 -1
- package/dist-versioned/components/navigation-item/navigation-item.d.ts +1 -1
- package/dist-versioned/components/notification/notification.d.ts +1 -1
- package/dist-versioned/components/optgroup/optgroup.d.ts +1 -1
- package/dist-versioned/components/option/option.d.ts +1 -1
- package/dist-versioned/components/popup/popup.d.ts +1 -1
- package/dist-versioned/components/progress-bar/progress-bar.d.ts +1 -1
- package/dist-versioned/components/quickfact/quickfact.d.ts +1 -1
- package/dist-versioned/components/radio/radio.d.ts +1 -1
- package/dist-versioned/components/radio-button/radio-button.d.ts +1 -1
- package/dist-versioned/components/radio-group/radio-group.d.ts +1 -1
- package/dist-versioned/components/range/range.d.ts +1 -1
- package/dist-versioned/components/range-tick/range-tick.d.ts +1 -1
- package/dist-versioned/components/scrollable/scrollable.d.ts +1 -1
- package/dist-versioned/components/select/select.d.ts +1 -1
- package/dist-versioned/components/skeleton/skeleton.d.ts +1 -1
- package/dist-versioned/components/spinner/spinner.d.ts +1 -1
- package/dist-versioned/components/step/step.d.ts +1 -1
- package/dist-versioned/components/step-group/step-group.d.ts +1 -1
- package/dist-versioned/components/switch/switch.d.ts +1 -1
- package/dist-versioned/components/tab/tab.d.ts +1 -1
- package/dist-versioned/components/tab-group/tab-group.d.ts +1 -1
- package/dist-versioned/components/tab-panel/tab-panel.d.ts +1 -1
- package/dist-versioned/components/tag/tag.d.ts +1 -1
- package/dist-versioned/components/textarea/textarea.d.ts +1 -1
- package/dist-versioned/components/theme-listener/theme-listener.d.ts +1 -1
- package/dist-versioned/components/tooltip/tooltip.d.ts +1 -1
- package/dist-versioned/components/video/video.d.ts +1 -1
- package/dist-versioned/custom-elements.json +420 -420
- package/dist-versioned/internal/form.js +2 -2
- package/dist-versioned/solid-components.css +2 -2
- package/dist-versioned/solid-components.js +3 -3
- package/dist-versioned/vscode.html-custom-data.json +134 -134
- package/dist-versioned/web-types.json +211 -211
- package/package.json +1 -1
|
@@ -300,19 +300,19 @@ var SdAudio = class extends SolidElement {
|
|
|
300
300
|
)}" part="audio-controls"><button class="${cx(
|
|
301
301
|
"playback-speed justify-self-start text-base font-bold hover:cursor-pointer sd-interactive",
|
|
302
302
|
this.inverted && "sd-interactive--inverted"
|
|
303
|
-
)}" aria-label="${this.localize.term("playbackSpeed")} (${this.speed}x)" @click="${this.togglePlaybackSpeed}" @keydown="${this.togglePlaybackSpeedKeydown}" part="playback-speed">${this.speed}x</button><sd-6-27-
|
|
303
|
+
)}" aria-label="${this.localize.term("playbackSpeed")} (${this.speed}x)" @click="${this.togglePlaybackSpeed}" @keydown="${this.togglePlaybackSpeedKeydown}" part="playback-speed">${this.speed}x</button><sd-6-27-1-button ?inverted="${this.inverted ? true : false}" part="play-button" size="lg" @click="${!this.isPlaying ? this.playAudio : this.pauseAudio}" aria-label="${this.isPlaying ? this.localize.term("pauseAudio") : this.localize.term("playAudio")}" title="${this.isPlaying ? this.localize.term("pauseAudio") : this.localize.term("playAudio")}" class="mb-4">${this.isPlaying ? html`<slot name="pause-icon"><sd-6-27-1-icon class="text-xl" name="pause" library="_internal"></sd-6-27-1-icon></slot>` : html`<slot name="play-icon"><sd-6-27-1-icon class="text-xl" name="start" library="_internal"></sd-6-27-1-icon></slot>`}</sd-6-27-1-button><div class="flex items-center gap-6 justify-self-end">${this.hasSlotController.test("transcript") ? html`<button class="${cx("w-6 h-6 hover:cursor-pointer sd-interactive", this.inverted && "sd-interactive--inverted")}" aria-label="${this.isTranscriptOpen ? this.localize.term("transcriptIsOpen") : this.localize.term("openTranscript")}" @click="${this.showTranscript}" @keydown="${this.showTranscriptKeydown}" part="transcript"><sd-6-27-1-icon class="w-6 h-6" name="transcript" library="_internal"></sd-6-27-1-icon></button>` : null} <button class="${cx("w-6 h-6 hover:cursor-pointer sd-interactive", this.inverted && "sd-interactive--inverted")}" part="volume" aria-label="${!this.isMuted ? this.localize.term("mute") : this.localize.term("unmute")}" @click="${this.toggleMute}" @keydown="${this.toggleMuteKeydown}"><sd-6-27-1-icon class="w-6 h-6" name="${this.isMuted ? "mute" : "volume"}" library="_internal"></sd-6-27-1-icon></button></div></div>`;
|
|
304
304
|
const renderTimestamps = html`<div class="${cx(
|
|
305
305
|
"w-full flex justify-between",
|
|
306
306
|
this.reversedLayout ? "mb-0.5" : "mt-0.5",
|
|
307
307
|
this.animated && this.reversedLayout && "absolute bottom-0 left-0 !mb-4"
|
|
308
|
-
)}" part="timestamps"><div class="${cx("current-time text-sm", this.inverted ? "text-primary-400" : "sd-6-27-
|
|
309
|
-
return html`<div class="${cx("w-full flex relative", this.reversedLayout ? "flex-col-reverse" : "flex-col")}" aria-label="${this.localize.term("audioPlayer")}" part="audio-player"><slot @slotchange="${this.updateAudioDuration}"></slot>${!this.animated || this.animated && this.reversedLayout ? renderAudioControls : null}<div class="relative">${this.animated && !this.reversedLayout ? html`${renderAudioControls}` : null} ${this.animated ? html`<canvas class="w-full h-16 -mb-2"></canvas>` : null} ${!this.hideTimestamps && this.animated && this.reversedLayout ? renderTimestamps : null}<sd-6-27-
|
|
308
|
+
)}" part="timestamps"><div class="${cx("current-time text-sm", this.inverted ? "text-primary-400" : "sd-6-27-1-audio__timestamp-color-text")}">${this.currentTime}</div><div class="${cx("current-time text-sm", this.inverted ? "text-primary-400" : "sd-6-27-1-audio__timestamp-color-text")}">${this.duration}</div></div>`;
|
|
309
|
+
return html`<div class="${cx("w-full flex relative", this.reversedLayout ? "flex-col-reverse" : "flex-col")}" aria-label="${this.localize.term("audioPlayer")}" part="audio-player"><slot @slotchange="${this.updateAudioDuration}"></slot>${!this.animated || this.animated && this.reversedLayout ? renderAudioControls : null}<div class="relative">${this.animated && !this.reversedLayout ? html`${renderAudioControls}` : null} ${this.animated ? html`<canvas class="w-full h-16 -mb-2"></canvas>` : null} ${!this.hideTimestamps && this.animated && this.reversedLayout ? renderTimestamps : null}<sd-6-27-1-range part="progress-slider" tooltip="hidden" min="0" max="100" step="0.001" label="${this.localize.term("seekBar")}" @mousedown="${this.handleThumbGrab}" @touchstart="${this.handleThumbGrab}" @mouseup="${this.handleThumbRelease}" @touchend="${this.handleThumbRelease}" @sd-6-27-1-input="${this.handleAudioProgress}" @keydown="${this.handleAudioProgressKeydown}"></sd-6-27-1-range></div>${this.hasSlotController.test("transcript") ? html`<sd-6-27-1-drawer><slot name="transcript"></slot></sd-6-27-1-drawer>` : null} ${!this.hideTimestamps && (!this.animated || !this.reversedLayout) ? renderTimestamps : null}</div><sd-6-27-1-theme-listener></sd-6-27-1-theme-listener>`;
|
|
310
310
|
}
|
|
311
311
|
};
|
|
312
312
|
SdAudio.styles = [
|
|
313
313
|
...SolidElement.styles,
|
|
314
314
|
css`/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
|
|
315
|
-
sd-6-27-
|
|
315
|
+
sd-6-27-1-button::part(base){display:flex;height:var(--sd-spacing-12);width:var(--sd-spacing-12);align-items:center;justify-content:center;border-radius:var(--sd-radius-full)}sd-6-27-1-button::part(motion-wrapper){border-radius:var(--sd-radius-full)}sd-6-27-1-button::part(label){display:flex;flex-grow:0;align-items:center}sd-6-27-1-range::part(form-control-label){display:none}:host([inverted]) sd-6-27-1-range::part(thumb){outline-color:rgba(var(--sd-color-border-white,var(--sd-color-white)));background-color:rgba(var(--sd-color-icon-fill-white,rgba(var(--sd-color-white))))}:host([animated]) sd-6-27-1-range::part(track){background-color:transparent}:host([inverted]:not([animated])) sd-6-27-1-range::part(track){background-color:rgba(var(--sd-audio__slide-bar--inverted-color-background,rgba(var(--sd-color-primary-400))))}:host([inverted]:not([animated])) sd-6-27-1-range::part(active-track){background-color:rgba(var(--sd-audio__track-bar--inverted-color-background,rgba(var(--sd-color-white))))}.sd-6-27-1-audio__timestamp-color-text{color:rgb(var(--sd-audio__timestamp-color-text,var(--sd-color-text-neutral-700)))}`
|
|
316
316
|
];
|
|
317
317
|
__decorateClass([
|
|
318
318
|
property({ type: Boolean, reflect: true, attribute: "reversed-layout" })
|
|
@@ -354,13 +354,13 @@ __decorateClass([
|
|
|
354
354
|
query('[part="audio-player"]')
|
|
355
355
|
], SdAudio.prototype, "audioPlayerContainer", 2);
|
|
356
356
|
__decorateClass([
|
|
357
|
-
query("sd-6-27-
|
|
357
|
+
query("sd-6-27-1-drawer")
|
|
358
358
|
], SdAudio.prototype, "drawer", 2);
|
|
359
359
|
__decorateClass([
|
|
360
360
|
query("canvas")
|
|
361
361
|
], SdAudio.prototype, "canvas", 2);
|
|
362
362
|
SdAudio = __decorateClass([
|
|
363
|
-
customElement("sd-6-27-
|
|
363
|
+
customElement("sd-6-27-1-audio")
|
|
364
364
|
], SdAudio);
|
|
365
365
|
|
|
366
366
|
export {
|
|
@@ -228,7 +228,7 @@ var SdTextarea = class extends SolidElement {
|
|
|
228
228
|
textareaState === "disabled" || textareaState === "visuallyDisabled" ? "text-neutral-500" : "text-black",
|
|
229
229
|
["invalid", "activeInvalid"].includes(textareaState) && "form-control--invalid-color-background"
|
|
230
230
|
)}"><textarea part="textarea" id="input" class="${cx(
|
|
231
|
-
"ps-4 flex-grow focus:outline-none bg-transparent placeholder:text-neutral-700 resize-none group-has-[sd-6-27-
|
|
231
|
+
"ps-4 flex-grow focus:outline-none bg-transparent placeholder:text-neutral-700 resize-none group-has-[sd-6-27-1-icon]:pe-8",
|
|
232
232
|
{
|
|
233
233
|
sm: isFloatingLabelActive ? "pb-1" : "py-2",
|
|
234
234
|
md: isFloatingLabelActive ? "pb-1" : "py-2",
|
|
@@ -236,7 +236,7 @@ var SdTextarea = class extends SolidElement {
|
|
|
236
236
|
}[this.size],
|
|
237
237
|
this.disabled && "cursor-not-allowed",
|
|
238
238
|
textSize
|
|
239
|
-
)}" title="${this.title}" name="${ifDefined(this.name)}" .value="${live(this.value)}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" ?required="${this.required}" ?visually-disabled="${this.visuallyDisabled}" placeholder="${!this.floatingLabel || isFloatingLabelActive ? ifDefined(this.placeholder) : ""}" minlength="${ifDefined(this.minlength)}" maxlength="${ifDefined(this.maxlength)}" rows="${ifDefined(this.rows)}" autocapitalize="${ifDefined(this.autocapitalize)}" autocorrect="${ifDefined(this.autocorrect)}" ?autofocus="${this.autofocus}" spellcheck="${ifDefined(this.spellcheck)}" enterkeyhint="${ifDefined(this.enterkeyhint)}" inputmode="${ifDefined(this.inputmode)}" aria-describedby="help-text invalid-message" aria-invalid="${this.showInvalidStyle}" aria-disabled="${this.disabled || this.visuallyDisabled}" @change="${this.handleChange}" @input="${this.handleInput}" @invalid="${this.handleInvalid}" @focus="${this.handleFocus}" @blur="${this.handleBlur}"></textarea> ${this.showInvalidStyle ? html`<sd-6-27-
|
|
239
|
+
)}" title="${this.title}" name="${ifDefined(this.name)}" .value="${live(this.value)}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" ?required="${this.required}" ?visually-disabled="${this.visuallyDisabled}" placeholder="${!this.floatingLabel || isFloatingLabelActive ? ifDefined(this.placeholder) : ""}" minlength="${ifDefined(this.minlength)}" maxlength="${ifDefined(this.maxlength)}" rows="${ifDefined(this.rows)}" autocapitalize="${ifDefined(this.autocapitalize)}" autocorrect="${ifDefined(this.autocorrect)}" ?autofocus="${this.autofocus}" spellcheck="${ifDefined(this.spellcheck)}" enterkeyhint="${ifDefined(this.enterkeyhint)}" inputmode="${ifDefined(this.inputmode)}" aria-describedby="help-text invalid-message" aria-invalid="${this.showInvalidStyle}" aria-disabled="${this.disabled || this.visuallyDisabled}" @change="${this.handleChange}" @input="${this.handleInput}" @invalid="${this.handleInvalid}" @focus="${this.handleFocus}" @blur="${this.handleBlur}"></textarea> ${this.showInvalidStyle ? html`<sd-6-27-1-icon class="${cx("text-error absolute right-4 pointer-events-none", iconSize)}" library="_internal" name="risk" part="invalid-icon"></sd-6-27-1-icon>` : ""} ${this.styleOnValid && this.showValidStyle ? html`<sd-6-27-1-icon class="${cx("text-success absolute right-4 pointer-events-none", iconSize)}" library="_internal" name="confirm-circle" part="valid-icon"></sd-6-27-1-icon>` : ""}</div></div><slot name="help-text" part="form-control-help-text" id="help-text" class="${cx(
|
|
240
240
|
"text-sm mt-1",
|
|
241
241
|
hasHelpText && !this.showInvalidStyle ? "block" : "hidden",
|
|
242
242
|
this.visuallyDisabled || this.disabled ? "text-neutral-500" : "text-neutral-700"
|
|
@@ -361,7 +361,7 @@ __decorateClass([
|
|
|
361
361
|
watch(["size", "floatingLabel"])
|
|
362
362
|
], SdTextarea.prototype, "handleSizeChange", 1);
|
|
363
363
|
SdTextarea = __decorateClass([
|
|
364
|
-
customElement("sd-6-27-
|
|
364
|
+
customElement("sd-6-27-1-textarea")
|
|
365
365
|
], SdTextarea);
|
|
366
366
|
|
|
367
367
|
export {
|
|
@@ -38,13 +38,13 @@ var SdBreadcrumbItem = class extends SolidElement {
|
|
|
38
38
|
requestAnimationFrame(() => this.handleCurrentChange());
|
|
39
39
|
}
|
|
40
40
|
render() {
|
|
41
|
-
return html`<sd-6-27-
|
|
41
|
+
return html`<sd-6-27-1-link part="base" href="${ifDefined(!this.current ? this.href : void 0)}" target="${this.target}" standalone class="text-nowrap"><slot></slot></sd-6-27-1-link>`;
|
|
42
42
|
}
|
|
43
43
|
};
|
|
44
44
|
SdBreadcrumbItem.styles = [
|
|
45
45
|
...SolidElement.styles,
|
|
46
46
|
css`/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
|
|
47
|
-
:host{display:inline-flex;align-items:center}sd-6-27-
|
|
47
|
+
:host{display:inline-flex;align-items:center}sd-6-27-1-link::part(base){align-items:center}sd-6-27-1-link::part(icon-left){margin-right:calc(var(--sd-spacing-1) * 0);display:inline-flex}:host([current]) sd-6-27-1-link::part(base){color:rgba(var(--sd-breadcrumb--current-color-text,rgba(var(--sd-color-neutral-700))))}:host([current]) sd-6-27-1-link::part(label){text-decoration-line:none}`
|
|
48
48
|
];
|
|
49
49
|
__decorateClass([
|
|
50
50
|
query('[part="base"]')
|
|
@@ -62,7 +62,7 @@ __decorateClass([
|
|
|
62
62
|
watch("current")
|
|
63
63
|
], SdBreadcrumbItem.prototype, "handleCurrentChange", 1);
|
|
64
64
|
SdBreadcrumbItem = __decorateClass([
|
|
65
|
-
customElement("sd-6-27-
|
|
65
|
+
customElement("sd-6-27-1-breadcrumb-item")
|
|
66
66
|
], SdBreadcrumbItem);
|
|
67
67
|
|
|
68
68
|
export {
|
|
@@ -100,7 +100,7 @@ var SdIcon = class extends SolidElement {
|
|
|
100
100
|
}
|
|
101
101
|
}
|
|
102
102
|
render() {
|
|
103
|
-
return html`<sd-6-27-
|
|
103
|
+
return html`<sd-6-27-1-theme-listener></sd-6-27-1-theme-listener>${unsafeSVG(this.svg)}`;
|
|
104
104
|
}
|
|
105
105
|
};
|
|
106
106
|
SdIcon.styles = [
|
|
@@ -133,7 +133,7 @@ __decorateClass([
|
|
|
133
133
|
watch(["name", "src", "library"])
|
|
134
134
|
], SdIcon.prototype, "setIcon", 1);
|
|
135
135
|
SdIcon = __decorateClass([
|
|
136
|
-
customElement("sd-6-27-
|
|
136
|
+
customElement("sd-6-27-1-icon")
|
|
137
137
|
], SdIcon);
|
|
138
138
|
|
|
139
139
|
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-6-27-
|
|
105
|
+
this.disabled ? "outline-none cursor-not-allowed sd-6-27-1-menu--disabled-color-text hover:bg-transparent" : "cursor-pointer sd-6-27-1-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-6-27-
|
|
110
|
+
)}"><sd-6-27-1-icon name="status-check" library="sd-status-assets" aria-hidden="true"></sd-6-27-1-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-6-27-1-icon name="chevron-right" library="_internal" aria-hidden="true" class="h-6 w-6"></sd-6-27-1-icon></span>` : ""} ${this.submenuController.renderSubmenu()}</div>`;
|
|
111
111
|
}
|
|
112
112
|
};
|
|
113
113
|
SdMenuItem.styles = [
|
|
114
114
|
...SolidElement.styles,
|
|
115
115
|
css`/*! tailwindcss v4.3.0 | 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-6-27-
|
|
116
|
+
:host{--submenu-offset:-6px;display:block}:host(:focus-visible){--tw-outline-style:none;outline-style:none}::slotted(sd-6-27-1-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:calc(var(--sd-spacing-1) * 0);right:calc(var(--sd-spacing-1) * 0);bottom:calc(var(--sd-spacing-1) * 0);left:calc(var(--sd-spacing-1) * 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-6-27-1-menu-color-icon variable replacing with sd-6-27-1-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-6-27-1-menu--disabled-color-icon variable replacing with sd-6-27-1-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-6-27-1-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-6-27-1-menu){max-width:var(--auto-size-available-width)!important;max-height:var(--auto-size-available-height)!important}.sd-6-27-1-menu-color-text{color:rgba(var(--sd-menu-color-text,var(--sd-menu-item-color-text)))}.sd-6-27-1-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-6-27-
|
|
149
|
+
customElement("sd-6-27-1-menu-item")
|
|
150
150
|
], SdMenuItem);
|
|
151
151
|
|
|
152
152
|
export {
|
|
@@ -31,12 +31,12 @@ var SdQuickfact = class extends SdAccordion {
|
|
|
31
31
|
this.expandable && "cursor-pointer select-none"
|
|
32
32
|
)}" role="${ifDefined(this.expandable ? "button" : void 0)}" aria-expanded="${ifDefined(this.expandable ? this.open ? "true" : "false" : void 0)}" aria-controls="${ifDefined(this.expandable ? "content" : void 0)}" tabindex="${this.expandable ? "0" : "-1"}" @click="${this.expandable ? this.handleSummaryClick : null}" @keydown="${this.expandable ? this.handleSummaryKeyDown : null}"><div part="icon" class="${cx("flex flex-grow-0 flex-shrink-0 flex-auto items-center", !this.expandable && "cursor-default")}"><slot name="icon"></slot></div><slot name="summary" part="summary" class="${cx(
|
|
33
33
|
"flex flex-auto items-start text-left text-base leading-normal font-normal sm:leading-tight sm:text-3xl sm:text-center",
|
|
34
|
-
this.expandable ? "sd-6-27-
|
|
34
|
+
this.expandable ? "sd-6-27-1-quickfact--expandable-color-text" : "text-black cursor-default"
|
|
35
35
|
)}">${this.summary}</slot><span part="summary-icon" class="${cx(
|
|
36
36
|
"flex flex-grow-0 flex-shrink-0 flex-auto self-start sm:self-center transition-transform ease-in-out duration-medium text-xl sm:mt-2",
|
|
37
37
|
this.open && "rotate-180",
|
|
38
38
|
!this.expandable && "hidden"
|
|
39
|
-
)}"><slot name="expand-icon" class="${cx(this.open && "hidden")}"><sd-6-27-
|
|
39
|
+
)}"><slot name="expand-icon" class="${cx(this.open && "hidden")}"><sd-6-27-1-icon library="_internal" name="chevron-down" class="group-hover:text-primary-500 transition-colors ease-in-out duration-medium"></sd-6-27-1-icon></slot><slot name="collapse-icon" class="${cx(!this.open && "hidden")}"><sd-6-27-1-icon library="_internal" name="chevron-down" class="group-hover:text-primary-500 transition-colors ease-in-out duration-medium"></sd-6-27-1-icon></slot></span></${header}><div part="content" id="content" class="${cx("overflow-hidden", !this.expandable && "hidden")}"><slot part="content__slot" class="block" role="region" aria-labelledby="header"></slot></div></${base}>`;
|
|
40
40
|
}
|
|
41
41
|
};
|
|
42
42
|
SdQuickfact.styles = [
|
|
@@ -48,7 +48,7 @@ __decorateClass([
|
|
|
48
48
|
property({ type: Boolean, reflect: true })
|
|
49
49
|
], SdQuickfact.prototype, "expandable", 2);
|
|
50
50
|
SdQuickfact = __decorateClass([
|
|
51
|
-
customElement("sd-6-27-
|
|
51
|
+
customElement("sd-6-27-1-quickfact")
|
|
52
52
|
], SdQuickfact);
|
|
53
53
|
setDefaultAnimation("quickfact.show", {
|
|
54
54
|
keyframes: [{ height: "0" }, { height: "auto" }],
|
|
@@ -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-6-27-
|
|
67
|
+
"relative text-center sd-6-27-1-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-6-27-
|
|
69
|
+
this.checked && !this.disabled && !this.visuallyDisabled ? "sd-6-27-1-button--primary--default-color-background sd-6-27-1-button--primary--default-color-text hover:sd-6-27-1-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-6-27-1-radio-button-color-text border-primary cursor-pointer hover:sd-6-27-1-radio-button--hover-color-background hover:sd-6-27-1-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.0 | 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:calc(var(--sd-spacing-1) * 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-6-27-
|
|
92
|
+
:host{display:block;width:-moz-min-content;width:min-content}.hidden-input{all:unset;position:absolute;inset:calc(var(--sd-spacing-1) * 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-6-27-1-button-group__button:not(.sd-6-27-1-button-group__button--first)){margin-inline-start:calc(var(--sd-spacing-3) * -1)}:host([size=md].sd-6-27-1-button-group__button:not(.sd-6-27-1-button-group__button--first)){margin-inline-start:calc(var(--sd-spacing-2) * -1)}:host([size=sm].sd-6-27-1-button-group__button:not(.sd-6-27-1-button-group__button--first)){margin-inline-start:calc(var(--sd-spacing-1) * -1)}:host(.sd-6-27-1-button-group__button--hover){z-index:20}:host(.sd-6-27-1-button-group__button--focus){z-index:30}:host(.sd-6-27-1-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-6-27-
|
|
122
|
+
customElement("sd-6-27-1-radio-button")
|
|
123
123
|
], SdRadioButton);
|
|
124
124
|
|
|
125
125
|
export {
|
|
@@ -22,7 +22,7 @@ var SdBreadcrumb = class extends SolidElement {
|
|
|
22
22
|
this.isTruncated = false;
|
|
23
23
|
}
|
|
24
24
|
get items() {
|
|
25
|
-
return this.querySelectorAll("sd-6-27-
|
|
25
|
+
return this.querySelectorAll("sd-6-27-1-breadcrumb-item");
|
|
26
26
|
}
|
|
27
27
|
cacheItemPositions() {
|
|
28
28
|
this.items.forEach((item) => {
|
|
@@ -67,12 +67,12 @@ var SdBreadcrumb = class extends SolidElement {
|
|
|
67
67
|
}
|
|
68
68
|
handleMobileChevron() {
|
|
69
69
|
var _a, _b, _c;
|
|
70
|
-
const icon = document.createElement("sd-6-27-
|
|
70
|
+
const icon = document.createElement("sd-6-27-1-icon");
|
|
71
71
|
icon.setAttribute("slot", "icon-left");
|
|
72
72
|
icon.setAttribute("library", "_internal");
|
|
73
73
|
icon.setAttribute("name", "chevron-left");
|
|
74
74
|
icon.setAttribute("class", "text-base me-1 lg:hidden");
|
|
75
|
-
(_c = (_b = (_a = Array.from(this.items).at(-2)) == null ? void 0 : _a.shadowRoot) == null ? void 0 : _b.querySelector("sd-6-27-
|
|
75
|
+
(_c = (_b = (_a = Array.from(this.items).at(-2)) == null ? void 0 : _a.shadowRoot) == null ? void 0 : _b.querySelector("sd-6-27-1-link")) == null ? void 0 : _c.appendChild(icon);
|
|
76
76
|
}
|
|
77
77
|
handleSlotChange() {
|
|
78
78
|
this.handleMobileChevron();
|
|
@@ -87,13 +87,13 @@ var SdBreadcrumb = class extends SolidElement {
|
|
|
87
87
|
this.resizeObserver.unobserve(this);
|
|
88
88
|
}
|
|
89
89
|
render() {
|
|
90
|
-
return html`<nav part="base" class="flex items-center pb-1" aria-label="${this.label}"><sd-6-27-
|
|
90
|
+
return html`<nav part="base" class="flex items-center pb-1" aria-label="${this.label}"><sd-6-27-1-dropdown part="truncated" class="${cx(!this.isTruncated && "absolute opacity-0 pointer-events-none")}"><button slot="trigger" tabindex="${this.isTruncated ? "0" : "-1"}" aria-label="${this.localize.term("truncatedBreadcrumbs")}" aria-expanded="false" aria-haspopup="true" class="flex sd-interactive">[...]</button><ol part="truncated-dropdown" class="flex flex-col gap-4 px-2 py-3 min-w-40"></ol></sd-6-27-1-dropdown><ol part="list" class="flex items-center"><slot @slotchange="${this.handleSlotChange}"></slot></ol></nav>`;
|
|
91
91
|
}
|
|
92
92
|
};
|
|
93
93
|
SdBreadcrumb.styles = [
|
|
94
94
|
...SolidElement.styles,
|
|
95
95
|
css`/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
|
|
96
|
-
:host{position:relative;display:block}::slotted(sd-6-27-
|
|
96
|
+
:host{position:relative;display:block}::slotted(sd-6-27-1-breadcrumb-item:not(:last-of-type))::after,sd-6-27-1-dropdown::after{margin-inline:var(--sd-spacing-2);display:none;height:var(--sd-spacing-1);width:var(--sd-spacing-1);border-radius:var(--sd-radius-full);background-color:rgba(var(--sd-breadcrumb__separator-color,rgba(var(--sd-color-neutral-400))));--tw-content:'';content:var(--tw-content)}@media (width >= 64rem){::slotted(sd-6-27-1-breadcrumb-item:not(:last-of-type))::after,sd-6-27-1-dropdown::after{display:inline-block}}::slotted(sd-6-27-1-breadcrumb-item:nth-last-child(2)){display:flex}@media (width >= 64rem){::slotted(sd-6-27-1-breadcrumb-item:nth-last-child(2))::after{background-color:rgba(var(--sd-breadcrumb__separator--current-color,rgba(var(--sd-color-accent))))}}::slotted(sd-6-27-1-breadcrumb-item),sd-6-27-1-dropdown{display:none;align-items:center;font-size:var(--sd-text-sm);line-height:var(--tw-leading,var(--text-sm--line-height,calc(1.25 / .875)))}@media (width >= 64rem){::slotted(sd-6-27-1-breadcrumb-item),sd-6-27-1-dropdown{display:flex}}@property --tw-content{syntax:"*";inherits:false;initial-value:""}`
|
|
97
97
|
];
|
|
98
98
|
__decorateClass([
|
|
99
99
|
query('[part="base"]')
|
|
@@ -117,7 +117,7 @@ __decorateClass([
|
|
|
117
117
|
state()
|
|
118
118
|
], SdBreadcrumb.prototype, "isTruncated", 2);
|
|
119
119
|
SdBreadcrumb = __decorateClass([
|
|
120
|
-
customElement("sd-6-27-
|
|
120
|
+
customElement("sd-6-27-1-breadcrumb")
|
|
121
121
|
], SdBreadcrumb);
|
|
122
122
|
|
|
123
123
|
export {
|
|
@@ -45,10 +45,10 @@ var SdTeaserMedia = class extends SolidElement {
|
|
|
45
45
|
)}"></div><div class="${cx("relative", ["primary", "gradient-dark"].includes(this.variant) && "text-white")}"><div class="${cx(
|
|
46
46
|
"absolute inset-0 pointer-events-none",
|
|
47
47
|
{
|
|
48
|
-
white: "sd-6-27-
|
|
49
|
-
"neutral-100": "sd-6-27-
|
|
48
|
+
white: "sd-6-27-1-teaser-media--white-color-background group-hover:sd-6-27-1-teaser-media--white--hover-color-background ",
|
|
49
|
+
"neutral-100": "sd-6-27-1-teaser-media--neutral-100-color-background group-hover:sd-6-27-1-teaser-media--neutral-100--hover-color-background",
|
|
50
50
|
primary: "bg-primary/80 text-white group-hover:bg-primary/90",
|
|
51
|
-
"primary-100": "sd-6-27-
|
|
51
|
+
"primary-100": "sd-6-27-1-teaser-media--primary-100-color-background group-hover:sd-6-27-1-teaser-media--primary-100--hover-color-background",
|
|
52
52
|
"gradient-light": "bg-gradient-to-t from-white/75 to-white/60",
|
|
53
53
|
"gradient-dark": "bg-gradient-to-t from-primary-800/75 to-primary-800/60"
|
|
54
54
|
}[this.variant]
|
|
@@ -58,8 +58,8 @@ var SdTeaserMedia = class extends SolidElement {
|
|
|
58
58
|
this.open ? "opacity-100" : "opacity-0"
|
|
59
59
|
)}" part="expandable" aria-hidden="true"><slot name="expandable"></slot></div>${slots["teaser-has-expandable"] ? html`<button part="toggle" class="${cx(
|
|
60
60
|
"mt-2",
|
|
61
|
-
["primary", "gradient-dark"].includes(this.variant) ? "text-white" : "sd-6-27-
|
|
62
|
-
)}" @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-27-
|
|
61
|
+
["primary", "gradient-dark"].includes(this.variant) ? "text-white" : "sd-6-27-1-teaser-media-color-icon-fill"
|
|
62
|
+
)}" @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-27-1-icon class="${cx("w-6 h-6 transition-transform", this.open && "rotate-180")}" library="_internal" name="chevron-down"></sd-6-27-1-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>`;
|
|
63
63
|
}
|
|
64
64
|
};
|
|
65
65
|
SdTeaserMedia.styles = [
|
|
@@ -80,7 +80,7 @@ __decorateClass([
|
|
|
80
80
|
query('[part="base"]')
|
|
81
81
|
], SdTeaserMedia.prototype, "teaserMedia", 2);
|
|
82
82
|
SdTeaserMedia = __decorateClass([
|
|
83
|
-
customElement("sd-6-27-
|
|
83
|
+
customElement("sd-6-27-1-teaser-media")
|
|
84
84
|
], SdTeaserMedia);
|
|
85
85
|
|
|
86
86
|
export {
|
|
@@ -17,7 +17,7 @@ var SdSkeleton = class extends SolidElement {
|
|
|
17
17
|
}
|
|
18
18
|
render() {
|
|
19
19
|
return html`<div part="base" aria-hidden="true" class="${cx(
|
|
20
|
-
"sd-6-27-
|
|
20
|
+
"sd-6-27-1-skeleton-color w-full h-full animate-pulse",
|
|
21
21
|
{
|
|
22
22
|
rectangular: "rounded-sm",
|
|
23
23
|
circular: "rounded-full inline-block"
|
|
@@ -34,7 +34,7 @@ __decorateClass([
|
|
|
34
34
|
property({ type: String, reflect: true })
|
|
35
35
|
], SdSkeleton.prototype, "variant", 2);
|
|
36
36
|
SdSkeleton = __decorateClass([
|
|
37
|
-
customElement("sd-6-27-
|
|
37
|
+
customElement("sd-6-27-1-skeleton")
|
|
38
38
|
], SdSkeleton);
|
|
39
39
|
|
|
40
40
|
export {
|
|
@@ -88,14 +88,14 @@ var SdRadioGroup = class extends SolidElement {
|
|
|
88
88
|
}
|
|
89
89
|
}
|
|
90
90
|
getAllRadios() {
|
|
91
|
-
const radios = [...this.querySelectorAll("sd-6-27-
|
|
91
|
+
const radios = [...this.querySelectorAll("sd-6-27-1-radio, sd-6-27-1-radio-button")];
|
|
92
92
|
if (radios.length === 0) {
|
|
93
93
|
console.warn("No radios found in the radio group.");
|
|
94
94
|
}
|
|
95
95
|
return radios;
|
|
96
96
|
}
|
|
97
97
|
handleRadioClick(event) {
|
|
98
|
-
const target = event.target.closest("sd-6-27-
|
|
98
|
+
const target = event.target.closest("sd-6-27-1-radio, sd-6-27-1-radio-button");
|
|
99
99
|
const oldValue = this.value;
|
|
100
100
|
const radios = this.getAllRadios();
|
|
101
101
|
if (radios.length === 0) {
|
|
@@ -185,7 +185,7 @@ var SdRadioGroup = class extends SolidElement {
|
|
|
185
185
|
}
|
|
186
186
|
})
|
|
187
187
|
);
|
|
188
|
-
this.hasButtonGroup = radios.some((radio) => radio.tagName.toLowerCase() === "sd-6-27-
|
|
188
|
+
this.hasButtonGroup = radios.some((radio) => radio.tagName.toLowerCase() === "sd-6-27-1-radio-button");
|
|
189
189
|
if (!radios.some((radio) => radio.checked)) {
|
|
190
190
|
if (this.hasButtonGroup) {
|
|
191
191
|
const buttonRadio = (_a = radios[0].shadowRoot) == null ? void 0 : _a.querySelector("button");
|
|
@@ -197,26 +197,26 @@ var SdRadioGroup = class extends SolidElement {
|
|
|
197
197
|
}
|
|
198
198
|
}
|
|
199
199
|
if (this.hasButtonGroup) {
|
|
200
|
-
const buttonGroup = (_b = this.shadowRoot) == null ? void 0 : _b.querySelector("sd-6-27-
|
|
200
|
+
const buttonGroup = (_b = this.shadowRoot) == null ? void 0 : _b.querySelector("sd-6-27-1-button-group");
|
|
201
201
|
if (buttonGroup) {
|
|
202
202
|
buttonGroup.disableRole = true;
|
|
203
203
|
}
|
|
204
204
|
}
|
|
205
205
|
}
|
|
206
206
|
syncRadios() {
|
|
207
|
-
if (customElements.get("sd-6-27-
|
|
207
|
+
if (customElements.get("sd-6-27-1-radio") && customElements.get("sd-6-27-1-radio-button")) {
|
|
208
208
|
this.syncRadioElements();
|
|
209
209
|
return;
|
|
210
210
|
}
|
|
211
|
-
if (customElements.get("sd-6-27-
|
|
211
|
+
if (customElements.get("sd-6-27-1-radio")) {
|
|
212
212
|
this.syncRadioElements();
|
|
213
213
|
} else {
|
|
214
|
-
customElements.whenDefined("sd-6-27-
|
|
214
|
+
customElements.whenDefined("sd-6-27-1-radio").then(() => this.syncRadios());
|
|
215
215
|
}
|
|
216
|
-
if (customElements.get("sd-6-27-
|
|
216
|
+
if (customElements.get("sd-6-27-1-radio-button")) {
|
|
217
217
|
this.syncRadioElements();
|
|
218
218
|
} else {
|
|
219
|
-
customElements.whenDefined("sd-6-27-
|
|
219
|
+
customElements.whenDefined("sd-6-27-1-radio-button").then(() => this.syncRadios());
|
|
220
220
|
}
|
|
221
221
|
}
|
|
222
222
|
updateCheckedRadio() {
|
|
@@ -294,7 +294,7 @@ var SdRadioGroup = class extends SolidElement {
|
|
|
294
294
|
vertical: "flex-col",
|
|
295
295
|
horizontal: "flex-row"
|
|
296
296
|
}[this.orientation]
|
|
297
|
-
)}"><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-27-
|
|
297
|
+
)}"><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-27-1-button-group class="border border-primary sd-6-27-1-radio-button-group-border-radius sd-6-27-1-radio-button-group-border-width sd-6-27-1-radio-button-group-padding" part="button-group" exportparts="base:button-group__base" role="presentation">${defaultSlot}</sd-6-27-1-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-27-1-icon part="invalid-icon" class="${cx("text-error")}" library="_internal" name="risk"></sd-6-27-1-icon>` : ""} ${this.formControlController.renderInvalidMessage(this.size)}</div>`;
|
|
298
298
|
}
|
|
299
299
|
};
|
|
300
300
|
/**
|
|
@@ -303,7 +303,7 @@ var SdRadioGroup = class extends SolidElement {
|
|
|
303
303
|
SdRadioGroup.styles = [
|
|
304
304
|
...SolidElement.styles,
|
|
305
305
|
css`/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
|
|
306
|
-
:host{display:block}:host([orientation=vertical]) ::slotted(sd-6-27-
|
|
306
|
+
:host{display:block}:host([orientation=vertical]) ::slotted(sd-6-27-1-radio){margin-bottom:var(--sd-spacing-2);display:flex}:host([orientation=vertical]) ::slotted(sd-6-27-1-radio:last-of-type){margin-bottom:calc(var(--sd-spacing-1) * 0)}:host([orientation=horizontal]) ::slotted(sd-6-27-1-radio){margin-right:var(--sd-spacing-6)}:host([orientation=horizontal]) ::slotted(sd-6-27-1-radio:last-of-type){margin-right:calc(var(--sd-spacing-1) * 0)}:host([orientation=horizontal]):host([size=sm]) ::slotted(sd-6-27-1-radio){margin-right:var(--sd-spacing-4)}:host([orientation=horizontal]):host([size=sm]) ::slotted(sd-6-27-1-radio:last-of-type){margin-right:calc(var(--sd-spacing-1) * 0)}:host([required]) #label::after{content:' *'}:host:has(sd-6-27-1-button-group){display:inline-flex}`
|
|
307
307
|
];
|
|
308
308
|
__decorateClass([
|
|
309
309
|
query("slot:not([name])")
|
|
@@ -357,7 +357,7 @@ __decorateClass([
|
|
|
357
357
|
watch("value")
|
|
358
358
|
], SdRadioGroup.prototype, "handleValueChange", 1);
|
|
359
359
|
SdRadioGroup = __decorateClass([
|
|
360
|
-
customElement("sd-6-27-
|
|
360
|
+
customElement("sd-6-27-1-radio-group")
|
|
361
361
|
], SdRadioGroup);
|
|
362
362
|
|
|
363
363
|
export {
|
|
@@ -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-6-27-
|
|
65
|
+
return [...this.body.assignedElements()].filter((el) => el.tagName.toLowerCase() === "sd-6-27-1-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-6-27-
|
|
140
|
+
customElement("sd-6-27-1-step-group")
|
|
141
141
|
], SdStepGroup);
|
|
142
142
|
|
|
143
143
|
export {
|
|
@@ -48,7 +48,7 @@ var SubmenuController = class {
|
|
|
48
48
|
if (event.target === this.host) {
|
|
49
49
|
event.preventDefault();
|
|
50
50
|
event.stopPropagation();
|
|
51
|
-
} else if (event.target instanceof Element && (event.target.tagName === "sd-6-27-
|
|
51
|
+
} else if (event.target instanceof Element && (event.target.tagName === "sd-6-27-1-menu-item" || ((_a = event.target.role) == null ? void 0 : _a.startsWith("menuitem")))) {
|
|
52
52
|
const type = event.target.getAttribute("type");
|
|
53
53
|
if (type !== "checkbox") {
|
|
54
54
|
this.disableSubmenu();
|
|
@@ -69,7 +69,7 @@ var SubmenuController = class {
|
|
|
69
69
|
// Set the safe triangle values for the submenu when the position changes
|
|
70
70
|
this.handlePopupReposition = () => {
|
|
71
71
|
const submenuSlot = this.host.renderRoot.querySelector("slot[name='submenu']");
|
|
72
|
-
const menu = submenuSlot == null ? void 0 : submenuSlot.assignedElements({ flatten: true }).filter((el) => el.localName === "sd-6-27-
|
|
72
|
+
const menu = submenuSlot == null ? void 0 : submenuSlot.assignedElements({ flatten: true }).filter((el) => el.localName === "sd-6-27-1-menu")[0];
|
|
73
73
|
const isRtl = getComputedStyle(this.host).direction === "rtl";
|
|
74
74
|
if (!menu) {
|
|
75
75
|
return;
|
|
@@ -141,7 +141,7 @@ var SubmenuController = class {
|
|
|
141
141
|
}
|
|
142
142
|
let menuItems = null;
|
|
143
143
|
for (const elt of submenuSlot.assignedElements()) {
|
|
144
|
-
menuItems = elt.querySelectorAll("sd-6-27-
|
|
144
|
+
menuItems = elt.querySelectorAll("sd-6-27-1-menu-item, [role^='menuitem']");
|
|
145
145
|
if (menuItems.length !== 0) {
|
|
146
146
|
break;
|
|
147
147
|
}
|
|
@@ -220,7 +220,7 @@ var SubmenuController = class {
|
|
|
220
220
|
if (!this.isConnected) {
|
|
221
221
|
return html`<slot name="submenu" hidden></slot>`;
|
|
222
222
|
}
|
|
223
|
-
return html`<sd-6-27-
|
|
223
|
+
return html`<sd-6-27-1-popup ${ref(this.popupRef)} placement="${isRtl ? "left-start" : "right-start"}" anchor="anchor" flip flip-fallback-strategy="best-fit" skidding="${this.skidding}" strategy="fixed" auto-size="vertical" auto-size-padding="10"><slot name="submenu"></slot></sd-6-27-1-popup>`;
|
|
224
224
|
}
|
|
225
225
|
};
|
|
226
226
|
|
|
@@ -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-6-27-
|
|
115
|
+
`relative flex flex-initial items-center justify-center sd-6-27-1-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-6-27-
|
|
118
|
+
this.disabled && this.checked ? "bg-neutral-500" : this.disabled ? "border-neutral-500" : this.showInvalidStyle ? this.checked ? "border-error bg-error hover:bg-error-400 hover:border-error-400 group-hover:border-error-400 group-hover:bg-error-400" : "border-error bg-white hover:border-error-400 hover:bg-white group-hover:border-error-400 group-hover:bg-white" : this.checked ? "border-accent hover:sd-6-27-1-switch--checked--hover-color-background bg-accent hover:border-accent-550 group-hover:border-accent-550 group-hover:sd-6-27-1-switch--checked--hover-color-background" : "sd-6-27-1-switch--unchecked-color-border bg-white hover:sd-6-27-1-switch--unchecked--hover-color-background group-hover:sd-6-27-1-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-6-27-
|
|
122
|
-
)}"></span> </span><span part="label" id="label" class="${cx("select-none inline-block ml-2", this.disabled ? "text-neutral-500" : "sd-6-27-
|
|
121
|
+
this.disabled && this.checked ? "translate-x-2" : this.disabled ? "-translate-x-2" : this.showInvalidStyle ? this.checked ? "translate-x-2" : "bg-error -translate-x-2 hover:bg-error-400 hover:border-error-400 group-hover:border-error-400 group-hover:bg-error-400" : this.checked ? "translate-x-2" : "-translate-x-2 sd-6-27-1-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-6-27-1-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-6-27-1-icon part="invalid-icon" class="${cx("text-error")}" library="_internal" name="risk"></sd-6-27-1-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-6-27-
|
|
173
|
+
customElement("sd-6-27-1-switch")
|
|
174
174
|
], SdSwitch);
|
|
175
175
|
|
|
176
176
|
export {
|
|
@@ -66,13 +66,13 @@ var SdBrandshape = class extends SolidElement {
|
|
|
66
66
|
"w-full block relative"
|
|
67
67
|
)}"><div part="shape-middle" class="${cx(
|
|
68
68
|
{
|
|
69
|
-
"neutral-100": "sd-6-27-
|
|
70
|
-
primary: "sd-6-27-
|
|
71
|
-
white: "sd-6-27-
|
|
69
|
+
"neutral-100": "sd-6-27-1-brandshape--neutral-100-color-background",
|
|
70
|
+
primary: "sd-6-27-1-brandshape--primary-color-background",
|
|
71
|
+
white: "sd-6-27-1-brandshape--white-color-background",
|
|
72
72
|
"border-white": "bg-transparent",
|
|
73
73
|
"border-primary": "bg-transparent",
|
|
74
|
-
"primary|80": "sd-6-27-
|
|
75
|
-
"white|80": "sd-6-27-
|
|
74
|
+
"primary|80": "sd-6-27-1-brandshape--primary-80-color-background",
|
|
75
|
+
"white|80": "sd-6-27-1-brandshape--white-80-color-background",
|
|
76
76
|
image: "bg-transparent"
|
|
77
77
|
}[this.variant],
|
|
78
78
|
"w-full block absolute h-full top-0 left-0 z-0"
|
|
@@ -87,13 +87,13 @@ var SdBrandshape = class extends SolidElement {
|
|
|
87
87
|
renderWhitespaceFix(position) {
|
|
88
88
|
return html`<div class="${cx(
|
|
89
89
|
{
|
|
90
|
-
"neutral-100": "sd-6-27-
|
|
91
|
-
primary: "sd-6-27-
|
|
92
|
-
white: "sd-6-27-
|
|
90
|
+
"neutral-100": "sd-6-27-1-brandshape--neutral-100-color-background",
|
|
91
|
+
primary: "sd-6-27-1-brandshape--primary-color-background",
|
|
92
|
+
white: "sd-6-27-1-brandshape--white-color-background",
|
|
93
93
|
"border-white": "bg-transparent",
|
|
94
94
|
"border-primary": "bg-transparent",
|
|
95
|
-
"primary|80": "sd-6-27-
|
|
96
|
-
"white|80": "sd-6-27-
|
|
95
|
+
"primary|80": "sd-6-27-1-brandshape--primary-80-color-background",
|
|
96
|
+
"white|80": "sd-6-27-1-brandshape--white-80-color-background",
|
|
97
97
|
image: "bg-transparent"
|
|
98
98
|
}[this.variant],
|
|
99
99
|
{ top: "bottom-0", bottom: "top-0" }[position],
|
|
@@ -135,7 +135,7 @@ __decorateClass([
|
|
|
135
135
|
state()
|
|
136
136
|
], SdBrandshape.prototype, "componentBreakpoint", 2);
|
|
137
137
|
SdBrandshape = __decorateClass([
|
|
138
|
-
customElement("sd-6-27-
|
|
138
|
+
customElement("sd-6-27-1-brandshape")
|
|
139
139
|
], SdBrandshape);
|
|
140
140
|
|
|
141
141
|
export {
|