tutuca 0.9.109 → 0.9.110

package/dist/tutuca-cli.js

@@ -6210,9 +6210,12 @@ function parseRenderEach(px, value, as, attrs) {
       maybeDeprecateBareXDirective(px, "render-each", "when");
     attrParser._parseWhen(when.value);
   }
-  const lWith = attrs.getNamedItem("loop-with");
-  if (lWith)
+  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 each = px.addNodeIf(EachNode, seqVal);
   each.iterInfo.whenVal = eachAttr.whenVal ?? null;
   each.iterInfo.loopWithVal = eachAttr.loopWithVal ?? null;
@@ -6726,7 +6729,7 @@ var init_anode = __esm(() => {
     text: xOp([], { wrappable: true, ignoresChildren: true }),
     render: xOp(["as"], { wrappable: true, ignoresChildren: true }),
     "render-it": xOp(["as"], { wrappable: true, ignoresChildren: true }),
-    "render-each": xOp(["as", "when", "loop-with", "@when"], {
+    "render-each": xOp(["as", "when", "loop-with", "@when", "@loop-with"], {
       wrappable: true,
       ignoresChildren: true
     }),
@@ -9473,11 +9476,11 @@ function checkConsistentAttrs(lx, Comp, referencedAlters, referencedDynamics) {
           const iter = node.iterInfo;
           if (iter.whenVal)
             checkConsistentAttrVal(lx, iter.whenVal, env, false, {
-              originAttr: "<x render-each when>"
+              originAttr: "<x render-each @when>"
             });
           if (iter.loopWithVal)
             checkConsistentAttrVal(lx, iter.loopWithVal, env, false, {
-              originAttr: "<x render-each loop-with>"
+              originAttr: "<x render-each @loop-with>"
             });
         }
       }
@@ -9741,7 +9744,7 @@ var init_lint_check = __esm(() => {
   };
   BINDING_MEMBER_TOO_DEEP_RE = /^@[a-zA-Z]\w*\??(\.[a-zA-Z]\w*\??){2,}$/;
   UNSUPPORTED_EXPR_GUIDANCE = {
-    ternary: "Ternary expressions aren't supported in dynamic attributes. Define a method or computed field on the component that returns the value, then reference it as '$methodName'.",
+    ternary: "Ternary expressions aren't supported in dynamic attributes. Define a method or computed value on the component that returns the value, then reference it as '$methodName'.",
     comparison: "Comparisons aren't supported in dynamic attributes. Define a method like 'isFooSelected' that returns the boolean, then reference it as '$isFooSelected'.",
     logical: "Logical operators aren't supported in dynamic attributes. Combine the conditions in a method on the component and reference it as '$methodName'.",
     "call-with-args": "Method calls with arguments aren't supported here. Reference a no-arg method ('$methodName') and read what you need from component state, or split into per-case methods.",
@@ -10076,7 +10079,7 @@ var init_lint_rules = __esm(() => {
       code: DEPRECATED_BARE_X_DIRECTIVE,
       level: "warn",
       group: "Templates / events",
-      summary: "Bare `show`/`hide`/`when` on an `<x>` op is deprecated — use the `@`-prefixed directive (`@show`/`@hide`/`@when`)."
+      summary: "Bare `show`/`hide`/`when`/`loop-with` on an `<x>` op is deprecated — use the `@`-prefixed directive (`@show`/`@hide`/`@when`/`@loop-with`)."
     },
     {
       code: BAD_VALUE,
@@ -10212,7 +10215,7 @@ function badValueMessage(info) {
     case "handler-arg":
       return `Cannot parse handler argument ${v}`;
     case "macro-var":
-      return `Macro variable '^${info.name}' is not defined`;
+      return `Macro parameter '^${info.name}' is not defined`;
     default:
       return `Cannot parse value ${v}`;
   }
@@ -10292,7 +10295,7 @@ function lintIdToMessage(id, info) {
     case "ALT_HANDLER_NOT_REFERENCED":
       return `Alter handler '${info.name}' is defined but never used — remove it or reference it from @when, @enrich-with, or @loop-with`;
     case "DYN_VAL_NOT_DEFINED":
-      return `Dynamic variable '*${info.name}' is not defined${fmtOriginSuffix(info)}`;
+      return `Dynamic binding '*${info.name}' is not defined${fmtOriginSuffix(info)}`;
     case "DYN_ALIAS_NOT_REFERENCED":
       return `Lookup '${info.name}' is defined but never used — remove it or reference it as '*${info.name}' in a view`;
     case "PROVIDE_NOT_ADDRESSABLE":
@@ -10330,9 +10333,9 @@ function lintIdToMessage(id, info) {
       return `Enrich handler '${info.name}' only copies members of the loop value — read them directly${reads ? ` (${reads})` : ""} and remove the '@enrich-with'`;
     }
     case "REDUNDANT_TEMPLATE_STRING":
-      return `Redundant template string — '{${info.simpler}}' should be just '${info.simpler}'${fmtOriginSuffix(info)}`;
+      return `Redundant string template — '{${info.simpler}}' should be just '${info.simpler}'${fmtOriginSuffix(info)}`;
     case "PLACEHOLDERLESS_TEMPLATE_STRING":
-      return `Template string has no dynamic parts — use the string literal ${info.literal} instead${fmtOriginSuffix(info)}`;
+      return `String template has no dynamic parts — use the string literal ${info.literal} instead${fmtOriginSuffix(info)}`;
     case "CONSTANT_CONDITION":
       return `Condition is the constant literal ${info.literal} — it never changes; reference a field ('.name') or a method ('$name') instead${fmtOriginSuffix(info)}`;
     case "UNKNOWN_COMPONENT_SPEC_KEY":

package/dist/tutuca-components.js

@@ -151,7 +151,7 @@ function makeCompositeView({
       @show=".isExpanded"
       class="ml-1 flex flex-col gap-0.5 border-l ${borderClass} pl-2 mt-0.5"
     >
-      <x render-each=".items" loop-with="getPageRange"></x>
+      <x render-each=".items" @loop-with="getPageRange"></x>
     </div>
   </span>`;
 }
@@ -786,13 +786,13 @@ var GRID_BODY = html4`<div
   class="ml-1 grid gap-x-2 gap-y-0.5 items-baseline border-l border-base-content/10 pl-2 mt-0.5"
   style="grid-template-columns: auto 1fr"
 >
-  <x render-each=".items" loop-with="getPageRange"></x>
+  <x render-each=".items" @loop-with="getPageRange"></x>
 </div>`;
 var LIST_BODY = html4`<div
   @show=".isExpanded"
   class="ml-1 flex flex-col gap-0.5 border-l border-base-content/10 pl-2 mt-0.5"
 >
-  <x render-each=".items" loop-with="getPageRange"></x>
+  <x render-each=".items" @loop-with="getPageRange"></x>
 </div>`;
 function makeSchemaView(accent, body = GRID_BODY) {
   return html4`<span class="font-mono text-sm leading-tight inline-block">
@@ -1640,7 +1640,7 @@ function lintMessage(id, info = {}) {
     case "ALT_HANDLER_NOT_DEFINED":
       return `Alter handler '${info.name}' is not defined${originSuffix(info)}`;
     case "DYN_VAL_NOT_DEFINED":
-      return `Dynamic variable '*${info.name}' is not defined${originSuffix(info)}`;
+      return `Dynamic binding '*${info.name}' is not defined${originSuffix(info)}`;
     case "UNKNOWN_COMPONENT_NAME":
       return `Unknown component '${info.name}'${originSuffix(info)}`;
     case "UNKNOWN_DIRECTIVE":
@@ -1648,9 +1648,9 @@ function lintMessage(id, info = {}) {
     case "IF_NO_BRANCH_SET":
       return `'@if.${info.attr}' has no '@then' or '@else' branch${tagSuffix(info)}`;
     case "REDUNDANT_TEMPLATE_STRING":
-      return `Redundant template string — '{${info.simpler}}' should be just '${info.simpler}'${originSuffix(info)}`;
+      return `Redundant string template — '{${info.simpler}}' should be just '${info.simpler}'${originSuffix(info)}`;
     case "PLACEHOLDERLESS_TEMPLATE_STRING":
-      return `Template string has no dynamic parts — use the literal ${info.literal} instead${originSuffix(info)}`;
+      return `String template has no dynamic parts — use the literal ${info.literal} instead${originSuffix(info)}`;
     case "CONSTANT_CONDITION":
       return `Constant condition ${info.literal} — reference a field ('.name') or method ('$name')${originSuffix(info)}`;
     case "ASYNC_HANDLER":

package/dist/tutuca-dev.ext.js

@@ -2375,9 +2375,12 @@ function parseRenderEach(px, value, as, attrs) {
       maybeDeprecateBareXDirective(px, "render-each", "when");
     attrParser._parseWhen(when.value);
   }
-  const lWith = attrs.getNamedItem("loop-with");
-  if (lWith)
+  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 each = px.addNodeIf(EachNode, seqVal);
   each.iterInfo.whenVal = eachAttr.whenVal ?? null;
   each.iterInfo.loopWithVal = eachAttr.loopWithVal ?? null;
@@ -2513,7 +2516,7 @@ var X_OPS = {
   text: xOp([], { wrappable: true, ignoresChildren: true }),
   render: xOp(["as"], { wrappable: true, ignoresChildren: true }),
   "render-it": xOp(["as"], { wrappable: true, ignoresChildren: true }),
-  "render-each": xOp(["as", "when", "loop-with", "@when"], {
+  "render-each": xOp(["as", "when", "loop-with", "@when", "@loop-with"], {
     wrappable: true,
     ignoresChildren: true
   }),
@@ -5200,7 +5203,7 @@ function classifyBadValue(value) {
 }
 var BINDING_MEMBER_TOO_DEEP_RE = /^@[a-zA-Z]\w*\??(\.[a-zA-Z]\w*\??){2,}$/;
 var UNSUPPORTED_EXPR_GUIDANCE = {
-  ternary: "Ternary expressions aren't supported in dynamic attributes. Define a method or computed field on the component that returns the value, then reference it as '$methodName'.",
+  ternary: "Ternary expressions aren't supported in dynamic attributes. Define a method or computed value on the component that returns the value, then reference it as '$methodName'.",
   comparison: "Comparisons aren't supported in dynamic attributes. Define a method like 'isFooSelected' that returns the boolean, then reference it as '$isFooSelected'.",
   logical: "Logical operators aren't supported in dynamic attributes. Combine the conditions in a method on the component and reference it as '$methodName'.",
   "call-with-args": "Method calls with arguments aren't supported here. Reference a no-arg method ('$methodName') and read what you need from component state, or split into per-case methods.",
@@ -5728,11 +5731,11 @@ function checkConsistentAttrs(lx, Comp, referencedAlters, referencedDynamics) {
           const iter = node.iterInfo;
           if (iter.whenVal)
             checkConsistentAttrVal(lx, iter.whenVal, env, false, {
-              originAttr: "<x render-each when>"
+              originAttr: "<x render-each @when>"
             });
           if (iter.loopWithVal)
             checkConsistentAttrVal(lx, iter.loopWithVal, env, false, {
-              originAttr: "<x render-each loop-with>"
+              originAttr: "<x render-each @loop-with>"
             });
         }
       }
@@ -7399,7 +7402,7 @@ function badValueMessage(info) {
     case "handler-arg":
       return `Cannot parse handler argument ${v}`;
     case "macro-var":
-      return `Macro variable '^${info.name}' is not defined`;
+      return `Macro parameter '^${info.name}' is not defined`;
     default:
       return `Cannot parse value ${v}`;
   }
@@ -7479,7 +7482,7 @@ function lintIdToMessage(id, info) {
     case "ALT_HANDLER_NOT_REFERENCED":
       return `Alter handler '${info.name}' is defined but never used — remove it or reference it from @when, @enrich-with, or @loop-with`;
     case "DYN_VAL_NOT_DEFINED":
-      return `Dynamic variable '*${info.name}' is not defined${fmtOriginSuffix(info)}`;
+      return `Dynamic binding '*${info.name}' is not defined${fmtOriginSuffix(info)}`;
     case "DYN_ALIAS_NOT_REFERENCED":
       return `Lookup '${info.name}' is defined but never used — remove it or reference it as '*${info.name}' in a view`;
     case "PROVIDE_NOT_ADDRESSABLE":
@@ -7517,9 +7520,9 @@ function lintIdToMessage(id, info) {
       return `Enrich handler '${info.name}' only copies members of the loop value — read them directly${reads ? ` (${reads})` : ""} and remove the '@enrich-with'`;
     }
     case "REDUNDANT_TEMPLATE_STRING":
-      return `Redundant template string — '{${info.simpler}}' should be just '${info.simpler}'${fmtOriginSuffix(info)}`;
+      return `Redundant string template — '{${info.simpler}}' should be just '${info.simpler}'${fmtOriginSuffix(info)}`;
     case "PLACEHOLDERLESS_TEMPLATE_STRING":
-      return `Template string has no dynamic parts — use the string literal ${info.literal} instead${fmtOriginSuffix(info)}`;
+      return `String template has no dynamic parts — use the string literal ${info.literal} instead${fmtOriginSuffix(info)}`;
     case "CONSTANT_CONDITION":
       return `Condition is the constant literal ${info.literal} — it never changes; reference a field ('.name') or a method ('$name') instead${fmtOriginSuffix(info)}`;
     case "UNKNOWN_COMPONENT_SPEC_KEY":

package/dist/tutuca-dev.js

@@ -10024,9 +10024,12 @@ function parseRenderEach(px, value, as, attrs) {
       maybeDeprecateBareXDirective(px, "render-each", "when");
     attrParser._parseWhen(when.value);
   }
-  const lWith = attrs.getNamedItem("loop-with");
-  if (lWith)
+  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 each = px.addNodeIf(EachNode, seqVal);
   each.iterInfo.whenVal = eachAttr.whenVal ?? null;
   each.iterInfo.loopWithVal = eachAttr.loopWithVal ?? null;
@@ -10162,7 +10165,7 @@ var X_OPS = {
   text: xOp([], { wrappable: true, ignoresChildren: true }),
   render: xOp(["as"], { wrappable: true, ignoresChildren: true }),
   "render-it": xOp(["as"], { wrappable: true, ignoresChildren: true }),
-  "render-each": xOp(["as", "when", "loop-with", "@when"], {
+  "render-each": xOp(["as", "when", "loop-with", "@when", "@loop-with"], {
     wrappable: true,
     ignoresChildren: true
   }),
@@ -12849,7 +12852,7 @@ function classifyBadValue(value) {
 }
 var BINDING_MEMBER_TOO_DEEP_RE = /^@[a-zA-Z]\w*\??(\.[a-zA-Z]\w*\??){2,}$/;
 var UNSUPPORTED_EXPR_GUIDANCE = {
-  ternary: "Ternary expressions aren't supported in dynamic attributes. Define a method or computed field on the component that returns the value, then reference it as '$methodName'.",
+  ternary: "Ternary expressions aren't supported in dynamic attributes. Define a method or computed value on the component that returns the value, then reference it as '$methodName'.",
   comparison: "Comparisons aren't supported in dynamic attributes. Define a method like 'isFooSelected' that returns the boolean, then reference it as '$isFooSelected'.",
   logical: "Logical operators aren't supported in dynamic attributes. Combine the conditions in a method on the component and reference it as '$methodName'.",
   "call-with-args": "Method calls with arguments aren't supported here. Reference a no-arg method ('$methodName') and read what you need from component state, or split into per-case methods.",
@@ -13377,11 +13380,11 @@ function checkConsistentAttrs(lx, Comp, referencedAlters, referencedDynamics) {
           const iter = node.iterInfo;
           if (iter.whenVal)
             checkConsistentAttrVal(lx, iter.whenVal, env, false, {
-              originAttr: "<x render-each when>"
+              originAttr: "<x render-each @when>"
             });
           if (iter.loopWithVal)
             checkConsistentAttrVal(lx, iter.loopWithVal, env, false, {
-              originAttr: "<x render-each loop-with>"
+              originAttr: "<x render-each @loop-with>"
             });
         }
       }
@@ -15048,7 +15051,7 @@ function badValueMessage(info) {
     case "handler-arg":
       return `Cannot parse handler argument ${v}`;
     case "macro-var":
-      return `Macro variable '^${info.name}' is not defined`;
+      return `Macro parameter '^${info.name}' is not defined`;
     default:
       return `Cannot parse value ${v}`;
   }
@@ -15128,7 +15131,7 @@ function lintIdToMessage(id, info) {
     case "ALT_HANDLER_NOT_REFERENCED":
       return `Alter handler '${info.name}' is defined but never used — remove it or reference it from @when, @enrich-with, or @loop-with`;
     case "DYN_VAL_NOT_DEFINED":
-      return `Dynamic variable '*${info.name}' is not defined${fmtOriginSuffix(info)}`;
+      return `Dynamic binding '*${info.name}' is not defined${fmtOriginSuffix(info)}`;
     case "DYN_ALIAS_NOT_REFERENCED":
       return `Lookup '${info.name}' is defined but never used — remove it or reference it as '*${info.name}' in a view`;
     case "PROVIDE_NOT_ADDRESSABLE":
@@ -15166,9 +15169,9 @@ function lintIdToMessage(id, info) {
       return `Enrich handler '${info.name}' only copies members of the loop value — read them directly${reads ? ` (${reads})` : ""} and remove the '@enrich-with'`;
     }
     case "REDUNDANT_TEMPLATE_STRING":
-      return `Redundant template string — '{${info.simpler}}' should be just '${info.simpler}'${fmtOriginSuffix(info)}`;
+      return `Redundant string template — '{${info.simpler}}' should be just '${info.simpler}'${fmtOriginSuffix(info)}`;
     case "PLACEHOLDERLESS_TEMPLATE_STRING":
-      return `Template string has no dynamic parts — use the string literal ${info.literal} instead${fmtOriginSuffix(info)}`;
+      return `String template has no dynamic parts — use the string literal ${info.literal} instead${fmtOriginSuffix(info)}`;
     case "CONSTANT_CONDITION":
       return `Condition is the constant literal ${info.literal} — it never changes; reference a field ('.name') or a method ('$name') instead${fmtOriginSuffix(info)}`;
     case "UNKNOWN_COMPONENT_SPEC_KEY":