jaxs 0.4.0 → 0.4.2

package/dist/jaxs.d.ts

@@ -13,112 +13,229 @@ declare module "state/equality" {
     export const areEqual: (oldValue: any, newValue: any) => any;
 }
 declare module "state/store-updater" {
-    import type { JaxsStore, JaxsStoreUpdateValue, JaxsStoreUpdaterFunction, JaxStoreUpdatersCollection } from "state/store";
-    export class JaxsStoreUpdater<T> {
-        store: JaxsStore<T>;
-        constructor(store: JaxsStore<T>);
-        update(updater: JaxsStoreUpdateValue<T>): void;
+    import type { Store, StoreUpdaterOrValue, StoreUpdaterFunction, StoreUpdatersCollection } from "types";
+    export class StoreUpdaterBase<T> {
+        store: Store<T>;
+        constructor(store: Store<T>);
+        update(updater: StoreUpdaterOrValue<T>): void;
         reset(): void;
         get value(): T;
-        addUpdaterFunction(name: string, updater: JaxsStoreUpdaterFunction<T>): void;
-        addUpdaterFunctions(updaters: JaxStoreUpdatersCollection<T>): void;
+        addUpdaterFunction(name: string, updater: StoreUpdaterFunction<T>): void;
+        addUpdaterFunctions(updaters: StoreUpdatersCollection<T>): void;
     }
 }
 declare module "state/updaters/list" {
-    import { JaxsStoreUpdater } from "state/store-updater";
-    export type JaxsStoreListSorter<T> = (left: T, right: T) => number;
-    export class ListUpdater<T> extends JaxsStoreUpdater<T[]> {
+    import { StoreListSorterFunction, StoreUpdaterFunction } from "types";
+    import { StoreUpdaterBase } from "state/store-updater";
+    export class StoreUpdaterList<T> extends StoreUpdaterBase<T[]> {
+        addUpdaterFunction(name: string, updater: StoreUpdaterFunction<T[]>): void;
         push(element: T): void;
         pop(): T;
         unshift(element: T): void;
         shift(): T;
-        addSorter(name: string, sorter: JaxsStoreListSorter<T>): void;
-        sortBy(sorter: JaxsStoreListSorter<T>): void;
+        addSorter(name: string, sorter: StoreListSorterFunction<T>): void;
+        sortBy(sorter: StoreListSorterFunction<T>): void;
         insertAt(index: number, item: T): void;
     }
 }
 declare module "state/store" {
-    import type { JaxsState, JaxsStoreName } from "state/index";
-    import { JaxsStoreUpdater } from "state/store-updater";
-    import { JaxsStoreListSorter } from "state/updaters/list";
-    type JaxsStoreInitializationOptions<T> = {
-        name: JaxsStoreName;
-        parent: JaxsState;
-        value: T;
-    };
-    type JaxsStoreDataUpdater<T> = (originalValue: T) => T;
-    export type JaxsStoreUpdateValue<T> = T | JaxsStoreDataUpdater<T>;
-    export type JaxsStoreUpdaterFunction<T> = (value: T, ...args: any[]) => T;
-    export type JaxStoreUpdatersCollection<T> = Record<string, JaxsStoreUpdaterFunction<T>>;
-    export class JaxsStore<T> {
-        parent: JaxsState;
-        name: JaxsStoreName;
-        updater: JaxsStoreUpdater<T>;
+    import type { State, StoreDataUpdater, StoreInitializationOptions, StoreListSorterFunction, StoreUpdaterFunction, StoreUpdaterOrValue, StoreUpdatersCollection, StoreUpdater } from "types";
+    export class Store<T> {
+        parent: State;
+        name: string;
+        updater: StoreUpdater<T>;
         _value: T;
         initialState: T;
-        constructor(options: JaxsStoreInitializationOptions<T>);
+        constructor(options: StoreInitializationOptions<T>);
         get ['value'](): T;
         set ['value'](value: T);
-        update(updater: JaxsStoreUpdateValue<T>): void;
+        update(updater: StoreUpdaterOrValue<T>): void;
         updateValue(newValue: T): void;
-        getUpdatedValue(updater: JaxsStoreDataUpdater<T>): T;
-        addUpdaters(updaters: JaxStoreUpdatersCollection<T>): void;
-        addUpdater(name: string, updater: JaxsStoreUpdaterFunction<T>): void;
-        addSorter(name: string, sorter: JaxsStoreListSorter<T>): void;
+        getUpdatedValue(updater: StoreDataUpdater<T>): T;
+        addUpdaters(updaters: StoreUpdatersCollection<any>): void;
+        addUpdater(name: string, updater: StoreUpdaterFunction<any>): void;
+        addSorter(name: string, sorter: StoreListSorterFunction<T>): void;
     }
 }
 declare module "state/updaters/boolean" {
-    import { JaxsStoreUpdater } from "state/store-updater";
-    export class BooleanUpdater extends JaxsStoreUpdater<boolean> {
+    import { StoreUpdaterFunction } from "types";
+    import { StoreUpdaterBase } from "state/store-updater";
+    export class StoreUpdaterBoolean extends StoreUpdaterBase<boolean> {
         toggle(): void;
         setTrue(): void;
         setFalse(): void;
+        addUpdaterFunction(name: string, updater: StoreUpdaterFunction<boolean>): void;
     }
 }
 declare module "state/updaters/object" {
-    import { JaxsStoreUpdater } from "state/store-updater";
-    export class ObjectUpdater<T> extends JaxsStoreUpdater<T> {
+    import { StoreUpdaterFunction } from "types";
+    import { StoreUpdaterBase } from "state/store-updater";
+    export class StoreUpdaterObject<T> extends StoreUpdaterBase<T> {
+        addUpdaterFunction(name: string, updater: StoreUpdaterFunction<T>): void;
         updateAttribute(name: keyof T, value: T[keyof T]): void;
     }
 }
 declare module "state/index" {
-    import { JaxsStore } from "state/store";
-    import { BooleanUpdater } from "state/updaters/boolean";
-    import { ListUpdater } from "state/updaters/list";
-    import { ObjectUpdater } from "state/updaters/object";
-    import type { StoreValue } from "types";
-    export { JaxsStoreUpdater } from "state/store-updater";
-    export type JaxsStatePublisher = (event: string, payload: any) => void;
-    export type JaxsStateTransactionUpdater = (collection: JaxsStoresCollection) => void;
-    export type JaxsStoreName = string;
-    type JaxsStoresCollection = Record<string, JaxsStore<any>>;
+    import { Store } from "state/store";
+    import { StoreUpdaterBoolean } from "state/updaters/boolean";
+    import { StoreUpdaterList } from "state/updaters/list";
+    import { StoreUpdaterObject } from "state/updaters/object";
+    import type { StatePublisher, StateTransactionUpdater, StoresCollection, StoreValue } from "types";
     export const eventName = "state";
-    export class JaxsState {
-        publisher: JaxsStatePublisher;
-        stores: JaxsStoresCollection;
+    export class State {
+        publisher: StatePublisher;
+        stores: StoresCollection;
         eventNamePrefix: string;
-        notifications: Set<JaxsStoreName>;
+        notifications: Set<string>;
         inTransaction: boolean;
-        constructor(publisher: JaxsStatePublisher);
-        create<T>(name: JaxsStoreName, initialState: T): JaxsStore<T>;
-        createBoolean(name: JaxsStoreName, initialState: boolean): JaxsStore<boolean>;
-        createRecord<T>(name: JaxsStoreName, initialState: T): JaxsStore<T>;
-        createList<T>(name: JaxsStoreName, initialState: T[]): JaxsStore<T[]>;
-        store(name: JaxsStoreName): JaxsStore<any>;
-        get(name: JaxsStoreName): StoreValue;
-        getAll(names: JaxsStoreName[]): {};
-        notify(name: JaxsStoreName): void;
-        update(name: JaxsStoreName, newValue: any): void;
-        transaction(updater: JaxsStateTransactionUpdater): void;
+        constructor(publisher: StatePublisher);
+        create<T>(name: string, initialState: T): Store<T>;
+        createBoolean(name: string, initialState: boolean): Store<boolean>;
+        createRecord<T>(name: string, initialState: T): Store<T>;
+        createList<T>(name: string, initialState: T[]): Store<T[]>;
+        store(name: string): Store<any>;
+        get(name: string): StoreValue;
+        getAll(names: string[]): {};
+        notify(name: string): void;
+        update(name: string, newValue: any): void;
+        transaction(updater: StateTransactionUpdater): void;
         publishAll(): void;
-        publish(name: JaxsStoreName): void;
-        event(name: JaxsStoreName): string;
+        publish(name: string): void;
+        event(name: string): string;
+    }
+    export const createState: (publisher: StatePublisher) => State;
+    export { Store, StoreUpdaterBoolean, StoreUpdaterList, StoreUpdaterObject };
+}
+declare module "bus/exact-subscriptions" {
+    import { ExactSubscriptionData, BusListener, Unsubscribe } from "types";
+    export class ExactSubscriptions {
+        lookup: Record<string, ExactSubscriptionData<any>[]>;
+        constructor();
+        add<T>(matcher: string, listener: BusListener<T>, index: number): Unsubscribe;
+        remove<T>(subscription: ExactSubscriptionData<T>): void;
+        matches(event: string): ExactSubscriptionData<any>[];
+        ensureArrayFor(matcher: string): void;
+    }
+}
+declare module "bus/fuzzy-subscriptions" {
+    import { FuzzySubscriptionData, BusListener, Unsubscribe } from "types";
+    export class FuzzySubscriptions {
+        lookup: FuzzySubscriptionData<any>[];
+        constructor();
+        add<T>(matcher: RegExp, listener: BusListener<T>, index: number): Unsubscribe;
+        remove<T>(subscription: FuzzySubscriptionData<T>): void;
+        matches(event: string): FuzzySubscriptionData<any>[];
+    }
+}
+declare module "bus/index" {
+    import { BusEventMatcher, BusListener, Unsubscribe, AppAdditionListenerOptions, BusOptions } from "types";
+    import { ExactSubscriptions } from "bus/exact-subscriptions";
+    import { FuzzySubscriptions } from "bus/fuzzy-subscriptions";
+    class JaxsBus {
+        options?: AppAdditionListenerOptions;
+        exactSubscriptions: ExactSubscriptions;
+        fuzzySubscriptions: FuzzySubscriptions;
+        currentIndex: number;
+        constructor();
+        subscribe<T>(matcher: BusEventMatcher, listener: BusListener<T>): Unsubscribe;
+        publish<T>(event: string, payload: T): void;
+        addListenerOptions(options: AppAdditionListenerOptions): void;
+        listenerOptions(event: string): BusOptions;
+    }
+    const createBus: () => {
+        bus: JaxsBus;
+        publish: (event: string, payload: any) => void;
+        subscribe: (matcher: BusEventMatcher, listener: BusListener<any>) => Unsubscribe;
+    };
+    export { createBus, JaxsBus, ExactSubscriptions, FuzzySubscriptions };
+}
+declare module "rendering/templates/root" {
+    import type { JaxsElement, JaxsNodes, RenderKit, Renderable, JaxsNode } from "types";
+    export class Root {
+        template: Renderable;
+        selector: string;
+        renderKit: RenderKit;
+        dom: JaxsNodes;
+        parentElement?: JaxsElement | null;
+        constructor(template: Renderable, selector: string, renderKit: RenderKit);
+        renderAndAttach(renderKit: RenderKit): void;
+        render(renderKit: RenderKit): JaxsNode[];
+        attach(): void;
+        getParentElement(): Element;
+    }
+    export const render: (template: Renderable, selector: string, renderKit: RenderKit) => Root;
+}
+declare module "navigation/events" {
+    export const linkNavigationEvent = "go-to-href";
+    export const locationChangeEvent = "navigation:location-change";
+    export const routeChangeEvent = "navigation:route-change";
+}
+declare module "navigation/route-state" {
+    import { State } from "state/index";
+    export const createRouteState: (state: State) => void;
+}
+declare module "navigation/find-href" {
+    export const findHref: (node: HTMLElement) => string;
+}
+declare module "navigation/navigate" {
+    import { BusOptions } from "types";
+    export const navigate: (path: string, { publish, window }: BusOptions) => void;
+}
+declare module "navigation/on-link-click" {
+    import { BusOptions } from "types";
+    export const onLinkClick: (domEvent: MouseEvent, options: BusOptions) => void;
+}
+declare module "navigation/extract-query-params" {
+    export const extractQueryParams: (queryString: string) => {};
+}
+declare module "navigation/on-location-change" {
+    import { BusOptions } from "types";
+    export const onLocationChange: (_: null, listenerOptions: BusOptions) => void;
+}
+declare module "navigation/start" {
+    import type { App } from "app/index";
+    export const subscribeToNavigation: (app: App) => void;
+    export const subscribeToHistoryChange: (app: App) => void;
+    export const publishLocation: (app: App) => void;
+    export const startNavigation: (app: App) => void;
+}
+declare module "app/index" {
+    import type { Renderable, RenderKit, Subscribe, PublishFunction } from "types";
+    import type { State } from "state/index";
+    import type { JaxsBus } from "bus/index";
+    import { Root } from "rendering/templates/root";
+    export class App {
+        window: Window;
+        document: Document;
+        publish: PublishFunction<any>;
+        subscribe: Subscribe;
+        bus: JaxsBus;
+        state: State;
+        renderKit: RenderKit;
+        roots: Root[];
+        constructor({ window, document, publish, subscribe, bus, state, renderKit }: {
+            window: any;
+            document: any;
+            publish: any;
+            subscribe: any;
+            bus: any;
+            state: any;
+            renderKit: any;
+        });
+        render(template: Renderable, selector: string): Root;
+        startNavigation(): void;
     }
-    export const createState: (publisher: JaxsStatePublisher) => JaxsState;
-    export { JaxsStore, BooleanUpdater, ListUpdater, ObjectUpdater };
 }
 declare module "types" {
-    import { JaxsState } from "state/index";
+    import type { State } from "state/index";
+    import type { Store } from "state/store";
+    import type { StoreUpdaterBase } from "state/store-updater";
+    import type { StoreUpdaterBoolean } from "state/updaters/boolean";
+    import type { StoreUpdaterList } from "state/updaters/list";
+    import type { StoreUpdaterObject } from "state/updaters/object";
+    export type { App } from "app/index";
+    export { State, Store, StoreUpdaterBase, StoreUpdaterBoolean, StoreUpdaterList, StoreUpdaterObject, };
+    export type StoreUpdater<T> = StoreUpdaterBase<T> | StoreUpdaterObject<T> | StoreUpdaterBoolean | StoreUpdaterList<T>;
     export type TextValue = string | number;
     export interface JsxIded {
         __jsx?: string;
@@ -132,9 +249,9 @@ declare module "types" {
         busEvent: string;
         listener: EventListener;
     };
-    export type TagEventMaps = Record<string, EventMap>;
+    export type EventMaps = Record<string, EventMap>;
     interface JsxEventMapped {
-        eventMaps: TagEventMaps;
+        eventMaps: EventMaps;
     }
     export type JaxsElement = Element & JsxIded & JsxEventMapped;
     export type JaxsText = Text & JsxIded;
@@ -163,13 +280,13 @@ declare module "types" {
         events: TagEventAttributes;
     };
     export type DomPublish = (eventName: string, domEvent: Event) => void;
-    export type Subscribe = (matcher: JaxsBusEventMatcher, listener: JaxsBusListener<any>) => void;
+    export type Subscribe = (matcher: BusEventMatcher, listener: BusListener<any>) => void;
     export type RenderKit = {
         document: Document;
         window: Window;
         publish: DomPublish;
         subscribe: Subscribe;
-        state: JaxsState;
+        state: State;
         parent?: JaxsNode | null;
     };
     export interface Renderable {
@@ -178,7 +295,7 @@ declare module "types" {
     }
     export type StaticTemplate = () => Renderable;
     export type TypedTemplate<T> = (props: Props<T>) => Renderable;
-    export type JaxsTemplate<T> = StaticTemplate | TypedTemplate<T>;
+    export type Template<T> = StaticTemplate | TypedTemplate<T>;
     export type JsxCollection = (Renderable | TextValue)[];
     export enum ChangeInstructionTypes {
         removeNode = 0,
@@ -215,8 +332,8 @@ declare module "types" {
         parent: JaxsElement;
         index: number;
     };
-    type NullData = Record<string, never>;
-    export type InstructionData = RemoveInstructionData | AttributeInstructionData | EventInstructionData | UpdateEventInstructionData | InsertNodeData | NullData;
+    type NullInstructionData = Record<string, never>;
+    export type InstructionData = RemoveInstructionData | AttributeInstructionData | EventInstructionData | UpdateEventInstructionData | InsertNodeData | NullInstructionData;
     export type ChangeInstruction = {
         source: JaxsNode;
         target: JaxsNode;
@@ -224,44 +341,75 @@ declare module "types" {
         data: InstructionData;
     };
     export type ChangeInstructions = Array<ChangeInstruction>;
-    export type Updater = (instruction: ChangeInstruction) => void;
+    export type InstructionsUpdater = (instruction: ChangeInstruction) => void;
     export type StoreValue = string | number | boolean | null | StoreValue[] | {
         [key: string]: StoreValue;
     };
     export type StoreMap = {
         [key: string]: StoreValue;
     };
-    export type JaxsViewModel<ATTRIBUTES, STORE_MAP> = (storeMap: STORE_MAP) => Partial<ATTRIBUTES>;
+    export type ViewModel<ATTRIBUTES, STORE_MAP> = (storeMap: STORE_MAP) => Partial<ATTRIBUTES>;
     export type BindSubscriptionList = string[];
     export type BindParams<T, U> = {
-        Template: JaxsTemplate<T>;
-        viewModel?: JaxsViewModel<T, U>;
+        Template: Template<T>;
+        viewModel?: ViewModel<T, U>;
         subscriptions?: BindSubscriptionList;
     };
     export type AppAdditionListenerOptions = {
-        state: JaxsState;
+        state: State;
         document: Document;
         window: Window;
     };
     export type DefaultBusListenerOptions<T> = {
-        publish: JaxsPublishFunction<T>;
+        publish: PublishFunction<T>;
         eventName: string;
     };
-    export type JaxsBusOptions = AppAdditionListenerOptions & DefaultBusListenerOptions<any>;
-    export type JaxsPublishFunction<T> = (event: string, payload: T) => void;
-    export type JaxsBusListener<T> = (payload: T, listenerKit: JaxsBusOptions) => void;
-    export type JaxsBusEventMatcher = string | RegExp;
+    export type BusOptions = AppAdditionListenerOptions & DefaultBusListenerOptions<any>;
+    export type PublishFunction<T> = (event: string, payload: T) => void;
+    export type BusListener<T> = (payload: T, listenerKit: BusOptions) => void;
+    export type BusEventMatcher = string | RegExp;
     export type ExactSubscriptionData<T> = {
-        listener: JaxsBusListener<T>;
+        listener: BusListener<T>;
         index: number;
         matcher: string;
     };
     export type FuzzySubscriptionData<T> = {
-        listener: JaxsBusListener<T>;
+        listener: BusListener<T>;
         index: number;
         matcher: RegExp;
     };
     export type Unsubscribe = () => void;
+    export type CreateAppBuilderArguments = {
+        window?: Window;
+        document?: Document;
+    };
+    export type RouteState = {
+        host: string;
+        path: string;
+        query: Record<string, string>;
+    };
+    export type AttributesWithChildren<T> = Props<T> & {
+        children?: JsxCollection;
+    };
+    export type DiffPair = {
+        source: JaxsNode;
+        target: JaxsNode;
+    };
+    export type CompileChildren = (sourceList: JaxsNodes, targetList: JaxsNodes, parent: JaxsElement) => ChangeInstructions;
+    export type StatePublisher = (event: string, payload: any) => void;
+    export type StateTransactionUpdater = (collection: StoresCollection) => void;
+    export type StoresCollection = Record<string, Store<any>>;
+    export type StoreInitializationOptions<T> = {
+        name: string;
+        parent: State;
+        value: T;
+    };
+    export type StoreDataUpdater<T> = (originalValue: T) => T;
+    export type UpdaterValue<T> = boolean | T | T[];
+    export type StoreUpdaterOrValue<T> = UpdaterValue<T> | StoreDataUpdater<T>;
+    export type StoreUpdaterFunction<T> = (value: UpdaterValue<T>, ...args: any[]) => T;
+    export type StoreUpdatersCollection<T> = Record<string, StoreUpdaterFunction<T>>;
+    export type StoreListSorterFunction<T> = (left: T, right: T) => number;
 }
 declare module "rendering/dom/tag" {
     import type { JaxsElement, TagAttributes, TagEventAttributes, DomPublish, RenderKit } from "types";
@@ -301,12 +449,9 @@ declare module "rendering/templates/children/svg" {
     export const withSvgFlag: (isSvg: boolean) => (template: Renderable) => Renderable;
 }
 declare module "rendering/templates/children/normalize" {
-    import { JsxCollection, Renderable, Props } from "types";
+    import { JsxCollection, Renderable, AttributesWithChildren } from "types";
     export const normalizeJsxChildren: (jsxChildren: JsxCollection, isSvg: boolean) => Renderable[];
     export const normalizeToArray: <T>(children: T | T[]) => T[];
-    type AttributesWithChildren<T> = Props<T> & {
-        children?: JsxCollection;
-    };
     export const ensureJsxChildrenArray: <T>(maybeChildren?: JsxCollection, attributes?: AttributesWithChildren<T>) => JsxCollection;
 }
 declare module "rendering/templates/tag/attributes-and-events" {
@@ -360,155 +505,26 @@ declare module "rendering/templates/tag" {
     }
 }
 declare module "rendering/jsx" {
-    import type { JsxCollection, Props, JaxsTemplate, Renderable } from "types";
+    import type { JsxCollection, Props, Template, Renderable } from "types";
     import { Children } from "rendering/templates/children";
     const jsx: {
-        <T>(type: string | JaxsTemplate<T>, attributes: Props<T>, ...children: JsxCollection): Renderable;
+        <T>(type: string | Template<T>, attributes: Props<T>, ...children: JsxCollection): Renderable;
         fragment<T>(attributes: Props<T>, maybeChildren: JsxCollection): Children;
     };
     export { jsx };
 }
-declare module "bus/exact-subscriptions" {
-    import { ExactSubscriptionData, JaxsBusListener, Unsubscribe } from "types";
-    export class ExactSubscriptions {
-        lookup: Record<string, ExactSubscriptionData<any>[]>;
-        constructor();
-        add<T>(matcher: string, listener: JaxsBusListener<T>, index: number): Unsubscribe;
-        remove<T>(subscription: ExactSubscriptionData<T>): void;
-        matches(event: string): ExactSubscriptionData<any>[];
-        ensureArrayFor(matcher: string): void;
-    }
-}
-declare module "bus/fuzzy-subscriptions" {
-    import { FuzzySubscriptionData, JaxsBusListener, Unsubscribe } from "types";
-    export class FuzzySubscriptions {
-        lookup: FuzzySubscriptionData<any>[];
-        constructor();
-        add<T>(matcher: RegExp, listener: JaxsBusListener<T>, index: number): Unsubscribe;
-        remove<T>(subscription: FuzzySubscriptionData<T>): void;
-        matches(event: string): FuzzySubscriptionData<any>[];
-    }
-}
-declare module "bus/index" {
-    import { JaxsBusEventMatcher, JaxsBusListener, Unsubscribe, AppAdditionListenerOptions, JaxsBusOptions } from "types";
-    import { ExactSubscriptions } from "bus/exact-subscriptions";
-    import { FuzzySubscriptions } from "bus/fuzzy-subscriptions";
-    class JaxsBus {
-        options?: AppAdditionListenerOptions;
-        exactSubscriptions: ExactSubscriptions;
-        fuzzySubscriptions: FuzzySubscriptions;
-        currentIndex: number;
-        constructor();
-        subscribe<T>(matcher: JaxsBusEventMatcher, listener: JaxsBusListener<T>): Unsubscribe;
-        publish<T>(event: string, payload: T): void;
-        addListenerOptions(options: AppAdditionListenerOptions): void;
-        listenerOptions(event: string): JaxsBusOptions;
-    }
-    const createBus: () => {
-        bus: JaxsBus;
-        publish: (event: string, payload: any) => void;
-        subscribe: (matcher: JaxsBusEventMatcher, listener: JaxsBusListener<any>) => Unsubscribe;
-    };
-    export { createBus, JaxsBus, ExactSubscriptions, FuzzySubscriptions };
-}
-declare module "rendering/templates/root" {
-    import type { JaxsElement, JaxsNodes, RenderKit, Renderable, JaxsNode } from "types";
-    export class Root {
-        template: Renderable;
-        selector: string;
-        renderKit: RenderKit;
-        dom: JaxsNodes;
-        parentElement?: JaxsElement | null;
-        constructor(template: Renderable, selector: string, renderKit: RenderKit);
-        renderAndAttach(renderKit: RenderKit): void;
-        render(renderKit: RenderKit): JaxsNode[];
-        attach(): void;
-        getParentElement(): Element;
-    }
-    export const render: (template: Renderable, selector: string, renderKit: RenderKit) => Root;
-}
-declare module "navigation/events" {
-    export const linkNavigationEvent = "go-to-href";
-    export const locationChangeEvent = "navigation:location-change";
-    export const routeChangeEvent = "navigation:route-change";
-}
-declare module "navigation/route-state" {
-    import { JaxsState } from "state/index";
-    export type RouteState = {
-        host: string;
-        path: string;
-        query: Record<string, string>;
-    };
-    export const createRouteState: (state: JaxsState) => void;
-}
-declare module "navigation/find-href" {
-    export const findHref: (node: HTMLElement) => string;
-}
-declare module "navigation/navigate" {
-    import { JaxsBusOptions } from "types";
-    export const navigate: (path: string, { publish, window }: JaxsBusOptions) => void;
-}
-declare module "navigation/on-link-click" {
-    import { JaxsBusOptions } from "types";
-    export const onLinkClick: (domEvent: MouseEvent, options: JaxsBusOptions) => void;
-}
-declare module "navigation/extract-query-params" {
-    export const extractQueryParams: (queryString: string) => {};
-}
-declare module "navigation/on-location-change" {
-    import { JaxsBusOptions } from "types";
-    export const onLocationChange: (_: null, listenerOptions: JaxsBusOptions) => void;
-}
-declare module "navigation/start" {
-    import type { App } from "app/index";
-    export const subscribeToNavigation: (app: App) => void;
-    export const subscribeToHistoryChange: (app: App) => void;
-    export const publishLocation: (app: App) => void;
-    export const startNavigation: (app: App) => void;
-}
-declare module "app/index" {
-    import type { Renderable, RenderKit, Subscribe, JaxsPublishFunction } from "types";
-    import type { JaxsState } from "state/index";
-    import type { JaxsBus } from "bus/index";
-    import { Root } from "rendering/templates/root";
-    export class App {
-        window: Window;
-        document: Document;
-        publish: JaxsPublishFunction<any>;
-        subscribe: Subscribe;
-        bus: JaxsBus;
-        state: JaxsState;
-        renderKit: RenderKit;
-        roots: Root[];
-        constructor({ window, document, publish, subscribe, bus, state, renderKit }: {
-            window: any;
-            document: any;
-            publish: any;
-            subscribe: any;
-            bus: any;
-            state: any;
-            renderKit: any;
-        });
-        render(template: Renderable, selector: string): Root;
-        startNavigation(): void;
-    }
-}
 declare module "app/builder" {
     import { App } from "app/index";
     import { JaxsBus } from "bus/index";
-    import { JaxsState } from "state/index";
-    import { JaxsPublishFunction, Subscribe, RenderKit } from "types";
-    type CreateAppBuilderArguments = {
-        window?: Window;
-        document?: Document;
-    };
+    import { State } from "state/index";
+    import { PublishFunction, Subscribe, RenderKit, CreateAppBuilderArguments } from "types";
     class AppBuilder {
         window: Window;
         document: Document;
-        publish: JaxsPublishFunction<any>;
+        publish: PublishFunction<any>;
         subscribe: Subscribe;
         bus: JaxsBus;
-        state: JaxsState;
+        state: State;
         renderKit: RenderKit;
         constructor(domEnvironment: CreateAppBuilderArguments);
         setup(): App;
@@ -574,8 +590,7 @@ declare module "rendering/update/instructions/nodes/text" {
     export const compileForText: (source: Text, target: Text) => ChangeInstructions;
 }
 declare module "rendering/update/instructions/node" {
-    import type { JaxsElement, JaxsNode, JaxsNodes, ChangeInstructions } from "types";
-    type CompileChildren = (sourceList: JaxsNodes, targetList: JaxsNodes, parent: JaxsElement) => ChangeInstructions;
+    import type { JaxsNode, ChangeInstructions, CompileChildren } from "types";
     export const compileForNode: (source: JaxsNode, target: JaxsNode, compileChildren: CompileChildren) => ChangeInstructions;
 }
 declare module "rendering/update/instructions/collection" {
@@ -587,10 +602,10 @@ declare module "rendering/update/perform-change" {
     export const performChange: (source: JaxsNodes, target: JaxsNodes, parent: JaxsElement) => void;
 }
 declare module "rendering/templates/bound" {
-    import { JaxsElement, JaxsNodes, Props, JaxsTemplate, RenderKit, JaxsViewModel, BindParams, BindSubscriptionList } from "types";
+    import { JaxsElement, JaxsNodes, Props, Template, RenderKit, ViewModel, BindParams, BindSubscriptionList } from "types";
     export class Bound<ATTRIBUTES, STATE_MAP> {
-        Template: JaxsTemplate<ATTRIBUTES>;
-        viewModel: JaxsViewModel<ATTRIBUTES, STATE_MAP>;
+        Template: Template<ATTRIBUTES>;
+        viewModel: ViewModel<ATTRIBUTES, STATE_MAP>;
         attributes: Partial<Props<ATTRIBUTES>>;
         subscriptions: BindSubscriptionList;
         dom: JaxsNodes;
@@ -619,7 +634,6 @@ declare module "navigation/index" {
     import { onLocationChange } from "navigation/on-location-change";
     import { createRouteState } from "navigation/route-state";
     import * as start from "navigation/start";
-    export type { RouteState } from "navigation/route-state";
     export { events, extractQueryParams, findHref, navigate, onLinkClick, onLocationChange, createRouteState, start, };
 }
 declare module "jaxs" {

package/dist/jaxs.js

@@ -119,12 +119,12 @@ class Et {
     return new yt(this.type, this.attributes).generate();
   }
 }
-const xt = (e, t, ...s) => typeof e == "string" ? new Et(e, t, s) : e(vt(t, s));
-xt.fragment = (e, t) => {
+const At = (e, t, ...s) => typeof e == "string" ? new Et(e, t, s) : e(vt(t, s));
+At.fragment = (e, t) => {
   const s = j(t, e);
   return new O(s);
 };
-class At {
+class St {
   constructor(t, s, n) {
     this.template = t, this.selector = s, this.renderKit = n, this.dom = [];
   }
@@ -143,10 +143,10 @@ class At {
     return this.renderKit.document.querySelector(this.selector);
   }
 }
-const St = (e, t, s) => {
-  const n = new At(e, t, s);
+const xt = (e, t, s) => {
+  const n = new St(e, t, s);
   return n.renderAndAttach(s), n;
-}, $ = "go-to-href", m = "navigation:location-change", M = "navigation:route-change", _t = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+}, $ = "go-to-href", m = "navigation:location-change", M = "navigation:route-change", wt = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   linkNavigationEvent: $,
   locationChangeEvent: m,
@@ -162,56 +162,56 @@ const St = (e, t, s) => {
   return t && t.getAttribute("href") || "";
 }, D = (e, { publish: t, window: s }) => {
   s.history.pushState(null, "", e), t(m, null);
-}, z = (e, t) => {
+}, U = (e, t) => {
   if (!e || !e.target) return;
   e.preventDefault();
   const s = T(e.target);
   D(s, t);
-}, L = (e) => e.replace(/^\?/, "").split("&").reduce((t, s) => {
+}, z = (e) => e.replace(/^\?/, "").split("&").reduce((t, s) => {
   if (!s) return t;
   const n = s.split("=");
   return t[n[0]] = n[1], t;
-}, {}), P = (e, t) => {
-  const { state: s, publish: n, window: r } = t, { host: o, pathname: a, search: h } = r.location, i = a, d = L(h), u = {
+}, {}), L = (e, t) => {
+  const { state: s, publish: n, window: r } = t, { host: o, pathname: a, search: h } = r.location, i = a, d = z(h), u = {
     host: o,
     path: i,
     query: d
   };
   s.store("route").update(u), n(M, u);
-}, U = (e) => {
-  const { subscribe: t } = e;
-  t($, z);
 }, B = (e) => {
+  const { subscribe: t } = e;
+  t($, U);
+}, P = (e) => {
   const { publish: t, subscribe: s, state: n, window: r } = e;
-  F(n), r.addEventListener("popstate", () => t(m, null)), s(m, P);
-}, K = (e) => {
-  setTimeout(() => e.publish(m, null), 0);
+  F(n), r.addEventListener("popstate", () => t(m, null)), s(m, L);
 }, V = (e) => {
-  B(e), U(e), K(e);
-}, wt = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  setTimeout(() => e.publish(m, null), 0);
+}, K = (e) => {
+  P(e), B(e), V(e);
+}, _t = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  publishLocation: K,
-  startNavigation: V,
-  subscribeToHistoryChange: B,
-  subscribeToNavigation: U
+  publishLocation: V,
+  startNavigation: K,
+  subscribeToHistoryChange: P,
+  subscribeToNavigation: B
 }, Symbol.toStringTag, { value: "Module" }));
 class R {
   constructor({ window: t, document: s, publish: n, subscribe: r, bus: o, state: a, renderKit: h }) {
     this.window = t, this.document = s, this.publish = n, this.subscribe = r, this.bus = o, this.state = a, this.renderKit = h, this.roots = [];
   }
   render(t, s) {
-    const n = St(t, s, this.renderKit);
+    const n = xt(t, s, this.renderKit);
     return this.roots.push(n), n;
   }
   startNavigation() {
-    V(this);
+    K(this);
   }
 }
 const pe = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   App: R
 }, Symbol.toStringTag, { value: "Module" }));
-class J {
+class q {
   constructor() {
     this.lookup = {};
   }
@@ -234,7 +234,7 @@ class J {
     this.lookup[t] || (this.lookup[t] = []);
   }
 }
-class q {
+class J {
   constructor() {
     this.lookup = [];
   }
@@ -257,7 +257,7 @@ class q {
 }
 class H {
   constructor() {
-    this.exactSubscriptions = new J(), this.fuzzySubscriptions = new q(), this.currentIndex = 0;
+    this.exactSubscriptions = new q(), this.fuzzySubscriptions = new J(), this.currentIndex = 0;
   }
   subscribe(t, s) {
     let n;
@@ -299,18 +299,18 @@ const I = () => {
   };
 }, me = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  ExactSubscriptions: J,
-  FuzzySubscriptions: q,
+  ExactSubscriptions: q,
+  FuzzySubscriptions: J,
   JaxsBus: H,
   createBus: I
-}, Symbol.toStringTag, { value: "Module" })), f = (e) => Array.isArray(e), g = (e) => e !== null && !f(e) && typeof e == "object", Nt = (e, t) => e === t, jt = (e, t) => Object.keys(e).length === Object.keys(t).length, kt = (e, t) => !(g(e) && g(t)) || !jt(e, t) ? !1 : Object.keys(e).every((s) => {
+}, Symbol.toStringTag, { value: "Module" })), b = (e) => Array.isArray(e), g = (e) => e !== null && !b(e) && typeof e == "object", Nt = (e, t) => e === t, jt = (e, t) => Object.keys(e).length === Object.keys(t).length, kt = (e, t) => !(g(e) && g(t)) || !jt(e, t) ? !1 : Object.keys(e).every((s) => {
   const n = e[s], r = t[s];
   return E(n, r);
-}), Ot = (e, t) => !(f(e) && f(t)) || e.length !== t.length ? !1 : e.every((s, n) => {
+}), Ot = (e, t) => !(b(e) && b(t)) || e.length !== t.length ? !1 : e.every((s, n) => {
   const r = t[n];
   return E(s, r);
-}), E = (e, t) => g(e) ? kt(e, t) : f(e) ? Ot(e, t) : Nt(e, t);
-class b {
+}), E = (e, t) => g(e) ? kt(e, t) : b(e) ? Ot(e, t) : Nt(e, t);
+class f {
   constructor(t) {
     this.store = t;
   }
@@ -334,7 +334,13 @@ class b {
       this.addUpdaterFunction(s, t[s]);
   }
 }
-class x extends b {
+class A extends f {
+  addUpdaterFunction(t, s) {
+    this.constructor.prototype[t] = (...n) => {
+      const r = s(this.value, ...n);
+      this.update(r);
+    };
+  }
   push(t) {
     const s = [...this.value, t];
     this.update(s);
@@ -367,7 +373,7 @@ class x extends b {
 }
 class y {
   constructor(t) {
-    this.name = t.name, this.parent = t.parent, this._value = t.value, this.initialState = structuredClone(t.value), this.updater = new b(this);
+    this.name = t.name, this.parent = t.parent, this._value = t.value, this.initialState = structuredClone(t.value), this.updater = new f(this);
   }
   get value() {
     return this._value;
@@ -395,10 +401,10 @@ class y {
     this.updater.addUpdaterFunction(t, s);
   }
   addSorter(t, s) {
-    this.updater instanceof x && this.updater.addSorter(t, s);
+    this.updater instanceof A && this.updater.addSorter(t, s);
   }
 }
-class Q extends b {
+class Q extends f {
   toggle() {
     const t = !this.value;
     this.update(t);
@@ -409,17 +415,29 @@ class Q extends b {
   setFalse() {
     this.update(!1);
   }
+  addUpdaterFunction(t, s) {
+    this.constructor.prototype[t] = (...n) => {
+      const r = s(this.value, ...n);
+      this.update(r);
+    };
+  }
 }
-class W extends b {
+class W extends f {
+  addUpdaterFunction(t, s) {
+    this.constructor.prototype[t] = (...n) => {
+      const r = s(this.value, ...n);
+      this.update(r);
+    };
+  }
   updateAttribute(t, s) {
     const n = { ...this.value };
     n[t] = s, this.update(n);
   }
 }
-const A = "state";
+const S = "state";
 class G {
   constructor(t) {
-    this.publisher = t, this.stores = {}, this.eventNamePrefix = A, this.notifications = /* @__PURE__ */ new Set(), this.inTransaction = !1;
+    this.publisher = t, this.stores = {}, this.eventNamePrefix = S, this.notifications = /* @__PURE__ */ new Set(), this.inTransaction = !1;
   }
   create(t, s) {
     const n = new y({
@@ -439,7 +457,7 @@ class G {
   }
   createList(t, s) {
     const n = this.create(t, s);
-    return n.updater = new x(n), n;
+    return n.updater = new A(n), n;
   }
   store(t) {
     return this.stores[t] || new y({
@@ -480,14 +498,13 @@ class G {
 }
 const X = (e) => new G(e), be = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  BooleanUpdater: Q,
-  JaxsState: G,
-  JaxsStore: y,
-  JaxsStoreUpdater: b,
-  ListUpdater: x,
-  ObjectUpdater: W,
+  State: G,
+  Store: y,
+  StoreUpdaterBoolean: Q,
+  StoreUpdaterList: A,
+  StoreUpdaterObject: W,
   createState: X,
-  eventName: A
+  eventName: S
 }, Symbol.toStringTag, { value: "Module" }));
 class $t {
   constructor(t) {
@@ -559,27 +576,27 @@ const ve = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   target: t,
   data: s,
   type: c.addAttribute
-}), zt = (e, t, s) => ({
+}), Ut = (e, t, s) => ({
   source: e,
   target: t,
   data: s,
   type: c.updateAttribute
-}), Lt = (e, t, s) => ({
+}), zt = (e, t, s) => ({
   source: e,
   target: t,
   data: s,
   type: c.removeEvent
-}), Pt = (e, t, s) => ({
+}), Lt = (e, t, s) => ({
   source: e,
   target: t,
   data: s,
   type: c.addEvent
-}), Ut = (e, t, s) => ({
+}), Bt = (e, t, s) => ({
   source: e,
   target: t,
   data: s,
   type: c.updateEvent
-}), S = (e) => ({
+}), x = (e) => ({
   source: e,
   target: e,
   // for type crap only
@@ -591,13 +608,13 @@ const ve = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   // for type crap only
   type: c.insertNode,
   data: t
-}), Bt = (e, t, s) => ({
+}), Pt = (e, t, s) => ({
   source: e,
   target: t,
   type: c.changeValue,
   data: s
-}), Kt = (e, t) => e.type > t.type ? 1 : e.type < t.type ? -1 : 0, _ = { index: -1 };
-class Vt {
+}), Vt = (e, t) => e.type > t.type ? 1 : e.type < t.type ? -1 : 0, w = { index: -1 };
+class Kt {
   constructor() {
     this.map = {};
   }
@@ -612,7 +629,7 @@ class Vt {
   }
   pullMatch(t) {
     const s = t && t.__jsx;
-    return !s || !(this.map[s] && this.map[s].length) ? _ : this.map[s].shift();
+    return !s || !(this.map[s] && this.map[s].length) ? w : this.map[s].shift();
   }
   clear(t) {
     const s = t && t.__jsx;
@@ -628,8 +645,8 @@ class Vt {
     return Object.values(this.map).flat();
   }
 }
-const w = (e) => {
-  const t = new Vt();
+const _ = (e) => {
+  const t = new Kt();
   return t.populate(e), t;
 }, Y = (e, t, s = !1) => {
   const n = [], r = e.attributes, o = r.length, a = t.attributes, h = a.length;
@@ -646,7 +663,7 @@ const w = (e) => {
         }
       }
       u ? l.value !== u.value && n.push(
-        zt(e, t, {
+        Ut(e, t, {
           name: l.name,
           value: u.value,
           isSvg: s
@@ -682,13 +699,13 @@ const w = (e) => {
   return o.forEach((h) => {
     const i = n[h], d = r[h];
     d ? d.busEvent !== i.busEvent && s.push(
-      Ut(e, t, {
+      Bt(e, t, {
         name: h,
         targetValue: d.listener,
         sourceValue: i.listener
       })
     ) : s.push(
-      Lt(e, t, {
+      zt(e, t, {
         name: i.domEvent,
         value: i.listener
       })
@@ -696,17 +713,17 @@ const w = (e) => {
   }), a.forEach((h) => {
     const i = n[h], d = r[h];
     i || s.push(
-      Pt(e, t, {
+      Lt(e, t, {
         name: d.domEvent,
         value: d.listener
       })
     );
   }), s;
-}, Jt = (e) => e.tagName !== "INPUT", qt = (e, t) => e.value === t.value, Ht = (e, t) => {
-  if (Jt(e) || qt(e, t))
+}, qt = (e) => e.tagName !== "INPUT", Jt = (e, t) => e.value === t.value, Ht = (e, t) => {
+  if (qt(e) || Jt(e, t))
     return [];
   const s = e, n = t;
-  return [Bt(s, n, { name: "value", value: n.value })];
+  return [Pt(s, n, { name: "value", value: n.value })];
 }, It = (e, t) => {
   const s = Y(e, t), n = Rt(e, t), r = Ht(e, t);
   return s.concat(n).concat(r);
@@ -729,7 +746,7 @@ const w = (e) => {
   } else e.nodeType === 3 && (n = Wt(e, t));
   return n;
 }, Z = (e, t, s) => {
-  const n = [], r = Xt(e, t), o = w(e), a = w(t), h = [];
+  const n = [], r = Xt(e, t), o = _(e), a = _(t), h = [];
   let i = 0;
   for (; i < r; i++) {
     const u = e[i], l = t[i];
@@ -750,10 +767,10 @@ const w = (e) => {
       )) : n.push(
         v(l, { parent: s, index: i })
       );
-    } else u && o.pullMatch(u).element && n.push(S(u));
+    } else u && o.pullMatch(u).element && n.push(x(u));
   }
   o.remaining().forEach(({ element: u }) => {
-    n.push(S(u));
+    n.push(x(u));
   });
   const d = h.reduce(
     (u, { source: l, target: p }) => u.concat(
@@ -761,7 +778,7 @@ const w = (e) => {
     ),
     []
   );
-  return n.concat(d).sort(Kt);
+  return n.concat(d).sort(Vt);
 }, Xt = (e, t) => {
   const s = e.length, n = t.length;
   return s > n ? s : n;
@@ -848,7 +865,7 @@ class le {
     });
   }
   eventName(t) {
-    return `${A}:${t}`;
+    return `${S}:${t}`;
   }
 }
 const de = (e) => e, ge = ({
@@ -858,20 +875,20 @@ const de = (e) => e, ge = ({
 }) => (s = s || [], t = t || de, (n) => new le({ Template: e, viewModel: t, subscriptions: s, attributes: n })), ye = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   createRouteState: F,
-  events: _t,
-  extractQueryParams: L,
+  events: wt,
+  extractQueryParams: z,
   findHref: T,
   navigate: D,
-  onLinkClick: z,
-  onLocationChange: P,
-  start: wt
+  onLinkClick: U,
+  onLocationChange: L,
+  start: _t
 }, Symbol.toStringTag, { value: "Module" }));
 export {
   ve as JaxsTypes,
   pe as appBuilding,
   ge as bind,
   fe as createApp,
-  xt as jsx,
+  At as jsx,
   me as messageBus,
   ye as navigation,
   be as state

package/dist/jaxs.umd.cjs

@@ -1 +1 @@
-(function(m,b){typeof exports=="object"&&typeof module<"u"?b(exports):typeof define=="function"&&define.amd?define(["exports"],b):(m=typeof globalThis<"u"?globalThis:m||self,b(m.jaxs={}))})(this,function(m){"use strict";const b=(e,t)=>t.createElement(e),nt=(e,t)=>{for(const s in t){if(s==="__self")continue;const n=t[s].toString();s==="value"?e.value=n:e.setAttribute(s,n)}},rt=(e,t,s)=>{const n={};for(const r in t){const o=t[r],c=h=>s(o,h);e.addEventListener(r,c),n[r]={domEvent:r,busEvent:o,listener:c}}e.eventMaps=n},ot=(e,t,s,n)=>{const r=b(e,n.document);return nt(r,t),rt(r,s,n.publish),r},w="http://www.w3.org/2000/svg",it=e=>e==="svg",at=(e,t,s)=>{const n=s.createElementNS(w,e);for(const r in t)r==="__self"||r==="xmlns"||n.setAttributeNS(null,r,t[r].toString());return n},ct=e=>e.namespaceURI===w,ut=(e,t)=>t.createTextNode(e);class ht{constructor(t){this.value=t.toString(),this.isSvg=!1}render(t){const s=ut(this.value,t.document);return s.__jsx="TextNode",[s]}}const lt=e=>typeof e=="string"||typeof e=="number",dt=e=>new ht(e),pt=e=>lt(e)?dt(e):e,mt=e=>t=>(t&&(t.isSvg=t.isSvg||e),t),bt=(e,t)=>ft(e).map(pt).flat().map(mt(t)),ft=e=>Array.isArray(e)?e.flat():e?[e]:[],N=(e,t={})=>e||t.children||[],vt=(e,t="")=>{const s={},n={};for(const r in e){const o=e[r];if(r.match(/^on.+/i)){const c=r.slice(2).toLowerCase();n[c]=o?o.toString():""}else{if(o===!1)continue;r==="__source"?s.__source=e.__source:s[r]=gt(r,o,t)}}return{attributes:s,events:n}},gt=(e,t,s="")=>t==null?s:t.toString(),yt=(e,t)=>{const s=e||{},n=N(t,s);return s.children=s.children||n,s},j=(e,t,s=[])=>e.reduce(Et(t),s).flat(),Et=e=>(t,s)=>s?Array.isArray(s)?j(s,e,t):(s.render(e).forEach(n=>t.push(n)),t):t;class k{constructor(t,s=!1){this.collection=bt(t,s),this.isSvg=s}render(t,s){this.parentElement=s;const n=this.generateDom(t);return this.attachToParent(n),n}generateDom(t){return j(this.collection,t)}attachToParent(t){if(this.parentElement===void 0)return;const s=this.parentElement;t.forEach(n=>s.appendChild(n))}}class At{constructor(t,s){this.type=t,this.attributes=s}generate(){return this.attributes.key||this.sourceKey()||this.createKeyFromAttributes()}sourceKey(){if(this.attributes.__source){const{fileName:t,lineNumber:s,columnNumber:n}=this.attributes.__source;return`${t}:${s}:${n}`}}createKeyFromAttributes(){const t=this.attributes.id?`#${this.attributes.id}`:"",s=this.attributes.type?`[type=${this.attributes.type}]`:"",n=this.attributes.name?`[name=${this.attributes.name}]`:"";return`${this.type}${t}${s}${n}`}}class St{constructor(t,s,n=[],r=!1){this.type=t;const{events:o,attributes:c}=vt(s);this.events=o,this.attributes=c,this.isSvg=r||it(this.type),this.children=new k(n,this.isSvg)}render(t){const s=this.generateDom(t);return s?(this.children.render(t,s),[s]):[]}generateDom(t){return this.isSvg?this.generateSvgDom(t):this.generateHtmlDom(t)}generateHtmlDom(t){const s=ot(this.type,this.attributes,this.events,t);return s.__jsx=this.jsxKey(),s}generateSvgDom(t){const s=at(this.type,this.attributes,t.document);return s.__jsx=this.jsxKey(),s}jsxKey(){return new At(this.type,this.attributes).generate()}}const O=(e,t,...s)=>typeof e=="string"?new St(e,t,s):e(yt(t,s));O.fragment=(e,t)=>{const s=N(t,e);return new k(s)};class xt{constructor(t,s,n){this.template=t,this.selector=s,this.renderKit=n,this.dom=[]}renderAndAttach(t){this.parentElement=this.getParentElement(),this.dom=this.render({...t,parent:this.parentElement}),this.parentElement&&this.attach()}render(t){return this.template.render(t)}attach(){this.parentElement&&(this.parentElement.innerHTML=""),this.dom.forEach(t=>{this.parentElement&&this.parentElement.appendChild(t)})}getParentElement(){return this.renderKit.document.querySelector(this.selector)}}const _t=(e,t,s)=>{const n=new xt(e,t,s);return n.renderAndAttach(s),n},$="go-to-href",f="navigation:location-change",M="navigation:route-change",wt=Object.freeze(Object.defineProperty({__proto__:null,linkNavigationEvent:$,locationChangeEvent:f,routeChangeEvent:M},Symbol.toStringTag,{value:"Module"})),T=e=>{e.createRecord("route",{host:"",path:"",query:{}})},F=e=>{const t=e.closest("[href]");return t&&t.getAttribute("href")||""},D=(e,{publish:t,window:s})=>{s.history.pushState(null,"",e),t(f,null)},z=(e,t)=>{if(!e||!e.target)return;e.preventDefault();const s=F(e.target);D(s,t)},L=e=>e.replace(/^\?/,"").split("&").reduce((t,s)=>{if(!s)return t;const n=s.split("=");return t[n[0]]=n[1],t},{}),P=(e,t)=>{const{state:s,publish:n,window:r}=t,{host:o,pathname:c,search:h}=r.location,i=c,d=L(h),u={host:o,path:i,query:d};s.store("route").update(u),n(M,u)},U=e=>{const{subscribe:t}=e;t($,z)},B=e=>{const{publish:t,subscribe:s,state:n,window:r}=e;T(n),r.addEventListener("popstate",()=>t(f,null)),s(f,P)},K=e=>{setTimeout(()=>e.publish(f,null),0)},V=e=>{B(e),U(e),K(e)},Nt=Object.freeze(Object.defineProperty({__proto__:null,publishLocation:K,startNavigation:V,subscribeToHistoryChange:B,subscribeToNavigation:U},Symbol.toStringTag,{value:"Module"}));class R{constructor({window:t,document:s,publish:n,subscribe:r,bus:o,state:c,renderKit:h}){this.window=t,this.document=s,this.publish=n,this.subscribe=r,this.bus=o,this.state=c,this.renderKit=h,this.roots=[]}render(t,s){const n=_t(t,s,this.renderKit);return this.roots.push(n),n}startNavigation(){V(this)}}const jt=Object.freeze(Object.defineProperty({__proto__:null,App:R},Symbol.toStringTag,{value:"Module"}));class J{constructor(){this.lookup={}}add(t,s,n){this.ensureArrayFor(t);const r={listener:s,index:n,matcher:t};return this.lookup[t].push(r),()=>this.remove(r)}remove(t){this.lookup[t.matcher]&&(this.lookup[t.matcher]=this.lookup[t.matcher].reduce((s,n)=>(n!==t&&s.push(n),s),[]))}matches(t){return this.lookup[t]||[]}ensureArrayFor(t){this.lookup[t]||(this.lookup[t]=[])}}class q{constructor(){this.lookup=[]}add(t,s,n){const r={listener:s,index:n,matcher:t};return this.lookup.push(r),()=>this.remove(r)}remove(t){this.lookup=this.lookup.reduce((s,n)=>(n!==t&&s.push(n),s),[])}matches(t){return this.lookup.filter(s=>s.matcher.test(t))}}class H{constructor(){this.exactSubscriptions=new J,this.fuzzySubscriptions=new q,this.currentIndex=0}subscribe(t,s){let n;return typeof t=="string"?n=this.exactSubscriptions.add(t,s,this.currentIndex):n=this.fuzzySubscriptions.add(t,s,this.currentIndex),this.currentIndex+=1,n}publish(t,s){[...this.exactSubscriptions.matches(t),...this.fuzzySubscriptions.matches(t)].sort((r,o)=>r.index-o.index).forEach(r=>{r.listener(s,this.listenerOptions(t))})}addListenerOptions(t){this.options=t}listenerOptions(t){return{eventName:t,...this.options,publish:this.publish.bind(this)}}}const I=()=>{const e=new H;return{bus:e,publish:(n,r)=>e.publish(n,r),subscribe:(n,r)=>e.subscribe(n,r)}},kt=Object.freeze(Object.defineProperty({__proto__:null,ExactSubscriptions:J,FuzzySubscriptions:q,JaxsBus:H,createBus:I},Symbol.toStringTag,{value:"Module"})),g=e=>Array.isArray(e),y=e=>e!==null&&!g(e)&&typeof e=="object",Ot=(e,t)=>e===t,$t=(e,t)=>Object.keys(e).length===Object.keys(t).length,Mt=(e,t)=>!(y(e)&&y(t))||!$t(e,t)?!1:Object.keys(e).every(s=>{const n=e[s],r=t[s];return E(n,r)}),Tt=(e,t)=>!(g(e)&&g(t))||e.length!==t.length?!1:e.every((s,n)=>{const r=t[n];return E(s,r)}),E=(e,t)=>y(e)?Mt(e,t):g(e)?Tt(e,t):Ot(e,t);class v{constructor(t){this.store=t}update(t){this.store.update(t)}reset(){this.store.update(this.store.initialState)}get value(){return this.store.value}addUpdaterFunction(t,s){this.constructor.prototype[t]=(...n)=>{const r=s(this.value,...n);this.update(r)}}addUpdaterFunctions(t){for(const s in t)this.addUpdaterFunction(s,t[s])}}class A extends v{push(t){const s=[...this.value,t];this.update(s)}pop(){const t=[...this.value],s=t.pop();return this.update(t),s}unshift(t){const s=[t,...this.value];this.update(s)}shift(){const t=[...this.value],s=t.shift();return this.update(t),s}addSorter(t,s){this[t]=()=>{this.sortBy(s)}}sortBy(t){const s=[...this.value];s.sort(t),this.update(s)}insertAt(t,s){const n=[...this.value];n.splice(t,0,s),this.update(n)}}class S{constructor(t){this.name=t.name,this.parent=t.parent,this._value=t.value,this.initialState=structuredClone(t.value),this.updater=new v(this)}get value(){return this._value}set value(t){throw new Error("Cannot set value directly. Use an updater!")}update(t){if(typeof t=="function"){const s=this.getUpdatedValue(t);this.updateValue(s)}else this.updateValue(t)}updateValue(t){E(this._value,t)||(this._value=t,this.parent.notify(this.name))}getUpdatedValue(t){return t(this.value)}addUpdaters(t){this.updater.addUpdaterFunctions(t)}addUpdater(t,s){this.updater.addUpdaterFunction(t,s)}addSorter(t,s){this.updater instanceof A&&this.updater.addSorter(t,s)}}class Q extends v{toggle(){const t=!this.value;this.update(t)}setTrue(){this.update(!0)}setFalse(){this.update(!1)}}class W extends v{updateAttribute(t,s){const n={...this.value};n[t]=s,this.update(n)}}const x="state";class G{constructor(t){this.publisher=t,this.stores={},this.eventNamePrefix=x,this.notifications=new Set,this.inTransaction=!1}create(t,s){const n=new S({name:t,parent:this,value:s});return this.stores[t]=n,n}createBoolean(t,s){const n=this.create(t,s);return n.updater=new Q(n),n}createRecord(t,s){const n=this.create(t,s);return n.updater=new W(n),n}createList(t,s){const n=this.create(t,s);return n.updater=new A(n),n}store(t){return this.stores[t]||new S({name:t,parent:this,value:void 0})}get(t){return this.store(t).value}getAll(t){return t.reduce((s,n)=>(s[n]=this.get(n),s),{})}notify(t){this.inTransaction?this.notifications.add(t):this.publish(t)}update(t,s){this.store(t).update(s)}transaction(t){this.inTransaction=!0,t(this.stores),this.inTransaction=!1,this.publishAll()}publishAll(){this.notifications.forEach(t=>{this.publish(t)}),this.notifications.clear()}publish(t){this.publisher(this.event(t),{state:this,store:this.store(t)})}event(t){return`${this.eventNamePrefix}:${t}`}}const X=e=>new G(e),Ft=Object.freeze(Object.defineProperty({__proto__:null,BooleanUpdater:Q,JaxsState:G,JaxsStore:S,JaxsStoreUpdater:v,ListUpdater:A,ObjectUpdater:W,createState:X,eventName:x},Symbol.toStringTag,{value:"Module"}));class Dt{constructor(t){this.setupDomEnvironment(t)}setup(){return this.setupBus(),this.setupState(),this.addBusOptions(),this.setRenderKit(),new R({window:this.window,document:this.document,publish:this.publish,subscribe:this.subscribe,bus:this.bus,state:this.state,renderKit:this.renderKit})}setupDomEnvironment(t){t.window?(this.window=t.window,this.document=this.window.document):t.document?(this.window=t.document.defaultView,this.document=t.document):(this.window=window,this.document=document)}setupBus(){const{publish:t,subscribe:s,bus:n}=I();this.publish=t,this.subscribe=s,this.bus=n}setupState(){this.state=X(this.publish)}addBusOptions(){this.bus.addListenerOptions({state:this.state,document:this.document,window:this.window})}setRenderKit(){this.renderKit={publish:this.publish,subscribe:this.subscribe,state:this.state,document:this.document,window:this.window}}}const zt=(e={})=>{const s=new Dt(e).setup();return s.startNavigation(),s};var a=(e=>(e[e.removeNode=0]="removeNode",e[e.insertNode=1]="insertNode",e[e.replaceNode=2]="replaceNode",e[e.removeAttribute=3]="removeAttribute",e[e.addAttribute=4]="addAttribute",e[e.updateAttribute=5]="updateAttribute",e[e.removeEvent=6]="removeEvent",e[e.addEvent=7]="addEvent",e[e.updateEvent=8]="updateEvent",e[e.changeValue=9]="changeValue",e[e.changeText=10]="changeText",e))(a||{});const Lt=Object.freeze(Object.defineProperty({__proto__:null,ChangeInstructionTypes:a},Symbol.toStringTag,{value:"Module"})),Pt=(e,t)=>({source:e,target:t,type:a.changeText,data:{}}),Ut=(e,t)=>({source:e,target:t,type:a.replaceNode,data:{}}),Bt=(e,t,s)=>({source:e,target:t,data:s,type:a.removeAttribute}),Kt=(e,t,s)=>({source:e,target:t,data:s,type:a.addAttribute}),Vt=(e,t,s)=>({source:e,target:t,data:s,type:a.updateAttribute}),Rt=(e,t,s)=>({source:e,target:t,data:s,type:a.removeEvent}),Jt=(e,t,s)=>({source:e,target:t,data:s,type:a.addEvent}),qt=(e,t,s)=>({source:e,target:t,data:s,type:a.updateEvent}),Y=e=>({source:e,target:e,type:a.removeNode,data:{}}),_=(e,t)=>({target:e,source:e,type:a.insertNode,data:t}),Ht=(e,t,s)=>({source:e,target:t,type:a.changeValue,data:s}),It=(e,t)=>e.type>t.type?1:e.type<t.type?-1:0,Z={index:-1};class Qt{constructor(){this.map={}}populate(t){t.forEach((s,n)=>{const r=s.__jsx;r&&(this.map[r]=this.map[r]||[],this.map[r].push({element:s,index:n}))})}pullMatch(t){const s=t&&t.__jsx;return!s||!(this.map[s]&&this.map[s].length)?Z:this.map[s].shift()}clear(t){const s=t&&t.__jsx;if(!(s&&this.map[s]&&this.map[s].length))return;const n=this.map[s];this.map[s]=n.reduce((r,o)=>(o.element!==t&&r.push(o),r),[])}check(t){const s=t&&t.__jsx;return s&&this.map[s]?this.map[s].length>0:!1}remaining(){return Object.values(this.map).flat()}}const C=e=>{const t=new Qt;return t.populate(e),t},tt=(e,t,s=!1)=>{const n=[],r=e.attributes,o=r.length,c=t.attributes,h=c.length;let i,d,u;for(i=0;i<o;i++){u=null;const l=r.item(i);if(l){for(d=0;d<h;d++){const p=c.item(d);if(p&&l.name==p.name){u=p;break}}u?l.value!==u.value&&n.push(Vt(e,t,{name:l.name,value:u.value,isSvg:s})):n.push(Bt(e,t,{name:l.name,isSvg:s}))}}for(i=0;i<h;i++){u=null;const l=c.item(i);if(l){for(d=0;d<o;d++){const p=r.item(d);if(p&&p.name==l.name){u=p;break}}u||n.push(Kt(e,t,{name:l.name,value:l.value,isSvg:s}))}}return n},Wt=(e,t)=>{const s=[],n=e.eventMaps,r=t.eventMaps,o=Object.keys(n),c=Object.keys(r);return o.forEach(h=>{const i=n[h],d=r[h];d?d.busEvent!==i.busEvent&&s.push(qt(e,t,{name:h,targetValue:d.listener,sourceValue:i.listener})):s.push(Rt(e,t,{name:i.domEvent,value:i.listener}))}),c.forEach(h=>{const i=n[h],d=r[h];i||s.push(Jt(e,t,{name:d.domEvent,value:d.listener}))}),s},Gt=e=>e.tagName!=="INPUT",Xt=(e,t)=>e.value===t.value,Yt=(e,t)=>{if(Gt(e)||Xt(e,t))return[];const s=e,n=t;return[Ht(s,n,{name:"value",value:n.value})]},Zt=(e,t)=>{const s=tt(e,t),n=Wt(e,t),r=Yt(e,t);return s.concat(n).concat(r)},Ct=(e,t)=>tt(e,t,!0),te=(e,t)=>e.textContent!==t.textContent?[Pt(e,t)]:[],ee=(e,t,s)=>{let n=[];if(e.nodeType===1&&ct(e)){const r=e,o=t,c=Ct(r,o),h=s(r.childNodes,o.childNodes,r);n=c.concat(h)}else if(e.nodeType===1){const r=e,o=t,c=Zt(r,o),h=s(r.childNodes,o.childNodes,r);n=c.concat(h)}else e.nodeType===3&&(n=te(e,t));return n},et=(e,t,s)=>{const n=[],r=se(e,t),o=C(e),c=C(t),h=[];let i=0;for(;i<r;i++){const u=e[i],l=t[i];if(l&&c.check(l)){const p=o.pullMatch(l);c.clear(l),p.element?(p.index!==i&&n.push(_(p.element,{parent:s,index:i})),h.push({source:p.element,target:l})):u?c.check(u)?n.push(_(l,{parent:s,index:i})):(o.clear(u),n.push(Ut(u,l))):n.push(_(l,{parent:s,index:i}))}else u&&o.pullMatch(u).element&&n.push(Y(u))}o.remaining().forEach(({element:u})=>{n.push(Y(u))});const d=h.reduce((u,{source:l,target:p})=>u.concat(ee(l,p,et)),[]);return n.concat(d).sort(It)},se=(e,t)=>{const s=e.length,n=t.length;return s>n?s:n},ne=(e,t,s)=>{et(e,t,s).forEach(r=>{re(r)})},re=e=>{(fe[e.type]||oe)(e)},oe=e=>{},ie=e=>{const{source:t,target:s}=e;t.nodeValue=s.textContent},ae=e=>{const{source:t}=e;t.remove()},ce=e=>{const{target:t,data:s}=e,{parent:n,index:r}=s,o=n.childNodes[r];o?o&&o!==t&&n.insertBefore(t,o):n.appendChild(t)},ue=e=>{const{source:t,target:s}=e;t.replaceWith(s)},he=e=>{const{source:t,data:s}=e,{name:n,isSvg:r}=s;r?t.removeAttributeNS(null,n):t.removeAttribute(n)},st=e=>{const{source:t,data:s}=e,{name:n,value:r,isSvg:o}=s;o?t.setAttributeNS(null,n,r):t.setAttribute(n,r)},le=e=>{st(e)},de=e=>{const t=e.data,s=e.source,{name:n,value:r}=t;s.removeEventListener(n,r)},pe=e=>{const t=e.data,s=e.source,{name:n,value:r}=t;s.addEventListener(n,r)},me=e=>{const t=e.data,s=e.source,{name:n,sourceValue:r,targetValue:o}=t;s.removeEventListener(n,r),s.addEventListener(n,o)},be=e=>{const t=e.data,s=e.source,{value:n}=t;s.value=n},fe={[a.changeText]:ie,[a.removeNode]:ae,[a.insertNode]:ce,[a.replaceNode]:ue,[a.removeAttribute]:he,[a.addAttribute]:st,[a.updateAttribute]:le,[a.removeEvent]:de,[a.addEvent]:pe,[a.updateEvent]:me,[a.changeValue]:be};class ve{constructor({Template:t,subscriptions:s,attributes:n,viewModel:r}){this.Template=t,this.viewModel=r,this.attributes=n,this.subscriptions=s,this.dom=[],this.parentElement=null}render(t){return this.parentElement=t.parent,this.renderKit=t,this.subscribeForRerender(),this.dom=this.generateDom(t),this.dom}generateDom(t){const s={...this.attributes,...this.viewModel(t.state.getAll(this.subscriptions))},n=this.Template(s);return n?n.render(t):[]}rerender(){if(!this.parentElement&&this.dom[0]){const s=this.dom[0].parentElement;this.parentElement=s}const t=this.generateDom(this.renderKit);ne(this.dom,t,this.parentElement),this.parentElement&&(this.dom=Array.from(this.parentElement.childNodes))}subscribeForRerender(){const{subscribe:t}=this.renderKit;this.subscriptions.forEach(s=>{t(this.eventName(s),()=>this.rerender())})}eventName(t){return`${x}:${t}`}}const ge=e=>e,ye=({Template:e,viewModel:t,subscriptions:s})=>(s=s||[],t=t||ge,n=>new ve({Template:e,viewModel:t,subscriptions:s,attributes:n})),Ee=Object.freeze(Object.defineProperty({__proto__:null,createRouteState:T,events:wt,extractQueryParams:L,findHref:F,navigate:D,onLinkClick:z,onLocationChange:P,start:Nt},Symbol.toStringTag,{value:"Module"}));m.JaxsTypes=Lt,m.appBuilding=jt,m.bind=ye,m.createApp=zt,m.jsx=O,m.messageBus=kt,m.navigation=Ee,m.state=Ft,Object.defineProperty(m,Symbol.toStringTag,{value:"Module"})});
+(function(m,b){typeof exports=="object"&&typeof module<"u"?b(exports):typeof define=="function"&&define.amd?define(["exports"],b):(m=typeof globalThis<"u"?globalThis:m||self,b(m.jaxs={}))})(this,function(m){"use strict";const b=(e,t)=>t.createElement(e),nt=(e,t)=>{for(const s in t){if(s==="__self")continue;const n=t[s].toString();s==="value"?e.value=n:e.setAttribute(s,n)}},rt=(e,t,s)=>{const n={};for(const r in t){const o=t[r],c=h=>s(o,h);e.addEventListener(r,c),n[r]={domEvent:r,busEvent:o,listener:c}}e.eventMaps=n},ot=(e,t,s,n)=>{const r=b(e,n.document);return nt(r,t),rt(r,s,n.publish),r},x="http://www.w3.org/2000/svg",it=e=>e==="svg",at=(e,t,s)=>{const n=s.createElementNS(x,e);for(const r in t)r==="__self"||r==="xmlns"||n.setAttributeNS(null,r,t[r].toString());return n},ct=e=>e.namespaceURI===x,ut=(e,t)=>t.createTextNode(e);class ht{constructor(t){this.value=t.toString(),this.isSvg=!1}render(t){const s=ut(this.value,t.document);return s.__jsx="TextNode",[s]}}const lt=e=>typeof e=="string"||typeof e=="number",dt=e=>new ht(e),pt=e=>lt(e)?dt(e):e,mt=e=>t=>(t&&(t.isSvg=t.isSvg||e),t),bt=(e,t)=>ft(e).map(pt).flat().map(mt(t)),ft=e=>Array.isArray(e)?e.flat():e?[e]:[],N=(e,t={})=>e||t.children||[],vt=(e,t="")=>{const s={},n={};for(const r in e){const o=e[r];if(r.match(/^on.+/i)){const c=r.slice(2).toLowerCase();n[c]=o?o.toString():""}else{if(o===!1)continue;r==="__source"?s.__source=e.__source:s[r]=gt(r,o,t)}}return{attributes:s,events:n}},gt=(e,t,s="")=>t==null?s:t.toString(),yt=(e,t)=>{const s=e||{},n=N(t,s);return s.children=s.children||n,s},j=(e,t,s=[])=>e.reduce(Et(t),s).flat(),Et=e=>(t,s)=>s?Array.isArray(s)?j(s,e,t):(s.render(e).forEach(n=>t.push(n)),t):t;class k{constructor(t,s=!1){this.collection=bt(t,s),this.isSvg=s}render(t,s){this.parentElement=s;const n=this.generateDom(t);return this.attachToParent(n),n}generateDom(t){return j(this.collection,t)}attachToParent(t){if(this.parentElement===void 0)return;const s=this.parentElement;t.forEach(n=>s.appendChild(n))}}class St{constructor(t,s){this.type=t,this.attributes=s}generate(){return this.attributes.key||this.sourceKey()||this.createKeyFromAttributes()}sourceKey(){if(this.attributes.__source){const{fileName:t,lineNumber:s,columnNumber:n}=this.attributes.__source;return`${t}:${s}:${n}`}}createKeyFromAttributes(){const t=this.attributes.id?`#${this.attributes.id}`:"",s=this.attributes.type?`[type=${this.attributes.type}]`:"",n=this.attributes.name?`[name=${this.attributes.name}]`:"";return`${this.type}${t}${s}${n}`}}class At{constructor(t,s,n=[],r=!1){this.type=t;const{events:o,attributes:c}=vt(s);this.events=o,this.attributes=c,this.isSvg=r||it(this.type),this.children=new k(n,this.isSvg)}render(t){const s=this.generateDom(t);return s?(this.children.render(t,s),[s]):[]}generateDom(t){return this.isSvg?this.generateSvgDom(t):this.generateHtmlDom(t)}generateHtmlDom(t){const s=ot(this.type,this.attributes,this.events,t);return s.__jsx=this.jsxKey(),s}generateSvgDom(t){const s=at(this.type,this.attributes,t.document);return s.__jsx=this.jsxKey(),s}jsxKey(){return new St(this.type,this.attributes).generate()}}const O=(e,t,...s)=>typeof e=="string"?new At(e,t,s):e(yt(t,s));O.fragment=(e,t)=>{const s=N(t,e);return new k(s)};class wt{constructor(t,s,n){this.template=t,this.selector=s,this.renderKit=n,this.dom=[]}renderAndAttach(t){this.parentElement=this.getParentElement(),this.dom=this.render({...t,parent:this.parentElement}),this.parentElement&&this.attach()}render(t){return this.template.render(t)}attach(){this.parentElement&&(this.parentElement.innerHTML=""),this.dom.forEach(t=>{this.parentElement&&this.parentElement.appendChild(t)})}getParentElement(){return this.renderKit.document.querySelector(this.selector)}}const _t=(e,t,s)=>{const n=new wt(e,t,s);return n.renderAndAttach(s),n},T="go-to-href",f="navigation:location-change",$="navigation:route-change",xt=Object.freeze(Object.defineProperty({__proto__:null,linkNavigationEvent:T,locationChangeEvent:f,routeChangeEvent:$},Symbol.toStringTag,{value:"Module"})),M=e=>{e.createRecord("route",{host:"",path:"",query:{}})},F=e=>{const t=e.closest("[href]");return t&&t.getAttribute("href")||""},D=(e,{publish:t,window:s})=>{s.history.pushState(null,"",e),t(f,null)},U=(e,t)=>{if(!e||!e.target)return;e.preventDefault();const s=F(e.target);D(s,t)},z=e=>e.replace(/^\?/,"").split("&").reduce((t,s)=>{if(!s)return t;const n=s.split("=");return t[n[0]]=n[1],t},{}),L=(e,t)=>{const{state:s,publish:n,window:r}=t,{host:o,pathname:c,search:h}=r.location,i=c,d=z(h),u={host:o,path:i,query:d};s.store("route").update(u),n($,u)},P=e=>{const{subscribe:t}=e;t(T,U)},B=e=>{const{publish:t,subscribe:s,state:n,window:r}=e;M(n),r.addEventListener("popstate",()=>t(f,null)),s(f,L)},V=e=>{setTimeout(()=>e.publish(f,null),0)},K=e=>{B(e),P(e),V(e)},Nt=Object.freeze(Object.defineProperty({__proto__:null,publishLocation:V,startNavigation:K,subscribeToHistoryChange:B,subscribeToNavigation:P},Symbol.toStringTag,{value:"Module"}));class R{constructor({window:t,document:s,publish:n,subscribe:r,bus:o,state:c,renderKit:h}){this.window=t,this.document=s,this.publish=n,this.subscribe=r,this.bus=o,this.state=c,this.renderKit=h,this.roots=[]}render(t,s){const n=_t(t,s,this.renderKit);return this.roots.push(n),n}startNavigation(){K(this)}}const jt=Object.freeze(Object.defineProperty({__proto__:null,App:R},Symbol.toStringTag,{value:"Module"}));class q{constructor(){this.lookup={}}add(t,s,n){this.ensureArrayFor(t);const r={listener:s,index:n,matcher:t};return this.lookup[t].push(r),()=>this.remove(r)}remove(t){this.lookup[t.matcher]&&(this.lookup[t.matcher]=this.lookup[t.matcher].reduce((s,n)=>(n!==t&&s.push(n),s),[]))}matches(t){return this.lookup[t]||[]}ensureArrayFor(t){this.lookup[t]||(this.lookup[t]=[])}}class J{constructor(){this.lookup=[]}add(t,s,n){const r={listener:s,index:n,matcher:t};return this.lookup.push(r),()=>this.remove(r)}remove(t){this.lookup=this.lookup.reduce((s,n)=>(n!==t&&s.push(n),s),[])}matches(t){return this.lookup.filter(s=>s.matcher.test(t))}}class H{constructor(){this.exactSubscriptions=new q,this.fuzzySubscriptions=new J,this.currentIndex=0}subscribe(t,s){let n;return typeof t=="string"?n=this.exactSubscriptions.add(t,s,this.currentIndex):n=this.fuzzySubscriptions.add(t,s,this.currentIndex),this.currentIndex+=1,n}publish(t,s){[...this.exactSubscriptions.matches(t),...this.fuzzySubscriptions.matches(t)].sort((r,o)=>r.index-o.index).forEach(r=>{r.listener(s,this.listenerOptions(t))})}addListenerOptions(t){this.options=t}listenerOptions(t){return{eventName:t,...this.options,publish:this.publish.bind(this)}}}const I=()=>{const e=new H;return{bus:e,publish:(n,r)=>e.publish(n,r),subscribe:(n,r)=>e.subscribe(n,r)}},kt=Object.freeze(Object.defineProperty({__proto__:null,ExactSubscriptions:q,FuzzySubscriptions:J,JaxsBus:H,createBus:I},Symbol.toStringTag,{value:"Module"})),v=e=>Array.isArray(e),y=e=>e!==null&&!v(e)&&typeof e=="object",Ot=(e,t)=>e===t,Tt=(e,t)=>Object.keys(e).length===Object.keys(t).length,$t=(e,t)=>!(y(e)&&y(t))||!Tt(e,t)?!1:Object.keys(e).every(s=>{const n=e[s],r=t[s];return E(n,r)}),Mt=(e,t)=>!(v(e)&&v(t))||e.length!==t.length?!1:e.every((s,n)=>{const r=t[n];return E(s,r)}),E=(e,t)=>y(e)?$t(e,t):v(e)?Mt(e,t):Ot(e,t);class g{constructor(t){this.store=t}update(t){this.store.update(t)}reset(){this.store.update(this.store.initialState)}get value(){return this.store.value}addUpdaterFunction(t,s){this.constructor.prototype[t]=(...n)=>{const r=s(this.value,...n);this.update(r)}}addUpdaterFunctions(t){for(const s in t)this.addUpdaterFunction(s,t[s])}}class S extends g{addUpdaterFunction(t,s){this.constructor.prototype[t]=(...n)=>{const r=s(this.value,...n);this.update(r)}}push(t){const s=[...this.value,t];this.update(s)}pop(){const t=[...this.value],s=t.pop();return this.update(t),s}unshift(t){const s=[t,...this.value];this.update(s)}shift(){const t=[...this.value],s=t.shift();return this.update(t),s}addSorter(t,s){this[t]=()=>{this.sortBy(s)}}sortBy(t){const s=[...this.value];s.sort(t),this.update(s)}insertAt(t,s){const n=[...this.value];n.splice(t,0,s),this.update(n)}}class A{constructor(t){this.name=t.name,this.parent=t.parent,this._value=t.value,this.initialState=structuredClone(t.value),this.updater=new g(this)}get value(){return this._value}set value(t){throw new Error("Cannot set value directly. Use an updater!")}update(t){if(typeof t=="function"){const s=this.getUpdatedValue(t);this.updateValue(s)}else this.updateValue(t)}updateValue(t){E(this._value,t)||(this._value=t,this.parent.notify(this.name))}getUpdatedValue(t){return t(this.value)}addUpdaters(t){this.updater.addUpdaterFunctions(t)}addUpdater(t,s){this.updater.addUpdaterFunction(t,s)}addSorter(t,s){this.updater instanceof S&&this.updater.addSorter(t,s)}}class Q extends g{toggle(){const t=!this.value;this.update(t)}setTrue(){this.update(!0)}setFalse(){this.update(!1)}addUpdaterFunction(t,s){this.constructor.prototype[t]=(...n)=>{const r=s(this.value,...n);this.update(r)}}}class W extends g{addUpdaterFunction(t,s){this.constructor.prototype[t]=(...n)=>{const r=s(this.value,...n);this.update(r)}}updateAttribute(t,s){const n={...this.value};n[t]=s,this.update(n)}}const w="state";class G{constructor(t){this.publisher=t,this.stores={},this.eventNamePrefix=w,this.notifications=new Set,this.inTransaction=!1}create(t,s){const n=new A({name:t,parent:this,value:s});return this.stores[t]=n,n}createBoolean(t,s){const n=this.create(t,s);return n.updater=new Q(n),n}createRecord(t,s){const n=this.create(t,s);return n.updater=new W(n),n}createList(t,s){const n=this.create(t,s);return n.updater=new S(n),n}store(t){return this.stores[t]||new A({name:t,parent:this,value:void 0})}get(t){return this.store(t).value}getAll(t){return t.reduce((s,n)=>(s[n]=this.get(n),s),{})}notify(t){this.inTransaction?this.notifications.add(t):this.publish(t)}update(t,s){this.store(t).update(s)}transaction(t){this.inTransaction=!0,t(this.stores),this.inTransaction=!1,this.publishAll()}publishAll(){this.notifications.forEach(t=>{this.publish(t)}),this.notifications.clear()}publish(t){this.publisher(this.event(t),{state:this,store:this.store(t)})}event(t){return`${this.eventNamePrefix}:${t}`}}const X=e=>new G(e),Ft=Object.freeze(Object.defineProperty({__proto__:null,State:G,Store:A,StoreUpdaterBoolean:Q,StoreUpdaterList:S,StoreUpdaterObject:W,createState:X,eventName:w},Symbol.toStringTag,{value:"Module"}));class Dt{constructor(t){this.setupDomEnvironment(t)}setup(){return this.setupBus(),this.setupState(),this.addBusOptions(),this.setRenderKit(),new R({window:this.window,document:this.document,publish:this.publish,subscribe:this.subscribe,bus:this.bus,state:this.state,renderKit:this.renderKit})}setupDomEnvironment(t){t.window?(this.window=t.window,this.document=this.window.document):t.document?(this.window=t.document.defaultView,this.document=t.document):(this.window=window,this.document=document)}setupBus(){const{publish:t,subscribe:s,bus:n}=I();this.publish=t,this.subscribe=s,this.bus=n}setupState(){this.state=X(this.publish)}addBusOptions(){this.bus.addListenerOptions({state:this.state,document:this.document,window:this.window})}setRenderKit(){this.renderKit={publish:this.publish,subscribe:this.subscribe,state:this.state,document:this.document,window:this.window}}}const Ut=(e={})=>{const s=new Dt(e).setup();return s.startNavigation(),s};var a=(e=>(e[e.removeNode=0]="removeNode",e[e.insertNode=1]="insertNode",e[e.replaceNode=2]="replaceNode",e[e.removeAttribute=3]="removeAttribute",e[e.addAttribute=4]="addAttribute",e[e.updateAttribute=5]="updateAttribute",e[e.removeEvent=6]="removeEvent",e[e.addEvent=7]="addEvent",e[e.updateEvent=8]="updateEvent",e[e.changeValue=9]="changeValue",e[e.changeText=10]="changeText",e))(a||{});const zt=Object.freeze(Object.defineProperty({__proto__:null,ChangeInstructionTypes:a},Symbol.toStringTag,{value:"Module"})),Lt=(e,t)=>({source:e,target:t,type:a.changeText,data:{}}),Pt=(e,t)=>({source:e,target:t,type:a.replaceNode,data:{}}),Bt=(e,t,s)=>({source:e,target:t,data:s,type:a.removeAttribute}),Vt=(e,t,s)=>({source:e,target:t,data:s,type:a.addAttribute}),Kt=(e,t,s)=>({source:e,target:t,data:s,type:a.updateAttribute}),Rt=(e,t,s)=>({source:e,target:t,data:s,type:a.removeEvent}),qt=(e,t,s)=>({source:e,target:t,data:s,type:a.addEvent}),Jt=(e,t,s)=>({source:e,target:t,data:s,type:a.updateEvent}),Y=e=>({source:e,target:e,type:a.removeNode,data:{}}),_=(e,t)=>({target:e,source:e,type:a.insertNode,data:t}),Ht=(e,t,s)=>({source:e,target:t,type:a.changeValue,data:s}),It=(e,t)=>e.type>t.type?1:e.type<t.type?-1:0,Z={index:-1};class Qt{constructor(){this.map={}}populate(t){t.forEach((s,n)=>{const r=s.__jsx;r&&(this.map[r]=this.map[r]||[],this.map[r].push({element:s,index:n}))})}pullMatch(t){const s=t&&t.__jsx;return!s||!(this.map[s]&&this.map[s].length)?Z:this.map[s].shift()}clear(t){const s=t&&t.__jsx;if(!(s&&this.map[s]&&this.map[s].length))return;const n=this.map[s];this.map[s]=n.reduce((r,o)=>(o.element!==t&&r.push(o),r),[])}check(t){const s=t&&t.__jsx;return s&&this.map[s]?this.map[s].length>0:!1}remaining(){return Object.values(this.map).flat()}}const C=e=>{const t=new Qt;return t.populate(e),t},tt=(e,t,s=!1)=>{const n=[],r=e.attributes,o=r.length,c=t.attributes,h=c.length;let i,d,u;for(i=0;i<o;i++){u=null;const l=r.item(i);if(l){for(d=0;d<h;d++){const p=c.item(d);if(p&&l.name==p.name){u=p;break}}u?l.value!==u.value&&n.push(Kt(e,t,{name:l.name,value:u.value,isSvg:s})):n.push(Bt(e,t,{name:l.name,isSvg:s}))}}for(i=0;i<h;i++){u=null;const l=c.item(i);if(l){for(d=0;d<o;d++){const p=r.item(d);if(p&&p.name==l.name){u=p;break}}u||n.push(Vt(e,t,{name:l.name,value:l.value,isSvg:s}))}}return n},Wt=(e,t)=>{const s=[],n=e.eventMaps,r=t.eventMaps,o=Object.keys(n),c=Object.keys(r);return o.forEach(h=>{const i=n[h],d=r[h];d?d.busEvent!==i.busEvent&&s.push(Jt(e,t,{name:h,targetValue:d.listener,sourceValue:i.listener})):s.push(Rt(e,t,{name:i.domEvent,value:i.listener}))}),c.forEach(h=>{const i=n[h],d=r[h];i||s.push(qt(e,t,{name:d.domEvent,value:d.listener}))}),s},Gt=e=>e.tagName!=="INPUT",Xt=(e,t)=>e.value===t.value,Yt=(e,t)=>{if(Gt(e)||Xt(e,t))return[];const s=e,n=t;return[Ht(s,n,{name:"value",value:n.value})]},Zt=(e,t)=>{const s=tt(e,t),n=Wt(e,t),r=Yt(e,t);return s.concat(n).concat(r)},Ct=(e,t)=>tt(e,t,!0),te=(e,t)=>e.textContent!==t.textContent?[Lt(e,t)]:[],ee=(e,t,s)=>{let n=[];if(e.nodeType===1&&ct(e)){const r=e,o=t,c=Ct(r,o),h=s(r.childNodes,o.childNodes,r);n=c.concat(h)}else if(e.nodeType===1){const r=e,o=t,c=Zt(r,o),h=s(r.childNodes,o.childNodes,r);n=c.concat(h)}else e.nodeType===3&&(n=te(e,t));return n},et=(e,t,s)=>{const n=[],r=se(e,t),o=C(e),c=C(t),h=[];let i=0;for(;i<r;i++){const u=e[i],l=t[i];if(l&&c.check(l)){const p=o.pullMatch(l);c.clear(l),p.element?(p.index!==i&&n.push(_(p.element,{parent:s,index:i})),h.push({source:p.element,target:l})):u?c.check(u)?n.push(_(l,{parent:s,index:i})):(o.clear(u),n.push(Pt(u,l))):n.push(_(l,{parent:s,index:i}))}else u&&o.pullMatch(u).element&&n.push(Y(u))}o.remaining().forEach(({element:u})=>{n.push(Y(u))});const d=h.reduce((u,{source:l,target:p})=>u.concat(ee(l,p,et)),[]);return n.concat(d).sort(It)},se=(e,t)=>{const s=e.length,n=t.length;return s>n?s:n},ne=(e,t,s)=>{et(e,t,s).forEach(r=>{re(r)})},re=e=>{(fe[e.type]||oe)(e)},oe=e=>{},ie=e=>{const{source:t,target:s}=e;t.nodeValue=s.textContent},ae=e=>{const{source:t}=e;t.remove()},ce=e=>{const{target:t,data:s}=e,{parent:n,index:r}=s,o=n.childNodes[r];o?o&&o!==t&&n.insertBefore(t,o):n.appendChild(t)},ue=e=>{const{source:t,target:s}=e;t.replaceWith(s)},he=e=>{const{source:t,data:s}=e,{name:n,isSvg:r}=s;r?t.removeAttributeNS(null,n):t.removeAttribute(n)},st=e=>{const{source:t,data:s}=e,{name:n,value:r,isSvg:o}=s;o?t.setAttributeNS(null,n,r):t.setAttribute(n,r)},le=e=>{st(e)},de=e=>{const t=e.data,s=e.source,{name:n,value:r}=t;s.removeEventListener(n,r)},pe=e=>{const t=e.data,s=e.source,{name:n,value:r}=t;s.addEventListener(n,r)},me=e=>{const t=e.data,s=e.source,{name:n,sourceValue:r,targetValue:o}=t;s.removeEventListener(n,r),s.addEventListener(n,o)},be=e=>{const t=e.data,s=e.source,{value:n}=t;s.value=n},fe={[a.changeText]:ie,[a.removeNode]:ae,[a.insertNode]:ce,[a.replaceNode]:ue,[a.removeAttribute]:he,[a.addAttribute]:st,[a.updateAttribute]:le,[a.removeEvent]:de,[a.addEvent]:pe,[a.updateEvent]:me,[a.changeValue]:be};class ve{constructor({Template:t,subscriptions:s,attributes:n,viewModel:r}){this.Template=t,this.viewModel=r,this.attributes=n,this.subscriptions=s,this.dom=[],this.parentElement=null}render(t){return this.parentElement=t.parent,this.renderKit=t,this.subscribeForRerender(),this.dom=this.generateDom(t),this.dom}generateDom(t){const s={...this.attributes,...this.viewModel(t.state.getAll(this.subscriptions))},n=this.Template(s);return n?n.render(t):[]}rerender(){if(!this.parentElement&&this.dom[0]){const s=this.dom[0].parentElement;this.parentElement=s}const t=this.generateDom(this.renderKit);ne(this.dom,t,this.parentElement),this.parentElement&&(this.dom=Array.from(this.parentElement.childNodes))}subscribeForRerender(){const{subscribe:t}=this.renderKit;this.subscriptions.forEach(s=>{t(this.eventName(s),()=>this.rerender())})}eventName(t){return`${w}:${t}`}}const ge=e=>e,ye=({Template:e,viewModel:t,subscriptions:s})=>(s=s||[],t=t||ge,n=>new ve({Template:e,viewModel:t,subscriptions:s,attributes:n})),Ee=Object.freeze(Object.defineProperty({__proto__:null,createRouteState:M,events:xt,extractQueryParams:z,findHref:F,navigate:D,onLinkClick:U,onLocationChange:L,start:Nt},Symbol.toStringTag,{value:"Module"}));m.JaxsTypes=zt,m.appBuilding=jt,m.bind=ye,m.createApp=Ut,m.jsx=O,m.messageBus=kt,m.navigation=Ee,m.state=Ft,Object.defineProperty(m,Symbol.toStringTag,{value:"Module"})});

package/package.json

@@ -2,7 +2,7 @@
   "name": "jaxs",
   "description": "Modular J/TSX application framework",
   "private": false,
-  "version": "0.4.0",
+  "version": "0.4.2",
   "type": "module",
   "scripts": {
     "build": "vite build && npm run build:types",