Suggest <show=condition> when the condition is a named attribute

.changeset/show-if-attr-error.md

@@ -0,0 +1,5 @@
+---
+"@marko/runtime-tags": patch
+---
+
+Improve the `<show>` missing-`value=` error when the condition was written as another attribute: `<show if=cond>` now suggests `<show=condition>` and points the code frame at the offending attribute.

packages/runtime-tags/src/__tests__/fixtures/error-show-wrong-attr/__snapshots__/error-compile-dom.debug.txt

@@ -0,0 +1,6 @@
+
+    at packages/runtime-tags/src/__tests__/fixtures/error-show-wrong-attr/template.marko:2:7
+      1 | <let/open=false>
+    > 2 | <show if=open>Hello</show>
+        |       ^^^^^^^ The [`<show>` tag](https://markojs.com/docs/reference/core-tag#show) requires the [`value=` attribute](https://markojs.com/docs/reference/language#shorthand-value). Use `<show=condition>` instead of `<show if=condition>`.
+      3 |

packages/runtime-tags/src/__tests__/fixtures/error-show-wrong-attr/__snapshots__/error-compile-dom.txt

@@ -0,0 +1,6 @@
+
+    at packages/runtime-tags/src/__tests__/fixtures/error-show-wrong-attr/template.marko:2:7
+      1 | <let/open=false>
+    > 2 | <show if=open>Hello</show>
+        |       ^^^^^^^ The [`<show>` tag](https://markojs.com/docs/reference/core-tag#show) requires the [`value=` attribute](https://markojs.com/docs/reference/language#shorthand-value). Use `<show=condition>` instead of `<show if=condition>`.
+      3 |

packages/runtime-tags/src/__tests__/fixtures/error-show-wrong-attr/__snapshots__/error-compile-html.debug.txt

@@ -0,0 +1,6 @@
+
+    at packages/runtime-tags/src/__tests__/fixtures/error-show-wrong-attr/template.marko:2:7
+      1 | <let/open=false>
+    > 2 | <show if=open>Hello</show>
+        |       ^^^^^^^ The [`<show>` tag](https://markojs.com/docs/reference/core-tag#show) requires the [`value=` attribute](https://markojs.com/docs/reference/language#shorthand-value). Use `<show=condition>` instead of `<show if=condition>`.
+      3 |

packages/runtime-tags/src/__tests__/fixtures/error-show-wrong-attr/__snapshots__/error-compile-html.txt

@@ -0,0 +1,6 @@
+
+    at packages/runtime-tags/src/__tests__/fixtures/error-show-wrong-attr/template.marko:2:7
+      1 | <let/open=false>
+    > 2 | <show if=open>Hello</show>
+        |       ^^^^^^^ The [`<show>` tag](https://markojs.com/docs/reference/core-tag#show) requires the [`value=` attribute](https://markojs.com/docs/reference/language#shorthand-value). Use `<show=condition>` instead of `<show if=condition>`.
+      3 |

packages/runtime-tags/src/__tests__/fixtures/error-show-wrong-attr/template.marko

@@ -0,0 +1,2 @@
+<let/open=false>
+<show if=open>Hello</show>

packages/runtime-tags/src/__tests__/fixtures/error-show-wrong-attr/test.ts

@@ -0,0 +1,5 @@
+import type { TestConfig } from "../../main.test";
+
+export const config: TestConfig = {
+  error_compiler: true,
+};

packages/runtime-tags/src/translator/core/show.ts

@@ -382,11 +382,13 @@ function assertHasValueAttribute(tag: t.NodePath<t.MarkoTag>) {
     !t.isMarkoAttribute(valueAttr) ||
     !(valueAttr.default || valueAttr.name === "value")
   ) {
-    throw tag
-      .get("name")
-      .buildCodeFrameError(
-        `The [\`<${getTagName(tag)}>\` tag](https://markojs.com/docs/reference/core-tag#show) requires a [\`value=\` attribute](https://markojs.com/docs/reference/language#shorthand-value).`,
-      );
+    // `<show if=condition>` is the common miss, so name the rename.
+    const wrongName = t.isMarkoAttribute(valueAttr) && valueAttr.name;
+    throw (
+      wrongName ? tag.get("attributes")[0] : tag.get("name")
+    ).buildCodeFrameError(
+      `The [\`<${getTagName(tag)}>\` tag](https://markojs.com/docs/reference/core-tag#show) requires the [\`value=\` attribute](https://markojs.com/docs/reference/language#shorthand-value).${wrongName ? ` Use \`<${getTagName(tag)}=condition>\` instead of \`<${getTagName(tag)} ${wrongName}=condition>\`.` : ""}`,
+    );
   }
 
   if (node.attributes.length > 1) {

skills/marko-best-practices/SKILL.md

@@ -24,6 +24,7 @@ Documentation and this skill target **Marko 6**. Do not use Marko 5 syntax.
 - [ ] Uses Marko 6 syntax only (no scriptlets, old event syntax, or Marko 5 blocks).
 - [ ] `<script>` is never used when state (`<let>` or `<const>`) could accomplish the same behavior.
 - [ ] Event handlers use function form: `onClick() { ... }` or a reference, not string names.
+- [ ] `<show=cond>` for toggled content that should keep its state; `<if>` destroys and rebuilds.
 - [ ] Component stays small and readable; consider splitting large templates.
 - [ ] No unnecessary client-side JS; prefer built-in browser APIs and HTML/CSS features over scripts.
 - [ ] Props are declared with an exported `Input` interface, and templates are type checked with `mtc` (`@marko/type-check`) — `tsc` skips `.marko` files and reports nothing.