@dxos/react-ui-form 0.8.2-main.fbd8ed0 → 0.8.2-staging.7ac8446

package/dist/lib/node/index.cjs

@@ -32,10 +32,8 @@ __export(node_exports, {
   ControlFrame: () => ControlFrame,
   ControlFrameItem: () => ControlFrameItem,
   ControlGroup: () => ControlGroup,
-  ControlGroupButton: () => ControlGroupButton,
   ControlItem: () => ControlItem,
   ControlItemInput: () => ControlItemInput,
-  ControlPage: () => ControlPage,
   ControlSection: () => ControlSection,
   ControlSectionHeading: () => ControlSectionHeading,
   DeprecatedFormContainer: () => DeprecatedFormContainer,
@@ -54,19 +52,15 @@ __export(node_exports, {
   ViewEditor: () => ViewEditor,
   cellClassesForFieldType: () => cellClassesForFieldType,
   controlItemClasses: () => controlItemClasses,
-  findArrayElementType: () => findArrayElementType,
   formatForDisplay: () => formatForDisplay,
   formatForEditing: () => formatForEditing,
-  getRefProps: () => getRefProps,
   parseValue: () => parseValue,
   pathNotUniqueError: () => pathNotUniqueError,
   translations: () => translations_default,
   useForm: () => useForm,
   useFormContext: () => useFormContext,
   useFormValues: () => useFormValues,
-  useInputProps: () => useInputProps,
-  useQueryRefOptions: () => useQueryRefOptions,
-  useRefQueryLookupHandler: () => useRefQueryLookupHandler
+  useInputProps: () => useInputProps
 });
 module.exports = __toCommonJS(node_exports);
 var import_react = __toESM(require("react"));
@@ -74,7 +68,6 @@ var import_react_ui = require("@dxos/react-ui");
 var import_react_ui_theme = require("@dxos/react-ui-theme");
 var import_react2 = __toESM(require("react"));
 var import_react_ui2 = require("@dxos/react-ui");
-var import_react_ui_theme2 = require("@dxos/react-ui-theme");
 var import_react3 = __toESM(require("react"));
 var import_echo_schema = require("@dxos/echo-schema");
 var import_log = require("@dxos/log");
@@ -86,24 +79,24 @@ var import_react_ui4 = require("@dxos/react-ui");
 var import_util = require("@dxos/util");
 var import_react5 = __toESM(require("react"));
 var import_react_ui5 = require("@dxos/react-ui");
-var import_react_ui_theme3 = require("@dxos/react-ui-theme");
+var import_react_ui_theme2 = require("@dxos/react-ui-theme");
 var import_react6 = __toESM(require("react"));
 var import_keys = require("@dxos/keys");
 var import_react_ui6 = require("@dxos/react-ui");
 var import_react_ui_list = require("@dxos/react-ui-list");
 var import_react_ui_pickers = require("@dxos/react-ui-pickers");
-var import_react_ui_theme4 = require("@dxos/react-ui-theme");
+var import_react_ui_theme3 = require("@dxos/react-ui-theme");
 var import_react7 = __toESM(require("react"));
 var import_react_ui7 = require("@dxos/react-ui");
-var import_react_ui_theme5 = require("@dxos/react-ui-theme");
+var import_react_ui_theme4 = require("@dxos/react-ui-theme");
 var import_util2 = require("@dxos/util");
 var import_react8 = __toESM(require("react"));
 var import_react_ui8 = require("@dxos/react-ui");
 var import_react9 = __toESM(require("react"));
-var import_react_ui_theme6 = require("@dxos/react-ui-theme");
+var import_react_ui_theme5 = require("@dxos/react-ui-theme");
 var import_react10 = __toESM(require("react"));
 var import_react_ui9 = require("@dxos/react-ui");
-var import_react_ui_theme7 = require("@dxos/react-ui-theme");
+var import_react_ui_theme6 = require("@dxos/react-ui-theme");
 var import_react11 = __toESM(require("react"));
 var import_debug = require("@dxos/debug");
 var import_echo_schema3 = require("@dxos/echo-schema");
@@ -115,50 +108,34 @@ var import_effect3 = require("@dxos/effect");
 var import_invariant = require("@dxos/invariant");
 var import_log2 = require("@dxos/log");
 var import_schema2 = require("@dxos/schema");
-var import_react13 = require("react");
-var import_echo_schema5 = require("@dxos/echo-schema");
-var import_echo = require("@dxos/react-client/echo");
-var import_util3 = require("@dxos/util");
-var import_react14 = require("react");
-var import_log3 = require("@dxos/log");
 var import_effect4 = require("effect");
 var import_String = require("effect/String");
-var import_react15 = __toESM(require("react"));
+var import_react13 = __toESM(require("react"));
+var import_echo_schema5 = require("@dxos/echo-schema");
 var import_effect5 = require("@dxos/effect");
-var import_react_ui_theme8 = require("@dxos/react-ui-theme");
+var import_react_ui_theme7 = require("@dxos/react-ui-theme");
 var import_schema3 = require("@dxos/schema");
-var import_util4 = require("@dxos/util");
+var import_util3 = require("@dxos/util");
 var import_effect6 = require("effect");
 var import_String2 = require("effect/String");
-var import_react16 = __toESM(require("react"));
+var import_react14 = __toESM(require("react"));
+var import_echo_schema6 = require("@dxos/echo-schema");
 var import_effect7 = require("@dxos/effect");
 var import_invariant2 = require("@dxos/invariant");
 var import_react_ui10 = require("@dxos/react-ui");
-var import_react_ui_theme9 = require("@dxos/react-ui-theme");
+var import_react_ui_theme8 = require("@dxos/react-ui-theme");
 var import_schema4 = require("@dxos/schema");
-var import_echo_schema6 = require("@dxos/echo-schema");
-var import_format = require("date-fns/format");
 var import_echo_schema7 = require("@dxos/echo-schema");
+var import_react15 = __toESM(require("react"));
 var import_echo_schema8 = require("@dxos/echo-schema");
-var import_effect8 = require("@dxos/effect");
-var import_effect9 = require("effect");
-var import_effect10 = require("@dxos/effect");
-var import_react17 = __toESM(require("react"));
-var import_echo_schema9 = require("@dxos/echo-schema");
-var import_effect11 = require("@dxos/effect");
-var import_keys2 = require("@dxos/keys");
-var import_react_ui11 = require("@dxos/react-ui");
-var import_react_ui_tag_picker = require("@dxos/react-ui-tag-picker");
-var import_util5 = require("@dxos/util");
-var import_echo_schema10 = require("@dxos/echo-schema");
-var import_effect12 = require("effect");
-var import_react18 = __toESM(require("react"));
-var import_echo_schema11 = require("@dxos/echo-schema");
 var import_invariant3 = require("@dxos/invariant");
-var import_react_ui12 = require("@dxos/react-ui");
+var import_react_ui11 = require("@dxos/react-ui");
 var import_react_ui_list2 = require("@dxos/react-ui-list");
-var import_react_ui_theme10 = require("@dxos/react-ui-theme");
+var import_react_ui_theme9 = require("@dxos/react-ui-theme");
 var import_schema5 = require("@dxos/schema");
+var import_echo_schema9 = require("@dxos/echo-schema");
+var import_format = require("date-fns/format");
+var import_echo_schema10 = require("@dxos/echo-schema");
 var translationKey = "react-ui-form";
 var translations_default = [
   {
@@ -220,7 +197,7 @@ var translations_default = [
 var DeprecatedFormContainer = ({ children, classNames }) => {
   return /* @__PURE__ */ import_react.default.createElement("div", {
     role: "none",
-    className: "container-max-width p-4 justify-center overflow-x-hidden overflow-y-auto"
+    className: "w-full p-4 justify-center overflow-x-hidden overflow-y-auto"
   }, /* @__PURE__ */ import_react.default.createElement("div", {
     role: "form",
     className: (0, import_react_ui_theme.mx)("flex flex-col", import_react_ui_theme.textBlockWidth, classNames)
@@ -253,19 +230,6 @@ var DeprecatedFormInput = ({ label, description, secondary, children }) => {
   }
   return primary;
 };
-var ControlPage = ({ children, classNames, ...props }) => {
-  return /* @__PURE__ */ import_react2.default.createElement("div", {
-    role: "none",
-    className: (0, import_react_ui_theme2.mx)("pli-2", classNames),
-    ...props
-  }, children);
-};
-var ControlSection = ({ title, description, children }) => {
-  return /* @__PURE__ */ import_react2.default.createElement(import_react2.default.Fragment, null, /* @__PURE__ */ import_react2.default.createElement(ControlSectionHeading, {
-    title,
-    description
-  }), children);
-};
 var ControlSectionHeading = ({ title, description }) => {
   const { t } = (0, import_react_ui2.useTranslation)(translationKey);
   return /* @__PURE__ */ import_react2.default.createElement(import_react2.default.Fragment, null, /* @__PURE__ */ import_react2.default.createElement("h2", {
@@ -274,18 +238,15 @@ var ControlSectionHeading = ({ title, description }) => {
     className: "pli-4 mlb-4 container-max-width text-description"
   }, (0, import_react_ui2.toLocalizedString)(description, t)));
 };
-var ControlGroupButton = ({ classNames, ...props }) => {
-  return /* @__PURE__ */ import_react2.default.createElement(import_react_ui2.Button, {
-    ...props,
-    classNames: [
-      "md:col-span-2",
-      classNames
-    ]
-  });
+var ControlSection = ({ title, description, children }) => {
+  return /* @__PURE__ */ import_react2.default.createElement(import_react2.default.Fragment, null, /* @__PURE__ */ import_react2.default.createElement(ControlSectionHeading, {
+    title,
+    description
+  }), children);
 };
-var ControlGroup = ({ children, classNames }) => /* @__PURE__ */ import_react2.default.createElement("div", {
+var ControlGroup = ({ children }) => /* @__PURE__ */ import_react2.default.createElement("div", {
   role: "none",
-  className: (0, import_react_ui_theme2.mx)("group container-max-width grid grid-cols-1 md:grid-cols-[1fr_min-content] gap-4", classNames)
+  className: "group container-max-width grid grid-cols-1 md:grid-cols-[1fr_min-content] gap-4"
 }, children);
 var ControlFrame = ({ children }) => /* @__PURE__ */ import_react2.default.createElement("div", {
   role: "none",
@@ -333,15 +294,15 @@ var InputHeader = ({ children, error }) => {
   return /* @__PURE__ */ import_react5.default.createElement("div", {
     role: "none",
     className: "flex justify-between items-center mb-1"
-  }, children, error && /* @__PURE__ */ import_react5.default.createElement(import_react_ui5.Tooltip.Trigger, {
-    asChild: true,
-    content: error,
-    side: "bottom"
+  }, children, error && /* @__PURE__ */ import_react5.default.createElement(import_react_ui5.Tooltip.Root, null, /* @__PURE__ */ import_react5.default.createElement(import_react_ui5.Tooltip.Trigger, {
+    asChild: true
   }, /* @__PURE__ */ import_react5.default.createElement(import_react_ui5.Icon, {
     icon: "ph--warning--regular",
     size: 4,
-    classNames: import_react_ui_theme3.errorText
-  })));
+    classNames: import_react_ui_theme2.errorText
+  })), /* @__PURE__ */ import_react5.default.createElement(import_react_ui5.Tooltip.Content, {
+    side: "bottom"
+  }, /* @__PURE__ */ import_react5.default.createElement(import_react_ui5.Tooltip.Arrow, null), error)));
 };
 var GeoPointInput = ({ type, label, disabled, getStatus, getValue: getValue3, onValueChange, onBlur }) => {
   const { t } = (0, import_react_ui4.useTranslation)(translationKey);
@@ -430,13 +391,13 @@ var SelectOptionInput = ({ type, label, disabled, getStatus, getValue: getValue3
   ]);
   const randomHue = () => {
     const usedHues = new Set(options?.map((option) => option.color) ?? []);
-    const unusedHues = import_react_ui_theme4.hues.filter((hue) => !usedHues.has(hue));
+    const unusedHues = import_react_ui_theme3.hues.filter((hue) => !usedHues.has(hue));
     if (unusedHues.length > 0) {
       return unusedHues[Math.floor(Math.random() * unusedHues.length)];
     }
     const lastThree = new Set(options?.slice(-3).map((option) => option.color) ?? []);
-    const availableHues = import_react_ui_theme4.hues.filter((hue) => !lastThree.has(hue));
-    return availableHues[Math.floor(Math.random() * availableHues.length)] ?? import_react_ui_theme4.hues[Math.floor(Math.random() * import_react_ui_theme4.hues.length)];
+    const availableHues = import_react_ui_theme3.hues.filter((hue) => !lastThree.has(hue));
+    return availableHues[Math.floor(Math.random() * availableHues.length)] ?? import_react_ui_theme3.hues[Math.floor(Math.random() * import_react_ui_theme3.hues.length)];
   };
   const handleAdd = (0, import_react6.useCallback)(() => {
     const newId = import_keys.PublicKey.random().truncate();
@@ -537,7 +498,7 @@ var SelectOptionInput = ({ type, label, disabled, getStatus, getValue: getValue3
   }, /* @__PURE__ */ import_react6.default.createElement(import_react_ui_list.List.Item, {
     role: "button",
     item,
-    classNames: (0, import_react_ui_theme4.mx)("p-1 plb-2", "flex flex-col", "cursor-pointer", "hover:bg-hoverOverlay"),
+    classNames: (0, import_react_ui_theme3.mx)("p-1 plb-2", "flex flex-col", "cursor-pointer", "hover:bg-hoverOverlay"),
     "aria-expanded": selected === item.id
   }, /* @__PURE__ */ import_react6.default.createElement("div", {
     className: "flex items-center"
@@ -578,7 +539,7 @@ var SelectOptionInput = ({ type, label, disabled, getStatus, getValue: getValue3
     role: "listitem"
   }, /* @__PURE__ */ import_react6.default.createElement("div", {
     role: "button",
-    className: (0, import_react_ui_theme4.mx)("p-1 plb-2", "flex flex-col", "cursor-pointer", "hover:bg-hoverOverlay"),
+    className: (0, import_react_ui_theme3.mx)("p-1 plb-2", "flex flex-col", "cursor-pointer", "hover:bg-hoverOverlay"),
     onClick: handleAdd
   }, /* @__PURE__ */ import_react6.default.createElement("div", {
     className: "flex items-center gap-1"
@@ -602,7 +563,7 @@ var TupleInput = ({ binding, type, label, disabled, getStatus, getValue: getValu
   }, /* @__PURE__ */ import_react7.default.createElement(InputHeader, {
     error
   }, /* @__PURE__ */ import_react7.default.createElement(import_react_ui7.Input.Label, null, label)), /* @__PURE__ */ import_react7.default.createElement("div", {
-    className: (0, import_react_ui_theme5.mx)("grid gap-2", gridCols[binding.length - 1])
+    className: (0, import_react_ui_theme4.mx)("grid gap-2", gridCols[binding.length - 1])
   }, binding.map((prop) => /* @__PURE__ */ import_react7.default.createElement(import_react_ui7.Input.TextInput, {
     key: prop,
     type: "number",
@@ -658,28 +619,23 @@ var BooleanInput = ({ type, label, inputOnly, getStatus, getValue: getValue3, on
 };
 var SelectInput = ({ type, label, inputOnly, disabled, placeholder, options, getStatus, getValue: getValue3, onValueChange }) => {
   const { status, error } = getStatus();
-  const value = getValue3();
-  const handleValueChange = (0, import_react8.useCallback)((value2) => onValueChange(type, value2), [
-    type,
-    onValueChange
-  ]);
   return /* @__PURE__ */ import_react8.default.createElement(import_react_ui8.Input.Root, {
     validationValence: status
   }, !inputOnly && /* @__PURE__ */ import_react8.default.createElement(InputHeader, {
     error
   }, /* @__PURE__ */ import_react8.default.createElement(import_react_ui8.Input.Label, null, label)), /* @__PURE__ */ import_react8.default.createElement(import_react_ui8.Select.Root, {
-    value,
-    onValueChange: handleValueChange
+    value: getValue3(),
+    onValueChange: (value) => onValueChange(type, value)
   }, /* @__PURE__ */ import_react8.default.createElement(import_react_ui8.Select.TriggerButton, {
     classNames: "is-full",
     disabled,
     placeholder
-  }), /* @__PURE__ */ import_react8.default.createElement(import_react_ui8.Select.Portal, null, /* @__PURE__ */ import_react8.default.createElement(import_react_ui8.Select.Content, null, /* @__PURE__ */ import_react8.default.createElement(import_react_ui8.Select.Viewport, null, options?.map(({ value: value2, label: label2 }) => (
+  }), /* @__PURE__ */ import_react8.default.createElement(import_react_ui8.Select.Portal, null, /* @__PURE__ */ import_react8.default.createElement(import_react_ui8.Select.Content, null, /* @__PURE__ */ import_react8.default.createElement(import_react_ui8.Select.Viewport, null, options?.map(({ value, label: label2 }) => (
     // NOTE: Numeric values are converted to and from strings.
     /* @__PURE__ */ import_react8.default.createElement(import_react_ui8.Select.Option, {
-      key: String(value2),
-      value: String(value2)
-    }, label2 ?? String(value2))
+      key: String(value),
+      value: String(value)
+    }, label2 ?? String(value))
   )))))), inputOnly && /* @__PURE__ */ import_react8.default.createElement(import_react_ui8.Input.DescriptionAndValidation, null, error));
 };
 var MarkdownInput = ({ type, label, inputOnly, disabled, placeholder, getStatus, getValue: getValue3, onValueChange, onBlur }) => {
@@ -728,7 +684,7 @@ var useForm = ({ schema, initialValues, onValuesChanged, onValidate, onValid, on
     L: 93,
     S: void 0,
     A: [
-      "SchemaAST.isTypeLiteral(schema.ast)",
+      "AST.isTypeLiteral(schema.ast)",
       ""
     ]
   });
@@ -829,7 +785,7 @@ var useForm = ({ schema, initialValues, onValuesChanged, onValidate, onValid, on
     } catch (err) {
       import_log2.log.catch(err, void 0, {
         F: __dxlog_file,
-        L: 213,
+        L: 212,
         S: void 0,
         C: (f, a) => f(...a)
       });
@@ -900,7 +856,7 @@ var useForm = ({ schema, initialValues, onValuesChanged, onValidate, onValid, on
 var createKeySet = (obj, value) => {
   (0, import_invariant.invariant)(obj, void 0, {
     F: __dxlog_file,
-    L: 275,
+    L: 274,
     S: void 0,
     A: [
       "obj",
@@ -921,71 +877,6 @@ var flatMap = (errors) => {
     return result;
   }, {});
 };
-var useRefQueryLookupHandler = ({ space }) => {
-  const handleRefQueryLookup = (0, import_react13.useCallback)(async (typeInfo) => {
-    if (!space) {
-      return [];
-    }
-    const query = space.db.query(import_echo.Filter.typename(typeInfo.typename));
-    const { objects } = await query.run();
-    return objects.map((object) => {
-      const dxn = (0, import_echo_schema5.getDXN)(object);
-      if (!dxn) {
-        return void 0;
-      }
-      const item = {
-        dxn,
-        label: object?.name ?? object?.id ?? ""
-      };
-      return item;
-    }).filter(import_util3.isNonNullable);
-  }, [
-    space
-  ]);
-  return handleRefQueryLookup;
-};
-var __dxlog_file2 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-form/src/hooks/useQueryRefOptions.ts";
-var useQueryRefOptions = ({ refTypeInfo, onQueryRefOptions }) => {
-  const [options, setOptions] = (0, import_react14.useState)([]);
-  const [loading, setLoading] = (0, import_react14.useState)(false);
-  (0, import_react14.useEffect)(() => {
-    if (!refTypeInfo || !onQueryRefOptions) {
-      return;
-    }
-    const fetchOptions = async () => {
-      setLoading(true);
-      try {
-        const fetchedOptions = await onQueryRefOptions(refTypeInfo);
-        setOptions(fetchedOptions.map((option) => {
-          const dxn = option.dxn.toString();
-          return {
-            id: dxn,
-            label: option.label ?? dxn,
-            hue: "neutral"
-          };
-        }));
-      } catch (error) {
-        import_log3.log.error("Failed to fetch ref options:", error, {
-          F: __dxlog_file2,
-          L: 42,
-          S: void 0,
-          C: (f, a) => f(...a)
-        });
-        setOptions([]);
-      } finally {
-        setLoading(false);
-      }
-    };
-    void fetchOptions();
-  }, [
-    refTypeInfo,
-    onQueryRefOptions
-  ]);
-  return {
-    options,
-    loading
-  };
-};
 var FormContext = /* @__PURE__ */ (0, import_react11.createContext)(void 0);
 var useFormContext = () => {
   return (0, import_react11.useContext)(FormContext) ?? (0, import_debug.raise)(new Error("Missing FormContext"));
@@ -1023,7 +914,7 @@ var FormProvider = ({ children, formRef, autoSave, ...formOptions }) => {
       const keyIsEnter = event.key === "Enter";
       const modifierUsed = event.ctrlKey || event.altKey || event.metaKey || event.shiftKey;
       const inputIsTextarea = event.target.tagName.toLowerCase() === "textarea";
-      const inputOptOut = event.target.hasAttribute("data-no-submit") || event.target.closest("[data-no-submit]") !== null;
+      const inputOptOut = event.target.hasAttribute("data-no-submit");
       const shouldSubmitRegularInput = !inputIsTextarea && keyIsEnter && !modifierUsed;
       const shouldSubmitTextarea = inputIsTextarea && keyIsEnter && event.metaKey;
       if ((shouldSubmitRegularInput || shouldSubmitTextarea) && !inputOptOut) {
@@ -1057,7 +948,7 @@ var FormActions = ({ onCancel, readonly }) => {
     className: "mt-2 flex justify-center"
   }, /* @__PURE__ */ import_react10.default.createElement("div", {
     role: "none",
-    className: (0, import_react_ui_theme7.mx)(onCancel && !readonly && "grid grid-cols-2 gap-2")
+    className: (0, import_react_ui_theme6.mx)(onCancel && !readonly && "grid grid-cols-2 gap-2")
   }, onCancel && !readonly && /* @__PURE__ */ import_react10.default.createElement(import_react_ui9.IconButton, {
     "data-testid": "cancel-button",
     icon: "ph--x--regular",
@@ -1072,551 +963,140 @@ var FormActions = ({ onCancel, readonly }) => {
     onClick: handleSave
   })));
 };
-var parseValue = ({ type, format, value }) => {
-  if (value === void 0 || value === null || value === "") {
-    return void 0;
-  }
-  const parseScalar = (type2) => {
-    switch (type2) {
-      case import_echo_schema6.TypeEnum.Boolean: {
-        if (typeof value === "string") {
-          const lowercaseValue = value.toLowerCase();
-          if (lowercaseValue === "0" || lowercaseValue === "false") {
-            return false;
-          } else if (lowercaseValue === "1" || lowercaseValue === "true") {
-            return true;
-          }
-        }
-        return Boolean(value);
-      }
-      case import_echo_schema6.TypeEnum.Number: {
-        const cleaned = typeof value === "string" ? value.replace(/[^0-9.-]+/g, "") : value;
-        const num = Number(cleaned);
-        return Number.isNaN(num) ? null : num;
-      }
-      case import_echo_schema6.TypeEnum.String:
-      case import_echo_schema6.TypeEnum.Ref:
-        return String(value);
-      default: {
-        return value;
-      }
+var __dxlog_file2 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-form/src/components/Form/ArrayField.tsx";
+var padding = "px-2";
+var ArrayField = ({ property, readonly, path, inputProps, Custom, lookupComponent }) => {
+  const { t } = (0, import_react_ui10.useTranslation)(translationKey);
+  const { ast, name, type, title } = property;
+  const values = useFormValues(path ?? []);
+  (0, import_invariant2.invariant)(Array.isArray(values), `Values at path ${path?.join(".")} must be an array.`, {
+    F: __dxlog_file2,
+    L: 37,
+    S: void 0,
+    A: [
+      "Array.isArray(values)",
+      "`Values at path ${path?.join('.')} must be an array.`"
+    ]
+  });
+  const label = title ?? (0, import_effect6.pipe)(name, import_String2.capitalize);
+  const tupleType = (0, import_effect7.findNode)(ast, import_echo_schema6.AST.isTupleType);
+  const elementType = tupleType?.rest[0]?.type;
+  const getDefaultObjectValue = (typeNode) => {
+    const baseNode = (0, import_effect7.findNode)(typeNode, import_effect7.isDiscriminatedUnion);
+    const typeLiteral = baseNode ? (0, import_effect7.getDiscriminatedType)(baseNode, {}) : (0, import_effect7.findNode)(typeNode, import_echo_schema6.AST.isTypeLiteral);
+    if (!typeLiteral) {
+      return {};
     }
+    return Object.fromEntries((0, import_schema4.getSchemaProperties)(typeLiteral, {}).map((prop) => [
+      prop.name,
+      prop.defaultValue
+    ]));
   };
-  if (!format) {
-    return parseScalar(type);
-  }
-  switch (format) {
-    case import_echo_schema6.FormatEnum.Boolean:
-      return parseScalar(import_echo_schema6.TypeEnum.Boolean);
-    case import_echo_schema6.FormatEnum.Number:
-    case import_echo_schema6.FormatEnum.Percent:
-    case import_echo_schema6.FormatEnum.Currency:
-      return parseScalar(import_echo_schema6.TypeEnum.Number);
-    case import_echo_schema6.FormatEnum.String:
-    case import_echo_schema6.FormatEnum.Markdown: {
-      return parseScalar(import_echo_schema6.TypeEnum.String);
-    }
-    case import_echo_schema6.FormatEnum.Ref:
-      throw new Error(`unexpected format: ${import_echo_schema6.FormatEnum.Ref}`);
-    case import_echo_schema6.FormatEnum.DateTime:
-    case import_echo_schema6.FormatEnum.Date:
-    case import_echo_schema6.FormatEnum.Time:
-    case import_echo_schema6.FormatEnum.Timestamp: {
-      const date = new Date(value);
-      return isNaN(date.getTime()) ? null : date;
-    }
-    case import_echo_schema6.FormatEnum.GeoPoint: {
-      if (typeof value === "string") {
-        const cleaned = value.replace(/[^0-9.,-]+/g, "");
-        const parts = cleaned.split(",");
-        if (parts.length === 2) {
-          const lat = parseFloat(parts[0]);
-          const long = parseFloat(parts[1]);
-          if (!isNaN(lat) && !isNaN(long)) {
-            return import_echo_schema6.GeoLocation.toGeoPoint({
-              latitude: lat,
-              longitude: long
-            });
-          }
-        }
-      }
-      return [
-        0,
-        0
-      ];
-    }
-    default: {
-      return value;
+  const newValue = (0, import_react14.useMemo)(() => {
+    if (type === "object" && elementType) {
+      return getDefaultObjectValue(elementType);
+    } else {
+      return import_effect7.SimpleType.getDefaultValue(type);
     }
+  }, [
+    type,
+    elementType
+  ]);
+  const handleAdd = (0, import_react14.useCallback)(() => {
+    inputProps.onValueChange(type, [
+      ...values,
+      newValue
+    ]);
+  }, [
+    type,
+    elementType,
+    inputProps,
+    newValue,
+    values
+  ]);
+  const handleRemove = (0, import_react14.useCallback)((index) => {
+    const newValues = values.filter((_, i) => i !== index);
+    inputProps.onValueChange(type, newValues);
+  }, [
+    type,
+    inputProps,
+    values
+  ]);
+  if (!elementType) {
+    return null;
   }
+  return /* @__PURE__ */ import_react14.default.createElement("div", {
+    role: "none",
+    className: (0, import_react_ui_theme8.mx)(padding)
+  }, /* @__PURE__ */ import_react14.default.createElement(InputHeader, null, label), /* @__PURE__ */ import_react14.default.createElement("div", {
+    role: "none",
+    className: "flex flex-col gap-1"
+  }, values.map((_value, index) => /* @__PURE__ */ import_react14.default.createElement("div", {
+    key: index,
+    role: "none",
+    className: "flex items-center gap-1"
+  }, /* @__PURE__ */ import_react14.default.createElement("div", {
+    role: "none",
+    className: "flex-1"
+  }, /* @__PURE__ */ import_react14.default.createElement(FormField, {
+    property: {
+      ...property,
+      array: false,
+      ast: elementType
+    },
+    path: [
+      ...path ?? [],
+      index
+    ],
+    readonly,
+    inline: true,
+    Custom,
+    lookupComponent
+  })), /* @__PURE__ */ import_react14.default.createElement(import_react_ui10.IconButton, {
+    icon: "ph--trash--regular",
+    iconOnly: true,
+    label: t("button remove"),
+    onClick: () => handleRemove(index)
+  })))), /* @__PURE__ */ import_react14.default.createElement("div", {
+    role: "none",
+    className: "flex justify-between items-center plb-1"
+  }, /* @__PURE__ */ import_react14.default.createElement(import_react_ui10.IconButton, {
+    icon: "ph--plus--regular",
+    iconOnly: true,
+    label: t("button add"),
+    onClick: handleAdd
+  })));
 };
-var cellClassesForFieldType = ({ type, format }) => {
-  if (!format) {
-    switch (type) {
-      case import_echo_schema6.TypeEnum.Number:
-        return [
-          "text-right",
-          "font-mono"
-        ];
-      case import_echo_schema6.TypeEnum.Boolean:
-        return [
-          "text-right",
-          "font-mono"
-        ];
-      case import_echo_schema6.TypeEnum.String:
-        return void 0;
-      case import_echo_schema6.TypeEnum.Ref:
-        return void 0;
-      default: {
-        return void 0;
-      }
-    }
-  }
+var getInputComponent = (type, format) => {
   switch (format) {
-    case import_echo_schema6.FormatEnum.Markdown:
-      return void 0;
-    case import_echo_schema6.FormatEnum.Time:
-    case import_echo_schema6.FormatEnum.Timestamp:
-    case import_echo_schema6.FormatEnum.DateTime:
-    case import_echo_schema6.FormatEnum.Date:
-    case import_echo_schema6.FormatEnum.Duration:
-      return [
-        "font-mono",
-        "text-right"
-      ];
-    case import_echo_schema6.FormatEnum.Currency:
-      return [
-        "text-right"
-      ];
-    case import_echo_schema6.FormatEnum.JSON:
-    case import_echo_schema6.FormatEnum.DID:
-      return [
-        "font-mono"
-      ];
-    default:
-      return void 0;
+    case import_echo_schema7.FormatEnum.GeoPoint:
+      return GeoPointInput;
+    case import_echo_schema7.FormatEnum.Markdown:
+      return MarkdownInput;
+  }
+  switch (type) {
+    case "string":
+      return TextInput;
+    case "number":
+      return NumberInput;
+    case "boolean":
+      return BooleanInput;
   }
 };
-var pathNotUniqueError = (path) => ({
-  path: "path",
-  message: `'${path}' is already present`
-});
-var formatForDisplay = ({ type, format, value, locale = void 0 }) => {
-  const formatScalar = (type2) => {
-    switch (type2) {
-      case import_echo_schema7.TypeEnum.Boolean:
-        return value.toLocaleString().toUpperCase();
-      case import_echo_schema7.TypeEnum.Number:
-        return value.toLocaleString(locale);
-      case import_echo_schema7.TypeEnum.String:
-      case import_echo_schema7.TypeEnum.Ref:
-        return String(value);
-      default: {
-        return String(value);
-      }
-    }
-  };
-  if (!format) {
-    return formatScalar(type);
-  }
-  switch (format) {
-    case import_echo_schema7.FormatEnum.Boolean: {
-      return formatScalar(import_echo_schema7.TypeEnum.Boolean);
-    }
-    case import_echo_schema7.FormatEnum.Number: {
-      return formatScalar(import_echo_schema7.TypeEnum.Number);
-    }
-    case import_echo_schema7.FormatEnum.String:
-    case import_echo_schema7.FormatEnum.Ref: {
-      return formatScalar(import_echo_schema7.TypeEnum.String);
-    }
-    case import_echo_schema7.FormatEnum.Percent: {
-      return `${value * 100}%`;
-    }
-    case import_echo_schema7.FormatEnum.Currency: {
-      return value.toLocaleString(locale, {
-        style: "currency",
-        currency: "USD",
-        minimumFractionDigits: 2,
-        maximumFractionDigits: 2
-      });
-    }
-    case import_echo_schema7.FormatEnum.Date: {
-      try {
-        return (0, import_format.format)(new Date(value), "yyyy-MM-dd");
-      } catch (error) {
-        return "Invalid Date";
-      }
-    }
-    case import_echo_schema7.FormatEnum.Time: {
-      try {
-        return (0, import_format.format)(new Date(value), "HH:mm:ss");
-      } catch (error) {
-        return "Invalid Time";
-      }
-    }
-    case import_echo_schema7.FormatEnum.DateTime: {
-      try {
-        return (0, import_format.format)(new Date(value), "yyyy-MM-dd HH:mm:ss");
-      } catch (error) {
-        return "Invalid DateTime";
-      }
-    }
-    case import_echo_schema7.FormatEnum.GeoPoint: {
-      if (value === null || value === void 0) {
-        return "";
-      }
-      if (Array.isArray(value) && value.length >= 2 && value.every(Number.isFinite)) {
-        const { latitude, longitude } = import_echo_schema7.GeoLocation.fromGeoPoint(value);
-        return `${latitude},${longitude}`;
-      }
-      return String(value);
-    }
-    default: {
-      if (value === null || value === "undefined") {
-        return "";
-      }
-      return String(value);
-    }
-  }
-};
-var formatForEditing = ({ type, format, value, locale = void 0 }) => {
-  const formatScalar = (type2) => {
-    switch (type2) {
-      case import_echo_schema7.TypeEnum.Boolean:
-      case import_echo_schema7.TypeEnum.Number:
-      case import_echo_schema7.TypeEnum.String:
-      case import_echo_schema7.TypeEnum.Ref:
-        return String(value);
-      default:
-        return String(value);
-    }
-  };
-  if (!format) {
-    return formatScalar(type);
-  }
-  switch (format) {
-    case import_echo_schema7.FormatEnum.Boolean:
-    case import_echo_schema7.FormatEnum.Number:
-    case import_echo_schema7.FormatEnum.String:
-    case import_echo_schema7.FormatEnum.Ref: {
-      return formatScalar(type);
-    }
-    case import_echo_schema7.FormatEnum.Percent: {
-      return String(value * 100);
-    }
-    case import_echo_schema7.FormatEnum.Currency: {
-      return String(value);
-    }
-    case import_echo_schema7.FormatEnum.DateTime: {
-      const date = new Date(value);
-      return date.toISOString();
-    }
-    case import_echo_schema7.FormatEnum.Date: {
-      const date = new Date(value);
-      return date.toISOString().split("T")[0];
-    }
-    case import_echo_schema7.FormatEnum.Time: {
-      const date = new Date(value);
-      return date.toISOString().split("T")[1].split(".")[0];
-    }
-    case import_echo_schema7.FormatEnum.GeoPoint: {
-      if (value === null || value === void 0) {
-        return "";
-      }
-      if (Array.isArray(value) && value.length >= 2 && value.every(Number.isFinite)) {
-        const { latitude, longitude } = import_echo_schema7.GeoLocation.fromGeoPoint(value);
-        return `${latitude},${longitude}`;
-      }
-      return String(value);
-    }
-    default: {
-      return String(value);
-    }
-  }
-};
-var findArrayElementType = (ast) => {
-  const tupleType = (0, import_effect10.findNode)(ast, import_effect9.SchemaAST.isTupleType);
-  const elementType = tupleType?.rest[0]?.type;
-  return elementType;
-};
-var getRefProps = (property) => {
-  const { ast, format, array } = property;
-  if (format === import_echo_schema8.FormatEnum.Ref) {
-    return {
-      ast,
-      isArray: false
-    };
-  }
-  if (array) {
-    const elementType = findArrayElementType(ast);
-    if (elementType) {
-      const annotation = (0, import_effect8.findAnnotation)(elementType, import_echo_schema8.ReferenceAnnotationId);
-      if (annotation) {
-        return {
-          ast: elementType,
-          isArray: true
-        };
-      }
-    }
-  }
-  return void 0;
-};
-var __dxlog_file3 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-form/src/components/Form/ArrayField.tsx";
-var padding = "px-2";
-var ArrayField = ({ property, readonly, path, inputProps, Custom, lookupComponent }) => {
-  const { t } = (0, import_react_ui10.useTranslation)(translationKey);
-  const { ast, name, type, title } = property;
-  const values = useFormValues(path ?? []) ?? [];
-  (0, import_invariant2.invariant)(Array.isArray(values), `Values at path ${path?.join(".")} must be an array.`, {
-    F: __dxlog_file3,
-    L: 39,
-    S: void 0,
-    A: [
-      "Array.isArray(values)",
-      "`Values at path ${path?.join('.')} must be an array.`"
-    ]
-  });
-  const label = title ?? (0, import_effect6.pipe)(name, import_String2.capitalize);
-  const elementType = findArrayElementType(ast);
-  const getDefaultObjectValue = (typeNode) => {
-    const baseNode = (0, import_effect7.findNode)(typeNode, import_effect7.isDiscriminatedUnion);
-    const typeLiteral = baseNode ? (0, import_effect7.getDiscriminatedType)(baseNode, {}) : (0, import_effect7.findNode)(typeNode, import_effect6.SchemaAST.isTypeLiteral);
-    if (!typeLiteral) {
-      return {};
-    }
-    return Object.fromEntries((0, import_schema4.getSchemaProperties)(typeLiteral, {}).map((prop) => [
-      prop.name,
-      prop.defaultValue
-    ]));
-  };
-  const getDefaultValue = () => type === "object" && elementType ? getDefaultObjectValue(elementType) : import_effect7.SimpleType.getDefaultValue(type);
-  const handleAdd = (0, import_react16.useCallback)(() => {
-    inputProps.onValueChange(type, [
-      ...values,
-      getDefaultValue()
-    ]);
-  }, [
-    type,
-    elementType,
-    inputProps,
-    values
-  ]);
-  const handleRemove = (0, import_react16.useCallback)((index) => {
-    const newValues = values.filter((_, i) => i !== index);
-    inputProps.onValueChange(type, newValues);
-  }, [
-    type,
-    inputProps,
-    values
-  ]);
-  if (!elementType) {
-    return null;
-  }
-  return /* @__PURE__ */ import_react16.default.createElement("div", {
-    role: "none",
-    className: (0, import_react_ui_theme9.mx)(padding)
-  }, /* @__PURE__ */ import_react16.default.createElement(InputHeader, null, label), /* @__PURE__ */ import_react16.default.createElement("div", {
-    role: "none",
-    className: "flex flex-col gap-1"
-  }, values.map((_value, index) => /* @__PURE__ */ import_react16.default.createElement("div", {
-    key: index,
-    role: "none",
-    className: "flex items-center gap-1"
-  }, /* @__PURE__ */ import_react16.default.createElement("div", {
-    role: "none",
-    className: "flex-1"
-  }, /* @__PURE__ */ import_react16.default.createElement(FormField, {
-    property: {
-      ...property,
-      array: false,
-      ast: elementType
-    },
-    path: [
-      ...path ?? [],
-      index
-    ],
-    readonly,
-    inline: true,
-    Custom,
-    lookupComponent
-  })), /* @__PURE__ */ import_react16.default.createElement(import_react_ui10.IconButton, {
-    icon: "ph--trash--regular",
-    iconOnly: true,
-    label: t("button remove"),
-    onClick: () => handleRemove(index)
-  })))), /* @__PURE__ */ import_react16.default.createElement("div", {
-    role: "none",
-    className: "flex justify-between items-center plb-1"
-  }, /* @__PURE__ */ import_react16.default.createElement(import_react_ui10.IconButton, {
-    icon: "ph--plus--regular",
-    iconOnly: true,
-    label: t("button add"),
-    onClick: handleAdd
-  })));
-};
-var RefField = ({ type, label, disabled, placeholder, inputOnly, array, ast, getValue: getValue3, onBlur, onQueryRefOptions, onValueChange, ...restInputProps }) => {
-  const refTypeInfo = (0, import_react17.useMemo)(() => ast ? (0, import_effect11.findAnnotation)(ast, import_echo_schema9.ReferenceAnnotationId) : void 0, [
-    ast
-  ]);
-  const { options: availableOptions, loading: _loading } = useQueryRefOptions({
-    refTypeInfo,
-    onQueryRefOptions
-  });
-  if (refTypeInfo && refTypeInfo?.typename === (0, import_echo_schema9.getTypeAnnotation)(import_echo_schema9.Expando)?.typename || !onQueryRefOptions) {
-    return /* @__PURE__ */ import_react17.default.createElement(RefFieldFallback, {
-      type,
-      label,
-      placeholder,
-      disabled,
-      inputOnly,
-      getValue: getValue3,
-      onBlur,
-      onValueChange,
-      ...restInputProps
-    });
-  }
-  const handleGetValue = (0, import_react17.useCallback)(() => {
-    const formValue = getValue3();
-    const unknownToRefOption = (val) => {
-      if (import_echo_schema9.Ref.isRef(val)) {
-        const dxnString = val.dxn.toString();
-        const matchingOption = availableOptions.find((option2) => option2.id === dxnString);
-        if (matchingOption) {
-          return matchingOption;
-        }
-      }
-      return void 0;
-    };
-    if (array && Array.isArray(formValue)) {
-      return formValue.map(unknownToRefOption).filter(import_util5.isNonNullable) ?? [];
-    }
-    const option = unknownToRefOption(formValue);
-    if (option) {
-      return [
-        option
-      ];
-    }
-    return [];
-  }, [
-    getValue3,
-    availableOptions,
-    array
-  ]);
-  const handleSearch = (0, import_react17.useCallback)((text, ids) => availableOptions.filter((option) => !ids.includes(option.id)).filter((option) => option.label.toLowerCase().includes(text.toLowerCase())).map((option) => ({
-    id: option.id,
-    label: option.label,
-    hue: option.hue
-  })), [
-    availableOptions
-  ]);
-  const handleUpdate = (0, import_react17.useCallback)((ids) => {
-    if (ids.length === 0) {
-      onValueChange("object", void 0);
-      return;
-    }
-    const refs = ids.map((id) => {
-      const item = availableOptions.find((option) => option.id === id);
-      if (item) {
-        const dxn = import_keys2.DXN.parse(item.id);
-        return import_echo_schema9.Ref.fromDXN(dxn);
-      }
-      return null;
-    }).filter(import_util5.isNonNullable);
-    if (array) {
-      onValueChange("object", refs);
-    } else {
-      onValueChange("object", refs[0]);
-    }
-  }, [
-    availableOptions,
-    array,
-    onValueChange
-  ]);
-  const tagPickerMode = (0, import_react17.useMemo)(() => array ? "multi-select" : "single-select", [
-    array
-  ]);
-  if (!refTypeInfo) {
-    return null;
-  }
-  const { status, error } = restInputProps.getStatus();
-  return /* @__PURE__ */ import_react17.default.createElement(import_react_ui11.Input.Root, {
-    validationValence: status
-  }, !inputOnly && /* @__PURE__ */ import_react17.default.createElement(InputHeader, {
-    error
-  }, /* @__PURE__ */ import_react17.default.createElement(import_react_ui11.Input.Label, null, label)), /* @__PURE__ */ import_react17.default.createElement("div", {
-    "data-no-submit": true
-  }, /* @__PURE__ */ import_react17.default.createElement(import_react_ui_tag_picker.TagPicker, {
-    items: handleGetValue(),
-    mode: tagPickerMode,
-    onBlur: (event) => onBlur(event),
-    onUpdate: handleUpdate,
-    onSearch: handleSearch,
-    classNames: "rounded-sm bg-input p-1.5"
-  })), inputOnly && /* @__PURE__ */ import_react17.default.createElement(import_react_ui11.Input.DescriptionAndValidation, null, error));
-};
-var RefFieldFallback = ({ type, label, disabled, placeholder, inputOnly, getValue: getValue3, onValueChange, ...restInputProps }) => {
-  const handleOnValueChange = (_type, dxnString) => {
-    const dxn = import_keys2.DXN.tryParse(dxnString);
-    if (dxn) {
-      onValueChange?.("object", import_echo_schema9.Ref.fromDXN(dxn));
-    } else if (dxnString === "") {
-      onValueChange?.("object", void 0);
-    } else {
-      onValueChange?.("string", dxnString);
-    }
-  };
-  const handleGetValue = () => {
-    const formValue = getValue3();
-    if (typeof formValue === "string") {
-      return formValue;
-    }
-    if (import_echo_schema9.Ref.isRef(formValue)) {
-      return formValue.dxn.toString();
-    }
-    return void 0;
-  };
-  return /* @__PURE__ */ import_react17.default.createElement(TextInput, {
-    type,
-    label,
-    disabled,
-    placeholder,
-    inputOnly,
-    getValue: handleGetValue,
-    onValueChange: handleOnValueChange,
-    ...restInputProps
-  });
-};
-var getInputComponent = (type, format) => {
-  switch (format) {
-    case import_echo_schema10.FormatEnum.GeoPoint:
-      return GeoPointInput;
-    case import_echo_schema10.FormatEnum.Markdown:
-      return MarkdownInput;
-  }
-  switch (type) {
-    case "string":
-      return TextInput;
-    case "number":
-      return NumberInput;
-    case "boolean":
-      return BooleanInput;
-  }
-};
-var FormField = ({ property, path, readonly, inline, onQueryRefOptions, lookupComponent, Custom }) => {
+var FormField = ({ property, path, readonly, inline, lookupComponent, Custom }) => {
   const inputProps = useInputProps(path);
   const { ast, name, type, format, title, description, options, examples, array } = property;
-  const label = (0, import_react15.useMemo)(() => title ?? (0, import_effect4.pipe)(name, import_String.capitalize), [
+  const label = (0, import_react13.useMemo)(() => title ?? (0, import_effect4.pipe)(name, import_String.capitalize), [
     title,
     name
   ]);
-  const placeholder = (0, import_react15.useMemo)(() => examples?.length ? `Example: "${examples[0]}"` : description, [
+  const placeholder = (0, import_react13.useMemo)(() => examples?.length ? `Example: "${examples[0]}"` : description, [
     examples,
     description
   ]);
   const FoundComponent = lookupComponent?.({
     prop: name,
-    schema: import_effect4.Schema.make(ast),
+    schema: import_echo_schema5.S.make(ast),
     inputProps: {
       type,
       format,
@@ -1627,14 +1107,14 @@ var FormField = ({ property, path, readonly, inline, onQueryRefOptions, lookupCo
     }
   });
   if (FoundComponent) {
-    return /* @__PURE__ */ import_react15.default.createElement("div", {
+    return /* @__PURE__ */ import_react13.default.createElement("div", {
       role: "none"
     }, FoundComponent);
   }
   const jsonPath = (0, import_effect5.createJsonPath)(path ?? []);
   const CustomComponent = Custom?.[jsonPath];
   if (CustomComponent) {
-    return /* @__PURE__ */ import_react15.default.createElement(CustomComponent, {
+    return /* @__PURE__ */ import_react13.default.createElement(CustomComponent, {
       type,
       format,
       label,
@@ -1644,23 +1124,8 @@ var FormField = ({ property, path, readonly, inline, onQueryRefOptions, lookupCo
       ...inputProps
     });
   }
-  const refProps = getRefProps(property);
-  if (refProps) {
-    return /* @__PURE__ */ import_react15.default.createElement(RefField, {
-      ast: refProps.ast,
-      array: refProps.isArray,
-      type,
-      format,
-      label,
-      placeholder,
-      disabled: readonly,
-      inputOnly: inline,
-      onQueryRefOptions,
-      ...inputProps
-    });
-  }
   if (array) {
-    return /* @__PURE__ */ import_react15.default.createElement(ArrayField, {
+    return /* @__PURE__ */ import_react13.default.createElement(ArrayField, {
       property,
       path,
       inputProps,
@@ -1670,9 +1135,9 @@ var FormField = ({ property, path, readonly, inline, onQueryRefOptions, lookupCo
   }
   const InputComponent = getInputComponent(type, format);
   if (InputComponent) {
-    return /* @__PURE__ */ import_react15.default.createElement("div", {
+    return /* @__PURE__ */ import_react13.default.createElement("div", {
       role: "none"
-    }, /* @__PURE__ */ import_react15.default.createElement(InputComponent, {
+    }, /* @__PURE__ */ import_react13.default.createElement(InputComponent, {
       type,
       format,
       label,
@@ -1683,9 +1148,9 @@ var FormField = ({ property, path, readonly, inline, onQueryRefOptions, lookupCo
     }));
   }
   if (options) {
-    return /* @__PURE__ */ import_react15.default.createElement("div", {
+    return /* @__PURE__ */ import_react13.default.createElement("div", {
       role: "none"
-    }, /* @__PURE__ */ import_react15.default.createElement(SelectInput, {
+    }, /* @__PURE__ */ import_react13.default.createElement(SelectInput, {
       type,
       format,
       disabled: readonly,
@@ -1701,27 +1166,23 @@ var FormField = ({ property, path, readonly, inline, onQueryRefOptions, lookupCo
   }
   if (type === "object") {
     const baseNode = (0, import_effect5.findNode)(ast, import_effect5.isDiscriminatedUnion);
-    const typeLiteral = baseNode ? (0, import_effect5.getDiscriminatedType)(baseNode, inputProps.getValue()) : (0, import_effect5.findNode)(ast, import_effect4.SchemaAST.isTypeLiteral);
+    const typeLiteral = baseNode ? (0, import_effect5.getDiscriminatedType)(baseNode, inputProps.getValue()) : (0, import_effect5.findNode)(ast, import_echo_schema5.AST.isTypeLiteral);
     if (typeLiteral) {
-      return /* @__PURE__ */ import_react15.default.createElement("div", {
+      return /* @__PURE__ */ import_react13.default.createElement("div", {
         role: "none"
-      }, !inline && /* @__PURE__ */ import_react15.default.createElement("h3", {
-        className: "text-lg mbs-2 mbe-1"
-      }, label), /* @__PURE__ */ import_react15.default.createElement(FormFields, {
-        schema: import_effect4.Schema.make(typeLiteral),
+      }, !inline && /* @__PURE__ */ import_react13.default.createElement("div", null, label), /* @__PURE__ */ import_react13.default.createElement(FormFields, {
+        schema: import_echo_schema5.S.make(typeLiteral),
         path,
         readonly,
-        onQueryRefOptions,
-        Custom,
-        lookupComponent
+        Custom
       }));
     }
   }
   return null;
 };
-var FormFields = ({ schema, path, filter, sort, readonly, onQueryRefOptions, lookupComponent, Custom }) => {
+var FormFields = ({ schema, path, filter, sort, readonly, lookupComponent, Custom }) => {
   const values = useFormValues(path);
-  const properties = (0, import_react15.useMemo)(() => {
+  const properties = (0, import_react13.useMemo)(() => {
     const props = (0, import_schema3.getSchemaProperties)(schema.ast, values);
     const filtered = filter ? filter(props) : props;
     return sort ? filtered.sort((a, b) => sort.indexOf(a.name) - sort.indexOf(b.name)) : filtered;
@@ -1731,11 +1192,11 @@ var FormFields = ({ schema, path, filter, sort, readonly, onQueryRefOptions, loo
     filter,
     sort
   ]);
-  return /* @__PURE__ */ import_react15.default.createElement("div", {
+  return /* @__PURE__ */ import_react13.default.createElement("div", {
     role: "form",
-    className: (0, import_react_ui_theme8.mx)("flex flex-col w-full gap-2")
+    className: (0, import_react_ui_theme7.mx)("flex flex-col w-full gap-2")
   }, properties.map((property) => {
-    return /* @__PURE__ */ import_react15.default.createElement(FormField, {
+    return /* @__PURE__ */ import_react13.default.createElement(FormField, {
       key: property.name,
       property,
       path: [
@@ -1743,13 +1204,12 @@ var FormFields = ({ schema, path, filter, sort, readonly, onQueryRefOptions, loo
         property.name
       ],
       readonly,
-      onQueryRefOptions,
       lookupComponent,
       Custom
     });
-  }).filter(import_util4.isNotFalsy));
+  }).filter(import_util3.isNotFalsy));
 };
-var Form = ({ classNames, schema, values: initialValues, path = [], autoFocus, readonly, filter, sort, autoSave, testId, onValuesChanged, onValidate, onSave, onCancel, onQueryRefOptions, lookupComponent, Custom }) => {
+var Form = ({ classNames, schema, values: initialValues, path = [], autoFocus, readonly, filter, sort, autoSave, testId, onValuesChanged, onValidate, onSave, onCancel, lookupComponent, Custom }) => {
   const formRef = (0, import_react9.useRef)(null);
   const onValid = (0, import_react9.useMemo)(() => autoSave ? onSave : void 0, [
     autoSave,
@@ -1777,7 +1237,7 @@ var Form = ({ classNames, schema, values: initialValues, path = [], autoFocus, r
   }, /* @__PURE__ */ import_react9.default.createElement("div", {
     ref: formRef,
     role: "none",
-    className: (0, import_react_ui_theme6.mx)("p-2", classNames),
+    className: (0, import_react_ui_theme5.mx)("p-2", classNames),
     "data-testid": testId
   }, /* @__PURE__ */ import_react9.default.createElement(FormFields, {
     schema,
@@ -1785,7 +1245,6 @@ var Form = ({ classNames, schema, values: initialValues, path = [], autoFocus, r
     readonly,
     filter,
     sort,
-    onQueryRefOptions,
     lookupComponent,
     Custom
   }), (onCancel || onSave) && !autoSave && /* @__PURE__ */ import_react9.default.createElement(FormActions, {
@@ -1793,7 +1252,7 @@ var Form = ({ classNames, schema, values: initialValues, path = [], autoFocus, r
     readonly
   })));
 };
-var __dxlog_file4 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-form/src/components/FieldEditor/FieldEditor.tsx";
+var __dxlog_file3 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-form/src/components/FieldEditor/FieldEditor.tsx";
 var FieldEditor = ({ view, projection, field, registry, onSave, onCancel }) => {
   const { t } = (0, import_react_ui3.useTranslation)(translationKey);
   const [props, setProps] = (0, import_react3.useState)(projection.getFieldProjection(field.id).props);
@@ -1926,7 +1385,7 @@ var FieldEditor = ({ view, projection, field, registry, onSave, onCancel }) => {
     import_log.log.warn("invalid format", {
       props
     }, {
-      F: __dxlog_file4,
+      F: __dxlog_file3,
       L: 174,
       S: void 0,
       C: (f, a) => f(...a)
@@ -1950,25 +1409,24 @@ var FieldEditor = ({ view, projection, field, registry, onSave, onCancel }) => {
     Custom
   });
 };
-var __dxlog_file5 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-form/src/components/ViewEditor/ViewEditor.tsx";
+var __dxlog_file4 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-form/src/components/ViewEditor/ViewEditor.tsx";
 var grid = "grid grid-cols-[32px_1fr_32px] min-bs-[2.5rem]";
-var ViewMetaSchema = import_effect12.Schema.Struct({
-  name: import_effect12.Schema.String.annotations({
-    [import_effect12.SchemaAST.TitleAnnotationId]: "View"
+var ViewMetaSchema = import_echo_schema8.S.Struct({
+  name: import_echo_schema8.S.String.annotations({
+    [import_echo_schema8.AST.TitleAnnotationId]: "View"
   }),
-  typename: import_echo_schema11.Format.URL.annotations({
-    [import_effect12.SchemaAST.TitleAnnotationId]: "Typename"
+  typename: import_echo_schema8.Format.URL.annotations({
+    [import_echo_schema8.AST.TitleAnnotationId]: "Typename"
   })
-}).pipe(import_effect12.Schema.mutable);
+}).pipe(import_echo_schema8.S.mutable);
 var ViewEditor = ({ classNames, schema, view, registry, readonly, showHeading = false, onTypenameChanged, onDelete }) => {
-  const { t } = (0, import_react_ui12.useTranslation)(translationKey);
-  const projection = (0, import_react18.useMemo)(() => new import_schema5.ViewProjection((0, import_echo_schema11.toJsonSchema)(schema), view), [
+  const { t } = (0, import_react_ui11.useTranslation)(translationKey);
+  const projection = (0, import_react15.useMemo)(() => new import_schema5.ViewProjection(schema.jsonSchema, view), [
     schema,
     view
   ]);
-  const [field, setField] = (0, import_react18.useState)();
-  const immutable = readonly || !(0, import_echo_schema11.isMutable)(schema);
-  const viewValues = (0, import_react18.useMemo)(() => {
+  const [field, setField] = (0, import_react15.useState)();
+  const viewValues = (0, import_react15.useMemo)(() => {
     return {
       name: view.name,
       // TODO(burdon): Need to warn user of possible consequences of editing.
@@ -1978,16 +1436,16 @@ var ViewEditor = ({ classNames, schema, view, registry, readonly, showHeading =
   }, [
     view
   ]);
-  const handleSelect = (0, import_react18.useCallback)((field2) => {
+  const handleSelect = (0, import_react15.useCallback)((field2) => {
     setField((f) => f === field2 ? void 0 : field2);
   }, []);
-  const handleAdd = (0, import_react18.useCallback)(() => {
-    (0, import_invariant3.invariant)(!immutable, void 0, {
-      F: __dxlog_file5,
-      L: 78,
+  const handleAdd = (0, import_react15.useCallback)(() => {
+    (0, import_invariant3.invariant)(!schema.readonly, void 0, {
+      F: __dxlog_file4,
+      L: 76,
       S: void 0,
       A: [
-        "!immutable",
+        "!schema.readonly",
         ""
       ]
     });
@@ -1997,13 +1455,13 @@ var ViewEditor = ({ classNames, schema, view, registry, readonly, showHeading =
     schema,
     view
   ]);
-  const handleUpdate = (0, import_react18.useCallback)(({ name, typename }) => {
-    (0, import_invariant3.invariant)(!immutable, void 0, {
-      F: __dxlog_file5,
-      L: 85,
+  const handleUpdate = (0, import_react15.useCallback)(({ name, typename }) => {
+    (0, import_invariant3.invariant)(!schema.readonly, void 0, {
+      F: __dxlog_file4,
+      L: 83,
       S: void 0,
       A: [
-        "!immutable",
+        "!schema.readonly",
         ""
       ]
     });
@@ -2020,13 +1478,13 @@ var ViewEditor = ({ classNames, schema, view, registry, readonly, showHeading =
     view,
     onTypenameChanged
   ]);
-  const handleDelete = (0, import_react18.useCallback)((fieldId) => {
-    (0, import_invariant3.invariant)(!immutable, void 0, {
-      F: __dxlog_file5,
-      L: 101,
+  const handleDelete = (0, import_react15.useCallback)((fieldId) => {
+    (0, import_invariant3.invariant)(!schema.readonly, void 0, {
+      F: __dxlog_file4,
+      L: 99,
       S: void 0,
       A: [
-        "!immutable",
+        "!schema.readonly",
         ""
       ]
     });
@@ -2039,13 +1497,13 @@ var ViewEditor = ({ classNames, schema, view, registry, readonly, showHeading =
     field,
     onDelete
   ]);
-  const handleMove = (0, import_react18.useCallback)((fromIndex, toIndex) => {
-    (0, import_invariant3.invariant)(!immutable, void 0, {
-      F: __dxlog_file5,
-      L: 113,
+  const handleMove = (0, import_react15.useCallback)((fromIndex, toIndex) => {
+    (0, import_invariant3.invariant)(!schema.readonly, void 0, {
+      F: __dxlog_file4,
+      L: 111,
       S: void 0,
       A: [
-        "!immutable",
+        "!schema.readonly",
         ""
       ]
     });
@@ -2059,112 +1517,357 @@ var ViewEditor = ({ classNames, schema, view, registry, readonly, showHeading =
     schema,
     view.fields
   ]);
-  const handleClose = (0, import_react18.useCallback)(() => setField(void 0), []);
+  const handleClose = (0, import_react15.useCallback)(() => setField(void 0), []);
   const hiddenProperties = projection.getHiddenProperties();
-  const handleHide = (0, import_react18.useCallback)((fieldId) => {
+  const handleHide = (0, import_react15.useCallback)((fieldId) => {
     setField(void 0);
     projection.hideFieldProjection(fieldId);
   }, [
     projection
   ]);
-  const handleShow = (0, import_react18.useCallback)((property) => {
+  const handleShow = (0, import_react15.useCallback)((property) => {
     setField(void 0);
     projection.showFieldProjection(property);
   }, [
     projection
   ]);
-  return /* @__PURE__ */ import_react18.default.createElement("div", {
+  return /* @__PURE__ */ import_react15.default.createElement("div", {
     role: "none",
-    className: (0, import_react_ui_theme10.mx)("grid grid-rows-[1fr_1fr] min-bs-0", classNames)
-  }, /* @__PURE__ */ import_react18.default.createElement(Form, {
+    className: (0, import_react_ui_theme9.mx)("flex flex-col w-full divide-y divide-separator", classNames)
+  }, /* @__PURE__ */ import_react15.default.createElement(Form, {
     autoSave: true,
     schema: ViewMetaSchema,
     values: viewValues,
-    onSave: immutable ? void 0 : handleUpdate,
-    classNames: "min-bs-0 overflow-y-auto"
-  }), /* @__PURE__ */ import_react18.default.createElement("div", {
-    role: "none",
-    className: "border-bs border-separator min-bs-0 overflow-y-auto"
-  }, /* @__PURE__ */ import_react18.default.createElement("div", {
+    onSave: schema.readonly ? void 0 : handleUpdate
+  }), /* @__PURE__ */ import_react15.default.createElement("div", null, /* @__PURE__ */ import_react15.default.createElement("div", {
     role: "none",
     className: "p-2"
-  }, /* @__PURE__ */ import_react18.default.createElement("label", {
-    className: (0, import_react_ui_theme10.mx)(import_react_ui_theme10.inputTextLabel)
-  }, t("fields label"))), /* @__PURE__ */ import_react18.default.createElement(import_react_ui_list2.List.Root, {
+  }, /* @__PURE__ */ import_react15.default.createElement("label", {
+    className: (0, import_react_ui_theme9.mx)(import_react_ui_theme9.inputTextLabel)
+  }, t("fields label"))), /* @__PURE__ */ import_react15.default.createElement(import_react_ui_list2.List.Root, {
     items: view.fields,
-    isItem: import_effect12.Schema.is(import_schema5.FieldSchema),
+    isItem: import_echo_schema8.S.is(import_schema5.FieldSchema),
     getId: (field2) => field2.id,
-    onMove: immutable ? void 0 : handleMove
-  }, ({ items: fields }) => /* @__PURE__ */ import_react18.default.createElement(import_react18.default.Fragment, null, showHeading && /* @__PURE__ */ import_react18.default.createElement("div", {
+    onMove: schema.readonly ? void 0 : handleMove
+  }, ({ items: fields }) => /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, showHeading && /* @__PURE__ */ import_react15.default.createElement("div", {
     role: "heading",
     className: grid
-  }, /* @__PURE__ */ import_react18.default.createElement("div", null), /* @__PURE__ */ import_react18.default.createElement("div", {
+  }, /* @__PURE__ */ import_react15.default.createElement("div", null), /* @__PURE__ */ import_react15.default.createElement("div", {
     className: "flex items-center text-sm"
-  }, t("field path label"))), /* @__PURE__ */ import_react18.default.createElement("div", {
+  }, t("field path label"))), /* @__PURE__ */ import_react15.default.createElement("div", {
     role: "list",
     className: "flex flex-col w-full"
-  }, fields?.map((field2) => /* @__PURE__ */ import_react18.default.createElement(import_react_ui_list2.List.Item, {
+  }, fields?.map((field2) => /* @__PURE__ */ import_react15.default.createElement(import_react_ui_list2.List.Item, {
     key: field2.id,
     item: field2,
-    classNames: (0, import_react_ui_theme10.mx)(grid, import_react_ui_theme10.ghostHover, "cursor-pointer")
-  }, /* @__PURE__ */ import_react18.default.createElement(import_react_ui_list2.List.ItemDragHandle, null), /* @__PURE__ */ import_react18.default.createElement(import_react_ui_list2.List.ItemTitle, {
+    classNames: (0, import_react_ui_theme9.mx)(grid, import_react_ui_theme9.ghostHover, "cursor-pointer")
+  }, /* @__PURE__ */ import_react15.default.createElement(import_react_ui_list2.List.ItemDragHandle, null), /* @__PURE__ */ import_react15.default.createElement(import_react_ui_list2.List.ItemTitle, {
     onClick: () => handleSelect(field2)
-  }, field2.path), /* @__PURE__ */ import_react18.default.createElement("div", {
+  }, field2.path), /* @__PURE__ */ import_react15.default.createElement("div", {
     className: "flex items-center gap-2 -ml-4"
-  }, /* @__PURE__ */ import_react18.default.createElement(import_react_ui_list2.List.ItemButton, {
+  }, /* @__PURE__ */ import_react15.default.createElement(import_react_ui_list2.List.ItemButton, {
     icon: "ph--eye-slash--regular",
     disabled: view.fields.length <= 1,
     onClick: () => handleHide(field2.id)
-  }), !immutable && /* @__PURE__ */ import_react18.default.createElement(import_react_ui_list2.List.ItemDeleteButton, {
+  }), !schema.readonly && /* @__PURE__ */ import_react15.default.createElement(import_react_ui_list2.List.ItemDeleteButton, {
     icon: "ph--trash--regular",
     disabled: view.fields.length <= 1,
     onClick: () => handleDelete(field2.id)
-  }))))))), hiddenProperties.length > 0 && /* @__PURE__ */ import_react18.default.createElement("div", null, /* @__PURE__ */ import_react18.default.createElement("div", {
+  }))))))), hiddenProperties.length > 0 && /* @__PURE__ */ import_react15.default.createElement("div", null, /* @__PURE__ */ import_react15.default.createElement("div", {
     role: "none",
     className: "p-2"
-  }, /* @__PURE__ */ import_react18.default.createElement("label", {
-    className: (0, import_react_ui_theme10.mx)(import_react_ui_theme10.inputTextLabel)
-  }, t("hidden fields label"))), /* @__PURE__ */ import_react18.default.createElement(import_react_ui_list2.List.Root, {
+  }, /* @__PURE__ */ import_react15.default.createElement("label", {
+    className: (0, import_react_ui_theme9.mx)(import_react_ui_theme9.inputTextLabel)
+  }, t("hidden fields label"))), /* @__PURE__ */ import_react15.default.createElement(import_react_ui_list2.List.Root, {
     items: hiddenProperties,
     isItem: (item) => typeof item === "string",
     getId: (property) => property
-  }, ({ items: properties }) => /* @__PURE__ */ import_react18.default.createElement("div", {
+  }, ({ items: properties }) => /* @__PURE__ */ import_react15.default.createElement("div", {
     role: "list",
     className: "flex flex-col w-full"
-  }, properties?.map((property) => /* @__PURE__ */ import_react18.default.createElement(import_react_ui_list2.List.Item, {
+  }, properties?.map((property) => /* @__PURE__ */ import_react15.default.createElement(import_react_ui_list2.List.Item, {
     key: property,
     item: property,
-    classNames: (0, import_react_ui_theme10.mx)(grid, import_react_ui_theme10.ghostHover, "cursor-pointer")
-  }, /* @__PURE__ */ import_react18.default.createElement("div", null), /* @__PURE__ */ import_react18.default.createElement(import_react_ui_list2.List.ItemTitle, null, property), /* @__PURE__ */ import_react18.default.createElement(import_react_ui_list2.List.ItemButton, {
+    classNames: (0, import_react_ui_theme9.mx)(grid, import_react_ui_theme9.ghostHover, "cursor-pointer")
+  }, /* @__PURE__ */ import_react15.default.createElement("div", null), /* @__PURE__ */ import_react15.default.createElement(import_react_ui_list2.List.ItemTitle, null, property), /* @__PURE__ */ import_react15.default.createElement(import_react_ui_list2.List.ItemButton, {
     icon: "ph--eye--regular",
     onClick: () => handleShow(property)
-  }))))))), field && /* @__PURE__ */ import_react18.default.createElement(FieldEditor, {
+  }))))))), field && /* @__PURE__ */ import_react15.default.createElement(FieldEditor, {
     key: field.id,
     view,
     projection,
     field,
     registry,
     onSave: handleClose
-  }), !readonly && !field && /* @__PURE__ */ import_react18.default.createElement("div", {
+  }), !readonly && !field && /* @__PURE__ */ import_react15.default.createElement("div", {
     className: "flex p-2 justify-center"
-  }, /* @__PURE__ */ import_react18.default.createElement(import_react_ui12.IconButton, {
+  }, /* @__PURE__ */ import_react15.default.createElement(import_react_ui11.IconButton, {
     icon: "ph--plus--regular",
     label: t("button add property"),
-    onClick: immutable ? void 0 : handleAdd,
+    onClick: schema.readonly ? void 0 : handleAdd,
     // TODO(burdon): Show field limit in ux (not tooltip).
     disabled: view.fields.length >= import_schema5.VIEW_FIELD_LIMIT
   })));
 };
+var parseValue = ({ type, format, value }) => {
+  if (value === void 0 || value === null || value === "") {
+    return void 0;
+  }
+  const parseScalar = (type2) => {
+    switch (type2) {
+      case import_echo_schema9.TypeEnum.Boolean: {
+        if (typeof value === "string") {
+          const lowercaseValue = value.toLowerCase();
+          if (lowercaseValue === "0" || lowercaseValue === "false") {
+            return false;
+          } else if (lowercaseValue === "1" || lowercaseValue === "true") {
+            return true;
+          }
+        }
+        return Boolean(value);
+      }
+      case import_echo_schema9.TypeEnum.Number: {
+        const cleaned = typeof value === "string" ? value.replace(/[^0-9.-]+/g, "") : value;
+        const num = Number(cleaned);
+        return Number.isNaN(num) ? null : num;
+      }
+      case import_echo_schema9.TypeEnum.String:
+      case import_echo_schema9.TypeEnum.Ref:
+        return String(value);
+      default: {
+        return value;
+      }
+    }
+  };
+  if (!format) {
+    return parseScalar(type);
+  }
+  switch (format) {
+    case import_echo_schema9.FormatEnum.Boolean:
+      return parseScalar(import_echo_schema9.TypeEnum.Boolean);
+    case import_echo_schema9.FormatEnum.Number:
+    case import_echo_schema9.FormatEnum.Percent:
+    case import_echo_schema9.FormatEnum.Currency:
+      return parseScalar(import_echo_schema9.TypeEnum.Number);
+    case import_echo_schema9.FormatEnum.String:
+    case import_echo_schema9.FormatEnum.Markdown: {
+      return parseScalar(import_echo_schema9.TypeEnum.String);
+    }
+    case import_echo_schema9.FormatEnum.Ref:
+      throw new Error(`unexpected format: ${import_echo_schema9.FormatEnum.Ref}`);
+    case import_echo_schema9.FormatEnum.DateTime:
+    case import_echo_schema9.FormatEnum.Date:
+    case import_echo_schema9.FormatEnum.Time:
+    case import_echo_schema9.FormatEnum.Timestamp: {
+      const date = new Date(value);
+      return isNaN(date.getTime()) ? null : date;
+    }
+    case import_echo_schema9.FormatEnum.GeoPoint: {
+      if (typeof value === "string") {
+        const cleaned = value.replace(/[^0-9.,-]+/g, "");
+        const parts = cleaned.split(",");
+        if (parts.length === 2) {
+          const lat = parseFloat(parts[0]);
+          const long = parseFloat(parts[1]);
+          if (!isNaN(lat) && !isNaN(long)) {
+            return import_echo_schema9.GeoLocation.toGeoPoint({
+              latitude: lat,
+              longitude: long
+            });
+          }
+        }
+      }
+      return [
+        0,
+        0
+      ];
+    }
+    default: {
+      return value;
+    }
+  }
+};
+var cellClassesForFieldType = ({ type, format }) => {
+  if (!format) {
+    switch (type) {
+      case import_echo_schema9.TypeEnum.Number:
+        return [
+          "text-right",
+          "font-mono"
+        ];
+      case import_echo_schema9.TypeEnum.Boolean:
+        return [
+          "text-right",
+          "font-mono"
+        ];
+      case import_echo_schema9.TypeEnum.String:
+        return void 0;
+      case import_echo_schema9.TypeEnum.Ref:
+        return void 0;
+      default: {
+        return void 0;
+      }
+    }
+  }
+  switch (format) {
+    case import_echo_schema9.FormatEnum.Markdown:
+      return void 0;
+    case import_echo_schema9.FormatEnum.Time:
+    case import_echo_schema9.FormatEnum.Timestamp:
+    case import_echo_schema9.FormatEnum.DateTime:
+    case import_echo_schema9.FormatEnum.Date:
+    case import_echo_schema9.FormatEnum.Duration:
+      return [
+        "font-mono",
+        "text-right"
+      ];
+    case import_echo_schema9.FormatEnum.Currency:
+      return [
+        "text-right"
+      ];
+    case import_echo_schema9.FormatEnum.JSON:
+    case import_echo_schema9.FormatEnum.DID:
+      return [
+        "font-mono"
+      ];
+    default:
+      return void 0;
+  }
+};
+var pathNotUniqueError = (path) => ({
+  path: "path",
+  message: `'${path}' is already present`
+});
+var formatForDisplay = ({ type, format, value, locale = void 0 }) => {
+  const formatScalar = (type2) => {
+    switch (type2) {
+      case import_echo_schema10.TypeEnum.Boolean:
+        return value.toLocaleString().toUpperCase();
+      case import_echo_schema10.TypeEnum.Number:
+        return value.toLocaleString(locale);
+      case import_echo_schema10.TypeEnum.String:
+      case import_echo_schema10.TypeEnum.Ref:
+        return String(value);
+      default: {
+        return String(value);
+      }
+    }
+  };
+  if (!format) {
+    return formatScalar(type);
+  }
+  switch (format) {
+    case import_echo_schema10.FormatEnum.Boolean: {
+      return formatScalar(import_echo_schema10.TypeEnum.Boolean);
+    }
+    case import_echo_schema10.FormatEnum.Number: {
+      return formatScalar(import_echo_schema10.TypeEnum.Number);
+    }
+    case import_echo_schema10.FormatEnum.String:
+    case import_echo_schema10.FormatEnum.Ref: {
+      return formatScalar(import_echo_schema10.TypeEnum.String);
+    }
+    case import_echo_schema10.FormatEnum.Percent: {
+      return `${value * 100}%`;
+    }
+    case import_echo_schema10.FormatEnum.Currency: {
+      return value.toLocaleString(locale, {
+        style: "currency",
+        currency: "USD",
+        minimumFractionDigits: 2,
+        maximumFractionDigits: 2
+      });
+    }
+    case import_echo_schema10.FormatEnum.Date: {
+      return (0, import_format.format)(new Date(value), "yyyy-MM-dd");
+    }
+    case import_echo_schema10.FormatEnum.Time: {
+      return (0, import_format.format)(new Date(value), "HH:mm:ss");
+    }
+    case import_echo_schema10.FormatEnum.DateTime: {
+      return (0, import_format.format)(new Date(value), "yyyy-MM-dd HH:mm:ss");
+    }
+    case import_echo_schema10.FormatEnum.GeoPoint: {
+      if (value === null || value === void 0) {
+        return "";
+      }
+      if (Array.isArray(value) && value.length >= 2 && value.every(Number.isFinite)) {
+        const { latitude, longitude } = import_echo_schema10.GeoLocation.fromGeoPoint(value);
+        return `${latitude},${longitude}`;
+      }
+      return String(value);
+    }
+    default: {
+      if (value === null || value === "undefined") {
+        return "";
+      }
+      return String(value);
+    }
+  }
+};
+var formatForEditing = ({ type, format, value, locale = void 0 }) => {
+  const formatScalar = (type2) => {
+    switch (type2) {
+      case import_echo_schema10.TypeEnum.Boolean:
+      case import_echo_schema10.TypeEnum.Number:
+      case import_echo_schema10.TypeEnum.String:
+      case import_echo_schema10.TypeEnum.Ref:
+        return String(value);
+      default:
+        return String(value);
+    }
+  };
+  if (!format) {
+    return formatScalar(type);
+  }
+  switch (format) {
+    case import_echo_schema10.FormatEnum.Boolean:
+    case import_echo_schema10.FormatEnum.Number:
+    case import_echo_schema10.FormatEnum.String:
+    case import_echo_schema10.FormatEnum.Ref: {
+      return formatScalar(type);
+    }
+    case import_echo_schema10.FormatEnum.Percent: {
+      return String(value * 100);
+    }
+    case import_echo_schema10.FormatEnum.Currency: {
+      return String(value);
+    }
+    case import_echo_schema10.FormatEnum.DateTime: {
+      const date = new Date(value);
+      return date.toISOString();
+    }
+    case import_echo_schema10.FormatEnum.Date: {
+      const date = new Date(value);
+      return date.toISOString().split("T")[0];
+    }
+    case import_echo_schema10.FormatEnum.Time: {
+      const date = new Date(value);
+      return date.toISOString().split("T")[1].split(".")[0];
+    }
+    case import_echo_schema10.FormatEnum.GeoPoint: {
+      if (value === null || value === void 0) {
+        return "";
+      }
+      if (Array.isArray(value) && value.length >= 2 && value.every(Number.isFinite)) {
+        const { latitude, longitude } = import_echo_schema10.GeoLocation.fromGeoPoint(value);
+        return `${latitude},${longitude}`;
+      }
+      return String(value);
+    }
+    default: {
+      return String(value);
+    }
+  }
+};
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   BooleanInput,
   ControlFrame,
   ControlFrameItem,
   ControlGroup,
-  ControlGroupButton,
   ControlItem,
   ControlItemInput,
-  ControlPage,
   ControlSection,
   ControlSectionHeading,
   DeprecatedFormContainer,
@@ -2183,18 +1886,14 @@ var ViewEditor = ({ classNames, schema, view, registry, readonly, showHeading =
   ViewEditor,
   cellClassesForFieldType,
   controlItemClasses,
-  findArrayElementType,
   formatForDisplay,
   formatForEditing,
-  getRefProps,
   parseValue,
   pathNotUniqueError,
   translations,
   useForm,
   useFormContext,
   useFormValues,
-  useInputProps,
-  useQueryRefOptions,
-  useRefQueryLookupHandler
+  useInputProps
 });
 //# sourceMappingURL=index.cjs.map