@ibyar/core 0.5.6 → 0.5.62

package/html/expression.js

@@ -16,6 +16,13 @@ function convertToMemberAccessStyle(source) {
     }
     return dashSplits[0] + dashSplits.splice(1).map(s => (s[0].toUpperCase() + s.substring(1))).join('');
 }
+/**
+ * warp js code with `()` if necessary
+ *
+ * `{name: 'alex'}` will be `({name: 'alex'})`
+ *
+ * @param params
+ */
 function checkAndValidateObjectSyntax(source) {
     if (source.startsWith('{')) {
         return `(${source})`;
@@ -76,6 +83,7 @@ function parseBaseNode(base) {
 }
 function parseChild(child) {
     if (child instanceof DomElementNode) {
+        // DomElementNode
         parseBaseNode(child);
         parseDomParentNode(child);
     }
@@ -83,8 +91,10 @@ function parseChild(child) {
         let expressions = [];
         child.templateExpressions = expressions;
         if (child.value) {
+            // use shorthand syntax, possible mixed with input and outputs
             const info = DirectiveExpressionParser.parse(child.name.substring(1), child.value);
             expressions.push(...info.templateExpressions.map(template => JavaScriptParser.parseScript(template)));
+            // <div let-i="index">{{item}}</div>
             searchForLetAttributes(child, expressions);
             if (info.directiveInputs.size > 0) {
                 const ref = ClassRegistryProvider.getDirectiveRef(child.name);
@@ -102,6 +112,8 @@ function parseChild(child) {
         else {
             searchForLetAttributes(child, expressions);
         }
+        // DomDirectiveNode
+        // in case if add input/output support need to handle that here.
         parseChild(child.node);
         parseBaseNode(child);
     }

package/html/expression.js.map

@@ -1 +1 @@
-{"version":3,"file":"expression.js","sourceRoot":"","sources":["../../../src/core/html/expression.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n\tBaseNode, createLiveAttribute,\n\tDomStructuralDirectiveNode, DomElementNode, DomNode,\n\tDomFragmentNode, DomParentNode, ElementAttribute,\n\tisLiveTextContent, LiveAttribute, LiveTextContent,\n\tDomStructuralDirectiveNodeUpgrade, DomAttributeDirectiveNode\n} from '@ibyar/elements';\nimport {\n\tExpressionNode, expressionVisitor, Identifier,\n\tJavaScriptParser, LanguageMode, MemberExpression, PipelineExpression\n} from '@ibyar/expressions';\nimport {\n\tBindingAssignment,\n\tOneWayAssignmentExpression,\n\tTwoWayAssignmentExpression\n} from '../binding/binding.expressions.js';\nimport { DirectiveExpressionParser } from '../directive/parser.js';\nimport { ClassRegistryProvider } from '../providers/provider.js';\n\ndeclare module '@ibyar/elements' {\n\texport interface ElementAttribute<N, V> {\n\t\texpression: ExpressionNode;\n\t}\n\n\texport interface LiveAttribute {\n\t\texpression: BindingAssignment;\n\t\tpipelineNames?: string[];\n\t}\n\n\texport interface LiveTextContent {\n\t\texpression: OneWayAssignmentExpression;\n\t\tpipelineNames?: string[];\n\t}\n\texport interface DomStructuralDirectiveNodeUpgrade extends DomStructuralDirectiveNode {\n\t\t/**\n\t\t * create a new scope for a template and bind the new variables to the directive scope.\n\t\t * \n\t\t * execution for let-i=\"index\".\n\t\t */\n\t\ttemplateExpressions: ExpressionNode[];\n\t}\n\n\texport interface DomAttributeDirectiveNodeUpgrade extends DomAttributeDirectiveNode {\n\n\t}\n}\n\nconst ThisTextContent = JavaScriptParser.parseScript('this.textContent') as MemberExpression;\nfunction parseLiveText(text: LiveTextContent) {\n\tconst textExpression = JavaScriptParser.parse(text.value);\n\ttext.expression = new OneWayAssignmentExpression(ThisTextContent, textExpression);\n\ttext.pipelineNames = getPipelineNames(textExpression);\n}\n\nfunction convertToMemberAccessStyle(source: string | string[]) {\n\tconst dashSplits = Array.isArray(source) ? source : source.split('-');\n\tif (dashSplits.length === 1) {\n\t\treturn source;\n\t}\n\treturn dashSplits[0] + dashSplits.splice(1).map(s => (s[0].toUpperCase() + s.substring(1))).join('');\n}\n\n/**\n * warp js code with `()` if necessary\n * \n * `{name: 'alex'}` will be `({name: 'alex'})`\n * \n * @param params \n */\nfunction checkAndValidateObjectSyntax(source: string) {\n\tif (source.startsWith('{')) {\n\t\treturn `(${source})`;\n\t}\n\treturn source;\n}\nfunction parseLiveAttribute(attr: LiveAttribute) {\n\tconst elementSource = `this.${convertToMemberAccessStyle(attr.name)}`;\n\tconst elementExpression = JavaScriptParser.parseScript(elementSource);\n\tconst modelExpression = JavaScriptParser.parseScript(checkAndValidateObjectSyntax(attr.value));\n\tif (elementExpression instanceof MemberExpression\n\t\t&& (modelExpression instanceof MemberExpression || modelExpression instanceof Identifier)) {\n\t\tattr.expression = new TwoWayAssignmentExpression(elementExpression, modelExpression);\n\t} else {\n\t\tconsole.error(`${attr.name}=\"${attr.value}\"\" is not a valid MemberExpression or Identifier 'x.y.z'`);\n\t}\n\n}\n\nfunction getPipelineNames(modelExpression: ExpressionNode): string[] | undefined {\n\tconst pipelineNames: string[] = [];\n\texpressionVisitor.visit(modelExpression, (expression, type, control) => {\n\t\tif (type === 'PipelineExpression') {\n\t\t\tconst pipelineName = (expression as PipelineExpression).getRight();\n\t\t\tif (pipelineName instanceof Identifier) {\n\t\t\t\tpipelineNames.push(pipelineName.getName() as string);\n\t\t\t}\n\t\t}\n\t});\n\treturn pipelineNames.length ? pipelineNames : undefined;\n}\n\nfunction parseLiveAttributeUpdateElement(attr: LiveAttribute) {\n\tconst elementSource = `this.${convertToMemberAccessStyle(attr.name)}`;\n\tconst elementExpression = JavaScriptParser.parseScript(elementSource);\n\tconst modelExpression = JavaScriptParser.parseScript(checkAndValidateObjectSyntax(attr.value));\n\tif (elementExpression instanceof MemberExpression) {\n\t\tattr.expression = new OneWayAssignmentExpression(elementExpression, modelExpression);\n\t} else {\n\t\tconsole.error(`${attr.name} is not a valid MemberExpression 'x.y.z'`);\n\t}\n\tattr.pipelineNames = getPipelineNames(modelExpression);\n}\n\nfunction parseOutputExpression(attr: ElementAttribute<string, string>) {\n\tattr.expression = JavaScriptParser.parseScript(attr.value);\n}\n\nfunction parseAttributeDirectives(directive: DomAttributeDirectiveNode) {\n\tdirective.inputs?.forEach(parseLiveAttributeUpdateElement);\n\tdirective.outputs?.forEach(parseOutputExpression);\n\tdirective.twoWayBinding?.forEach(parseLiveAttribute);\n\tdirective.templateAttrs?.forEach(parseLiveAttributeUpdateElement);\n}\n\nfunction parseBaseNode(base: BaseNode) {\n\tbase.inputs?.forEach(parseLiveAttributeUpdateElement);\n\tbase.outputs?.forEach(parseOutputExpression);\n\tbase.twoWayBinding?.forEach(parseLiveAttribute);\n\tbase.templateAttrs?.forEach(parseLiveAttributeUpdateElement);\n\tbase.attributeDirectives?.forEach(parseAttributeDirectives);\n}\n\nfunction parseChild(child: DomNode) {\n\tif (child instanceof DomElementNode) {\n\t\t// DomElementNode\n\t\tparseBaseNode(child);\n\t\tparseDomParentNode(child);\n\t} else if (child instanceof DomStructuralDirectiveNode) {\n\t\tlet expressions: ExpressionNode[] = [];\n\t\t(child as DomStructuralDirectiveNodeUpgrade).templateExpressions = expressions;\n\t\tif (child.value) {\n\t\t\t// use shorthand syntax, possible mixed with input and outputs\n\t\t\tconst info = DirectiveExpressionParser.parse(child.name.substring(1), child.value);\n\t\t\texpressions.push(...info.templateExpressions.map(template => JavaScriptParser.parseScript(template)));\n\t\t\t// <div let-i=\"index\">{{item}}</div>\n\n\t\t\tsearchForLetAttributes(child, expressions);\n\n\t\t\tif (info.directiveInputs.size > 0) {\n\t\t\t\tconst ref = ClassRegistryProvider.getDirectiveRef(child.name);\n\t\t\t\tif (!ref?.inputs?.length) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tchild.inputs ??= [];\n\t\t\t\tinfo.directiveInputs.forEach((expression, input) => {\n\t\t\t\t\tconst modelName = ref?.inputs.find(i => i.viewAttribute === input)?.modelProperty ?? input;\n\t\t\t\t\tconst attr: LiveAttribute = createLiveAttribute(modelName, expression);\n\t\t\t\t\t(child.inputs ??= []).push(attr);\n\t\t\t\t});\n\t\t\t}\n\t\t} else {\n\t\t\tsearchForLetAttributes(child, expressions);\n\t\t}\n\t\t// DomDirectiveNode\n\t\t// in case if add input/output support need to handle that here.\n\t\tparseChild(child.node);\n\t\tparseBaseNode(child);\n\t} else if (isLiveTextContent(child)) {\n\t\tparseLiveText(child);\n\t} else if (child instanceof DomFragmentNode) {\n\t\tparseDomParentNode(child);\n\t}\n}\n\nfunction searchForLetAttributes(child: DomStructuralDirectiveNode, expressions: ExpressionNode[]) {\n\tconst templateExpressionsFromInput = child.attributes?.filter(attr => attr.name.startsWith('let-'));\n\ttemplateExpressionsFromInput?.forEach(attr => {\n\t\tchild.attributes!.splice(child.attributes!.indexOf(attr), 1);\n\t\tconst attrName = convertToMemberAccessStyle(attr.name.split('-').slice(1));\n\t\tconst expression = `let ${attrName} = ${(typeof attr.value == 'string') ? attr.value : '$implicit'}`;\n\t\texpressions.push(JavaScriptParser.parseScript(expression));\n\t});\n}\n\nfunction parseDomParentNode(parent: DomParentNode) {\n\tparent.children?.forEach(parseChild);\n}\n\nexport function buildExpressionNodes(node: DomNode) {\n\tif (node instanceof DomFragmentNode) {\n\t\tparseDomParentNode(node);\n\t} else {\n\t\tparseChild(node);\n\t}\n}\n"]}
+{"version":3,"file":"expression.js","sourceRoot":"","sources":["../../../src/core/html/expression.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n\tBaseNode, createLiveAttribute,\n\tDomStructuralDirectiveNode, DomElementNode, DomNode,\n\tDomFragmentNode, DomParentNode, ElementAttribute,\n\tisLiveTextContent, LiveAttribute, LiveTextContent,\n\tDomStructuralDirectiveNodeUpgrade, DomAttributeDirectiveNode\n} from '@ibyar/elements';\nimport {\n\tExpressionNode, expressionVisitor, Identifier,\n\tJavaScriptParser, LanguageMode, MemberExpression, PipelineExpression\n} from '@ibyar/expressions';\nimport {\n\tBindingAssignment,\n\tOneWayAssignmentExpression,\n\tTwoWayAssignmentExpression\n} from '../binding/binding.expressions.js';\nimport { DirectiveExpressionParser } from '../directive/parser.js';\nimport { ClassRegistryProvider } from '../providers/provider.js';\n\ndeclare module '@ibyar/elements' {\n\texport interface ElementAttribute<N, V> {\n\t\texpression: ExpressionNode;\n\t}\n\n\texport interface LiveAttribute {\n\t\texpression: BindingAssignment;\n\t\tpipelineNames?: string[];\n\t}\n\n\texport interface LiveTextContent {\n\t\texpression: OneWayAssignmentExpression;\n\t\tpipelineNames?: string[];\n\t}\n\texport interface DomStructuralDirectiveNodeUpgrade extends DomStructuralDirectiveNode {\n\t\t/**\n\t\t * create a new scope for a template and bind the new variables to the directive scope.\n\t\t * \n\t\t * execution for let-i=\"index\".\n\t\t */\n\t\ttemplateExpressions: ExpressionNode[];\n\t}\n\n\texport interface DomAttributeDirectiveNodeUpgrade extends DomAttributeDirectiveNode {\n\n\t}\n}\n\nconst ThisTextContent = JavaScriptParser.parseScript('this.textContent') as MemberExpression;\nfunction parseLiveText(text: LiveTextContent) {\n\tconst textExpression = JavaScriptParser.parse(text.value);\n\ttext.expression = new OneWayAssignmentExpression(ThisTextContent, textExpression);\n\ttext.pipelineNames = getPipelineNames(textExpression);\n}\n\nfunction convertToMemberAccessStyle(source: string | string[]) {\n\tconst dashSplits = Array.isArray(source) ? source : source.split('-');\n\tif (dashSplits.length === 1) {\n\t\treturn source;\n\t}\n\treturn dashSplits[0] + dashSplits.splice(1).map(s => (s[0].toUpperCase() + s.substring(1))).join('');\n}\n\n/**\n * warp js code with `()` if necessary\n * \n * `{name: 'alex'}` will be `({name: 'alex'})`\n * \n * @param params \n */\nfunction checkAndValidateObjectSyntax(source: string) {\n\tif (source.startsWith('{')) {\n\t\treturn `(${source})`;\n\t}\n\treturn source;\n}\nfunction parseLiveAttribute(attr: LiveAttribute) {\n\tconst elementSource = `this.${convertToMemberAccessStyle(attr.name)}`;\n\tconst elementExpression = JavaScriptParser.parseScript(elementSource);\n\tconst modelExpression = JavaScriptParser.parseScript(checkAndValidateObjectSyntax(attr.value));\n\tif (elementExpression instanceof MemberExpression\n\t\t&& (modelExpression instanceof MemberExpression || modelExpression instanceof Identifier)) {\n\t\tattr.expression = new TwoWayAssignmentExpression(elementExpression, modelExpression);\n\t} else {\n\t\tconsole.error(`${attr.name}=\"${attr.value}\"\" is not a valid MemberExpression or Identifier 'x.y.z'`);\n\t}\n\n}\n\nfunction getPipelineNames(modelExpression: ExpressionNode): string[] | undefined {\n\tconst pipelineNames: string[] = [];\n\texpressionVisitor.visit(modelExpression, (expression, type, control) => {\n\t\tif (type === 'PipelineExpression') {\n\t\t\tconst pipelineName = (expression as PipelineExpression).getRight();\n\t\t\tif (pipelineName instanceof Identifier) {\n\t\t\t\tpipelineNames.push(pipelineName.getName() as string);\n\t\t\t}\n\t\t}\n\t});\n\treturn pipelineNames.length ? pipelineNames : undefined;\n}\n\nfunction parseLiveAttributeUpdateElement(attr: LiveAttribute) {\n\tconst elementSource = `this.${convertToMemberAccessStyle(attr.name)}`;\n\tconst elementExpression = JavaScriptParser.parseScript(elementSource);\n\tconst modelExpression = JavaScriptParser.parseScript(checkAndValidateObjectSyntax(attr.value));\n\tif (elementExpression instanceof MemberExpression) {\n\t\tattr.expression = new OneWayAssignmentExpression(elementExpression, modelExpression);\n\t} else {\n\t\tconsole.error(`${attr.name} is not a valid MemberExpression 'x.y.z'`);\n\t}\n\tattr.pipelineNames = getPipelineNames(modelExpression);\n}\n\nfunction parseOutputExpression(attr: ElementAttribute<string, string>) {\n\tattr.expression = JavaScriptParser.parseScript(attr.value);\n}\n\nfunction parseAttributeDirectives(directive: DomAttributeDirectiveNode) {\n\tdirective.inputs?.forEach(parseLiveAttributeUpdateElement);\n\tdirective.outputs?.forEach(parseOutputExpression);\n\tdirective.twoWayBinding?.forEach(parseLiveAttribute);\n\tdirective.templateAttrs?.forEach(parseLiveAttributeUpdateElement);\n}\n\nfunction parseBaseNode(base: BaseNode) {\n\tbase.inputs?.forEach(parseLiveAttributeUpdateElement);\n\tbase.outputs?.forEach(parseOutputExpression);\n\tbase.twoWayBinding?.forEach(parseLiveAttribute);\n\tbase.templateAttrs?.forEach(parseLiveAttributeUpdateElement);\n\tbase.attributeDirectives?.forEach(parseAttributeDirectives);\n}\n\nfunction parseChild(child: DomNode) {\n\tif (child instanceof DomElementNode) {\n\t\t// DomElementNode\n\t\tparseBaseNode(child);\n\t\tparseDomParentNode(child);\n\t} else if (child instanceof DomStructuralDirectiveNode) {\n\t\tlet expressions: ExpressionNode[] = [];\n\t\t(child as DomStructuralDirectiveNodeUpgrade).templateExpressions = expressions;\n\t\tif (child.value) {\n\t\t\t// use shorthand syntax, possible mixed with input and outputs\n\t\t\tconst info = DirectiveExpressionParser.parse(child.name.substring(1), child.value);\n\t\t\texpressions.push(...info.templateExpressions.map(template => JavaScriptParser.parseScript(template)));\n\t\t\t// <div let-i=\"index\">{{item}}</div>\n\n\t\t\tsearchForLetAttributes(child, expressions);\n\n\t\t\tif (info.directiveInputs.size > 0) {\n\t\t\t\tconst ref = ClassRegistryProvider.getDirectiveRef(child.name);\n\t\t\t\tif (!ref?.inputs?.length) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tchild.inputs ??= [];\n\t\t\t\tinfo.directiveInputs.forEach((expression, input) => {\n\t\t\t\t\tconst modelName = ref?.inputs.find(i => i.viewAttribute === input)?.modelProperty ?? input;\n\t\t\t\t\tconst attr: LiveAttribute = createLiveAttribute(modelName, expression);\n\t\t\t\t\t(child.inputs ??= []).push(attr);\n\t\t\t\t});\n\t\t\t}\n\t\t} else {\n\t\t\tsearchForLetAttributes(child, expressions);\n\t\t}\n\t\t// DomDirectiveNode\n\t\t// in case if add input/output support need to handle that here.\n\t\tparseChild(child.node);\n\t\tparseBaseNode(child);\n\t} else if (isLiveTextContent(child)) {\n\t\tparseLiveText(child);\n\t} else if (child instanceof DomFragmentNode) {\n\t\tparseDomParentNode(child);\n\t}\n}\n\nfunction searchForLetAttributes(child: DomStructuralDirectiveNode, expressions: ExpressionNode[]) {\n\tconst templateExpressionsFromInput = child.attributes?.filter(attr => attr.name.startsWith('let-'));\n\ttemplateExpressionsFromInput?.forEach(attr => {\n\t\tchild.attributes!.splice(child.attributes!.indexOf(attr), 1);\n\t\tconst attrName = convertToMemberAccessStyle(attr.name.split('-').slice(1));\n\t\tconst expression = `let ${attrName} = ${(typeof attr.value == 'string') ? attr.value : '$implicit'}`;\n\t\texpressions.push(JavaScriptParser.parseScript(expression));\n\t});\n}\n\nfunction parseDomParentNode(parent: DomParentNode) {\n\tparent.children?.forEach(parseChild);\n}\n\nexport function buildExpressionNodes(node: DomNode) {\n\tif (node instanceof DomFragmentNode) {\n\t\tparseDomParentNode(node);\n\t} else {\n\t\tparseChild(node);\n\t}\n}\n"]}

package/linker/change-detector-ref.d.ts

@@ -1,7 +1,21 @@
 import { ReactiveScopeControl, ScopeContext } from '@ibyar/expressions';
 export declare abstract class ChangeDetectorRef {
+    /**
+     * used when want to update ui-view like, you want to replace an array with another
+     * without reflect changes on view until reattached again.
+     */
     abstract detach(): void;
+    /**
+     * apply all the not emitted changes, and continue emit in time.
+     */
     abstract reattach(): void;
+    /**
+     * apply changes now,
+     * will not effect the state of the detector wither if attached ot not.
+     */
     abstract markForCheck(): void;
 }
+/**
+ * create a change Detector Reference by property key.
+ */
 export declare function createChangeDetectorRef(scope: ReactiveScopeControl<ScopeContext>, propertyKey: keyof ScopeContext): ChangeDetectorRef;

package/linker/change-detector-ref.js

@@ -15,6 +15,9 @@ class ChangeDetectorRefImpl extends ChangeDetectorRef {
         this.changeDetectorRef.markForCheck();
     }
 }
+/**
+ * create a change Detector Reference by property key.
+ */
 export function createChangeDetectorRef(scope, propertyKey) {
     const changeDetectorRef = {
         detach() {

package/linker/change-detector-ref.js.map

@@ -1 +1 @@
-{"version":3,"file":"change-detector-ref.js","sourceRoot":"","sources":["../../../src/core/linker/change-detector-ref.ts"],"names":[],"mappings":"AAEA,MAAM,OAAgB,iBAAiB;CAkBtC;AAED,MAAM,qBAAsB,SAAQ,iBAAiB;IACpD,YAAoB,iBAAoC;QAAI,KAAK,EAAE,CAAC;QAAhD,sBAAiB,GAAjB,iBAAiB,CAAmB;IAAa,CAAC;IACtE,MAAM;QACL,IAAI,CAAC,iBAAiB,CAAC,MAAM,EAAE,CAAC;IACjC,CAAC;IACD,QAAQ;QACP,IAAI,CAAC,iBAAiB,CAAC,QAAQ,EAAE,CAAC;IACnC,CAAC;IACD,YAAY;QACX,IAAI,CAAC,iBAAiB,CAAC,YAAY,EAAE,CAAC;IACvC,CAAC;CACD;AAKD,MAAM,UAAU,uBAAuB,CAAC,KAAyC,EAAE,WAA+B;IACjH,MAAM,iBAAiB,GAAsB;QAC5C,MAAM;YACL,KAAK,CAAC,MAAM,EAAE,CAAC;QAChB,CAAC;QACD,QAAQ;YACP,KAAK,CAAC,QAAQ,EAAE,CAAC;QAClB,CAAC;QACD,YAAY;YACX,KAAK,CAAC,WAAW,CAAC,WAAW,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC,CAAC;QACxD,CAAC;KACD,CAAC;IACF,OAAO,IAAI,qBAAqB,CAAC,iBAAiB,CAAC,CAAC;AACrD,CAAC","sourcesContent":["import { ReactiveScopeControl, ScopeContext } from '@ibyar/expressions';\n\nexport abstract class ChangeDetectorRef {\n\n\t/**\n\t * used when want to update ui-view like, you want to replace an array with another \n\t * without reflect changes on view until reattached again.\n\t */\n\tabstract detach(): void;\n\n\t/**\n\t * apply all the not emitted changes, and continue emit in time.\n\t */\n\tabstract reattach(): void;\n\n\t/**\n\t * apply changes now,\n\t * will not effect the state of the detector wither if attached ot not.\n\t */\n\tabstract markForCheck(): void;\n}\n\nclass ChangeDetectorRefImpl extends ChangeDetectorRef {\n\tconstructor(private changeDetectorRef: ChangeDetectorRef) { super(); }\n\tdetach(): void {\n\t\tthis.changeDetectorRef.detach();\n\t}\n\treattach(): void {\n\t\tthis.changeDetectorRef.reattach();\n\t}\n\tmarkForCheck(): void {\n\t\tthis.changeDetectorRef.markForCheck();\n\t}\n}\n\n/**\n * create a change Detector Reference by property key.\n */\nexport function createChangeDetectorRef(scope: ReactiveScopeControl<ScopeContext>, propertyKey: keyof ScopeContext): ChangeDetectorRef {\n\tconst changeDetectorRef: ChangeDetectorRef = {\n\t\tdetach() {\n\t\t\tscope.detach();\n\t\t},\n\t\treattach() {\n\t\t\tscope.reattach();\n\t\t},\n\t\tmarkForCheck() {\n\t\t\tscope.emitChanges(propertyKey, scope.get(propertyKey));\n\t\t}\n\t};\n\treturn new ChangeDetectorRefImpl(changeDetectorRef);\n}\n"]}
+{"version":3,"file":"change-detector-ref.js","sourceRoot":"","sources":["../../../src/core/linker/change-detector-ref.ts"],"names":[],"mappings":"AAEA,MAAM,OAAgB,iBAAiB;CAkBtC;AAED,MAAM,qBAAsB,SAAQ,iBAAiB;IACpD,YAAoB,iBAAoC;QAAI,KAAK,EAAE,CAAC;QAAhD,sBAAiB,GAAjB,iBAAiB,CAAmB;IAAa,CAAC;IACtE,MAAM;QACL,IAAI,CAAC,iBAAiB,CAAC,MAAM,EAAE,CAAC;IACjC,CAAC;IACD,QAAQ;QACP,IAAI,CAAC,iBAAiB,CAAC,QAAQ,EAAE,CAAC;IACnC,CAAC;IACD,YAAY;QACX,IAAI,CAAC,iBAAiB,CAAC,YAAY,EAAE,CAAC;IACvC,CAAC;CACD;AAED;;GAEG;AACH,MAAM,UAAU,uBAAuB,CAAC,KAAyC,EAAE,WAA+B;IACjH,MAAM,iBAAiB,GAAsB;QAC5C,MAAM;YACL,KAAK,CAAC,MAAM,EAAE,CAAC;QAChB,CAAC;QACD,QAAQ;YACP,KAAK,CAAC,QAAQ,EAAE,CAAC;QAClB,CAAC;QACD,YAAY;YACX,KAAK,CAAC,WAAW,CAAC,WAAW,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC,CAAC;QACxD,CAAC;KACD,CAAC;IACF,OAAO,IAAI,qBAAqB,CAAC,iBAAiB,CAAC,CAAC;AACrD,CAAC","sourcesContent":["import { ReactiveScopeControl, ScopeContext } from '@ibyar/expressions';\n\nexport abstract class ChangeDetectorRef {\n\n\t/**\n\t * used when want to update ui-view like, you want to replace an array with another \n\t * without reflect changes on view until reattached again.\n\t */\n\tabstract detach(): void;\n\n\t/**\n\t * apply all the not emitted changes, and continue emit in time.\n\t */\n\tabstract reattach(): void;\n\n\t/**\n\t * apply changes now,\n\t * will not effect the state of the detector wither if attached ot not.\n\t */\n\tabstract markForCheck(): void;\n}\n\nclass ChangeDetectorRefImpl extends ChangeDetectorRef {\n\tconstructor(private changeDetectorRef: ChangeDetectorRef) { super(); }\n\tdetach(): void {\n\t\tthis.changeDetectorRef.detach();\n\t}\n\treattach(): void {\n\t\tthis.changeDetectorRef.reattach();\n\t}\n\tmarkForCheck(): void {\n\t\tthis.changeDetectorRef.markForCheck();\n\t}\n}\n\n/**\n * create a change Detector Reference by property key.\n */\nexport function createChangeDetectorRef(scope: ReactiveScopeControl<ScopeContext>, propertyKey: keyof ScopeContext): ChangeDetectorRef {\n\tconst changeDetectorRef: ChangeDetectorRef = {\n\t\tdetach() {\n\t\t\tscope.detach();\n\t\t},\n\t\treattach() {\n\t\t\tscope.reattach();\n\t\t},\n\t\tmarkForCheck() {\n\t\t\tscope.emitChanges(propertyKey, scope.get(propertyKey));\n\t\t}\n\t};\n\treturn new ChangeDetectorRefImpl(changeDetectorRef);\n}\n"]}

package/linker/template-ref.d.ts

@@ -5,7 +5,19 @@ import { StructuralDirective } from '../directive/directive.js';
 import { ComponentRender } from '../view/render.js';
 import { EmbeddedViewRef } from './view-ref.js';
 export declare abstract class TemplateRef {
+    /**
+     * get the current ref of this template
+     */
     abstract get astNode(): DomNode;
+    /**
+     * Instantiates an embedded view based on this template,
+     * `Not attached to the view`.
+     * @param context The data-binding context of the embedded view, as declared
+     * in the `<template>` usage.
+     *
+     * To insert it to a view need to use a `ViewContainerRef.createEmbeddedView()`
+     * @returns The new embedded view object.
+     */
     abstract createEmbeddedView<C extends object>(context: C, parentNode: Node): EmbeddedViewRef<C>;
 }
 export declare class TemplateRefImpl extends TemplateRef {

package/linker/template-ref.js

@@ -37,9 +37,11 @@ export class TemplateRefImpl extends TemplateRef {
         if (!this.templateExpressions?.length) {
             return;
         }
+        // init value
         this.templateExpressions.forEach(expression => {
             expression.get(sandBox);
         });
+        // subscribe to changes
         const scopeSubscriptions = [];
         this.templateExpressions.forEach(expression => {
             const events = expression.events();

package/linker/template-ref.js.map

@@ -1 +1 @@
-{"version":3,"file":"template-ref.js","sourceRoot":"","sources":["../../../src/core/linker/template-ref.ts"],"names":[],"mappings":"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","sourcesContent":["import { DomNode, htmlParser } from '@ibyar/elements';\nimport {\n\tcreateProxyForContext, ExpressionNode,\n\tfindReactiveScopeByEventMap, ScopeContext,\n\tScopeSubscription, Stack\n} from '@ibyar/expressions';\nimport { HTMLComponent } from '../component/custom-element.js';\nimport { StructuralDirective } from '../directive/directive.js';\nimport { ComponentRender } from '../view/render.js';\nimport { EmbeddedViewRef, EmbeddedViewRefImpl } from './view-ref.js';\n\nexport abstract class TemplateRef {\n\n\t/**\n\t * get the current ref of this template\n\t */\n\tabstract get astNode(): DomNode;\n\n\t/**\n\t * Instantiates an embedded view based on this template,\n\t * `Not attached to the view`.\n\t * @param context The data-binding context of the embedded view, as declared\n\t * in the `<template>` usage.\n\t * \n\t * To insert it to a view need to use a `ViewContainerRef.createEmbeddedView()`\n\t * @returns The new embedded view object.\n\t */\n\tabstract createEmbeddedView<C extends object>(context: C, parentNode: Node): EmbeddedViewRef<C>;\n}\n\n\nexport class TemplateRefImpl extends TemplateRef {\n\tprivate _host: HTMLComponent<any> | StructuralDirective;\n\n\tconstructor(\n\t\tprivate render: ComponentRender<any>,\n\t\tprivate node: DomNode,\n\t\tprivate stack: Stack,\n\t\tprivate templateExpressions: ExpressionNode[],\n\t) {\n\t\tsuper();\n\t}\n\tget astNode(): DomNode {\n\t\treturn this.node;\n\t}\n\tset host(host: HTMLComponent<any> | StructuralDirective) {\n\t\tthis._host = host;\n\t}\n\tcreateEmbeddedView<C extends object>(context: C, parentNode: Node): EmbeddedViewRef<C> {\n\t\tconst directiveStack = this.stack.copyStack();\n\n\t\tconst templateScope = directiveStack.pushReactiveScope();\n\n\t\tconst sandBox = new Stack();\n\t\tconst contextScope = sandBox.pushReactiveScopeFor(context ?? {});\n\t\tsandBox.pushScope(templateScope);\n\n\t\tconst elements: Node[] = [];\n\t\tconst contextProxy = createProxyForContext(contextScope);\n\t\tconst subscriptions: ScopeSubscription<ScopeContext>[] = [];\n\t\tconst embeddedViewRef = new EmbeddedViewRefImpl(contextProxy, elements, subscriptions);\n\t\tconst scopeSubscriptions = this.executeTemplateExpressions(sandBox);\n\t\tscopeSubscriptions && subscriptions.push(...scopeSubscriptions);\n\n\t\tconst fragment = document.createDocumentFragment();\n\t\tthis.render.appendChildToParent(fragment, this.node, directiveStack, parentNode, subscriptions, this._host);\n\n\t\tfragment.childNodes.forEach(item => elements.push(item));\n\t\treturn embeddedViewRef;\n\t}\n\tprivate executeTemplateExpressions(sandBox: Stack): ScopeSubscription<ScopeContext>[] | undefined {\n\t\tif (!this.templateExpressions?.length) {\n\t\t\treturn;\n\t\t}\n\t\t// init value\n\t\tthis.templateExpressions.forEach(expression => {\n\t\t\texpression.get(sandBox);\n\t\t});\n\n\t\t// subscribe to changes\n\t\tconst scopeSubscriptions: ScopeSubscription<object>[] = [];\n\t\tthis.templateExpressions.forEach(expression => {\n\t\t\tconst events = expression.events();\n\t\t\tconst scopeTuples = findReactiveScopeByEventMap(events, sandBox);\n\t\t\tscopeTuples.forEach(tuple => {\n\t\t\t\tconst subscription = tuple[1].subscribe(tuple[0], () => {\n\t\t\t\t\texpression.get(sandBox);\n\t\t\t\t});\n\t\t\t\tscopeSubscriptions.push(subscription);\n\t\t\t});\n\t\t});\n\t\treturn scopeSubscriptions;\n\t}\n}\n"]}
+{"version":3,"file":"template-ref.js","sourceRoot":"","sources":["../../../src/core/linker/template-ref.ts"],"names":[],"mappings":"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","sourcesContent":["import { DomNode, htmlParser } from '@ibyar/elements';\nimport {\n\tcreateProxyForContext, ExpressionNode,\n\tfindReactiveScopeByEventMap, ScopeContext,\n\tScopeSubscription, Stack\n} from '@ibyar/expressions';\nimport { HTMLComponent } from '../component/custom-element.js';\nimport { StructuralDirective } from '../directive/directive.js';\nimport { ComponentRender } from '../view/render.js';\nimport { EmbeddedViewRef, EmbeddedViewRefImpl } from './view-ref.js';\n\nexport abstract class TemplateRef {\n\n\t/**\n\t * get the current ref of this template\n\t */\n\tabstract get astNode(): DomNode;\n\n\t/**\n\t * Instantiates an embedded view based on this template,\n\t * `Not attached to the view`.\n\t * @param context The data-binding context of the embedded view, as declared\n\t * in the `<template>` usage.\n\t * \n\t * To insert it to a view need to use a `ViewContainerRef.createEmbeddedView()`\n\t * @returns The new embedded view object.\n\t */\n\tabstract createEmbeddedView<C extends object>(context: C, parentNode: Node): EmbeddedViewRef<C>;\n}\n\n\nexport class TemplateRefImpl extends TemplateRef {\n\tprivate _host: HTMLComponent<any> | StructuralDirective;\n\n\tconstructor(\n\t\tprivate render: ComponentRender<any>,\n\t\tprivate node: DomNode,\n\t\tprivate stack: Stack,\n\t\tprivate templateExpressions: ExpressionNode[],\n\t) {\n\t\tsuper();\n\t}\n\tget astNode(): DomNode {\n\t\treturn this.node;\n\t}\n\tset host(host: HTMLComponent<any> | StructuralDirective) {\n\t\tthis._host = host;\n\t}\n\tcreateEmbeddedView<C extends object>(context: C, parentNode: Node): EmbeddedViewRef<C> {\n\t\tconst directiveStack = this.stack.copyStack();\n\n\t\tconst templateScope = directiveStack.pushReactiveScope();\n\n\t\tconst sandBox = new Stack();\n\t\tconst contextScope = sandBox.pushReactiveScopeFor(context ?? {});\n\t\tsandBox.pushScope(templateScope);\n\n\t\tconst elements: Node[] = [];\n\t\tconst contextProxy = createProxyForContext(contextScope);\n\t\tconst subscriptions: ScopeSubscription<ScopeContext>[] = [];\n\t\tconst embeddedViewRef = new EmbeddedViewRefImpl(contextProxy, elements, subscriptions);\n\t\tconst scopeSubscriptions = this.executeTemplateExpressions(sandBox);\n\t\tscopeSubscriptions && subscriptions.push(...scopeSubscriptions);\n\n\t\tconst fragment = document.createDocumentFragment();\n\t\tthis.render.appendChildToParent(fragment, this.node, directiveStack, parentNode, subscriptions, this._host);\n\n\t\tfragment.childNodes.forEach(item => elements.push(item));\n\t\treturn embeddedViewRef;\n\t}\n\tprivate executeTemplateExpressions(sandBox: Stack): ScopeSubscription<ScopeContext>[] | undefined {\n\t\tif (!this.templateExpressions?.length) {\n\t\t\treturn;\n\t\t}\n\t\t// init value\n\t\tthis.templateExpressions.forEach(expression => {\n\t\t\texpression.get(sandBox);\n\t\t});\n\n\t\t// subscribe to changes\n\t\tconst scopeSubscriptions: ScopeSubscription<object>[] = [];\n\t\tthis.templateExpressions.forEach(expression => {\n\t\t\tconst events = expression.events();\n\t\t\tconst scopeTuples = findReactiveScopeByEventMap(events, sandBox);\n\t\t\tscopeTuples.forEach(tuple => {\n\t\t\t\tconst subscription = tuple[1].subscribe(tuple[0], () => {\n\t\t\t\t\texpression.get(sandBox);\n\t\t\t\t});\n\t\t\t\tscopeSubscriptions.push(subscription);\n\t\t\t});\n\t\t});\n\t\treturn scopeSubscriptions;\n\t}\n}\n"]}

package/linker/view-container-ref.d.ts

@@ -10,16 +10,94 @@ export declare type ViewContainerComponentOptions = {
     selector?: string;
 };
 export declare abstract class ViewContainerRef {
+    /**
+     * Anchor element that specifies the location of this container in the containing view.
+     * Each view container can have only one anchor element, and each anchor element
+     * can have only a single view container.
+     *
+     * Root elements of views attached to this container become siblings of the anchor element in
+     * the rendered view.
+     *
+     * Access the `ViewContainerRef` of an element by placing a `Directive` injected
+     * with `ViewContainerRef` on the element, or use a `ViewChild` query.
+     *
+     */
     abstract get anchorElement(): Element;
+    /**
+     * Destroys all views in this container.
+     */
     abstract clear(): void;
+    /**
+     * Retrieves a view from this container.
+     * @param index The 0-based index of the view to retrieve.
+     * @returns The `ViewRef` instance, or null if the index is out of range.
+     */
     abstract get(index: number): ViewRef | undefined;
+    /**
+     * Reports how many views are currently attached to this container.
+     * @returns The number of views.
+     */
     abstract get length(): number;
+    /**
+     * Instantiates an embedded view and inserts it
+     * into this container.
+     * @param templateRef The HTML template that defines the view.
+     * @param context The data-binding context of the embedded view, as declared
+     * in the `<ng-template>` usage.
+     * @param index The 0-based index at which to insert the new view into this container.
+     * If not specified, appends the new view as the last entry.
+     *
+     * @returns The `ViewRef` instance for the newly created view.
+     */
     abstract createEmbeddedView<C extends {}>(templateRef: TemplateRef, options?: ViewContainerOptions<C>): EmbeddedViewRef<C>;
+    /**
+   * Instantiates a single component and inserts its host view into this container.
+   *
+   * @param componentType Component Type to use.
+   * @param options An object that contains extra parameters:
+   *  * index: the index at which to insert the new component's host view into this container.
+   *           If not specified, appends the new view as the last entry.
+   *  * selector: the tag name of the new create component that attached with this model class.
+   * 			Any Model class can have many views with different selectors.
+   *
+   * @returns The new `HTMLComponent` which contains the component instance and the host view.
+   */
     abstract createComponent<C extends {}>(componentType: TypeOf<C>, options?: ViewContainerComponentOptions): C;
+    /**
+     * Inserts a view into this container.
+     * @param viewRef The view to insert.
+     * @param index The 0-based index at which to insert the view.
+     * If not specified, appends the new view as the last entry.
+     * @returns The inserted `ViewRef` instance.
+     *
+     */
     abstract insert(viewRef: ViewRef, index?: number): ViewRef;
+    /**
+     * Moves a view to a new location in this container.
+     * @param viewRef The view to move.
+     * @param newIndex The 0-based index of the new location.
+     * @returns The moved `ViewRef` instance.
+     */
     abstract move(viewRef: ViewRef, newIndex: number): ViewRef;
+    /**
+     * Returns the index of a view within the current container.
+     * @param viewRef The view to query.
+     * @returns The 0-based index of the view's position in this container,
+     * or `-1` if this container doesn't contain the view.
+     */
     abstract indexOf(viewRef: ViewRef): number;
+    /**
+     * Destroys a view attached to this container
+     * @param index The 0-based index of the view to destroy.
+     * If not specified, the last view in the container is removed.
+     */
     abstract remove(index?: number): void;
+    /**
+     * Detaches a view from this container without destroying it.
+     * Use along with `insert()` to move a view within the current container.
+     * @param index The 0-based index of the view to detach.
+     * If not specified, the last view in the container is detached.
+     */
     abstract detach(index?: number): ViewRef | undefined;
 }
 export declare class ViewContainerRefImpl extends ViewContainerRef {

package/linker/view-container-ref.js

@@ -58,6 +58,7 @@ export class ViewContainerRefImpl extends ViewContainerRef {
             this.detach(oldIndex);
         }
         else {
+            // should remove it from the container first
             viewRef.detach();
         }
         return this.insert(viewRef, newIndex);

package/linker/view-container-ref.js.map

@@ -1 +1 @@
-{"version":3,"file":"view-container-ref.js","sourceRoot":"","sources":["../../../src/core/linker/view-container-ref.ts"],"names":[],"mappings":"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","sourcesContent":["import type { TypeOf } from '../utils/typeof.js';\nimport { Components } from '../component/component.js';\nimport { TemplateRef } from './template-ref.js';\nimport { EmbeddedViewRef, EmbeddedViewRefImpl, ViewRef } from './view-ref.js';\nimport { getComponentView } from '../view/view.js';\n\nexport type ViewContainerOptions<C> = {\n\tindex?: number;\n\tcontext?: C;\n};\n\nexport type ViewContainerComponentOptions = {\n\tindex?: number | undefined;\n\tselector?: string;\n};\nexport abstract class ViewContainerRef {\n\n\t/**\n\t * Anchor element that specifies the location of this container in the containing view.\n\t * Each view container can have only one anchor element, and each anchor element\n\t * can have only a single view container.\n\t * \n\t * Root elements of views attached to this container become siblings of the anchor element in\n\t * the rendered view.\n\t *\n\t * Access the `ViewContainerRef` of an element by placing a `Directive` injected\n\t * with `ViewContainerRef` on the element, or use a `ViewChild` query.\n\t *\n\t */\n\tabstract get anchorElement(): Element;\n\n\t/**\n\t * Destroys all views in this container.\n\t */\n\tabstract clear(): void;\n\n\t/**\n\t * Retrieves a view from this container.\n\t * @param index The 0-based index of the view to retrieve.\n\t * @returns The `ViewRef` instance, or null if the index is out of range.\n\t */\n\tabstract get(index: number): ViewRef | undefined;\n\n\t/**\n\t * Reports how many views are currently attached to this container.\n\t * @returns The number of views.\n\t */\n\tabstract get length(): number;\n\n\t/**\n\t * Instantiates an embedded view and inserts it\n\t * into this container.\n\t * @param templateRef The HTML template that defines the view.\n\t * @param context The data-binding context of the embedded view, as declared\n\t * in the `<ng-template>` usage.\n\t * @param index The 0-based index at which to insert the new view into this container.\n\t * If not specified, appends the new view as the last entry.\n\t *\n\t * @returns The `ViewRef` instance for the newly created view.\n\t */\n\tabstract createEmbeddedView<C extends {}>(templateRef: TemplateRef, options?: ViewContainerOptions<C>): EmbeddedViewRef<C>;\n\n\t/**\n   * Instantiates a single component and inserts its host view into this container.\n   *\n   * @param componentType Component Type to use.\n   * @param options An object that contains extra parameters:\n   *  * index: the index at which to insert the new component's host view into this container.\n   *           If not specified, appends the new view as the last entry.\n   *  * selector: the tag name of the new create component that attached with this model class.\n   * \t\t\tAny Model class can have many views with different selectors. \n   *\n   * @returns The new `HTMLComponent` which contains the component instance and the host view.\n   */\n\tabstract createComponent<C extends {}>(componentType: TypeOf<C>, options?: ViewContainerComponentOptions): C;\n\n\t/**\n\t * Inserts a view into this container.\n\t * @param viewRef The view to insert.\n\t * @param index The 0-based index at which to insert the view.\n\t * If not specified, appends the new view as the last entry.\n\t * @returns The inserted `ViewRef` instance.\n\t *\n\t */\n\tabstract insert(viewRef: ViewRef, index?: number): ViewRef;\n\n\t/**\n\t * Moves a view to a new location in this container.\n\t * @param viewRef The view to move.\n\t * @param newIndex The 0-based index of the new location.\n\t * @returns The moved `ViewRef` instance.\n\t */\n\tabstract move(viewRef: ViewRef, newIndex: number): ViewRef;\n\n\t/**\n\t * Returns the index of a view within the current container.\n\t * @param viewRef The view to query.\n\t * @returns The 0-based index of the view's position in this container,\n\t * or `-1` if this container doesn't contain the view.\n\t */\n\tabstract indexOf(viewRef: ViewRef): number;\n\n\t/**\n\t * Destroys a view attached to this container\n\t * @param index The 0-based index of the view to destroy.\n\t * If not specified, the last view in the container is removed.\n\t */\n\tabstract remove(index?: number): void;\n\n\t/**\n\t * Detaches a view from this container without destroying it.\n\t * Use along with `insert()` to move a view within the current container.\n\t * @param index The 0-based index of the view to detach.\n\t * If not specified, the last view in the container is detached.\n\t */\n\tabstract detach(index?: number): ViewRef | undefined;\n}\n\n\nexport class ViewContainerRefImpl extends ViewContainerRef {\n\n\tprivate views: EmbeddedViewRef<any>[] = [];\n\n\tconstructor(\n\t\tprivate parent: Element,\n\t\tprivate firstComment: Comment\n\t) {\n\t\tsuper();\n\t}\n\toverride get anchorElement(): Element {\n\t\treturn this.parent;\n\t}\n\toverride get length(): number {\n\t\treturn this.views.length;\n\t}\n\toverride clear(): void {\n\t\tif (this.views.length > 0) {\n\t\t\tfor (const elm of this.views) {\n\t\t\t\telm.destroy();\n\t\t\t}\n\t\t\tthis.views.splice(0);\n\t\t}\n\t}\n\toverride get(index: number): ViewRef | undefined {\n\t\tif (index >= this.views.length) {\n\t\t\treturn undefined;\n\t\t}\n\t\treturn this.views[index];\n\t}\n\toverride detach(index?: number): ViewRef | undefined {\n\t\tindex ??= this.views.length - 1;\n\t\tconst viewRef = this.views[index];\n\t\tviewRef.detach();\n\t\tthis.views.splice(index, 1);\n\t\treturn viewRef;\n\t}\n\toverride indexOf(viewRef: EmbeddedViewRef<any>): number {\n\t\treturn this.views.indexOf(viewRef);\n\t}\n\toverride remove(index?: number): void {\n\t\tindex ??= this.views.length - 1;\n\t\tthis.views[index].destroy();\n\t\tthis.views.splice(index, 1);\n\t}\n\toverride insert(viewRef: EmbeddedViewRef<any>, index?: number): ViewRef {\n\t\tindex = ((index ??= this.views.length) > this.views.length) ? this.views.length : index;\n\t\tconst lastNode = index == 0 ? this.firstComment : this.views[index - 1].last;\n\t\tthis.views.splice(index, 0, viewRef);\n\t\tviewRef.after(lastNode);\n\t\treturn viewRef;\n\t}\n\toverride move(viewRef: EmbeddedViewRef<any>, newIndex: number): ViewRef {\n\t\tconst oldIndex = this.indexOf(viewRef);\n\t\tif (oldIndex > -1) {\n\t\t\tthis.detach(oldIndex);\n\t\t} else {\n\t\t\t// should remove it from the container first\n\t\t\tviewRef.detach();\n\t\t}\n\t\treturn this.insert(viewRef, newIndex);\n\t}\n\toverride createEmbeddedView<C extends {}>(templateRef: TemplateRef, options?: ViewContainerOptions<C>): EmbeddedViewRef<C> {\n\t\tconst viewRef = templateRef.createEmbeddedView<C>(options?.context || <C>{}, this.parent);\n\t\tthis.insert(viewRef, options?.index);\n\t\treturn viewRef;\n\t}\n\toverride createComponent<C extends {}>(componentType: TypeOf<C>, options?: ViewContainerComponentOptions): C {\n\t\tconst defaultTagName = Components.getComponentRef<C>(componentType).selector;\n\t\tconst ViewClass = getComponentView(componentType, options?.selector ?? defaultTagName);\n\t\tif (!ViewClass) {\n\t\t\tthrow new Error(`Can't find View component for class ${componentType.name}`);\n\t\t}\n\t\tconst component = new ViewClass();\n\t\tconst viewRef = new EmbeddedViewRefImpl<C>(component._proxyModel, [component]);\n\t\tthis.insert(viewRef, options?.index);\n\t\treturn component._proxyModel;\n\t}\n\n}\n"]}
+{"version":3,"file":"view-container-ref.js","sourceRoot":"","sources":["../../../src/core/linker/view-container-ref.ts"],"names":[],"mappings":"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","sourcesContent":["import type { TypeOf } from '../utils/typeof.js';\nimport { Components } from '../component/component.js';\nimport { TemplateRef } from './template-ref.js';\nimport { EmbeddedViewRef, EmbeddedViewRefImpl, ViewRef } from './view-ref.js';\nimport { getComponentView } from '../view/view.js';\n\nexport type ViewContainerOptions<C> = {\n\tindex?: number;\n\tcontext?: C;\n};\n\nexport type ViewContainerComponentOptions = {\n\tindex?: number | undefined;\n\tselector?: string;\n};\nexport abstract class ViewContainerRef {\n\n\t/**\n\t * Anchor element that specifies the location of this container in the containing view.\n\t * Each view container can have only one anchor element, and each anchor element\n\t * can have only a single view container.\n\t * \n\t * Root elements of views attached to this container become siblings of the anchor element in\n\t * the rendered view.\n\t *\n\t * Access the `ViewContainerRef` of an element by placing a `Directive` injected\n\t * with `ViewContainerRef` on the element, or use a `ViewChild` query.\n\t *\n\t */\n\tabstract get anchorElement(): Element;\n\n\t/**\n\t * Destroys all views in this container.\n\t */\n\tabstract clear(): void;\n\n\t/**\n\t * Retrieves a view from this container.\n\t * @param index The 0-based index of the view to retrieve.\n\t * @returns The `ViewRef` instance, or null if the index is out of range.\n\t */\n\tabstract get(index: number): ViewRef | undefined;\n\n\t/**\n\t * Reports how many views are currently attached to this container.\n\t * @returns The number of views.\n\t */\n\tabstract get length(): number;\n\n\t/**\n\t * Instantiates an embedded view and inserts it\n\t * into this container.\n\t * @param templateRef The HTML template that defines the view.\n\t * @param context The data-binding context of the embedded view, as declared\n\t * in the `<ng-template>` usage.\n\t * @param index The 0-based index at which to insert the new view into this container.\n\t * If not specified, appends the new view as the last entry.\n\t *\n\t * @returns The `ViewRef` instance for the newly created view.\n\t */\n\tabstract createEmbeddedView<C extends {}>(templateRef: TemplateRef, options?: ViewContainerOptions<C>): EmbeddedViewRef<C>;\n\n\t/**\n   * Instantiates a single component and inserts its host view into this container.\n   *\n   * @param componentType Component Type to use.\n   * @param options An object that contains extra parameters:\n   *  * index: the index at which to insert the new component's host view into this container.\n   *           If not specified, appends the new view as the last entry.\n   *  * selector: the tag name of the new create component that attached with this model class.\n   * \t\t\tAny Model class can have many views with different selectors. \n   *\n   * @returns The new `HTMLComponent` which contains the component instance and the host view.\n   */\n\tabstract createComponent<C extends {}>(componentType: TypeOf<C>, options?: ViewContainerComponentOptions): C;\n\n\t/**\n\t * Inserts a view into this container.\n\t * @param viewRef The view to insert.\n\t * @param index The 0-based index at which to insert the view.\n\t * If not specified, appends the new view as the last entry.\n\t * @returns The inserted `ViewRef` instance.\n\t *\n\t */\n\tabstract insert(viewRef: ViewRef, index?: number): ViewRef;\n\n\t/**\n\t * Moves a view to a new location in this container.\n\t * @param viewRef The view to move.\n\t * @param newIndex The 0-based index of the new location.\n\t * @returns The moved `ViewRef` instance.\n\t */\n\tabstract move(viewRef: ViewRef, newIndex: number): ViewRef;\n\n\t/**\n\t * Returns the index of a view within the current container.\n\t * @param viewRef The view to query.\n\t * @returns The 0-based index of the view's position in this container,\n\t * or `-1` if this container doesn't contain the view.\n\t */\n\tabstract indexOf(viewRef: ViewRef): number;\n\n\t/**\n\t * Destroys a view attached to this container\n\t * @param index The 0-based index of the view to destroy.\n\t * If not specified, the last view in the container is removed.\n\t */\n\tabstract remove(index?: number): void;\n\n\t/**\n\t * Detaches a view from this container without destroying it.\n\t * Use along with `insert()` to move a view within the current container.\n\t * @param index The 0-based index of the view to detach.\n\t * If not specified, the last view in the container is detached.\n\t */\n\tabstract detach(index?: number): ViewRef | undefined;\n}\n\n\nexport class ViewContainerRefImpl extends ViewContainerRef {\n\n\tprivate views: EmbeddedViewRef<any>[] = [];\n\n\tconstructor(\n\t\tprivate parent: Element,\n\t\tprivate firstComment: Comment\n\t) {\n\t\tsuper();\n\t}\n\toverride get anchorElement(): Element {\n\t\treturn this.parent;\n\t}\n\toverride get length(): number {\n\t\treturn this.views.length;\n\t}\n\toverride clear(): void {\n\t\tif (this.views.length > 0) {\n\t\t\tfor (const elm of this.views) {\n\t\t\t\telm.destroy();\n\t\t\t}\n\t\t\tthis.views.splice(0);\n\t\t}\n\t}\n\toverride get(index: number): ViewRef | undefined {\n\t\tif (index >= this.views.length) {\n\t\t\treturn undefined;\n\t\t}\n\t\treturn this.views[index];\n\t}\n\toverride detach(index?: number): ViewRef | undefined {\n\t\tindex ??= this.views.length - 1;\n\t\tconst viewRef = this.views[index];\n\t\tviewRef.detach();\n\t\tthis.views.splice(index, 1);\n\t\treturn viewRef;\n\t}\n\toverride indexOf(viewRef: EmbeddedViewRef<any>): number {\n\t\treturn this.views.indexOf(viewRef);\n\t}\n\toverride remove(index?: number): void {\n\t\tindex ??= this.views.length - 1;\n\t\tthis.views[index].destroy();\n\t\tthis.views.splice(index, 1);\n\t}\n\toverride insert(viewRef: EmbeddedViewRef<any>, index?: number): ViewRef {\n\t\tindex = ((index ??= this.views.length) > this.views.length) ? this.views.length : index;\n\t\tconst lastNode = index == 0 ? this.firstComment : this.views[index - 1].last;\n\t\tthis.views.splice(index, 0, viewRef);\n\t\tviewRef.after(lastNode);\n\t\treturn viewRef;\n\t}\n\toverride move(viewRef: EmbeddedViewRef<any>, newIndex: number): ViewRef {\n\t\tconst oldIndex = this.indexOf(viewRef);\n\t\tif (oldIndex > -1) {\n\t\t\tthis.detach(oldIndex);\n\t\t} else {\n\t\t\t// should remove it from the container first\n\t\t\tviewRef.detach();\n\t\t}\n\t\treturn this.insert(viewRef, newIndex);\n\t}\n\toverride createEmbeddedView<C extends {}>(templateRef: TemplateRef, options?: ViewContainerOptions<C>): EmbeddedViewRef<C> {\n\t\tconst viewRef = templateRef.createEmbeddedView<C>(options?.context || <C>{}, this.parent);\n\t\tthis.insert(viewRef, options?.index);\n\t\treturn viewRef;\n\t}\n\toverride createComponent<C extends {}>(componentType: TypeOf<C>, options?: ViewContainerComponentOptions): C {\n\t\tconst defaultTagName = Components.getComponentRef<C>(componentType).selector;\n\t\tconst ViewClass = getComponentView(componentType, options?.selector ?? defaultTagName);\n\t\tif (!ViewClass) {\n\t\t\tthrow new Error(`Can't find View component for class ${componentType.name}`);\n\t\t}\n\t\tconst component = new ViewClass();\n\t\tconst viewRef = new EmbeddedViewRefImpl<C>(component._proxyModel, [component]);\n\t\tthis.insert(viewRef, options?.index);\n\t\treturn component._proxyModel;\n\t}\n\n}\n"]}

package/linker/view-ref.d.ts

@@ -1,18 +1,57 @@
 import { ScopeContext, ScopeSubscription } from '@ibyar/expressions';
 export declare abstract class ViewRef {
+    /**
+     * Destroys this view and all of the data structures associated with it.
+     */
     abstract destroy(): void;
+    /**
+     * Reports whether this view has been destroyed.
+     * @returns True after the `destroy()` method has been called, false otherwise.
+     */
     abstract get destroyed(): boolean;
+    /**
+     * A lifecycle hook that provides additional developer-defined cleanup
+     * functionality for views.
+     * @param callback A handler function that cleans up developer-defined data
+     * associated with a view. Called when the `destroy()` method is invoked.
+     */
     abstract onDestroy(callback: Function): {
         unsubscribe(): void;
     };
 }
 export declare abstract class EmbeddedViewRef<C extends object> extends ViewRef {
+    /**
+     * The context for this view, inherited from the anchor element.
+     */
     abstract get context(): C;
+    /**
+     * The root nodes for this embedded view.
+     */
     abstract get rootNodes(): Node[];
+    /**
+     * the first node for this embedded view.
+     */
     abstract get first(): ChildNode;
+    /**
+     * the last node for this embedded view.
+     */
     abstract get last(): ChildNode;
+    /**
+     * insert view after the node.
+     * @param node
+     */
     abstract after(node: ChildNode): void;
+    /**
+     * insert view before the node.
+     * @param node
+     */
     abstract before(node: ChildNode): void;
+    /**
+     * remove the root nodes from the view, but keep reference to them.
+     *
+     * Detaches a view from this container without destroying it.
+     * Use along with after()/before() to move a view within the current container.
+     */
     abstract detach(): void;
 }
 export declare class EmbeddedViewRefImpl<C extends object> extends EmbeddedViewRef<C> {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@ibyar/core",
-	"version": "0.5.6",
+	"version": "0.5.62",
 	"description": "Implements Aurora's core functionality, low-level services, and utilities",
 	"license": "MIT",
 	"homepage": "https://github.com/ibyar/aurora/tree/dev/packages/core",
@@ -23,8 +23,8 @@
 		"access": "public"
 	},
 	"dependencies": {
-		"@ibyar/elements": "^0.5.6",
-		"@ibyar/expressions": "^0.5.6",
+		"@ibyar/elements": "^0.5.62",
+		"@ibyar/expressions": "^0.5.62",
 		"reflect-metadata": "^0.1.13",
 		"tslib": "^2.4.0"
 	},
@@ -62,5 +62,5 @@
 		"interceptor",
 		"typescript"
 	],
-	"gitHead": "1e724c041319c2cfab7f9b21f6246cd658b8c3c3"
+	"gitHead": "17e31ddaba2c87e6b98e1415de85f62cb5ba7ba9"
 }

package/pipe/pipe.d.ts

@@ -2,6 +2,13 @@ import { ReactiveScopeControl, ReadOnlyScope, ScopeSubscription } from '@ibyar/e
 import { OnDestroy } from '../component/lifecycle.js';
 import { ChangeDetectorRef } from '../linker/change-detector-ref.js';
 import { TypeOf } from '../utils/typeof.js';
+/**
+ * Pipes are used as singleton
+ * it will be created if it needed, had no life cycle
+ *
+ * * no dependency injection applied on filters for now,
+ * TODO: add support of dependency injection
+ */
 export interface PipeTransform<T, U> {
     transform(value: T, ...args: any[]): U;
 }

package/providers/injector.js

@@ -11,6 +11,7 @@ export class Injector {
         if (currentInstance)
             return currentInstance;
         const params = Reflect.getMetadata('design:paramtypes', constructor);
+        // We need to init each constructor function into it's instance
         if (params) {
             const argumentsInstances = params.map((paramter) => this.constructObject(paramter));
             currentInstance = new constructor(...argumentsInstances);

package/providers/injector.js.map

@@ -1 +1 @@
-{"version":3,"file":"injector.js","sourceRoot":"","sources":["../../../src/core/providers/injector.ts"],"names":[],"mappings":"AAKA,MAAM,OAAO,QAAQ;IAIpB;QAFQ,2BAAsB,GAAG,IAAI,GAAG,EAAE,CAAC;IAE3B,CAAC;IAEjB,WAAW,CAAI,KAAuB;QACrC,MAAM,QAAQ,GAAG,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC;QAC7C,OAAO,QAAQ,CAAC;IACjB,CAAC;IAEO,eAAe,CAAC,WAA0B;QACjD,IAAI,eAAe,GAAG,IAAI,CAAC,sBAAsB,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;QACnE,IAAI,eAAe;YAAE,OAAO,eAAe,CAAC;QAE5C,MAAM,MAAM,GACX,OAAO,CAAC,WAAW,CAAC,mBAAmB,EAAE,WAAW,CAAC,CAAC;QAEvD,IAAI,MAAM,EAAE;YACX,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE,CAClD,IAAI,CAAC,eAAe,CAAC,QAAQ,CAAC,CAC9B,CAAC;YACF,eAAe,GAAG,IAAI,WAAW,CAAC,GAAG,kBAAkB,CAAC,CAAC;SACzD;aAAM;YACN,eAAe,GAAG,IAAI,WAAW,EAAE,CAAC;SACpC;QACD,IAAI,CAAC,sBAAsB,CAAC,GAAG,CAAC,WAAW,EAAE,eAAe,CAAC,CAAC;QAC9D,OAAO,eAAe,CAAC;IACxB,CAAC;CACD;AAED,MAAM,CAAC,MAAM,kBAAkB,GAAa,IAAI,QAAQ,EAAE,CAAC","sourcesContent":["\nexport interface Constructable<T = any> {\n\tnew(...params: any[]): T;\n}\n\nexport class Injector {\n\n\tprivate dependencyInjectionMap = new Map();\n\n\tconstructor() { }\n\n\tgetInstance<T>(contr: Constructable<T>): T {\n\t\tconst instance = this.constructObject(contr);\n\t\treturn instance;\n\t}\n\n\tprivate constructObject(constructor: Constructable) {\n\t\tlet currentInstance = this.dependencyInjectionMap.get(constructor);\n\t\tif (currentInstance) return currentInstance;\n\n\t\tconst params: Constructable[] =\n\t\t\tReflect.getMetadata('design:paramtypes', constructor);\n\t\t// We need to init each constructor function into it's instance\n\t\tif (params) {\n\t\t\tconst argumentsInstances = params.map((paramter) =>\n\t\t\t\tthis.constructObject(paramter)\n\t\t\t);\n\t\t\tcurrentInstance = new constructor(...argumentsInstances);\n\t\t} else {\n\t\t\tcurrentInstance = new constructor();\n\t\t}\n\t\tthis.dependencyInjectionMap.set(constructor, currentInstance);\n\t\treturn currentInstance;\n\t}\n}\n\nexport const dependencyInjector: Injector = new Injector();\n"]}
+{"version":3,"file":"injector.js","sourceRoot":"","sources":["../../../src/core/providers/injector.ts"],"names":[],"mappings":"AAKA,MAAM,OAAO,QAAQ;IAIpB;QAFQ,2BAAsB,GAAG,IAAI,GAAG,EAAE,CAAC;IAE3B,CAAC;IAEjB,WAAW,CAAI,KAAuB;QACrC,MAAM,QAAQ,GAAG,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC;QAC7C,OAAO,QAAQ,CAAC;IACjB,CAAC;IAEO,eAAe,CAAC,WAA0B;QACjD,IAAI,eAAe,GAAG,IAAI,CAAC,sBAAsB,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;QACnE,IAAI,eAAe;YAAE,OAAO,eAAe,CAAC;QAE5C,MAAM,MAAM,GACX,OAAO,CAAC,WAAW,CAAC,mBAAmB,EAAE,WAAW,CAAC,CAAC;QACvD,+DAA+D;QAC/D,IAAI,MAAM,EAAE;YACX,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE,CAClD,IAAI,CAAC,eAAe,CAAC,QAAQ,CAAC,CAC9B,CAAC;YACF,eAAe,GAAG,IAAI,WAAW,CAAC,GAAG,kBAAkB,CAAC,CAAC;SACzD;aAAM;YACN,eAAe,GAAG,IAAI,WAAW,EAAE,CAAC;SACpC;QACD,IAAI,CAAC,sBAAsB,CAAC,GAAG,CAAC,WAAW,EAAE,eAAe,CAAC,CAAC;QAC9D,OAAO,eAAe,CAAC;IACxB,CAAC;CACD;AAED,MAAM,CAAC,MAAM,kBAAkB,GAAa,IAAI,QAAQ,EAAE,CAAC","sourcesContent":["\nexport interface Constructable<T = any> {\n\tnew(...params: any[]): T;\n}\n\nexport class Injector {\n\n\tprivate dependencyInjectionMap = new Map();\n\n\tconstructor() { }\n\n\tgetInstance<T>(contr: Constructable<T>): T {\n\t\tconst instance = this.constructObject(contr);\n\t\treturn instance;\n\t}\n\n\tprivate constructObject(constructor: Constructable) {\n\t\tlet currentInstance = this.dependencyInjectionMap.get(constructor);\n\t\tif (currentInstance) return currentInstance;\n\n\t\tconst params: Constructable[] =\n\t\t\tReflect.getMetadata('design:paramtypes', constructor);\n\t\t// We need to init each constructor function into it's instance\n\t\tif (params) {\n\t\t\tconst argumentsInstances = params.map((paramter) =>\n\t\t\t\tthis.constructObject(paramter)\n\t\t\t);\n\t\t\tcurrentInstance = new constructor(...argumentsInstances);\n\t\t} else {\n\t\t\tcurrentInstance = new constructor();\n\t\t}\n\t\tthis.dependencyInjectionMap.set(constructor, currentInstance);\n\t\treturn currentInstance;\n\t}\n}\n\nexport const dependencyInjector: Injector = new Injector();\n"]}

package/render/host-listener.handler.d.ts

@@ -5,6 +5,23 @@ import { RenderHandler } from './render-handler.js';
 declare type ElementScope = {
     [element: string]: HTMLElement;
 };
+/**
+ * ```ts
+ * class View {
+ *
+ *	@HostListener('window:load', ['$event.target', '"load"'])
+ * 	@HostListener('click', ['$event.target', '"click"'])
+ * 	public onClick(target: any, type: string){
+ * 		console.log(target, type);
+ * 	}
+ * }
+ * ```
+ *
+ * window.addEventListener('load', $event => listener($event.target, 'load'));
+ *
+ * view.addEventListener('click', $event => listener($event.target, 'click'));
+ *
+ */
 export declare class HostListenerHandler implements RenderHandler {
     private listenerRef;
     private element;

package/render/host-listener.handler.js

@@ -1,4 +1,21 @@
 import { JavaScriptParser, Stack } from '@ibyar/expressions';
+/**
+ * ```ts
+ * class View {
+ *
+ *	@HostListener('window:load', ['$event.target', '"load"'])
+ * 	@HostListener('click', ['$event.target', '"click"'])
+ * 	public onClick(target: any, type: string){
+ * 		console.log(target, type);
+ * 	}
+ * }
+ * ```
+ *
+ * window.addEventListener('load', $event => listener($event.target, 'load'));
+ *
+ * view.addEventListener('click', $event => listener($event.target, 'click'));
+ *
+ */
 export class HostListenerHandler {
     constructor(listenerRef, element, elementScope) {
         this.listenerRef = listenerRef;

package/render/host-listener.handler.js.map

@@ -1 +1 @@
-{"version":3,"file":"host-listener.handler.js","sourceRoot":"","sources":["../../../src/core/render/host-listener.handler.ts"],"names":[],"mappings":"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","sourcesContent":["import { ArrayExpression, JavaScriptParser, ReactiveScope, ScopeSubscription, Stack } from '@ibyar/expressions';\nimport { ListenerRef } from '../component/component.js';\nimport { HTMLComponent } from '../component/custom-element.js';\nimport { RenderHandler } from './render-handler.js';\n\ntype ElementScope = { [element: string]: HTMLElement };\n\n/**\n * ```ts\n * class View {\n * \n *\t@HostListener('window:load', ['$event.target', '\"load\"'])\n * \t@HostListener('click', ['$event.target', '\"click\"'])\n * \tpublic onClick(target: any, type: string){\n * \t\tconsole.log(target, type);\n * \t}\n * }\n * ```\n * \n * window.addEventListener('load', $event => listener($event.target, 'load'));\n * \n * view.addEventListener('click', $event => listener($event.target, 'click'));\n * \n */\nexport class HostListenerHandler implements RenderHandler {\n\n\tprivate source: HTMLElement | Window;\n\tprivate eventName: string;\n\n\tprivate argumentsExpression: ArrayExpression;\n\tprivate stack: Stack;\n\n\tprivate scopeSubscription?: ScopeSubscription<ElementScope>;\n\n\n\tprivate listener = (event: Event) => {\n\t\tconst method: Function | undefined = this.element._proxyModel[this.listenerRef.modelCallbackName];\n\t\tif (typeof method === 'function') {\n\t\t\tconst eventScope = this.stack.pushBlockScopeFor({ $event: event });\n\t\t\tconst params = this.argumentsExpression.get(this.stack);\n\t\t\tthis.stack.clearTo(eventScope);\n\t\t\tmethod.apply(this.element._proxyModel, params);\n\t\t\ttypeof event.preventDefault === 'function' && event.preventDefault();\n\t\t}\n\t};\n\n\tconstructor(private listenerRef: ListenerRef, private element: HTMLComponent<any>, private elementScope: ReactiveScope<ElementScope>) {\n\t\tthis.stack = new Stack(elementScope);\n\t}\n\tonInit(): void {\n\t\tconst args = this.listenerRef.args ?? [];\n\t\tconst array = `[${args.join(', ')}]`;\n\t\tthis.argumentsExpression = JavaScriptParser.parseScript(array) as ArrayExpression;\n\t\tif (this.listenerRef.eventName.includes(':')) {\n\t\t\tconst [eventSource, eventName] = this.listenerRef.eventName.split(':', 2);\n\t\t\tthis.eventName = eventName;\n\t\t\tif ('window' === eventSource.toLowerCase()) {\n\t\t\t\tthis.source = window;\n\t\t\t} else {\n\t\t\t\tlet source = this.elementScope.get(eventSource) as HTMLElement;\n\t\t\t\tthis.scopeSubscription = this.elementScope.subscribe(eventSource, (newValue: HTMLElement) => {\n\t\t\t\t\tif (source !== newValue) {\n\t\t\t\t\t\tif (source) {\n\t\t\t\t\t\t\tthis.removeEventListener();\n\t\t\t\t\t\t}\n\t\t\t\t\t} else if (!newValue) {\n\t\t\t\t\t\tthis.removeEventListener();\n\t\t\t\t\t}\n\t\t\t\t\tsource = newValue;\n\t\t\t\t\tthis.addEventListener();\n\t\t\t\t});\n\t\t\t\tthis.source = source;\n\t\t\t}\n\t\t} else {\n\t\t\tthis.eventName = this.listenerRef.eventName;\n\t\t\tthis.source = this.element;\n\t\t}\n\t\tthis.addEventListener();\n\t}\n\n\tprivate addEventListener() {\n\t\tthis.source?.addEventListener(this.eventName, this.listener);\n\t}\n\n\tprivate removeEventListener() {\n\t\tthis.source?.removeEventListener(this.eventName, this.listener);\n\t}\n\n\tonConnect() {\n\t\tthis.scopeSubscription?.resume();\n\t}\n\n\tonDisconnect() {\n\t\tthis.scopeSubscription?.pause();\n\t}\n\n\tonDestroy(): void {\n\t\tthis.scopeSubscription?.unsubscribe();\n\t\tthis.removeEventListener();\n\t}\n\n}\n"]}
+{"version":3,"file":"host-listener.handler.js","sourceRoot":"","sources":["../../../src/core/render/host-listener.handler.ts"],"names":[],"mappings":"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","sourcesContent":["import { ArrayExpression, JavaScriptParser, ReactiveScope, ScopeSubscription, Stack } from '@ibyar/expressions';\nimport { ListenerRef } from '../component/component.js';\nimport { HTMLComponent } from '../component/custom-element.js';\nimport { RenderHandler } from './render-handler.js';\n\ntype ElementScope = { [element: string]: HTMLElement };\n\n/**\n * ```ts\n * class View {\n * \n *\t@HostListener('window:load', ['$event.target', '\"load\"'])\n * \t@HostListener('click', ['$event.target', '\"click\"'])\n * \tpublic onClick(target: any, type: string){\n * \t\tconsole.log(target, type);\n * \t}\n * }\n * ```\n * \n * window.addEventListener('load', $event => listener($event.target, 'load'));\n * \n * view.addEventListener('click', $event => listener($event.target, 'click'));\n * \n */\nexport class HostListenerHandler implements RenderHandler {\n\n\tprivate source: HTMLElement | Window;\n\tprivate eventName: string;\n\n\tprivate argumentsExpression: ArrayExpression;\n\tprivate stack: Stack;\n\n\tprivate scopeSubscription?: ScopeSubscription<ElementScope>;\n\n\n\tprivate listener = (event: Event) => {\n\t\tconst method: Function | undefined = this.element._proxyModel[this.listenerRef.modelCallbackName];\n\t\tif (typeof method === 'function') {\n\t\t\tconst eventScope = this.stack.pushBlockScopeFor({ $event: event });\n\t\t\tconst params = this.argumentsExpression.get(this.stack);\n\t\t\tthis.stack.clearTo(eventScope);\n\t\t\tmethod.apply(this.element._proxyModel, params);\n\t\t\ttypeof event.preventDefault === 'function' && event.preventDefault();\n\t\t}\n\t};\n\n\tconstructor(private listenerRef: ListenerRef, private element: HTMLComponent<any>, private elementScope: ReactiveScope<ElementScope>) {\n\t\tthis.stack = new Stack(elementScope);\n\t}\n\tonInit(): void {\n\t\tconst args = this.listenerRef.args ?? [];\n\t\tconst array = `[${args.join(', ')}]`;\n\t\tthis.argumentsExpression = JavaScriptParser.parseScript(array) as ArrayExpression;\n\t\tif (this.listenerRef.eventName.includes(':')) {\n\t\t\tconst [eventSource, eventName] = this.listenerRef.eventName.split(':', 2);\n\t\t\tthis.eventName = eventName;\n\t\t\tif ('window' === eventSource.toLowerCase()) {\n\t\t\t\tthis.source = window;\n\t\t\t} else {\n\t\t\t\tlet source = this.elementScope.get(eventSource) as HTMLElement;\n\t\t\t\tthis.scopeSubscription = this.elementScope.subscribe(eventSource, (newValue: HTMLElement) => {\n\t\t\t\t\tif (source !== newValue) {\n\t\t\t\t\t\tif (source) {\n\t\t\t\t\t\t\tthis.removeEventListener();\n\t\t\t\t\t\t}\n\t\t\t\t\t} else if (!newValue) {\n\t\t\t\t\t\tthis.removeEventListener();\n\t\t\t\t\t}\n\t\t\t\t\tsource = newValue;\n\t\t\t\t\tthis.addEventListener();\n\t\t\t\t});\n\t\t\t\tthis.source = source;\n\t\t\t}\n\t\t} else {\n\t\t\tthis.eventName = this.listenerRef.eventName;\n\t\t\tthis.source = this.element;\n\t\t}\n\t\tthis.addEventListener();\n\t}\n\n\tprivate addEventListener() {\n\t\tthis.source?.addEventListener(this.eventName, this.listener);\n\t}\n\n\tprivate removeEventListener() {\n\t\tthis.source?.removeEventListener(this.eventName, this.listener);\n\t}\n\n\tonConnect() {\n\t\tthis.scopeSubscription?.resume();\n\t}\n\n\tonDisconnect() {\n\t\tthis.scopeSubscription?.pause();\n\t}\n\n\tonDestroy(): void {\n\t\tthis.scopeSubscription?.unsubscribe();\n\t\tthis.removeEventListener();\n\t}\n\n}\n"]}

package/render/render-handler.d.ts

@@ -1,5 +1,11 @@
 import { OnDestroy, OnInit } from '../component/lifecycle.js';
 export interface RenderHandler extends Partial<OnInit>, Partial<OnDestroy> {
+    /**
+     * execute when element attached to parent from ui
+     */
     onConnect?(): void;
+    /**
+     * execute when element disconnected from ui
+     */
     onDisconnect?(): void;
 }

package/utils/typeof.d.ts

@@ -1,3 +1,6 @@
+/**
+ * send the class itself, not instance
+ */
 export interface TypeOf<T> extends Function {
     new (...values: any): T;
 }

package/utils/utils.js

@@ -1,5 +1,6 @@
 export function ToCamelCase(str) {
     return str.replace(/([A-Z])/g, ' $1')
+        // uppercase the first character
         .replace(/^./, function (str) { return str.toUpperCase(); })
         .replace(/ /g, '');
 }

package/utils/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/core/utils/utils.ts"],"names":[],"mappings":"AACA,MAAM,UAAU,WAAW,CAAC,GAAW;IACtC,OAAO,GAAG,CAAC,OAAO,CAAC,UAAU,EAAE,KAAK,CAAC;SAEnC,OAAO,CAAC,IAAI,EAAE,UAAU,GAAG,IAAI,OAAO,GAAG,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,CAAC;SAC3D,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;AACrB,CAAC","sourcesContent":["\nexport function ToCamelCase(str: string) {\n\treturn str.replace(/([A-Z])/g, ' $1')\n\t\t// uppercase the first character\n\t\t.replace(/^./, function (str) { return str.toUpperCase(); })\n\t\t.replace(/ /g, '');\n}\n"]}
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/core/utils/utils.ts"],"names":[],"mappings":"AACA,MAAM,UAAU,WAAW,CAAC,GAAW;IACtC,OAAO,GAAG,CAAC,OAAO,CAAC,UAAU,EAAE,KAAK,CAAC;QACpC,gCAAgC;SAC/B,OAAO,CAAC,IAAI,EAAE,UAAU,GAAG,IAAI,OAAO,GAAG,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,CAAC;SAC3D,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;AACrB,CAAC","sourcesContent":["\nexport function ToCamelCase(str: string) {\n\treturn str.replace(/([A-Z])/g, ' $1')\n\t\t// uppercase the first character\n\t\t.replace(/^./, function (str) { return str.toUpperCase(); })\n\t\t.replace(/ /g, '');\n}\n"]}