@adaas/are-html 0.0.11 → 0.0.13

package/dist/node/lib/AreRoot/AreRoot.component.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/lib/AreRoot/AreRoot.component.ts"],"names":[],"mappings":"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","file":"AreRoot.component.mjs","sourcesContent":["import { A_Caller, A_Context, A_FormatterHelper, A_Inject, } from \"@adaas/a-concept\";\nimport { A_Frame } from \"@adaas/a-frame/core\";\nimport { A_Logger } from \"@adaas/a-utils/a-logger\";\nimport { A_SignalVector } from \"@adaas/a-utils/a-signal\";\nimport { Are, ArePropDefinition, AreStore, AreNode, AreSignals, AreSignalsMeta, AreSignalsContext, AreRoute } from \"@adaas/are\";\n\n\n@A_Frame.Define({\n    namespace: 'a-are-html',\n    description: 'The AreRoot component serves as the foundational entry point for the A-Concept Rendering Engine (ARE). It is responsible for initializing the rendering process, managing the root node of the component tree, and handling signal-based rendering logic. The AreRoot component processes incoming signals to determine which child components to render, allowing for dynamic and responsive UI updates based on application state and user interactions.'\n})\nexport class AreRoot extends Are {\n\n    props: Record<string, ArePropDefinition> = {\n        default: {\n            type: 'string',\n            default: '',\n        }\n    }\n\n\n    @Are.Template\n    async template(\n        @A_Inject(A_Caller) root: AreNode,\n        @A_Inject(A_Logger) logger: A_Logger,\n        @A_Inject(AreSignalsContext) signalsContext?: AreSignalsContext,\n    ) {\n\n        const rootId = root.id;\n\n        // No routing config for this root — leave the existing template content intact\n        if (signalsContext && !signalsContext.hasRoot(rootId)) {\n            return;\n        }\n\n        const currentRoute = AreRoute.default();\n\n        let componentName: string | undefined;\n\n        if (currentRoute) {\n            const initialVector = new A_SignalVector([currentRoute]);\n\n            // 1. Lookup via AreSignalsContext (per root-id conditions)\n            let renderTarget = signalsContext?.findComponentByVector(rootId, initialVector);\n\n            // 2. Fall back to global AreSignalsMeta\n            if (!renderTarget) {\n                const signalsMeta = A_Context.meta<AreSignalsMeta>(AreSignals);\n                renderTarget = signalsMeta?.findComponentByVector(initialVector);\n            }\n\n            if (renderTarget?.name) {\n                componentName = A_FormatterHelper.toKebabCase(renderTarget.name);\n            }\n        }\n\n        // 3. Fall back to the 'default' attribute on the node directly.\n        //    Note: root.attributes is NOT populated at this stage because tokenize()\n        //    runs after template() in the lifecycle. Read from raw markup instead.\n        if (!componentName) {\n            const defaultMatch = root.markup?.match(/\\bdefault=[\"']([^\"']*)[\"']/);\n            componentName = defaultMatch?.[1];\n        }\n\n        if (!componentName) {\n            logger.warning('AreRoot: No component found for initial render. Please ensure a route condition or \"default\" attribute is set.');\n            return;\n        }\n\n        root.setContent(`<${componentName}></${componentName}>`);\n    }\n\n\n    @Are.Signal\n    async onSignal(\n        @A_Inject(A_Caller) root: AreNode,\n        @A_Inject(A_SignalVector) vector: A_SignalVector,\n        @A_Inject(AreStore) store: AreStore<{ default: string }>,\n        @A_Inject(A_Logger) logger: A_Logger,\n        @A_Inject(AreSignalsContext) signalsContext?: AreSignalsContext,\n    ) {\n        const rootId = root.id;\n        // No routing config for this root — signals do not affect its content\n        if (signalsContext && !signalsContext.hasRoot(rootId)) {\n            return;\n        }\n\n        // 1. Try root-specific lookup via AreSignalsContext (keyed by the are-root's id attribute)\n        let renderTarget = signalsContext?.findComponentByVector(rootId, vector);\n\n        // 2. Fall back to global AreSignalsMeta lookup\n        if (!renderTarget) {\n            const signalsMeta = A_Context.meta<AreSignalsMeta>(AreSignals);\n            renderTarget = signalsMeta?.findComponentByVector(vector);\n        }\n\n        const componentName = renderTarget?.name\n            ? A_FormatterHelper.toKebabCase(renderTarget.name)\n            : store.get('default');\n\n        if (!componentName) {\n            logger.warning('No component found for rendering in AreRoot. Please ensure that the signal vector matches at least one component or that a default component name is provided in the store.');\n            return;\n        }\n\n        root.setContent(`<${componentName}></${componentName}>`);\n\n        for (let i = 0; i < root.children.length; i++) {\n            const child = root.children[i];\n            child.unmount();\n            child.destroy();\n            root.removeChild(child);\n        }\n\n\n        root.tokenize();\n\n        for (let i = 0; i < root.children.length; i++) {\n            const child = root.children[i];\n            child.init();\n\n            const res = child.load();\n            if (res instanceof Promise) {\n                await res;\n            }\n            child.transform();\n\n            child.compile();\n            child.mount();\n        }\n    }\n}\n"]}
+{"version":3,"sources":["../../../../src/lib/AreRoot/AreRoot.component.ts"],"names":[],"mappings":"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","file":"AreRoot.component.mjs","sourcesContent":["import { A_Caller, A_Context, A_FormatterHelper, A_Inject, } from \"@adaas/a-concept\";\nimport { A_Frame } from \"@adaas/a-frame/core\";\nimport { A_Logger } from \"@adaas/a-utils/a-logger\";\nimport { A_SignalVector } from \"@adaas/a-utils/a-signal\";\nimport { Are, ArePropDefinition, AreStore, AreNode, AreSignals, AreSignalsMeta, AreSignalsContext } from \"@adaas/are\";\nimport { AreRoute } from \"@adaas/are-html/signals/AreRoute.signal\";\n\n\n@A_Frame.Define({\n    namespace: 'a-are-html',\n    description: 'The AreRoot component serves as the foundational entry point for the A-Concept Rendering Engine (ARE). It is responsible for initializing the rendering process, managing the root node of the component tree, and handling signal-based rendering logic. The AreRoot component processes incoming signals to determine which child components to render, allowing for dynamic and responsive UI updates based on application state and user interactions.'\n})\nexport class AreRoot extends Are {\n\n    props: Record<string, ArePropDefinition> = {\n        default: {\n            type: 'string',\n            default: '',\n        }\n    }\n\n\n    @Are.Template\n    async template(\n        @A_Inject(A_Caller) root: AreNode,\n        @A_Inject(A_Logger) logger: A_Logger,\n        @A_Inject(AreSignalsContext) signalsContext?: AreSignalsContext,\n    ) {\n\n        const rootId = root.id;\n\n        // No routing config for this root — but still honour body content or\n        // a 'default' attribute if one is present on the markup.\n        if (signalsContext && !signalsContext.hasRoot(rootId)) {\n            if (!root.content?.trim()) {\n                // Fallback: legacy default= attribute\n                const defaultMatch = root.markup?.match(/\\bdefault=[\"']([^\"']*)[\"']/);\n                const defaultComponent = defaultMatch?.[1];\n                if (defaultComponent) {\n                    root.setContent(`<${defaultComponent}></${defaultComponent}>`);\n                }\n            }\n            // Body content (or none) — tokenizer picks it up without intervention\n            return;\n        }\n\n        const currentRoute = AreRoute.default();\n\n        let componentName: string | undefined;\n\n        if (currentRoute) {\n            const initialVector = new A_SignalVector([currentRoute]);\n\n            // 1. Lookup via AreSignalsContext (per root-id conditions)\n            let renderTarget = signalsContext?.findComponentByVector(rootId, initialVector);\n\n            // 2. Fall back to global AreSignalsMeta\n            if (!renderTarget) {\n                const signalsMeta = A_Context.meta<AreSignalsMeta>(AreSignals);\n                renderTarget = signalsMeta?.findComponentByVector(initialVector);\n            }\n\n            if (renderTarget?.name) {\n                componentName = A_FormatterHelper.toKebabCase(renderTarget.name);\n            }\n        }\n\n        // 3. Fall back to body content (the nodes already placed inside the\n        //    <are-root> tag act as the default).  No setContent() call needed —\n        //    the tokenizer will process root.content as-is.\n        if (!componentName) {\n            if (root.content?.trim()) {\n                return;\n            }\n        }\n\n        // 4. Last resort: legacy default= attribute on the markup.\n        if (!componentName) {\n            const defaultMatch = root.markup?.match(/\\bdefault=[\"']([^\"']*)[\"']/);\n            componentName = defaultMatch?.[1];\n        }\n\n        if (!componentName) {\n            logger.warning('AreRoot: No component found for initial render. Provide body content, a route condition, or a \"default\" attribute.');\n            return;\n        }\n\n        root.setContent(`<${componentName}></${componentName}>`);\n    }\n\n\n    @Are.Signal\n    async onSignal(\n        @A_Inject(A_Caller) root: AreNode,\n        @A_Inject(A_SignalVector) vector: A_SignalVector,\n        @A_Inject(AreStore) store: AreStore<{ default: string }>,\n        @A_Inject(A_Logger) logger: A_Logger,\n        @A_Inject(AreSignalsContext) signalsContext?: AreSignalsContext,\n    ) {\n        const rootId = root.id;\n\n        // No routing config for this root — signals do not affect its content\n        if (signalsContext && !signalsContext.hasRoot(rootId)) {\n            return;\n        }\n\n        // 1. Try root-specific lookup via AreSignalsContext (keyed by the are-root's id attribute)\n        let renderTarget = signalsContext?.findComponentByVector(rootId, vector);\n\n        // 2. Fall back to global AreSignalsMeta lookup\n        if (!renderTarget) {\n            const signalsMeta = A_Context.meta<AreSignalsMeta>(AreSignals);\n            renderTarget = signalsMeta?.findComponentByVector(vector);\n        }\n\n        const componentName = renderTarget?.name\n            ? A_FormatterHelper.toKebabCase(renderTarget.name)\n            : store.get('default');\n\n        // No matching condition for this signal vector (e.g. AreInit before any route).\n        // Keep the current outlet content and do nothing.\n        if (!componentName) {\n            return;\n        }\n\n        root.setContent(`<${componentName}></${componentName}>`);\n\n        // Unsubscribe old children BEFORE destroying them.\n        // Without this, AreSignals.handleSignalVector keeps iterating stale\n        // (scope-less) nodes on every subsequent signal and throws an error.\n        for (let i = 0; i < root.children.length; i++) {\n            const child = root.children[i];\n            signalsContext?.unsubscribe(child);\n            child.unmount();\n            child.destroy();\n            root.removeChild(child);\n        }\n\n\n        root.tokenize();\n\n        for (let i = 0; i < root.children.length; i++) {\n            const child = root.children[i];\n            child.init();\n\n            const res = child.load();\n            if (res instanceof Promise) {\n                await res;\n            }\n            child.transform();\n\n            child.compile();\n            child.mount();\n        }\n    }\n}\n"]}

package/dist/node/nodes/AreComment.d.mts

@@ -1,5 +1,5 @@
 import { AreNodeNewProps } from '@adaas/are';
-import { e as AreHTMLNode } from '../AreBinding.attribute-C6qrxN8K.mjs';
+import { e as AreHTMLNode } from '../AreBinding.attribute-doUvtOjc.mjs';
 import '@adaas/a-concept';
 import '../lib/AreStyle/AreStyle.context.mjs';
 

package/dist/node/nodes/AreComment.d.ts

@@ -1,5 +1,5 @@
 import { AreNodeNewProps } from '@adaas/are';
-import { e as AreHTMLNode } from '../AreBinding.attribute-C6JasbJL.js';
+import { e as AreHTMLNode } from '../AreBinding.attribute-Bm5LlOyE.js';
 import '@adaas/a-concept';
 import '../lib/AreStyle/AreStyle.context.js';
 

package/dist/node/nodes/AreComponent.d.mts

@@ -1,5 +1,5 @@
 import { Are } from '@adaas/are';
-import { e as AreHTMLNode } from '../AreBinding.attribute-C6qrxN8K.mjs';
+import { e as AreHTMLNode } from '../AreBinding.attribute-doUvtOjc.mjs';
 import '@adaas/a-concept';
 import '../lib/AreStyle/AreStyle.context.mjs';
 

package/dist/node/nodes/AreComponent.d.ts

@@ -1,5 +1,5 @@
 import { Are } from '@adaas/are';
-import { e as AreHTMLNode } from '../AreBinding.attribute-C6JasbJL.js';
+import { e as AreHTMLNode } from '../AreBinding.attribute-Bm5LlOyE.js';
 import '@adaas/a-concept';
 import '../lib/AreStyle/AreStyle.context.js';
 

package/dist/node/nodes/AreInterpolation.d.mts

@@ -1,5 +1,5 @@
 import { AreNodeNewProps } from '@adaas/are';
-import { e as AreHTMLNode } from '../AreBinding.attribute-C6qrxN8K.mjs';
+import { e as AreHTMLNode } from '../AreBinding.attribute-doUvtOjc.mjs';
 import '@adaas/a-concept';
 import '../lib/AreStyle/AreStyle.context.mjs';
 

package/dist/node/nodes/AreInterpolation.d.ts

@@ -1,5 +1,5 @@
 import { AreNodeNewProps } from '@adaas/are';
-import { e as AreHTMLNode } from '../AreBinding.attribute-C6JasbJL.js';
+import { e as AreHTMLNode } from '../AreBinding.attribute-Bm5LlOyE.js';
 import '@adaas/a-concept';
 import '../lib/AreStyle/AreStyle.context.js';
 

package/dist/node/nodes/AreRoot.d.mts

@@ -1,5 +1,5 @@
 import { Are } from '@adaas/are';
-import { e as AreHTMLNode } from '../AreBinding.attribute-C6qrxN8K.mjs';
+import { e as AreHTMLNode } from '../AreBinding.attribute-doUvtOjc.mjs';
 import '@adaas/a-concept';
 import '../lib/AreStyle/AreStyle.context.mjs';
 

package/dist/node/nodes/AreRoot.d.ts

@@ -1,5 +1,5 @@
 import { Are } from '@adaas/are';
-import { e as AreHTMLNode } from '../AreBinding.attribute-C6JasbJL.js';
+import { e as AreHTMLNode } from '../AreBinding.attribute-Bm5LlOyE.js';
 import '@adaas/a-concept';
 import '../lib/AreStyle/AreStyle.context.js';
 

package/dist/node/nodes/AreText.d.mts

@@ -1,5 +1,5 @@
 import { AreNodeNewProps } from '@adaas/are';
-import { e as AreHTMLNode } from '../AreBinding.attribute-C6qrxN8K.mjs';
+import { e as AreHTMLNode } from '../AreBinding.attribute-doUvtOjc.mjs';
 import '@adaas/a-concept';
 import '../lib/AreStyle/AreStyle.context.mjs';
 

package/dist/node/nodes/AreText.d.ts

@@ -1,5 +1,5 @@
 import { AreNodeNewProps } from '@adaas/are';
-import { e as AreHTMLNode } from '../AreBinding.attribute-C6JasbJL.js';
+import { e as AreHTMLNode } from '../AreBinding.attribute-Bm5LlOyE.js';
 import '@adaas/a-concept';
 import '../lib/AreStyle/AreStyle.context.js';
 

package/examples/component-styles/concept.ts

@@ -0,0 +1,41 @@
+import { A_Concept, A_Context } from "@adaas/a-concept";
+import { UIContainer } from "./containers/UI.container";
+import { A_Logger } from "@adaas/a-utils/a-logger";
+import { A_Polyfill } from "@adaas/a-utils/a-polyfill";
+import { A_Config, ENVConfigReader } from "@adaas/a-utils/a-config";
+
+
+(async () => {
+    try {
+        const Application = new UIContainer({
+            name: 'ARE Component Styles',
+            components: [
+                A_Polyfill,
+                ENVConfigReader,
+                A_Logger,
+            ],
+            fragments: [
+                new A_Config({
+                    defaults: {
+                        PORT: 8083,
+                        CONFIG_VERBOSE: true,
+                        DEV_MODE: true,
+                    }
+                }),
+            ]
+        });
+
+        const concept = new A_Concept({
+            name: 'adaas-are-example-component-styles',
+            components: [A_Logger, A_Polyfill, ENVConfigReader],
+            containers: [Application],
+        });
+
+        await concept.load();
+        await concept.start();
+
+    } catch (error) {
+        const logger = A_Context.root.resolve<A_Logger>(A_Logger)!;
+        logger.error(error);
+    }
+})();

package/examples/component-styles/containers/UI.container.ts

@@ -0,0 +1,122 @@
+import { A_Concept, A_IdentityHelper, A_Inject } from "@adaas/a-concept";
+import { A_Config } from "@adaas/a-utils/a-config";
+import { A_Logger } from "@adaas/a-utils/a-logger";
+import { A_Service } from "@adaas/a-utils/a-service";
+import { build } from "esbuild";
+import fs from "fs";
+import http from "http";
+import path from "path";
+
+
+export class UIContainer extends A_Service {
+
+    protected server!: any;
+
+    @A_Concept.Build()
+    async build(
+        @A_Inject(A_Logger) logger: A_Logger,
+        @A_Inject(A_Config) config: A_Config
+    ): Promise<void> {
+        logger.log('Building Component Styles example...');
+        const entryFile = path.resolve(__dirname, "../src/concept.ts");
+        const BundleID = A_IdentityHelper.generateTimeId();
+        const outFile = path.resolve(__dirname, `../dist/${BundleID}.js`);
+
+        if (fs.existsSync(path.resolve(__dirname, "../dist"))) {
+            fs.rmSync(path.resolve(__dirname, "../dist"), { recursive: true, force: true });
+        }
+
+        await build({
+            entryPoints: [entryFile],
+            outfile: outFile,
+            bundle: true,
+            minify: false,
+            keepNames: true,
+            sourcemap: false,
+            target: "es2020",
+            format: "esm",
+        });
+
+        logger.log('green', 'Bundle built successfully.');
+
+        let indexHtml = await fs.promises.readFile(
+            path.resolve(__dirname, "../public/index.html"), 'utf-8'
+        );
+        indexHtml = indexHtml.replace('{{BUNDLE_ID}}', BundleID);
+        await fs.promises.writeFile(path.resolve(__dirname, "../dist/index.html"), indexHtml);
+
+        const publicDir = path.resolve(__dirname, "../public");
+        const distDir = path.resolve(__dirname, "../dist");
+        const copyRecursive = async (src: string, dest: string) => {
+            const entries = await fs.promises.readdir(src, { withFileTypes: true });
+            await fs.promises.mkdir(dest, { recursive: true });
+            for (const entry of entries) {
+                const srcPath = path.join(src, entry.name);
+                const destPath = path.join(dest, entry.name);
+                if (entry.isDirectory()) {
+                    await copyRecursive(srcPath, destPath);
+                } else if (entry.name !== 'index.html') {
+                    await fs.promises.copyFile(srcPath, destPath);
+                }
+            }
+        };
+        await copyRecursive(publicDir, distDir);
+        logger.log('green', 'Static assets copied.');
+    }
+
+    @A_Concept.Load()
+    async preLoadBuild(
+        @A_Inject(A_Logger) logger: A_Logger,
+        @A_Inject(A_Config) config: A_Config
+    ) {
+        await this.build(logger, config);
+    }
+
+    @A_Concept.Start()
+    async startStaticServer(
+        @A_Inject(A_Logger) logger: A_Logger,
+        @A_Inject(A_Config) config: A_Config
+    ) {
+        this.server = http.createServer(this.serveStaticFiles.bind(this));
+        const PORT = config.get('PORT') || 8083;
+        this.server.listen(PORT, () => {
+            logger.log('green', `Component Styles example running at http://localhost:${PORT}`);
+        });
+    }
+
+    protected async serveStaticFiles(
+        req: http.IncomingMessage,
+        res: http.ServerResponse,
+    ) {
+        const url = req.url || '/';
+        let filePath = path.join(__dirname, '../dist', url === '/' ? 'index.html' : url);
+
+        const logger = this.scope.resolve<A_Logger>(A_Logger)!;
+        logger.log('blue', `Serving: ${filePath}`);
+
+        const mimeTypes: Record<string, string> = {
+            '.html': 'text/html',
+            '.js':   'text/javascript',
+            '.css':  'text/css',
+            '.json': 'application/json',
+            '.png':  'image/png',
+            '.svg':  'image/svg+xml',
+        };
+        const ext = path.extname(filePath).toLowerCase();
+        const contentType = mimeTypes[ext] || 'application/octet-stream';
+
+        if (!fs.existsSync(filePath)) {
+            filePath = path.join(__dirname, '../dist', 'index.html');
+        }
+
+        fs.readFile(filePath, (err, content) => {
+            if (err) {
+                res.writeHead(500);
+                res.end(`Server Error: ${err.code}`, 'utf-8');
+            } else {
+                res.writeHead(200, { 'Content-Type': contentType });
+                res.end(content, 'utf-8');
+            }
+        });
+    }
+}

package/examples/component-styles/dist/index.html

@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>ARE – Component Styles</title>
+  <style>
+    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
+
+    body {
+      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+      background: #f4f6f9;
+      min-height: 100vh;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+  </style>
+</head>
+<body>
+  <are-root id="app" default="app-page"></are-root>
+
+  <script type="module" src="/mpq29j47-owas2v.js"></script>
+</body>
+</html>