@swiftwc/ui 0.0.0-dev.4 → 0.0.0-dev.40
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 +24 -0
- package/generated/client/index.js +272 -0
- package/generated/components/alert-dialog.d.ts +8 -0
- package/generated/components/alert-dialog.js +99 -0
- package/generated/components/body-view.d.ts +5 -0
- package/generated/components/body-view.js +14 -0
- package/generated/components/bordered-button.d.ts +13 -0
- package/generated/components/bordered-button.js +45 -0
- package/generated/components/bordered-prominent-button.d.ts +13 -0
- package/generated/components/bordered-prominent-button.js +45 -0
- package/generated/components/borderless-button.d.ts +13 -0
- package/generated/components/borderless-button.js +45 -0
- 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 +468 -0
- package/generated/components/disclosure-group.d.ts +9 -0
- package/generated/components/disclosure-group.js +58 -0
- package/generated/components/fine-tooltip.d.ts +7 -0
- package/generated/components/fine-tooltip.js +107 -0
- package/generated/components/form-view.d.ts +6 -0
- package/generated/components/form-view.js +60 -0
- package/generated/components/glass-button.d.ts +12 -0
- package/generated/components/glass-button.js +42 -0
- package/generated/components/glass-prominent-button.d.ts +12 -0
- package/generated/components/glass-prominent-button.js +42 -0
- package/generated/components/index.d.ts +42 -0
- package/generated/components/index.js +42 -0
- package/generated/components/label-view.d.ts +9 -0
- package/generated/components/label-view.js +59 -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 +145 -0
- package/generated/components/navigation-large-title.d.ts +6 -0
- package/generated/components/navigation-large-title.js +181 -0
- package/generated/components/navigation-split-view.d.ts +10 -0
- package/generated/components/navigation-split-view.js +25 -0
- package/generated/components/navigation-stack.d.ts +10 -0
- package/generated/components/navigation-stack.js +31 -0
- package/generated/components/navigation-title.d.ts +8 -0
- package/generated/components/navigation-title.js +52 -0
- package/generated/components/picker-view.d.ts +28 -0
- package/generated/components/picker-view.js +681 -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 +125 -0
- package/generated/components/screen-view.d.ts +5 -0
- package/generated/components/screen-view.js +11 -0
- 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 +10 -0
- package/generated/components/scroll-view.js +202 -0
- package/generated/components/search-view.d.ts +8 -0
- package/generated/components/search-view.js +30 -0
- package/generated/components/section-view.d.ts +9 -0
- package/generated/components/section-view.js +83 -0
- package/generated/components/sheet-view.d.ts +8 -0
- package/generated/components/sheet-view.js +62 -0
- package/generated/components/sidebar-toggle.d.ts +7 -0
- package/generated/components/sidebar-toggle.js +85 -0
- package/generated/components/sidebar-view.d.ts +7 -0
- package/generated/components/sidebar-view.js +34 -0
- package/generated/components/sticky-container.d.ts +6 -0
- package/generated/components/sticky-container.js +26 -0
- package/generated/components/tab-bar.d.ts +10 -0
- package/generated/components/tab-bar.js +43 -0
- package/generated/components/tab-item.d.ts +7 -0
- package/generated/components/tab-item.js +132 -0
- package/generated/components/tab-view.d.ts +22 -0
- package/generated/components/tab-view.js +264 -0
- package/generated/components/table-view.d.ts +7 -0
- package/generated/components/table-view.js +174 -0
- package/generated/components/text-field.d.ts +29 -0
- package/generated/components/text-field.js +503 -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 +15 -0
- package/generated/components/v-keyboard.js +89 -0
- package/generated/components/v-stack.d.ts +10 -0
- package/generated/components/v-stack.js +19 -0
- package/generated/css/index.css +8089 -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 +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/index.d.ts +2 -0
- package/generated/index.js +3 -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 +79 -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 +4 -0
- package/generated/internal/decorators/index.js +4 -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/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/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 +19 -0
- package/generated/internal/utils/index.js +22 -0
- 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 -0
- package/generated/internal/utils/kebab-case.js +11 -0
- 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 +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 +9 -0
- package/generated/snapshot/index.js +60 -0
- package/package.json +35 -11
- package/scss/_components.scss +59 -14
- 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 +142 -23
- package/scss/base/_layout.scss +31 -16
- package/scss/base/_reboot.scss +151 -15
- package/scss/base/_root.scss +355 -25
- package/scss/colors/_index.scss +672 -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 +63 -0
- package/scss/components/_borderless-button.scss +36 -6
- package/scss/components/_confirmation-dialog.scss +84 -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 +146 -51
- package/scss/components/_fine-tooltip.scss +82 -0
- package/scss/components/_form-view.scss +195 -0
- package/scss/components/_full-screen.scss +7 -5
- 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 +234 -7
- 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 +211 -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 +18 -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 +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 +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 +422 -0
- package/scss/placeholders/_buttons.scss +117 -0
- package/scss/placeholders/_lists.scss +571 -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 +22 -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 +91 -0
- package/scss/utils/_scroll-view.scss +14 -0
- package/scss/utils/_spacing.scss +25 -0
- package/scss/utils/_stacks.scss +209 -0
- package/web-components.html-data/en.json +500 -0
- 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
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
export * from './alert-dialog';
|
|
2
|
+
export * from './confirmation-dialog';
|
|
3
|
+
export * from './date-picker';
|
|
4
|
+
export * from './lifecycle-observer';
|
|
5
|
+
export * from './picker-view';
|
|
6
|
+
export * from './scroll-view';
|
|
7
|
+
export * from './tab-view';
|
|
8
|
+
export * from './text-field';
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
export * from './alert-dialog';
|
|
2
|
+
export * from './confirmation-dialog';
|
|
3
|
+
export * from './date-picker';
|
|
4
|
+
export * from './lifecycle-observer';
|
|
5
|
+
export * from './picker-view';
|
|
6
|
+
export * from './scroll-view';
|
|
7
|
+
export * from './tab-view';
|
|
8
|
+
export * from './text-field';
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { type ScrollView } from '../components';
|
|
2
|
+
export type PageShowHideDetail = {
|
|
3
|
+
page: ScrollView;
|
|
4
|
+
};
|
|
5
|
+
declare global {
|
|
6
|
+
interface HTMLElementEventMap {
|
|
7
|
+
pageshow: CustomEvent<PageShowHideDetail>;
|
|
8
|
+
pagehide: CustomEvent<PageShowHideDetail>;
|
|
9
|
+
}
|
|
10
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
export type PickerSelectionDetail = {
|
|
2
|
+
selection: string;
|
|
3
|
+
};
|
|
4
|
+
export type PickerSearchableDetail = {
|
|
5
|
+
element: HTMLElement;
|
|
6
|
+
search: string;
|
|
7
|
+
};
|
|
8
|
+
declare global {
|
|
9
|
+
interface HTMLElementEventMap {
|
|
10
|
+
selection: CustomEvent<PickerSelectionDetail>;
|
|
11
|
+
'picker:searchfocus': CustomEvent<PickerSearchableDetail>;
|
|
12
|
+
'picker:searchblur': CustomEvent<PickerSearchableDetail>;
|
|
13
|
+
'picker:searchinput': CustomEvent<PickerSearchableDetail>;
|
|
14
|
+
}
|
|
15
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { type ScrollView } from '../components';
|
|
2
|
+
export type PageRevealSwapDetail = {
|
|
3
|
+
page: ScrollView;
|
|
4
|
+
};
|
|
5
|
+
declare global {
|
|
6
|
+
interface HTMLElementEventMap {
|
|
7
|
+
pagereveal: CustomEvent<PageRevealSwapDetail>;
|
|
8
|
+
pageswap: CustomEvent<PageRevealSwapDetail>;
|
|
9
|
+
}
|
|
10
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { type NavigationSplitView, type NavigationStack } from '../components';
|
|
2
|
+
import { type TabBarPlacement } from '../components/tab-view';
|
|
3
|
+
export type TabBeforeDetail = {
|
|
4
|
+
tag: string;
|
|
5
|
+
ms: number;
|
|
6
|
+
};
|
|
7
|
+
export type TabDetail = {
|
|
8
|
+
tag: string;
|
|
9
|
+
};
|
|
10
|
+
export type TabViewDetail = {
|
|
11
|
+
selection: (NavigationStack | NavigationSplitView)[];
|
|
12
|
+
};
|
|
13
|
+
export type TabViewAdaptableTabBarPlacementDetail = {
|
|
14
|
+
oldValue?: TabBarPlacement;
|
|
15
|
+
newValue?: TabBarPlacement;
|
|
16
|
+
};
|
|
17
|
+
declare global {
|
|
18
|
+
interface HTMLElementEventMap {
|
|
19
|
+
tabshow: CustomEvent<TabDetail>;
|
|
20
|
+
tabhide: CustomEvent<TabDetail>;
|
|
21
|
+
tabreveal: CustomEvent<TabDetail>;
|
|
22
|
+
tabswap: CustomEvent<TabDetail>;
|
|
23
|
+
beforetabreveal: CustomEvent<TabBeforeDetail>;
|
|
24
|
+
beforetabswap: CustomEvent<TabBeforeDetail>;
|
|
25
|
+
'tab-view:toggle': CustomEvent<TabViewDetail>;
|
|
26
|
+
'tab-view:adaptable-tab-bar-placement-change': CustomEvent<TabViewAdaptableTabBarPlacementDetail>;
|
|
27
|
+
}
|
|
28
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import { en } from './locales';
|
|
2
|
+
type LocaleInput = Intl.UnicodeBCP47LocaleIdentifier | Intl.Locale;
|
|
3
|
+
type DeepStringify<T> = {
|
|
4
|
+
[K in keyof T]: T[K] extends object ? DeepStringify<T[K]> : string;
|
|
5
|
+
};
|
|
6
|
+
export declare function defineTranslations<const T extends object>(factory: () => T): () => T;
|
|
7
|
+
type EnTranslations = DeepStringify<ReturnType<typeof en>>;
|
|
8
|
+
/**
|
|
9
|
+
* @fires localechange - On html[lang] change!
|
|
10
|
+
*/
|
|
11
|
+
export declare class I18n {
|
|
12
|
+
#private;
|
|
13
|
+
static on: EventTarget;
|
|
14
|
+
/**
|
|
15
|
+
* Register a translation factory for a language.
|
|
16
|
+
* Call this before the language is first needed.
|
|
17
|
+
*
|
|
18
|
+
* @example
|
|
19
|
+
* I18n.register('el', () => ({ SearchUnavailableContent: { … } }))
|
|
20
|
+
*/
|
|
21
|
+
static register(lang: string, factory: () => EnTranslations): void;
|
|
22
|
+
static get tag(): LocaleInput;
|
|
23
|
+
static set tag(val: LocaleInput);
|
|
24
|
+
static get options(): Intl.LocaleOptions | undefined;
|
|
25
|
+
static set options(val: Intl.LocaleOptions | undefined);
|
|
26
|
+
static get locale(): Intl.Locale;
|
|
27
|
+
static get decimalSeparator(): string;
|
|
28
|
+
static get dateSeparator(): string;
|
|
29
|
+
static get dateOrder(): string[];
|
|
30
|
+
static setOwnConfig(options?: Intl.LocaleOptions): void;
|
|
31
|
+
/** Look up a top-level translation key for the current language, falling back to 'en'. */
|
|
32
|
+
static t<K extends keyof EnTranslations>(key: K): EnTranslations[K];
|
|
33
|
+
}
|
|
34
|
+
export {};
|
|
@@ -0,0 +1,167 @@
|
|
|
1
|
+
import { el, en } from './locales';
|
|
2
|
+
export function defineTranslations(factory) {
|
|
3
|
+
return factory;
|
|
4
|
+
}
|
|
5
|
+
/**
|
|
6
|
+
* @fires localechange - On html[lang] change!
|
|
7
|
+
*/
|
|
8
|
+
export class I18n {
|
|
9
|
+
static #readyCalled = false;
|
|
10
|
+
static #tag = 'en';
|
|
11
|
+
static #options;
|
|
12
|
+
static #locale = new Intl.Locale('en');
|
|
13
|
+
static #observer;
|
|
14
|
+
static #decimalSeparator = '.';
|
|
15
|
+
static #dateSeparator = '/';
|
|
16
|
+
static #dateOrder = ['month', 'day', 'year'];
|
|
17
|
+
static #lang = 'en';
|
|
18
|
+
/** Registry: language code → factory. Pre-seeded with 'en'. */
|
|
19
|
+
static #factories = new Map([
|
|
20
|
+
['en', en],
|
|
21
|
+
['el', el],
|
|
22
|
+
]);
|
|
23
|
+
/** Cache: language code → resolved translation object. */
|
|
24
|
+
static #strings = new Map();
|
|
25
|
+
static on = new EventTarget();
|
|
26
|
+
// ----------------------------
|
|
27
|
+
// Public registration API
|
|
28
|
+
// ----------------------------
|
|
29
|
+
/**
|
|
30
|
+
* Register a translation factory for a language.
|
|
31
|
+
* Call this before the language is first needed.
|
|
32
|
+
*
|
|
33
|
+
* @example
|
|
34
|
+
* I18n.register('el', () => ({ SearchUnavailableContent: { … } }))
|
|
35
|
+
*/
|
|
36
|
+
static register(lang, factory) {
|
|
37
|
+
this.#factories.set(lang, factory);
|
|
38
|
+
this.#strings.delete(lang); // bust cache so next t() re-resolves
|
|
39
|
+
}
|
|
40
|
+
// ----------------------------
|
|
41
|
+
// Lazy init
|
|
42
|
+
// ----------------------------
|
|
43
|
+
static #ensureReady() {
|
|
44
|
+
if (!this.#readyCalled)
|
|
45
|
+
this.setOwnConfig();
|
|
46
|
+
}
|
|
47
|
+
// ----------------------------
|
|
48
|
+
// Accessors
|
|
49
|
+
// ----------------------------
|
|
50
|
+
static get tag() {
|
|
51
|
+
this.#ensureReady();
|
|
52
|
+
return this.#tag;
|
|
53
|
+
}
|
|
54
|
+
static set tag(val) {
|
|
55
|
+
this.#observer?.disconnect();
|
|
56
|
+
this.#observer = undefined;
|
|
57
|
+
this.#tag = val;
|
|
58
|
+
this.#getOwnConfig();
|
|
59
|
+
}
|
|
60
|
+
static get options() {
|
|
61
|
+
this.#ensureReady();
|
|
62
|
+
return this.#options;
|
|
63
|
+
}
|
|
64
|
+
static set options(val) {
|
|
65
|
+
this.#options = val;
|
|
66
|
+
this.#getOwnConfig();
|
|
67
|
+
}
|
|
68
|
+
static get locale() {
|
|
69
|
+
this.#ensureReady();
|
|
70
|
+
return this.#locale;
|
|
71
|
+
}
|
|
72
|
+
static get decimalSeparator() {
|
|
73
|
+
this.#ensureReady();
|
|
74
|
+
return this.#decimalSeparator;
|
|
75
|
+
}
|
|
76
|
+
static get dateSeparator() {
|
|
77
|
+
this.#ensureReady();
|
|
78
|
+
return this.#dateSeparator;
|
|
79
|
+
}
|
|
80
|
+
static get dateOrder() {
|
|
81
|
+
this.#ensureReady();
|
|
82
|
+
return this.#dateOrder;
|
|
83
|
+
}
|
|
84
|
+
static setOwnConfig(options) {
|
|
85
|
+
if (!this.#readyCalled)
|
|
86
|
+
this.#readyCalled = true;
|
|
87
|
+
this.#tag = document.documentElement.lang;
|
|
88
|
+
this.#options = options;
|
|
89
|
+
this.#observer?.disconnect();
|
|
90
|
+
this.#observer = new MutationObserver(this.#handleMutation.bind(this));
|
|
91
|
+
this.#observer.observe(document.documentElement, {
|
|
92
|
+
attributes: true,
|
|
93
|
+
attributeFilter: ['lang'],
|
|
94
|
+
});
|
|
95
|
+
this.#getOwnConfig();
|
|
96
|
+
}
|
|
97
|
+
static #handleMutation() {
|
|
98
|
+
if (!this.#observer)
|
|
99
|
+
return;
|
|
100
|
+
this.#tag = document.documentElement.lang;
|
|
101
|
+
this.#getOwnConfig();
|
|
102
|
+
this.on.dispatchEvent(new CustomEvent('localechange', { detail: { lang: this.#tag } }));
|
|
103
|
+
}
|
|
104
|
+
static #getOwnConfig() {
|
|
105
|
+
try {
|
|
106
|
+
this.#locale = new Intl.Locale(this.#tag ?? 'en', this.#options);
|
|
107
|
+
}
|
|
108
|
+
catch {
|
|
109
|
+
this.#locale = new Intl.Locale('en');
|
|
110
|
+
}
|
|
111
|
+
try {
|
|
112
|
+
const nf = new Intl.NumberFormat(this.#locale);
|
|
113
|
+
const parts = nf.formatToParts(1.1);
|
|
114
|
+
this.#decimalSeparator = parts.find(({ type }) => type === 'decimal')?.value ?? '.';
|
|
115
|
+
}
|
|
116
|
+
catch {
|
|
117
|
+
this.#decimalSeparator = '.';
|
|
118
|
+
}
|
|
119
|
+
try {
|
|
120
|
+
const df = new Intl.DateTimeFormat(this.#locale);
|
|
121
|
+
const parts = df.formatToParts(new Date(2000, 11, 31));
|
|
122
|
+
this.#dateOrder = parts.filter(({ type }) => type !== 'literal').map(({ type }) => type) ?? ['month', 'day', 'year'];
|
|
123
|
+
this.#dateSeparator =
|
|
124
|
+
parts
|
|
125
|
+
.filter(({ type }) => type === 'literal')
|
|
126
|
+
.map(({ value }) => value)
|
|
127
|
+
.at(0) ?? '/';
|
|
128
|
+
}
|
|
129
|
+
catch {
|
|
130
|
+
this.#dateOrder = ['month', 'day', 'year'];
|
|
131
|
+
this.#dateSeparator = '/';
|
|
132
|
+
}
|
|
133
|
+
try {
|
|
134
|
+
this.#lang = this.#resolveLanguage(this.#tag);
|
|
135
|
+
}
|
|
136
|
+
catch {
|
|
137
|
+
this.#lang = 'en';
|
|
138
|
+
}
|
|
139
|
+
}
|
|
140
|
+
/**
|
|
141
|
+
* Resolve the best available language for a given BCP 47 tag.
|
|
142
|
+
* Tries the full tag, then just the base language, then falls back to 'en'.
|
|
143
|
+
*/
|
|
144
|
+
static #resolveLanguage(tag) {
|
|
145
|
+
const lang = tag instanceof Intl.Locale ? tag.language : new Intl.Locale(tag || 'en').language;
|
|
146
|
+
if (this.#factories.has(String(tag)))
|
|
147
|
+
return String(tag);
|
|
148
|
+
if (this.#factories.has(lang))
|
|
149
|
+
return lang;
|
|
150
|
+
return 'en';
|
|
151
|
+
}
|
|
152
|
+
/** Look up a top-level translation key for the current language, falling back to 'en'. */
|
|
153
|
+
static t(key) {
|
|
154
|
+
this.#ensureReady();
|
|
155
|
+
if (!this.#strings.has(this.#lang)) {
|
|
156
|
+
const factory = this.#factories.get(this.#lang) ?? en;
|
|
157
|
+
this.#strings.set(this.#lang, factory());
|
|
158
|
+
}
|
|
159
|
+
const current = this.#strings.get(this.#lang);
|
|
160
|
+
if (key in current)
|
|
161
|
+
return current[key];
|
|
162
|
+
// Key missing from current language — fall back to en
|
|
163
|
+
if (!this.#strings.has('en'))
|
|
164
|
+
this.#strings.set('en', en());
|
|
165
|
+
return this.#strings.get('en')[key];
|
|
166
|
+
}
|
|
167
|
+
}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
declare const _default: () => {
|
|
2
|
+
readonly SearchUnavailableContent: {
|
|
3
|
+
readonly NoLabel: "Κανένα αποτέλεσμα";
|
|
4
|
+
readonly Label: "Κανένα αποτέλεσμα για «{search}»";
|
|
5
|
+
readonly Description: "Ελέγξτε την ορθογραφία ή δοκιμάστε μια νέα αναζήτηση.";
|
|
6
|
+
};
|
|
7
|
+
readonly ButtonRole: {
|
|
8
|
+
readonly Back: "Πίσω";
|
|
9
|
+
readonly Cancel: "Ακύρωση";
|
|
10
|
+
readonly Close: "Κλείσιμο";
|
|
11
|
+
readonly Confirm: "Τέλος";
|
|
12
|
+
readonly Destructive: "Διαγραφή";
|
|
13
|
+
readonly OK: "OK";
|
|
14
|
+
};
|
|
15
|
+
};
|
|
16
|
+
export default _default;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { defineTranslations } from '../index';
|
|
2
|
+
export default defineTranslations(() => ({
|
|
3
|
+
SearchUnavailableContent: {
|
|
4
|
+
NoLabel: 'Κανένα αποτέλεσμα',
|
|
5
|
+
Label: 'Κανένα αποτέλεσμα για «{search}»',
|
|
6
|
+
Description: 'Ελέγξτε την ορθογραφία ή δοκιμάστε μια νέα αναζήτηση.',
|
|
7
|
+
},
|
|
8
|
+
ButtonRole: {
|
|
9
|
+
Back: 'Πίσω',
|
|
10
|
+
Cancel: 'Ακύρωση',
|
|
11
|
+
Close: 'Κλείσιμο',
|
|
12
|
+
Confirm: 'Τέλος',
|
|
13
|
+
Destructive: 'Διαγραφή',
|
|
14
|
+
OK: 'OK',
|
|
15
|
+
},
|
|
16
|
+
}));
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
declare const _default: () => {
|
|
2
|
+
readonly SearchUnavailableContent: {
|
|
3
|
+
readonly NoLabel: "No Results";
|
|
4
|
+
readonly Label: "No Results for ”{search}”";
|
|
5
|
+
readonly Description: "Check the spelling or try a new search.";
|
|
6
|
+
};
|
|
7
|
+
readonly ButtonRole: {
|
|
8
|
+
readonly Back: "Back";
|
|
9
|
+
readonly Cancel: "Cancel";
|
|
10
|
+
readonly Close: "Close";
|
|
11
|
+
readonly Confirm: "Confirm";
|
|
12
|
+
readonly Destructive: "Delete";
|
|
13
|
+
readonly OK: "OK";
|
|
14
|
+
};
|
|
15
|
+
};
|
|
16
|
+
export default _default;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { defineTranslations } from '../index';
|
|
2
|
+
export default defineTranslations(() => ({
|
|
3
|
+
SearchUnavailableContent: {
|
|
4
|
+
NoLabel: 'No Results',
|
|
5
|
+
Label: 'No Results for ”{search}”',
|
|
6
|
+
Description: 'Check the spelling or try a new search.',
|
|
7
|
+
},
|
|
8
|
+
ButtonRole: {
|
|
9
|
+
Back: 'Back',
|
|
10
|
+
Cancel: 'Cancel',
|
|
11
|
+
Close: 'Close',
|
|
12
|
+
Confirm: 'Confirm',
|
|
13
|
+
Destructive: 'Delete',
|
|
14
|
+
OK: 'OK',
|
|
15
|
+
},
|
|
16
|
+
}));
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
export class CleanupRegistry {
|
|
2
|
+
static #cleanups = new WeakMap();
|
|
3
|
+
static #DEFAULT = Symbol('__default__');
|
|
4
|
+
static register(target, heldValue, unregisterToken = this.#DEFAULT) {
|
|
5
|
+
let tokens = this.#cleanups.get(target);
|
|
6
|
+
if (!tokens)
|
|
7
|
+
this.#cleanups.set(target, (tokens = new Map()));
|
|
8
|
+
let fns = tokens.get(unregisterToken);
|
|
9
|
+
if (!fns)
|
|
10
|
+
tokens.set(unregisterToken, (fns = new Set()));
|
|
11
|
+
fns.add(heldValue);
|
|
12
|
+
}
|
|
13
|
+
static unregister(target, token) {
|
|
14
|
+
const tokens = this.#cleanups.get(target);
|
|
15
|
+
if (!tokens)
|
|
16
|
+
return;
|
|
17
|
+
if (undefined === token) {
|
|
18
|
+
for (const fns of tokens.values())
|
|
19
|
+
for (const fn of fns)
|
|
20
|
+
fn();
|
|
21
|
+
this.#cleanups.delete(target);
|
|
22
|
+
}
|
|
23
|
+
else if ('string' === typeof token && token.endsWith('*')) {
|
|
24
|
+
const prefix = token.slice(0, -1);
|
|
25
|
+
for (const [key, fns] of tokens)
|
|
26
|
+
if ('string' === typeof key && key.startsWith(prefix)) {
|
|
27
|
+
for (const fn of fns)
|
|
28
|
+
fn();
|
|
29
|
+
tokens.delete(key);
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
else {
|
|
33
|
+
for (const fn of tokens.get(token) ?? [])
|
|
34
|
+
fn();
|
|
35
|
+
tokens.delete(token);
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
var _a;
|
|
2
|
+
import { devFlags, onoff } from '../../internal/utils';
|
|
3
|
+
export class CSSStyleObserver {
|
|
4
|
+
#cleanups;
|
|
5
|
+
#options;
|
|
6
|
+
constructor(options = {
|
|
7
|
+
properties: ['perspective-origin'], // --other-number-@property
|
|
8
|
+
}) {
|
|
9
|
+
this.#options = options;
|
|
10
|
+
}
|
|
11
|
+
async observe(target, callback) {
|
|
12
|
+
const listener = this.#handleTransitionrun.bind(this, callback);
|
|
13
|
+
this.#cleanups = onoff('transitionrun', listener, target).on();
|
|
14
|
+
}
|
|
15
|
+
async disconnect() {
|
|
16
|
+
this.#cleanups?.();
|
|
17
|
+
}
|
|
18
|
+
#handleTransitionrun = (callback, evt) => {
|
|
19
|
+
if (devFlags.debug)
|
|
20
|
+
console.debug(`${_a.name} ⚡️ ${evt?.type} (${evt.propertyName})`);
|
|
21
|
+
if (!this.#options?.properties.some((prop) => evt.propertyName.startsWith(prop)))
|
|
22
|
+
return;
|
|
23
|
+
callback?.(evt);
|
|
24
|
+
};
|
|
25
|
+
}
|
|
26
|
+
_a = CSSStyleObserver;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
export declare function getInternals(instance: FormAssociatedBase): ElementInternals;
|
|
2
|
+
export declare abstract class FormAssociatedBase extends HTMLElement {
|
|
3
|
+
abstract setValidity(flags?: ValidityStateFlags, message?: string, anchor?: HTMLElement): void;
|
|
4
|
+
static get formAssociated(): boolean;
|
|
5
|
+
constructor();
|
|
6
|
+
disconnectedCallback(): void;
|
|
7
|
+
connectedCallback(): void;
|
|
8
|
+
get type(): string;
|
|
9
|
+
get form(): HTMLFormElement | null;
|
|
10
|
+
get validity(): ValidityState;
|
|
11
|
+
get validationMessage(): string;
|
|
12
|
+
get willValidate(): boolean;
|
|
13
|
+
checkValidity: () => boolean;
|
|
14
|
+
reportValidity: () => boolean;
|
|
15
|
+
shake: (times?: number, distance?: number, duration?: number) => Promise<void>;
|
|
16
|
+
}
|
|
@@ -0,0 +1,78 @@
|
|
|
1
|
+
import { devFlags } from '../utils';
|
|
2
|
+
import { CleanupRegistry } from './cleanup-registry';
|
|
3
|
+
const internals = new WeakMap();
|
|
4
|
+
// const trackedElements = new WeakMap<FormAssociatedBase, Set<Element>>()
|
|
5
|
+
// const observers = new MutationObserverSingleton()
|
|
6
|
+
export function getInternals(instance) {
|
|
7
|
+
const i = internals.get(instance);
|
|
8
|
+
if (!i)
|
|
9
|
+
throw new Error('Not a FormAssociatedBase instance');
|
|
10
|
+
return i;
|
|
11
|
+
}
|
|
12
|
+
// export function makeSlotchangeHandler(t: FormAssociatedBase) {
|
|
13
|
+
// const handleSlotchange = ({ type, target: slot }: Event) => {
|
|
14
|
+
// if (devFlags.debug) console.debug(`${makeSlotchangeHandler.name} ⚡️ ${type}`)
|
|
15
|
+
// if (!(slot instanceof HTMLSlotElement && slot)) return
|
|
16
|
+
// const assigned = slot.assignedElements({ flatten: true })
|
|
17
|
+
// observers.syncObservations(trackedElements.get(t) ?? new Set(), assigned, handleTagMutation, ['value', 'label'])
|
|
18
|
+
// if (0 < assigned.length) handleTagMutation()
|
|
19
|
+
// },
|
|
20
|
+
// handleTagMutation = (entry?: MutationRecord) => {
|
|
21
|
+
// if (devFlags.debug) console.debug(`${handleTagMutation.name} ⚡️ mutation`)
|
|
22
|
+
// t.setValidity(t.validity, t.validationMessage)
|
|
23
|
+
// }
|
|
24
|
+
// return [{ types: 'slotchange', listener: handleSlotchange }]
|
|
25
|
+
// }
|
|
26
|
+
export class FormAssociatedBase extends HTMLElement {
|
|
27
|
+
static get formAssociated() {
|
|
28
|
+
return true;
|
|
29
|
+
}
|
|
30
|
+
constructor() {
|
|
31
|
+
super();
|
|
32
|
+
internals.set(this, this.attachInternals());
|
|
33
|
+
// trackedElements.set(this, new Set<Element>())
|
|
34
|
+
}
|
|
35
|
+
disconnectedCallback() {
|
|
36
|
+
if (devFlags.debug)
|
|
37
|
+
console.debug(`${FormAssociatedBase.name} ⚡️ disconnect`);
|
|
38
|
+
CleanupRegistry.unregister(this);
|
|
39
|
+
// observers.clearObservationsSet(trackedElements.get(this) ?? new Set())
|
|
40
|
+
}
|
|
41
|
+
connectedCallback() {
|
|
42
|
+
if (devFlags.debug)
|
|
43
|
+
console.debug(`${FormAssociatedBase.name} ⚡️ connect`);
|
|
44
|
+
}
|
|
45
|
+
get type() {
|
|
46
|
+
return this.localName;
|
|
47
|
+
}
|
|
48
|
+
get form() {
|
|
49
|
+
return getInternals(this).form;
|
|
50
|
+
}
|
|
51
|
+
get validity() {
|
|
52
|
+
return getInternals(this).validity;
|
|
53
|
+
}
|
|
54
|
+
get validationMessage() {
|
|
55
|
+
return getInternals(this).validationMessage;
|
|
56
|
+
}
|
|
57
|
+
get willValidate() {
|
|
58
|
+
return getInternals(this).willValidate;
|
|
59
|
+
}
|
|
60
|
+
checkValidity = () => {
|
|
61
|
+
return getInternals(this).checkValidity();
|
|
62
|
+
};
|
|
63
|
+
reportValidity = () => {
|
|
64
|
+
return getInternals(this).reportValidity();
|
|
65
|
+
};
|
|
66
|
+
shake = async (times = 3, distance = 8, duration = 400) => {
|
|
67
|
+
const frames = [{ transform: 'translateX(0)' }];
|
|
68
|
+
for (let i = 0; i < times; i++)
|
|
69
|
+
frames.push({ transform: `translateX(-${distance}px)` }, { transform: `translateX(${distance}px)` });
|
|
70
|
+
frames.push({ transform: 'translateX(0)' });
|
|
71
|
+
try {
|
|
72
|
+
await this.animate(frames, { duration, easing: 'ease-in-out' }).finished;
|
|
73
|
+
}
|
|
74
|
+
catch {
|
|
75
|
+
//
|
|
76
|
+
}
|
|
77
|
+
};
|
|
78
|
+
}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
export declare class MutationObserverSet {
|
|
2
|
+
#private;
|
|
3
|
+
private callback;
|
|
4
|
+
constructor(callback: MutationCallback);
|
|
5
|
+
observe(target: Element, attributeFilter?: string[]): Promise<void>;
|
|
6
|
+
unobserve(target: Element): Promise<void>;
|
|
7
|
+
syncObservations(source: Element[], attributeFilter?: string[]): Promise<void>;
|
|
8
|
+
unobserveAll(): Promise<void>;
|
|
9
|
+
}
|