attaform 0.17.2 → 0.18.0

package/dist/runtime/components/DevtoolsValueTree.vue

@@ -0,0 +1,192 @@
+<script setup>
+import { computed, nextTick, ref } from "vue";
+const props = defineProps({
+  value: { type: null, required: true },
+  label: { type: String, required: false },
+  depth: { type: Number, required: false },
+  path: { type: Array, required: false },
+  editable: { type: Boolean, required: false, skipCheck: true },
+  onEdit: { type: Function, required: false, skipCheck: true },
+  selectedKey: { type: null, required: false },
+  onSelectPath: { type: Function, required: false, skipCheck: true }
+});
+const depth = computed(() => props.depth ?? 0);
+const expanded = ref(depth.value < 2);
+const path = computed(() => props.path ?? []);
+const type = computed(() => {
+  const v = props.value;
+  if (v === null) return "null";
+  if (v === void 0) return "undefined";
+  if (typeof v === "string") return "string";
+  if (typeof v === "number") return "number";
+  if (typeof v === "boolean") return "boolean";
+  if (Array.isArray(v)) return "array";
+  if (typeof v === "object") return "object";
+  return "other";
+});
+const isLeaf = computed(() => type.value !== "array" && type.value !== "object");
+const entries = computed(() => {
+  const v = props.value;
+  if (Array.isArray(v)) return v.map((item, i) => [String(i), item]);
+  if (v !== null && typeof v === "object") {
+    return Object.entries(v);
+  }
+  return [];
+});
+const formatted = computed(() => {
+  const v = props.value;
+  if (v === null) return "null";
+  if (v === void 0) return "undefined";
+  if (typeof v === "string") return `"${v}"`;
+  if (typeof v === "boolean" || typeof v === "number") return String(v);
+  return String(v);
+});
+const summary = computed(() => {
+  const v = props.value;
+  if (Array.isArray(v)) return `Array(${v.length})`;
+  if (v !== null && typeof v === "object") {
+    const keys = Object.keys(v);
+    return `{${keys.length}}`;
+  }
+  return "";
+});
+const isEditableLeaf = computed(() => {
+  if (!props.editable || props.onEdit === void 0) return false;
+  return type.value === "string" || type.value === "number" || type.value === "boolean";
+});
+const editing = ref(false);
+const editValue = ref("");
+const editInput = ref(null);
+const editRejected = ref(false);
+function childPath(rawKey) {
+  if (type.value === "array") return [...path.value, Number(rawKey)];
+  return [...path.value, rawKey];
+}
+async function startEdit() {
+  if (!isEditableLeaf.value) return;
+  editValue.value = type.value === "boolean" || type.value === "number" ? String(props.value ?? "") : props.value;
+  editing.value = true;
+  editRejected.value = false;
+  await nextTick();
+  editInput.value?.focus();
+  editInput.value?.select?.();
+}
+function flashRejected() {
+  editRejected.value = true;
+  setTimeout(() => {
+    editRejected.value = false;
+  }, 600);
+}
+function commitEdit() {
+  if (!editing.value || props.onEdit === void 0) return;
+  let next = editValue.value;
+  if (type.value === "number") {
+    const parsed = Number(editValue.value);
+    if (!Number.isFinite(parsed)) {
+      flashRejected();
+      editing.value = false;
+      return;
+    }
+    next = parsed;
+  } else if (type.value === "boolean") {
+    next = editValue.value === "true";
+  }
+  if (next !== props.value) props.onEdit(path.value, next);
+  editing.value = false;
+}
+function cancelEdit() {
+  editing.value = false;
+  editRejected.value = false;
+}
+function toggleBoolean(checked) {
+  if (!isEditableLeaf.value || props.onEdit === void 0) return;
+  props.onEdit(path.value, checked);
+}
+const ownKey = computed(() => JSON.stringify(path.value));
+const isSelected = computed(
+  () => props.selectedKey !== null && props.selectedKey !== void 0 && props.selectedKey === ownKey.value
+);
+function selectThisPath() {
+  if (props.onSelectPath === void 0) return;
+  props.onSelectPath(path.value);
+}
+</script>
+
+<template>
+  <div class="tree-node">
+    <template v-if="isLeaf">
+      <div class="row" :class="{ 'edit-rejected': editRejected, 'row-selected': isSelected }">
+        <span
+          v-if="label"
+          class="key"
+          :class="{ 'key-selectable': onSelectPath !== void 0, 'key-selected': isSelected }"
+          @click.stop="selectThisPath"
+          >{{ label }}:</span
+        >
+        <template v-if="editing && (type === 'string' || type === 'number')">
+          <input
+            ref="editInput"
+            v-model="editValue"
+            class="leaf-input"
+            :type="type === 'number' ? 'text' : 'text'"
+            :inputmode="type === 'number' ? 'decimal' : 'text'"
+            @keydown.enter.prevent="commitEdit"
+            @keydown.escape.prevent="cancelEdit"
+            @blur="commitEdit"
+          />
+        </template>
+        <template v-else-if="isEditableLeaf && type === 'boolean'">
+          <label class="leaf-bool">
+            <input
+              type="checkbox"
+              :checked="value"
+              @change="toggleBoolean($event.target.checked)"
+            />
+            <span class="leaf leaf-boolean">{{ formatted }}</span>
+          </label>
+        </template>
+        <template v-else>
+          <span
+            class="leaf"
+            :class="[`leaf-${type}`, { 'leaf-editable': isEditableLeaf }]"
+            :title="isEditableLeaf ? 'Click to edit' : void 0"
+            @click="isEditableLeaf ? startEdit() : null"
+          >
+            {{ formatted }}
+          </span>
+        </template>
+      </div>
+    </template>
+    <template v-else>
+      <div class="row branch" :class="{ 'row-selected': isSelected }" @click="expanded = !expanded">
+        <span class="caret" :class="{ open: expanded }">›</span>
+        <span
+          v-if="label"
+          class="key"
+          :class="{ 'key-selectable': onSelectPath !== void 0, 'key-selected': isSelected }"
+          @click.stop="selectThisPath"
+          >{{ label }}:</span
+        >
+        <span class="branch-summary">{{ summary }}</span>
+      </div>
+      <div v-if="expanded" class="children">
+        <DevtoolsValueTree
+          v-for="[k, v] in entries"
+          :key="k"
+          :value="v"
+          :label="k"
+          :depth="depth + 1"
+          :path="childPath(k)"
+          :editable="editable"
+          :on-edit="onEdit"
+          :selected-key="selectedKey"
+          :on-select-path="onSelectPath"
+        />
+      </div>
+    </template>
+  </div>
+</template>
+
+<style scoped>
+.tree-node{font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace;font-size:12px;line-height:1.6}.row{align-items:baseline;display:flex;gap:.4em;padding:1px 0}.branch{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.branch:hover{background:var(--atf-row-hover,hsla(0,0%,100%,.04))}.caret{color:var(--atf-muted,#64748b);display:inline-block;transform:rotate(0deg);transition:transform .12s ease;width:.7em}.caret.open{transform:rotate(90deg)}.key{color:var(--atf-key,#93c5fd);flex-shrink:0}.key-selectable{border-bottom:1px dotted transparent;cursor:pointer}.key-selectable:hover{border-bottom-color:var(--atf-key,#93c5fd)}.key-selected{border-bottom-color:var(--atf-accent,#5b8def);color:var(--atf-accent,#5b8def);font-weight:600}.row-selected{background:rgba(91,141,239,.08);border-radius:3px;margin:0 -.4em;padding:1px .4em}.leaf-string{color:var(--atf-string,#86efac)}.leaf-number{color:var(--atf-number,#fbbf24)}.leaf-boolean{color:var(--atf-boolean,#f472b6)}.leaf-null,.leaf-undefined{font-style:italic}.branch-summary,.leaf-null,.leaf-undefined{color:var(--atf-muted,#64748b)}.children{border-left:1px dashed var(--atf-border,hsla(0,0%,100%,.08));margin-left:.3em;padding-left:1.4em}.leaf-editable{border-bottom:1px dotted transparent;cursor:text;transition:border-color .12s ease}.leaf-editable:hover{border-bottom-color:var(--atf-muted,#64748b)}.leaf-input{background:var(--atf-bg,#0f172a);border:1px solid var(--atf-accent,#5b8def);border-radius:3px;color:var(--atf-fg,#e2e8f0);flex:1;font:inherit;min-width:8em;outline:none;padding:.05em .4em}.leaf-bool{align-items:center;cursor:pointer;display:inline-flex;gap:.4em}.leaf-bool input{cursor:pointer;margin:0}.edit-rejected{animation:atf-shake .4s ease}@keyframes atf-shake{0%,to{transform:translateX(0)}20%,60%{transform:translateX(-3px)}40%,80%{transform:translateX(3px)}}
+</style>

package/dist/runtime/components/DevtoolsValueTree.vue.d.ts

@@ -0,0 +1,37 @@
+type __VLS_Props = {
+    value: unknown;
+    label?: string;
+    depth?: number;
+    /**
+     * Path-from-root for this node. Used by edit-aware mounts so the
+     * commit handler knows which leaf the user just touched. Default
+     * `[]` for non-editable mounts; the panel passes the explicit path
+     * when it wires up `onEdit`.
+     */
+    path?: ReadonlyArray<string | number>;
+    /**
+     * Edit-mode toggle. When `true` and `onEdit` is wired, leaf cells
+     * become click-to-edit. Sensitive (redacted) leaves stay read-only
+     * regardless — overwriting with the literal `[redacted]` string
+     * would destroy the real value.
+     */
+    editable?: boolean | undefined;
+    onEdit?: ((path: ReadonlyArray<string | number>, next: unknown) => void) | undefined;
+    /**
+     * Canonical JSON-array key of the currently-selected path (`null`
+     * for no selection). Compared against this node's own key so the
+     * key label can render in a highlighted state. Plumbed as a key
+     * rather than a path array because string equality is cheap and
+     * cross-renders consistently.
+     */
+    selectedKey?: string | null | undefined;
+    /**
+     * Click handler for the key label. Called with the node's current
+     * path-from-root; the panel toggles selection on identical paths.
+     * When omitted, the key label is plain text (no selection UX).
+     */
+    onSelectPath?: ((path: ReadonlyArray<string | number>) => void) | undefined;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/plugins/attaform.cjs

@@ -1,8 +1,8 @@
 'use strict';
 
 const app = require('nuxt/app');
-const plugin = require('../../shared/attaform.Dee2rU1P.cjs');
-const serialize = require('../../shared/attaform.C8LVFVVe.cjs');
+const devtoolsShared = require('../../shared/attaform.5UhpSVFI.cjs');
+const paths = require('../../shared/attaform.BqK_L4gK.cjs');
 
 var attaform_default = app.defineNuxtPlugin({
   // `enforce: 'pre'` makes the "we run before any component's setup" claim
@@ -13,17 +13,28 @@ var attaform_default = app.defineNuxtPlugin({
   enforce: "pre",
   setup(nuxtApp) {
     const isServer = undefined;
-    const { defaults } = app.useRuntimeConfig().public.attaform;
-    nuxtApp.vueApp.use(plugin.createAttaform({ ssr: isServer, defaults }));
+    const config = app.useRuntimeConfig().public;
+    const { defaults, version } = config.attaform;
+    nuxtApp.vueApp.use(paths.createAttaform({ ssr: isServer, defaults }));
+    nuxtApp.vueApp.provide(paths.kAttaformWizardActiveStepResolver, (param) => {
+      const value = app.useRoute().query[param];
+      if (typeof value === "string") return value;
+      if (Array.isArray(value) && typeof value[0] === "string") return value[0];
+      return void 0;
+    });
     if (isServer) {
       nuxtApp.hook("app:rendered", () => {
-        const state = serialize.renderAttaformState(nuxtApp.vueApp);
+        const state = devtoolsShared.renderAttaformState(nuxtApp.vueApp);
         nuxtApp.payload.attaform = state;
       });
     } else {
       const serialized = nuxtApp.payload.attaform;
       if (serialized !== void 0) {
-        serialize.hydrateAttaformState(nuxtApp.vueApp, serialized);
+        devtoolsShared.hydrateAttaformState(nuxtApp.vueApp, serialized);
+      }
+      if (undefined) {
+        const registry = paths.getRegistryFromApp(nuxtApp.vueApp);
+        window[devtoolsShared.DEVTOOLS_WINDOW_KEY] = { registry, version };
       }
     }
   }

package/dist/runtime/plugins/attaform.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"attaform.cjs","sources":["../../../src/runtime/plugins/attaform.ts"],"sourcesContent":["/**\n * Nuxt plugin: installs the framework-agnostic createAttaform Vue\n * plugin on nuxtApp.vueApp and wires the Nuxt payload mechanism to the\n * registry's SSR serialization helpers. Replaces the old split of\n * register.ts (client-only) + register-stub.ts (server-only).\n *\n * Runs on BOTH server and client — Vue's SSR renderer is a natural no-op\n * for directive lifecycle hooks, so the same plugin works on both sides\n * without a stub.\n */\nimport { defineNuxtPlugin, useRuntimeConfig } from 'nuxt/app'\nimport { createAttaform } from '../core/plugin'\nimport { hydrateAttaformState, renderAttaformState } from '../core/serialize'\nimport type { SerializedAttaformState } from '../core/serialize'\nimport type { AttaformDefaults } from '../types/types-api'\n\nexport default defineNuxtPlugin({\n  // `enforce: 'pre'` makes the \"we run before any component's setup\" claim\n  // explicit. Combined with `prepend: true` on the addPlugin call in\n  // src/nuxt.ts, this guarantees hydration is staged into pendingHydration\n  // before any user plugin or page can call `useForm`. Without it, a user\n  // plugin running first would observe an empty registry and skip hydration.\n  enforce: 'pre',\n  setup(nuxtApp) {\n    const isServer = import.meta.server\n\n    // Read app-level defaults from the Nuxt module's runtime-config slot\n    // (populated in src/nuxt.ts). The module ships in the same package\n    // as this plugin, so the slot is always present and well-typed.\n    const { defaults } = (useRuntimeConfig().public as { attaform: { defaults: AttaformDefaults } })\n      .attaform\n\n    nuxtApp.vueApp.use(createAttaform({ ssr: isServer, defaults }))\n\n    if (isServer) {\n      // After the app renders, capture every FormStore into the Nuxt payload\n      // so the client can hydrate with matching form values and errors.\n      nuxtApp.hook('app:rendered', () => {\n        const state = renderAttaformState(nuxtApp.vueApp)\n        ;(nuxtApp.payload as unknown as { attaform?: SerializedAttaformState }).attaform = state\n      })\n    } else {\n      // Stage the payload into pendingHydration so `useForm` finds it. The\n      // `enforce: 'pre'` + `prepend: true` pair above is what makes it safe\n      // to assume this runs before any user setup.\n      const serialized = (nuxtApp.payload as unknown as { attaform?: SerializedAttaformState })\n        .attaform\n      if (serialized !== undefined) {\n        hydrateAttaformState(nuxtApp.vueApp, serialized)\n      }\n    }\n  },\n})\n"],"names":["defineNuxtPlugin","useRuntimeConfig","createAttaform","renderAttaformState","hydrateAttaformState"],"mappings":";;;;;;AAgBA,IAAO,mBAAQA,oBAAA,CAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAM9B,OAAA,EAAS,KAAA;AAAA,EACT,MAAM,OAAA,EAAS;AACb,IAAA,MAAM,WAAW,SAAY;AAK7B,IAAA,MAAM,EAAE,QAAA,EAAS,GAAKC,oBAAA,GAAmB,MAAA,CACtC,QAAA;AAEH,IAAA,OAAA,CAAQ,MAAA,CAAO,IAAIC,qBAAA,CAAe,EAAE,KAAK,QAAA,EAAU,QAAA,EAAU,CAAC,CAAA;AAE9D,IAAA,IAAI,QAAA,EAAU;AAGZ,MAAA,OAAA,CAAQ,IAAA,CAAK,gBAAgB,MAAM;AACjC,QAAA,MAAM,KAAA,GAAQC,6BAAA,CAAoB,OAAA,CAAQ,MAAM,CAAA;AAC/C,QAAC,OAAA,CAAQ,QAA8D,QAAA,GAAW,KAAA;AAAA,MACrF,CAAC,CAAA;AAAA,IACH,CAAA,MAAO;AAIL,MAAA,MAAM,UAAA,GAAc,QAAQ,OAAA,CACzB,QAAA;AACH,MAAA,IAAI,eAAe,MAAA,EAAW;AAC5B,QAAAC,8BAAA,CAAqB,OAAA,CAAQ,QAAQ,UAAU,CAAA;AAAA,MACjD;AAAA,IACF;AAAA,EACF;AACF,CAAC;;;;"}
+{"version":3,"file":"attaform.cjs","sources":["../../../src/runtime/plugins/attaform.ts"],"sourcesContent":["/**\n * Nuxt plugin: installs the framework-agnostic createAttaform Vue\n * plugin on nuxtApp.vueApp and wires the Nuxt payload mechanism to the\n * registry's SSR serialization helpers. Replaces the old split of\n * register.ts (client-only) + register-stub.ts (server-only).\n *\n * Runs on BOTH server and client — Vue's SSR renderer is a natural no-op\n * for directive lifecycle hooks, so the same plugin works on both sides\n * without a stub.\n */\nimport { defineNuxtPlugin, useRoute, useRuntimeConfig } from 'nuxt/app'\nimport { DEVTOOLS_WINDOW_KEY } from '../core/devtools-shared'\nimport { createAttaform } from '../core/plugin'\nimport { getRegistryFromApp, kAttaformWizardActiveStepResolver } from '../core/registry'\nimport { hydrateAttaformState, renderAttaformState } from '../core/serialize'\nimport type { SerializedAttaformState } from '../core/serialize'\nimport type { AttaformDefaults } from '../types/types-api'\n\nexport default defineNuxtPlugin({\n  // `enforce: 'pre'` makes the \"we run before any component's setup\" claim\n  // explicit. Combined with `prepend: true` on the addPlugin call in\n  // src/nuxt.ts, this guarantees hydration is staged into pendingHydration\n  // before any user plugin or page can call `useForm`. Without it, a user\n  // plugin running first would observe an empty registry and skip hydration.\n  enforce: 'pre',\n  setup(nuxtApp) {\n    const isServer = import.meta.server\n\n    // Read app-level defaults from the Nuxt module's runtime-config slot\n    // (populated in src/nuxt.ts). The module ships in the same package\n    // as this plugin, so the slot is always present and well-typed.\n    const config = useRuntimeConfig().public as {\n      attaform: { defaults: AttaformDefaults; version: string }\n    }\n    const { defaults, version } = config.attaform\n\n    nuxtApp.vueApp.use(createAttaform({ ssr: isServer, defaults }))\n\n    // Bridge `useWizard`'s active-step resolution to the Nuxt route so\n    // deep-links hydrate without flicker. On the server, `useRoute()`\n    // reads the incoming request URL; on the client, it reads the live\n    // route — so server and client compute the same initial step and\n    // Vue's hydration walks a matching tree. Without this bridge, the\n    // wizard would fall back to its first step on the server while the\n    // client reads the URL, producing the deep-link mismatch cascade.\n    // Consumers can still pass `options.restore` explicitly to override;\n    // this just removes the boilerplate for the common case.\n    nuxtApp.vueApp.provide(kAttaformWizardActiveStepResolver, (param) => {\n      const value = useRoute().query[param]\n      if (typeof value === 'string') return value\n      if (Array.isArray(value) && typeof value[0] === 'string') return value[0]\n      return undefined\n    })\n\n    if (isServer) {\n      // After the app renders, capture every FormStore into the Nuxt payload\n      // so the client can hydrate with matching form values and errors.\n      nuxtApp.hook('app:rendered', () => {\n        const state = renderAttaformState(nuxtApp.vueApp)\n        ;(nuxtApp.payload as unknown as { attaform?: SerializedAttaformState }).attaform = state\n      })\n    } else {\n      // Stage the payload into pendingHydration so `useForm` finds it. The\n      // `enforce: 'pre'` + `prepend: true` pair above is what makes it safe\n      // to assume this runs before any user setup.\n      const serialized = (nuxtApp.payload as unknown as { attaform?: SerializedAttaformState })\n        .attaform\n      if (serialized !== undefined) {\n        hydrateAttaformState(nuxtApp.vueApp, serialized)\n      }\n\n      // Dev-only: attach the registry to window so the Nuxt DevTools overlay\n      // panel (which runs in an iframe at /_attaform_devtools) can reach it\n      // via `window.parent.__attaform_devtools__`. The bridge holds a live\n      // reference to the registry — Vue's reactivity flows across the\n      // same-origin iframe boundary, so the panel re-renders on every form\n      // mutation without an explicit push channel. `import.meta.dev` is\n      // statically replaced by Nuxt at build time, so this whole branch is\n      // tree-shaken from production builds.\n      if (import.meta.dev) {\n        const registry = getRegistryFromApp(nuxtApp.vueApp)\n        window[DEVTOOLS_WINDOW_KEY] = { registry, version }\n      }\n    }\n  },\n})\n"],"names":["defineNuxtPlugin","useRuntimeConfig","createAttaform","kAttaformWizardActiveStepResolver","useRoute","renderAttaformState","hydrateAttaformState","getRegistryFromApp","DEVTOOLS_WINDOW_KEY"],"mappings":";;;;;;AAkBA,IAAO,mBAAQA,oBAAA,CAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAM9B,OAAA,EAAS,KAAA;AAAA,EACT,MAAM,OAAA,EAAS;AACb,IAAA,MAAM,WAAW,SAAY;AAK7B,IAAA,MAAM,MAAA,GAASC,sBAAiB,CAAE,MAAA;AAGlC,IAAA,MAAM,EAAE,QAAA,EAAU,OAAA,EAAQ,GAAI,MAAA,CAAO,QAAA;AAErC,IAAA,OAAA,CAAQ,MAAA,CAAO,IAAIC,oBAAA,CAAe,EAAE,KAAK,QAAA,EAAU,QAAA,EAAU,CAAC,CAAA;AAW9D,IAAA,OAAA,CAAQ,MAAA,CAAO,OAAA,CAAQC,uCAAA,EAAmC,CAAC,KAAA,KAAU;AACnE,MAAA,MAAM,KAAA,GAAQC,YAAA,EAAS,CAAE,KAAA,CAAM,KAAK,CAAA;AACpC,MAAA,IAAI,OAAO,KAAA,KAAU,QAAA,EAAU,OAAO,KAAA;AACtC,MAAA,IAAI,KAAA,CAAM,OAAA,CAAQ,KAAK,CAAA,IAAK,OAAO,KAAA,CAAM,CAAC,CAAA,KAAM,QAAA,EAAU,OAAO,KAAA,CAAM,CAAC,CAAA;AACxE,MAAA,OAAO,MAAA;AAAA,IACT,CAAC,CAAA;AAED,IAAA,IAAI,QAAA,EAAU;AAGZ,MAAA,OAAA,CAAQ,IAAA,CAAK,gBAAgB,MAAM;AACjC,QAAA,MAAM,KAAA,GAAQC,kCAAA,CAAoB,OAAA,CAAQ,MAAM,CAAA;AAC/C,QAAC,OAAA,CAAQ,QAA8D,QAAA,GAAW,KAAA;AAAA,MACrF,CAAC,CAAA;AAAA,IACH,CAAA,MAAO;AAIL,MAAA,MAAM,UAAA,GAAc,QAAQ,OAAA,CACzB,QAAA;AACH,MAAA,IAAI,eAAe,MAAA,EAAW;AAC5B,QAAAC,mCAAA,CAAqB,OAAA,CAAQ,QAAQ,UAAU,CAAA;AAAA,MACjD;AAUA,MAAA,IAAI,SAAY,EAAK;AACnB,QAAA,MAAM,QAAA,GAAWC,wBAAA,CAAmB,OAAA,CAAQ,MAAM,CAAA;AAClD,QAAA,MAAA,CAAOC,kCAAmB,CAAA,GAAI,EAAE,QAAA,EAAU,OAAA,EAAQ;AAAA,MACpD;AAAA,IACF;AAAA,EACF;AACF,CAAC;;;;"}

package/dist/runtime/plugins/attaform.mjs

@@ -1,6 +1,6 @@
-import { defineNuxtPlugin, useRuntimeConfig } from 'nuxt/app';
-import { c as createAttaform } from '../../shared/attaform.CIEQgJnM.mjs';
-import { r as renderAttaformState, h as hydrateAttaformState } from '../../shared/attaform.Vo-Kft0t.mjs';
+import { defineNuxtPlugin, useRuntimeConfig, useRoute } from 'nuxt/app';
+import { r as renderAttaformState, h as hydrateAttaformState, D as DEVTOOLS_WINDOW_KEY } from '../../shared/attaform.BDdFdjeX.mjs';
+import { c as createAttaform, k as kAttaformWizardActiveStepResolver, g as getRegistryFromApp } from '../../shared/attaform.Xhg0AYNa.mjs';
 
 var attaform_default = defineNuxtPlugin({
   // `enforce: 'pre'` makes the "we run before any component's setup" claim
@@ -11,8 +11,15 @@ var attaform_default = defineNuxtPlugin({
   enforce: "pre",
   setup(nuxtApp) {
     const isServer = import.meta.server;
-    const { defaults } = useRuntimeConfig().public.attaform;
+    const config = useRuntimeConfig().public;
+    const { defaults, version } = config.attaform;
     nuxtApp.vueApp.use(createAttaform({ ssr: isServer, defaults }));
+    nuxtApp.vueApp.provide(kAttaformWizardActiveStepResolver, (param) => {
+      const value = useRoute().query[param];
+      if (typeof value === "string") return value;
+      if (Array.isArray(value) && typeof value[0] === "string") return value[0];
+      return void 0;
+    });
     if (isServer) {
       nuxtApp.hook("app:rendered", () => {
         const state = renderAttaformState(nuxtApp.vueApp);
@@ -23,6 +30,10 @@ var attaform_default = defineNuxtPlugin({
       if (serialized !== void 0) {
         hydrateAttaformState(nuxtApp.vueApp, serialized);
       }
+      if (import.meta.dev) {
+        const registry = getRegistryFromApp(nuxtApp.vueApp);
+        window[DEVTOOLS_WINDOW_KEY] = { registry, version };
+      }
     }
   }
 });

package/dist/runtime/plugins/attaform.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"attaform.mjs","sources":["../../../src/runtime/plugins/attaform.ts"],"sourcesContent":["/**\n * Nuxt plugin: installs the framework-agnostic createAttaform Vue\n * plugin on nuxtApp.vueApp and wires the Nuxt payload mechanism to the\n * registry's SSR serialization helpers. Replaces the old split of\n * register.ts (client-only) + register-stub.ts (server-only).\n *\n * Runs on BOTH server and client — Vue's SSR renderer is a natural no-op\n * for directive lifecycle hooks, so the same plugin works on both sides\n * without a stub.\n */\nimport { defineNuxtPlugin, useRuntimeConfig } from 'nuxt/app'\nimport { createAttaform } from '../core/plugin'\nimport { hydrateAttaformState, renderAttaformState } from '../core/serialize'\nimport type { SerializedAttaformState } from '../core/serialize'\nimport type { AttaformDefaults } from '../types/types-api'\n\nexport default defineNuxtPlugin({\n  // `enforce: 'pre'` makes the \"we run before any component's setup\" claim\n  // explicit. Combined with `prepend: true` on the addPlugin call in\n  // src/nuxt.ts, this guarantees hydration is staged into pendingHydration\n  // before any user plugin or page can call `useForm`. Without it, a user\n  // plugin running first would observe an empty registry and skip hydration.\n  enforce: 'pre',\n  setup(nuxtApp) {\n    const isServer = import.meta.server\n\n    // Read app-level defaults from the Nuxt module's runtime-config slot\n    // (populated in src/nuxt.ts). The module ships in the same package\n    // as this plugin, so the slot is always present and well-typed.\n    const { defaults } = (useRuntimeConfig().public as { attaform: { defaults: AttaformDefaults } })\n      .attaform\n\n    nuxtApp.vueApp.use(createAttaform({ ssr: isServer, defaults }))\n\n    if (isServer) {\n      // After the app renders, capture every FormStore into the Nuxt payload\n      // so the client can hydrate with matching form values and errors.\n      nuxtApp.hook('app:rendered', () => {\n        const state = renderAttaformState(nuxtApp.vueApp)\n        ;(nuxtApp.payload as unknown as { attaform?: SerializedAttaformState }).attaform = state\n      })\n    } else {\n      // Stage the payload into pendingHydration so `useForm` finds it. The\n      // `enforce: 'pre'` + `prepend: true` pair above is what makes it safe\n      // to assume this runs before any user setup.\n      const serialized = (nuxtApp.payload as unknown as { attaform?: SerializedAttaformState })\n        .attaform\n      if (serialized !== undefined) {\n        hydrateAttaformState(nuxtApp.vueApp, serialized)\n      }\n    }\n  },\n})\n"],"names":[],"mappings":";;;;AAgBA,IAAO,mBAAQ,gBAAA,CAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAM9B,OAAA,EAAS,KAAA;AAAA,EACT,MAAM,OAAA,EAAS;AACb,IAAA,MAAM,WAAW,MAAA,CAAA,IAAA,CAAY,MAAA;AAK7B,IAAA,MAAM,EAAE,QAAA,EAAS,GAAK,gBAAA,GAAmB,MAAA,CACtC,QAAA;AAEH,IAAA,OAAA,CAAQ,MAAA,CAAO,IAAI,cAAA,CAAe,EAAE,KAAK,QAAA,EAAU,QAAA,EAAU,CAAC,CAAA;AAE9D,IAAA,IAAI,QAAA,EAAU;AAGZ,MAAA,OAAA,CAAQ,IAAA,CAAK,gBAAgB,MAAM;AACjC,QAAA,MAAM,KAAA,GAAQ,mBAAA,CAAoB,OAAA,CAAQ,MAAM,CAAA;AAC/C,QAAC,OAAA,CAAQ,QAA8D,QAAA,GAAW,KAAA;AAAA,MACrF,CAAC,CAAA;AAAA,IACH,CAAA,MAAO;AAIL,MAAA,MAAM,UAAA,GAAc,QAAQ,OAAA,CACzB,QAAA;AACH,MAAA,IAAI,eAAe,MAAA,EAAW;AAC5B,QAAA,oBAAA,CAAqB,OAAA,CAAQ,QAAQ,UAAU,CAAA;AAAA,MACjD;AAAA,IACF;AAAA,EACF;AACF,CAAC;;;;"}
+{"version":3,"file":"attaform.mjs","sources":["../../../src/runtime/plugins/attaform.ts"],"sourcesContent":["/**\n * Nuxt plugin: installs the framework-agnostic createAttaform Vue\n * plugin on nuxtApp.vueApp and wires the Nuxt payload mechanism to the\n * registry's SSR serialization helpers. Replaces the old split of\n * register.ts (client-only) + register-stub.ts (server-only).\n *\n * Runs on BOTH server and client — Vue's SSR renderer is a natural no-op\n * for directive lifecycle hooks, so the same plugin works on both sides\n * without a stub.\n */\nimport { defineNuxtPlugin, useRoute, useRuntimeConfig } from 'nuxt/app'\nimport { DEVTOOLS_WINDOW_KEY } from '../core/devtools-shared'\nimport { createAttaform } from '../core/plugin'\nimport { getRegistryFromApp, kAttaformWizardActiveStepResolver } from '../core/registry'\nimport { hydrateAttaformState, renderAttaformState } from '../core/serialize'\nimport type { SerializedAttaformState } from '../core/serialize'\nimport type { AttaformDefaults } from '../types/types-api'\n\nexport default defineNuxtPlugin({\n  // `enforce: 'pre'` makes the \"we run before any component's setup\" claim\n  // explicit. Combined with `prepend: true` on the addPlugin call in\n  // src/nuxt.ts, this guarantees hydration is staged into pendingHydration\n  // before any user plugin or page can call `useForm`. Without it, a user\n  // plugin running first would observe an empty registry and skip hydration.\n  enforce: 'pre',\n  setup(nuxtApp) {\n    const isServer = import.meta.server\n\n    // Read app-level defaults from the Nuxt module's runtime-config slot\n    // (populated in src/nuxt.ts). The module ships in the same package\n    // as this plugin, so the slot is always present and well-typed.\n    const config = useRuntimeConfig().public as {\n      attaform: { defaults: AttaformDefaults; version: string }\n    }\n    const { defaults, version } = config.attaform\n\n    nuxtApp.vueApp.use(createAttaform({ ssr: isServer, defaults }))\n\n    // Bridge `useWizard`'s active-step resolution to the Nuxt route so\n    // deep-links hydrate without flicker. On the server, `useRoute()`\n    // reads the incoming request URL; on the client, it reads the live\n    // route — so server and client compute the same initial step and\n    // Vue's hydration walks a matching tree. Without this bridge, the\n    // wizard would fall back to its first step on the server while the\n    // client reads the URL, producing the deep-link mismatch cascade.\n    // Consumers can still pass `options.restore` explicitly to override;\n    // this just removes the boilerplate for the common case.\n    nuxtApp.vueApp.provide(kAttaformWizardActiveStepResolver, (param) => {\n      const value = useRoute().query[param]\n      if (typeof value === 'string') return value\n      if (Array.isArray(value) && typeof value[0] === 'string') return value[0]\n      return undefined\n    })\n\n    if (isServer) {\n      // After the app renders, capture every FormStore into the Nuxt payload\n      // so the client can hydrate with matching form values and errors.\n      nuxtApp.hook('app:rendered', () => {\n        const state = renderAttaformState(nuxtApp.vueApp)\n        ;(nuxtApp.payload as unknown as { attaform?: SerializedAttaformState }).attaform = state\n      })\n    } else {\n      // Stage the payload into pendingHydration so `useForm` finds it. The\n      // `enforce: 'pre'` + `prepend: true` pair above is what makes it safe\n      // to assume this runs before any user setup.\n      const serialized = (nuxtApp.payload as unknown as { attaform?: SerializedAttaformState })\n        .attaform\n      if (serialized !== undefined) {\n        hydrateAttaformState(nuxtApp.vueApp, serialized)\n      }\n\n      // Dev-only: attach the registry to window so the Nuxt DevTools overlay\n      // panel (which runs in an iframe at /_attaform_devtools) can reach it\n      // via `window.parent.__attaform_devtools__`. The bridge holds a live\n      // reference to the registry — Vue's reactivity flows across the\n      // same-origin iframe boundary, so the panel re-renders on every form\n      // mutation without an explicit push channel. `import.meta.dev` is\n      // statically replaced by Nuxt at build time, so this whole branch is\n      // tree-shaken from production builds.\n      if (import.meta.dev) {\n        const registry = getRegistryFromApp(nuxtApp.vueApp)\n        window[DEVTOOLS_WINDOW_KEY] = { registry, version }\n      }\n    }\n  },\n})\n"],"names":[],"mappings":";;;;AAkBA,IAAO,mBAAQ,gBAAA,CAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAM9B,OAAA,EAAS,KAAA;AAAA,EACT,MAAM,OAAA,EAAS;AACb,IAAA,MAAM,WAAW,MAAA,CAAA,IAAA,CAAY,MAAA;AAK7B,IAAA,MAAM,MAAA,GAAS,kBAAiB,CAAE,MAAA;AAGlC,IAAA,MAAM,EAAE,QAAA,EAAU,OAAA,EAAQ,GAAI,MAAA,CAAO,QAAA;AAErC,IAAA,OAAA,CAAQ,MAAA,CAAO,IAAI,cAAA,CAAe,EAAE,KAAK,QAAA,EAAU,QAAA,EAAU,CAAC,CAAA;AAW9D,IAAA,OAAA,CAAQ,MAAA,CAAO,OAAA,CAAQ,iCAAA,EAAmC,CAAC,KAAA,KAAU;AACnE,MAAA,MAAM,KAAA,GAAQ,QAAA,EAAS,CAAE,KAAA,CAAM,KAAK,CAAA;AACpC,MAAA,IAAI,OAAO,KAAA,KAAU,QAAA,EAAU,OAAO,KAAA;AACtC,MAAA,IAAI,KAAA,CAAM,OAAA,CAAQ,KAAK,CAAA,IAAK,OAAO,KAAA,CAAM,CAAC,CAAA,KAAM,QAAA,EAAU,OAAO,KAAA,CAAM,CAAC,CAAA;AACxE,MAAA,OAAO,MAAA;AAAA,IACT,CAAC,CAAA;AAED,IAAA,IAAI,QAAA,EAAU;AAGZ,MAAA,OAAA,CAAQ,IAAA,CAAK,gBAAgB,MAAM;AACjC,QAAA,MAAM,KAAA,GAAQ,mBAAA,CAAoB,OAAA,CAAQ,MAAM,CAAA;AAC/C,QAAC,OAAA,CAAQ,QAA8D,QAAA,GAAW,KAAA;AAAA,MACrF,CAAC,CAAA;AAAA,IACH,CAAA,MAAO;AAIL,MAAA,MAAM,UAAA,GAAc,QAAQ,OAAA,CACzB,QAAA;AACH,MAAA,IAAI,eAAe,MAAA,EAAW;AAC5B,QAAA,oBAAA,CAAqB,OAAA,CAAQ,QAAQ,UAAU,CAAA;AAAA,MACjD;AAUA,MAAA,IAAI,YAAY,GAAA,EAAK;AACnB,QAAA,MAAM,QAAA,GAAW,kBAAA,CAAmB,OAAA,CAAQ,MAAM,CAAA;AAClD,QAAA,MAAA,CAAO,mBAAmB,CAAA,GAAI,EAAE,QAAA,EAAU,OAAA,EAAQ;AAAA,MACpD;AAAA,IACF;AAAA,EACF;AACF,CAAC;;;;"}

package/dist/shared/attaform.5UhpSVFI.cjs

@@ -0,0 +1,63 @@
+'use strict';
+
+const paths = require('./attaform.BqK_L4gK.cjs');
+
+function renderAttaformState(app) {
+  const registry = paths.getRegistryFromApp(app);
+  const forms = [];
+  for (const [key, state] of registry.forms) {
+    const transientList = [];
+    for (const pk of state.blankPaths) {
+      const d = paths.pathKeyToDotted(pk);
+      if (d !== null) transientList.push(d);
+    }
+    forms.push([
+      key,
+      {
+        form: state.form.value,
+        schemaErrors: Array.from(state.schemaErrors.entries()),
+        userErrors: Array.from(state.userErrors.entries()),
+        fields: Array.from(state.fields.entries()),
+        ...transientList.length > 0 ? { blankPaths: transientList } : {}
+      }
+    ]);
+  }
+  return { forms };
+}
+function hydrateAttaformState(app, payload) {
+  const registry = paths.getRegistryFromApp(app);
+  for (const [key, data] of payload.forms) {
+    registry.pendingHydration.set(key, data);
+  }
+}
+
+const REDACTED = "[redacted]";
+function redactSensitiveLeaves(value, matchSensitive) {
+  return redactImpl(value, false, matchSensitive);
+}
+function redactImpl(value, inSensitiveSubtree, matchSensitive) {
+  if (value === null || value === void 0) return value;
+  if (typeof value !== "object") {
+    return inSensitiveSubtree ? REDACTED : value;
+  }
+  if (Array.isArray(value)) {
+    return value.map((item) => redactImpl(item, inSensitiveSubtree, matchSensitive));
+  }
+  if (Object.prototype.toString.call(value) !== "[object Object]") {
+    return inSensitiveSubtree ? REDACTED : value;
+  }
+  const out = {};
+  for (const key of Object.keys(value)) {
+    const childSensitive = inSensitiveSubtree || matchSensitive(key);
+    out[key] = redactImpl(value[key], childSensitive, matchSensitive);
+  }
+  return out;
+}
+const DEVTOOLS_WINDOW_KEY = "__attaform_devtools__";
+
+exports.DEVTOOLS_WINDOW_KEY = DEVTOOLS_WINDOW_KEY;
+exports.REDACTED = REDACTED;
+exports.hydrateAttaformState = hydrateAttaformState;
+exports.redactSensitiveLeaves = redactSensitiveLeaves;
+exports.renderAttaformState = renderAttaformState;
+//# sourceMappingURL=attaform.5UhpSVFI.cjs.map

package/dist/shared/attaform.5UhpSVFI.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"attaform.5UhpSVFI.cjs","sources":["../../src/runtime/core/serialize.ts","../../src/runtime/core/devtools-shared.ts"],"sourcesContent":["import type { App } from 'vue'\nimport type { FormKey } from '../types/types-api'\nimport { pathKeyToDotted, type PathKey } from './paths'\nimport { getRegistryFromApp, type SerializedFormData } from './registry'\n\n/**\n * Serialised snapshot of every form in a Vue app, produced by\n * `renderAttaformState` and consumed by `hydrateAttaformState`.\n *\n * JSON-safe — pass to `JSON.stringify`, `devalue`, or any other\n * serialiser before embedding in your SSR payload.\n */\nexport type SerializedAttaformState = {\n  /** Tuples of `[formKey, snapshot]` for every form in the app. */\n  readonly forms: ReadonlyArray<readonly [FormKey, SerializedFormData]>\n}\n\n/**\n * Snapshot every form on a Vue app for SSR. Call from your server\n * entry after rendering the app:\n *\n * ```ts\n * import { renderToString } from '@vue/server-renderer'\n * import { renderAttaformState, escapeForInlineScript } from 'attaform'\n *\n * const html = await renderToString(app)\n * const state = renderAttaformState(app)\n * const payload = escapeForInlineScript(JSON.stringify(state))\n *\n * return `\n *   ${html}\n *   <script>window.__ATTAFORM_STATE__ = ${payload}</script>\n * `\n * ```\n *\n * Pair with `hydrateAttaformState` on the client to restore the\n * forms in their server-rendered state. Nuxt users don't need this —\n * `attaform/nuxt` wires SSR automatically.\n */\nexport function renderAttaformState(app: App): SerializedAttaformState {\n  const registry = getRegistryFromApp(app)\n  const forms: Array<readonly [FormKey, SerializedFormData]> = []\n  for (const [key, state] of registry.forms) {\n    // Skip the blank field when the set is empty so the\n    // wire payload stays minimal for forms that don't use it. The\n    // optional shape on the consuming side handles the absence\n    // cleanly (defaults to \"no blank paths\"). PathKey → dotted at\n    // the boundary so the wire shape matches the rest of the\n    // public path notation.\n    const transientList: string[] = []\n    for (const pk of state.blankPaths) {\n      const d = pathKeyToDotted(pk as PathKey)\n      if (d !== null) transientList.push(d)\n    }\n    forms.push([\n      key,\n      {\n        form: state.form.value,\n        schemaErrors: Array.from(state.schemaErrors.entries()),\n        userErrors: Array.from(state.userErrors.entries()),\n        fields: Array.from(state.fields.entries()),\n        ...(transientList.length > 0 ? { blankPaths: transientList } : {}),\n      },\n    ])\n  }\n  return { forms }\n}\n\n/**\n * Restore forms from a server-rendered snapshot on the client. Call\n * from your client entry before mounting:\n *\n * ```ts\n * import { createApp } from 'vue'\n * import { createAttaform, hydrateAttaformState } from 'attaform'\n *\n * const app = createApp(App).use(createAttaform())\n * hydrateAttaformState(app, window.__ATTAFORM_STATE__)\n * app.mount('#app')\n * ```\n *\n * The next `useForm({ key })` call for each serialised form picks up\n * the snapshot transparently — no further action is required.\n */\nexport function hydrateAttaformState(app: App, payload: SerializedAttaformState): void {\n  const registry = getRegistryFromApp(app)\n  for (const [key, data] of payload.forms) {\n    registry.pendingHydration.set(key, data)\n  }\n}\n","/**\n * Shared building blocks for Attaform's two devtools surfaces — the Vue\n * DevTools (Chrome-extension) inspector wired up in `./devtools.ts`, and\n * the Nuxt DevTools (overlay) panel wired up via `../../nuxt.ts` +\n * `../pages/_attaform_devtools.vue`.\n *\n * Centralizing the redaction policy and the window-bridge contract here\n * keeps both surfaces aligned: a future tightening of the sensitive-name\n * heuristic, or a new field added to the bridge, lands in one file.\n */\nimport type { AttaformRegistry } from './registry'\nimport type { Segment } from './paths'\n\nexport const REDACTED = '[redacted]'\n\n/**\n * Walk `value` and replace any leaf whose enclosing path matches the\n * sensitive-name heuristic with the string `'[redacted]'`. Returns a\n * new tree (no mutation of the input). Object keys + array indices are\n * preserved; only the leaf payloads change.\n *\n * Applied to BOTH devtools surfaces' Form-value rendering AND every\n * timeline event payload — leaks via either surface are treatable as\n * \"any developer with the panel open during user testing can read a\n * customer's password,\" which is exactly the failure mode the\n * sensitive-name guard exists to prevent on the storage side.\n *\n * Leaves whose path doesn't match a pattern pass through untouched.\n * `acknowledgeSensitive: true` on persistence does NOT bypass this — if\n * the consumer opted into persisting the value, they still shouldn't\n * see it in DevTools timelines that grow unbounded.\n *\n * Implementation note: tracks an `inSensitiveSubtree` flag through the\n * recursion instead of allocating a fresh path array per node + calling\n * `isSensitivePath` per leaf. Once any ancestor segment matches the\n * heuristic, the flag stays set for every descendant — the leaf simply\n * returns `REDACTED` without re-scanning the path. For a 100-leaf form:\n * ~100 path allocations + ~100 full-path regex sweeps → 0 path\n * allocations + ~100 single-segment regex sweeps, with whole-subtree\n * short-circuit when sensitive ancestors are found early.\n */\nexport function redactSensitiveLeaves(\n  value: unknown,\n  matchSensitive: (segment: Segment) => boolean\n): unknown {\n  return redactImpl(value, false, matchSensitive)\n}\n\nfunction redactImpl(\n  value: unknown,\n  inSensitiveSubtree: boolean,\n  matchSensitive: (segment: Segment) => boolean\n): unknown {\n  if (value === null || value === undefined) return value\n  if (typeof value !== 'object') {\n    return inSensitiveSubtree ? REDACTED : value\n  }\n  if (Array.isArray(value)) {\n    // Numeric segments never match the sensitive-name heuristic\n    // (segmentMatchesSensitive rejects non-string segments), so the\n    // flag passes through unchanged when descending into arrays.\n    return value.map((item) => redactImpl(item, inSensitiveSubtree, matchSensitive))\n  }\n  // Non-plain object (Map / Set / Date / class instance) — redact\n  // wholesale if we're already in a sensitive subtree; otherwise pass\n  // through. DevTools rendering of these is already heuristic, so we\n  // don't try to descend into them.\n  //\n  // Use `Object.prototype.toString.call(value)` rather than a\n  // `getPrototypeOf` comparison because `Object.prototype` is\n  // realm-scoped — the Nuxt DevTools overlay panel runs in an iframe\n  // whose Vue runtime is separate from the host's, so the host's\n  // reactive proxies have a prototype that doesn't equal the panel's\n  // `Object.prototype`. The `toString` tag check is realm-aware via\n  // `@@toStringTag` and returns `'[object Object]'` for plain objects\n  // (including Vue reactive proxies of plain objects) regardless of\n  // which iframe they were created in.\n  if (Object.prototype.toString.call(value) !== '[object Object]') {\n    return inSensitiveSubtree ? REDACTED : value\n  }\n  const out: Record<string, unknown> = {}\n  for (const key of Object.keys(value as Record<string, unknown>)) {\n    const childSensitive = inSensitiveSubtree || matchSensitive(key)\n    out[key] = redactImpl((value as Record<string, unknown>)[key], childSensitive, matchSensitive)\n  }\n  return out\n}\n\n/**\n * Property key on `window` that the Nuxt-side dev plugin attaches the\n * bridge object to. The iframe-mounted overlay panel reads\n * `window.parent[DEVTOOLS_WINDOW_KEY]` to reach the host app's registry.\n *\n * Underscored + namespaced to make accidental collision with consumer\n * globals vanishingly unlikely. Stable across versions — bumping it\n * would silently disconnect older library builds from newer overlay\n * panels in the same browser tab during a library upgrade.\n */\nexport const DEVTOOLS_WINDOW_KEY = '__attaform_devtools__'\n\n/**\n * Shape of the object the host plugin attaches to `window` in dev mode.\n * The iframe overlay panel reads this to discover the live registry and\n * render its forms.\n *\n * Single-registry assumption: the latest `createAttaform()` install\n * wins. Multi-app pages (rare; typically only seen in micro-frontend\n * setups) will only see one app's forms in the panel. Documented but\n * not actively supported — the alternative (a Set of registries with\n * union-rendering) is a future call if a real consumer hits it.\n */\nexport interface AttaformDevtoolsBridge {\n  registry: AttaformRegistry\n  /**\n   * The library version, surfaced in the panel's footer for support /\n   * bug-report context. Read from `package.json` at host-plugin init.\n   */\n  version: string\n}\n\ndeclare global {\n  interface Window {\n    [DEVTOOLS_WINDOW_KEY]?: AttaformDevtoolsBridge\n  }\n}\n"],"names":["getRegistryFromApp","pathKeyToDotted"],"mappings":";;;;AAuCO,SAAS,oBAAoB,GAAA,EAAmC;AACrE,EAAA,MAAM,QAAA,GAAWA,yBAAmB,GAAG,CAAA;AACvC,EAAA,MAAM,QAAuD,EAAC;AAC9D,EAAA,KAAA,MAAW,CAAC,GAAA,EAAK,KAAK,CAAA,IAAK,SAAS,KAAA,EAAO;AAOzC,IAAA,MAAM,gBAA0B,EAAC;AACjC,IAAA,KAAA,MAAW,EAAA,IAAM,MAAM,UAAA,EAAY;AACjC,MAAA,MAAM,CAAA,GAAIC,sBAAgB,EAAa,CAAA;AACvC,MAAA,IAAI,CAAA,KAAM,IAAA,EAAM,aAAA,CAAc,IAAA,CAAK,CAAC,CAAA;AAAA,IACtC;AACA,IAAA,KAAA,CAAM,IAAA,CAAK;AAAA,MACT,GAAA;AAAA,MACA;AAAA,QACE,IAAA,EAAM,MAAM,IAAA,CAAK,KAAA;AAAA,QACjB,cAAc,KAAA,CAAM,IAAA,CAAK,KAAA,CAAM,YAAA,CAAa,SAAS,CAAA;AAAA,QACrD,YAAY,KAAA,CAAM,IAAA,CAAK,KAAA,CAAM,UAAA,CAAW,SAAS,CAAA;AAAA,QACjD,QAAQ,KAAA,CAAM,IAAA,CAAK,KAAA,CAAM,MAAA,CAAO,SAAS,CAAA;AAAA,QACzC,GAAI,cAAc,MAAA,GAAS,CAAA,GAAI,EAAE,UAAA,EAAY,aAAA,KAAkB;AAAC;AAClE,KACD,CAAA;AAAA,EACH;AACA,EAAA,OAAO,EAAE,KAAA,EAAM;AACjB;AAkBO,SAAS,oBAAA,CAAqB,KAAU,OAAA,EAAwC;AACrF,EAAA,MAAM,QAAA,GAAWD,yBAAmB,GAAG,CAAA;AACvC,EAAA,KAAA,MAAW,CAAC,GAAA,EAAK,IAAI,CAAA,IAAK,QAAQ,KAAA,EAAO;AACvC,IAAA,QAAA,CAAS,gBAAA,CAAiB,GAAA,CAAI,GAAA,EAAK,IAAI,CAAA;AAAA,EACzC;AACF;;AC5EO,MAAM,QAAA,GAAW;AA4BjB,SAAS,qBAAA,CACd,OACA,cAAA,EACS;AACT,EAAA,OAAO,UAAA,CAAW,KAAA,EAAO,KAAA,EAAO,cAAc,CAAA;AAChD;AAEA,SAAS,UAAA,CACP,KAAA,EACA,kBAAA,EACA,cAAA,EACS;AACT,EAAA,IAAI,KAAA,KAAU,IAAA,IAAQ,KAAA,KAAU,MAAA,EAAW,OAAO,KAAA;AAClD,EAAA,IAAI,OAAO,UAAU,QAAA,EAAU;AAC7B,IAAA,OAAO,qBAAqB,QAAA,GAAW,KAAA;AAAA,EACzC;AACA,EAAA,IAAI,KAAA,CAAM,OAAA,CAAQ,KAAK,CAAA,EAAG;AAIxB,IAAA,OAAO,KAAA,CAAM,IAAI,CAAC,IAAA,KAAS,WAAW,IAAA,EAAM,kBAAA,EAAoB,cAAc,CAAC,CAAA;AAAA,EACjF;AAeA,EAAA,IAAI,OAAO,SAAA,CAAU,QAAA,CAAS,IAAA,CAAK,KAAK,MAAM,iBAAA,EAAmB;AAC/D,IAAA,OAAO,qBAAqB,QAAA,GAAW,KAAA;AAAA,EACzC;AACA,EAAA,MAAM,MAA+B,EAAC;AACtC,EAAA,KAAA,MAAW,GAAA,IAAO,MAAA,CAAO,IAAA,CAAK,KAAgC,CAAA,EAAG;AAC/D,IAAA,MAAM,cAAA,GAAiB,kBAAA,IAAsB,cAAA,CAAe,GAAG,CAAA;AAC/D,IAAA,GAAA,CAAI,GAAG,CAAA,GAAI,UAAA,CAAY,MAAkC,GAAG,CAAA,EAAG,gBAAgB,cAAc,CAAA;AAAA,EAC/F;AACA,EAAA,OAAO,GAAA;AACT;AAYO,MAAM,mBAAA,GAAsB;;;;;;;;"}

package/dist/shared/attaform.BDdFdjeX.mjs

@@ -0,0 +1,57 @@
+import { g as getRegistryFromApp, r as pathKeyToDotted } from './attaform.Xhg0AYNa.mjs';
+
+function renderAttaformState(app) {
+  const registry = getRegistryFromApp(app);
+  const forms = [];
+  for (const [key, state] of registry.forms) {
+    const transientList = [];
+    for (const pk of state.blankPaths) {
+      const d = pathKeyToDotted(pk);
+      if (d !== null) transientList.push(d);
+    }
+    forms.push([
+      key,
+      {
+        form: state.form.value,
+        schemaErrors: Array.from(state.schemaErrors.entries()),
+        userErrors: Array.from(state.userErrors.entries()),
+        fields: Array.from(state.fields.entries()),
+        ...transientList.length > 0 ? { blankPaths: transientList } : {}
+      }
+    ]);
+  }
+  return { forms };
+}
+function hydrateAttaformState(app, payload) {
+  const registry = getRegistryFromApp(app);
+  for (const [key, data] of payload.forms) {
+    registry.pendingHydration.set(key, data);
+  }
+}
+
+const REDACTED = "[redacted]";
+function redactSensitiveLeaves(value, matchSensitive) {
+  return redactImpl(value, false, matchSensitive);
+}
+function redactImpl(value, inSensitiveSubtree, matchSensitive) {
+  if (value === null || value === void 0) return value;
+  if (typeof value !== "object") {
+    return inSensitiveSubtree ? REDACTED : value;
+  }
+  if (Array.isArray(value)) {
+    return value.map((item) => redactImpl(item, inSensitiveSubtree, matchSensitive));
+  }
+  if (Object.prototype.toString.call(value) !== "[object Object]") {
+    return inSensitiveSubtree ? REDACTED : value;
+  }
+  const out = {};
+  for (const key of Object.keys(value)) {
+    const childSensitive = inSensitiveSubtree || matchSensitive(key);
+    out[key] = redactImpl(value[key], childSensitive, matchSensitive);
+  }
+  return out;
+}
+const DEVTOOLS_WINDOW_KEY = "__attaform_devtools__";
+
+export { DEVTOOLS_WINDOW_KEY as D, REDACTED as R, redactSensitiveLeaves as a, hydrateAttaformState as h, renderAttaformState as r };
+//# sourceMappingURL=attaform.BDdFdjeX.mjs.map

package/dist/shared/attaform.BDdFdjeX.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"attaform.BDdFdjeX.mjs","sources":["../../src/runtime/core/serialize.ts","../../src/runtime/core/devtools-shared.ts"],"sourcesContent":["import type { App } from 'vue'\nimport type { FormKey } from '../types/types-api'\nimport { pathKeyToDotted, type PathKey } from './paths'\nimport { getRegistryFromApp, type SerializedFormData } from './registry'\n\n/**\n * Serialised snapshot of every form in a Vue app, produced by\n * `renderAttaformState` and consumed by `hydrateAttaformState`.\n *\n * JSON-safe — pass to `JSON.stringify`, `devalue`, or any other\n * serialiser before embedding in your SSR payload.\n */\nexport type SerializedAttaformState = {\n  /** Tuples of `[formKey, snapshot]` for every form in the app. */\n  readonly forms: ReadonlyArray<readonly [FormKey, SerializedFormData]>\n}\n\n/**\n * Snapshot every form on a Vue app for SSR. Call from your server\n * entry after rendering the app:\n *\n * ```ts\n * import { renderToString } from '@vue/server-renderer'\n * import { renderAttaformState, escapeForInlineScript } from 'attaform'\n *\n * const html = await renderToString(app)\n * const state = renderAttaformState(app)\n * const payload = escapeForInlineScript(JSON.stringify(state))\n *\n * return `\n *   ${html}\n *   <script>window.__ATTAFORM_STATE__ = ${payload}</script>\n * `\n * ```\n *\n * Pair with `hydrateAttaformState` on the client to restore the\n * forms in their server-rendered state. Nuxt users don't need this —\n * `attaform/nuxt` wires SSR automatically.\n */\nexport function renderAttaformState(app: App): SerializedAttaformState {\n  const registry = getRegistryFromApp(app)\n  const forms: Array<readonly [FormKey, SerializedFormData]> = []\n  for (const [key, state] of registry.forms) {\n    // Skip the blank field when the set is empty so the\n    // wire payload stays minimal for forms that don't use it. The\n    // optional shape on the consuming side handles the absence\n    // cleanly (defaults to \"no blank paths\"). PathKey → dotted at\n    // the boundary so the wire shape matches the rest of the\n    // public path notation.\n    const transientList: string[] = []\n    for (const pk of state.blankPaths) {\n      const d = pathKeyToDotted(pk as PathKey)\n      if (d !== null) transientList.push(d)\n    }\n    forms.push([\n      key,\n      {\n        form: state.form.value,\n        schemaErrors: Array.from(state.schemaErrors.entries()),\n        userErrors: Array.from(state.userErrors.entries()),\n        fields: Array.from(state.fields.entries()),\n        ...(transientList.length > 0 ? { blankPaths: transientList } : {}),\n      },\n    ])\n  }\n  return { forms }\n}\n\n/**\n * Restore forms from a server-rendered snapshot on the client. Call\n * from your client entry before mounting:\n *\n * ```ts\n * import { createApp } from 'vue'\n * import { createAttaform, hydrateAttaformState } from 'attaform'\n *\n * const app = createApp(App).use(createAttaform())\n * hydrateAttaformState(app, window.__ATTAFORM_STATE__)\n * app.mount('#app')\n * ```\n *\n * The next `useForm({ key })` call for each serialised form picks up\n * the snapshot transparently — no further action is required.\n */\nexport function hydrateAttaformState(app: App, payload: SerializedAttaformState): void {\n  const registry = getRegistryFromApp(app)\n  for (const [key, data] of payload.forms) {\n    registry.pendingHydration.set(key, data)\n  }\n}\n","/**\n * Shared building blocks for Attaform's two devtools surfaces — the Vue\n * DevTools (Chrome-extension) inspector wired up in `./devtools.ts`, and\n * the Nuxt DevTools (overlay) panel wired up via `../../nuxt.ts` +\n * `../pages/_attaform_devtools.vue`.\n *\n * Centralizing the redaction policy and the window-bridge contract here\n * keeps both surfaces aligned: a future tightening of the sensitive-name\n * heuristic, or a new field added to the bridge, lands in one file.\n */\nimport type { AttaformRegistry } from './registry'\nimport type { Segment } from './paths'\n\nexport const REDACTED = '[redacted]'\n\n/**\n * Walk `value` and replace any leaf whose enclosing path matches the\n * sensitive-name heuristic with the string `'[redacted]'`. Returns a\n * new tree (no mutation of the input). Object keys + array indices are\n * preserved; only the leaf payloads change.\n *\n * Applied to BOTH devtools surfaces' Form-value rendering AND every\n * timeline event payload — leaks via either surface are treatable as\n * \"any developer with the panel open during user testing can read a\n * customer's password,\" which is exactly the failure mode the\n * sensitive-name guard exists to prevent on the storage side.\n *\n * Leaves whose path doesn't match a pattern pass through untouched.\n * `acknowledgeSensitive: true` on persistence does NOT bypass this — if\n * the consumer opted into persisting the value, they still shouldn't\n * see it in DevTools timelines that grow unbounded.\n *\n * Implementation note: tracks an `inSensitiveSubtree` flag through the\n * recursion instead of allocating a fresh path array per node + calling\n * `isSensitivePath` per leaf. Once any ancestor segment matches the\n * heuristic, the flag stays set for every descendant — the leaf simply\n * returns `REDACTED` without re-scanning the path. For a 100-leaf form:\n * ~100 path allocations + ~100 full-path regex sweeps → 0 path\n * allocations + ~100 single-segment regex sweeps, with whole-subtree\n * short-circuit when sensitive ancestors are found early.\n */\nexport function redactSensitiveLeaves(\n  value: unknown,\n  matchSensitive: (segment: Segment) => boolean\n): unknown {\n  return redactImpl(value, false, matchSensitive)\n}\n\nfunction redactImpl(\n  value: unknown,\n  inSensitiveSubtree: boolean,\n  matchSensitive: (segment: Segment) => boolean\n): unknown {\n  if (value === null || value === undefined) return value\n  if (typeof value !== 'object') {\n    return inSensitiveSubtree ? REDACTED : value\n  }\n  if (Array.isArray(value)) {\n    // Numeric segments never match the sensitive-name heuristic\n    // (segmentMatchesSensitive rejects non-string segments), so the\n    // flag passes through unchanged when descending into arrays.\n    return value.map((item) => redactImpl(item, inSensitiveSubtree, matchSensitive))\n  }\n  // Non-plain object (Map / Set / Date / class instance) — redact\n  // wholesale if we're already in a sensitive subtree; otherwise pass\n  // through. DevTools rendering of these is already heuristic, so we\n  // don't try to descend into them.\n  //\n  // Use `Object.prototype.toString.call(value)` rather than a\n  // `getPrototypeOf` comparison because `Object.prototype` is\n  // realm-scoped — the Nuxt DevTools overlay panel runs in an iframe\n  // whose Vue runtime is separate from the host's, so the host's\n  // reactive proxies have a prototype that doesn't equal the panel's\n  // `Object.prototype`. The `toString` tag check is realm-aware via\n  // `@@toStringTag` and returns `'[object Object]'` for plain objects\n  // (including Vue reactive proxies of plain objects) regardless of\n  // which iframe they were created in.\n  if (Object.prototype.toString.call(value) !== '[object Object]') {\n    return inSensitiveSubtree ? REDACTED : value\n  }\n  const out: Record<string, unknown> = {}\n  for (const key of Object.keys(value as Record<string, unknown>)) {\n    const childSensitive = inSensitiveSubtree || matchSensitive(key)\n    out[key] = redactImpl((value as Record<string, unknown>)[key], childSensitive, matchSensitive)\n  }\n  return out\n}\n\n/**\n * Property key on `window` that the Nuxt-side dev plugin attaches the\n * bridge object to. The iframe-mounted overlay panel reads\n * `window.parent[DEVTOOLS_WINDOW_KEY]` to reach the host app's registry.\n *\n * Underscored + namespaced to make accidental collision with consumer\n * globals vanishingly unlikely. Stable across versions — bumping it\n * would silently disconnect older library builds from newer overlay\n * panels in the same browser tab during a library upgrade.\n */\nexport const DEVTOOLS_WINDOW_KEY = '__attaform_devtools__'\n\n/**\n * Shape of the object the host plugin attaches to `window` in dev mode.\n * The iframe overlay panel reads this to discover the live registry and\n * render its forms.\n *\n * Single-registry assumption: the latest `createAttaform()` install\n * wins. Multi-app pages (rare; typically only seen in micro-frontend\n * setups) will only see one app's forms in the panel. Documented but\n * not actively supported — the alternative (a Set of registries with\n * union-rendering) is a future call if a real consumer hits it.\n */\nexport interface AttaformDevtoolsBridge {\n  registry: AttaformRegistry\n  /**\n   * The library version, surfaced in the panel's footer for support /\n   * bug-report context. Read from `package.json` at host-plugin init.\n   */\n  version: string\n}\n\ndeclare global {\n  interface Window {\n    [DEVTOOLS_WINDOW_KEY]?: AttaformDevtoolsBridge\n  }\n}\n"],"names":[],"mappings":";;AAuCO,SAAS,oBAAoB,GAAA,EAAmC;AACrE,EAAA,MAAM,QAAA,GAAW,mBAAmB,GAAG,CAAA;AACvC,EAAA,MAAM,QAAuD,EAAC;AAC9D,EAAA,KAAA,MAAW,CAAC,GAAA,EAAK,KAAK,CAAA,IAAK,SAAS,KAAA,EAAO;AAOzC,IAAA,MAAM,gBAA0B,EAAC;AACjC,IAAA,KAAA,MAAW,EAAA,IAAM,MAAM,UAAA,EAAY;AACjC,MAAA,MAAM,CAAA,GAAI,gBAAgB,EAAa,CAAA;AACvC,MAAA,IAAI,CAAA,KAAM,IAAA,EAAM,aAAA,CAAc,IAAA,CAAK,CAAC,CAAA;AAAA,IACtC;AACA,IAAA,KAAA,CAAM,IAAA,CAAK;AAAA,MACT,GAAA;AAAA,MACA;AAAA,QACE,IAAA,EAAM,MAAM,IAAA,CAAK,KAAA;AAAA,QACjB,cAAc,KAAA,CAAM,IAAA,CAAK,KAAA,CAAM,YAAA,CAAa,SAAS,CAAA;AAAA,QACrD,YAAY,KAAA,CAAM,IAAA,CAAK,KAAA,CAAM,UAAA,CAAW,SAAS,CAAA;AAAA,QACjD,QAAQ,KAAA,CAAM,IAAA,CAAK,KAAA,CAAM,MAAA,CAAO,SAAS,CAAA;AAAA,QACzC,GAAI,cAAc,MAAA,GAAS,CAAA,GAAI,EAAE,UAAA,EAAY,aAAA,KAAkB;AAAC;AAClE,KACD,CAAA;AAAA,EACH;AACA,EAAA,OAAO,EAAE,KAAA,EAAM;AACjB;AAkBO,SAAS,oBAAA,CAAqB,KAAU,OAAA,EAAwC;AACrF,EAAA,MAAM,QAAA,GAAW,mBAAmB,GAAG,CAAA;AACvC,EAAA,KAAA,MAAW,CAAC,GAAA,EAAK,IAAI,CAAA,IAAK,QAAQ,KAAA,EAAO;AACvC,IAAA,QAAA,CAAS,gBAAA,CAAiB,GAAA,CAAI,GAAA,EAAK,IAAI,CAAA;AAAA,EACzC;AACF;;AC5EO,MAAM,QAAA,GAAW;AA4BjB,SAAS,qBAAA,CACd,OACA,cAAA,EACS;AACT,EAAA,OAAO,UAAA,CAAW,KAAA,EAAO,KAAA,EAAO,cAAc,CAAA;AAChD;AAEA,SAAS,UAAA,CACP,KAAA,EACA,kBAAA,EACA,cAAA,EACS;AACT,EAAA,IAAI,KAAA,KAAU,IAAA,IAAQ,KAAA,KAAU,MAAA,EAAW,OAAO,KAAA;AAClD,EAAA,IAAI,OAAO,UAAU,QAAA,EAAU;AAC7B,IAAA,OAAO,qBAAqB,QAAA,GAAW,KAAA;AAAA,EACzC;AACA,EAAA,IAAI,KAAA,CAAM,OAAA,CAAQ,KAAK,CAAA,EAAG;AAIxB,IAAA,OAAO,KAAA,CAAM,IAAI,CAAC,IAAA,KAAS,WAAW,IAAA,EAAM,kBAAA,EAAoB,cAAc,CAAC,CAAA;AAAA,EACjF;AAeA,EAAA,IAAI,OAAO,SAAA,CAAU,QAAA,CAAS,IAAA,CAAK,KAAK,MAAM,iBAAA,EAAmB;AAC/D,IAAA,OAAO,qBAAqB,QAAA,GAAW,KAAA;AAAA,EACzC;AACA,EAAA,MAAM,MAA+B,EAAC;AACtC,EAAA,KAAA,MAAW,GAAA,IAAO,MAAA,CAAO,IAAA,CAAK,KAAgC,CAAA,EAAG;AAC/D,IAAA,MAAM,cAAA,GAAiB,kBAAA,IAAsB,cAAA,CAAe,GAAG,CAAA;AAC/D,IAAA,GAAA,CAAI,GAAG,CAAA,GAAI,UAAA,CAAY,MAAkC,GAAG,CAAA,EAAG,gBAAgB,cAAc,CAAA;AAAA,EAC/F;AACA,EAAA,OAAO,GAAA;AACT;AAYO,MAAM,mBAAA,GAAsB;;;;"}