@mhmo91/schmancy 0.2.5 → 0.2.6
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-ZX1snylb.cjs → animated-text-B2Hsj2EE.cjs} +2 -2
- package/dist/{animated-text-ZX1snylb.cjs.map → animated-text-B2Hsj2EE.cjs.map} +1 -1
- package/dist/{animated-text-WprAnY6N.js → animated-text-Cl8DsOSx.js} +3 -3
- package/dist/{animated-text-WprAnY6N.js.map → animated-text-Cl8DsOSx.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-BTb4YMjB.js → area.component-B85bKRcZ.js} +3 -3
- package/dist/{area.component-BTb4YMjB.js.map → area.component-B85bKRcZ.js.map} +1 -1
- package/dist/{area.component-e52Eafj8.cjs → area.component-DmfwQylu.cjs} +2 -2
- package/dist/{area.component-e52Eafj8.cjs.map → area.component-DmfwQylu.cjs.map} +1 -1
- package/dist/area.js +1 -1
- package/dist/{autocomplete-BMJqXHOb.js → autocomplete-JwXoveWr.js} +3 -3
- package/dist/{autocomplete-BMJqXHOb.js.map → autocomplete-JwXoveWr.js.map} +1 -1
- package/dist/{autocomplete-CDURDcuP.cjs → autocomplete-p4IaQ3rG.cjs} +2 -2
- package/dist/{autocomplete-CDURDcuP.cjs.map → autocomplete-p4IaQ3rG.cjs.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-CVjDSD7Z.cjs → checkbox-CzjTuT3w.cjs} +2 -2
- package/dist/{checkbox-CVjDSD7Z.cjs.map → checkbox-CzjTuT3w.cjs.map} +1 -1
- package/dist/{checkbox-zjbsRV4T.js → checkbox-YQLMxQp0.js} +2 -2
- package/dist/{checkbox-zjbsRV4T.js.map → checkbox-YQLMxQp0.js.map} +1 -1
- package/dist/checkbox.cjs +1 -1
- package/dist/checkbox.js +1 -1
- package/dist/{chips-aWPtXsqr.js → chips-CeHrQrCw.js} +3 -3
- package/dist/{chips-aWPtXsqr.js.map → chips-CeHrQrCw.js.map} +1 -1
- package/dist/{chips-D66ZWon8.cjs → chips-RKqKhpMt.cjs} +2 -2
- package/dist/{chips-D66ZWon8.cjs.map → chips-RKqKhpMt.cjs.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-BxBuTyht.cjs → date-range-C8QEPoSF.cjs} +2 -2
- package/dist/{date-range-BxBuTyht.cjs.map → date-range-C8QEPoSF.cjs.map} +1 -1
- package/dist/{date-range-Dcbpz5LG.js → date-range-DpmqQQA6.js} +3 -3
- package/dist/{date-range-Dcbpz5LG.js.map → date-range-DpmqQQA6.js.map} +1 -1
- package/dist/date-range.cjs +1 -1
- package/dist/date-range.js +1 -1
- package/dist/{delay-D6r9Ffu1.js → delay-BRuD9ZsU.js} +2 -2
- package/dist/{delay-D6r9Ffu1.js.map → delay-BRuD9ZsU.js.map} +1 -1
- package/dist/{delay-oEn5HbAU.cjs → delay-CwoNn0R6.cjs} +2 -2
- package/dist/{delay-oEn5HbAU.cjs.map → delay-CwoNn0R6.cjs.map} +1 -1
- package/dist/delay.cjs +1 -1
- package/dist/delay.js +1 -1
- package/dist/{divider-ev9Kr0U7.cjs → divider-BmOzQ2GN.cjs} +2 -2
- package/dist/{divider-ev9Kr0U7.cjs.map → divider-BmOzQ2GN.cjs.map} +1 -1
- package/dist/{divider-C7Eoqg9K.js → divider-OsKCBnzO.js} +3 -3
- package/dist/{divider-C7Eoqg9K.js.map → divider-OsKCBnzO.js.map} +1 -1
- package/dist/divider.cjs +1 -1
- package/dist/divider.js +1 -1
- package/dist/{form-GMVrqpHh.js → form-BrnglTfc.js} +2 -2
- package/dist/{form-GMVrqpHh.js.map → form-BrnglTfc.js.map} +1 -1
- package/dist/{form-1qIEblTD.cjs → form-qcKjLvvI.cjs} +2 -2
- package/dist/{form-1qIEblTD.cjs.map → form-qcKjLvvI.cjs.map} +1 -1
- package/dist/form.cjs +1 -1
- package/dist/form.js +1 -1
- package/dist/{icon-BC7HF1LD.cjs → icon-CEMFBCcI.cjs} +2 -2
- package/dist/{icon-BC7HF1LD.cjs.map → icon-CEMFBCcI.cjs.map} +1 -1
- package/dist/{icon-button-jOYAxg9J.js → icon-button-CR1xaeX3.js} +3 -3
- package/dist/{icon-button-jOYAxg9J.js.map → icon-button-CR1xaeX3.js.map} +1 -1
- package/dist/{icon-button-De3ulD_z.cjs → icon-button-Ut2BREU3.cjs} +2 -2
- package/dist/{icon-button-De3ulD_z.cjs.map → icon-button-Ut2BREU3.cjs.map} +1 -1
- package/dist/{icon-DeZg9ygb.js → icon-gMfGHTB7.js} +3 -3
- package/dist/{icon-DeZg9ygb.js.map → icon-gMfGHTB7.js.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 +32 -32
- package/dist/{input-CJEATp6c.js → input-DMEOrHcQ.js} +2 -2
- package/dist/{input-CJEATp6c.js.map → input-DMEOrHcQ.js.map} +1 -1
- package/dist/{input-CD6peoaf.cjs → input-I662p43y.cjs} +2 -2
- package/dist/{input-CD6peoaf.cjs.map → input-I662p43y.cjs.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.cjs +1 -1
- package/dist/list.js +1 -1
- package/dist/{litElement.mixin-tfNlySsk.cjs → litElement.mixin-CcvIvqxb.cjs} +2 -2
- package/dist/{litElement.mixin-tfNlySsk.cjs.map → litElement.mixin-CcvIvqxb.cjs.map} +1 -1
- package/dist/{litElement.mixin-7ULqg8XW.js → litElement.mixin-DzAZO77V.js} +2 -2
- package/dist/{litElement.mixin-7ULqg8XW.js.map → litElement.mixin-DzAZO77V.js.map} +1 -1
- package/dist/{menu-DjJq2oIx.js → menu-BCaGhzWH.js} +3 -3
- package/dist/{menu-DjJq2oIx.js.map → menu-BCaGhzWH.js.map} +1 -1
- package/dist/{menu-AjGY7zys.cjs → menu-BvnWyx7C.cjs} +2 -2
- package/dist/{menu-AjGY7zys.cjs.map → menu-BvnWyx7C.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-vffOh8kD.cjs → option-9tcTfHed.cjs} +2 -2
- package/dist/{option-vffOh8kD.cjs.map → option-9tcTfHed.cjs.map} +1 -1
- package/dist/{option-CMO0s0ZA.js → option-D7YIvw13.js} +2 -2
- package/dist/{option-CMO0s0ZA.js.map → option-D7YIvw13.js.map} +1 -1
- package/dist/option.cjs +1 -1
- package/dist/option.js +1 -1
- package/dist/{outlet-CiF64oFE.js → outlet-BJcvmmU-.js} +2 -2
- package/dist/{outlet-CiF64oFE.js.map → outlet-BJcvmmU-.js.map} +1 -1
- package/dist/{outlet-B-n4OmvF.cjs → outlet-CR51h_EW.cjs} +2 -2
- package/dist/{outlet-B-n4OmvF.cjs.map → outlet-CR51h_EW.cjs.map} +1 -1
- package/dist/{payment-card-form-CzU2JNAf.js → payment-card-form-CWTv6RZW.js} +3 -3
- package/dist/{payment-card-form-CzU2JNAf.js.map → payment-card-form-CWTv6RZW.js.map} +1 -1
- package/dist/{payment-card-form-Db_Z6cO5.cjs → payment-card-form-CfxdH9Ww.cjs} +2 -2
- package/dist/{payment-card-form-Db_Z6cO5.cjs.map → payment-card-form-CfxdH9Ww.cjs.map} +1 -1
- package/dist/{radio-group-7nt46fXZ.js → radio-group-DgWBhZ1z.js} +2 -2
- package/dist/{radio-group-7nt46fXZ.js.map → radio-group-DgWBhZ1z.js.map} +1 -1
- package/dist/{radio-group-DJYSoWBy.cjs → radio-group-g5dYbBjj.cjs} +2 -2
- package/dist/{radio-group-DJYSoWBy.cjs.map → radio-group-g5dYbBjj.cjs.map} +1 -1
- package/dist/radio-group.cjs +1 -1
- package/dist/radio-group.js +1 -1
- package/dist/{scroll-DfFQkfsL.js → scroll-CDMKyXlg.js} +2 -2
- package/dist/{scroll-DfFQkfsL.js.map → scroll-CDMKyXlg.js.map} +1 -1
- package/dist/{scroll-wAplw639.cjs → scroll-DdnOkTUU.cjs} +2 -2
- package/dist/{scroll-wAplw639.cjs.map → scroll-DdnOkTUU.cjs.map} +1 -1
- package/dist/{select-B1f_i1ap.cjs → select-C-9U4aXL.cjs} +2 -2
- package/dist/{select-B1f_i1ap.cjs.map → select-C-9U4aXL.cjs.map} +1 -1
- package/dist/{select-D4GoZ34Z.js → select-CgqhzQeG.js} +3 -3
- package/dist/{select-D4GoZ34Z.js.map → select-CgqhzQeG.js.map} +1 -1
- package/dist/select.cjs +1 -1
- package/dist/select.js +1 -1
- package/dist/sheet-Bo4UzC3M.js +189 -0
- package/dist/sheet-Bo4UzC3M.js.map +1 -0
- package/dist/sheet-u7gTdCVC.cjs +46 -0
- package/dist/sheet-u7gTdCVC.cjs.map +1 -0
- package/dist/sheet.cjs +1 -1
- package/dist/sheet.js +1 -1
- package/dist/{slider-Dy2X0oq3.js → slider-C-2Dtp0w.js} +3 -3
- package/dist/{slider-Dy2X0oq3.js.map → slider-C-2Dtp0w.js.map} +1 -1
- package/dist/{slider-CjjoJTVy.cjs → slider-NBL_wss9.cjs} +2 -2
- package/dist/{slider-CjjoJTVy.cjs.map → slider-NBL_wss9.cjs.map} +1 -1
- package/dist/slider.cjs +1 -1
- package/dist/slider.js +1 -1
- package/dist/{spinner-C80gw4he.js → spinner-DyhJHfNo.js} +3 -3
- package/dist/{spinner-C80gw4he.js.map → spinner-DyhJHfNo.js.map} +1 -1
- package/dist/{spinner-4EbjEFc8.cjs → spinner-jhDZDoZ_.cjs} +2 -2
- package/dist/{spinner-4EbjEFc8.cjs.map → spinner-jhDZDoZ_.cjs.map} +1 -1
- package/dist/{surface-CQAyPwkD.cjs → surface-BtnEjyvR.cjs} +2 -2
- package/dist/{surface-CQAyPwkD.cjs.map → surface-BtnEjyvR.cjs.map} +1 -1
- package/dist/{surface-Ctrl8tC0.js → surface-C5Lec-AF.js} +2 -2
- package/dist/{surface-Ctrl8tC0.js.map → surface-C5Lec-AF.js.map} +1 -1
- package/dist/surface.cjs +1 -1
- package/dist/surface.js +1 -1
- package/dist/{table-C6evJfhm.cjs → table-DJR_1tnU.cjs} +2 -2
- package/dist/{table-C6evJfhm.cjs.map → table-DJR_1tnU.cjs.map} +1 -1
- package/dist/{table-DqVhvHWO.js → table-upGzIia_.js} +2 -2
- package/dist/{table-DqVhvHWO.js.map → table-upGzIia_.js.map} +1 -1
- package/dist/table.cjs +1 -1
- package/dist/table.js +1 -1
- package/dist/{tabs-group-CL9Pglz4.cjs → tabs-group-CRDP7Djw.cjs} +2 -2
- package/dist/{tabs-group-CL9Pglz4.cjs.map → tabs-group-CRDP7Djw.cjs.map} +1 -1
- package/dist/{tabs-group-ClqcDvFv.js → tabs-group-LuGpm0sj.js} +2 -2
- package/dist/{tabs-group-ClqcDvFv.js.map → tabs-group-LuGpm0sj.js.map} +1 -1
- package/dist/tabs.cjs +1 -1
- package/dist/tabs.js +1 -1
- package/dist/{tailwind.mixin-sZ3A8X0T.cjs → tailwind.mixin-BZjCpGfl.cjs} +2 -2
- package/dist/{tailwind.mixin-sZ3A8X0T.cjs.map → tailwind.mixin-BZjCpGfl.cjs.map} +1 -1
- package/dist/{tailwind.mixin-qh_Ahoe6.js → tailwind.mixin-C0_Bt1Xe.js} +12 -12
- package/dist/{tailwind.mixin-qh_Ahoe6.js.map → tailwind.mixin-C0_Bt1Xe.js.map} +1 -1
- package/dist/teleport.cjs +1 -1
- package/dist/{teleport.component-BZfCUZCo.js → teleport.component-D30hS_n9.js} +34 -34
- package/dist/{teleport.component-BZfCUZCo.js.map → teleport.component-D30hS_n9.js.map} +1 -1
- package/dist/{teleport.component-CBL4y6UF.cjs → teleport.component-THQUVYzw.cjs} +2 -2
- package/dist/{teleport.component-CBL4y6UF.cjs.map → teleport.component-THQUVYzw.cjs.map} +1 -1
- package/dist/teleport.js +1 -1
- package/dist/{textarea-BZskb4ff.cjs → textarea-CFZZ1Gu6.cjs} +2 -2
- package/dist/{textarea-BZskb4ff.cjs.map → textarea-CFZZ1Gu6.cjs.map} +1 -1
- package/dist/{textarea-BskVUKzF.js → textarea-VJQ3NGSS.js} +2 -2
- package/dist/{textarea-BskVUKzF.js.map → textarea-VJQ3NGSS.js.map} +1 -1
- package/dist/textarea.cjs +1 -1
- package/dist/textarea.js +1 -1
- package/dist/{theme-button-DesGHZ6-.js → theme-button-1PV2MUS7.js} +2 -2
- package/dist/{theme-button-DesGHZ6-.js.map → theme-button-1PV2MUS7.js.map} +1 -1
- package/dist/{theme-button-B_sQNI3r.cjs → theme-button-DHQv605r.cjs} +2 -2
- package/dist/{theme-button-B_sQNI3r.cjs.map → theme-button-DHQv605r.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-09GDsjpK.js → theme.component-BmmjcnrT.js} +61 -61
- package/dist/{theme.component-09GDsjpK.js.map → theme.component-BmmjcnrT.js.map} +1 -1
- package/dist/{theme.component-DGdGPj9P.cjs → theme.component-uRe2gufA.cjs} +3 -3
- package/dist/{theme.component-DGdGPj9P.cjs.map → theme.component-uRe2gufA.cjs.map} +1 -1
- package/dist/theme.js +1 -1
- package/dist/{tree-CihS-3ZD.js → tree-DQ9irfDc.js} +2 -2
- package/dist/{tree-CihS-3ZD.js.map → tree-DQ9irfDc.js.map} +1 -1
- package/dist/{tree-DUS1zZNw.cjs → tree-j7aC86In.cjs} +2 -2
- package/dist/{tree-DUS1zZNw.cjs.map → tree-j7aC86In.cjs.map} +1 -1
- package/dist/tree.cjs +1 -1
- package/dist/tree.js +1 -1
- package/dist/{typewriter-PucRqoAA.js → typewriter-BvTFERZS.js} +4 -4
- package/dist/{typewriter-PucRqoAA.js.map → typewriter-BvTFERZS.js.map} +1 -1
- package/dist/{typewriter-CJAKgz83.cjs → typewriter-CzHNbkkC.cjs} +2 -2
- package/dist/{typewriter-CJAKgz83.cjs.map → typewriter-CzHNbkkC.cjs.map} +1 -1
- package/dist/typewriter.cjs +1 -1
- package/dist/typewriter.js +1 -1
- package/dist/{typography-CWsxjQLr.cjs → typography-Ck-J9-0w.cjs} +2 -2
- package/dist/{typography-CWsxjQLr.cjs.map → typography-Ck-J9-0w.cjs.map} +1 -1
- package/dist/{typography-ByDngQWd.js → typography-x0gzDR7s.js} +2 -2
- package/dist/{typography-ByDngQWd.js.map → typography-x0gzDR7s.js.map} +1 -1
- package/dist/typography.cjs +1 -1
- package/dist/typography.js +1 -1
- package/package.json +1 -1
- package/types/src/sheet/sheet.d.ts +12 -14
- package/types/src/theme/theme.component.d.ts +1 -0
- package/dist/sheet-Br-tYMRf.js +0 -189
- package/dist/sheet-Br-tYMRf.js.map +0 -1
- package/dist/sheet-CosRC56a.cjs +0 -43
- package/dist/sheet-CosRC56a.cjs.map +0 -1
|
@@ -0,0 +1,189 @@
|
|
|
1
|
+
import { Subject as E, switchMap as j, forkJoin as x, fromEvent as d, takeUntil as y, timer as S, map as p, defaultIfEmpty as k, of as C, tap as l, delay as u, filter as P, take as U, mergeMap as B, merge as I } from "rxjs";
|
|
2
|
+
import "lit/directives/class-map.js";
|
|
3
|
+
import "lit/directives/style-map.js";
|
|
4
|
+
import { T as $ } from "./tailwind.mixin-C0_Bt1Xe.js";
|
|
5
|
+
import { css as T, html as f } from "lit";
|
|
6
|
+
import { property as h, customElement as g, query as L, queryAssignedElements as q } from "lit/decorators.js";
|
|
7
|
+
import { $ as z } from "./litElement.mixin-DzAZO77V.js";
|
|
8
|
+
var N = Object.defineProperty, M = Object.getOwnPropertyDescriptor, F = (t, e, s, o) => {
|
|
9
|
+
for (var n, i = o > 1 ? void 0 : o ? M(e, s) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (i = (o ? n(e, s, i) : n(i)) || i);
|
|
10
|
+
return o && i && N(e, s, i), i;
|
|
11
|
+
};
|
|
12
|
+
let m = class extends $(T`
|
|
13
|
+
:host {
|
|
14
|
+
inset: 0;
|
|
15
|
+
display: block;
|
|
16
|
+
padding-bottom: 16px;
|
|
17
|
+
}
|
|
18
|
+
`) {
|
|
19
|
+
render() {
|
|
20
|
+
const t = { absolute: this.title.length === 0, relative: this.title.length > 0 };
|
|
21
|
+
return f`
|
|
22
|
+
<schmancy-grid class="${this.classMap(t)}" align="center" justify="stretch" cols="auto 1fr auto">
|
|
23
|
+
<slot name="back">
|
|
24
|
+
<schmancy-button
|
|
25
|
+
@click=${() => {
|
|
26
|
+
this.dispatchEvent(new CustomEvent("sheetDismiss", { bubbles: !0, composed: !0 }));
|
|
27
|
+
}}
|
|
28
|
+
>
|
|
29
|
+
<span class="text-[24px]">← </span>
|
|
30
|
+
</schmancy-button>
|
|
31
|
+
</slot>
|
|
32
|
+
<schmancy-typography transform="capitalize" type="headline" token="lg"> ${this.title} </schmancy-typography>
|
|
33
|
+
<slot name="actions">
|
|
34
|
+
<schmancy-button
|
|
35
|
+
@click=${() => {
|
|
36
|
+
this.dispatchEvent(new CustomEvent("sheetDismiss", { bubbles: !0, composed: !0 }));
|
|
37
|
+
}}
|
|
38
|
+
>
|
|
39
|
+
<span class="text-[24px]">✕</span>
|
|
40
|
+
</schmancy-button>
|
|
41
|
+
</slot>
|
|
42
|
+
</schmancy-grid>
|
|
43
|
+
`;
|
|
44
|
+
}
|
|
45
|
+
};
|
|
46
|
+
function R(t, e) {
|
|
47
|
+
return (s, o) => {
|
|
48
|
+
const { willUpdate: n } = s;
|
|
49
|
+
e = Object.assign({ waitUntilFirstUpdate: !1 }, e), s.willUpdate = function(i) {
|
|
50
|
+
if (n.call(this, i), i.has(t)) {
|
|
51
|
+
const a = i.get(t), w = this[t];
|
|
52
|
+
a !== w && (e != null && e.waitUntilFirstUpdate && !this.hasUpdated || this[o].call(this, a, w));
|
|
53
|
+
}
|
|
54
|
+
};
|
|
55
|
+
};
|
|
56
|
+
}
|
|
57
|
+
F([h()], m.prototype, "title", 2), m = F([g("schmancy-sheet-header")], m);
|
|
58
|
+
var J = Object.defineProperty, Y = Object.getOwnPropertyDescriptor;
|
|
59
|
+
let O = class extends $() {
|
|
60
|
+
render() {
|
|
61
|
+
return f`
|
|
62
|
+
<div tabindex="0">
|
|
63
|
+
<slot></slot>
|
|
64
|
+
</div>
|
|
65
|
+
`;
|
|
66
|
+
}
|
|
67
|
+
};
|
|
68
|
+
O = ((t, e, s, o) => {
|
|
69
|
+
for (var n, i = o > 1 ? void 0 : o ? Y(e, s) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (i = (o ? n(e, s, i) : n(i)) || i);
|
|
70
|
+
return o && i && J(e, s, i), i;
|
|
71
|
+
})([g("schmancy-sheet-content")], O);
|
|
72
|
+
var D = ((t) => (t.Side = "side", t.Bottom = "bottom", t.BottomCenter = "bottom-center", t.TopRight = "top-right", t.BottomRight = "bottom-right", t))(D || {});
|
|
73
|
+
const b = "are-you-there-sheet", v = "yes-here", A = new class {
|
|
74
|
+
constructor() {
|
|
75
|
+
this.bottomSheet = new E(), this.$dismiss = new E(), this.bottomSheet.pipe(j((t) => x([d(window, v).pipe(y(S(0)), p((e) => e.detail.sheet), k(void 0)), C(t).pipe(l(() => {
|
|
76
|
+
window.dispatchEvent(new CustomEvent(b, { detail: { uid: t.uid ?? t.component.tagName } }));
|
|
77
|
+
}))])), p(([t, e]) => (t || (t = document.createElement("schmancy-sheet"), document.body.appendChild(t)), t.setAttribute("uid", e.uid ?? e.component.tagName), t.setAttribute("position", e.position ?? "side"), t.setAttribute("allowOverlyDismiss", e.allowOverlyDismiss === !1 ? "false" : "true"), e.title && t.setAttribute("title", e.title), e.persist && t.setAttribute("persist", e.persist ?? !1), e.header && t.setAttribute("header", e.header), document.body.style.overflow = "hidden", { target: e, sheet: t })), u(20), P(({ target: t, sheet: e }) => {
|
|
78
|
+
var s, o;
|
|
79
|
+
return !t.persist || !((o = (s = e == null ? void 0 : e.shadowRoot) == null ? void 0 : s.querySelector("slot")) != null && o.assignedElements().find((n) => n.tagName === t.component.tagName)) || (e == null || e.setAttribute("open", "true"), !1);
|
|
80
|
+
}), l(({ target: t, sheet: e }) => {
|
|
81
|
+
e == null || e.appendChild(t.component);
|
|
82
|
+
}), u(1), l(({ sheet: t }) => {
|
|
83
|
+
t == null || t.setAttribute("open", "true");
|
|
84
|
+
}), l(({ sheet: t }) => {
|
|
85
|
+
d(t, "close").pipe(U(1)).pipe(u(300)).subscribe((e) => {
|
|
86
|
+
const s = e.target;
|
|
87
|
+
s != null && s.persist || (s == null || s.remove()), document.body.style.overflow = "auto";
|
|
88
|
+
});
|
|
89
|
+
})).subscribe(), this.$dismiss.pipe(B((t) => x([d(window, v).pipe(y(S(100)), p((e) => e.detail.sheet), k(void 0)), C(t).pipe(l(() => {
|
|
90
|
+
window.dispatchEvent(new CustomEvent(b, { detail: { uid: t } }));
|
|
91
|
+
}))])), l(([t]) => {
|
|
92
|
+
t == null || t.closeSheet();
|
|
93
|
+
})).subscribe();
|
|
94
|
+
}
|
|
95
|
+
dismiss(t) {
|
|
96
|
+
this.$dismiss.next(t);
|
|
97
|
+
}
|
|
98
|
+
open(t) {
|
|
99
|
+
this.bottomSheet.next(t);
|
|
100
|
+
}
|
|
101
|
+
}();
|
|
102
|
+
var G = Object.defineProperty, H = Object.getOwnPropertyDescriptor, c = (t, e, s, o) => {
|
|
103
|
+
for (var n, i = o > 1 ? void 0 : o ? H(e, s) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (i = (o ? n(e, s, i) : n(i)) || i);
|
|
104
|
+
return o && i && G(e, s, i), i;
|
|
105
|
+
};
|
|
106
|
+
let r = class extends z(":host{--overlay-color: rgba(0, 0, 0, .7);--transition-duration: .3s;--sheet-radius: 0;--max-height: 100vh}.sheet{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;display:flex;visibility:visible;transition:visibility var(--transition-duration) ease-in-out}.sheet[aria-hidden=true]{visibility:hidden;pointer-events:none}.sheet[aria-hidden=true] .content{transform:translateY(100%)}.sheet[aria-hidden=true] .content[data-position=side]{transform:translate(100%)}.sheet[aria-hidden=true] .overlay{opacity:0}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--overlay-color);opacity:.4;transition:opacity var(--transition-duration) ease-in-out}.content{position:relative;z-index:1;display:flex;flex-direction:column;background:#fff;transition:transform var(--transition-duration) ease-in-out}.content[data-position=side]{height:100%;margin-left:auto;min-width:320px;max-width:90vw}.content[data-position=bottom]{width:100%;margin-top:auto;border-radius:16px 16px 0 0;max-height:90vh}.content-body{flex:1;overflow-y:auto;padding:1rem}") {
|
|
107
|
+
constructor() {
|
|
108
|
+
super(...arguments), this.open = !1, this.header = "visible", this.position = D.Side, this.persist = !1, this.allowOverlayDismiss = !0, this.title = "", this.focusAttribute = "autofocus", this.lastFocusedElement = null, this.handleFocusIn = (t) => {
|
|
109
|
+
var e;
|
|
110
|
+
(e = this.sheet) != null && e.contains(t.target) || this.focus();
|
|
111
|
+
};
|
|
112
|
+
}
|
|
113
|
+
onOpenChange(t, e) {
|
|
114
|
+
var s;
|
|
115
|
+
this.setIsSheetShown(e), e ? (this.lastFocusedElement = document.activeElement, this.addFocusTrap(), this.focus()) : (this.removeFocusTrap(), (s = this.lastFocusedElement) == null || s.focus(), this.lastFocusedElement = null);
|
|
116
|
+
}
|
|
117
|
+
connectedCallback() {
|
|
118
|
+
super.connectedCallback(), this.setupEventListeners();
|
|
119
|
+
}
|
|
120
|
+
disconnectedCallback() {
|
|
121
|
+
super.disconnectedCallback(), this.disconnecting.next(!0);
|
|
122
|
+
}
|
|
123
|
+
setupEventListeners() {
|
|
124
|
+
const t = d(window, "popstate").pipe(l((o) => {
|
|
125
|
+
o.preventDefault(), this.closeSheet();
|
|
126
|
+
})), e = d(window, "keyup").pipe(l((o) => {
|
|
127
|
+
o.key !== "Escape" || this.sheetContainsFocus() || A.dismiss(this.uid);
|
|
128
|
+
})), s = d(window, b).pipe(l((o) => {
|
|
129
|
+
o.detail.uid === this.uid && this.announcePresence();
|
|
130
|
+
}));
|
|
131
|
+
I(t, e, s).pipe(y(this.disconnecting)).subscribe();
|
|
132
|
+
}
|
|
133
|
+
sheetContainsFocus() {
|
|
134
|
+
var t;
|
|
135
|
+
return ((t = this.sheet) == null ? void 0 : t.contains(document.activeElement)) ?? !1;
|
|
136
|
+
}
|
|
137
|
+
announcePresence() {
|
|
138
|
+
this.dispatchEvent(new CustomEvent(v, { detail: { sheet: this }, bubbles: !0, composed: !0 }));
|
|
139
|
+
}
|
|
140
|
+
addFocusTrap() {
|
|
141
|
+
document.addEventListener("focusin", this.handleFocusIn);
|
|
142
|
+
}
|
|
143
|
+
removeFocusTrap() {
|
|
144
|
+
document.removeEventListener("focusin", this.handleFocusIn);
|
|
145
|
+
}
|
|
146
|
+
setIsSheetShown(t) {
|
|
147
|
+
var e, s;
|
|
148
|
+
(e = this.sheet) == null || e.setAttribute("aria-hidden", String(!t)), (s = this.sheet) == null || s.setAttribute("aria-modal", String(t));
|
|
149
|
+
}
|
|
150
|
+
closeSheet() {
|
|
151
|
+
this.open = !1, this.dispatchEvent(new CustomEvent("close"));
|
|
152
|
+
}
|
|
153
|
+
getFocusElement() {
|
|
154
|
+
const t = `[${this.focusAttribute}]`;
|
|
155
|
+
return this.assignedElements.find((e) => e.matches(t) || e.querySelector(t)) ?? null;
|
|
156
|
+
}
|
|
157
|
+
focus() {
|
|
158
|
+
var t;
|
|
159
|
+
(t = this.getFocusElement()) == null || t.focus();
|
|
160
|
+
}
|
|
161
|
+
render() {
|
|
162
|
+
return f`
|
|
163
|
+
<div class="sheet" role="dialog" aria-labelledby="sheet-title" aria-hidden="true" aria-modal="false">
|
|
164
|
+
<div class="overlay" @click=${() => this.allowOverlayDismiss && A.dismiss(this.uid)}></div>
|
|
165
|
+
|
|
166
|
+
<schmancy-sheet-content class="content" data-position=${this.position}>
|
|
167
|
+
<schmancy-sheet-header
|
|
168
|
+
id="sheet-title"
|
|
169
|
+
.hidden=${this.header === "hidden"}
|
|
170
|
+
title=${this.title}
|
|
171
|
+
></schmancy-sheet-header>
|
|
172
|
+
|
|
173
|
+
<section class="content-body">
|
|
174
|
+
<slot></slot>
|
|
175
|
+
</section>
|
|
176
|
+
</schmancy-sheet-content>
|
|
177
|
+
</div>
|
|
178
|
+
`;
|
|
179
|
+
}
|
|
180
|
+
};
|
|
181
|
+
c([h({ type: String, reflect: !0 })], r.prototype, "uid", 2), c([h({ type: Boolean, reflect: !0 })], r.prototype, "open", 2), c([h({ type: String, reflect: !0 })], r.prototype, "header", 2), c([h({ type: String, reflect: !0 })], r.prototype, "position", 2), c([h({ type: Boolean, reflect: !0 })], r.prototype, "persist", 2), c([h({ type: Boolean, reflect: !0 })], r.prototype, "allowOverlayDismiss", 2), c([h({ type: String, reflect: !0 })], r.prototype, "title", 2), c([L(".sheet")], r.prototype, "sheet", 2), c([q({ flatten: !0 })], r.prototype, "assignedElements", 2), c([h()], r.prototype, "focusAttribute", 2), c([R("open")], r.prototype, "onOpenChange", 1), r = c([g("schmancy-sheet")], r);
|
|
182
|
+
export {
|
|
183
|
+
D as S,
|
|
184
|
+
b as a,
|
|
185
|
+
v as b,
|
|
186
|
+
R as h,
|
|
187
|
+
A as s
|
|
188
|
+
};
|
|
189
|
+
//# sourceMappingURL=sheet-Bo4UzC3M.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"sheet-Bo4UzC3M.js","sources":["../src/sheet/header.ts","../src/sheet/hook.ts","../src/sheet/sheet-content.ts","../src/sheet/sheet.service.ts","../src/sheet/sheet.ts"],"sourcesContent":["import { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\n@customElement('schmancy-sheet-header')\nexport default class SchmancySheetHeader extends TailwindElement(css`\n\t:host {\n\t\tinset: 0;\n\t\tdisplay: block;\n\t\tpadding-bottom: 16px;\n\t}\n`) {\n\t@property() title: string\n\trender() {\n\t\tconst classes = {\n\t\t\tabsolute: this.title.length === 0,\n\t\t\trelative: this.title.length > 0,\n\t\t}\n\t\treturn html`\n\t\t\t<schmancy-grid class=\"${this.classMap(classes)}\" align=\"center\" justify=\"stretch\" cols=\"auto 1fr auto\">\n\t\t\t\t<slot name=\"back\">\n\t\t\t\t\t<schmancy-button\n\t\t\t\t\t\t@click=${() => {\n\t\t\t\t\t\t\tthis.dispatchEvent(\n\t\t\t\t\t\t\t\tnew CustomEvent('sheetDismiss', {\n\t\t\t\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\t\t\t\tcomposed: true,\n\t\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<span class=\"text-[24px]\">← </span>\n\t\t\t\t\t</schmancy-button>\n\t\t\t\t</slot>\n\t\t\t\t<schmancy-typography transform=\"capitalize\" type=\"headline\" token=\"lg\"> ${this.title} </schmancy-typography>\n\t\t\t\t<slot name=\"actions\">\n\t\t\t\t\t<schmancy-button\n\t\t\t\t\t\t@click=${() => {\n\t\t\t\t\t\t\tthis.dispatchEvent(\n\t\t\t\t\t\t\t\tnew CustomEvent('sheetDismiss', {\n\t\t\t\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\t\t\t\tcomposed: true,\n\t\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<span class=\"text-[24px]\">✕</span>\n\t\t\t\t\t</schmancy-button>\n\t\t\t\t</slot>\n\t\t\t</schmancy-grid>\n\t\t`\n\t}\n}\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-sheet-header': SchmancySheetHeader\n\t}\n}\n","// @watch decorator\n//\n// Runs when an observed property changes, e.g. @property or @state, but before the component updates.\n//\n// To wait for an update to complete after a change occurs, use `await this.updateComplete` in the handler. To start\n// watching after the initial update/render, use `{ waitUntilFirstUpdate: true }` or `this.hasUpdated` in the handler.\n//\n// Usage:\n//\n// @watch('propName')\n// handlePropChange(oldValue, newValue) {\n// ...\n// }\n//\ninterface WatchOptions {\n waitUntilFirstUpdate?: boolean\n}\n\nexport function hook(propName: string, options?: WatchOptions) {\n return (protoOrDescriptor: any, name: string): any => {\n const { willUpdate } = protoOrDescriptor\n\n options = Object.assign({ waitUntilFirstUpdate: false }, options) as WatchOptions\n\n protoOrDescriptor.willUpdate = function (changedProps: Map<string, any>) {\n willUpdate.call(this, changedProps)\n\n if (changedProps.has(propName)) {\n const oldValue = changedProps.get(propName)\n const newValue = this[propName]\n\n if (oldValue !== newValue) {\n if (!options?.waitUntilFirstUpdate || this.hasUpdated) {\n this[name].call(this, oldValue, newValue)\n }\n }\n }\n }\n }\n}\n","import { TailwindElement } from '@mixins/index'\nimport { html } from 'lit'\nimport { customElement } from 'lit/decorators.js'\n\n@customElement('schmancy-sheet-content')\nexport default class SchmancySheetContent extends TailwindElement() {\n\trender() {\n\t\treturn html`\n\t\t\t<div tabindex=\"0\">\n\t\t\t\t<slot></slot>\n\t\t\t</div>\n\t\t`\n\t}\n}\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-sheet-content': SchmancySheetContent\n\t}\n}\n","import {\n\tdefaultIfEmpty,\n\tdelay,\n\tfilter,\n\tforkJoin,\n\tfromEvent,\n\tmap,\n\tmergeMap,\n\tof,\n\tSubject,\n\tswitchMap,\n\ttake,\n\ttakeUntil,\n\ttap,\n\ttimer,\n} from 'rxjs'\nimport SchmancySheet from './sheet'\n\nexport enum SchmancySheetPosition {\n\tSide = 'side',\n\tBottom = 'bottom',\n\t/**\n\t * @deprecated use bottom instead\n\t */\n\tBottomCenter = 'bottom-center',\n\t/**\n\t * @deprecated use side instead\n\t */\n\tTopRight = 'top-right',\n\t/**\n\t * @deprecated use side instead\n\t */\n\tBottomRight = 'bottom-right',\n}\n\ntype BottomSheeetTarget = {\n\tcomponent: HTMLElement\n\tuid?: string\n\tposition?: SchmancySheetPosition\n\tpersist?: boolean\n\tclose?: () => void\n\tallowOverlyDismiss?: boolean\n\ttitle?: string\n\theader?: 'hidden' | 'visible'\n}\n\n// Events for communication between bottom-sheet component and bottom-sheet.service\nexport type SheetWhereAreYouRickyEvent = CustomEvent<{\n\tuid: string\n}>\nexport const SheetWhereAreYouRicky = 'are-you-there-sheet'\n\nexport type SheetHereMortyEvent = CustomEvent<{\n\tsheet: SchmancySheet\n}>\nexport const SheetHereMorty = 'yes-here'\nclass BottomSheetService {\n\tbottomSheet = new Subject<BottomSheeetTarget>()\n\t$dismiss = new Subject<string>()\n\tconstructor() {\n\t\tthis.bottomSheet\n\t\t\t.pipe(\n\t\t\t\tswitchMap(target =>\n\t\t\t\t\tforkJoin([\n\t\t\t\t\t\tfromEvent<SheetHereMortyEvent>(window, SheetHereMorty).pipe(\n\t\t\t\t\t\t\ttakeUntil(timer(0)),\n\t\t\t\t\t\t\tmap(e => e.detail.sheet),\n\t\t\t\t\t\t\tdefaultIfEmpty(undefined),\n\t\t\t\t\t\t),\n\t\t\t\t\t\tof(target).pipe(\n\t\t\t\t\t\t\ttap(() => {\n\t\t\t\t\t\t\t\twindow.dispatchEvent(\n\t\t\t\t\t\t\t\t\tnew CustomEvent(SheetWhereAreYouRicky, {\n\t\t\t\t\t\t\t\t\t\tdetail: { uid: target.uid ?? target.component.tagName },\n\t\t\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t),\n\t\t\t\t\t]),\n\t\t\t\t),\n\t\t\t\tmap(([sheet, target]) => {\n\t\t\t\t\tconsole.log(sheet, target)\n\t\t\t\t\tif (!sheet) {\n\t\t\t\t\t\t// if sheet is not found, create it\n\t\t\t\t\t\tsheet = document.createElement('schmancy-sheet')\n\t\t\t\t\t\tdocument.body.appendChild(sheet)\n\t\t\t\t\t}\n\t\t\t\t\tsheet.setAttribute('uid', target.uid ?? target.component.tagName)\n\t\t\t\t\tsheet.setAttribute('position', target.position ?? SchmancySheetPosition.Side)\n\t\t\t\t\tsheet.setAttribute('allowOverlyDismiss', target.allowOverlyDismiss === false ? 'false' : 'true')\n\t\t\t\t\ttarget.title && sheet.setAttribute('title', target.title)\n\t\t\t\t\ttarget.persist && sheet.setAttribute('persist', target.persist ?? false)\n\t\t\t\t\ttarget.header && sheet.setAttribute('header', target.header)\n\t\t\t\t\tdocument.body.style.overflow = 'hidden' // lock the scroll of the host\n\t\t\t\t\treturn { target, sheet }\n\t\t\t\t}),\n\t\t\t\tdelay(20),\n\t\t\t\tfilter(({ target, sheet }) => {\n\t\t\t\t\t// if the sheet has already the component, just show it\n\t\t\t\t\tif (\n\t\t\t\t\t\ttarget.persist &&\n\t\t\t\t\t\tsheet?.shadowRoot\n\t\t\t\t\t\t\t?.querySelector('slot')\n\t\t\t\t\t\t\t?.assignedElements()\n\t\t\t\t\t\t\t.find(e => e.tagName === target.component.tagName)\n\t\t\t\t\t) {\n\t\t\t\t\t\tsheet?.setAttribute('open', 'true')\n\t\t\t\t\t\treturn false\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn true // if the sheet does not have the component, continue to the next step\n\t\t\t\t\t}\n\t\t\t\t}),\n\t\t\t\ttap(({ target, sheet }) => {\n\t\t\t\t\tsheet?.appendChild(target.component)\n\t\t\t\t}),\n\t\t\t\tdelay(1),\n\t\t\t\ttap(({ sheet }) => {\n\t\t\t\t\tsheet?.setAttribute('open', 'true')\n\t\t\t\t}),\n\t\t\t\ttap(({ sheet }) => {\n\t\t\t\t\tfromEvent<CustomEvent>(sheet, 'close')\n\t\t\t\t\t\t.pipe(take(1))\n\t\t\t\t\t\t.pipe(delay(300))\n\t\t\t\t\t\t.subscribe(e => {\n\t\t\t\t\t\t\tconst target = e.target as SchmancySheet\n\t\t\t\t\t\t\tconsole.log(target)\n\n\t\t\t\t\t\t\tif (!target?.persist) target?.remove()\n\t\t\t\t\t\t\tdocument.body.style.overflow = 'auto' // unlock the scroll of the host\n\t\t\t\t\t\t})\n\t\t\t\t}),\n\t\t\t)\n\t\t\t.subscribe()\n\n\t\tthis.$dismiss\n\t\t\t.pipe(\n\t\t\t\tmergeMap(uid =>\n\t\t\t\t\tforkJoin([\n\t\t\t\t\t\tfromEvent<SheetHereMortyEvent>(window, SheetHereMorty).pipe(\n\t\t\t\t\t\t\ttakeUntil(timer(100)), // Some people say why 10? I say why not?\n\t\t\t\t\t\t\tmap(e => e.detail.sheet),\n\t\t\t\t\t\t\tdefaultIfEmpty(undefined),\n\t\t\t\t\t\t),\n\t\t\t\t\t\tof(uid).pipe(\n\t\t\t\t\t\t\ttap(() => {\n\t\t\t\t\t\t\t\twindow.dispatchEvent(new CustomEvent(SheetWhereAreYouRicky, { detail: { uid } }))\n\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t),\n\t\t\t\t\t]),\n\t\t\t\t),\n\t\t\t\ttap(([sheet]) => {\n\t\t\t\t\tsheet?.closeSheet()\n\t\t\t\t}),\n\t\t\t)\n\t\t\t.subscribe()\n\t}\n\n\tdismiss(uid: string) {\n\t\tthis.$dismiss.next(uid)\n\t}\n\n\topen(target: BottomSheeetTarget) {\n\t\tthis.bottomSheet.next(target)\n\t}\n}\nexport const sheet = new BottomSheetService()\n","import { $LitElement } from '@mixins/index'\nimport { html } from 'lit'\nimport { customElement, property, query, queryAssignedElements } from 'lit/decorators.js'\nimport { fromEvent, merge, takeUntil, tap } from 'rxjs'\nimport { hook } from './hook'\nimport style from './sheet.scss?inline'\nimport {\n\tSchmancySheetPosition,\n\tSheetHereMorty,\n\tSheetWhereAreYouRicky,\n\tSheetWhereAreYouRickyEvent,\n\tsheet,\n} from './sheet.service'\n\n@customElement('schmancy-sheet')\nexport default class SchmancySheet extends $LitElement(style) {\n\t@property({ type: String, reflect: true }) uid!: string\n\t@property({ type: Boolean, reflect: true }) open = false\n\t@property({ type: String, reflect: true }) header: 'hidden' | 'visible' = 'visible'\n\t@property({ type: String, reflect: true }) position: SchmancySheetPosition = SchmancySheetPosition.Side\n\t@property({ type: Boolean, reflect: true }) persist = false\n\t@property({ type: Boolean, reflect: true }) allowOverlayDismiss = true\n\t@property({ type: String, reflect: true }) title = ''\n\n\t@query('.sheet') private sheet!: HTMLElement\n\t@queryAssignedElements({ flatten: true }) private assignedElements!: HTMLElement[]\n\n\t@property() focusAttribute = 'autofocus'\n\tprivate lastFocusedElement: HTMLElement | null = null\n\n\t@hook('open')\n\tonOpenChange(_oldValue: boolean, newValue: boolean) {\n\t\tthis.setIsSheetShown(newValue)\n\n\t\tif (newValue) {\n\t\t\tthis.lastFocusedElement = document.activeElement as HTMLElement\n\t\t\tthis.addFocusTrap()\n\t\t\tthis.focus()\n\t\t} else {\n\t\t\tthis.removeFocusTrap()\n\t\t\tthis.lastFocusedElement?.focus()\n\t\t\tthis.lastFocusedElement = null\n\t\t}\n\t}\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\t\tthis.setupEventListeners()\n\t}\n\n\tdisconnectedCallback() {\n\t\tsuper.disconnectedCallback()\n\t\tthis.disconnecting.next(true)\n\t}\n\n\tprivate setupEventListeners() {\n\t\t// Handle browser back button\n\t\tconst popState$ = fromEvent<PopStateEvent>(window, 'popstate').pipe(\n\t\t\ttap(e => {\n\t\t\t\te.preventDefault()\n\t\t\t\tthis.closeSheet()\n\t\t\t}),\n\t\t)\n\n\t\t// Handle ESC key\n\t\tconst keyUp$ = fromEvent<KeyboardEvent>(window, 'keyup').pipe(\n\t\t\ttap(event => {\n\t\t\t\tif (event.key === 'Escape' && !this.sheetContainsFocus()) {\n\t\t\t\t\tsheet.dismiss(this.uid)\n\t\t\t\t}\n\t\t\t}),\n\t\t)\n\n\t\t// Handle inter-component communication\n\t\tconst rickyComm$ = fromEvent<SheetWhereAreYouRickyEvent>(window, SheetWhereAreYouRicky).pipe(\n\t\t\ttap(e => {\n\t\t\t\tif (e.detail.uid === this.uid) this.announcePresence()\n\t\t\t}),\n\t\t)\n\n\t\tmerge(popState$, keyUp$, rickyComm$).pipe(takeUntil(this.disconnecting)).subscribe()\n\t}\n\n\tprivate sheetContainsFocus(): boolean {\n\t\treturn this.sheet?.contains(document.activeElement) ?? false\n\t}\n\n\tprivate announcePresence() {\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent(SheetHereMorty, {\n\t\t\t\tdetail: { sheet: this },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t}),\n\t\t)\n\t}\n\n\tprivate addFocusTrap() {\n\t\tdocument.addEventListener('focusin', this.handleFocusIn)\n\t}\n\n\tprivate removeFocusTrap() {\n\t\tdocument.removeEventListener('focusin', this.handleFocusIn)\n\t}\n\n\tprivate handleFocusIn = (e: Event) => {\n\t\tif (!this.sheet?.contains(e.target as Node)) {\n\t\t\tthis.focus()\n\t\t}\n\t}\n\n\tsetIsSheetShown(isShown: boolean) {\n\t\tthis.sheet?.setAttribute('aria-hidden', String(!isShown))\n\t\tthis.sheet?.setAttribute('aria-modal', String(isShown))\n\t}\n\n\tcloseSheet() {\n\t\tthis.open = false\n\t\tthis.dispatchEvent(new CustomEvent('close'))\n\t}\n\n\tprivate getFocusElement(): HTMLElement | null {\n\t\tconst selector = `[${this.focusAttribute}]`\n\t\treturn (this.assignedElements.find(el => el.matches(selector) || el.querySelector(selector)) as HTMLElement) ?? null\n\t}\n\n\toverride focus() {\n\t\tthis.getFocusElement()?.focus()\n\t}\n\n\trender() {\n\t\treturn html`\n\t\t\t<div class=\"sheet\" role=\"dialog\" aria-labelledby=\"sheet-title\" aria-hidden=\"true\" aria-modal=\"false\">\n\t\t\t\t<div class=\"overlay\" @click=${() => this.allowOverlayDismiss && sheet.dismiss(this.uid)}></div>\n\n\t\t\t\t<schmancy-sheet-content class=\"content\" data-position=${this.position}>\n\t\t\t\t\t<schmancy-sheet-header\n\t\t\t\t\t\tid=\"sheet-title\"\n\t\t\t\t\t\t.hidden=${this.header === 'hidden'}\n\t\t\t\t\t\ttitle=${this.title}\n\t\t\t\t\t></schmancy-sheet-header>\n\n\t\t\t\t\t<section class=\"content-body\">\n\t\t\t\t\t\t<slot></slot>\n\t\t\t\t\t</section>\n\t\t\t\t</schmancy-sheet-content>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-sheet': SchmancySheet\n\t}\n}\n"],"names":["SchmancySheetHeader","TailwindElement","css","classes","absolute","this","title","length","relative","html","classMap","dispatchEvent","CustomEvent","bubbles","composed","hook","propName","options","protoOrDescriptor","name","willUpdate","Object","assign","waitUntilFirstUpdate","changedProps","call","has","oldValue","get","newValue","hasUpdated","__decorateClass","property","prototype","customElement","SchmancySheetContent","render","SchmancySheetPosition","SheetWhereAreYouRicky","SheetHereMorty","sheet","bottomSheet","Subject","$dismiss","pipe","switchMap","forkJoin","fromEvent","window","takeUntil","timer","map","e","detail","defaultIfEmpty","of","target","tap","uid","component","tagName","document","createElement","body","appendChild","setAttribute","position","allowOverlyDismiss","persist","header","style","overflow","delay","filter","shadowRoot","querySelector","assignedElements","find","take","subscribe","remove","mergeMap","closeSheet","next","SchmancySheet","$LitElement","constructor","super","arguments","open","Side","allowOverlayDismiss","focusAttribute","lastFocusedElement","handleFocusIn","contains","focus","_oldValue","setIsSheetShown","activeElement","addFocusTrap","removeFocusTrap","connectedCallback","setupEventListeners","disconnectedCallback","disconnecting","popState$","preventDefault","keyUp$","event","key","sheetContainsFocus","dismiss","rickyComm$","announcePresence","merge","addEventListener","removeEventListener","isShown","String","selector","el","matches","getFocusElement","type","reflect","Boolean","query","queryAssignedElements","flatten"],"mappings":"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"}
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
"use strict";const s=require("rxjs");require("lit/directives/class-map.js"),require("lit/directives/style-map.js");const E=require("./tailwind.mixin-BZjCpGfl.cjs"),p=require("lit"),c=require("lit/decorators.js"),S=require("./litElement.mixin-CcvIvqxb.cjs");var x=Object.defineProperty,k=Object.getOwnPropertyDescriptor,f=(t,e,i,n)=>{for(var r,o=n>1?void 0:n?k(e,i):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(n?r(e,i,o):r(o))||o);return n&&o&&x(e,i,o),o};let m=class extends E.TailwindElement(p.css`
|
|
2
|
+
:host {
|
|
3
|
+
inset: 0;
|
|
4
|
+
display: block;
|
|
5
|
+
padding-bottom: 16px;
|
|
6
|
+
}
|
|
7
|
+
`){render(){const t={absolute:this.title.length===0,relative:this.title.length>0};return p.html`
|
|
8
|
+
<schmancy-grid class="${this.classMap(t)}" align="center" justify="stretch" cols="auto 1fr auto">
|
|
9
|
+
<slot name="back">
|
|
10
|
+
<schmancy-button
|
|
11
|
+
@click=${()=>{this.dispatchEvent(new CustomEvent("sheetDismiss",{bubbles:!0,composed:!0}))}}
|
|
12
|
+
>
|
|
13
|
+
<span class="text-[24px]">← </span>
|
|
14
|
+
</schmancy-button>
|
|
15
|
+
</slot>
|
|
16
|
+
<schmancy-typography transform="capitalize" type="headline" token="lg"> ${this.title} </schmancy-typography>
|
|
17
|
+
<slot name="actions">
|
|
18
|
+
<schmancy-button
|
|
19
|
+
@click=${()=>{this.dispatchEvent(new CustomEvent("sheetDismiss",{bubbles:!0,composed:!0}))}}
|
|
20
|
+
>
|
|
21
|
+
<span class="text-[24px]">✕</span>
|
|
22
|
+
</schmancy-button>
|
|
23
|
+
</slot>
|
|
24
|
+
</schmancy-grid>
|
|
25
|
+
`}};function g(t,e){return(i,n)=>{const{willUpdate:r}=i;e=Object.assign({waitUntilFirstUpdate:!1},e),i.willUpdate=function(o){if(r.call(this,o),o.has(t)){const a=o.get(t),v=this[t];a!==v&&(e!=null&&e.waitUntilFirstUpdate&&!this.hasUpdated||this[n].call(this,a,v))}}}}f([c.property()],m.prototype,"title",2),m=f([c.customElement("schmancy-sheet-header")],m);var C=Object.defineProperty,F=Object.getOwnPropertyDescriptor;let w=class extends E.TailwindElement(){render(){return p.html`
|
|
26
|
+
<div tabindex="0">
|
|
27
|
+
<slot></slot>
|
|
28
|
+
</div>
|
|
29
|
+
`}};w=((t,e,i,n)=>{for(var r,o=n>1?void 0:n?F(e,i):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(n?r(e,i,o):r(o))||o);return n&&o&&C(e,i,o),o})([c.customElement("schmancy-sheet-content")],w);var b=(t=>(t.Side="side",t.Bottom="bottom",t.BottomCenter="bottom-center",t.TopRight="top-right",t.BottomRight="bottom-right",t))(b||{});const d="are-you-there-sheet",u="yes-here",y=new class{constructor(){this.bottomSheet=new s.Subject,this.$dismiss=new s.Subject,this.bottomSheet.pipe(s.switchMap(t=>s.forkJoin([s.fromEvent(window,u).pipe(s.takeUntil(s.timer(0)),s.map(e=>e.detail.sheet),s.defaultIfEmpty(void 0)),s.of(t).pipe(s.tap(()=>{window.dispatchEvent(new CustomEvent(d,{detail:{uid:t.uid??t.component.tagName}}))}))])),s.map(([t,e])=>(t||(t=document.createElement("schmancy-sheet"),document.body.appendChild(t)),t.setAttribute("uid",e.uid??e.component.tagName),t.setAttribute("position",e.position??"side"),t.setAttribute("allowOverlyDismiss",e.allowOverlyDismiss===!1?"false":"true"),e.title&&t.setAttribute("title",e.title),e.persist&&t.setAttribute("persist",e.persist??!1),e.header&&t.setAttribute("header",e.header),document.body.style.overflow="hidden",{target:e,sheet:t})),s.delay(20),s.filter(({target:t,sheet:e})=>{var i,n;return!t.persist||!((n=(i=e==null?void 0:e.shadowRoot)==null?void 0:i.querySelector("slot"))!=null&&n.assignedElements().find(r=>r.tagName===t.component.tagName))||(e==null||e.setAttribute("open","true"),!1)}),s.tap(({target:t,sheet:e})=>{e==null||e.appendChild(t.component)}),s.delay(1),s.tap(({sheet:t})=>{t==null||t.setAttribute("open","true")}),s.tap(({sheet:t})=>{s.fromEvent(t,"close").pipe(s.take(1)).pipe(s.delay(300)).subscribe(e=>{const i=e.target;i!=null&&i.persist||(i==null||i.remove()),document.body.style.overflow="auto"})})).subscribe(),this.$dismiss.pipe(s.mergeMap(t=>s.forkJoin([s.fromEvent(window,u).pipe(s.takeUntil(s.timer(100)),s.map(e=>e.detail.sheet),s.defaultIfEmpty(void 0)),s.of(t).pipe(s.tap(()=>{window.dispatchEvent(new CustomEvent(d,{detail:{uid:t}}))}))])),s.tap(([t])=>{t==null||t.closeSheet()})).subscribe()}dismiss(t){this.$dismiss.next(t)}open(t){this.bottomSheet.next(t)}};var O=Object.defineProperty,A=Object.getOwnPropertyDescriptor,h=(t,e,i,n)=>{for(var r,o=n>1?void 0:n?A(e,i):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(n?r(e,i,o):r(o))||o);return n&&o&&O(e,i,o),o};let l=class extends S.$LitElement(":host{--overlay-color: rgba(0, 0, 0, .7);--transition-duration: .3s;--sheet-radius: 0;--max-height: 100vh}.sheet{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;display:flex;visibility:visible;transition:visibility var(--transition-duration) ease-in-out}.sheet[aria-hidden=true]{visibility:hidden;pointer-events:none}.sheet[aria-hidden=true] .content{transform:translateY(100%)}.sheet[aria-hidden=true] .content[data-position=side]{transform:translate(100%)}.sheet[aria-hidden=true] .overlay{opacity:0}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--overlay-color);opacity:.4;transition:opacity var(--transition-duration) ease-in-out}.content{position:relative;z-index:1;display:flex;flex-direction:column;background:#fff;transition:transform var(--transition-duration) ease-in-out}.content[data-position=side]{height:100%;margin-left:auto;min-width:320px;max-width:90vw}.content[data-position=bottom]{width:100%;margin-top:auto;border-radius:16px 16px 0 0;max-height:90vh}.content-body{flex:1;overflow-y:auto;padding:1rem}"){constructor(){super(...arguments),this.open=!1,this.header="visible",this.position=b.Side,this.persist=!1,this.allowOverlayDismiss=!0,this.title="",this.focusAttribute="autofocus",this.lastFocusedElement=null,this.handleFocusIn=t=>{var e;(e=this.sheet)!=null&&e.contains(t.target)||this.focus()}}onOpenChange(t,e){var i;this.setIsSheetShown(e),e?(this.lastFocusedElement=document.activeElement,this.addFocusTrap(),this.focus()):(this.removeFocusTrap(),(i=this.lastFocusedElement)==null||i.focus(),this.lastFocusedElement=null)}connectedCallback(){super.connectedCallback(),this.setupEventListeners()}disconnectedCallback(){super.disconnectedCallback(),this.disconnecting.next(!0)}setupEventListeners(){const t=s.fromEvent(window,"popstate").pipe(s.tap(n=>{n.preventDefault(),this.closeSheet()})),e=s.fromEvent(window,"keyup").pipe(s.tap(n=>{n.key!=="Escape"||this.sheetContainsFocus()||y.dismiss(this.uid)})),i=s.fromEvent(window,d).pipe(s.tap(n=>{n.detail.uid===this.uid&&this.announcePresence()}));s.merge(t,e,i).pipe(s.takeUntil(this.disconnecting)).subscribe()}sheetContainsFocus(){var t;return((t=this.sheet)==null?void 0:t.contains(document.activeElement))??!1}announcePresence(){this.dispatchEvent(new CustomEvent(u,{detail:{sheet:this},bubbles:!0,composed:!0}))}addFocusTrap(){document.addEventListener("focusin",this.handleFocusIn)}removeFocusTrap(){document.removeEventListener("focusin",this.handleFocusIn)}setIsSheetShown(t){var e,i;(e=this.sheet)==null||e.setAttribute("aria-hidden",String(!t)),(i=this.sheet)==null||i.setAttribute("aria-modal",String(t))}closeSheet(){this.open=!1,this.dispatchEvent(new CustomEvent("close"))}getFocusElement(){const t=`[${this.focusAttribute}]`;return this.assignedElements.find(e=>e.matches(t)||e.querySelector(t))??null}focus(){var t;(t=this.getFocusElement())==null||t.focus()}render(){return p.html`
|
|
30
|
+
<div class="sheet" role="dialog" aria-labelledby="sheet-title" aria-hidden="true" aria-modal="false">
|
|
31
|
+
<div class="overlay" @click=${()=>this.allowOverlayDismiss&&y.dismiss(this.uid)}></div>
|
|
32
|
+
|
|
33
|
+
<schmancy-sheet-content class="content" data-position=${this.position}>
|
|
34
|
+
<schmancy-sheet-header
|
|
35
|
+
id="sheet-title"
|
|
36
|
+
.hidden=${this.header==="hidden"}
|
|
37
|
+
title=${this.title}
|
|
38
|
+
></schmancy-sheet-header>
|
|
39
|
+
|
|
40
|
+
<section class="content-body">
|
|
41
|
+
<slot></slot>
|
|
42
|
+
</section>
|
|
43
|
+
</schmancy-sheet-content>
|
|
44
|
+
</div>
|
|
45
|
+
`}};h([c.property({type:String,reflect:!0})],l.prototype,"uid",2),h([c.property({type:Boolean,reflect:!0})],l.prototype,"open",2),h([c.property({type:String,reflect:!0})],l.prototype,"header",2),h([c.property({type:String,reflect:!0})],l.prototype,"position",2),h([c.property({type:Boolean,reflect:!0})],l.prototype,"persist",2),h([c.property({type:Boolean,reflect:!0})],l.prototype,"allowOverlayDismiss",2),h([c.property({type:String,reflect:!0})],l.prototype,"title",2),h([c.query(".sheet")],l.prototype,"sheet",2),h([c.queryAssignedElements({flatten:!0})],l.prototype,"assignedElements",2),h([c.property()],l.prototype,"focusAttribute",2),h([g("open")],l.prototype,"onOpenChange",1),l=h([c.customElement("schmancy-sheet")],l),exports.SchmancySheetPosition=b,exports.SheetHereMorty=u,exports.SheetWhereAreYouRicky=d,exports.hook=g,exports.sheet=y;
|
|
46
|
+
//# sourceMappingURL=sheet-u7gTdCVC.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"sheet-u7gTdCVC.cjs","sources":["../src/sheet/header.ts","../src/sheet/hook.ts","../src/sheet/sheet-content.ts","../src/sheet/sheet.service.ts","../src/sheet/sheet.ts"],"sourcesContent":["import { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\n@customElement('schmancy-sheet-header')\nexport default class SchmancySheetHeader extends TailwindElement(css`\n\t:host {\n\t\tinset: 0;\n\t\tdisplay: block;\n\t\tpadding-bottom: 16px;\n\t}\n`) {\n\t@property() title: string\n\trender() {\n\t\tconst classes = {\n\t\t\tabsolute: this.title.length === 0,\n\t\t\trelative: this.title.length > 0,\n\t\t}\n\t\treturn html`\n\t\t\t<schmancy-grid class=\"${this.classMap(classes)}\" align=\"center\" justify=\"stretch\" cols=\"auto 1fr auto\">\n\t\t\t\t<slot name=\"back\">\n\t\t\t\t\t<schmancy-button\n\t\t\t\t\t\t@click=${() => {\n\t\t\t\t\t\t\tthis.dispatchEvent(\n\t\t\t\t\t\t\t\tnew CustomEvent('sheetDismiss', {\n\t\t\t\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\t\t\t\tcomposed: true,\n\t\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<span class=\"text-[24px]\">← </span>\n\t\t\t\t\t</schmancy-button>\n\t\t\t\t</slot>\n\t\t\t\t<schmancy-typography transform=\"capitalize\" type=\"headline\" token=\"lg\"> ${this.title} </schmancy-typography>\n\t\t\t\t<slot name=\"actions\">\n\t\t\t\t\t<schmancy-button\n\t\t\t\t\t\t@click=${() => {\n\t\t\t\t\t\t\tthis.dispatchEvent(\n\t\t\t\t\t\t\t\tnew CustomEvent('sheetDismiss', {\n\t\t\t\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\t\t\t\tcomposed: true,\n\t\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<span class=\"text-[24px]\">✕</span>\n\t\t\t\t\t</schmancy-button>\n\t\t\t\t</slot>\n\t\t\t</schmancy-grid>\n\t\t`\n\t}\n}\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-sheet-header': SchmancySheetHeader\n\t}\n}\n","// @watch decorator\n//\n// Runs when an observed property changes, e.g. @property or @state, but before the component updates.\n//\n// To wait for an update to complete after a change occurs, use `await this.updateComplete` in the handler. To start\n// watching after the initial update/render, use `{ waitUntilFirstUpdate: true }` or `this.hasUpdated` in the handler.\n//\n// Usage:\n//\n// @watch('propName')\n// handlePropChange(oldValue, newValue) {\n// ...\n// }\n//\ninterface WatchOptions {\n waitUntilFirstUpdate?: boolean\n}\n\nexport function hook(propName: string, options?: WatchOptions) {\n return (protoOrDescriptor: any, name: string): any => {\n const { willUpdate } = protoOrDescriptor\n\n options = Object.assign({ waitUntilFirstUpdate: false }, options) as WatchOptions\n\n protoOrDescriptor.willUpdate = function (changedProps: Map<string, any>) {\n willUpdate.call(this, changedProps)\n\n if (changedProps.has(propName)) {\n const oldValue = changedProps.get(propName)\n const newValue = this[propName]\n\n if (oldValue !== newValue) {\n if (!options?.waitUntilFirstUpdate || this.hasUpdated) {\n this[name].call(this, oldValue, newValue)\n }\n }\n }\n }\n }\n}\n","import { TailwindElement } from '@mixins/index'\nimport { html } from 'lit'\nimport { customElement } from 'lit/decorators.js'\n\n@customElement('schmancy-sheet-content')\nexport default class SchmancySheetContent extends TailwindElement() {\n\trender() {\n\t\treturn html`\n\t\t\t<div tabindex=\"0\">\n\t\t\t\t<slot></slot>\n\t\t\t</div>\n\t\t`\n\t}\n}\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-sheet-content': SchmancySheetContent\n\t}\n}\n","import {\n\tdefaultIfEmpty,\n\tdelay,\n\tfilter,\n\tforkJoin,\n\tfromEvent,\n\tmap,\n\tmergeMap,\n\tof,\n\tSubject,\n\tswitchMap,\n\ttake,\n\ttakeUntil,\n\ttap,\n\ttimer,\n} from 'rxjs'\nimport SchmancySheet from './sheet'\n\nexport enum SchmancySheetPosition {\n\tSide = 'side',\n\tBottom = 'bottom',\n\t/**\n\t * @deprecated use bottom instead\n\t */\n\tBottomCenter = 'bottom-center',\n\t/**\n\t * @deprecated use side instead\n\t */\n\tTopRight = 'top-right',\n\t/**\n\t * @deprecated use side instead\n\t */\n\tBottomRight = 'bottom-right',\n}\n\ntype BottomSheeetTarget = {\n\tcomponent: HTMLElement\n\tuid?: string\n\tposition?: SchmancySheetPosition\n\tpersist?: boolean\n\tclose?: () => void\n\tallowOverlyDismiss?: boolean\n\ttitle?: string\n\theader?: 'hidden' | 'visible'\n}\n\n// Events for communication between bottom-sheet component and bottom-sheet.service\nexport type SheetWhereAreYouRickyEvent = CustomEvent<{\n\tuid: string\n}>\nexport const SheetWhereAreYouRicky = 'are-you-there-sheet'\n\nexport type SheetHereMortyEvent = CustomEvent<{\n\tsheet: SchmancySheet\n}>\nexport const SheetHereMorty = 'yes-here'\nclass BottomSheetService {\n\tbottomSheet = new Subject<BottomSheeetTarget>()\n\t$dismiss = new Subject<string>()\n\tconstructor() {\n\t\tthis.bottomSheet\n\t\t\t.pipe(\n\t\t\t\tswitchMap(target =>\n\t\t\t\t\tforkJoin([\n\t\t\t\t\t\tfromEvent<SheetHereMortyEvent>(window, SheetHereMorty).pipe(\n\t\t\t\t\t\t\ttakeUntil(timer(0)),\n\t\t\t\t\t\t\tmap(e => e.detail.sheet),\n\t\t\t\t\t\t\tdefaultIfEmpty(undefined),\n\t\t\t\t\t\t),\n\t\t\t\t\t\tof(target).pipe(\n\t\t\t\t\t\t\ttap(() => {\n\t\t\t\t\t\t\t\twindow.dispatchEvent(\n\t\t\t\t\t\t\t\t\tnew CustomEvent(SheetWhereAreYouRicky, {\n\t\t\t\t\t\t\t\t\t\tdetail: { uid: target.uid ?? target.component.tagName },\n\t\t\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t),\n\t\t\t\t\t]),\n\t\t\t\t),\n\t\t\t\tmap(([sheet, target]) => {\n\t\t\t\t\tconsole.log(sheet, target)\n\t\t\t\t\tif (!sheet) {\n\t\t\t\t\t\t// if sheet is not found, create it\n\t\t\t\t\t\tsheet = document.createElement('schmancy-sheet')\n\t\t\t\t\t\tdocument.body.appendChild(sheet)\n\t\t\t\t\t}\n\t\t\t\t\tsheet.setAttribute('uid', target.uid ?? target.component.tagName)\n\t\t\t\t\tsheet.setAttribute('position', target.position ?? SchmancySheetPosition.Side)\n\t\t\t\t\tsheet.setAttribute('allowOverlyDismiss', target.allowOverlyDismiss === false ? 'false' : 'true')\n\t\t\t\t\ttarget.title && sheet.setAttribute('title', target.title)\n\t\t\t\t\ttarget.persist && sheet.setAttribute('persist', target.persist ?? false)\n\t\t\t\t\ttarget.header && sheet.setAttribute('header', target.header)\n\t\t\t\t\tdocument.body.style.overflow = 'hidden' // lock the scroll of the host\n\t\t\t\t\treturn { target, sheet }\n\t\t\t\t}),\n\t\t\t\tdelay(20),\n\t\t\t\tfilter(({ target, sheet }) => {\n\t\t\t\t\t// if the sheet has already the component, just show it\n\t\t\t\t\tif (\n\t\t\t\t\t\ttarget.persist &&\n\t\t\t\t\t\tsheet?.shadowRoot\n\t\t\t\t\t\t\t?.querySelector('slot')\n\t\t\t\t\t\t\t?.assignedElements()\n\t\t\t\t\t\t\t.find(e => e.tagName === target.component.tagName)\n\t\t\t\t\t) {\n\t\t\t\t\t\tsheet?.setAttribute('open', 'true')\n\t\t\t\t\t\treturn false\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn true // if the sheet does not have the component, continue to the next step\n\t\t\t\t\t}\n\t\t\t\t}),\n\t\t\t\ttap(({ target, sheet }) => {\n\t\t\t\t\tsheet?.appendChild(target.component)\n\t\t\t\t}),\n\t\t\t\tdelay(1),\n\t\t\t\ttap(({ sheet }) => {\n\t\t\t\t\tsheet?.setAttribute('open', 'true')\n\t\t\t\t}),\n\t\t\t\ttap(({ sheet }) => {\n\t\t\t\t\tfromEvent<CustomEvent>(sheet, 'close')\n\t\t\t\t\t\t.pipe(take(1))\n\t\t\t\t\t\t.pipe(delay(300))\n\t\t\t\t\t\t.subscribe(e => {\n\t\t\t\t\t\t\tconst target = e.target as SchmancySheet\n\t\t\t\t\t\t\tconsole.log(target)\n\n\t\t\t\t\t\t\tif (!target?.persist) target?.remove()\n\t\t\t\t\t\t\tdocument.body.style.overflow = 'auto' // unlock the scroll of the host\n\t\t\t\t\t\t})\n\t\t\t\t}),\n\t\t\t)\n\t\t\t.subscribe()\n\n\t\tthis.$dismiss\n\t\t\t.pipe(\n\t\t\t\tmergeMap(uid =>\n\t\t\t\t\tforkJoin([\n\t\t\t\t\t\tfromEvent<SheetHereMortyEvent>(window, SheetHereMorty).pipe(\n\t\t\t\t\t\t\ttakeUntil(timer(100)), // Some people say why 10? I say why not?\n\t\t\t\t\t\t\tmap(e => e.detail.sheet),\n\t\t\t\t\t\t\tdefaultIfEmpty(undefined),\n\t\t\t\t\t\t),\n\t\t\t\t\t\tof(uid).pipe(\n\t\t\t\t\t\t\ttap(() => {\n\t\t\t\t\t\t\t\twindow.dispatchEvent(new CustomEvent(SheetWhereAreYouRicky, { detail: { uid } }))\n\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t),\n\t\t\t\t\t]),\n\t\t\t\t),\n\t\t\t\ttap(([sheet]) => {\n\t\t\t\t\tsheet?.closeSheet()\n\t\t\t\t}),\n\t\t\t)\n\t\t\t.subscribe()\n\t}\n\n\tdismiss(uid: string) {\n\t\tthis.$dismiss.next(uid)\n\t}\n\n\topen(target: BottomSheeetTarget) {\n\t\tthis.bottomSheet.next(target)\n\t}\n}\nexport const sheet = new BottomSheetService()\n","import { $LitElement } from '@mixins/index'\nimport { html } from 'lit'\nimport { customElement, property, query, queryAssignedElements } from 'lit/decorators.js'\nimport { fromEvent, merge, takeUntil, tap } from 'rxjs'\nimport { hook } from './hook'\nimport style from './sheet.scss?inline'\nimport {\n\tSchmancySheetPosition,\n\tSheetHereMorty,\n\tSheetWhereAreYouRicky,\n\tSheetWhereAreYouRickyEvent,\n\tsheet,\n} from './sheet.service'\n\n@customElement('schmancy-sheet')\nexport default class SchmancySheet extends $LitElement(style) {\n\t@property({ type: String, reflect: true }) uid!: string\n\t@property({ type: Boolean, reflect: true }) open = false\n\t@property({ type: String, reflect: true }) header: 'hidden' | 'visible' = 'visible'\n\t@property({ type: String, reflect: true }) position: SchmancySheetPosition = SchmancySheetPosition.Side\n\t@property({ type: Boolean, reflect: true }) persist = false\n\t@property({ type: Boolean, reflect: true }) allowOverlayDismiss = true\n\t@property({ type: String, reflect: true }) title = ''\n\n\t@query('.sheet') private sheet!: HTMLElement\n\t@queryAssignedElements({ flatten: true }) private assignedElements!: HTMLElement[]\n\n\t@property() focusAttribute = 'autofocus'\n\tprivate lastFocusedElement: HTMLElement | null = null\n\n\t@hook('open')\n\tonOpenChange(_oldValue: boolean, newValue: boolean) {\n\t\tthis.setIsSheetShown(newValue)\n\n\t\tif (newValue) {\n\t\t\tthis.lastFocusedElement = document.activeElement as HTMLElement\n\t\t\tthis.addFocusTrap()\n\t\t\tthis.focus()\n\t\t} else {\n\t\t\tthis.removeFocusTrap()\n\t\t\tthis.lastFocusedElement?.focus()\n\t\t\tthis.lastFocusedElement = null\n\t\t}\n\t}\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\t\tthis.setupEventListeners()\n\t}\n\n\tdisconnectedCallback() {\n\t\tsuper.disconnectedCallback()\n\t\tthis.disconnecting.next(true)\n\t}\n\n\tprivate setupEventListeners() {\n\t\t// Handle browser back button\n\t\tconst popState$ = fromEvent<PopStateEvent>(window, 'popstate').pipe(\n\t\t\ttap(e => {\n\t\t\t\te.preventDefault()\n\t\t\t\tthis.closeSheet()\n\t\t\t}),\n\t\t)\n\n\t\t// Handle ESC key\n\t\tconst keyUp$ = fromEvent<KeyboardEvent>(window, 'keyup').pipe(\n\t\t\ttap(event => {\n\t\t\t\tif (event.key === 'Escape' && !this.sheetContainsFocus()) {\n\t\t\t\t\tsheet.dismiss(this.uid)\n\t\t\t\t}\n\t\t\t}),\n\t\t)\n\n\t\t// Handle inter-component communication\n\t\tconst rickyComm$ = fromEvent<SheetWhereAreYouRickyEvent>(window, SheetWhereAreYouRicky).pipe(\n\t\t\ttap(e => {\n\t\t\t\tif (e.detail.uid === this.uid) this.announcePresence()\n\t\t\t}),\n\t\t)\n\n\t\tmerge(popState$, keyUp$, rickyComm$).pipe(takeUntil(this.disconnecting)).subscribe()\n\t}\n\n\tprivate sheetContainsFocus(): boolean {\n\t\treturn this.sheet?.contains(document.activeElement) ?? false\n\t}\n\n\tprivate announcePresence() {\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent(SheetHereMorty, {\n\t\t\t\tdetail: { sheet: this },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t}),\n\t\t)\n\t}\n\n\tprivate addFocusTrap() {\n\t\tdocument.addEventListener('focusin', this.handleFocusIn)\n\t}\n\n\tprivate removeFocusTrap() {\n\t\tdocument.removeEventListener('focusin', this.handleFocusIn)\n\t}\n\n\tprivate handleFocusIn = (e: Event) => {\n\t\tif (!this.sheet?.contains(e.target as Node)) {\n\t\t\tthis.focus()\n\t\t}\n\t}\n\n\tsetIsSheetShown(isShown: boolean) {\n\t\tthis.sheet?.setAttribute('aria-hidden', String(!isShown))\n\t\tthis.sheet?.setAttribute('aria-modal', String(isShown))\n\t}\n\n\tcloseSheet() {\n\t\tthis.open = false\n\t\tthis.dispatchEvent(new CustomEvent('close'))\n\t}\n\n\tprivate getFocusElement(): HTMLElement | null {\n\t\tconst selector = `[${this.focusAttribute}]`\n\t\treturn (this.assignedElements.find(el => el.matches(selector) || el.querySelector(selector)) as HTMLElement) ?? null\n\t}\n\n\toverride focus() {\n\t\tthis.getFocusElement()?.focus()\n\t}\n\n\trender() {\n\t\treturn html`\n\t\t\t<div class=\"sheet\" role=\"dialog\" aria-labelledby=\"sheet-title\" aria-hidden=\"true\" aria-modal=\"false\">\n\t\t\t\t<div class=\"overlay\" @click=${() => this.allowOverlayDismiss && sheet.dismiss(this.uid)}></div>\n\n\t\t\t\t<schmancy-sheet-content class=\"content\" data-position=${this.position}>\n\t\t\t\t\t<schmancy-sheet-header\n\t\t\t\t\t\tid=\"sheet-title\"\n\t\t\t\t\t\t.hidden=${this.header === 'hidden'}\n\t\t\t\t\t\ttitle=${this.title}\n\t\t\t\t\t></schmancy-sheet-header>\n\n\t\t\t\t\t<section class=\"content-body\">\n\t\t\t\t\t\t<slot></slot>\n\t\t\t\t\t</section>\n\t\t\t\t</schmancy-sheet-content>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-sheet': SchmancySheet\n\t}\n}\n"],"names":["SchmancySheetHeader","TailwindElement","css","classes","absolute","this","title","length","relative","html","classMap","dispatchEvent","CustomEvent","bubbles","composed","hook","propName","options","protoOrDescriptor","name","willUpdate","Object","assign","waitUntilFirstUpdate","changedProps","call","has","oldValue","get","newValue","hasUpdated","__decorateClass","property","prototype","customElement","SchmancySheetContent","SchmancySheetPosition","SheetWhereAreYouRicky","SheetHereMorty","sheet","bottomSheet","Subject","$dismiss","pipe","switchMap","forkJoin","fromEvent","window","takeUntil","timer","map","e","detail","defaultIfEmpty","undefined","of","target","tap","uid","component","tagName","document","createElement","body","appendChild","setAttribute","position","allowOverlyDismiss","persist","header","style","overflow","delay","filter","shadowRoot","querySelector","assignedElements","find","take","subscribe","remove","mergeMap","closeSheet","next","SchmancySheet","$LitElement","super","arguments","open","Side","allowOverlayDismiss","focusAttribute","lastFocusedElement","handleFocusIn","contains","focus","_oldValue","setIsSheetShown","activeElement","addFocusTrap","removeFocusTrap","connectedCallback","setupEventListeners","disconnectedCallback","disconnecting","popState$","preventDefault","keyUp$","event","key","sheetContainsFocus","dismiss","rickyComm$","announcePresence","merge","addEventListener","removeEventListener","isShown","String","selector","el","matches","getFocusElement","type","reflect","Boolean","query","queryAssignedElements","flatten"],"mappings":"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"}
|
package/dist/sheet.cjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./sheet-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./sheet-u7gTdCVC.cjs");exports.SchmancySheetPosition=e.SchmancySheetPosition,exports.SheetHereMorty=e.SheetHereMorty,exports.SheetWhereAreYouRicky=e.SheetWhereAreYouRicky,exports.hook=e.hook,exports.sheet=e.sheet;
|
|
2
2
|
//# sourceMappingURL=sheet.cjs.map
|
package/dist/sheet.js
CHANGED
|
@@ -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-DzAZO77V.js";
|
|
5
|
+
import "./tailwind.mixin-C0_Bt1Xe.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-C-2Dtp0w.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"slider-Dy2X0oq3.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-C-2Dtp0w.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,4 +1,4 @@
|
|
|
1
|
-
"use strict";const m=require("rxjs");require("lit/directives/class-map.js"),require("lit/directives/style-map.js");const p=require("./litElement.mixin-
|
|
1
|
+
"use strict";const m=require("rxjs");require("lit/directives/class-map.js"),require("lit/directives/style-map.js");const p=require("./litElement.mixin-CcvIvqxb.cjs");require("./tailwind.mixin-BZjCpGfl.cjs");const d=require("lit"),o=require("lit/decorators.js"),S=require("lit/directives/cache.js"),f=require("rxjs/operators");var v=Object.defineProperty,b=Object.getOwnPropertyDescriptor,c=(s,e,i,l)=>{for(var r,t=l>1?void 0:l?b(e,i):e,n=s.length-1;n>=0;n--)(r=s[n])&&(t=(l?r(e,i,t):r(t))||t);return l&&t&&v(e,i,t),t};exports.SchmancySlide=class extends p.$LitElement(d.css`
|
|
2
2
|
:host {
|
|
3
3
|
display: block;
|
|
4
4
|
scroll-snap-align: center; /* If your slider uses scroll-snap */
|
|
@@ -80,4 +80,4 @@
|
|
|
80
80
|
</div>
|
|
81
81
|
</div>
|
|
82
82
|
`}},a([o.state()],exports.SchmancySlider.prototype,"selectedIndex",2),a([o.property({type:Boolean})],exports.SchmancySlider.prototype,"showArrows",2),a([o.query("#slider")],exports.SchmancySlider.prototype,"slider",2),a([o.query("slot")],exports.SchmancySlider.prototype,"defaultSlot",2),exports.SchmancySlider=a([o.customElement("schmancy-slider")],exports.SchmancySlider);
|
|
83
|
-
//# sourceMappingURL=slider-
|
|
83
|
+
//# sourceMappingURL=slider-NBL_wss9.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"slider-CjjoJTVy.cjs","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","super","arguments","this","type","src","alt","controls","autoplay","loop","muted","fit","render","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","onPrevClick","map","_","isSelected","state","query"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"slider-NBL_wss9.cjs","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","super","arguments","this","type","src","alt","controls","autoplay","loop","muted","fit","render","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","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-NBL_wss9.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-BmmjcnrT.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-C0_Bt1Xe.js";
|
|
8
8
|
import { css as y, html as f } from "lit";
|
|
9
9
|
import { customElement as h, property as p } from "lit/decorators.js";
|
|
10
10
|
var v = Object.defineProperty, g = Object.getOwnPropertyDescriptor;
|
|
@@ -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([h("schmancy-spinner")], a);
|
|
77
|
-
//# sourceMappingURL=spinner-
|
|
77
|
+
//# sourceMappingURL=spinner-DyhJHfNo.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"spinner-
|
|
1
|
+
{"version":3,"file":"spinner-DyhJHfNo.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\">\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,eAAA,CAAA,GACMb;;;;;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;"}
|