@morscherlab/mint-sdk 1.0.0-alpha.2

package/src/composables/useFormBuilder.ts

@@ -0,0 +1,383 @@
+import { ref, computed, watch } from 'vue'
+import { useForm, type FieldRules, type UseFormReturn } from './useForm'
+import { getFieldRegistryEntry, getTypeDefault } from './formBuilderRegistry'
+import type {
+  FormSchema,
+  FormFieldSchema,
+  FormSectionSchema,
+  FieldCondition,
+  FieldValidation,
+  FormEnhancements,
+  UseFormBuilderReturn,
+} from '../types/form-builder'
+
+// ---------------------------------------------------------------------------
+// Condition evaluator
+// ---------------------------------------------------------------------------
+
+/**
+ * Evaluate a JSON-serializable field condition against the current form data.
+ *
+ * Supports logical operators (`and`, `or`, `not`) and comparison operators
+ * (`eq`, `neq`, `gt`, `lt`, `gte`, `lte`, `in`, `notIn`, `truthy`, `falsy`,
+ * `contains`). Returns `true` if the condition passes.
+ */
+export function evaluateCondition(
+  condition: FieldCondition,
+  data: Record<string, unknown>,
+): boolean {
+  if ('and' in condition) {
+    return condition.and.every((c) => evaluateCondition(c, data))
+  }
+  if ('or' in condition) {
+    return condition.or.some((c) => evaluateCondition(c, data))
+  }
+  if ('not' in condition) {
+    return !evaluateCondition(condition.not, data)
+  }
+
+  const value = data[condition.field]
+
+  if ('eq' in condition) return value === condition.eq
+  if ('neq' in condition) return value !== condition.neq
+  if ('gt' in condition) return typeof value === 'number' && value > condition.gt
+  if ('lt' in condition) return typeof value === 'number' && value < condition.lt
+  if ('gte' in condition) return typeof value === 'number' && value >= condition.gte
+  if ('lte' in condition) return typeof value === 'number' && value <= condition.lte
+  if ('in' in condition) return condition.in.includes(value)
+  if ('notIn' in condition) return !condition.notIn.includes(value)
+  if ('truthy' in condition) return !!value
+  if ('falsy' in condition) return !value
+  if ('contains' in condition) {
+    if (typeof value === 'string') return value.includes(condition.contains)
+    if (Array.isArray(value)) return value.includes(condition.contains)
+    return false
+  }
+
+  return true
+}
+
+// ---------------------------------------------------------------------------
+// Schema helpers
+// ---------------------------------------------------------------------------
+
+/** Return all sections across steps (wizard) or directly from a flat schema. */
+function collectSections(schema: FormSchema): FormSectionSchema[] {
+  return schema.steps ? schema.steps.flatMap((step) => step.sections) : schema.sections
+}
+
+/** Return all field schemas in schema order, flattening sections and steps. */
+function flattenFields(schema: FormSchema): FormFieldSchema[] {
+  return collectSections(schema).flatMap((section) => section.fields)
+}
+
+/** Convert a JSON-safe `FieldValidation` descriptor to a runtime `FieldRules` object. */
+function convertValidation(v: FieldValidation): FieldRules {
+  const rules: FieldRules = {}
+
+  if (v.required !== undefined) rules.required = v.required
+  if (v.minLength !== undefined) rules.minLength = v.minLength
+  if (v.maxLength !== undefined) rules.maxLength = v.maxLength
+  if (v.min !== undefined) rules.min = v.min
+  if (v.max !== undefined) rules.max = v.max
+  if (v.email !== undefined) rules.email = v.email
+
+  if (v.pattern !== undefined) {
+    rules.pattern =
+      typeof v.pattern === 'string'
+        ? new RegExp(v.pattern)
+        : { value: new RegExp(v.pattern.value), message: v.pattern.message }
+  }
+
+  return rules
+}
+
+// ---------------------------------------------------------------------------
+// useFormBuilder
+// ---------------------------------------------------------------------------
+
+/**
+ * Drive a `FormSchema` as reactive form state.
+ *
+ * Builds initial values from schema defaults and `initialData`, derives
+ * validation rules from `FieldValidation` descriptors and enhancement
+ * validators, evaluates `FieldCondition` expressions for field/section
+ * visibility, and wires wizard step navigation when `schema.steps` is set.
+ *
+ * @param schema - Declarative form or wizard schema.
+ * @param initialData - Values that override schema defaults.
+ * @param enhancements - TypeScript-only callbacks (dynamic options, validators,
+ *   submit handler, transform, field-change watcher).
+ */
+/** Drives a declarative FormSchema as reactive state with conditional fields, wizard steps, and validation. */
+export function useFormBuilder<T extends Record<string, unknown> = Record<string, unknown>>(
+  schema: FormSchema,
+  initialData?: Partial<T>,
+  enhancements?: FormEnhancements<T>,
+): UseFormBuilderReturn<T> {
+  const fields = flattenFields(schema)
+  const sections = collectSections(schema)
+
+  // -- Build initial values --------------------------------------------------
+  const initialValues = {} as Record<string, unknown>
+  for (const field of fields) {
+    const key = field.name
+    if (initialData && key in initialData) {
+      initialValues[key] = (initialData as Record<string, unknown>)[key]
+    } else if (field.defaultValue !== undefined) {
+      initialValues[key] = field.defaultValue
+    } else {
+      initialValues[key] = getTypeDefault(field.type)
+    }
+  }
+
+  // -- Build validation rules ------------------------------------------------
+  const rules: Partial<Record<string, FieldRules>> = {}
+  for (const field of fields) {
+    const base: FieldRules = field.validation ? convertValidation(field.validation) : {}
+    const enhancement = enhancements?.fields?.[field.name as keyof T]
+
+    // Wrap validators to skip hidden fields
+    const customValidators: Array<(value: unknown, formData: Record<string, unknown>) => string | undefined | null> = []
+
+    if (enhancement?.validate) {
+      const fn = enhancement.validate
+      customValidators.push((value, formData) => fn(value, formData as T))
+    }
+
+    if (customValidators.length > 0) {
+      base.custom = customValidators
+    }
+
+    // Wrap all rules to skip hidden fields
+    if (Object.keys(base).length > 0) {
+      rules[field.name] = base
+    }
+  }
+
+  // -- Create form -----------------------------------------------------------
+  const form = useForm(initialValues as T, rules as Partial<Record<keyof T, FieldRules>>)
+
+  // -- Visibility ------------------------------------------------------------
+  function isFieldVisible(name: string): boolean {
+    const enhancement = enhancements?.fields?.[name as keyof T]
+    if (enhancement?.visible) {
+      return enhancement.visible(form.data as T)
+    }
+
+    const field = fields.find((f) => f.name === name)
+    if (field?.condition) {
+      return evaluateCondition(field.condition, form.data as Record<string, unknown>)
+    }
+
+    return true
+  }
+
+  function isSectionVisible(id: string): boolean {
+    const section = sections.find((s) => s.id === id)
+    if (section?.condition) {
+      return evaluateCondition(section.condition, form.data as Record<string, unknown>)
+    }
+    return true
+  }
+
+  // -- Resolved field props --------------------------------------------------
+  function getResolvedFieldProps(field: FormFieldSchema): Record<string, unknown> {
+    const entry = getFieldRegistryEntry(field.type)
+    const formProps = form.getFieldProps(field.name as keyof T)
+
+    const merged: Record<string, unknown> = {
+      ...entry.defaults,
+      ...(field.props ?? {}),
+    }
+
+    // Dynamic enhancement props
+    const enhancement = enhancements?.fields?.[field.name as keyof T]
+    if (enhancement?.props) {
+      Object.assign(merged, enhancement.props(form.data as T))
+    }
+
+    // Dynamic options
+    const options = getFieldOptions(field.name)
+    if (options) {
+      merged.options = options
+    }
+
+    // Form field bindings
+    if (entry.vModel) {
+      merged.modelValue = formProps.modelValue
+      merged['onUpdate:modelValue'] = formProps['onUpdate:modelValue']
+    }
+    merged.onBlur = formProps.onBlur
+
+    // Error as boolean for components that use boolean error prop
+    const errorMsg = formProps.error
+    if (errorMsg) {
+      merged.error = true
+    }
+
+    // Schema-level props
+    if (field.placeholder) merged.placeholder = field.placeholder
+    if (field.size) merged.size = field.size
+    if (field.disabled) merged.disabled = true
+    if (field.readonly) merged.readonly = true
+
+    // Radio group needs a name prop
+    if (field.type === 'radio' && !merged.name) {
+      merged.name = field.name
+    }
+
+    return merged
+  }
+
+  function getFieldOptions(name: string): { label: string; value: unknown }[] | undefined {
+    const enhancement = enhancements?.fields?.[name as keyof T]
+    if (enhancement?.options) {
+      return enhancement.options(form.data as T)
+    }
+
+    const field = fields.find((f) => f.name === name)
+    if (field?.props?.options) {
+      return field.props.options as { label: string; value: unknown }[]
+    }
+
+    return undefined
+  }
+
+  // -- Wizard state ----------------------------------------------------------
+  const currentStep = ref(0)
+
+  const isCurrentStepValid = computed(() => {
+    if (!schema.steps) return form.isValid.value
+
+    const step = schema.steps[currentStep.value]
+    if (!step) return true
+
+    for (const section of step.sections) {
+      if (!isSectionVisible(section.id)) continue
+      for (const field of section.fields) {
+        if (!isFieldVisible(field.name)) continue
+        if (!form.validateField(field.name)) return false
+      }
+    }
+    return true
+  })
+
+  function goNext(): boolean {
+    if (!schema.steps) return false
+
+    // Touch and validate all visible fields in current step
+    const step = schema.steps[currentStep.value]
+    if (!step) return false
+
+    let valid = true
+    for (const section of step.sections) {
+      if (!isSectionVisible(section.id)) continue
+      for (const field of section.fields) {
+        if (!isFieldVisible(field.name)) continue
+        form.setFieldTouched(field.name, true)
+        if (!form.validateField(field.name)) valid = false
+      }
+    }
+
+    if (!valid) return false
+
+    if (currentStep.value < schema.steps.length - 1) {
+      currentStep.value++
+    }
+    return true
+  }
+
+  function goBack(): void {
+    if (currentStep.value > 0) {
+      currentStep.value--
+    }
+  }
+
+  function goToStep(index: number): void {
+    if (!schema.steps) return
+    if (index >= 0 && index < schema.steps.length) {
+      currentStep.value = index
+    }
+  }
+
+  // -- Validate (skip hidden fields) -----------------------------------------
+  function validate(): boolean {
+    let allValid = true
+    for (const field of fields) {
+      if (!isFieldVisible(field.name)) continue
+      form.setFieldTouched(field.name, true)
+      if (!form.validateField(field.name)) {
+        allValid = false
+      }
+    }
+    return allValid
+  }
+
+  // -- Submit ----------------------------------------------------------------
+  async function submit(): Promise<void> {
+    if (!validate()) return
+
+    // Build submission data excluding hidden fields
+    let submitData = {} as Record<string, unknown>
+    for (const field of fields) {
+      if (isFieldVisible(field.name)) {
+        submitData[field.name] = (form.data as Record<string, unknown>)[field.name]
+      }
+    }
+
+    if (enhancements?.transform) {
+      submitData = enhancements.transform(submitData as T) as Record<string, unknown>
+    }
+
+    if (enhancements?.onSubmit) {
+      form.isSubmitting.value = true
+      try {
+        await enhancements.onSubmit(submitData as T)
+      } finally {
+        form.isSubmitting.value = false
+      }
+    }
+  }
+
+  // -- Reset -----------------------------------------------------------------
+  function reset(values?: Partial<T>): void {
+    form.reset(values)
+    currentStep.value = 0
+  }
+
+  // -- onFieldChange wiring --------------------------------------------------
+  if (enhancements?.onFieldChange) {
+    const callback = enhancements.onFieldChange
+    watch(
+      () => ({ ...(form.data as Record<string, unknown>) }),
+      (newData, oldData) => {
+        if (!oldData) return
+        for (const key of Object.keys(newData)) {
+          if (newData[key] !== oldData[key]) {
+            callback(key as keyof T, newData[key], newData as T)
+          }
+        }
+      },
+      { deep: true },
+    )
+  }
+
+  return {
+    form: form as UseFormReturn<T>,
+    rules: rules as Partial<Record<keyof T, FieldRules>>,
+    isFieldVisible,
+    isSectionVisible,
+    fields,
+    getResolvedFieldProps,
+    getFieldOptions,
+    currentStep,
+    isCurrentStepValid,
+    goNext,
+    goBack,
+    goToStep,
+    validate,
+    reset,
+    submit,
+  }
+}

package/src/composables/usePasskey.ts

@@ -0,0 +1,216 @@
+import axios from 'axios'
+import { useAuthStore } from '../stores/auth'
+import { useSettingsStore } from '../stores/settings'
+import type { CredentialInfo } from '../types'
+
+// Lazy-load @simplewebauthn/browser so plugins that never call usePasskey
+// don't need the optional peer dep installed (avoids build failures).
+async function loadWebAuthn() {
+  try {
+    return await import('@simplewebauthn/browser')
+  } catch {
+    throw new Error(
+      '@simplewebauthn/browser is required for passkey support. Install it: bun add @simplewebauthn/browser',
+    )
+  }
+}
+
+interface PasskeyLoginResponse {
+  access_token: string
+  token_type: string
+  expires_in: number
+}
+
+/** Registers and authenticates passkeys using WebAuthn, lazily loading the browser dependency. */
+export function usePasskey() {
+  const authStore = useAuthStore()
+  const settingsStore = useSettingsStore()
+
+  function getApiBaseUrl(): string {
+    return settingsStore.getApiBaseUrl()
+  }
+
+  async function isSupported(): Promise<boolean> {
+    try {
+      const { browserSupportsWebAuthn } = await loadWebAuthn()
+      return browserSupportsWebAuthn()
+    } catch {
+      return false
+    }
+  }
+
+  async function registerPasskey(deviceName?: string): Promise<boolean> {
+    const webauthn = await loadWebAuthn()
+    if (!webauthn.browserSupportsWebAuthn()) {
+      authStore.setError('WebAuthn is not supported in this browser')
+      return false
+    }
+
+    authStore.setLoading(true)
+    authStore.setError(null)
+
+    try {
+      const optionsResponse = await axios.get<{ options: string }>(
+        `${getApiBaseUrl()}/auth/passkey/register/options`,
+        {
+          headers: { Authorization: `Bearer ${authStore.token}` },
+          withCredentials: true,
+        }
+      )
+
+      const options = JSON.parse(optionsResponse.data.options)
+
+      const credential = await webauthn.startRegistration(options)
+
+      await axios.post(
+        `${getApiBaseUrl()}/auth/passkey/register/verify`,
+        {
+          credential: JSON.stringify(credential),
+          device_name: deviceName,
+        },
+        {
+          headers: { Authorization: `Bearer ${authStore.token}` },
+          withCredentials: true,
+        }
+      )
+
+      authStore.setAuthConfig({
+        ...authStore.authConfig,
+        passkeyRegistered: true,
+      })
+
+      return true
+    } catch (error) {
+      if (axios.isAxiosError(error) && error.response) {
+        authStore.setError(error.response.data.detail || 'Passkey registration failed')
+      } else if (error instanceof Error) {
+        if (error.name === 'NotAllowedError') {
+          authStore.setError('Registration was cancelled or timed out')
+        } else if (error.name === 'InvalidStateError') {
+          authStore.setError('This authenticator is already registered')
+        } else {
+          authStore.setError(error.message)
+        }
+      } else {
+        authStore.setError('Passkey registration failed')
+      }
+      return false
+    } finally {
+      authStore.setLoading(false)
+    }
+  }
+
+  async function loginWithPasskey(): Promise<boolean> {
+    const webauthn = await loadWebAuthn()
+    if (!webauthn.browserSupportsWebAuthn()) {
+      authStore.setError('WebAuthn is not supported in this browser')
+      return false
+    }
+
+    authStore.setLoading(true)
+    authStore.setError(null)
+
+    try {
+      const optionsResponse = await axios.get<{ options: string }>(
+        `${getApiBaseUrl()}/auth/passkey/login/options`,
+        { withCredentials: true }
+      )
+
+      const options = JSON.parse(optionsResponse.data.options)
+
+      const credential = await webauthn.startAuthentication(options)
+
+      const response = await axios.post<PasskeyLoginResponse>(
+        `${getApiBaseUrl()}/auth/passkey/login/verify`,
+        { credential: JSON.stringify(credential) },
+        { withCredentials: true }
+      )
+
+      authStore.setToken(response.data.access_token, response.data.expires_in)
+
+      return true
+    } catch (error) {
+      if (axios.isAxiosError(error) && error.response) {
+        if (error.response.status === 404) {
+          authStore.setError('No passkeys registered. Please login with password first.')
+        } else {
+          authStore.setError(error.response.data.detail || 'Passkey login failed')
+        }
+      } else if (error instanceof Error) {
+        if (error.name === 'NotAllowedError') {
+          authStore.setError('Authentication was cancelled or timed out')
+        } else {
+          authStore.setError(error.message)
+        }
+      } else {
+        authStore.setError('Passkey login failed')
+      }
+      return false
+    } finally {
+      authStore.setLoading(false)
+    }
+  }
+
+  async function listCredentials(): Promise<CredentialInfo[]> {
+    try {
+      const response = await axios.get<{ credentials: CredentialInfo[] }>(
+        `${getApiBaseUrl()}/auth/passkey/credentials`,
+        {
+          headers: { Authorization: `Bearer ${authStore.token}` },
+        }
+      )
+      return response.data.credentials
+    } catch {
+      return []
+    }
+  }
+
+  async function deleteCredential(credentialId: string): Promise<boolean> {
+    try {
+      await axios.delete(
+        `${getApiBaseUrl()}/auth/passkey/credentials/${encodeURIComponent(credentialId)}`,
+        {
+          headers: { Authorization: `Bearer ${authStore.token}` },
+        }
+      )
+
+      const remaining = await listCredentials()
+      if (remaining.length === 0) {
+        authStore.setAuthConfig({
+          ...authStore.authConfig,
+          passkeyRegistered: false,
+        })
+      }
+
+      return true
+    } catch {
+      return false
+    }
+  }
+
+  async function deleteAllCredentials(): Promise<boolean> {
+    try {
+      await axios.delete(`${getApiBaseUrl()}/auth/passkey/credentials`, {
+        headers: { Authorization: `Bearer ${authStore.token}` },
+      })
+
+      authStore.setAuthConfig({
+        ...authStore.authConfig,
+        passkeyRegistered: false,
+      })
+
+      return true
+    } catch {
+      return false
+    }
+  }
+
+  return {
+    isSupported,
+    registerPasskey,
+    loginWithPasskey,
+    listCredentials,
+    deleteCredential,
+    deleteAllCredentials,
+  }
+}