@svadmin/ui 0.70.0 → 0.73.0

package/dist/components/fieldComponentMap.d.ts

@@ -1,23 +1,28 @@
 import type { Component } from 'svelte';
-export interface FieldComponentMap {
-    [fieldType: string]: Component<any>;
+import type { FieldDefinition } from '@svadmin/core';
+import { type Static, type TSchema } from '@sinclair/typebox';
+import { type SafeSchema } from '@svadmin/core/schema';
+export interface FieldDisplayProps {
+    value: unknown;
+    options?: {
+        label: string;
+        value: string | number;
+    }[] | undefined;
+    resourceName?: string | undefined;
 }
-/**
- * Built-in display components for show/detail pages.
- * Keys match FieldDefinition.type values.
- */
-export declare const builtinDisplayComponents: FieldComponentMap;
-/**
- * Register a custom field display component for a given field type.
- * The component will be used by ShowPage and any other display contexts.
- */
-export declare function registerDisplayComponent(fieldType: string, component: Component<any>): void;
+export type FieldComponentMap = Readonly<Record<string, Component<FieldDisplayProps>>>;
+/** Every dynamic renderer validates its complete projected props before mounting. */
+export declare const builtinDisplayComponents: FieldComponentMap & Readonly<Record<FieldDefinition['type'], Component<FieldDisplayProps>>>;
+/** Custom renderers receive only values proven by their closed schema. */
+export declare function registerDisplayComponent<const S extends TSchema>(fieldType: string, schema: S & SafeSchema<S>, component: Component<{
+    value: Static<NoInfer<S>>;
+}>): void;
 /**
  * Get the display component for a field type.
  * Custom components take precedence over built-in ones.
  * Returns undefined if no component is registered for the type.
  */
-export declare function getDisplayComponent(fieldType: string): Component<any> | undefined;
+export declare function getDisplayComponent(fieldType: string): Component<FieldDisplayProps> | undefined;
 /**
  * Check if a field type has a display component (custom or built-in).
  */

package/dist/components/fieldComponentMap.js

@@ -1,11 +1,11 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
-// Shared field type → display component mapping
-// Used by both ShowPage and FieldRenderer to avoid duplicate if/else chains.
-// Components are lazily resolved by field type at runtime.
-// Pre-import all field display components (tree-shaken by bundler)
+import { Type } from '@sinclair/typebox';
+import { closeContractSchema, createExactSchemaValidator } from '@svadmin/core/schema';
+import { definedOptions } from '@svadmin/core/options';
+import ValidatedField from './ValidatedField.svelte';
 import TextField from './fields/TextField.svelte';
 import BooleanField from './fields/BooleanField.svelte';
 import ImageField from './fields/ImageField.svelte';
+import ImagesField from './fields/ImagesField.svelte';
 import TagField from './fields/TagField.svelte';
 import DateField from './fields/DateField.svelte';
 import DateRangeField from './fields/DateRangeField.svelte';
@@ -26,47 +26,99 @@ import AvatarField from './fields/AvatarField.svelte';
 import CopyField from './fields/CopyField.svelte';
 import FileField from './fields/FileField.svelte';
 import MarkdownField from './fields/MarkdownField.svelte';
-/**
- * Built-in display components for show/detail pages.
- * Keys match FieldDefinition.type values.
- */
-export const builtinDisplayComponents = {
-    text: TextField,
-    string: TextField,
-    boolean: BooleanField,
-    image: ImageField,
-    images: ImageField,
-    tags: TagField,
-    date: DateField,
-    daterange: DateRangeField,
-    email: EmailField,
-    url: UrlField,
-    select: SelectField,
-    multiselect: MultiSelectField,
-    relation: RelationField,
-    json: JsonField,
-    richtext: RichTextField,
-    textarea: RichTextField,
-    number: NumberField,
-    currency: CurrencyField,
-    phone: PhoneField,
-    percent: PercentField,
-    rating: RatingField,
-    code: CodeField,
-    avatar: AvatarField,
-    copy: CopyField,
-    file: FileField,
-    markdown: MarkdownField,
-};
-// ─── Custom component registry ─────────────────────────────────
-// Users can register custom field display components at runtime
+import { jsonValueSchema } from './fields/json-value';
+import PasswordField from './fields/PasswordField.svelte';
+import ChoiceField from './fields/ChoiceField.svelte';
+function validatedDisplay(schema, component, project = input => ({ value: input.value })) {
+    const validator = createExactSchemaValidator(schema);
+    const resolve = (input) => {
+        const props = project(input);
+        return validator.Check(props) ? { ok: true, props } : { ok: false };
+    };
+    // The host owns the reactive validation; evaluating here would only check mount.
+    return (internals, input) => ValidatedField(internals, { component, resolve, input });
+}
+const nullable = (schema) => Type.Union([schema, Type.Null(), Type.Undefined()]);
+const text = nullable(Type.String());
+const numeric = nullable(Type.Number());
+const scalar = nullable(Type.Union([Type.String(), Type.Number()]));
+const date = nullable(Type.Union([Type.String(), Type.Number(), Type.Date()]));
+const dateProperty = Type.Optional(Type.Union([Type.String(), Type.Number(), Type.Date(), Type.Null()]));
+const choices = Type.Optional(Type.Array(Type.Object({
+    label: Type.String(), value: Type.Union([Type.String(), Type.Number()]),
+}, { additionalProperties: false })));
+const props = (value) => Type.Object({ value }, { additionalProperties: false });
+const choiceProps = (input) => definedOptions({
+    value: input.value,
+    options: input.options?.map(({ label, value }) => ({ label, value })),
+});
+const textDisplay = validatedDisplay(props(text), TextField);
+const multiChoiceDisplay = validatedDisplay(Type.Object({
+    value: nullable(Type.Array(Type.Union([Type.String(), Type.Number()]))), options: choices,
+}), MultiSelectField, choiceProps);
+const treeChoiceDisplay = validatedDisplay(Type.Object({
+    value: nullable(Type.Union([Type.String(), Type.Number(), Type.Array(Type.Union([Type.String(), Type.Number()]))])),
+    options: choices,
+}), ChoiceField, choiceProps);
+const ratingDisplay = validatedDisplay(props(numeric), RatingField);
+/** Every dynamic renderer validates its complete projected props before mounting. */
+export const builtinDisplayComponents = Object.freeze({
+    text: textDisplay,
+    string: textDisplay,
+    boolean: validatedDisplay(props(nullable(Type.Boolean())), BooleanField),
+    image: validatedDisplay(props(text), ImageField),
+    images: validatedDisplay(props(nullable(Type.Array(Type.String()))), ImagesField),
+    tags: validatedDisplay(props(nullable(Type.Union([Type.String(), Type.Array(Type.String())]))), TagField),
+    date: validatedDisplay(props(date), DateField),
+    datetime: validatedDisplay(Type.Object({
+        value: date, format: Type.Literal('datetime'),
+    }, { additionalProperties: false }), DateField, input => ({ value: input.value, format: 'datetime' })),
+    // 原生 time 值没有日期或时区，不能交给 Date 解析。
+    time: textDisplay,
+    daterange: validatedDisplay(props(nullable(Type.Union([
+        Type.Tuple([date, date]),
+        Type.Object({ start: dateProperty, end: dateProperty, from: dateProperty, to: dateProperty }, { additionalProperties: false }),
+    ]))), DateRangeField),
+    email: validatedDisplay(props(text), EmailField),
+    url: validatedDisplay(props(text), UrlField),
+    select: validatedDisplay(Type.Object({ value: scalar, options: choices }), SelectField, choiceProps),
+    multiselect: multiChoiceDisplay,
+    'tree-select': treeChoiceDisplay,
+    treeselect: treeChoiceDisplay,
+    cascader: multiChoiceDisplay,
+    transfer: multiChoiceDisplay,
+    relation: validatedDisplay(Type.Object({
+        value: scalar, resourceName: Type.Optional(Type.String()),
+    }), RelationField, input => definedOptions({ value: input.value, resourceName: input.resourceName })),
+    json: validatedDisplay(props(nullable(jsonValueSchema)), JsonField),
+    array: validatedDisplay(props(nullable(Type.Array(jsonValueSchema))), JsonField),
+    color: textDisplay,
+    password: validatedDisplay(props(text), PasswordField),
+    richtext: validatedDisplay(props(text), RichTextField),
+    textarea: validatedDisplay(props(text), RichTextField),
+    number: validatedDisplay(props(numeric), NumberField),
+    currency: validatedDisplay(props(numeric), CurrencyField),
+    phone: validatedDisplay(props(scalar), PhoneField),
+    percent: validatedDisplay(props(numeric), PercentField),
+    rating: ratingDisplay,
+    rate: ratingDisplay,
+    code: validatedDisplay(props(nullable(jsonValueSchema)), CodeField),
+    avatar: validatedDisplay(Type.Object({ src: text }), AvatarField, input => ({ src: input.value })),
+    copy: validatedDisplay(props(scalar), CopyField),
+    file: validatedDisplay(props(text), FileField),
+    markdown: validatedDisplay(props(text), MarkdownField),
+});
 const customDisplayComponents = new Map();
-/**
- * Register a custom field display component for a given field type.
- * The component will be used by ShowPage and any other display contexts.
- */
-export function registerDisplayComponent(fieldType, component) {
-    customDisplayComponents.set(fieldType, component);
+/** Custom renderers receive only values proven by their closed schema. */
+export function registerDisplayComponent(fieldType, schema, component) {
+    if (!fieldType.trim())
+        throw new TypeError('A field type is required');
+    const validator = createExactSchemaValidator(closeContractSchema(schema));
+    const resolve = (input) => {
+        const value = input.value;
+        return validator.Check(value) ? { ok: true, props: { value } } : { ok: false };
+    };
+    customDisplayComponents.set(fieldType, (internals, input) => ValidatedField(internals, { component, resolve, input }));
 }
 /**
  * Get the display component for a field type.
@@ -74,11 +126,12 @@ export function registerDisplayComponent(fieldType, component) {
  * Returns undefined if no component is registered for the type.
  */
 export function getDisplayComponent(fieldType) {
-    return customDisplayComponents.get(fieldType) ?? builtinDisplayComponents[fieldType];
+    return customDisplayComponents.get(fieldType)
+        ?? (Object.hasOwn(builtinDisplayComponents, fieldType) ? builtinDisplayComponents[fieldType] : undefined);
 }
 /**
  * Check if a field type has a display component (custom or built-in).
  */
 export function hasDisplayComponent(fieldType) {
-    return customDisplayComponents.has(fieldType) || fieldType in builtinDisplayComponents;
+    return getDisplayComponent(fieldType) !== undefined;
 }

package/dist/components/fields/AvatarField.svelte

@@ -61,7 +61,7 @@
 
     const parts = trimmed.split(/\s+/);
     if (parts.length >= 2) {
-      return `${parts[0][0]}${parts.at(-1)?.[0] ?? ''}`.toUpperCase();
+      return `${trimmed.charAt(0)}${parts.at(-1)?.charAt(0) ?? ''}`.toUpperCase();
     }
     return trimmed.slice(0, 2).toUpperCase();
   }

package/dist/components/fields/ChoiceField.svelte

@@ -0,0 +1,16 @@
+<script lang="ts">
+  import { definedOptions } from '@svadmin/core/options';
+  import SelectField from './SelectField.svelte';
+  import MultiSelectField from './MultiSelectField.svelte';
+
+  let { value, options }: {
+    value: string | number | (string | number)[] | null | undefined;
+    options?: { label: string; value: string | number }[];
+  } = $props();
+</script>
+
+{#if Array.isArray(value)}
+  <MultiSelectField {value} {...definedOptions({ options })} />
+{:else}
+  <SelectField {value} {...definedOptions({ options })} />
+{/if}

package/dist/components/fields/ChoiceField.svelte.d.ts

@@ -0,0 +1,10 @@
+type $$ComponentProps = {
+    value: string | number | (string | number)[] | null | undefined;
+    options?: {
+        label: string;
+        value: string | number;
+    }[];
+};
+declare const ChoiceField: import("svelte").Component<$$ComponentProps, {}, "">;
+type ChoiceField = ReturnType<typeof ChoiceField>;
+export default ChoiceField;

package/dist/components/fields/CodeField.svelte

@@ -3,9 +3,11 @@
   import { Copy, Check } from '@lucide/svelte';
   import { Badge } from '../ui/badge/index.js';
   import { cn } from '../../utils.js';
+  import { useTranslation } from '@svadmin/core/i18n';
+  import { formatJsonValue } from './json-value';
 
   interface Props {
-    value?: string | number | Record<string, unknown> | unknown[] | null | undefined;
+    value?: string | number | boolean | Record<string, unknown> | unknown[] | null | undefined;
     language?: string;
     copyable?: boolean;
     title?: string;
@@ -29,22 +31,17 @@
   let copied = $state(false);
   let timeoutId: ReturnType<typeof setTimeout> | null = null;
   let destroyed = false;
+  const i18n = useTranslation();
 
   onDestroy(() => {
     destroyed = true;
     if (timeoutId) clearTimeout(timeoutId);
   });
 
-  const formattedCode = $derived.by(() => {
-    if (value == null || value === '') return '';
-    if (typeof value === 'string') return value;
-    if (typeof value === 'number' || typeof value === 'boolean') return String(value);
-    try {
-      return JSON.stringify(value, null, 2);
-    } catch {
-      return String(value);
-    }
-  });
+  const display = $derived(formatJsonValue(value));
+  const formattedCode = $derived(display.status === 'valid'
+    ? typeof value === 'string' ? value : display.formatted
+    : '');
 
   async function handleCopy(event: MouseEvent) {
     event.stopPropagation();
@@ -69,7 +66,9 @@
   }
 </script>
 
-{#if !formattedCode}
+{#if display.status === 'invalid'}
+  <span role="status" data-svadmin-invalid-field>{i18n.t('validation.invalidFormat')}</span>
+{:else if !formattedCode}
   <span class={cn('field-code svadmin-u-bfa603190748 svadmin-u-fc7473ca09eb', className)}>{nullLabel}</span>
 {:else}
   <div class={cn('field-code svadmin-u-d89972fe17d6 group svadmin-u-421ac2be5045 svadmin-u-ca6bcd4b6f3f svadmin-u-c9ed8c5f79ae svadmin-u-b00f43c30c2b svadmin-u-359090c2d529 svadmin-u-0e65706bcccd', className)}>

package/dist/components/fields/CodeField.svelte.d.ts

@@ -1,5 +1,5 @@
 interface Props {
-    value?: string | number | Record<string, unknown> | unknown[] | null | undefined;
+    value?: string | number | boolean | Record<string, unknown> | unknown[] | null | undefined;
     language?: string;
     copyable?: boolean;
     title?: string;

package/dist/components/fields/DateField.svelte

@@ -3,6 +3,7 @@
 </script>
 
 <script lang="ts">
+  import { dateFieldValue } from './date-field-value.js';
   import { cn } from '../../utils.js';
 
   interface Props {
@@ -45,7 +46,7 @@
 
   const formatted = $derived.by(() => {
     if (value == null || value === '') return nullLabel;
-    const d = value instanceof Date ? value : new Date(value);
+    const d = dateFieldValue(value, format === 'time');
     if (isNaN(d.getTime())) return nullLabel;
 
     if (format === 'iso') return d.toISOString();
@@ -68,8 +69,8 @@
 
   const fullIsoTitle = $derived.by(() => {
     if (value == null || value === '') return undefined;
-    const d = value instanceof Date ? value : new Date(value);
-    return isNaN(d.getTime()) ? undefined : d.toISOString();
+    const d = dateFieldValue(value, format === 'time');
+    return isNaN(d.getTime()) ? undefined : format === 'time' && typeof value === 'string' && /^\d{2}:/u.test(value) ? value : d.toISOString();
   });
 </script>
 

package/dist/components/fields/DateRangeField.svelte

@@ -41,8 +41,7 @@
     if (startDate !== undefined) return startDate;
     if (Array.isArray(value)) return value[0];
     if (value && typeof value === 'object') {
-      const obj = value as Record<string, unknown>;
-      return (obj.start ?? obj.from) as string | number | Date | null | undefined;
+      return value.start ?? value.from;
     }
     return undefined;
   });
@@ -51,8 +50,7 @@
     if (endDate !== undefined) return endDate;
     if (Array.isArray(value)) return value[1];
     if (value && typeof value === 'object') {
-      const obj = value as Record<string, unknown>;
-      return (obj.end ?? obj.to) as string | number | Date | null | undefined;
+      return value.end ?? value.to;
     }
     return undefined;
   });

package/dist/components/fields/ImageField.svelte

@@ -1,4 +1,6 @@
 <script lang="ts">
+  import { definedOptions } from '@svadmin/core/options';
+
   import MediaThumbnail from '../content/MediaThumbnail.svelte';
 
   interface Props {
@@ -17,7 +19,7 @@
 
 {#if value}
   <div style={`width: ${width}px; height: ${height}px;`} class="svadmin-u-bb0c4bfc52bd svadmin-u-012fbd121f37">
-    <MediaThumbnail src={value} {alt} {title} size="full" fit="cover" showOverlay={previewable} class={className} />
+    <MediaThumbnail src={value} {alt} {...definedOptions({ "title": title })} size="full" fit="cover" showOverlay={previewable} class={className} />
   </div>
 {:else}
   <MediaThumbnail src={null} {emptyLabel} class={className} />

package/dist/components/fields/ImagesField.svelte

@@ -0,0 +1,23 @@
+<script lang="ts">
+  import ImageField from './ImageField.svelte';
+
+  let { value }: { value: string[] | null | undefined } = $props();
+</script>
+
+{#if value?.length}
+  <div class="field-images">
+    {#each value as image, index (index)}
+      <ImageField value={image} />
+    {/each}
+  </div>
+{:else}
+  <ImageField value={null} />
+{/if}
+
+<style>
+  .field-images {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 8px;
+  }
+</style>

package/dist/components/fields/ImagesField.svelte.d.ts

@@ -0,0 +1,6 @@
+type $$ComponentProps = {
+    value: string[] | null | undefined;
+};
+declare const ImagesField: import("svelte").Component<$$ComponentProps, {}, "">;
+type ImagesField = ReturnType<typeof ImagesField>;
+export default ImagesField;

package/dist/components/fields/JsonField.svelte

@@ -2,6 +2,7 @@
   import { useTranslation } from '@svadmin/core/i18n';
   import { Button } from '../ui/button/index.js';
   import { Copy, Check, ChevronDown, ChevronRight } from '@lucide/svelte';
+  import { formatJsonValue } from './json-value';
 
   const i18n = useTranslation();
 
@@ -12,29 +13,34 @@
   let expanded = $state(false);
   let copied = $state(false);
   let copyTimer: ReturnType<typeof setTimeout> | undefined;
+  let destroyed = false;
 
   $effect(() => {
-    return () => { if (copyTimer) clearTimeout(copyTimer); };
+    return () => { destroyed = true; if (copyTimer) clearTimeout(copyTimer); };
   });
 
-  const formatted = $derived(
-    value != null ? JSON.stringify(value, null, 2) : '—'
-  );
+  const display = $derived(formatJsonValue(value));
 
-  const preview = $derived(
-    value != null ? JSON.stringify(value).slice(0, 80) + (JSON.stringify(value).length > 80 ? '...' : '') : '—'
-  );
-
-  function copyJson() {
-    navigator.clipboard.writeText(formatted);
+  async function copyJson() {
+    if (display.status !== 'valid') return;
+    const clipboard = globalThis.navigator?.clipboard;
+    if (!clipboard?.writeText) return;
+    try {
+      await clipboard.writeText(display.formatted);
+    } catch {
+      return;
+    }
+    if (destroyed) return;
     copied = true;
     if (copyTimer) clearTimeout(copyTimer);
     copyTimer = setTimeout(() => { copied = false; }, 2000);
   }
 </script>
 
-{#if value == null}
+{#if display.status === 'empty'}
   <span class="svadmin-u-bfa603190748">—</span>
+{:else if display.status === 'invalid'}
+  <span role="status" data-svadmin-invalid-field>{i18n.t('validation.invalidFormat')}</span>
 {:else}
   <div class="svadmin-u-da7c36cd8867">
     <div class="svadmin-u-60fbb7713999 svadmin-u-3960ffc248d9 svadmin-u-77a2a20e90d4">
@@ -66,9 +72,9 @@
       </Button>
     </div>
     {#if expanded}
-      <pre class="svadmin-u-5f22e64f2282 svadmin-u-2ef11f1cb219 svadmin-u-eb6e8b881acd svadmin-u-359090c2d529 svadmin-u-73fc3fb18ceb svadmin-u-8aee2b07b47d svadmin-u-0e65706bcccd">{formatted}</pre>
+      <pre class="svadmin-u-5f22e64f2282 svadmin-u-2ef11f1cb219 svadmin-u-eb6e8b881acd svadmin-u-359090c2d529 svadmin-u-73fc3fb18ceb svadmin-u-8aee2b07b47d svadmin-u-0e65706bcccd">{display.formatted}</pre>
     {:else}
-      <code class="svadmin-u-359090c2d529 svadmin-u-0e65706bcccd svadmin-u-2ef11f1cb219 svadmin-u-45d828117213 svadmin-u-465609a240a8 svadmin-u-07389a777c1f">{preview}</code>
+      <code class="svadmin-u-359090c2d529 svadmin-u-0e65706bcccd svadmin-u-2ef11f1cb219 svadmin-u-45d828117213 svadmin-u-465609a240a8 svadmin-u-07389a777c1f">{display.preview}</code>
     {/if}
   </div>
 {/if}

package/dist/components/fields/PasswordField.svelte

@@ -0,0 +1,5 @@
+<script lang="ts">
+  let { value }: { value: string | null | undefined } = $props();
+</script>
+
+<span>{value ? '********' : '—'}</span>

package/dist/components/fields/PasswordField.svelte.d.ts

@@ -0,0 +1,6 @@
+type $$ComponentProps = {
+    value: string | null | undefined;
+};
+declare const PasswordField: import("svelte").Component<$$ComponentProps, {}, "">;
+type PasswordField = ReturnType<typeof PasswordField>;
+export default PasswordField;

package/dist/components/fields/date-field-value.d.ts

@@ -0,0 +1,2 @@
+/** 原生 time 输入没有日期/时区；使用本地锚点格式化，不能按 ISO 时间戳解析。 */
+export declare function dateFieldValue(value: string | number | Date, timeOnly: boolean): Date;

package/dist/components/fields/date-field-value.js

@@ -0,0 +1,13 @@
+/** 原生 time 输入没有日期/时区；使用本地锚点格式化，不能按 ISO 时间戳解析。 */
+export function dateFieldValue(value, timeOnly) {
+    if (timeOnly && typeof value === 'string') {
+        const match = /^(\d{2}):(\d{2})(?::(\d{2})(?:\.(\d{1,3}))?)?$/u.exec(value);
+        if (match) {
+            const hour = Number(match[1]), minute = Number(match[2]), second = Number(match[3] ?? 0);
+            if (hour > 23 || minute > 59 || second > 59)
+                return new Date(NaN);
+            return new Date(1970, 0, 1, hour, minute, second, Number((match[4] ?? '').padEnd(3, '0')));
+        }
+    }
+    return value instanceof Date ? value : new Date(value);
+}

package/dist/components/fields/json-value.d.ts

@@ -0,0 +1,11 @@
+export declare const jsonValueSchema: import("@sinclair/typebox").TRecursive<import("@sinclair/typebox").TUnion<[import("@sinclair/typebox").TNull, import("@sinclair/typebox").TBoolean, import("@sinclair/typebox").TNumber, import("@sinclair/typebox").TString, import("@sinclair/typebox").TArray<import("@sinclair/typebox").TThis>, import("@sinclair/typebox").TRecord<import("@sinclair/typebox").TString, import("@sinclair/typebox").TThis>]>>;
+export type JsonDisplay = {
+    status: 'empty';
+} | {
+    status: 'invalid';
+} | {
+    status: 'valid';
+    formatted: string;
+    preview: string;
+};
+export declare function formatJsonValue(value: unknown): JsonDisplay;

package/dist/components/fields/json-value.js

@@ -0,0 +1,28 @@
+import { Type } from '@sinclair/typebox';
+import { createExactSchemaValidator } from '@svadmin/core/schema';
+export const jsonValueSchema = Type.Recursive(Self => Type.Union([
+    Type.Null(), Type.Boolean(), Type.Number(), Type.String(),
+    Type.Array(Self), Type.Record(Type.String(), Self),
+]));
+const validator = createExactSchemaValidator(jsonValueSchema);
+export function formatJsonValue(value) {
+    if (value == null)
+        return { status: 'empty' };
+    try {
+        // Serialization rejects circular graphs before recursive schema traversal.
+        const compact = JSON.stringify(value);
+        if (typeof compact !== 'string' || !validator.Check(value))
+            return { status: 'invalid' };
+        const formatted = JSON.stringify(value, null, 2);
+        if (typeof formatted !== 'string')
+            return { status: 'invalid' };
+        return {
+            status: 'valid',
+            formatted,
+            preview: compact.slice(0, 80) + (compact.length > 80 ? '...' : ''),
+        };
+    }
+    catch {
+        return { status: 'invalid' };
+    }
+}

package/dist/components/json-schema-form-state.d.ts

@@ -0,0 +1,37 @@
+/** 嵌套表单的草稿与传输语义；不是替代服务端的 JSON Schema 校验器。 */
+export interface JsonSchemaFormSchema {
+    type?: string | string[];
+    const?: string | number | boolean | null;
+    readOnly?: boolean;
+    minimum?: number;
+    maximum?: number;
+    exclusiveMinimum?: number;
+    exclusiveMaximum?: number;
+    multipleOf?: number;
+    minLength?: number;
+    maxLength?: number;
+    minItems?: number;
+    maxItems?: number;
+    additionalProperties?: boolean;
+    title?: string;
+    description?: string;
+    properties?: Record<string, JsonSchemaFormSchema>;
+    items?: JsonSchemaFormSchema;
+    enum?: Array<string | number | boolean | null>;
+    default?: unknown;
+    required?: string[];
+}
+export declare const SCHEMA_FORM_LIMITS: Readonly<{
+    depth: 32;
+    nodes: 10000;
+    characters: 1048576;
+}>;
+/** Svelte 代理也通过普通数据属性读取；回调永远收不到活跃草稿的引用。 */
+export declare function schemaFormSnapshot(value: unknown): Record<string, unknown>;
+/** 默认值只填“缺失的键”；显式 undefined/null/false/0/空串都表示调用方的决定。 */
+export declare function initializeSchemaForm(schema: JsonSchemaFormSchema, value: Record<string, unknown>): Record<string, unknown>;
+export declare function schemaFormArrayItem(schema: JsonSchemaFormSchema): unknown;
+export declare function writeSchemaFormPath(value: Record<string, unknown>, path: readonly string[], nextValue: unknown): Record<string, unknown>;
+/** option.value 是索引，不是 String(value)：1 与 "1"、null 与 "null" 必须可区分。 */
+export declare function schemaFormEnumIndex(choices: readonly unknown[], value: unknown): string;
+export declare function schemaFormEnumValue(choices: readonly unknown[], index: string): unknown;