@mhmo91/schmancy 0.2.112 → 0.2.113
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/dist/{animated-text-CrZbI_E_.cjs → animated-text-B576YswO.cjs} +2 -2
- package/dist/{animated-text-CrZbI_E_.cjs.map → animated-text-B576YswO.cjs.map} +1 -1
- package/dist/{animated-text-CmvbdVJF.js → animated-text-BuRbVM-X.js} +3 -3
- package/dist/{animated-text-CmvbdVJF.js.map → animated-text-BuRbVM-X.js.map} +1 -1
- package/dist/animated-text.cjs +1 -1
- package/dist/animated-text.js +1 -1
- package/dist/area.cjs +1 -1
- package/dist/{area.component-D5Fb0wFU.cjs → area.component-BFj0Dvfb.cjs} +2 -2
- package/dist/{area.component-D5Fb0wFU.cjs.map → area.component-BFj0Dvfb.cjs.map} +1 -1
- package/dist/{area.component-Dzl8Iw9I.js → area.component-Bo5aB8BH.js} +3 -3
- package/dist/{area.component-Dzl8Iw9I.js.map → area.component-Bo5aB8BH.js.map} +1 -1
- package/dist/area.js +1 -1
- package/dist/{autocomplete-Bsx63fvs.cjs → autocomplete-Du2Jw0a2.cjs} +2 -2
- package/dist/{autocomplete-Bsx63fvs.cjs.map → autocomplete-Du2Jw0a2.cjs.map} +1 -1
- package/dist/{autocomplete-C7d1TghO.js → autocomplete-NL-c1Qp-.js} +3 -3
- package/dist/{autocomplete-C7d1TghO.js.map → autocomplete-NL-c1Qp-.js.map} +1 -1
- package/dist/autocomplete.cjs +1 -1
- package/dist/autocomplete.js +1 -1
- package/dist/busy.cjs +1 -1
- package/dist/busy.js +1 -1
- package/dist/button.cjs +1 -1
- package/dist/button.js +1 -1
- package/dist/card.cjs +1 -1
- package/dist/card.js +1 -1
- package/dist/{checkbox-Ddc3Nogy.js → checkbox-DQYRlKod.js} +2 -2
- package/dist/{checkbox-Ddc3Nogy.js.map → checkbox-DQYRlKod.js.map} +1 -1
- package/dist/{checkbox-D5Zw8R82.cjs → checkbox-FM06WS9G.cjs} +2 -2
- package/dist/{checkbox-D5Zw8R82.cjs.map → checkbox-FM06WS9G.cjs.map} +1 -1
- package/dist/checkbox.cjs +1 -1
- package/dist/checkbox.js +1 -1
- package/dist/{chips-D5ADFFCU.cjs → chips-CJZbtp-O.cjs} +2 -2
- package/dist/{chips-D5ADFFCU.cjs.map → chips-CJZbtp-O.cjs.map} +1 -1
- package/dist/{chips-Bm_VYwr5.js → chips-Ctk7cxHI.js} +3 -3
- package/dist/{chips-Bm_VYwr5.js.map → chips-Ctk7cxHI.js.map} +1 -1
- package/dist/chips.cjs +1 -1
- package/dist/chips.js +1 -1
- package/dist/components.cjs +1 -1
- package/dist/components.js +1 -1
- package/dist/content-drawer.cjs +1 -1
- package/dist/content-drawer.js +1 -1
- package/dist/date-range-CZiZR3OZ.js +447 -0
- package/dist/date-range-CZiZR3OZ.js.map +1 -0
- package/dist/date-range-FxAO_oqk.cjs +79 -0
- package/dist/date-range-FxAO_oqk.cjs.map +1 -0
- package/dist/date-range.cjs +1 -1
- package/dist/date-range.js +1 -1
- package/dist/{delay-DSBPkKzK.cjs → delay-NkgyZVcO.cjs} +2 -2
- package/dist/{delay-DSBPkKzK.cjs.map → delay-NkgyZVcO.cjs.map} +1 -1
- package/dist/{delay-Nnqipc2p.js → delay-gZOjfjX_.js} +2 -2
- package/dist/{delay-Nnqipc2p.js.map → delay-gZOjfjX_.js.map} +1 -1
- package/dist/delay.cjs +1 -1
- package/dist/delay.js +1 -1
- package/dist/{divider-C7JP4sSG.js → divider-B-JF8gre.js} +3 -3
- package/dist/{divider-C7JP4sSG.js.map → divider-B-JF8gre.js.map} +1 -1
- package/dist/{divider-CcTSaeAl.cjs → divider-nNk0E_jZ.cjs} +2 -2
- package/dist/{divider-CcTSaeAl.cjs.map → divider-nNk0E_jZ.cjs.map} +1 -1
- package/dist/divider.cjs +1 -1
- package/dist/divider.js +1 -1
- package/dist/{flex-P9rZBgGQ.js → flex-CieqpOUS.js} +2 -2
- package/dist/{flex-P9rZBgGQ.js.map → flex-CieqpOUS.js.map} +1 -1
- package/dist/{flex-B_mVCq18.cjs → flex-INEcbqBe.cjs} +2 -2
- package/dist/{flex-B_mVCq18.cjs.map → flex-INEcbqBe.cjs.map} +1 -1
- package/dist/{form-cxzC6GVM.cjs → form-CKMp4UzU.cjs} +2 -2
- package/dist/{form-cxzC6GVM.cjs.map → form-CKMp4UzU.cjs.map} +1 -1
- package/dist/{form-DPcVlChy.js → form-lcamXnkd.js} +2 -2
- package/dist/{form-DPcVlChy.js.map → form-lcamXnkd.js.map} +1 -1
- package/dist/form.cjs +1 -1
- package/dist/form.js +1 -1
- package/dist/{icon-BEKKW3-2.cjs → icon-BZqH7sp7.cjs} +2 -2
- package/dist/{icon-BEKKW3-2.cjs.map → icon-BZqH7sp7.cjs.map} +1 -1
- package/dist/{icon-BGWDEYcH.js → icon-CJrmUGTm.js} +3 -3
- package/dist/{icon-BGWDEYcH.js.map → icon-CJrmUGTm.js.map} +1 -1
- package/dist/{icon-button-DlC2-vLK.js → icon-button-BNn0qRfC.js} +3 -3
- package/dist/{icon-button-DlC2-vLK.js.map → icon-button-BNn0qRfC.js.map} +1 -1
- package/dist/{icon-button-ChOGnclR.cjs → icon-button-nMHz4MDw.cjs} +2 -2
- package/dist/{icon-button-ChOGnclR.cjs.map → icon-button-nMHz4MDw.cjs.map} +1 -1
- package/dist/icons.cjs +1 -1
- package/dist/icons.js +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.js +33 -33
- package/dist/{input-C7C9t_rb.cjs → input-CszLZ81k.cjs} +2 -2
- package/dist/{input-C7C9t_rb.cjs.map → input-CszLZ81k.cjs.map} +1 -1
- package/dist/{input-CIRYUKIL.js → input-CwWLOBMF.js} +2 -2
- package/dist/{input-CIRYUKIL.js.map → input-CwWLOBMF.js.map} +1 -1
- package/dist/input.cjs +1 -1
- package/dist/input.js +1 -1
- package/dist/layout.cjs +1 -1
- package/dist/layout.js +1 -1
- package/dist/{list-Bzx4a2RJ.js → list-CjrF4M5H.js} +2 -2
- package/dist/{list-Bzx4a2RJ.js.map → list-CjrF4M5H.js.map} +1 -1
- package/dist/{list-D1kS-XDO.cjs → list-D4y-Mkap.cjs} +2 -2
- package/dist/{list-D1kS-XDO.cjs.map → list-D4y-Mkap.cjs.map} +1 -1
- package/dist/list.cjs +1 -1
- package/dist/list.js +1 -1
- package/dist/{litElement.mixin-Dx9_p_nV.js → litElement.mixin-NzkxESus.js} +2 -2
- package/dist/{litElement.mixin-Dx9_p_nV.js.map → litElement.mixin-NzkxESus.js.map} +1 -1
- package/dist/{litElement.mixin-PVEJyATw.cjs → litElement.mixin-djlKJ0lX.cjs} +2 -2
- package/dist/{litElement.mixin-PVEJyATw.cjs.map → litElement.mixin-djlKJ0lX.cjs.map} +1 -1
- package/dist/{menu-CzcGpZXF.js → menu-Cb5kUAvU.js} +3 -3
- package/dist/{menu-CzcGpZXF.js.map → menu-Cb5kUAvU.js.map} +1 -1
- package/dist/{menu-D30w9YPg.cjs → menu-DAtFS31a.cjs} +2 -2
- package/dist/{menu-D30w9YPg.cjs.map → menu-DAtFS31a.cjs.map} +1 -1
- package/dist/menu.cjs +1 -1
- package/dist/menu.js +1 -1
- package/dist/nav-drawer.cjs +1 -1
- package/dist/nav-drawer.js +1 -1
- package/dist/notification.cjs +1 -1
- package/dist/notification.js +1 -1
- package/dist/{option-x_W6-_iT.cjs → option-0le6-QeS.cjs} +2 -2
- package/dist/{option-x_W6-_iT.cjs.map → option-0le6-QeS.cjs.map} +1 -1
- package/dist/{option-igpxXgTd.js → option-_1gW48HB.js} +2 -2
- package/dist/{option-igpxXgTd.js.map → option-_1gW48HB.js.map} +1 -1
- package/dist/option.cjs +1 -1
- package/dist/option.js +1 -1
- package/dist/{outlet-DzAi4iKo.js → outlet-6HZp4fo1.js} +3 -3
- package/dist/outlet-6HZp4fo1.js.map +1 -0
- package/dist/{outlet-DqRiezsh.cjs → outlet-DofHDlGH.cjs} +3 -3
- package/dist/outlet-DofHDlGH.cjs.map +1 -0
- package/dist/{payment-card-form-IamvKqiN.cjs → payment-card-form-Bi3yNg4b.cjs} +2 -2
- package/dist/{payment-card-form-IamvKqiN.cjs.map → payment-card-form-Bi3yNg4b.cjs.map} +1 -1
- package/dist/{payment-card-form-CwqKB8Tm.js → payment-card-form-C8FxRlh4.js} +3 -3
- package/dist/{payment-card-form-CwqKB8Tm.js.map → payment-card-form-C8FxRlh4.js.map} +1 -1
- package/dist/{radio-group-zGJIFNCR.cjs → radio-group-A5QxSGOr.cjs} +2 -2
- package/dist/{radio-group-zGJIFNCR.cjs.map → radio-group-A5QxSGOr.cjs.map} +1 -1
- package/dist/{radio-group-C9UaGgCL.js → radio-group-BapuNl8y.js} +2 -2
- package/dist/{radio-group-C9UaGgCL.js.map → radio-group-BapuNl8y.js.map} +1 -1
- package/dist/radio-group.cjs +1 -1
- package/dist/radio-group.js +1 -1
- package/dist/{select-5ob4WHTf.js → select-8AjN6LbM.js} +3 -3
- package/dist/{select-5ob4WHTf.js.map → select-8AjN6LbM.js.map} +1 -1
- package/dist/{select-B194j_5a.cjs → select-BdU6KcPX.cjs} +2 -2
- package/dist/{select-B194j_5a.cjs.map → select-BdU6KcPX.cjs.map} +1 -1
- package/dist/select.cjs +1 -1
- package/dist/select.js +1 -1
- package/dist/{sheet-CHFHgh29.cjs → sheet-CQFdHSwJ.cjs} +6 -6
- package/dist/sheet-CQFdHSwJ.cjs.map +1 -0
- package/dist/{sheet-C2RxblaX.js → sheet-xR13xD2A.js} +11 -11
- package/dist/sheet-xR13xD2A.js.map +1 -0
- package/dist/sheet.cjs +1 -1
- package/dist/sheet.js +1 -1
- package/dist/{slider-BgNoOOeQ.cjs → slider-B4OCBlQg.cjs} +2 -2
- package/dist/{slider-BgNoOOeQ.cjs.map → slider-B4OCBlQg.cjs.map} +1 -1
- package/dist/{slider-BOTY8Lhv.js → slider-BakU-Bdw.js} +3 -3
- package/dist/{slider-BOTY8Lhv.js.map → slider-BakU-Bdw.js.map} +1 -1
- package/dist/slider.cjs +1 -1
- package/dist/slider.js +1 -1
- package/dist/{spinner-Vwv-mKip.js → spinner-BDx3SZsl.js} +4 -4
- package/dist/spinner-BDx3SZsl.js.map +1 -0
- package/dist/{spinner-vBTOD2N0.cjs → spinner-C3VJtLgk.cjs} +3 -3
- package/dist/spinner-C3VJtLgk.cjs.map +1 -0
- package/dist/{surface-CryISDFd.js → surface-YiaJJQ5m.js} +2 -2
- package/dist/{surface-CryISDFd.js.map → surface-YiaJJQ5m.js.map} +1 -1
- package/dist/{surface-Csc8YLks.cjs → surface-kjOrb8TO.cjs} +2 -2
- package/dist/{surface-Csc8YLks.cjs.map → surface-kjOrb8TO.cjs.map} +1 -1
- package/dist/surface.cjs +1 -1
- package/dist/surface.js +1 -1
- package/dist/{table-DHHo5etf.cjs → table-BZV2dBD5.cjs} +2 -2
- package/dist/{table-DHHo5etf.cjs.map → table-BZV2dBD5.cjs.map} +1 -1
- package/dist/{table-DRL3oAjo.js → table-BguYeeBH.js} +2 -2
- package/dist/{table-DRL3oAjo.js.map → table-BguYeeBH.js.map} +1 -1
- package/dist/table.cjs +1 -1
- package/dist/table.js +1 -1
- package/dist/{tabs-group-BRVzKIRX.cjs → tabs-group-BZFBZ1_G.cjs} +2 -2
- package/dist/{tabs-group-BRVzKIRX.cjs.map → tabs-group-BZFBZ1_G.cjs.map} +1 -1
- package/dist/{tabs-group-BcXgpxUw.js → tabs-group-H3C6ZnQn.js} +2 -2
- package/dist/{tabs-group-BcXgpxUw.js.map → tabs-group-H3C6ZnQn.js.map} +1 -1
- package/dist/tabs.cjs +1 -1
- package/dist/tabs.js +1 -1
- package/dist/{tailwind.mixin-BM-bjRjT.cjs → tailwind.mixin-CBhPue3q.cjs} +2 -2
- package/dist/{tailwind.mixin-BM-bjRjT.cjs.map → tailwind.mixin-CBhPue3q.cjs.map} +1 -1
- package/dist/{tailwind.mixin-YEy_iITN.js → tailwind.mixin-DklgfhB4.js} +2 -2
- package/dist/{tailwind.mixin-YEy_iITN.js.map → tailwind.mixin-DklgfhB4.js.map} +1 -1
- package/dist/teleport.cjs +1 -1
- package/dist/{teleport.component-BVj_m_Kl.cjs → teleport.component-CF-USarR.cjs} +2 -2
- package/dist/{teleport.component-BVj_m_Kl.cjs.map → teleport.component-CF-USarR.cjs.map} +1 -1
- package/dist/{teleport.component-K6cmr5Tr.js → teleport.component-D8DXijGl.js} +35 -35
- package/dist/{teleport.component-K6cmr5Tr.js.map → teleport.component-D8DXijGl.js.map} +1 -1
- package/dist/teleport.js +1 -1
- package/dist/{textarea-CUi2u7J7.cjs → textarea-BCWPb0Sn.cjs} +2 -2
- package/dist/{textarea-CUi2u7J7.cjs.map → textarea-BCWPb0Sn.cjs.map} +1 -1
- package/dist/{textarea-BzI6HMKy.js → textarea-D7bTMerW.js} +2 -2
- package/dist/{textarea-BzI6HMKy.js.map → textarea-D7bTMerW.js.map} +1 -1
- package/dist/textarea.cjs +1 -1
- package/dist/textarea.js +1 -1
- package/dist/{theme-button-DhD5GksO.js → theme-button-CP2_aq__.js} +2 -2
- package/dist/{theme-button-DhD5GksO.js.map → theme-button-CP2_aq__.js.map} +1 -1
- package/dist/{theme-button-BJe1x0Cs.cjs → theme-button-DHuXg7vh.cjs} +2 -2
- package/dist/{theme-button-BJe1x0Cs.cjs.map → theme-button-DHuXg7vh.cjs.map} +1 -1
- package/dist/theme-button.cjs +1 -1
- package/dist/theme-button.js +1 -1
- package/dist/theme.cjs +1 -1
- package/dist/{theme.component-D4WBav-_.js → theme.component-BtBosXb1.js} +2 -2
- package/dist/{theme.component-D4WBav-_.js.map → theme.component-BtBosXb1.js.map} +1 -1
- package/dist/{theme.component-BI2OGjYG.cjs → theme.component-Ly2C_fQ8.cjs} +2 -2
- package/dist/{theme.component-BI2OGjYG.cjs.map → theme.component-Ly2C_fQ8.cjs.map} +1 -1
- package/dist/theme.js +1 -1
- package/dist/{tree-8ORo7bDg.cjs → tree-CG9B3uQP.cjs} +2 -2
- package/dist/{tree-8ORo7bDg.cjs.map → tree-CG9B3uQP.cjs.map} +1 -1
- package/dist/{tree-D42tswgB.js → tree-Y2B7yK7L.js} +2 -2
- package/dist/{tree-D42tswgB.js.map → tree-Y2B7yK7L.js.map} +1 -1
- package/dist/tree.cjs +1 -1
- package/dist/tree.js +1 -1
- package/dist/{typewriter-JuHIja1a.cjs → typewriter-CzV1O28F.cjs} +2 -2
- package/dist/{typewriter-JuHIja1a.cjs.map → typewriter-CzV1O28F.cjs.map} +1 -1
- package/dist/{typewriter-BwNXbsZp.js → typewriter-bnkFoDFz.js} +4 -4
- package/dist/{typewriter-BwNXbsZp.js.map → typewriter-bnkFoDFz.js.map} +1 -1
- package/dist/typewriter.cjs +1 -1
- package/dist/typewriter.js +1 -1
- package/dist/{typography-CaOb3D3z.js → typography-CSQByhJF.js} +2 -2
- package/dist/{typography-CaOb3D3z.js.map → typography-CSQByhJF.js.map} +1 -1
- package/dist/{typography-BMkQ3cH-.cjs → typography-D-a-z23R.cjs} +2 -2
- package/dist/{typography-BMkQ3cH-.cjs.map → typography-D-a-z23R.cjs.map} +1 -1
- package/dist/typography.cjs +1 -1
- package/dist/typography.js +1 -1
- package/package.json +2 -2
- package/types/src/date-range/date-range.d.ts +2 -2
- package/dist/date-range-CH-IKoMW.cjs +0 -72
- package/dist/date-range-CH-IKoMW.cjs.map +0 -1
- package/dist/date-range-LMnnBclq.js +0 -166
- package/dist/date-range-LMnnBclq.js.map +0 -1
- package/dist/outlet-DqRiezsh.cjs.map +0 -1
- package/dist/outlet-DzAi4iKo.js.map +0 -1
- package/dist/sheet-C2RxblaX.js.map +0 -1
- package/dist/sheet-CHFHgh29.cjs.map +0 -1
- package/dist/spinner-Vwv-mKip.js.map +0 -1
- package/dist/spinner-vBTOD2N0.cjs.map +0 -1
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { fromEvent as x } from "rxjs";
|
|
2
2
|
import "lit/directives/class-map.js";
|
|
3
3
|
import "lit/directives/style-map.js";
|
|
4
|
-
import { $ as f } from "./litElement.mixin-
|
|
5
|
-
import "./tailwind.mixin-
|
|
4
|
+
import { $ as f } from "./litElement.mixin-NzkxESus.js";
|
|
5
|
+
import "./tailwind.mixin-DklgfhB4.js";
|
|
6
6
|
import { css as m, html as c } from "lit";
|
|
7
7
|
import { property as d, customElement as v, state as S, query as y } from "lit/decorators.js";
|
|
8
8
|
import { cache as w } from "lit/directives/cache.js";
|
|
@@ -162,4 +162,4 @@ export {
|
|
|
162
162
|
n as S,
|
|
163
163
|
h as a
|
|
164
164
|
};
|
|
165
|
-
//# sourceMappingURL=slider-
|
|
165
|
+
//# sourceMappingURL=slider-BakU-Bdw.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"slider-BOTY8Lhv.js","sources":["../src/slider/slide.ts","../src/slider/slider.ts"],"sourcesContent":["import { $LitElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { cache } from 'lit/directives/cache.js'\n\n/**\n * Supported slide \"types.\"\n * - 'image': Renders an <img>\n * - 'video': Renders a <video>\n * - 'content': Renders a <slot> (the default)\n */\ntype SlideType = 'image' | 'video' | 'content'\n\n/**\n * Allowed values for the 'fit' property,\n * which maps to CSS object-fit.\n */\ntype ObjectFit = 'cover' | 'contain' | 'fill' | 'scale-down' | 'none'\n\n@customElement('schmancy-slide')\nexport class SchmancySlide extends $LitElement(css`\n\t:host {\n\t\tdisplay: block;\n\t\tscroll-snap-align: center; /* If your slider uses scroll-snap */\n\t}\n\n\t.slide {\n\t\tdisplay: block;\n\t\twidth: 100%;\n\t\theight: auto;\n\t\tobject-fit: var(--object-fit, cover);\n\t}\n`) {\n\t/**\n\t * Determines how this slide should be rendered.\n\t * Defaults to 'content' if not provided.\n\t */\n\t@property({ type: String }) type: SlideType = 'content'\n\n\t/**\n\t * Source for images or videos (if `type` is 'image' or 'video').\n\t */\n\t@property({ type: String }) src: string = ''\n\n\t/**\n\t * Alternate text for images.\n\t */\n\t@property({ type: String }) alt: string = ''\n\n\t/**\n\t * Whether to show default video controls (if `type` is 'video').\n\t */\n\t@property({ type: Boolean }) controls = true\n\n\t/**\n\t * Whether the video should autoplay (if `type` is 'video').\n\t */\n\t@property({ type: Boolean }) autoplay = false\n\n\t/**\n\t * Whether the video should loop (if `type` is 'video').\n\t */\n\t@property({ type: Boolean }) loop = false\n\n\t/**\n\t * Whether the video is muted (if `type` is 'video').\n\t */\n\t@property({ type: Boolean }) muted = false\n\n\t/**\n\t * CSS `object-fit` property, applied to images/videos.\n\t */\n\t@property({ type: String }) fit: ObjectFit = 'cover'\n\n\trender() {\n\t\treturn html` <div style=\"--object-fit: ${this.fit}\">${cache(this.renderSlide())}</div> `\n\t}\n\n\tprivate renderSlide() {\n\t\tswitch (this.type) {\n\t\t\tcase 'image':\n\t\t\t\treturn html` <img class=\"slide\" src=\"${this.src}\" alt=\"${this.alt}\" loading=\"lazy\" /> `\n\t\t\tcase 'video':\n\t\t\t\treturn html`\n\t\t\t\t\t<video\n\t\t\t\t\t\tclass=\"slide\"\n\t\t\t\t\t\tsrc=\"${this.src}\"\n\t\t\t\t\t\t?controls=\"${this.controls}\"\n\t\t\t\t\t\t?autoplay=\"${this.autoplay}\"\n\t\t\t\t\t\t?loop=\"${this.loop}\"\n\t\t\t\t\t\t?muted=\"${this.muted}\"\n\t\t\t\t\t>\n\t\t\t\t\t\tYour browser does not support HTML video.\n\t\t\t\t\t</video>\n\t\t\t\t`\n\t\t\tcase 'content':\n\t\t\tdefault:\n\t\t\t\treturn html`<slot></slot>`\n\t\t}\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-slide': SchmancySlide\n\t}\n}\n","import { $LitElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\nimport { fromEvent } from 'rxjs'\nimport { throttleTime } from 'rxjs/operators'\n\n@customElement('schmancy-slider')\nexport class SchmancySlider extends $LitElement(css`\n\t.slider {\n\t\t/* Lay out slides horizontally, one after another */\n\t\tdisplay: flex;\n\t\toverflow-x: auto;\n\n\t\t/* Optional: scroll snapping */\n\t\tscroll-snap-type: x mandatory;\n\n\t\t/* Hide scrollbars */\n\t\t-ms-overflow-style: none; /* IE and Edge */\n\t\tscrollbar-width: none; /* Firefox */\n\t}\n\t.slider::-webkit-scrollbar {\n\t\tdisplay: none; /* Chrome, Safari, Opera */\n\t}\n\n\t/* \n Ensure each slide takes up the full slider width.\n \"schmancy-slide\" is the child custom element.\n */\n\t::slotted(schmancy-slide) {\n\t\tflex: 0 0 100%;\n\t\tbox-sizing: border-box;\n\t}\n`) {\n\t/**\n\t * Currently centered slide index\n\t */\n\t@state() private selectedIndex: number = 0\n\n\t/**\n\t * If true, renders next/prev buttons\n\t */\n\t@property({ type: Boolean }) showArrows: boolean = true\n\n\t@query('#slider') private slider!: HTMLDivElement\n\t@query('slot') private defaultSlot!: HTMLSlotElement\n\n\tprotected firstUpdated() {\n\t\t// Start at leftmost position\n\t\tthis.slider.scrollLeft = 0\n\n\t\t// Throttle scroll events to update selected index\n\t\tfromEvent(this.slider, 'scroll')\n\t\t\t.pipe(throttleTime(100, undefined, { trailing: true }))\n\t\t\t.subscribe(() => {\n\t\t\t\tthis.updateSelectedIndexOnScroll()\n\t\t\t})\n\t}\n\n\tprivate updateSelectedIndexOnScroll() {\n\t\tconst slides = this.defaultSlot?.assignedElements({ flatten: true }) ?? []\n\t\tif (!slides.length) return\n\n\t\tconst oldIndex = this.selectedIndex\n\n\t\t// Center of the slider’s visible area\n\t\tconst sliderCenter = this.slider.scrollLeft + this.slider.clientWidth / 2\n\n\t\tlet closestIndex = 0\n\t\tlet closestDistance = Infinity\n\n\t\tslides.forEach((slide, index) => {\n\t\t\tconst itemStart = (slide as HTMLElement).offsetLeft\n\t\t\tconst itemCenter = itemStart + slide.clientWidth / 2\n\t\t\tconst distance = Math.abs(sliderCenter - itemCenter)\n\n\t\t\tif (distance < closestDistance) {\n\t\t\t\tclosestDistance = distance\n\t\t\t\tclosestIndex = index\n\t\t\t}\n\t\t})\n\n\t\tthis.selectedIndex = closestIndex\n\n\t\t// If the index changed, dispatch event\n\t\tif (this.selectedIndex !== oldIndex) {\n\t\t\tthis.dispatchEvent(\n\t\t\t\tnew CustomEvent('slide-changed', {\n\t\t\t\t\tdetail: { index: this.selectedIndex },\n\t\t\t\t}),\n\t\t\t)\n\t\t}\n\t}\n\n\tprivate goToSlide(newIndex: number) {\n\t\tconst slides = this.defaultSlot?.assignedElements({ flatten: true }) ?? []\n\t\tif (!slides[newIndex]) return\n\n\t\tthis.slider.scrollTo({\n\t\t\tleft: (slides[newIndex] as HTMLElement).offsetLeft,\n\t\t\tbehavior: 'smooth',\n\t\t})\n\t}\n\n\tprivate onPrevClick() {\n\t\tthis.goToSlide(this.selectedIndex - 1)\n\t}\n\n\tprivate onNextClick() {\n\t\tconst slides = this.defaultSlot?.assignedElements({ flatten: true }) ?? []\n\t\tif (this.selectedIndex < slides.length - 1) {\n\t\t\tthis.goToSlide(this.selectedIndex + 1)\n\t\t}\n\t}\n\n\trender() {\n\t\tconst slides = this.defaultSlot?.assignedElements({ flatten: true }) ?? []\n\n\t\treturn html`\n\t\t\t<div class=\"relative inset-0\">\n\t\t\t\t<!-- The scrollable track -->\n\t\t\t\t<div class=\"slider\" id=\"slider\">\n\t\t\t\t\t<slot></slot>\n\t\t\t\t</div>\n\n\t\t\t\t<!-- Next/Prev Buttons (Optional) -->\n\t\t\t\t${this.showArrows\n\t\t\t\t\t? html`\n\t\t\t\t\t\t\t<schmancy-icon-button\n\t\t\t\t\t\t\t\tclass=\"absolute left-2 top-1/2 -translate-y-1/2\"\n\t\t\t\t\t\t\t\t@click=${this.onPrevClick}\n\t\t\t\t\t\t\t\t?disabled=${this.selectedIndex === 0}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\tchevron_left\n\t\t\t\t\t\t\t</schmancy-icon-button>\n\t\t\t\t\t\t\t<schmancy-icon-button\n\t\t\t\t\t\t\t\tclass=\"absolute right-2 top-1/2 -translate-y-1/2\"\n\t\t\t\t\t\t\t\t@click=${this.onNextClick}\n\t\t\t\t\t\t\t\t?disabled=${this.selectedIndex === slides.length - 1}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\tchevron_right\n\t\t\t\t\t\t\t</schmancy-icon-button>\n\t\t\t\t\t\t`\n\t\t\t\t\t: null}\n\n\t\t\t\t<!-- Dots / indicators -->\n\t\t\t\t<div class=\"absolute bottom-4 left-1/2 -translate-x-1/2 flex space-x-2\">\n\t\t\t\t\t${slides.map((_, index) => {\n\t\t\t\t\t\tconst isSelected = index === this.selectedIndex\n\t\t\t\t\t\treturn html`\n\t\t\t\t\t\t\t<schmancy-button .variant=${isSelected ? 'filled tonal' : 'outlined'} class=\"rounded-full \">\n\t\t\t\t\t\t\t</schmancy-button>\n\t\t\t\t\t\t`\n\t\t\t\t\t})}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-slider': SchmancySlider\n\t}\n}\n"],"names":["SchmancySlide","$LitElement","css","constructor","super","arguments","this","type","src","alt","controls","autoplay","loop","muted","fit","html","cache","renderSlide","__decorateClass","property","String","prototype","Boolean","customElement","SchmancySlider","selectedIndex","showArrows","slider","scrollLeft","fromEvent","pipe","throttleTime","trailing","subscribe","updateSelectedIndexOnScroll","slides","defaultSlot","assignedElements","flatten","length","oldIndex","sliderCenter","clientWidth","closestIndex","closestDistance","Infinity","forEach","slide","index","itemCenter","offsetLeft","distance","Math","abs","dispatchEvent","CustomEvent","detail","newIndex","scrollTo","left","behavior","goToSlide","onNextClick","render","onPrevClick","map","_","isSelected","state","query"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"slider-BakU-Bdw.js","sources":["../src/slider/slide.ts","../src/slider/slider.ts"],"sourcesContent":["import { $LitElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { cache } from 'lit/directives/cache.js'\n\n/**\n * Supported slide \"types.\"\n * - 'image': Renders an <img>\n * - 'video': Renders a <video>\n * - 'content': Renders a <slot> (the default)\n */\ntype SlideType = 'image' | 'video' | 'content'\n\n/**\n * Allowed values for the 'fit' property,\n * which maps to CSS object-fit.\n */\ntype ObjectFit = 'cover' | 'contain' | 'fill' | 'scale-down' | 'none'\n\n@customElement('schmancy-slide')\nexport class SchmancySlide extends $LitElement(css`\n\t:host {\n\t\tdisplay: block;\n\t\tscroll-snap-align: center; /* If your slider uses scroll-snap */\n\t}\n\n\t.slide {\n\t\tdisplay: block;\n\t\twidth: 100%;\n\t\theight: auto;\n\t\tobject-fit: var(--object-fit, cover);\n\t}\n`) {\n\t/**\n\t * Determines how this slide should be rendered.\n\t * Defaults to 'content' if not provided.\n\t */\n\t@property({ type: String }) type: SlideType = 'content'\n\n\t/**\n\t * Source for images or videos (if `type` is 'image' or 'video').\n\t */\n\t@property({ type: String }) src: string = ''\n\n\t/**\n\t * Alternate text for images.\n\t */\n\t@property({ type: String }) alt: string = ''\n\n\t/**\n\t * Whether to show default video controls (if `type` is 'video').\n\t */\n\t@property({ type: Boolean }) controls = true\n\n\t/**\n\t * Whether the video should autoplay (if `type` is 'video').\n\t */\n\t@property({ type: Boolean }) autoplay = false\n\n\t/**\n\t * Whether the video should loop (if `type` is 'video').\n\t */\n\t@property({ type: Boolean }) loop = false\n\n\t/**\n\t * Whether the video is muted (if `type` is 'video').\n\t */\n\t@property({ type: Boolean }) muted = false\n\n\t/**\n\t * CSS `object-fit` property, applied to images/videos.\n\t */\n\t@property({ type: String }) fit: ObjectFit = 'cover'\n\n\trender() {\n\t\treturn html` <div style=\"--object-fit: ${this.fit}\">${cache(this.renderSlide())}</div> `\n\t}\n\n\tprivate renderSlide() {\n\t\tswitch (this.type) {\n\t\t\tcase 'image':\n\t\t\t\treturn html` <img class=\"slide\" src=\"${this.src}\" alt=\"${this.alt}\" loading=\"lazy\" /> `\n\t\t\tcase 'video':\n\t\t\t\treturn html`\n\t\t\t\t\t<video\n\t\t\t\t\t\tclass=\"slide\"\n\t\t\t\t\t\tsrc=\"${this.src}\"\n\t\t\t\t\t\t?controls=\"${this.controls}\"\n\t\t\t\t\t\t?autoplay=\"${this.autoplay}\"\n\t\t\t\t\t\t?loop=\"${this.loop}\"\n\t\t\t\t\t\t?muted=\"${this.muted}\"\n\t\t\t\t\t>\n\t\t\t\t\t\tYour browser does not support HTML video.\n\t\t\t\t\t</video>\n\t\t\t\t`\n\t\t\tcase 'content':\n\t\t\tdefault:\n\t\t\t\treturn html`<slot></slot>`\n\t\t}\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-slide': SchmancySlide\n\t}\n}\n","import { $LitElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\nimport { fromEvent } from 'rxjs'\nimport { throttleTime } from 'rxjs/operators'\n\n@customElement('schmancy-slider')\nexport class SchmancySlider extends $LitElement(css`\n\t.slider {\n\t\t/* Lay out slides horizontally, one after another */\n\t\tdisplay: flex;\n\t\toverflow-x: auto;\n\n\t\t/* Optional: scroll snapping */\n\t\tscroll-snap-type: x mandatory;\n\n\t\t/* Hide scrollbars */\n\t\t-ms-overflow-style: none; /* IE and Edge */\n\t\tscrollbar-width: none; /* Firefox */\n\t}\n\t.slider::-webkit-scrollbar {\n\t\tdisplay: none; /* Chrome, Safari, Opera */\n\t}\n\n\t/* \n Ensure each slide takes up the full slider width.\n \"schmancy-slide\" is the child custom element.\n */\n\t::slotted(schmancy-slide) {\n\t\tflex: 0 0 100%;\n\t\tbox-sizing: border-box;\n\t}\n`) {\n\t/**\n\t * Currently centered slide index\n\t */\n\t@state() private selectedIndex: number = 0\n\n\t/**\n\t * If true, renders next/prev buttons\n\t */\n\t@property({ type: Boolean }) showArrows: boolean = true\n\n\t@query('#slider') private slider!: HTMLDivElement\n\t@query('slot') private defaultSlot!: HTMLSlotElement\n\n\tprotected firstUpdated() {\n\t\t// Start at leftmost position\n\t\tthis.slider.scrollLeft = 0\n\n\t\t// Throttle scroll events to update selected index\n\t\tfromEvent(this.slider, 'scroll')\n\t\t\t.pipe(throttleTime(100, undefined, { trailing: true }))\n\t\t\t.subscribe(() => {\n\t\t\t\tthis.updateSelectedIndexOnScroll()\n\t\t\t})\n\t}\n\n\tprivate updateSelectedIndexOnScroll() {\n\t\tconst slides = this.defaultSlot?.assignedElements({ flatten: true }) ?? []\n\t\tif (!slides.length) return\n\n\t\tconst oldIndex = this.selectedIndex\n\n\t\t// Center of the slider’s visible area\n\t\tconst sliderCenter = this.slider.scrollLeft + this.slider.clientWidth / 2\n\n\t\tlet closestIndex = 0\n\t\tlet closestDistance = Infinity\n\n\t\tslides.forEach((slide, index) => {\n\t\t\tconst itemStart = (slide as HTMLElement).offsetLeft\n\t\t\tconst itemCenter = itemStart + slide.clientWidth / 2\n\t\t\tconst distance = Math.abs(sliderCenter - itemCenter)\n\n\t\t\tif (distance < closestDistance) {\n\t\t\t\tclosestDistance = distance\n\t\t\t\tclosestIndex = index\n\t\t\t}\n\t\t})\n\n\t\tthis.selectedIndex = closestIndex\n\n\t\t// If the index changed, dispatch event\n\t\tif (this.selectedIndex !== oldIndex) {\n\t\t\tthis.dispatchEvent(\n\t\t\t\tnew CustomEvent('slide-changed', {\n\t\t\t\t\tdetail: { index: this.selectedIndex },\n\t\t\t\t}),\n\t\t\t)\n\t\t}\n\t}\n\n\tprivate goToSlide(newIndex: number) {\n\t\tconst slides = this.defaultSlot?.assignedElements({ flatten: true }) ?? []\n\t\tif (!slides[newIndex]) return\n\n\t\tthis.slider.scrollTo({\n\t\t\tleft: (slides[newIndex] as HTMLElement).offsetLeft,\n\t\t\tbehavior: 'smooth',\n\t\t})\n\t}\n\n\tprivate onPrevClick() {\n\t\tthis.goToSlide(this.selectedIndex - 1)\n\t}\n\n\tprivate onNextClick() {\n\t\tconst slides = this.defaultSlot?.assignedElements({ flatten: true }) ?? []\n\t\tif (this.selectedIndex < slides.length - 1) {\n\t\t\tthis.goToSlide(this.selectedIndex + 1)\n\t\t}\n\t}\n\n\trender() {\n\t\tconst slides = this.defaultSlot?.assignedElements({ flatten: true }) ?? []\n\n\t\treturn html`\n\t\t\t<div class=\"relative inset-0\">\n\t\t\t\t<!-- The scrollable track -->\n\t\t\t\t<div class=\"slider\" id=\"slider\">\n\t\t\t\t\t<slot></slot>\n\t\t\t\t</div>\n\n\t\t\t\t<!-- Next/Prev Buttons (Optional) -->\n\t\t\t\t${this.showArrows\n\t\t\t\t\t? html`\n\t\t\t\t\t\t\t<schmancy-icon-button\n\t\t\t\t\t\t\t\tclass=\"absolute left-2 top-1/2 -translate-y-1/2\"\n\t\t\t\t\t\t\t\t@click=${this.onPrevClick}\n\t\t\t\t\t\t\t\t?disabled=${this.selectedIndex === 0}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\tchevron_left\n\t\t\t\t\t\t\t</schmancy-icon-button>\n\t\t\t\t\t\t\t<schmancy-icon-button\n\t\t\t\t\t\t\t\tclass=\"absolute right-2 top-1/2 -translate-y-1/2\"\n\t\t\t\t\t\t\t\t@click=${this.onNextClick}\n\t\t\t\t\t\t\t\t?disabled=${this.selectedIndex === slides.length - 1}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\tchevron_right\n\t\t\t\t\t\t\t</schmancy-icon-button>\n\t\t\t\t\t\t`\n\t\t\t\t\t: null}\n\n\t\t\t\t<!-- Dots / indicators -->\n\t\t\t\t<div class=\"absolute bottom-4 left-1/2 -translate-x-1/2 flex space-x-2\">\n\t\t\t\t\t${slides.map((_, index) => {\n\t\t\t\t\t\tconst isSelected = index === this.selectedIndex\n\t\t\t\t\t\treturn html`\n\t\t\t\t\t\t\t<schmancy-button .variant=${isSelected ? 'filled tonal' : 'outlined'} class=\"rounded-full \">\n\t\t\t\t\t\t\t</schmancy-button>\n\t\t\t\t\t\t`\n\t\t\t\t\t})}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-slider': SchmancySlider\n\t}\n}\n"],"names":["SchmancySlide","$LitElement","css","constructor","super","arguments","this","type","src","alt","controls","autoplay","loop","muted","fit","html","cache","renderSlide","__decorateClass","property","String","prototype","Boolean","customElement","SchmancySlider","selectedIndex","showArrows","slider","scrollLeft","fromEvent","pipe","throttleTime","trailing","subscribe","updateSelectedIndexOnScroll","slides","defaultSlot","assignedElements","flatten","length","oldIndex","sliderCenter","clientWidth","closestIndex","closestDistance","Infinity","forEach","slide","index","itemCenter","offsetLeft","distance","Math","abs","dispatchEvent","CustomEvent","detail","newIndex","scrollTo","left","behavior","goToSlide","onNextClick","render","onPrevClick","map","_","isSelected","state","query"],"mappings":"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"}
|
package/dist/slider.cjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./slider-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./slider-B4OCBlQg.cjs");Object.defineProperty(exports,"SchmancySlide",{enumerable:!0,get:()=>e.SchmancySlide}),Object.defineProperty(exports,"SchmancySlider",{enumerable:!0,get:()=>e.SchmancySlider});
|
|
2
2
|
//# sourceMappingURL=slider.cjs.map
|
package/dist/slider.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import "./theme.component-
|
|
1
|
+
import "./theme.component-BtBosXb1.js";
|
|
2
2
|
import { S as l } from "./theme.interface-C5Kj6WjD.js";
|
|
3
3
|
import { c as u } from "./ripple-BumgqsDT.js";
|
|
4
4
|
import "rxjs";
|
|
5
5
|
import "lit/directives/class-map.js";
|
|
6
6
|
import "lit/directives/style-map.js";
|
|
7
|
-
import { T as m } from "./tailwind.mixin-
|
|
7
|
+
import { T as m } from "./tailwind.mixin-DklgfhB4.js";
|
|
8
8
|
import { css as y, html as h } from "lit";
|
|
9
9
|
import { customElement as f, property as p } from "lit/decorators.js";
|
|
10
10
|
var v = Object.getOwnPropertyDescriptor;
|
|
@@ -17,7 +17,7 @@ let d = class extends m(y`
|
|
|
17
17
|
`) {
|
|
18
18
|
render() {
|
|
19
19
|
return h`
|
|
20
|
-
<div class="absolute inset-0 flex justify-center items-center animate-pulse">
|
|
20
|
+
<div class="absolute inset-0 flex justify-center items-center animate-pulse z-[9999999]">
|
|
21
21
|
<!-- glass window -->
|
|
22
22
|
<div
|
|
23
23
|
${u({ bgColor: l.sys.color.secondary.container, color: l.sys.color.tertiary.onContainer })}
|
|
@@ -74,4 +74,4 @@ let a = class extends m(y`
|
|
|
74
74
|
}
|
|
75
75
|
};
|
|
76
76
|
c([p({ type: String })], a.prototype, "color", 2), c([p({ type: String })], a.prototype, "size", 2), a = c([f("schmancy-spinner")], a);
|
|
77
|
-
//# sourceMappingURL=spinner-
|
|
77
|
+
//# sourceMappingURL=spinner-BDx3SZsl.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"spinner-BDx3SZsl.js","sources":["../src/busy/busy.ts","../src/busy/spinner.ts"],"sourcesContent":["import { SchmancyTheme } from '@schmancy/theme'\nimport { color } from '@schmancy/directives'\nimport { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement } from 'lit/decorators.js'\n\n@customElement('schmancy-busy')\nexport default class SchmancyBusy extends TailwindElement(css`\n\t:host {\n\t\tdisplay: inline;\n\t\tposition: absolute;\n\t\tinset: 0;\n\t}\n`) {\n\tprotected render(): unknown {\n\t\treturn html`\n\t\t\t<div class=\"absolute inset-0 flex justify-center items-center animate-pulse z-[9999999]\">\n\t\t\t\t<!-- glass window -->\n\t\t\t\t<div\n\t\t\t\t\t${color({\n\t\t\t\t\t\tbgColor: SchmancyTheme.sys.color.secondary.container,\n\t\t\t\t\t\tcolor: SchmancyTheme.sys.color.tertiary.onContainer,\n\t\t\t\t\t})}\n\t\t\t\t\tclass=\"absolute transform-gpu inset-0 rounded-[inherit] opacity-50 flex align-middle justify-center items-center \"\n\t\t\t\t>\n\t\t\t\t\t<slot> </slot>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-busy': SchmancyBusy\n\t}\n}\n","import { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\n@customElement('schmancy-spinner')\nexport default class SchmnacySpinner extends TailwindElement(css`\n\t.spinner {\n\t\tanimation: spin 1s linear infinite;\n\t\tanimation-direction: reverse;\n\t}\n\n\t@keyframes spin {\n\t\tfrom {\n\t\t\ttransform: rotate(0deg);\n\t\t}\n\t\tto {\n\t\t\ttransform: rotate(360deg);\n\t\t}\n\t}\n`) {\n\t@property({ type: String }) color: string = 'gray'\n\t@property({ type: String }) size: string = '24px'\n\n\tprotected render(): unknown {\n\t\tconst style = {\n\t\t\tfontSize: this.size,\n\t\t\tmaxWidth: this.size,\n\t\t\toverflow: 'hidden',\n\t\t}\n\t\treturn html`\n\t\t\t<div class=\"spinner\" style=${this.styleMap(style)}>\n\t\t\t\t<svg fill=\"none\" viewBox=\"0 0 16 16\" class=\"anim-rotate\" aria-hidden=\"true\" role=\"img\">\n\t\t\t\t\t<path\n\t\t\t\t\t\topacity=\".5\"\n\t\t\t\t\t\td=\"M8 15A7 7 0 108 1a7 7 0 000 14v0z\"\n\t\t\t\t\t\tstroke=\"var(--schmancy-sys-color-secondary-default)\"\n\t\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\t></path>\n\t\t\t\t\t<path d=\"M15 8a7 7 0 01-7 7\" stroke=\"var(--schmancy-sys-color-secondary-default)\" stroke-width=\"2\"></path>\n\t\t\t\t\t<path d=\"M8 12a4 4 0 100-8 4 4 0 000 8z\" fill=\"var(--schmancy-sys-color-secondary-default)\"></path>\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-spinner': SchmnacySpinner\n\t}\n}\n"],"names":["SchmancyBusy","TailwindElement","css","render","html","color","bgColor","SchmancyTheme","sys","secondary","container","tertiary","onContainer","customElement","SchmnacySpinner","constructor","super","arguments","this","size","style","fontSize","maxWidth","overflow","styleMap","__decorateClass","property","type","String","prototype"],"mappings":";;;;;;;;;;AAOA,IAAqBA,IAArB,cAA0CC,EAAgBC;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;EAO/C,SAAAC;AACF,WAAAC;AAAAA;AAAAA;AAAAA;AAAAA,OAIFC,EAAM,EACPC,SAASC,EAAcC,IAAIH,MAAMI,UAAUC,WAC3CL,OAAOE,EAAcC,IAAIH,MAAMM,SAASC,YAAAA,CAAAA,CAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,EACvC;AAfcZ;AAAAA;;;GAArB,CADCa,EAAc,mBACMb;;;;;ACFrB,IAAqBc,IAArB,cAA6Cb,EAAgBC;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;EAA7D,cAAAa;AAAAC,UAAAC,GAAAA,SAAAA,GAe6CC,KAAAb,QAAA,QACDa,KAAAC,OAAA;AAAA,EAAA;AAAA,EAEjC,SAAAhB;AACT,UAAMiB,IAAQ,EACbC,UAAUH,KAAKC,MACfG,UAAUJ,KAAKC,MACfI,UAAU,SAEJ;AAAA,WAAAnB;AAAAA,gCACuBc,KAAKM,SAASJ,CAAAA,CAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,EAAM;AAVvBK;AAAAA,EAAA,CAA3BC,EAAS,EAAEC,MAAMC,YAfEd,EAeQe,WAAA,SAAA,CAAA,GACAJ,EAAA,CAA3BC,EAAS,EAAEC,MAAMC,OAhBEd,CAAAA,CAAAA,GAAAA,EAgBQe,WAAA,QAAA,IAhBRf,IAArBW,EAAA,CADCZ,EAAc,kBACMC,CAAAA,GAAAA,CAAAA;"}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
"use strict";require("./theme.component-
|
|
1
|
+
"use strict";require("./theme.component-Ly2C_fQ8.cjs");const y=require("./theme.interface-Xg5Zi46a.cjs"),u=require("./ripple-C2BHbhcS.cjs");require("rxjs"),require("lit/directives/class-map.js"),require("lit/directives/style-map.js");const m=require("./tailwind.mixin-CBhPue3q.cjs"),l=require("lit"),c=require("lit/decorators.js");var h=Object.getOwnPropertyDescriptor;let p=class extends m.TailwindElement(l.css`
|
|
2
2
|
:host {
|
|
3
3
|
display: inline;
|
|
4
4
|
position: absolute;
|
|
5
5
|
inset: 0;
|
|
6
6
|
}
|
|
7
7
|
`){render(){return l.html`
|
|
8
|
-
<div class="absolute inset-0 flex justify-center items-center animate-pulse">
|
|
8
|
+
<div class="absolute inset-0 flex justify-center items-center animate-pulse z-[9999999]">
|
|
9
9
|
<!-- glass window -->
|
|
10
10
|
<div
|
|
11
11
|
${u.color({bgColor:y.SchmancyTheme.sys.color.secondary.container,color:y.SchmancyTheme.sys.color.tertiary.onContainer})}
|
|
@@ -42,4 +42,4 @@
|
|
|
42
42
|
</svg>
|
|
43
43
|
</div>
|
|
44
44
|
`}};d([c.property({type:String})],a.prototype,"color",2),d([c.property({type:String})],a.prototype,"size",2),a=d([c.customElement("schmancy-spinner")],a);
|
|
45
|
-
//# sourceMappingURL=spinner-
|
|
45
|
+
//# sourceMappingURL=spinner-C3VJtLgk.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"spinner-C3VJtLgk.cjs","sources":["../src/busy/busy.ts","../src/busy/spinner.ts"],"sourcesContent":["import { SchmancyTheme } from '@schmancy/theme'\nimport { color } from '@schmancy/directives'\nimport { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement } from 'lit/decorators.js'\n\n@customElement('schmancy-busy')\nexport default class SchmancyBusy extends TailwindElement(css`\n\t:host {\n\t\tdisplay: inline;\n\t\tposition: absolute;\n\t\tinset: 0;\n\t}\n`) {\n\tprotected render(): unknown {\n\t\treturn html`\n\t\t\t<div class=\"absolute inset-0 flex justify-center items-center animate-pulse z-[9999999]\">\n\t\t\t\t<!-- glass window -->\n\t\t\t\t<div\n\t\t\t\t\t${color({\n\t\t\t\t\t\tbgColor: SchmancyTheme.sys.color.secondary.container,\n\t\t\t\t\t\tcolor: SchmancyTheme.sys.color.tertiary.onContainer,\n\t\t\t\t\t})}\n\t\t\t\t\tclass=\"absolute transform-gpu inset-0 rounded-[inherit] opacity-50 flex align-middle justify-center items-center \"\n\t\t\t\t>\n\t\t\t\t\t<slot> </slot>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-busy': SchmancyBusy\n\t}\n}\n","import { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\n@customElement('schmancy-spinner')\nexport default class SchmnacySpinner extends TailwindElement(css`\n\t.spinner {\n\t\tanimation: spin 1s linear infinite;\n\t\tanimation-direction: reverse;\n\t}\n\n\t@keyframes spin {\n\t\tfrom {\n\t\t\ttransform: rotate(0deg);\n\t\t}\n\t\tto {\n\t\t\ttransform: rotate(360deg);\n\t\t}\n\t}\n`) {\n\t@property({ type: String }) color: string = 'gray'\n\t@property({ type: String }) size: string = '24px'\n\n\tprotected render(): unknown {\n\t\tconst style = {\n\t\t\tfontSize: this.size,\n\t\t\tmaxWidth: this.size,\n\t\t\toverflow: 'hidden',\n\t\t}\n\t\treturn html`\n\t\t\t<div class=\"spinner\" style=${this.styleMap(style)}>\n\t\t\t\t<svg fill=\"none\" viewBox=\"0 0 16 16\" class=\"anim-rotate\" aria-hidden=\"true\" role=\"img\">\n\t\t\t\t\t<path\n\t\t\t\t\t\topacity=\".5\"\n\t\t\t\t\t\td=\"M8 15A7 7 0 108 1a7 7 0 000 14v0z\"\n\t\t\t\t\t\tstroke=\"var(--schmancy-sys-color-secondary-default)\"\n\t\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\t></path>\n\t\t\t\t\t<path d=\"M15 8a7 7 0 01-7 7\" stroke=\"var(--schmancy-sys-color-secondary-default)\" stroke-width=\"2\"></path>\n\t\t\t\t\t<path d=\"M8 12a4 4 0 100-8 4 4 0 000 8z\" fill=\"var(--schmancy-sys-color-secondary-default)\"></path>\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-spinner': SchmnacySpinner\n\t}\n}\n"],"names":["SchmancyBusy","TailwindElement","css","render","html","color","bgColor","SchmancyTheme","sys","secondary","container","tertiary","onContainer","customElement","SchmnacySpinner","constructor","super","arguments","this","size","style","fontSize","maxWidth","overflow","styleMap","__decorateClass","property","type","String","prototype"],"mappings":"iXAOA,IAAqBA,EAArB,cAA0CC,EAAAA,gBAAgBC,EAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,GAO/C,QAAAC,CACF,OAAAC,EAAAA;AAAAA;AAAAA;AAAAA;AAAAA,OAIFC,QAAM,CACPC,QAASC,EAAAA,cAAcC,IAAIH,MAAMI,UAAUC,UAC3CL,MAAOE,EAAAA,cAAcC,IAAIH,MAAMM,SAASC,WAAAA,CAAAA,CAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,GACvC,CAfcZ,EAAAA,wGAArB,CADCa,EAAAA,cAAc,eAAA,CAAA,EACMb,mMCFrB,IAAqBc,EAArB,cAA6Cb,EAAAA,gBAAgBC,EAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,GAA7D,aAAAa,CAAAC,MAAAC,GAAAA,SAAAA,EAe6CC,KAAAb,MAAA,OACDa,KAAAC,KAAA,MAAA,CAEjC,QAAAhB,CACT,MAAMiB,EAAQ,CACbC,SAAUH,KAAKC,KACfG,SAAUJ,KAAKC,KACfI,SAAU,QAAA,EAEJ,OAAAnB,EAAAA;AAAAA,gCACuBc,KAAKM,SAASJ,CAAAA,CAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,GAAM,CAVvBK,EAAAA,EAAA,CAA3BC,WAAS,CAAEC,KAAMC,MAAAA,CAAAA,CAAAA,EAfEd,EAeQe,UAAA,QAAA,CAAA,EACAJ,EAAA,CAA3BC,WAAS,CAAEC,KAAMC,MAhBEd,CAAAA,CAAAA,EAAAA,EAgBQe,UAAA,OAAA,CAhBRf,EAAAA,EAArBW,EAAA,CADCZ,EAAAA,cAAc,kBACMC,CAAAA,EAAAA,CAAAA"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { e as c, n as p } from "./provide-BLSgVvMJ.js";
|
|
2
|
-
import { T as d } from "./tailwind.mixin-
|
|
2
|
+
import { T as d } from "./tailwind.mixin-DklgfhB4.js";
|
|
3
3
|
import { css as u, html as f } from "lit";
|
|
4
4
|
import { property as h, customElement as y } from "lit/decorators.js";
|
|
5
5
|
import { classMap as g } from "lit/directives/class-map.js";
|
|
@@ -40,4 +40,4 @@ export {
|
|
|
40
40
|
w as S,
|
|
41
41
|
e as a
|
|
42
42
|
};
|
|
43
|
-
//# sourceMappingURL=surface-
|
|
43
|
+
//# sourceMappingURL=surface-YiaJJQ5m.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"surface-
|
|
1
|
+
{"version":3,"file":"surface-YiaJJQ5m.js","sources":["../src/surface/surface.ts"],"sourcesContent":["import { createContext, provide } from '@lit/context'\nimport { TailwindElement } from '@mixins/tailwind.mixin'\nimport { TSurfaceColor } from '@schmancy/types'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js' // Import classMap\n\nexport const SchmancySurfaceTypeContext = createContext<TSurfaceColor>('surface')\n\nexport type SchmancySurfaceFill = 'all' | 'width' | 'height' | 'auto'\n/**\n * `<schmancy-surface>` component\n *\n * This component renders a styled container that adapts its dimensions based on the `fill` property.\n * It supports various rounding options, elevation levels, and applies background and text color classes\n * based on the specified surface variant. Additionally, when the `scroller` property is true, the component\n * enables internal scrolling by applying overflow and scroll-behavior styles.\n *\n * @element schmancy-surface\n * @slot - Default slot for projecting child content.\n *\n * @example\n * <schmancy-surface fill=\"all\" rounded=\"all\" elevation=\"3\" type=\"surfaceBright\" scroller>\n * <p>Your scrollable content here</p>\n * </schmancy-surface>\n */\n@customElement('schmancy-surface')\nexport class SchmancySurface extends TailwindElement(css`\n\t:host([fill='all']) {\n\t\theight: 100%;\n\t\twidth: 100%;\n\t}\n\t:host([fill='width']) {\n\t\twidth: 100%;\n\t}\n\t:host([fill='height']) {\n\t\theight: 100%;\n\t}\n\t:host {\n\t\tdisplay: block;\n\t}\n`) {\n\t/**\n\t * Fill the width and/or height of the parent container.\n\t * Options: 'all', 'width', 'height', 'auto'.\n\t * @default 'auto'\n\t */\n\t@property({ type: String, reflect: true })\n\tfill: 'all' | 'width' | 'height' | 'auto' = 'auto'\n\n\t/**\n\t * Specifies the rounding style of the component's corners.\n\t * Options: 'none', 'top', 'left', 'right', 'bottom', 'all'.\n\t * @default 'none'\n\t */\n\t@property()\n\trounded: 'none' | 'top' | 'left' | 'right' | 'bottom' | 'all' = 'none'\n\n\t/**\n\t * Specifies the surface type for styling.\n\t * Provided to descendant components via context.\n\t * Options: 'surface', 'surfaceDim', 'surfaceBright', 'containerLowest',\n\t * 'containerLow', 'container', 'containerHigh', 'containerHighest'.\n\t * @default 'surface'\n\t */\n\t@provide({ context: SchmancySurfaceTypeContext })\n\t@property()\n\ttype: TSurfaceColor = 'surface'\n\n\t/**\n\t * Defines the elevation level (shadow depth) of the surface.\n\t * Valid values: 0, 1, 2, 3, 4, 5.\n\t * @default 0\n\t */\n\t@property({ type: Number, reflect: true })\n\televation: 0 | 1 | 2 | 3 | 4 | 5 = 0\n\n\tprotected render(): unknown {\n\t\tconst classes = {\n\t\t\trelative: true,\n\t\t\t'inset-0': true,\n\t\t\tblock: true,\n\t\t\t'box-border': true,\n\t\t\t// Rounding classes\n\t\t\t'rounded-none': this.rounded === 'none',\n\t\t\t'rounded-t-[8px]': this.rounded === 'top',\n\t\t\t'rounded-l-[8px]': this.rounded === 'left',\n\t\t\t'rounded-r-[8px]': this.rounded === 'right',\n\t\t\t'rounded-b-[8px]': this.rounded === 'bottom',\n\t\t\t'rounded-[8px]': this.rounded === 'all',\n\t\t\t// Fill classes\n\t\t\t'w-full': this.fill === 'width' || this.fill === 'all',\n\t\t\t'h-full': this.fill === 'height' || this.fill === 'all',\n\t\t\t// Elevation shadow classes\n\t\t\t'shadow-xs': this.elevation === 1,\n\t\t\t'shadow-sm': this.elevation === 2,\n\t\t\t'shadow-md': this.elevation === 3,\n\t\t\t'shadow-lg': this.elevation === 4,\n\t\t\t'shadow-xl': this.elevation === 5,\n\t\t\t// Text color based on the surface variant for optimal readability\n\t\t\t'text-surface-on':\n\t\t\t\tthis.type === 'surface' ||\n\t\t\t\tthis.type === 'surfaceDim' ||\n\t\t\t\tthis.type === 'surfaceBright' ||\n\t\t\t\tthis.type === 'containerLowest' ||\n\t\t\t\tthis.type === 'containerLow' ||\n\t\t\t\tthis.type === 'container' ||\n\t\t\t\tthis.type === 'containerHigh' ||\n\t\t\t\tthis.type === 'containerHighest',\n\t\t\t// Background color classes based on the surface variant\n\t\t\t'bg-surface-default': this.type === 'surface',\n\t\t\t'bg-surface-dim': this.type === 'surfaceDim',\n\t\t\t'bg-surface-bright': this.type === 'surfaceBright',\n\t\t\t'bg-surface-lowest': this.type === 'containerLowest',\n\t\t\t'bg-surface-low': this.type === 'containerLow',\n\t\t\t'bg-surface-container': this.type === 'container',\n\t\t\t'bg-surface-high': this.type === 'containerHigh',\n\t\t\t'bg-surface-highest': this.type === 'containerHighest',\n\t\t}\n\n\t\treturn html`\n\t\t\t<section class=${classMap(classes)}>\n\t\t\t\t<slot></slot>\n\t\t\t</section>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-surface': SchmancySurface\n\t}\n}\n"],"names":["SchmancySurfaceTypeContext","createContext","SchmancySurface","TailwindElement","css","super","arguments","this","fill","rounded","type","elevation","render","classes","relative","block","html","classMap","__decorateClass","property","String","reflect","prototype","provide","context","Number","customElement"],"mappings":";;;;;;;;;AAOa,MAAAA,IAA6BC,EAA6B,SAoB1D;AAAA,IAAAC,IAAN,cAA8BC,EAAgBC;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,CAA9C,EAAA;AAAA,EAAA,cAAAC;AAAAA,UAAAA,GAAAC,SAqBsCC,GAAAA,KAAAC,OAAA,QAQoBD,KAAAE,UAAA,QAW1CF,KAAAG,OAAA,WAQaH,KAAAI,YAAA;AAAA,EAAA;AAAA,EAEzB,SAAAC;AACT,UAAMC,IAAU,EACfC,UAAAA,IACA,WAAW,IACXC,OAAO,IACP,kBAEA,gBAAgBR,KAAKE,YAAY,QACjC,mBAAmBF,KAAKE,YAAY,OACpC,mBAAmBF,KAAKE,YAAY,QACpC,mBAAmBF,KAAKE,YAAY,SACpC,mBAAmBF,KAAKE,YAAY,UACpC,iBAAiBF,KAAKE,YAAY,OAElC,UAAUF,KAAKC,SAAS,WAAWD,KAAKC,SAAS,OACjD,UAAUD,KAAKC,SAAS,YAAYD,KAAKC,SAAS,OAElD,aAAaD,KAAKI,cAAc,GAChC,aAAaJ,KAAKI,cAAc,GAChC,aAAaJ,KAAKI,cAAc,GAChC,aAAaJ,KAAKI,cAAc,GAChC,aAAaJ,KAAKI,cAAc,GAEhC,mBACCJ,KAAKG,SAAS,aACdH,KAAKG,SAAS,gBACdH,KAAKG,SAAS,mBACdH,KAAKG,SAAS,qBACdH,KAAKG,SAAS,kBACdH,KAAKG,SAAS,eACdH,KAAKG,SAAS,mBACdH,KAAKG,SAAS,oBAEf,sBAAsBH,KAAKG,SAAS,WACpC,kBAAkBH,KAAKG,SAAS,cAChC,qBAAqBH,KAAKG,SAAS,iBACnC,qBAAqBH,KAAKG,SAAS,mBACnC,kBAAkBH,KAAKG,SAAS,gBAChC,wBAAwBH,KAAKG,SAAS,aACtC,mBAAmBH,KAAKG,SAAS,iBACjC,sBAAsBH,KAAKG,SAAS,mBAATA;AAGrB,WAAAM;AAAAA,oBACWC,EAASJ,CAAAA,CAAAA;AAAAA;AAAAA;AAAAA;AAAAA,EAAQ;AAzEpCK;AAAAA,EAAA,CADCC,EAAS,EAAET,MAAMU,QAAQC,SAAAA,GApBdnB,CAAAA,CAAAA,GAAAA,EAqBZoB,WAAA,QAAA,IAQAJ,EAAA,CADCC,MA5BWjB,EA6BZoB,WAAA,WAAA,CAWAJ,GAAAA,EAAA,CAFCK,EAAQ,EAAEC,SAASxB,MACnBmB,EAvCWjB,CAAAA,GAAAA,EAwCZoB,WAAA,QAAA,CAAA,GAQAJ,EAAA,CADCC,EAAS,EAAET,MAAMe,QAAQJ,SAAAA,QA/CdnB,EAgDZoB,WAAA,aAAA,CAhDYpB,GAAAA,IAANgB,EAAA,CADNQ,EAAc,kBACFxB,CAAAA,GAAAA,CAAAA;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";const u=require("./provide-DSU87U5x.cjs"),p=require("./tailwind.mixin-
|
|
1
|
+
"use strict";const u=require("./provide-DSU87U5x.cjs"),p=require("./tailwind.mixin-CBhPue3q.cjs"),c=require("lit"),t=require("lit/decorators.js"),d=require("lit/directives/class-map.js");var f=Object.defineProperty,y=Object.getOwnPropertyDescriptor,r=(i,s,h,o)=>{for(var n,e=o>1?void 0:o?y(s,h):s,a=i.length-1;a>=0;a--)(n=i[a])&&(e=(o?n(s,h,e):n(e))||e);return o&&e&&f(s,h,e),e};const l=u.n("surface");exports.SchmancySurface=class extends p.TailwindElement(c.css`
|
|
2
2
|
:host([fill='all']) {
|
|
3
3
|
height: 100%;
|
|
4
4
|
width: 100%;
|
|
@@ -17,4 +17,4 @@
|
|
|
17
17
|
<slot></slot>
|
|
18
18
|
</section>
|
|
19
19
|
`}},r([t.property({type:String,reflect:!0})],exports.SchmancySurface.prototype,"fill",2),r([t.property()],exports.SchmancySurface.prototype,"rounded",2),r([u.e({context:l}),t.property()],exports.SchmancySurface.prototype,"type",2),r([t.property({type:Number,reflect:!0})],exports.SchmancySurface.prototype,"elevation",2),exports.SchmancySurface=r([t.customElement("schmancy-surface")],exports.SchmancySurface),exports.SchmancySurfaceTypeContext=l;
|
|
20
|
-
//# sourceMappingURL=surface-
|
|
20
|
+
//# sourceMappingURL=surface-kjOrb8TO.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"surface-
|
|
1
|
+
{"version":3,"file":"surface-kjOrb8TO.cjs","sources":["../src/surface/surface.ts"],"sourcesContent":["import { createContext, provide } from '@lit/context'\nimport { TailwindElement } from '@mixins/tailwind.mixin'\nimport { TSurfaceColor } from '@schmancy/types'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js' // Import classMap\n\nexport const SchmancySurfaceTypeContext = createContext<TSurfaceColor>('surface')\n\nexport type SchmancySurfaceFill = 'all' | 'width' | 'height' | 'auto'\n/**\n * `<schmancy-surface>` component\n *\n * This component renders a styled container that adapts its dimensions based on the `fill` property.\n * It supports various rounding options, elevation levels, and applies background and text color classes\n * based on the specified surface variant. Additionally, when the `scroller` property is true, the component\n * enables internal scrolling by applying overflow and scroll-behavior styles.\n *\n * @element schmancy-surface\n * @slot - Default slot for projecting child content.\n *\n * @example\n * <schmancy-surface fill=\"all\" rounded=\"all\" elevation=\"3\" type=\"surfaceBright\" scroller>\n * <p>Your scrollable content here</p>\n * </schmancy-surface>\n */\n@customElement('schmancy-surface')\nexport class SchmancySurface extends TailwindElement(css`\n\t:host([fill='all']) {\n\t\theight: 100%;\n\t\twidth: 100%;\n\t}\n\t:host([fill='width']) {\n\t\twidth: 100%;\n\t}\n\t:host([fill='height']) {\n\t\theight: 100%;\n\t}\n\t:host {\n\t\tdisplay: block;\n\t}\n`) {\n\t/**\n\t * Fill the width and/or height of the parent container.\n\t * Options: 'all', 'width', 'height', 'auto'.\n\t * @default 'auto'\n\t */\n\t@property({ type: String, reflect: true })\n\tfill: 'all' | 'width' | 'height' | 'auto' = 'auto'\n\n\t/**\n\t * Specifies the rounding style of the component's corners.\n\t * Options: 'none', 'top', 'left', 'right', 'bottom', 'all'.\n\t * @default 'none'\n\t */\n\t@property()\n\trounded: 'none' | 'top' | 'left' | 'right' | 'bottom' | 'all' = 'none'\n\n\t/**\n\t * Specifies the surface type for styling.\n\t * Provided to descendant components via context.\n\t * Options: 'surface', 'surfaceDim', 'surfaceBright', 'containerLowest',\n\t * 'containerLow', 'container', 'containerHigh', 'containerHighest'.\n\t * @default 'surface'\n\t */\n\t@provide({ context: SchmancySurfaceTypeContext })\n\t@property()\n\ttype: TSurfaceColor = 'surface'\n\n\t/**\n\t * Defines the elevation level (shadow depth) of the surface.\n\t * Valid values: 0, 1, 2, 3, 4, 5.\n\t * @default 0\n\t */\n\t@property({ type: Number, reflect: true })\n\televation: 0 | 1 | 2 | 3 | 4 | 5 = 0\n\n\tprotected render(): unknown {\n\t\tconst classes = {\n\t\t\trelative: true,\n\t\t\t'inset-0': true,\n\t\t\tblock: true,\n\t\t\t'box-border': true,\n\t\t\t// Rounding classes\n\t\t\t'rounded-none': this.rounded === 'none',\n\t\t\t'rounded-t-[8px]': this.rounded === 'top',\n\t\t\t'rounded-l-[8px]': this.rounded === 'left',\n\t\t\t'rounded-r-[8px]': this.rounded === 'right',\n\t\t\t'rounded-b-[8px]': this.rounded === 'bottom',\n\t\t\t'rounded-[8px]': this.rounded === 'all',\n\t\t\t// Fill classes\n\t\t\t'w-full': this.fill === 'width' || this.fill === 'all',\n\t\t\t'h-full': this.fill === 'height' || this.fill === 'all',\n\t\t\t// Elevation shadow classes\n\t\t\t'shadow-xs': this.elevation === 1,\n\t\t\t'shadow-sm': this.elevation === 2,\n\t\t\t'shadow-md': this.elevation === 3,\n\t\t\t'shadow-lg': this.elevation === 4,\n\t\t\t'shadow-xl': this.elevation === 5,\n\t\t\t// Text color based on the surface variant for optimal readability\n\t\t\t'text-surface-on':\n\t\t\t\tthis.type === 'surface' ||\n\t\t\t\tthis.type === 'surfaceDim' ||\n\t\t\t\tthis.type === 'surfaceBright' ||\n\t\t\t\tthis.type === 'containerLowest' ||\n\t\t\t\tthis.type === 'containerLow' ||\n\t\t\t\tthis.type === 'container' ||\n\t\t\t\tthis.type === 'containerHigh' ||\n\t\t\t\tthis.type === 'containerHighest',\n\t\t\t// Background color classes based on the surface variant\n\t\t\t'bg-surface-default': this.type === 'surface',\n\t\t\t'bg-surface-dim': this.type === 'surfaceDim',\n\t\t\t'bg-surface-bright': this.type === 'surfaceBright',\n\t\t\t'bg-surface-lowest': this.type === 'containerLowest',\n\t\t\t'bg-surface-low': this.type === 'containerLow',\n\t\t\t'bg-surface-container': this.type === 'container',\n\t\t\t'bg-surface-high': this.type === 'containerHigh',\n\t\t\t'bg-surface-highest': this.type === 'containerHighest',\n\t\t}\n\n\t\treturn html`\n\t\t\t<section class=${classMap(classes)}>\n\t\t\t\t<slot></slot>\n\t\t\t</section>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-surface': SchmancySurface\n\t}\n}\n"],"names":["SchmancySurfaceTypeContext","createContext","SchmancySurface","TailwindElement","css","super","arguments","this","fill","rounded","type","elevation","render","classes","relative","block","html","classMap","__decorateClass","property","String","reflect","prototype","provide","context","Number","customElement"],"mappings":"2XAOa,MAAAA,EAA6BC,IAA6B,WAoB1DC,QAAAA,gBAAN,cAA8BC,EAAAA,gBAAgBC,EAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,CAA9C,CAAA,CAAA,aAAAC,CAAAA,MAAAA,GAAAC,SAqBsCC,EAAAA,KAAAC,KAAA,OAQoBD,KAAAE,QAAA,OAW1CF,KAAAG,KAAA,UAQaH,KAAAI,UAAA,CAAA,CAEzB,QAAAC,CACT,MAAMC,EAAU,CACfC,SAAAA,GACA,UAAW,GACXC,MAAO,GACP,gBAEA,eAAgBR,KAAKE,UAAY,OACjC,kBAAmBF,KAAKE,UAAY,MACpC,kBAAmBF,KAAKE,UAAY,OACpC,kBAAmBF,KAAKE,UAAY,QACpC,kBAAmBF,KAAKE,UAAY,SACpC,gBAAiBF,KAAKE,UAAY,MAElC,SAAUF,KAAKC,OAAS,SAAWD,KAAKC,OAAS,MACjD,SAAUD,KAAKC,OAAS,UAAYD,KAAKC,OAAS,MAElD,YAAaD,KAAKI,YAAc,EAChC,YAAaJ,KAAKI,YAAc,EAChC,YAAaJ,KAAKI,YAAc,EAChC,YAAaJ,KAAKI,YAAc,EAChC,YAAaJ,KAAKI,YAAc,EAEhC,kBACCJ,KAAKG,OAAS,WACdH,KAAKG,OAAS,cACdH,KAAKG,OAAS,iBACdH,KAAKG,OAAS,mBACdH,KAAKG,OAAS,gBACdH,KAAKG,OAAS,aACdH,KAAKG,OAAS,iBACdH,KAAKG,OAAS,mBAEf,qBAAsBH,KAAKG,OAAS,UACpC,iBAAkBH,KAAKG,OAAS,aAChC,oBAAqBH,KAAKG,OAAS,gBACnC,oBAAqBH,KAAKG,OAAS,kBACnC,iBAAkBH,KAAKG,OAAS,eAChC,uBAAwBH,KAAKG,OAAS,YACtC,kBAAmBH,KAAKG,OAAS,gBACjC,qBAAsBH,KAAKG,OAAS,kBAG9B,EAAA,OAAAM,EAAAA;AAAAA,oBACWC,EAAAA,SAASJ,CAAAA,CAAAA;AAAAA;AAAAA;AAAAA,GAAQ,CAAA,EAzEpCK,EAAA,CADCC,EAAAA,SAAS,CAAET,KAAMU,OAAQC,QAAAA,EApBdnB,CAAAA,CAAAA,EAAAA,wBAqBZoB,UAAA,OAAA,CAAA,EAQAJ,EAAA,CADCC,EAASA,SAAAA,CAAAA,EA5BEjB,wBA6BZoB,UAAA,UAAA,CAWAJ,EAAAA,EAAA,CAFCK,IAAQ,CAAEC,QAASxB,CAAAA,CAAAA,EACnBmB,EAASA,SAAAA,CAAAA,EAvCEjB,wBAwCZoB,UAAA,OAAA,CAQAJ,EAAAA,EAAA,CADCC,EAAAA,SAAS,CAAET,KAAMe,OAAQJ,QAAS,EAAA,CAAA,CAAA,EA/CvBnB,wBAgDZoB,UAAA,YAAA,CAhDYpB,EAAAA,QAANA,gBAAAgB,EAAA,CADNQ,EAAAA,cAAc,kBAAA,CAAA,EACFxB"}
|
package/dist/surface.cjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./surface-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./surface-kjOrb8TO.cjs");Object.defineProperty(exports,"SchmancySurface",{enumerable:!0,get:()=>e.SchmancySurface}),exports.SchmancySurfaceTypeContext=e.SchmancySurfaceTypeContext;
|
|
2
2
|
//# sourceMappingURL=surface.cjs.map
|
package/dist/surface.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
"use strict";require("rxjs"),require("lit/directives/class-map.js"),require("lit/directives/style-map.js");const u=require("./tailwind.mixin-
|
|
1
|
+
"use strict";require("rxjs"),require("lit/directives/class-map.js"),require("lit/directives/style-map.js");const u=require("./tailwind.mixin-CBhPue3q.cjs"),c=require("lit"),m=require("lit/decorators.js");var a=Object.getOwnPropertyDescriptor;let o=class extends u.TailwindElement(){render(){return c.html`
|
|
2
2
|
<slot name="header"></slot>
|
|
3
3
|
<slot></slot>
|
|
4
4
|
<slot name="footer"></slot>
|
|
5
5
|
`}};o=((t,s,i,l)=>{for(var n,e=l>1?void 0:l?a(s,i):s,r=t.length-1;r>=0;r--)(n=t[r])&&(e=n(e)||e);return e})([m.customElement("schmancy-table")],o);
|
|
6
|
-
//# sourceMappingURL=table-
|
|
6
|
+
//# sourceMappingURL=table-BZV2dBD5.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"table-
|
|
1
|
+
{"version":3,"file":"table-BZV2dBD5.cjs","sources":["../src/table/table.ts"],"sourcesContent":["import { TailwindElement } from '@mixins/index'\nimport { html } from 'lit'\nimport { customElement } from 'lit/decorators.js'\n\n@customElement('schmancy-table')\nexport default class SchmancyTable extends TailwindElement() {\n\tprotected render(): unknown {\n\t\treturn html`\n\t\t\t<slot name=\"header\"></slot>\n\t\t\t<slot></slot>\n\t\t\t<slot name=\"footer\"></slot>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-table': SchmancyTable\n\t}\n}\n"],"names":["SchmancyTable","TailwindElement","html","customElement"],"mappings":"kPAKA,IAAqBA,EAArB,cAA2CC,EAAAA,gBAChC,CAAA,CAAA,QACF,CAAA,OAAAC,EAAAA;AAAAA;AAAAA;AAAAA;AAAAA,GAAA,CAAA,EAFYF,wGAArB,CADCG,EAAAA,cAAc,gBACMH,CAAAA,EAAAA,CAAAA"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import "rxjs";
|
|
2
2
|
import "lit/directives/class-map.js";
|
|
3
3
|
import "lit/directives/style-map.js";
|
|
4
|
-
import { T as l } from "./tailwind.mixin-
|
|
4
|
+
import { T as l } from "./tailwind.mixin-DklgfhB4.js";
|
|
5
5
|
import { html as p } from "lit";
|
|
6
6
|
import { customElement as i } from "lit/decorators.js";
|
|
7
7
|
var c = Object.getOwnPropertyDescriptor;
|
|
@@ -18,4 +18,4 @@ a = ((o, e, n, s) => {
|
|
|
18
18
|
for (var m, t = s > 1 ? void 0 : s ? c(e, n) : e, r = o.length - 1; r >= 0; r--) (m = o[r]) && (t = m(t) || t);
|
|
19
19
|
return t;
|
|
20
20
|
})([i("schmancy-table")], a);
|
|
21
|
-
//# sourceMappingURL=table-
|
|
21
|
+
//# sourceMappingURL=table-BguYeeBH.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"table-
|
|
1
|
+
{"version":3,"file":"table-BguYeeBH.js","sources":["../src/table/table.ts"],"sourcesContent":["import { TailwindElement } from '@mixins/index'\nimport { html } from 'lit'\nimport { customElement } from 'lit/decorators.js'\n\n@customElement('schmancy-table')\nexport default class SchmancyTable extends TailwindElement() {\n\tprotected render(): unknown {\n\t\treturn html`\n\t\t\t<slot name=\"header\"></slot>\n\t\t\t<slot></slot>\n\t\t\t<slot name=\"footer\"></slot>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-table': SchmancyTable\n\t}\n}\n"],"names":["SchmancyTable","TailwindElement","render","html","customElement"],"mappings":";;;;;;;AAKA,IAAqBA,IAArB,cAA2CC;EAChC,SAAAC;AACF,WAAAC;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,EAAA;AAAA;AAFYH;;;GAArB,CADCI,EAAc,gBACMJ,CAAAA,GAAAA,CAAAA;"}
|
package/dist/table.cjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";require("./table-
|
|
1
|
+
"use strict";require("./table-BZV2dBD5.cjs");
|
|
2
2
|
//# sourceMappingURL=table.cjs.map
|
package/dist/table.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import "./table-
|
|
1
|
+
import "./table-BguYeeBH.js";
|
|
2
2
|
//# sourceMappingURL=table.js.map
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";const v=require("./consume-Bb7_UzYd.cjs"),l=require("rxjs");require("lit/directives/class-map.js"),require("lit/directives/style-map.js");const u=require("./tailwind.mixin-
|
|
1
|
+
"use strict";const v=require("./consume-Bb7_UzYd.cjs"),l=require("rxjs");require("lit/directives/class-map.js"),require("lit/directives/style-map.js");const u=require("./tailwind.mixin-CBhPue3q.cjs"),b=require("lit"),i=require("lit/decorators.js"),y=require("./provide-DSU87U5x.cjs"),g=require("lit/directives/repeat.js"),m=y.n("tabs");var f=Object.defineProperty,E=Object.getOwnPropertyDescriptor,d=(t,a,e,s)=>{for(var c,r=s>1?void 0:s?E(a,e):a,h=t.length-1;h>=0;h--)(c=t[h])&&(r=(s?c(a,e,r):c(r))||r);return s&&r&&f(a,e,r),r};let p=class extends u.TailwindElement(b.css`
|
|
2
2
|
:host {
|
|
3
3
|
display: block;
|
|
4
4
|
}
|
|
@@ -33,4 +33,4 @@
|
|
|
33
33
|
<slot @slotchange=${()=>this.hydrateTabs()}></slot>
|
|
34
34
|
</section>
|
|
35
35
|
`}};n([y.e({context:m}),i.property({type:String})],o.prototype,"mode",2),n([i.property({type:Boolean})],o.prototype,"rounded",2),n([i.property({type:String,reflect:!0})],o.prototype,"activeTab",2),n([i.queryAssignedElements({flatten:!0})],o.prototype,"tabsElements",2),n([i.query("#tabsNavigation")],o.prototype,"navElement",2),n([i.query("#tabsContent")],o.prototype,"tabsContent",2),n([i.state()],o.prototype,"tabs",2),o=n([i.customElement("schmancy-tab-group")],o);
|
|
36
|
-
//# sourceMappingURL=tabs-group-
|
|
36
|
+
//# sourceMappingURL=tabs-group-BZFBZ1_G.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tabs-group-BRVzKIRX.cjs","sources":["../src/tabs/context.ts","../src/tabs/tab.ts","../src/tabs/tabs-group.ts"],"sourcesContent":["import { createContext } from '@lit/context'\n\nexport type TSchmancyTabsMode = 'scroll' | 'tabs'\n\nexport const SchmancyTabsModeContext = createContext<TSchmancyTabsMode>('tabs')\n","import { consume } from '@lit/context'\nimport { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { SchmancyTabsModeContext } from './context'\n\n@customElement('schmancy-tab')\nexport default class SchmancyTab extends TailwindElement(css`\n\t:host {\n\t\tdisplay: block;\n\t}\n`) {\n\t@property({ type: String, reflect: true }) label\n\t@property({ type: String, reflect: true }) value\n\t@property({ type: Boolean, reflect: true }) active!: boolean\n\n\t@consume({ context: SchmancyTabsModeContext, subscribe: true })\n\t@state()\n\tmode\n\tprotected render(): unknown {\n\t\treturn html` <slot .hidden=${this.mode === 'tabs' ? !this.active : false}></slot> `\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-tab': SchmancyTab\n\t}\n}\n","import { provide } from '@lit/context'\nimport { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property, query, queryAssignedElements, state } from 'lit/decorators.js'\nimport { repeat } from 'lit/directives/repeat.js'\nimport { filter, fromEvent, interval, map, take, throttleTime } from 'rxjs'\nimport { SchmancyTabsModeContext, TSchmancyTabsMode } from './context'\nimport SchmancyTab from './tab'\n\n/**\n * @slot - The content of the tab group\n * @fires tab-changed - The event fired when the tab is changed\n */\n@customElement('schmancy-tab-group')\nexport default class SchmancyTabGroup extends TailwindElement(css`\n\t:host {\n\t\tdisplay: block;\n\t}\n`) {\n\t@provide({ context: SchmancyTabsModeContext })\n\t@property({ type: String })\n\tmode: TSchmancyTabsMode = 'tabs'\n\n\t@property({ type: Boolean }) rounded = true\n\n\t@property({ type: String, reflect: true }) activeTab: string\n\t@queryAssignedElements({\n\t\tflatten: true,\n\t})\n\tprivate tabsElements!: Array<SchmancyTab>\n\n\t@query('#tabsNavigation') navElement!: HTMLElement\n\t@query('#tabsContent') tabsContent!: HTMLElement\n\n\t@state()\n\tprivate tabs: Array<SchmancyTab> = []\n\n\tconnectedCallback(): void {\n\t\tsuper.connectedCallback()\n\t\tfromEvent(window, 'scroll')\n\t\t\t.pipe(\n\t\t\t\tthrottleTime(1000),\n\t\t\t\tfilter(() => this.mode === 'scroll'),\n\t\t\t\tmap(() => {\n\t\t\t\t\tlet closestDiv = null\n\t\t\t\t\tlet closestDistance = Infinity\n\t\t\t\t\tthis.tabsElements.forEach(div => {\n\t\t\t\t\t\tconst distance =\n\t\t\t\t\t\t\tdiv.getBoundingClientRect().top - this.navElement.clientHeight + document.body.offsetHeight / 3\n\n\t\t\t\t\t\tif (distance < closestDistance && distance > 0) {\n\t\t\t\t\t\t\tclosestDistance = distance\n\t\t\t\t\t\t\tclosestDiv = div\n\t\t\t\t\t\t}\n\t\t\t\t\t})\n\t\t\t\t\treturn closestDiv\n\t\t\t\t}),\n\t\t\t\tfilter((el: SchmancyTab | null) => el !== null),\n\t\t\t)\n\t\t\t.subscribe({\n\t\t\t\tnext: (el: SchmancyTab) => {\n\t\t\t\t\tthis.activeTab = el.value\n\t\t\t\t},\n\t\t\t})\n\t}\n\n\tfirstUpdated() {\n\t\tinterval(0)\n\t\t\t.pipe(\n\t\t\t\tfilter(() => !!this.navElement.clientHeight),\n\t\t\t\ttake(1),\n\t\t\t)\n\t\t\t.subscribe(() => {\n\t\t\t\tthis.tabsElements.forEach(tab => {\n\t\t\t\t\tif (this.mode === 'scroll') tab.style.paddingTop = this.navElement.clientHeight + 'px'\n\t\t\t\t})\n\t\t\t})\n\t}\n\n\thydrateTabs() {\n\t\tthis.tabs = this.tabsElements\n\t\tif (!this.activeTab && this.tabsElements[0]) {\n\t\t\tthis.activeTab = this.tabsElements[0].value\n\t\t\tthis.tabsElements[0].active = true\n\t\t} else {\n\t\t\tthis.tabsElements.forEach(tab => {\n\t\t\t\tif (tab.value === this.activeTab) tab.active = true\n\t\t\t\telse tab.active = false\n\t\t\t})\n\t\t}\n\t\tconst lastTab = this.tabs?.[-1]\n\t\tif (lastTab) {\n\t\t\tlastTab.style.paddingBottom = lastTab.offsetHeight + 'px'\n\t\t}\n\t}\n\n\ttabChanged(selectedTab: { label: string; value: string }) {\n\t\tlet activeTabElement: SchmancyTab | undefined\n\t\tthis.tabsElements.forEach(tab => {\n\t\t\tif (tab.value === selectedTab.value) {\n\t\t\t\ttab.active = true\n\t\t\t\tactiveTabElement = tab\n\t\t\t\t// scroll to the tab\n\t\t\t\tif (this.mode === 'scroll') {\n\t\t\t\t\t// Scroll the desired element into view\n\t\t\t\t\tactiveTabElement.scrollIntoView({\n\t\t\t\t\t\tbehavior: 'smooth',\n\t\t\t\t\t\tblock: 'start',\n\t\t\t\t\t\tinline: 'start',\n\t\t\t\t\t})\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\ttab.active = false\n\t\t\t}\n\t\t})\n\t\tthis.mode === 'tabs' && (this.activeTab = selectedTab.value)\n\t\tthis.dispatchEvent(new CustomEvent('tab-changed', { detail: this.activeTab }))\n\t}\n\n\tprotected render(): unknown {\n\t\tconst tabs = {\n\t\t\t'bg-surface-default color-surface-on': true,\n\t\t\t'flex z-50': true,\n\t\t\t'sticky top-0 shadow-md': this.mode === 'scroll',\n\t\t\t'rounded-full': this.rounded,\n\t\t}\n\n\t\tconst activeTab = {\n\t\t\t'text-primary-default': true,\n\t\t}\n\n\t\tconst inactiveTab = {\n\t\t\t'border-transparent': true,\n\t\t\t'hover:text-gray-700': true,\n\t\t\t'hover:border-gray-300': true,\n\t\t\t'text-gray-500': true,\n\t\t}\n\n\t\treturn html`\n\t\t\t<section id=\"tabsNavigation\" class=\"${this.classMap(tabs)}\" aria-label=\"Tabs\">\n\t\t\t\t${repeat(\n\t\t\t\t\tthis.tabs,\n\t\t\t\t\ttab => tab.value,\n\t\t\t\t\ttab => html`\n\t\t\t\t\t\t<schmancy-button\n\t\t\t\t\t\t\t@click=${() => {\n\t\t\t\t\t\t\t\tthis.tabChanged({\n\t\t\t\t\t\t\t\t\tlabel: tab.label,\n\t\t\t\t\t\t\t\t\tvalue: tab.value,\n\t\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\taria-current=\"page\"\n\t\t\t\t\t\t\tclass=\"h-auto relative\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclass=\"px-4 py-3 ${this.activeTab === tab.value\n\t\t\t\t\t\t\t\t\t? this.classMap(activeTab)\n\t\t\t\t\t\t\t\t\t: this.classMap(inactiveTab)}\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<schmancy-typography class=\"h-full align-middle flex \" type=\"title\" token=\"md\" weight=\"medium\">\n\t\t\t\t\t\t\t\t\t${tab.label}\n\t\t\t\t\t\t\t\t</schmancy-typography>\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t.hidden=${this.activeTab !== tab.value}\n\t\t\t\t\t\t\t\t\tclass=\"border-primary-default absolute bottom-0 inset-x-6 border-solid border-2 rounded-t-full\"\n\t\t\t\t\t\t\t\t></div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</schmancy-button>\n\t\t\t\t\t`,\n\t\t\t\t)}\n\t\t\t</section>\n\t\t\t<schmancy-divider class=\"px-6\"></schmancy-divider>\n\t\t\t<section id=\"tabsContent\">\n\t\t\t\t<slot @slotchange=${() => this.hydrateTabs()}></slot>\n\t\t\t</section>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-tab-group': SchmancyTabGroup\n\t}\n}\n"],"names":["SchmancyTabsModeContext","createContext","SchmancyTab","TailwindElement","css","html","this","mode","active","__decorateClass","property","type","String","reflect","prototype","Boolean","consume","context","subscribe","state","customElement","SchmancyTabGroup","constructor","super","arguments","rounded","tabs","connectedCallback","fromEvent","window","pipe","throttleTime","filter","map","closestDiv","closestDistance","Infinity","tabsElements","forEach","div","distance","getBoundingClientRect","top","navElement","clientHeight","document","body","offsetHeight","el","next","activeTab","value","firstUpdated","interval","take","tab","style","paddingTop","hydrateTabs","lastTab","paddingBottom","selectedTab","activeTabElement","scrollIntoView","behavior","block","inline","dispatchEvent","CustomEvent","detail","render","inactiveTab","classMap","repeat","tabChanged","label","provide","queryAssignedElements","flatten","query"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"tabs-group-BZFBZ1_G.cjs","sources":["../src/tabs/context.ts","../src/tabs/tab.ts","../src/tabs/tabs-group.ts"],"sourcesContent":["import { createContext } from '@lit/context'\n\nexport type TSchmancyTabsMode = 'scroll' | 'tabs'\n\nexport const SchmancyTabsModeContext = createContext<TSchmancyTabsMode>('tabs')\n","import { consume } from '@lit/context'\nimport { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { SchmancyTabsModeContext } from './context'\n\n@customElement('schmancy-tab')\nexport default class SchmancyTab extends TailwindElement(css`\n\t:host {\n\t\tdisplay: block;\n\t}\n`) {\n\t@property({ type: String, reflect: true }) label\n\t@property({ type: String, reflect: true }) value\n\t@property({ type: Boolean, reflect: true }) active!: boolean\n\n\t@consume({ context: SchmancyTabsModeContext, subscribe: true })\n\t@state()\n\tmode\n\tprotected render(): unknown {\n\t\treturn html` <slot .hidden=${this.mode === 'tabs' ? !this.active : false}></slot> `\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-tab': SchmancyTab\n\t}\n}\n","import { provide } from '@lit/context'\nimport { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property, query, queryAssignedElements, state } from 'lit/decorators.js'\nimport { repeat } from 'lit/directives/repeat.js'\nimport { filter, fromEvent, interval, map, take, throttleTime } from 'rxjs'\nimport { SchmancyTabsModeContext, TSchmancyTabsMode } from './context'\nimport SchmancyTab from './tab'\n\n/**\n * @slot - The content of the tab group\n * @fires tab-changed - The event fired when the tab is changed\n */\n@customElement('schmancy-tab-group')\nexport default class SchmancyTabGroup extends TailwindElement(css`\n\t:host {\n\t\tdisplay: block;\n\t}\n`) {\n\t@provide({ context: SchmancyTabsModeContext })\n\t@property({ type: String })\n\tmode: TSchmancyTabsMode = 'tabs'\n\n\t@property({ type: Boolean }) rounded = true\n\n\t@property({ type: String, reflect: true }) activeTab: string\n\t@queryAssignedElements({\n\t\tflatten: true,\n\t})\n\tprivate tabsElements!: Array<SchmancyTab>\n\n\t@query('#tabsNavigation') navElement!: HTMLElement\n\t@query('#tabsContent') tabsContent!: HTMLElement\n\n\t@state()\n\tprivate tabs: Array<SchmancyTab> = []\n\n\tconnectedCallback(): void {\n\t\tsuper.connectedCallback()\n\t\tfromEvent(window, 'scroll')\n\t\t\t.pipe(\n\t\t\t\tthrottleTime(1000),\n\t\t\t\tfilter(() => this.mode === 'scroll'),\n\t\t\t\tmap(() => {\n\t\t\t\t\tlet closestDiv = null\n\t\t\t\t\tlet closestDistance = Infinity\n\t\t\t\t\tthis.tabsElements.forEach(div => {\n\t\t\t\t\t\tconst distance =\n\t\t\t\t\t\t\tdiv.getBoundingClientRect().top - this.navElement.clientHeight + document.body.offsetHeight / 3\n\n\t\t\t\t\t\tif (distance < closestDistance && distance > 0) {\n\t\t\t\t\t\t\tclosestDistance = distance\n\t\t\t\t\t\t\tclosestDiv = div\n\t\t\t\t\t\t}\n\t\t\t\t\t})\n\t\t\t\t\treturn closestDiv\n\t\t\t\t}),\n\t\t\t\tfilter((el: SchmancyTab | null) => el !== null),\n\t\t\t)\n\t\t\t.subscribe({\n\t\t\t\tnext: (el: SchmancyTab) => {\n\t\t\t\t\tthis.activeTab = el.value\n\t\t\t\t},\n\t\t\t})\n\t}\n\n\tfirstUpdated() {\n\t\tinterval(0)\n\t\t\t.pipe(\n\t\t\t\tfilter(() => !!this.navElement.clientHeight),\n\t\t\t\ttake(1),\n\t\t\t)\n\t\t\t.subscribe(() => {\n\t\t\t\tthis.tabsElements.forEach(tab => {\n\t\t\t\t\tif (this.mode === 'scroll') tab.style.paddingTop = this.navElement.clientHeight + 'px'\n\t\t\t\t})\n\t\t\t})\n\t}\n\n\thydrateTabs() {\n\t\tthis.tabs = this.tabsElements\n\t\tif (!this.activeTab && this.tabsElements[0]) {\n\t\t\tthis.activeTab = this.tabsElements[0].value\n\t\t\tthis.tabsElements[0].active = true\n\t\t} else {\n\t\t\tthis.tabsElements.forEach(tab => {\n\t\t\t\tif (tab.value === this.activeTab) tab.active = true\n\t\t\t\telse tab.active = false\n\t\t\t})\n\t\t}\n\t\tconst lastTab = this.tabs?.[-1]\n\t\tif (lastTab) {\n\t\t\tlastTab.style.paddingBottom = lastTab.offsetHeight + 'px'\n\t\t}\n\t}\n\n\ttabChanged(selectedTab: { label: string; value: string }) {\n\t\tlet activeTabElement: SchmancyTab | undefined\n\t\tthis.tabsElements.forEach(tab => {\n\t\t\tif (tab.value === selectedTab.value) {\n\t\t\t\ttab.active = true\n\t\t\t\tactiveTabElement = tab\n\t\t\t\t// scroll to the tab\n\t\t\t\tif (this.mode === 'scroll') {\n\t\t\t\t\t// Scroll the desired element into view\n\t\t\t\t\tactiveTabElement.scrollIntoView({\n\t\t\t\t\t\tbehavior: 'smooth',\n\t\t\t\t\t\tblock: 'start',\n\t\t\t\t\t\tinline: 'start',\n\t\t\t\t\t})\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\ttab.active = false\n\t\t\t}\n\t\t})\n\t\tthis.mode === 'tabs' && (this.activeTab = selectedTab.value)\n\t\tthis.dispatchEvent(new CustomEvent('tab-changed', { detail: this.activeTab }))\n\t}\n\n\tprotected render(): unknown {\n\t\tconst tabs = {\n\t\t\t'bg-surface-default color-surface-on': true,\n\t\t\t'flex z-50': true,\n\t\t\t'sticky top-0 shadow-md': this.mode === 'scroll',\n\t\t\t'rounded-full': this.rounded,\n\t\t}\n\n\t\tconst activeTab = {\n\t\t\t'text-primary-default': true,\n\t\t}\n\n\t\tconst inactiveTab = {\n\t\t\t'border-transparent': true,\n\t\t\t'hover:text-gray-700': true,\n\t\t\t'hover:border-gray-300': true,\n\t\t\t'text-gray-500': true,\n\t\t}\n\n\t\treturn html`\n\t\t\t<section id=\"tabsNavigation\" class=\"${this.classMap(tabs)}\" aria-label=\"Tabs\">\n\t\t\t\t${repeat(\n\t\t\t\t\tthis.tabs,\n\t\t\t\t\ttab => tab.value,\n\t\t\t\t\ttab => html`\n\t\t\t\t\t\t<schmancy-button\n\t\t\t\t\t\t\t@click=${() => {\n\t\t\t\t\t\t\t\tthis.tabChanged({\n\t\t\t\t\t\t\t\t\tlabel: tab.label,\n\t\t\t\t\t\t\t\t\tvalue: tab.value,\n\t\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\taria-current=\"page\"\n\t\t\t\t\t\t\tclass=\"h-auto relative\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclass=\"px-4 py-3 ${this.activeTab === tab.value\n\t\t\t\t\t\t\t\t\t? this.classMap(activeTab)\n\t\t\t\t\t\t\t\t\t: this.classMap(inactiveTab)}\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<schmancy-typography class=\"h-full align-middle flex \" type=\"title\" token=\"md\" weight=\"medium\">\n\t\t\t\t\t\t\t\t\t${tab.label}\n\t\t\t\t\t\t\t\t</schmancy-typography>\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t.hidden=${this.activeTab !== tab.value}\n\t\t\t\t\t\t\t\t\tclass=\"border-primary-default absolute bottom-0 inset-x-6 border-solid border-2 rounded-t-full\"\n\t\t\t\t\t\t\t\t></div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</schmancy-button>\n\t\t\t\t\t`,\n\t\t\t\t)}\n\t\t\t</section>\n\t\t\t<schmancy-divider class=\"px-6\"></schmancy-divider>\n\t\t\t<section id=\"tabsContent\">\n\t\t\t\t<slot @slotchange=${() => this.hydrateTabs()}></slot>\n\t\t\t</section>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-tab-group': SchmancyTabGroup\n\t}\n}\n"],"names":["SchmancyTabsModeContext","createContext","SchmancyTab","TailwindElement","css","html","this","mode","active","__decorateClass","property","type","String","reflect","prototype","Boolean","consume","context","subscribe","state","customElement","SchmancyTabGroup","constructor","super","arguments","rounded","tabs","connectedCallback","fromEvent","window","pipe","throttleTime","filter","map","closestDiv","closestDistance","Infinity","tabsElements","forEach","div","distance","getBoundingClientRect","top","navElement","clientHeight","document","body","offsetHeight","el","next","activeTab","value","firstUpdated","interval","take","tab","style","paddingTop","hydrateTabs","lastTab","paddingBottom","selectedTab","activeTabElement","scrollIntoView","behavior","block","inline","dispatchEvent","CustomEvent","detail","render","inactiveTab","classMap","repeat","tabChanged","label","provide","queryAssignedElements","flatten","query"],"mappings":"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"}
|
|
@@ -2,7 +2,7 @@ import { c as E } from "./consume-fRVATvdE.js";
|
|
|
2
2
|
import { fromEvent as x, throttleTime as T, filter as d, map as k, interval as C, take as w } from "rxjs";
|
|
3
3
|
import "lit/directives/class-map.js";
|
|
4
4
|
import "lit/directives/style-map.js";
|
|
5
|
-
import { T as v } from "./tailwind.mixin-
|
|
5
|
+
import { T as v } from "./tailwind.mixin-DklgfhB4.js";
|
|
6
6
|
import { css as u, html as b } from "lit";
|
|
7
7
|
import { property as h, state as y, customElement as f, queryAssignedElements as $, query as m } from "lit/decorators.js";
|
|
8
8
|
import { n as O, e as j } from "./provide-BLSgVvMJ.js";
|
|
@@ -100,4 +100,4 @@ let r = class extends v(u`
|
|
|
100
100
|
}
|
|
101
101
|
};
|
|
102
102
|
i([j({ context: g }), h({ type: String })], r.prototype, "mode", 2), i([h({ type: Boolean })], r.prototype, "rounded", 2), i([h({ type: String, reflect: !0 })], r.prototype, "activeTab", 2), i([$({ flatten: !0 })], r.prototype, "tabsElements", 2), i([m("#tabsNavigation")], r.prototype, "navElement", 2), i([m("#tabsContent")], r.prototype, "tabsContent", 2), i([y()], r.prototype, "tabs", 2), r = i([f("schmancy-tab-group")], r);
|
|
103
|
-
//# sourceMappingURL=tabs-group-
|
|
103
|
+
//# sourceMappingURL=tabs-group-H3C6ZnQn.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tabs-group-BcXgpxUw.js","sources":["../src/tabs/context.ts","../src/tabs/tab.ts","../src/tabs/tabs-group.ts"],"sourcesContent":["import { createContext } from '@lit/context'\n\nexport type TSchmancyTabsMode = 'scroll' | 'tabs'\n\nexport const SchmancyTabsModeContext = createContext<TSchmancyTabsMode>('tabs')\n","import { consume } from '@lit/context'\nimport { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { SchmancyTabsModeContext } from './context'\n\n@customElement('schmancy-tab')\nexport default class SchmancyTab extends TailwindElement(css`\n\t:host {\n\t\tdisplay: block;\n\t}\n`) {\n\t@property({ type: String, reflect: true }) label\n\t@property({ type: String, reflect: true }) value\n\t@property({ type: Boolean, reflect: true }) active!: boolean\n\n\t@consume({ context: SchmancyTabsModeContext, subscribe: true })\n\t@state()\n\tmode\n\tprotected render(): unknown {\n\t\treturn html` <slot .hidden=${this.mode === 'tabs' ? !this.active : false}></slot> `\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-tab': SchmancyTab\n\t}\n}\n","import { provide } from '@lit/context'\nimport { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property, query, queryAssignedElements, state } from 'lit/decorators.js'\nimport { repeat } from 'lit/directives/repeat.js'\nimport { filter, fromEvent, interval, map, take, throttleTime } from 'rxjs'\nimport { SchmancyTabsModeContext, TSchmancyTabsMode } from './context'\nimport SchmancyTab from './tab'\n\n/**\n * @slot - The content of the tab group\n * @fires tab-changed - The event fired when the tab is changed\n */\n@customElement('schmancy-tab-group')\nexport default class SchmancyTabGroup extends TailwindElement(css`\n\t:host {\n\t\tdisplay: block;\n\t}\n`) {\n\t@provide({ context: SchmancyTabsModeContext })\n\t@property({ type: String })\n\tmode: TSchmancyTabsMode = 'tabs'\n\n\t@property({ type: Boolean }) rounded = true\n\n\t@property({ type: String, reflect: true }) activeTab: string\n\t@queryAssignedElements({\n\t\tflatten: true,\n\t})\n\tprivate tabsElements!: Array<SchmancyTab>\n\n\t@query('#tabsNavigation') navElement!: HTMLElement\n\t@query('#tabsContent') tabsContent!: HTMLElement\n\n\t@state()\n\tprivate tabs: Array<SchmancyTab> = []\n\n\tconnectedCallback(): void {\n\t\tsuper.connectedCallback()\n\t\tfromEvent(window, 'scroll')\n\t\t\t.pipe(\n\t\t\t\tthrottleTime(1000),\n\t\t\t\tfilter(() => this.mode === 'scroll'),\n\t\t\t\tmap(() => {\n\t\t\t\t\tlet closestDiv = null\n\t\t\t\t\tlet closestDistance = Infinity\n\t\t\t\t\tthis.tabsElements.forEach(div => {\n\t\t\t\t\t\tconst distance =\n\t\t\t\t\t\t\tdiv.getBoundingClientRect().top - this.navElement.clientHeight + document.body.offsetHeight / 3\n\n\t\t\t\t\t\tif (distance < closestDistance && distance > 0) {\n\t\t\t\t\t\t\tclosestDistance = distance\n\t\t\t\t\t\t\tclosestDiv = div\n\t\t\t\t\t\t}\n\t\t\t\t\t})\n\t\t\t\t\treturn closestDiv\n\t\t\t\t}),\n\t\t\t\tfilter((el: SchmancyTab | null) => el !== null),\n\t\t\t)\n\t\t\t.subscribe({\n\t\t\t\tnext: (el: SchmancyTab) => {\n\t\t\t\t\tthis.activeTab = el.value\n\t\t\t\t},\n\t\t\t})\n\t}\n\n\tfirstUpdated() {\n\t\tinterval(0)\n\t\t\t.pipe(\n\t\t\t\tfilter(() => !!this.navElement.clientHeight),\n\t\t\t\ttake(1),\n\t\t\t)\n\t\t\t.subscribe(() => {\n\t\t\t\tthis.tabsElements.forEach(tab => {\n\t\t\t\t\tif (this.mode === 'scroll') tab.style.paddingTop = this.navElement.clientHeight + 'px'\n\t\t\t\t})\n\t\t\t})\n\t}\n\n\thydrateTabs() {\n\t\tthis.tabs = this.tabsElements\n\t\tif (!this.activeTab && this.tabsElements[0]) {\n\t\t\tthis.activeTab = this.tabsElements[0].value\n\t\t\tthis.tabsElements[0].active = true\n\t\t} else {\n\t\t\tthis.tabsElements.forEach(tab => {\n\t\t\t\tif (tab.value === this.activeTab) tab.active = true\n\t\t\t\telse tab.active = false\n\t\t\t})\n\t\t}\n\t\tconst lastTab = this.tabs?.[-1]\n\t\tif (lastTab) {\n\t\t\tlastTab.style.paddingBottom = lastTab.offsetHeight + 'px'\n\t\t}\n\t}\n\n\ttabChanged(selectedTab: { label: string; value: string }) {\n\t\tlet activeTabElement: SchmancyTab | undefined\n\t\tthis.tabsElements.forEach(tab => {\n\t\t\tif (tab.value === selectedTab.value) {\n\t\t\t\ttab.active = true\n\t\t\t\tactiveTabElement = tab\n\t\t\t\t// scroll to the tab\n\t\t\t\tif (this.mode === 'scroll') {\n\t\t\t\t\t// Scroll the desired element into view\n\t\t\t\t\tactiveTabElement.scrollIntoView({\n\t\t\t\t\t\tbehavior: 'smooth',\n\t\t\t\t\t\tblock: 'start',\n\t\t\t\t\t\tinline: 'start',\n\t\t\t\t\t})\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\ttab.active = false\n\t\t\t}\n\t\t})\n\t\tthis.mode === 'tabs' && (this.activeTab = selectedTab.value)\n\t\tthis.dispatchEvent(new CustomEvent('tab-changed', { detail: this.activeTab }))\n\t}\n\n\tprotected render(): unknown {\n\t\tconst tabs = {\n\t\t\t'bg-surface-default color-surface-on': true,\n\t\t\t'flex z-50': true,\n\t\t\t'sticky top-0 shadow-md': this.mode === 'scroll',\n\t\t\t'rounded-full': this.rounded,\n\t\t}\n\n\t\tconst activeTab = {\n\t\t\t'text-primary-default': true,\n\t\t}\n\n\t\tconst inactiveTab = {\n\t\t\t'border-transparent': true,\n\t\t\t'hover:text-gray-700': true,\n\t\t\t'hover:border-gray-300': true,\n\t\t\t'text-gray-500': true,\n\t\t}\n\n\t\treturn html`\n\t\t\t<section id=\"tabsNavigation\" class=\"${this.classMap(tabs)}\" aria-label=\"Tabs\">\n\t\t\t\t${repeat(\n\t\t\t\t\tthis.tabs,\n\t\t\t\t\ttab => tab.value,\n\t\t\t\t\ttab => html`\n\t\t\t\t\t\t<schmancy-button\n\t\t\t\t\t\t\t@click=${() => {\n\t\t\t\t\t\t\t\tthis.tabChanged({\n\t\t\t\t\t\t\t\t\tlabel: tab.label,\n\t\t\t\t\t\t\t\t\tvalue: tab.value,\n\t\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\taria-current=\"page\"\n\t\t\t\t\t\t\tclass=\"h-auto relative\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclass=\"px-4 py-3 ${this.activeTab === tab.value\n\t\t\t\t\t\t\t\t\t? this.classMap(activeTab)\n\t\t\t\t\t\t\t\t\t: this.classMap(inactiveTab)}\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<schmancy-typography class=\"h-full align-middle flex \" type=\"title\" token=\"md\" weight=\"medium\">\n\t\t\t\t\t\t\t\t\t${tab.label}\n\t\t\t\t\t\t\t\t</schmancy-typography>\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t.hidden=${this.activeTab !== tab.value}\n\t\t\t\t\t\t\t\t\tclass=\"border-primary-default absolute bottom-0 inset-x-6 border-solid border-2 rounded-t-full\"\n\t\t\t\t\t\t\t\t></div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</schmancy-button>\n\t\t\t\t\t`,\n\t\t\t\t)}\n\t\t\t</section>\n\t\t\t<schmancy-divider class=\"px-6\"></schmancy-divider>\n\t\t\t<section id=\"tabsContent\">\n\t\t\t\t<slot @slotchange=${() => this.hydrateTabs()}></slot>\n\t\t\t</section>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-tab-group': SchmancyTabGroup\n\t}\n}\n"],"names":["SchmancyTabsModeContext","createContext","SchmancyTab","TailwindElement","css","render","html","this","mode","active","__decorateClass","property","type","String","reflect","prototype","Boolean","consume","context","subscribe","state","customElement","SchmancyTabGroup","constructor","super","arguments","rounded","tabs","connectedCallback","fromEvent","window","pipe","throttleTime","filter","map","closestDiv","closestDistance","Infinity","tabsElements","forEach","div","distance","getBoundingClientRect","top","navElement","clientHeight","document","body","offsetHeight","el","next","activeTab","value","firstUpdated","interval","take","tab","style","paddingTop","hydrateTabs","lastTab","paddingBottom","selectedTab","activeTabElement","scrollIntoView","behavior","block","inline","dispatchEvent","CustomEvent","detail","inactiveTab","classMap","repeat","tabChanged","label","provide","queryAssignedElements","flatten","query"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"tabs-group-H3C6ZnQn.js","sources":["../src/tabs/context.ts","../src/tabs/tab.ts","../src/tabs/tabs-group.ts"],"sourcesContent":["import { createContext } from '@lit/context'\n\nexport type TSchmancyTabsMode = 'scroll' | 'tabs'\n\nexport const SchmancyTabsModeContext = createContext<TSchmancyTabsMode>('tabs')\n","import { consume } from '@lit/context'\nimport { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { SchmancyTabsModeContext } from './context'\n\n@customElement('schmancy-tab')\nexport default class SchmancyTab extends TailwindElement(css`\n\t:host {\n\t\tdisplay: block;\n\t}\n`) {\n\t@property({ type: String, reflect: true }) label\n\t@property({ type: String, reflect: true }) value\n\t@property({ type: Boolean, reflect: true }) active!: boolean\n\n\t@consume({ context: SchmancyTabsModeContext, subscribe: true })\n\t@state()\n\tmode\n\tprotected render(): unknown {\n\t\treturn html` <slot .hidden=${this.mode === 'tabs' ? !this.active : false}></slot> `\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-tab': SchmancyTab\n\t}\n}\n","import { provide } from '@lit/context'\nimport { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property, query, queryAssignedElements, state } from 'lit/decorators.js'\nimport { repeat } from 'lit/directives/repeat.js'\nimport { filter, fromEvent, interval, map, take, throttleTime } from 'rxjs'\nimport { SchmancyTabsModeContext, TSchmancyTabsMode } from './context'\nimport SchmancyTab from './tab'\n\n/**\n * @slot - The content of the tab group\n * @fires tab-changed - The event fired when the tab is changed\n */\n@customElement('schmancy-tab-group')\nexport default class SchmancyTabGroup extends TailwindElement(css`\n\t:host {\n\t\tdisplay: block;\n\t}\n`) {\n\t@provide({ context: SchmancyTabsModeContext })\n\t@property({ type: String })\n\tmode: TSchmancyTabsMode = 'tabs'\n\n\t@property({ type: Boolean }) rounded = true\n\n\t@property({ type: String, reflect: true }) activeTab: string\n\t@queryAssignedElements({\n\t\tflatten: true,\n\t})\n\tprivate tabsElements!: Array<SchmancyTab>\n\n\t@query('#tabsNavigation') navElement!: HTMLElement\n\t@query('#tabsContent') tabsContent!: HTMLElement\n\n\t@state()\n\tprivate tabs: Array<SchmancyTab> = []\n\n\tconnectedCallback(): void {\n\t\tsuper.connectedCallback()\n\t\tfromEvent(window, 'scroll')\n\t\t\t.pipe(\n\t\t\t\tthrottleTime(1000),\n\t\t\t\tfilter(() => this.mode === 'scroll'),\n\t\t\t\tmap(() => {\n\t\t\t\t\tlet closestDiv = null\n\t\t\t\t\tlet closestDistance = Infinity\n\t\t\t\t\tthis.tabsElements.forEach(div => {\n\t\t\t\t\t\tconst distance =\n\t\t\t\t\t\t\tdiv.getBoundingClientRect().top - this.navElement.clientHeight + document.body.offsetHeight / 3\n\n\t\t\t\t\t\tif (distance < closestDistance && distance > 0) {\n\t\t\t\t\t\t\tclosestDistance = distance\n\t\t\t\t\t\t\tclosestDiv = div\n\t\t\t\t\t\t}\n\t\t\t\t\t})\n\t\t\t\t\treturn closestDiv\n\t\t\t\t}),\n\t\t\t\tfilter((el: SchmancyTab | null) => el !== null),\n\t\t\t)\n\t\t\t.subscribe({\n\t\t\t\tnext: (el: SchmancyTab) => {\n\t\t\t\t\tthis.activeTab = el.value\n\t\t\t\t},\n\t\t\t})\n\t}\n\n\tfirstUpdated() {\n\t\tinterval(0)\n\t\t\t.pipe(\n\t\t\t\tfilter(() => !!this.navElement.clientHeight),\n\t\t\t\ttake(1),\n\t\t\t)\n\t\t\t.subscribe(() => {\n\t\t\t\tthis.tabsElements.forEach(tab => {\n\t\t\t\t\tif (this.mode === 'scroll') tab.style.paddingTop = this.navElement.clientHeight + 'px'\n\t\t\t\t})\n\t\t\t})\n\t}\n\n\thydrateTabs() {\n\t\tthis.tabs = this.tabsElements\n\t\tif (!this.activeTab && this.tabsElements[0]) {\n\t\t\tthis.activeTab = this.tabsElements[0].value\n\t\t\tthis.tabsElements[0].active = true\n\t\t} else {\n\t\t\tthis.tabsElements.forEach(tab => {\n\t\t\t\tif (tab.value === this.activeTab) tab.active = true\n\t\t\t\telse tab.active = false\n\t\t\t})\n\t\t}\n\t\tconst lastTab = this.tabs?.[-1]\n\t\tif (lastTab) {\n\t\t\tlastTab.style.paddingBottom = lastTab.offsetHeight + 'px'\n\t\t}\n\t}\n\n\ttabChanged(selectedTab: { label: string; value: string }) {\n\t\tlet activeTabElement: SchmancyTab | undefined\n\t\tthis.tabsElements.forEach(tab => {\n\t\t\tif (tab.value === selectedTab.value) {\n\t\t\t\ttab.active = true\n\t\t\t\tactiveTabElement = tab\n\t\t\t\t// scroll to the tab\n\t\t\t\tif (this.mode === 'scroll') {\n\t\t\t\t\t// Scroll the desired element into view\n\t\t\t\t\tactiveTabElement.scrollIntoView({\n\t\t\t\t\t\tbehavior: 'smooth',\n\t\t\t\t\t\tblock: 'start',\n\t\t\t\t\t\tinline: 'start',\n\t\t\t\t\t})\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\ttab.active = false\n\t\t\t}\n\t\t})\n\t\tthis.mode === 'tabs' && (this.activeTab = selectedTab.value)\n\t\tthis.dispatchEvent(new CustomEvent('tab-changed', { detail: this.activeTab }))\n\t}\n\n\tprotected render(): unknown {\n\t\tconst tabs = {\n\t\t\t'bg-surface-default color-surface-on': true,\n\t\t\t'flex z-50': true,\n\t\t\t'sticky top-0 shadow-md': this.mode === 'scroll',\n\t\t\t'rounded-full': this.rounded,\n\t\t}\n\n\t\tconst activeTab = {\n\t\t\t'text-primary-default': true,\n\t\t}\n\n\t\tconst inactiveTab = {\n\t\t\t'border-transparent': true,\n\t\t\t'hover:text-gray-700': true,\n\t\t\t'hover:border-gray-300': true,\n\t\t\t'text-gray-500': true,\n\t\t}\n\n\t\treturn html`\n\t\t\t<section id=\"tabsNavigation\" class=\"${this.classMap(tabs)}\" aria-label=\"Tabs\">\n\t\t\t\t${repeat(\n\t\t\t\t\tthis.tabs,\n\t\t\t\t\ttab => tab.value,\n\t\t\t\t\ttab => html`\n\t\t\t\t\t\t<schmancy-button\n\t\t\t\t\t\t\t@click=${() => {\n\t\t\t\t\t\t\t\tthis.tabChanged({\n\t\t\t\t\t\t\t\t\tlabel: tab.label,\n\t\t\t\t\t\t\t\t\tvalue: tab.value,\n\t\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\taria-current=\"page\"\n\t\t\t\t\t\t\tclass=\"h-auto relative\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclass=\"px-4 py-3 ${this.activeTab === tab.value\n\t\t\t\t\t\t\t\t\t? this.classMap(activeTab)\n\t\t\t\t\t\t\t\t\t: this.classMap(inactiveTab)}\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<schmancy-typography class=\"h-full align-middle flex \" type=\"title\" token=\"md\" weight=\"medium\">\n\t\t\t\t\t\t\t\t\t${tab.label}\n\t\t\t\t\t\t\t\t</schmancy-typography>\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t.hidden=${this.activeTab !== tab.value}\n\t\t\t\t\t\t\t\t\tclass=\"border-primary-default absolute bottom-0 inset-x-6 border-solid border-2 rounded-t-full\"\n\t\t\t\t\t\t\t\t></div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</schmancy-button>\n\t\t\t\t\t`,\n\t\t\t\t)}\n\t\t\t</section>\n\t\t\t<schmancy-divider class=\"px-6\"></schmancy-divider>\n\t\t\t<section id=\"tabsContent\">\n\t\t\t\t<slot @slotchange=${() => this.hydrateTabs()}></slot>\n\t\t\t</section>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-tab-group': SchmancyTabGroup\n\t}\n}\n"],"names":["SchmancyTabsModeContext","createContext","SchmancyTab","TailwindElement","css","render","html","this","mode","active","__decorateClass","property","type","String","reflect","prototype","Boolean","consume","context","subscribe","state","customElement","SchmancyTabGroup","constructor","super","arguments","rounded","tabs","connectedCallback","fromEvent","window","pipe","throttleTime","filter","map","closestDiv","closestDistance","Infinity","tabsElements","forEach","div","distance","getBoundingClientRect","top","navElement","clientHeight","document","body","offsetHeight","el","next","activeTab","value","firstUpdated","interval","take","tab","style","paddingTop","hydrateTabs","lastTab","paddingBottom","selectedTab","activeTabElement","scrollIntoView","behavior","block","inline","dispatchEvent","CustomEvent","detail","inactiveTab","classMap","repeat","tabChanged","label","provide","queryAssignedElements","flatten","query"],"mappings":";;;;;;;;;AAIa,MAAAA,IAA0BC,EAAiC;;;;;ACGxE,IAAqBC,IAArB,cAAyCC,EAAgBC;AAAAA;AAAAA;AAAAA;AAAAA;EAY9C,SAAAC;AACT,WAAOC,mBAAsBC,KAAKC,SAAS,UAATA,CAAmBD,KAAKE,MAAAA;AAAAA,EAAc;AAR9BC;AAAAA,EAAA,CAA1CC,EAAS,EAAEC,MAAMC,QAAQC,SAAAA,GALNZ,CAAAA,CAAAA,GAAAA,EAKuBa,WAAA,SAAA,CACAL,GAAAA,EAAA,CAA1CC,EAAS,EAAEC,MAAMC,QAAQC,SAAAA,GANNZ,CAAAA,CAAAA,GAAAA,EAMuBa,WAAA,SAAA,CACCL,GAAAA,EAAA,CAA3CC,EAAS,EAAEC,MAAMI,SAASF,SAAAA,GAPPZ,CAAAA,CAAAA,GAAAA,EAOwBa,WAAA,UAAA,CAI5CL,GAAAA,EAAA,CAFCO,EAAQ,EAAEC,SAASlB,GAAyBmB,WAAAA,GAC5CC,CAAAA,GAAAA,EAAAA,CAAAA,GAVmBlB,EAWpBa,WAAA,QAAA,CAAA,GAXoBb,IAArBQ,EAAA,CADCW,EAAc,cAAA,CAAA,GACMnB;;;;;ACOrB,IAAqBoB,IAArB,cAA8CnB,EAAgBC;AAAAA;AAAAA;AAAAA;AAAAA;EAA9D,cAAAmB;AAAAC,UAAAC,GAAAA,SAAAA,GAO2BlB,KAAAC,OAAA,QAEaD,KAAAmB,UAAA,IAYvCnB,KAAQoB,OAA2B,CAAC;AAAA,EAAA;AAAA,EAEpC,oBACCH;AAAAA,UAAMI,kBACIC,GAAAA,EAAAC,QAAQ,QAAA,EAChBC,KACAC,EAAa,GACbC,GAAAA,EAAO,MAAM1B,KAAKC,SAAS,QAATA,GAClB0B,EAAI,MACH;AAAA,UAAIC,IAAa,MACbC,IAAkBC;AAUf,aATF9B,KAAA+B,aAAaC,QAAeC,OAC1B;AAAA,cAAAC,IACLD,EAAIE,sBAAwBC,EAAAA,MAAMpC,KAAKqC,WAAWC,eAAeC,SAASC,KAAKC,eAAe;AAE3FP,QAAAA,IAAWL,KAAmBK,IAAW,MAC1BL,IAAAK,GACLN,IAAAK;AAAAA,MAAA,CAGRL,GAAAA;AAAAA,IAAA,CAERF,GAAAA,EAAQgB,OAA2BA,MAAO,IAE1C9B,CAAAA,EAAAA,UAAU,EACV+B,MAAOD,OACN1C;AAAAA,WAAK4C,YAAYF,EAAGG;AAAAA,IAAA,EAErB,CAAA;AAAA,EAAA;AAAA,EAGH,eAAAC;AACCC,IAAAA,EAAS,CAAA,EACPvB,KACAE,EAAO,MAAQ1B,CAAAA,CAAAA,KAAKqC,WAAWC,YAAAA,GAC/BU,EAAK,CAAA,CAAA,EAELpC,UAAU,MACLZ;AAAAA,WAAA+B,aAAaC,QAAeiB,OACd;AAAA,QAAdjD,KAAKC,SAAS,aAAUgD,EAAIC,MAAMC,aAAanD,KAAKqC,WAAWC,eAAe;AAAA,MAAA,CAAA;AAAA,IAClF,CACD;AAAA,EAAA;AAAA,EAGH,cAAAc;;AACCpD,SAAKoB,OAAOpB,KAAK+B,cAAAA,CACZ/B,KAAK4C,aAAa5C,KAAK+B,aAAa,CACxC/B,KAAAA,KAAK4C,YAAY5C,KAAK+B,aAAa,CAAGc,EAAAA,OACjC7C,KAAA+B,aAAa,CAAG7B,EAAAA,SAAAA,MAEhBF,KAAA+B,aAAaC,QAAeiB,CAAAA,MAC5BA;AAAAA,MAAAA,EAAIJ,UAAU7C,KAAK4C,cAAe1C,SAAAA,OAC7BA,SAAS;AAAA,IAAA,CAGd;AAAA,UAAAmD,KAAUrD,IAAAA,KAAKoB,SAALpB,gBAAAA;AACZqD,UACKA,EAAAH,MAAMI,gBAAgBD,EAAQZ,eAAe;AAAA,EACtD;AAAA,EAGD,WAAWc,GAAAA;AACN,QAAAC;AACCxD,SAAA+B,aAAaC,QAAeiB,OAAAA;AAC5BA,QAAIJ,UAAUU,EAAYV,SAC7BI,EAAI/C,SAAAA,IACesD,IAAAP,GAEfjD,KAAKC,SAAS,YAEjBuD,EAAiBC,eAAe,EAC/BC,UAAU,UACVC,OAAO,SACPC,QAAQ,QAAA,CAAA,KAIVX,EAAI/C,SAAAA;AAAAA,IAAS,CAAA,GAGfF,KAAKC,SAAS,WAAWD,KAAK4C,YAAYW,EAAYV,QACjD7C,KAAA6D,cAAc,IAAIC,YAAY,eAAe,EAAEC,QAAQ/D,KAAK4C,UAAY,CAAA,CAAA;AAAA,EAAA;AAAA,EAGpE,SAAA9C;AACT,UAAMsB,IAAO,EACZ,uCAAuC,IACvC,aAAa,IACb,0BAA0BpB,KAAKC,SAAS,UACxC,gBAAgBD,KAAKmB,QAGhByB,GAAAA,IAAY,EACjB,wBAAA,GAGKoB,GAAAA,IAAc,EACnB,sBAAA,IACA,uBAAA,IACA,yBAAA,IACA,iBAAA,GAGM;AAAA,WAAAjE;AAAAA,yCACgCC,KAAKiE,SAAS7C,CAAAA,CAAAA;AAAAA,MACjD8C,EACDlE,KAAKoB,aACE6B,EAAIJ,OACJI,CAAAA,MAAAlD;AAAAA;AAAAA,gBAEI,MACRC;AAAAA,WAAKmE,WAAW,EACfC,OAAOnB,EAAImB,OACXvB,OAAOI,EAAIJ,MACX,CAAA;AAAA,IAAA,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA,2BAMkB7C,KAAK4C,cAAcK,EAAIJ,QACvC7C,KAAKiE,SAASrB,CAAAA,IACd5C,KAAKiE,SAASD,CAAAA,CAAAA;AAAAA;AAAAA;AAAAA,WAGdf,EAAImB,KAAAA;AAAAA;AAAAA;AAAAA,mBAGIpE,KAAK4C,cAAcK,EAAIJ,KAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;;;;wBAUlB,MAAM7C,KAAKoD,YAAAA,CAAAA;AAAAA;AAAAA;AAAAA,EAAa;AAAA;AAxJ/CjD,EAAA,CAFCkE,EAAQ,EAAE1D,SAASlB,EACnBW,CAAAA,GAAAA,EAAS,EAAEC,MAAMC,YANES,EAOpBP,WAAA,QAAA,CAAA,GAE6BL,EAAA,CAA5BC,EAAS,EAAEC,MAAMI,QATEM,CAAAA,CAAAA,GAAAA,EASSP,WAAA,WAAA,IAEcL,EAAA,CAA1CC,EAAS,EAAEC,MAAMC,QAAQC,SAAAA,GAXNQ,CAAAA,CAAAA,GAAAA,EAWuBP,WAAA,aAAA,CAAA,GAInCL,EAAA,CAHPmE,EAAsB,EACtBC,SAAS,GAAA,CAAA,CAAA,GAbUxD,EAeZP,WAAA,gBAAA,CAEkBL,GAAAA,EAAA,CAAzBqE,EAAM,iBAAA,CAAA,GAjBazD,EAiBMP,WAAA,cAAA,CACHL,GAAAA,EAAA,CAAtBqE,EAAM,kBAlBazD,EAkBGP,WAAA,eAAA,CAAA,GAGfL,EAAA,CADPU,EAAAA,CAAAA,GApBmBE,EAqBZP,WAAA,QAAA,CArBYO,GAAAA,IAArBZ,EAAA,CADCW,EAAc,oBACMC,CAAAA,GAAAA,CAAAA;"}
|
package/dist/tabs.cjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";require("./tabs-group-
|
|
1
|
+
"use strict";require("./tabs-group-BZFBZ1_G.cjs");
|
|
2
2
|
//# sourceMappingURL=tabs.cjs.map
|
package/dist/tabs.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import "./tabs-group-
|
|
1
|
+
import "./tabs-group-H3C6ZnQn.js";
|
|
2
2
|
//# sourceMappingURL=tabs.js.map
|