@swiftwc/ui 0.0.0-dev.5 → 0.0.0-dev.51
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/README.md +15 -0
- package/generated/buses/alert-dialog.d.ts +2 -0
- package/generated/buses/alert-dialog.js +1 -0
- package/generated/buses/confirmation-dialog.d.ts +2 -0
- package/generated/buses/confirmation-dialog.js +1 -0
- package/generated/buses/index.d.ts +6 -0
- package/generated/buses/index.js +6 -0
- package/generated/buses/lifecycle-observer.d.ts +2 -0
- package/generated/buses/lifecycle-observer.js +1 -0
- package/generated/client/index.d.ts +22 -4
- package/generated/client/index.js +219 -181
- package/generated/components/alert-dialog.d.ts +8 -0
- package/generated/components/alert-dialog.js +99 -0
- package/generated/components/body-view.js +5 -2
- package/generated/components/bordered-button.d.ts +17 -0
- package/generated/components/bordered-button.js +56 -0
- package/generated/components/bordered-prominent-button.d.ts +17 -0
- package/generated/components/bordered-prominent-button.js +56 -0
- package/generated/components/borderless-button.d.ts +12 -4
- package/generated/components/borderless-button.js +47 -16
- package/generated/components/confirmation-dialog.d.ts +9 -0
- package/generated/components/confirmation-dialog.js +113 -0
- package/generated/components/content-unavailable-view.d.ts +24 -0
- package/generated/components/content-unavailable-view.js +81 -0
- package/generated/components/date-picker.d.ts +36 -0
- package/generated/components/date-picker.js +461 -0
- package/generated/components/disclosure-group.d.ts +9 -7
- package/generated/components/disclosure-group.js +51 -65
- package/generated/components/fine-tooltip.d.ts +7 -0
- package/generated/components/fine-tooltip.js +107 -0
- package/generated/components/form-view.d.ts +9 -0
- package/generated/components/form-view.js +63 -0
- package/generated/components/glass-button.d.ts +16 -0
- package/generated/components/glass-button.js +53 -0
- package/generated/components/glass-prominent-button.d.ts +16 -0
- package/generated/components/glass-prominent-button.js +53 -0
- package/generated/components/h-stack.d.ts +10 -0
- package/generated/components/h-stack.js +19 -0
- package/generated/components/image-view.d.ts +9 -0
- package/generated/components/image-view.js +46 -0
- package/generated/components/index.d.ts +40 -10
- package/generated/components/index.js +40 -15
- package/generated/components/label-view.d.ts +9 -0
- package/generated/components/label-view.js +51 -0
- package/generated/components/list-view.d.ts +8 -0
- package/generated/components/list-view.js +32 -0
- package/generated/components/menu-view.d.ts +12 -0
- package/generated/components/menu-view.js +142 -0
- package/generated/components/navigation-large-title.d.ts +6 -0
- package/generated/components/navigation-large-title.js +181 -0
- package/generated/components/navigation-link.d.ts +10 -0
- package/generated/components/navigation-link.js +25 -0
- package/generated/components/navigation-split-view.d.ts +7 -2
- package/generated/components/navigation-split-view.js +19 -3
- package/generated/components/navigation-stack.d.ts +6 -2
- package/generated/components/navigation-stack.js +23 -59
- package/generated/components/navigation-title.d.ts +8 -0
- package/generated/components/navigation-title.js +50 -0
- package/generated/components/picker-view.d.ts +31 -0
- package/generated/components/picker-view.js +764 -0
- package/generated/components/plain-button.d.ts +7 -0
- package/generated/components/plain-button.js +22 -0
- package/generated/components/progress-view.d.ts +13 -0
- package/generated/components/progress-view.js +120 -0
- package/generated/components/screen-view.d.ts +1 -1
- package/generated/components/screen-view.js +4 -2
- package/generated/components/scroll-view-proxy.d.ts +8 -0
- package/generated/components/scroll-view-proxy.js +17 -0
- package/generated/components/scroll-view.d.ts +4 -2
- package/generated/components/scroll-view.js +179 -64
- package/generated/components/search-view.d.ts +7 -0
- package/generated/components/search-view.js +30 -0
- package/generated/components/section-view.d.ts +9 -0
- package/generated/components/section-view.js +85 -0
- package/generated/components/sheet-view.d.ts +3 -4
- package/generated/components/sheet-view.js +53 -17
- package/generated/components/sidebar-toggle.d.ts +1 -1
- package/generated/components/sidebar-toggle.js +76 -72
- package/generated/components/sidebar-view.d.ts +2 -4
- package/generated/components/sidebar-view.js +25 -17
- package/generated/components/sticky-container.d.ts +6 -0
- package/generated/components/sticky-container.js +26 -0
- package/generated/components/tab-bar.d.ts +5 -4
- package/generated/components/tab-bar.js +34 -17
- package/generated/components/tab-item.d.ts +4 -3
- package/generated/components/tab-item.js +125 -29
- package/generated/components/tab-view.d.ts +17 -2
- package/generated/components/tab-view.js +252 -17
- package/generated/components/table-view.d.ts +12 -0
- package/generated/components/table-view.js +153 -0
- package/generated/components/text-field.d.ts +29 -0
- package/generated/components/text-field.js +496 -0
- package/generated/components/tool-bar-item-group.d.ts +5 -0
- package/generated/components/tool-bar-item-group.js +28 -0
- package/generated/components/tool-bar-item.d.ts +8 -0
- package/generated/components/tool-bar-item.js +66 -0
- package/generated/components/tool-bar.d.ts +19 -0
- package/generated/components/tool-bar.js +93 -0
- package/generated/components/v-keyboard.d.ts +4 -0
- package/generated/components/v-keyboard.js +72 -67
- package/generated/components/v-stack.d.ts +13 -0
- package/generated/components/v-stack.js +22 -0
- package/generated/css/index.css +8548 -0
- package/generated/events/alert-dialog.d.ts +8 -0
- package/generated/events/confirmation-dialog.d.ts +9 -0
- package/generated/events/confirmation-dialog.js +1 -0
- package/generated/events/date-picker.d.ts +8 -0
- package/generated/events/date-picker.js +1 -0
- package/generated/events/index.d.ts +8 -0
- package/generated/events/index.js +8 -0
- package/generated/events/lifecycle-observer.d.ts +10 -0
- package/generated/events/lifecycle-observer.js +1 -0
- package/generated/events/picker-view.d.ts +15 -0
- package/generated/events/picker-view.js +1 -0
- package/generated/events/scroll-view.d.ts +10 -0
- package/generated/events/scroll-view.js +1 -0
- package/generated/events/tab-view.d.ts +28 -0
- package/generated/events/tab-view.js +1 -0
- package/generated/events/text-field.d.ts +8 -0
- package/generated/events/text-field.js +1 -0
- package/generated/i18n/index.d.ts +34 -0
- package/generated/i18n/index.js +167 -0
- package/generated/i18n/locales/el.d.ts +16 -0
- package/generated/i18n/locales/el.js +16 -0
- package/generated/i18n/locales/en.d.ts +16 -0
- package/generated/i18n/locales/en.js +16 -0
- package/generated/i18n/locales/index.d.ts +4 -0
- package/generated/i18n/locales/index.js +4 -0
- package/generated/internal/class/cleanup-registry.d.ts +5 -0
- package/generated/internal/class/cleanup-registry.js +38 -0
- package/generated/internal/class/css-style-observer.d.ts +8 -0
- package/generated/internal/class/css-style-observer.js +26 -0
- package/generated/internal/class/form-associated-base.d.ts +16 -0
- package/generated/internal/class/form-associated-base.js +78 -0
- package/generated/internal/class/mutation-observer-set.d.ts +9 -0
- package/generated/internal/class/mutation-observer-set.js +42 -0
- package/generated/internal/class/mutation-observer-singleton.d.ts +10 -0
- package/generated/internal/class/mutation-observer-singleton.js +64 -0
- package/generated/internal/class/navigation-path.d.ts +15 -0
- package/generated/internal/class/navigation-path.js +84 -0
- package/generated/internal/class/navigation-view.d.ts +8 -0
- package/generated/internal/class/navigation-view.js +72 -0
- package/generated/internal/class/resize-observer-singleton.d.ts +7 -0
- package/generated/internal/class/resize-observer-singleton.js +22 -0
- package/generated/internal/decorators/adaptive-slot.d.ts +1 -0
- package/generated/internal/decorators/adaptive-slot.js +50 -0
- package/generated/internal/decorators/custom-element.d.ts +5 -0
- package/generated/internal/decorators/custom-element.js +5 -0
- package/generated/internal/decorators/index.d.ts +6 -0
- package/generated/internal/decorators/index.js +6 -0
- package/generated/internal/decorators/microtask-on-connected.d.ts +39 -0
- package/generated/internal/decorators/microtask-on-connected.js +67 -0
- package/generated/internal/privateNamespace.d.ts +14 -0
- package/generated/internal/privateNamespace.js +168 -0
- package/generated/internal/utils/add.d.ts +1 -0
- package/generated/internal/utils/add.js +7 -0
- package/generated/internal/utils/cash/ancestors.d.ts +1 -0
- package/generated/internal/utils/cash/ancestors.js +27 -0
- package/generated/internal/utils/cash/index.d.ts +23 -0
- package/generated/internal/utils/cash/index.js +25 -0
- package/generated/internal/utils/cash/next-all.d.ts +1 -0
- package/generated/internal/utils/cash/next-all.js +10 -0
- package/generated/internal/utils/cash/next.d.ts +1 -0
- package/generated/internal/utils/cash/next.js +9 -0
- package/generated/internal/utils/cash/prev-all.d.ts +1 -0
- package/generated/internal/utils/cash/prev-all.js +10 -0
- package/generated/internal/utils/cash/prev.d.ts +1 -0
- package/generated/internal/utils/cash/prev.js +9 -0
- package/generated/internal/utils/cash/prop.d.ts +18 -0
- package/generated/internal/utils/cash/prop.js +30 -0
- package/generated/internal/utils/cash/siblings.d.ts +1 -0
- package/generated/internal/utils/cash/siblings.js +10 -0
- package/generated/internal/utils/clamp.d.ts +1 -0
- package/generated/internal/utils/clamp.js +4 -0
- package/generated/internal/utils/compare-big-decimals.d.ts +1 -0
- package/generated/internal/utils/compare-big-decimals.js +90 -0
- package/generated/internal/utils/debounce.d.ts +1 -0
- package/generated/internal/utils/debounce.js +13 -0
- package/generated/internal/utils/dev-flags.d.ts +3 -0
- package/generated/internal/utils/dev-flags.js +5 -0
- package/generated/internal/utils/ensure-placeholder.d.ts +1 -0
- package/generated/internal/utils/ensure-placeholder.js +55 -0
- package/generated/internal/utils/frame.d.ts +1 -0
- package/generated/internal/utils/frame.js +6 -0
- package/generated/internal/utils/index.d.ts +21 -1
- package/generated/internal/utils/index.js +24 -1
- package/generated/internal/utils/is-inside.d.ts +1 -0
- package/generated/internal/utils/is-inside.js +4 -0
- package/generated/internal/utils/kebab-case.d.ts +1 -1
- package/generated/internal/utils/list-active.d.ts +7 -0
- package/generated/internal/utils/list-active.js +83 -0
- package/generated/internal/utils/microtask.d.ts +1 -0
- package/generated/internal/utils/microtask.js +3 -0
- package/generated/internal/utils/onoff.d.ts +45 -0
- package/generated/internal/utils/onoff.js +31 -0
- package/generated/internal/utils/render-label-icon.d.ts +2 -0
- package/generated/internal/utils/render-label-icon.js +19 -0
- package/generated/internal/utils/render-label-title.d.ts +2 -0
- package/generated/internal/utils/render-label-title.js +16 -0
- package/generated/internal/utils/render-label.d.ts +1 -0
- package/generated/internal/utils/render-label.js +19 -0
- package/generated/internal/utils/set.d.ts +1 -0
- package/generated/internal/utils/set.js +7 -0
- package/generated/internal/utils/sleep.d.ts +1 -0
- package/generated/internal/utils/sleep.js +3 -0
- package/generated/internal/utils/slow-hide-show.d.ts +1 -0
- package/generated/internal/utils/slow-hide-show.js +16 -0
- package/generated/internal/utils/timeout.d.ts +5 -0
- package/generated/internal/utils/timeout.js +16 -0
- package/generated/internal/utils/touch-glass.d.ts +7 -0
- package/generated/internal/utils/touch-glass.js +19 -0
- package/generated/namespace-browser/base.d.ts +45 -0
- package/generated/namespace-browser/base.js +115 -0
- package/generated/namespace-browser/index.d.ts +7 -0
- package/generated/namespace-browser/index.js +1 -0
- package/generated/snapshot/index.d.ts +4 -11
- package/generated/snapshot/index.js +55 -145
- package/package.json +33 -9
- package/scss/_components.scss +60 -13
- package/scss/_final.scss +1 -0
- package/scss/_functions.scss +10 -0
- package/scss/_mixins.scss +4 -169
- package/scss/_placeholders.scss +3 -0
- package/scss/_transitions.scss +22 -1
- package/scss/_utils.scss +9 -0
- package/scss/_vars.scss +143 -23
- package/scss/base/_layout.scss +40 -16
- package/scss/base/_reboot.scss +151 -15
- package/scss/base/_root.scss +348 -25
- package/scss/colors/_index.scss +788 -70
- package/scss/components/_alert-dialog.scss +111 -0
- package/scss/components/_body-view.scss +12 -3
- package/scss/components/_bordered-button.scss +57 -0
- package/scss/components/_bordered-prominent-button.scss +64 -0
- package/scss/components/_borderless-button.scss +36 -6
- package/scss/components/_confirmation-dialog.scss +102 -0
- package/scss/components/_content-unavailable-view.scss +54 -0
- package/scss/components/_date-picker.scss +30 -0
- package/scss/components/_detail-placeholder.scss +153 -0
- package/scss/components/_disclosure-group.scss +143 -48
- package/scss/components/_fine-tooltip.scss +84 -0
- package/scss/components/_form-view.scss +233 -0
- package/scss/components/_full-screen.scss +7 -5
- package/scss/components/_glass-button.scss +59 -0
- package/scss/components/_glass-prominent-button.scss +70 -0
- package/scss/components/_h-divider.scss +13 -0
- package/scss/components/_h-flex-stack.scss +23 -0
- package/scss/components/_h-stack.scss +29 -0
- package/scss/components/_image-view.scss +9 -0
- package/scss/components/_index.scss +235 -7
- package/scss/components/_label-view copy.scss.txt +420 -0
- package/scss/components/_label-view.scss +367 -0
- package/scss/components/_label-view.scss.txt +536 -0
- package/scss/components/_labeled-content.scss +9 -0
- package/scss/components/_list-view.scss +269 -0
- package/scss/components/_menu-view.scss +215 -0
- package/scss/components/_navigation-large-title.scss +27 -0
- package/scss/components/_navigation-split-view.scss +329 -269
- package/scss/components/_navigation-stack.scss +6 -6
- package/scss/components/_navigation-title.scss +10 -0
- package/scss/components/_picker-view.scss +131 -0
- package/scss/components/_plain-button.scss +18 -0
- package/scss/components/_progress-view.scss +98 -0
- package/scss/components/_scroll-view-proxy.scss +79 -0
- package/scss/components/_scroll-view-toolbars.scss +126 -0
- package/scss/components/_scroll-view.scss +114 -66
- package/scss/components/_search-view.scss +22 -0
- package/scss/components/_section-view.scss +119 -0
- package/scss/components/_sheet-view.scss +78 -35
- package/scss/components/_sidebar-toggle.scss +87 -27
- package/scss/components/_sidebar-view.scss +30 -40
- package/scss/components/_sticky-container.scss +42 -0
- package/scss/components/_tab-bar.scss +207 -84
- package/scss/components/_tab-item.scss +25 -0
- package/scss/components/_tab-view.scss +270 -126
- package/scss/components/_table-column.scss +54 -0
- package/scss/components/_table-row.scss +209 -0
- package/scss/components/_table-view.scss +226 -0
- package/scss/components/_text-field.scss +37 -0
- package/scss/components/_tool-bar-item-group.scss +30 -19
- package/scss/components/_tool-bar-item.scss +81 -71
- package/scss/components/_tool-bar.scss +126 -63
- package/scss/components/_v-divider.scss +13 -0
- package/scss/components/_v-flex-stack.scss +29 -0
- package/scss/components/_v-keyboard.scss +6 -4
- package/scss/components/_v-stack.scss +15 -9
- package/scss/final/_touch-glass.scss +91 -0
- package/scss/index.scss +6 -2
- package/scss/mixins/_button.scss +44 -0
- package/scss/mixins/_color.scss +16 -0
- package/scss/mixins/_dialog.scss +89 -0
- package/scss/mixins/_index.scss +453 -0
- package/scss/placeholders/_buttons.scss +117 -0
- package/scss/placeholders/_lists.scss +594 -0
- package/scss/transitions/_alert-dialog.scss +18 -0
- package/scss/transitions/_bwd.navbar.scss +3 -13
- package/scss/transitions/_bwd.scss +4 -20
- package/scss/transitions/_confirmation-dialog.scss +27 -0
- package/scss/transitions/_disclosure-group.scss +35 -0
- package/scss/transitions/_fine-tooltip.scss +21 -0
- package/scss/transitions/_fwd.navbar.scss +4 -9
- package/scss/transitions/_fwd.scss +4 -34
- package/scss/transitions/_glass-button.scss +12 -0
- package/scss/transitions/_glass-prominent-button.scss +12 -0
- package/scss/transitions/_index.scss +35 -143
- package/scss/transitions/_menu-view.scss +26 -0
- package/scss/transitions/_navigation-split-view.scss +23 -0
- package/scss/transitions/_progress-view.scss +23 -0
- package/scss/transitions/_sheet-view.scss +30 -0
- package/scss/transitions/_sidebar-view.scss +36 -0
- package/scss/transitions/_tab-bar.scss +20 -0
- package/scss/utils/_frame.scss +91 -0
- package/scss/utils/_index.scss +78 -0
- package/scss/utils/_scroll-view.scss +14 -0
- package/scss/utils/_spacing.scss +25 -0
- package/scss/utils/_stacks.scss +210 -0
- package/web-components.html-data/en.json +637 -0
- package/generated/components/bottom-bar.d.ts +0 -10
- package/generated/components/bottom-bar.js +0 -73
- package/generated/components/navigation-bar.d.ts +0 -10
- package/generated/components/navigation-bar.js +0 -80
- package/generated/internal/class.d.ts +0 -18
- package/generated/internal/class.js +0 -18
- package/generated/namespace/index.d.ts +0 -6
- package/generated/styles.css +0 -1305
- package/scss/_dev.scss +0 -68
- package/scss/components/_tab-bar-stack.scss +0 -101
- package/scss/components/_toolbars.scss +0 -100
- package/scss/transitions/_dialog.scss +0 -32
- /package/generated/{namespace/index.js → events/alert-dialog.js} +0 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function (x: number, y: number, rect: DOMRect): boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export default function (str:
|
|
1
|
+
export default function (str: string): string;
|
|
@@ -0,0 +1,83 @@
|
|
|
1
|
+
const touchList = new WeakMap();
|
|
2
|
+
function onDown({ target }) {
|
|
3
|
+
if (!(target instanceof HTMLElement))
|
|
4
|
+
return;
|
|
5
|
+
const el = target.closest('button,summary');
|
|
6
|
+
if (!el)
|
|
7
|
+
return;
|
|
8
|
+
touchList.set(el, setTimeout(() => {
|
|
9
|
+
if (!touchList.has(el))
|
|
10
|
+
return;
|
|
11
|
+
el.classList.add('active');
|
|
12
|
+
}, 70));
|
|
13
|
+
el.addEventListener('pointerleave', onLeave, { once: true, passive: true });
|
|
14
|
+
el.closest('scroll-view')?.addEventListener('scroll', onScroll, { once: true, passive: true });
|
|
15
|
+
}
|
|
16
|
+
function onOver({ target, buttons }) {
|
|
17
|
+
if (!(target instanceof HTMLElement))
|
|
18
|
+
return;
|
|
19
|
+
const el = target.closest('button,summary');
|
|
20
|
+
if (!el)
|
|
21
|
+
return;
|
|
22
|
+
if (0 === buttons)
|
|
23
|
+
return;
|
|
24
|
+
el.classList.add('active');
|
|
25
|
+
el.removeEventListener('pointerover', onOver);
|
|
26
|
+
el.addEventListener('pointerleave', onLeave, { once: true, passive: true });
|
|
27
|
+
}
|
|
28
|
+
function onLeave({ target }) {
|
|
29
|
+
if (!(target instanceof HTMLElement))
|
|
30
|
+
return;
|
|
31
|
+
const el = target.closest('button,summary');
|
|
32
|
+
if (!el)
|
|
33
|
+
return;
|
|
34
|
+
el.addEventListener('pointerover', onOver, { once: true, passive: true });
|
|
35
|
+
// self.requestAnimationFrame(() => {
|
|
36
|
+
el.removeEventListener('pointerleave', onLeave);
|
|
37
|
+
el.closest('scroll-view')?.removeEventListener('scroll', onScroll);
|
|
38
|
+
el.classList.remove('active');
|
|
39
|
+
if (touchList.has(el))
|
|
40
|
+
clearTimeout(touchList.get(el));
|
|
41
|
+
touchList.delete(el);
|
|
42
|
+
// })
|
|
43
|
+
}
|
|
44
|
+
function onCancel({ target }) {
|
|
45
|
+
if (!(target instanceof HTMLElement))
|
|
46
|
+
return;
|
|
47
|
+
const el = target.closest('button,summary');
|
|
48
|
+
if (!el)
|
|
49
|
+
return;
|
|
50
|
+
// self.requestAnimationFrame(() => {
|
|
51
|
+
el.removeEventListener('pointerleave', onLeave);
|
|
52
|
+
el.removeEventListener('pointerover', onOver);
|
|
53
|
+
el.closest('scroll-view')?.removeEventListener('scroll', onScroll);
|
|
54
|
+
el.classList.remove('active');
|
|
55
|
+
if (touchList.has(el))
|
|
56
|
+
clearTimeout(touchList.get(el));
|
|
57
|
+
touchList.delete(el);
|
|
58
|
+
// })
|
|
59
|
+
}
|
|
60
|
+
function onScroll({ target }) {
|
|
61
|
+
if (!(target instanceof HTMLElement))
|
|
62
|
+
return;
|
|
63
|
+
for (const el of target.querySelectorAll('button,summary') ?? []) {
|
|
64
|
+
el.classList.remove('active');
|
|
65
|
+
if (touchList.has(el))
|
|
66
|
+
clearTimeout(touchList.get(el));
|
|
67
|
+
touchList.delete(el);
|
|
68
|
+
el.removeEventListener('pointerleave', onLeave);
|
|
69
|
+
el.removeEventListener('pointerover', onOver);
|
|
70
|
+
}
|
|
71
|
+
}
|
|
72
|
+
const makePointerdownHandler = (target) => {
|
|
73
|
+
return onDown;
|
|
74
|
+
}, makePointerCancelHandler = (target) => {
|
|
75
|
+
return onCancel;
|
|
76
|
+
};
|
|
77
|
+
export default function (t) {
|
|
78
|
+
const downListener = makePointerdownHandler(t), offListener = makePointerCancelHandler(t);
|
|
79
|
+
return [
|
|
80
|
+
{ types: 'pointerdown', listener: downListener, addOptions: { passive: true } },
|
|
81
|
+
{ types: 'pointerup pointercancel', listener: offListener, addOptions: { passive: true } },
|
|
82
|
+
];
|
|
83
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function (): Promise<void>;
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* const el = document.querySelector('button')!
|
|
3
|
+
*
|
|
4
|
+
* @example
|
|
5
|
+
* // 1. Single — no event arg
|
|
6
|
+
* onoff('click', () => console.log('clicked'), el)
|
|
7
|
+
*
|
|
8
|
+
* @example
|
|
9
|
+
* // 2. Single — with event arg
|
|
10
|
+
* onoff('click', (e) => console.log(e.target), el)
|
|
11
|
+
*
|
|
12
|
+
* @example
|
|
13
|
+
* // 3. Single — with options
|
|
14
|
+
* onoff('click', (e) => console.log(e), el, { passive: true, once: true })
|
|
15
|
+
*
|
|
16
|
+
* @example
|
|
17
|
+
* // 4. Single — capture as boolean
|
|
18
|
+
* onoff('click', (e) => console.log(e), el, true)
|
|
19
|
+
*
|
|
20
|
+
* @example
|
|
21
|
+
* // 5. Array — shared t
|
|
22
|
+
* onoff([
|
|
23
|
+
* { types: 'click', listener: (e) => console.log('click', e) },
|
|
24
|
+
* { types: 'mouseover mouseout', listener: (e) => console.log('hover', e) },
|
|
25
|
+
* ], el)
|
|
26
|
+
*
|
|
27
|
+
* @example
|
|
28
|
+
* // 6. Using on/off
|
|
29
|
+
* const { on, off } = onoff('scroll', (e) => console.log(e), el, { passive: true })
|
|
30
|
+
* on() // start listening
|
|
31
|
+
* off() // stop listening
|
|
32
|
+
*/
|
|
33
|
+
type Options = boolean | AddEventListenerOptions;
|
|
34
|
+
interface EventConfig {
|
|
35
|
+
types: string;
|
|
36
|
+
listener: EventListener;
|
|
37
|
+
addOptions?: Options;
|
|
38
|
+
}
|
|
39
|
+
declare function single(types: string, listener: EventListener, t?: EventTarget, addOptions?: Options): {
|
|
40
|
+
on: () => () => void;
|
|
41
|
+
off: () => void;
|
|
42
|
+
};
|
|
43
|
+
export default function (configs: EventConfig[], t?: EventTarget): ReturnType<typeof single>;
|
|
44
|
+
export default function (types: string, listener: EventListener, t?: EventTarget, addOptions?: Options): ReturnType<typeof single>;
|
|
45
|
+
export {};
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
function single(types, listener, t, addOptions) {
|
|
2
|
+
const events = types?.split(' ');
|
|
3
|
+
const removeOptions = typeof addOptions === 'boolean' ? addOptions : addOptions !== undefined && 'capture' in addOptions ? { capture: addOptions.capture } : undefined;
|
|
4
|
+
const off = () => {
|
|
5
|
+
for (const event of events)
|
|
6
|
+
t?.removeEventListener(event, listener, removeOptions);
|
|
7
|
+
}, on = () => {
|
|
8
|
+
for (const event of events)
|
|
9
|
+
t?.addEventListener(event, listener, addOptions);
|
|
10
|
+
return off;
|
|
11
|
+
};
|
|
12
|
+
return {
|
|
13
|
+
on,
|
|
14
|
+
off,
|
|
15
|
+
};
|
|
16
|
+
}
|
|
17
|
+
export default function (typesOrConfigs, listenerOrT, t, addOptions) {
|
|
18
|
+
if (Array.isArray(typesOrConfigs)) {
|
|
19
|
+
const element = listenerOrT, results = typesOrConfigs.map((c) => single(c.types, c.listener, element, c.addOptions)); //, c.t ?? element, c.addOptions))
|
|
20
|
+
const off = () => results.forEach((r) => r.off()), on = () => {
|
|
21
|
+
for (const r of results)
|
|
22
|
+
r.on();
|
|
23
|
+
return off;
|
|
24
|
+
};
|
|
25
|
+
return {
|
|
26
|
+
on,
|
|
27
|
+
off,
|
|
28
|
+
};
|
|
29
|
+
}
|
|
30
|
+
return single(typesOrConfigs, listenerOrT, t, addOptions);
|
|
31
|
+
}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import $ from './cash';
|
|
2
|
+
export default function (label, systemImage) {
|
|
3
|
+
const img = label.querySelector(':scope>[slot=icon]');
|
|
4
|
+
// image ??= this.appendChild($(`<i slot="icon" style="line-height: 1.05"></i>`, '>1'))
|
|
5
|
+
// image.setAttribute('class', `ph ph-${newValue}`)
|
|
6
|
+
if (systemImage) {
|
|
7
|
+
if (!img) {
|
|
8
|
+
const newImg = $(`<i slot="icon" style="line-height: 1.05" class="ph ph-${systemImage}"></i>`, '>1');
|
|
9
|
+
// const newImg = $(`<image-view slot="icon"></image-view>`, '>1')
|
|
10
|
+
// newImg.setAttribute('system-name', systemImage)
|
|
11
|
+
// DOM manipulation last
|
|
12
|
+
label.appendChild(newImg);
|
|
13
|
+
}
|
|
14
|
+
else if (systemImage !== img.getAttribute('system-name'))
|
|
15
|
+
img.setAttribute('system-name', systemImage);
|
|
16
|
+
}
|
|
17
|
+
else
|
|
18
|
+
img?.remove();
|
|
19
|
+
}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import $ from './cash';
|
|
2
|
+
export default function (label, title) {
|
|
3
|
+
const span = label.querySelector(':scope>:not([slot])');
|
|
4
|
+
if (title) {
|
|
5
|
+
if (!span) {
|
|
6
|
+
const newSpan = $(`<span></span>`, '>1');
|
|
7
|
+
newSpan.textContent = title;
|
|
8
|
+
// DOM manipulation last
|
|
9
|
+
label.appendChild(newSpan);
|
|
10
|
+
}
|
|
11
|
+
else if (title !== span.textContent)
|
|
12
|
+
span.textContent = title;
|
|
13
|
+
}
|
|
14
|
+
else
|
|
15
|
+
span?.remove();
|
|
16
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function (container: Element, selector: string, template: string, title?: string | null, systemImage?: string | null): void;
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import $ from './cash';
|
|
2
|
+
import renderLabelIcon from './render-label-icon';
|
|
3
|
+
import renderLabelTitle from './render-label-title';
|
|
4
|
+
export default function (container, selector, template, title, systemImage) {
|
|
5
|
+
const existing = container.querySelector(selector);
|
|
6
|
+
if (existing) {
|
|
7
|
+
for (const { name, value } of $(template, '>1').attributes)
|
|
8
|
+
if (!existing.hasAttribute(name))
|
|
9
|
+
existing.setAttribute(name, value);
|
|
10
|
+
renderLabelIcon(existing, systemImage ?? null);
|
|
11
|
+
renderLabelTitle(existing, title ?? null);
|
|
12
|
+
}
|
|
13
|
+
else {
|
|
14
|
+
const newLabel = $(template, '>1');
|
|
15
|
+
renderLabelIcon(newLabel, systemImage ?? null);
|
|
16
|
+
renderLabelTitle(newLabel, title ?? null);
|
|
17
|
+
container.appendChild(newLabel);
|
|
18
|
+
}
|
|
19
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function <T extends object, K extends keyof T>(obj: T, key: K, value: T[K]): boolean;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function (ms: number): Promise<void>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function (to: 'show' | 'hide', el?: HTMLElement): void;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import frame from './frame';
|
|
2
|
+
export default function (to, el) {
|
|
3
|
+
const transcleanup = ({ propertyName }) => {
|
|
4
|
+
if ('opacity' !== propertyName)
|
|
5
|
+
return;
|
|
6
|
+
el?.removeAttribute('slow');
|
|
7
|
+
};
|
|
8
|
+
for (const eventType of ['transitionend', 'transitioncancel'])
|
|
9
|
+
el?.addEventListener(eventType, transcleanup, {
|
|
10
|
+
once: true,
|
|
11
|
+
});
|
|
12
|
+
el?.setAttribute('slow', '');
|
|
13
|
+
frame(el).then(() => {
|
|
14
|
+
el?.setAttribute('slow', to);
|
|
15
|
+
}); //self.requestAnimationFrame(() => el?.setAttribute('slow', to))
|
|
16
|
+
}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
export default function () {
|
|
2
|
+
let id;
|
|
3
|
+
const cancel = () => {
|
|
4
|
+
if (!id)
|
|
5
|
+
return;
|
|
6
|
+
self.clearTimeout(id);
|
|
7
|
+
id = undefined;
|
|
8
|
+
}, next = (fn, ms) => {
|
|
9
|
+
cancel();
|
|
10
|
+
id = self.setTimeout(() => {
|
|
11
|
+
fn();
|
|
12
|
+
id = undefined;
|
|
13
|
+
}, ms);
|
|
14
|
+
}, pending = () => undefined !== id;
|
|
15
|
+
return { next, cancel, pending };
|
|
16
|
+
}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
const makePointerdownHandler = (target, targetCallback, checkCallback) => {
|
|
2
|
+
return function (evt) {
|
|
3
|
+
// if (event.pointerType !== 'touch') return
|
|
4
|
+
if (!checkCallback(evt))
|
|
5
|
+
return;
|
|
6
|
+
targetCallback(target).toggleAttribute('touch-glass', true);
|
|
7
|
+
};
|
|
8
|
+
}, makePointercancelHandler = (target, targetCallback) => {
|
|
9
|
+
return function (evt) {
|
|
10
|
+
targetCallback(target).toggleAttribute('touch-glass', false);
|
|
11
|
+
};
|
|
12
|
+
};
|
|
13
|
+
export default function (t, targetCallback, checkCallback) {
|
|
14
|
+
const downListener = makePointerdownHandler(t, targetCallback, checkCallback), cancelListener = makePointercancelHandler(t, targetCallback);
|
|
15
|
+
return [
|
|
16
|
+
{ types: 'pointerdown', listener: downListener, addOptions: { passive: true } },
|
|
17
|
+
{ types: 'pointerup pointercancel pointerleave', listener: cancelListener, addOptions: { passive: true } },
|
|
18
|
+
];
|
|
19
|
+
}
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
export declare abstract class DialogBase extends HTMLDialogElement {
|
|
2
|
+
static polyfillExtends: "dialog";
|
|
3
|
+
static polyfillConnectedCallback(el: HTMLDialogElement): void;
|
|
4
|
+
static polyfillDisconnectedCallback(el: HTMLDialogElement): void;
|
|
5
|
+
static polyfillAttributeChangedCallback(entries: Pick<MutationRecord, 'attributeName' | 'oldValue' | 'target'>[]): void;
|
|
6
|
+
attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
|
|
7
|
+
disconnectedCallback(): void;
|
|
8
|
+
connectedCallback(): void;
|
|
9
|
+
}
|
|
10
|
+
export declare abstract class InputBase extends HTMLInputElement {
|
|
11
|
+
static polyfillExtends: "input";
|
|
12
|
+
static polyfillConnectedCallback(el: HTMLInputElement): void;
|
|
13
|
+
static polyfillDisconnectedCallback(el: HTMLInputElement): void;
|
|
14
|
+
static polyfillAttributeChangedCallback(entries: Pick<MutationRecord, 'attributeName' | 'oldValue' | 'target'>[]): void;
|
|
15
|
+
attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
|
|
16
|
+
disconnectedCallback(): void;
|
|
17
|
+
connectedCallback(): void;
|
|
18
|
+
}
|
|
19
|
+
export declare abstract class ButtonBase extends HTMLButtonElement {
|
|
20
|
+
static polyfillExtends: "button";
|
|
21
|
+
static polyfillConnectedCallback(el: HTMLButtonElement): void;
|
|
22
|
+
static polyfillDisconnectedCallback(el: HTMLButtonElement): void;
|
|
23
|
+
static polyfillAttributeChangedCallback(entries: Pick<MutationRecord, 'attributeName' | 'oldValue' | 'target'>[]): void;
|
|
24
|
+
attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
|
|
25
|
+
disconnectedCallback(): void;
|
|
26
|
+
connectedCallback(): void;
|
|
27
|
+
}
|
|
28
|
+
export declare abstract class DetailsBase extends HTMLDetailsElement {
|
|
29
|
+
static polyfillExtends: "details";
|
|
30
|
+
static polyfillConnectedCallback(el: HTMLDetailsElement): void;
|
|
31
|
+
static polyfillDisconnectedCallback(el: HTMLDetailsElement): void;
|
|
32
|
+
static polyfillAttributeChangedCallback(entries: Pick<MutationRecord, 'attributeName' | 'oldValue' | 'target'>[]): void;
|
|
33
|
+
attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
|
|
34
|
+
disconnectedCallback(): void;
|
|
35
|
+
connectedCallback(): void;
|
|
36
|
+
}
|
|
37
|
+
export declare abstract class FormBase extends HTMLFormElement {
|
|
38
|
+
static polyfillExtends: "form";
|
|
39
|
+
static polyfillConnectedCallback(el: HTMLFormElement): void;
|
|
40
|
+
static polyfillDisconnectedCallback(el: HTMLFormElement): void;
|
|
41
|
+
static polyfillAttributeChangedCallback(entries: Pick<MutationRecord, 'attributeName' | 'oldValue' | 'target'>[]): void;
|
|
42
|
+
attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
|
|
43
|
+
disconnectedCallback(): void;
|
|
44
|
+
connectedCallback(): void;
|
|
45
|
+
}
|
|
@@ -0,0 +1,115 @@
|
|
|
1
|
+
export class DialogBase extends HTMLDialogElement {
|
|
2
|
+
static polyfillExtends = 'dialog';
|
|
3
|
+
static polyfillConnectedCallback(el) { }
|
|
4
|
+
static polyfillDisconnectedCallback(el) { }
|
|
5
|
+
static polyfillAttributeChangedCallback(entries) { } //MutationRecord[]) {}
|
|
6
|
+
attributeChangedCallback(name, oldValue, newValue) {
|
|
7
|
+
const ctor = this.constructor;
|
|
8
|
+
const entry = {
|
|
9
|
+
attributeName: name,
|
|
10
|
+
oldValue,
|
|
11
|
+
target: this,
|
|
12
|
+
};
|
|
13
|
+
ctor.polyfillAttributeChangedCallback([entry]);
|
|
14
|
+
}
|
|
15
|
+
disconnectedCallback() {
|
|
16
|
+
const ctor = this.constructor;
|
|
17
|
+
ctor.polyfillDisconnectedCallback(this);
|
|
18
|
+
}
|
|
19
|
+
connectedCallback() {
|
|
20
|
+
const ctor = this.constructor;
|
|
21
|
+
ctor.polyfillConnectedCallback(this);
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
export class InputBase extends HTMLInputElement {
|
|
25
|
+
static polyfillExtends = 'input';
|
|
26
|
+
static polyfillConnectedCallback(el) { }
|
|
27
|
+
static polyfillDisconnectedCallback(el) { }
|
|
28
|
+
static polyfillAttributeChangedCallback(entries) { } //MutationRecord[]) {}
|
|
29
|
+
attributeChangedCallback(name, oldValue, newValue) {
|
|
30
|
+
const ctor = this.constructor;
|
|
31
|
+
const entry = {
|
|
32
|
+
attributeName: name,
|
|
33
|
+
oldValue,
|
|
34
|
+
target: this,
|
|
35
|
+
};
|
|
36
|
+
ctor.polyfillAttributeChangedCallback([entry]);
|
|
37
|
+
}
|
|
38
|
+
disconnectedCallback() {
|
|
39
|
+
const ctor = this.constructor;
|
|
40
|
+
ctor.polyfillDisconnectedCallback(this);
|
|
41
|
+
}
|
|
42
|
+
connectedCallback() {
|
|
43
|
+
const ctor = this.constructor;
|
|
44
|
+
ctor.polyfillConnectedCallback(this);
|
|
45
|
+
}
|
|
46
|
+
}
|
|
47
|
+
export class ButtonBase extends HTMLButtonElement {
|
|
48
|
+
static polyfillExtends = 'button';
|
|
49
|
+
static polyfillConnectedCallback(el) { }
|
|
50
|
+
static polyfillDisconnectedCallback(el) { }
|
|
51
|
+
static polyfillAttributeChangedCallback(entries) { } //MutationRecord[]) {}
|
|
52
|
+
attributeChangedCallback(name, oldValue, newValue) {
|
|
53
|
+
const ctor = this.constructor;
|
|
54
|
+
const entry = {
|
|
55
|
+
attributeName: name,
|
|
56
|
+
oldValue,
|
|
57
|
+
target: this,
|
|
58
|
+
};
|
|
59
|
+
ctor.polyfillAttributeChangedCallback([entry]);
|
|
60
|
+
}
|
|
61
|
+
disconnectedCallback() {
|
|
62
|
+
const ctor = this.constructor;
|
|
63
|
+
ctor.polyfillDisconnectedCallback(this);
|
|
64
|
+
}
|
|
65
|
+
connectedCallback() {
|
|
66
|
+
const ctor = this.constructor;
|
|
67
|
+
ctor.polyfillConnectedCallback(this);
|
|
68
|
+
}
|
|
69
|
+
}
|
|
70
|
+
export class DetailsBase extends HTMLDetailsElement {
|
|
71
|
+
static polyfillExtends = 'details';
|
|
72
|
+
static polyfillConnectedCallback(el) { }
|
|
73
|
+
static polyfillDisconnectedCallback(el) { }
|
|
74
|
+
static polyfillAttributeChangedCallback(entries) { } //MutationRecord[]) {}
|
|
75
|
+
attributeChangedCallback(name, oldValue, newValue) {
|
|
76
|
+
const ctor = this.constructor;
|
|
77
|
+
const entry = {
|
|
78
|
+
attributeName: name,
|
|
79
|
+
oldValue,
|
|
80
|
+
target: this,
|
|
81
|
+
};
|
|
82
|
+
ctor.polyfillAttributeChangedCallback([entry]);
|
|
83
|
+
}
|
|
84
|
+
disconnectedCallback() {
|
|
85
|
+
const ctor = this.constructor;
|
|
86
|
+
ctor.polyfillDisconnectedCallback(this);
|
|
87
|
+
}
|
|
88
|
+
connectedCallback() {
|
|
89
|
+
const ctor = this.constructor;
|
|
90
|
+
ctor.polyfillConnectedCallback(this);
|
|
91
|
+
}
|
|
92
|
+
}
|
|
93
|
+
export class FormBase extends HTMLFormElement {
|
|
94
|
+
static polyfillExtends = 'form';
|
|
95
|
+
static polyfillConnectedCallback(el) { }
|
|
96
|
+
static polyfillDisconnectedCallback(el) { }
|
|
97
|
+
static polyfillAttributeChangedCallback(entries) { } //MutationRecord[]) {}
|
|
98
|
+
attributeChangedCallback(name, oldValue, newValue) {
|
|
99
|
+
const ctor = this.constructor;
|
|
100
|
+
const entry = {
|
|
101
|
+
attributeName: name,
|
|
102
|
+
oldValue,
|
|
103
|
+
target: this,
|
|
104
|
+
};
|
|
105
|
+
ctor.polyfillAttributeChangedCallback([entry]);
|
|
106
|
+
}
|
|
107
|
+
disconnectedCallback() {
|
|
108
|
+
const ctor = this.constructor;
|
|
109
|
+
ctor.polyfillDisconnectedCallback(this);
|
|
110
|
+
}
|
|
111
|
+
connectedCallback() {
|
|
112
|
+
const ctor = this.constructor;
|
|
113
|
+
ctor.polyfillConnectedCallback(this);
|
|
114
|
+
}
|
|
115
|
+
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
export type WebComponentCtor = typeof HTMLElement & {
|
|
2
|
+
observedAttributes?: string[];
|
|
3
|
+
polyfillExtends?: string;
|
|
4
|
+
polyfillConnectedCallback(el: HTMLElement): void;
|
|
5
|
+
polyfillDisconnectedCallback(el: HTMLElement): void;
|
|
6
|
+
polyfillAttributeChangedCallback?(entries: Pick<MutationRecord, 'attributeName' | 'oldValue' | 'target'>[]): void;
|
|
7
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -1,16 +1,9 @@
|
|
|
1
|
-
import type * as Components from '../components';
|
|
2
1
|
export declare class Snapshot {
|
|
3
2
|
#private;
|
|
3
|
+
static get breakpoints(): ReadonlyMap<string, boolean> | undefined;
|
|
4
|
+
static on: EventTarget;
|
|
5
|
+
static readonly waitReady: Promise<[void, void]>;
|
|
6
|
+
static waitReadyFor<T extends HTMLElement>(element: T): Promise<T | null>;
|
|
4
7
|
static get config(): Record<string, string> | undefined;
|
|
5
8
|
static setOwnConfig(): Promise<void>;
|
|
6
|
-
static get parent(): Components.ScrollView | undefined;
|
|
7
|
-
static get root(): HTMLElement | undefined;
|
|
8
|
-
static get leaf(): Components.ScrollView | undefined;
|
|
9
|
-
static get parentContainer(): HTMLElement | undefined;
|
|
10
|
-
static get leafContainer(): HTMLElement | undefined;
|
|
11
|
-
static get container(): HTMLElement | undefined;
|
|
12
|
-
static get toolbarItems(): NodeListOf<Element> | undefined;
|
|
13
|
-
static get parentToolbarItems(): NodeListOf<Element> | undefined;
|
|
14
|
-
static get leafToolbarItems(): NodeListOf<Element> | undefined;
|
|
15
|
-
static getSnapshot(scrollView?: Components.ScrollView): void;
|
|
16
9
|
}
|