ouider 0.0.3 → 0.0.5

package/dist/index.d.ts

@@ -1,95 +1,10 @@
-declare class Emits<O extends Record<string, any>> {
-    private events;
-    constructor(events: O);
-    emit(event: keyof O, ...args: any): void;
-}
-
-type StateWatcher<T> = <K extends keyof T>(key: K, oldValue: T[K], newValue: T[K]) => void;
-declare class Stated<T> {
-    value: T;
-    constructor(value: T);
-}
-declare function isStated<T>(ob: any): ob is Stated<T>;
-declare function stated<S extends Record<string, string>, T>(target: T, state: State<S>): Stated<T>;
-declare class State<T extends Record<string, any>> {
-    private THRESHOLD_TIME;
-    private debounceTime;
-    private state;
-    private listeners;
-    private timer;
-    constructor(data: T);
-    wrap<T>(obj: T): Stated<T>;
-    has(key: keyof T): boolean;
-    setValue(key: keyof T, value: any): void;
-    getValue(key: keyof T): any;
-    get value(): T;
-    private dispatchChanges;
-    didChange(path: keyof T, oldValue: any, newValue: any): Promise<void>;
-    watch(listener: StateWatcher<T>): number;
-    unwatch(listener: StateWatcher<T> | number): void;
-}
-
-type ComponentProps<K extends Record<string, any>> = K;
-/**
- * Component decorator, it allow an auto registration of components
- * @param options
- * @returns
- */
-declare function Component(options: {
-    template: string;
-    tag: string;
-    use?: OComponentType[];
-    css?: string;
-}): <T extends {
-    new (...args: any[]): {};
-}>(constructor: T) => {
-    new (...args: any[]): {
-        template: string;
-        css: string | undefined;
-        hash: string;
-    };
-} & T;
-interface Component<P extends Record<string, any>, O extends Record<string, any>> {
-    state: State<any>;
-    readonly emits: Emits<O>;
-    readonly props: ComponentProps<P>;
-    onMounted(): void;
-    willMount(): void;
-    willUnmount(): void;
-    provide<T>(key: string, value: T): void;
-    inject<T>(key: string): T | undefined;
-}
-interface ComponentConstructor<P extends Record<string, any>, O extends Record<string, any>> {
-    new (props?: P, emits?: O): Component<P, O>;
-}
-declare function createComponent<P extends Record<string, any>, O extends Record<string, any>>(ctr: ComponentConstructor<P, O>, props?: P, emits?: O): Component<P, O>;
-declare class OComponent<P extends Record<string, any> = {}, O extends Record<string, any> = {}> implements Component<P, O> {
-    state: State<any>;
-    private parent?;
-    readonly emits: Emits<O>;
-    readonly props: ComponentProps<P>;
-    private provides;
-    constructor(props?: P, emits?: O);
-    onMounted(): void;
-    willMount(): void;
-    willUnmount(): void;
-    /** Provide a value for descendants */
-    provide<T>(key: string, value: T): void;
-    /** Inject a value from nearest ancestor */
-    inject<T>(key: string): T | undefined;
-}
-type LazyLoader<P extends Record<string, any>, O extends Record<string, any>> = () => Promise<{
-    default: ComponentConstructor<P, O>;
-}>;
-type OComponentType<P extends Record<string, any> = {}, O extends Record<string, any> = {}> = ComponentConstructor<P, O> | LazyLoader<P, O>;
-
 type ProvideFunction<T> = () => T;
 type Provider<T = any> = {
     value?: T;
     provide?: ProvideFunction<T>;
 };
-interface Plugin {
-    install(app: App): void;
+interface Plugin<T> {
+    install(app: App, options?: T): void;
 }
 /** Injection token key */
 type InjectionKey = string;
@@ -120,7 +35,7 @@ declare class App {
      * @param plugin the plugin to register
      * @returns `this` App instance
      */
-    use(plugin: Plugin): this;
+    use<T>(plugin: Plugin<T>, options?: T): this;
     constructor(root: ComponentConstructor<any, any>, options?: {
         css?: string;
     } | undefined);
@@ -145,6 +60,44 @@ declare function inject<T>(token: InjectionKey): T | undefined;
 
 type QueryFilter = "children" | "classes" | "style" | "attributes";
 declare namespace ODOM {
+    export class BatchActions {
+        private actions;
+        constructor();
+        exec(): Promise<any>;
+        add(action: () => void): this;
+        commit(): Promise<void>;
+    }
+    export class BatchUpdates {
+        private node;
+        private operations;
+        constructor(node: OElement);
+        exec(): Promise<any>;
+        private append;
+        add(fn: () => void): this;
+        addEventListener(event: string, callback: (...args: any[]) => void): BatchUpdates;
+        setProperty(key: string, value: string): BatchUpdates;
+        dettachEventListener(event: string, cbId: string): BatchUpdates;
+        invoke(fn: string, ...args: any[]): BatchUpdates;
+        dispatchEvent(eventName: string, eventClass?: string, initDict?: any): BatchUpdates;
+        addClass(...tokens: string[]): BatchUpdates;
+        removeClass(...tokens: string[]): BatchUpdates;
+        setAttribute(name: string, value: string): BatchUpdates;
+        removeAttribute(name: string): BatchUpdates;
+        appendChild(child: ONode): BatchUpdates;
+        removeChild(child: ONode): BatchUpdates;
+        remove(): BatchUpdates;
+        removeAndRelease(): BatchUpdates;
+        release(): BatchUpdates;
+        innerHTML(html: string): BatchUpdates;
+        replaceChildNode(node: ONode, child: ONode): BatchUpdates;
+        replaceWith(node: ONode): BatchUpdates;
+        after(node: ONode): BatchUpdates;
+        setInnerText(text: string): BatchUpdates;
+        setContentText(text: string): BatchUpdates;
+        insertBefore(element: ONode, node: ONode): BatchUpdates;
+        setInputValue(value: string): BatchUpdates;
+        setStyle(key: string, value: any): BatchUpdates;
+    }
     export type NodeType = 'Element' | 'Text' | 'Comment' | 'Attribute' | 'Unknown';
     type Attributes = {
         name: string;
@@ -171,14 +124,17 @@ declare namespace ODOM {
         constructor(node: ONode);
     }
     export class OElement extends ONode {
+        private _hydrated;
         constructor(node: ONode);
-        addClass(name: string): Promise<void>;
+        addClass(...tokens: string[]): Promise<void>;
+        removeClass(...tokens: string[]): Promise<void>;
         setAttribute(name: string, value: string): Promise<void>;
         removeAttribute(name: string): Promise<void>;
         appendChild(child: ONode): Promise<void>;
         set innerHTML(value: string);
         cloneNode(state: boolean): Promise<OElement | null>;
         remove(): Promise<void>;
+        removeAndRelease(): Promise<void>;
         removeChild(child: ONode): Promise<void>;
         replaceChildNode(node: ONode, child: ONode): Promise<void>;
         replaceWith(node: ONode): Promise<void>;
@@ -193,14 +149,19 @@ declare namespace ODOM {
         hasAttribute(name: string): boolean;
         getAttribute(name: string): Promise<string>;
         attribute(name: string): string | null;
+        nextSibling(): Promise<OElement | null>;
         getAttributeNames(): Promise<string[]>;
         parentNode(): Promise<OElement | null>;
-        insertBefore(element: ONode, node: ONode): Promise<unknown>;
+        insertBefore(element: ONode, node: ONode): Promise<void>;
         setInputValue(value: string): Promise<void>;
         inputValue(value: string): Promise<string>;
+        get hydrated(): boolean;
+        hydrate(): void;
         query(selector: string, filter?: QueryFilter[]): Promise<OElement | null>;
         queryAll(selector: string, filter?: QueryFilter[]): Promise<OElement[] | null>;
         release(): Promise<void>;
+        setStyle(key: string, value: any): Promise<void>;
+        updates(): BatchUpdates;
     }
     export {  };
 }
@@ -220,6 +181,12 @@ type OUIDConfig = {
 declare var WebOUID: {
     invoke: (id: string, name: string, argsJson: string) => void;
 } | undefined;
+type RequestData = {
+    method: string;
+    headers: Record<string, string>;
+    body: any;
+    credentials: "include" | "omit" | "same-origin";
+};
 declare class OUIDBridge implements OUIDBridgeInterface {
     private callbacks;
     private DOM_EVENT_LISTENERS;
@@ -229,6 +196,8 @@ declare class OUIDBridge implements OUIDBridgeInterface {
     constructor();
     config(conf?: OUIDConfig): OUIDBridge;
     invoke(name: string, ...args: any[]): Promise<any>;
+    registerComponent(tag: string, compClass: OComponentType<any, any>): void;
+    unregisterComponent(tag: string, compClass: OComponentType<any, any>): void;
     /**
      * Make a synchronous class
      * @param name the name without '_oui' prefix
@@ -245,7 +214,7 @@ declare class OUIDBridge implements OUIDBridgeInterface {
     subscribe(event: string, callback: (id: string, ...args: any[]) => void): void;
     query(selector: string, filter?: QueryFilter[], nodeId?: string): Promise<ODOM.OElement | null>;
     queryAll(selector: string, filter?: QueryFilter[], nodeId?: string): Promise<ODOM.OElement[] | null>;
-    createdElement(tag: string, props?: Record<string, string>): Promise<ODOM.OElement | null>;
+    createElement(tag: string, props?: Record<string, string>): Promise<ODOM.OElement | null>;
     createComment(data: string): Promise<ODOM.OElement | null>;
     addEventListener(node: ODOM.OObject | 'window' | 'document', event: string, callback: (...args: any[]) => void): Promise<string>;
     dettachEventListener(node: ODOM.OObject | 'window' | 'document', event: string, cbId: string): Promise<void>;
@@ -257,6 +226,9 @@ declare class OUIDBridge implements OUIDBridgeInterface {
     clearTimeout(id: number): Promise<void>;
     setInterval(callback: () => void, delay: number): Promise<number>;
     clearInterval(id: number): Promise<void>;
+    fetch(url: string, input: RequestData, encodeAs: "json"): Promise<any>;
+    fetch(url: string, input: RequestData, encodeAs: "text"): Promise<string>;
+    fetch(url: string, input: RequestData, encodeAs: "base64"): Promise<string>;
 }
 declare const OUID: OUIDBridge;
 declare global {
@@ -268,10 +240,15 @@ declare class RenderContext {
     component: OComponent<Record<string, any>, Record<string, any>>;
     private parentContext;
     static PROVIDE_TOKEN: string;
+    static STYLE_REF: WeakMap<any, number>;
     private bindings;
     private directives;
     private mountedComponents;
+    private componentsRegistry;
+    private updatingDirectives;
+    private updatingBindings;
     stack: Record<string, any>[];
+    hydradationActions: ODOM.BatchActions;
     constructor(app: App, component: OComponent<Record<string, any>, Record<string, any>>, parentContext: RenderContext | null, ...frames: Record<string, any>[]);
     get hostElement(): ODOM.OElement;
     bind(binding: Binding): void;
@@ -285,14 +262,17 @@ declare class RenderContext {
     updateValue(key: string, value: any): void;
     push(frame: Record<string, any>): void;
     pop(): void;
-    updateBindings(): Promise<void>;
-    updateBinding(binding: Binding): Promise<void>;
-    updateDirectives(): Promise<void>;
+    resolveTag(tag: string): OComponentType<any, any> | undefined;
+    updateBindings(updates?: ODOM.BatchActions): Promise<void>;
+    updateBinding(binding: Binding, updates: ODOM.BatchActions): void;
+    updateDirectives(updates?: ODOM.BatchActions): Promise<void>;
     private render;
     private expandClass;
     private expandStyle;
     private expandStandardAttributes;
-    handleElementNode(node: ODOM.OElement): Promise<void>;
+    handleElementNode(node: ODOM.OElement, options?: {
+        skipSlotted: boolean;
+    }): Promise<void>;
     handleTextNode(node: ODOM.OElement): void;
     private componentAttributes;
     mountComponent<T extends Record<string, any>, O extends Record<string, string>>(hostNode: ODOM.OElement, component: OComponentType<T, O>, parentContext: RenderContext | null, props?: Record<string, {
@@ -316,6 +296,7 @@ type Directive = {
     placeholder: ODOM.OElement;
     context: RenderContext;
     active?: boolean;
+    renderedNode?: ODOM.OElement;
     list?: string;
     item?: string;
     children?: Map<any, {
@@ -323,16 +304,127 @@ type Directive = {
         ctx: RenderContext;
     }>;
     key?: string;
+    destroy?: boolean;
 };
+declare function node<P extends Record<string, any>, O extends Record<string, any>>(component: string, p?: P, children?: RenderNode[], emits?: O): Promise<RenderNode>;
 declare function o<P extends Record<string, any>, O extends Record<string, any>>(component: ComponentConstructor<P, O>, props: P, emits?: O): OComponent<P>;
 declare function o<P extends Record<string, any>, O extends Record<string, any>>(component: OComponentType<P, O>, props: P, emits?: O): Promise<OComponent<P>>;
 
+declare class Emits<O extends Record<string, any>> {
+    private events;
+    constructor(events: O);
+    emit(event: keyof O, ...args: any): void;
+}
+
+type StateWatcher<T> = <K extends keyof T>(key: K, oldValue: T[K], newValue: T[K]) => void;
+declare class Stated<T> {
+    value: T;
+    constructor(value: T);
+}
+declare function isStated<T>(ob: any): ob is Stated<T>;
+declare function stated<S extends Record<string, string>, T>(target: T, state: State<S>): Stated<T>;
+declare class State<T extends Record<string, any>> {
+    private THRESHOLD_TIME;
+    private debounceTime;
+    private state;
+    private listeners;
+    private timer;
+    constructor(data: T);
+    wrap<T>(obj: T): Stated<T>;
+    has(key: keyof T): boolean;
+    setValue(key: keyof T, value: any): void;
+    getValue(key: keyof T): any;
+    get value(): T;
+    private dispatchChanges;
+    didChange(path: keyof T, oldValue: any, newValue: any): Promise<void>;
+    watch(listener: StateWatcher<T>): number;
+    unwatch(listener: StateWatcher<T> | number): void;
+}
+
+type ComponentProps<K extends Record<string, any>> = K;
+declare class RenderNode {
+    private node;
+    private children;
+    constructor(node: ODOM.OElement | string, children?: RenderNode[]);
+    attachTo(host: ODOM.OElement): void;
+    static of(node: ODOM.OElement | string, children?: RenderNode[]): RenderNode;
+    addChild(node: RenderNode): RenderNode;
+}
+declare class StyleData {
+    private data;
+    private css;
+    constructor(data: Record<string, StyleData | string>, css: string);
+    toString(): string;
+    static of(data: Record<string, StyleData | string>, ...css: string[]): StyleData;
+}
+/**
+ * Component decorator, it allow an auto registration of components
+ * @param options
+ * @returns
+ */
+declare function Component(options: {
+    template: string;
+    tag: string;
+    use?: Record<string, OComponentType>;
+    css?: string;
+    hostClasses?: string | string[];
+}): <T extends {
+    new (...args: any[]): {};
+}>(constructor: T) => {
+    new (...args: any[]): {
+        template: string;
+        css: string | undefined;
+        tag: string;
+        use: Record<string, OComponentType<{}, {}>> | undefined;
+        hostClasses: string | string[] | undefined;
+        hash: string;
+    };
+} & T;
+interface Component<P extends Record<string, any>, O extends Record<string, any>> {
+    state: State<any>;
+    readonly emits: Emits<O>;
+    readonly props: ComponentProps<P>;
+    onMounted(): void;
+    willMount(): void;
+    willUnmount(): void;
+    provide<T>(key: string, value: T): void;
+    inject<T>(key: string): T | undefined;
+    render?(ctx: RenderContext): RenderNode | null | Promise<RenderNode | null>;
+    style?(): StyleData | null;
+    decorateHostElement(hostElement: ODOM.OElement): Promise<void>;
+}
+interface ComponentConstructor<P extends Record<string, any>, O extends Record<string, any>> {
+    new (props?: P, emits?: O): Component<P, O>;
+}
+declare function createComponent<P extends Record<string, any>, O extends Record<string, any>>(ctr: ComponentConstructor<P, O>, props?: P, emits?: O): Component<P, O>;
+declare class OComponent<P extends Record<string, any> = {}, O extends Record<string, any> = {}> implements Component<P, O> {
+    state: State<any>;
+    private parent?;
+    readonly emits: Emits<O>;
+    readonly props: ComponentProps<P>;
+    private provides;
+    constructor(props?: P, emits?: O);
+    onMounted(): void;
+    willMount(): void;
+    willUnmount(): void;
+    /** Provide a value for descendants */
+    provide<T>(key: string, value: T): void;
+    /** Inject a value from nearest ancestor */
+    inject<T>(key: string): T | undefined;
+    render?(ctx: RenderContext): RenderNode | null | Promise<RenderNode | null>;
+    style?(): StyleData | null;
+    decorateHostElement(hostElement: ODOM.OElement): Promise<void>;
+}
+type LazyLoader<P extends Record<string, any>, O extends Record<string, any>> = () => Promise<{
+    default: ComponentConstructor<P, O>;
+}>;
+type OComponentType<P extends Record<string, any> = {}, O extends Record<string, any> = {}> = ComponentConstructor<P, O> | LazyLoader<P, O>;
+
 /**
  * Component responsible for display routes
  * Usage: <o-router></o-router>
  */
-declare class RouterComponent extends OComponent {
-    private routeStateHander;
+declare class ORouter extends OComponent {
     private router;
     willMount(): void;
     onMounted(): void;
@@ -372,7 +464,7 @@ interface RouteGuard {
     type: 'before' | 'after';
     fn: RouteGaurdFunction;
 }
-declare class Router implements Plugin {
+declare class Router implements Plugin<any> {
     routes: Routes;
     private windowObject;
     private guards;
@@ -386,14 +478,20 @@ declare class Router implements Plugin {
         params?: Record<string, string>;
         absolute?: boolean;
     }): void;
+    pop(): void;
     private beforeRouteGoing;
     private afterRouteGoing;
-    bind(component: RouterComponent): Promise<(() => void)>;
-    unbind(handler: () => void): void;
+    bind(component: ORouter): Promise<(() => void)>;
+    unbind(): void;
     beforeEach(fn: RouteGaurdFunction): (() => void);
     afterEach(fn: RouteGaurdFunction): (() => void);
 }
 
+declare class OIcon extends OComponent {
+    render(_: RenderContext): RenderNode;
+    style(): StyleData | null;
+}
+
 declare function components(): Record<string, OComponent<any, any>>;
 
-export { ACTIVE_ROUTE_TOKEN, App, type Binding, Component, type ComponentConstructor, type ComponentProps, type Directive, Emits, type InjectionKey, type LazyLoader, Native, OComponent, type OComponentType, ODOM, OUID, OUIDBridge, type OUIDBridgeInterface, type OUIDConfig, type Plugin, type Promised, type Provider, type Providers, ROUTER_INJECTION_TOKEN, RenderContext, type Route, type RouteGaurdFunction, type RouteGuard, type RouteGuardReturn, type RouteLocationNamed, Router, RouterComponent, type Routes, State, type StateWatcher, Stated, WebOUID, components, createComponent, createRouter, inject, isStated, o, provide, stated, useRouter };
+export { ACTIVE_ROUTE_TOKEN, App, type Binding, Component, type ComponentConstructor, type ComponentProps, type Directive, Emits, type InjectionKey, type LazyLoader, Native, OComponent, type OComponentType, ODOM, OIcon, ORouter, OUID, OUIDBridge, type OUIDBridgeInterface, type OUIDConfig, type Plugin, type Promised, type Provider, type Providers, ROUTER_INJECTION_TOKEN, RenderContext, RenderNode, type Route, type RouteGaurdFunction, type RouteGuard, type RouteGuardReturn, type RouteLocationNamed, Router, type Routes, State, type StateWatcher, Stated, StyleData, WebOUID, components, createComponent, createRouter, inject, isStated, node, o, provide, stated, useRouter };

package/dist/index.js

@@ -1,4 +1,30 @@
-import X from'route-parser';var F=Object.defineProperty;var tt=(a,t,e)=>t in a?F(a,t,{enumerable:true,configurable:true,writable:true,value:e}):a[t]=e;var h=(a,t)=>F(a,"name",{value:t,configurable:true});var u=(a,t,e)=>tt(a,typeof t!="symbol"?t+"":t,e);var E,et=(E=class{constructor(){u(this,"components",new Map);}register(t,e){let n=t.toLocaleLowerCase();if(this.components.has(n)){console.warn(`[OUID] - ${n} component already registered`);return}this.components.set(n,e);}unregister(t){let e=t.toLocaleLowerCase();this.components.delete(e);}get(t){return this.components.get(t.toLocaleLowerCase())}getAll(){return Array.from(this.components.entries())}},h(E,"ComponentsRegistry"),E),O=new et;var L=class L{constructor(t){u(this,"events");this.events=t;}emit(t,...e){let n=this.events[t];n&&n(...e);}};h(L,"Emits");var I=L;var M=class M{constructor(t){u(this,"value");this.value=t;}};h(M,"Stated");var C=M;function J(a){return typeof a=="object"&&!Array.isArray(a)&&"value"in a&&a instanceof C}h(J,"isStated");function nt(a,t){let e=h((n,s=new Map)=>{if(s.has(n))return s.get(n);let c=new Proxy(n,{set:h((o,l,r)=>{let i=o[l];return typeof r=="object"?o[l]=e(r):o[l]=r,t.didChange(l,i,r),true},"set"),get:h((o,l)=>Reflect.get(o,l),"get")});s.set(n,c);for(let o=n;o;o=Object.getPrototypeOf(o))Object.keys(o).forEach(l=>{let r=n[l];typeof r=="object"&&(n[l]=e(r,s));});return c},"proxify");if(typeof a=="function")throw new Error("Can't create reactive element over a function");return typeof a!="object"&&typeof a!="symbol"?new Proxy(new C(a),{set:h((n,s,c)=>{if(s!=="value")throw new Error(`Undefined property ${String(s)} access`);let o=n[s];return n[s]=c,t.didChange(s,o,c),true},"set"),get:h((n,s)=>{if(s!=="value")throw new Error(`Undefined property ${String(s)} access`);return n[s]},"get")}):new C(e(a))}h(nt,"stated");var P=class P{constructor(t){u(this,"THRESHOLD_TIME",50);u(this,"debounceTime",new Date().getTime());u(this,"state");u(this,"listeners",[]);u(this,"timer",null);this.state=new Proxy(t,{set:h((e,n,s)=>{let c=e[n];return e[n]=s,this.didChange(n,c,s),true},"set"),get:h((e,n)=>e[n],"get")});}wrap(t){return nt(t,this)}has(t){return t in this.state}setValue(t,e){this.state[t]=e;}getValue(t){return this.state[t]}get value(){return this.state}dispatchChanges(t,e,n){for(let s of this.listeners)s(t,e,n);}async didChange(t,e,n){let s=Date.now();s-this.debounceTime<=this.THRESHOLD_TIME&&this.timer&&await OUID.clearTimeout(this.timer),this.debounceTime=s,this.timer=await OUID.setTimeout(()=>{this.dispatchChanges(t,e,n);},this.THRESHOLD_TIME);}watch(t){return this.listeners.push(t),this.listeners.length-1}unwatch(t){if(typeof t=="number"){this.listeners.splice(t,1);return}this.listeners.splice(this.listeners.indexOf(t),1);}};h(P,"State");var N=P;var st=0;function K(a){return function(t){var s;let e=(s=class extends t{constructor(){super(...arguments);u(this,"template",a.template);u(this,"css",a.css);u(this,"hash","component-"+st+"-"+a.tag);}},h(s,"WithDecoration"),s),n=e;return O.register(a.tag,n),e}}h(K,"Component");function U(a,t,e){return new a(t,e)}h(U,"createComponent");var k=class k{constructor(t={},e={}){u(this,"state");u(this,"parent");u(this,"emits");u(this,"props");u(this,"provides",new Map);this.state=new N(this),this.props=t,this.emits=new I(e);}onMounted(){}willMount(){}willUnmount(){}provide(t,e){this.provides.set(t,e);}inject(t){let e=this;for(;e;){if(e.provides.has(t))return e.provides.get(t);e=e.parent;}}};h(k,"OComponent");var S=k;function rt(a){return a.replace(/-([a-z])/g,(t,e)=>e.toUpperCase())}h(rt,"toCamelCase");function g(a){return J(a)?a.value:a}h(g,"normaliseValue");function it(a){let t={};for(let e=a;e;e=Object.getPrototypeOf(e))Object.getOwnPropertyNames(e).forEach(n=>{let s=a[n];typeof s=="function"&&n!=="constructor"&&!n.startsWith("__")&&!n.endsWith("__")?n in t||(t[n]=s.bind(a)):n!=="constructor"&&!n.startsWith("__")&&!n.endsWith("__")&&(n in t||(t[n]=s));});return t}h(it,"toObjectWithFunctions");function ot(a){return typeof a=="function"&&!("prototype"in a)}h(ot,"isLazyLoader");var b=class b{constructor(t,e,n,...s){u(this,"app");u(this,"component");u(this,"parentContext");u(this,"bindings",[]);u(this,"directives",[]);u(this,"mountedComponents",new WeakMap);u(this,"stack",[]);this.app=t,this.component=e,this.parentContext=n;for(let c of s)this.stack.push(c);}get hostElement(){return this.component._hostElement}bind(t){this.bindings.push(t);}directive(t){this.directives.push(t);}evaluateExpression(t){return this.resolve(t)}resolve(t,e=true,...n){if(!t)return;let s=this.component.state.value,o={...it(s)};for(let l of [...this.stack.reverse(),...n])Object.assign(o,l);try{let l=`${e?'"use strict";':""}return ${t};`,r=Object.keys(o),i=new Function(...r,l);return i.bind(this.component),i.apply(this.component,Object.values(o))}catch(l){console.log(this,t),console.error(l);}}updateValue(t,e){t.split(/[\.\[]/)[0]in this.component?this.resolve(`this.${t}=__o_model_value__`,true,{__o_model_value__:e}):this.resolve(`${t}=__o_model_value__`,true,{__o_model_value__:e}),this.component.state.didChange("","","");}push(t){this.stack.unshift(t);}pop(){this.stack.shift();}async updateBindings(){this.bindings.forEach(t=>this.updateBinding(t));}async updateBinding(t){if(t.type==="model")t.node.setProperty("value",g(t.context.resolve(t.key)));else if(t.type==="interpolation")await t.node.setContentText(t.template?.replace(/\{\{(.*?)\}\}/g,(e,n)=>(n=n.trim(),g(t.context.resolve(n))))??"");else if(t.type==="attribute"){let e=t.key,n=g(this.resolve(t.template));e==="class"?this.expandClass(t.node,n):e==="style"?this.expandStyle(t.node,n):typeof n!="object"&&typeof n!="function"&&typeof n!="symbol"&&typeof n<"u"&&t.node.setAttribute(e,n.toString());}else if(t.type==="prop"&&t.context.component){let e=g(this.resolve(t.template));try{console.log({...t.context.component}),t.context.component.props[t.key]=e,t.context.updateBindings(),t.context.updateDirectives();}catch(n){console.error(n);}}}async updateDirectives(){for(let t of this.directives){if(t.type==="if"){let e=g(t.context.evaluateExpression(t.expr));e?t.active!==true&&(t.active=true,await t.placeholder.after(t.node),await t.context.render(t.node),t.context.updateBindings()):e||t.active!==false&&(this.unmountComponent(t.node),await t.node.remove(),t.active=false);}if(t.type==="for"){let e=t.children??new Map,n=new Map,s=h((l,r)=>t.key?g(t.context.resolve(t.key,true,{[t.item]:l})):r,"keyFn"),c=g(t.context.resolve(t.list))||[],o=t.placeholder;for(let l=0;l<c.length;l++){let r=c[l],d=s(r,l),y=e.get(d),f=y?.node,w={[t.item]:r},m=y?.ctx??new b(this.app,this.component,null);m.stack=[w,...t.context.stack],f?(m.updateBindings(),await m.updateDirectives()):(f=await t.node.cloneNode(true),await m.render(f),await o.after(f),m.updateBindings(),await m.updateDirectives()),o=f,n.set(d,{node:f,ctx:m});}for(let l in e){let r=e.get(l);n.has(l)||(this.unmountComponent(r.node),await r.node.remove());}t.children=n;}}}async render(t){switch(t.type){case "Text":this.handleTextNode(t);break;case "Element":await this.handleElementNode(t);break;default:console.warn("Unknown node",t);}}expandClass(t,e){let n=e;typeof e=="object"&&(Array.isArray(e)?n=e.join(" "):n=Object.keys(e).filter(s=>e[s]).join(" ")),t.setAttribute("class",n);}expandStyle(t,e){let n=e;typeof e=="object"&&!Array.isArray(e)&&(n=Object.keys(e).map(s=>`${s}: ${e[s]}`).join(";")),t.setAttribute("style",n);}expandStandardAttributes(t){[...t.attributes].filter(e=>e.name.startsWith(":")).forEach(e=>{let n=e.name.substring(1);this.bind({type:"attribute",node:t,key:n,context:this,template:e.value.trim()}),t.removeAttribute(e.name);});}async handleElementNode(t){let e=await t.parentNode(),n=null;if(t.hasAttribute("o-if")){let r=await t.getAttribute("o-if"),i=await OUID.createComment("o-if:"+r);await e.insertBefore(i,t),await t.removeAttribute("o-if"),this.directive({type:"if",expr:r,node:t,placeholder:i,context:this,active:void 0}),n="if";}if(t.hasAttribute("o-for")){if(n==="if")throw new Error("Can't have o-if and o-for on the same component");let r=await t.getAttribute("o-for"),[i,d]=r.split(" of ").map(w=>w.trim()),y=await OUID.createComment("for:"+r),f=t.attribute(":key")??"";await e?.insertBefore(y,t),await Promise.all([t.removeAttribute("o-for"),t.removeAttribute(":key")]),await t.remove(),this.directive({type:"for",item:i,list:d,node:t,placeholder:y,context:this,key:f}),n="for";}let s=t.tag.toLowerCase(),c=O.get(s);n!=="for"&&[...t.attributes].forEach(async r=>{if(r.name==="o-model"){let i=r.value.trim();if(t.tag==="input"||t.tag==="textarea"){let d=t;await d.setInputValue(g(this.resolve(i))),d.addEventListener("input",async y=>{let f=await y.target.getProperty("value");this.updateValue(i,f);}),this.bind({node:t,key:i,type:"model",context:this});}await t.removeAttribute(r.name);}});let o={},l={};if(n!=="for"){let{props:r,events:i}=this.componentAttributes(t,this);o=r,l=i,this.expandStandardAttributes(t),Object.keys(l).forEach(async d=>{let y=l[d];c||await t.addEventListener(d,f=>{typeof y=="function"&&y.apply(this.component,[f]);}),await t.removeAttribute("@"+d);});}if(!n){if(c){await this.mountComponent(t,c,this,o,l);return}for(let r of await t.childNodes())await this.render(r);}}handleTextNode(t){let e=t.textContent?.match(/\{\{(.*?)\}\}/g);e&&e.forEach(n=>{let s=n.replace(/[{}]/g,"").trim();this.bind({type:"interpolation",node:t,key:s,template:t.textContent,context:this});});}componentAttributes(t,e){let n={},s={},c=["import","interface","module","o-model","o-if","o-for"];return [...t.attributes].filter(o=>!c.includes(o.name)).forEach(o=>{let l=o.name;if(l.startsWith("@")){let d=e?.resolve(o.value,true);if(typeof d!="function")throw new Error("Event handler can only be function");l=l.substring(1),s[l]=d;return}let r=null,i=o.value;l.startsWith(":")&&(r=o.value,l=l.substring(1),i=g(e?.resolve(o.value))),l=rt(l),n[l]={name:l,value:i,expr:r};}),{props:n,events:s}}async mountComponent(t,e,n,s={},c={}){let o=await OUID.createdElement("div"),l=new b(this.app,{},null),r={};Object.keys(s).forEach(w=>{let m=s[w];m.expr&&this.bind({type:"prop",node:o,key:w,context:l,template:m.expr}),r[w]=m.value;});let i=await at(e,r,c);l.component=i,l.stack=[i.props],Object.keys(s).filter(w=>!s[w].expr).forEach(w=>o.setAttribute(w,s[w].value)),o.addClass("o-component-host"),t.tag.toLowerCase()!=="div"&&o.addClass("c-"+t.tag.toLowerCase()),i.willMount(),await o.setHTML(i.template.trim()),i.css&&(i.cssInstance=await OUID.injectComponentStyles(i.css));let d=await t.childNodes(),y=await o.queryAll("o-slot");if(y){let w=y.map(async m=>{let R=m.attribute("name"),Y=await m.parentNode();for(let Z of d.filter(j=>R?R&&j.type==="Element"&&j.attribute("slot")===R:j.type!=="Element"||!j.hasAttribute("slot")))await Y?.insertBefore(Z,m);});await Promise.all(w);}let f=o;await t.setHTML(""),await t.appendChild(o),i._hostElement=f,i.parent=n?.component??void 0,i.provide(b.PROVIDE_TOKEN,this),await l.render(f),l.updateBindings(),l.updateDirectives(),this.mountedComponents.set(f,i),i.onMounted(),i.state.watch(()=>{l.updateBindings(),l.updateDirectives();});}async unmountComponent(t){let e=this.mountedComponents.get(t);e&&(await OUID.rejectComponentStyles(e.cssInstance),e.willUnmount(),e._hostElement=null);let n=await t.queryAll("*")??[];for(let s of n)await this.unmountComponent(s);this.mountedComponents.delete(t);}};h(b,"RenderContext"),u(b,"PROVIDE_TOKEN","RENDER_CONTEXT");var x=b;function at(a,t,e){return ot(a)?a().then(n=>U(n.default,t,e)):U(a,t,e)}h(at,"o");function ct(a){return typeof a=="function"}h(ct,"isProvideFunction");var _=class _{constructor(t,e){u(this,"root");u(this,"options");u(this,"providers",new Map);this.root=t,this.options=e,_.currentApp=this;}provide(t,e){if(this.providers.has(t)){console.warn(`[OUID] - Provider ${t} already exists`);return}this.providers.set(t,ct(e)?{provide:e}:{value:e});}inject(t){return this.providers.get(t)?.value}use(t){return t.install(this),this}async mount(t){if(!globalThis.__OUI_PUR_JS_CONTEXT__)return;this.options?.css&&(console.log("Injecting app css",this.options.css),await OUID.injectComponentStyles(this.options.css));let e=await OUID.query(t);if(console.log("Mounting app on",e),!e)throw new Error("No selector found for "+t);let n=new x(this,{},null);n.mountComponent(e,this.root,null).then(()=>{n.updateBindings(),n.updateDirectives();});}};h(_,"App"),u(_,"currentApp",null);var A=_;function Nt(a,t){A.currentApp?.provide(a,t);}h(Nt,"provide");function z(a){return A.currentApp?.inject(a)??void 0}h(z,"inject");function lt(a,t,e,n){var s=arguments.length,c=s<3?t:n===null?n=Object.getOwnPropertyDescriptor(t,e):n,o;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")c=Reflect.decorate(a,t,e,n);else for(var l=a.length-1;l>=0;l--)(o=a[l])&&(c=(s<3?o(c):s>3?o(t,e,c):o(t,e))||c);return s>3&&c&&Object.defineProperty(t,e,c),c}h(lt,"_ts_decorate");var q=class q extends S{constructor(){super(...arguments);u(this,"routeStateHander",null);u(this,"router");}willMount(){}onMounted(){this.router=ut(),console.log("Router mounted"),this.router?.bind(this).then(e=>{this.routeStateHander=e,this.routeStateHander?.();});}willUnmount(){console.log("Router will unmount"),this.router?.unbind(this.routeStateHander);}};h(q,"RouterComponent");var D=q;D=lt([K({tag:"o-router",template:`
+import ot from'route-parser';var et=Object.defineProperty;var lt=(a,t,e)=>t in a?et(a,t,{enumerable:true,configurable:true,writable:true,value:e}):a[t]=e;var h=(a,t)=>et(a,"name",{value:t,configurable:true});var l=(a,t,e)=>lt(a,typeof t!="symbol"?t+"":t,e);var H=class H{constructor(){l(this,"components",new Map);}register(t,e){console.log(`[OUID] - Registering component: ${t}`);let n=t.toLocaleLowerCase();if(this.components.has(n)){console.warn(`[OUID] - ${n} component already registered`);return}this.components.set(n,e);}unregister(t){let e=t.toLocaleLowerCase();this.components.delete(e);}get(t){return this.components.get(t.toLocaleLowerCase())}has(t){return this.components.has(t)}getAll(){return Array.from(this.components.entries())}};h(H,"ComponentsRegistry");var S=H,T=new S;var q=class q{constructor(t){l(this,"events");this.events=t;}emit(t,...e){let n=this.events[t];console.log("Emitting event",t,n),n&&n(...e);}};h(q,"Emits");var P=q;var W=class W{constructor(t){l(this,"value");this.value=t;}};h(W,"Stated");var N=W;function nt(a){return typeof a=="object"&&!Array.isArray(a)&&"value"in a&&a instanceof N}h(nt,"isStated");function ut(a,t){let e=h((n,s=new Map)=>{if(s.has(n))return s.get(n);let o=new Proxy(n,{set:h((c,d,p)=>{let y=c[d];return typeof p=="object"?c[d]=e(p):c[d]=p,t.didChange(d,y,p),true},"set"),get:h((c,d)=>Reflect.get(c,d),"get")});s.set(n,o);for(let c=n;c;c=Object.getPrototypeOf(c))Object.keys(c).forEach(d=>{let p=n[d];typeof p=="object"&&(n[d]=e(p,s));});return o},"proxify");if(typeof a=="function")throw new Error("Can't create reactive element over a function");return typeof a!="object"&&typeof a!="symbol"?new Proxy(new N(a),{set:h((n,s,o)=>{if(s!=="value")throw new Error(`Undefined property ${String(s)} access`);let c=n[s];return n[s]=o,t.didChange(s,c,o),true},"set"),get:h((n,s)=>{if(s!=="value")throw new Error(`Undefined property ${String(s)} access`);return n[s]},"get")}):new N(e(a))}h(ut,"stated");var F=class F{constructor(t){l(this,"THRESHOLD_TIME",50);l(this,"debounceTime",new Date().getTime());l(this,"state");l(this,"listeners",[]);l(this,"timer",null);this.state=new Proxy(t,{set:h((e,n,s)=>{let o=e[n];return e[n]=s,this.didChange(n,o,s),true},"set"),get:h((e,n)=>e[n],"get")});}wrap(t){return ut(t,this)}has(t){return t in this.state}setValue(t,e){this.state[t]=e;}getValue(t){return this.state[t]}get value(){return this.state}dispatchChanges(t,e,n){for(let s of this.listeners)s(t,e,n);}async didChange(t,e,n){let s=Date.now();s-this.debounceTime<=this.THRESHOLD_TIME&&this.timer&&await OUID.clearTimeout(this.timer),this.debounceTime=s,this.timer=await OUID.setTimeout(()=>{this.dispatchChanges(t,e,n);},this.THRESHOLD_TIME);}watch(t){return this.listeners.push(t),this.listeners.length-1}unwatch(t){if(typeof t=="number"){this.listeners.splice(t,1);return}this.listeners.splice(this.listeners.indexOf(t),1);}};h(F,"State");var U=F;var ht=0;function st(a){return function(t){var s;let e=(s=class extends t{constructor(){super(...arguments);l(this,"template",a.template);l(this,"css",a.css);l(this,"tag",a.tag);l(this,"use",a.use);l(this,"hostClasses",a.hostClasses);l(this,"hash","component-"+ht+"-"+a.tag);}},h(s,"WithDecoration"),s),n=e;return n.tag=a.tag,e}}h(st,"Component");var B=class B{constructor(t,e=[]){l(this,"node");l(this,"children");this.node=t,this.children=e;}attachTo(t){if(typeof this.node=="string"){t.innerHTML=this.node;return}let e=this.node;for(let n of this.children)n.attachTo(e);t.appendChild(e);}static of(t,e=[]){return new B(t,e)}addChild(t){return this.children.push(t),this}};h(B,"RenderNode");var A=B,R=class R{constructor(t,e){l(this,"data");l(this,"css");this.data=t,this.css=e;}toString(){let t=this.css?this.css+`
+`:"";for(let e in this.data){let n=this.data[e];typeof n=="string"?t+=`${e} { ${n} }
+`:n instanceof R&&(t+=`${e} {
+${n.toString()}}
+`);}return t}static of(t,...e){return new R(t,e.join(`
+`))}};h(R,"StyleData");var V=R;function J(a,t,e){return new a(t,e)}h(J,"createComponent");var K=class K{constructor(t={},e={}){l(this,"state");l(this,"parent");l(this,"emits");l(this,"props");l(this,"provides",new Map);this.state=new U(this),this.props=t,this.emits=new P(e);}onMounted(){}willMount(){}willUnmount(){}provide(t,e){this.provides.set(t,e);}inject(t){let e=this;for(;e;){if(e.provides.has(t))return e.provides.get(t);e=e.parent;}}decorateHostElement(t){return Promise.resolve()}};h(K,"OComponent");var _=K;function L(a){let t=Date.now();return `${(1e3+Math.floor(Math.random()*9e3)+a.length).toString(16)}-${t.toString(16)}`}h(L,"generateUIID");(function(a){var c,d,p,y,m;let t=(c=class{constructor(){l(this,"actions",[]);}async exec(){}add(i){return this.actions.push(i),this}async commit(){let i=this.actions;this.actions=[],await Promise.all(i.map(async r=>await r()));}},h(c,"BatchActions"),c);a.BatchActions=t;let e=(d=class{constructor(i){l(this,"node");l(this,"operations",[]);this.node=i;}async exec(){let i=this.operations.map(r=>typeof r=="object"?this.node[r.fn].apply(this.node,r.args):Promise.resolve(r()));try{await Promise.all(i);}catch{console.error("Error while batch updates");}}append(i,...r){return this.operations.push({fn:i,args:r}),this}add(i){return this.operations.push(i),this}addEventListener(i,r){return this.append("addEventListener",i,r)}setProperty(i,r){return this.append("setAttribute",i,r)}dettachEventListener(i,r){return this.append("dettachEventListener",i,r)}invoke(i,...r){return this.append("invoke",i,...r)}dispatchEvent(i,r,u){return this.append("dispatchEvent",i,r,u)}addClass(...i){return this.append("addClass",...i)}removeClass(...i){return this.append("removeClass",...i)}setAttribute(i,r){return this.append("setAttribute",i,r)}removeAttribute(i){return this.append("removeAttribute",i)}appendChild(i){return this.append("appendChild",i)}removeChild(i){return this.append("removeChild",i)}remove(){return this.append("remove")}removeAndRelease(){return this.append("removeAndRelease")}release(){return this.append("release")}innerHTML(i){return this.append("setHTML",i)}replaceChildNode(i,r){return this.append("replaceChildNode",i,r)}replaceWith(i){return this.append("replaceWith",i)}after(i){return this.append("after",i)}setInnerText(i){return this.append("setInnerText",i)}setContentText(i){return this.append("setContentText",i)}insertBefore(i,r){return this.append("insertBefore",i,r)}setInputValue(i){return this.append("setInputValue",i)}setStyle(i,r){return this.append("setStyle",i,r)}},h(d,"BatchUpdates"),d);a.BatchUpdates=e;let n=(p=class{constructor(i,r){l(this,"uid");l(this,"tag");this.uid=i,this.tag=r;}async addEventListener(i,r){return f.addEventListener(this,i,r)}async dettachEventListener(i,r){await f.dettachEventListener(this,i,r);}async invoke(i,...r){await f.call("invokeObjectMethod",this.uid,i,...r);}async getProperty(i){return await f.call("getObjectProperty",this.uid,i)}async setProperty(i,r){await f.call("setObjectProperty",this.uid,i,r);}async dispatchEvent(i,r,u){await f.call("dispatchEvent",this.uid,i,r,u);}},h(p,"OObject"),p);a.OObject=n;let s=(y=class extends n{constructor(r){super(r.uid,r.tag);l(this,"textContent");l(this,"type","Unknown");l(this,"attributes");l(this,"children");l(this,"classes");l(this,"style");for(let u in r)this[u]=r[u];this.attributes??(this.attributes=[]),this.classes??(this.classes=[]),this.style??(this.style="");}},h(y,"ONode"),y);a.ONode=s;let o=(m=class extends s{constructor(r){super(r);l(this,"_hydrated",false);}async addClass(...r){await f.call("addClass",this.uid,...r);}async removeClass(...r){await f.call("removeClass",this.uid,...r);}async setAttribute(r,u){let v=await f.call("setAttribute",this.uid,r,u);v&&(this.attributes=v);}async removeAttribute(r){let u=await f.call("removeAttribute",this.uid,r);u&&(this.attributes=u);}async appendChild(r){await f.call("appendChild",this.uid,r.uid);}set innerHTML(r){this.setHTML(r);}async cloneNode(r){let u=await f.call("cloneNode",this.uid,r);return u?new m(u):null}async remove(){await f.call("removeNode",this.uid);}async removeAndRelease(){await this.remove(),await this.release();}async removeChild(r){await f.call("removeChild",this.uid,r.uid);}async replaceChildNode(r,u){await f.call("removeChild",this.uid,r.uid,u.uid);}async replaceWith(r){await f.call("replaceWith",this.uid,r.uid);}async after(r){await f.call("insertAfter",this.uid,r.uid);}async setHTML(r){await f.call("setInnerHTML",this.uid,r);}async HTML(){return await f.call("getInnerHTML",this.uid)??""}async setInnerText(r){await f.call("setInnerText",this.uid,r);}async setContentText(r){await f.call("setContentText",this.uid,r);}async getContentText(){return await f.call("getContentText",this.uid)??""}async content(){try{return await f.call("getInnerText",this.uid)??""}catch(r){return console.error(r),""}}async childNodes(){return (await f.call("childNodes",this.uid))?.map(r=>new m(r))??[]}hasAttribute(r){return !!this.attributes.find(u=>u.name===r)}async getAttribute(r){return await f.call("getAttribte",this.uid,r)??""}attribute(r){return this.attributes.find(u=>u.name===r)?.value??null}async nextSibling(){let r=await f.call("nextSibling",this.uid);return r?new m(r):null}async getAttributeNames(){return await f.call("getAttributeNames",this.uid)??[]}async parentNode(){let r=await f.call("parentNode",this.uid);return r?new m(r):null}async insertBefore(r,u){await f.call("insertBefore",this.uid,u.uid,r.uid);}async setInputValue(r){await f.call("setInputValue",this.uid,r);}async inputValue(r){return await f.call("inputValue",this.uid,r)??""}get hydrated(){return this._hydrated}hydrate(){this._hydrated=true,this.addClass("hydrated");}async query(r,u){return await f.query(r,u,this.uid)}async queryAll(r,u){return await f.queryAll(r,u,this.uid)}async release(){await f.call("releaseNode",this.uid);}async setStyle(r,u){await f.call("setStyle",this.uid,r,u);}updates(){return new e(this)}},h(m,"OElement"),m);a.OElement=o;})(b||(b={}));function Mt(){return function(a,t,e){e.value;e.value=async(...s)=>{let o=s[0];try{let c=await f.invoke(t,[{props:o.getSafePropsForNative}]);console.log("result from native function"),o.setSafePropsFromNative;}catch{console.error("Failed to invoke native function");}};}}h(Mt,"Native");var z=class z{constructor(){l(this,"callbacks",new Map);l(this,"DOM_EVENT_LISTENERS",new Map);l(this,"timers",new Map);l(this,"_config");l(this,"listeners",new Map);this.subscribe("__ouid_native_event_success__",(t,e)=>{let n=this.callbacks.get(t);if(n)return this.callbacks.delete(t),n.success(...JSON.parse(e))}),this.subscribe("__ouid_native_event_error__",(t,e)=>{let n=this.callbacks.get(t);if(n)return console.error("Failure:",t,e),this.callbacks.delete(t),n.error(...JSON.parse(e))}),this.subscribe("__ouid_web_event__",(t,e)=>{let n=this.DOM_EVENT_LISTENERS.get(t);if(n){let o=JSON.parse(e)[1];return o&&(o.target=o?.target?new b.OElement(o.target):null),n(o)}});}config(t){return this._config=t,this}invoke(t,...e){let n=L(t);return new Promise((s,o)=>{this.callbacks.set(n,{success:s,error:o});try{if(!WebOUID)throw new Error("NativeOUID bridge not available");WebOUID.invoke(n,t,JSON.stringify(e));}catch(c){console.error(c),this.callbacks.delete(n);}})}registerComponent(t,e){T.register(t,e);}unregisterComponent(t,e){T.unregister(t);}async call(t,...e){try{return (await this.invoke(`_ouid_${t}`,...e)).data}catch(n){return console.error(n),null}}emit(t,e){WebOUID?.invoke("event",t,JSON.stringify(e));}subscribe(t,e){this.listeners.has(t)||(this.listeners.set(t,[]),globalThis[t]=(n,s)=>{this.listeners.get(t)?.forEach(o=>o(n,s));}),this.listeners.get(t).push(e);}async query(t,e,n){let s=await this.call("query",t,e,n);return s?new b.OElement(s):null}async queryAll(t,e,n){let s=await this.call("queryAll",t,e,n);return s?s.map(o=>new b.OElement(o)):[]}async createElement(t,e={}){let n=await this.call("createElement",t,e);return n?new b.OElement(n):null}async createComment(t){let e=await this.call("createComment",t);return e?new b.OElement(e):null}async addEventListener(t,e,n){let s=L(e+(typeof t=="string"?t:t.tag));return this.DOM_EVENT_LISTENERS.set(s,n),await f.call("attachEventListener",typeof t=="string"?t:t.uid,s,e),s}async dettachEventListener(t,e,n){this.DOM_EVENT_LISTENERS.delete(n),await f.call("dettachEventListener",typeof t=="string"?t:t.uid,n,e);}async injectComponentStyles(t){let e=await f.call("injectComponentStyles",t);return e?new b.OElement(e):null}async rejectComponentStyles(t){await f.call("rejectComponentStyles",t.uid);}async getOObject(t){let e=await f.call("getOObject",t);return e?new b.OObject(e.uid,e.tag):null}async acquireObject(t){let e=await f.call("acquireObject",t);return e?new b.OObject(e.uid,e.tag):null}async setTimeout(t,e){let n=L("setTimeout"+e);this.DOM_EVENT_LISTENERS.set(n,()=>{t();let o=this.timers.get(s);o&&(this.timers.delete(s),this.DOM_EVENT_LISTENERS.delete(o));});let s=await f.call("setTimeout",n,e)??-1;return console.log("Timer id",s),s>=0&&this.timers.set(s,n),s}async clearTimeout(t){let e=this.timers.get(t);e&&(this.timers.delete(t),this.DOM_EVENT_LISTENERS.delete(e),await f.call("clearTimeout",t));}async setInterval(t,e){let n=L("setInterval"+e);this.DOM_EVENT_LISTENERS.set(n,t);let s=await f.call("setInterval",n,e)??-1;return s>=0&&this.timers.set(s,n),s}async clearInterval(t){let e=this.timers.get(t);e&&(this.timers.delete(t),this.DOM_EVENT_LISTENERS.delete(e),await f.call("clearInterval",t));}async fetch(t,e,n="json"){return await f.call("fetch",t,e,n)}};h(z,"OUIDBridge");var Y=z,f=new Y;globalThis.OUID=f;var b;function dt(a){return a.replace(/-([a-z])/g,(t,e)=>e.toUpperCase())}h(dt,"toCamelCase");function pt(a){return a.replace(/(?!^)([A-Z])/g,(t,e)=>`-${e.toLowerCase()}`)}h(pt,"toSnakeCase");function x(a){return nt(a)?a.value:a}h(x,"normaliseValue");function ft(a){let t={};for(let e=a;e;e=Object.getPrototypeOf(e))Object.getOwnPropertyNames(e).forEach(n=>{let s=a[n];typeof s=="function"&&n!=="constructor"&&!n.startsWith("__")&&!n.endsWith("__")?n in t||(t[n]=s.bind(a)):n!=="constructor"&&!n.startsWith("__")&&!n.endsWith("__")&&(n in t||(t[n]=s));});return t}h(ft,"toObjectWithFunctions");function mt(a){return typeof a=="function"&&!("prototype"in a)}h(mt,"isLazyLoader");var E=class E{constructor(t,e,n,...s){l(this,"app");l(this,"component");l(this,"parentContext");l(this,"bindings",[]);l(this,"directives",[]);l(this,"mountedComponents",new WeakMap);l(this,"componentsRegistry",new S);l(this,"updatingDirectives",false);l(this,"updatingBindings",false);l(this,"stack",[]);l(this,"hydradationActions",new b.BatchActions);this.app=t,this.component=e,this.parentContext=n;for(let o of s)this.stack.push(o);}get hostElement(){return this.component._hostElement}bind(t){this.bindings.push(t);}directive(t){this.directives.push(t);}evaluateExpression(t){return this.resolve(t)}resolve(t,e=true,...n){if(!t)return;let s=this.component.state.value,c={...ft(s)};for(let d of [...this.stack.reverse(),...n])Object.assign(c,d);try{let d=`${e?'"use strict";':""}return ${t};`,p=Object.keys(c),y=new Function(...p,d);return y.bind(this.component),y.apply(this.component,Object.values(c))}catch(d){console.log(this,t),console.error(d);}}updateValue(t,e){t.split(/[\.\[]/)[0]in this.component?this.resolve(`this.${t}=__o_model_value__`,true,{__o_model_value__:e}):this.resolve(`${t}=__o_model_value__`,true,{__o_model_value__:e}),this.component.state.didChange("","","");}push(t){this.stack.unshift(t);}pop(){this.stack.shift();}resolveTag(t){let e=this;for(;;){if(e.componentsRegistry.has(t))return e.componentsRegistry.get(t);if(e=e?.parentContext??null,!e)break}return T.get(t)}async updateBindings(t){if(this.updatingBindings)return;let e=!t;t=t??new b.BatchActions,this.updatingBindings=true,this.bindings.forEach(n=>this.updateBinding(n,t)),e&&await t.commit(),this.updatingBindings=false;}updateBinding(t,e){if(t.type==="model")t.node.setProperty("value",x(t.context.resolve(t.key)));else if(t.type==="interpolation")e.add(async()=>{await t.node.setContentText(t.template?.replace(/\{\{(.*?)\}\}/g,(n,s)=>(s=s.trim(),x(t.context.resolve(s))))??"");});else if(t.type==="attribute"){let n=t.key,s=x(this.resolve(t.template));n==="class"?e.add(()=>this.expandClass(t.node,s)):n==="style"?this.expandStyle(t.node,s):typeof s!="object"&&typeof s!="function"&&typeof s!="symbol"&&typeof s<"u"&&e.add(()=>t.node.setAttribute(n,s.toString()));}else if(t.type==="prop"&&t.context.component){let n=x(this.resolve(t.template));try{t.context.component.props[t.key]=n,t.context.updateBindings(),t.context.updateDirectives();}catch(s){console.error(s);}}}async updateDirectives(t){if(this.updatingDirectives)return;let e=!t;this.updatingDirectives=true,t=t??new b.BatchActions;for(let n of this.directives){if(n.type==="if"){if(!x(n.context.evaluateExpression(n.expr))){if(n.active===false)continue;n.active=false,n.renderedNode&&(n.destroy?(this.unmountComponent(n.node),await n.renderedNode.removeAndRelease()):await n.renderedNode.addClass("oui-hidden"));continue}if(n.active===true)continue;n.active=true;let o=n.renderedNode;if(!o||n.destroy){let c=await n.node.cloneNode(true);n.renderedNode=c,await n.context.render(c),await n.placeholder.after(c),await n.context.hydradationActions.commit();}else await o.removeClass("oui-hidden");}if(n.type==="for"){let s=n.children??new Map,o=new Map,c=h((y,m)=>n.key?x(n.context.resolve(n.key,true,{[n.item]:y})):m,"keyFn"),d=x(n.context.resolve(n.list))||[],p=n.placeholder;for(let y=0;y<d.length;y++){let m=d[y],O=c(m,y),i=s.get(O),r,u;i?(r=i.node,u=i.ctx,console.log("Reusing entry"),u.stack=[{[n.item]:m},...n.context.stack],r.uid!==(await p.nextSibling())?.uid&&await p.after(r),await Promise.all([u.updateBindings(),u.updateDirectives()])):(u=new E(this.app,this.component,this),u.hydradationActions=this.hydradationActions,u.stack=[{[n.item]:m},...n.context.stack],r=await n.node.cloneNode(true),await u.render(r),await p.after(r),u.updateDirectives()),p=r,o.set(O,{node:r,ctx:u});}for(let[y,m]of s.entries())o.has(y)||(this.unmountComponent(m.node),t.add(()=>m.node.removeAndRelease()));n.children=o;}}e&&await t.commit(),await this.hydradationActions.commit(),this.updatingDirectives=false;}async render(t,e){if(!t.hydrated&&!(e?.skipSlotted&&t.hasAttribute("slotted"))){switch(t.type){case "Text":this.handleTextNode(t);break;case "Element":await this.handleElementNode(t,e);break;default:console.warn("Unknown node",t);}await Promise.all([this.updateBindings(),this.updateDirectives()]),this.hydradationActions.add(()=>t.hydrate());}}async expandClass(t,e){let n;typeof e=="object"?Array.isArray(e)?n=e:n=Object.keys(e).filter(s=>e[s]):n=e.toString().split(/\s+/),n.length>0&&await t.addClass(...n);}expandStyle(t,e){let n=e;typeof e=="object"&&!Array.isArray(e)&&(n=Object.keys(e).filter(s=>e[s]).map(s=>`${pt(s)}: ${e[s]}`).join(";")),n&&t.setAttribute("style",n);}expandStandardAttributes(t){let e=t.updates();[...t.attributes].filter(n=>n.name.startsWith(":")).forEach(n=>{let s=n.name.substring(1);this.bind({type:"attribute",node:t,key:s,context:this,template:n.value.trim()}),e.removeAttribute(n.name);}),e.exec();}async handleElementNode(t,e){let n=await t.parentNode(),s=null,o=t.hasAttribute("o-if")?"o-if":t.hasAttribute("o-show")?"o-show":null;if(o){let u=await t.getAttribute(o),v=await OUID.createComment(o+":"+u),w=o==="o-if";await n.insertBefore(v,t),await t.updates().removeAttribute(o).remove().exec(),this.directive({type:"if",expr:u,node:t,placeholder:v,context:this,active:void 0,destroy:w}),s="if";return}if(t.hasAttribute("o-for")){if(s==="if")throw new Error("Can't have o-if and o-for on the same component");let u=await t.getAttribute("o-for"),[v,w]=u.split(" of ").map(I=>I.trim()),g=await OUID.createComment("for:"+u),C=t.attribute(":key")??"";await n?.insertBefore(g,t),await t.updates().removeAttribute("o-for").removeAttribute(":key").remove().exec(),this.directive({type:"for",item:v,list:w,node:t,placeholder:g,context:this,key:C}),s="for";return}let c=t.tag.toLowerCase(),d=this.resolveTag(c),p=t.updates();[...t.attributes].forEach(async u=>{if(u.name==="o-model"){let v=u.value.trim();(t.tag==="input"||t.tag==="textarea")&&(p.setInputValue(x(this.resolve(v))).addEventListener("input",async w=>{let g=await w.target.getProperty("value");this.updateValue(v,g);}),this.bind({node:t,key:v,type:"model",context:this})),p.removeAttribute(u.name);}});let y={},m={},{props:O,events:i}=this.componentAttributes(t,this);if(y=O,m=i,this.expandStandardAttributes(t),Object.keys(m).forEach(async u=>{let v=m[u];d||p.addEventListener(u,w=>{typeof v=="function"&&v.apply(this.component,[w]);}),p.removeAttribute("@"+u);}),await p.exec(),d){await this.mountComponent(t,d,this,y,m);return}let r=await t.childNodes();e?.skipSlotted&&(r=r.filter(u=>!u.hasAttribute("slotted")));for(let u of r)await this.render(u,e);}handleTextNode(t){let e=t.textContent?.match(/\{\{(.*?)\}\}/g);e&&e.forEach(n=>{let s=n.replace(/[{}]/g,"").trim();this.bind({type:"interpolation",node:t,key:s,template:t.textContent,context:this});});}componentAttributes(t,e){let n={},s={},o=["import","interface","module","o-model","o-if","o-for"];return [...t.attributes].filter(c=>!o.includes(c.name)).forEach(c=>{let d=c.name;if(d.startsWith("@")){let m=e?.resolve(c.value,true);if(typeof m!="function")throw new Error("Event handler can only be function");d=d.substring(1),s[d]=m;return}let p=null,y=c.value;d.startsWith(":")&&(p=c.value,d=d.substring(1),y=x(e?.resolve(c.value))),d=dt(d),n[d]={name:d,value:y,expr:p};}),{props:n,events:s}}async mountComponent(t,e,n,s={},o={}){if(this.mountedComponents.has(t))return;let c=new E(this.app,{},this),d={};Object.keys(s).forEach(w=>{let g=s[w];g.expr&&this.bind({type:"prop",node:t,key:w,context:c,template:g.expr}),d[w]=g.value;});let p=await wt(e,d,o);c.component=p,c.stack=[],this.mountedComponents.set(t,p);let y=t.updates();Object.keys(s).filter(w=>!s[w].expr).forEach(w=>y.setAttribute(w,s[w].value));let m=p.hostClasses??[];m&&(m=typeof m=="string"?[m]:m),m.push("o-component-host"),t.tag.toLowerCase()!=="div"&&m.push("c-"+t.tag.toLowerCase()),y.addClass(...m),await y.exec(),await p.decorateHostElement(t);let O=p.use??{};if(Object.keys(O).forEach(w=>{let g=O[w],C=w;c.componentsRegistry.register(C,g);}),p.willMount(),!e.cssInstance){let w=p.style?p.style()?.toString():p.css;w&&(e.cssInstance??(e.cssInstance=await OUID.injectComponentStyles(w)));}let i=e.cssInstance;if(i){let w=E.STYLE_REF.get(i)??0;E.STYLE_REF.set(i,w+1),p.cssInstance=i;}let r=await t.childNodes();if(p.render){let w=await p.render(c);w&&w.attachTo(t);}else await t.setHTML(p.template.trim());let u=await t.queryAll("slot");if(u){let w=u.filter(g=>!g.classes?.includes("hydrated")).map(async g=>{let C=g.attribute("name");for(let I of r.filter(k=>C?C&&k.type==="Element"&&k.attribute("slot")===C:k.type!=="Element"||!k.hasAttribute("slot")))await I.setAttribute("slotted","true"),await g.appendChild(I),await this.render(I);});await Promise.all(w);}p._hostElement=t,p.parent=n?.component??void 0,p.provide(E.PROVIDE_TOKEN,this);let v=await t.childNodes();await Promise.all(v.map(w=>c.render(w,{skipSlotted:true}))),c.updateDirectives(),p.onMounted(),await c.hydradationActions.commit(),p.state.watch(()=>{c.updateBindings(),c.updateDirectives();});}async unmountComponent(t){let e=this.mountedComponents.get(t);if(e){let s=e.cssInstance;if(s){let o=E.STYLE_REF.get(s)??1;o===1?(await OUID.rejectComponentStyles(s),E.STYLE_REF.delete(s)):E.STYLE_REF.set(s,o-1);}e.willUnmount(),e._hostElement=null,e.cssInstance=null;}let n=await t.queryAll("*")??[];for(let s of n)await this.unmountComponent(s);this.mountedComponents.delete(t);}};h(E,"RenderContext"),l(E,"PROVIDE_TOKEN","RENDER_CONTEXT"),l(E,"STYLE_REF",new WeakMap);var j=E;async function Ht(a,t,e=[],n){let s=t??{},o=await OUID.createElement(a,Object.keys(s).reduce((c,d)=>(c[d]=s[d],c),{}));return Object.keys(n??{}).forEach(c=>{o?.addEventListener(c,d=>{let p=n[c];typeof p=="function"&&p(d);});}),new A(o,e)}h(Ht,"node");function wt(a,t,e){return mt(a)?a().then(n=>J(n.default,t,e)):J(a,t,e)}h(wt,"o");function yt(a){return typeof a=="function"}h(yt,"isProvideFunction");var D=class D{constructor(t,e){l(this,"root");l(this,"options");l(this,"providers",new Map);this.root=t,this.options=e,D.currentApp=this;}provide(t,e){if(this.providers.has(t)){console.warn(`[OUID] - Provider ${t} already exists`);return}this.providers.set(t,yt(e)?{provide:e}:{value:e});}inject(t){return this.providers.get(t)?.value}use(t,e){return t.install(this,e),this}async mount(t){if(!globalThis.__OUI_PUR_JS_CONTEXT__)return;this.options?.css&&(console.log("Injecting app css",this.options.css),await OUID.injectComponentStyles(this.options.css)),await OUID.injectComponentStyles(`
+            * {
+            ${t} * {
+                visibility: hidden;
+            }
+            ${t} *.hydrated {
+                visibility: inherit;
+            }
+            .oui-hidden {
+                display: none !important;
+            }
+            `);let e=await OUID.query(t);if(console.log("Mounting app on",e),!e)throw new Error("No selector found for "+t);let n=new j(this,{},null);n.mountComponent(e,this.root,null).then(()=>{n.updateBindings(),n.updateDirectives();});}};h(D,"App"),l(D,"currentApp",null);var $=D;function Jt(a,t){$.currentApp?.provide(a,t);}h(Jt,"provide");function rt(a){return $.currentApp?.inject(a)??void 0}h(rt,"inject");function vt(a,t,e,n){var s=arguments.length,o=s<3?t:n===null?n=Object.getOwnPropertyDescriptor(t,e):n,c;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")o=Reflect.decorate(a,t,e,n);else for(var d=a.length-1;d>=0;d--)(c=a[d])&&(o=(s<3?c(o):s>3?c(t,e,o):c(t,e))||o);return s>3&&o&&Object.defineProperty(t,e,o),o}h(vt,"_ts_decorate");var Z=class Z extends _{constructor(){super(...arguments);l(this,"router");}willMount(){}onMounted(){this.router=gt(),console.log("Router mounted"),this.router?.bind(this).then(e=>{e?.();});}willUnmount(){console.log("Router will unmount"),this.router?.unbind();}};h(Z,"ORouter");var M=Z;M=vt([st({tag:"o-router",template:`
         <div id="router-view"></div>
-    `})],D);var Q="OROUTER_TOKEN",V="ACTIVE_ROUTE";function ut(){return z(Q)}h(ut,"useRouter");function Pt(a){return new H(a)}h(Pt,"createRouter");function G(a,t){let e=new X(a.path).reverse(t);return e===false?"":e}h(G,"generatePath");var W=class W{constructor(t){u(this,"routes");u(this,"windowObject",null);u(this,"guards",[]);u(this,"eventRegistration",null);this.routes=t;}install(t){t.provide(Q,this);}resolve(t){let e=new X(t),n=t.split("?").reverse()[0].split("&").reduce((s,c)=>{let o=c.split("=");return s[o[0]]=decodeURIComponent(o[1]),s},{});for(let s of this.routes){let c=e.match(s.path);if(c)return {route:s,params:c,query:n}}return null}push(t){if(!t.path&&!t.name){console.warn("[OUID-Router]: no path or name provided to push");return}if(t.name){let e=this.routes.find(s=>s.name===t.name);if(!e){console.warn("[OUID-Router]: No matched route name found");return}let n=G(e,t.params??{});this.windowObject?.invoke("history.pushState",{},"",n),this.windowObject?.dispatchEvent("popstate","PopStateEvent",{state:{}});return}if(t.absolute&&t.path&&this.windowObject?.invoke("history.pushState",{},"",t.path),t.path){let e=this.routes.find(n=>n.path===t.path);if(e){let n=G(e,t.params??{});this.windowObject?.invoke("history.pushState",{},"",n),this.windowObject?.dispatchEvent("popstate","PopStateEvent",{state:{}});return}}}async beforeRouteGoing(t,e){for(let n of this.guards.filter(s=>s.type==="before")){let s=await n.fn(t,e);if(s)return s}}async afterRouteGoing(t,e){for(let n of this.guards.filter(s=>s.type==="after")){let s=await n.fn(t,e);if(s)return s}}async bind(t){this.windowObject=await OUID.acquireObject("window");let e=h(async()=>{console.log("Handling routing",this);let n=await this.windowObject?.getProperty("location.pathname"),s=this.resolve(n);if(console.log("Matched::",s),!s){console.warn(`[Router] No route found for: ${n}`);return}let c=await this.beforeRouteGoing({url:n,path:n,name:s.route.name},t.inject(V));if(c){typeof c=="object"&&"name"in c&&this.push({name:c.name,params:c.params});return}let o=t.inject(x.PROVIDE_TOKEN),l=await o?.hostElement.query("#router-view");console.log("Outlet",l),l&&(l.innerHTML="",t.provide(V,{params:s.params,query:s.query}),await o?.mountComponent(l,s.route.component,o),await this.afterRouteGoing({url:n,path:n,name:s.route.name},t.inject(V)));},"handler");return this.eventRegistration=await this.windowObject.addEventListener("popstate",e.bind(this)),e}unbind(t){this.eventRegistration&&this.windowObject?.dettachEventListener("popstate",this.eventRegistration);}beforeEach(t){let e={fn:t,type:"before"};return this.guards.push(e),()=>{this.guards.splice(this.guards.indexOf(e));}}afterEach(t){let e={fn:t,type:"after"};return this.guards.push(e),()=>{this.guards.splice(this.guards.indexOf(e));}}};h(W,"Router");var H=W;function T(a){let t=Date.now();return `${(1e3+Math.floor(Math.random()*9e3)+a.length).toString(16)}-${t.toString(16)}`}h(T,"generateUIID");(function(a){var s,c,o;let t=(s=class{constructor(r,i){u(this,"uid");u(this,"tag");this.uid=r,this.tag=i;}async addEventListener(r,i){return p.addEventListener(this,r,i)}async dettachEventListener(r,i){await p.dettachEventListener(this,r,i);}async invoke(r,...i){await p.call("invokeObjectMethod",this.uid,r,...i);}async getProperty(r){return await p.call("getObjectProperty",this.uid,r)}async setProperty(r,i){await p.call("setObjectProperty",this.uid,r,i);}async dispatchEvent(r,i,d){await p.call("dispatchEvent",this.uid,r,i,d);}},h(s,"OObject"),s);a.OObject=t;let e=(c=class extends t{constructor(i){super(i.uid,i.tag);u(this,"textContent");u(this,"type","Unknown");u(this,"attributes");u(this,"children");u(this,"classes");u(this,"style");for(let d in i)this[d]=i[d];this.attributes??(this.attributes=[]),this.classes??(this.classes=[]),this.style??(this.style="");}},h(c,"ONode"),c);a.ONode=e;let n=(o=class extends e{constructor(r){super(r);}async addClass(r){await p.call("addClass",this.uid,r);}async setAttribute(r,i){let d=await p.call("setAttribute",this.uid,r,i);d&&(this.attributes=d);}async removeAttribute(r){let i=await p.call("removeAttribute",this.uid,r);i&&(this.attributes=i);}async appendChild(r){await p.call("appendChild",this.uid,r.uid);}set innerHTML(r){this.setHTML(r);}async cloneNode(r){let i=await p.call("cloneNode",this.uid,r);return i?new o(i):null}async remove(){await p.call("removeNode",this.uid);}async removeChild(r){await p.call("removeChild",this.uid,r.uid);}async replaceChildNode(r,i){await p.call("removeChild",this.uid,r.uid,i.uid);}async replaceWith(r){await p.call("replaceWith",this.uid,r.uid);}async after(r){await p.call("insertAfter",this.uid,r.uid);}async setHTML(r){await p.call("setInnerHTML",this.uid,r);}async HTML(){return await p.call("getInnerHTML",this.uid)??""}async setInnerText(r){await await p.call("setInnerText",this.uid,r);}async setContentText(r){await await p.call("setContentText",this.uid,r);}async getContentText(){return await p.call("getContentText",this.uid)??""}async content(){try{return await p.call("getInnerText",this.uid)??""}catch(r){return console.error(r),""}}async childNodes(){return (await p.call("childNodes",this.uid))?.map(r=>new o(r))??[]}hasAttribute(r){return !!this.attributes.find(i=>i.name===r)}async getAttribute(r){return await p.call("getAttribte",this.uid,r)??""}attribute(r){return this.attributes.find(i=>i.name===r)?.value??null}async getAttributeNames(){return await p.call("getAttributeNames",this.uid)??[]}async parentNode(){let r=await p.call("parentNode",this.uid);return r?new o(r):null}async insertBefore(r,i){return await p.call("insertBefore",this.uid,i.uid,r.uid)}async setInputValue(r){await p.call("setInputValue",this.uid,r);}async inputValue(r){return await p.call("inputValue",this.uid,r)??""}async query(r,i){return await p.query(r,i,this.uid)}async queryAll(r,i){return await p.queryAll(r,i,this.uid)}async release(){await p.call("releaseNode",this.uid);}},h(o,"OElement"),o);a.OElement=n;})(v||(v={}));function Wt(){return function(a,t,e){e.value;e.value=async(...s)=>{let c=s[0];try{let o=await p.invoke(t,[{props:c.getSafePropsForNative}]);console.log("result from native function"),c.setSafePropsFromNative;}catch{console.error("Failed to invoke native function");}};}}h(Wt,"Native");var B=class B{constructor(){u(this,"callbacks",new Map);u(this,"DOM_EVENT_LISTENERS",new Map);u(this,"timers",new Map);u(this,"_config");u(this,"listeners",new Map);this.subscribe("__ouid_native_event_success__",(t,e)=>{let n=this.callbacks.get(t);if(n)return this.callbacks.delete(t),n.success(...JSON.parse(e))}),this.subscribe("__ouid_native_event_error__",(t,e)=>{let n=this.callbacks.get(t);if(n)return console.error("Failure:",t,e),this.callbacks.delete(t),n.error(...JSON.parse(e))}),this.subscribe("__ouid_web_event__",(t,e)=>{let n=this.DOM_EVENT_LISTENERS.get(t);if(n){let c=JSON.parse(e)[1];return c&&(c.target=c?.target?new v.OElement(c.target):null),n(c)}});}config(t){return this._config=t,this}invoke(t,...e){let n=T(t);return new Promise((s,c)=>{this.callbacks.set(n,{success:s,error:c});try{if(!WebOUID)throw new Error("NativeOUID bridge not available");WebOUID.invoke(n,t,JSON.stringify(e));}catch(o){console.error(o),this.callbacks.delete(n);}})}async call(t,...e){try{return (await this.invoke(`_ouid_${t}`,...e)).data}catch(n){return console.error(n),null}}emit(t,e){WebOUID?.invoke("event",t,JSON.stringify(e));}subscribe(t,e){this.listeners.has(t)||(this.listeners.set(t,[]),globalThis[t]=(n,s)=>{this.listeners.get(t)?.forEach(c=>c(n,s));}),this.listeners.get(t).push(e);}async query(t,e,n){let s=await this.call("query",t,e,n);return s?new v.OElement(s):null}async queryAll(t,e,n){let s=await this.call("queryAll",t,e,n);return s?s.map(c=>new v.OElement(c)):[]}async createdElement(t,e={}){let n=await this.call("createElement",t,e);return n?new v.OElement(n):null}async createComment(t){let e=await this.call("createComment",t);return e?new v.OElement(e):null}async addEventListener(t,e,n){let s=T(e+(typeof t=="string"?t:t.tag));return this.DOM_EVENT_LISTENERS.set(s,n),await p.call("attachEventListener",typeof t=="string"?t:t.uid,s,e),s}async dettachEventListener(t,e,n){this.DOM_EVENT_LISTENERS.delete(n),await p.call("dettachEventListener",typeof t=="string"?t:t.uid,n,e);}async injectComponentStyles(t){let e=await p.call("injectComponentStyles",t);return e?new v.OElement(e):null}async rejectComponentStyles(t){await p.call("rejectComponentStyles",t.uid);}async getOObject(t){let e=await p.call("getOObject",t);return e?new v.OObject(e.uid,e.tag):null}async acquireObject(t){let e=await p.call("acquireObject",t);return e?new v.OObject(e.uid,e.tag):null}async setTimeout(t,e){let n=T("setTimeout"+e);this.DOM_EVENT_LISTENERS.set(n,t);let s=await p.call("setTimeout",n,e)??-1;return console.log("Timer id",s),s>=0&&this.timers.set(s,n),s}async clearTimeout(t){let e=this.timers.get(t);e&&(this.DOM_EVENT_LISTENERS.delete(e),await p.call("clearTimeout",t));}async setInterval(t,e){let n=T("setInterval"+e);this.DOM_EVENT_LISTENERS.set(n,t);let s=await p.call("setInterval",n,e)??-1;return s>=0&&this.timers.set(s,n),s}async clearInterval(t){let e=this.timers.get(t);e&&(this.DOM_EVENT_LISTENERS.delete(e),await p.call("clearInterval",t));}};h(B,"OUIDBridge");var $=B,p=new $;globalThis.OUID=p;var v;function Jt(){return O.getAll().reduce((t,[e,n])=>(t[e]=n,t),{})}h(Jt,"components");export{V as ACTIVE_ROUTE_TOKEN,A as App,K as Component,I as Emits,Wt as Native,S as OComponent,v as ODOM,p as OUID,$ as OUIDBridge,Q as ROUTER_INJECTION_TOKEN,x as RenderContext,H as Router,D as RouterComponent,N as State,C as Stated,Jt as components,U as createComponent,Pt as createRouter,z as inject,J as isStated,at as o,Nt as provide,nt as stated,ut as useRouter};//# sourceMappingURL=index.js.map
+    `,css:`
+      #router-view {
+        height: 100%;
+    }
+    `})],M);var at="OROUTER_TOKEN",G="ACTIVE_ROUTE";function gt(){return rt(at)}h(gt,"useRouter");function Qt(a){return new X(a)}h(Qt,"createRouter");function it(a,t){let e=new ot(a.path).reverse(t);return e===false?"":e}h(it,"generatePath");var Q=class Q{constructor(t){l(this,"routes");l(this,"windowObject",null);l(this,"guards",[]);l(this,"eventRegistration",null);this.routes=t;}install(t){t.provide(at,this),OUID.registerComponent("o-router",M);}resolve(t){let e=new ot(t),n=t.split("?").reverse()[0].split("&").reduce((s,o)=>{let c=o.split("=");return s[c[0]]=decodeURIComponent(c[1]),s},{});for(let s of this.routes){let o=e.match(s.path);if(o)return {route:s,params:o,query:n}}return null}push(t){if(!t.path&&!t.name){console.warn("[OUID-Router]: no path or name provided to push");return}if(t.name){let e=this.routes.find(s=>s.name===t.name);if(!e){console.warn("[OUID-Router]: No matched route name found");return}let n=it(e,t.params??{});this.windowObject?.invoke("history.pushState",{},"",n),this.windowObject?.dispatchEvent("popstate","PopStateEvent",{state:{}});return}if(t.absolute&&t.path&&this.windowObject?.invoke("history.pushState",{},"",t.path),t.path){let e=this.routes.find(n=>n.path===t.path);if(e){let n=it(e,t.params??{});this.windowObject?.invoke("history.pushState",{},"",n),this.windowObject?.dispatchEvent("popstate","PopStateEvent",{state:{}});return}}}pop(){this.windowObject?.invoke("history.back"),this.windowObject?.dispatchEvent("popstate","PopStateEvent",{state:{}});}async beforeRouteGoing(t,e){for(let n of this.guards.filter(s=>s.type==="before")){let s=await n.fn(t,e);if(s)return s}}async afterRouteGoing(t,e){for(let n of this.guards.filter(s=>s.type==="after")){let s=await n.fn(t,e);if(s)return s}}async bind(t){this.windowObject=await OUID.acquireObject("window");let e=h(async()=>{console.log("Handling routing",this);let n=await this.windowObject?.getProperty("location.pathname"),s=this.resolve(n);if(console.log("Matched::",s),!s){console.warn(`[Router] No route found for: ${n}`);return}let o=await this.beforeRouteGoing({url:n,path:n,name:s.route.name},t.inject(G));if(o){typeof o=="object"&&"name"in o&&this.push({name:o.name,params:o.params});return}let c=t.inject(j.PROVIDE_TOKEN),d=await c?.hostElement.query("#router-view");console.log("Outlet",d),d&&(d.innerHTML="",t.provide(G,{params:s.params,query:s.query}),await c?.mountComponent(d,s.route.component,c),await this.afterRouteGoing({url:n,path:n,name:s.route.name},t.inject(G)));},"handler");return this.eventRegistration=await this.windowObject.addEventListener("popstate",e.bind(this)),e}unbind(){this.eventRegistration&&this.windowObject?.dettachEventListener("popstate",this.eventRegistration);}beforeEach(t){let e={fn:t,type:"before"};return this.guards.push(e),()=>{this.guards.splice(this.guards.indexOf(e));}}afterEach(t){let e={fn:t,type:"after"};return this.guards.push(e),()=>{this.guards.splice(this.guards.indexOf(e));}}};h(Q,"Router");var X=Q;var tt=class tt extends _{render(t){return A.of('<i class="o-icon"><slot></slot></i>')}style(){return V.of({i:`
+                display: inline-block;
+                width: 1em;
+                height: 1em;
+                vertical-align: -0.15em;
+                overflow: hidden;
+            `})}};h(tt,"OIcon");var ct=tt;function oe(){return T.getAll().reduce((t,[e,n])=>(t[e]=n,t),{})}h(oe,"components");export{G as ACTIVE_ROUTE_TOKEN,$ as App,st as Component,P as Emits,Mt as Native,_ as OComponent,b as ODOM,ct as OIcon,M as ORouter,f as OUID,Y as OUIDBridge,at as ROUTER_INJECTION_TOKEN,j as RenderContext,A as RenderNode,X as Router,U as State,N as Stated,V as StyleData,oe as components,J as createComponent,Qt as createRouter,rt as inject,nt as isStated,Ht as node,wt as o,Jt as provide,ut as stated,gt as useRouter};//# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map