@auronui/vue 1.2.1 → 1.3.0

package/dist/components/editable/EditableEditTrigger.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,53 @@
+import { composeClassName } from "../../utils/composeClassName.js";
+import { computed, createBlock, createElementVNode, defineComponent, normalizeClass, openBlock, renderSlot, unref, withCtx } from "vue";
+import { editableVariants } from "@auronui/styles";
+import { EditableEditTrigger } from "reka-ui";
+//#region src/components/editable/EditableEditTrigger.vue?vue&type=script&setup=true&lang.ts
+var EditableEditTrigger_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "EditableEditTrigger",
+	props: {
+		as: {},
+		asChild: { type: Boolean },
+		class: { type: [
+			String,
+			Boolean,
+			null,
+			Object,
+			Array
+		] }
+	},
+	setup(__props) {
+		const props = __props;
+		const slotFns = computed(() => editableVariants());
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(EditableEditTrigger), {
+				as: props.as,
+				"as-child": props.asChild,
+				class: normalizeClass(unref(composeClassName)(slotFns.value.editTrigger(), props.class)),
+				"aria-label": "Edit"
+			}, {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default", {}, () => [_cache[0] || (_cache[0] = createElementVNode("svg", {
+					xmlns: "http://www.w3.org/2000/svg",
+					width: "14",
+					height: "14",
+					viewBox: "0 0 24 24",
+					fill: "none",
+					stroke: "currentColor",
+					"stroke-width": "2",
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round",
+					"aria-hidden": "true"
+				}, [createElementVNode("path", { d: "M17 3a2.85 2.83 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z" })], -1))])]),
+				_: 3
+			}, 8, [
+				"as",
+				"as-child",
+				"class"
+			]);
+		};
+	}
+});
+//#endregion
+export { EditableEditTrigger_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=EditableEditTrigger.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/editable/EditableEditTrigger.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditableEditTrigger.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/editable/EditableEditTrigger.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { EditableEditTrigger } from 'reka-ui'\nimport { editableVariants } from '@auronui/styles'\nimport { composeClassName, type ClassValue } from '../../utils/composeClassName'\n\nconst props = defineProps<{\n  as?: string\n  asChild?: boolean\n  class?: ClassValue\n}>()\n\nconst slotFns = computed(() => editableVariants())\n</script>\n\n<template>\n  <EditableEditTrigger\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :class=\"composeClassName(slotFns.editTrigger(), props.class)\"\n    aria-label=\"Edit\"\n  >\n    <slot>\n      <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width=\"14\"\n        height=\"14\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        aria-hidden=\"true\"\n      >\n        <path d=\"M17 3a2.85 2.83 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z\" />\n      </svg>\n    </slot>\n  </EditableEditTrigger>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;EAMA,MAAM,QAAQ;EAMd,MAAM,UAAU,eAAe,kBAAkB,CAAA;;uBAI/C,YAsBsB,MAAA,oBAAA,EAAA;IArBnB,IAAI,MAAM;IACV,YAAU,MAAM;IAChB,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,MAAQ,aAAW,EAAI,MAAM,MAAK,CAAA;IAC3D,cAAW;;2BAiBJ,CAfP,WAeO,KAAA,QAAA,WAAA,EAAA,QAAA,CAAA,OAAA,OAAA,OAAA,KAdL,mBAaM,OAAA;KAZJ,OAAM;KACN,OAAM;KACN,QAAO;KACP,SAAQ;KACR,MAAK;KACL,QAAO;KACP,gBAAa;KACb,kBAAe;KACf,mBAAgB;KAChB,eAAY;QAEZ,mBAA6D,QAAA,EAAvD,GAAE,oDAAkD,CAAA,CAAA,EAAA,GAAA,EAAA,CAAA,CAAA,CAAA"}

package/dist/components/editable/EditableInput.js

@@ -0,0 +1,7 @@
+import EditableInput_vue_vue_type_script_setup_true_lang_default from "./EditableInput.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/editable/EditableInput.vue
+var EditableInput_default = EditableInput_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { EditableInput_default as default };
+
+//# sourceMappingURL=EditableInput.js.map

package/dist/components/editable/EditableInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditableInput.js","names":[],"sources":["../../../src/components/editable/EditableInput.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { EditableInput } from 'reka-ui'\nimport { editableVariants } from '@auronui/styles'\nimport { composeClassName, type ClassValue } from '../../utils/composeClassName'\n\nconst props = defineProps<{\n  as?: string\n  asChild?: boolean\n  class?: ClassValue\n}>()\n\nconst slotFns = computed(() => editableVariants())\n</script>\n\n<template>\n  <EditableInput\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :class=\"composeClassName(slotFns.input(), props.class)\"\n  />\n</template>\n"],"mappings":""}

package/dist/components/editable/EditableInput.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,38 @@
+import { composeClassName } from "../../utils/composeClassName.js";
+import { computed, createBlock, defineComponent, normalizeClass, openBlock, unref } from "vue";
+import { editableVariants } from "@auronui/styles";
+import { EditableInput } from "reka-ui";
+//#region src/components/editable/EditableInput.vue?vue&type=script&setup=true&lang.ts
+var EditableInput_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "EditableInput",
+	props: {
+		as: {},
+		asChild: { type: Boolean },
+		class: { type: [
+			String,
+			Boolean,
+			null,
+			Object,
+			Array
+		] }
+	},
+	setup(__props) {
+		const props = __props;
+		const slotFns = computed(() => editableVariants());
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(EditableInput), {
+				as: props.as,
+				"as-child": props.asChild,
+				class: normalizeClass(unref(composeClassName)(slotFns.value.input(), props.class))
+			}, null, 8, [
+				"as",
+				"as-child",
+				"class"
+			]);
+		};
+	}
+});
+//#endregion
+export { EditableInput_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=EditableInput.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/editable/EditableInput.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditableInput.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/editable/EditableInput.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { EditableInput } from 'reka-ui'\nimport { editableVariants } from '@auronui/styles'\nimport { composeClassName, type ClassValue } from '../../utils/composeClassName'\n\nconst props = defineProps<{\n  as?: string\n  asChild?: boolean\n  class?: ClassValue\n}>()\n\nconst slotFns = computed(() => editableVariants())\n</script>\n\n<template>\n  <EditableInput\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :class=\"composeClassName(slotFns.input(), props.class)\"\n  />\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;EAMA,MAAM,QAAQ;EAMd,MAAM,UAAU,eAAe,kBAAkB,CAAA;;uBAI/C,YAIE,MAAA,cAAA,EAAA;IAHC,IAAI,MAAM;IACV,YAAU,MAAM;IAChB,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,MAAQ,OAAK,EAAI,MAAM,MAAK,CAAA"}

package/dist/components/editable/EditablePreview.js

@@ -0,0 +1,7 @@
+import EditablePreview_vue_vue_type_script_setup_true_lang_default from "./EditablePreview.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/editable/EditablePreview.vue
+var EditablePreview_default = EditablePreview_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { EditablePreview_default as default };
+
+//# sourceMappingURL=EditablePreview.js.map

package/dist/components/editable/EditablePreview.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditablePreview.js","names":[],"sources":["../../../src/components/editable/EditablePreview.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { EditablePreview } from 'reka-ui'\nimport { editableVariants } from '@auronui/styles'\nimport { composeClassName, type ClassValue } from '../../utils/composeClassName'\n\nconst props = defineProps<{\n  as?: string\n  asChild?: boolean\n  class?: ClassValue\n}>()\n\nconst slotFns = computed(() => editableVariants())\n</script>\n\n<template>\n  <EditablePreview\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :class=\"composeClassName(slotFns.preview(), props.class)\"\n  />\n</template>\n"],"mappings":""}

package/dist/components/editable/EditablePreview.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,38 @@
+import { composeClassName } from "../../utils/composeClassName.js";
+import { computed, createBlock, defineComponent, normalizeClass, openBlock, unref } from "vue";
+import { editableVariants } from "@auronui/styles";
+import { EditablePreview } from "reka-ui";
+//#region src/components/editable/EditablePreview.vue?vue&type=script&setup=true&lang.ts
+var EditablePreview_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "EditablePreview",
+	props: {
+		as: {},
+		asChild: { type: Boolean },
+		class: { type: [
+			String,
+			Boolean,
+			null,
+			Object,
+			Array
+		] }
+	},
+	setup(__props) {
+		const props = __props;
+		const slotFns = computed(() => editableVariants());
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(EditablePreview), {
+				as: props.as,
+				"as-child": props.asChild,
+				class: normalizeClass(unref(composeClassName)(slotFns.value.preview(), props.class))
+			}, null, 8, [
+				"as",
+				"as-child",
+				"class"
+			]);
+		};
+	}
+});
+//#endregion
+export { EditablePreview_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=EditablePreview.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/editable/EditablePreview.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditablePreview.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/editable/EditablePreview.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { EditablePreview } from 'reka-ui'\nimport { editableVariants } from '@auronui/styles'\nimport { composeClassName, type ClassValue } from '../../utils/composeClassName'\n\nconst props = defineProps<{\n  as?: string\n  asChild?: boolean\n  class?: ClassValue\n}>()\n\nconst slotFns = computed(() => editableVariants())\n</script>\n\n<template>\n  <EditablePreview\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :class=\"composeClassName(slotFns.preview(), props.class)\"\n  />\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;EAMA,MAAM,QAAQ;EAMd,MAAM,UAAU,eAAe,kBAAkB,CAAA;;uBAI/C,YAIE,MAAA,gBAAA,EAAA;IAHC,IAAI,MAAM;IACV,YAAU,MAAM;IAChB,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,MAAQ,SAAO,EAAI,MAAM,MAAK,CAAA"}

package/dist/components/editable/EditableSubmitTrigger.js

@@ -0,0 +1,7 @@
+import EditableSubmitTrigger_vue_vue_type_script_setup_true_lang_default from "./EditableSubmitTrigger.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/editable/EditableSubmitTrigger.vue
+var EditableSubmitTrigger_default = EditableSubmitTrigger_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { EditableSubmitTrigger_default as default };
+
+//# sourceMappingURL=EditableSubmitTrigger.js.map

package/dist/components/editable/EditableSubmitTrigger.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditableSubmitTrigger.js","names":[],"sources":["../../../src/components/editable/EditableSubmitTrigger.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { EditableSubmitTrigger } from 'reka-ui'\nimport { editableVariants } from '@auronui/styles'\nimport { composeClassName, type ClassValue } from '../../utils/composeClassName'\n\nconst props = defineProps<{\n  as?: string\n  asChild?: boolean\n  class?: ClassValue\n}>()\n\nconst slotFns = computed(() => editableVariants())\n</script>\n\n<template>\n  <EditableSubmitTrigger\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :class=\"composeClassName(slotFns.submitTrigger(), props.class)\"\n    aria-label=\"Save\"\n  >\n    <slot>\n      <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width=\"14\"\n        height=\"14\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        aria-hidden=\"true\"\n      >\n        <polyline points=\"20 6 9 17 4 12\" />\n      </svg>\n    </slot>\n  </EditableSubmitTrigger>\n</template>\n"],"mappings":""}

package/dist/components/editable/EditableSubmitTrigger.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,53 @@
+import { composeClassName } from "../../utils/composeClassName.js";
+import { computed, createBlock, createElementVNode, defineComponent, normalizeClass, openBlock, renderSlot, unref, withCtx } from "vue";
+import { editableVariants } from "@auronui/styles";
+import { EditableSubmitTrigger } from "reka-ui";
+//#region src/components/editable/EditableSubmitTrigger.vue?vue&type=script&setup=true&lang.ts
+var EditableSubmitTrigger_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "EditableSubmitTrigger",
+	props: {
+		as: {},
+		asChild: { type: Boolean },
+		class: { type: [
+			String,
+			Boolean,
+			null,
+			Object,
+			Array
+		] }
+	},
+	setup(__props) {
+		const props = __props;
+		const slotFns = computed(() => editableVariants());
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(EditableSubmitTrigger), {
+				as: props.as,
+				"as-child": props.asChild,
+				class: normalizeClass(unref(composeClassName)(slotFns.value.submitTrigger(), props.class)),
+				"aria-label": "Save"
+			}, {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default", {}, () => [_cache[0] || (_cache[0] = createElementVNode("svg", {
+					xmlns: "http://www.w3.org/2000/svg",
+					width: "14",
+					height: "14",
+					viewBox: "0 0 24 24",
+					fill: "none",
+					stroke: "currentColor",
+					"stroke-width": "2",
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round",
+					"aria-hidden": "true"
+				}, [createElementVNode("polyline", { points: "20 6 9 17 4 12" })], -1))])]),
+				_: 3
+			}, 8, [
+				"as",
+				"as-child",
+				"class"
+			]);
+		};
+	}
+});
+//#endregion
+export { EditableSubmitTrigger_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=EditableSubmitTrigger.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/editable/EditableSubmitTrigger.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditableSubmitTrigger.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/editable/EditableSubmitTrigger.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { EditableSubmitTrigger } from 'reka-ui'\nimport { editableVariants } from '@auronui/styles'\nimport { composeClassName, type ClassValue } from '../../utils/composeClassName'\n\nconst props = defineProps<{\n  as?: string\n  asChild?: boolean\n  class?: ClassValue\n}>()\n\nconst slotFns = computed(() => editableVariants())\n</script>\n\n<template>\n  <EditableSubmitTrigger\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :class=\"composeClassName(slotFns.submitTrigger(), props.class)\"\n    aria-label=\"Save\"\n  >\n    <slot>\n      <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width=\"14\"\n        height=\"14\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        aria-hidden=\"true\"\n      >\n        <polyline points=\"20 6 9 17 4 12\" />\n      </svg>\n    </slot>\n  </EditableSubmitTrigger>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;EAMA,MAAM,QAAQ;EAMd,MAAM,UAAU,eAAe,kBAAkB,CAAA;;uBAI/C,YAsBwB,MAAA,sBAAA,EAAA;IArBrB,IAAI,MAAM;IACV,YAAU,MAAM;IAChB,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,MAAQ,eAAa,EAAI,MAAM,MAAK,CAAA;IAC7D,cAAW;;2BAiBJ,CAfP,WAeO,KAAA,QAAA,WAAA,EAAA,QAAA,CAAA,OAAA,OAAA,OAAA,KAdL,mBAaM,OAAA;KAZJ,OAAM;KACN,OAAM;KACN,QAAO;KACP,SAAQ;KACR,MAAK;KACL,QAAO;KACP,gBAAa;KACb,kBAAe;KACf,mBAAgB;KAChB,eAAY;QAEZ,mBAAoC,YAAA,EAA1B,QAAO,kBAAgB,CAAA,CAAA,EAAA,GAAA,EAAA,CAAA,CAAA,CAAA"}

package/dist/components/form/Form.js.map

@@ -1 +1 @@
-{"version":3,"file":"Form.js","names":[],"sources":["../../../src/components/form/Form.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref, computed, provide } from 'vue'\nimport { formContextKey } from './form.context'\nimport { runValidation } from './validation'\nimport type { ValidationMode, FieldRegistration, FormContext } from './form.context'\n\nconst props = withDefaults(\n  defineProps<{\n    validationMode?: ValidationMode\n    isDisabled?: boolean\n    class?: string\n  }>(),\n  {\n    validationMode: 'on-submit',\n    isDisabled: false,\n    class: undefined,\n  },\n)\n\nconst emit = defineEmits<{\n  submit: [payload: { values: Record<string, unknown>; setErrors: (e: Record<string, string>) => void }]\n  invalid: [errors: Record<string, string>]\n  reset: []\n}>()\n\nconst errors = ref<Record<string, string>>({})\nconst isSubmitting = ref(false)\nconst isSubmitted = ref(false)\nconst submitCount = ref(0)\nconst fields = new Map<string, FieldRegistration>()\n\n// Reactive field count so computed properties re-evaluate when fields register/unregister\nconst fieldCount = ref(0)\n\nfunction registerField(reg: FieldRegistration): void {\n  fields.set(reg.name, reg)\n  fieldCount.value++\n}\n\nfunction unregisterField(name: string): void {\n  fields.delete(name)\n  fieldCount.value--\n  const next = { ...errors.value }\n  delete next[name]\n  errors.value = next\n}\n\n// ── Computed state ──────────────────────────────────────────────────────────\n\nconst isValid = computed(() => {\n  void fieldCount.value // track reactivity\n  return Object.keys(errors.value).length === 0\n})\n\nconst isDirty = computed(() => {\n  void fieldCount.value\n  for (const field of fields.values()) {\n    if (field.dirty.value) return true\n  }\n  return false\n})\n\nconst isTouched = computed(() => {\n  void fieldCount.value\n  for (const field of fields.values()) {\n    if (field.touched.value) return true\n  }\n  return false\n})\n\n// ── Helpers ─────────────────────────────────────────────────────────────────\n\nfunction getAllValues(): Record<string, unknown> {\n  const values: Record<string, unknown> = {}\n  for (const [name, field] of fields.entries()) {\n    values[name] = field.getValue()\n  }\n  return values\n}\n\n// ── Validation ───────────────────────────────────────────────────────────────\n\nasync function triggerFieldValidation(name: string): Promise<void> {\n  const field = fields.get(name)\n  if (!field) return\n  const error = await runValidation(\n    field.getValue(),\n    field.rules,\n    field.validate,\n    { values: getAllValues() },\n  )\n  const next = { ...errors.value }\n  if (error) {\n    next[name] = error\n  } else {\n    delete next[name]\n  }\n  errors.value = next\n}\n\nasync function trigger(name?: string): Promise<boolean> {\n  if (name) {\n    await triggerFieldValidation(name)\n    return !errors.value[name]\n  }\n\n  const results = await Promise.all(\n    [...fields.entries()].map(async ([fieldName, field]) => {\n      const error = await runValidation(\n        field.getValue(),\n        field.rules,\n        field.validate,\n        { values: getAllValues() },\n      )\n      return { name: fieldName, error }\n    }),\n  )\n\n  const next: Record<string, string> = {}\n  for (const { name: fieldName, error } of results) {\n    if (error) next[fieldName] = error\n  }\n  errors.value = next\n  return Object.keys(next).length === 0\n}\n\n// ── Error management ─────────────────────────────────────────────────────────\n\nfunction setErrors(newErrors: Record<string, string>): void {\n  errors.value = { ...errors.value, ...newErrors }\n  isSubmitting.value = false\n}\n\nfunction setError(name: string, message: string): void {\n  errors.value = { ...errors.value, [name]: message }\n}\n\nfunction clearErrors(name?: string): void {\n  if (name) {\n    const next = { ...errors.value }\n    delete next[name]\n    errors.value = next\n  } else {\n    errors.value = {}\n  }\n}\n\n// ── Values ───────────────────────────────────────────────────────────────────\n\nfunction getValues(): Record<string, unknown> {\n  return getAllValues()\n}\n\nfunction setValue(name: string, value: unknown): void {\n  const field = fields.get(name)\n  if (field) field.setValue(value)\n}\n\n// ── Reset ────────────────────────────────────────────────────────────────────\n\nfunction reset(): void {\n  for (const field of fields.values()) {\n    field.reset()\n  }\n  errors.value = {}\n  isSubmitting.value = false\n  isSubmitted.value = false\n  submitCount.value = 0\n  emit('reset')\n}\n\n// ── Submit ───────────────────────────────────────────────────────────────────\n\nasync function handleSubmit(): Promise<void> {\n  isSubmitting.value = true\n  submitCount.value++\n\n  const values = getAllValues()\n  const context = { values }\n\n  const results = await Promise.all(\n    [...fields.entries()].map(async ([name, field]) => {\n      const error = await runValidation(field.getValue(), field.rules, field.validate, context)\n      return { name, error }\n    }),\n  )\n\n  const nextErrors: Record<string, string> = {}\n  for (const { name, error } of results) {\n    if (error) nextErrors[name] = error\n  }\n\n  if (Object.keys(nextErrors).length > 0) {\n    errors.value = nextErrors\n    isSubmitting.value = false\n    isSubmitted.value = true\n    emit('invalid', nextErrors)\n    return\n  }\n\n  errors.value = {}\n  isSubmitted.value = true\n  isSubmitting.value = false\n  emit('submit', { values, setErrors })\n}\n\n// ── Context ──────────────────────────────────────────────────────────────────\n\nconst ctx: FormContext = {\n  errors,\n  isSubmitting,\n  isSubmitted,\n  submitCount,\n  isDisabled: computed(() => props.isDisabled),\n  isValid,\n  isDirty,\n  isTouched,\n  validationMode: computed(() => props.validationMode),\n  registerField,\n  unregisterField,\n  triggerFieldValidation,\n  setErrors,\n  setError,\n  clearErrors,\n  getValues,\n  setValue,\n  trigger,\n  reset,\n}\n\nprovide(formContextKey, ctx)\n\ndefineExpose({\n  errors,\n  isSubmitting,\n  isSubmitted,\n  submitCount,\n  isValid,\n  isDirty,\n  isTouched,\n  getValues,\n  setValue,\n  setErrors,\n  setError,\n  clearErrors,\n  trigger,\n  reset,\n})\n</script>\n\n<template>\n  <form\n    :class=\"props.class\"\n    novalidate\n    @submit.prevent=\"handleSubmit\"\n  >\n    <slot\n      :is-submitting=\"isSubmitting\"\n      :is-submitted=\"isSubmitted\"\n      :submit-count=\"submitCount\"\n      :is-disabled=\"props.isDisabled\"\n      :is-valid=\"isValid\"\n      :is-dirty=\"isDirty\"\n      :is-touched=\"isTouched\"\n      :errors=\"errors\"\n      :get-values=\"getValues\"\n      :set-value=\"setValue\"\n      :set-errors=\"setErrors\"\n      :set-error=\"setError\"\n      :clear-errors=\"clearErrors\"\n      :trigger=\"trigger\"\n      :reset=\"reset\"\n    />\n  </form>\n</template>\n"],"mappings":""}
+{"version":3,"file":"Form.js","names":[],"sources":["../../../src/components/form/Form.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { toRef, provide } from 'vue'\nimport { formContextKey, type FormContext, type ValidationMode } from './form.context'\nimport { createFormState } from './form.state'\n\nconst props = withDefaults(\n  defineProps<{\n    /** External form handle from useForm(). When provided, Form uses it instead of creating its own state. */\n    form?: FormContext\n    /** Centralized default values. Field-level defaultValue prop wins if both set. */\n    defaultValues?: Record<string, unknown>\n    validationMode?: ValidationMode\n    isDisabled?: boolean\n    class?: string\n  }>(),\n  {\n    form: undefined,\n    defaultValues: undefined,\n    validationMode: 'on-submit',\n    isDisabled: false,\n    class: undefined,\n  },\n)\n\nconst emit = defineEmits<{\n  submit: [payload: { values: Record<string, unknown>; setErrors: (e: Record<string, string>) => void }]\n  invalid: [errors: Record<string, string>]\n  reset: []\n}>()\n\nconst ctx: FormContext = props.form ?? createFormState({\n  defaultValues: props.defaultValues,\n  validationMode: toRef(props, 'validationMode'),\n  isDisabled: toRef(props, 'isDisabled'),\n})\n\nprovide(formContextKey, ctx)\n\n// Destructure into top-level <script setup> bindings so that:\n// 1. Vue's template compiler auto-unwraps refs/computeds in slot prop bindings\n// 2. wrapper.findComponent(Form).vm.* access works in tests (reads setup state directly)\nconst {\n  errors,\n  isSubmitting,\n  isSubmitted,\n  submitCount,\n  isValid,\n  isDirty,\n  isTouched,\n  values,\n  getValues,\n  setValue,\n  setErrors,\n  setError,\n  clearErrors,\n  trigger,\n} = ctx\n\nasync function onFormSubmit(): Promise<void> {\n  await ctx.handleSubmit(\n    (vals) => emit('submit', { values: vals, setErrors }),\n    (errs) => emit('invalid', errs),\n  )\n}\n\n// Named 'reset' (not onFormReset) so vm.reset is accessible via findComponent().vm\nfunction reset(): void {\n  ctx.reset()\n  emit('reset')\n}\n\ndefineExpose({\n  errors,\n  isSubmitting,\n  isSubmitted,\n  submitCount,\n  isValid,\n  isDirty,\n  isTouched,\n  values,\n  getValues,\n  setValue,\n  setErrors,\n  setError,\n  clearErrors,\n  trigger,\n  reset,\n})\n</script>\n\n<template>\n  <form\n    :class=\"props.class\"\n    novalidate\n    @submit.prevent=\"onFormSubmit\"\n  >\n    <slot\n      :values=\"values\"\n      :is-submitting=\"isSubmitting\"\n      :is-submitted=\"isSubmitted\"\n      :submit-count=\"submitCount\"\n      :is-disabled=\"props.isDisabled\"\n      :is-valid=\"isValid\"\n      :is-dirty=\"isDirty\"\n      :is-touched=\"isTouched\"\n      :errors=\"errors\"\n      :get-values=\"getValues\"\n      :set-value=\"setValue\"\n      :set-errors=\"setErrors\"\n      :set-error=\"setError\"\n      :clear-errors=\"clearErrors\"\n      :trigger=\"trigger\"\n      :reset=\"reset\"\n    />\n  </form>\n</template>\n"],"mappings":""}

package/dist/components/form/Form.vue_vue_type_script_setup_true_lang.js

@@ -1,10 +1,12 @@
 import { formContextKey } from "./form.context.js";
-import { runValidation } from "./validation.js";
-import { computed, createElementBlock, defineComponent, normalizeClass, openBlock, provide, ref, renderSlot, withModifiers } from "vue";
+import { createFormState } from "./form.state.js";
+import { createElementBlock, defineComponent, normalizeClass, openBlock, provide, renderSlot, toRef, unref, withModifiers } from "vue";
 //#region src/components/form/Form.vue?vue&type=script&setup=true&lang.ts
 var Form_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
 	__name: "Form",
 	props: {
+		form: { default: void 0 },
+		defaultValues: { default: void 0 },
 		validationMode: { default: "on-submit" },
 		isDisabled: {
 			type: Boolean,
@@ -20,151 +22,23 @@ var Form_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCom
 	setup(__props, { expose: __expose, emit: __emit }) {
 		const props = __props;
 		const emit = __emit;
-		const errors = ref({});
-		const isSubmitting = ref(false);
-		const isSubmitted = ref(false);
-		const submitCount = ref(0);
-		const fields = /* @__PURE__ */ new Map();
-		const fieldCount = ref(0);
-		function registerField(reg) {
-			fields.set(reg.name, reg);
-			fieldCount.value++;
-		}
-		function unregisterField(name) {
-			fields.delete(name);
-			fieldCount.value--;
-			const next = { ...errors.value };
-			delete next[name];
-			errors.value = next;
-		}
-		const isValid = computed(() => {
-			fieldCount.value;
-			return Object.keys(errors.value).length === 0;
-		});
-		const isDirty = computed(() => {
-			fieldCount.value;
-			for (const field of fields.values()) if (field.dirty.value) return true;
-			return false;
-		});
-		const isTouched = computed(() => {
-			fieldCount.value;
-			for (const field of fields.values()) if (field.touched.value) return true;
-			return false;
+		const ctx = props.form ?? createFormState({
+			defaultValues: props.defaultValues,
+			validationMode: toRef(props, "validationMode"),
+			isDisabled: toRef(props, "isDisabled")
 		});
-		function getAllValues() {
-			const values = {};
-			for (const [name, field] of fields.entries()) values[name] = field.getValue();
-			return values;
-		}
-		async function triggerFieldValidation(name) {
-			const field = fields.get(name);
-			if (!field) return;
-			const error = await runValidation(field.getValue(), field.rules, field.validate, { values: getAllValues() });
-			const next = { ...errors.value };
-			if (error) next[name] = error;
-			else delete next[name];
-			errors.value = next;
-		}
-		async function trigger(name) {
-			if (name) {
-				await triggerFieldValidation(name);
-				return !errors.value[name];
-			}
-			const results = await Promise.all([...fields.entries()].map(async ([fieldName, field]) => {
-				return {
-					name: fieldName,
-					error: await runValidation(field.getValue(), field.rules, field.validate, { values: getAllValues() })
-				};
-			}));
-			const next = {};
-			for (const { name: fieldName, error } of results) if (error) next[fieldName] = error;
-			errors.value = next;
-			return Object.keys(next).length === 0;
-		}
-		function setErrors(newErrors) {
-			errors.value = {
-				...errors.value,
-				...newErrors
-			};
-			isSubmitting.value = false;
-		}
-		function setError(name, message) {
-			errors.value = {
-				...errors.value,
-				[name]: message
-			};
-		}
-		function clearErrors(name) {
-			if (name) {
-				const next = { ...errors.value };
-				delete next[name];
-				errors.value = next;
-			} else errors.value = {};
-		}
-		function getValues() {
-			return getAllValues();
-		}
-		function setValue(name, value) {
-			const field = fields.get(name);
-			if (field) field.setValue(value);
+		provide(formContextKey, ctx);
+		const { errors, isSubmitting, isSubmitted, submitCount, isValid, isDirty, isTouched, values, getValues, setValue, setErrors, setError, clearErrors, trigger } = ctx;
+		async function onFormSubmit() {
+			await ctx.handleSubmit((vals) => emit("submit", {
+				values: vals,
+				setErrors
+			}), (errs) => emit("invalid", errs));
 		}
 		function reset() {
-			for (const field of fields.values()) field.reset();
-			errors.value = {};
-			isSubmitting.value = false;
-			isSubmitted.value = false;
-			submitCount.value = 0;
+			ctx.reset();
 			emit("reset");
 		}
-		async function handleSubmit() {
-			isSubmitting.value = true;
-			submitCount.value++;
-			const values = getAllValues();
-			const context = { values };
-			const results = await Promise.all([...fields.entries()].map(async ([name, field]) => {
-				return {
-					name,
-					error: await runValidation(field.getValue(), field.rules, field.validate, context)
-				};
-			}));
-			const nextErrors = {};
-			for (const { name, error } of results) if (error) nextErrors[name] = error;
-			if (Object.keys(nextErrors).length > 0) {
-				errors.value = nextErrors;
-				isSubmitting.value = false;
-				isSubmitted.value = true;
-				emit("invalid", nextErrors);
-				return;
-			}
-			errors.value = {};
-			isSubmitted.value = true;
-			isSubmitting.value = false;
-			emit("submit", {
-				values,
-				setErrors
-			});
-		}
-		provide(formContextKey, {
-			errors,
-			isSubmitting,
-			isSubmitted,
-			submitCount,
-			isDisabled: computed(() => props.isDisabled),
-			isValid,
-			isDirty,
-			isTouched,
-			validationMode: computed(() => props.validationMode),
-			registerField,
-			unregisterField,
-			triggerFieldValidation,
-			setErrors,
-			setError,
-			clearErrors,
-			getValues,
-			setValue,
-			trigger,
-			reset
-		});
 		__expose({
 			errors,
 			isSubmitting,
@@ -173,6 +47,7 @@ var Form_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCom
 			isValid,
 			isDirty,
 			isTouched,
+			values,
 			getValues,
 			setValue,
 			setErrors,
@@ -185,22 +60,23 @@ var Form_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCom
 			return openBlock(), createElementBlock("form", {
 				class: normalizeClass(props.class),
 				novalidate: "",
-				onSubmit: withModifiers(handleSubmit, ["prevent"])
+				onSubmit: withModifiers(onFormSubmit, ["prevent"])
 			}, [renderSlot(_ctx.$slots, "default", {
-				isSubmitting: isSubmitting.value,
-				isSubmitted: isSubmitted.value,
-				submitCount: submitCount.value,
+				values: unref(values),
+				isSubmitting: unref(isSubmitting),
+				isSubmitted: unref(isSubmitted),
+				submitCount: unref(submitCount),
 				isDisabled: props.isDisabled,
-				isValid: isValid.value,
-				isDirty: isDirty.value,
-				isTouched: isTouched.value,
-				errors: errors.value,
-				getValues,
-				setValue,
-				setErrors,
-				setError,
-				clearErrors,
-				trigger,
+				isValid: unref(isValid),
+				isDirty: unref(isDirty),
+				isTouched: unref(isTouched),
+				errors: unref(errors),
+				getValues: unref(getValues),
+				setValue: unref(setValue),
+				setErrors: unref(setErrors),
+				setError: unref(setError),
+				clearErrors: unref(clearErrors),
+				trigger: unref(trigger),
 				reset
 			})], 34);
 		};

package/dist/components/form/Form.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"Form.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/form/Form.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref, computed, provide } from 'vue'\nimport { formContextKey } from './form.context'\nimport { runValidation } from './validation'\nimport type { ValidationMode, FieldRegistration, FormContext } from './form.context'\n\nconst props = withDefaults(\n  defineProps<{\n    validationMode?: ValidationMode\n    isDisabled?: boolean\n    class?: string\n  }>(),\n  {\n    validationMode: 'on-submit',\n    isDisabled: false,\n    class: undefined,\n  },\n)\n\nconst emit = defineEmits<{\n  submit: [payload: { values: Record<string, unknown>; setErrors: (e: Record<string, string>) => void }]\n  invalid: [errors: Record<string, string>]\n  reset: []\n}>()\n\nconst errors = ref<Record<string, string>>({})\nconst isSubmitting = ref(false)\nconst isSubmitted = ref(false)\nconst submitCount = ref(0)\nconst fields = new Map<string, FieldRegistration>()\n\n// Reactive field count so computed properties re-evaluate when fields register/unregister\nconst fieldCount = ref(0)\n\nfunction registerField(reg: FieldRegistration): void {\n  fields.set(reg.name, reg)\n  fieldCount.value++\n}\n\nfunction unregisterField(name: string): void {\n  fields.delete(name)\n  fieldCount.value--\n  const next = { ...errors.value }\n  delete next[name]\n  errors.value = next\n}\n\n// ── Computed state ──────────────────────────────────────────────────────────\n\nconst isValid = computed(() => {\n  void fieldCount.value // track reactivity\n  return Object.keys(errors.value).length === 0\n})\n\nconst isDirty = computed(() => {\n  void fieldCount.value\n  for (const field of fields.values()) {\n    if (field.dirty.value) return true\n  }\n  return false\n})\n\nconst isTouched = computed(() => {\n  void fieldCount.value\n  for (const field of fields.values()) {\n    if (field.touched.value) return true\n  }\n  return false\n})\n\n// ── Helpers ─────────────────────────────────────────────────────────────────\n\nfunction getAllValues(): Record<string, unknown> {\n  const values: Record<string, unknown> = {}\n  for (const [name, field] of fields.entries()) {\n    values[name] = field.getValue()\n  }\n  return values\n}\n\n// ── Validation ───────────────────────────────────────────────────────────────\n\nasync function triggerFieldValidation(name: string): Promise<void> {\n  const field = fields.get(name)\n  if (!field) return\n  const error = await runValidation(\n    field.getValue(),\n    field.rules,\n    field.validate,\n    { values: getAllValues() },\n  )\n  const next = { ...errors.value }\n  if (error) {\n    next[name] = error\n  } else {\n    delete next[name]\n  }\n  errors.value = next\n}\n\nasync function trigger(name?: string): Promise<boolean> {\n  if (name) {\n    await triggerFieldValidation(name)\n    return !errors.value[name]\n  }\n\n  const results = await Promise.all(\n    [...fields.entries()].map(async ([fieldName, field]) => {\n      const error = await runValidation(\n        field.getValue(),\n        field.rules,\n        field.validate,\n        { values: getAllValues() },\n      )\n      return { name: fieldName, error }\n    }),\n  )\n\n  const next: Record<string, string> = {}\n  for (const { name: fieldName, error } of results) {\n    if (error) next[fieldName] = error\n  }\n  errors.value = next\n  return Object.keys(next).length === 0\n}\n\n// ── Error management ─────────────────────────────────────────────────────────\n\nfunction setErrors(newErrors: Record<string, string>): void {\n  errors.value = { ...errors.value, ...newErrors }\n  isSubmitting.value = false\n}\n\nfunction setError(name: string, message: string): void {\n  errors.value = { ...errors.value, [name]: message }\n}\n\nfunction clearErrors(name?: string): void {\n  if (name) {\n    const next = { ...errors.value }\n    delete next[name]\n    errors.value = next\n  } else {\n    errors.value = {}\n  }\n}\n\n// ── Values ───────────────────────────────────────────────────────────────────\n\nfunction getValues(): Record<string, unknown> {\n  return getAllValues()\n}\n\nfunction setValue(name: string, value: unknown): void {\n  const field = fields.get(name)\n  if (field) field.setValue(value)\n}\n\n// ── Reset ────────────────────────────────────────────────────────────────────\n\nfunction reset(): void {\n  for (const field of fields.values()) {\n    field.reset()\n  }\n  errors.value = {}\n  isSubmitting.value = false\n  isSubmitted.value = false\n  submitCount.value = 0\n  emit('reset')\n}\n\n// ── Submit ───────────────────────────────────────────────────────────────────\n\nasync function handleSubmit(): Promise<void> {\n  isSubmitting.value = true\n  submitCount.value++\n\n  const values = getAllValues()\n  const context = { values }\n\n  const results = await Promise.all(\n    [...fields.entries()].map(async ([name, field]) => {\n      const error = await runValidation(field.getValue(), field.rules, field.validate, context)\n      return { name, error }\n    }),\n  )\n\n  const nextErrors: Record<string, string> = {}\n  for (const { name, error } of results) {\n    if (error) nextErrors[name] = error\n  }\n\n  if (Object.keys(nextErrors).length > 0) {\n    errors.value = nextErrors\n    isSubmitting.value = false\n    isSubmitted.value = true\n    emit('invalid', nextErrors)\n    return\n  }\n\n  errors.value = {}\n  isSubmitted.value = true\n  isSubmitting.value = false\n  emit('submit', { values, setErrors })\n}\n\n// ── Context ──────────────────────────────────────────────────────────────────\n\nconst ctx: FormContext = {\n  errors,\n  isSubmitting,\n  isSubmitted,\n  submitCount,\n  isDisabled: computed(() => props.isDisabled),\n  isValid,\n  isDirty,\n  isTouched,\n  validationMode: computed(() => props.validationMode),\n  registerField,\n  unregisterField,\n  triggerFieldValidation,\n  setErrors,\n  setError,\n  clearErrors,\n  getValues,\n  setValue,\n  trigger,\n  reset,\n}\n\nprovide(formContextKey, ctx)\n\ndefineExpose({\n  errors,\n  isSubmitting,\n  isSubmitted,\n  submitCount,\n  isValid,\n  isDirty,\n  isTouched,\n  getValues,\n  setValue,\n  setErrors,\n  setError,\n  clearErrors,\n  trigger,\n  reset,\n})\n</script>\n\n<template>\n  <form\n    :class=\"props.class\"\n    novalidate\n    @submit.prevent=\"handleSubmit\"\n  >\n    <slot\n      :is-submitting=\"isSubmitting\"\n      :is-submitted=\"isSubmitted\"\n      :submit-count=\"submitCount\"\n      :is-disabled=\"props.isDisabled\"\n      :is-valid=\"isValid\"\n      :is-dirty=\"isDirty\"\n      :is-touched=\"isTouched\"\n      :errors=\"errors\"\n      :get-values=\"getValues\"\n      :set-value=\"setValue\"\n      :set-errors=\"setErrors\"\n      :set-error=\"setError\"\n      :clear-errors=\"clearErrors\"\n      :trigger=\"trigger\"\n      :reset=\"reset\"\n    />\n  </form>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"Form.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/form/Form.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { toRef, provide } from 'vue'\nimport { formContextKey, type FormContext, type ValidationMode } from './form.context'\nimport { createFormState } from './form.state'\n\nconst props = withDefaults(\n  defineProps<{\n    /** External form handle from useForm(). When provided, Form uses it instead of creating its own state. */\n    form?: FormContext\n    /** Centralized default values. Field-level defaultValue prop wins if both set. */\n    defaultValues?: Record<string, unknown>\n    validationMode?: ValidationMode\n    isDisabled?: boolean\n    class?: string\n  }>(),\n  {\n    form: undefined,\n    defaultValues: undefined,\n    validationMode: 'on-submit',\n    isDisabled: false,\n    class: undefined,\n  },\n)\n\nconst emit = defineEmits<{\n  submit: [payload: { values: Record<string, unknown>; setErrors: (e: Record<string, string>) => void }]\n  invalid: [errors: Record<string, string>]\n  reset: []\n}>()\n\nconst ctx: FormContext = props.form ?? createFormState({\n  defaultValues: props.defaultValues,\n  validationMode: toRef(props, 'validationMode'),\n  isDisabled: toRef(props, 'isDisabled'),\n})\n\nprovide(formContextKey, ctx)\n\n// Destructure into top-level <script setup> bindings so that:\n// 1. Vue's template compiler auto-unwraps refs/computeds in slot prop bindings\n// 2. wrapper.findComponent(Form).vm.* access works in tests (reads setup state directly)\nconst {\n  errors,\n  isSubmitting,\n  isSubmitted,\n  submitCount,\n  isValid,\n  isDirty,\n  isTouched,\n  values,\n  getValues,\n  setValue,\n  setErrors,\n  setError,\n  clearErrors,\n  trigger,\n} = ctx\n\nasync function onFormSubmit(): Promise<void> {\n  await ctx.handleSubmit(\n    (vals) => emit('submit', { values: vals, setErrors }),\n    (errs) => emit('invalid', errs),\n  )\n}\n\n// Named 'reset' (not onFormReset) so vm.reset is accessible via findComponent().vm\nfunction reset(): void {\n  ctx.reset()\n  emit('reset')\n}\n\ndefineExpose({\n  errors,\n  isSubmitting,\n  isSubmitted,\n  submitCount,\n  isValid,\n  isDirty,\n  isTouched,\n  values,\n  getValues,\n  setValue,\n  setErrors,\n  setError,\n  clearErrors,\n  trigger,\n  reset,\n})\n</script>\n\n<template>\n  <form\n    :class=\"props.class\"\n    novalidate\n    @submit.prevent=\"onFormSubmit\"\n  >\n    <slot\n      :values=\"values\"\n      :is-submitting=\"isSubmitting\"\n      :is-submitted=\"isSubmitted\"\n      :submit-count=\"submitCount\"\n      :is-disabled=\"props.isDisabled\"\n      :is-valid=\"isValid\"\n      :is-dirty=\"isDirty\"\n      :is-touched=\"isTouched\"\n      :errors=\"errors\"\n      :get-values=\"getValues\"\n      :set-value=\"setValue\"\n      :set-errors=\"setErrors\"\n      :set-error=\"setError\"\n      :clear-errors=\"clearErrors\"\n      :trigger=\"trigger\"\n      :reset=\"reset\"\n    />\n  </form>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;EAKA,MAAM,QAAQ;EAmBd,MAAM,OAAO;EAMb,MAAM,MAAmB,MAAM,QAAQ,gBAAgB;GACrD,eAAe,MAAM;GACrB,gBAAgB,MAAM,OAAO,iBAAiB;GAC9C,YAAY,MAAM,OAAO,aAAa;GACvC,CAAA;AAED,UAAQ,gBAAgB,IAAG;EAK3B,MAAM,EACJ,QACA,cACA,aACA,aACA,SACA,SACA,WACA,QACA,WACA,UACA,WACA,UACA,aACA,YACE;EAEJ,eAAe,eAA8B;AAC3C,SAAM,IAAI,cACP,SAAS,KAAK,UAAU;IAAE,QAAQ;IAAM;IAAW,CAAC,GACpD,SAAS,KAAK,WAAW,KAAK,CACjC;;EAIF,SAAS,QAAc;AACrB,OAAI,OAAM;AACV,QAAK,QAAO;;AAGd,WAAa;GACX;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CAAA;;uBAIC,mBAuBO,QAAA;IAtBJ,OAAK,eAAE,MAAM,MAAK;IACnB,YAAA;IACC,UAAM,cAAU,cAAY,CAAA,UAAA,CAAA;OAE7B,WAiBE,KAAA,QAAA,WAAA;IAhBC,QAAQ,MAAA,OAAM;IACd,cAAe,MAAA,aAAY;IAC3B,aAAc,MAAA,YAAW;IACzB,aAAc,MAAA,YAAW;IACzB,YAAa,MAAM;IACnB,SAAU,MAAA,QAAO;IACjB,SAAU,MAAA,QAAO;IACjB,WAAY,MAAA,UAAS;IACrB,QAAQ,MAAA,OAAM;IACd,WAAY,MAAA,UAAS;IACrB,UAAW,MAAA,SAAQ;IACnB,WAAY,MAAA,UAAS;IACrB,UAAW,MAAA,SAAQ;IACnB,aAAc,MAAA,YAAW;IACzB,SAAS,MAAA,QAAO;IACT"}

package/dist/components/form/FormField.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormField.js","names":[],"sources":["../../../src/components/form/FormField.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, onMounted, onUnmounted, ref, watch } from 'vue'\nimport { useFormInject } from './form.context'\nimport { runValidation } from './validation'\nimport type { FieldRules, CustomValidator } from './validation'\n\ndefineOptions({ inheritAttrs: false })\n\nconst props = defineProps<{\n  name: string\n  defaultValue?: unknown\n  rules?: FieldRules\n  validate?: CustomValidator\n  /** Override validation mode for this field. */\n  validationMode?: 'on-submit' | 'on-blur' | 'on-change'\n}>()\n\nconst modelValue = defineModel<unknown>({ default: undefined })\n\nconst ctx = useFormInject()\n\n// ── Field state ──────────────────────────────────────────────────────────────\n\nconst localError = ref<string | undefined>(undefined)\nconst touched = ref(false)\nconst dirty = ref(props.defaultValue !== undefined && modelValue.value !== props.defaultValue)\n\nconst fieldError = computed<string | undefined>(() =>\n  ctx ? ctx.errors.value[props.name] : localError.value,\n)\n\nconst hasBeenInvalid = ref(false)\nwatch(fieldError, (error) => { if (error) hasBeenInvalid.value = true })\n\nconst isInvalid = computed(() => !!fieldError.value)\nconst isDisabled = computed(() => ctx?.isDisabled.value ?? false)\nconst validationMode = computed(() => props.validationMode ?? ctx?.validationMode.value ?? 'on-submit')\n\n// ── Dirty tracking ───────────────────────────────────────────────────────────\n\nwatch(modelValue, (val) => {\n  dirty.value = val !== props.defaultValue\n})\n\n// ── Registration ─────────────────────────────────────────────────────────────\n\nfunction resetField(): void {\n  modelValue.value = props.defaultValue\n  localError.value = undefined\n  touched.value = false\n  dirty.value = false\n  hasBeenInvalid.value = false\n}\n\nonMounted(() => {\n  ctx?.registerField({\n    name: props.name,\n    getValue: () => modelValue.value,\n    getDefaultValue: () => props.defaultValue,\n    setValue: (val: unknown) => { modelValue.value = val },\n    reset: resetField,\n    touched,\n    dirty,\n    rules: props.rules,\n    validate: props.validate,\n  })\n})\n\nonUnmounted(() => {\n  ctx?.unregisterField(props.name)\n})\n\n// ── Validation ───────────────────────────────────────────────────────────────\n\nasync function triggerValidation(val: unknown): Promise<void> {\n  const context = ctx ? { values: ctx.getValues() } : undefined\n  const error = await runValidation(val, props.rules, props.validate, context)\n\n  if (ctx) {\n    const next = { ...ctx.errors.value }\n    if (error) {\n      next[props.name] = error\n    } else {\n      delete next[props.name]\n    }\n    ctx.errors.value = next\n  } else {\n    localError.value = error\n  }\n}\n\nasync function handleUpdate(val: unknown): Promise<void> {\n  modelValue.value = val\n  if (validationMode.value === 'on-change' || hasBeenInvalid.value) {\n    await triggerValidation(val)\n  }\n}\n\nasync function handleBlur(): Promise<void> {\n  touched.value = true\n  if (validationMode.value === 'on-blur') {\n    await triggerValidation(modelValue.value)\n  }\n}\n\n// ── Slot bindings ─────────────────────────────────────────────────────────────\n\nconst fieldProps = computed(() => ({\n  name: props.name,\n  modelValue: modelValue.value,\n  'onUpdate:modelValue': handleUpdate,\n  isInvalid: isInvalid.value,\n  errorMessage: fieldError.value,\n  isDisabled: isDisabled.value,\n  onBlur: handleBlur,\n}))\n</script>\n\n<template>\n  <slot\n    :field-props=\"fieldProps\"\n    :touched=\"touched\"\n    :dirty=\"dirty\"\n    :error=\"fieldError\"\n    :is-invalid=\"isInvalid\"\n  />\n</template>\n"],"mappings":""}
+{"version":3,"file":"FormField.js","names":[],"sources":["../../../src/components/form/FormField.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, onMounted, onUnmounted, ref, watch } from 'vue'\nimport { useFormInject } from './form.context'\nimport { runValidation } from './validation'\nimport type { FieldRules, CustomValidator } from './validation'\n\ndefineOptions({ inheritAttrs: false })\n\nconst props = defineProps<{\n  name: string\n  defaultValue?: unknown\n  rules?: FieldRules\n  validate?: CustomValidator\n  /** Override validation mode for this field. */\n  validationMode?: 'on-submit' | 'on-blur' | 'on-change'\n  /** Field names whose changes trigger re-validation of this field. */\n  deps?: string[]\n}>()\n\nconst modelValue = defineModel<unknown>({ default: undefined })\n\nconst ctx = useFormInject()\n\n// ── Default value resolution ─────────────────────────────────────────────────\n// Priority: field-level defaultValue prop > form-level defaultValues[name] > undefined\n\nconst resolvedDefault = computed(() => {\n  if (props.defaultValue !== undefined) return props.defaultValue\n  return ctx?.defaultValues[props.name]\n})\n\n// ── Field state ──────────────────────────────────────────────────────────────\n\nconst localError = ref<string | undefined>(undefined)\nconst touched = ref(false)\nconst dirty = ref(\n  resolvedDefault.value !== undefined && modelValue.value !== resolvedDefault.value,\n)\n\nconst fieldError = computed<string | undefined>(() =>\n  ctx ? ctx.errors.value[props.name] : localError.value,\n)\n\nconst hasBeenInvalid = ref(false)\nwatch(fieldError, (error) => { if (error) hasBeenInvalid.value = true })\n\nconst isInvalid = computed(() => !!fieldError.value)\nconst isDisabled = computed(() => ctx?.isDisabled.value ?? false)\nconst validationMode = computed(() => props.validationMode ?? ctx?.validationMode.value ?? 'on-submit')\n\n// ── Dirty tracking ───────────────────────────────────────────────────────────\n\nwatch(modelValue, (val) => {\n  dirty.value = val !== resolvedDefault.value\n})\n\n// ── Validation ───────────────────────────────────────────────────────────────\n\nasync function triggerValidation(val: unknown): Promise<void> {\n  const context = ctx ? { values: ctx.getValues() } : undefined\n  const error = await runValidation(val, props.rules, props.validate, context)\n\n  if (ctx) {\n    const next = { ...ctx.errors.value }\n    if (error) {\n      next[props.name] = error\n    } else {\n      delete next[props.name]\n    }\n    ctx.errors.value = next\n  } else {\n    localError.value = error\n  }\n}\n\nasync function handleUpdate(val: unknown): Promise<void> {\n  modelValue.value = val\n  if (validationMode.value === 'on-change' || hasBeenInvalid.value) {\n    await triggerValidation(val)\n  }\n}\n\nasync function handleBlur(): Promise<void> {\n  touched.value = true\n  if (validationMode.value === 'on-blur') {\n    await triggerValidation(modelValue.value)\n  }\n}\n\n// ── Deps watching ─────────────────────────────────────────────────────────────\n\nconst depStoppers: (() => void)[] = []\n\nfunction setupDepWatchers(deps: string[] | undefined): void {\n  for (const stop of depStoppers) stop()\n  depStoppers.length = 0\n  if (!ctx || !deps?.length) return\n  for (const dep of deps) {\n    const depRef = ctx.getFieldRef(dep)\n    if (!depRef) continue\n    depStoppers.push(watch(depRef, () => void triggerValidation(modelValue.value)))\n  }\n}\n\n// ── Registration ─────────────────────────────────────────────────────────────\n\nfunction resetField(): void {\n  modelValue.value = resolvedDefault.value\n  localError.value = undefined\n  touched.value = false\n  dirty.value = false\n  hasBeenInvalid.value = false\n}\n\nonMounted(() => {\n  // Initialize to resolved default when no value was passed by the parent\n  if (modelValue.value === undefined && resolvedDefault.value !== undefined) {\n    modelValue.value = resolvedDefault.value\n  }\n\n  ctx?.registerField({\n    name: props.name,\n    valueRef: modelValue,\n    getValue: () => modelValue.value,\n    getDefaultValue: () => resolvedDefault.value,\n    setValue: (val: unknown) => { modelValue.value = val },\n    reset: resetField,\n    touched,\n    dirty,\n    rules: props.rules,\n    validate: props.validate,\n  })\n\n  setupDepWatchers(props.deps)\n})\n\n// Watch a stable string key so the watcher only tears down/rebuilds when the\n// dep list contents actually change — not on every re-render where the parent\n// passes a new array literal with the same elements (Object.is differs by ref).\nwatch(\n  () => props.deps?.join('\\0') ?? '',\n  () => setupDepWatchers(props.deps),\n)\n\nonUnmounted(() => {\n  for (const stop of depStoppers) stop()\n  ctx?.unregisterField(props.name)\n})\n\n// ── Slot bindings ─────────────────────────────────────────────────────────────\n\nconst fieldProps = computed(() => ({\n  name: props.name,\n  modelValue: modelValue.value,\n  'onUpdate:modelValue': handleUpdate,\n  isInvalid: isInvalid.value,\n  errorMessage: fieldError.value,\n  isDisabled: isDisabled.value,\n  onBlur: handleBlur,\n}))\n</script>\n\n<template>\n  <slot\n    :field-props=\"fieldProps\"\n    :touched=\"touched\"\n    :dirty=\"dirty\"\n    :error=\"fieldError\"\n    :is-invalid=\"isInvalid\"\n  />\n</template>\n"],"mappings":""}