@solid-design-system/components 6.22.0 → 6.22.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cdn/chunks/chunk.23WKPZET.js +1 -0
- package/cdn/chunks/chunk.AHMUV4CN.js +2 -0
- package/cdn/components/datepicker/datepicker-converters.d.ts +12 -0
- package/cdn/components/datepicker/datepicker-converters.js +1 -0
- package/cdn/components/datepicker/datepicker.js +1 -1
- package/cdn/custom-elements.json +1767 -1483
- package/cdn/solid-components.bundle.js +28 -28
- package/cdn/solid-components.iife.js +27 -27
- package/cdn/solid-components.js +1 -1
- package/cdn/vscode.html-custom-data.json +159 -159
- package/cdn/web-types.json +642 -564
- package/cdn-versioned/chunks/chunk.23WKPZET.js +1 -0
- package/cdn-versioned/chunks/chunk.2IFJTWWI.js +2 -2
- package/cdn-versioned/chunks/chunk.2Q64C7PW.js +2 -2
- package/cdn-versioned/chunks/chunk.2SEVUMWS.js +2 -2
- package/cdn-versioned/chunks/chunk.2UC7ID2H.js +2 -2
- package/cdn-versioned/chunks/chunk.3UAQXMAF.js +2 -2
- package/cdn-versioned/chunks/chunk.4LLZ2ILW.js +2 -2
- package/cdn-versioned/chunks/chunk.4OE2TU3Y.js +2 -2
- package/cdn-versioned/chunks/chunk.5CJ4UEYT.js +2 -2
- package/cdn-versioned/chunks/chunk.6HSHV3NX.js +3 -3
- package/cdn-versioned/chunks/chunk.6PB7EWTQ.js +1 -1
- package/cdn-versioned/chunks/chunk.7DKBOZJU.js +2 -2
- package/cdn-versioned/chunks/chunk.7LZHW3Q5.js +1 -1
- package/cdn-versioned/chunks/chunk.AGTHQN5U.js +2 -2
- package/cdn-versioned/chunks/chunk.AHMUV4CN.js +2 -0
- package/cdn-versioned/chunks/chunk.AO2OON4N.js +5 -5
- package/cdn-versioned/chunks/chunk.APOMDHNP.js +1 -1
- package/cdn-versioned/chunks/chunk.BOWHXMXY.js +2 -2
- package/cdn-versioned/chunks/chunk.BS3GY6J5.js +5 -5
- package/cdn-versioned/chunks/chunk.CW7N5I3S.js +2 -2
- package/cdn-versioned/chunks/chunk.CXFLSM56.js +2 -2
- package/cdn-versioned/chunks/chunk.D4SBGWDF.js +2 -2
- package/cdn-versioned/chunks/chunk.DDU5T7TW.js +2 -2
- package/cdn-versioned/chunks/chunk.DSKB3SEU.js +1 -1
- package/cdn-versioned/chunks/chunk.E3RBLJOD.js +2 -2
- package/cdn-versioned/chunks/chunk.EBMYXBFR.js +2 -2
- package/cdn-versioned/chunks/chunk.EDP2BY4Q.js +1 -1
- package/cdn-versioned/chunks/chunk.ENE5YY4Y.js +9 -9
- package/cdn-versioned/chunks/chunk.EPVQ4QAS.js +2 -2
- package/cdn-versioned/chunks/chunk.ES62UWOT.js +2 -2
- package/cdn-versioned/chunks/chunk.FEXFNF27.js +2 -2
- package/cdn-versioned/chunks/chunk.GXY2VZH2.js +2 -2
- package/cdn-versioned/chunks/chunk.ICWUJ66F.js +2 -2
- package/cdn-versioned/chunks/chunk.J6KIY4UA.js +2 -2
- package/cdn-versioned/chunks/chunk.JFN54TP3.js +3 -3
- package/cdn-versioned/chunks/chunk.JHDF277H.js +1 -1
- package/cdn-versioned/chunks/chunk.JQW6SYSE.js +2 -2
- package/cdn-versioned/chunks/chunk.L7BTB6LI.js +2 -2
- package/cdn-versioned/chunks/chunk.LH5RKLIB.js +2 -2
- package/cdn-versioned/chunks/chunk.LZRL7OLU.js +1 -1
- package/cdn-versioned/chunks/chunk.MC7A5NMS.js +2 -2
- package/cdn-versioned/chunks/chunk.MLNVOR7M.js +2 -2
- package/cdn-versioned/chunks/chunk.OJGPDUWV.js +2 -2
- package/cdn-versioned/chunks/chunk.OMRKG6ND.js +2 -2
- package/cdn-versioned/chunks/chunk.POBQCTPL.js +3 -3
- package/cdn-versioned/chunks/chunk.PXFYL6KY.js +2 -2
- package/cdn-versioned/chunks/chunk.Q7E6F2HW.js +1 -1
- package/cdn-versioned/chunks/chunk.R6ZEBMRH.js +2 -2
- package/cdn-versioned/chunks/chunk.RKMV24FY.js +2 -2
- package/cdn-versioned/chunks/chunk.RRIIBUZG.js +2 -2
- package/cdn-versioned/chunks/chunk.S6JJWCTI.js +2 -2
- package/cdn-versioned/chunks/chunk.SCHC5WSJ.js +1 -1
- package/cdn-versioned/chunks/chunk.SOQN353H.js +2 -2
- package/cdn-versioned/chunks/chunk.UTS7NBOJ.js +1 -1
- package/cdn-versioned/chunks/chunk.UTXIVBR2.js +1 -1
- package/cdn-versioned/chunks/chunk.VFMCDN7W.js +2 -2
- package/cdn-versioned/chunks/chunk.W7A3TU2Z.js +1 -1
- package/cdn-versioned/chunks/chunk.WHOK4XT7.js +2 -2
- package/cdn-versioned/chunks/chunk.WIHSK6PN.js +2 -2
- package/cdn-versioned/chunks/chunk.WYUWPKVY.js +2 -2
- package/cdn-versioned/chunks/chunk.XICZDG3E.js +2 -2
- package/cdn-versioned/chunks/chunk.XJAJO727.js +1 -1
- package/cdn-versioned/chunks/chunk.YAANK3U6.js +2 -2
- package/cdn-versioned/chunks/chunk.ZIC3N6YJ.js +2 -2
- package/cdn-versioned/chunks/chunk.ZSCCD7CU.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-converters.d.ts +12 -0
- package/cdn-versioned/components/datepicker/datepicker-converters.js +1 -0
- package/cdn-versioned/components/datepicker/datepicker.d.ts +1 -1
- package/cdn-versioned/components/datepicker/datepicker.js +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 +1987 -1703
- package/cdn-versioned/internal/form.js +2 -2
- package/cdn-versioned/solid-components.bundle.js +88 -88
- package/cdn-versioned/solid-components.css +2 -2
- package/cdn-versioned/solid-components.iife.js +88 -88
- package/cdn-versioned/solid-components.js +1 -1
- package/cdn-versioned/vscode.html-custom-data.json +253 -253
- package/cdn-versioned/web-types.json +777 -699
- package/dist/chunks/{chunk.C7RAFK2U.js → chunk.LQBN4KWJ.js} +5 -78
- package/dist/chunks/chunk.TJ2FFWLY.js +85 -0
- package/dist/components/datepicker/datepicker-converters.d.ts +12 -0
- package/dist/components/datepicker/datepicker-converters.js +11 -0
- package/dist/components/datepicker/datepicker.js +2 -1
- package/dist/custom-elements.json +1767 -1483
- package/dist/solid-components.js +24 -23
- package/dist/vscode.html-custom-data.json +159 -159
- package/dist/web-types.json +642 -564
- package/dist-versioned/chunks/chunk.2PFOTMKD.js +33 -33
- package/dist-versioned/chunks/chunk.2XO44VKK.js +2 -2
- package/dist-versioned/chunks/chunk.3MUWC7ZQ.js +1 -1
- package/dist-versioned/chunks/chunk.3NFW33UT.js +5 -5
- package/dist-versioned/chunks/chunk.3P3ZLPSI.js +5 -5
- package/dist-versioned/chunks/chunk.4CYDINDB.js +2 -2
- package/dist-versioned/chunks/chunk.5NTF57TJ.js +1 -1
- package/dist-versioned/chunks/chunk.6XTGETVW.js +11 -11
- package/dist-versioned/chunks/chunk.7AGLFNJK.js +3 -3
- package/dist-versioned/chunks/chunk.7BSLFKU5.js +10 -10
- package/dist-versioned/chunks/chunk.7BT4WAQS.js +3 -3
- package/dist-versioned/chunks/chunk.AGSJ3MWY.js +2 -2
- package/dist-versioned/chunks/chunk.AJ6IUEXD.js +5 -5
- package/dist-versioned/chunks/chunk.AQ5RLVDO.js +1 -1
- package/dist-versioned/chunks/chunk.B4TM2WST.js +5 -5
- package/dist-versioned/chunks/chunk.BR5PPGBX.js +7 -7
- package/dist-versioned/chunks/chunk.BS2ZPKOG.js +11 -11
- package/dist-versioned/chunks/chunk.C3WIBDGG.js +2 -2
- package/dist-versioned/chunks/chunk.CMHJNHR6.js +25 -25
- package/dist-versioned/chunks/chunk.D2XKPNOP.js +6 -6
- package/dist-versioned/chunks/chunk.DG6HQUYC.js +10 -10
- package/dist-versioned/chunks/chunk.DYG4FWRG.js +2 -2
- package/dist-versioned/chunks/chunk.EAJ3CM6N.js +4 -4
- package/dist-versioned/chunks/chunk.EDHEUF6G.js +25 -25
- package/dist-versioned/chunks/chunk.EEEIIJMB.js +2 -2
- package/dist-versioned/chunks/chunk.EXZ6VFXN.js +1 -1
- package/dist-versioned/chunks/chunk.FRLOS6P7.js +2 -2
- package/dist-versioned/chunks/chunk.G5R47M2B.js +6 -6
- package/dist-versioned/chunks/chunk.GFHNKXRG.js +8 -8
- package/dist-versioned/chunks/chunk.H3SVUQP3.js +5 -5
- package/dist-versioned/chunks/chunk.H53WQBDK.js +1 -1
- package/dist-versioned/chunks/chunk.HDGNHXRQ.js +11 -11
- package/dist-versioned/chunks/chunk.I4T5RT5D.js +4 -4
- package/dist-versioned/chunks/chunk.J3RX4Y6S.js +2 -2
- package/dist-versioned/chunks/chunk.J5A33XU2.js +4 -4
- package/dist-versioned/chunks/chunk.JQBYEVD6.js +3 -3
- package/dist-versioned/chunks/chunk.KEJFWGZI.js +4 -4
- package/dist-versioned/chunks/chunk.KVKO4ZLN.js +10 -10
- package/dist-versioned/chunks/chunk.KWD3E7PP.js +6 -6
- package/dist-versioned/chunks/{chunk.C7RAFK2U.js → chunk.LQBN4KWJ.js} +15 -88
- package/dist-versioned/chunks/chunk.M4O3MDU3.js +13 -13
- package/dist-versioned/chunks/chunk.MLDYTATL.js +7 -7
- package/dist-versioned/chunks/chunk.NWI2U6GV.js +4 -4
- package/dist-versioned/chunks/chunk.POKSS32D.js +2 -2
- package/dist-versioned/chunks/chunk.RMSZCVAI.js +5 -5
- package/dist-versioned/chunks/chunk.RS7M5R4R.js +5 -5
- package/dist-versioned/chunks/chunk.RU5GF26P.js +5 -5
- package/dist-versioned/chunks/chunk.SB4P52KM.js +1 -1
- package/dist-versioned/chunks/chunk.SLUGXG7E.js +2 -2
- package/dist-versioned/chunks/chunk.TE6LK5OI.js +14 -14
- package/dist-versioned/chunks/chunk.TJ2FFWLY.js +85 -0
- package/dist-versioned/chunks/chunk.TJI3UYUJ.js +5 -5
- package/dist-versioned/chunks/chunk.TQGIML36.js +2 -2
- package/dist-versioned/chunks/chunk.UF4HXV3V.js +10 -10
- package/dist-versioned/chunks/chunk.UI7JLJDL.js +6 -6
- package/dist-versioned/chunks/chunk.UIQBHPD3.js +2 -2
- package/dist-versioned/chunks/chunk.UWOJEWNV.js +2 -2
- package/dist-versioned/chunks/chunk.VTBH4LAP.js +1 -1
- package/dist-versioned/chunks/chunk.W6PBLDS5.js +12 -12
- package/dist-versioned/chunks/chunk.WXXHOSE3.js +4 -4
- package/dist-versioned/chunks/chunk.X3SWQRRP.js +3 -3
- package/dist-versioned/chunks/chunk.YSZ5CL7K.js +1 -1
- package/dist-versioned/chunks/chunk.YT23TSJR.js +5 -5
- package/dist-versioned/chunks/chunk.ZOLOAEEA.js +3 -3
- package/dist-versioned/chunks/chunk.ZXAAMEZI.js +3 -3
- 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-converters.d.ts +12 -0
- package/dist-versioned/components/datepicker/datepicker-converters.js +11 -0
- package/dist-versioned/components/datepicker/datepicker.d.ts +1 -1
- package/dist-versioned/components/datepicker/datepicker.js +2 -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 +1987 -1703
- package/dist-versioned/internal/form.js +2 -2
- package/dist-versioned/solid-components.css +2 -2
- package/dist-versioned/solid-components.js +24 -23
- package/dist-versioned/vscode.html-custom-data.json +253 -253
- package/dist-versioned/web-types.json +777 -699
- package/package.json +1 -1
- package/cdn/chunks/chunk.D4I2KYVZ.js +0 -2
- package/cdn-versioned/chunks/chunk.D4I2KYVZ.js +0 -2
|
@@ -159,62 +159,62 @@ var SdButton = class extends SolidElement {
|
|
|
159
159
|
(this.disabled || this.visuallyDisabled) && "cursor-not-allowed",
|
|
160
160
|
{
|
|
161
161
|
/* sizes, fonts */
|
|
162
|
-
sm: `varspacing-8 min-h-8 sd-6-22-
|
|
163
|
-
md: `varspacing-10 sd-6-22-
|
|
164
|
-
lg: `varspacing-12 sd-6-22-
|
|
162
|
+
sm: `varspacing-8 min-h-8 sd-6-22-1-button--size-sm-font-size sd-6-22-1-button-font-weight sd-6-22-1-button--secondary--size-sm-padding-block sd-6-22-1-button--size-sm-border-radius`,
|
|
163
|
+
md: `varspacing-10 sd-6-22-1-button--size-md-height sd-6-22-1-button--size-md-font-size sd-6-22-1-button--secondary--size-md-padding-block sd-6-22-1-button-font-weight sd-6-22-1-button--size-md-border-radius`,
|
|
164
|
+
lg: `varspacing-12 sd-6-22-1-button--size-lg-height sd-6-22-1-button--size-lg-font-size sd-6-22-1-button--secondary--size-lg-padding-block sd-6-22-1-button-font-weight sd-6-22-1-button--size-lg-border-radius`
|
|
165
165
|
}[this.size],
|
|
166
166
|
!slots["icon-only"] && {
|
|
167
167
|
/* sizes, fonts */
|
|
168
|
-
sm: `${hasBorder ? "sd-6-22-
|
|
169
|
-
md: `${hasBorder ? "sd-6-22-
|
|
170
|
-
lg: `${hasBorder ? "sd-6-22-
|
|
168
|
+
sm: `${hasBorder ? "sd-6-22-1-button--secondary-padding-inline" : "sd-6-22-1-button--size-sm-padding-block sd-6-22-1-button-padding-inline"}`,
|
|
169
|
+
md: `${hasBorder ? "sd-6-22-1-button--secondary-padding-inline" : "sd-6-22-1-button--size-md-padding-block sd-6-22-1-button-padding-inline"}`,
|
|
170
|
+
lg: `${hasBorder ? "sd-6-22-1-button--secondary-padding-inline" : "sd-6-22-1-button--size-lg-padding-block sd-6-22-1-button-padding-inline"}`
|
|
171
171
|
}[this.size],
|
|
172
172
|
/**
|
|
173
173
|
* Anatomy
|
|
174
174
|
* */
|
|
175
175
|
slots["icon-only"] && {
|
|
176
176
|
sm: "px-1 aspect-square",
|
|
177
|
-
md: "sd-6-22-
|
|
177
|
+
md: "sd-6-22-1-button--size-md--icon-only-padding-inline aspect-square",
|
|
178
178
|
lg: "px-[12px] aspect-square"
|
|
179
179
|
}[this.size],
|
|
180
180
|
{
|
|
181
181
|
/* variants */
|
|
182
|
-
primary: !this.inverted ? `${this.visuallyDisabled ? "sd-6-22-
|
|
183
|
-
disabled:sd-6-22-
|
|
184
|
-
disabled:sd-6-22-
|
|
185
|
-
secondary: !this.inverted ? `border sd-6-22-
|
|
186
|
-
disabled:sd-6-22-
|
|
187
|
-
disabled:sd-6-22-
|
|
188
|
-
tertiary: !this.inverted ? `border-transparent ${this.visuallyDisabled ? "sd-6-22-
|
|
189
|
-
disabled:sd-6-22-
|
|
190
|
-
disabled:sd-6-22-
|
|
191
|
-
cta: `${this.visuallyDisabled ? "sd-6-22-
|
|
192
|
-
${!this.inverted ? "text-white bg-accent disabled:sd-6-22-
|
|
182
|
+
primary: !this.inverted ? `${this.visuallyDisabled ? "sd-6-22-1-button--primary--disabled-color-background border-neutral-500 text-white" : "sd-6-22-1-button--primary--default-color-background border-transparent sd-6-22-1-button--primary--default-color-text hover:sd-6-22-1-button--primary--hover-color-text active:sd-6-22-1-button--primary--active-color-text active:sd-6-22-1-button--primary--active-color-background"}
|
|
183
|
+
disabled:sd-6-22-1-button--primary--disabled-color-background disabled:text-white` : `${this.visuallyDisabled ? "sd-6-22-1-button--inverted--disabled-color-background text-white border-neutral-500" : "sd-6-22-1-button--primary--inverted--default-color-text sd-6-22-1-button--primary--inverted--default-color-background border-white hover:sd-6-22-1-button--primary--inverted--hover-color-text active:sd-6-22-1-button--primary--inverted--active-color-text active:sd-6-22-1-button--primary--inverted--active-color-background"}
|
|
184
|
+
disabled:sd-6-22-1-button--inverted--disabled-color-background disabled:text-white`,
|
|
185
|
+
secondary: !this.inverted ? `border sd-6-22-1-button-border-width ${this.visuallyDisabled ? "sd-6-22-1-button--secondary--disabled-color-text sd-6-22-1-button--secondary--disabled-color-border" : "sd-6-22-1-button--secondary--default-color-text sd-6-22-1-button--secondary--default-color-border hover:sd-6-22-1-button--secondary--hover-color-text hover:sd-6-22-1-button--secondary--hover-color-border active:sd-6-22-1-button--secondary--active-color-text active:sd-6-22-1-button--secondary--active-color-border"}
|
|
186
|
+
disabled:sd-6-22-1-button--secondary--disabled-color-text disabled:sd-6-22-1-button--secondary--disabled-color-border` : `border sd-6-22-1-button-border-width ${this.visuallyDisabled ? "text-neutral-600 border-neutral-600" : "sd-6-22-1-button--secondary--inverted-color-text sd-6-22-1-button--secondary--inverted-color-border hover:sd-6-22-1-button--secondary--inverted-color-border hover:sd-6-22-1-button--secondary--inverted--hover-color-text hover:sd-6-22-1-button--secondary--inverted--hover-color-background active:sd-6-22-1-button--secondary--inverted--active-color-text active:border-primary-200 active:sd-6-22-1-button--secondary--inverted--active-color-background"}
|
|
187
|
+
disabled:sd-6-22-1-button--inverted--disabled-color-border disabled:sd-6-22-1-button--inverted--disabled-color-text`,
|
|
188
|
+
tertiary: !this.inverted ? `border-transparent ${this.visuallyDisabled ? "sd-6-22-1-button--tertiary--disabled-color-text" : "sd-6-22-1-button--tertiary--default-color-text hover:sd-6-22-1-button--tertiary--hover-color-text active:sd-6-22-1-button--tertiary--active-color-text"}
|
|
189
|
+
disabled:sd-6-22-1-button--tertiary--disabled-color-text` : `border-transparent ${this.visuallyDisabled ? "text-neutral-600" : "sd-6-22-1-button--tertiary--inverted-color-text hover:sd-6-22-1-button--tertiary--inverted--hover-color-text hover:sd-6-22-1-button--tertiary--inverted--hover-color-background active:sd-6-22-1-button--tertiary--inverted--active-color-background active:sd-6-22-1-button--tertiary--inverted--active-color-text"}
|
|
190
|
+
disabled:sd-6-22-1-button--inverted--disabled-color-text`,
|
|
191
|
+
cta: `${this.visuallyDisabled ? "sd-6-22-1-button--primary--disabled-color-background border-neutral-500" : "bg-accent border-transparent hover:bg-accent-500"}
|
|
192
|
+
${!this.inverted ? "text-white bg-accent disabled:sd-6-22-1-button--primary--disabled-color-background hover:bg-accent-500 disabled:border-neutral-500 disabled:text-white" : "sd-6-22-1-button--cta--inverted--default-color-background sd-6-22-1-button--cta--inverted--default-color-text hover:sd-6-22-1-button--cta--inverted--hover-color-text active:sd-6-22-1-button--cta--inverted--active-color-text disabled:sd-6-22-1-button--inverted--disabled-color-background disabled:text-white"}`
|
|
193
193
|
}[this.variant]
|
|
194
194
|
)}" ?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(
|
|
195
195
|
"absolute inset-0 -z-10 overflow-hidden pointer-events-none ",
|
|
196
196
|
(this.disabled || this.visuallyDisabled) && "hidden",
|
|
197
197
|
{
|
|
198
198
|
/* sizes, fonts */
|
|
199
|
-
sm: `sd-6-22-
|
|
200
|
-
md: `sd-6-22-
|
|
201
|
-
lg: `sd-6-22-
|
|
199
|
+
sm: `sd-6-22-1-button-border-radius`,
|
|
200
|
+
md: `sd-6-22-1-button-border-radius`,
|
|
201
|
+
lg: `sd-6-22-1-button-border-radius`
|
|
202
202
|
}[this.size]
|
|
203
203
|
)}"><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(
|
|
204
204
|
"absolute right-0 min-w-full min-h-full aspect-square skew-y-[-11deg] mt-[11%]",
|
|
205
205
|
{
|
|
206
|
-
primary: !this.inverted ? "sd-6-22-
|
|
207
|
-
secondary: !this.inverted ? "sd-6-22-
|
|
208
|
-
tertiary: !this.inverted ? "sd-6-22-
|
|
209
|
-
cta: !this.inverted ? "bg-accent-500 group-active:bg-accent-700" : "sd-6-22-
|
|
206
|
+
primary: !this.inverted ? "sd-6-22-1-button--primary--hover-color-background group-active:sd-6-22-1-button--primary--active-color-background" : "sd-6-22-1-button--primary--inverted--hover-color-background group-active:sd-6-22-1-button--primary--inverted--active-color-background",
|
|
207
|
+
secondary: !this.inverted ? "sd-6-22-1-button--secondary--hover-color-background group-active:sd-6-22-1-button--secondary--active-color-background" : "sd-6-22-1-button--secondary--inverted--hover-color-background group-active:sd-6-22-1-button--secondary--inverted--active-color-background group-active:sd-6-22-1-button--secondary--inverted--active-color-text",
|
|
208
|
+
tertiary: !this.inverted ? "sd-6-22-1-button--tertiary--hover-color-background group-active:sd-6-22-1-button--tertiary--active-color-background" : "sd-6-22-1-button--tertiary--inverted--hover-color-background group-active:sd-6-22-1-button--tertiary--inverted--active-color-background group-active:sd-6-22-1-button--tertiary--inverted--active-color-text",
|
|
209
|
+
cta: !this.inverted ? "bg-accent-500 group-active:bg-accent-700" : "sd-6-22-1-button--cta--inverted--hover-color-background group-active:sd-6-22-1-button--cta--inverted--active-color-background"
|
|
210
210
|
}[this.variant]
|
|
211
211
|
)}"></div><div class="${cx(
|
|
212
212
|
"absolute w-full h-full mt-[22%]",
|
|
213
213
|
{
|
|
214
|
-
primary: !this.inverted ? "sd-6-22-
|
|
215
|
-
secondary: !this.inverted ? "sd-6-22-
|
|
216
|
-
tertiary: !this.inverted ? "sd-6-22-
|
|
217
|
-
cta: !this.inverted ? "bg-accent-500 group-active:bg-accent-700" : "sd-6-22-
|
|
214
|
+
primary: !this.inverted ? "sd-6-22-1-button--primary--hover-color-background group-active:sd-6-22-1-button--primary--active-color-background" : "sd-6-22-1-button--primary--inverted--hover-color-background group-active:sd-6-22-1-button--primary--inverted--active-color-background",
|
|
215
|
+
secondary: !this.inverted ? "sd-6-22-1-button--secondary--hover-color-background group-active:sd-6-22-1-button--secondary--active-color-background" : "sd-6-22-1-button--secondary--inverted--hover-color-background group-active:sd-6-22-1-button--secondary--inverted--active-color-background group-active:sd-6-22-1-button--secondary--inverted--active-color-text group-active:sd-6-22-1-button--secondary--active-color-border",
|
|
216
|
+
tertiary: !this.inverted ? "sd-6-22-1-button--tertiary--hover-color-background group-active:sd-6-22-1-button--tertiary--active-color-background" : "sd-6-22-1-button--tertiary--inverted--hover-color-background group-active:sd-6-22-1-button--tertiary--inverted--active-color-background group-active:sd-6-22-1-button--tertiary--inverted--active-color-text",
|
|
217
|
+
cta: !this.inverted ? "bg-accent-500 group-active:bg-accent-700" : "sd-6-22-1-button--cta--inverted--hover-color-background group-active:sd-6-22-1-button--cta--inverted--active-color-background"
|
|
218
218
|
}[this.variant]
|
|
219
219
|
)}"></div></div></div><slot name="icon-left" part="icon-left" class="${cx(
|
|
220
220
|
"flex flex-auto items-center justify-end pointer-events-none",
|
|
@@ -243,7 +243,7 @@ var SdButton = class extends SolidElement {
|
|
|
243
243
|
md: "ml-2",
|
|
244
244
|
lg: "ml-2"
|
|
245
245
|
}[this.size]
|
|
246
|
-
)}"></slot>${this.loading ? html`<sd-6-22-
|
|
246
|
+
)}"></slot>${this.loading ? html`<sd-6-22-1-loader class="${cx("absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2")}"></sd-6-22-1-loader>` : ""}</${tag}>`;
|
|
247
247
|
}
|
|
248
248
|
};
|
|
249
249
|
/**
|
|
@@ -252,13 +252,13 @@ var SdButton = class extends SolidElement {
|
|
|
252
252
|
SdButton.styles = [
|
|
253
253
|
...SolidElement.styles,
|
|
254
254
|
css`/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
|
|
255
|
-
:host{position:relative;z-index:0;display:inline-block;width:auto;cursor:pointer}::slotted(sd-6-22-
|
|
255
|
+
:host{position:relative;z-index:0;display:inline-block;width:auto;cursor:pointer}::slotted(sd-6-22-1-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-22-1-icon),sd-6-22-1-loader{font-size:calc(var(--tw-varspacing)/ 2)}:host([size=lg]) ::slotted(sd-6-22-1-icon){font-size:var(--sd-button--size-lg-icon-height,var(--sd-spacing-6))}:host([size=sm]) .sd-6-22-1-button--size-sm-border-radius{border-radius:var(--sd-button--size-sm-border-radius,var(--sd-button-border-radius))}:host([size=md]) .sd-6-22-1-button--size-md-border-radius{border-radius:var(--sd-button--size-md-border-radius,var(--sd-button-border-radius))}:host([size=lg]) .sd-6-22-1-button--size-lg-border-radius{border-radius:var(--sd-button--size-lg-border-radius,var(--sd-button-border-radius))}@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}`
|
|
256
256
|
];
|
|
257
257
|
__decorateClass([
|
|
258
258
|
query("a, button")
|
|
259
259
|
], SdButton.prototype, "button", 2);
|
|
260
260
|
__decorateClass([
|
|
261
|
-
queryAssignedElements({ selector: "sd-6-22-
|
|
261
|
+
queryAssignedElements({ selector: "sd-6-22-1-icon" })
|
|
262
262
|
], SdButton.prototype, "_iconsInDefaultSlot", 2);
|
|
263
263
|
__decorateClass([
|
|
264
264
|
state()
|
|
@@ -324,7 +324,7 @@ __decorateClass([
|
|
|
324
324
|
watch("disabled", { waitUntilFirstUpdate: true })
|
|
325
325
|
], SdButton.prototype, "handleDisabledChange", 1);
|
|
326
326
|
SdButton = __decorateClass([
|
|
327
|
-
customElement("sd-6-22-
|
|
327
|
+
customElement("sd-6-22-1-button")
|
|
328
328
|
], SdButton);
|
|
329
329
|
|
|
330
330
|
export {
|
|
@@ -84,7 +84,7 @@ var SdLink = class extends SolidElement {
|
|
|
84
84
|
SdLink.styles = [
|
|
85
85
|
...SolidElement.styles,
|
|
86
86
|
css`/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
|
|
87
|
-
::slotted(sd-6-22-
|
|
87
|
+
::slotted(sd-6-22-1-icon){font-size:1.25em;margin-bottom:-.25em}:host([size=sm][standalone]) ::slotted(sd-6-22-1-icon){font-size:var(--sd-text-base);line-height:var(--tw-leading,var(--text-base--line-height,calc(1.5 / 1)))}:host([size=lg][standalone]) ::slotted(sd-6-22-1-icon){font-size:var(--sd-text-xl);line-height:var(--tw-leading,var(--text-xl--line-height,calc(1.75 / 1.25)))}`
|
|
88
88
|
];
|
|
89
89
|
__decorateClass([
|
|
90
90
|
query("a")
|
|
@@ -111,7 +111,7 @@ __decorateClass([
|
|
|
111
111
|
property({ reflect: true })
|
|
112
112
|
], SdLink.prototype, "download", 2);
|
|
113
113
|
SdLink = __decorateClass([
|
|
114
|
-
customElement("sd-6-22-
|
|
114
|
+
customElement("sd-6-22-1-link")
|
|
115
115
|
], SdLink);
|
|
116
116
|
|
|
117
117
|
export {
|
|
@@ -53,7 +53,7 @@ SdThemeListener.styles = [
|
|
|
53
53
|
:host{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border-width:0}`
|
|
54
54
|
];
|
|
55
55
|
SdThemeListener = __decorateClass([
|
|
56
|
-
customElement("sd-6-22-
|
|
56
|
+
customElement("sd-6-22-1-theme-listener")
|
|
57
57
|
], SdThemeListener);
|
|
58
58
|
|
|
59
59
|
export {
|
|
@@ -84,7 +84,7 @@ var SdRange = class extends SolidElement {
|
|
|
84
84
|
var _a, _b;
|
|
85
85
|
const tooltip = thumb.parentElement;
|
|
86
86
|
await tooltip.updateComplete;
|
|
87
|
-
(_b = (_a = tooltip.shadowRoot) == null ? void 0 : _a.querySelector("sd-6-22-
|
|
87
|
+
(_b = (_a = tooltip.shadowRoot) == null ? void 0 : _a.querySelector("sd-6-22-1-popup")) == null ? void 0 : _b.setAttribute("distance", "14");
|
|
88
88
|
});
|
|
89
89
|
}
|
|
90
90
|
willUpdate(changedProperties) {
|
|
@@ -260,7 +260,7 @@ var SdRange = class extends SolidElement {
|
|
|
260
260
|
_preventTextSelection() {
|
|
261
261
|
if (!this._dragStyleElement) {
|
|
262
262
|
const style = document.createElement("style");
|
|
263
|
-
style.setAttribute("data-sd-6-22-
|
|
263
|
+
style.setAttribute("data-sd-6-22-1-range-drag", "");
|
|
264
264
|
style.textContent = "*, *::before, *::after { user-select: none !important; -webkit-user-select: none !important; }";
|
|
265
265
|
document.head.appendChild(style);
|
|
266
266
|
this._dragStyleElement = style;
|
|
@@ -445,10 +445,10 @@ var SdRange = class extends SolidElement {
|
|
|
445
445
|
ariaLabel = this.tooltipFormatter(value);
|
|
446
446
|
}
|
|
447
447
|
}
|
|
448
|
-
return html`<sd-6-22-
|
|
448
|
+
return html`<sd-6-22-1-tooltip trigger="${this.tooltip === "on-interaction" ? "focus" : "manual"}" disabled="${ifDefined(this.disabled || this.visuallyDisabled || this.tooltip === "hidden" ? true : void 0)}"><div id="${id}" part="thumb" role="slider" tabindex="${this.disabled || this.visuallyDisabled ? -1 : 0}" aria-disabled="${ifDefined(this.disabled || this.visuallyDisabled ? "true" : void 0)}" aria-labelledby="${ariaLabeledBy}" aria-label="${ariaLabel}" aria-valuemax="${this.max}" aria-valuemin="${this.min}" aria-valuenow="${value}" aria-valuetext="${this.tooltipFormatter(value)}" data-range-id="${rangeId}" data-disabled="${ifDefined(this.disabled || this.visuallyDisabled || void 0)}" @pointerdown="${this.onClickThumb}" @pointermove="${this.onDragThumb}" @pointerup="${this.onReleaseThumb}" @pointercancel="${this.onReleaseThumb}" @keydown="${this.onKeyPress}" @focus="${this.onFocusThumb}" class="${cx(
|
|
449
449
|
"rounded-full absolute top-0 size-4 hover:cursor-grab after:-inset-2",
|
|
450
450
|
this.disabled || this.visuallyDisabled ? "outline-none" : "cursor-pointer focus-visible:focus-outline"
|
|
451
|
-
)}"></div></sd-6-22-
|
|
451
|
+
)}"></div></sd-6-22-1-tooltip>`;
|
|
452
452
|
});
|
|
453
453
|
}
|
|
454
454
|
render() {
|
|
@@ -518,7 +518,7 @@ __decorateClass([
|
|
|
518
518
|
property({ type: String })
|
|
519
519
|
], SdRange.prototype, "value", 1);
|
|
520
520
|
SdRange = __decorateClass([
|
|
521
|
-
customElement("sd-6-22-
|
|
521
|
+
customElement("sd-6-22-1-range")
|
|
522
522
|
], SdRange);
|
|
523
523
|
|
|
524
524
|
export {
|
|
@@ -92,7 +92,7 @@ var SdStep = class extends SolidElement {
|
|
|
92
92
|
this.orientation === "horizontal" && !this.horizontalInline ? this.size === "lg" ? "translateLg" : "translateSm" : this.size === "lg" || this.size === "xs" ? "mt-1" : "mt-3"
|
|
93
93
|
);
|
|
94
94
|
const circleButtonClasses = cx(
|
|
95
|
-
"border sd-6-22-
|
|
95
|
+
"border sd-6-22-1-step__circle-border-width rounded-full aspect-square circle flex items-center justify-center shrink-0 font-bold select-none",
|
|
96
96
|
this.disabled ? "focus-visible:outline-none cursor-not-allowed" : !this.notInteractive && !this.waiting ? "focus-visible:focus-outline hover:cursor-pointer" : "",
|
|
97
97
|
this.notInteractive ? this.size === "lg" ? "not-interactive-lg" : this.size === "xs" ? "w-2" : "w-12" : this.size === "lg" ? "w-12" : this.size === "xs" ? "w-2" : "w-8",
|
|
98
98
|
this.disabled && "border-neutral-500 text-neutral-500",
|
|
@@ -110,8 +110,8 @@ var SdStep = class extends SolidElement {
|
|
|
110
110
|
)}" @focus="${this.handleFocus}" @blur="${this.handleBlur}"><div part="circle-and-tail-container" class="${circleAndTailContainerClasses}"><${tag} part="circle" href="${ifDefined(isLink ? this.href : void 0)}" aria-disabled="${ifDefined(this.disabled || this.waiting || void 0)}" aria-current="${this.current ? "step" : void 0}" aria-labelledby="${ifDefined(this.notInteractive || this.waiting || !hasLabel ? void 0 : "label")}" aria-describedby="${ifDefined(this.notInteractive || this.waiting || !hasDescription ? void 0 : "description")}" class="${circleButtonClasses}"><slot name="circle-content" class="${cx(
|
|
111
111
|
"text-lg",
|
|
112
112
|
!this.disabled && !this.current && !this.notInteractive && !this.waiting && "text-primary hover:text-primary-500 hover:fill-primary-500",
|
|
113
|
-
this.notInteractive && "sd-6-22-
|
|
114
|
-
)}">${!this.disabled && !this.current && !this.notInteractive && !this.waiting && this.size !== "xs" ? html`<sd-6-22-
|
|
113
|
+
this.notInteractive && "sd-6-22-1-step-color-text"
|
|
114
|
+
)}">${!this.disabled && !this.current && !this.notInteractive && !this.waiting && this.size !== "xs" ? html`<sd-6-22-1-icon name="status-check" library="_internal" class="${cx(this.size === "sm" && "text-sm")}"></sd-6-22-1-icon>` : this.size === "xs" ? "" : html`${this.index}`}</slot></${tag}>${isHorizontalInline ? html`<div class="${cx(!this.noTail && "flex-1", "flex flex-col gap-1")}"><div class="${cx(
|
|
115
115
|
"flex w-full",
|
|
116
116
|
hasLabel && "gap-2",
|
|
117
117
|
this.size === "sm" && !hasDescription ? "mt-1" : "mt-3"
|
|
@@ -152,7 +152,7 @@ var SdStep = class extends SolidElement {
|
|
|
152
152
|
SdStep.styles = [
|
|
153
153
|
...SolidElement.styles,
|
|
154
154
|
css`/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
|
|
155
|
-
:host{flex:1}:host([orientation=horizontal]) [part=tail]{border-top-width:var(--sd-step__tail-border-width)}:host([orientation=vertical]) [part=tail]{border-left-width:var(--sd-step__tail-border-width)}:host([no-tail]){flex-grow:0}:host(:not([current])) (:not([notInteractive])) slot[name=circle-content]{color:rgba(var(--sd-color-text-neutral-700))}slot[name=circle-content] sd-6-22-
|
|
155
|
+
:host{flex:1}:host([orientation=horizontal]) [part=tail]{border-top-width:var(--sd-step__tail-border-width)}:host([orientation=vertical]) [part=tail]{border-left-width:var(--sd-step__tail-border-width)}:host([no-tail]){flex-grow:0}:host(:not([current])) (:not([notInteractive])) slot[name=circle-content]{color:rgba(var(--sd-color-text-neutral-700))}slot[name=circle-content] sd-6-22-1-icon,slot[name=circle-content]::slotted(sd-6-22-1-icon){color:rgba(var(--sd-color-icon-fill-primary))}[part=circle]:hover slot[name=circle-content] sd-6-22-1-icon,[part=circle]:hover slot[name=circle-content]::slotted(sd-6-22-1-icon){color:rgba(var(--sd-color-icon-fill-primary-500))}:host([horizontal-inline]):has([part=description]){min-width:calc(var(--sd-spacing-1) * 0);flex:1}.translateLg{transform:translateX(3.438rem)}.translateSm{transform:translateX(4rem)}.not-interactive-lg{width:4.5rem}`
|
|
156
156
|
];
|
|
157
157
|
__decorateClass([
|
|
158
158
|
property({ type: String, reflect: true })
|
|
@@ -203,7 +203,7 @@ __decorateClass([
|
|
|
203
203
|
watch("notInteractive")
|
|
204
204
|
], SdStep.prototype, "handleInteractivityChange", 1);
|
|
205
205
|
SdStep = __decorateClass([
|
|
206
|
-
customElement("sd-6-22-
|
|
206
|
+
customElement("sd-6-22-1-step")
|
|
207
207
|
], SdStep);
|
|
208
208
|
|
|
209
209
|
export {
|
|
@@ -208,7 +208,7 @@ var SdDrawer = class extends SolidElement {
|
|
|
208
208
|
end: "top-0 end-0 bottom-auto start-auto w-[var(--width)] h-full",
|
|
209
209
|
start: "top-0 end-auto bottom-auto start-0 w-[var(--width)] h-full"
|
|
210
210
|
}[this.placement]
|
|
211
|
-
)}" role="dialog" aria-modal="true" aria-label="${this.label}" tabindex="0">${!this.noHeader ? html`<header part="header" class="flex justify-between py-2 px-4 items-center flex-shrink-0" style="min-height:64px"><div part="title"><slot name="header" part="title" class="flex-auto text-xl m-0" id="title"></slot></div><div class="shrink-0 flex flex-wrap justify-end gap-1 ms-4 absolute top-2 end-2"><sd-6-22-
|
|
211
|
+
)}" role="dialog" aria-modal="true" aria-label="${this.label}" tabindex="0">${!this.noHeader ? html`<header part="header" class="flex justify-between py-2 px-4 items-center flex-shrink-0" style="min-height:64px"><div part="title"><slot name="header" part="title" class="flex-auto text-xl m-0" id="title"></slot></div><div class="shrink-0 flex flex-wrap justify-end gap-1 ms-4 absolute top-2 end-2"><sd-6-22-1-button variant="tertiary" size="lg" part="close-button" @click="${() => this.requestClose("close-button")}"><sd-6-22-1-icon label="${this.localize.term("close")}" name="close" library="_internal"></sd-6-22-1-icon></sd-6-22-1-button></div></header>` : html`<sd-6-22-1-button variant="tertiary" size="lg" part="close-button" @click="${() => this.requestClose("close-button")}" class="absolute top-2 end-2 z-10"><sd-6-22-1-icon label="${this.localize.term("close")}" name="close" library="_internal"></sd-6-22-1-icon></sd-6-22-1-button>`}<div part="body" class="flex-auto block px-4 focus-visible:focus-outline !-outline-offset-2" tabindex="0"><slot></slot></div><footer part="footer" class="${cx(this.hasSlotController.test("footer") ? "text-left p-4" : "hidden")}"><slot name="footer"></slot></footer></div></section>`;
|
|
212
212
|
}
|
|
213
213
|
};
|
|
214
214
|
SdDrawer.styles = [
|
|
@@ -250,7 +250,7 @@ __decorateClass([
|
|
|
250
250
|
watch("contained", { waitUntilFirstUpdate: true })
|
|
251
251
|
], SdDrawer.prototype, "handleNoModalChange", 1);
|
|
252
252
|
SdDrawer = __decorateClass([
|
|
253
|
-
customElement("sd-6-22-
|
|
253
|
+
customElement("sd-6-22-1-drawer")
|
|
254
254
|
], SdDrawer);
|
|
255
255
|
setDefaultAnimation("drawer.showStart", {
|
|
256
256
|
keyframes: [
|
|
@@ -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-22-
|
|
29
|
+
customElement("sd-6-22-1-carousel-item")
|
|
30
30
|
], SdCarouselItem);
|
|
31
31
|
|
|
32
32
|
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-22-
|
|
70
|
-
primary: "sd-6-22-
|
|
71
|
-
white: "sd-6-22-
|
|
69
|
+
"neutral-100": "sd-6-22-1-brandshape--neutral-100-color-background",
|
|
70
|
+
primary: "sd-6-22-1-brandshape--primary-color-background",
|
|
71
|
+
white: "sd-6-22-1-brandshape--white-color-background",
|
|
72
72
|
"border-white": "bg-transparent",
|
|
73
73
|
"border-primary": "bg-transparent",
|
|
74
|
-
"primary|80": "sd-6-22-
|
|
75
|
-
"white|80": "sd-6-22-
|
|
74
|
+
"primary|80": "sd-6-22-1-brandshape--primary-80-color-background",
|
|
75
|
+
"white|80": "sd-6-22-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-22-
|
|
91
|
-
primary: "sd-6-22-
|
|
92
|
-
white: "sd-6-22-
|
|
90
|
+
"neutral-100": "sd-6-22-1-brandshape--neutral-100-color-background",
|
|
91
|
+
primary: "sd-6-22-1-brandshape--primary-color-background",
|
|
92
|
+
white: "sd-6-22-1-brandshape--white-color-background",
|
|
93
93
|
"border-white": "bg-transparent",
|
|
94
94
|
"border-primary": "bg-transparent",
|
|
95
|
-
"primary|80": "sd-6-22-
|
|
96
|
-
"white|80": "sd-6-22-
|
|
95
|
+
"primary|80": "sd-6-22-1-brandshape--primary-80-color-background",
|
|
96
|
+
"white|80": "sd-6-22-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-22-
|
|
138
|
+
customElement("sd-6-22-1-brandshape")
|
|
139
139
|
], SdBrandshape);
|
|
140
140
|
|
|
141
141
|
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-22-
|
|
34
|
+
this.expandable ? "sd-6-22-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-22-
|
|
39
|
+
)}"><slot name="expand-icon" class="${cx(this.open && "hidden")}"><sd-6-22-1-icon library="_internal" name="chevron-down" class="group-hover:text-primary-500 transition-colors ease-in-out duration-medium"></sd-6-22-1-icon></slot><slot name="collapse-icon" class="${cx(!this.open && "hidden")}"><sd-6-22-1-icon library="_internal" name="chevron-down" class="group-hover:text-primary-500 transition-colors ease-in-out duration-medium"></sd-6-22-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-22-
|
|
51
|
+
customElement("sd-6-22-1-quickfact")
|
|
52
52
|
], SdQuickfact);
|
|
53
53
|
setDefaultAnimation("quickfact.show", {
|
|
54
54
|
keyframes: [{ height: "0" }, { height: "auto" }],
|
|
@@ -54,7 +54,7 @@ var SdNavigationItem = class extends SolidElement {
|
|
|
54
54
|
}
|
|
55
55
|
if (node.nodeType === Node.ELEMENT_NODE) {
|
|
56
56
|
const element = node;
|
|
57
|
-
return element.tagName.toLowerCase() === "sd-6-22-
|
|
57
|
+
return element.tagName.toLowerCase() === "sd-6-22-1-icon";
|
|
58
58
|
}
|
|
59
59
|
return false;
|
|
60
60
|
});
|
|
@@ -130,8 +130,8 @@ var SdNavigationItem = class extends SolidElement {
|
|
|
130
130
|
const root = html`<${tag} part="base" class="${cx(
|
|
131
131
|
"flex items-center cursor-pointer relative focus-visible:focus-outline group hover:bg-neutral-200 transition-colors duration-fast ease-in-out min-h-[48px] navigable-border-radius",
|
|
132
132
|
this.isStackedHorizontal ? "text-xs leading-4.5" : { md: "navigable-font-size", lg: "text-lg", sm: "text-[14px]" }[this.size],
|
|
133
|
-
this.disabled ? "text-neutral-500 pointer-events-none" : "sd-6-22-
|
|
134
|
-
this.current && !this.disabled && "sd-6-22-
|
|
133
|
+
this.disabled ? "text-neutral-500 pointer-events-none" : "sd-6-22-1-navigation-item-color-text",
|
|
134
|
+
this.current && !this.disabled && "sd-6-22-1-navigation-item--current-color-text",
|
|
135
135
|
this.current && !this.isStackedHorizontal && "font-bold",
|
|
136
136
|
!this.current && !this.isStackedHorizontal && "choice-control-font-weight",
|
|
137
137
|
!isAccordion && "w-full",
|
|
@@ -153,23 +153,23 @@ var SdNavigationItem = class extends SolidElement {
|
|
|
153
153
|
slots["description"] && "pt-3",
|
|
154
154
|
!slots["description"] && !this.separated && horizontalPadding,
|
|
155
155
|
this.calculatePaddingX
|
|
156
|
-
)}">${this.divider && this.vertical ? html`<sd-6-22-
|
|
156
|
+
)}">${this.divider && this.vertical ? html`<sd-6-22-1-divider part="divider" class="${cx("w-full transition-all absolute -top-0.25 left-0", this.calculatePaddingX)}"></sd-6-22-1-divider>` : ""} <span id="content" part="content-container" class="${cx(
|
|
157
157
|
this.vertical ? "inline-flex flex-auto items-center gap-2" : this.isStackedHorizontal ? "inline-flex items-center text-center" : "inline-flex flex-auto flex-col items-center justify-center gap-1 text-center"
|
|
158
158
|
)}"><slot part="content" class="${cx(
|
|
159
159
|
this.vertical ? "inline-flex items-center gap-2" : "inline-flex flex-col items-center justify-center gap-1 text-center"
|
|
160
|
-
)}"></slot></span>${this.chevron || slots["children"] && this.vertical && !this.separated ? html`<sd-6-22-
|
|
160
|
+
)}"></slot></span>${this.chevron || slots["children"] && this.vertical && !this.separated ? html`<sd-6-22-1-icon name="chevron-down" part="chevron" library="_internal" color="currentColor" class="${cx(
|
|
161
161
|
"h-6 w-6 ml-2 transition-all",
|
|
162
162
|
isAccordion ? this.open ? "rotate-180" : "rotate-0" : "rotate-[270deg]"
|
|
163
|
-
)}"></sd-6-22-
|
|
163
|
+
)}"></sd-6-22-1-icon>` : ""} </span>${slots["description"] && this.vertical ? html`<slot id="description" name="description" part="description" class="${cx(
|
|
164
164
|
"inline-block text-sm text-left font-normal text-black pb-3",
|
|
165
165
|
isAccordion || this.separated ? "grow" : "w-full",
|
|
166
166
|
this.calculatePaddingX
|
|
167
167
|
)}"></slot>` : ""}</div></${tag}>`;
|
|
168
168
|
if (this.separated) {
|
|
169
|
-
return html`<div part="details" id="navigation-item-details" class="relative flex flex-col"><div class="flex items-start">${root} ${slots["children"] && this.vertical ? html`<button type="button" title="${this.open ? this.localize.term("collapseNavigationItem") : this.localize.term("expandNavigationItem")}" class="sd-interactive sd-interactive--reset -mt-1" @click="${this.handleClickSummary}"><sd-6-22-
|
|
169
|
+
return html`<div part="details" id="navigation-item-details" class="relative flex flex-col"><div class="flex items-start">${root} ${slots["children"] && this.vertical ? html`<button type="button" title="${this.open ? this.localize.term("collapseNavigationItem") : this.localize.term("expandNavigationItem")}" class="sd-interactive sd-interactive--reset -mt-1" @click="${this.handleClickSummary}"><sd-6-22-1-icon name="chevron-down" part="chevron" library="_internal" color="currentColor" class="${cx(
|
|
170
170
|
"m-4 h-6 w-6 transition-all",
|
|
171
171
|
isAccordion || this.separated ? this.open ? "rotate-180" : "rotate-0" : "rotate-[270deg]"
|
|
172
|
-
)}"></sd-6-22-
|
|
172
|
+
)}"></sd-6-22-1-icon></button>` : ""}</div>${this.open ? html`<slot name="children"></slot>` : ""}</div>`;
|
|
173
173
|
}
|
|
174
174
|
if (isAccordion) {
|
|
175
175
|
return html`<details aria-expanded="${this.open}" part="details" id="navigation-item-details" ?open="${this.open}" class="relative">${root}<slot name="children"></slot></details>`;
|
|
@@ -183,7 +183,7 @@ var SdNavigationItem = class extends SolidElement {
|
|
|
183
183
|
SdNavigationItem.styles = [
|
|
184
184
|
...SolidElement.styles,
|
|
185
185
|
css`/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
|
|
186
|
-
:host{position:relative;box-sizing:border-box;display:inline-block}:host([vertical]){display:block}:host([stacked]:not([vertical])) ::slotted(sd-6-22-
|
|
186
|
+
:host{position:relative;box-sizing:border-box;display:inline-block}:host([vertical]){display:block}:host([stacked]:not([vertical])) ::slotted(sd-6-22-1-icon){height:var(--sd-spacing-6);width:var(--sd-spacing-6)}.sd-6-22-1-navigation-item--current-color-text{color:rgb(var(--sd-navigation-item--current-color-text,var(--sd-navigation-item-color-text)))}details summary::-webkit-details-marker{display:none}[part=current-indicator]{--tw-scale-x:0%;--tw-scale-y:0%;--tw-scale-z:0%;scale:var(--tw-scale-x) var(--tw-scale-y);opacity:var(--sd-opacity-0);--tw-duration:var(--sd-duration-fast, 150ms);transition-duration:var(--sd-duration-fast,150ms);transition:width var(--sd-duration-fast) ease-in-out,height var(--sd-duration-fast) ease-in-out,left var(--sd-duration-fast) ease-in-out,top var(--sd-duration-fast) ease-in-out,opacity var(--sd-duration-fast) ease-in-out,transform var(--sd-duration-fast) ease-in-out var(--sd-duration-fast)}:host([current]) [part=current-indicator]{--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x) var(--tw-scale-y);opacity:var(--sd-opacity-100);transition:width var(--sd-duration-fast) ease-in-out,height var(--sd-duration-fast) ease-in-out,left var(--sd-duration-fast) ease-in-out,top var(--sd-duration-fast) ease-in-out,transform var(--sd-duration-fast) ease-in-out}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}@property --tw-duration{syntax:"*";inherits:false}`
|
|
187
187
|
];
|
|
188
188
|
__decorateClass([
|
|
189
189
|
query('[part="base"]')
|
|
@@ -234,7 +234,7 @@ __decorateClass([
|
|
|
234
234
|
property({ type: Boolean, reflect: true })
|
|
235
235
|
], SdNavigationItem.prototype, "separated", 2);
|
|
236
236
|
SdNavigationItem = __decorateClass([
|
|
237
|
-
customElement("sd-6-22-
|
|
237
|
+
customElement("sd-6-22-1-navigation-item")
|
|
238
238
|
], SdNavigationItem);
|
|
239
239
|
|
|
240
240
|
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-22-
|
|
41
|
+
return html`<sd-6-22-1-link part="base" href="${ifDefined(!this.current ? this.href : void 0)}" target="${this.target}" standalone class="text-nowrap"><slot></slot></sd-6-22-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-22-
|
|
47
|
+
:host{display:inline-flex;align-items:center}sd-6-22-1-link::part(base){align-items:center}sd-6-22-1-link::part(icon-left){margin-right:calc(var(--sd-spacing-1) * 0);display:inline-flex}:host([current]) sd-6-22-1-link::part(base){color:rgba(var(--sd-breadcrumb--current-color-text,rgba(var(--sd-color-neutral-700))))}:host([current]) sd-6-22-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-22-
|
|
65
|
+
customElement("sd-6-22-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-22-
|
|
103
|
+
return html`<sd-6-22-1-theme-listener></sd-6-22-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-22-
|
|
136
|
+
customElement("sd-6-22-1-icon")
|
|
137
137
|
], SdIcon);
|
|
138
138
|
|
|
139
139
|
export {
|
|
@@ -87,7 +87,7 @@ var SdFlipcard = class extends SolidElement {
|
|
|
87
87
|
"gradient-light": this.placement === "top" ? "bg-gradient-to-b from-white/60 to-white/0 mb-auto" : "bg-gradient-to-t from-white/60 to-white/0 mt-auto",
|
|
88
88
|
"gradient-dark": this.placement === "bottom" ? "bg-gradient-to-t from-primary-800/60 to-primary-800/0 mt-auto" : "bg-gradient-to-b from-primary-800/60 to-primary-800/0 mb-auto"
|
|
89
89
|
}[this.frontVariant]
|
|
90
|
-
)}"></div><sd-6-22-
|
|
90
|
+
)}"></div><sd-6-22-1-button part="front-button" size="md" variant="${{
|
|
91
91
|
primary: "tertiary",
|
|
92
92
|
"primary-100": "tertiary",
|
|
93
93
|
"gradient-light": "primary",
|
|
@@ -97,7 +97,7 @@ var SdFlipcard = class extends SolidElement {
|
|
|
97
97
|
"primary-100": false,
|
|
98
98
|
"gradient-light": true,
|
|
99
99
|
"gradient-dark": true
|
|
100
|
-
}[this.frontVariant]}" class="${cx("absolute right-0 p-2 flex-shrink-0", this.placement === "top" ? "bottom-0" : "top-0")}" @click="${this.flipFront}" @keydown="${this.handleFrontKeydown}"><sd-6-22-
|
|
100
|
+
}[this.frontVariant]}" class="${cx("absolute right-0 p-2 flex-shrink-0", this.placement === "top" ? "bottom-0" : "top-0")}" @click="${this.flipFront}" @keydown="${this.handleFrontKeydown}"><sd-6-22-1-icon library="_internal" name="reload" label="Flip to Back"></sd-6-22-1-icon></sd-6-22-1-button></div><div part="back" tabindex="0" aria-hidden="${this.activeSide === "front"}" inert="${ifDefined(this.activeSide === "front" || void 0)}" class="${cx(
|
|
101
101
|
"flip-card__side flip-card__side--back overflow-hidden transition-transform duration-1000 ease-in-out",
|
|
102
102
|
"flex focus-visible:focus-outline",
|
|
103
103
|
"absolute top-0 left-0 w-full h-full justify-end text-left",
|
|
@@ -130,7 +130,7 @@ var SdFlipcard = class extends SolidElement {
|
|
|
130
130
|
"gradient-light": this.placement === "top" ? "bg-gradient-to-b from-white/60 to-white/0 mb-auto" : "bg-gradient-to-t from-white/60 to-white/0 mt-auto",
|
|
131
131
|
"gradient-dark": this.placement === "bottom" ? "bg-gradient-to-t from-primary-800/60 to-primary-800/0 mt-auto" : "bg-gradient-to-b from-primary-800/60 to-primary-800/0 mb-auto"
|
|
132
132
|
}[this.backVariant]
|
|
133
|
-
)}"></div><sd-6-22-
|
|
133
|
+
)}"></div><sd-6-22-1-button size="md" part="back-button" variant="${{
|
|
134
134
|
primary: "tertiary",
|
|
135
135
|
"primary-100": "tertiary",
|
|
136
136
|
"gradient-light": "primary",
|
|
@@ -140,7 +140,7 @@ var SdFlipcard = class extends SolidElement {
|
|
|
140
140
|
"primary-100": false,
|
|
141
141
|
"gradient-light": true,
|
|
142
142
|
"gradient-dark": true
|
|
143
|
-
}[this.backVariant]}" class="${cx("absolute right-0 p-2 flex-shrink-0", this.placement === "top" ? "bottom-0" : "top-0")}" @click="${this.flipBack}" @keydown="${this.handleBackKeydown}"><sd-6-22-
|
|
143
|
+
}[this.backVariant]}" class="${cx("absolute right-0 p-2 flex-shrink-0", this.placement === "top" ? "bottom-0" : "top-0")}" @click="${this.flipBack}" @keydown="${this.handleBackKeydown}"><sd-6-22-1-icon library="_internal" name="reload" label="Flip to Front"></sd-6-22-1-icon></sd-6-22-1-button></div></div>`;
|
|
144
144
|
}
|
|
145
145
|
};
|
|
146
146
|
/**
|
|
@@ -176,7 +176,7 @@ __decorateClass([
|
|
|
176
176
|
state()
|
|
177
177
|
], SdFlipcard.prototype, "activeSide", 2);
|
|
178
178
|
SdFlipcard = __decorateClass([
|
|
179
|
-
customElement("sd-6-22-
|
|
179
|
+
customElement("sd-6-22-1-flipcard")
|
|
180
180
|
], SdFlipcard);
|
|
181
181
|
|
|
182
182
|
export {
|