tutuca 0.11.0 → 0.11.2

package/dist/tutuca-storybook.js

@@ -52,13 +52,6 @@ var Storybook = component({
       };
     }
   },
-  alter: {
-    // The sidebar render-each shows only visible groups (kept positional via `when`
-    // so a click resolves to the right group — see SidebarGroup.rowVisible).
-    groupVisible(_key, group) {
-      return group.visible;
-    }
-  },
   receive: {
     onApplyFilter(draft, value, ctx) {
       ctx.intent("persistState", [this.toUrlState({ sectionFilter: value }), this, false], {
@@ -160,6 +153,13 @@ var Storybook = component({
       setSelectedSectionFilter(draft, value);
     }
   },
+  alter: {
+    // The sidebar render-each shows only visible groups (kept positional via `when`
+    // so a click resolves to the right group — see SidebarGroup.rowVisible).
+    groupVisible(_key, group) {
+      return group.visible;
+    }
+  },
   view: html`<div>
     <div class="flex flex-col gap-3 p-3 h-screen" @show="truthy? .focusExample">
       <div class="flex justify-end">
@@ -250,15 +250,10 @@ var Section = component({
         // ignored here (rendered ungrouped) rather than coerced; the normalize layer
         // (tools/core/module.js) reports it as a shape error.
         group: typeof group === "string" ? group : "",
-        items: items.map((v) => Example.Class.fromData(v))
+        items: items.map((v) => Example.fromData(v))
       });
     }
   },
-  alter: {
-    filterItem(_key, item) {
-      return this.filter === "" || fuzzyMatch(this.filter, `${item.title} ${item.description}`);
-    }
-  },
   receive: {
     onApplyFilter(draft, value, ctx) {
       ctx.intent("exampleFilterChanged", [value], { route: ["dyn"] });
@@ -282,6 +277,11 @@ var Section = component({
       return this;
     }
   },
+  alter: {
+    filterItem(_key, item) {
+      return this.filter === "" || fuzzyMatch(this.filter, `${item.title} ${item.description}`);
+    }
+  },
   view: html`<section class="flex flex-col gap-3">
     <div class="sticky top-0 z-10 bg-base-100 pt-1 pb-2 shadow-sm">
       <h2 class="text-lg font-bold" @text=".title"></h2>
@@ -323,6 +323,12 @@ var SidebarEntry = component({
 var SidebarGroup = component({
   name: "SidebarGroup",
   fields: { name: "", collapsed: false, visible: true, rows: [] },
+  receive: {
+    onToggle(draft, ctx) {
+      ctx.intent("groupToggled", [this.name], { route: ["dyn"] });
+      return this;
+    }
+  },
   // Visibility drives the render-each `when` predicates (not `@show` on the items):
   // a `when` filter renders only visible rows while keeping each row's positional key,
   // so an event's path resolves to the right row. `@show` on a render-each item would
@@ -332,12 +338,6 @@ var SidebarGroup = component({
       return row.visible;
     }
   },
-  receive: {
-    onToggle(draft, ctx) {
-      ctx.intent("groupToggled", [this.name], { route: ["dyn"] });
-      return this;
-    }
-  },
   view: html`<div class="flex flex-col">
     <div
       class="list-row cursor-pointer hover:bg-base-200 font-semibold flex items-center gap-1"
@@ -411,6 +411,14 @@ var Example = component({
       });
     }
   },
+  methods: {
+    // An `intent` on the `dyn` leg leaves the example and walks into the storybook
+    // engine's own components. Nothing to warn about: if nothing answers, the walk
+    // runs out and the example hears `<name>Unhandled`.
+    runPhase(ctx, phase) {
+      dispatchPhase(ctx, ctx.at.field("value").buildPath(), phase, this.value);
+    }
+  },
   // Lifecycle hooks: the section forwards init/resume/suspend here; each runs the
   // matching `on` phase's actions against this example's component (`.value`).
   receive: {
@@ -446,14 +454,6 @@ var Example = component({
       draft.activeTab = value;
     }
   },
-  methods: {
-    // An `intent` on the `dyn` leg leaves the example and walks into the storybook
-    // engine's own components. Nothing to warn about: if nothing answers, the walk
-    // runs out and the example hears `<name>Unhandled`.
-    runPhase(ctx, phase) {
-      dispatchPhase(ctx, ctx.at.field("value").buildPath(), phase, this.value);
-    }
-  },
   view: html`<div class="card card-border bg-base-100 shadow-md">
     <div class="card-body">
       <h2 class="card-title flex justify-between">
@@ -678,7 +678,7 @@ function buildStorybook(modules) {
     if (raw == null) return [];
     return Array.isArray(raw) ? raw : [raw];
   });
-  const sections = rawSections.map((s) => Section.Class.fromData(s)).sort((a, b) => a.title.localeCompare(b.title));
+  const sections = rawSections.map((s) => Section.fromData(s)).sort((a, b) => a.title.localeCompare(b.title));
   const engineComponents = [
     Storybook,
     Section,
@@ -713,7 +713,7 @@ function buildStorybook(modules) {
   }
   const components = [.../* @__PURE__ */ new Set([...engineComponents, ...moduleComponents.flat()])];
   return {
-    root: Storybook.Class.withSections(sections),
+    root: Storybook.withSections(sections),
     components,
     engineComponents,
     moduleComponents,

package/dist/tutuca.ext.js

@@ -2076,13 +2076,12 @@ function processXExtras(node, attrs, opName, startIdx, px) {
     const a = attrs[i];
     const aName = a.name;
     if (consumed.has(aName)) continue;
-    const atPrefixed = aName.charCodeAt(0) === 64;
-    const baseName = atPrefixed ? aName.slice(1) : aName;
-    const wrapper = wrappable ? X_OPS[baseName]?.wrapper : null;
-    if (wrapper) {
-      if (!atPrefixed) maybeDeprecateBareXDirective(px, opName, baseName);
-      wrappers.push([wrapper, parseBool(a.value, px)]);
-      continue;
+    if (wrappable && aName.charCodeAt(0) === 64) {
+      const wrapper = X_OPS[aName.slice(1)]?.wrapper;
+      if (wrapper) {
+        wrappers.push([wrapper, parseBool(a.value, px)]);
+        continue;
+      }
     }
     const issueInfo = { op: opName, name: aName, value: a.value };
     px.onParseIssue("unknown-x-attr", issueInfo);
@@ -2094,9 +2093,6 @@ function processXExtras(node, attrs, opName, startIdx, px) {
   }
   return node;
 }
-function maybeDeprecateBareXDirective(px, opName, name) {
-  px.onDeprecatedSyntax("bare-x-directive", { op: opName, name });
-}
 function wrap(node, px, wrappers) {
   if (wrappers) {
     for (let i = wrappers.length - 1; i >= 0; i--) {
@@ -2218,17 +2214,10 @@ function parseRenderEach(px, value, as, attrs) {
   const attrParser = getAttrParser(px);
   const eachAttr = attrParser.pushWrapper("each", value, seqVal);
   attrParser.eachAttr = eachAttr;
-  const when = attrs.getNamedItem("@when") ?? attrs.getNamedItem("when");
-  if (when) {
-    if (when.name.charCodeAt(0) !== 64) maybeDeprecateBareXDirective(px, "render-each", "when");
-    attrParser._parseWhen(when.value);
-  }
-  const lWith = attrs.getNamedItem("@loop-with") ?? attrs.getNamedItem("loop-with");
-  if (lWith) {
-    if (lWith.name.charCodeAt(0) !== 64)
-      maybeDeprecateBareXDirective(px, "render-each", "loop-with");
-    attrParser._parseLoopWith(lWith.value);
-  }
+  const when = attrs.getNamedItem("@when");
+  if (when) attrParser._parseWhen(when.value);
+  const lWith = attrs.getNamedItem("@loop-with");
+  if (lWith) attrParser._parseLoopWith(lWith.value);
   const each = px.addNodeIf(EachNode, seqVal);
   each.iterInfo.whenVal = eachAttr.whenVal ?? null;
   each.iterInfo.loopWithVal = eachAttr.loopWithVal ?? null;
@@ -2366,10 +2355,8 @@ var X_OPS = {
   render: xOp(["as"], { wrappable: true, ignoresChildren: true }),
   "render-it": xOp(["as"], { wrappable: true, ignoresChildren: true }),
   // `@when`/`@loop-with` are consumed here (handled in parseRenderEach) so
-  // `processXExtras` does not flag them as unknown attrs. TEMPORARY: the bare
-  // `when`/`loop-with` spellings are deprecated in favor of the `@` form — see
-  // maybeDeprecateBareXDirective (added 2026-07-08).
-  "render-each": xOp(["as", "when", "loop-with", "@when", "@loop-with"], {
+  // `processXExtras` does not flag them as unknown attrs.
+  "render-each": xOp(["as", "@when", "@loop-with"], {
     wrappable: true,
     ignoresChildren: true
   }),
@@ -2460,10 +2447,6 @@ var ParseContext = class _ParseContext {
   onParseIssue(kind, info) {
     console.warn(`tutuca parse issue [${kind}]`, info);
   }
-  // Lint-only channel for deprecation nudges on still-valid syntax; the base
-  // (runtime) context ignores them so live apps stay quiet. See LintParseContext.
-  onDeprecatedSyntax(_kind, _info) {
-  }
 };
 var _htmlBlockTags = "ADDRESS,ARTICLE,ASIDE,BLOCKQUOTE,CAPTION,COL,COLGROUP,DETAILS,DIALOG,DIV,DD,DL,DT,FIELDSET,FIGCAPTION,FIGURE,FOOTER,FORM,H1,H2,H3,H4,H5,H6,HEADER,HGROUP,HR,LEGEND,LI,MAIN,MENU,NAV,OL,P,PRE,SECTION,SUMMARY,TABLE,TBODY,TD,TFOOT,TH,THEAD,TR,UL";
 var HTML_BLOCK_TAGS = new Set(_htmlBlockTags.split(","));
@@ -2600,20 +2583,20 @@ function compileModifiers(eventName, names) {
 }
 
 // src/components.js
+var COMPONENT = /* @__PURE__ */ Symbol.for("tutuca.component");
 var Components = class {
   constructor() {
-    this.getComponentSymbol = /* @__PURE__ */ Symbol("getComponent");
     this.byId = /* @__PURE__ */ new Map();
   }
-  registerComponent(comp) {
-    comp.Class.prototype[this.getComponentSymbol] = () => comp;
-    this.byId.set(comp.id, comp);
+  registerComponent(Comp) {
+    this.byId.set(Comp[COMPONENT].id, Comp);
   }
   getComponentForId(id) {
     return this.byId.get(id) ?? null;
   }
   getCompFor(v) {
-    return v?.[this.getComponentSymbol]?.() ?? null;
+    const Comp = v?.constructor;
+    return Comp?.[COMPONENT] ? Comp : null;
   }
   getHandlerFor(v, name, key) {
     return this.getCompFor(v)?.[key][name] ?? null;
@@ -2644,11 +2627,10 @@ var ComponentStack = class _ComponentStack {
   registerComponents(comps, opts) {
     const { aliases = {} } = opts ?? {};
     for (let i = 0; i < comps.length; i++) {
-      const comp = comps[i];
-      comp.scope = this.enter();
-      comp.Class.scope = comp.scope;
-      this.comps.registerComponent(comp);
-      this.byName[comp.name] = comp;
+      const Comp = comps[i];
+      Comp[COMPONENT].scope = this.enter();
+      this.comps.registerComponent(Comp);
+      this.byName[Comp.name] = Comp;
     }
     for (const alias in aliases) {
       const comp = this.byName[aliases[alias]];
@@ -3032,7 +3014,7 @@ var FieldFloat = class extends Field {
     super("float", name, CHECK_TYPE_FLOAT, (_) => null, defaultValue);
   }
 };
-var getTypeName = (v) => v?.constructor?.getMetaClass?.()?.name;
+var getTypeName = (v) => v?.constructor?.[COMPONENT]?.name ?? v?.constructor?.getMetaClass?.()?.name ?? null;
 var CheckTypeName = class {
   constructor(typeName) {
     this.typeName = typeName;
@@ -3133,7 +3115,7 @@ var ClassBuilder = class {
         getMetaClass: () => metaClass,
         make(inArgs = {}, opts = {}) {
           const args = {};
-          const scope = opts.scope ?? this.scope;
+          const scope = opts.scope ?? this[COMPONENT]?.scope ?? this.scope;
           for (const key in inArgs) {
             const field = fields[key];
             if (compFields.has(key)) args[key] = mkCompField(field, scope, inArgs[key]);
@@ -3213,7 +3195,7 @@ function classFromData(name, { fields = {}, methods, statics }) {
   return b.build();
 }
 function validateDraftFields(current, draft) {
-  const meta = current?.constructor?.getMetaClass?.();
+  const meta = current?.constructor?.[COMPONENT] ?? current?.constructor?.getMetaClass?.();
   if (!meta) return;
   for (const [name, field] of Object.entries(meta.fields)) {
     const value = draft[name];
@@ -3226,7 +3208,33 @@ function validateDraftFields(current, draft) {
     }
   }
 }
-Component.fromSpec = (opts) => new Component(classFromData(opts.name, opts), opts);
+var META_KEYS = "name id fields methods views receive intent alter provide lookup spec extra commonStyle globalStyle scope _rawProvide _rawLookup".split(
+  " "
+);
+Component.fromSpec = (opts) => {
+  const Class = classFromData(opts.name, opts);
+  const comp = new Component(Class, opts);
+  const metaClass = Class.getMetaClass();
+  comp.fields = metaClass.fields;
+  comp.methods = metaClass.methods;
+  Class.getMetaClass = () => comp;
+  Class[COMPONENT] = comp;
+  for (const key of META_KEYS)
+    if (!Object.hasOwn(Class, key))
+      Object.defineProperty(Class, key, {
+        get() {
+          return comp[key];
+        },
+        set(v) {
+          comp[key] = v;
+        },
+        configurable: true
+      });
+  for (const key of Object.getOwnPropertyNames(Component.prototype))
+    if (key !== "constructor" && key !== "make" && !Object.hasOwn(Class, key))
+      Class[key] = (...args) => comp[key](...args);
+  return Class;
+};
 var component = (opts) => Component.fromSpec(opts);
 
 // src/transactor.js
@@ -3381,8 +3389,8 @@ var Transaction = class {
   whenSettled() {
     return this.completion.whenSettled();
   }
-  // Resolves once this transaction AND all transitively-derived work (sends, bubbles,
-  // requests and the responses they produce, recursively) have settled.
+  // Resolves once this transaction AND all transitively-derived work (sends and
+  // intents, including the answers they produce, recursively) have settled.
   whenSubtreeSettled() {
     return this.completion.whenSubtreeSettled();
   }
@@ -3556,7 +3564,7 @@ var NameArgsTransaction = class extends Transaction {
   }
   handlerProp = null;
   // NameArgs verbs map their handler bucket straight to the observed kind:
-  // receive / bubble / response / input.
+  // receive / intent.
   get observeKind() {
     return this.handlerProp;
   }
@@ -4215,6 +4223,7 @@ function tutuca(nodeOrSelector) {
   return new App(rootNode, comps, renderer, ParseContext);
 }
 export {
+  COMPONENT,
   FIELD_CLASS,
   PASS,
   ParseContext,

package/dist/tutuca.js

@@ -2779,13 +2779,12 @@ function processXExtras(node, attrs, opName, startIdx, px) {
     const a = attrs[i];
     const aName = a.name;
     if (consumed.has(aName)) continue;
-    const atPrefixed = aName.charCodeAt(0) === 64;
-    const baseName = atPrefixed ? aName.slice(1) : aName;
-    const wrapper = wrappable ? X_OPS[baseName]?.wrapper : null;
-    if (wrapper) {
-      if (!atPrefixed) maybeDeprecateBareXDirective(px, opName, baseName);
-      wrappers.push([wrapper, parseBool(a.value, px)]);
-      continue;
+    if (wrappable && aName.charCodeAt(0) === 64) {
+      const wrapper = X_OPS[aName.slice(1)]?.wrapper;
+      if (wrapper) {
+        wrappers.push([wrapper, parseBool(a.value, px)]);
+        continue;
+      }
     }
     const issueInfo = { op: opName, name: aName, value: a.value };
     px.onParseIssue("unknown-x-attr", issueInfo);
@@ -2797,9 +2796,6 @@ function processXExtras(node, attrs, opName, startIdx, px) {
   }
   return node;
 }
-function maybeDeprecateBareXDirective(px, opName, name) {
-  px.onDeprecatedSyntax("bare-x-directive", { op: opName, name });
-}
 function wrap(node, px, wrappers) {
   if (wrappers) {
     for (let i = wrappers.length - 1; i >= 0; i--) {
@@ -2921,17 +2917,10 @@ function parseRenderEach(px, value, as, attrs) {
   const attrParser = getAttrParser(px);
   const eachAttr = attrParser.pushWrapper("each", value, seqVal);
   attrParser.eachAttr = eachAttr;
-  const when = attrs.getNamedItem("@when") ?? attrs.getNamedItem("when");
-  if (when) {
-    if (when.name.charCodeAt(0) !== 64) maybeDeprecateBareXDirective(px, "render-each", "when");
-    attrParser._parseWhen(when.value);
-  }
-  const lWith = attrs.getNamedItem("@loop-with") ?? attrs.getNamedItem("loop-with");
-  if (lWith) {
-    if (lWith.name.charCodeAt(0) !== 64)
-      maybeDeprecateBareXDirective(px, "render-each", "loop-with");
-    attrParser._parseLoopWith(lWith.value);
-  }
+  const when = attrs.getNamedItem("@when");
+  if (when) attrParser._parseWhen(when.value);
+  const lWith = attrs.getNamedItem("@loop-with");
+  if (lWith) attrParser._parseLoopWith(lWith.value);
   const each2 = px.addNodeIf(EachNode, seqVal);
   each2.iterInfo.whenVal = eachAttr.whenVal ?? null;
   each2.iterInfo.loopWithVal = eachAttr.loopWithVal ?? null;
@@ -3069,10 +3058,8 @@ var X_OPS = {
   render: xOp(["as"], { wrappable: true, ignoresChildren: true }),
   "render-it": xOp(["as"], { wrappable: true, ignoresChildren: true }),
   // `@when`/`@loop-with` are consumed here (handled in parseRenderEach) so
-  // `processXExtras` does not flag them as unknown attrs. TEMPORARY: the bare
-  // `when`/`loop-with` spellings are deprecated in favor of the `@` form — see
-  // maybeDeprecateBareXDirective (added 2026-07-08).
-  "render-each": xOp(["as", "when", "loop-with", "@when", "@loop-with"], {
+  // `processXExtras` does not flag them as unknown attrs.
+  "render-each": xOp(["as", "@when", "@loop-with"], {
     wrappable: true,
     ignoresChildren: true
   }),
@@ -3163,10 +3150,6 @@ var ParseContext = class _ParseContext {
   onParseIssue(kind, info) {
     console.warn(`tutuca parse issue [${kind}]`, info);
   }
-  // Lint-only channel for deprecation nudges on still-valid syntax; the base
-  // (runtime) context ignores them so live apps stay quiet. See LintParseContext.
-  onDeprecatedSyntax(_kind, _info) {
-  }
 };
 var _htmlBlockTags = "ADDRESS,ARTICLE,ASIDE,BLOCKQUOTE,CAPTION,COL,COLGROUP,DETAILS,DIALOG,DIV,DD,DL,DT,FIELDSET,FIGCAPTION,FIGURE,FOOTER,FORM,H1,H2,H3,H4,H5,H6,HEADER,HGROUP,HR,LEGEND,LI,MAIN,MENU,NAV,OL,P,PRE,SECTION,SUMMARY,TABLE,TBODY,TD,TFOOT,TH,THEAD,TR,UL";
 var HTML_BLOCK_TAGS = new Set(_htmlBlockTags.split(","));
@@ -3303,20 +3286,20 @@ function compileModifiers(eventName, names) {
 }
 
 // src/components.js
+var COMPONENT = /* @__PURE__ */ Symbol.for("tutuca.component");
 var Components = class {
   constructor() {
-    this.getComponentSymbol = /* @__PURE__ */ Symbol("getComponent");
     this.byId = /* @__PURE__ */ new Map();
   }
-  registerComponent(comp) {
-    comp.Class.prototype[this.getComponentSymbol] = () => comp;
-    this.byId.set(comp.id, comp);
+  registerComponent(Comp) {
+    this.byId.set(Comp[COMPONENT].id, Comp);
   }
   getComponentForId(id) {
     return this.byId.get(id) ?? null;
   }
   getCompFor(v) {
-    return v?.[this.getComponentSymbol]?.() ?? null;
+    const Comp = v?.constructor;
+    return Comp?.[COMPONENT] ? Comp : null;
   }
   getHandlerFor(v, name, key) {
     return this.getCompFor(v)?.[key][name] ?? null;
@@ -3347,11 +3330,10 @@ var ComponentStack = class _ComponentStack {
   registerComponents(comps, opts) {
     const { aliases = {} } = opts ?? {};
     for (let i = 0; i < comps.length; i++) {
-      const comp = comps[i];
-      comp.scope = this.enter();
-      comp.Class.scope = comp.scope;
-      this.comps.registerComponent(comp);
-      this.byName[comp.name] = comp;
+      const Comp = comps[i];
+      Comp[COMPONENT].scope = this.enter();
+      this.comps.registerComponent(Comp);
+      this.byName[Comp.name] = Comp;
     }
     for (const alias in aliases) {
       const comp = this.byName[aliases[alias]];
@@ -3735,7 +3717,7 @@ var FieldFloat = class extends Field {
     super("float", name, CHECK_TYPE_FLOAT, (_) => null, defaultValue);
   }
 };
-var getTypeName = (v) => v?.constructor?.getMetaClass?.()?.name;
+var getTypeName = (v) => v?.constructor?.[COMPONENT]?.name ?? v?.constructor?.getMetaClass?.()?.name ?? null;
 var CheckTypeName = class {
   constructor(typeName) {
     this.typeName = typeName;
@@ -3836,7 +3818,7 @@ var ClassBuilder = class {
         getMetaClass: () => metaClass,
         make(inArgs = {}, opts = {}) {
           const args = {};
-          const scope = opts.scope ?? this.scope;
+          const scope = opts.scope ?? this[COMPONENT]?.scope ?? this.scope;
           for (const key in inArgs) {
             const field = fields[key];
             if (compFields.has(key)) args[key] = mkCompField(field, scope, inArgs[key]);
@@ -3916,7 +3898,7 @@ function classFromData(name, { fields = {}, methods, statics }) {
   return b.build();
 }
 function validateDraftFields(current2, draft) {
-  const meta = current2?.constructor?.getMetaClass?.();
+  const meta = current2?.constructor?.[COMPONENT] ?? current2?.constructor?.getMetaClass?.();
   if (!meta) return;
   for (const [name, field] of Object.entries(meta.fields)) {
     const value = draft[name];
@@ -3929,7 +3911,33 @@ function validateDraftFields(current2, draft) {
     }
   }
 }
-Component.fromSpec = (opts) => new Component(classFromData(opts.name, opts), opts);
+var META_KEYS = "name id fields methods views receive intent alter provide lookup spec extra commonStyle globalStyle scope _rawProvide _rawLookup".split(
+  " "
+);
+Component.fromSpec = (opts) => {
+  const Class = classFromData(opts.name, opts);
+  const comp = new Component(Class, opts);
+  const metaClass = Class.getMetaClass();
+  comp.fields = metaClass.fields;
+  comp.methods = metaClass.methods;
+  Class.getMetaClass = () => comp;
+  Class[COMPONENT] = comp;
+  for (const key of META_KEYS)
+    if (!Object.hasOwn(Class, key))
+      Object.defineProperty(Class, key, {
+        get() {
+          return comp[key];
+        },
+        set(v) {
+          comp[key] = v;
+        },
+        configurable: true
+      });
+  for (const key of Object.getOwnPropertyNames(Component.prototype))
+    if (key !== "constructor" && key !== "make" && !Object.hasOwn(Class, key))
+      Class[key] = (...args) => comp[key](...args);
+  return Class;
+};
 var component = (opts) => Component.fromSpec(opts);
 
 // src/transactor.js
@@ -4084,8 +4092,8 @@ var Transaction = class {
   whenSettled() {
     return this.completion.whenSettled();
   }
-  // Resolves once this transaction AND all transitively-derived work (sends, bubbles,
-  // requests and the responses they produce, recursively) have settled.
+  // Resolves once this transaction AND all transitively-derived work (sends and
+  // intents, including the answers they produce, recursively) have settled.
   whenSubtreeSettled() {
     return this.completion.whenSubtreeSettled();
   }
@@ -4259,7 +4267,7 @@ var NameArgsTransaction = class extends Transaction {
   }
   handlerProp = null;
   // NameArgs verbs map their handler bucket straight to the observed kind:
-  // receive / bubble / response / input.
+  // receive / intent.
   get observeKind() {
     return this.handlerProp;
   }
@@ -4918,6 +4926,7 @@ function tutuca(nodeOrSelector) {
   return new App(rootNode, comps, renderer, ParseContext);
 }
 export {
+  COMPONENT,
   FIELD_CLASS,
   PASS,
   ParseContext,