@solid-design-system/components 6.7.0 → 6.7.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.3G2JTYRD.js +2 -0
- package/cdn/components/range/range.d.ts +6 -0
- package/cdn/components/range/range.js +1 -1
- package/cdn/custom-elements.json +1 -1
- package/cdn/solid-components.bundle.js +25 -25
- package/cdn/solid-components.iife.js +29 -29
- package/cdn/solid-components.js +1 -1
- package/cdn/web-types.json +1 -1
- package/cdn-versioned/chunks/chunk.3G2JTYRD.js +2 -0
- package/cdn-versioned/chunks/chunk.3GKNX2TO.js +3 -3
- package/cdn-versioned/chunks/chunk.4CHW5IDN.js +2 -2
- package/cdn-versioned/chunks/chunk.4KRNPHHH.js +2 -2
- package/cdn-versioned/chunks/chunk.5I4NSTZK.js +2 -2
- package/cdn-versioned/chunks/chunk.5QEBITWI.js +2 -2
- package/cdn-versioned/chunks/chunk.5ZY4FRPG.js +2 -2
- package/cdn-versioned/chunks/chunk.6MYDGBJD.js +2 -2
- package/cdn-versioned/chunks/chunk.7HAKRUIU.js +1 -1
- package/cdn-versioned/chunks/chunk.7JM7OSND.js +1 -1
- package/cdn-versioned/chunks/chunk.7JU65HUG.js +2 -2
- package/cdn-versioned/chunks/chunk.7NQHT75O.js +2 -2
- package/cdn-versioned/chunks/chunk.7NVWBDY2.js +1 -1
- package/cdn-versioned/chunks/chunk.A62VHDIL.js +2 -2
- package/cdn-versioned/chunks/chunk.AC25BNNG.js +2 -2
- package/cdn-versioned/chunks/chunk.AHB36YEA.js +2 -2
- package/cdn-versioned/chunks/chunk.AXNMKWZO.js +2 -2
- package/cdn-versioned/chunks/chunk.CDP46OS4.js +1 -1
- package/cdn-versioned/chunks/chunk.CJ34NUTS.js +1 -1
- package/cdn-versioned/chunks/chunk.CMXQRUFT.js +1 -1
- package/cdn-versioned/chunks/chunk.DFJ6FD7J.js +2 -2
- package/cdn-versioned/chunks/chunk.DZHWN7RR.js +2 -2
- package/cdn-versioned/chunks/chunk.EENTRXWD.js +2 -2
- package/cdn-versioned/chunks/chunk.GZBVPA7S.js +2 -2
- package/cdn-versioned/chunks/chunk.HXNGWXXV.js +5 -5
- package/cdn-versioned/chunks/chunk.JKUZ7I52.js +2 -2
- package/cdn-versioned/chunks/chunk.JMTPGFJB.js +1 -1
- package/cdn-versioned/chunks/chunk.K3YVYEAO.js +2 -2
- package/cdn-versioned/chunks/chunk.KUNV4ZC6.js +2 -2
- package/cdn-versioned/chunks/chunk.LCB6IWY2.js +2 -2
- package/cdn-versioned/chunks/chunk.LPKXOADQ.js +2 -2
- package/cdn-versioned/chunks/chunk.LQCY4Q4V.js +2 -2
- package/cdn-versioned/chunks/chunk.LS2NAENW.js +1 -1
- package/cdn-versioned/chunks/chunk.MB7AGGLX.js +2 -2
- package/cdn-versioned/chunks/chunk.N6MWNUFJ.js +2 -2
- package/cdn-versioned/chunks/chunk.N6YWZXZL.js +1 -1
- package/cdn-versioned/chunks/chunk.NOEVVOED.js +2 -2
- package/cdn-versioned/chunks/chunk.NQFJN2CW.js +1 -1
- package/cdn-versioned/chunks/chunk.NTUMACZ6.js +9 -9
- package/cdn-versioned/chunks/chunk.NZ66E5AS.js +2 -2
- package/cdn-versioned/chunks/chunk.O2JYWK2X.js +2 -2
- package/cdn-versioned/chunks/chunk.OGH2CT55.js +2 -2
- package/cdn-versioned/chunks/chunk.PE5TZWM3.js +2 -2
- package/cdn-versioned/chunks/chunk.QFIY7MLK.js +2 -2
- package/cdn-versioned/chunks/chunk.QGV3BXCE.js +2 -2
- package/cdn-versioned/chunks/chunk.QLW3GMT7.js +2 -2
- package/cdn-versioned/chunks/chunk.QVVATD5X.js +1 -1
- package/cdn-versioned/chunks/chunk.R4ZOSKCW.js +2 -2
- package/cdn-versioned/chunks/chunk.R5D5IAKJ.js +1 -1
- package/cdn-versioned/chunks/chunk.REKTRG7S.js +2 -2
- package/cdn-versioned/chunks/chunk.RXJ46J4Q.js +2 -2
- package/cdn-versioned/chunks/chunk.S7ONP6BO.js +1 -1
- package/cdn-versioned/chunks/chunk.TZPXBIUB.js +2 -2
- package/cdn-versioned/chunks/chunk.UDRTTV56.js +5 -5
- package/cdn-versioned/chunks/chunk.UFCNOC3N.js +3 -3
- package/cdn-versioned/chunks/chunk.UJL7MHVM.js +2 -2
- package/cdn-versioned/chunks/chunk.UOLF3Z2F.js +1 -1
- package/cdn-versioned/chunks/chunk.VTDQOKJM.js +2 -2
- package/cdn-versioned/chunks/chunk.W7A3TU2Z.js +1 -1
- package/cdn-versioned/chunks/chunk.XDXK4RJJ.js +2 -2
- package/cdn-versioned/chunks/chunk.XGRIXEAE.js +2 -2
- package/cdn-versioned/chunks/chunk.XNIBBYE6.js +2 -2
- package/cdn-versioned/chunks/chunk.XVE3HUDP.js +2 -2
- package/cdn-versioned/chunks/chunk.ZO3H5C7X.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/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 +7 -1
- package/cdn-versioned/components/range/range.js +1 -1
- package/cdn-versioned/components/range-tick/range-tick.d.ts +1 -1
- package/cdn-versioned/components/scrollable/scrollable.d.ts +1 -1
- package/cdn-versioned/components/select/select.d.ts +1 -1
- package/cdn-versioned/components/skeleton/skeleton.d.ts +1 -1
- package/cdn-versioned/components/spinner/spinner.d.ts +1 -1
- package/cdn-versioned/components/step/step.d.ts +1 -1
- package/cdn-versioned/components/step-group/step-group.d.ts +1 -1
- package/cdn-versioned/components/switch/switch.d.ts +1 -1
- package/cdn-versioned/components/tab/tab.d.ts +1 -1
- package/cdn-versioned/components/tab-group/tab-group.d.ts +1 -1
- package/cdn-versioned/components/tab-panel/tab-panel.d.ts +1 -1
- package/cdn-versioned/components/tag/tag.d.ts +1 -1
- package/cdn-versioned/components/textarea/textarea.d.ts +1 -1
- package/cdn-versioned/components/theme-listener/theme-listener.d.ts +1 -1
- package/cdn-versioned/components/tooltip/tooltip.d.ts +1 -1
- package/cdn-versioned/components/video/video.d.ts +1 -1
- package/cdn-versioned/custom-elements.json +244 -244
- package/cdn-versioned/internal/form.js +3 -3
- package/cdn-versioned/solid-components.bundle.js +85 -85
- package/cdn-versioned/solid-components.css +2 -2
- package/cdn-versioned/solid-components.iife.js +85 -85
- package/cdn-versioned/solid-components.js +1 -1
- package/cdn-versioned/vscode.html-custom-data.json +94 -94
- package/cdn-versioned/web-types.json +157 -157
- package/{dist-versioned/chunks/chunk.TGZE77AF.js → dist/chunks/chunk.7UUYNJS5.js} +39 -6
- package/dist/components/range/range.d.ts +6 -0
- package/dist/components/range/range.js +13 -1
- package/dist/custom-elements.json +1 -1
- package/dist/solid-components.js +4 -4
- package/dist/web-types.json +1 -1
- package/dist-versioned/chunks/chunk.34FNDYY2.js +2 -2
- package/dist-versioned/chunks/chunk.35O2UVGB.js +1 -1
- package/dist-versioned/chunks/chunk.36PZ2ZYY.js +7 -7
- package/dist-versioned/chunks/chunk.37TQP26W.js +1 -1
- package/dist-versioned/chunks/chunk.3JA6XC66.js +5 -5
- package/dist-versioned/chunks/chunk.46HLMURY.js +4 -4
- package/dist-versioned/chunks/chunk.66BLBC6H.js +24 -24
- package/dist-versioned/chunks/chunk.6OQST4MV.js +10 -10
- package/dist-versioned/chunks/chunk.7TNM3KIX.js +2 -2
- package/{dist/chunks/chunk.TGZE77AF.js → dist-versioned/chunks/chunk.7UUYNJS5.js} +39 -6
- package/dist-versioned/chunks/chunk.7UVXJDH2.js +3 -3
- package/dist-versioned/chunks/chunk.7WUGACZI.js +3 -3
- package/dist-versioned/chunks/chunk.ADLNODYZ.js +4 -4
- package/dist-versioned/chunks/chunk.BMSVBL74.js +2 -2
- package/dist-versioned/chunks/chunk.C3WIBDGG.js +3 -3
- package/dist-versioned/chunks/chunk.CBC4EZWD.js +4 -4
- package/dist-versioned/chunks/chunk.CECM7HKR.js +11 -11
- package/dist-versioned/chunks/chunk.CGQHCRPP.js +5 -5
- package/dist-versioned/chunks/chunk.CTZIFPPT.js +6 -6
- package/dist-versioned/chunks/chunk.DKXRGYTS.js +5 -5
- package/dist-versioned/chunks/chunk.EFL7UGJF.js +3 -3
- package/dist-versioned/chunks/chunk.EP3FJ6UU.js +4 -4
- package/dist-versioned/chunks/chunk.EY7UK2BZ.js +6 -6
- package/dist-versioned/chunks/chunk.F5PRJGBD.js +3 -3
- package/dist-versioned/chunks/chunk.FC3YSKGL.js +1 -1
- package/dist-versioned/chunks/chunk.FDRFLSGY.js +2 -2
- package/dist-versioned/chunks/chunk.FH7IYLFW.js +14 -14
- package/dist-versioned/chunks/chunk.FHD6XY2M.js +3 -3
- package/dist-versioned/chunks/chunk.FJ3FPGND.js +1 -1
- package/dist-versioned/chunks/chunk.GAZNGQ6X.js +5 -5
- package/dist-versioned/chunks/chunk.GMYIZ3J2.js +28 -28
- package/dist-versioned/chunks/chunk.H7FDVZRQ.js +1 -1
- package/dist-versioned/chunks/chunk.IM7UBJL2.js +1 -1
- package/dist-versioned/chunks/chunk.JHGB2ZMH.js +1 -1
- package/dist-versioned/chunks/chunk.JXJ5ABVB.js +8 -8
- package/dist-versioned/chunks/chunk.KB7VIBAE.js +3 -3
- package/dist-versioned/chunks/chunk.KEJFWGZI.js +4 -4
- package/dist-versioned/chunks/chunk.KFH26OT3.js +1 -1
- package/dist-versioned/chunks/chunk.KGN4OSJS.js +8 -8
- package/dist-versioned/chunks/chunk.MA3U64BI.js +1 -1
- package/dist-versioned/chunks/chunk.MRI5QQUM.js +4 -4
- package/dist-versioned/chunks/chunk.NJMHI5UM.js +12 -12
- package/dist-versioned/chunks/chunk.O75UK37Y.js +3 -3
- package/dist-versioned/chunks/chunk.PBVPL25D.js +6 -6
- package/dist-versioned/chunks/chunk.QH2KMZDB.js +5 -5
- package/dist-versioned/chunks/chunk.QXENWV2D.js +4 -4
- package/dist-versioned/chunks/chunk.RS56W46S.js +26 -26
- package/dist-versioned/chunks/chunk.RVIQ642S.js +1 -1
- package/dist-versioned/chunks/chunk.SAOVIYDI.js +2 -2
- package/dist-versioned/chunks/chunk.TUSC7AK7.js +8 -8
- package/dist-versioned/chunks/chunk.U2BN2DBY.js +4 -4
- package/dist-versioned/chunks/chunk.UHNAADFP.js +4 -4
- package/dist-versioned/chunks/chunk.UIQBHPD3.js +2 -2
- package/dist-versioned/chunks/chunk.UVGX2XYL.js +2 -2
- package/dist-versioned/chunks/chunk.V5OZWLLA.js +3 -3
- package/dist-versioned/chunks/chunk.VOPJWC6H.js +2 -2
- package/dist-versioned/chunks/chunk.W7QB7KQG.js +5 -5
- package/dist-versioned/chunks/chunk.WR3SE4O5.js +12 -12
- package/dist-versioned/chunks/chunk.WU5L6FE5.js +2 -2
- package/dist-versioned/chunks/chunk.WZQBNRPA.js +2 -2
- package/dist-versioned/chunks/chunk.XCFDPNXY.js +5 -5
- package/dist-versioned/chunks/chunk.XYDUW4SZ.js +9 -9
- package/dist-versioned/chunks/chunk.ZQFW6FCT.js +3 -3
- package/dist-versioned/chunks/chunk.ZULS2JUR.js +2 -2
- package/dist-versioned/components/accordion/accordion.d.ts +1 -1
- package/dist-versioned/components/accordion-group/accordion-group.d.ts +1 -1
- package/dist-versioned/components/animation/animation.d.ts +1 -1
- package/dist-versioned/components/audio/audio.d.ts +1 -1
- package/dist-versioned/components/badge/badge.d.ts +1 -1
- package/dist-versioned/components/brandshape/brandshape.d.ts +1 -1
- package/dist-versioned/components/breadcrumb/breadcrumb.d.ts +1 -1
- package/dist-versioned/components/breadcrumb-item/breadcrumb-item.d.ts +1 -1
- package/dist-versioned/components/button/button.d.ts +1 -1
- package/dist-versioned/components/button-group/button-group.d.ts +1 -1
- package/dist-versioned/components/carousel/carousel.d.ts +1 -1
- package/dist-versioned/components/carousel-item/carousel-item.d.ts +1 -1
- package/dist-versioned/components/checkbox/checkbox.d.ts +1 -1
- package/dist-versioned/components/checkbox-group/checkbox-group.d.ts +1 -1
- package/dist-versioned/components/combobox/combobox.d.ts +1 -1
- package/dist-versioned/components/datepicker/datepicker.d.ts +1 -1
- package/dist-versioned/components/dialog/dialog.d.ts +1 -1
- package/dist-versioned/components/divider/divider.d.ts +1 -1
- package/dist-versioned/components/drawer/drawer.d.ts +1 -1
- package/dist-versioned/components/dropdown/dropdown.d.ts +1 -1
- package/dist-versioned/components/expandable/expandable.d.ts +1 -1
- package/dist-versioned/components/flipcard/flipcard.d.ts +1 -1
- package/dist-versioned/components/header/header.d.ts +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 +7 -1
- package/dist-versioned/components/range/range.js +13 -1
- package/dist-versioned/components/range-tick/range-tick.d.ts +1 -1
- package/dist-versioned/components/scrollable/scrollable.d.ts +1 -1
- package/dist-versioned/components/select/select.d.ts +1 -1
- package/dist-versioned/components/skeleton/skeleton.d.ts +1 -1
- package/dist-versioned/components/spinner/spinner.d.ts +1 -1
- package/dist-versioned/components/step/step.d.ts +1 -1
- package/dist-versioned/components/step-group/step-group.d.ts +1 -1
- package/dist-versioned/components/switch/switch.d.ts +1 -1
- package/dist-versioned/components/tab/tab.d.ts +1 -1
- package/dist-versioned/components/tab-group/tab-group.d.ts +1 -1
- package/dist-versioned/components/tab-panel/tab-panel.d.ts +1 -1
- package/dist-versioned/components/tag/tag.d.ts +1 -1
- package/dist-versioned/components/textarea/textarea.d.ts +1 -1
- package/dist-versioned/components/theme-listener/theme-listener.d.ts +1 -1
- package/dist-versioned/components/tooltip/tooltip.d.ts +1 -1
- package/dist-versioned/components/video/video.d.ts +1 -1
- package/dist-versioned/custom-elements.json +244 -244
- package/dist-versioned/internal/form.js +3 -3
- package/dist-versioned/solid-components.css +2 -2
- package/dist-versioned/solid-components.js +4 -4
- package/dist-versioned/vscode.html-custom-data.json +94 -94
- package/dist-versioned/web-types.json +157 -157
- package/package.json +2 -2
- package/cdn/chunks/chunk.G7D3WBTA.js +0 -2
- package/cdn-versioned/chunks/chunk.G7D3WBTA.js +0 -2
|
@@ -38,13 +38,13 @@ var SdBreadcrumbItem = class extends SolidElement {
|
|
|
38
38
|
requestAnimationFrame(() => this.handleCurrentChange());
|
|
39
39
|
}
|
|
40
40
|
render() {
|
|
41
|
-
return html`<sd-6-7-
|
|
41
|
+
return html`<sd-6-7-1-link part="base" href="${ifDefined(!this.current ? this.href : void 0)}" target="${this.target}" standalone class="text-nowrap"><slot></slot></sd-6-7-1-link>`;
|
|
42
42
|
}
|
|
43
43
|
};
|
|
44
44
|
SdBreadcrumbItem.styles = [
|
|
45
45
|
...SolidElement.styles,
|
|
46
46
|
css`/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
|
|
47
|
-
:host{display:inline-flex;align-items:center}sd-6-7-
|
|
47
|
+
:host{display:inline-flex;align-items:center}sd-6-7-1-link::part(base){align-items:center}sd-6-7-1-link::part(icon-left){margin-right:calc(var(--sd-spacing-1) * 0);display:inline-flex}:host([current]) sd-6-7-1-link::part(base){color:rgba(var(--sd-color-text-neutral-700))}:host([current]) sd-6-7-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-7-
|
|
65
|
+
customElement("sd-6-7-1-breadcrumb-item")
|
|
66
66
|
], SdBreadcrumbItem);
|
|
67
67
|
|
|
68
68
|
export {
|
|
@@ -135,14 +135,14 @@ var SdAccordion = class extends SolidElement {
|
|
|
135
135
|
}
|
|
136
136
|
render() {
|
|
137
137
|
return html`<details part="base" class="border-neutral-400"><summary part="header" id="header" class="${cx(
|
|
138
|
-
"flex text-base gap-4 font-bold items-center cursor-pointer select-none px-4 sd-6-7-
|
|
138
|
+
"flex text-base gap-4 font-bold items-center cursor-pointer select-none px-4 sd-6-7-1-accordion-padding-block focus-visible:focus-outline focus-visible:z-10 sd-6-7-1-accordion-color-text relative group transition-colors ease-in-out duration-fast hover:bg-neutral-200"
|
|
139
139
|
)}" aria-expanded="${this.open ? "true" : "false"}" aria-controls="content" tabindex="0" @click="${this.handleSummaryClick}" @keydown="${this.handleSummaryKeyDown}"><div part="summary-border" class="${cx(
|
|
140
140
|
!this.open && "opacity-0",
|
|
141
|
-
"w-1 sd-6-7-
|
|
141
|
+
"w-1 sd-6-7-1-accordion__indicator-color absolute left-0 transition-height duration-fast ease-in-out h-[calc(100%-16px)] group-hover:h-full"
|
|
142
142
|
)}"></div><slot name="summary" part="summary" class="flex flex-auto items-center text-left">${this.summary}</slot><span part="summary-icon" class="${cx(
|
|
143
143
|
"flex flex-grow-0 flex-shrink-0 flex-auto items-center transition-all ease-in-out duration-medium text-xl",
|
|
144
144
|
this.open && "rotate-180"
|
|
145
|
-
)}"><slot name="expand-icon" class="${cx(this.open && "hidden")}"><sd-6-7-
|
|
145
|
+
)}"><slot name="expand-icon" class="${cx(this.open && "hidden")}"><sd-6-7-1-icon library="_internal" name="chevron-down"></sd-6-7-1-icon></slot><slot name="collapse-icon" class="${cx(!this.open && "hidden")}"><sd-6-7-1-icon library="_internal" name="chevron-down"></sd-6-7-1-icon></slot></span></summary><div part="content" id="content" class="overflow-hidden"><slot part="content__slot" class="block px-4 py-6" role="region" aria-labelledby="header"></slot></div></details>`;
|
|
146
146
|
}
|
|
147
147
|
};
|
|
148
148
|
SdAccordion.styles = [
|
|
@@ -169,7 +169,7 @@ __decorateClass([
|
|
|
169
169
|
watch("open", { waitUntilFirstUpdate: true })
|
|
170
170
|
], SdAccordion.prototype, "handleOpenChange", 1);
|
|
171
171
|
SdAccordion = __decorateClass([
|
|
172
|
-
customElement("sd-6-7-
|
|
172
|
+
customElement("sd-6-7-1-accordion")
|
|
173
173
|
], SdAccordion);
|
|
174
174
|
setDefaultAnimation("accordion.show", {
|
|
175
175
|
keyframes: [
|
|
@@ -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-7-
|
|
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-7-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-7-1-icon class="text-xl" name="pause" library="_internal"></sd-6-7-1-icon></slot>` : html`<slot name="play-icon"><sd-6-7-1-icon class="text-xl" name="start" library="_internal"></sd-6-7-1-icon></slot>`}</sd-6-7-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-7-1-icon class="w-6 h-6" name="transcript" library="_internal"></sd-6-7-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-7-1-icon class="w-6 h-6" name="${this.isMuted ? "mute" : "volume"}" library="_internal"></sd-6-7-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-7-
|
|
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-7-
|
|
308
|
+
)}" part="timestamps"><div class="${cx("current-time text-sm", this.inverted ? "text-primary-400" : "sd-6-7-1-audio__timestamp-color-text")}">${this.currentTime}</div><div class="${cx("current-time text-sm", this.inverted ? "text-primary-400" : "sd-6-7-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-7-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-7-1-input="${this.handleAudioProgress}" @keydown="${this.handleAudioProgressKeydown}"></sd-6-7-1-range></div>${this.hasSlotController.test("transcript") ? html`<sd-6-7-1-drawer><slot name="transcript"></slot></sd-6-7-1-drawer>` : null} ${!this.hideTimestamps && (!this.animated || !this.reversedLayout) ? renderTimestamps : null}</div><sd-6-7-1-theme-listener></sd-6-7-1-theme-listener>`;
|
|
310
310
|
}
|
|
311
311
|
};
|
|
312
312
|
SdAudio.styles = [
|
|
313
313
|
...SolidElement.styles,
|
|
314
314
|
css`/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
|
|
315
|
-
sd-6-7-
|
|
315
|
+
sd-6-7-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-7-1-button::part(motion-wrapper){border-radius:var(--sd-radius-full)}sd-6-7-1-button::part(label){display:flex;flex-grow:0;align-items:center}sd-6-7-1-range::part(form-control-label){display:none}:host([inverted]) sd-6-7-1-range::part(thumb){outline-color:var(--color-white,#fff);background-color:rgba(var(--sd-color-border-white,rgba(var(--sd-color-white))))}:host([animated]) sd-6-7-1-range::part(track){background-color:transparent}:host([inverted]:not([animated])) sd-6-7-1-range::part(track){background-color:rgba(var(--sd-color-border-primary-400,rgba(var(--sd-color-primary-400))))}:host([inverted]:not([animated])) sd-6-7-1-range::part(active-track){background-color:rgba(var(--sd-color-border-white,rgba(var(--sd-color-white))))}`
|
|
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-7-
|
|
357
|
+
query("sd-6-7-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-7-
|
|
363
|
+
customElement("sd-6-7-1-audio")
|
|
364
364
|
], SdAudio);
|
|
365
365
|
|
|
366
366
|
export {
|
|
@@ -22,7 +22,7 @@ var SdDivider = class extends SolidElement {
|
|
|
22
22
|
}
|
|
23
23
|
render() {
|
|
24
24
|
return html`<hr part="main" aria-orientation="${this.orientation}" class="${cx(
|
|
25
|
-
this.inverted ? "sd-6-7-
|
|
25
|
+
this.inverted ? "sd-6-7-1-divider--inverted-color-border" : "border-neutral-400",
|
|
26
26
|
this.orientation === "horizontal" ? "border-t w-full" : " border-l h-full"
|
|
27
27
|
)}">`;
|
|
28
28
|
}
|
|
@@ -33,7 +33,7 @@ var SdDivider = class extends SolidElement {
|
|
|
33
33
|
SdDivider.styles = [
|
|
34
34
|
...SolidElement.styles,
|
|
35
35
|
css`/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
|
|
36
|
-
:host{margin:calc(var(--sd-spacing-1) * 0)}:host(sd-6-7-
|
|
36
|
+
:host{margin:calc(var(--sd-spacing-1) * 0)}:host(sd-6-7-1-divider[orientation=horizontal]){display:block}:host(sd-6-7-1-divider[orientation=vertical]){display:inline-block}`
|
|
37
37
|
];
|
|
38
38
|
__decorateClass([
|
|
39
39
|
property({ type: String, reflect: true })
|
|
@@ -42,7 +42,7 @@ __decorateClass([
|
|
|
42
42
|
property({ type: Boolean, reflect: true })
|
|
43
43
|
], SdDivider.prototype, "inverted", 2);
|
|
44
44
|
SdDivider = __decorateClass([
|
|
45
|
-
customElement("sd-6-7-
|
|
45
|
+
customElement("sd-6-7-1-divider")
|
|
46
46
|
], SdDivider);
|
|
47
47
|
|
|
48
48
|
export {
|
|
@@ -183,7 +183,7 @@ var SdDialog = class extends SolidElement {
|
|
|
183
183
|
)}"><div part="overlay" class="fixed inset-0 overlay-color-background opacity-90" @click="${() => this.requestClose("overlay")}" tabindex="-1"></div><div part="panel" class="${cx(
|
|
184
184
|
"panel-color-border border flex flex-col z-20 bg-white py-4 sm:py-8 relative gap-6 focus-visible:focus-outline-inverted overflow-y-auto",
|
|
185
185
|
this.open && "flex opacity-100"
|
|
186
|
-
)}" role="dialog" aria-modal="true" aria-hidden="${this.open ? "false" : "true"}" aria-label="${ifDefined(this.headline ? this.headline : void 0)}" aria-labelledby="${ifDefined(!this.headline ? "title" : void 0)}" tabindex="0"><header part="header" class="flex flex-grow-0 flex-shrink-0 basis-auto px-6 sm:px-10"><h2 part="title" class="flex-auto m-0" id="title">${this.headline.length > 0 ? html`<span class="sd-headline sd-headline--size-3xl leading-tight">${this.headline}</span>` : html`<slot name="headline"></slot>`}</h2>${!this.noCloseButton ? html`<sd-6-7-
|
|
186
|
+
)}" role="dialog" aria-modal="true" aria-hidden="${this.open ? "false" : "true"}" aria-label="${ifDefined(this.headline ? this.headline : void 0)}" aria-labelledby="${ifDefined(!this.headline ? "title" : void 0)}" tabindex="0"><header part="header" class="flex flex-grow-0 flex-shrink-0 basis-auto px-6 sm:px-10"><h2 part="title" class="flex-auto m-0" id="title">${this.headline.length > 0 ? html`<span class="sd-headline sd-headline--size-3xl leading-tight">${this.headline}</span>` : html`<slot name="headline"></slot>`}</h2>${!this.noCloseButton ? html`<sd-6-7-1-button part="close-button" variant="tertiary" exportparts="base:close-button__base" class="${cx("absolute top-2 right-2")}" name="x-lg" @click="${() => this.requestClose("close-button")}" type="button"><sd-6-7-1-icon label="${this.localize.term("close")}" name="close" library="_internal" color="currentColor"></sd-6-7-1-icon></sd-6-7-1-button>` : ""}</header><main part="body" class="flex flex-auto overflow-auto w-full px-6 sm:px-10"><slot></slot></main><footer part="footer" class="flex flex-grow-0 flex-shrink-0 basis-auto ml-auto gap-4 px-6 sm:px-10"><slot name="footer"></slot></footer></div></div>`;
|
|
187
187
|
}
|
|
188
188
|
};
|
|
189
189
|
SdDialog.styles = [
|
|
@@ -213,7 +213,7 @@ __decorateClass([
|
|
|
213
213
|
watch("open", { waitUntilFirstUpdate: true })
|
|
214
214
|
], SdDialog.prototype, "handleOpenChange", 1);
|
|
215
215
|
SdDialog = __decorateClass([
|
|
216
|
-
customElement("sd-6-7-
|
|
216
|
+
customElement("sd-6-7-1-dialog")
|
|
217
217
|
], SdDialog);
|
|
218
218
|
setDefaultAnimation("dialog.show", {
|
|
219
219
|
keyframes: [
|
|
@@ -37,8 +37,8 @@ var SdTabGroup = class extends SolidElement {
|
|
|
37
37
|
}
|
|
38
38
|
connectedCallback() {
|
|
39
39
|
const whenAllDefined = Promise.all([
|
|
40
|
-
customElements.whenDefined("sd-6-7-
|
|
41
|
-
customElements.whenDefined("sd-6-7-
|
|
40
|
+
customElements.whenDefined("sd-6-7-1-tab"),
|
|
41
|
+
customElements.whenDefined("sd-6-7-1-tab-panel")
|
|
42
42
|
]);
|
|
43
43
|
super.connectedCallback();
|
|
44
44
|
this.resizeObserver = new ResizeObserver(() => {
|
|
@@ -86,20 +86,20 @@ var SdTabGroup = class extends SolidElement {
|
|
|
86
86
|
}
|
|
87
87
|
getAllTabs(options = { includeDisabled: true }) {
|
|
88
88
|
const slot = this.shadowRoot.querySelector('slot[name="nav"]');
|
|
89
|
-
return Array.from(slot.assignedElements()).map((el) => el.tagName.toLocaleLowerCase() === "sd-6-7-
|
|
90
|
-
return el && options.includeDisabled ? el.tagName.toLowerCase() === "sd-6-7-
|
|
89
|
+
return Array.from(slot.assignedElements()).map((el) => el.tagName.toLocaleLowerCase() === "sd-6-7-1-tab" ? el : el.querySelector("sd-6-7-1-tab")).filter((el) => {
|
|
90
|
+
return el && options.includeDisabled ? el.tagName.toLowerCase() === "sd-6-7-1-tab" : el.tagName.toLowerCase() === "sd-6-7-1-tab" && !el.disabled;
|
|
91
91
|
});
|
|
92
92
|
}
|
|
93
93
|
getAllPanels() {
|
|
94
|
-
return [...this.body.assignedElements()].filter((el) => el.tagName.toLowerCase() === "sd-6-7-
|
|
94
|
+
return [...this.body.assignedElements()].filter((el) => el.tagName.toLowerCase() === "sd-6-7-1-tab-panel");
|
|
95
95
|
}
|
|
96
96
|
getActiveTab() {
|
|
97
97
|
return this.tabs.find((t) => t.matches(":focus"));
|
|
98
98
|
}
|
|
99
99
|
handleClick(event) {
|
|
100
100
|
const target = event.target;
|
|
101
|
-
const tab = target.closest("sd-6-7-
|
|
102
|
-
const tabGroup = tab == null ? void 0 : tab.closest("sd-6-7-
|
|
101
|
+
const tab = target.closest("sd-6-7-1-tab");
|
|
102
|
+
const tabGroup = tab == null ? void 0 : tab.closest("sd-6-7-1-tab-group");
|
|
103
103
|
if (tabGroup !== this) {
|
|
104
104
|
return;
|
|
105
105
|
}
|
|
@@ -109,8 +109,8 @@ var SdTabGroup = class extends SolidElement {
|
|
|
109
109
|
}
|
|
110
110
|
handleKeyDown(event) {
|
|
111
111
|
const target = event.target;
|
|
112
|
-
const tab = target.closest("sd-6-7-
|
|
113
|
-
const tabGroup = tab == null ? void 0 : tab.closest("sd-6-7-
|
|
112
|
+
const tab = target.closest("sd-6-7-1-tab");
|
|
113
|
+
const tabGroup = tab == null ? void 0 : tab.closest("sd-6-7-1-tab-group");
|
|
114
114
|
if (tabGroup !== this) {
|
|
115
115
|
return;
|
|
116
116
|
}
|
|
@@ -137,7 +137,7 @@ var SdTabGroup = class extends SolidElement {
|
|
|
137
137
|
if (["ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown", "Home", "End"].includes(event.key)) {
|
|
138
138
|
const activeEl = this.tabs.find((t) => t.matches(":focus"));
|
|
139
139
|
const isRtl = this.localize.dir() === "rtl";
|
|
140
|
-
if ((activeEl == null ? void 0 : activeEl.tagName.toLowerCase()) === "sd-6-7-
|
|
140
|
+
if ((activeEl == null ? void 0 : activeEl.tagName.toLowerCase()) === "sd-6-7-1-tab") {
|
|
141
141
|
let index = this.tabs.indexOf(activeEl);
|
|
142
142
|
if (event.key === "Home") {
|
|
143
143
|
index = 0;
|
|
@@ -258,16 +258,16 @@ var SdTabGroup = class extends SolidElement {
|
|
|
258
258
|
return html`<div part="base" class="${cx("flex flex-col rounded-none")}" @click="${this.handleClick}" @keydown="${this.handleKeyDown}"><div part="nav" class="${cx(this.hasScrollControls && "relative py-0 px-12")}">${this.hasScrollControls ? html`<button part="scroll-button--start" exportparts="base:scroll-button__base" tabindex="-1" aria-hidden="true" disabled="${ifDefined(!this.canScroll.left || void 0)}" class="${cx(
|
|
259
259
|
"sd-interactive flex items-center justify-center absolute top-0 bottom-0 left-0 !outline-offset-0 border-b border-neutral-400 z-10",
|
|
260
260
|
this.localize.dir() === "rtl" && "left-auto right-0"
|
|
261
|
-
)}" @click="${this.handleScrollToStart}"><sd-6-7-
|
|
261
|
+
)}" @click="${this.handleScrollToStart}"><sd-6-7-1-icon library="_internal" name="${isRtl ? "chevron-up" : "chevron-down"}" label="previous" class="${cx("h-6 w-12 rotate-90 grid place-items-center")}"></sd-6-7-1-icon></button>` : ""}<div part="scroll-container" class="flex overflow-x-auto focus-visible:focus-outline !outline-offset-0"><div part="tabs" class="${cx("flex flex-auto relative flex-row")}" role="tablist">${((_a = this.activeTab) == null ? void 0 : _a.variant) !== "container" ? html`<div part="active-tab-indicator" id="indicator" class="absolute h-1 bg-accent bottom-0 transition-[transform,width] duration-medium ease-in-out z-30 navigable__current-indicator-height navigable__current-indicator-border-radius"></div>` : ""}<div part="separation" class="border-neutral-400 absolute w-full h-0.25 bottom-0 border-b z-10"></div><slot name="nav" @slotchange="${this.syncTabsAndPanels}"></slot></div></div>${this.hasScrollControls ? html`<button part="scroll-button--end" exportparts="base:scroll-button__base" tabindex="-1" aria-hidden="true" disabled="${ifDefined(!this.canScroll.right || void 0)}" class="${cx(
|
|
262
262
|
"sd-interactive flex items-center justify-center absolute top-0 bottom-0 right-0 !outline-offset-0 border-b border-neutral-400 z-10",
|
|
263
263
|
this.localize.dir() === "rtl" && "right-auto left-0"
|
|
264
|
-
)}" @click="${this.handleScrollToEnd}"><sd-6-7-
|
|
264
|
+
)}" @click="${this.handleScrollToEnd}"><sd-6-7-1-icon library="_internal" name="${isRtl ? "chevron-down" : "chevron-up"}" label="next" class="${cx("h-6 w-12 rotate-90 grid place-items-center")}"></sd-6-7-1-icon></button>` : ""}</div><slot part="body" class="${cx("block auto py-8 px-6", this.variant === "container" && "border border-neutral-400 border-t-0")}" @slotchange="${this.syncTabsAndPanels}"></slot></div>`;
|
|
265
265
|
}
|
|
266
266
|
};
|
|
267
267
|
SdTabGroup.styles = [
|
|
268
268
|
...SolidElement.styles,
|
|
269
269
|
css`/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
|
|
270
|
-
:host{box-sizing:border-box;display:block}[part=scroll-container]{scrollbar-width:none}[part=scroll-container]::-webkit-scrollbar{height:calc(var(--sd-spacing-1) * 0);width:calc(var(--sd-spacing-1) * 0)}::slotted(sd-6-7-
|
|
270
|
+
:host{box-sizing:border-box;display:block}[part=scroll-container]{scrollbar-width:none}[part=scroll-container]::-webkit-scrollbar{height:calc(var(--sd-spacing-1) * 0);width:calc(var(--sd-spacing-1) * 0)}::slotted(sd-6-7-1-tab-panel){--padding:1rem 0}::slotted(sd-6-7-1-tab-panel:focus-visible){outline-style:solid;outline-offset:2px;outline-width:2px;outline-color:rgba(var(--outline-color-primary))}`
|
|
271
271
|
];
|
|
272
272
|
__decorateClass([
|
|
273
273
|
query("[part=base]")
|
|
@@ -300,7 +300,7 @@ __decorateClass([
|
|
|
300
300
|
debounce(20)
|
|
301
301
|
], SdTabGroup.prototype, "handleScroll", 1);
|
|
302
302
|
SdTabGroup = __decorateClass([
|
|
303
|
-
customElement("sd-6-7-
|
|
303
|
+
customElement("sd-6-7-1-tab-group")
|
|
304
304
|
], SdTabGroup);
|
|
305
305
|
|
|
306
306
|
export {
|
|
@@ -224,7 +224,7 @@ var SdTextarea = class extends SolidElement {
|
|
|
224
224
|
textareaState === "disabled" || textareaState === "visuallyDisabled" ? "text-neutral-500" : "form-control-color-text",
|
|
225
225
|
["invalid", "activeInvalid"].includes(textareaState) && "form-control--invalid-color-background"
|
|
226
226
|
)}"><textarea part="textarea" id="input" class="${cx(
|
|
227
|
-
"ps-4 flex-grow focus:outline-none bg-transparent placeholder:text-neutral-700 resize-none group-has-[sd-6-7-
|
|
227
|
+
"ps-4 flex-grow focus:outline-none bg-transparent placeholder:text-neutral-700 resize-none group-has-[sd-6-7-1-icon]:pe-8",
|
|
228
228
|
{
|
|
229
229
|
sm: isFloatingLabelActive ? "pb-1" : "py-2",
|
|
230
230
|
md: isFloatingLabelActive ? "pb-1" : "py-2",
|
|
@@ -232,7 +232,7 @@ var SdTextarea = class extends SolidElement {
|
|
|
232
232
|
}[this.size],
|
|
233
233
|
this.disabled && "cursor-not-allowed",
|
|
234
234
|
textSize
|
|
235
|
-
)}" 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-7-
|
|
235
|
+
)}" 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-7-1-icon class="${cx("text-error absolute right-4 pointer-events-none", iconSize)}" library="_internal" name="risk" part="invalid-icon"></sd-6-7-1-icon>` : ""} ${this.styleOnValid && this.showValidStyle ? html`<sd-6-7-1-icon class="${cx("text-success absolute right-4 pointer-events-none", iconSize)}" library="_internal" name="confirm-circle" part="valid-icon"></sd-6-7-1-icon>` : ""}</div></div><slot name="help-text" part="form-control-help-text" id="help-text" class="${cx("text-sm text-neutral-700 mt-1", hasHelpText && !this.showInvalidStyle ? "block" : "hidden")}" aria-hidden="${!hasHelpText || this.showInvalidStyle}">${this.helpText}</slot></div>${this.formControlController.renderInvalidMessage(this.size)}`;
|
|
236
236
|
}
|
|
237
237
|
};
|
|
238
238
|
/**
|
|
@@ -353,7 +353,7 @@ __decorateClass([
|
|
|
353
353
|
watch(["size", "floatingLabel"])
|
|
354
354
|
], SdTextarea.prototype, "handleSizeChange", 1);
|
|
355
355
|
SdTextarea = __decorateClass([
|
|
356
|
-
customElement("sd-6-7-
|
|
356
|
+
customElement("sd-6-7-1-textarea")
|
|
357
357
|
], SdTextarea);
|
|
358
358
|
|
|
359
359
|
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-7-
|
|
90
|
+
)}"></div><sd-6-7-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-7-
|
|
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-7-1-icon library="_internal" name="reload" label="Flip to Back"></sd-6-7-1-icon></sd-6-7-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-7-
|
|
133
|
+
)}"></div><sd-6-7-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-7-
|
|
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-7-1-icon library="_internal" name="reload" label="Flip to Front"></sd-6-7-1-icon></sd-6-7-1-button></div></div>`;
|
|
144
144
|
}
|
|
145
145
|
};
|
|
146
146
|
/**
|
|
@@ -177,7 +177,7 @@ __decorateClass([
|
|
|
177
177
|
state()
|
|
178
178
|
], SdFlipcard.prototype, "activeSide", 2);
|
|
179
179
|
SdFlipcard = __decorateClass([
|
|
180
|
-
customElement("sd-6-7-
|
|
180
|
+
customElement("sd-6-7-1-flipcard")
|
|
181
181
|
], SdFlipcard);
|
|
182
182
|
|
|
183
183
|
export {
|
|
@@ -163,48 +163,48 @@ var SdButton = class extends SolidElement {
|
|
|
163
163
|
* */
|
|
164
164
|
{
|
|
165
165
|
/* sizes, fonts */
|
|
166
|
-
sm: `sd-6-7-
|
|
167
|
-
md: `sd-6-7-
|
|
168
|
-
lg: `sd-6-7-
|
|
166
|
+
sm: `sd-6-7-1-button--size-sm-font-size sd-6-7-1-button-font-weight sd-6-7-1-button--size-sm-border-radius varspacing-8 ${hasBorder ? "py-[0.281rem] px-[0.938rem]" : "sd-6-7-1-button--size-sm-padding-block px-4"}`,
|
|
167
|
+
md: `sd-6-7-1-button--size-md-font-size sd-6-7-1-button-font-weight sd-6-7-1-button--size-md-border-radius varspacing-10 ${hasBorder ? "py-[0.438rem] px-[0.938rem]" : "sd-6-7-1-button--size-md-padding-block px-4"}`,
|
|
168
|
+
lg: `sd-6-7-1-button--size-lg-font-size sd-6-7-1-button-font-weight sd-6-7-1-button--size-lg-border-radius varspacing-12 ${hasBorder ? "py-[0.688rem] px-[0.938rem]" : "sd-6-7-1-button--size-lg-padding-block px-4"}`
|
|
169
169
|
}[this.size],
|
|
170
170
|
{
|
|
171
171
|
/* variants */
|
|
172
|
-
primary: !this.inverted ? `${this.visuallyDisabled ? "bg-neutral-500 border-neutral-500 hover:bg-neutral-500 text-white" : "sd-6-7-
|
|
173
|
-
disabled:bg-neutral-500 disabled:text-white` : `${this.visuallyDisabled ? "bg-neutral-500 text-white border-neutral-500 hover:bg-neutral-500 active:bg-neutral-500" : "sd-6-7-
|
|
174
|
-
disabled:sd-6-7-
|
|
175
|
-
secondary: !this.inverted ? `border ${this.visuallyDisabled ? "sd-6-7-
|
|
176
|
-
disabled:sd-6-7-
|
|
177
|
-
disabled:sd-6-7-
|
|
178
|
-
tertiary: !this.inverted ? `border-transparent ${this.visuallyDisabled ? "sd-6-7-
|
|
179
|
-
disabled:sd-6-7-
|
|
180
|
-
disabled:sd-6-7-
|
|
172
|
+
primary: !this.inverted ? `${this.visuallyDisabled ? "bg-neutral-500 border-neutral-500 hover:bg-neutral-500 text-white" : "sd-6-7-1-button--primary--default-color-background border-transparent sd-6-7-1-button--primary--default-color-text hover:text-primary-100 active:sd-6-7-1-button--primary--active-color-text"}
|
|
173
|
+
disabled:bg-neutral-500 disabled:text-white` : `${this.visuallyDisabled ? "bg-neutral-500 text-white border-neutral-500 hover:bg-neutral-500 active:bg-neutral-500" : "sd-6-7-1-button--primary--inverted--default-color-text sd-6-7-1-button--primary--inverted--default-color-background border-white hover:sd-6-7-1-button--primary--inverted--hover-color-text active:sd-6-7-1-button--primary--inverted--active-color-text active:sd-6-7-1-button--primary--inverted--active-color-background"}
|
|
174
|
+
disabled:sd-6-7-1-button--inverted--disabled-color-background disabled:sd-6-7-1-button--inverted--disabled-color-border disabled:text-white`,
|
|
175
|
+
secondary: !this.inverted ? `border ${this.visuallyDisabled ? "sd-6-7-1-button--secondary--disabled-color-text border-neutral-500 hover:text-neutral-500 hover:border-neutral-500 active:text-neutral-500 active:border-neutral-500" : "sd-6-7-1-button--secondary--default-color-text border-primary hover:text-primary-500 hover:border-primary-500 active:text-primary-800 active:border-primary-800"}
|
|
176
|
+
disabled:sd-6-7-1-button--secondary--disabled-color-text disabled:border-neutral-500` : `border ${this.visuallyDisabled ? "text-neutral-600 border-neutral-600 hover:text-neutral-600 hover:border-neutral-600 active:text-neutral-600 active:border-neutral-600" : "text-white sd-6-7-1-button--secondary--inverted--color-border hover:sd-6-7-1-button--secondary--inverted--hover-color-text hover:border-primary-100 active:text-primary-200"}
|
|
177
|
+
disabled:sd-6-7-1-button--inverted--disabled-color-border disabled:sd-6-7-1-button--inverted--disabled-color-text`,
|
|
178
|
+
tertiary: !this.inverted ? `border-transparent ${this.visuallyDisabled ? "sd-6-7-1-button--tertiary--disabled-color-text hover:text-neutral-500 active:text-neutral-500" : "sd-6-7-1-button--tertiary--default-color-text hover:text-primary-500 active:text-primary-800"}
|
|
179
|
+
disabled:sd-6-7-1-button--tertiary--disabled-color-text` : `border-transparent ${this.visuallyDisabled ? "text-neutral-600 hover:text-neutral-600 active:text-neutral-600" : "text-white hover:sd-6-7-1-button--tertiary--inverted--hover-color-text hover:sd-6-7-1-button--tertiary--inverted--hover-color-background active:text-primary-200"}
|
|
180
|
+
disabled:sd-6-7-1-button--inverted--disabled-color-text`,
|
|
181
181
|
cta: `${this.visuallyDisabled ? "bg-neutral-500 border-neutral-500 hover:bg-neutral-500 active:bg-neutral-500" : "bg-accent border-transparent"}
|
|
182
|
-
${!this.inverted ? "text-white disabled:bg-neutral-500 disabled:border-neutral-500 disabled:text-white" : "sd-6-7-
|
|
182
|
+
${!this.inverted ? "text-white disabled:bg-neutral-500 disabled:border-neutral-500 disabled:text-white" : "sd-6-7-1-button--cta--inverted--default-color-background sd-6-7-1-button--cta--inverted--default-color-text hover:sd-6-7-1-button--cta--inverted--hover-color-text active:sd-6-7-1-button--cta--inverted--active-color-text disabled:sd-6-7-1-button--inverted--disabled-color-background disabled:sd-6-7-1-button--inverted--disabled-color-border disabled:text-white"}`
|
|
183
183
|
}[this.variant]
|
|
184
184
|
)}" ?disabled="${ifDefined(isLink ? void 0 : this.disabled)}" type="${ifDefined(isLink ? void 0 : this.type)}" title="${this.title}" name="${ifDefined(isLink ? void 0 : this.name)}" value="${ifDefined(isLink ? void 0 : this.value)}" href="${ifDefined(isLink ? this.href : void 0)}" target="${ifDefined(isLink ? this.target : void 0)}" download="${ifDefined(isLink ? this.download : void 0)}" rel="${ifDefined(isLink && this.target ? "noreferrer noopener" : void 0)}" role="${ifDefined(isLink ? void 0 : "button")}" aria-disabled="${this.disabled || this.visuallyDisabled ? "true" : "false"}" aria-labelledby="content" tabindex="${this.disabled ? "-1" : "0"}" @blur="${this.handleBlur}" @focus="${this.handleFocus}" @invalid="${this.isButton() ? this.handleInvalid : null}" @click="${this.handleClick}"><div part="motion-wrapper" class="${cx(
|
|
185
185
|
"absolute inset-0 -z-10 overflow-hidden pointer-events-none ",
|
|
186
186
|
(this.disabled || this.visuallyDisabled) && "hidden",
|
|
187
187
|
{
|
|
188
188
|
/* sizes, fonts */
|
|
189
|
-
sm: `sd-6-7-
|
|
190
|
-
md: `sd-6-7-
|
|
191
|
-
lg: `sd-6-7-
|
|
189
|
+
sm: `sd-6-7-1-button--size-sm-border-radius`,
|
|
190
|
+
md: `sd-6-7-1-button--size-md-border-radius`,
|
|
191
|
+
lg: `sd-6-7-1-button--size-lg-border-radius`
|
|
192
192
|
}[this.size]
|
|
193
193
|
)}"><div class="absolute inset-0 w-full h-full transition-all duration-fast translate-y-full group-hover:translate-y-0 group-hover:mt-[-22%] mt-[11%]"><div class="${cx(
|
|
194
194
|
"absolute right-0 min-w-full min-h-full aspect-square skew-y-[-11deg] mt-[11%]",
|
|
195
195
|
{
|
|
196
|
-
primary: !this.inverted ? "sd-6-7-
|
|
197
|
-
secondary: !this.inverted ? "sd-6-7-
|
|
198
|
-
tertiary: !this.inverted ? "sd-6-7-
|
|
199
|
-
cta: !this.inverted ? "bg-accent-550 group-active:bg-accent-700" : "sd-6-7-
|
|
196
|
+
primary: !this.inverted ? "sd-6-7-1-button--primary--hover-color-background group-active:bg-primary-800" : "sd-6-7-1-button--primary--inverted--hover-color-background group-active:bg-primary-200",
|
|
197
|
+
secondary: !this.inverted ? "sd-6-7-1-button--secondary--hover-color-background group-active:sd-6-7-1-button--secondary--active-color-background" : "bg-primary-500 group-active:sd-6-7-1-button--secondary--inverted--active-color-background",
|
|
198
|
+
tertiary: !this.inverted ? "sd-6-7-1-button--tertiary--hover-color-background group-active:sd-6-7-1-button--tertiary--active-color-background" : "bg-primary-500 group-active:sd-6-7-1-button--tertiary--inverted--active-color-background",
|
|
199
|
+
cta: !this.inverted ? "bg-accent-550 group-active:bg-accent-700" : "sd-6-7-1-button--cta--inverted--hover-color-background group-active:sd-6-7-1-button--cta--inverted--active-color-background"
|
|
200
200
|
}[this.variant]
|
|
201
201
|
)}"></div><div class="${cx(
|
|
202
202
|
"absolute w-full h-full mt-[22%]",
|
|
203
203
|
{
|
|
204
|
-
primary: !this.inverted ? "sd-6-7-
|
|
205
|
-
secondary: !this.inverted ? "sd-6-7-
|
|
206
|
-
tertiary: !this.inverted ? "sd-6-7-
|
|
207
|
-
cta: !this.inverted ? "bg-accent-550 group-active:bg-accent-700" : "sd-6-7-
|
|
204
|
+
primary: !this.inverted ? "sd-6-7-1-button--primary--hover-color-background group-active:bg-primary-800" : "sd-6-7-1-button--primary--inverted--hover-color-background group-active:bg-primary-200",
|
|
205
|
+
secondary: !this.inverted ? "sd-6-7-1-button--secondary--hover-color-background group-active:sd-6-7-1-button--secondary--active-color-background" : "bg-primary-500 group-active:sd-6-7-1-button--secondary--inverted--active-color-background",
|
|
206
|
+
tertiary: !this.inverted ? "sd-6-7-1-button--tertiary--hover-color-background group-active:sd-6-7-1-button--tertiary--active-color-background" : "bg-primary-500 group-active:sd-6-7-1-button--tertiary--inverted--active-color-background",
|
|
207
|
+
cta: !this.inverted ? "bg-accent-550 group-active:bg-accent-700" : "sd-6-7-1-button--cta--inverted--hover-color-background group-active:sd-6-7-1-button--cta--inverted--active-color-background"
|
|
208
208
|
}[this.variant]
|
|
209
209
|
)}"></div></div></div><slot name="icon-left" part="icon-left" class="${cx(
|
|
210
210
|
"flex flex-auto items-center justify-end pointer-events-none",
|
|
@@ -228,7 +228,7 @@ var SdButton = class extends SolidElement {
|
|
|
228
228
|
md: "ml-2",
|
|
229
229
|
lg: "ml-2"
|
|
230
230
|
}[this.size]
|
|
231
|
-
)}"></slot>${this.loading ? html`<sd-6-7-
|
|
231
|
+
)}"></slot>${this.loading ? html`<sd-6-7-1-loader class="${cx("absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2")}"></sd-6-7-1-loader>` : ""}</${tag}>`;
|
|
232
232
|
}
|
|
233
233
|
};
|
|
234
234
|
/**
|
|
@@ -237,13 +237,13 @@ var SdButton = class extends SolidElement {
|
|
|
237
237
|
SdButton.styles = [
|
|
238
238
|
...SolidElement.styles,
|
|
239
239
|
css`/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
|
|
240
|
-
:host{position:relative;z-index:0;display:inline-block;width:auto;cursor:pointer}::slotted(sd-6-7-
|
|
240
|
+
:host{position:relative;z-index:0;display:inline-block;width:auto;cursor:pointer}::slotted(sd-6-7-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-7-1-icon),sd-6-7-1-loader{font-size:calc(var(--tw-varspacing)/ 2)}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}`
|
|
241
241
|
];
|
|
242
242
|
__decorateClass([
|
|
243
243
|
query("a, button")
|
|
244
244
|
], SdButton.prototype, "button", 2);
|
|
245
245
|
__decorateClass([
|
|
246
|
-
queryAssignedElements({ selector: "sd-6-7-
|
|
246
|
+
queryAssignedElements({ selector: "sd-6-7-1-icon" })
|
|
247
247
|
], SdButton.prototype, "_iconsInDefaultSlot", 2);
|
|
248
248
|
__decorateClass([
|
|
249
249
|
state()
|
|
@@ -309,7 +309,7 @@ __decorateClass([
|
|
|
309
309
|
watch("disabled", { waitUntilFirstUpdate: true })
|
|
310
310
|
], SdButton.prototype, "handleDisabledChange", 1);
|
|
311
311
|
SdButton = __decorateClass([
|
|
312
|
-
customElement("sd-6-7-
|
|
312
|
+
customElement("sd-6-7-1-button")
|
|
313
313
|
], SdButton);
|
|
314
314
|
|
|
315
315
|
export {
|