@adaas/are-html 0.0.2 → 0.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +4 -4
- package/dist/browser/index.d.mts +88 -5
- package/dist/browser/index.mjs +542 -176
- package/dist/browser/index.mjs.map +1 -1
- package/dist/node/attributes/AreBinding.attribute.js +17 -4
- package/dist/node/attributes/AreBinding.attribute.js.map +1 -1
- package/dist/node/attributes/AreBinding.attribute.mjs +10 -3
- package/dist/node/attributes/AreBinding.attribute.mjs.map +1 -1
- package/dist/node/attributes/AreDirective.attribute.js +17 -4
- package/dist/node/attributes/AreDirective.attribute.js.map +1 -1
- package/dist/node/attributes/AreDirective.attribute.mjs +10 -3
- package/dist/node/attributes/AreDirective.attribute.mjs.map +1 -1
- package/dist/node/attributes/AreEvent.attribute.js +17 -4
- package/dist/node/attributes/AreEvent.attribute.js.map +1 -1
- package/dist/node/attributes/AreEvent.attribute.mjs +10 -3
- package/dist/node/attributes/AreEvent.attribute.mjs.map +1 -1
- package/dist/node/attributes/AreStatic.attribute.js +17 -4
- package/dist/node/attributes/AreStatic.attribute.js.map +1 -1
- package/dist/node/attributes/AreStatic.attribute.mjs +10 -3
- package/dist/node/attributes/AreStatic.attribute.mjs.map +1 -1
- package/dist/node/directives/AreDirectiveFor.directive.d.mts +8 -0
- package/dist/node/directives/AreDirectiveFor.directive.d.ts +8 -0
- package/dist/node/directives/AreDirectiveFor.directive.js +78 -33
- package/dist/node/directives/AreDirectiveFor.directive.js.map +1 -1
- package/dist/node/directives/AreDirectiveFor.directive.mjs +78 -33
- package/dist/node/directives/AreDirectiveFor.directive.mjs.map +1 -1
- package/dist/node/directives/AreDirectiveIf.directive.d.mts +18 -0
- package/dist/node/directives/AreDirectiveIf.directive.d.ts +18 -0
- package/dist/node/directives/AreDirectiveIf.directive.js +10 -3
- package/dist/node/directives/AreDirectiveIf.directive.js.map +1 -1
- package/dist/node/directives/AreDirectiveIf.directive.mjs +10 -3
- package/dist/node/directives/AreDirectiveIf.directive.mjs.map +1 -1
- package/dist/node/engine/AreHTML.compiler.d.mts +2 -2
- package/dist/node/engine/AreHTML.compiler.d.ts +2 -2
- package/dist/node/engine/AreHTML.compiler.js +57 -29
- package/dist/node/engine/AreHTML.compiler.js.map +1 -1
- package/dist/node/engine/AreHTML.compiler.mjs +58 -30
- package/dist/node/engine/AreHTML.compiler.mjs.map +1 -1
- package/dist/node/engine/AreHTML.constants.d.mts +53 -1
- package/dist/node/engine/AreHTML.constants.d.ts +53 -1
- package/dist/node/engine/AreHTML.constants.js +100 -0
- package/dist/node/engine/AreHTML.constants.js.map +1 -1
- package/dist/node/engine/AreHTML.constants.mjs +93 -0
- package/dist/node/engine/AreHTML.constants.mjs.map +1 -1
- package/dist/node/engine/AreHTML.context.d.mts +6 -2
- package/dist/node/engine/AreHTML.context.d.ts +6 -2
- package/dist/node/engine/AreHTML.context.js +42 -7
- package/dist/node/engine/AreHTML.context.js.map +1 -1
- package/dist/node/engine/AreHTML.context.mjs +35 -6
- package/dist/node/engine/AreHTML.context.mjs.map +1 -1
- package/dist/node/engine/AreHTML.engine.js +10 -7
- package/dist/node/engine/AreHTML.engine.js.map +1 -1
- package/dist/node/engine/AreHTML.engine.mjs +10 -7
- package/dist/node/engine/AreHTML.engine.mjs.map +1 -1
- package/dist/node/engine/AreHTML.interpreter.js +155 -43
- package/dist/node/engine/AreHTML.interpreter.js.map +1 -1
- package/dist/node/engine/AreHTML.interpreter.mjs +155 -43
- package/dist/node/engine/AreHTML.interpreter.mjs.map +1 -1
- package/dist/node/engine/AreHTML.lifecycle.js +17 -12
- package/dist/node/engine/AreHTML.lifecycle.js.map +1 -1
- package/dist/node/engine/AreHTML.lifecycle.mjs +9 -2
- package/dist/node/engine/AreHTML.lifecycle.mjs.map +1 -1
- package/dist/node/engine/AreHTML.tokenizer.js +14 -9
- package/dist/node/engine/AreHTML.tokenizer.js.map +1 -1
- package/dist/node/engine/AreHTML.tokenizer.mjs +10 -3
- package/dist/node/engine/AreHTML.tokenizer.mjs.map +1 -1
- package/dist/node/engine/AreHTML.transformer.js +13 -8
- package/dist/node/engine/AreHTML.transformer.js.map +1 -1
- package/dist/node/engine/AreHTML.transformer.mjs +9 -2
- package/dist/node/engine/AreHTML.transformer.mjs.map +1 -1
- package/dist/node/index.d.mts +2 -1
- package/dist/node/index.d.ts +2 -1
- package/dist/node/index.js +3 -3
- package/dist/node/index.mjs +1 -1
- package/dist/node/instructions/AddAttribute.instruction.js +3 -4
- package/dist/node/instructions/AddAttribute.instruction.js.map +1 -1
- package/dist/node/instructions/AddAttribute.instruction.mjs +3 -4
- package/dist/node/instructions/AddAttribute.instruction.mjs.map +1 -1
- package/dist/node/instructions/AddComment.instruction.js +3 -4
- package/dist/node/instructions/AddComment.instruction.js.map +1 -1
- package/dist/node/instructions/AddComment.instruction.mjs +3 -4
- package/dist/node/instructions/AddComment.instruction.mjs.map +1 -1
- package/dist/node/instructions/AddElement.instruction.js +3 -4
- package/dist/node/instructions/AddElement.instruction.js.map +1 -1
- package/dist/node/instructions/AddElement.instruction.mjs +3 -4
- package/dist/node/instructions/AddElement.instruction.mjs.map +1 -1
- package/dist/node/instructions/AddInterpolation.instruction.js +3 -4
- package/dist/node/instructions/AddInterpolation.instruction.js.map +1 -1
- package/dist/node/instructions/AddInterpolation.instruction.mjs +3 -4
- package/dist/node/instructions/AddInterpolation.instruction.mjs.map +1 -1
- package/dist/node/instructions/AddListener.instruction.js +3 -4
- package/dist/node/instructions/AddListener.instruction.js.map +1 -1
- package/dist/node/instructions/AddListener.instruction.mjs +3 -4
- package/dist/node/instructions/AddListener.instruction.mjs.map +1 -1
- package/dist/node/instructions/AddStyle.instruction.js +3 -4
- package/dist/node/instructions/AddStyle.instruction.js.map +1 -1
- package/dist/node/instructions/AddStyle.instruction.mjs +3 -4
- package/dist/node/instructions/AddStyle.instruction.mjs.map +1 -1
- package/dist/node/instructions/AddText.instruction.js +3 -4
- package/dist/node/instructions/AddText.instruction.js.map +1 -1
- package/dist/node/instructions/AddText.instruction.mjs +3 -4
- package/dist/node/instructions/AddText.instruction.mjs.map +1 -1
- package/dist/node/lib/AreDirective/AreDirective.component.js +5 -0
- package/dist/node/lib/AreDirective/AreDirective.component.js.map +1 -1
- package/dist/node/lib/AreDirective/AreDirective.component.mjs +5 -0
- package/dist/node/lib/AreDirective/AreDirective.component.mjs.map +1 -1
- package/dist/node/lib/AreHTMLAttribute/AreHTML.attribute.js +17 -4
- package/dist/node/lib/AreHTMLAttribute/AreHTML.attribute.js.map +1 -1
- package/dist/node/lib/AreHTMLAttribute/AreHTML.attribute.mjs +10 -3
- package/dist/node/lib/AreHTMLAttribute/AreHTML.attribute.mjs.map +1 -1
- package/dist/node/lib/AreHTMLNode/AreHTMLNode.js +3 -4
- package/dist/node/lib/AreHTMLNode/AreHTMLNode.js.map +1 -1
- package/dist/node/lib/AreHTMLNode/AreHTMLNode.mjs +3 -4
- package/dist/node/lib/AreHTMLNode/AreHTMLNode.mjs.map +1 -1
- package/dist/node/lib/AreRoot/AreRoot.component.js +3 -4
- package/dist/node/lib/AreRoot/AreRoot.component.js.map +1 -1
- package/dist/node/lib/AreRoot/AreRoot.component.mjs +3 -4
- package/dist/node/lib/AreRoot/AreRoot.component.mjs.map +1 -1
- package/dist/node/lib/{AreWatcher/AreWatcher.component.d.mts → AreRouteWatcher/AreRouteWatcher.component.d.mts} +2 -2
- package/dist/node/lib/{AreWatcher/AreWatcher.component.d.ts → AreRouteWatcher/AreRouteWatcher.component.d.ts} +2 -2
- package/dist/node/lib/{AreWatcher/AreWatcher.component.js → AreRouteWatcher/AreRouteWatcher.component.js} +9 -10
- package/dist/node/lib/AreRouteWatcher/AreRouteWatcher.component.js.map +1 -0
- package/dist/node/lib/{AreWatcher/AreWatcher.component.mjs → AreRouteWatcher/AreRouteWatcher.component.mjs} +10 -11
- package/dist/node/lib/AreRouteWatcher/AreRouteWatcher.component.mjs.map +1 -0
- package/dist/node/lib/AreStyle/AreStyle.context.js +17 -4
- package/dist/node/lib/AreStyle/AreStyle.context.js.map +1 -1
- package/dist/node/lib/AreStyle/AreStyle.context.mjs +10 -3
- package/dist/node/lib/AreStyle/AreStyle.context.mjs.map +1 -1
- package/dist/node/nodes/AreComment.js +17 -4
- package/dist/node/nodes/AreComment.js.map +1 -1
- package/dist/node/nodes/AreComment.mjs +10 -3
- package/dist/node/nodes/AreComment.mjs.map +1 -1
- package/dist/node/nodes/AreComponent.js +3 -4
- package/dist/node/nodes/AreComponent.js.map +1 -1
- package/dist/node/nodes/AreComponent.mjs +3 -4
- package/dist/node/nodes/AreComponent.mjs.map +1 -1
- package/dist/node/nodes/AreInterpolation.js +17 -4
- package/dist/node/nodes/AreInterpolation.js.map +1 -1
- package/dist/node/nodes/AreInterpolation.mjs +10 -3
- package/dist/node/nodes/AreInterpolation.mjs.map +1 -1
- package/dist/node/nodes/AreRoot.js +3 -4
- package/dist/node/nodes/AreRoot.js.map +1 -1
- package/dist/node/nodes/AreRoot.mjs +3 -4
- package/dist/node/nodes/AreRoot.mjs.map +1 -1
- package/dist/node/nodes/AreText.js +17 -4
- package/dist/node/nodes/AreText.js.map +1 -1
- package/dist/node/nodes/AreText.mjs +10 -3
- package/dist/node/nodes/AreText.mjs.map +1 -1
- package/dist/node/signals/AreRoute.signal.js +18 -5
- package/dist/node/signals/AreRoute.signal.js.map +1 -1
- package/dist/node/signals/AreRoute.signal.mjs +10 -3
- package/dist/node/signals/AreRoute.signal.mjs.map +1 -1
- package/docs/SYNTAX.md +714 -0
- package/docs/arehtml.monaco.json +235 -0
- package/docs/arehtml.monaco.ts +119 -0
- package/examples/dashboard/dist/index.html +1 -1
- package/examples/dashboard/dist/mpioi5ab-8c3oa9.js +13674 -0
- package/examples/jumpstart/dist/index.html +1 -1
- package/examples/{dashboard/dist/mnzfypsd-6zjt7w.js → jumpstart/dist/mor90p6y-0plg7g.js} +1869 -1926
- package/examples/jumpstart/dist/{mnpl1g4i-nobz9g.js → mor90p7p-1898bz.js} +2797 -2282
- package/examples/jumpstart/src/components/List.component.ts +14 -13
- package/examples/jumpstart/src/concept.ts +5 -4
- package/jest.config.ts +1 -1
- package/package.json +10 -6
- package/src/attributes/AreBinding.attribute.ts +5 -0
- package/src/attributes/AreDirective.attribute.ts +5 -0
- package/src/attributes/AreEvent.attribute.ts +5 -0
- package/src/attributes/AreStatic.attribute.ts +5 -0
- package/src/directives/AreDirectiveFor.directive.ts +97 -60
- package/src/directives/AreDirectiveIf.directive.ts +37 -15
- package/src/engine/AreHTML.compiler.ts +64 -36
- package/src/engine/AreHTML.constants.ts +144 -0
- package/src/engine/AreHTML.context.ts +33 -4
- package/src/engine/AreHTML.engine.ts +12 -7
- package/src/engine/AreHTML.interpreter.ts +195 -68
- package/src/engine/AreHTML.lifecycle.ts +5 -0
- package/src/engine/AreHTML.tokenizer.ts +6 -1
- package/src/engine/AreHTML.transformer.ts +5 -0
- package/src/index.ts +2 -2
- package/src/instructions/AddAttribute.instruction.ts +3 -4
- package/src/instructions/AddComment.instruction.ts +3 -4
- package/src/instructions/AddElement.instruction.ts +3 -4
- package/src/instructions/AddInterpolation.instruction.ts +3 -4
- package/src/instructions/AddListener.instruction.ts +3 -4
- package/src/instructions/AddStyle.instruction.ts +3 -4
- package/src/instructions/AddText.instruction.ts +3 -4
- package/src/lib/AreDirective/AreDirective.component.ts +5 -0
- package/src/lib/AreHTMLAttribute/AreHTML.attribute.ts +5 -0
- package/src/lib/AreHTMLNode/AreHTMLNode.ts +3 -4
- package/src/lib/AreRoot/AreRoot.component.ts +3 -4
- package/src/lib/{AreWatcher/AreWatcher.component.ts → AreRouteWatcher/AreRouteWatcher.component.ts} +5 -6
- package/src/lib/AreStyle/AreStyle.context.ts +5 -0
- package/src/nodes/AreComment.ts +5 -0
- package/src/nodes/AreComponent.ts +3 -4
- package/src/nodes/AreInterpolation.ts +5 -0
- package/src/nodes/AreRoot.ts +3 -4
- package/src/nodes/AreText.ts +5 -0
- package/src/signals/AreRoute.signal.ts +5 -0
- package/dist/node/lib/AreWatcher/AreWatcher.component.js.map +0 -1
- package/dist/node/lib/AreWatcher/AreWatcher.component.mjs.map +0 -1
|
@@ -9,8 +9,13 @@ import { AreDirectiveAttribute } from "@adaas/are-html/attributes/AreDirective.a
|
|
|
9
9
|
import { AreDirectiveFeatures } from "@adaas/are-html/directive/AreDirective.constants";
|
|
10
10
|
import { AreHTMLEngineContext } from "./AreHTML.context";
|
|
11
11
|
import { AreHTMLNode } from "../lib/AreHTMLNode/AreHTMLNode";
|
|
12
|
+
import { A_Frame } from "@adaas/a-frame/core";
|
|
12
13
|
|
|
13
14
|
|
|
15
|
+
@A_Frame.Define({
|
|
16
|
+
namespace: 'a-are-html',
|
|
17
|
+
description: 'HTML-specific lifecycle handler extending AreLifecycle. Wires DOM-aware init hooks for component nodes, root nodes, interpolations, text nodes, and directive attributes to the ARE rendering pipeline, connecting each entity to its HTML engine context and priming the scene for subsequent compilation and interpretation.'
|
|
18
|
+
})
|
|
14
19
|
export class AreHTMLLifecycle extends AreLifecycle {
|
|
15
20
|
|
|
16
21
|
@AreLifecycle.Init(AreComponentNode)
|
|
@@ -8,11 +8,16 @@ import { AreEventAttribute } from "@adaas/are-html/attributes/AreEvent.attribute
|
|
|
8
8
|
import { AreBindingAttribute } from "@adaas/are-html/attributes/AreBinding.attribute";
|
|
9
9
|
import { AreStaticAttribute } from "@adaas/are-html/attributes/AreStatic.attribute";
|
|
10
10
|
import { AreHTMLAttribute } from "../lib/AreHTMLAttribute/AreHTML.attribute";
|
|
11
|
+
import { A_Frame } from "@adaas/a-frame/core";
|
|
11
12
|
|
|
12
13
|
|
|
14
|
+
@A_Frame.Define({
|
|
15
|
+
namespace: 'a-are-html',
|
|
16
|
+
description: 'HTML-specific tokenizer extending AreTokenizer. Parses raw HTML template strings into AreHTMLNode trees by scanning element tags and resolving directive ($), event (@), binding (:), and static attributes to their typed attribute classes, constructing AreComponentNode and AreRootNode instances where required.'
|
|
17
|
+
})
|
|
13
18
|
export class AreHTMLTokenizer extends AreTokenizer {
|
|
14
19
|
|
|
15
|
-
ATTR_PATTERN = /([$:@]?[\w
|
|
20
|
+
ATTR_PATTERN = /([$:@]?[\w.-]+)(?:\s*=\s*(?:"([^"]*)"|'([^']*)'|([^\s>/"'=]+)))?/g
|
|
16
21
|
|
|
17
22
|
|
|
18
23
|
@A_Feature.Extend({
|
|
@@ -3,8 +3,13 @@ import { A_Logger } from "@adaas/a-utils/a-logger";
|
|
|
3
3
|
import { AreAttributeFeatures, AreTransformer, AreStore } from "@adaas/are";
|
|
4
4
|
import { AreDirectiveAttribute } from "@adaas/are-html/attributes/AreDirective.attribute";
|
|
5
5
|
import { AreDirectiveFeatures } from "@adaas/are-html/directive/AreDirective.constants";
|
|
6
|
+
import { A_Frame } from "@adaas/a-frame/core";
|
|
6
7
|
|
|
7
8
|
|
|
9
|
+
@A_Frame.Define({
|
|
10
|
+
namespace: 'a-are-html',
|
|
11
|
+
description: 'HTML-specific transformer extending AreTransformer. Handles directive-attribute structural rewrites before compilation — sorting directives by declared priority and expanding compound directive expressions — so the compiler receives a clean, ordered AreHTMLNode tree ready for instruction emission.'
|
|
12
|
+
})
|
|
8
13
|
export class AreHTMLTransformer extends AreTransformer {
|
|
9
14
|
|
|
10
15
|
@A_Feature.Extend({
|
package/src/index.ts
CHANGED
|
@@ -75,6 +75,6 @@ export * from './lib/AreStyle/AreStyle.context';
|
|
|
75
75
|
export * from './lib/AreStyle/AreStyle.types';
|
|
76
76
|
|
|
77
77
|
// ─────────────────────────────────────────────────────────────────────────────
|
|
78
|
-
// ── Lib /
|
|
78
|
+
// ── Lib / AreRouteWatcher ─────────────────────────────────────────────────────────
|
|
79
79
|
// ─────────────────────────────────────────────────────────────────────────────
|
|
80
|
-
export * from './lib/
|
|
80
|
+
export * from './lib/AreRouteWatcher/AreRouteWatcher.component';
|
|
@@ -1,12 +1,11 @@
|
|
|
1
|
-
import { A_Frame } from "@adaas/a-frame"
|
|
1
|
+
import { A_Frame } from "@adaas/a-frame/core"
|
|
2
2
|
import { AreDeclaration, AreMutation, AreInstructionSerialized } from "@adaas/are";
|
|
3
3
|
import { AreHtmlAddAttributeInstructionPayload } from "./AreHTML.instructions.types";
|
|
4
4
|
import { AreHTMLInstructions } from "./AreHTML.instructions.constants";
|
|
5
5
|
|
|
6
6
|
|
|
7
|
-
@A_Frame.
|
|
8
|
-
namespace: '
|
|
9
|
-
name: 'AddAttributeInstruction',
|
|
7
|
+
@A_Frame.Define({
|
|
8
|
+
namespace: 'a-are-html',
|
|
10
9
|
description: 'Sets an attribute on an HTML element. Apply calls setAttribute; revert calls removeAttribute.'
|
|
11
10
|
})
|
|
12
11
|
export class AddAttributeInstruction extends AreMutation<AreHtmlAddAttributeInstructionPayload> {
|
|
@@ -1,12 +1,11 @@
|
|
|
1
|
-
import { A_Frame } from "@adaas/a-frame"
|
|
1
|
+
import { A_Frame } from "@adaas/a-frame/core"
|
|
2
2
|
import { AreDeclaration, AreInstructionSerialized } from "@adaas/are";
|
|
3
3
|
import { AreHtmlAddCommentInstructionPayload } from "./AreHTML.instructions.types";
|
|
4
4
|
import { AreHTMLInstructions } from "./AreHTML.instructions.constants";
|
|
5
5
|
|
|
6
6
|
|
|
7
|
-
@A_Frame.
|
|
8
|
-
namespace: '
|
|
9
|
-
name: 'AddCommentInstruction',
|
|
7
|
+
@A_Frame.Define({
|
|
8
|
+
namespace: 'a-are-html',
|
|
10
9
|
description: 'Appends a comment node to an element. Apply creates the comment node; revert removes it. Content can be a static string or a dynamic getter for interpolations.'
|
|
11
10
|
})
|
|
12
11
|
export class AddCommentInstruction extends AreDeclaration<AreHtmlAddCommentInstructionPayload> {
|
|
@@ -1,12 +1,11 @@
|
|
|
1
|
-
import { A_Frame } from "@adaas/a-frame"
|
|
1
|
+
import { A_Frame } from "@adaas/a-frame/core"
|
|
2
2
|
import { AreDeclaration, AreInstructionSerialized } from "@adaas/are";
|
|
3
3
|
import { AreHtmlAddElementInstructionPayload } from "./AreHTML.instructions.types";
|
|
4
4
|
import { AreHTMLInstructions } from "./AreHTML.instructions.constants";
|
|
5
5
|
|
|
6
6
|
|
|
7
|
-
@A_Frame.
|
|
8
|
-
namespace: '
|
|
9
|
-
name: 'AddElementInstruction',
|
|
7
|
+
@A_Frame.Define({
|
|
8
|
+
namespace: 'a-are-html',
|
|
10
9
|
description: 'Creates a new HTML element in the DOM. Apply creates the element; revert removes it.'
|
|
11
10
|
})
|
|
12
11
|
export class AddElementInstruction extends AreDeclaration<AreHtmlAddElementInstructionPayload> {
|
|
@@ -1,12 +1,11 @@
|
|
|
1
|
-
import { A_Frame } from "@adaas/a-frame"
|
|
1
|
+
import { A_Frame } from "@adaas/a-frame/core"
|
|
2
2
|
import { AreDeclaration, AreMutation, AreInstructionSerialized } from "@adaas/are";
|
|
3
3
|
import { AreHtmlAddInterpolationInstructionPayload } from "./AreHTML.instructions.types";
|
|
4
4
|
import { AreHTMLInstructions } from "./AreHTML.instructions.constants";
|
|
5
5
|
|
|
6
6
|
|
|
7
|
-
@A_Frame.
|
|
8
|
-
namespace: '
|
|
9
|
-
name: 'AddInterpolationInstruction',
|
|
7
|
+
@A_Frame.Define({
|
|
8
|
+
namespace: 'a-are-html',
|
|
10
9
|
description: 'Appends a reactive text node whose content is resolved dynamically from the store. Apply creates the text node with the getter; revert removes it.'
|
|
11
10
|
})
|
|
12
11
|
export class AddInterpolationInstruction extends AreMutation<AreHtmlAddInterpolationInstructionPayload> {
|
|
@@ -1,12 +1,11 @@
|
|
|
1
|
-
import { A_Frame } from "@adaas/a-frame"
|
|
1
|
+
import { A_Frame } from "@adaas/a-frame/core"
|
|
2
2
|
import { AreDeclaration, AreMutation, AreInstructionSerialized } from "@adaas/are";
|
|
3
3
|
import { AreHtmlAddListenerInstructionPayload } from "./AreHTML.instructions.types";
|
|
4
4
|
import { AreHTMLInstructions } from "./AreHTML.instructions.constants";
|
|
5
5
|
|
|
6
6
|
|
|
7
|
-
@A_Frame.
|
|
8
|
-
namespace: '
|
|
9
|
-
name: 'AddListenerInstruction',
|
|
7
|
+
@A_Frame.Define({
|
|
8
|
+
namespace: 'a-are-html',
|
|
10
9
|
description: 'Attaches a DOM event listener to an element. Apply calls addEventListener; revert calls removeEventListener.'
|
|
11
10
|
})
|
|
12
11
|
export class AddListenerInstruction extends AreMutation<AreHtmlAddListenerInstructionPayload> {
|
|
@@ -1,12 +1,11 @@
|
|
|
1
|
-
import { A_Frame } from "@adaas/a-frame"
|
|
1
|
+
import { A_Frame } from "@adaas/a-frame/core"
|
|
2
2
|
import { AreDeclaration, AreMutation, AreInstructionSerialized } from "@adaas/are";
|
|
3
3
|
import { AreHtmlAddStyleInstructionPayload } from "./AreHTML.instructions.types";
|
|
4
4
|
import { AreHTMLInstructions } from "./AreHTML.instructions.constants";
|
|
5
5
|
|
|
6
6
|
|
|
7
|
-
@A_Frame.
|
|
8
|
-
namespace: '
|
|
9
|
-
name: 'AddStyleInstruction',
|
|
7
|
+
@A_Frame.Define({
|
|
8
|
+
namespace: 'a-are-html',
|
|
10
9
|
description: 'Sets an inline CSS style property on an element. Apply sets the property; revert removes it.'
|
|
11
10
|
})
|
|
12
11
|
export class AddStyleInstruction extends AreMutation<AreHtmlAddStyleInstructionPayload> {
|
|
@@ -1,12 +1,11 @@
|
|
|
1
|
-
import { A_Frame } from "@adaas/a-frame"
|
|
1
|
+
import { A_Frame } from "@adaas/a-frame/core"
|
|
2
2
|
import { AreDeclaration, AreInstructionSerialized } from "@adaas/are";
|
|
3
3
|
import { AreHtmlAddTextInstructionPayload } from "./AreHTML.instructions.types";
|
|
4
4
|
import { AreHTMLInstructions } from "./AreHTML.instructions.constants";
|
|
5
5
|
|
|
6
6
|
|
|
7
|
-
@A_Frame.
|
|
8
|
-
namespace: '
|
|
9
|
-
name: 'AddTextInstruction',
|
|
7
|
+
@A_Frame.Define({
|
|
8
|
+
namespace: 'a-are-html',
|
|
10
9
|
description: 'Appends a text node to an element. Apply creates the text node; revert removes it. Content can be a static string or a dynamic getter for interpolations.'
|
|
11
10
|
})
|
|
12
11
|
export class AddTextInstruction extends AreDeclaration<AreHtmlAddTextInstructionPayload> {
|
|
@@ -3,8 +3,13 @@ import { A_Logger } from "@adaas/a-utils/a-logger";
|
|
|
3
3
|
import type { AreDirectiveAttribute } from "@adaas/are-html/attributes/AreDirective.attribute";
|
|
4
4
|
import { AreDirectiveMeta } from "./AreDirective.meta";
|
|
5
5
|
import { AreDirectiveFeatures } from "./AreDirective.constants";
|
|
6
|
+
import { A_Frame } from "@adaas/a-frame/core";
|
|
6
7
|
|
|
7
8
|
|
|
9
|
+
@A_Frame.Define({
|
|
10
|
+
namespace: 'a-are-html',
|
|
11
|
+
description: 'Abstract base component for all ARE directive types. Provides lifecycle decorators (Transform, Compile, Apply, Revert, Priority) that subclasses hook into at each pipeline stage. Subclasses implement Transform to rewrite the attribute or template node, Compile to emit scene instructions, Apply to activate them in the DOM, and Revert to undo them on removal.'
|
|
12
|
+
})
|
|
8
13
|
@A_Meta.Define(AreDirectiveMeta)
|
|
9
14
|
export class AreDirective extends A_Component {
|
|
10
15
|
|
|
@@ -1,9 +1,14 @@
|
|
|
1
1
|
import { AreAttribute } from "@adaas/are";
|
|
2
2
|
import { AreHTMLNode } from "../AreHTMLNode/AreHTMLNode";
|
|
3
|
+
import { A_Frame } from "@adaas/a-frame/core";
|
|
3
4
|
|
|
4
5
|
|
|
5
6
|
|
|
6
7
|
|
|
8
|
+
@A_Frame.Define({
|
|
9
|
+
namespace: 'a-are-html',
|
|
10
|
+
description: 'Base class for all typed HTML attributes in the ARE framework. Provides typed access to the owning AreHTMLNode via the scope injector so that attribute subclasses can inspect host-node properties and resolve store bindings during transformation, compilation, and lifecycle phases.'
|
|
11
|
+
})
|
|
7
12
|
export class AreHTMLAttribute extends AreAttribute {
|
|
8
13
|
|
|
9
14
|
get owner(): AreHTMLNode {
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { A_Context, } from "@adaas/a-concept";
|
|
2
|
-
import { A_Frame } from "@adaas/a-frame";
|
|
2
|
+
import { A_Frame } from "@adaas/a-frame/core";
|
|
3
3
|
import { AreNode} from "@adaas/are";
|
|
4
4
|
import { AreBindingAttribute } from "@adaas/are-html/attributes/AreBinding.attribute";
|
|
5
5
|
import { AreDirectiveAttribute } from "@adaas/are-html/attributes/AreDirective.attribute";
|
|
@@ -11,9 +11,8 @@ import { AreDirectiveMeta } from "@adaas/are-html/directive/AreDirective.meta";
|
|
|
11
11
|
|
|
12
12
|
|
|
13
13
|
|
|
14
|
-
@A_Frame.
|
|
15
|
-
namespace: '
|
|
16
|
-
name: 'AreHTMLNode',
|
|
14
|
+
@A_Frame.Define({
|
|
15
|
+
namespace: 'a-are-html',
|
|
17
16
|
description: 'AreHTMLNode represents a node in the HTML structure. It extends the base AreNode and includes properties and methods specific to HTML nodes, such as handling attributes, directives, events, and styles.'
|
|
18
17
|
})
|
|
19
18
|
export class AreHTMLNode extends AreNode {
|
|
@@ -1,13 +1,12 @@
|
|
|
1
1
|
import { A_Caller, A_Context, A_FormatterHelper, A_Inject, } from "@adaas/a-concept";
|
|
2
|
-
import { A_Frame } from "@adaas/a-frame";
|
|
2
|
+
import { A_Frame } from "@adaas/a-frame/core";
|
|
3
3
|
import { A_Logger } from "@adaas/a-utils/a-logger";
|
|
4
4
|
import { A_SignalVector } from "@adaas/a-utils/a-signal";
|
|
5
5
|
import { Are, ArePropDefinition, AreStore, AreNode, AreSignals, AreSignalsMeta, AreSignalsContext, AreRoute } from "@adaas/are";
|
|
6
6
|
|
|
7
7
|
|
|
8
|
-
@A_Frame.
|
|
9
|
-
namespace: '
|
|
10
|
-
name: 'AreRoot',
|
|
8
|
+
@A_Frame.Define({
|
|
9
|
+
namespace: 'a-are-html',
|
|
11
10
|
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.'
|
|
12
11
|
})
|
|
13
12
|
export class AreRoot extends Are {
|
package/src/lib/{AreWatcher/AreWatcher.component.ts → AreRouteWatcher/AreRouteWatcher.component.ts}
RENAMED
|
@@ -1,12 +1,11 @@
|
|
|
1
1
|
import { A_Component } from "@adaas/a-concept";
|
|
2
|
-
import { A_Frame } from "@adaas/a-frame";
|
|
2
|
+
import { A_Frame } from "@adaas/a-frame/core";
|
|
3
3
|
|
|
4
|
-
@A_Frame.
|
|
5
|
-
namespace: '
|
|
6
|
-
|
|
7
|
-
description: 'AreWatcher is a component that observes browser navigation events (history pushState, replaceState, and popstate) and notifies registered handlers when the URL changes, enabling client-side routing and reactive route-based rendering within the ARE framework.'
|
|
4
|
+
@A_Frame.Define({
|
|
5
|
+
namespace: 'a-are-html',
|
|
6
|
+
description: 'AreRouteWatcher is a component that observes browser navigation events (history pushState, replaceState, and popstate) and notifies registered handlers when the URL changes, enabling client-side routing and reactive route-based rendering within the ARE framework.'
|
|
8
7
|
})
|
|
9
|
-
export class
|
|
8
|
+
export class AreRouteWatcher extends A_Component {
|
|
10
9
|
|
|
11
10
|
private readonly handlers: Set<(url: URL) => void> = new Set();
|
|
12
11
|
private current: URL = new URL(window.location.href);
|
|
@@ -1,6 +1,11 @@
|
|
|
1
1
|
import { A_Fragment, ASEID } from "@adaas/a-concept";
|
|
2
|
+
import { A_Frame } from "@adaas/a-frame/core";
|
|
2
3
|
|
|
3
4
|
|
|
5
|
+
@A_Frame.Define({
|
|
6
|
+
namespace: 'a-are-html',
|
|
7
|
+
description: 'Context fragment that holds the resolved CSS style rules string for a component scope. Populated during lifecycle initialisation and read by the compiler when emitting AddStyle instructions for inline styles declared on the component host element.'
|
|
8
|
+
})
|
|
4
9
|
export class AreStyle extends A_Fragment {
|
|
5
10
|
|
|
6
11
|
styles!: string;
|
package/src/nodes/AreComment.ts
CHANGED
|
@@ -1,6 +1,11 @@
|
|
|
1
1
|
import { AreNodeNewProps } from "@adaas/are";
|
|
2
2
|
import { AreHTMLNode } from "@adaas/are-html/node";
|
|
3
|
+
import { A_Frame } from "@adaas/a-frame/core";
|
|
3
4
|
|
|
5
|
+
@A_Frame.Define({
|
|
6
|
+
namespace: 'a-are-html',
|
|
7
|
+
description: 'Node type representing a comment node in the AreHTMLNode tree. Used as a stable DOM anchor by structural directives such as $if and $for that swap rendered content in and out, ensuring the parent container always has a consistent insertion point.'
|
|
8
|
+
})
|
|
4
9
|
export class AreComment extends AreHTMLNode {
|
|
5
10
|
|
|
6
11
|
|
|
@@ -1,12 +1,11 @@
|
|
|
1
1
|
import { A_FormatterHelper, } from "@adaas/a-concept";
|
|
2
|
-
import { A_Frame } from "@adaas/a-frame"
|
|
2
|
+
import { A_Frame } from "@adaas/a-frame/core"
|
|
3
3
|
import { Are } from "@adaas/are";
|
|
4
4
|
import { AreHTMLNode } from "@adaas/are-html/node";
|
|
5
5
|
|
|
6
6
|
|
|
7
|
-
@A_Frame.
|
|
8
|
-
namespace: '
|
|
9
|
-
name: 'AreComponentNode',
|
|
7
|
+
@A_Frame.Define({
|
|
8
|
+
namespace: 'a-are-html',
|
|
10
9
|
description: 'AreComponentNode represents a node in the scene graph that corresponds to a component. It extends the base AreNode and includes additional properties and methods specific to component nodes, such as handling attributes, bindings, directives, events, styles, and interpolations associated with the component.'
|
|
11
10
|
})
|
|
12
11
|
export class AreComponentNode extends AreHTMLNode {
|
|
@@ -1,7 +1,12 @@
|
|
|
1
1
|
import { AreNodeNewProps } from "@adaas/are";
|
|
2
2
|
import { AreHTMLNode } from "@adaas/are-html/node";
|
|
3
|
+
import { A_Frame } from "@adaas/a-frame/core";
|
|
3
4
|
|
|
4
5
|
|
|
6
|
+
@A_Frame.Define({
|
|
7
|
+
namespace: 'a-are-html',
|
|
8
|
+
description: 'Node type representing a reactive inline expression in the AreHTMLNode tree. Its content expression is resolved from the store at render time and kept live via an AddInterpolation instruction that updates the corresponding text node on each reactive cycle.'
|
|
9
|
+
})
|
|
5
10
|
export class AreInterpolation extends AreHTMLNode {
|
|
6
11
|
|
|
7
12
|
fromNew(newEntity: AreNodeNewProps): void {
|
package/src/nodes/AreRoot.ts
CHANGED
|
@@ -1,12 +1,11 @@
|
|
|
1
1
|
import { A_FormatterHelper, } from "@adaas/a-concept";
|
|
2
|
-
import { A_Frame } from "@adaas/a-frame"
|
|
2
|
+
import { A_Frame } from "@adaas/a-frame/core"
|
|
3
3
|
import { Are } from "@adaas/are";
|
|
4
4
|
import { AreHTMLNode } from "@adaas/are-html/node";
|
|
5
5
|
|
|
6
6
|
|
|
7
|
-
@A_Frame.
|
|
8
|
-
namespace: '
|
|
9
|
-
name: 'AreRootNode',
|
|
7
|
+
@A_Frame.Define({
|
|
8
|
+
namespace: 'a-are-html',
|
|
10
9
|
description: 'AreRootNode represents the root node in the scene graph. It extends the base AreHTMLNode and includes additional properties and methods specific to the root node, such as handling the root element and its associated component.'
|
|
11
10
|
})
|
|
12
11
|
export class AreRootNode extends AreHTMLNode {
|
package/src/nodes/AreText.ts
CHANGED
|
@@ -1,7 +1,12 @@
|
|
|
1
1
|
import { AreNodeNewProps } from "@adaas/are";
|
|
2
2
|
import { AreHTMLNode } from "@adaas/are-html/node";
|
|
3
|
+
import { A_Frame } from "@adaas/a-frame/core";
|
|
3
4
|
|
|
4
5
|
|
|
6
|
+
@A_Frame.Define({
|
|
7
|
+
namespace: 'a-are-html',
|
|
8
|
+
description: 'Node type representing a plain or partially-dynamic text segment in the AreHTMLNode tree. Emits an AddText instruction that sets or updates the corresponding DOM text node; the content may carry a store getter for any dynamic portion.'
|
|
9
|
+
})
|
|
5
10
|
export class AreText extends AreHTMLNode {
|
|
6
11
|
|
|
7
12
|
|
|
@@ -1,9 +1,14 @@
|
|
|
1
1
|
import { A_Route } from "@adaas/a-utils/a-route";
|
|
2
2
|
import { A_Signal } from "@adaas/a-utils/a-signal";
|
|
3
3
|
import { AreSignal } from "@adaas/are";
|
|
4
|
+
import { A_Frame } from "@adaas/a-frame/core";
|
|
4
5
|
|
|
5
6
|
|
|
6
7
|
|
|
8
|
+
@A_Frame.Define({
|
|
9
|
+
namespace: 'a-are-html',
|
|
10
|
+
description: 'ARE signal that carries an A_Route value. Dispatched by AreRouteWatcher on client-side navigation events (pushState, replaceState, popstate). The signal bus delivers it to all subscribed root nodes, triggering route-based conditional rendering across the component tree.'
|
|
11
|
+
})
|
|
7
12
|
export class AreRoute extends AreSignal<A_Route> {
|
|
8
13
|
|
|
9
14
|
constructor(path: string | RegExp) {
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/lib/AreWatcher/AreWatcher.component.ts"],"names":["AreWatcher","A_Component","A_Frame"],"mappings":"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","file":"AreWatcher.component.js","sourcesContent":["import { A_Component } from \"@adaas/a-concept\";\nimport { A_Frame } from \"@adaas/a-frame\";\n\n@A_Frame.Component({\n namespace: 'A-ARE',\n name: 'AreWatcher',\n description: 'AreWatcher is a component that observes browser navigation events (history pushState, replaceState, and popstate) and notifies registered handlers when the URL changes, enabling client-side routing and reactive route-based rendering within the ARE framework.'\n})\nexport class AreWatcher extends A_Component {\n\n private readonly handlers: Set<(url: URL) => void> = new Set();\n private current: URL = new URL(window.location.href);\n\n constructor() {\n super();\n this.patchHistory();\n this.attachListeners();\n }\n\n // ── Public ────────────────────────────────────────────────────────────────\n\n onChange(handler: (url: URL) => void): () => void {\n this.handlers.add(handler);\n return () => this.handlers.delete(handler); // returns unsubscribe fn\n }\n\n get url(): URL {\n return this.current;\n }\n\n destroy(): void {\n window.removeEventListener('popstate', this.onPopState);\n window.removeEventListener('hashchange', this.onHashChange);\n window.removeEventListener('urlchange', this.onURLChange);\n this.handlers.clear();\n }\n\n // ── Listeners ─────────────────────────────────────────────────────────────\n\n private onPopState = (): void => {\n this.notify();\n }\n\n private onHashChange = (): void => {\n this.notify();\n }\n\n private onURLChange = (): void => {\n this.notify();\n }\n\n private attachListeners(): void {\n window.addEventListener('popstate', this.onPopState);\n window.addEventListener('hashchange', this.onHashChange);\n window.addEventListener('urlchange', this.onURLChange); // custom event from patch\n }\n\n // ── Patch pushState / replaceState ────────────────────────────────────────\n\n private patchHistory(): void {\n const patch = (original: typeof history.pushState) =>\n function (this: History, ...args: Parameters<typeof history.pushState>) {\n original.apply(this, args);\n window.dispatchEvent(new Event('urlchange'));\n };\n\n history.pushState = patch(history.pushState);\n history.replaceState = patch(history.replaceState);\n }\n\n // ── Notify ────────────────────────────────────────────────────────────────\n\n private notify(): void {\n const next = new URL(window.location.href);\n\n if (next.href === this.current.href) return; // no actual change\n\n this.current = next;\n\n for (const handler of this.handlers) {\n handler(this.current);\n }\n }\n}"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/lib/AreWatcher/AreWatcher.component.ts"],"names":[],"mappings":"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","file":"AreWatcher.component.mjs","sourcesContent":["import { A_Component } from \"@adaas/a-concept\";\nimport { A_Frame } from \"@adaas/a-frame\";\n\n@A_Frame.Component({\n namespace: 'A-ARE',\n name: 'AreWatcher',\n description: 'AreWatcher is a component that observes browser navigation events (history pushState, replaceState, and popstate) and notifies registered handlers when the URL changes, enabling client-side routing and reactive route-based rendering within the ARE framework.'\n})\nexport class AreWatcher extends A_Component {\n\n private readonly handlers: Set<(url: URL) => void> = new Set();\n private current: URL = new URL(window.location.href);\n\n constructor() {\n super();\n this.patchHistory();\n this.attachListeners();\n }\n\n // ── Public ────────────────────────────────────────────────────────────────\n\n onChange(handler: (url: URL) => void): () => void {\n this.handlers.add(handler);\n return () => this.handlers.delete(handler); // returns unsubscribe fn\n }\n\n get url(): URL {\n return this.current;\n }\n\n destroy(): void {\n window.removeEventListener('popstate', this.onPopState);\n window.removeEventListener('hashchange', this.onHashChange);\n window.removeEventListener('urlchange', this.onURLChange);\n this.handlers.clear();\n }\n\n // ── Listeners ─────────────────────────────────────────────────────────────\n\n private onPopState = (): void => {\n this.notify();\n }\n\n private onHashChange = (): void => {\n this.notify();\n }\n\n private onURLChange = (): void => {\n this.notify();\n }\n\n private attachListeners(): void {\n window.addEventListener('popstate', this.onPopState);\n window.addEventListener('hashchange', this.onHashChange);\n window.addEventListener('urlchange', this.onURLChange); // custom event from patch\n }\n\n // ── Patch pushState / replaceState ────────────────────────────────────────\n\n private patchHistory(): void {\n const patch = (original: typeof history.pushState) =>\n function (this: History, ...args: Parameters<typeof history.pushState>) {\n original.apply(this, args);\n window.dispatchEvent(new Event('urlchange'));\n };\n\n history.pushState = patch(history.pushState);\n history.replaceState = patch(history.replaceState);\n }\n\n // ── Notify ────────────────────────────────────────────────────────────────\n\n private notify(): void {\n const next = new URL(window.location.href);\n\n if (next.href === this.current.href) return; // no actual change\n\n this.current = next;\n\n for (const handler of this.handlers) {\n handler(this.current);\n }\n }\n}"]}
|