@swiftwc/ui 0.0.0-dev.3 → 0.0.0-dev.30
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 +31 -2
- package/generated/client/index.js +415 -8
- package/generated/components/alert-dialog.d.ts +8 -0
- package/generated/components/alert-dialog.js +94 -0
- package/generated/components/body-view.d.ts +5 -0
- package/generated/components/body-view.js +11 -0
- package/generated/components/bordered-button.d.ts +13 -0
- package/generated/components/bordered-button.js +42 -0
- package/generated/components/bordered-prominent-button.d.ts +13 -0
- package/generated/components/bordered-prominent-button.js +42 -0
- package/generated/components/borderless-button.d.ts +13 -0
- package/generated/components/borderless-button.js +42 -0
- package/generated/components/confirmation-dialog.d.ts +9 -0
- package/generated/components/confirmation-dialog.js +108 -0
- package/generated/components/content-unavailable-view.d.ts +24 -0
- package/generated/components/content-unavailable-view.js +78 -0
- package/generated/components/date-picker.d.ts +46 -0
- package/generated/components/date-picker.js +442 -0
- package/generated/components/disclosure-group.d.ts +9 -0
- package/generated/components/disclosure-group.js +54 -0
- package/generated/components/fine-tooltip.d.ts +7 -0
- package/generated/components/fine-tooltip.js +104 -0
- package/generated/components/form-view.d.ts +6 -0
- package/generated/components/form-view.js +58 -0
- package/generated/components/glass-button.d.ts +12 -0
- package/generated/components/glass-button.js +39 -0
- package/generated/components/glass-prominent-button.d.ts +12 -0
- package/generated/components/glass-prominent-button.js +39 -0
- package/generated/components/index.d.ts +41 -1
- package/generated/components/index.js +41 -6
- package/generated/components/label-view.d.ts +9 -0
- package/generated/components/label-view.js +56 -0
- package/generated/components/list-view.d.ts +5 -0
- package/generated/components/list-view.js +29 -0
- package/generated/components/menu-view.d.ts +9 -0
- package/generated/components/menu-view.js +138 -0
- package/generated/components/navigation-large-title.d.ts +6 -0
- package/generated/components/navigation-large-title.js +177 -0
- package/generated/components/navigation-split-view.d.ts +10 -0
- package/generated/components/navigation-split-view.js +21 -0
- package/generated/components/navigation-stack.d.ts +10 -0
- package/generated/components/navigation-stack.js +27 -0
- package/generated/components/navigation-title.d.ts +8 -0
- package/generated/components/navigation-title.js +49 -0
- package/generated/components/picker-view.d.ts +27 -0
- package/generated/components/picker-view.js +452 -0
- package/generated/components/plain-button.d.ts +7 -0
- package/generated/components/plain-button.js +20 -0
- package/generated/components/progress-view.d.ts +13 -0
- package/generated/components/progress-view.js +122 -0
- package/generated/components/screen-view.d.ts +5 -0
- package/generated/components/screen-view.js +9 -0
- package/generated/components/scroll-view-proxy.d.ts +8 -0
- package/generated/components/scroll-view-proxy.js +14 -0
- package/generated/components/scroll-view.d.ts +10 -0
- package/generated/components/scroll-view.js +197 -0
- package/generated/components/section-view.d.ts +9 -0
- package/generated/components/section-view.js +81 -0
- package/generated/components/sheet-view.d.ts +8 -0
- package/generated/components/sheet-view.js +85 -0
- package/generated/components/sidebar-toggle.d.ts +7 -0
- package/generated/components/sidebar-toggle.js +82 -0
- package/generated/components/sidebar-view.d.ts +7 -0
- package/generated/components/sidebar-view.js +35 -0
- package/generated/components/sticky-container.d.ts +6 -0
- package/generated/components/sticky-container.js +24 -0
- package/generated/components/tab-bar.d.ts +10 -0
- package/generated/components/tab-bar.js +42 -0
- package/generated/components/tab-item.d.ts +7 -0
- package/generated/components/tab-item.js +125 -0
- package/generated/components/tab-view.d.ts +22 -0
- package/generated/components/tab-view.js +259 -0
- package/generated/components/table-view.d.ts +7 -0
- package/generated/components/table-view.js +187 -0
- package/generated/components/text-field.d.ts +29 -0
- package/generated/components/text-field.js +478 -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 +7 -0
- package/generated/components/tool-bar-item.js +53 -0
- package/generated/components/tool-bar.d.ts +19 -0
- package/generated/components/tool-bar.js +90 -0
- package/generated/components/v-keyboard.d.ts +11 -0
- package/generated/components/v-keyboard.js +81 -0
- package/generated/components/v-stack.d.ts +10 -0
- package/generated/components/v-stack.js +16 -0
- package/generated/css/index.css +8067 -0
- package/generated/events/alert-dialog.d.ts +8 -0
- package/generated/events/alert-dialog.js +1 -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 +8 -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 +15 -0
- package/generated/i18n/locales/el.js +15 -0
- package/generated/i18n/locales/en.d.ts +15 -0
- package/generated/i18n/locales/en.js +15 -0
- package/generated/i18n/locales/index.d.ts +4 -0
- package/generated/i18n/locales/index.js +4 -0
- package/generated/index.js +1 -1
- 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 +25 -0
- package/generated/internal/class/form-associated-base.d.ts +20 -0
- package/generated/internal/class/form-associated-base.js +96 -0
- package/generated/internal/class/mutation-observer-singleton.d.ts +10 -0
- package/generated/internal/class/mutation-observer-singleton.js +46 -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 +77 -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/custom-element.d.ts +5 -0
- package/generated/internal/decorators/custom-element.js +4 -0
- package/generated/internal/privateNamespace.d.ts +4 -0
- package/generated/internal/privateNamespace.js +1 -0
- package/generated/internal/utils/add.d.ts +1 -0
- package/generated/internal/utils/add.js +7 -0
- package/generated/internal/utils/button-role.d.ts +1 -0
- package/generated/internal/utils/button-role.js +59 -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/css-time.d.ts +1 -0
- package/generated/internal/utils/css-time.js +3 -0
- package/generated/internal/utils/debounce.d.ts +1 -0
- package/generated/internal/utils/debounce.js +13 -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 +19 -1
- package/generated/internal/utils/index.js +20 -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/kebab-case.js +3 -3
- 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/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 +36 -0
- package/generated/namespace-browser/base.js +92 -0
- package/generated/namespace-browser/index.d.ts +7 -0
- package/generated/namespace-browser/index.js +1 -0
- package/generated/snapshot/index.d.ts +9 -0
- package/generated/snapshot/index.js +58 -0
- package/package.json +36 -9
- package/scss/_base.scss +5 -0
- package/scss/_components.scss +82 -0
- package/scss/_final.scss +1 -0
- package/scss/_functions.scss +31 -0
- package/scss/_mixins.scss +7 -0
- package/scss/_placeholders.scss +3 -0
- package/scss/_transitions.scss +32 -0
- package/scss/_utils.scss +9 -0
- package/scss/_vars.scss +179 -3
- package/scss/base/_layout.scss +56 -0
- package/scss/base/_reboot.scss +191 -0
- package/scss/base/_root.scss +397 -0
- package/scss/colors/_index.scss +704 -0
- package/scss/components/_alert-dialog.scss +111 -0
- package/scss/components/_body-view.scss +17 -0
- package/scss/components/_bordered-button.scss +57 -0
- package/scss/components/_bordered-prominent-button.scss +63 -0
- package/scss/components/_borderless-button.scss +44 -0
- package/scss/components/_confirmation-dialog.scss +117 -0
- package/scss/components/_content-unavailable-view.scss +45 -0
- package/scss/components/_date-picker.scss +30 -0
- package/scss/components/_detail-placeholder.scss +153 -0
- package/scss/components/_disclosure-group.scss +175 -0
- package/scss/components/_fine-tooltip.scss +82 -0
- package/scss/components/_form-view.scss +195 -0
- package/scss/components/_full-screen.scss +15 -0
- package/scss/components/_glass-button.scss +59 -0
- package/scss/components/_glass-prominent-button.scss +68 -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/_index.scss +249 -0
- package/scss/components/_label-view copy.scss.txt +420 -0
- package/scss/components/_label-view.scss +355 -0
- package/scss/components/_label-view.scss.txt +536 -0
- package/scss/components/_labeled-content.scss +9 -0
- package/scss/components/_list-view.scss +229 -0
- package/scss/components/_menu-view.scss +205 -0
- package/scss/components/_navigation-large-title.scss +27 -0
- package/scss/components/_navigation-split-view.scss +424 -0
- package/scss/components/_navigation-stack.scss +11 -0
- package/scss/components/_navigation-title.scss +10 -0
- package/scss/components/_picker-view.scss +122 -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 +130 -0
- package/scss/components/_section-view.scss +119 -0
- package/scss/components/_sheet-view.scss +102 -0
- package/scss/components/_sidebar-toggle.scss +121 -0
- package/scss/components/_sidebar-view.scss +53 -0
- package/scss/components/_sticky-container.scss +42 -0
- package/scss/components/_tab-bar.scss +260 -0
- package/scss/components/_tab-item.scss +25 -0
- package/scss/components/_tab-view.scss +312 -0
- package/scss/components/_table-column.scss +52 -0
- package/scss/components/_table-row.scss +172 -0
- package/scss/components/_table-view.scss +223 -0
- package/scss/components/_text-field.scss +37 -0
- package/scss/components/_tool-bar-item-group.scss +48 -0
- package/scss/components/_tool-bar-item.scss +97 -0
- package/scss/components/_tool-bar.scss +153 -0
- package/scss/components/_v-divider.scss +13 -0
- package/scss/components/_v-flex-stack.scss +29 -0
- package/scss/components/_v-keyboard.scss +14 -0
- package/scss/components/_v-stack.scss +25 -0
- package/scss/final/_touch-glass.scss +91 -0
- package/scss/index.scss +15 -6
- 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 +422 -0
- package/scss/placeholders/_buttons.scss +117 -0
- package/scss/placeholders/_lists.scss +561 -0
- package/scss/transitions/_alert-dialog.scss +18 -0
- package/scss/transitions/_bwd.navbar.scss +19 -0
- package/scss/transitions/_bwd.scss +39 -0
- package/scss/transitions/_confirmation-dialog.scss +13 -0
- package/scss/transitions/_disclosure-group.scss +35 -0
- package/scss/transitions/_fine-tooltip.scss +21 -0
- package/scss/transitions/_fwd.navbar.scss +41 -0
- package/scss/transitions/_fwd.scss +24 -0
- package/scss/transitions/_glass-button.scss +12 -0
- package/scss/transitions/_glass-prominent-button.scss +12 -0
- package/scss/transitions/_index.scss +74 -0
- 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 +77 -0
- package/scss/utils/_scroll-view.scss +14 -0
- package/scss/utils/_spacing.scss +25 -0
- package/scss/utils/_stacks.scss +247 -0
- package/web-components.html-data/en.json +458 -0
- package/generated/internal/snapshot.d.ts +0 -5
- package/generated/internal/snapshot.js +0 -23
- package/generated/styles.css +0 -8
- package/scss/_reboot.scss +0 -11
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import { Snapshot } from '../../snapshot';
|
|
2
|
+
export class MutationObserverSingleton {
|
|
3
|
+
#observers = new WeakMap();
|
|
4
|
+
observer;
|
|
5
|
+
constructor() {
|
|
6
|
+
this.observer = Snapshot.waitReady.then(() => {
|
|
7
|
+
return new MutationObserver((entries) => {
|
|
8
|
+
for (const entry of entries)
|
|
9
|
+
this.#observers.get(entry.target)?.(entry);
|
|
10
|
+
});
|
|
11
|
+
});
|
|
12
|
+
}
|
|
13
|
+
async observe(target, callback, options) {
|
|
14
|
+
this.#observers.set(target, callback);
|
|
15
|
+
(await this.observer).observe(target, options);
|
|
16
|
+
}
|
|
17
|
+
async unobserve(target) {
|
|
18
|
+
;
|
|
19
|
+
(await this.observer).disconnect();
|
|
20
|
+
this.#observers.delete(target);
|
|
21
|
+
}
|
|
22
|
+
/** Observes automatically all elements using a Set provided by outside. Calls renderCallback on EVERY change. */
|
|
23
|
+
async syncObservations(set, nodes, renderCallback, attributeFilter) {
|
|
24
|
+
for (const el of set)
|
|
25
|
+
if (!nodes.includes(el)) {
|
|
26
|
+
this.unobserve(el);
|
|
27
|
+
set.delete(el);
|
|
28
|
+
}
|
|
29
|
+
for (const el of nodes) {
|
|
30
|
+
if (!set.has(el))
|
|
31
|
+
this.observe(el, renderCallback, {
|
|
32
|
+
attributes: true,
|
|
33
|
+
characterData: true,
|
|
34
|
+
subtree: true,
|
|
35
|
+
childList: true,
|
|
36
|
+
...(attributeFilter && { attributeFilter }),
|
|
37
|
+
});
|
|
38
|
+
set.add(el);
|
|
39
|
+
}
|
|
40
|
+
}
|
|
41
|
+
async clearObservationsSet(set) {
|
|
42
|
+
for (const el of set)
|
|
43
|
+
this.unobserve(el);
|
|
44
|
+
set.clear();
|
|
45
|
+
}
|
|
46
|
+
}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import type * as Components from '../../components';
|
|
2
|
+
import { type NavigationHost, type NavigationPage, type NavigationToolbarConfiguration } from '../privateNamespace';
|
|
3
|
+
export declare class NavigationPath {
|
|
4
|
+
#private;
|
|
5
|
+
get component(): NavigationHost | undefined;
|
|
6
|
+
get body(): Components.ScrollView | null | undefined;
|
|
7
|
+
get page(): NavigationPage | null | undefined;
|
|
8
|
+
get toolBarConfig(): NavigationToolbarConfiguration[] | undefined;
|
|
9
|
+
get slot(): NavigationHost | null | undefined;
|
|
10
|
+
constructor(any?: HTMLElement);
|
|
11
|
+
hydrate(): this;
|
|
12
|
+
children(): Generator<NavigationPath>;
|
|
13
|
+
parents(): Generator<NavigationPath>;
|
|
14
|
+
[Symbol.iterator](): Generator<NavigationPath>;
|
|
15
|
+
}
|
|
@@ -0,0 +1,84 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Gets current host (closest)
|
|
3
|
+
*/
|
|
4
|
+
function closestHost(any) {
|
|
5
|
+
return any?.closest('body-view,[is=sheet-view],navigation-stack,navigation-split-view') ?? undefined;
|
|
6
|
+
}
|
|
7
|
+
export class NavigationPath {
|
|
8
|
+
#component;
|
|
9
|
+
#slot;
|
|
10
|
+
#body;
|
|
11
|
+
#page;
|
|
12
|
+
#toolBarConfig;
|
|
13
|
+
get component() {
|
|
14
|
+
return this.#component;
|
|
15
|
+
}
|
|
16
|
+
get body() {
|
|
17
|
+
if (undefined === this.#body)
|
|
18
|
+
this.#queryBody();
|
|
19
|
+
return this.#body;
|
|
20
|
+
}
|
|
21
|
+
get page() {
|
|
22
|
+
if (undefined === this.#page)
|
|
23
|
+
this.#queryPage();
|
|
24
|
+
return this.#page;
|
|
25
|
+
}
|
|
26
|
+
get toolBarConfig() {
|
|
27
|
+
if (undefined === this.#toolBarConfig)
|
|
28
|
+
this.#queryToolBarConfig();
|
|
29
|
+
return this.#toolBarConfig;
|
|
30
|
+
}
|
|
31
|
+
get slot() {
|
|
32
|
+
if (undefined === this.#slot)
|
|
33
|
+
this.#querySlot();
|
|
34
|
+
return this.#slot;
|
|
35
|
+
}
|
|
36
|
+
constructor(any) {
|
|
37
|
+
this.#component = closestHost(any);
|
|
38
|
+
}
|
|
39
|
+
#queryBody() {
|
|
40
|
+
this.#body = closestHost(this.#component)?.querySelector(`:scope>scroll-view,:scope>[is=sidebar-view]>scroll-view`) ?? null;
|
|
41
|
+
}
|
|
42
|
+
#queryPage() {
|
|
43
|
+
this.#page = this.#component?.querySelector(':scope>scroll-view,:scope>[is=sidebar-view]') ?? null;
|
|
44
|
+
}
|
|
45
|
+
#queryToolBarConfig() {
|
|
46
|
+
this.#toolBarConfig = [
|
|
47
|
+
...(this.#component?.querySelectorAll(`:scope>tool-bar>tool-bar-item,:scope>tool-bar>tool-bar-item-group,:scope>[is=sidebar-view]>tool-bar>tool-bar-item,:scope>[is=sidebar-view]>tool-bar>tool-bar-item-group`) ?? []),
|
|
48
|
+
];
|
|
49
|
+
}
|
|
50
|
+
#querySlot() {
|
|
51
|
+
this.#slot =
|
|
52
|
+
this.#component?.querySelector(':scope>body-view:not([hidden]),:scope>[is=sheet-view]:not([hidden]),:scope>navigation-stack:not([hidden]),:scope>navigation-split-view:not([hidden])') ?? null;
|
|
53
|
+
}
|
|
54
|
+
hydrate() {
|
|
55
|
+
this.#queryBody();
|
|
56
|
+
this.#queryPage();
|
|
57
|
+
this.#queryToolBarConfig();
|
|
58
|
+
this.#querySlot();
|
|
59
|
+
return this;
|
|
60
|
+
}
|
|
61
|
+
*children() {
|
|
62
|
+
if (!this.slot)
|
|
63
|
+
return;
|
|
64
|
+
const child = new NavigationPath(this.slot);
|
|
65
|
+
yield child;
|
|
66
|
+
yield* child.children();
|
|
67
|
+
}
|
|
68
|
+
*parents() {
|
|
69
|
+
if (!this.#component)
|
|
70
|
+
return;
|
|
71
|
+
let el = this.#component.parentElement;
|
|
72
|
+
while (el) {
|
|
73
|
+
const host = closestHost(el);
|
|
74
|
+
if (!host)
|
|
75
|
+
break;
|
|
76
|
+
yield new NavigationPath(host);
|
|
77
|
+
el = host.parentElement;
|
|
78
|
+
}
|
|
79
|
+
}
|
|
80
|
+
*[Symbol.iterator]() {
|
|
81
|
+
yield this;
|
|
82
|
+
yield* this.children();
|
|
83
|
+
}
|
|
84
|
+
}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
export declare class NavigationView extends HTMLElement {
|
|
2
|
+
#private;
|
|
3
|
+
static get observedAttributes(): string[];
|
|
4
|
+
constructor();
|
|
5
|
+
disconnectedCallback(): void;
|
|
6
|
+
connectedCallback(): void;
|
|
7
|
+
attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
|
|
8
|
+
}
|
|
@@ -0,0 +1,77 @@
|
|
|
1
|
+
var _a;
|
|
2
|
+
import { lifecycleObserver } from '../../buses';
|
|
3
|
+
import { CleanupRegistry } from '../../internal/class/cleanup-registry';
|
|
4
|
+
import { frame, onoff } from '../utils';
|
|
5
|
+
export class NavigationView extends HTMLElement {
|
|
6
|
+
static get observedAttributes() {
|
|
7
|
+
return ['hidden'];
|
|
8
|
+
}
|
|
9
|
+
// pairedEventSystem
|
|
10
|
+
#recentBefore;
|
|
11
|
+
constructor() {
|
|
12
|
+
super();
|
|
13
|
+
}
|
|
14
|
+
disconnectedCallback() {
|
|
15
|
+
CleanupRegistry.unregister(this);
|
|
16
|
+
this.#recentBefore = undefined;
|
|
17
|
+
// this.removeEventListener('tabreveal', this.#handleTabReveal)
|
|
18
|
+
if (this.closest('tab-view'))
|
|
19
|
+
frame().then(() => lifecycleObserver.dispatchEvent(new CustomEvent('tabhide', { detail: { tag: this.id }, bubbles: true, composed: true })));
|
|
20
|
+
}
|
|
21
|
+
connectedCallback() {
|
|
22
|
+
if (this.closest('tab-view')) {
|
|
23
|
+
// frame(this).then((r) => {
|
|
24
|
+
// if (!r) return
|
|
25
|
+
// this.dispatchEvent(new CustomEvent<TabDetail>('tabshow', { detail: { tag: this.id }, bubbles: true, composed: true }))
|
|
26
|
+
// })
|
|
27
|
+
CleanupRegistry.register(this, onoff('beforetabreveal beforetabswap', this.#handleBeforeTabRevealOrSwap, this).on());
|
|
28
|
+
}
|
|
29
|
+
// Snapshot.waitReady.then(async () => {
|
|
30
|
+
if (this.hasAttribute('hidden'))
|
|
31
|
+
return; // will be picked up by attr-change!
|
|
32
|
+
if (this.closest('tab-view'))
|
|
33
|
+
frame(this).then(() => {
|
|
34
|
+
// if (!r) return
|
|
35
|
+
lifecycleObserver.dispatchEvent(new CustomEvent('tabshow', { detail: { tag: this.id }, bubbles: true, composed: true }));
|
|
36
|
+
});
|
|
37
|
+
}
|
|
38
|
+
attributeChangedCallback(name, oldValue, newValue) {
|
|
39
|
+
switch (name) {
|
|
40
|
+
case 'hidden':
|
|
41
|
+
if (oldValue === newValue)
|
|
42
|
+
break;
|
|
43
|
+
if (!this.closest('tab-view'))
|
|
44
|
+
break; // tabview stuff
|
|
45
|
+
let eventType = this.hasAttribute(name) ? 'tabhide' : 'tabshow', target = lifecycleObserver;
|
|
46
|
+
// isRecent by 100ms window
|
|
47
|
+
if (this.#recentBefore && performance.now() - this.#recentBefore.time <= 100) {
|
|
48
|
+
if (this.#recentBefore.type === 'beforetabreveal') {
|
|
49
|
+
eventType = 'tabreveal';
|
|
50
|
+
target = this;
|
|
51
|
+
}
|
|
52
|
+
else if (this.#recentBefore.type === 'beforetabswap') {
|
|
53
|
+
eventType = 'tabswap';
|
|
54
|
+
target = this;
|
|
55
|
+
}
|
|
56
|
+
// consume it (important so it doesn’t leak to next change)
|
|
57
|
+
this.#recentBefore = undefined;
|
|
58
|
+
}
|
|
59
|
+
console.debug(`${_a.name} 💡 ${eventType}`);
|
|
60
|
+
frame(this).then(() => {
|
|
61
|
+
// if (!r) return
|
|
62
|
+
target.dispatchEvent(new CustomEvent(eventType, { detail: { tag: this.id }, bubbles: true, composed: true }));
|
|
63
|
+
});
|
|
64
|
+
break;
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
|
+
#handleBeforeTabRevealOrSwap = (evt) => {
|
|
68
|
+
console.debug(`${_a.name} ⚡️ ${evt?.type}`);
|
|
69
|
+
if (this.id !== evt.detail?.tag)
|
|
70
|
+
return;
|
|
71
|
+
this.#recentBefore = {
|
|
72
|
+
type: evt.type, // beforetabreveal / beforetabswap
|
|
73
|
+
time: performance.now(),
|
|
74
|
+
};
|
|
75
|
+
};
|
|
76
|
+
}
|
|
77
|
+
_a = NavigationView;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { Snapshot } from '../../snapshot';
|
|
2
|
+
export class ResizeObserverSingleton {
|
|
3
|
+
#observers = new WeakMap();
|
|
4
|
+
observer;
|
|
5
|
+
constructor() {
|
|
6
|
+
this.observer = Snapshot.waitReady.then(() => {
|
|
7
|
+
return new ResizeObserver((entries) => {
|
|
8
|
+
for (const entry of entries)
|
|
9
|
+
this.#observers.get(entry.target)?.(entry);
|
|
10
|
+
});
|
|
11
|
+
});
|
|
12
|
+
}
|
|
13
|
+
async observe(target, callback) {
|
|
14
|
+
this.#observers.set(target, callback);
|
|
15
|
+
(await this.observer).observe(target);
|
|
16
|
+
}
|
|
17
|
+
async unobserve(target) {
|
|
18
|
+
;
|
|
19
|
+
(await this.observer).unobserve(target);
|
|
20
|
+
this.#observers.delete(target);
|
|
21
|
+
}
|
|
22
|
+
}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import type * as Components from '../components';
|
|
2
|
+
export type NavigationHost = Components.BodyView | Components.SheetView | Components.NavigationStack | Components.NavigationSplitView;
|
|
3
|
+
export type NavigationToolbarConfiguration = Components.ToolBarItem | Components.ToolBarItemGroup;
|
|
4
|
+
export type NavigationPage = Components.SidebarView | Components.ScrollView;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function <T extends object>(set: Set<T> | WeakSet<T>, value: T): boolean;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function (target: HTMLElement, role: string | null, titleKey?: string | null): void;
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
import { I18n } from '../../i18n';
|
|
2
|
+
import { Snapshot } from '../../snapshot';
|
|
3
|
+
import { CleanupRegistry } from '../class/cleanup-registry';
|
|
4
|
+
import { default as $ } from './cash';
|
|
5
|
+
import onoff from './onoff';
|
|
6
|
+
function renderPlaceholder(el, role, titleKey) {
|
|
7
|
+
if (!el.isConnected)
|
|
8
|
+
return;
|
|
9
|
+
self.requestAnimationFrame(() => {
|
|
10
|
+
if (!el.isConnected)
|
|
11
|
+
return;
|
|
12
|
+
const label = el.querySelector(':scope>[slot=placeholder]') ?? el.appendChild($(`<label-view slot="placeholder"></label-view>`, '>1'));
|
|
13
|
+
switch (role) {
|
|
14
|
+
case 'cancel':
|
|
15
|
+
label.setAttribute('title', titleKey && titleKey in I18n.t('ButtonRole') ? I18n.t('ButtonRole')[titleKey] : I18n.t('ButtonRole').Cancel);
|
|
16
|
+
label.setAttribute('system-image', Snapshot.config['cancel-button-icon']);
|
|
17
|
+
break;
|
|
18
|
+
case 'close':
|
|
19
|
+
if (label.closest('[is=alert-dialog]')) {
|
|
20
|
+
label.setAttribute('title', titleKey && titleKey in I18n.t('ButtonRole') ? I18n.t('ButtonRole')[titleKey] : I18n.t('ButtonRole').OK);
|
|
21
|
+
}
|
|
22
|
+
else {
|
|
23
|
+
label.setAttribute('title', titleKey && titleKey in I18n.t('ButtonRole') ? I18n.t('ButtonRole')[titleKey] : I18n.t('ButtonRole').Close);
|
|
24
|
+
label.setAttribute('system-image', Snapshot.config['close-button-icon']);
|
|
25
|
+
}
|
|
26
|
+
break;
|
|
27
|
+
case 'confirm':
|
|
28
|
+
label.setAttribute('title', titleKey && titleKey in I18n.t('ButtonRole') ? I18n.t('ButtonRole')[titleKey] : I18n.t('ButtonRole').Confirm);
|
|
29
|
+
label.setAttribute('system-image', Snapshot.config['confirm-button-icon']);
|
|
30
|
+
break;
|
|
31
|
+
case 'confirmation-action':
|
|
32
|
+
label.setAttribute('title', titleKey && titleKey in I18n.t('ButtonRole') ? I18n.t('ButtonRole')[titleKey] : I18n.t('ButtonRole').Confirm);
|
|
33
|
+
label.setAttribute('system-image', Snapshot.config['confirm-button-icon']);
|
|
34
|
+
break;
|
|
35
|
+
case 'cancellation-action':
|
|
36
|
+
label.setAttribute('title', titleKey && titleKey in I18n.t('ButtonRole') ? I18n.t('ButtonRole')[titleKey] : I18n.t('ButtonRole').Cancel);
|
|
37
|
+
label.setAttribute('system-image', Snapshot.config['cancel-button-icon']);
|
|
38
|
+
break;
|
|
39
|
+
case 'destructive':
|
|
40
|
+
label.setAttribute('title', titleKey && titleKey in I18n.t('ButtonRole') ? I18n.t('ButtonRole')[titleKey] : I18n.t('ButtonRole').Destructive);
|
|
41
|
+
label.setAttribute('system-image', Snapshot.config['delete-button-icon']);
|
|
42
|
+
break;
|
|
43
|
+
default:
|
|
44
|
+
label?.remove();
|
|
45
|
+
break;
|
|
46
|
+
}
|
|
47
|
+
// if (role) {
|
|
48
|
+
// label.setAttribute('title', I18n.t('ButtonRole').Default.Destructive)
|
|
49
|
+
// } else label?.remove()
|
|
50
|
+
});
|
|
51
|
+
}
|
|
52
|
+
export default function (target, role, titleKey) {
|
|
53
|
+
const overiderTitle = typeof titleKey === 'string' && titleKey in I18n.t('ButtonRole') ? titleKey : undefined;
|
|
54
|
+
renderPlaceholder(target, role, overiderTitle);
|
|
55
|
+
CleanupRegistry.unregister(target, 'i18n');
|
|
56
|
+
CleanupRegistry.register(target, onoff('localechange', () => {
|
|
57
|
+
renderPlaceholder(target, role, overiderTitle);
|
|
58
|
+
}, I18n.on).on(), 'i18n');
|
|
59
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function <T extends Element>(selector: string, element?: Element): T[];
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
export default function (selector, element) {
|
|
2
|
+
const matches = [];
|
|
3
|
+
let current = element?.closest(selector) ?? undefined;
|
|
4
|
+
while (current) {
|
|
5
|
+
matches.push(current);
|
|
6
|
+
current = current.parentElement?.closest(selector) ?? undefined;
|
|
7
|
+
}
|
|
8
|
+
return matches;
|
|
9
|
+
}
|
|
10
|
+
// function querySelectorAllUp(el, selector) {
|
|
11
|
+
// const matches = [];
|
|
12
|
+
// let current = el.parentElement;
|
|
13
|
+
// while (current) {
|
|
14
|
+
// if (current.matches(selector)) matches.push(current);
|
|
15
|
+
// current = current.parentElement;
|
|
16
|
+
// }
|
|
17
|
+
// return matches;
|
|
18
|
+
// }
|
|
19
|
+
// function querySelectorAllUp(el, selector) {
|
|
20
|
+
// const matches = [];
|
|
21
|
+
// let current = el.closest(selector);
|
|
22
|
+
// while (current) {
|
|
23
|
+
// matches.push(current);
|
|
24
|
+
// current = current.parentElement?.closest(selector);
|
|
25
|
+
// }
|
|
26
|
+
// return matches;
|
|
27
|
+
// }
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import ancestors from './ancestors';
|
|
2
|
+
import next from './next';
|
|
3
|
+
import nextAll from './next-all';
|
|
4
|
+
import prev from './prev';
|
|
5
|
+
import prevAll from './prev-all';
|
|
6
|
+
import prop from './prop';
|
|
7
|
+
import siblings from './siblings';
|
|
8
|
+
declare const DEFAULT: ">1";
|
|
9
|
+
interface CashFn {
|
|
10
|
+
(innerHTML: string): DocumentFragment;
|
|
11
|
+
<T extends Element = Element>(innerHTML: string, selector: typeof DEFAULT): T;
|
|
12
|
+
<T extends Element = Element>(innerHTML: string, selector: string): T;
|
|
13
|
+
prop: typeof prop;
|
|
14
|
+
nextAll: typeof nextAll;
|
|
15
|
+
prevAll: typeof prevAll;
|
|
16
|
+
next: typeof next;
|
|
17
|
+
prev: typeof prev;
|
|
18
|
+
siblings: typeof siblings;
|
|
19
|
+
ancestors: typeof ancestors;
|
|
20
|
+
}
|
|
21
|
+
declare const cash: CashFn;
|
|
22
|
+
export default cash;
|
|
23
|
+
export { ancestors, next, nextAll, prev, prevAll, prop, siblings };
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import ancestors from './ancestors';
|
|
2
|
+
import next from './next';
|
|
3
|
+
import nextAll from './next-all';
|
|
4
|
+
import prev from './prev';
|
|
5
|
+
import prevAll from './prev-all';
|
|
6
|
+
import prop from './prop';
|
|
7
|
+
import siblings from './siblings';
|
|
8
|
+
const DEFAULT = '>1';
|
|
9
|
+
const cash = ((innerHTML, selector) => {
|
|
10
|
+
const template = Object.assign(document.createElement('template'), { innerHTML });
|
|
11
|
+
if (!selector)
|
|
12
|
+
return template.content;
|
|
13
|
+
if (selector === DEFAULT)
|
|
14
|
+
return template.content.firstElementChild; // OVERKILL
|
|
15
|
+
return template.content.querySelector('>1' === selector ? ':first-child' : selector);
|
|
16
|
+
});
|
|
17
|
+
cash.prop = prop;
|
|
18
|
+
cash.nextAll = nextAll;
|
|
19
|
+
cash.prevAll = prevAll;
|
|
20
|
+
cash.next = next;
|
|
21
|
+
cash.prev = prev;
|
|
22
|
+
cash.siblings = siblings;
|
|
23
|
+
cash.ancestors = ancestors;
|
|
24
|
+
export default cash;
|
|
25
|
+
export { ancestors, next, nextAll, prev, prevAll, prop, siblings };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function <T extends Element>(selector?: string, element?: Element): T[];
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function <T extends Element>(selector?: string, element?: Element): T | undefined;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function <T extends Element>(selector?: string, element?: Element): T[];
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
export default function (selector, element) {
|
|
2
|
+
const siblings = [];
|
|
3
|
+
let prev = element?.previousElementSibling;
|
|
4
|
+
while (prev) {
|
|
5
|
+
if (!selector || prev.matches(selector))
|
|
6
|
+
siblings.push(prev);
|
|
7
|
+
prev = prev.previousElementSibling;
|
|
8
|
+
}
|
|
9
|
+
return siblings;
|
|
10
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function <T extends Element>(selector?: string, element?: Element): T | undefined;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* A remove/set property utility that checks before doing DOM manipulations.
|
|
3
|
+
* It enforces the important flag, the built-in functionality is to leave it as-is if there was an important flat and the setProperty does not have one
|
|
4
|
+
* In case of undefined it does a removeProperty, the built-in functionality is to add a string representation ("undefined")
|
|
5
|
+
*
|
|
6
|
+
* Notes:
|
|
7
|
+
* By default setProperty does NOT enforce important. It always triggers a DOM manipulation.
|
|
8
|
+
* By default getPropertyValue returns a trimmed string but fails to inform of the presence in the style attribute.
|
|
9
|
+
*
|
|
10
|
+
* Examples:
|
|
11
|
+
* [style] prop('--prop', '1rem', el) style="--prop: 1rem;"
|
|
12
|
+
* [style] prop('--prop', null | '' | undefined, el) style
|
|
13
|
+
* [style] prop('--prop', ' ', el) style="--prop: ;"
|
|
14
|
+
* [style] prop('--prop', ' ', el) style="--prop: ;"
|
|
15
|
+
* style="--prop: 1rem;" prop('--prop', '1rem', el, 'important') style="--prop: 1rem !important;"
|
|
16
|
+
* style="--prop: 1rem !important;" prop('--prop', '1rem', el) style="--prop: 1rem;"
|
|
17
|
+
*/
|
|
18
|
+
export default function (property: string, value?: string | null, el?: HTMLElement | null, priority?: 'important'): void;
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* A remove/set property utility that checks before doing DOM manipulations.
|
|
3
|
+
* It enforces the important flag, the built-in functionality is to leave it as-is if there was an important flat and the setProperty does not have one
|
|
4
|
+
* In case of undefined it does a removeProperty, the built-in functionality is to add a string representation ("undefined")
|
|
5
|
+
*
|
|
6
|
+
* Notes:
|
|
7
|
+
* By default setProperty does NOT enforce important. It always triggers a DOM manipulation.
|
|
8
|
+
* By default getPropertyValue returns a trimmed string but fails to inform of the presence in the style attribute.
|
|
9
|
+
*
|
|
10
|
+
* Examples:
|
|
11
|
+
* [style] prop('--prop', '1rem', el) style="--prop: 1rem;"
|
|
12
|
+
* [style] prop('--prop', null | '' | undefined, el) style
|
|
13
|
+
* [style] prop('--prop', ' ', el) style="--prop: ;"
|
|
14
|
+
* [style] prop('--prop', ' ', el) style="--prop: ;"
|
|
15
|
+
* style="--prop: 1rem;" prop('--prop', '1rem', el, 'important') style="--prop: 1rem !important;"
|
|
16
|
+
* style="--prop: 1rem !important;" prop('--prop', '1rem', el) style="--prop: 1rem;"
|
|
17
|
+
*/
|
|
18
|
+
export default function (property, value, el, priority) {
|
|
19
|
+
if (!el)
|
|
20
|
+
return;
|
|
21
|
+
if (!value) {
|
|
22
|
+
if (-1 !== Array.from(el.style).indexOf(property))
|
|
23
|
+
el.style.removeProperty(property); // remove key entirely
|
|
24
|
+
return;
|
|
25
|
+
}
|
|
26
|
+
const currentValue = el.style.getPropertyValue(property), // "" always trimmed
|
|
27
|
+
currentPriority = el.style.getPropertyPriority(property); // "" always lowercase
|
|
28
|
+
if (currentValue !== value.trim() || currentPriority !== (priority ?? '').toLowerCase())
|
|
29
|
+
el.style.setProperty(property, value, priority); // enforce priority
|
|
30
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function <T extends Element>(selector?: string, element?: Element): T[];
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
export default function (selector, element) {
|
|
2
|
+
const siblings = [];
|
|
3
|
+
let child = element?.parentElement?.firstElementChild;
|
|
4
|
+
while (child) {
|
|
5
|
+
if (child !== element && (!selector || child.matches(selector)))
|
|
6
|
+
siblings.push(child);
|
|
7
|
+
child = child.nextElementSibling;
|
|
8
|
+
}
|
|
9
|
+
return siblings;
|
|
10
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function (value?: string, min?: number, max?: number): number;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function (a: string, b: string): number;
|