@adaas/are-html 0.0.4 → 0.0.6

package/dist/browser/index.d.mts

@@ -1,4 +1,4 @@
-import { AreStoreWatchingEntity, AreNode, AreAttribute, AreStore, AreScene, AreSyntax, AreMutation, AreDeclaration, AreInstructionSerialized, AreNodeNewProps, Are, AreSignal, AreContext, AreInstruction, AreCompiler, AreEngine, AreSyntaxTokenMatch, AreInterpreter, AreLifecycle, AreSignalsContext, AreTokenizer, AreTransformer, ArePropDefinition } from '@adaas/are';
+import { AreStoreWatchingEntity, AreNode, AreAttribute, AreStore, AreScene, AreSyntax, AreMutation, AreDeclaration, AreInstructionSerialized, AreNodeNewProps, Are, AreSignal, AreContext, AreInstruction, AreCompiler, AreEngine, AreSignalsContext, AreSyntaxTokenMatch, AreInterpreter, AreLifecycle, AreTokenizer, AreTransformer, ArePropDefinition } from '@adaas/are';
 import { A_Component, A_TYPES__Ctor, A_Fragment, ASEID, A_Scope, A_Feature, A_ComponentMeta } from '@adaas/a-concept';
 import { A_Logger } from '@adaas/a-utils/a-logger';
 import { A_ExecutionContext } from '@adaas/a-utils/a-execution';
@@ -311,6 +311,15 @@ declare class AreRoute extends AreSignal<A_Route> {
     compare(other: A_Signal<A_Route>): boolean;
 }
 
+/**
+ * Void HTML elements that cannot have children and must not have a closing tag.
+ * Per the HTML5 spec these are treated as self-closing even when written as
+ * `<input>` (without the trailing slash `/>`).
+ *
+ * Reference: https://html.spec.whatwg.org/multipage/syntax.html#void-elements
+ */
+declare const VOID_ELEMENTS: Set<string>;
+declare function isVoidElement(tagName: string): boolean;
 /**
  * Boolean HTML attributes whose presence (regardless of value) implies "true",
  * and whose absence implies "false". Setting these via `setAttribute(name, value)`
@@ -502,7 +511,7 @@ declare class AreHTMLEngine extends AreEngine {
      *
      * @param container
      */
-    init(scope: A_Scope): Promise<void>;
+    init(scope: A_Scope, signalContext?: AreSignalsContext): Promise<void>;
     protected rootElementMatcher(source: string, from: number, to: number, build: (raw: string, content: string, position: number, closing: string) => AreSyntaxTokenMatch): AreSyntaxTokenMatch | null;
     protected htmlElementMatcher(source: string, from: number, to: number, build: (raw: string, content: string, position: number, closing: string) => AreSyntaxTokenMatch): AreSyntaxTokenMatch | null;
     /**
@@ -531,10 +540,18 @@ declare class AreHTMLInterpreter extends AreInterpreter {
 }
 
 declare class AreHTMLLifecycle extends AreLifecycle {
-    initComponent(node: AreHTMLNode, scope: A_Scope, context: AreHTMLEngineContext, logger?: A_Logger, ...args: any[]): void;
-    initRoot(node: AreHTMLNode, scope: A_Scope, context: AreHTMLEngineContext, signalsContext?: AreSignalsContext, logger?: A_Logger, ...args: any[]): void;
+    initComponent(node: AreHTMLNode, scope: A_Scope, context: AreHTMLEngineContext, signalsContext?: AreSignalsContext, logger?: A_Logger, ...args: any[]): void;
     initText(node: AreHTMLNode, scope: A_Scope, context: AreHTMLEngineContext, logger?: A_Logger, ...args: any[]): void;
     initInterpolation(node: AreHTMLNode, scope: A_Scope, context: AreHTMLEngineContext, logger?: A_Logger, ...args: any[]): void;
+    mount(
+    /**
+     * Node to be mounted
+     */
+    node: AreHTMLNode, 
+    /**
+     * Node Content
+     */
+    scene: AreScene, logger?: A_Logger, ...args: any[]): void;
     updateDirectiveAttribute(directive: AreDirectiveAttribute, scope: A_Scope, feature: A_Feature, logger?: A_Logger, ...args: any[]): void;
 }
 
@@ -601,4 +618,4 @@ declare class AreRouteWatcher extends A_Component {
     private notify;
 }
 
-export { AddAttributeInstruction, AddElementInstruction, AddInterpolationInstruction, AddListenerInstruction, AddStyleInstruction, AddTextInstruction, AreBindingAttribute, AreComment, AreComponentNode, AreDirective, AreDirectiveAttribute, AreDirectiveContext, AreDirectiveFeatures, AreDirectiveFor, AreDirectiveIf, AreDirectiveMeta, type AreDirectiveOrderDecoratorParameters, AreEventAttribute, AreHTMLAttribute, AreHTMLCompiler, type AreHTMLContextConstructor, AreHTMLEngine, AreHTMLEngineContext, AreHTMLInstructions, AreHTMLInterpreter, AreHTMLLifecycle, AreHTMLNode, AreHTMLTokenizer, AreHTMLTransformer, type AreHtmlAddAttributeInstructionPayload, type AreHtmlAddCommentInstructionPayload, type AreHtmlAddElementInstructionPayload, type AreHtmlAddInterpolationInstructionPayload, type AreHtmlAddListenerInstructionPayload, type AreHtmlAddStyleInstructionPayload, type AreHtmlAddTextInstructionPayload, AreInterpolation, AreRoot, AreRootNode, AreRoute, AreRouteWatcher, AreStaticAttribute, AreStyle, AreText, BOOLEAN_ATTRIBUTES, IDL_FORM_PROPERTIES, LISTENER_OPTION_MODIFIERS, type ParsedEventName, isBooleanAttribute, isIDLFormProperty, normalizeClassValue, normalizeStyleValue, parseEventName, toDOMString };
+export { AddAttributeInstruction, AddElementInstruction, AddInterpolationInstruction, AddListenerInstruction, AddStyleInstruction, AddTextInstruction, AreBindingAttribute, AreComment, AreComponentNode, AreDirective, AreDirectiveAttribute, AreDirectiveContext, AreDirectiveFeatures, AreDirectiveFor, AreDirectiveIf, AreDirectiveMeta, type AreDirectiveOrderDecoratorParameters, AreEventAttribute, AreHTMLAttribute, AreHTMLCompiler, type AreHTMLContextConstructor, AreHTMLEngine, AreHTMLEngineContext, AreHTMLInstructions, AreHTMLInterpreter, AreHTMLLifecycle, AreHTMLNode, AreHTMLTokenizer, AreHTMLTransformer, type AreHtmlAddAttributeInstructionPayload, type AreHtmlAddCommentInstructionPayload, type AreHtmlAddElementInstructionPayload, type AreHtmlAddInterpolationInstructionPayload, type AreHtmlAddListenerInstructionPayload, type AreHtmlAddStyleInstructionPayload, type AreHtmlAddTextInstructionPayload, AreInterpolation, AreRoot, AreRootNode, AreRoute, AreRouteWatcher, AreStaticAttribute, AreStyle, AreText, BOOLEAN_ATTRIBUTES, IDL_FORM_PROPERTIES, LISTENER_OPTION_MODIFIERS, type ParsedEventName, VOID_ELEMENTS, isBooleanAttribute, isIDLFormProperty, isVoidElement, normalizeClassValue, normalizeStyleValue, parseEventName, toDOMString };

package/dist/browser/index.mjs

@@ -821,6 +821,25 @@ AreRoute = __decorateClass([
 ], AreRoute);
 
 // src/engine/AreHTML.constants.ts
+var VOID_ELEMENTS = /* @__PURE__ */ new Set([
+  "area",
+  "base",
+  "br",
+  "col",
+  "embed",
+  "hr",
+  "img",
+  "input",
+  "link",
+  "meta",
+  "param",
+  "source",
+  "track",
+  "wbr"
+]);
+function isVoidElement(tagName) {
+  return VOID_ELEMENTS.has(tagName.toLowerCase());
+}
 var BOOLEAN_ATTRIBUTES = /* @__PURE__ */ new Set([
   "allowfullscreen",
   "async",
@@ -1102,6 +1121,16 @@ var AreHTMLCompiler = class extends AreCompiler {
         title: "Scene Host Not Found",
         description: `No host found for the scene with id: ${scene.id}. Please ensure that the scene is properly initialized and has a host before compiling binding attributes.`
       });
+    const content = attribute.content;
+    if (content.includes("{{")) {
+      const transformed = '"' + content.replace(/\{\{([^}]+)\}\}/g, '"+($1)+"') + '"';
+      scene.plan(new AddAttributeInstruction(scene.host, {
+        name: attribute.name,
+        content: transformed,
+        evaluate: true
+      }));
+      return;
+    }
     scene.plan(new AddAttributeInstruction(scene.host, {
       name: attribute.name,
       content: attribute.content
@@ -1409,6 +1438,7 @@ var AreHTMLInterpreter = class extends AreInterpreter {
         event.set("args", effectiveArgs);
         event.set("element", element);
         event.set("instruction", mutation);
+        if (liveEvent) event.set("native", liveEvent);
         mutation.owner.emit(event);
       };
       handlerScope[`$${handler}`] = handlerFn;
@@ -1725,10 +1755,7 @@ AreHTMLTokenizer = __decorateClass([
   })
 ], AreHTMLTokenizer);
 var AreHTMLLifecycle = class extends AreLifecycle {
-  initComponent(node, scope, context, logger, ...args) {
-    super.init(node, scope, context, logger, ...args);
-  }
-  initRoot(node, scope, context, signalsContext, logger, ...args) {
+  initComponent(node, scope, context, signalsContext, logger, ...args) {
     signalsContext?.subscribe(node);
     super.init(node, scope, context, logger, ...args);
   }
@@ -1740,6 +1767,14 @@ var AreHTMLLifecycle = class extends AreLifecycle {
     const scene = new AreScene(node.aseid);
     scope.register(scene);
   }
+  mount(node, scene, logger, ...args) {
+    logger?.debug(`[Mount] Component Trigger for <${node.aseid.entity}>  with aseid :{${node.aseid.toString()}}`);
+    node.interpret();
+    for (let i = 0; i < node.children.length; i++) {
+      const child = node.children[i];
+      child.mount();
+    }
+  }
   updateDirectiveAttribute(directive, scope, feature, logger, ...args) {
     if (directive.component) {
       feature.chain(directive.component, AreDirectiveFeatures.Update, directive.owner.scope);
@@ -1750,19 +1785,13 @@ var AreHTMLLifecycle = class extends AreLifecycle {
 };
 __decorateClass([
   AreLifecycle.Init(AreComponentNode),
-  __decorateParam(0, A_Inject(A_Caller)),
-  __decorateParam(1, A_Inject(A_Scope)),
-  __decorateParam(2, A_Inject(AreHTMLEngineContext)),
-  __decorateParam(3, A_Inject(A_Logger))
-], AreHTMLLifecycle.prototype, "initComponent", 1);
-__decorateClass([
   AreLifecycle.Init(AreRootNode),
   __decorateParam(0, A_Inject(A_Caller)),
   __decorateParam(1, A_Inject(A_Scope)),
   __decorateParam(2, A_Inject(AreHTMLEngineContext)),
   __decorateParam(3, A_Inject(AreSignalsContext)),
   __decorateParam(4, A_Inject(A_Logger))
-], AreHTMLLifecycle.prototype, "initRoot", 1);
+], AreHTMLLifecycle.prototype, "initComponent", 1);
 __decorateClass([
   AreLifecycle.Init(AreText),
   __decorateParam(0, A_Inject(A_Caller)),
@@ -1777,6 +1806,15 @@ __decorateClass([
   __decorateParam(2, A_Inject(AreHTMLEngineContext)),
   __decorateParam(3, A_Inject(A_Logger))
 ], AreHTMLLifecycle.prototype, "initInterpolation", 1);
+__decorateClass([
+  A_Feature.Extend({
+    name: AreNodeFeatures.onMount,
+    scope: [AreHTMLNode]
+  }),
+  __decorateParam(0, A_Inject(A_Caller)),
+  __decorateParam(1, A_Inject(AreScene)),
+  __decorateParam(2, A_Inject(A_Logger))
+], AreHTMLLifecycle.prototype, "mount", 1);
 __decorateClass([
   A_Feature.Extend({
     name: AreAttributeFeatures.Update,
@@ -1866,7 +1904,7 @@ var AreHTMLEngine = class extends AreEngine {
       ]
     });
   }
-  async init(scope) {
+  async init(scope, signalContext) {
     this.package(scope, {
       context: new AreHTMLEngineContext({}),
       syntax: this.DefaultSyntax,
@@ -1876,6 +1914,10 @@ var AreHTMLEngine = class extends AreEngine {
       lifecycle: AreHTMLLifecycle,
       transformer: AreHTMLTransformer
     });
+    if (!signalContext) {
+      signalContext = new AreSignalsContext();
+      scope.register(signalContext);
+    }
   }
   rootElementMatcher(source, from, to, build) {
     const rootTag = "are-root";
@@ -1920,6 +1962,13 @@ var AreHTMLEngine = class extends AreEngine {
         match2.payload = { entity: tagName, selfClose: true, id };
         return match2;
       }
+      if (isVoidElement(tagName)) {
+        const raw = source.slice(tagStart, openingTagEnd + 1);
+        const content2 = source.slice(tagStart + tagNameMatch[0].length, openingTagEnd);
+        const match2 = build(raw, content2, tagStart, ">");
+        match2.payload = { entity: tagName, selfClose: true, id };
+        return match2;
+      }
       const closingTag = `</${tagName}>`;
       let level = 0;
       let searchIndex = openingTagEnd + 1;
@@ -1977,7 +2026,8 @@ __decorateClass([
     name: A_ServiceFeatures.onBeforeLoad,
     before: /.*/
   }),
-  __decorateParam(0, A_Inject(A_Scope))
+  __decorateParam(0, A_Inject(A_Scope)),
+  __decorateParam(1, A_Inject(AreSignalsContext))
 ], AreHTMLEngine.prototype, "init", 1);
 AreHTMLEngine = __decorateClass([
   A_Frame.Define({
@@ -2014,8 +2064,8 @@ var AreRoot = class extends Are {
       }
     }
     if (!componentName) {
-      const defaultAttr = root.attributes.find((attr) => attr.name === "default");
-      componentName = defaultAttr?.content;
+      const defaultMatch = root.markup?.match(/\bdefault=["']([^"']*)["']/);
+      componentName = defaultMatch?.[1];
     }
     if (!componentName) {
       logger.warning('AreRoot: No component found for initial render. Please ensure a route condition or "default" attribute is set.');
@@ -2024,7 +2074,6 @@ var AreRoot = class extends Are {
     root.setContent(`<${componentName}></${componentName}>`);
   }
   async onSignal(root, vector, store, logger, signalsContext) {
-    console.log("Received signal vector in AreRoot:", root, vector);
     const rootId = root.id;
     if (signalsContext && !signalsContext.hasRoot(rootId)) {
       return;
@@ -2143,6 +2192,6 @@ AreRouteWatcher = __decorateClass([
   })
 ], AreRouteWatcher);
 
-export { AddAttributeInstruction, AddElementInstruction, AddInterpolationInstruction, AddListenerInstruction, AddStyleInstruction, AddTextInstruction, AreBindingAttribute, AreComment, AreComponentNode, AreDirective, AreDirectiveAttribute, AreDirectiveContext, AreDirectiveFeatures, AreDirectiveFor, AreDirectiveIf, AreDirectiveMeta, AreEventAttribute, AreHTMLAttribute, AreHTMLCompiler, AreHTMLEngine, AreHTMLEngineContext, AreHTMLInstructions, AreHTMLInterpreter, AreHTMLLifecycle, AreHTMLNode, AreHTMLTokenizer, AreHTMLTransformer, AreInterpolation, AreRoot, AreRootNode, AreRoute, AreRouteWatcher, AreStaticAttribute, AreStyle, AreText, BOOLEAN_ATTRIBUTES, IDL_FORM_PROPERTIES, LISTENER_OPTION_MODIFIERS, isBooleanAttribute, isIDLFormProperty, normalizeClassValue, normalizeStyleValue, parseEventName, toDOMString };
+export { AddAttributeInstruction, AddElementInstruction, AddInterpolationInstruction, AddListenerInstruction, AddStyleInstruction, AddTextInstruction, AreBindingAttribute, AreComment, AreComponentNode, AreDirective, AreDirectiveAttribute, AreDirectiveContext, AreDirectiveFeatures, AreDirectiveFor, AreDirectiveIf, AreDirectiveMeta, AreEventAttribute, AreHTMLAttribute, AreHTMLCompiler, AreHTMLEngine, AreHTMLEngineContext, AreHTMLInstructions, AreHTMLInterpreter, AreHTMLLifecycle, AreHTMLNode, AreHTMLTokenizer, AreHTMLTransformer, AreInterpolation, AreRoot, AreRootNode, AreRoute, AreRouteWatcher, AreStaticAttribute, AreStyle, AreText, BOOLEAN_ATTRIBUTES, IDL_FORM_PROPERTIES, LISTENER_OPTION_MODIFIERS, VOID_ELEMENTS, isBooleanAttribute, isIDLFormProperty, isVoidElement, normalizeClassValue, normalizeStyleValue, parseEventName, toDOMString };
 //# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map