@swiftwc/ui 0.0.0-dev.11 → 0.0.0-dev.111
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/css-data/en.json +28 -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 +24 -10
- package/generated/client/index.js +179 -194
- package/generated/components/alert-dialog.d.ts +11 -0
- package/generated/components/alert-dialog.js +94 -0
- package/generated/components/body-view.d.ts +8 -0
- package/generated/components/body-view.js +6 -2
- package/generated/components/bordered-button.d.ts +10 -0
- package/generated/components/bordered-button.js +36 -3
- package/generated/components/bordered-prominent-button.d.ts +10 -0
- package/generated/components/bordered-prominent-button.js +36 -3
- package/generated/components/borderless-button.d.ts +9 -1
- package/generated/components/borderless-button.js +29 -11
- package/generated/components/color-scheme.d.ts +12 -0
- package/generated/components/color-scheme.js +51 -0
- package/generated/components/confirmation-dialog.d.ts +4 -1
- package/generated/components/confirmation-dialog.js +38 -32
- package/generated/components/content-unavailable.d.ts +30 -0
- package/generated/components/content-unavailable.js +79 -0
- package/generated/components/date-picker.d.ts +21 -15
- package/generated/components/date-picker.js +126 -88
- package/generated/components/detail-placeholder.d.ts +11 -0
- package/generated/components/detail-placeholder.js +15 -0
- package/generated/components/disclosure-group.d.ts +8 -0
- package/generated/components/disclosure-group.js +18 -7
- package/generated/components/fine-tooltip.d.ts +15 -0
- package/generated/components/fine-tooltip.js +108 -0
- package/generated/components/form-view.d.ts +10 -0
- package/generated/components/form-view.js +8 -3
- package/generated/components/glass-button.d.ts +10 -0
- package/generated/components/glass-button.js +36 -3
- package/generated/components/glass-prominent-button.d.ts +10 -0
- package/generated/components/glass-prominent-button.js +36 -3
- package/generated/components/h-divider.d.ts +11 -0
- package/generated/components/h-divider.js +15 -0
- package/generated/components/h-stack.d.ts +22 -0
- package/generated/components/h-stack.js +24 -0
- package/generated/components/image-view.d.ts +18 -0
- package/generated/components/image-view.js +65 -0
- package/generated/components/index.d.ts +15 -3
- package/generated/components/index.js +15 -3
- package/generated/components/label-view.d.ts +19 -1
- package/generated/components/label-view.js +63 -62
- package/generated/components/labeled-content.d.ts +33 -0
- package/generated/components/labeled-content.js +160 -0
- package/generated/components/list-view.d.ts +14 -0
- package/generated/components/list-view.js +12 -17
- package/generated/components/menu-view.d.ts +12 -1
- package/generated/components/menu-view.js +63 -65
- package/generated/components/navigation-large-title.d.ts +11 -0
- package/generated/components/navigation-large-title.js +11 -5
- package/generated/components/navigation-split-view.d.ts +9 -1
- package/generated/components/navigation-split-view.js +10 -6
- package/generated/components/navigation-stack.d.ts +9 -1
- package/generated/components/navigation-stack.js +13 -11
- package/generated/components/navigation-title.d.ts +11 -1
- package/generated/components/navigation-title.js +58 -55
- package/generated/components/picker-view.d.ts +48 -7
- package/generated/components/picker-view.js +971 -261
- package/generated/components/plain-button.js +3 -3
- package/generated/components/progress-view.d.ts +20 -0
- package/generated/components/progress-view.js +120 -0
- package/generated/components/screen-view.js +2 -1
- package/generated/components/scroll-view-proxy.d.ts +13 -0
- package/generated/components/scroll-view-proxy.js +15 -0
- package/generated/components/scroll-view.d.ts +13 -1
- package/generated/components/scroll-view.js +140 -97
- package/generated/components/search-view.d.ts +12 -0
- package/generated/components/search-view.js +24 -0
- package/generated/components/section-view.d.ts +13 -1
- package/generated/components/section-view.js +38 -58
- package/generated/components/sheet-view.d.ts +4 -2
- package/generated/components/sheet-view.js +10 -39
- package/generated/components/sidebar-toggle.d.ts +9 -1
- package/generated/components/sidebar-toggle.js +46 -69
- package/generated/components/sidebar-view.d.ts +3 -0
- package/generated/components/sidebar-view.js +16 -9
- package/generated/components/sticky-container.d.ts +6 -1
- package/generated/components/sticky-container.js +9 -7
- package/generated/components/tab-bar.d.ts +3 -0
- package/generated/components/tab-bar.js +17 -13
- package/generated/components/tab-item.d.ts +3 -0
- package/generated/components/tab-item.js +20 -13
- package/generated/components/tab-view.d.ts +13 -4
- package/generated/components/tab-view.js +25 -89
- package/generated/components/table-view.d.ts +19 -0
- package/generated/components/table-view.js +88 -107
- package/generated/components/text-field.d.ts +19 -6
- package/generated/components/text-field.js +127 -99
- package/generated/components/text-view.d.ts +11 -0
- package/generated/components/text-view.js +16 -0
- package/generated/components/toggle-view.d.ts +43 -0
- package/generated/components/toggle-view.js +366 -0
- package/generated/components/tool-bar-item-group.d.ts +8 -0
- package/generated/components/tool-bar-item-group.js +22 -4
- package/generated/components/tool-bar-item.d.ts +12 -1
- package/generated/components/tool-bar-item.js +57 -10
- package/generated/components/tool-bar.d.ts +19 -0
- package/generated/components/tool-bar.js +48 -33
- package/generated/components/v-divider.d.ts +11 -0
- package/generated/components/v-divider.js +15 -0
- package/generated/components/v-keyboard.d.ts +8 -1
- package/generated/components/v-keyboard.js +11 -9
- package/generated/components/v-stack.d.ts +20 -0
- package/generated/components/v-stack.js +18 -2
- package/generated/css/index.css +4617 -1266
- package/generated/events/alert-dialog.d.ts +13 -0
- package/generated/events/alert-dialog.js +1 -0
- package/generated/events/confirmation-dialog.d.ts +7 -2
- package/generated/events/date-picker.d.ts +6 -1
- package/generated/events/index.d.ts +2 -0
- package/generated/events/index.js +2 -0
- package/generated/events/lifecycle-observer.d.ts +10 -2
- package/generated/events/picker-view.d.ts +22 -1
- package/generated/events/scroll-view.d.ts +10 -2
- package/generated/events/tab-view.d.ts +38 -8
- package/generated/events/text-field.d.ts +6 -1
- package/generated/events/toggle-view.d.ts +14 -0
- package/generated/events/toggle-view.js +1 -0
- package/generated/i18n/index.d.ts +19 -10
- package/generated/i18n/index.js +79 -54
- 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/css-style-observer.js +2 -2
- package/generated/internal/class/form-associated-base.d.ts +0 -4
- package/generated/internal/class/form-associated-base.js +22 -39
- 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.js +18 -0
- package/generated/internal/class/navigation-view.d.ts +1 -1
- package/generated/internal/class/navigation-view.js +36 -43
- package/generated/internal/decorators/adaptive-slot.d.ts +1 -0
- package/generated/internal/decorators/adaptive-slot.js +47 -0
- package/generated/internal/decorators/custom-element.d.ts +1 -1
- package/generated/internal/decorators/custom-element.js +2 -1
- 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/flags.d.ts +4 -0
- package/generated/internal/flags.js +1 -0
- package/generated/internal/privateNamespace.d.ts +10 -0
- package/generated/internal/privateNamespace.js +159 -1
- package/generated/internal/utils/$.d.ts +9 -0
- package/generated/internal/utils/$.js +11 -0
- package/generated/internal/utils/compare-big-decimals.js +7 -17
- package/generated/internal/utils/debug.d.ts +1 -0
- package/generated/internal/utils/debug.js +4 -0
- package/generated/internal/utils/define-translations.d.ts +1 -0
- package/generated/internal/utils/define-translations.js +3 -0
- package/generated/internal/utils/ensure-placeholder.d.ts +1 -0
- package/generated/internal/utils/ensure-placeholder.js +41 -0
- package/generated/internal/utils/index.d.ts +39 -2
- package/generated/internal/utils/index.js +39 -3
- 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.js +6 -9
- package/generated/internal/utils/list-active.js +67 -12
- package/generated/internal/utils/touch-glass.js +5 -5
- package/generated/internal/vendor/morphdom.d.ts +6 -0
- package/generated/internal/vendor/morphdom.js +720 -0
- package/generated/morphdom/index.d.ts +8 -0
- package/generated/morphdom/index.js +8 -0
- package/generated/morphdom/morph.d.ts +4 -0
- package/generated/morphdom/morph.js +10 -0
- package/generated/morphdom/query-morph.d.ts +5 -0
- package/generated/morphdom/query-morph.js +12 -0
- package/generated/morphdom/render-to-string.d.ts +12 -0
- package/generated/morphdom/render-to-string.js +48 -0
- package/generated/morphdom/unsafe-html.d.ts +2 -0
- package/generated/morphdom/unsafe-html.js +4 -0
- package/generated/namespace-browser/base.d.ts +12 -3
- package/generated/namespace-browser/base.js +41 -18
- package/generated/namespace-browser/event.d.ts +10 -0
- package/generated/namespace-browser/event.js +1 -0
- package/generated/snapshot/index.d.ts +3 -1
- package/generated/snapshot/index.js +23 -2
- package/generated/tpl/html.d.ts +5 -0
- package/generated/tpl/html.js +7 -0
- package/generated/tpl/index.d.ts +6 -0
- package/generated/tpl/index.js +6 -0
- package/generated/tpl/is-template-result.d.ts +3 -0
- package/generated/tpl/is-template-result.js +1 -0
- package/generated/tpl/render.d.ts +2 -0
- package/generated/tpl/render.js +132 -0
- package/html-data/en.json +2620 -0
- package/package.json +32 -7
- package/scss/_components.scss +15 -0
- package/scss/_functions.scss +10 -0
- package/scss/_maps.scss +293 -0
- package/scss/_mixins.scss +4 -0
- package/scss/_transitions.scss +6 -1
- package/scss/_utils.scss +2 -0
- package/scss/_vars.scss +9 -115
- package/scss/base/_layout.scss +17 -7
- package/scss/base/_reboot.scss +34 -1
- package/scss/base/_root.scss +143 -124
- package/scss/colors/_index.scss +328 -88
- package/scss/components/_alert-dialog.scss +111 -0
- package/scss/components/_bordered-button.scss +37 -0
- package/scss/components/_bordered-prominent-button.scss +46 -0
- package/scss/components/_borderless-button.scss +26 -0
- package/scss/components/_confirmation-dialog.scss +41 -49
- package/scss/components/_content-unavailable.scss +57 -0
- package/scss/components/_date-picker.scss +15 -15
- package/scss/components/_detail-placeholder.scss +1 -3
- package/scss/components/_disclosure-group.scss +85 -34
- package/scss/components/_fine-tooltip.scss +84 -0
- package/scss/components/_form-view.scss +63 -24
- package/scss/components/_glass-button.scss +37 -0
- package/scss/components/_glass-prominent-button.scss +47 -0
- package/scss/components/_group-box.scss +27 -0
- package/scss/components/_h-flex-stack.scss +23 -0
- package/scss/components/_h-stack.scss +6 -17
- package/scss/components/_image-view.scss +20 -0
- package/scss/components/_index.scss +69 -36
- package/scss/components/_label-view copy.scss.txt +420 -0
- package/scss/components/_label-view.scss +105 -120
- package/scss/components/_label-view.scss.txt +536 -0
- package/scss/components/_labeled-content.scss +67 -1
- package/scss/components/_list-view.scss +70 -29
- package/scss/components/_menu-view.scss +96 -61
- package/scss/components/_navigation-large-title.scss +23 -0
- package/scss/components/_navigation-split-view.scss +3 -3
- package/scss/components/_navigation-title.scss +1 -1
- package/scss/components/_picker-view.scss +270 -63
- package/scss/components/_plain-button.scss +8 -0
- package/scss/components/_progress-view.scss +98 -0
- package/scss/components/_scroll-view-proxy.scss +24 -22
- package/scss/components/_scroll-view-toolbars.scss +8 -2
- package/scss/components/_scroll-view.scss +16 -0
- package/scss/components/_search-view.scss +23 -0
- package/scss/components/_section-view.scss +23 -22
- package/scss/components/_sheet-view.scss +16 -6
- package/scss/components/_sidebar-toggle.scss +1 -4
- package/scss/components/_sticky-container.scss +1 -1
- package/scss/components/_tab-bar.scss +17 -3
- package/scss/components/_tab-view.scss +12 -2
- package/scss/components/_table-column.scss +4 -2
- package/scss/components/_table-row.scss +71 -3
- package/scss/components/_table-view.scss +27 -18
- package/scss/components/_text-field.scss +37 -17
- package/scss/components/_text-view.scss +57 -0
- package/scss/components/_toggle-view.scss +171 -0
- package/scss/components/_tool-bar-item.scss +34 -82
- package/scss/components/_tool-bar.scss +77 -57
- package/scss/components/_v-stack.scss +8 -2
- package/scss/final/_touch-glass.scss +31 -0
- package/scss/mixins/_button.scss +44 -0
- package/scss/mixins/_color.scss +16 -0
- package/scss/mixins/_dialog.scss +1 -0
- package/scss/mixins/_index.scss +73 -5
- package/scss/placeholders/_buttons.scss +46 -11
- package/scss/placeholders/_lists.scss +159 -126
- package/scss/transitions/_alert-dialog.scss +18 -0
- package/scss/transitions/_confirmation-dialog.scss +8 -0
- package/scss/transitions/_fine-tooltip.scss +21 -0
- package/scss/transitions/_menu-view.scss +17 -15
- package/scss/transitions/_progress-view.scss +23 -0
- package/scss/transitions/_sheet-view.scss +30 -0
- package/scss/transitions/_tab-bar.scss +6 -5
- package/scss/utils/_background.scss +52 -0
- package/scss/utils/_frame.scss +59 -40
- package/scss/utils/_index.scss +45 -56
- package/scss/utils/_scroll-view.scss +1 -1
- package/scss/utils/_spacing.scss +1 -1
- package/scss/utils/_stacks.scss +34 -164
- package/generated/confirmation-dialog/index.d.ts +0 -1
- package/generated/confirmation-dialog/index.js +0 -1
- package/generated/internal/utils/cash/index.d.ts +0 -22
- package/generated/internal/utils/cash/index.js +0 -23
- package/generated/lifecycle-observer/index.d.ts +0 -1
- package/generated/lifecycle-observer/index.js +0 -1
- package/scss/transitions/_dialog.scss +0 -28
- package/web-components.html-data/en.json +0 -330
- /package/generated/internal/utils/{cash/ancestors.d.ts → ancestors.d.ts} +0 -0
- /package/generated/internal/utils/{cash/ancestors.js → ancestors.js} +0 -0
- /package/generated/internal/utils/{cash/next-all.d.ts → next-all.d.ts} +0 -0
- /package/generated/internal/utils/{cash/next-all.js → next-all.js} +0 -0
- /package/generated/internal/utils/{cash/next.d.ts → next.d.ts} +0 -0
- /package/generated/internal/utils/{cash/next.js → next.js} +0 -0
- /package/generated/internal/utils/{cash/prev-all.d.ts → prev-all.d.ts} +0 -0
- /package/generated/internal/utils/{cash/prev-all.js → prev-all.js} +0 -0
- /package/generated/internal/utils/{cash/prev.d.ts → prev.d.ts} +0 -0
- /package/generated/internal/utils/{cash/prev.js → prev.js} +0 -0
- /package/generated/internal/utils/{cash/prop.d.ts → prop.d.ts} +0 -0
- /package/generated/internal/utils/{cash/prop.js → prop.js} +0 -0
- /package/generated/internal/utils/{cash/siblings.d.ts → siblings.d.ts} +0 -0
- /package/generated/internal/utils/{cash/siblings.js → siblings.js} +0 -0
|
@@ -1 +1,159 @@
|
|
|
1
|
-
|
|
1
|
+
import { NavigationPath } from '../internal/class/navigation-path';
|
|
2
|
+
import { debug } from '../internal/utils';
|
|
3
|
+
import { Snapshot } from '../snapshot';
|
|
4
|
+
export function queryInsertPosition(frame) {
|
|
5
|
+
if ('NAVIGATION-SPLIT-VIEW' === frame?.tagName)
|
|
6
|
+
return 'beforebegin'; // lookFor = 'previousElementSibling'
|
|
7
|
+
else if ('NAVIGATION-SPLIT-VIEW' === frame?.parentElement?.tagName && frame?.parentElement.querySelector(':scope>[is=sidebar-view]') && 'BODY-VIEW' === frame?.tagName)
|
|
8
|
+
return 'beforebegin'; // lookFor = 'previousElementSibling'
|
|
9
|
+
return 'afterend'; // lookFor = 'nextElementSibling'
|
|
10
|
+
}
|
|
11
|
+
const cleanup = (lm, type) => {
|
|
12
|
+
let arr = [Snapshot.config['vt-fwd-class-name'], 'fwdd', 'fwn', 'fwnn', 'bwd', 'bwdd', 'bwn', 'bwnn'];
|
|
13
|
+
if (['backwards', 'forwards'].includes(type ?? ''))
|
|
14
|
+
for (let i = arr.length - 1; i >= 0; i--)
|
|
15
|
+
if (arr[i].startsWith('backwards' === type ? 'fw' : 'bw'))
|
|
16
|
+
arr.splice(i, 1);
|
|
17
|
+
for (const el of [...(lm?.querySelectorAll(arr.map((v) => `.${v}`).join(',')) ?? [])])
|
|
18
|
+
el.classList.remove(...arr);
|
|
19
|
+
};
|
|
20
|
+
export const startViewTransition = async (target, type = 'forwards', updateCallbackOrOptions = async () => { }) => {
|
|
21
|
+
debug(`startViewTransition (${type})`, target);
|
|
22
|
+
if (!(target instanceof HTMLElement))
|
|
23
|
+
throw new TypeError("Argument 1 ('target') to client.startViewTransition must be an instance of HTMLElement");
|
|
24
|
+
if (!['forwards', 'backwards', 'reload'].includes(type))
|
|
25
|
+
throw new TypeError("Argument 2 ('type') to client.startViewTransition must be of TransitionType");
|
|
26
|
+
const options = typeof updateCallbackOrOptions === 'function'
|
|
27
|
+
? {
|
|
28
|
+
updateCallback: updateCallbackOrOptions,
|
|
29
|
+
}
|
|
30
|
+
: (updateCallbackOrOptions ?? {}), updateCallback = options.updateCallback ?? (async () => { });
|
|
31
|
+
await Snapshot.waitReady;
|
|
32
|
+
const from = new NavigationPath(target); //const from = closestBody(target) //event.target as HTMLElement)
|
|
33
|
+
if ('forwards' === type) {
|
|
34
|
+
await updateCallback(); // updatetheDOMSomehow
|
|
35
|
+
// Snapshot.getSnapshot(from)
|
|
36
|
+
// const root = getRootViewController(from)
|
|
37
|
+
// const oldPath = new NavigationPath(from)
|
|
38
|
+
const root = [from, ...from.parents()]
|
|
39
|
+
.map((item) => item.component)
|
|
40
|
+
.filter(Boolean)
|
|
41
|
+
.at(-1);
|
|
42
|
+
// const { toolBarConfig: oldToolbars } = getComputedView(from) // const { toolBarConfig: oldToolbars, slot: oldSLot, page: oldPage } = getComputedView(from) //
|
|
43
|
+
// console.log(88, oldPage, oldPath.page, oldSLot, oldPath.slot, oldToolbars, oldPath.toolBarConfig)
|
|
44
|
+
// const oldToolbars = Snapshot.toolbarItems
|
|
45
|
+
// const { toolBarConfig: oldToolbars, host: oldHost } = getComputedView(from)
|
|
46
|
+
const tos = options.tos?.() ?? [...from.children()].map((item) => item?.hydrate()), //queryBodyAll(oldSLot), //[...oldPath.children()].map((item) => item.body).filter(Boolean),//
|
|
47
|
+
to = tos.at(-1),
|
|
48
|
+
// to = newPath?.body, //tos.slice(-1)?.pop?.(), //Snapshot.leaf, //
|
|
49
|
+
// newHost = newPath?.component, //{ host: newHost } = getComputedView(to),
|
|
50
|
+
newToolbars = tos.flatMap((item) => item.toolBarConfig ?? []).filter((item) => !!item),
|
|
51
|
+
// .map((item) => item.toolBarConfig)
|
|
52
|
+
// .flat()
|
|
53
|
+
// .filter(Boolean), //queryToolbarConfigAll(oldSLot),
|
|
54
|
+
modalViews = tos.map((item) => item.component).filter((item) => !!item && item.matches('dialog')); //[...queryHostAll(oldPage)].filter?.((item) => item?.matches('dialog'))
|
|
55
|
+
// toFrame = Snapshot.leafContainer, //queryHostAll(from).slice(-1)?.pop?.(),
|
|
56
|
+
// toToolbars = Snapshot.leafToolbarItems
|
|
57
|
+
// dialogFrames = [toFrame, ...(Snapshot.leaveFrames ?? [])].filter((item): item is HTMLDialogElement => item instanceof HTMLDialogElement) //[toFrame, ...(Snapshot.leaveFrames ?? [])].filter((item) => item?.matches('dialog'))
|
|
58
|
+
// if ('DIALOG' === newHost?.tagName) {
|
|
59
|
+
// ;(newHost as HTMLDialogElement).showModal()
|
|
60
|
+
// debug(`⚡️ view-transition-start (${type})`)
|
|
61
|
+
// await Promise.allSettled(newHost.getAnimations().map(({ finished }) => finished))
|
|
62
|
+
// debug(`⚡️ view-transition-end (${type})`)
|
|
63
|
+
// return
|
|
64
|
+
// }
|
|
65
|
+
// purge
|
|
66
|
+
cleanup(root, 'backwards');
|
|
67
|
+
// prepare old
|
|
68
|
+
from.body?.classList.add(Snapshot.config['vt-fwd-class-name']);
|
|
69
|
+
from.body?.dispatchEvent(new CustomEvent('pageswap', { detail: { page: from.body }, bubbles: true, composed: true }));
|
|
70
|
+
for (const oldToolbar of from.toolBarConfig ?? [])
|
|
71
|
+
oldToolbar.classList.add('fwn'); // prepare navbs
|
|
72
|
+
// prepare new
|
|
73
|
+
const toolbarExclusion = 0 < modalViews.length
|
|
74
|
+
? (value, index, array) => value.parentElement?.matches('tool-bar:not(dialog tool-bar,body-view ~ tool-bar)')
|
|
75
|
+
: (value, index, array) => value.parentElement?.matches('tool-bar:not(body-view ~ tool-bar)'), bodyExclusion = 0 < modalViews.length ? (item) => item.body?.matches('scroll-view:not(dialog scroll-view)') : (value, index, array) => value;
|
|
76
|
+
for (const bti of newToolbars?.filter?.(toolbarExclusion) ?? [])
|
|
77
|
+
bti.classList.add('fwnn'); // for (const ti of newToolbars ?? []) ti.classList.add('fwnn') //
|
|
78
|
+
for (const bt of tos?.filter?.(bodyExclusion) ?? []) {
|
|
79
|
+
bt.body?.classList.add('fwdd'); //to?.classList.add('fwdd')
|
|
80
|
+
bt.body?.dispatchEvent(new CustomEvent('pagereveal', { detail: { page: bt.body }, bubbles: true, composed: true }));
|
|
81
|
+
}
|
|
82
|
+
if (0 < modalViews.length) {
|
|
83
|
+
for await (const el of modalViews)
|
|
84
|
+
el.showModal();
|
|
85
|
+
debug(`⚡️ view-dialog-transition-start (${type})`);
|
|
86
|
+
await Promise.allSettled(modalViews?.[0].getAnimations().map(({ finished }) => finished));
|
|
87
|
+
debug(`⚡️ view-dialog-transition-end (${type})`);
|
|
88
|
+
}
|
|
89
|
+
else {
|
|
90
|
+
debug(`⚡️ view-transition-start (${type})`);
|
|
91
|
+
await Promise.allSettled([...(from.body?.getAnimations().map(({ finished }) => finished) ?? []), ...(to?.body?.getAnimations().map(({ finished }) => finished) ?? [])]);
|
|
92
|
+
debug(`⚡️ view-transition-end (${type})`);
|
|
93
|
+
}
|
|
94
|
+
if (0 < (to?.component?.querySelectorAll(`.${Snapshot.config?.['vt-fwd-class-name']},.bwd`) ?? []).length)
|
|
95
|
+
return;
|
|
96
|
+
cleanup(root);
|
|
97
|
+
}
|
|
98
|
+
else {
|
|
99
|
+
// Snapshot.getSnapshot(from)
|
|
100
|
+
// const oldPath = new NavigationPath(from)
|
|
101
|
+
const root = [from, ...from.parents()]
|
|
102
|
+
.map((item) => item.component)
|
|
103
|
+
.filter(Boolean)
|
|
104
|
+
.at(-1); // const root = getRootViewController(from)
|
|
105
|
+
//const { toolBarConfig: oldToolbars, host: oldHost, page: oldPage, slot: oldSlot } = getComputedView(from)
|
|
106
|
+
const froms = [...from.children()].map((item) => item?.hydrate());
|
|
107
|
+
const oldToolbars = froms.flatMap((item) => item.toolBarConfig ?? []).filter((item) => !!item), oldBodies = froms.map((item) => item.body).filter((item) => !!item);
|
|
108
|
+
// console.log(99, queryToolbarConfigAll(oldSlot), oldToolbars)
|
|
109
|
+
// if most-top effect is closing a modal, skip everything
|
|
110
|
+
if ('DIALOG' === from.component?.tagName) {
|
|
111
|
+
from.body?.dispatchEvent(new CustomEvent('pageswap', { detail: { page: from.body }, bubbles: true, composed: true }));
|
|
112
|
+
from.component.close();
|
|
113
|
+
debug(`⚡️ view-dialog-transition-start (${type})`);
|
|
114
|
+
await Promise.allSettled(from.component.getAnimations().map(({ finished }) => finished));
|
|
115
|
+
debug(`⚡️ view-dialog-transition-end (${type})`);
|
|
116
|
+
if (from.component.matches('[open]'))
|
|
117
|
+
return;
|
|
118
|
+
await updateCallback();
|
|
119
|
+
return; // just close modal
|
|
120
|
+
}
|
|
121
|
+
const to = [...from.parents()].at(0)?.hydrate(); //closestBody(oldPath.component?.parentElement ?? undefined)
|
|
122
|
+
if (!to)
|
|
123
|
+
return console.debug('Can not go backwards.'); // nothing to go back to
|
|
124
|
+
const tv = to.body?.closest('tab-view');
|
|
125
|
+
if (tv && to.body?.matches('tab-view>navigation-stack:has(> navigation-stack,> navigation-split-view)>:scope'))
|
|
126
|
+
if ('bottom-bar' !== tv.tabBarPlacement)
|
|
127
|
+
return;
|
|
128
|
+
// const { toolBarConfig: newToolbars } = getComputedView(to.body)
|
|
129
|
+
// purge
|
|
130
|
+
cleanup(root, 'forwards');
|
|
131
|
+
// prepare new
|
|
132
|
+
for (const ti of to.toolBarConfig ?? [])
|
|
133
|
+
ti.classList.add('bwnn');
|
|
134
|
+
to.body?.classList.add('bwdd');
|
|
135
|
+
to.body?.dispatchEvent(new CustomEvent('pagereveal', { detail: { page: to.body }, bubbles: true, composed: true }));
|
|
136
|
+
// prepare old
|
|
137
|
+
const inbetweenModals = froms.map((item) => item.component).filter((item) => !!item && item.matches('dialog[open]')), //queryHostAll(oldPage).filter?.((item) => item.matches('dialog[open]')) ?? [], // FIXME: TEst this, added oldHost too
|
|
138
|
+
toolbarExclusion = 0 < inbetweenModals.length
|
|
139
|
+
? (value, index, array) => value.parentElement?.matches('tool-bar:not(dialog tool-bar)')
|
|
140
|
+
: (value, index, array) => value, bodyExclusion = 0 < inbetweenModals.length ? (item) => item?.matches('scroll-view:not(dialog scroll-view)') : (item) => item;
|
|
141
|
+
for (const ti of [...(from.toolBarConfig ?? []), ...(oldToolbars?.filter?.(toolbarExclusion) ?? [])])
|
|
142
|
+
ti.classList.add('bwn');
|
|
143
|
+
for (const nn of [from.body, ...oldBodies?.filter?.(bodyExclusion)]) {
|
|
144
|
+
nn?.classList.add('bwd'); //from?.classList.add('bwd')
|
|
145
|
+
nn?.dispatchEvent(new CustomEvent('pageswap', { detail: { page: nn }, bubbles: true, composed: true }));
|
|
146
|
+
}
|
|
147
|
+
for (const el of inbetweenModals)
|
|
148
|
+
el.close(); // close old inbetween modals
|
|
149
|
+
// capture trans
|
|
150
|
+
debug(`⚡️ view-transition-start (${type})`);
|
|
151
|
+
await Promise.allSettled([...(from.body?.getAnimations().map(({ finished }) => finished) ?? []), ...(to.body?.getAnimations().map(({ finished }) => finished) ?? [])]);
|
|
152
|
+
debug(`⚡️ view-transition-end (${type})`);
|
|
153
|
+
if (to.body?.closest(`.bwd,.${Snapshot.config?.['vt-fwd-class-name']}`))
|
|
154
|
+
return;
|
|
155
|
+
cleanup(root);
|
|
156
|
+
// remove or hide
|
|
157
|
+
await updateCallback();
|
|
158
|
+
}
|
|
159
|
+
};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { type TemplateResult } from '../../tpl';
|
|
2
|
+
declare const DEFAULT: ">1";
|
|
3
|
+
interface MintFn {
|
|
4
|
+
(markup: TemplateResult): DocumentFragment;
|
|
5
|
+
<T extends Element = Element>(markup: TemplateResult, selector: typeof DEFAULT): T;
|
|
6
|
+
<T extends Element = Element>(markup: TemplateResult, selector: string): T;
|
|
7
|
+
}
|
|
8
|
+
declare const mint: MintFn;
|
|
9
|
+
export default mint;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { renderToString } from '../../morphdom';
|
|
2
|
+
const DEFAULT = '>1';
|
|
3
|
+
const mint = ((markup, selector) => {
|
|
4
|
+
const template = Object.assign(document.createElement('template'), { innerHTML: renderToString(markup).toString() });
|
|
5
|
+
if (!selector)
|
|
6
|
+
return template.content;
|
|
7
|
+
if (selector === DEFAULT)
|
|
8
|
+
return template.content.firstElementChild;
|
|
9
|
+
return template.content.querySelector('>1' === selector ? ':first-child' : selector);
|
|
10
|
+
});
|
|
11
|
+
export default mint;
|
|
@@ -1,19 +1,3 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @example
|
|
3
|
-
* compareBigDecimals("1e3", "1000") // 0
|
|
4
|
-
* compareBigDecimals("1e-3", "0.001") // 0
|
|
5
|
-
* compareBigDecimals("-10", "-2") // -1 ✅
|
|
6
|
-
* const arr = ["1.2","1.10","1.02","1e2","100","-0.5"]
|
|
7
|
-
* arr.sort(compareBigDecimals)
|
|
8
|
-
* console.log(arr)
|
|
9
|
-
* function isInRange(value: string, min: string, max: string): boolean {return compareBigDecimals(value, min) >= 0 && compareBigDecimals(value, max) <= 0}
|
|
10
|
-
* // examples
|
|
11
|
-
* isInRange("-5", "-10", "-1") // true
|
|
12
|
-
* isInRange("-11", "-10", "-1") // false
|
|
13
|
-
* isInRange("0", "-10", "-1") // false
|
|
14
|
-
* isInRange("-Infinity", "-Infinity", "-1") // true
|
|
15
|
-
* isInRange("5", "-Infinity", "Infinity") // true
|
|
16
|
-
*/
|
|
17
1
|
const POSITIVE_INFINITY = 'Infinity', NEGATIVE_INFINITY = '-Infinity';
|
|
18
2
|
export default function (a, b) {
|
|
19
3
|
const aInf = isInfinity(a), bInf = isInfinity(b);
|
|
@@ -75,7 +59,13 @@ function parse(input) {
|
|
|
75
59
|
if (exp > 0) {
|
|
76
60
|
const move = Math.min(exp, f.length);
|
|
77
61
|
i += f.slice(0, move);
|
|
78
|
-
f = f.slice(move)
|
|
62
|
+
f = f.slice(move);
|
|
63
|
+
const remaining = exp - move;
|
|
64
|
+
if (remaining > 0)
|
|
65
|
+
i += '0'.repeat(remaining);
|
|
66
|
+
// const move = Math.min(exp, f.length)
|
|
67
|
+
// i += f.slice(0, move)
|
|
68
|
+
// f = f.slice(move) + '0'.repeat(exp - move)
|
|
79
69
|
}
|
|
80
70
|
else if (exp < 0) {
|
|
81
71
|
const move = Math.min(-exp, i.length);
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function (...args: Parameters<typeof self.console.debug>): void;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function <const T extends object>(factory: () => T): () => T;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function (target: HTMLElement | null, role: string | null, titleKey?: string | null, config?: Record<string, string>): void;
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import { I18n } from '../../i18n';
|
|
2
|
+
import { queryMorph } from '../../morphdom';
|
|
3
|
+
import { html } from '../../tpl';
|
|
4
|
+
export default function (target, role, titleKey, config) {
|
|
5
|
+
if (!target)
|
|
6
|
+
return;
|
|
7
|
+
const overiderTitle = typeof titleKey === 'string' && titleKey in I18n.t('ButtonRole') ? titleKey : undefined;
|
|
8
|
+
let title, systemImage;
|
|
9
|
+
switch (role) {
|
|
10
|
+
case 'cancel':
|
|
11
|
+
title = overiderTitle && overiderTitle in I18n.t('ButtonRole') ? I18n.t('ButtonRole')[overiderTitle] : I18n.t('ButtonRole').Cancel;
|
|
12
|
+
systemImage = config?.['cancel-button-icon'] ?? '';
|
|
13
|
+
break;
|
|
14
|
+
case 'close':
|
|
15
|
+
if (target.closest('[is=alert-dialog]')) {
|
|
16
|
+
title = overiderTitle && overiderTitle in I18n.t('ButtonRole') ? I18n.t('ButtonRole')[overiderTitle] : I18n.t('ButtonRole').OK;
|
|
17
|
+
}
|
|
18
|
+
else {
|
|
19
|
+
title = overiderTitle && overiderTitle in I18n.t('ButtonRole') ? I18n.t('ButtonRole')[overiderTitle] : I18n.t('ButtonRole').Close;
|
|
20
|
+
systemImage = config?.['close-button-icon'] ?? '';
|
|
21
|
+
}
|
|
22
|
+
break;
|
|
23
|
+
case 'confirm':
|
|
24
|
+
title = overiderTitle && overiderTitle in I18n.t('ButtonRole') ? I18n.t('ButtonRole')[overiderTitle] : I18n.t('ButtonRole').Confirm;
|
|
25
|
+
systemImage = config?.['confirm-button-icon'] ?? '';
|
|
26
|
+
break;
|
|
27
|
+
case 'confirmation-action':
|
|
28
|
+
title = overiderTitle && overiderTitle in I18n.t('ButtonRole') ? I18n.t('ButtonRole')[overiderTitle] : I18n.t('ButtonRole').Confirm;
|
|
29
|
+
systemImage = config?.['confirm-button-icon'] ?? '';
|
|
30
|
+
break;
|
|
31
|
+
case 'cancellation-action':
|
|
32
|
+
title = overiderTitle && overiderTitle in I18n.t('ButtonRole') ? I18n.t('ButtonRole')[overiderTitle] : I18n.t('ButtonRole').Cancel;
|
|
33
|
+
systemImage = config?.['cancel-button-icon'] ?? '';
|
|
34
|
+
break;
|
|
35
|
+
case 'destructive':
|
|
36
|
+
title = overiderTitle && overiderTitle in I18n.t('ButtonRole') ? I18n.t('ButtonRole')[overiderTitle] : I18n.t('ButtonRole').Destructive;
|
|
37
|
+
systemImage = config?.['delete-button-icon'] ?? '';
|
|
38
|
+
break;
|
|
39
|
+
}
|
|
40
|
+
queryMorph('[slot=placeholder]', html `<label-view slot="placeholder">${systemImage ? html `<image-view slot="icon" system-name="${systemImage}"></image-view>` : null}${title ? html `<span>${title}</span>` : null}</label-view>`, target, { removeIf: !title });
|
|
41
|
+
}
|
|
@@ -1,17 +1,54 @@
|
|
|
1
|
-
|
|
1
|
+
export { default as $ } from './$';
|
|
2
|
+
export * from './$';
|
|
2
3
|
export { default as add } from './add';
|
|
4
|
+
export * from './add';
|
|
5
|
+
export { default as ancestors } from './ancestors';
|
|
6
|
+
export * from './ancestors';
|
|
3
7
|
export { default as clamp } from './clamp';
|
|
8
|
+
export * from './clamp';
|
|
4
9
|
export { default as compareBigDecimals } from './compare-big-decimals';
|
|
10
|
+
export * from './compare-big-decimals';
|
|
5
11
|
export { default as cssTime } from './css-time';
|
|
12
|
+
export * from './css-time';
|
|
6
13
|
export { default as debounce } from './debounce';
|
|
14
|
+
export * from './debounce';
|
|
15
|
+
export { default as debug } from './debug';
|
|
16
|
+
export * from './debug';
|
|
17
|
+
export { default as defineTranslations } from './define-translations';
|
|
18
|
+
export * from './define-translations';
|
|
19
|
+
export { default as ensurePlaceholder } from './ensure-placeholder';
|
|
20
|
+
export * from './ensure-placeholder';
|
|
7
21
|
export { default as frame } from './frame';
|
|
22
|
+
export * from './frame';
|
|
23
|
+
export { default as isInside } from './is-inside';
|
|
24
|
+
export * from './is-inside';
|
|
8
25
|
export { default as kebabCase } from './kebab-case';
|
|
26
|
+
export * from './kebab-case';
|
|
9
27
|
export { default as listActive } from './list-active';
|
|
28
|
+
export * from './list-active';
|
|
10
29
|
export { default as microtask } from './microtask';
|
|
30
|
+
export * from './microtask';
|
|
31
|
+
export { default as nextAll } from './next-all';
|
|
32
|
+
export * from './next-all';
|
|
33
|
+
export { default as next } from './next';
|
|
34
|
+
export * from './next';
|
|
11
35
|
export { default as onoff } from './onoff';
|
|
36
|
+
export * from './onoff';
|
|
37
|
+
export { default as prevAll } from './prev-all';
|
|
38
|
+
export * from './prev-all';
|
|
39
|
+
export { default as prev } from './prev';
|
|
40
|
+
export * from './prev';
|
|
41
|
+
export { default as prop } from './prop';
|
|
42
|
+
export * from './prop';
|
|
12
43
|
export { default as set } from './set';
|
|
44
|
+
export * from './set';
|
|
45
|
+
export { default as siblings } from './siblings';
|
|
46
|
+
export * from './siblings';
|
|
13
47
|
export { default as sleep } from './sleep';
|
|
48
|
+
export * from './sleep';
|
|
14
49
|
export { default as slowHideShow } from './slow-hide-show';
|
|
50
|
+
export * from './slow-hide-show';
|
|
15
51
|
export { default as timeout } from './timeout';
|
|
52
|
+
export * from './timeout';
|
|
16
53
|
export { default as touchGlass } from './touch-glass';
|
|
17
|
-
export
|
|
54
|
+
export * from './touch-glass';
|
|
@@ -1,18 +1,54 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
export { default as $ } from './$';
|
|
2
|
+
export * from './$';
|
|
3
3
|
export { default as add } from './add';
|
|
4
|
+
export * from './add';
|
|
5
|
+
export { default as ancestors } from './ancestors';
|
|
6
|
+
export * from './ancestors';
|
|
4
7
|
export { default as clamp } from './clamp';
|
|
8
|
+
export * from './clamp';
|
|
5
9
|
export { default as compareBigDecimals } from './compare-big-decimals';
|
|
10
|
+
export * from './compare-big-decimals';
|
|
6
11
|
export { default as cssTime } from './css-time';
|
|
12
|
+
export * from './css-time';
|
|
7
13
|
export { default as debounce } from './debounce';
|
|
14
|
+
export * from './debounce';
|
|
15
|
+
export { default as debug } from './debug';
|
|
16
|
+
export * from './debug';
|
|
17
|
+
export { default as defineTranslations } from './define-translations';
|
|
18
|
+
export * from './define-translations';
|
|
19
|
+
export { default as ensurePlaceholder } from './ensure-placeholder';
|
|
20
|
+
export * from './ensure-placeholder';
|
|
8
21
|
export { default as frame } from './frame';
|
|
22
|
+
export * from './frame';
|
|
23
|
+
export { default as isInside } from './is-inside';
|
|
24
|
+
export * from './is-inside';
|
|
9
25
|
export { default as kebabCase } from './kebab-case';
|
|
26
|
+
export * from './kebab-case';
|
|
10
27
|
export { default as listActive } from './list-active';
|
|
28
|
+
export * from './list-active';
|
|
11
29
|
export { default as microtask } from './microtask';
|
|
30
|
+
export * from './microtask';
|
|
31
|
+
export { default as nextAll } from './next-all';
|
|
32
|
+
export * from './next-all';
|
|
33
|
+
export { default as next } from './next';
|
|
34
|
+
export * from './next';
|
|
12
35
|
export { default as onoff } from './onoff';
|
|
36
|
+
export * from './onoff';
|
|
37
|
+
export { default as prevAll } from './prev-all';
|
|
38
|
+
export * from './prev-all';
|
|
39
|
+
export { default as prev } from './prev';
|
|
40
|
+
export * from './prev';
|
|
41
|
+
export { default as prop } from './prop';
|
|
42
|
+
export * from './prop';
|
|
13
43
|
export { default as set } from './set';
|
|
44
|
+
export * from './set';
|
|
45
|
+
export { default as siblings } from './siblings';
|
|
46
|
+
export * from './siblings';
|
|
14
47
|
export { default as sleep } from './sleep';
|
|
48
|
+
export * from './sleep';
|
|
15
49
|
export { default as slowHideShow } from './slow-hide-show';
|
|
50
|
+
export * from './slow-hide-show';
|
|
16
51
|
export { default as timeout } from './timeout';
|
|
52
|
+
export * from './timeout';
|
|
17
53
|
export { default as touchGlass } from './touch-glass';
|
|
18
|
-
export
|
|
54
|
+
export * from './touch-glass';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function (x: number, y: number, rect: DOMRect): boolean;
|
|
@@ -1,11 +1,8 @@
|
|
|
1
1
|
export default function (str) {
|
|
2
|
-
return
|
|
3
|
-
// Replace uppercase letters with - + lowercase
|
|
4
|
-
.replace(/
|
|
5
|
-
//
|
|
6
|
-
.
|
|
7
|
-
//
|
|
8
|
-
.toLowerCase()
|
|
9
|
-
// Remove leading/trailing dashes
|
|
10
|
-
.replace(/^-+|-+$/g, ''));
|
|
2
|
+
return str
|
|
3
|
+
.replace(/([A-Z])/g, '-$1') // Replace uppercase letters with - + lowercase
|
|
4
|
+
.replace(/[\s_]+/g, '-') // Replace spaces and underscores with -
|
|
5
|
+
.replace(/-+/g, '-') // collapse any run of dashes into one
|
|
6
|
+
.toLowerCase() // Convert to lowercase
|
|
7
|
+
.replace(/^-+|-+$/g, ''); // Remove leading/trailing dashes
|
|
11
8
|
}
|
|
@@ -1,28 +1,83 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
const touchList = new WeakMap();
|
|
2
|
+
function onDown({ target }) {
|
|
3
|
+
if (!(target instanceof HTMLElement))
|
|
4
|
+
return;
|
|
5
|
+
const el = target.closest('button,summary');
|
|
3
6
|
if (!el)
|
|
4
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;
|
|
5
24
|
el.classList.add('active');
|
|
6
|
-
el.
|
|
25
|
+
el.removeEventListener('pointerover', onOver);
|
|
26
|
+
el.addEventListener('pointerleave', onLeave, { once: true, passive: true });
|
|
7
27
|
}
|
|
8
|
-
function
|
|
9
|
-
|
|
28
|
+
function onLeave({ target }) {
|
|
29
|
+
if (!(target instanceof HTMLElement))
|
|
30
|
+
return;
|
|
31
|
+
const el = target.closest('button,summary');
|
|
10
32
|
if (!el)
|
|
11
33
|
return;
|
|
12
|
-
|
|
13
|
-
|
|
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') ?? []) {
|
|
14
64
|
el.classList.remove('active');
|
|
15
|
-
|
|
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
|
+
}
|
|
16
71
|
}
|
|
17
|
-
const
|
|
18
|
-
return
|
|
72
|
+
const makePointerdownHandler = (target) => {
|
|
73
|
+
return onDown;
|
|
19
74
|
}, makePointerCancelHandler = (target) => {
|
|
20
75
|
return onCancel;
|
|
21
76
|
};
|
|
22
77
|
export default function (t) {
|
|
23
|
-
const
|
|
78
|
+
const downListener = makePointerdownHandler(t), offListener = makePointerCancelHandler(t);
|
|
24
79
|
return [
|
|
25
|
-
{ types: 'pointerdown', listener:
|
|
80
|
+
{ types: 'pointerdown', listener: downListener, addOptions: { passive: true } },
|
|
26
81
|
{ types: 'pointerup pointercancel', listener: offListener, addOptions: { passive: true } },
|
|
27
82
|
];
|
|
28
83
|
}
|
|
@@ -1,19 +1,19 @@
|
|
|
1
|
-
const
|
|
1
|
+
const makePointerdownHandler = (target, targetCallback, checkCallback) => {
|
|
2
2
|
return function (evt) {
|
|
3
3
|
// if (event.pointerType !== 'touch') return
|
|
4
4
|
if (!checkCallback(evt))
|
|
5
5
|
return;
|
|
6
6
|
targetCallback(target).toggleAttribute('touch-glass', true);
|
|
7
7
|
};
|
|
8
|
-
},
|
|
8
|
+
}, makePointercancelHandler = (target, targetCallback) => {
|
|
9
9
|
return function (evt) {
|
|
10
10
|
targetCallback(target).toggleAttribute('touch-glass', false);
|
|
11
11
|
};
|
|
12
12
|
};
|
|
13
13
|
export default function (t, targetCallback, checkCallback) {
|
|
14
|
-
const
|
|
14
|
+
const downListener = makePointerdownHandler(t, targetCallback, checkCallback), cancelListener = makePointercancelHandler(t, targetCallback);
|
|
15
15
|
return [
|
|
16
|
-
{ types: 'pointerdown', listener:
|
|
17
|
-
{ types: 'pointerup pointercancel pointerleave', listener:
|
|
16
|
+
{ types: 'pointerdown', listener: downListener, addOptions: { passive: true } },
|
|
17
|
+
{ types: 'pointerup pointercancel pointerleave', listener: cancelListener, addOptions: { passive: true } },
|
|
18
18
|
];
|
|
19
19
|
}
|