@swiftwc/ui 0.0.0-dev.3 → 0.0.0-dev.30

package/generated/events/alert-dialog.d.ts

@@ -0,0 +1,8 @@
+export type AlertReturnDetail = {
+    returnValue: string;
+};
+declare global {
+    interface HTMLElementEventMap {
+        'alert:return': CustomEvent<AlertReturnDetail>;
+    }
+}

package/generated/events/alert-dialog.js

@@ -0,0 +1 @@
+export {};

package/generated/events/confirmation-dialog.d.ts

@@ -0,0 +1,9 @@
+export type ConfirmationReturnDetail = {
+    returnValue: string;
+    positionAnchor: string;
+};
+declare global {
+    interface HTMLElementEventMap {
+        'confirmation:return': CustomEvent<ConfirmationReturnDetail>;
+    }
+}

package/generated/events/confirmation-dialog.js

@@ -0,0 +1 @@
+export {};

package/generated/events/date-picker.d.ts

@@ -0,0 +1,8 @@
+export type DatePickerSelectionDetail = {
+    selection: string;
+};
+declare global {
+    interface HTMLElementEventMap {
+        selection: CustomEvent<DatePickerSelectionDetail>;
+    }
+}

package/generated/events/date-picker.js

@@ -0,0 +1 @@
+export {};

package/generated/events/index.d.ts

@@ -0,0 +1,8 @@
+export * from './alert-dialog';
+export * from './confirmation-dialog';
+export * from './date-picker';
+export * from './lifecycle-observer';
+export * from './picker-view';
+export * from './scroll-view';
+export * from './tab-view';
+export * from './text-field';

package/generated/events/index.js

@@ -0,0 +1,8 @@
+export * from './alert-dialog';
+export * from './confirmation-dialog';
+export * from './date-picker';
+export * from './lifecycle-observer';
+export * from './picker-view';
+export * from './scroll-view';
+export * from './tab-view';
+export * from './text-field';

package/generated/events/lifecycle-observer.d.ts

@@ -0,0 +1,10 @@
+import { type ScrollView } from '../components';
+export type PageShowHideDetail = {
+    page: ScrollView;
+};
+declare global {
+    interface HTMLElementEventMap {
+        pageshow: CustomEvent<PageShowHideDetail>;
+        pagehide: CustomEvent<PageShowHideDetail>;
+    }
+}

package/generated/events/lifecycle-observer.js

@@ -0,0 +1 @@
+export {};

package/generated/events/picker-view.d.ts

@@ -0,0 +1,8 @@
+export type PickerSelectionDetail = {
+    selection: string;
+};
+declare global {
+    interface HTMLElementEventMap {
+        selection: CustomEvent<PickerSelectionDetail>;
+    }
+}

package/generated/events/picker-view.js

@@ -0,0 +1 @@
+export {};

package/generated/events/scroll-view.d.ts

@@ -0,0 +1,10 @@
+import { type ScrollView } from '../components';
+export type PageRevealSwapDetail = {
+    page: ScrollView;
+};
+declare global {
+    interface HTMLElementEventMap {
+        pagereveal: CustomEvent<PageRevealSwapDetail>;
+        pageswap: CustomEvent<PageRevealSwapDetail>;
+    }
+}

package/generated/events/scroll-view.js

@@ -0,0 +1 @@
+export {};

package/generated/events/tab-view.d.ts

@@ -0,0 +1,28 @@
+import { type NavigationSplitView, type NavigationStack } from '../components';
+import { type TabBarPlacement } from '../components/tab-view';
+export type TabBeforeDetail = {
+    tag: string;
+    ms: number;
+};
+export type TabDetail = {
+    tag: string;
+};
+export type TabViewDetail = {
+    selection: (NavigationStack | NavigationSplitView)[];
+};
+export type TabViewAdaptableTabBarPlacementDetail = {
+    oldValue?: TabBarPlacement;
+    newValue?: TabBarPlacement;
+};
+declare global {
+    interface HTMLElementEventMap {
+        tabshow: CustomEvent<TabDetail>;
+        tabhide: CustomEvent<TabDetail>;
+        tabreveal: CustomEvent<TabDetail>;
+        tabswap: CustomEvent<TabDetail>;
+        beforetabreveal: CustomEvent<TabBeforeDetail>;
+        beforetabswap: CustomEvent<TabBeforeDetail>;
+        'tab-view:toggle': CustomEvent<TabViewDetail>;
+        'tab-view:adaptable-tab-bar-placement-change': CustomEvent<TabViewAdaptableTabBarPlacementDetail>;
+    }
+}

package/generated/events/tab-view.js

@@ -0,0 +1 @@
+export {};

package/generated/events/text-field.d.ts

@@ -0,0 +1,8 @@
+export type TextFieldCommitDetail = {
+    text: string;
+};
+declare global {
+    interface HTMLElementEventMap {
+        commit: CustomEvent<TextFieldCommitDetail>;
+    }
+}

package/generated/events/text-field.js

@@ -0,0 +1 @@
+export {};

package/generated/i18n/index.d.ts

@@ -0,0 +1,34 @@
+import { en } from './locales';
+type LocaleInput = Intl.UnicodeBCP47LocaleIdentifier | Intl.Locale;
+type DeepStringify<T> = {
+    [K in keyof T]: T[K] extends object ? DeepStringify<T[K]> : string;
+};
+export declare function defineTranslations<const T extends object>(factory: () => T): () => T;
+type EnTranslations = DeepStringify<ReturnType<typeof en>>;
+/**
+ * @fires localechange - On html[lang] change!
+ */
+export declare class I18n {
+    #private;
+    static on: EventTarget;
+    /**
+     * Register a translation factory for a language.
+     * Call this before the language is first needed.
+     *
+     * @example
+     * I18n.register('el', () => ({ SearchUnavailableContent: { … } }))
+     */
+    static register(lang: string, factory: () => EnTranslations): void;
+    static get tag(): LocaleInput;
+    static set tag(val: LocaleInput);
+    static get options(): Intl.LocaleOptions | undefined;
+    static set options(val: Intl.LocaleOptions | undefined);
+    static get locale(): Intl.Locale;
+    static get decimalSeparator(): string;
+    static get dateSeparator(): string;
+    static get dateOrder(): string[];
+    static setOwnConfig(options?: Intl.LocaleOptions): void;
+    /** Look up a top-level translation key for the current language, falling back to 'en'. */
+    static t<K extends keyof EnTranslations>(key: K): EnTranslations[K];
+}
+export {};

package/generated/i18n/index.js

@@ -0,0 +1,167 @@
+import { el, en } from './locales';
+export function defineTranslations(factory) {
+    return factory;
+}
+/**
+ * @fires localechange - On html[lang] change!
+ */
+export class I18n {
+    static #readyCalled = false;
+    static #tag = 'en';
+    static #options;
+    static #locale = new Intl.Locale('en');
+    static #observer;
+    static #decimalSeparator = '.';
+    static #dateSeparator = '/';
+    static #dateOrder = ['month', 'day', 'year'];
+    static #lang = 'en';
+    /** Registry: language code → factory. Pre-seeded with 'en'. */
+    static #factories = new Map([
+        ['en', en],
+        ['el', el],
+    ]);
+    /** Cache: language code → resolved translation object. */
+    static #strings = new Map();
+    static on = new EventTarget();
+    // ----------------------------
+    // Public registration API
+    // ----------------------------
+    /**
+     * Register a translation factory for a language.
+     * Call this before the language is first needed.
+     *
+     * @example
+     * I18n.register('el', () => ({ SearchUnavailableContent: { … } }))
+     */
+    static register(lang, factory) {
+        this.#factories.set(lang, factory);
+        this.#strings.delete(lang); // bust cache so next t() re-resolves
+    }
+    // ----------------------------
+    // Lazy init
+    // ----------------------------
+    static #ensureReady() {
+        if (!this.#readyCalled)
+            this.setOwnConfig();
+    }
+    // ----------------------------
+    // Accessors
+    // ----------------------------
+    static get tag() {
+        this.#ensureReady();
+        return this.#tag;
+    }
+    static set tag(val) {
+        this.#observer?.disconnect();
+        this.#observer = undefined;
+        this.#tag = val;
+        this.#getOwnConfig();
+    }
+    static get options() {
+        this.#ensureReady();
+        return this.#options;
+    }
+    static set options(val) {
+        this.#options = val;
+        this.#getOwnConfig();
+    }
+    static get locale() {
+        this.#ensureReady();
+        return this.#locale;
+    }
+    static get decimalSeparator() {
+        this.#ensureReady();
+        return this.#decimalSeparator;
+    }
+    static get dateSeparator() {
+        this.#ensureReady();
+        return this.#dateSeparator;
+    }
+    static get dateOrder() {
+        this.#ensureReady();
+        return this.#dateOrder;
+    }
+    static setOwnConfig(options) {
+        if (!this.#readyCalled)
+            this.#readyCalled = true;
+        this.#tag = document.documentElement.lang;
+        this.#options = options;
+        this.#observer?.disconnect();
+        this.#observer = new MutationObserver(this.#handleMutation.bind(this));
+        this.#observer.observe(document.documentElement, {
+            attributes: true,
+            attributeFilter: ['lang'],
+        });
+        this.#getOwnConfig();
+    }
+    static #handleMutation() {
+        if (!this.#observer)
+            return;
+        this.#tag = document.documentElement.lang;
+        this.#getOwnConfig();
+        this.on.dispatchEvent(new CustomEvent('localechange', { detail: { lang: this.#tag } }));
+    }
+    static #getOwnConfig() {
+        try {
+            this.#locale = new Intl.Locale(this.#tag ?? 'en', this.#options);
+        }
+        catch {
+            this.#locale = new Intl.Locale('en');
+        }
+        try {
+            const nf = new Intl.NumberFormat(this.#locale);
+            const parts = nf.formatToParts(1.1);
+            this.#decimalSeparator = parts.find(({ type }) => type === 'decimal')?.value ?? '.';
+        }
+        catch {
+            this.#decimalSeparator = '.';
+        }
+        try {
+            const df = new Intl.DateTimeFormat(this.#locale);
+            const parts = df.formatToParts(new Date(2000, 11, 31));
+            this.#dateOrder = parts.filter(({ type }) => type !== 'literal').map(({ type }) => type) ?? ['month', 'day', 'year'];
+            this.#dateSeparator =
+                parts
+                    .filter(({ type }) => type === 'literal')
+                    .map(({ value }) => value)
+                    .at(0) ?? '/';
+        }
+        catch {
+            this.#dateOrder = ['month', 'day', 'year'];
+            this.#dateSeparator = '/';
+        }
+        try {
+            this.#lang = this.#resolveLanguage(this.#tag);
+        }
+        catch {
+            this.#lang = 'en';
+        }
+    }
+    /**
+     * Resolve the best available language for a given BCP 47 tag.
+     * Tries the full tag, then just the base language, then falls back to 'en'.
+     */
+    static #resolveLanguage(tag) {
+        const lang = tag instanceof Intl.Locale ? tag.language : new Intl.Locale(tag || 'en').language;
+        if (this.#factories.has(String(tag)))
+            return String(tag);
+        if (this.#factories.has(lang))
+            return lang;
+        return 'en';
+    }
+    /** Look up a top-level translation key for the current language, falling back to 'en'. */
+    static t(key) {
+        this.#ensureReady();
+        if (!this.#strings.has(this.#lang)) {
+            const factory = this.#factories.get(this.#lang) ?? en;
+            this.#strings.set(this.#lang, factory());
+        }
+        const current = this.#strings.get(this.#lang);
+        if (key in current)
+            return current[key];
+        // Key missing from current language — fall back to en
+        if (!this.#strings.has('en'))
+            this.#strings.set('en', en());
+        return this.#strings.get('en')[key];
+    }
+}

package/generated/i18n/locales/el.d.ts

@@ -0,0 +1,15 @@
+declare const _default: () => {
+    readonly SearchUnavailableContent: {
+        readonly NoLabel: "Κανένα αποτέλεσμα";
+        readonly Label: "Κανένα αποτέλεσμα για «{search}»";
+        readonly Description: "Ελέγξτε την ορθογραφία ή δοκιμάστε μια νέα αναζήτηση.";
+    };
+    readonly ButtonRole: {
+        readonly Cancel: "Ακύρωση";
+        readonly Close: "Κλείσιμο";
+        readonly Confirm: "Τέλος";
+        readonly Destructive: "Διαγραφή";
+        readonly OK: "OK";
+    };
+};
+export default _default;

package/generated/i18n/locales/el.js

@@ -0,0 +1,15 @@
+import { defineTranslations } from '../index';
+export default defineTranslations(() => ({
+    SearchUnavailableContent: {
+        NoLabel: 'Κανένα αποτέλεσμα',
+        Label: 'Κανένα αποτέλεσμα για «{search}»',
+        Description: 'Ελέγξτε την ορθογραφία ή δοκιμάστε μια νέα αναζήτηση.',
+    },
+    ButtonRole: {
+        Cancel: 'Ακύρωση',
+        Close: 'Κλείσιμο',
+        Confirm: 'Τέλος',
+        Destructive: 'Διαγραφή',
+        OK: 'OK',
+    },
+}));

package/generated/i18n/locales/en.d.ts

@@ -0,0 +1,15 @@
+declare const _default: () => {
+    readonly SearchUnavailableContent: {
+        readonly NoLabel: "No Results";
+        readonly Label: "No Results for ”{search}”";
+        readonly Description: "Check the spelling or try a new search.";
+    };
+    readonly ButtonRole: {
+        readonly Cancel: "Cancel";
+        readonly Close: "Close";
+        readonly Confirm: "Confirm";
+        readonly Destructive: "Delete";
+        readonly OK: "OK";
+    };
+};
+export default _default;

package/generated/i18n/locales/en.js

@@ -0,0 +1,15 @@
+import { defineTranslations } from '../index';
+export default defineTranslations(() => ({
+    SearchUnavailableContent: {
+        NoLabel: 'No Results',
+        Label: 'No Results for ”{search}”',
+        Description: 'Check the spelling or try a new search.',
+    },
+    ButtonRole: {
+        Cancel: 'Cancel',
+        Close: 'Close',
+        Confirm: 'Confirm',
+        Destructive: 'Delete',
+        OK: 'OK',
+    },
+}));

package/generated/i18n/locales/index.d.ts

@@ -0,0 +1,4 @@
+export { default as el } from './el';
+export * from './el';
+export { default as en } from './en';
+export * from './en';

package/generated/i18n/locales/index.js

@@ -0,0 +1,4 @@
+export { default as el } from './el';
+export * from './el';
+export { default as en } from './en';
+export * from './en';

package/generated/index.js

@@ -1,3 +1,3 @@
 #!/usr/bin/env node
-import packageJson from "../package.json";
+import packageJson from '../package.json';
 console.log(`Hello world! ${packageJson.version}`);

package/generated/internal/class/cleanup-registry.d.ts

@@ -0,0 +1,5 @@
+export declare class CleanupRegistry {
+    #private;
+    static register(target: Element, heldValue: () => void, unregisterToken?: string | symbol): void;
+    static unregister(target: Element, token?: string | symbol): void;
+}

package/generated/internal/class/cleanup-registry.js

@@ -0,0 +1,38 @@
+export class CleanupRegistry {
+    static #cleanups = new WeakMap();
+    static #DEFAULT = Symbol('__default__');
+    static register(target, heldValue, unregisterToken = this.#DEFAULT) {
+        let tokens = this.#cleanups.get(target);
+        if (!tokens)
+            this.#cleanups.set(target, (tokens = new Map()));
+        let fns = tokens.get(unregisterToken);
+        if (!fns)
+            tokens.set(unregisterToken, (fns = new Set()));
+        fns.add(heldValue);
+    }
+    static unregister(target, token) {
+        const tokens = this.#cleanups.get(target);
+        if (!tokens)
+            return;
+        if (undefined === token) {
+            for (const fns of tokens.values())
+                for (const fn of fns)
+                    fn();
+            this.#cleanups.delete(target);
+        }
+        else if ('string' === typeof token && token.endsWith('*')) {
+            const prefix = token.slice(0, -1);
+            for (const [key, fns] of tokens)
+                if ('string' === typeof key && key.startsWith(prefix)) {
+                    for (const fn of fns)
+                        fn();
+                    tokens.delete(key);
+                }
+        }
+        else {
+            for (const fn of tokens.get(token) ?? [])
+                fn();
+            tokens.delete(token);
+        }
+    }
+}

package/generated/internal/class/css-style-observer.d.ts

@@ -0,0 +1,8 @@
+export declare class CSSStyleObserver {
+    #private;
+    constructor(options?: {
+        properties: string[];
+    });
+    observe(target: Node, callback: (evt: TransitionEvent) => void): Promise<void>;
+    disconnect(): Promise<void>;
+}

package/generated/internal/class/css-style-observer.js

@@ -0,0 +1,25 @@
+var _a;
+import { onoff } from '../../internal/utils';
+export class CSSStyleObserver {
+    #cleanups;
+    #options;
+    constructor(options = {
+        properties: ['perspective-origin'], // --other-number-@property
+    }) {
+        this.#options = options;
+    }
+    async observe(target, callback) {
+        const listener = this.#handleTransitionrun.bind(this, callback);
+        this.#cleanups = onoff('transitionrun', listener, target).on();
+    }
+    async disconnect() {
+        this.#cleanups?.();
+    }
+    #handleTransitionrun = (callback, evt) => {
+        console.debug(`${_a.name} ⚡️ ${evt?.type} (${evt.propertyName})`);
+        if (!this.#options?.properties.some((prop) => evt.propertyName.startsWith(prop)))
+            return;
+        callback?.(evt);
+    };
+}
+_a = CSSStyleObserver;

package/generated/internal/class/form-associated-base.d.ts

@@ -0,0 +1,20 @@
+export declare function getInternals(instance: FormAssociatedBase): ElementInternals;
+export declare function makeSlotchangeHandler(t: FormAssociatedBase): {
+    types: string;
+    listener: (evt: Event) => void;
+}[];
+export declare abstract class FormAssociatedBase extends HTMLElement {
+    abstract setValidity(flags?: ValidityStateFlags, message?: string, anchor?: HTMLElement): void;
+    static get formAssociated(): boolean;
+    constructor();
+    disconnectedCallback(): void;
+    connectedCallback(): void;
+    get type(): string;
+    get form(): HTMLFormElement | null;
+    get validity(): ValidityState;
+    get validationMessage(): string;
+    get willValidate(): boolean;
+    checkValidity: () => boolean;
+    reportValidity: () => boolean;
+    shake: (times?: number, distance?: number, duration?: number) => Promise<void>;
+}

package/generated/internal/class/form-associated-base.js

@@ -0,0 +1,96 @@
+import { CleanupRegistry } from './cleanup-registry';
+import { MutationObserverSingleton } from './mutation-observer-singleton';
+const internals = new WeakMap();
+const trackedElements = new WeakMap();
+const observers = new MutationObserverSingleton();
+export function getInternals(instance) {
+    const i = internals.get(instance);
+    if (!i)
+        throw new Error('Not a FormAssociatedBase instance');
+    return i;
+}
+export function makeSlotchangeHandler(t) {
+    const handleSlotchange = (evt) => {
+        console.debug(`${makeSlotchangeHandler.name} ⚡️ ${evt?.type}`);
+        const slot = evt.target instanceof HTMLSlotElement && evt.target;
+        if (!slot)
+            return;
+        const assigned = slot.assignedElements({ flatten: true });
+        observers.syncObservations(trackedElements.get(t) ?? new Set(), assigned, handleTagMutation, ['value', 'label']);
+        // for (const el of trackedElements.get(t) ?? [])
+        //   if (!assigned.includes(el)) {
+        //     observers.unobserve(el)
+        //     trackedElements.get(t)?.delete(el)
+        //   }
+        // for (const el of assigned) {
+        //   if (!trackedElements.get(t)?.has(el))
+        //     observers.observe(el, handleTagMutation, {
+        //       attributes: true,
+        //       characterData: true,
+        //       subtree: true,
+        //       childList: true,
+        //       attributeFilter: ['value', 'label'],
+        //     })
+        //   trackedElements.get(t)?.add(el)
+        // }
+        if (0 < assigned.length)
+            handleTagMutation();
+    }, handleTagMutation = (entry) => {
+        console.debug(`${handleTagMutation.name} ⚡️ mutation`);
+        t.setValidity(t.validity, t.validationMessage);
+    };
+    return [{ types: 'slotchange', listener: handleSlotchange }];
+}
+export class FormAssociatedBase extends HTMLElement {
+    static get formAssociated() {
+        return true;
+    }
+    constructor() {
+        super();
+        internals.set(this, this.attachInternals());
+        trackedElements.set(this, new Set());
+    }
+    disconnectedCallback() {
+        console.debug(`${FormAssociatedBase.name} ⚡️ disconnect`);
+        CleanupRegistry.unregister(this);
+        observers.clearObservationsSet(trackedElements.get(this) ?? new Set());
+        // for (const el of trackedElements.get(this) ?? []) observers.unobserve(el)
+        // trackedElements.get(this)?.clear() // trackedElements.delete(this)
+    }
+    connectedCallback() {
+        console.debug(`${FormAssociatedBase.name} ⚡️ connect`);
+    }
+    get type() {
+        return this.localName;
+    }
+    get form() {
+        return getInternals(this).form;
+    }
+    get validity() {
+        return getInternals(this).validity;
+    }
+    get validationMessage() {
+        return getInternals(this).validationMessage;
+    }
+    get willValidate() {
+        return getInternals(this).willValidate;
+    }
+    checkValidity = () => {
+        return getInternals(this).checkValidity();
+    };
+    reportValidity = () => {
+        return getInternals(this).reportValidity();
+    };
+    shake = async (times = 3, distance = 8, duration = 400) => {
+        const frames = [{ transform: 'translateX(0)' }];
+        for (let i = 0; i < times; i++)
+            frames.push({ transform: `translateX(-${distance}px)` }, { transform: `translateX(${distance}px)` });
+        frames.push({ transform: 'translateX(0)' });
+        try {
+            await this.animate(frames, { duration, easing: 'ease-in-out' }).finished;
+        }
+        catch {
+            //
+        }
+    };
+}

package/generated/internal/class/mutation-observer-singleton.d.ts

@@ -0,0 +1,10 @@
+export declare class MutationObserverSingleton {
+    #private;
+    readonly observer: Promise<MutationObserver>;
+    constructor();
+    observe(target: Node, callback: (entry: MutationRecord) => void, options: MutationObserverInit): Promise<void>;
+    unobserve(target: Node): Promise<void>;
+    /** Observes automatically all elements using a Set provided by outside. Calls renderCallback on EVERY change. */
+    syncObservations(set: Set<Element>, nodes: Element[], renderCallback: () => void, attributeFilter?: string[]): Promise<void>;
+    clearObservationsSet(set: Set<Element>): Promise<void>;
+}