@dxos/react-ui-form 0.8.4-main.ae835ea → 0.8.4-main.bc674ce

package/src/util/index.ts

@@ -2,7 +2,8 @@
 // Copyright 2025 DXOS.org
 //
 
+export * from './echo';
 export * from './field';
 export * from './formatting';
+export * from './properties';
 export * from './refs';
-export * from './schema';

package/src/util/properties.ts

@@ -0,0 +1,18 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import * as Option from 'effect/Option';
+import type * as SchemaAST from 'effect/SchemaAST';
+
+import { Annotation } from '@dxos/echo';
+import { type SchemaProperty, getProperties } from '@dxos/effect';
+
+/**
+ * Get the property types of an AST and filter out properties that are not form inputs.
+ */
+export const getFormProperties = (ast: SchemaAST.AST): SchemaProperty[] => {
+  return getProperties(ast).filter((prop) =>
+    Annotation.FormInputAnnotation.getFromAst(prop.type).pipe(Option.getOrElse(() => true)),
+  );
+};

package/src/util/refs.ts

@@ -4,35 +4,29 @@
 
 import type * as SchemaAST from 'effect/SchemaAST';
 
-import { FormatEnum, ReferenceAnnotationId } from '@dxos/echo/internal';
-import { findAnnotation } from '@dxos/effect';
-import { type SchemaProperty } from '@dxos/schema';
-
-import { findArrayElementType } from './schema';
+import { Ref } from '@dxos/echo';
+import { getArrayElementType, isArrayType } from '@dxos/effect';
 
 type RefProps = {
   ast: SchemaAST.AST;
   isArray: boolean;
 };
 
-export const getRefProps = (property: SchemaProperty<any>): RefProps | undefined => {
-  const { ast, format, array } = property;
-
-  // Direct reference.
-  if (format === FormatEnum.Ref) {
-    return { ast, isArray: false };
-  }
-
+export const getRefProps = (ast: SchemaAST.AST): RefProps | undefined => {
   // Array of references.
-  if (array) {
-    const elementType = findArrayElementType(ast);
+  if (isArrayType(ast)) {
+    const elementType = getArrayElementType(ast);
     if (elementType) {
-      const annotation = findAnnotation(elementType, ReferenceAnnotationId);
-      if (annotation) {
+      if (Ref.isRefType(elementType)) {
         return { ast: elementType, isArray: true };
       }
     }
   }
 
+  // Direct reference.
+  if (Ref.isRefType(ast)) {
+    return { ast, isArray: false };
+  }
+
   return undefined;
 };

package/dist/types/src/components/Form/ArrayField.d.ts

@@ -1,16 +0,0 @@
-import React from 'react';
-import { type SchemaProperty } from '@dxos/schema';
-import { type ComponentLookup } from './Form';
-import { type FormFieldProps } from './FormContent';
-import { type FormInputStateProps } from './FormContext';
-import { type InputComponent } from './Input';
-type ArrayFieldProps = {
-    property: SchemaProperty<any>;
-    inputProps: FormInputStateProps;
-    path?: (string | number)[];
-    Custom?: Partial<Record<string, InputComponent>>;
-    lookupComponent?: ComponentLookup;
-} & Pick<FormFieldProps, 'readonly'>;
-export declare const ArrayField: ({ property, readonly, path, inputProps, Custom, lookupComponent }: ArrayFieldProps) => React.JSX.Element | null;
-export {};
-//# sourceMappingURL=ArrayField.d.ts.map

package/dist/types/src/components/Form/ArrayField.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ArrayField.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/ArrayField.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAgC,MAAM,OAAO,CAAC;AAKrD,OAAO,EAAE,KAAK,cAAc,EAAuB,MAAM,cAAc,CAAC;AAKxE,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,QAAQ,CAAC;AAC9C,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,eAAe,CAAC;AAC/D,OAAO,EAAE,KAAK,mBAAmB,EAAiB,MAAM,eAAe,CAAC;AACxE,OAAO,EAAE,KAAK,cAAc,EAAe,MAAM,SAAS,CAAC;AAE3D,KAAK,eAAe,GAAG;IACrB,QAAQ,EAAE,cAAc,CAAC,GAAG,CAAC,CAAC;IAC9B,UAAU,EAAE,mBAAmB,CAAC;IAChC,IAAI,CAAC,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,CAAC;IAC3B,MAAM,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,CAAC,CAAC;IACjD,eAAe,CAAC,EAAE,eAAe,CAAC;CACnC,GAAG,IAAI,CAAC,cAAc,EAAE,UAAU,CAAC,CAAC;AAErC,eAAO,MAAM,UAAU,GAAI,mEAAmE,eAAe,6BA8F5G,CAAC"}

package/dist/types/src/components/Form/Defaults.d.ts

@@ -1,14 +0,0 @@
-import React from 'react';
-import { type InputProps } from './Input';
-export declare const TextInput: ({ type, label, inputOnly, readonly, placeholder, getStatus, getValue, onValueChange, onBlur, }: InputProps) => React.JSX.Element | null;
-export declare const NumberInput: ({ type, label, inputOnly, readonly, placeholder, getStatus, getValue, onValueChange, onBlur, }: InputProps) => React.JSX.Element | null;
-export declare const BooleanInput: ({ type, label, inputOnly, getStatus, getValue, onValueChange, readonly }: InputProps) => React.JSX.Element;
-export type SelectInputOptions = InputProps & {
-    options?: Array<{
-        value: string | number;
-        label?: string;
-    }>;
-};
-export declare const SelectInput: ({ type, label, inputOnly, readonly, placeholder, options, getStatus, getValue, onValueChange, }: SelectInputOptions) => React.JSX.Element | null;
-export declare const MarkdownInput: ({ type, label, inputOnly, readonly, placeholder, getStatus, getValue, onValueChange, onBlur, }: InputProps) => React.JSX.Element;
-//# sourceMappingURL=Defaults.d.ts.map

package/dist/types/src/components/Form/Defaults.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Defaults.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/Defaults.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAM9D,OAAO,EAAe,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAEvD,eAAO,MAAM,SAAS,GAAI,gGAUvB,UAAU,6BAsBZ,CAAC;AAEF,eAAO,MAAM,WAAW,GAAI,gGAUzB,UAAU,6BAuBZ,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,0EAA0E,UAAU,sBAgBhH,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,UAAU,GAAG;IAC5C,OAAO,CAAC,EAAE,KAAK,CAAC;QAAE,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;CAC7D,CAAC;AAEF,eAAO,MAAM,WAAW,GAAI,iGAUzB,kBAAkB,6BAiCpB,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,gGAU3B,UAAU,sBA8CZ,CAAC"}

package/dist/types/src/components/Form/FormActions.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-export type FormOuterSpacing = boolean | 'blockStart-0' | 'scroll-fields';
-export type FormActionsProps = {
-    readonly?: boolean;
-    onCancel?: () => void;
-    outerSpacing?: FormOuterSpacing;
-};
-export declare const FormActions: ({ readonly, onCancel, outerSpacing }: FormActionsProps) => React.JSX.Element;
-//# sourceMappingURL=FormActions.d.ts.map

package/dist/types/src/components/Form/FormActions.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"FormActions.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/FormActions.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAU1B,MAAM,MAAM,gBAAgB,GAAG,OAAO,GAAG,cAAc,GAAG,eAAe,CAAC;AAE1E,MAAM,MAAM,gBAAgB,GAAG;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,YAAY,CAAC,EAAE,gBAAgB,CAAC;CACjC,CAAC;AAEF,eAAO,MAAM,WAAW,GAAI,sCAA6C,gBAAgB,sBA+BxF,CAAC"}

package/dist/types/src/components/Form/FormContent.d.ts

@@ -1,63 +0,0 @@
-import * as Schema from 'effect/Schema';
-import React from 'react';
-import { type ThemedClassName } from '@dxos/react-ui';
-import { type ProjectionModel, type SchemaProperty } from '@dxos/schema';
-import { type QueryRefOptions } from '../../hooks';
-import { type ComponentLookup } from './Form';
-import { type InputComponent } from './Input';
-import { type RefFieldProps } from './RefField';
-export type FormFieldProps = {
-    property: SchemaProperty<any>;
-    path?: (string | number)[];
-    /** Used to indicate if input should be presented inline (e.g. for array items). */
-    inline?: boolean;
-    projection?: ProjectionModel;
-    lookupComponent?: ComponentLookup;
-    Custom?: Partial<Record<string, InputComponent>>;
-} & Pick<RefFieldProps, 'readonly' | 'onQueryRefOptions' | 'createOptionLabel' | 'createOptionIcon' | 'onCreate' | 'createSchema' | 'createInitialValuePath'>;
-export declare const FormField: ({ property, path, readonly, inline, projection, onQueryRefOptions, createOptionLabel, createOptionIcon, onCreate, createSchema, createInitialValuePath, lookupComponent, Custom, }: FormFieldProps) => React.JSX.Element | null;
-export type FormFieldsProps = ThemedClassName<{
-    testId?: string;
-    schema: Schema.Schema.All;
-    /**
-     * Path to the current object from the root. Used with nested forms.
-     */
-    path?: (string | number)[];
-    filter?: (props: SchemaProperty<any>[]) => SchemaProperty<any>[];
-    sort?: string[];
-    /**
-     * Optional projection for projection-based field management
-     */
-    projection?: ProjectionModel;
-    lookupComponent?: ComponentLookup;
-    /**
-     * Map of custom renderers for specific properties.
-     * Prefer lookupComponent for plugin specific input surfaces.
-     */
-    Custom?: Partial<Record<string, InputComponent>>;
-    onQueryRefOptions?: QueryRefOptions;
-} & Pick<FormFieldProps, 'readonly'> & Pick<RefFieldProps, 'onQueryRefOptions' | 'createOptionLabel' | 'createOptionIcon' | 'onCreate' | 'createSchema' | 'createInitialValuePath'>>;
-export declare const FormFields: React.ForwardRefExoticComponent<Omit<{
-    testId?: string;
-    schema: Schema.Schema.All;
-    /**
-     * Path to the current object from the root. Used with nested forms.
-     */
-    path?: (string | number)[];
-    filter?: (props: SchemaProperty<any>[]) => SchemaProperty<any>[];
-    sort?: string[];
-    /**
-     * Optional projection for projection-based field management
-     */
-    projection?: ProjectionModel;
-    lookupComponent?: ComponentLookup;
-    /**
-     * Map of custom renderers for specific properties.
-     * Prefer lookupComponent for plugin specific input surfaces.
-     */
-    Custom?: Partial<Record<string, InputComponent>>;
-    onQueryRefOptions?: QueryRefOptions;
-} & Pick<FormFieldProps, "readonly"> & Pick<RefFieldProps, "onQueryRefOptions" | "createOptionLabel" | "createOptionIcon" | "onCreate" | "createSchema" | "createInitialValuePath">, "className"> & {
-    classNames?: import("@dxos/react-ui-types").ClassNameValue;
-} & React.RefAttributes<HTMLDivElement>>;
-//# sourceMappingURL=FormContent.d.ts.map

package/dist/types/src/components/Form/FormContent.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"FormContent.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/FormContent.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,MAAM,MAAM,eAAe,CAAC;AAGxC,OAAO,KAA8B,MAAM,OAAO,CAAC;AAGnD,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAEtD,OAAO,EAAE,KAAK,eAAe,EAAE,KAAK,cAAc,EAAuB,MAAM,cAAc,CAAC;AAG9F,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,aAAa,CAAC;AAMnD,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,QAAQ,CAAC;AAE9C,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,SAAS,CAAC;AAC9C,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,YAAY,CAAC;AAE1D,MAAM,MAAM,cAAc,GAAG;IAC3B,QAAQ,EAAE,cAAc,CAAC,GAAG,CAAC,CAAC;IAC9B,IAAI,CAAC,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,CAAC;IAC3B,mFAAmF;IACnF,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,UAAU,CAAC,EAAE,eAAe,CAAC;IAC7B,eAAe,CAAC,EAAE,eAAe,CAAC;IAClC,MAAM,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,CAAC,CAAC;CAClD,GAAG,IAAI,CACN,aAAa,EACX,UAAU,GACV,mBAAmB,GACnB,mBAAmB,GACnB,kBAAkB,GAClB,UAAU,GACV,cAAc,GACd,wBAAwB,CAC3B,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,oLAcvB,cAAc,6BAwJhB,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG,eAAe,CAC3C;IACE,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,MAAM,CAAC,MAAM,CAAC,GAAG,CAAC;IAC1B;;OAEG;IACH,IAAI,CAAC,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,CAAC;IAC3B,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,CAAC,GAAG,CAAC,EAAE,KAAK,cAAc,CAAC,GAAG,CAAC,EAAE,CAAC;IACjE,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC;IAChB;;OAEG;IACH,UAAU,CAAC,EAAE,eAAe,CAAC;IAC7B,eAAe,CAAC,EAAE,eAAe,CAAC;IAClC;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,CAAC,CAAC;IACjD,iBAAiB,CAAC,EAAE,eAAe,CAAC;CACrC,GAAG,IAAI,CAAC,cAAc,EAAE,UAAU,CAAC,GAClC,IAAI,CACF,aAAa,EACX,mBAAmB,GACnB,mBAAmB,GACnB,kBAAkB,GAClB,UAAU,GACV,cAAc,GACd,wBAAwB,CAC3B,CACJ,CAAC;AAEF,eAAO,MAAM,UAAU;aA/BV,MAAM;YACP,MAAM,CAAC,MAAM,CAAC,GAAG;IACzB;;OAEG;WACI,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE;aACjB,CAAC,KAAK,EAAE,cAAc,CAAC,GAAG,CAAC,EAAE,KAAK,cAAc,CAAC,GAAG,CAAC,EAAE;WACzD,MAAM,EAAE;IACf;;OAEG;iBACU,eAAe;sBACV,eAAe;IACjC;;;OAGG;aACM,OAAO,CAAC,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,CAAC;wBAC5B,eAAe;;;wCAuFtC,CAAC"}

package/dist/types/src/components/Form/FormContext.d.ts

@@ -1,23 +0,0 @@
-import React, { type FocusEvent, type PropsWithChildren, type RefObject } from 'react';
-import { type BaseObject } from '@dxos/echo/internal';
-import { type SimpleType } from '@dxos/effect';
-import { type FormHandler, type FormOptions } from '../../hooks';
-type FormContextValue<T extends BaseObject> = FormHandler<T>;
-export declare const useFormContext: <T extends BaseObject>() => FormContextValue<T>;
-export declare const useFormValues: (path?: (string | number)[]) => any;
-export type FormInputStateProps = {
-    getStatus: () => {
-        status?: 'error';
-        error?: string;
-    };
-    getValue: <V>() => V | undefined;
-    onValueChange: (type: SimpleType, value: any) => void;
-    onBlur: (event: FocusEvent<HTMLElement>) => void;
-};
-export declare const useInputProps: (path?: (string | number)[]) => FormInputStateProps;
-export declare const FormProvider: ({ children, formRef, autoSave, ...formOptions }: PropsWithChildren<FormOptions<any> & {
-    formRef?: RefObject<HTMLDivElement | null>;
-    autoSave?: boolean;
-}>) => React.JSX.Element;
-export {};
-//# sourceMappingURL=FormContext.d.ts.map

package/dist/types/src/components/Form/FormContext.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"FormContext.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/FormContext.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,EACZ,KAAK,UAAU,EACf,KAAK,iBAAiB,EACtB,KAAK,SAAS,EAMf,MAAM,OAAO,CAAC;AAGf,OAAO,EAAE,KAAK,UAAU,EAAY,MAAM,qBAAqB,CAAC;AAChE,OAAO,EAAE,KAAK,UAAU,EAAkB,MAAM,cAAc,CAAC;AAE/D,OAAO,EAAE,KAAK,WAAW,EAAE,KAAK,WAAW,EAAW,MAAM,aAAa,CAAC;AAE1E,KAAK,gBAAgB,CAAC,CAAC,SAAS,UAAU,IAAI,WAAW,CAAC,CAAC,CAAC,CAAC;AAI7D,eAAO,MAAM,cAAc,GAAI,CAAC,SAAS,UAAU,OAAK,gBAAgB,CAAC,CAAC,CAEzE,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,OAAM,CAAC,MAAM,GAAG,MAAM,CAAC,EAAO,KAAG,GAI9D,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,SAAS,EAAE,MAAM;QAAE,MAAM,CAAC,EAAE,OAAO,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACtD,QAAQ,EAAE,CAAC,CAAC,OAAO,CAAC,GAAG,SAAS,CAAC;IACjC,aAAa,EAAE,CAAC,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;IACtD,MAAM,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;CAClD,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,OAAM,CAAC,MAAM,GAAG,MAAM,CAAC,EAAO,KAAG,mBAa9D,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,iDAK1B,iBAAiB,CAClB,WAAW,CAAC,GAAG,CAAC,GAAG;IACjB,OAAO,CAAC,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IAC3C,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CACF,sBA0CA,CAAC"}

package/dist/types/src/components/Form/Input.d.ts

@@ -1,29 +0,0 @@
-import React, { type FC } from 'react';
-import { type FormatEnum } from '@dxos/echo/internal';
-import { type SimpleType } from '@dxos/effect';
-import { type FormInputStateProps } from './FormContext';
-/**
- * Props passed to input components.
- */
-export type InputProps = {
-    type: SimpleType;
-    format?: FormatEnum;
-    label: string;
-    placeholder?: string;
-    inputOnly?: boolean;
-    /**
-     * Specifies the readonly variant: either disabled inputs, elements indicating they are usually editable but currently are not; or `static`, a field’s representation as regular content without signifiers that it is ever editable.
-     */
-    readonly?: 'disabled-input' | 'static' | false;
-} & FormInputStateProps;
-/**
- * Form input component.
- */
-export type InputComponent = FC<InputProps>;
-export type InputHeaderProps = {
-    error?: string;
-    label: string;
-    readonly?: boolean;
-};
-export declare const InputHeader: ({ error, label, readonly }: InputHeaderProps) => React.JSX.Element;
-//# sourceMappingURL=Input.d.ts.map

package/dist/types/src/components/Form/Input.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/Input.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,EAAE,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,cAAc,CAAC;AAK/C,OAAO,EAAE,KAAK,mBAAmB,EAAE,MAAM,eAAe,CAAC;AAEzD;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG;IACvB,IAAI,EAAE,UAAU,CAAC;IACjB,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,QAAQ,CAAC,EAAE,gBAAgB,GAAG,QAAQ,GAAG,KAAK,CAAC;CAChD,GAAG,mBAAmB,CAAC;AAExB;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG,EAAE,CAAC,UAAU,CAAC,CAAC;AAE5C,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,WAAW,GAAI,4BAA4B,gBAAgB,sBAavE,CAAC"}

package/dist/types/src/components/Form/RefField.d.ts

@@ -1,22 +0,0 @@
-import '@dxos/lit-ui/dx-tag-picker.pcss';
-import type * as Schema from 'effect/Schema';
-import type * as SchemaAST from 'effect/SchemaAST';
-import React from 'react';
-import { type EchoSchema } from '@dxos/echo/internal';
-import { type QueryRefOptions } from '../../hooks';
-import { type InputProps } from './Input';
-export type RefFieldProps = InputProps & {
-    ast?: SchemaAST.AST;
-    array?: boolean;
-    createOptionLabel?: [string, {
-        ns: string;
-    }];
-    createOptionIcon?: string;
-    onCreate?: (values: any) => void;
-    createSchema?: Schema.Schema.AnyNoContext;
-    createInitialValuePath?: string;
-    onQueryRefOptions?: QueryRefOptions;
-    schema?: EchoSchema;
-};
-export declare const RefField: ({ type, label, readonly, placeholder, inputOnly, array, ast, getValue, createOptionLabel, createOptionIcon, onBlur, onCreate, createSchema, createInitialValuePath, onQueryRefOptions, onValueChange, ...restInputProps }: RefFieldProps) => React.JSX.Element | null;
-//# sourceMappingURL=RefField.d.ts.map

package/dist/types/src/components/Form/RefField.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"RefField.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/RefField.tsx"],"names":[],"mappings":"AAIA,OAAO,iCAAiC,CAAC;AAEzC,OAAO,KAAK,KAAK,MAAM,MAAM,eAAe,CAAC;AAC7C,OAAO,KAAK,KAAK,SAAS,MAAM,kBAAkB,CAAC;AACnD,OAAO,KAA+B,MAAM,OAAO,CAAC;AAEpD,OAAO,EACL,KAAK,UAAU,EAMhB,MAAM,qBAAqB,CAAC;AAS7B,OAAO,EAAE,KAAK,eAAe,EAAsB,MAAM,aAAa,CAAC;AAKvE,OAAO,EAAe,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAEvD,MAAM,MAAM,aAAa,GAAG,UAAU,GAAG;IACvC,GAAG,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC;IACpB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,iBAAiB,CAAC,EAAE,CAAC,MAAM,EAAE;QAAE,EAAE,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC7C,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,GAAG,KAAK,IAAI,CAAC;IACjC,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,YAAY,CAAC;IAC1C,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,iBAAiB,CAAC,EAAE,eAAe,CAAC;IACpC,MAAM,CAAC,EAAE,UAAU,CAAC;CACrB,CAAC;AAOF,eAAO,MAAM,QAAQ,GAAI,2NAkBtB,aAAa,6BAuKf,CAAC"}

package/dist/types/src/components/Form/custom/GeoPointInput.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import { type InputProps } from '../Input';
-export declare const GeoPointInput: ({ type, label, readonly, getStatus, getValue, onValueChange, onBlur }: InputProps) => React.JSX.Element;
-//# sourceMappingURL=GeoPointInput.d.ts.map

package/dist/types/src/components/Form/custom/GeoPointInput.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"GeoPointInput.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Form/custom/GeoPointInput.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAsE,MAAM,OAAO,CAAC;AAO3F,OAAO,EAAe,KAAK,UAAU,EAAE,MAAM,UAAU,CAAC;AAExD,eAAO,MAAM,aAAa,GAAI,uEAAuE,UAAU,sBAkE9G,CAAC"}

package/dist/types/src/components/Form/custom/SelectOptionsInput.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import { type InputProps } from '../Input';
-export declare const SelectOptionInput: ({ type, label, readonly, getStatus, getValue, onValueChange }: InputProps) => React.JSX.Element;
-//# sourceMappingURL=SelectOptionsInput.d.ts.map

package/dist/types/src/components/Form/custom/SelectOptionsInput.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"SelectOptionsInput.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Form/custom/SelectOptionsInput.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAyF,MAAM,OAAO,CAAC;AAU9G,OAAO,EAAe,KAAK,UAAU,EAAE,MAAM,UAAU,CAAC;AAExD,eAAO,MAAM,iBAAiB,GAAI,+DAA+D,UAAU,sBA8K1G,CAAC"}

package/dist/types/src/components/Form/custom/SelectOptionsInput.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"SelectOptionsInput.stories.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Form/custom/SelectOptionsInput.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAa,KAAK,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAEjE,OAAO,KAAmB,MAAM,OAAO,CAAC;AAuCxC,QAAA,MAAM,IAAI;;eAEwB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAOA,CAAC;AAEtC,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAAU,CAAC"}

package/dist/types/src/components/Form/custom/TupleInput.d.ts

@@ -1,6 +0,0 @@
-import React from 'react';
-import { type InputProps } from '../Input';
-export declare const TupleInput: ({ binding, type, label, readonly, getStatus, getValue, onValueChange, onBlur, }: InputProps & {
-    binding: string[];
-}) => React.JSX.Element;
-//# sourceMappingURL=TupleInput.d.ts.map

package/dist/types/src/components/Form/custom/TupleInput.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"TupleInput.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Form/custom/TupleInput.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,EAAe,KAAK,UAAU,EAAE,MAAM,UAAU,CAAC;AAIxD,eAAO,MAAM,UAAU,GAAI,iFASxB,UAAU,GAAG;IAAE,OAAO,EAAE,MAAM,EAAE,CAAA;CAAE,sBAuBpC,CAAC"}

package/dist/types/src/components/Form/custom/index.d.ts

@@ -1,4 +0,0 @@
-export * from './GeoPointInput';
-export * from './SelectOptionsInput';
-export * from './TupleInput';
-//# sourceMappingURL=index.d.ts.map

package/dist/types/src/components/Form/custom/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Form/custom/index.ts"],"names":[],"mappings":"AAIA,cAAc,iBAAiB,CAAC;AAChC,cAAc,sBAAsB,CAAC;AACrC,cAAc,cAAc,CAAC"}

package/dist/types/src/components/Form/factory.d.ts

@@ -1,8 +0,0 @@
-import { FormatEnum } from '@dxos/echo/internal';
-import { type SimpleType } from '@dxos/effect';
-import { type InputComponent } from './Input';
-/**
- * Get property input component.
- */
-export declare const getInputComponent: (type: SimpleType, format?: FormatEnum | string) => InputComponent | undefined;
-//# sourceMappingURL=factory.d.ts.map

package/dist/types/src/components/Form/factory.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"factory.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/factory.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACjD,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,cAAc,CAAC;AAI/C,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,SAAS,CAAC;AAE9C;;GAEG;AACH,eAAO,MAAM,iBAAiB,GAAI,MAAM,UAAU,EAAE,SAAS,UAAU,GAAG,MAAM,KAAG,cAAc,GAAG,SAgBnG,CAAC"}

package/dist/types/src/hooks/useForm.d.ts

@@ -1,67 +0,0 @@
-import type * as Schema from 'effect/Schema';
-import { type BaseObject } from '@dxos/echo/internal';
-import { type JsonPath, type SimpleType } from '@dxos/effect';
-import { type ValidationError } from '@dxos/schema';
-import { type MaybePromise } from '@dxos/util';
-/**
- * Return type from `useForm` hook.
- */
-export type FormHandler<T extends BaseObject> = {
-    values: Partial<T>;
-    errors: Record<JsonPath, string>;
-    touched: Record<JsonPath, boolean>;
-    changed: Record<JsonPath, boolean>;
-    canSave: boolean;
-    formIsValid: boolean;
-    handleSave: () => void;
-    getStatus: (path: string | (string | number)[]) => {
-        status?: 'error';
-        error?: string;
-    };
-    getValue: <V>(path: (string | number)[]) => V | undefined;
-    onValueChange: <V>(path: (string | number)[], type: SimpleType, value: V) => void;
-    onTouched: (path: (string | number)[]) => void;
-};
-/**
- * Hook options.
- */
-export interface FormOptions<T extends BaseObject> {
-    /**
-     * Effect schema (Type literal).
-     */
-    schema: Schema.Schema<T, any>;
-    /**
-     * Initial values (which may not pass validation).
-     */
-    initialValues: Partial<T>;
-    /**
-     * Callback for value changes. Note: This is called even when values are invalid.
-     * Sometimes the parent component may want to know about changes even if the form is
-     * in an invalid state.
-     */
-    onValuesChanged?: (values: Partial<T>) => void;
-    /**
-     * Custom validation function that runs only after schema validation passes.
-     * Use this for complex validation logic that can't be expressed in the schema.
-     * @returns Array of validation errors, or undefined if validation passes
-     */
-    onValidate?: (values: T) => ValidationError[] | undefined;
-    /**
-     * Called when the form is valid.
-     */
-    onValid?: (values: T, meta: {
-        changed: FormHandler<T>['changed'];
-    }) => void;
-    /**
-     * Called when the form is submitted and passes validation.
-     */
-    onSave?: (values: T, meta: {
-        changed: FormHandler<T>['changed'];
-    }) => MaybePromise<void>;
-}
-/**
- * Creates a hook for managing form state, including values, validation, and submission.
- * Deeply integrated with `@dxos/schema` for schema-based validation.
- */
-export declare const useForm: <T extends BaseObject>({ schema, initialValues, onValuesChanged, onValidate, onValid, onSave, }: FormOptions<T>) => FormHandler<T>;
-//# sourceMappingURL=useForm.d.ts.map

package/dist/types/src/hooks/useForm.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useForm.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useForm.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,MAAM,eAAe,CAAC;AAI7C,OAAO,EAAE,KAAK,UAAU,EAAsB,MAAM,qBAAqB,CAAC;AAC1E,OAAO,EAAE,KAAK,QAAQ,EAAE,KAAK,UAAU,EAA4C,MAAM,cAAc,CAAC;AAGxG,OAAO,EAAE,KAAK,eAAe,EAAkB,MAAM,cAAc,CAAC;AACpE,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,YAAY,CAAC;AAE/C;;GAEG;AACH,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,UAAU,IAAI;IAK9C,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;IACnB,MAAM,EAAE,MAAM,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC;IACjC,OAAO,EAAE,MAAM,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;IACnC,OAAO,EAAE,MAAM,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;IACnC,OAAO,EAAE,OAAO,CAAC;IACjB,WAAW,EAAE,OAAO,CAAC;IAGrB,UAAU,EAAE,MAAM,IAAI,CAAC;IAMvB,SAAS,EAAE,CAAC,IAAI,EAAE,MAAM,GAAG,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,KAAK;QAAE,MAAM,CAAC,EAAE,OAAO,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACxF,QAAQ,EAAE,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,KAAK,CAAC,GAAG,SAAS,CAAC;IAC1D,aAAa,EAAE,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAClF,SAAS,EAAE,CAAC,IAAI,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,KAAK,IAAI,CAAC;CAChD,CAAC;AAEF;;GAEG;AACH,MAAM,WAAW,WAAW,CAAC,CAAC,SAAS,UAAU;IAC/C;;OAEG;IACH,MAAM,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC;IAE9B;;OAEG;IACH,aAAa,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;IAE1B;;;;OAIG;IACH,eAAe,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IAE/C;;;;OAIG;IAEH,UAAU,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,eAAe,EAAE,GAAG,SAAS,CAAC;IAE1D;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE;QAAE,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAA;KAAE,KAAK,IAAI,CAAC;IAE5E;;OAEG;IACH,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE;QAAE,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAA;KAAE,KAAK,YAAY,CAAC,IAAI,CAAC,CAAC;CAC1F;AAED;;;GAGG;AACH,eAAO,MAAM,OAAO,GAAI,CAAC,SAAS,UAAU,EAAE,0EAO3C,WAAW,CAAC,CAAC,CAAC,KAAG,WAAW,CAAC,CAAC,CAsLhC,CAAC"}

package/dist/types/src/hooks/useQueryRefOptions.d.ts

@@ -1,29 +0,0 @@
-import { type TypeAnnotation } from '@dxos/echo/internal';
-import { type DXN } from '@dxos/keys';
-import { type Palette } from '@dxos/react-ui-types';
-import { type MaybePromise } from '@dxos/util';
-export type RefOption = {
-    dxn: DXN;
-    label?: string;
-};
-export type QueryRefOptions = (type: TypeAnnotation) => MaybePromise<RefOption[]>;
-export type QueryTag = {
-    id: string;
-    label: string;
-    hue?: Palette;
-};
-type UseQueryRefOptionsProps = {
-    refTypeInfo: TypeAnnotation | undefined;
-    onQueryRefOptions?: QueryRefOptions;
-};
-/**
- * Hook to query reference options based on type information.
- * Used internally within forms to fetch and format reference options for reference fields.
- */
-export declare const useQueryRefOptions: ({ refTypeInfo, onQueryRefOptions }: UseQueryRefOptionsProps) => {
-    options: QueryTag[];
-    update: () => void;
-    loading: boolean;
-};
-export {};
-//# sourceMappingURL=useQueryRefOptions.d.ts.map

package/dist/types/src/hooks/useQueryRefOptions.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useQueryRefOptions.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useQueryRefOptions.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAC1D,OAAO,EAAE,KAAK,GAAG,EAAE,MAAM,YAAY,CAAC;AAEtC,OAAO,EAAE,KAAK,OAAO,EAAE,MAAM,sBAAsB,CAAC;AACpD,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,YAAY,CAAC;AAE/C,MAAM,MAAM,SAAS,GAAG;IAAE,GAAG,EAAE,GAAG,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AACrD,MAAM,MAAM,eAAe,GAAG,CAAC,IAAI,EAAE,cAAc,KAAK,YAAY,CAAC,SAAS,EAAE,CAAC,CAAC;AAElF,MAAM,MAAM,QAAQ,GAAG;IACrB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,CAAC,EAAE,OAAO,CAAC;CACf,CAAC;AAEF,KAAK,uBAAuB,GAAG;IAAE,WAAW,EAAE,cAAc,GAAG,SAAS,CAAC;IAAC,iBAAiB,CAAC,EAAE,eAAe,CAAA;CAAE,CAAC;AAEhH;;;GAGG;AAEH,eAAO,MAAM,kBAAkB,GAAI,oCAAoC,uBAAuB;;;;CAiC7F,CAAC"}

package/dist/types/src/hooks/useRefQueryLookupHandler.d.ts

@@ -1,8 +0,0 @@
-import { type Space } from '@dxos/react-client/echo';
-import { type QueryRefOptions } from './useQueryRefOptions';
-type UseRefQueryLookupProps = {
-    space?: Space;
-};
-export declare const useRefQueryLookupHandler: ({ space }: UseRefQueryLookupProps) => QueryRefOptions;
-export {};
-//# sourceMappingURL=useRefQueryLookupHandler.d.ts.map

package/dist/types/src/hooks/useRefQueryLookupHandler.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useRefQueryLookupHandler.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useRefQueryLookupHandler.ts"],"names":[],"mappings":"AAQA,OAAO,EAAU,KAAK,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAG7D,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAE5D,KAAK,sBAAsB,GAAG;IAAE,KAAK,CAAC,EAAE,KAAK,CAAA;CAAE,CAAC;AAEhD,eAAO,MAAM,wBAAwB,GAAI,WAAW,sBAAsB,KAAG,eAuB5E,CAAC"}

package/dist/types/src/util/schema.d.ts

@@ -1,3 +0,0 @@
-import * as SchemaAST from 'effect/SchemaAST';
-export declare const findArrayElementType: (ast: SchemaAST.AST) => SchemaAST.AST | undefined;
-//# sourceMappingURL=schema.d.ts.map

package/dist/types/src/util/schema.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"schema.d.ts","sourceRoot":"","sources":["../../../../src/util/schema.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,SAAS,MAAM,kBAAkB,CAAC;AAI9C,eAAO,MAAM,oBAAoB,GAAI,KAAK,SAAS,CAAC,GAAG,8BAGtD,CAAC"}

package/src/components/Form/ArrayField.tsx

@@ -1,125 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import * as Function from 'effect/Function';
-import * as SchemaAST from 'effect/SchemaAST';
-import * as String from 'effect/String';
-import React, { Fragment, useCallback } from 'react';
-
-import { SimpleType, findNode, getDiscriminatedType, isDiscriminatedUnion } from '@dxos/effect';
-import { invariant } from '@dxos/invariant';
-import { IconButton, useTranslation } from '@dxos/react-ui';
-import { type SchemaProperty, getSchemaProperties } from '@dxos/schema';
-
-import { translationKey } from '../../translations';
-import { findArrayElementType } from '../../util';
-
-import { type ComponentLookup } from './Form';
-import { FormField, type FormFieldProps } from './FormContent';
-import { type FormInputStateProps, useFormValues } from './FormContext';
-import { type InputComponent, InputHeader } from './Input';
-
-type ArrayFieldProps = {
-  property: SchemaProperty<any>;
-  inputProps: FormInputStateProps;
-  path?: (string | number)[];
-  Custom?: Partial<Record<string, InputComponent>>;
-  lookupComponent?: ComponentLookup;
-} & Pick<FormFieldProps, 'readonly'>;
-
-export const ArrayField = ({ property, readonly, path, inputProps, Custom, lookupComponent }: ArrayFieldProps) => {
-  const { t } = useTranslation(translationKey);
-  const { ast, name, type, title } = property;
-  // TODO(wittjosiah): The fallback to an empty array stops the form from crashing but isn't immediately live.
-  //  It doesn't become live until another field is touched, but that's better than the whole form crashing.
-  const values = (useFormValues(path ?? []) ?? []) as any[];
-  invariant(Array.isArray(values), `Values at path ${path?.join('.')} must be an array.`);
-  const label = title ?? Function.pipe(name, String.capitalize);
-
-  const elementType = findArrayElementType(ast);
-
-  const getDefaultObjectValue = (typeNode: SchemaAST.AST): any => {
-    const baseNode = findNode(typeNode, isDiscriminatedUnion);
-    const typeLiteral = baseNode ? getDiscriminatedType(baseNode, {}) : findNode(typeNode, SchemaAST.isTypeLiteral);
-    if (!typeLiteral) {
-      return {};
-    }
-
-    return Object.fromEntries(getSchemaProperties(typeLiteral, {}).map((prop) => [prop.name, prop.defaultValue]));
-  };
-
-  const getDefaultValue = () =>
-    type === 'object' && elementType ? getDefaultObjectValue(elementType) : SimpleType.getDefaultValue(type);
-
-  const handleAdd = useCallback(() => {
-    inputProps.onValueChange(type, [...values, getDefaultValue()]);
-  }, [type, elementType, inputProps, values]);
-
-  const handleRemove = useCallback(
-    (index: number) => {
-      const newValues = values.filter((_, i) => i !== index);
-      inputProps.onValueChange(type, newValues);
-    },
-    [type, inputProps, values],
-  );
-
-  if (!elementType) {
-    return null;
-  }
-
-  return readonly && values.length < 1 ? null : (
-    <>
-      <InputHeader readonly label={label} />
-      <div
-        role='none'
-        className={
-          readonly
-            ? 'flex flex-wrap gap-1 mlb-1'
-            : values.length > 0
-              ? 'grid gap-1 grid-cols-[1fr_min-content] mlb-1'
-              : 'hidden'
-        }
-      >
-        {values.map((_value, index) => {
-          const field = (
-            <FormField
-              property={{
-                ...property,
-                array: false, // NOTE(ZaymonFC): This breaks arrays of arrays but ¯\_(ツ)_/¯. Ping me if you need that.
-                ast: elementType,
-              }}
-              path={[...(path ?? []), index]}
-              readonly={readonly}
-              inline
-              Custom={Custom}
-              lookupComponent={lookupComponent}
-            />
-          );
-          return readonly ? (
-            field
-          ) : (
-            <Fragment key={index}>
-              <div role='none'>{field}</div>
-              <IconButton
-                icon='ph--trash--regular'
-                iconOnly
-                label={t('button remove')}
-                onClick={() => handleRemove(index)}
-                classNames='self-center'
-              />
-            </Fragment>
-          );
-        })}
-      </div>
-      {!readonly && (
-        <IconButton
-          classNames='is-full mlb-cardSpacingBlock flex'
-          icon='ph--plus--regular'
-          label={t('add field')}
-          onClick={handleAdd}
-        />
-      )}
-    </>
-  );
-};