@iris-ui-kit/vue 0.1.0

package/dist/floating.d.ts

@@ -0,0 +1,106 @@
+import { Ref, ComputedRef } from 'vue';
+import { Placement, Strategy, Middleware } from '@floating-ui/dom';
+export { Middleware, Strategy } from '@floating-ui/dom';
+
+interface UseFloatingOptions {
+    /** Element the floating panel is positioned relative to. */
+    anchor: Ref<HTMLElement | null | undefined>;
+    /** The floating element itself. */
+    floating: Ref<HTMLElement | null | undefined>;
+    /** Whether the floating element is visible. Controls `autoUpdate` lifecycle. */
+    open: Ref<boolean>;
+    /** Default placement. Floating UI may flip it if `flip` is true. */
+    placement?: Placement;
+    /** CSS position strategy. */
+    strategy?: Strategy;
+    /** Pixel offset between anchor and floating element. */
+    offset?: number;
+    /** Flip to the opposite side when the requested side overflows. Default `true`. */
+    flip?: boolean;
+    /** Shift along the cross-axis to stay in view. Default `true`. */
+    shift?: boolean;
+    /**
+     * Constrain the floating element to the available viewport space — sets
+     * `maxWidth`/`maxHeight` (minus 8px padding) on it so a long dropdown/popover
+     * never overflows the screen (pair with `overflow:auto` for scroll). Off by
+     * default. Pass a number to override the viewport padding.
+     */
+    size?: boolean | number;
+    /** Extra Floating UI middleware to append. */
+    middleware?: Middleware[];
+    /**
+     * Optional ref to an arrow element inside the floating panel. When provided,
+     * `arrowX`, `arrowY`, and `arrowSide` in the return value are populated.
+     */
+    arrow?: Ref<HTMLElement | null | undefined>;
+}
+interface UseFloatingReturn {
+    /** Computed x coordinate (px). */
+    x: Ref<number>;
+    /** Computed y coordinate (px). */
+    y: Ref<number>;
+    /** Final strategy (echo of input). */
+    strategy: Ref<Strategy>;
+    /** Final placement, possibly flipped from the input placement. */
+    finalPlacement: Ref<Placement>;
+    /** Ready-to-bind inline style object for the floating element. */
+    floatingStyles: ComputedRef<Record<string, string>>;
+    /** Trigger a manual recompute. Usually not needed — `autoUpdate` handles scrolling/resizing. */
+    update: () => Promise<void>;
+    /** Arrow x offset (px). Present when `arrow` option is set. */
+    arrowX: Ref<number | undefined>;
+    /** Arrow y offset (px). Present when `arrow` option is set. */
+    arrowY: Ref<number | undefined>;
+    /**
+     * Side of the floating element the arrow is on.
+     * E.g. `'bottom'` placement → `'top'` (arrow at top pointing up).
+     */
+    arrowSide: ComputedRef<'top' | 'right' | 'bottom' | 'left' | undefined>;
+}
+/**
+ * Reactive Floating UI integration. Subscribes `autoUpdate` whenever
+ * `open === true` and both refs are populated; tears it down on close,
+ * unmount, or ref clearing. Returns `floatingStyles` ready to be spread onto
+ * the floating element.
+ *
+ * Pure positioning — does NOT render anything, does NOT manage focus,
+ * does NOT handle dismiss behavior. Those concerns live in the consuming
+ * primitive (Popover, Tooltip, Dialog, Menu, ...).
+ *
+ * @example
+ *   const triggerEl = ref<HTMLElement | null>(null)
+ *   const contentEl = ref<HTMLElement | null>(null)
+ *   const open = ref(false)
+ *   const { floatingStyles } = useFloating({
+ *     anchor: triggerEl,
+ *     floating: contentEl,
+ *     open,
+ *     placement: 'bottom-start',
+ *     offset: 8,
+ *   })
+ */
+declare function useFloating(options: UseFloatingOptions): UseFloatingReturn;
+
+interface UseDismissOptions {
+    /** While true, the dismiss listeners are active. */
+    enabled: Ref<boolean>;
+    /** Elements that, if clicked, should NOT trigger dismiss (typically trigger + content). */
+    exclude: Array<Ref<HTMLElement | null | undefined>>;
+    /** Called when the user attempts to dismiss the surface. */
+    onDismiss: () => void;
+    /** Close on Escape key. Default `true`. */
+    escape?: boolean;
+    /** Close on pointerdown outside the excluded elements. Default `true`. */
+    outsidePointerDown?: boolean;
+}
+/**
+ * Listen for the universal "dismiss" gestures: Escape key and outside
+ * pointer-down. Used by Popover / Dialog / Menu / Combobox. Tooltip does
+ * NOT use this — it dismisses on mouseleave/blur instead.
+ *
+ * Listeners are attached to `document` only while `enabled` is true, and
+ * removed on disable / unmount. SSR-safe (no-op without `document`).
+ */
+declare function useDismiss(options: UseDismissOptions): void;
+
+export { type UseDismissOptions, type UseFloatingOptions, type UseFloatingReturn, useDismiss, useFloating };

package/dist/floating.js

@@ -0,0 +1,4 @@
+import './chunk-ROJV6RON.js';
+export { useDismiss, useFloating } from './chunk-3FJUCHCC.js';
+//# sourceMappingURL=floating.js.map
+//# sourceMappingURL=floating.js.map

package/dist/floating.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"floating.js"}

package/dist/form.cjs

@@ -0,0 +1,144 @@
+'use strict';
+
+var vue = require('vue');
+var core = require('@iris-ui-kit/core');
+
+// src/form/Form.ts
+var FormInjectionKey = /* @__PURE__ */ Symbol("IrisForm");
+function useFormContext() {
+  const form = vue.inject(FormInjectionKey, null);
+  if (!form) {
+    throw new Error("useField / useFormContext must be used within an <IrisForm>");
+  }
+  return form;
+}
+
+// src/form/Form.ts
+function focusFirstError(formEl, errors) {
+  if (!formEl) return;
+  const keys = Object.keys(errors);
+  if (keys.length === 0) return;
+  const controls = formEl.querySelectorAll(
+    "input[name], select[name], textarea[name], [data-iris-field]"
+  );
+  for (const el of Array.from(controls)) {
+    const name = el.getAttribute("name") ?? el.getAttribute("data-iris-field");
+    if (name && keys.includes(name)) {
+      el.focus();
+      try {
+        el.scrollIntoView({ block: "center" });
+      } catch {
+      }
+      return;
+    }
+  }
+}
+var IrisForm = vue.defineComponent({
+  name: "IrisForm",
+  props: {
+    /** The store from `useForm(...).form`. */
+    form: {
+      type: Object,
+      required: true
+    }
+  },
+  setup(props, { slots }) {
+    vue.provide(FormInjectionKey, props.form);
+    const formRef = vue.ref(null);
+    return () => vue.h(
+      "form",
+      {
+        ref: formRef,
+        "data-iris-form": "",
+        onSubmit: (event) => {
+          event.preventDefault();
+          void props.form.handleSubmit().then(() => focusFirstError(formRef.value, props.form.getState().errors));
+        }
+      },
+      slots.default?.()
+    );
+  }
+});
+function useForm(config) {
+  const form = core.createFormStore(config);
+  const state = vue.ref(form.getState());
+  const unsubscribe = form.subscribe((next) => {
+    state.value = next;
+  });
+  vue.onBeforeUnmount(unsubscribe);
+  return {
+    form,
+    state,
+    values: vue.computed(() => state.value.values),
+    errors: vue.computed(() => state.value.errors),
+    touched: vue.computed(() => state.value.touched),
+    dirty: vue.computed(() => state.value.dirty),
+    isSubmitting: vue.computed(() => state.value.isSubmitting),
+    isValidating: vue.computed(() => state.value.isValidating),
+    submitCount: vue.computed(() => state.value.submitCount),
+    isValid: vue.computed(() => Object.keys(state.value.errors).length === 0),
+    setFieldValue: form.setFieldValue,
+    setValues: form.setValues,
+    setFieldTouched: form.setFieldTouched,
+    setFieldError: form.setFieldError,
+    setErrors: form.setErrors,
+    validateField: form.validateField,
+    validateForm: form.validateForm,
+    handleSubmit: form.handleSubmit,
+    reset: form.reset
+  };
+}
+function useField(name) {
+  const form = useFormContext();
+  const state = vue.ref(form.getState());
+  const unsubscribe = form.subscribe((next) => {
+    state.value = next;
+  });
+  vue.onBeforeUnmount(unsubscribe);
+  const key = core.formatPath(name);
+  const value = vue.computed(() => core.getByPath(state.value.values, name));
+  const error = vue.computed(() => state.value.errors[key]);
+  return {
+    name,
+    value,
+    error,
+    touched: vue.computed(() => Boolean(state.value.touched[key])),
+    dirty: vue.computed(() => Boolean(state.value.dirty[key])),
+    setValue: (next) => form.setFieldValue(name, next),
+    setTouched: (touched = true) => form.setFieldTouched(name, touched),
+    fieldProps: vue.computed(() => ({
+      modelValue: value.value,
+      "onUpdate:modelValue": (next) => form.setFieldValue(name, next),
+      invalid: Boolean(error.value),
+      onBlur: () => form.setFieldTouched(name, true)
+    }))
+  };
+}
+function useFieldArray(name) {
+  const form = useFormContext();
+  const state = vue.ref(form.getState());
+  const unsubscribe = form.subscribe((next) => {
+    state.value = next;
+  });
+  vue.onBeforeUnmount(unsubscribe);
+  return {
+    name,
+    fields: vue.computed(
+      () => Array.isArray(state.value.values[name]) ? state.value.values[name] : []
+    ),
+    push: (item) => form.arrayPush(name, item),
+    remove: (index) => form.arrayRemove(name, index),
+    insert: (index, item) => form.arrayInsert(name, index, item),
+    move: (from, to) => form.arrayMove(name, from, to),
+    replace: (items) => form.setFieldValue(name, items)
+  };
+}
+
+exports.FormInjectionKey = FormInjectionKey;
+exports.IrisForm = IrisForm;
+exports.useField = useField;
+exports.useFieldArray = useFieldArray;
+exports.useForm = useForm;
+exports.useFormContext = useFormContext;
+//# sourceMappingURL=form.cjs.map
+//# sourceMappingURL=form.cjs.map

package/dist/form.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/form/context.ts","../src/form/Form.ts","../src/form/useForm.ts","../src/form/useField.ts","../src/form/useFieldArray.ts"],"names":["inject","defineComponent","provide","ref","h","createFormStore","onBeforeUnmount","computed","formatPath","getByPath"],"mappings":"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","file":"form.cjs","sourcesContent":["import { inject, type InjectionKey } from 'vue'\nimport type { FormStore, FormValues } from '@iris-ui-kit/core'\n\n/**\n * Provides the active form's {@link FormStore} to descendant fields so\n * `useField` can bind without prop drilling. The generic is erased at the\n * injection boundary; `useField<T>` re-applies the value type at the call site.\n */\nexport const FormInjectionKey: InjectionKey<FormStore<FormValues>> = Symbol('IrisForm')\n\nexport function useFormContext(): FormStore<FormValues> {\n  const form = inject(FormInjectionKey, null)\n  if (!form) {\n    throw new Error('useField / useFormContext must be used within an <IrisForm>')\n  }\n  return form\n}\n","import { defineComponent, h, provide, ref, type PropType } from 'vue'\nimport type { FormStore, FormValues } from '@iris-ui-kit/core'\nimport { FormInjectionKey } from './context'\n\n/** Focus (and best-effort scroll to) the first errored named control in DOM order. */\nfunction focusFirstError(\n  formEl: HTMLElement | null,\n  errors: Record<string, string | undefined>,\n): void {\n  if (!formEl) return\n  const keys = Object.keys(errors)\n  if (keys.length === 0) return\n  const controls = formEl.querySelectorAll<HTMLElement>(\n    'input[name], select[name], textarea[name], [data-iris-field]',\n  )\n  for (const el of Array.from(controls)) {\n    const name = el.getAttribute('name') ?? el.getAttribute('data-iris-field')\n    if (name && keys.includes(name)) {\n      el.focus()\n      try {\n        el.scrollIntoView({ block: 'center' })\n      } catch {\n        /* scrollIntoView is unavailable in jsdom — focus is the contract */\n      }\n      return\n    }\n  }\n}\n\n/**\n * Provides the form store to descendant `useField` calls and wires the native\n * `<form>` submit to `handleSubmit` (with `preventDefault`). Composition:\n *\n * ```html\n * <IrisForm :form=\"f.form\">\n *   <IrisFormField label=\"Email\"><IrisInput v-bind=\"email.fieldProps.value\" /></IrisFormField>\n *   <IrisButton type=\"submit\" :disabled=\"f.isSubmitting.value\">Save</IrisButton>\n * </IrisForm>\n * ```\n */\nexport const IrisForm = defineComponent({\n  name: 'IrisForm',\n  props: {\n    /** The store from `useForm(...).form`. */\n    form: {\n      type: Object as PropType<FormStore<FormValues>>,\n      required: true,\n    },\n  },\n  setup(props, { slots }) {\n    provide(FormInjectionKey, props.form)\n    const formRef = ref<HTMLElement | null>(null)\n    return () =>\n      h(\n        'form',\n        {\n          ref: formRef,\n          'data-iris-form': '',\n          onSubmit: (event: Event) => {\n            event.preventDefault()\n            // On a failed submit, move focus to the first errored field (a11y).\n            void props.form\n              .handleSubmit()\n              .then(() => focusFirstError(formRef.value, props.form.getState().errors))\n          },\n        },\n        slots.default?.(),\n      )\n  },\n})\n","import { computed, onBeforeUnmount, ref, type ComputedRef, type Ref } from 'vue'\nimport {\n  createFormStore,\n  type FieldErrors,\n  type FieldFlags,\n  type FormConfig,\n  type FormState,\n  type FormStore,\n  type FormValues,\n} from '@iris-ui-kit/core'\n\nexport interface UseFormReturn<V extends FormValues> {\n  /** The form store — pass to `<IrisForm :form=\"...\">`. */\n  form: FormStore<V>\n  /** The full reactive state snapshot. */\n  state: Ref<FormState<V>>\n  values: ComputedRef<V>\n  errors: ComputedRef<FieldErrors<V>>\n  touched: ComputedRef<FieldFlags<V>>\n  dirty: ComputedRef<FieldFlags<V>>\n  isSubmitting: ComputedRef<boolean>\n  isValidating: ComputedRef<boolean>\n  submitCount: ComputedRef<number>\n  isValid: ComputedRef<boolean>\n  setFieldValue: FormStore<V>['setFieldValue']\n  setValues: FormStore<V>['setValues']\n  setFieldTouched: FormStore<V>['setFieldTouched']\n  setFieldError: FormStore<V>['setFieldError']\n  setErrors: FormStore<V>['setErrors']\n  validateField: FormStore<V>['validateField']\n  validateForm: FormStore<V>['validateForm']\n  handleSubmit: FormStore<V>['handleSubmit']\n  reset: FormStore<V>['reset']\n}\n\n/**\n * Vue binding for the framework-agnostic form engine. Creates the store in\n * `setup()` (runs once) and bridges it into Vue reactivity via a `ref` updated\n * on each store change, cleaned up on unmount. Because `setup` runs once,\n * `onSubmit` / `validate` closures stay live against reactive state — no\n * stale-callback handling is needed (unlike the React adapter).\n */\nexport function useForm<V extends FormValues>(config: FormConfig<V>): UseFormReturn<V> {\n  const form = createFormStore(config)\n  const state = ref(form.getState()) as Ref<FormState<V>>\n  const unsubscribe = form.subscribe((next) => {\n    state.value = next\n  })\n  onBeforeUnmount(unsubscribe)\n\n  return {\n    form,\n    state,\n    values: computed(() => state.value.values),\n    errors: computed(() => state.value.errors),\n    touched: computed(() => state.value.touched),\n    dirty: computed(() => state.value.dirty),\n    isSubmitting: computed(() => state.value.isSubmitting),\n    isValidating: computed(() => state.value.isValidating),\n    submitCount: computed(() => state.value.submitCount),\n    isValid: computed(() => Object.keys(state.value.errors).length === 0),\n    setFieldValue: form.setFieldValue,\n    setValues: form.setValues,\n    setFieldTouched: form.setFieldTouched,\n    setFieldError: form.setFieldError,\n    setErrors: form.setErrors,\n    validateField: form.validateField,\n    validateForm: form.validateForm,\n    handleSubmit: form.handleSubmit,\n    reset: form.reset,\n  }\n}\n","import { computed, onBeforeUnmount, ref, type ComputedRef, type Ref } from 'vue'\nimport { formatPath, getByPath, type FormState, type FormValues } from '@iris-ui-kit/core'\nimport { useFormContext } from './context'\n\nexport interface FieldBindProps {\n  modelValue: unknown\n  'onUpdate:modelValue': (value: unknown) => void\n  invalid: boolean\n  onBlur: () => void\n}\n\nexport interface UseFieldReturn<T> {\n  name: string\n  value: ComputedRef<T>\n  error: ComputedRef<string | undefined>\n  touched: ComputedRef<boolean>\n  dirty: ComputedRef<boolean>\n  setValue: (value: T) => void\n  setTouched: (touched?: boolean) => void\n  /**\n   * Bundle for `v-bind` onto a v-model'd Iris control (`IrisInput`,\n   * `IrisSelect`, …): wires `modelValue` / `update:modelValue` / `invalid` /\n   * `blur`. Use `value` + `setValue` directly for bespoke bindings.\n   */\n  fieldProps: ComputedRef<FieldBindProps>\n}\n\n/**\n * Binds a single field to the surrounding `<IrisForm>`. `T` is the value type\n * at the call site (the injection erases the form's generic).\n *\n * `name` may be a flat top-level key OR a nested PATH (`'address.city'`,\n * `'items[2].sku'`); a flat key is a 1-segment path and stays back-compatible\n * (v3 R19).\n */\nexport function useField<T = unknown>(name: string): UseFieldReturn<T> {\n  const form = useFormContext()\n  const state = ref(form.getState()) as Ref<FormState<FormValues>>\n  const unsubscribe = form.subscribe((next) => {\n    state.value = next\n  })\n  onBeforeUnmount(unsubscribe)\n\n  // Canonical key for per-field state lookups (a flat key maps to itself).\n  const key = formatPath(name)\n  const value = computed(() => getByPath(state.value.values, name) as T)\n  const error = computed(() => state.value.errors[key])\n\n  return {\n    name,\n    value,\n    error,\n    touched: computed(() => Boolean(state.value.touched[key])),\n    dirty: computed(() => Boolean(state.value.dirty[key])),\n    setValue: (next) => form.setFieldValue(name, next as never),\n    setTouched: (touched = true) => form.setFieldTouched(name, touched),\n    fieldProps: computed(() => ({\n      modelValue: value.value,\n      'onUpdate:modelValue': (next: unknown) => form.setFieldValue(name, next as never),\n      invalid: Boolean(error.value),\n      onBlur: () => form.setFieldTouched(name, true),\n    })),\n  }\n}\n","import { computed, onBeforeUnmount, ref, type ComputedRef, type Ref } from 'vue'\nimport type { FormState, FormValues } from '@iris-ui-kit/core'\nimport { useFormContext } from './context'\n\nexport interface UseFieldArrayReturn<T> {\n  name: string\n  /** Current array value (reactive). */\n  fields: ComputedRef<T[]>\n  /** Append an item. */\n  push: (item: T) => void\n  /** Remove the item at `index`. */\n  remove: (index: number) => void\n  /** Insert `item` at `index` (shifting the rest right). */\n  insert: (index: number, item: T) => void\n  /** Move the item from `from` to `to`. */\n  move: (from: number, to: number) => void\n  /** Replace the whole array. */\n  replace: (items: T[]) => void\n}\n\n/**\n * Manage a dynamic array field (repeatable rows) inside an `<IrisForm>`. Mutators\n * delegate to the core {@link FormStore} array helpers (`arrayPush`/`arrayInsert`/\n * `arrayRemove`/`arrayMove`), which RE-KEY each element's error/touched/dirty/\n * validating state across the mutation — so a row's per-element validation state\n * FOLLOWS the row when rows are removed or reordered (removing `items[0]` shifts\n * `items[2]`'s error down to `items[1]`). `replace` swaps the whole array.\n */\nexport function useFieldArray<T = unknown>(name: string): UseFieldArrayReturn<T> {\n  const form = useFormContext()\n  const state = ref(form.getState()) as Ref<FormState<FormValues>>\n  const unsubscribe = form.subscribe((next) => {\n    state.value = next\n  })\n  onBeforeUnmount(unsubscribe)\n\n  return {\n    name,\n    fields: computed(\n      () => (Array.isArray(state.value.values[name]) ? state.value.values[name] : []) as T[],\n    ),\n    push: (item) => form.arrayPush(name as never, item as never),\n    remove: (index) => form.arrayRemove(name as never, index),\n    insert: (index, item) => form.arrayInsert(name as never, index, item as never),\n    move: (from, to) => form.arrayMove(name as never, from, to),\n    replace: (items) => form.setFieldValue(name, items as never),\n  }\n}\n"]}

package/dist/form.d.cts

@@ -0,0 +1,128 @@
+import * as vue from 'vue';
+import { PropType, Ref, ComputedRef, InjectionKey } from 'vue';
+import { FormStore, FormValues, FormState, FieldErrors, FieldFlags, FormConfig } from '@iris-ui-kit/core';
+
+/**
+ * Provides the form store to descendant `useField` calls and wires the native
+ * `<form>` submit to `handleSubmit` (with `preventDefault`). Composition:
+ *
+ * ```html
+ * <IrisForm :form="f.form">
+ *   <IrisFormField label="Email"><IrisInput v-bind="email.fieldProps.value" /></IrisFormField>
+ *   <IrisButton type="submit" :disabled="f.isSubmitting.value">Save</IrisButton>
+ * </IrisForm>
+ * ```
+ */
+declare const IrisForm: vue.DefineComponent<vue.ExtractPropTypes<{
+    /** The store from `useForm(...).form`. */
+    form: {
+        type: PropType<FormStore<FormValues>>;
+        required: true;
+    };
+}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    /** The store from `useForm(...).form`. */
+    form: {
+        type: PropType<FormStore<FormValues>>;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+
+interface UseFormReturn<V extends FormValues> {
+    /** The form store — pass to `<IrisForm :form="...">`. */
+    form: FormStore<V>;
+    /** The full reactive state snapshot. */
+    state: Ref<FormState<V>>;
+    values: ComputedRef<V>;
+    errors: ComputedRef<FieldErrors<V>>;
+    touched: ComputedRef<FieldFlags<V>>;
+    dirty: ComputedRef<FieldFlags<V>>;
+    isSubmitting: ComputedRef<boolean>;
+    isValidating: ComputedRef<boolean>;
+    submitCount: ComputedRef<number>;
+    isValid: ComputedRef<boolean>;
+    setFieldValue: FormStore<V>['setFieldValue'];
+    setValues: FormStore<V>['setValues'];
+    setFieldTouched: FormStore<V>['setFieldTouched'];
+    setFieldError: FormStore<V>['setFieldError'];
+    setErrors: FormStore<V>['setErrors'];
+    validateField: FormStore<V>['validateField'];
+    validateForm: FormStore<V>['validateForm'];
+    handleSubmit: FormStore<V>['handleSubmit'];
+    reset: FormStore<V>['reset'];
+}
+/**
+ * Vue binding for the framework-agnostic form engine. Creates the store in
+ * `setup()` (runs once) and bridges it into Vue reactivity via a `ref` updated
+ * on each store change, cleaned up on unmount. Because `setup` runs once,
+ * `onSubmit` / `validate` closures stay live against reactive state — no
+ * stale-callback handling is needed (unlike the React adapter).
+ */
+declare function useForm<V extends FormValues>(config: FormConfig<V>): UseFormReturn<V>;
+
+interface FieldBindProps {
+    modelValue: unknown;
+    'onUpdate:modelValue': (value: unknown) => void;
+    invalid: boolean;
+    onBlur: () => void;
+}
+interface UseFieldReturn<T> {
+    name: string;
+    value: ComputedRef<T>;
+    error: ComputedRef<string | undefined>;
+    touched: ComputedRef<boolean>;
+    dirty: ComputedRef<boolean>;
+    setValue: (value: T) => void;
+    setTouched: (touched?: boolean) => void;
+    /**
+     * Bundle for `v-bind` onto a v-model'd Iris control (`IrisInput`,
+     * `IrisSelect`, …): wires `modelValue` / `update:modelValue` / `invalid` /
+     * `blur`. Use `value` + `setValue` directly for bespoke bindings.
+     */
+    fieldProps: ComputedRef<FieldBindProps>;
+}
+/**
+ * Binds a single field to the surrounding `<IrisForm>`. `T` is the value type
+ * at the call site (the injection erases the form's generic).
+ *
+ * `name` may be a flat top-level key OR a nested PATH (`'address.city'`,
+ * `'items[2].sku'`); a flat key is a 1-segment path and stays back-compatible
+ * (v3 R19).
+ */
+declare function useField<T = unknown>(name: string): UseFieldReturn<T>;
+
+interface UseFieldArrayReturn<T> {
+    name: string;
+    /** Current array value (reactive). */
+    fields: ComputedRef<T[]>;
+    /** Append an item. */
+    push: (item: T) => void;
+    /** Remove the item at `index`. */
+    remove: (index: number) => void;
+    /** Insert `item` at `index` (shifting the rest right). */
+    insert: (index: number, item: T) => void;
+    /** Move the item from `from` to `to`. */
+    move: (from: number, to: number) => void;
+    /** Replace the whole array. */
+    replace: (items: T[]) => void;
+}
+/**
+ * Manage a dynamic array field (repeatable rows) inside an `<IrisForm>`. Mutators
+ * delegate to the core {@link FormStore} array helpers (`arrayPush`/`arrayInsert`/
+ * `arrayRemove`/`arrayMove`), which RE-KEY each element's error/touched/dirty/
+ * validating state across the mutation — so a row's per-element validation state
+ * FOLLOWS the row when rows are removed or reordered (removing `items[0]` shifts
+ * `items[2]`'s error down to `items[1]`). `replace` swaps the whole array.
+ */
+declare function useFieldArray<T = unknown>(name: string): UseFieldArrayReturn<T>;
+
+/**
+ * Provides the active form's {@link FormStore} to descendant fields so
+ * `useField` can bind without prop drilling. The generic is erased at the
+ * injection boundary; `useField<T>` re-applies the value type at the call site.
+ */
+declare const FormInjectionKey: InjectionKey<FormStore<FormValues>>;
+declare function useFormContext(): FormStore<FormValues>;
+
+export { type FieldBindProps, FormInjectionKey, IrisForm, type UseFieldArrayReturn, type UseFieldReturn, type UseFormReturn, useField, useFieldArray, useForm, useFormContext };

package/dist/form.d.ts

@@ -0,0 +1,128 @@
+import * as vue from 'vue';
+import { PropType, Ref, ComputedRef, InjectionKey } from 'vue';
+import { FormStore, FormValues, FormState, FieldErrors, FieldFlags, FormConfig } from '@iris-ui-kit/core';
+
+/**
+ * Provides the form store to descendant `useField` calls and wires the native
+ * `<form>` submit to `handleSubmit` (with `preventDefault`). Composition:
+ *
+ * ```html
+ * <IrisForm :form="f.form">
+ *   <IrisFormField label="Email"><IrisInput v-bind="email.fieldProps.value" /></IrisFormField>
+ *   <IrisButton type="submit" :disabled="f.isSubmitting.value">Save</IrisButton>
+ * </IrisForm>
+ * ```
+ */
+declare const IrisForm: vue.DefineComponent<vue.ExtractPropTypes<{
+    /** The store from `useForm(...).form`. */
+    form: {
+        type: PropType<FormStore<FormValues>>;
+        required: true;
+    };
+}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    /** The store from `useForm(...).form`. */
+    form: {
+        type: PropType<FormStore<FormValues>>;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+
+interface UseFormReturn<V extends FormValues> {
+    /** The form store — pass to `<IrisForm :form="...">`. */
+    form: FormStore<V>;
+    /** The full reactive state snapshot. */
+    state: Ref<FormState<V>>;
+    values: ComputedRef<V>;
+    errors: ComputedRef<FieldErrors<V>>;
+    touched: ComputedRef<FieldFlags<V>>;
+    dirty: ComputedRef<FieldFlags<V>>;
+    isSubmitting: ComputedRef<boolean>;
+    isValidating: ComputedRef<boolean>;
+    submitCount: ComputedRef<number>;
+    isValid: ComputedRef<boolean>;
+    setFieldValue: FormStore<V>['setFieldValue'];
+    setValues: FormStore<V>['setValues'];
+    setFieldTouched: FormStore<V>['setFieldTouched'];
+    setFieldError: FormStore<V>['setFieldError'];
+    setErrors: FormStore<V>['setErrors'];
+    validateField: FormStore<V>['validateField'];
+    validateForm: FormStore<V>['validateForm'];
+    handleSubmit: FormStore<V>['handleSubmit'];
+    reset: FormStore<V>['reset'];
+}
+/**
+ * Vue binding for the framework-agnostic form engine. Creates the store in
+ * `setup()` (runs once) and bridges it into Vue reactivity via a `ref` updated
+ * on each store change, cleaned up on unmount. Because `setup` runs once,
+ * `onSubmit` / `validate` closures stay live against reactive state — no
+ * stale-callback handling is needed (unlike the React adapter).
+ */
+declare function useForm<V extends FormValues>(config: FormConfig<V>): UseFormReturn<V>;
+
+interface FieldBindProps {
+    modelValue: unknown;
+    'onUpdate:modelValue': (value: unknown) => void;
+    invalid: boolean;
+    onBlur: () => void;
+}
+interface UseFieldReturn<T> {
+    name: string;
+    value: ComputedRef<T>;
+    error: ComputedRef<string | undefined>;
+    touched: ComputedRef<boolean>;
+    dirty: ComputedRef<boolean>;
+    setValue: (value: T) => void;
+    setTouched: (touched?: boolean) => void;
+    /**
+     * Bundle for `v-bind` onto a v-model'd Iris control (`IrisInput`,
+     * `IrisSelect`, …): wires `modelValue` / `update:modelValue` / `invalid` /
+     * `blur`. Use `value` + `setValue` directly for bespoke bindings.
+     */
+    fieldProps: ComputedRef<FieldBindProps>;
+}
+/**
+ * Binds a single field to the surrounding `<IrisForm>`. `T` is the value type
+ * at the call site (the injection erases the form's generic).
+ *
+ * `name` may be a flat top-level key OR a nested PATH (`'address.city'`,
+ * `'items[2].sku'`); a flat key is a 1-segment path and stays back-compatible
+ * (v3 R19).
+ */
+declare function useField<T = unknown>(name: string): UseFieldReturn<T>;
+
+interface UseFieldArrayReturn<T> {
+    name: string;
+    /** Current array value (reactive). */
+    fields: ComputedRef<T[]>;
+    /** Append an item. */
+    push: (item: T) => void;
+    /** Remove the item at `index`. */
+    remove: (index: number) => void;
+    /** Insert `item` at `index` (shifting the rest right). */
+    insert: (index: number, item: T) => void;
+    /** Move the item from `from` to `to`. */
+    move: (from: number, to: number) => void;
+    /** Replace the whole array. */
+    replace: (items: T[]) => void;
+}
+/**
+ * Manage a dynamic array field (repeatable rows) inside an `<IrisForm>`. Mutators
+ * delegate to the core {@link FormStore} array helpers (`arrayPush`/`arrayInsert`/
+ * `arrayRemove`/`arrayMove`), which RE-KEY each element's error/touched/dirty/
+ * validating state across the mutation — so a row's per-element validation state
+ * FOLLOWS the row when rows are removed or reordered (removing `items[0]` shifts
+ * `items[2]`'s error down to `items[1]`). `replace` swaps the whole array.
+ */
+declare function useFieldArray<T = unknown>(name: string): UseFieldArrayReturn<T>;
+
+/**
+ * Provides the active form's {@link FormStore} to descendant fields so
+ * `useField` can bind without prop drilling. The generic is erased at the
+ * injection boundary; `useField<T>` re-applies the value type at the call site.
+ */
+declare const FormInjectionKey: InjectionKey<FormStore<FormValues>>;
+declare function useFormContext(): FormStore<FormValues>;
+
+export { type FieldBindProps, FormInjectionKey, IrisForm, type UseFieldArrayReturn, type UseFieldReturn, type UseFormReturn, useField, useFieldArray, useForm, useFormContext };

package/dist/form.js

@@ -0,0 +1,3 @@
+export { FormInjectionKey, IrisForm, useField, useFieldArray, useForm, useFormContext } from './chunk-4FLIW67H.js';
+//# sourceMappingURL=form.js.map
+//# sourceMappingURL=form.js.map

package/dist/form.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"form.js"}

package/dist/i18n.cjs

@@ -0,0 +1,112 @@
+'use strict';
+
+var vue = require('vue');
+var core = require('@iris-ui-kit/core');
+var theme = require('@iris-ui-kit/theme');
+
+// src/i18n/I18nProvider.ts
+
+// src/i18n/context.ts
+var I18nInjectionKey = /* @__PURE__ */ Symbol("IrisI18n");
+
+// src/i18n/I18nProvider.ts
+var IrisI18nProvider = vue.defineComponent({
+  name: "IrisI18nProvider",
+  props: {
+    locale: { type: String, default: void 0 },
+    messages: { type: Object, default: void 0 },
+    i18n: { type: Object, default: void 0 },
+    /**
+     * When set, the locale's writing direction ({@link localeDirection}) is
+     * applied to `directionTarget` (`dir` + `data-iris-dir`) and `<html lang>`
+     * is set whenever `locale` changes — so "set locale → flip direction +
+     * announce language" needs no manual wiring. Off by default so it never
+     * fights an explicit `<ThemeProvider dir>`. Reverts on unmount.
+     */
+    autoDirection: { type: Boolean, default: false },
+    /** Element to receive dir/lang when `autoDirection` is set. Defaults to `document.documentElement`. */
+    directionTarget: { type: Object, default: void 0 }
+  },
+  setup(props, { slots }) {
+    const instance = props.i18n ?? core.createI18n({ locale: props.locale, messages: props.messages });
+    vue.provide(I18nInjectionKey, instance);
+    if (!props.i18n) {
+      vue.watch(
+        () => props.locale,
+        (locale) => {
+          if (locale) instance.setLocale(locale);
+        }
+      );
+      vue.watch(
+        () => props.messages,
+        (messages) => {
+          if (messages) instance.setMessages(messages);
+        }
+      );
+    }
+    let revertDirection = null;
+    vue.watch(
+      () => [props.autoDirection, props.locale, props.directionTarget],
+      ([autoDirection, locale]) => {
+        revertDirection?.();
+        revertDirection = null;
+        if (!autoDirection || !locale || typeof document === "undefined") return;
+        const el = props.directionTarget ?? document.documentElement;
+        const applied = theme.applyDirection(core.localeDirection(locale), el);
+        const prevLang = el.getAttribute("lang");
+        el.setAttribute("lang", locale);
+        revertDirection = () => {
+          applied.revert();
+          if (prevLang === null) el.removeAttribute("lang");
+          else el.setAttribute("lang", prevLang);
+        };
+      },
+      { immediate: true }
+    );
+    vue.onScopeDispose(() => {
+      revertDirection?.();
+      revertDirection = null;
+    });
+    return () => slots.default?.();
+  }
+});
+var fallbackI18n = null;
+function getFallback() {
+  if (fallbackI18n === null) fallbackI18n = core.createI18n();
+  return fallbackI18n;
+}
+function useI18n() {
+  const i18n = vue.inject(I18nInjectionKey, null) ?? getFallback();
+  const state = vue.ref(i18n.getState());
+  const unsubscribe = i18n.subscribe((next) => {
+    state.value = next;
+  });
+  vue.onBeforeUnmount(unsubscribe);
+  return {
+    locale: vue.computed(() => state.value.locale),
+    t: (key, params) => {
+      void state.value.locale;
+      return i18n.t(key, params);
+    },
+    formatDate: (value, options) => {
+      void state.value.locale;
+      return i18n.formatDate(value, options);
+    },
+    formatNumber: (value, options) => {
+      void state.value.locale;
+      return i18n.formatNumber(value, options);
+    },
+    formatRelativeTime: (value, unit, options) => {
+      void state.value.locale;
+      return i18n.formatRelativeTime(value, unit, options);
+    },
+    setLocale: i18n.setLocale,
+    setMessages: i18n.setMessages
+  };
+}
+
+exports.I18nInjectionKey = I18nInjectionKey;
+exports.IrisI18nProvider = IrisI18nProvider;
+exports.useI18n = useI18n;
+//# sourceMappingURL=i18n.cjs.map
+//# sourceMappingURL=i18n.cjs.map