@ibyar/core 0.4.2 → 0.5.0

package/README.md

@@ -19,6 +19,7 @@
 Aurora API is the base of this project
 Implements Aurora's core functionality, low-level services, and utilities.
  - Defines the class infrastructure for components, view, model change detection, rendering, and event handling.
+ - Data Binding for inputs and outputs.
  - Defines the decorators that supply metadata.
  - Defines infrastructure for dependency injection (DI).
 

package/annotation/decorators.d.ts

@@ -1,9 +1,8 @@
 import type { TypeOf } from '../utils/typeof.js';
-import { DOMNode, DOMRenderNode } from '@ibyar/elements';
+import { DomNode, DomRenderNode } from '@ibyar/elements';
 import { TemplateUrl } from '../utils/path.js';
 export interface DirectiveOptions {
     selector: string;
-    nextSiblingDirectives?: string[];
 }
 export interface ServiceOptions {
     provideIn?: TypeOf<CustomElementConstructor> | 'root' | 'platform' | 'any';
@@ -15,7 +14,7 @@ export interface PipeOptions {
 export interface ComponentOptions<T = Function> {
     selector: string;
     templateUrl?: TemplateUrl | string;
-    template?: string | DOMNode | DOMRenderNode<T> | Promise<string>;
+    template?: string | DomNode | DomRenderNode<T> | Promise<string>;
     styles?: string | {
         [key: string]: string;
     }[];

package/annotation/decorators.js.map

@@ -1 +1 @@
-{"version":3,"file":"decorators.js","sourceRoot":"","sources":["../../../src/core/annotation/decorators.ts"],"names":[],"mappings":"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","sourcesContent":["import type { TypeOf } from '../utils/typeof.js';\nimport { DOMNode, DOMRenderNode } from '@ibyar/elements';\nimport { Components } from '../component/component.js';\nimport { fetchHtml, TemplateUrl } from '../utils/path.js';\n\nexport interface DirectiveOptions {\n\tselector: string;\n\tnextSiblingDirectives?: string[];\n}\n\nexport interface ServiceOptions {\n\tprovideIn?: TypeOf<CustomElementConstructor> | 'root' | 'platform' | 'any';\n}\n\nexport interface PipeOptions {\n\tname: string;\n\tasynchronous?: boolean;\n}\n\nexport interface ComponentOptions<T = Function> {\n\t/**\n\t * a tag name for the component,\n\t * if the tag name is valid custom element name, the view class will be a custom element,\n\t * otherwise an HTMLUnknownElement will be created\n\t */\n\tselector: string;\n\n\t/**\n\t * add html file url path to fetch,\n\t * templateUrl had propriety than template, and will override it.\n\t *\n\t * Can provide file name as \"person-view.html\" will resolved \n\t * as 'http://site-address.org/persin-view.html',\n\t * \n\t * OR as an object { moduleMeta: import.meta, filename: 'person-edit.html' }\n\t *  let (import.meta = '/person/person.js') will resolved \n\t * as 'http://site-address.org/person/person-edit.html',\n\t * \n\t * OR as an object { moduleMeta: import.meta }\n\t * let (import.meta = '/person/person.js') will resolved as 'http://site-address.org/person/person.html'.\n\t * \n\t * if url not found, component will not be defined,\n\t * \n\t * if you didn't use webpack or rollup.js or any bundler, \n\t * you should copy the html files to its folder by yourself. \n\t */\n\ttemplateUrl?: TemplateUrl | string;\n\t/**\n\t * template: typeof 'string' ==> html string,\n\t * \t\t\t TypeOf 'DomRootRenderNode<T>' ==> JSX, create factory\n\t * \tif template === null || undefined ==> it had nothing to render, \n\t * and may be inherit from an html element\n\t * \n\t * 2 possible way to write a template, as inline string, represent a a valid html, \n\t * or us aurora jsx factory \n\t * \t\t\t\t\n\t */\n\ttemplate?: string | DOMNode | DOMRenderNode<T> | Promise<string>;\n\t/**\n\t * style for this element\n\t */\n\tstyles?: string | { [key: string]: string }[];\n\t/**\n\t * what basic element should the new component inherit from,\n\t * the tag name to inherit from as 'a', 'div', 'table', 'td', 'th', 'tr', etc ...\n\t */\n\textend?: string;\n\n\t/**\n\t * An encapsulation policy for the template and CSS styles. One of:\n\t *  'custom': Use global CSS without any encapsulation.\n\t *  'shadow-dom': Use Shadow DOM v1 to encapsulate styles.\n\t * \n\t *  'template': like 'custom', with load the template from the document ('index.html' file)\n\t * \t \t\t\tthat had the same id as the component \"selector\".\n\t *  'shadow-dom-template': like 'shadowDom', and load template by selector id.\n\t * \n\t * Both 'template' & 'shadow-dom-template' encapsulation type:\n\t *  should had attributes name like lowercase,\n\t * \tthe browser itself, will convert all attributes to lowercase\n\t * \n\t * ```typescript\n\t *\t\t@Input('personage') personAge: number;\n\t *\t\t@Input('propname') propName: string;\n\t *\t\t@Output('savebuttonclick') saveButtonClick = new EventEmitter<Persons>();\n\t *\t\t@View('personform') personForm: HTMLFormElement;\n\t * ```\n\t * \n\t * any root element as \n\t * \n\t * ```html\n\t * <root-app></root-app>\n\t * ```\n\t * \n\t * the supported bind options is 'One way binding *(as passing data only)'\n\t *  and 'template parsing' and 'event binding' syntax, HTML (angular) like.\n\t * it load its attributes from 'window object'\n\t * \n\t * so to pass date to A root element, \n\t * \n\t * ```html\n\t * <script>\n\t * \tlet appVersion = '0.1.504';\n\t * \tfunction onRootAppClick() {\n\t *\t\tconsole.log('root app clicked');\n\t * \t}\n\t * \tfunction onSave(data){\n\t *\t\tconsole.log('root app save', data);\n\t * \t}\n\t * </script>\n\t * <root-app [version]=\"appVersion\" \n\t * \t\tonclick=\"onRootAppClick()\"\n\t * \t\t(save)=\"onSave()\" ></root-app>\n\t * ```\n\t * \n\t * default is 'custom'\n\t * @type {'custom' | 'shadowDom' | 'template' | 'shadowDom-template'}\n\t */\n\tencapsulation?: 'custom' | 'shadow-dom' | 'template' | 'shadow-dom-template';\n\n\t/**\n\t * default: 'open'\n\t */\n\tshadowDomMode?: ShadowRootMode;\n\n\t/**\n\t * default: false\n\t */\n\tshadowDomDelegatesFocus?: boolean;\n}\n\nexport interface ChildOptions {\n\t[key: string]: any;\n}\n\nexport interface ViewChildOpt {\n\tselector: string | typeof HTMLElement | CustomElementConstructor;\n\tchildOptions?: ChildOptions;\n}\n\nexport function Input(name?: string): Function {\n\treturn (target: Object, propertyKey: string) => {\n\t\tComponents.addInput(target, propertyKey, name || propertyKey);\n\t};\n}\nexport function Output(name?: string): Function {\n\treturn (target: Object, propertyKey: string) => {\n\t\tComponents.addOutput(target, propertyKey, name || propertyKey);\n\t};\n}\n\nexport function View(): Function {\n\treturn (target: Object, propertyKey: string) => {\n\t\tComponents.setComponentView(target, propertyKey);\n\t};\n}\n\nexport function ViewChild(selector: string | typeof HTMLElement | CustomElementConstructor,\n\tchildOptions?: ChildOptions): Function {\n\treturn (target: Object, propertyKey: string) => {\n\t\tComponents.addViewChild(target, propertyKey, selector, childOptions);\n\t};\n}\n\nexport function ViewChildren(selector: string | typeof HTMLElement | CustomElementConstructor): Function {\n\treturn (target: Object, propertyKey: string) => {\n\t\tComponents.addViewChildren(target, propertyKey, selector);\n\t};\n}\n\nexport function HostListener(eventName: string, args?: string[]): Function {\n\treturn (target: Object, propertyKey: string) => {\n\t\tComponents.addHostListener(\n\t\t\ttarget,\n\t\t\tpropertyKey,\n\t\t\teventName,\n\t\t\targs || []\n\t\t);\n\t};\n}\n\nexport function HostBinding(hostPropertyName: string): Function {\n\treturn (target: Object, propertyKey: string) => {\n\t\tComponents.addHostBinding(target, propertyKey, hostPropertyName);\n\t};\n}\n\nexport function Pipe(opt: PipeOptions): Function {\n\treturn (target: Function) => {\n\t\tComponents.definePipe(target, opt);\n\t\treturn target;\n\t};\n}\n\nexport function Service(opt: ServiceOptions): Function {\n\treturn (target: Function) => {\n\t\tComponents.defineService(target, opt);\n\t\treturn target;\n\t};\n}\nexport function Directive(opt: DirectiveOptions): Function {\n\treturn (target: Function) => {\n\t\tComponents.defineDirective(target, opt);\n\t\treturn target;\n\t};\n}\n\nexport function Component<T extends object>(opt: ComponentOptions<T>): Function {\n\treturn (target: TypeOf<T>) => {\n\t\tif (opt.templateUrl) {\n\t\t\tfetchHtml(opt.templateUrl)\n\t\t\t\t.then(htmlTemplate => {\n\t\t\t\t\tif (htmlTemplate) {\n\t\t\t\t\t\topt.template = htmlTemplate;\n\t\t\t\t\t\tComponents.defineComponent(target, opt);\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t\t.catch(reason => {\n\t\t\t\t\tconsole.error(`Error @URL: ${opt.templateUrl}, for model Class: ${target.name},\\n Reason: ${reason}.`);\n\t\t\t\t});\n\t\t} else {\n\t\t\tComponents.defineComponent(target, opt);\n\t\t}\n\t\treturn target;\n\t};\n}\n\nexport function SelfSkip(name?: string): Function {\n\treturn (target: Function, propertyKey: string, index: number) => {\n\t\tlet metadata = Reflect.getMetadata('selfskip', target, propertyKey);\n\t\tif (!metadata) {\n\t\t\tmetadata = {};\n\t\t\tReflect.defineMetadata('selfskip', metadata, target, propertyKey);\n\t\t}\n\t\tmetadata[index] = name;\n\t};\n}\n\nexport function Optional(): Function {\n\treturn (target: Function, propertyKey: string, index: number) => {\n\t\tlet metadata = Reflect.getMetadata('optional', target, propertyKey);\n\t\tif (!metadata) {\n\t\t\tmetadata = {};\n\t\t\tReflect.defineMetadata('optional', metadata, target, propertyKey);\n\t\t}\n\t\tmetadata[index] = true;\n\t};\n}\n"]}
+{"version":3,"file":"decorators.js","sourceRoot":"","sources":["../../../src/core/annotation/decorators.ts"],"names":[],"mappings":"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","sourcesContent":["import type { TypeOf } from '../utils/typeof.js';\nimport { DomNode, DomRenderNode } from '@ibyar/elements';\nimport { Components } from '../component/component.js';\nimport { fetchHtml, TemplateUrl } from '../utils/path.js';\n\nexport interface DirectiveOptions {\n\tselector: string;\n}\n\nexport interface ServiceOptions {\n\tprovideIn?: TypeOf<CustomElementConstructor> | 'root' | 'platform' | 'any';\n}\n\nexport interface PipeOptions {\n\tname: string;\n\tasynchronous?: boolean;\n}\n\nexport interface ComponentOptions<T = Function> {\n\t/**\n\t * a tag name for the component,\n\t * if the tag name is valid custom element name, the view class will be a custom element,\n\t * otherwise an HTMLUnknownElement will be created\n\t */\n\tselector: string;\n\n\t/**\n\t * add html file url path to fetch,\n\t * templateUrl had propriety than template, and will override it.\n\t *\n\t * Can provide file name as \"person-view.html\" will resolved \n\t * as 'http://site-address.org/persin-view.html',\n\t * \n\t * OR as an object { moduleMeta: import.meta, filename: 'person-edit.html' }\n\t *  let (import.meta = '/person/person.js') will resolved \n\t * as 'http://site-address.org/person/person-edit.html',\n\t * \n\t * OR as an object { moduleMeta: import.meta }\n\t * let (import.meta = '/person/person.js') will resolved as 'http://site-address.org/person/person.html'.\n\t * \n\t * if url not found, component will not be defined,\n\t * \n\t * if you didn't use webpack or rollup.js or any bundler, \n\t * you should copy the html files to its folder by yourself. \n\t */\n\ttemplateUrl?: TemplateUrl | string;\n\t/**\n\t * template: typeof 'string' ==> html string,\n\t * \t\t\t TypeOf 'DomRootRenderNode<T>' ==> JSX, create factory\n\t * \tif template === null || undefined ==> it had nothing to render, \n\t * and may be inherit from an html element\n\t * \n\t * 2 possible way to write a template, as inline string, represent a a valid html, \n\t * or us aurora jsx factory \n\t * \t\t\t\t\n\t */\n\ttemplate?: string | DomNode | DomRenderNode<T> | Promise<string>;\n\t/**\n\t * style for this element\n\t */\n\tstyles?: string | { [key: string]: string }[];\n\t/**\n\t * what basic element should the new component inherit from,\n\t * the tag name to inherit from as 'a', 'div', 'table', 'td', 'th', 'tr', etc ...\n\t */\n\textend?: string;\n\n\t/**\n\t * An encapsulation policy for the template and CSS styles. One of:\n\t *  'custom': Use global CSS without any encapsulation.\n\t *  'shadow-dom': Use Shadow DOM v1 to encapsulate styles.\n\t * \n\t *  'template': like 'custom', with load the template from the document ('index.html' file)\n\t * \t \t\t\tthat had the same id as the component \"selector\".\n\t *  'shadow-dom-template': like 'shadowDom', and load template by selector id.\n\t * \n\t * Both 'template' & 'shadow-dom-template' encapsulation type:\n\t *  should had attributes name like lowercase,\n\t * \tthe browser itself, will convert all attributes to lowercase\n\t * \n\t * ```typescript\n\t *\t\t@Input('personage') personAge: number;\n\t *\t\t@Input('propname') propName: string;\n\t *\t\t@Output('savebuttonclick') saveButtonClick = new EventEmitter<Persons>();\n\t *\t\t@View('personform') personForm: HTMLFormElement;\n\t * ```\n\t * \n\t * any root element as \n\t * \n\t * ```html\n\t * <root-app></root-app>\n\t * ```\n\t * \n\t * the supported bind options is 'One way binding *(as passing data only)'\n\t *  and 'template parsing' and 'event binding' syntax, HTML (angular) like.\n\t * it load its attributes from 'window object'\n\t * \n\t * so to pass date to A root element, \n\t * \n\t * ```html\n\t * <script>\n\t * \tlet appVersion = '0.1.504';\n\t * \tfunction onRootAppClick() {\n\t *\t\tconsole.log('root app clicked');\n\t * \t}\n\t * \tfunction onSave(data){\n\t *\t\tconsole.log('root app save', data);\n\t * \t}\n\t * </script>\n\t * <root-app [version]=\"appVersion\" \n\t * \t\tonclick=\"onRootAppClick()\"\n\t * \t\t(save)=\"onSave()\" ></root-app>\n\t * ```\n\t * \n\t * default is 'custom'\n\t * @type {'custom' | 'shadowDom' | 'template' | 'shadowDom-template'}\n\t */\n\tencapsulation?: 'custom' | 'shadow-dom' | 'template' | 'shadow-dom-template';\n\n\t/**\n\t * default: 'open'\n\t */\n\tshadowDomMode?: ShadowRootMode;\n\n\t/**\n\t * default: false\n\t */\n\tshadowDomDelegatesFocus?: boolean;\n}\n\nexport interface ChildOptions {\n\t[key: string]: any;\n}\n\nexport interface ViewChildOpt {\n\tselector: string | typeof HTMLElement | CustomElementConstructor;\n\tchildOptions?: ChildOptions;\n}\n\nexport function Input(name?: string): Function {\n\treturn (target: Object, propertyKey: string) => {\n\t\tComponents.addInput(target, propertyKey, name || propertyKey);\n\t};\n}\nexport function Output(name?: string): Function {\n\treturn (target: Object, propertyKey: string) => {\n\t\tComponents.addOutput(target, propertyKey, name || propertyKey);\n\t};\n}\n\nexport function View(): Function {\n\treturn (target: Object, propertyKey: string) => {\n\t\tComponents.setComponentView(target, propertyKey);\n\t};\n}\n\nexport function ViewChild(selector: string | typeof HTMLElement | CustomElementConstructor,\n\tchildOptions?: ChildOptions): Function {\n\treturn (target: Object, propertyKey: string) => {\n\t\tComponents.addViewChild(target, propertyKey, selector, childOptions);\n\t};\n}\n\nexport function ViewChildren(selector: string | typeof HTMLElement | CustomElementConstructor): Function {\n\treturn (target: Object, propertyKey: string) => {\n\t\tComponents.addViewChildren(target, propertyKey, selector);\n\t};\n}\n\nexport function HostListener(eventName: string, args?: string[]): Function {\n\treturn (target: Object, propertyKey: string) => {\n\t\tComponents.addHostListener(\n\t\t\ttarget,\n\t\t\tpropertyKey,\n\t\t\teventName,\n\t\t\targs || []\n\t\t);\n\t};\n}\n\nexport function HostBinding(hostPropertyName: string): Function {\n\treturn (target: Object, propertyKey: string) => {\n\t\tComponents.addHostBinding(target, propertyKey, hostPropertyName);\n\t};\n}\n\nexport function Pipe(opt: PipeOptions): Function {\n\treturn (target: Function) => {\n\t\tComponents.definePipe(target, opt);\n\t\treturn target;\n\t};\n}\n\nexport function Service(opt: ServiceOptions): Function {\n\treturn (target: Function) => {\n\t\tComponents.defineService(target, opt);\n\t\treturn target;\n\t};\n}\nexport function Directive(opt: DirectiveOptions): Function {\n\treturn (target: Function) => {\n\t\tComponents.defineDirective(target, opt);\n\t\treturn target;\n\t};\n}\n\nexport function Component<T extends object>(opt: ComponentOptions<T>): Function {\n\treturn (target: TypeOf<T>) => {\n\t\tif (opt.templateUrl) {\n\t\t\tfetchHtml(opt.templateUrl)\n\t\t\t\t.then(htmlTemplate => {\n\t\t\t\t\tif (htmlTemplate) {\n\t\t\t\t\t\topt.template = htmlTemplate;\n\t\t\t\t\t\tComponents.defineComponent(target, opt);\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t\t.catch(reason => {\n\t\t\t\t\tconsole.error(`Error @URL: ${opt.templateUrl}, for model Class: ${target.name},\\n Reason: ${reason}.`);\n\t\t\t\t});\n\t\t} else {\n\t\t\tComponents.defineComponent(target, opt);\n\t\t}\n\t\treturn target;\n\t};\n}\n\nexport function SelfSkip(name?: string): Function {\n\treturn (target: Function, propertyKey: string, index: number) => {\n\t\tlet metadata = Reflect.getMetadata('selfskip', target, propertyKey);\n\t\tif (!metadata) {\n\t\t\tmetadata = {};\n\t\t\tReflect.defineMetadata('selfskip', metadata, target, propertyKey);\n\t\t}\n\t\tmetadata[index] = name;\n\t};\n}\n\nexport function Optional(): Function {\n\treturn (target: Function, propertyKey: string, index: number) => {\n\t\tlet metadata = Reflect.getMetadata('optional', target, propertyKey);\n\t\tif (!metadata) {\n\t\t\tmetadata = {};\n\t\t\tReflect.defineMetadata('optional', metadata, target, propertyKey);\n\t\t}\n\t\tmetadata[index] = true;\n\t};\n}\n"]}

package/binding/binding.expressions.d.ts

@@ -0,0 +1,32 @@
+import { ExpressionNode, InfixExpressionNode, ScopeSubscription, Stack, ScopeContext, MemberExpression, Identifier } from '@ibyar/expressions';
+declare type OneWayOperator = ':=';
+declare type TwoWayOperator = ':=:';
+declare type BindingOperators = OneWayOperator | TwoWayOperator;
+export interface BindingAssignment extends InfixExpressionNode<BindingOperators> {
+    subscribe(stack: Stack, pipelineNames?: string[]): ScopeSubscription<ScopeContext>[];
+}
+export declare class OneWayAssignmentExpression extends InfixExpressionNode<OneWayOperator> implements BindingAssignment {
+    private rightEvents;
+    constructor(left: MemberExpression, right: ExpressionNode);
+    set(stack: Stack, value: any): any;
+    get(stack: Stack): any;
+    subscribe(stack: Stack, pipelineNames?: string[]): ScopeSubscription<ScopeContext>[];
+}
+export declare class TwoWayAssignmentExpression extends InfixExpressionNode<TwoWayOperator> implements BindingAssignment {
+    protected left: MemberExpression;
+    protected right: MemberExpression | Identifier;
+    private rightEvents;
+    private leftEvents;
+    constructor(left: MemberExpression, right: MemberExpression | Identifier);
+    set(stack: Stack, value: any): any;
+    get(stack: Stack): any;
+    private setRTL;
+    private getRTL;
+    private actionRTL;
+    private setLTR;
+    private getLTR;
+    private actionLTR;
+    private subscribeToEvents;
+    subscribe(stack: Stack): ScopeSubscription<ScopeContext>[];
+}
+export {};

package/binding/binding.expressions.js

@@ -0,0 +1,99 @@
+import { InfixExpressionNode, findScopeByEventMap, ReactiveScope } from '@ibyar/expressions';
+import { AsyncPipeProvider, AsyncPipeScope } from '../pipe/pipe.js';
+export class OneWayAssignmentExpression extends InfixExpressionNode {
+    constructor(left, right) {
+        super(':=', left, right);
+        this.rightEvents = this.right.events();
+    }
+    set(stack, value) {
+        return this.left.set(stack, value);
+    }
+    get(stack) {
+        const rv = this.right.get(stack);
+        this.set(stack, rv);
+        return rv;
+    }
+    subscribe(stack, pipelineNames) {
+        if (pipelineNames?.length) {
+            const asyncPipeScope = new AsyncPipeScope();
+            pipelineNames.forEach(pipeline => {
+                const scope = stack.findScope(pipeline);
+                if (scope instanceof AsyncPipeProvider) {
+                    const pipe = scope.get(pipeline);
+                    asyncPipeScope.set(pipeline, pipe);
+                }
+            });
+            stack.pushScope(asyncPipeScope);
+        }
+        const map = findScopeByEventMap(this.rightEvents, stack);
+        const subscriptions = [];
+        map.forEach((scope, eventName) => {
+            if (scope instanceof ReactiveScope) {
+                const subscription = scope.subscribe(eventName, (newValue, oldValue) => {
+                    this.get(stack);
+                });
+                subscriptions.push(subscription);
+            }
+        });
+        return subscriptions;
+    }
+}
+export class TwoWayAssignmentExpression extends InfixExpressionNode {
+    constructor(left, right) {
+        super(':=:', left, right);
+        this.rightEvents = this.right.events();
+        this.leftEvents = this.left.events();
+    }
+    set(stack, value) {
+        return this.setRTL(stack, value);
+    }
+    get(stack) {
+        return this.getRTL(stack);
+    }
+    setRTL(stack, value) {
+        return this.left.set(stack, value);
+    }
+    getRTL(stack) {
+        const rv = this.right.get(stack);
+        this.setRTL(stack, rv);
+        return rv;
+    }
+    actionRTL(stack) {
+        return (newValue, oldValue) => {
+            this.getRTL(stack);
+        };
+    }
+    setLTR(stack, value) {
+        return this.right.set(stack, value);
+    }
+    getLTR(stack) {
+        const lv = this.left.get(stack);
+        this.setLTR(stack, lv);
+        return lv;
+    }
+    actionLTR(stack) {
+        return (newValue, oldValue) => {
+            this.getLTR(stack);
+        };
+    }
+    subscribeToEvents(stack, map, actionCallback) {
+        const subscriptions = [];
+        map.forEach((scope, eventName) => {
+            if (scope instanceof ReactiveScope) {
+                const subscription = scope.subscribe(eventName, actionCallback);
+                subscriptions.push(subscription);
+            }
+        });
+        return subscriptions;
+    }
+    subscribe(stack) {
+        const rightMap = findScopeByEventMap(this.rightEvents, stack);
+        const rtlAction = this.actionRTL(stack);
+        const rtlSubscriptions = this.subscribeToEvents(stack, rightMap, rtlAction);
+        const leftMap = findScopeByEventMap(this.leftEvents, stack);
+        const ltrAction = this.actionLTR(stack);
+        const ltrSubscriptions = this.subscribeToEvents(stack, leftMap, ltrAction);
+        return rtlSubscriptions.concat(ltrSubscriptions);
+    }
+}
+//# sourceMappingURL=binding.expressions.js.map

package/binding/binding.expressions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"binding.expressions.js","sourceRoot":"","sources":["../../../src/core/binding/binding.expressions.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n\tExpressionNode, InfixExpressionNode, ScopeSubscription,\n\tStack, findScopeByEventMap, ReactiveScope,\n\tScopeContext, ValueChangedCallback, Scope,\n\tMemberExpression, Identifier\n} from '@ibyar/expressions';\nimport { AsyncPipeProvider, AsyncPipeScope } from '../pipe/pipe.js';\n\ntype OneWayOperator = ':=';\ntype TwoWayOperator = ':=:';\ntype BindingOperators = OneWayOperator | TwoWayOperator;\n\nexport interface BindingAssignment extends InfixExpressionNode<BindingOperators> {\n\tsubscribe(stack: Stack, pipelineNames?: string[]): ScopeSubscription<ScopeContext>[];\n}\n\n\nexport class OneWayAssignmentExpression extends InfixExpressionNode<OneWayOperator> implements BindingAssignment {\n\n\tprivate rightEvents = this.right.events();\n\tconstructor(left: MemberExpression, right: ExpressionNode) {\n\t\tsuper(':=', left, right);\n\t}\n\tset(stack: Stack, value: any) {\n\t\treturn this.left.set(stack, value);\n\t}\n\tget(stack: Stack): any {\n\t\tconst rv = this.right.get(stack);\n\t\tthis.set(stack, rv);\n\t\treturn rv;\n\t}\n\tsubscribe(stack: Stack, pipelineNames?: string[]): ScopeSubscription<ScopeContext>[] {\n\t\tif (pipelineNames?.length) {\n\t\t\tconst asyncPipeScope = new AsyncPipeScope();\n\t\t\tpipelineNames.forEach(pipeline => {\n\t\t\t\tconst scope = stack.findScope(pipeline);\n\t\t\t\tif (scope instanceof AsyncPipeProvider) {\n\t\t\t\t\tconst pipe = scope.get(pipeline)!;\n\t\t\t\t\tasyncPipeScope.set(pipeline, pipe);\n\t\t\t\t}\n\t\t\t});\n\t\t\tstack.pushScope(asyncPipeScope);\n\t\t}\n\t\tconst map = findScopeByEventMap(this.rightEvents, stack);\n\t\tconst subscriptions: ScopeSubscription<ScopeContext>[] = [];\n\t\tmap.forEach((scope, eventName) => {\n\t\t\tif (scope instanceof ReactiveScope) {\n\t\t\t\tconst subscription = scope.subscribe(eventName, (newValue: any, oldValue?: any) => {\n\t\t\t\t\tthis.get(stack);\n\t\t\t\t});\n\t\t\t\tsubscriptions.push(subscription);\n\t\t\t}\n\t\t});\n\t\treturn subscriptions;\n\t}\n}\n\n\n/**\n * the default behavior is assign the right hand side to the left hand side.\n * \n * \n */\nexport class TwoWayAssignmentExpression extends InfixExpressionNode<TwoWayOperator> implements BindingAssignment {\n\n\tprotected left: MemberExpression;\n\tprotected right: MemberExpression | Identifier;\n\n\tprivate rightEvents = this.right.events();\n\tprivate leftEvents = this.left.events();\n\tconstructor(left: MemberExpression, right: MemberExpression | Identifier) {\n\t\tsuper(':=:', left, right);\n\t}\n\n\tset(stack: Stack, value: any) {\n\t\treturn this.setRTL(stack, value);\n\t}\n\tget(stack: Stack): any {\n\t\treturn this.getRTL(stack);\n\t}\n\n\tprivate setRTL(stack: Stack, value: any) {\n\t\treturn this.left.set(stack, value);\n\t}\n\tprivate getRTL(stack: Stack): any {\n\t\tconst rv = this.right.get(stack);\n\t\tthis.setRTL(stack, rv);\n\t\treturn rv;\n\t}\n\tprivate actionRTL(stack: Stack): ValueChangedCallback {\n\t\treturn (newValue: any, oldValue?: any) => {\n\t\t\tthis.getRTL(stack);\n\t\t};\n\t}\n\n\tprivate setLTR(stack: Stack, value: any) {\n\t\treturn this.right.set(stack, value);\n\t}\n\tprivate getLTR(stack: Stack): any {\n\t\tconst lv = this.left.get(stack);\n\t\tthis.setLTR(stack, lv);\n\t\treturn lv;\n\t}\n\tprivate actionLTR(stack: Stack): ValueChangedCallback {\n\t\treturn (newValue: any, oldValue?: any) => {\n\t\t\tthis.getLTR(stack);\n\t\t};\n\t}\n\n\tprivate subscribeToEvents(stack: Stack, map: Map<string, Scope<ScopeContext>>, actionCallback: ValueChangedCallback) {\n\t\tconst subscriptions: ScopeSubscription<ScopeContext>[] = [];\n\t\tmap.forEach((scope, eventName) => {\n\t\t\tif (scope instanceof ReactiveScope) {\n\t\t\t\tconst subscription = scope.subscribe(eventName, actionCallback);\n\t\t\t\tsubscriptions.push(subscription);\n\t\t\t}\n\t\t});\n\t\treturn subscriptions;\n\t}\n\n\tsubscribe(stack: Stack): ScopeSubscription<ScopeContext>[] {\n\n\t\t// right to left\n\t\tconst rightMap = findScopeByEventMap(this.rightEvents, stack);\n\t\tconst rtlAction = this.actionRTL(stack);\n\t\tconst rtlSubscriptions = this.subscribeToEvents(stack, rightMap, rtlAction);\n\n\t\t// left to right \n\t\tconst leftMap = findScopeByEventMap(this.leftEvents, stack);\n\t\tconst ltrAction = this.actionLTR(stack);\n\t\tconst ltrSubscriptions = this.subscribeToEvents(stack, leftMap, ltrAction);\n\n\t\treturn rtlSubscriptions.concat(ltrSubscriptions);\n\t}\n\n}\n"]}

package/component/component.d.ts

@@ -1,5 +1,5 @@
 import type { TypeOf } from '../utils/typeof.js';
-import { Tag, DOMNode, DOMRenderNode } from '@ibyar/elements';
+import { Tag, DomNode, DomRenderNode } from '@ibyar/elements';
 import { HTMLComponent } from './custom-element.js';
 import { AttributeDirective, StructuralDirective } from '../directive/directive.js';
 import { ComponentOptions, ChildOptions, PipeOptions, ServiceOptions, DirectiveOptions } from '../annotation/decorators.js';
@@ -58,7 +58,7 @@ export interface DirectiveRef<T> {
 }
 export interface ComponentRef<T> {
     selector: string;
-    template: DOMNode | DOMRenderNode<T>;
+    template: DomNode | DomRenderNode<T>;
     styles: string;
     extend: Tag;
     viewClass: TypeOf<HTMLComponent<T>> & CustomElementConstructor;

package/component/component.js

@@ -94,16 +94,10 @@ export class Components {
         }
         bootstrap.modelClass = modelClass;
         ClassRegistryProvider.registerDirective(modelClass);
-        if (opts.selector.startsWith('*')) {
-            const attributes = [];
-            bootstrap.inputs?.forEach(input => attributes.push(input.viewAttribute));
-            bootstrap.outputs?.forEach(output => attributes.push(output.viewAttribute));
-            const structuralDirectiveName = opts.selector.substring(1);
-            directiveRegistry.register(structuralDirectiveName, {
-                attributes,
-                nextSiblingDirectives: opts.nextSiblingDirectives,
-            });
-        }
+        directiveRegistry.register(opts.selector, {
+            inputs: bootstrap.inputs?.map(input => input.viewAttribute),
+            outputs: bootstrap.outputs?.map(output => output.viewAttribute),
+        });
     }
     static definePipe(modelClass, opts) {
         const bootstrap = Components.getOrCreateBootstrap(modelClass.prototype);

package/component/component.js.map

@@ -1 +1 @@
-{"version":3,"file":"component.js","sourceRoot":"","sources":["../../../src/core/component/component.ts"],"names":[],"mappings":"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","sourcesContent":["import type { TypeOf } from '../utils/typeof.js';\nimport {\n\tfindByTagName, Tag, htmlParser, templateParser,\n\tDOMNode, DOMRenderNode, canAttachShadow, directiveRegistry\n} from '@ibyar/elements';\n\nimport { HTMLComponent } from './custom-element.js';\nimport { ClassRegistryProvider } from '../providers/provider.js';\nimport { AttributeDirective, StructuralDirective } from '../directive/directive.js';\nimport { initCustomElementView } from '../view/view.js';\nimport { buildExpressionNodes } from '../html/expression.js';\nimport {\n\tComponentOptions, ChildOptions, PipeOptions,\n\tServiceOptions, DirectiveOptions\n} from '../annotation/decorators.js';\n\nexport class PropertyRef {\n\tconstructor(public modelProperty: string, private _viewName?: string) { }\n\tget viewAttribute(): string {\n\t\treturn this._viewName || this.modelProperty;\n\t}\n}\n\nexport class ChildRef {\n\tconstructor(\n\t\tpublic modelName: string,\n\t\tpublic selector: string | { new(): HTMLElement; prototype: HTMLElement } | CustomElementConstructor,\n\t\tpublic childOptions?: ChildOptions\n\t) { }\n}\n\nexport class ListenerRef {\n\tconstructor(public eventName: string, public args: string[], public modelCallbackName: string) { }\n}\n\nexport class HostBindingRef {\n\tconstructor(public viewProperty: string, public hostPropertyName: string) { }\n}\n\nexport interface BootstrapMetadata {\n\t[key: string]: any;\n}\n\nexport interface ServiceRef<T> {\n\tprovideIn: TypeOf<CustomElementConstructor> | 'root' | 'platform' | 'any';\n\tmodelClass: TypeOf<T>;\n\tname: string;\n}\n\nexport interface PipeRef<T> {\n\tname: string;\n\tasynchronous?: boolean;\n\tmodelClass: TypeOf<T>;\n}\nexport interface DirectiveRef<T> {\n\tselector: string;\n\n\tmodelClass: TypeOf<StructuralDirective> | TypeOf<AttributeDirective>;\n\n\tinputs: PropertyRef[];\n\toutputs: PropertyRef[];\n\tview: string;\n\tviewChild: ChildRef[];\n\tViewChildren: ChildRef[];\n\thostListeners: ListenerRef[];\n\thostBindings: HostBindingRef[];\n}\n\nexport interface ComponentRef<T> {\n\tselector: string;\n\ttemplate: DOMNode | DOMRenderNode<T>;\n\t// attrTemplate: JsxAttrComponent;\n\tstyles: string;\n\textend: Tag;\n\n\tviewClass: TypeOf<HTMLComponent<T>> & CustomElementConstructor;\n\tmodelClass: TypeOf<T>;\n\n\tinputs: PropertyRef[];\n\toutputs: PropertyRef[];\n\tview: string;\n\tviewChild: ChildRef[];\n\tViewChildren: ChildRef[];\n\thostBindings: HostBindingRef[];\n\thostListeners: ListenerRef[];\n\n\tencapsulation: 'custom' | 'shadow-dom' | 'template' | 'shadow-dom-template';\n\tisShadowDom: boolean;\n\tshadowDomMode: ShadowRootMode;\n\tshadowDomDelegatesFocus: boolean;\n}\n\nconst AuroraBootstrap = Symbol.for('aurora:bootstrap');\nconst AuroraMetadata = Symbol.for('aurora:metadata');\n\nexport class Components {\n\n\tstatic getOrCreateBootstrap<T extends {}>(target: Object): T {\n\t\tlet bootstrap: T = Reflect.getMetadata(AuroraBootstrap, target);\n\t\tif (!bootstrap) {\n\t\t\tbootstrap = {} as T;\n\t\t\tReflect.defineMetadata(AuroraBootstrap, bootstrap, target);\n\t\t}\n\t\treturn bootstrap;\n\t}\n\n\tstatic getBootstrap<T extends {}>(target: Object): T {\n\t\treturn Reflect.getMetadata(AuroraBootstrap, target);\n\t}\n\n\tstatic getComponentRef<T>(target: object): ComponentRef<T> {\n\t\treturn Reflect.getMetadata(AuroraMetadata, target);\n\t}\n\n\tstatic setComponentRef<T>(target: object, componentRef: ComponentRef<T>): void {\n\t\tReflect.defineMetadata(AuroraMetadata, componentRef, target);\n\t}\n\n\tstatic addOptional(modelProperty: Object) {\n\t}\n\n\tstatic addInput(modelProperty: Object, modelName: string, viewName: string) {\n\t\tconst bootstrap: BootstrapMetadata = Components.getOrCreateBootstrap(modelProperty);\n\t\tbootstrap.inputs = bootstrap.inputs || [];\n\t\tbootstrap.inputs.push(new PropertyRef(modelName, viewName));\n\t}\n\n\tstatic addOutput(modelProperty: Object, modelName: string, viewName: string) {\n\t\tconst bootstrap: BootstrapMetadata = Components.getOrCreateBootstrap(modelProperty);\n\t\tbootstrap.outputs = bootstrap.outputs || [];\n\t\tbootstrap.outputs.push(new PropertyRef(modelName, viewName));\n\t}\n\n\tstatic setComponentView(modelProperty: Object, modelName: string) {\n\t\tconst bootstrap: BootstrapMetadata = Components.getOrCreateBootstrap(modelProperty);\n\t\tbootstrap.view = modelName;\n\t}\n\n\tstatic addViewChild(modelProperty: Object, modelName: string, selector: string | typeof HTMLElement | CustomElementConstructor, childOptions?: ChildOptions) {\n\t\tconst bootstrap: BootstrapMetadata = Components.getOrCreateBootstrap(modelProperty);\n\t\tbootstrap.viewChild = bootstrap.viewChild || [];\n\t\tbootstrap.viewChild.push(new ChildRef(modelName, selector, childOptions));\n\t}\n\n\tstatic addViewChildren(modelProperty: Object, modelName: string, selector: string | typeof HTMLElement | CustomElementConstructor) {\n\t\tconst bootstrap: BootstrapMetadata = Components.getOrCreateBootstrap(modelProperty);\n\t\tbootstrap.ViewChildren = bootstrap.ViewChildren || [];\n\t\tbootstrap.ViewChildren.push(new ChildRef(modelName, selector));\n\t}\n\n\tstatic addHostListener(modelProperty: Object, propertyKey: string, eventName: string, args: string[]) {\n\t\tconst bootstrap: BootstrapMetadata = Components.getOrCreateBootstrap(modelProperty);\n\t\tbootstrap.hostListeners = bootstrap.hostListeners || [];\n\t\tbootstrap.hostListeners.push(new ListenerRef(eventName, args, propertyKey));\n\t}\n\n\tstatic addHostBinding(modelProperty: Object, propertyKey: string, hostPropertyName: string) {\n\t\tconst bootstrap: BootstrapMetadata = Components.getOrCreateBootstrap(modelProperty);\n\t\tbootstrap.hostBinding = bootstrap.hostBinding || [];\n\t\tbootstrap.hostBinding.push(\n\t\t\tnew HostBindingRef(propertyKey, hostPropertyName)\n\t\t);\n\t}\n\n\tstatic defineDirective(modelClass: Function, opts: DirectiveOptions) {\n\t\tconst bootstrap: BootstrapMetadata = Components.getOrCreateBootstrap(modelClass.prototype);\n\t\tfor (const key in opts) {\n\t\t\tbootstrap[key] = Reflect.get(opts, key);\n\t\t}\n\t\tbootstrap.modelClass = modelClass;\n\t\tClassRegistryProvider.registerDirective(modelClass);\n\t\tif (opts.selector.startsWith('*')) {\n\t\t\tconst attributes: string[] = [];\n\t\t\t(bootstrap.inputs as PropertyRef[])?.forEach(input => attributes.push(input.viewAttribute));\n\t\t\t(bootstrap.outputs as PropertyRef[])?.forEach(output => attributes.push(output.viewAttribute));\n\t\t\tconst structuralDirectiveName = opts.selector.substring(1);\n\t\t\tdirectiveRegistry.register(structuralDirectiveName, {\n\t\t\t\tattributes,\n\t\t\t\tnextSiblingDirectives: opts.nextSiblingDirectives,\n\t\t\t});\n\t\t}\n\t}\n\n\tstatic definePipe(modelClass: Function, opts: PipeOptions) {\n\t\tconst bootstrap: BootstrapMetadata = Components.getOrCreateBootstrap(modelClass.prototype);\n\t\tfor (const key in opts) {\n\t\t\tbootstrap[key] = Reflect.get(opts, key);\n\t\t}\n\t\tbootstrap.modelClass = modelClass;\n\t\tClassRegistryProvider.registerPipe(modelClass);\n\t}\n\n\tstatic defineService(modelClass: Function, opts: ServiceOptions) {\n\t\tconst bootstrap: BootstrapMetadata = Components.getOrCreateBootstrap(modelClass.prototype);\n\t\tfor (const key in opts) {\n\t\t\tbootstrap[key] = Reflect.get(opts, key);\n\t\t}\n\t\tbootstrap.modelClass = modelClass;\n\t\tbootstrap.name = modelClass.name;\n\t\tClassRegistryProvider.registerService(modelClass);\n\t}\n\n\tstatic defineComponent<T extends Object>(modelClass: TypeOf<T>, opts: ComponentOptions<T>) {\n\t\tconst bootstrap: BootstrapMetadata = Components.getOrCreateBootstrap(modelClass.prototype);\n\n\t\tvar componentRef: ComponentRef<T> = opts as unknown as ComponentRef<T>;\n\t\tfor (const key in bootstrap) {\n\t\t\tReflect.set(componentRef, key, bootstrap[key]);\n\t\t}\n\t\tcomponentRef.extend = findByTagName(opts.extend);\n\n\t\tif (typeof componentRef.template === 'string') {\n\t\t\tif (componentRef.styles) {\n\t\t\t\tconst template = `<style>${componentRef.styles}</style>${componentRef.template}`;\n\t\t\t\tcomponentRef.template = htmlParser.toDomRootNode(template);\n\t\t\t} else {\n\t\t\t\tcomponentRef.template = htmlParser.toDomRootNode(componentRef.template);\n\t\t\t}\n\t\t\tbuildExpressionNodes(componentRef.template);\n\t\t}\n\n\t\tif (!componentRef.template && /template/g.test(componentRef.encapsulation)) {\n\t\t\tconst template = document.querySelector('#' + componentRef.selector);\n\t\t\tif (template && template instanceof HTMLTemplateElement) {\n\t\t\t\tcomponentRef.template = templateParser.parse(template);\n\t\t\t\tbuildExpressionNodes(componentRef.template);\n\t\t\t} else {\n\t\t\t\t// didn't find this template in 'index.html' document\n\t\t\t}\n\t\t}\n\n\t\tcomponentRef.inputs ||= [];\n\t\tcomponentRef.outputs ||= [];\n\t\tcomponentRef.viewChild ||= [];\n\t\tcomponentRef.ViewChildren ||= [];\n\t\tcomponentRef.hostBindings ||= [];\n\t\tcomponentRef.hostListeners ||= [];\n\t\tcomponentRef.encapsulation ||= 'custom';\n\t\tcomponentRef.isShadowDom = /shadow-dom/g.test(componentRef.encapsulation);\n\t\tcomponentRef.shadowDomMode ||= 'open';\n\t\tcomponentRef.shadowDomDelegatesFocus = componentRef.shadowDomDelegatesFocus === true || false;\n\n\t\tif (componentRef.isShadowDom && componentRef.extend.name) {\n\t\t\tcomponentRef.isShadowDom = canAttachShadow(componentRef.extend.name);\n\t\t}\n\n\t\tcomponentRef.modelClass = modelClass;\n\t\tcomponentRef.viewClass = initCustomElementView(modelClass, componentRef);\n\t\tComponents.setComponentRef(componentRef.modelClass, componentRef);\n\t\tComponents.setComponentRef(componentRef.viewClass, componentRef);\n\n\t\tClassRegistryProvider.registerComponent(modelClass);\n\t\tClassRegistryProvider.registerView(bootstrap.viewClass);\n\n\t\tconst options: ElementDefinitionOptions = {};\n\t\tconst parentTagName = componentRef.extend?.name;\n\t\tif (parentTagName) {\n\t\t\tif (parentTagName !== '!' && parentTagName.indexOf('-') === -1) {\n\t\t\t\toptions.extends = parentTagName;\n\t\t\t}\n\t\t}\n\n\n\t\tcustomElements.define(\n\t\t\tcomponentRef.selector as string,\n\t\t\tcomponentRef.viewClass as CustomElementConstructor,\n\t\t\toptions\n\t\t);\n\n\t}\n}\n"]}
+{"version":3,"file":"component.js","sourceRoot":"","sources":["../../../src/core/component/component.ts"],"names":[],"mappings":"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","sourcesContent":["import type { TypeOf } from '../utils/typeof.js';\nimport {\n\tfindByTagName, Tag, htmlParser, templateParser,\n\tDomNode, DomRenderNode, canAttachShadow, directiveRegistry\n} from '@ibyar/elements';\n\nimport { HTMLComponent } from './custom-element.js';\nimport { ClassRegistryProvider } from '../providers/provider.js';\nimport { AttributeDirective, StructuralDirective } from '../directive/directive.js';\nimport { initCustomElementView } from '../view/view.js';\nimport { buildExpressionNodes } from '../html/expression.js';\nimport {\n\tComponentOptions, ChildOptions, PipeOptions,\n\tServiceOptions, DirectiveOptions\n} from '../annotation/decorators.js';\n\nexport class PropertyRef {\n\tconstructor(public modelProperty: string, private _viewName?: string) { }\n\tget viewAttribute(): string {\n\t\treturn this._viewName || this.modelProperty;\n\t}\n}\n\nexport class ChildRef {\n\tconstructor(\n\t\tpublic modelName: string,\n\t\tpublic selector: string | { new(): HTMLElement; prototype: HTMLElement } | CustomElementConstructor,\n\t\tpublic childOptions?: ChildOptions\n\t) { }\n}\n\nexport class ListenerRef {\n\tconstructor(public eventName: string, public args: string[], public modelCallbackName: string) { }\n}\n\nexport class HostBindingRef {\n\tconstructor(public viewProperty: string, public hostPropertyName: string) { }\n}\n\nexport interface BootstrapMetadata {\n\t[key: string]: any;\n}\n\nexport interface ServiceRef<T> {\n\tprovideIn: TypeOf<CustomElementConstructor> | 'root' | 'platform' | 'any';\n\tmodelClass: TypeOf<T>;\n\tname: string;\n}\n\nexport interface PipeRef<T> {\n\tname: string;\n\tasynchronous?: boolean;\n\tmodelClass: TypeOf<T>;\n}\nexport interface DirectiveRef<T> {\n\tselector: string;\n\n\tmodelClass: TypeOf<StructuralDirective> | TypeOf<AttributeDirective>;\n\n\tinputs: PropertyRef[];\n\toutputs: PropertyRef[];\n\tview: string;\n\tviewChild: ChildRef[];\n\tViewChildren: ChildRef[];\n\thostListeners: ListenerRef[];\n\thostBindings: HostBindingRef[];\n}\n\nexport interface ComponentRef<T> {\n\tselector: string;\n\ttemplate: DomNode | DomRenderNode<T>;\n\t// attrTemplate: JsxAttrComponent;\n\tstyles: string;\n\textend: Tag;\n\n\tviewClass: TypeOf<HTMLComponent<T>> & CustomElementConstructor;\n\tmodelClass: TypeOf<T>;\n\n\tinputs: PropertyRef[];\n\toutputs: PropertyRef[];\n\tview: string;\n\tviewChild: ChildRef[];\n\tViewChildren: ChildRef[];\n\thostBindings: HostBindingRef[];\n\thostListeners: ListenerRef[];\n\n\tencapsulation: 'custom' | 'shadow-dom' | 'template' | 'shadow-dom-template';\n\tisShadowDom: boolean;\n\tshadowDomMode: ShadowRootMode;\n\tshadowDomDelegatesFocus: boolean;\n}\n\nconst AuroraBootstrap = Symbol.for('aurora:bootstrap');\nconst AuroraMetadata = Symbol.for('aurora:metadata');\n\nexport class Components {\n\n\tstatic getOrCreateBootstrap<T extends {}>(target: Object): T {\n\t\tlet bootstrap: T = Reflect.getMetadata(AuroraBootstrap, target);\n\t\tif (!bootstrap) {\n\t\t\tbootstrap = {} as T;\n\t\t\tReflect.defineMetadata(AuroraBootstrap, bootstrap, target);\n\t\t}\n\t\treturn bootstrap;\n\t}\n\n\tstatic getBootstrap<T extends {}>(target: Object): T {\n\t\treturn Reflect.getMetadata(AuroraBootstrap, target);\n\t}\n\n\tstatic getComponentRef<T>(target: object): ComponentRef<T> {\n\t\treturn Reflect.getMetadata(AuroraMetadata, target);\n\t}\n\n\tstatic setComponentRef<T>(target: object, componentRef: ComponentRef<T>): void {\n\t\tReflect.defineMetadata(AuroraMetadata, componentRef, target);\n\t}\n\n\tstatic addOptional(modelProperty: Object) {\n\t}\n\n\tstatic addInput(modelProperty: Object, modelName: string, viewName: string) {\n\t\tconst bootstrap: BootstrapMetadata = Components.getOrCreateBootstrap(modelProperty);\n\t\tbootstrap.inputs = bootstrap.inputs || [];\n\t\tbootstrap.inputs.push(new PropertyRef(modelName, viewName));\n\t}\n\n\tstatic addOutput(modelProperty: Object, modelName: string, viewName: string) {\n\t\tconst bootstrap: BootstrapMetadata = Components.getOrCreateBootstrap(modelProperty);\n\t\tbootstrap.outputs = bootstrap.outputs || [];\n\t\tbootstrap.outputs.push(new PropertyRef(modelName, viewName));\n\t}\n\n\tstatic setComponentView(modelProperty: Object, modelName: string) {\n\t\tconst bootstrap: BootstrapMetadata = Components.getOrCreateBootstrap(modelProperty);\n\t\tbootstrap.view = modelName;\n\t}\n\n\tstatic addViewChild(modelProperty: Object, modelName: string, selector: string | typeof HTMLElement | CustomElementConstructor, childOptions?: ChildOptions) {\n\t\tconst bootstrap: BootstrapMetadata = Components.getOrCreateBootstrap(modelProperty);\n\t\tbootstrap.viewChild = bootstrap.viewChild || [];\n\t\tbootstrap.viewChild.push(new ChildRef(modelName, selector, childOptions));\n\t}\n\n\tstatic addViewChildren(modelProperty: Object, modelName: string, selector: string | typeof HTMLElement | CustomElementConstructor) {\n\t\tconst bootstrap: BootstrapMetadata = Components.getOrCreateBootstrap(modelProperty);\n\t\tbootstrap.ViewChildren = bootstrap.ViewChildren || [];\n\t\tbootstrap.ViewChildren.push(new ChildRef(modelName, selector));\n\t}\n\n\tstatic addHostListener(modelProperty: Object, propertyKey: string, eventName: string, args: string[]) {\n\t\tconst bootstrap: BootstrapMetadata = Components.getOrCreateBootstrap(modelProperty);\n\t\tbootstrap.hostListeners = bootstrap.hostListeners || [];\n\t\tbootstrap.hostListeners.push(new ListenerRef(eventName, args, propertyKey));\n\t}\n\n\tstatic addHostBinding(modelProperty: Object, propertyKey: string, hostPropertyName: string) {\n\t\tconst bootstrap: BootstrapMetadata = Components.getOrCreateBootstrap(modelProperty);\n\t\tbootstrap.hostBinding = bootstrap.hostBinding || [];\n\t\tbootstrap.hostBinding.push(\n\t\t\tnew HostBindingRef(propertyKey, hostPropertyName)\n\t\t);\n\t}\n\n\tstatic defineDirective(modelClass: Function, opts: DirectiveOptions) {\n\t\tconst bootstrap: BootstrapMetadata = Components.getOrCreateBootstrap(modelClass.prototype);\n\t\tfor (const key in opts) {\n\t\t\tbootstrap[key] = Reflect.get(opts, key);\n\t\t}\n\t\tbootstrap.modelClass = modelClass;\n\t\tClassRegistryProvider.registerDirective(modelClass);\n\t\tdirectiveRegistry.register(opts.selector, {\n\t\t\tinputs: (bootstrap.inputs as PropertyRef[])?.map(input => input.viewAttribute),\n\t\t\toutputs: (bootstrap.outputs as PropertyRef[])?.map(output => output.viewAttribute),\n\t\t});\n\t}\n\n\tstatic definePipe(modelClass: Function, opts: PipeOptions) {\n\t\tconst bootstrap: BootstrapMetadata = Components.getOrCreateBootstrap(modelClass.prototype);\n\t\tfor (const key in opts) {\n\t\t\tbootstrap[key] = Reflect.get(opts, key);\n\t\t}\n\t\tbootstrap.modelClass = modelClass;\n\t\tClassRegistryProvider.registerPipe(modelClass);\n\t}\n\n\tstatic defineService(modelClass: Function, opts: ServiceOptions) {\n\t\tconst bootstrap: BootstrapMetadata = Components.getOrCreateBootstrap(modelClass.prototype);\n\t\tfor (const key in opts) {\n\t\t\tbootstrap[key] = Reflect.get(opts, key);\n\t\t}\n\t\tbootstrap.modelClass = modelClass;\n\t\tbootstrap.name = modelClass.name;\n\t\tClassRegistryProvider.registerService(modelClass);\n\t}\n\n\tstatic defineComponent<T extends Object>(modelClass: TypeOf<T>, opts: ComponentOptions<T>) {\n\t\tconst bootstrap: BootstrapMetadata = Components.getOrCreateBootstrap(modelClass.prototype);\n\n\t\tvar componentRef: ComponentRef<T> = opts as unknown as ComponentRef<T>;\n\t\tfor (const key in bootstrap) {\n\t\t\tReflect.set(componentRef, key, bootstrap[key]);\n\t\t}\n\t\tcomponentRef.extend = findByTagName(opts.extend);\n\n\t\tif (typeof componentRef.template === 'string') {\n\t\t\tif (componentRef.styles) {\n\t\t\t\tconst template = `<style>${componentRef.styles}</style>${componentRef.template}`;\n\t\t\t\tcomponentRef.template = htmlParser.toDomRootNode(template);\n\t\t\t} else {\n\t\t\t\tcomponentRef.template = htmlParser.toDomRootNode(componentRef.template);\n\t\t\t}\n\t\t\tbuildExpressionNodes(componentRef.template);\n\t\t}\n\n\t\tif (!componentRef.template && /template/g.test(componentRef.encapsulation)) {\n\t\t\tconst template = document.querySelector('#' + componentRef.selector);\n\t\t\tif (template && template instanceof HTMLTemplateElement) {\n\t\t\t\tcomponentRef.template = templateParser.parse(template);\n\t\t\t\tbuildExpressionNodes(componentRef.template);\n\t\t\t} else {\n\t\t\t\t// didn't find this template in 'index.html' document\n\t\t\t}\n\t\t}\n\n\t\tcomponentRef.inputs ||= [];\n\t\tcomponentRef.outputs ||= [];\n\t\tcomponentRef.viewChild ||= [];\n\t\tcomponentRef.ViewChildren ||= [];\n\t\tcomponentRef.hostBindings ||= [];\n\t\tcomponentRef.hostListeners ||= [];\n\t\tcomponentRef.encapsulation ||= 'custom';\n\t\tcomponentRef.isShadowDom = /shadow-dom/g.test(componentRef.encapsulation);\n\t\tcomponentRef.shadowDomMode ||= 'open';\n\t\tcomponentRef.shadowDomDelegatesFocus = componentRef.shadowDomDelegatesFocus === true || false;\n\n\t\tif (componentRef.isShadowDom && componentRef.extend.name) {\n\t\t\tcomponentRef.isShadowDom = canAttachShadow(componentRef.extend.name);\n\t\t}\n\n\t\tcomponentRef.modelClass = modelClass;\n\t\tcomponentRef.viewClass = initCustomElementView(modelClass, componentRef);\n\t\tComponents.setComponentRef(componentRef.modelClass, componentRef);\n\t\tComponents.setComponentRef(componentRef.viewClass, componentRef);\n\n\t\tClassRegistryProvider.registerComponent(modelClass);\n\t\tClassRegistryProvider.registerView(bootstrap.viewClass);\n\n\t\tconst options: ElementDefinitionOptions = {};\n\t\tconst parentTagName = componentRef.extend?.name;\n\t\tif (parentTagName) {\n\t\t\tif (parentTagName !== '!' && parentTagName.indexOf('-') === -1) {\n\t\t\t\toptions.extends = parentTagName;\n\t\t\t}\n\t\t}\n\n\n\t\tcustomElements.define(\n\t\t\tcomponentRef.selector as string,\n\t\t\tcomponentRef.viewClass as CustomElementConstructor,\n\t\t\toptions\n\t\t);\n\n\t}\n}\n"]}

package/component/custom-element.d.ts

@@ -1,28 +1,27 @@
-import type { ReactiveScope } from '@ibyar/expressions';
+import type { ReactiveScope, ScopeContext } from '@ibyar/expressions';
 import type { TypeOf } from '../utils/typeof.js';
-import type { ElementReactiveScope } from '../directive/providers.js';
 import { EventEmitter } from './events.js';
 import { PropertyRef, ComponentRef } from './component.js';
-import { Model } from '../model/change-detection.js';
 export interface CustomElement {
     adoptedCallback(): void;
     attributeChangedCallback(name: string, oldValue: any, newValue: any): void;
     connectedCallback(): void;
     disconnectedCallback(): void;
 }
-export declare type ModelType<T> = T & Model & {
-    [key: string]: any;
+export declare type ModelType<T> = T & ScopeContext;
+export declare type NodeContextType<T> = {
+    'this': BaseComponent<T>;
 };
 export interface BaseComponent<T> extends CustomElement {
     _model: ModelType<T>;
     _proxyModel: ModelType<T>;
-    _modelScope: ReactiveScope<T & Model & {
-        [key: string]: any;
+    _modelScope: ReactiveScope<T & ScopeContext>;
+    _viewScope: ReactiveScope<{
+        'this': BaseComponent<T>;
     }>;
-    _viewScope: ElementReactiveScope;
     getComponentRef(): ComponentRef<T>;
-    setParentComponent<V>(parent: HTMLComponent<V>): void;
-    getParentComponent<V>(): HTMLComponent<V>;
+    setParentComponent<V extends object>(parent: HTMLComponent<V>): void;
+    getParentComponent<V extends object>(): HTMLComponent<V>;
     hasParentComponent(): boolean;
     hasInputStartWith(viewProp: string): boolean;
     getInputStartWith(viewProp: string): PropertyRef | undefined;
@@ -35,14 +34,11 @@ export interface BaseComponent<T> extends CustomElement {
     getOutput(viewProp: string): PropertyRef | undefined;
     getEventEmitter<V>(viewProp: string): EventEmitter<V> | undefined;
     triggerOutput(eventName: string, value?: any): void;
-    triggerModelChange(eventName: string, value?: any, source?: HTMLElement): void;
-    emitRootChanges(): void;
-    emitChanges(...events: string[]): void;
 }
 export interface HTMLComponent<T> extends BaseComponent<T>, HTMLElement {
 }
 export declare function isHTMLComponent(object: any): object is HTMLComponent<any>;
-export declare function isHTMLComponentOfType<T>(object: any, typeClass: TypeOf<T>): object is HTMLComponent<T>;
+export declare function isHTMLComponentOfType<T extends object>(object: any, typeClass: TypeOf<T>): object is HTMLComponent<T>;
 export declare function isHTMLElement(element: HTMLElement): element is HTMLElement;
 export declare function isHTMLUnknownElement(element: HTMLElement): element is HTMLElement;
 export interface CustomFormElement extends CustomElement {

package/component/custom-element.js.map

@@ -1 +1 @@
-{"version":3,"file":"custom-element.js","sourceRoot":"","sources":["../../../src/core/component/custom-element.ts"],"names":[],"mappings":"AAmDA,MAAM,UAAU,eAAe,CAAC,MAAW;IAC1C,OAAO,OAAO,CAAC,GAAG,CAAC,MAAM,EAAE,QAAQ,CAAC;WAChC,MAAM,YAAY,WAAW,CAAC;AACnC,CAAC;AAED,MAAM,UAAU,qBAAqB,CAAI,MAAW,EAAE,SAAoB;IACzE,OAAO,eAAe,CAAC,MAAM,CAAC;WAC1B,OAAO,CAAC,GAAG,CAAC,MAAM,EAAE,QAAQ,CAAC,YAAY,SAAS,CAAC;AACxD,CAAC;AAED,MAAM,UAAU,aAAa,CAAC,OAAoB;IACjD,OAAO,OAAO,IAAI,OAAO,YAAY,WAAW,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,QAAQ,CAAC,GAAG,CAAC,CAAC;AACrF,CAAC;AAED,MAAM,UAAU,oBAAoB,CAAC,OAAoB;IACxD,OAAO,OAAO,IAAI,OAAO,YAAY,kBAAkB,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,QAAQ,CAAC,GAAG,CAAC,CAAC;AAC5F,CAAC","sourcesContent":["import type { ReactiveScope } from '@ibyar/expressions';\nimport type { TypeOf } from '../utils/typeof.js';\nimport type { ElementReactiveScope } from '../directive/providers.js';\nimport { EventEmitter } from './events.js';\nimport { PropertyRef, ComponentRef } from './component.js';\nimport { Model } from '../model/change-detection.js';\n\nexport interface CustomElement {\n\tadoptedCallback(): void;\n\tattributeChangedCallback(name: string, oldValue: any, newValue: any): void;\n\tconnectedCallback(): void;\n\tdisconnectedCallback(): void;\n}\n\nexport type ModelType<T> = T & Model & { [key: string]: any };\n\nexport interface BaseComponent<T> extends CustomElement {\n\n\t_model: ModelType<T>;\n\t_proxyModel: ModelType<T>;\n\t_modelScope: ReactiveScope<T & Model & { [key: string]: any; }>;\n\t_viewScope: ElementReactiveScope;\n\n\tgetComponentRef(): ComponentRef<T>;\n\n\tsetParentComponent<V>(parent: HTMLComponent<V>): void;\n\tgetParentComponent<V>(): HTMLComponent<V>;\n\thasParentComponent(): boolean;\n\n\thasInputStartWith(viewProp: string): boolean;\n\tgetInputStartWith(viewProp: string): PropertyRef | undefined;\n\tgetInput(viewProp: string): PropertyRef | undefined;\n\tgetInputValue(viewProp: string): any;\n\tsetInputValue(viewProp: string, value: any): void;\n\n\thasInput(viewProp: string): boolean;\n\thasProp(propName: string): boolean;\n\thasOutput(viewProp: string): boolean;\n\n\tgetOutput(viewProp: string): PropertyRef | undefined;\n\tgetEventEmitter<V>(viewProp: string): EventEmitter<V> | undefined;\n\n\ttriggerOutput(eventName: string, value?: any): void;\n\ttriggerModelChange(eventName: string, value?: any, source?: HTMLElement): void;\n\temitRootChanges(): void;\n\temitChanges(...events: string[]): void;\n\n}\n\nexport interface HTMLComponent<T> extends BaseComponent<T>, HTMLElement { }\n\nexport function isHTMLComponent(object: any): object is HTMLComponent<any> {\n\treturn Reflect.has(object, '_model')\n\t\t&& object instanceof HTMLElement;\n}\n\nexport function isHTMLComponentOfType<T>(object: any, typeClass: TypeOf<T>): object is HTMLComponent<T> {\n\treturn isHTMLComponent(object)\n\t\t&& Reflect.get(object, '_model') instanceof typeClass;\n}\n\nexport function isHTMLElement(element: HTMLElement): element is HTMLElement {\n\treturn element && element instanceof HTMLElement && !element.tagName?.includes('-');\n}\n\nexport function isHTMLUnknownElement(element: HTMLElement): element is HTMLElement {\n\treturn element && element instanceof HTMLUnknownElement && !element.tagName?.includes('-');\n}\n\n/**\n * Lifecycle callbacks\n * A map, whose keys are the strings \"connectedCallback\", \"disconnectedCallback\", \"adoptedCallback\", \"attributeChangedCallback\", \n * \"formAssociatedCallback\", \"formDisabledCallback\", \"formResetCallback\", and \"formStateRestoreCallback\" \n * https://html.spec.whatwg.org/multipage/custom-elements.html#concept-custom-element-definition-lifecycle-callbacks\n * \n * A form-associated custom element API includes a set of extra lifecycle callbacks to tie in to the form lifecycle.\n * The callbacks are optional: only implement a callback if your element needs to do something at that point in the lifecycle.\n * https://html.spec.whatwg.org/multipage/custom-elements.html#the-elementinternals-interface \n * https://docs.google.com/document/d/1JO8puctCSpW-ZYGU8lF-h4FWRIDQNDVexzHoOQ2iQmY/edit\n */\nexport interface CustomFormElement extends CustomElement {\n\n\t/**\n\t * Called when the browser associates the element with a form element,\n\t * or disassociates the element from a form element.\n\t * @param form \n\t */\n\tformAssociatedCallback(form: HTMLFormElement): void;\n\n\t/**\n\t * Called after the disabled state of the element changes,\n\t * either because the disabled attribute of this element was added or removed;\n\t * or because the disabled state changed on a <fieldset> that's an ancestor of this element.\n\t * The disabled parameter represents the new disabled state of the element.\n\t * The element may, for example, disable elements in its shadow DOM when it is disabled.\n\t * @param disabled \n\t */\n\tformDisabledCallback(disabled: boolean): void;\n\n\t/**\n\t * Called after the form is reset.\n\t * The element should reset itself to some kind of default state.\n\t * For <input> elements, this usually involves setting the value property to\n\t * match the value attribute set in markup (or in the case of a checkbox,\n\t * setting the checked property to match the checked attribute.\n\t */\n\tformResetCallback(): void;\n\n\t/**\n\t * Called in one of two circumstances:\n\t * When the browser restores the state of the element (for example, after a navigation, or when the browser restarts).\n\t *  The mode argument is \"restore\" in this case.\n\t * \n\t * When the browser's input-assist features such as form autofilling sets a value.\n\t *  The mode argument is \"autocomplete\" in this case.\n\t * \n\t * The type of the first argument depends on how the setFormValue() method was called.\n\t * For more details, see Restoring form state.\n\t */\n\tformStateRestoreCallback(value: any, mode: 'restore' | 'autocomplete'): void;\n}\n\nexport interface BaseFormElementComponent<T extends Object> extends BaseComponent<T>, CustomFormElement { }\n\nexport interface HTMLFormElementComponent<T extends Object> extends BaseFormElementComponent<T>, HTMLComponent<T> { }\n\nexport type HTMLFormElement = HTMLButtonElement | HTMLDataListElement | HTMLFieldSetElement | HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement;\n"]}
+{"version":3,"file":"custom-element.js","sourceRoot":"","sources":["../../../src/core/component/custom-element.ts"],"names":[],"mappings":"AAiDA,MAAM,UAAU,eAAe,CAAC,MAAW;IAC1C,OAAO,OAAO,CAAC,GAAG,CAAC,MAAM,EAAE,QAAQ,CAAC;WAChC,MAAM,YAAY,WAAW,CAAC;AACnC,CAAC;AAED,MAAM,UAAU,qBAAqB,CAAmB,MAAW,EAAE,SAAoB;IACxF,OAAO,eAAe,CAAC,MAAM,CAAC;WAC1B,OAAO,CAAC,GAAG,CAAC,MAAM,EAAE,QAAQ,CAAC,YAAY,SAAS,CAAC;AACxD,CAAC;AAED,MAAM,UAAU,aAAa,CAAC,OAAoB;IACjD,OAAO,OAAO,IAAI,OAAO,YAAY,WAAW,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,QAAQ,CAAC,GAAG,CAAC,CAAC;AACrF,CAAC;AAED,MAAM,UAAU,oBAAoB,CAAC,OAAoB;IACxD,OAAO,OAAO,IAAI,OAAO,YAAY,kBAAkB,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,QAAQ,CAAC,GAAG,CAAC,CAAC;AAC5F,CAAC","sourcesContent":["import type { ReactiveScope, ScopeContext } from '@ibyar/expressions';\nimport type { TypeOf } from '../utils/typeof.js';\nimport { EventEmitter } from './events.js';\nimport { PropertyRef, ComponentRef } from './component.js';\n\nexport interface CustomElement {\n\tadoptedCallback(): void;\n\tattributeChangedCallback(name: string, oldValue: any, newValue: any): void;\n\tconnectedCallback(): void;\n\tdisconnectedCallback(): void;\n}\n\nexport type ModelType<T> = T & ScopeContext;\n\nexport type NodeContextType<T> = { 'this': BaseComponent<T> };\n\nexport interface BaseComponent<T> extends CustomElement {\n\n\t_model: ModelType<T>;\n\t_proxyModel: ModelType<T>;\n\t_modelScope: ReactiveScope<T & ScopeContext>;\n\n\t_viewScope: ReactiveScope<{ 'this': BaseComponent<T> }>;\n\n\tgetComponentRef(): ComponentRef<T>;\n\n\tsetParentComponent<V extends object>(parent: HTMLComponent<V>): void;\n\tgetParentComponent<V extends object>(): HTMLComponent<V>;\n\thasParentComponent(): boolean;\n\n\thasInputStartWith(viewProp: string): boolean;\n\tgetInputStartWith(viewProp: string): PropertyRef | undefined;\n\tgetInput(viewProp: string): PropertyRef | undefined;\n\tgetInputValue(viewProp: string): any;\n\tsetInputValue(viewProp: string, value: any): void;\n\n\thasInput(viewProp: string): boolean;\n\thasProp(propName: string): boolean;\n\thasOutput(viewProp: string): boolean;\n\n\tgetOutput(viewProp: string): PropertyRef | undefined;\n\tgetEventEmitter<V>(viewProp: string): EventEmitter<V> | undefined;\n\n\ttriggerOutput(eventName: string, value?: any): void;\n\n}\n\nexport interface HTMLComponent<T> extends BaseComponent<T>, HTMLElement { }\n\nexport function isHTMLComponent(object: any): object is HTMLComponent<any> {\n\treturn Reflect.has(object, '_model')\n\t\t&& object instanceof HTMLElement;\n}\n\nexport function isHTMLComponentOfType<T extends object>(object: any, typeClass: TypeOf<T>): object is HTMLComponent<T> {\n\treturn isHTMLComponent(object)\n\t\t&& Reflect.get(object, '_model') instanceof typeClass;\n}\n\nexport function isHTMLElement(element: HTMLElement): element is HTMLElement {\n\treturn element && element instanceof HTMLElement && !element.tagName?.includes('-');\n}\n\nexport function isHTMLUnknownElement(element: HTMLElement): element is HTMLElement {\n\treturn element && element instanceof HTMLUnknownElement && !element.tagName?.includes('-');\n}\n\n/**\n * Lifecycle callbacks\n * A map, whose keys are the strings \"connectedCallback\", \"disconnectedCallback\", \"adoptedCallback\", \"attributeChangedCallback\", \n * \"formAssociatedCallback\", \"formDisabledCallback\", \"formResetCallback\", and \"formStateRestoreCallback\" \n * https://html.spec.whatwg.org/multipage/custom-elements.html#concept-custom-element-definition-lifecycle-callbacks\n * \n * A form-associated custom element API includes a set of extra lifecycle callbacks to tie in to the form lifecycle.\n * The callbacks are optional: only implement a callback if your element needs to do something at that point in the lifecycle.\n * https://html.spec.whatwg.org/multipage/custom-elements.html#the-elementinternals-interface \n * https://docs.google.com/document/d/1JO8puctCSpW-ZYGU8lF-h4FWRIDQNDVexzHoOQ2iQmY/edit\n */\nexport interface CustomFormElement extends CustomElement {\n\n\t/**\n\t * Called when the browser associates the element with a form element,\n\t * or disassociates the element from a form element.\n\t * @param form \n\t */\n\tformAssociatedCallback(form: HTMLFormElement): void;\n\n\t/**\n\t * Called after the disabled state of the element changes,\n\t * either because the disabled attribute of this element was added or removed;\n\t * or because the disabled state changed on a <fieldset> that's an ancestor of this element.\n\t * The disabled parameter represents the new disabled state of the element.\n\t * The element may, for example, disable elements in its shadow DOM when it is disabled.\n\t * @param disabled \n\t */\n\tformDisabledCallback(disabled: boolean): void;\n\n\t/**\n\t * Called after the form is reset.\n\t * The element should reset itself to some kind of default state.\n\t * For <input> elements, this usually involves setting the value property to\n\t * match the value attribute set in markup (or in the case of a checkbox,\n\t * setting the checked property to match the checked attribute.\n\t */\n\tformResetCallback(): void;\n\n\t/**\n\t * Called in one of two circumstances:\n\t * When the browser restores the state of the element (for example, after a navigation, or when the browser restarts).\n\t *  The mode argument is \"restore\" in this case.\n\t * \n\t * When the browser's input-assist features such as form autofilling sets a value.\n\t *  The mode argument is \"autocomplete\" in this case.\n\t * \n\t * The type of the first argument depends on how the setFormValue() method was called.\n\t * For more details, see Restoring form state.\n\t */\n\tformStateRestoreCallback(value: any, mode: 'restore' | 'autocomplete'): void;\n}\n\nexport interface BaseFormElementComponent<T extends Object> extends BaseComponent<T>, CustomFormElement { }\n\nexport interface HTMLFormElementComponent<T extends Object> extends BaseFormElementComponent<T>, HTMLComponent<T> { }\n\nexport type HTMLFormElement = HTMLButtonElement | HTMLDataListElement | HTMLFieldSetElement | HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement;\n"]}

package/component/provider.js

@@ -3,7 +3,7 @@ export class ElementModelReactiveScope extends ReactiveScope {
     constructor() {
         super(...arguments);
         this.functionProxyMap = new Map();
-        this.contextProxy = createProxyForContext(this.context, this);
+        this.contextProxy = createProxyForContext(this);
     }
     static for(context, type) {
         return new ElementModelReactiveScope(context, type);

package/component/provider.js.map

@@ -1 +1 @@
-{"version":3,"file":"provider.js","sourceRoot":"","sources":["../../../src/core/component/provider.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,oBAAoB,EAAE,aAAa,EAAa,MAAM,oBAAoB,CAAC;AAG3G,MAAM,OAAO,yBAAiE,SAAQ,aAAgB;IAAtG;;QAmBS,qBAAgB,GAAG,IAAI,GAAG,EAAyB,CAAC;QACpD,iBAAY,GAAG,qBAAqB,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;IAgBlE,CAAC;IAnCA,MAAM,CAAC,GAAG,CAAmB,OAAU,EAAE,IAAe;QACvD,OAAO,IAAI,yBAAyB,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;IACrD,CAAC;IACD,MAAM,CAAC,aAAa,CAAmB,OAAU;QAChD,OAAO,IAAI,yBAAyB,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;IACxD,CAAC;IACD,MAAM,CAAC,gBAAgB,CAAmB,OAAU;QACnD,OAAO,IAAI,yBAAyB,CAAC,OAAO,EAAE,UAAU,CAAC,CAAC;IAC3D,CAAC;IACD,MAAM,CAAC,aAAa,CAAmB,OAAU;QAChD,OAAO,IAAI,yBAAyB,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;IACxD,CAAC;IACD,MAAM,CAAC,cAAc,CAAmB,OAAU;QACjD,OAAO,IAAI,yBAAyB,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC;IACzD,CAAC;IACD,MAAM,CAAC,cAAc,CAAmB,OAAU;QACjD,OAAO,IAAI,yBAAyB,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC;IACzD,CAAC;IAGD,eAAe;QACd,OAAO,IAAI,CAAC,YAAY,CAAC;IAC1B,CAAC;IACD,GAAG,CAAC,WAAwB;QAC3B,IAAI,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC,WAAW,CAAC,EAAE;YAC3C,OAAO,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;SAC9C;QACD,MAAM,KAAK,GAAG,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;QACrD,IAAI,OAAO,KAAK,KAAK,UAAU,EAAE;YAChC,MAAM,KAAK,GAAG,IAAI,KAAK,CAAW,KAAK,EAAE,IAAI,oBAAoB,CAAW,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC;YAChG,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC,WAAW,EAAE,KAAK,CAAC,CAAC;YAC9C,OAAO,KAAK,CAAC;SACb;QACD,OAAO,KAAK,CAAC;IACd,CAAC;CACD","sourcesContent":["import { createProxyForContext, FunctionProxyHandler, ReactiveScope, ScopeType } from '@ibyar/expressions';\n\n\nexport class ElementModelReactiveScope<T extends { [key: PropertyKey]: any }> extends ReactiveScope<T> {\n\tstatic for<T extends object>(context: T, type: ScopeType) {\n\t\treturn new ElementModelReactiveScope(context, type);\n\t}\n\tstatic blockScopeFor<T extends object>(context: T) {\n\t\treturn new ElementModelReactiveScope(context, 'block');\n\t}\n\tstatic functionScopeFor<T extends object>(context: T) {\n\t\treturn new ElementModelReactiveScope(context, 'function');\n\t}\n\tstatic classScopeFor<T extends object>(context: T) {\n\t\treturn new ElementModelReactiveScope(context, 'class');\n\t}\n\tstatic moduleScopeFor<T extends object>(context: T) {\n\t\treturn new ElementModelReactiveScope(context, 'module');\n\t}\n\tstatic globalScopeFor<T extends object>(context: T) {\n\t\treturn new ElementModelReactiveScope(context, 'global');\n\t}\n\tprivate functionProxyMap = new Map<PropertyKey, Function>();\n\tprivate contextProxy = createProxyForContext(this.context, this);\n\tgetContextProxy() {\n\t\treturn this.contextProxy;\n\t}\n\tget(propertyKey: PropertyKey): any {\n\t\tif (this.functionProxyMap.has(propertyKey)) {\n\t\t\treturn this.functionProxyMap.get(propertyKey);\n\t\t}\n\t\tconst value = Reflect.get(this.context, propertyKey);\n\t\tif (typeof value === 'function') {\n\t\t\tconst proxy = new Proxy<Function>(value, new FunctionProxyHandler<Function>(this.contextProxy));\n\t\t\tthis.functionProxyMap.set(propertyKey, proxy);\n\t\t\treturn proxy;\n\t\t}\n\t\treturn value;\n\t}\n}\n"]}
+{"version":3,"file":"provider.js","sourceRoot":"","sources":["../../../src/core/component/provider.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,oBAAoB,EAAE,aAAa,EAAa,MAAM,oBAAoB,CAAC;AAG3G,MAAM,OAAO,yBAAiE,SAAQ,aAAgB;IAAtG;;QAmBS,qBAAgB,GAAG,IAAI,GAAG,EAAyB,CAAC;QACpD,iBAAY,GAAG,qBAAqB,CAAC,IAAI,CAAC,CAAC;IAgBpD,CAAC;IAnCA,MAAM,CAAC,GAAG,CAAmB,OAAU,EAAE,IAAe;QACvD,OAAO,IAAI,yBAAyB,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;IACrD,CAAC;IACD,MAAM,CAAC,aAAa,CAAmB,OAAU;QAChD,OAAO,IAAI,yBAAyB,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;IACxD,CAAC;IACD,MAAM,CAAC,gBAAgB,CAAmB,OAAU;QACnD,OAAO,IAAI,yBAAyB,CAAC,OAAO,EAAE,UAAU,CAAC,CAAC;IAC3D,CAAC;IACD,MAAM,CAAC,aAAa,CAAmB,OAAU;QAChD,OAAO,IAAI,yBAAyB,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;IACxD,CAAC;IACD,MAAM,CAAC,cAAc,CAAmB,OAAU;QACjD,OAAO,IAAI,yBAAyB,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC;IACzD,CAAC;IACD,MAAM,CAAC,cAAc,CAAmB,OAAU;QACjD,OAAO,IAAI,yBAAyB,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC;IACzD,CAAC;IAGD,eAAe;QACd,OAAO,IAAI,CAAC,YAAY,CAAC;IAC1B,CAAC;IACD,GAAG,CAAC,WAAwB;QAC3B,IAAI,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC,WAAW,CAAC,EAAE;YAC3C,OAAO,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;SAC9C;QACD,MAAM,KAAK,GAAG,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;QACrD,IAAI,OAAO,KAAK,KAAK,UAAU,EAAE;YAChC,MAAM,KAAK,GAAG,IAAI,KAAK,CAAW,KAAK,EAAE,IAAI,oBAAoB,CAAW,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC;YAChG,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC,WAAW,EAAE,KAAK,CAAC,CAAC;YAC9C,OAAO,KAAK,CAAC;SACb;QACD,OAAO,KAAK,CAAC;IACd,CAAC;CACD","sourcesContent":["import { createProxyForContext, FunctionProxyHandler, ReactiveScope, ScopeType } from '@ibyar/expressions';\n\n\nexport class ElementModelReactiveScope<T extends { [key: PropertyKey]: any }> extends ReactiveScope<T> {\n\tstatic for<T extends object>(context: T, type: ScopeType) {\n\t\treturn new ElementModelReactiveScope(context, type);\n\t}\n\tstatic blockScopeFor<T extends object>(context: T) {\n\t\treturn new ElementModelReactiveScope(context, 'block');\n\t}\n\tstatic functionScopeFor<T extends object>(context: T) {\n\t\treturn new ElementModelReactiveScope(context, 'function');\n\t}\n\tstatic classScopeFor<T extends object>(context: T) {\n\t\treturn new ElementModelReactiveScope(context, 'class');\n\t}\n\tstatic moduleScopeFor<T extends object>(context: T) {\n\t\treturn new ElementModelReactiveScope(context, 'module');\n\t}\n\tstatic globalScopeFor<T extends object>(context: T) {\n\t\treturn new ElementModelReactiveScope(context, 'global');\n\t}\n\tprivate functionProxyMap = new Map<PropertyKey, Function>();\n\tprivate contextProxy = createProxyForContext(this);\n\tgetContextProxy() {\n\t\treturn this.contextProxy;\n\t}\n\tget(propertyKey: PropertyKey): any {\n\t\tif (this.functionProxyMap.has(propertyKey)) {\n\t\t\treturn this.functionProxyMap.get(propertyKey);\n\t\t}\n\t\tconst value = Reflect.get(this.context, propertyKey);\n\t\tif (typeof value === 'function') {\n\t\t\tconst proxy = new Proxy<Function>(value, new FunctionProxyHandler<Function>(this.contextProxy));\n\t\t\tthis.functionProxyMap.set(propertyKey, proxy);\n\t\t\treturn proxy;\n\t\t}\n\t\treturn value;\n\t}\n}\n"]}

package/directive/directive.d.ts

@@ -1,14 +1,9 @@
-import { DOMElementNode, DOMNode } from '@ibyar/elements';
-import { ComponentRender } from '../view/render.js';
-import type { Stack } from '@ibyar/expressions';
+import { TemplateRef } from '../linker/template-ref.js';
+import { ViewContainerRef } from '../linker/view-container-ref.js';
 export declare class StructuralDirective {
-    protected render: ComponentRender<any>;
-    protected directiveStack: Stack;
-    protected comment: Comment;
-    protected parentNode: Node;
-    protected node: DOMNode;
-    constructor(render: ComponentRender<any>, directiveStack: Stack, comment: Comment, parentNode: Node, node: DOMNode);
-    protected findTemplate(templateRefName: string): DOMElementNode | undefined;
+    protected templateRef: TemplateRef;
+    protected viewContainerRef: ViewContainerRef;
+    constructor(templateRef: TemplateRef, viewContainerRef: ViewContainerRef);
 }
 export declare class AttributeDirective {
     protected el: HTMLElement;

package/directive/directive.js

@@ -1,13 +1,7 @@
 export class StructuralDirective {
-    constructor(render, directiveStack, comment, parentNode, node) {
-        this.render = render;
-        this.directiveStack = directiveStack;
-        this.comment = comment;
-        this.parentNode = parentNode;
-        this.node = node;
-    }
-    findTemplate(templateRefName) {
-        return this.render.templateRefMap.get(templateRefName);
+    constructor(templateRef, viewContainerRef) {
+        this.templateRef = templateRef;
+        this.viewContainerRef = viewContainerRef;
     }
 }
 export class AttributeDirective {

package/directive/directive.js.map

@@ -1 +1 @@
-{"version":3,"file":"directive.js","sourceRoot":"","sources":["../../../src/core/directive/directive.ts"],"names":[],"mappings":"AAQA,MAAM,OAAO,mBAAmB;IAC/B,YACW,MAA4B,EAC5B,cAAqB,EACrB,OAAgB,EAChB,UAAgB,EAChB,IAAa;QAJb,WAAM,GAAN,MAAM,CAAsB;QAC5B,mBAAc,GAAd,cAAc,CAAO;QACrB,YAAO,GAAP,OAAO,CAAS;QAChB,eAAU,GAAV,UAAU,CAAM;QAChB,SAAI,GAAJ,IAAI,CAAS;IAEpB,CAAC;IACK,YAAY,CAAC,eAAuB;QAC7C,OAAO,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IACxD,CAAC;CACD;AAKD,MAAM,OAAO,kBAAkB;IAC9B,YAAsB,EAAe;QAAf,OAAE,GAAF,EAAE,CAAa;IAAI,CAAC;CAC1C","sourcesContent":["import { DOMElementNode, DOMNode } from '@ibyar/elements';\nimport { ComponentRender } from '../view/render.js';\n\nimport type { Stack } from '@ibyar/expressions';\n\n/**\n * A structural directive selector as '*if'\n */\nexport class StructuralDirective {\n\tconstructor(\n\t\tprotected render: ComponentRender<any>,\n\t\tprotected directiveStack: Stack,\n\t\tprotected comment: Comment,\n\t\tprotected parentNode: Node,\n\t\tprotected node: DOMNode,\n\n\t) { }\n\tprotected findTemplate(templateRefName: string): DOMElementNode | undefined {\n\t\treturn this.render.templateRefMap.get(templateRefName);\n\t}\n}\n\n/**\n * An attributes directive selector as '[class] [style]'\n */\nexport class AttributeDirective {\n\tconstructor(protected el: HTMLElement) { }\n}\n"]}
+{"version":3,"file":"directive.js","sourceRoot":"","sources":["../../../src/core/directive/directive.ts"],"names":[],"mappings":"AAOA,MAAM,OAAO,mBAAmB;IAC/B,YACW,WAAwB,EACxB,gBAAkC;QADlC,gBAAW,GAAX,WAAW,CAAa;QACxB,qBAAgB,GAAhB,gBAAgB,CAAkB;IACzC,CAAC;CACL;AAKD,MAAM,OAAO,kBAAkB;IAC9B,YAAsB,EAAe;QAAf,OAAE,GAAF,EAAE,CAAa;IAAI,CAAC;CAC1C","sourcesContent":["\nimport { TemplateRef } from '../linker/template-ref.js';\nimport { ViewContainerRef } from '../linker/view-container-ref.js';\n\n/**\n * A structural directive selector as '*if' '*for'\n */\nexport class StructuralDirective {\n\tconstructor(\n\t\tprotected templateRef: TemplateRef,\n\t\tprotected viewContainerRef: ViewContainerRef,\n\t) { }\n}\n\n/**\n * An attributes directive selector as '[class] [style]'\n */\nexport class AttributeDirective {\n\tconstructor(protected el: HTMLElement) { }\n}\n"]}

package/directive/parser.d.ts

@@ -0,0 +1,30 @@
+import { Token, TokenExpression, TokenStream } from '@ibyar/expressions';
+export declare type DirectiveExpressionType = {
+    templateExpressions: Array<TokenExpression[]>;
+    directiveInputs: Map<string, string>;
+};
+export declare class DirectiveExpressionParser {
+    protected directiveName: string;
+    protected stream: TokenStream;
+    static parse(directiveName: string, expression: string): DirectiveExpressionType;
+    protected templateExpressions: TokenExpression[][];
+    protected directiveInputs: Map<string, string>;
+    constructor(directiveName: string, stream: TokenStream);
+    getDirectiveExpressionType(): DirectiveExpressionType;
+    scan(): void;
+    protected consume(token: Token): void;
+    protected check(token: Token): boolean;
+    protected consumeToList(token: Token, list: TokenExpression[]): void;
+    protected consumeIfToken(token: Token, list: TokenExpression[]): boolean;
+    protected isLet(): boolean;
+    protected isIdentifier(): boolean;
+    protected isAsKeyword(): boolean;
+    protected consumeAsKeyword(): void;
+    protected isSemicolon(): boolean;
+    protected isComma(): boolean;
+    protected consumeSemicolonOrComma(): void;
+    protected parseTemplateInput(): boolean;
+    protected parseExpression(inputName: string): void;
+    protected parseDirectiveAndTemplateInputs(): void;
+    private mapTokenToString;
+}