@dxos/react-ui-form 0.8.2-main.5885341 → 0.8.2-main.5ca3450

package/dist/lib/browser/index.mjs

@@ -181,7 +181,7 @@ var ControlFrameItem = ({ title, description, children }) => {
 };
 
 // packages/ui/react-ui-form/src/components/FieldEditor/FieldEditor.tsx
-import React14, { useCallback as useCallback6, useEffect as useEffect8, useMemo as useMemo7, useState as useState5 } from "react";
+import React14, { useCallback as useCallback7, useEffect as useEffect8, useMemo as useMemo7, useState as useState5 } from "react";
 import { FormatEnum as FormatEnum2, FormatEnums, formatToType } from "@dxos/echo-schema";
 import { log as log3 } from "@dxos/log";
 import { useTranslation as useTranslation6 } from "@dxos/react-ui";
@@ -546,23 +546,28 @@ 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 = useCallback3((value2) => onValueChange(type, value2), [
+    type,
+    onValueChange
+  ]);
   return /* @__PURE__ */ React7.createElement(Input6.Root, {
     validationValence: status
   }, !inputOnly && /* @__PURE__ */ React7.createElement(InputHeader, {
     error
   }, /* @__PURE__ */ React7.createElement(Input6.Label, null, label)), /* @__PURE__ */ React7.createElement(Select.Root, {
-    value: getValue3(),
-    onValueChange: (value) => onValueChange(type, value)
+    value,
+    onValueChange: handleValueChange
   }, /* @__PURE__ */ React7.createElement(Select.TriggerButton, {
     classNames: "is-full",
     disabled,
     placeholder
-  }), /* @__PURE__ */ React7.createElement(Select.Portal, null, /* @__PURE__ */ React7.createElement(Select.Content, null, /* @__PURE__ */ React7.createElement(Select.Viewport, null, options?.map(({ value, label: label2 }) => (
+  }), /* @__PURE__ */ React7.createElement(Select.Portal, null, /* @__PURE__ */ React7.createElement(Select.Content, null, /* @__PURE__ */ React7.createElement(Select.Viewport, null, options?.map(({ value: value2, label: label2 }) => (
     // NOTE: Numeric values are converted to and from strings.
     /* @__PURE__ */ React7.createElement(Select.Option, {
-      key: String(value),
-      value: String(value)
-    }, label2 ?? String(value))
+      key: String(value2),
+      value: String(value2)
+    }, label2 ?? String(value2))
   )))))), inputOnly && /* @__PURE__ */ React7.createElement(Input6.DescriptionAndValidation, null, error));
 };
 var MarkdownInput = ({ type, label, inputOnly, disabled, placeholder, getStatus, getValue: getValue3, onValueChange, onBlur }) => {
@@ -621,7 +626,7 @@ import { getValue as getValue2 } from "@dxos/echo-schema";
 import { createJsonPath as createJsonPath2 } from "@dxos/effect";
 
 // packages/ui/react-ui-form/src/hooks/useForm.ts
-import { SchemaAST as AST } from "effect";
+import { SchemaAST } from "effect";
 import { useCallback as useCallback4, useEffect as useEffect4, useMemo as useMemo2, useState as useState3 } from "react";
 import { getValue, setValue } from "@dxos/echo-schema";
 import { createJsonPath, fromEffectValidationPath } from "@dxos/effect";
@@ -630,12 +635,12 @@ import { log } from "@dxos/log";
 import { validateSchema } from "@dxos/schema";
 var __dxlog_file = "/home/runner/work/dxos/dxos/packages/ui/react-ui-form/src/hooks/useForm.ts";
 var useForm = ({ schema, initialValues, onValuesChanged, onValidate, onValid, onSave }) => {
-  invariant(AST.isTypeLiteral(schema.ast), void 0, {
+  invariant(SchemaAST.isTypeLiteral(schema.ast), void 0, {
     F: __dxlog_file,
     L: 93,
     S: void 0,
     A: [
-      "AST.isTypeLiteral(schema.ast)",
+      "SchemaAST.isTypeLiteral(schema.ast)",
       ""
     ]
   });
@@ -829,6 +834,35 @@ var flatMap = (errors) => {
   }, {});
 };
 
+// packages/ui/react-ui-form/src/hooks/useRefQueryLookupHandler.ts
+import { useCallback as useCallback5 } from "react";
+import { getDXN } from "@dxos/echo-schema";
+import { Filter } from "@dxos/react-client/echo";
+import { isNonNullable } from "@dxos/util";
+var useRefQueryLookupHandler = ({ space }) => {
+  const handleRefQueryLookup = useCallback5(async (typeInfo) => {
+    if (!space) {
+      return [];
+    }
+    const query = space.db.query(Filter.typename(typeInfo.typename));
+    const { objects } = await query.run();
+    return objects.map((object) => {
+      const dxn = getDXN(object);
+      if (!dxn) {
+        return void 0;
+      }
+      const item = {
+        dxn,
+        label: object?.name ?? object?.id ?? ""
+      };
+      return item;
+    }).filter(isNonNullable);
+  }, [
+    space
+  ]);
+  return handleRefQueryLookup;
+};
+
 // packages/ui/react-ui-form/src/components/Form/FormContext.tsx
 var FormContext = /* @__PURE__ */ createContext(void 0);
 var useFormContext = () => {
@@ -920,20 +954,18 @@ var FormActions = ({ onCancel, readonly }) => {
 };
 
 // packages/ui/react-ui-form/src/components/Form/FormContent.tsx
-import { pipe as pipe2 } from "effect";
+import { Schema, SchemaAST as SchemaAST3, pipe as pipe2 } from "effect";
 import { capitalize as capitalize2 } from "effect/String";
 import React12, { useMemo as useMemo5 } from "react";
-import { AST as AST3, S } from "@dxos/echo-schema";
 import { createJsonPath as createJsonPath3, findNode as findNode2, getDiscriminatedType as getDiscriminatedType2, isDiscriminatedUnion as isDiscriminatedUnion2 } from "@dxos/effect";
 import { mx as mx7 } from "@dxos/react-ui-theme";
 import { getSchemaProperties as getSchemaProperties2 } from "@dxos/schema";
 import { isNotFalsy } from "@dxos/util";
 
 // packages/ui/react-ui-form/src/components/Form/ArrayField.tsx
-import { pipe } from "effect";
+import { SchemaAST as SchemaAST2, pipe } from "effect";
 import { capitalize } from "effect/String";
-import React10, { useCallback as useCallback5, useMemo as useMemo4 } from "react";
-import { AST as AST2 } from "@dxos/echo-schema";
+import React10, { useCallback as useCallback6, useMemo as useMemo4 } from "react";
 import { findNode, getDiscriminatedType, isDiscriminatedUnion, SimpleType } from "@dxos/effect";
 import { invariant as invariant2 } from "@dxos/invariant";
 import { IconButton as IconButton3, useTranslation as useTranslation5 } from "@dxos/react-ui";
@@ -947,7 +979,7 @@ var ArrayField = ({ property, readonly, path, inputProps, Custom, lookupComponen
   const values = useFormValues(path ?? []) ?? [];
   invariant2(Array.isArray(values), `Values at path ${path?.join(".")} must be an array.`, {
     F: __dxlog_file2,
-    L: 39,
+    L: 38,
     S: void 0,
     A: [
       "Array.isArray(values)",
@@ -955,11 +987,11 @@ var ArrayField = ({ property, readonly, path, inputProps, Custom, lookupComponen
     ]
   });
   const label = title ?? pipe(name, capitalize);
-  const tupleType = findNode(ast, AST2.isTupleType);
+  const tupleType = findNode(ast, SchemaAST2.isTupleType);
   const elementType = tupleType?.rest[0]?.type;
   const getDefaultObjectValue = (typeNode) => {
     const baseNode = findNode(typeNode, isDiscriminatedUnion);
-    const typeLiteral = baseNode ? getDiscriminatedType(baseNode, {}) : findNode(typeNode, AST2.isTypeLiteral);
+    const typeLiteral = baseNode ? getDiscriminatedType(baseNode, {}) : findNode(typeNode, SchemaAST2.isTypeLiteral);
     if (!typeLiteral) {
       return {};
     }
@@ -978,7 +1010,7 @@ var ArrayField = ({ property, readonly, path, inputProps, Custom, lookupComponen
     type,
     elementType
   ]);
-  const handleAdd = useCallback5(() => {
+  const handleAdd = useCallback6(() => {
     inputProps.onValueChange(type, [
       ...values,
       newValue
@@ -990,7 +1022,7 @@ var ArrayField = ({ property, readonly, path, inputProps, Custom, lookupComponen
     newValue,
     values
   ]);
-  const handleRemove = useCallback5((index) => {
+  const handleRemove = useCallback6((index) => {
     const newValues = values.filter((_, i) => i !== index);
     inputProps.onValueChange(type, newValues);
   }, [
@@ -1179,7 +1211,7 @@ var FormField = ({ property, path, readonly, inline, onQueryRefOptions, lookupCo
   ]);
   const FoundComponent = lookupComponent?.({
     prop: name,
-    schema: S.make(ast),
+    schema: Schema.make(ast),
     inputProps: {
       type,
       format,
@@ -1261,14 +1293,14 @@ var FormField = ({ property, path, readonly, inline, onQueryRefOptions, lookupCo
   }
   if (type === "object") {
     const baseNode = findNode2(ast, isDiscriminatedUnion2);
-    const typeLiteral = baseNode ? getDiscriminatedType2(baseNode, inputProps.getValue()) : findNode2(ast, AST3.isTypeLiteral);
+    const typeLiteral = baseNode ? getDiscriminatedType2(baseNode, inputProps.getValue()) : findNode2(ast, SchemaAST3.isTypeLiteral);
     if (typeLiteral) {
       return /* @__PURE__ */ React12.createElement("div", {
         role: "none"
       }, !inline && /* @__PURE__ */ React12.createElement("h3", {
         className: "text-lg mbs-2 mbe-1"
       }, label), /* @__PURE__ */ React12.createElement(FormFields, {
-        schema: S.make(typeLiteral),
+        schema: Schema.make(typeLiteral),
         path,
         readonly,
         onQueryRefOptions,
@@ -1394,7 +1426,7 @@ var FieldEditor = ({ view, projection, field, registry, onSave, onCancel }) => {
   const [{ fieldSchema }, setFieldSchema] = useState5({
     fieldSchema: getFormatSchema(props?.format)
   });
-  const handleValuesChanged = useCallback6((_props) => {
+  const handleValuesChanged = useCallback7((_props) => {
     setFieldSchema((prev) => {
       const fieldSchema2 = getFormatSchema(_props.format);
       if (prev.fieldSchema === fieldSchema2) {
@@ -1429,7 +1461,7 @@ var FieldEditor = ({ view, projection, field, registry, onSave, onCancel }) => {
     props.format,
     props.referenceSchema
   ]);
-  const handleValidate = useCallback6(({ property }) => {
+  const handleValidate = useCallback7(({ property }) => {
     if (property && view.fields.find((f) => f.path === property && f.path !== field.path)) {
       return [
         {
@@ -1442,7 +1474,7 @@ var FieldEditor = ({ view, projection, field, registry, onSave, onCancel }) => {
     view.fields,
     field
   ]);
-  const handleSave = useCallback6((props2) => {
+  const handleSave = useCallback7((props2) => {
     projection.setFieldProjection({
       field,
       props: props2
@@ -1453,7 +1485,7 @@ var FieldEditor = ({ view, projection, field, registry, onSave, onCancel }) => {
     field,
     onSave
   ]);
-  const handleCancel = useCallback6(() => {
+  const handleCancel = useCallback7(() => {
     requestAnimationFrame(() => onCancel?.());
     onSave();
   }, [
@@ -1485,7 +1517,7 @@ var FieldEditor = ({ view, projection, field, registry, onSave, onCancel }) => {
     schemas,
     referenceSchema
   ]);
-  const propIsNotType = useCallback6((props2) => props2.filter((p) => p.name !== "type"), []);
+  const propIsNotType = useCallback7((props2) => props2.filter((p) => p.name !== "type"), []);
   if (!fieldSchema) {
     log3.warn("invalid format", {
       props
@@ -1516,8 +1548,9 @@ var FieldEditor = ({ view, projection, field, registry, onSave, onCancel }) => {
 };
 
 // packages/ui/react-ui-form/src/components/ViewEditor/ViewEditor.tsx
-import React15, { useCallback as useCallback7, useMemo as useMemo8, useState as useState6 } from "react";
-import { AST as AST4, Format, S as S2 } from "@dxos/echo-schema";
+import { Schema as Schema2, SchemaAST as SchemaAST4 } from "effect";
+import React15, { useCallback as useCallback8, useMemo as useMemo8, useState as useState6 } from "react";
+import { Format } from "@dxos/echo-schema";
 import { invariant as invariant3 } from "@dxos/invariant";
 import { IconButton as IconButton4, useTranslation as useTranslation7 } from "@dxos/react-ui";
 import { List as List2 } from "@dxos/react-ui-list";
@@ -1525,14 +1558,14 @@ import { ghostHover, inputTextLabel, mx as mx9 } from "@dxos/react-ui-theme";
 import { FieldSchema, ViewProjection, VIEW_FIELD_LIMIT } from "@dxos/schema";
 var __dxlog_file5 = "/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 = S2.Struct({
-  name: S2.String.annotations({
-    [AST4.TitleAnnotationId]: "View"
+var ViewMetaSchema = Schema2.Struct({
+  name: Schema2.String.annotations({
+    [SchemaAST4.TitleAnnotationId]: "View"
   }),
   typename: Format.URL.annotations({
-    [AST4.TitleAnnotationId]: "Typename"
+    [SchemaAST4.TitleAnnotationId]: "Typename"
   })
-}).pipe(S2.mutable);
+}).pipe(Schema2.mutable);
 var ViewEditor = ({ classNames, schema, view, registry, readonly, showHeading = false, onTypenameChanged, onDelete }) => {
   const { t } = useTranslation7(translationKey);
   const projection = useMemo8(() => new ViewProjection(schema.jsonSchema, view), [
@@ -1550,13 +1583,13 @@ var ViewEditor = ({ classNames, schema, view, registry, readonly, showHeading =
   }, [
     view
   ]);
-  const handleSelect = useCallback7((field2) => {
+  const handleSelect = useCallback8((field2) => {
     setField((f) => f === field2 ? void 0 : field2);
   }, []);
-  const handleAdd = useCallback7(() => {
+  const handleAdd = useCallback8(() => {
     invariant3(!schema.readonly, void 0, {
       F: __dxlog_file5,
-      L: 76,
+      L: 77,
       S: void 0,
       A: [
         "!schema.readonly",
@@ -1569,10 +1602,10 @@ var ViewEditor = ({ classNames, schema, view, registry, readonly, showHeading =
     schema,
     view
   ]);
-  const handleUpdate = useCallback7(({ name, typename }) => {
+  const handleUpdate = useCallback8(({ name, typename }) => {
     invariant3(!schema.readonly, void 0, {
       F: __dxlog_file5,
-      L: 83,
+      L: 84,
       S: void 0,
       A: [
         "!schema.readonly",
@@ -1592,10 +1625,10 @@ var ViewEditor = ({ classNames, schema, view, registry, readonly, showHeading =
     view,
     onTypenameChanged
   ]);
-  const handleDelete = useCallback7((fieldId) => {
+  const handleDelete = useCallback8((fieldId) => {
     invariant3(!schema.readonly, void 0, {
       F: __dxlog_file5,
-      L: 99,
+      L: 100,
       S: void 0,
       A: [
         "!schema.readonly",
@@ -1611,10 +1644,10 @@ var ViewEditor = ({ classNames, schema, view, registry, readonly, showHeading =
     field,
     onDelete
   ]);
-  const handleMove = useCallback7((fromIndex, toIndex) => {
+  const handleMove = useCallback8((fromIndex, toIndex) => {
     invariant3(!schema.readonly, void 0, {
       F: __dxlog_file5,
-      L: 111,
+      L: 112,
       S: void 0,
       A: [
         "!schema.readonly",
@@ -1631,15 +1664,15 @@ var ViewEditor = ({ classNames, schema, view, registry, readonly, showHeading =
     schema,
     view.fields
   ]);
-  const handleClose = useCallback7(() => setField(void 0), []);
+  const handleClose = useCallback8(() => setField(void 0), []);
   const hiddenProperties = projection.getHiddenProperties();
-  const handleHide = useCallback7((fieldId) => {
+  const handleHide = useCallback8((fieldId) => {
     setField(void 0);
     projection.hideFieldProjection(fieldId);
   }, [
     projection
   ]);
-  const handleShow = useCallback7((property) => {
+  const handleShow = useCallback8((property) => {
     setField(void 0);
     projection.showFieldProjection(property);
   }, [
@@ -1664,7 +1697,7 @@ var ViewEditor = ({ classNames, schema, view, registry, readonly, showHeading =
     className: mx9(inputTextLabel)
   }, t("fields label"))), /* @__PURE__ */ React15.createElement(List2.Root, {
     items: view.fields,
-    isItem: S2.is(FieldSchema),
+    isItem: Schema2.is(FieldSchema),
     getId: (field2) => field2.id,
     onMove: schema.readonly ? void 0 : handleMove
   }, ({ items: fields }) => /* @__PURE__ */ React15.createElement(React15.Fragment, null, showHeading && /* @__PURE__ */ React15.createElement("div", {
@@ -2032,6 +2065,7 @@ export {
   useForm,
   useFormContext,
   useFormValues,
-  useInputProps
+  useInputProps,
+  useRefQueryLookupHandler
 };
 //# sourceMappingURL=index.mjs.map