@dxos/react-ui-form 0.8.4-main.422d1c7879 → 0.8.4-main.4f23b4e393

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (110) hide show
  1. package/dist/lib/browser/index.mjs +148 -273
  2. package/dist/lib/browser/index.mjs.map +4 -4
  3. package/dist/lib/browser/meta.json +1 -1
  4. package/dist/lib/browser/translations.mjs +82 -0
  5. package/dist/lib/browser/translations.mjs.map +7 -0
  6. package/dist/lib/node-esm/index.mjs +148 -273
  7. package/dist/lib/node-esm/index.mjs.map +4 -4
  8. package/dist/lib/node-esm/meta.json +1 -1
  9. package/dist/lib/node-esm/translations.mjs +84 -0
  10. package/dist/lib/node-esm/translations.mjs.map +7 -0
  11. package/dist/types/src/components/FieldEditor/FieldEditor.d.ts.map +1 -1
  12. package/dist/types/src/components/FieldEditor/FieldEditor.stories.d.ts +63 -63
  13. package/dist/types/src/components/FieldEditor/FieldEditor.stories.d.ts.map +1 -1
  14. package/dist/types/src/components/Form/Form.d.ts +19 -3
  15. package/dist/types/src/components/Form/Form.d.ts.map +1 -1
  16. package/dist/types/src/components/Form/Form.stories.d.ts +72 -72
  17. package/dist/types/src/components/Form/Form.stories.d.ts.map +1 -1
  18. package/dist/types/src/components/Form/FormField.d.ts +4 -4
  19. package/dist/types/src/components/Form/FormField.d.ts.map +1 -1
  20. package/dist/types/src/components/Form/FormFieldComponent.d.ts +5 -6
  21. package/dist/types/src/components/Form/FormFieldComponent.d.ts.map +1 -1
  22. package/dist/types/src/components/Form/FormFieldComponent.stories.d.ts.map +1 -1
  23. package/dist/types/src/components/Form/FormFieldSet.d.ts +4 -7
  24. package/dist/types/src/components/Form/FormFieldSet.d.ts.map +1 -1
  25. package/dist/types/src/components/Form/fields/ArrayField.d.ts +4 -4
  26. package/dist/types/src/components/Form/fields/ArrayField.d.ts.map +1 -1
  27. package/dist/types/src/components/Form/fields/BooleanField.d.ts.map +1 -1
  28. package/dist/types/src/components/Form/fields/GeoPointField.d.ts.map +1 -1
  29. package/dist/types/src/components/Form/fields/MarkdownField.d.ts.map +1 -1
  30. package/dist/types/src/components/Form/fields/MarkdownField.stories.d.ts +64 -63
  31. package/dist/types/src/components/Form/fields/MarkdownField.stories.d.ts.map +1 -1
  32. package/dist/types/src/components/Form/fields/NumberField.d.ts.map +1 -1
  33. package/dist/types/src/components/Form/fields/RefField.d.ts.map +1 -1
  34. package/dist/types/src/components/Form/fields/SelectField.d.ts.map +1 -1
  35. package/dist/types/src/components/Form/fields/SelectOptionField.d.ts.map +1 -1
  36. package/dist/types/src/components/Form/fields/SelectOptionField.stories.d.ts +63 -63
  37. package/dist/types/src/components/Form/fields/SelectOptionField.stories.d.ts.map +1 -1
  38. package/dist/types/src/components/Form/fields/TextAreaField.d.ts.map +1 -1
  39. package/dist/types/src/components/Form/fields/TextField.d.ts.map +1 -1
  40. package/dist/types/src/components/Form/fields/TupleField.d.ts.map +1 -1
  41. package/dist/types/src/components/ObjectForm/ObjectForm.d.ts.map +1 -1
  42. package/dist/types/src/components/ObjectPicker/ObjectPicker.d.ts +1 -1
  43. package/dist/types/src/components/ObjectPicker/ObjectPicker.d.ts.map +1 -1
  44. package/dist/types/src/components/ObjectPicker/ObjectPicker.stories.d.ts +63 -63
  45. package/dist/types/src/components/ObjectPicker/ObjectPicker.stories.d.ts.map +1 -1
  46. package/dist/types/src/components/ObjectProperties/ObjectProperties.d.ts +1 -1
  47. package/dist/types/src/components/ObjectProperties/ObjectProperties.d.ts.map +1 -1
  48. package/dist/types/src/components/ObjectProperties/ObjectProperties.stories.d.ts +63 -63
  49. package/dist/types/src/components/ObjectProperties/ObjectProperties.stories.d.ts.map +1 -1
  50. package/dist/types/src/components/Settings/Settings.d.ts +10 -2
  51. package/dist/types/src/components/Settings/Settings.d.ts.map +1 -1
  52. package/dist/types/src/components/Settings/Settings.stories.d.ts +63 -63
  53. package/dist/types/src/components/Settings/Settings.stories.d.ts.map +1 -1
  54. package/dist/types/src/components/Settings/SettingsFieldSet.d.ts +15 -10
  55. package/dist/types/src/components/Settings/SettingsFieldSet.d.ts.map +1 -1
  56. package/dist/types/src/components/Settings/SettingsItem.d.ts +8 -9
  57. package/dist/types/src/components/Settings/SettingsItem.d.ts.map +1 -1
  58. package/dist/types/src/components/Settings/SettingsSelectField.d.ts +18 -0
  59. package/dist/types/src/components/Settings/SettingsSelectField.d.ts.map +1 -0
  60. package/dist/types/src/components/Settings/index.d.ts +1 -0
  61. package/dist/types/src/components/Settings/index.d.ts.map +1 -1
  62. package/dist/types/src/components/ViewEditor/ViewEditor.d.ts +3 -4
  63. package/dist/types/src/components/ViewEditor/ViewEditor.d.ts.map +1 -1
  64. package/dist/types/src/components/ViewEditor/ViewEditor.stories.d.ts +63 -63
  65. package/dist/types/src/components/ViewEditor/ViewEditor.stories.d.ts.map +1 -1
  66. package/dist/types/src/components/testing.d.ts.map +1 -1
  67. package/dist/types/src/hooks/useFormHandler.d.ts.map +1 -1
  68. package/dist/types/src/hooks/useKeyHandler.d.ts.map +1 -1
  69. package/dist/types/src/index.d.ts +0 -2
  70. package/dist/types/src/index.d.ts.map +1 -1
  71. package/dist/types/src/translations.d.ts +63 -63
  72. package/dist/types/src/translations.d.ts.map +1 -1
  73. package/dist/types/src/util/field-type.d.ts +1 -1
  74. package/dist/types/src/util/field-type.d.ts.map +1 -1
  75. package/dist/types/src/util/field.d.ts.map +1 -1
  76. package/dist/types/src/util/formatting.d.ts.map +1 -1
  77. package/dist/types/src/util/properties.d.ts.map +1 -1
  78. package/dist/types/src/util/refs.d.ts.map +1 -1
  79. package/dist/types/tsconfig.tsbuildinfo +1 -1
  80. package/package.json +39 -30
  81. package/src/components/FieldEditor/FieldEditor.stories.tsx +2 -1
  82. package/src/components/FieldEditor/FieldEditor.tsx +3 -2
  83. package/src/components/Form/Form.stories.tsx +2 -1
  84. package/src/components/Form/Form.tsx +3 -3
  85. package/src/components/Form/FormField.tsx +2 -1
  86. package/src/components/Form/FormFieldComponent.tsx +3 -3
  87. package/src/components/Form/fields/ArrayField.tsx +6 -9
  88. package/src/components/Form/fields/GeoPointField.tsx +3 -2
  89. package/src/components/Form/fields/MarkdownField.stories.tsx +56 -1
  90. package/src/components/Form/fields/MarkdownField.tsx +2 -1
  91. package/src/components/Form/fields/RefField.tsx +4 -3
  92. package/src/components/Form/fields/SelectOptionField.stories.tsx +2 -1
  93. package/src/components/Form/fields/SelectOptionField.tsx +6 -5
  94. package/src/components/ObjectForm/ObjectForm.tsx +6 -5
  95. package/src/components/ObjectPicker/ObjectPicker.stories.tsx +8 -5
  96. package/src/components/ObjectPicker/ObjectPicker.tsx +18 -9
  97. package/src/components/ObjectProperties/ObjectProperties.stories.tsx +2 -1
  98. package/src/components/ObjectProperties/ObjectProperties.tsx +5 -4
  99. package/src/components/Settings/AUDIT.md +52 -0
  100. package/src/components/Settings/Settings.stories.tsx +2 -1
  101. package/src/components/Settings/Settings.tsx +3 -4
  102. package/src/components/Settings/SettingsFieldSet.tsx +55 -9
  103. package/src/components/Settings/SettingsItem.tsx +4 -8
  104. package/src/components/Settings/SettingsSelectField.tsx +59 -0
  105. package/src/components/Settings/index.ts +1 -0
  106. package/src/components/ViewEditor/ViewEditor.stories.tsx +7 -7
  107. package/src/components/ViewEditor/ViewEditor.tsx +17 -24
  108. package/src/components/testing.tsx +1 -1
  109. package/src/index.ts +0 -4
  110. package/src/util/field-type.ts +4 -1
@@ -1,83 +1,5 @@
1
1
  import { createRequire } from 'node:module';const require = createRequire(import.meta.url);
2
2
 
3
- // src/translations.ts
4
- var translationKey = "@dxos/react-ui-form";
5
- var translations = [
6
- {
7
- "en-US": {
8
- [translationKey]: {
9
- "fields.label": "Fields",
10
- "hidden-fields.label": "Hidden Fields",
11
- "empty-readonly-ref-field.label": "(none)",
12
- "field-property.label": "Property",
13
- "field-property.placeholder": "Property name",
14
- "field-format.label": "Type",
15
- "field-path.label": "Field path",
16
- "add-item.button": "Add item",
17
- "add-property-button.label": "Add property",
18
- "boolean-input-true.value": "Yes",
19
- "boolean-input-false.value": "No",
20
- "show-field.label": "Show field",
21
- "hide-field.label": "Hide field",
22
- "delete-field.label": "Delete field",
23
- "create-option.label": "Create",
24
- "add-tag.label": "Add tag",
25
- "ref-field-combobox-input.placeholder": "Search\u2026",
26
- "ref-field.placeholder": "Select\u2026",
27
- "ref-field.placeholder_one": "Select\u2026",
28
- "ref-field.placeholder_other": "Select items\u2026",
29
- "example.placeholder": "Example",
30
- "latitude.placeholder": "Latitude (e.g., 40.7128)",
31
- "longitude.placeholder": "Longitude (e.g., -74.0060)",
32
- "cancel-button.label": "Cancel",
33
- "save-button.label": "Save",
34
- "create-text.label": "Create text",
35
- // TypeFormat
36
- "format.boolean.label": "Boolean",
37
- "format.currency.label": "Currency",
38
- "format.date.label": "Date",
39
- "format.date-time.label": "DateTime",
40
- "format.did.label": "DID",
41
- "format.duration.label": "Duration",
42
- "format.dxn.label": "DXN",
43
- "format.email.label": "Email",
44
- "format.formula.label": "Formula",
45
- "format.hostname.label": "Hostname",
46
- "format.integer.label": "Integer",
47
- "format.json.label": "JSON",
48
- "format.lnglat.label": "Geopoint",
49
- "format.markdown.label": "Markdown",
50
- "format.percent.label": "Percent",
51
- "format.ref.label": "Reference",
52
- "format.regex.label": "RegExp",
53
- "format.string.label": "String",
54
- "format.single-select.label": "Select",
55
- "format.multi-select.label": "Multi-select",
56
- "format.text.label": "Long text",
57
- "format.time.label": "Time",
58
- "format.timestamp.label": "Timestamp",
59
- "format.user.label": "User",
60
- "format.number.label": "Number",
61
- "format.uri.label": "URI",
62
- "format.url.label": "URL",
63
- "format.uuid.label": "UUID",
64
- // GeoPointField.
65
- "latitude.label": "Latitude",
66
- "longitude.label": "Longitude",
67
- // SelectOptionsField.
68
- "select-option.label": "Label",
69
- "select-option-label.placeholder": "Option label",
70
- "select-option-delete.button": "Delete",
71
- "select-option-add.button": "Add option",
72
- // System schema message.
73
- "system-schema.title": "System type",
74
- "system-schema.description": "System type: cannot add or remove fields.",
75
- "remove.button": "Remove"
76
- }
77
- }
78
- }
79
- ];
80
-
81
3
  // src/components/FieldEditor/FieldEditor.tsx
82
4
  import React17, { useCallback as useCallback14, useEffect as useEffect5, useMemo as useMemo8, useState as useState6 } from "react";
83
5
  import { Obj as Obj3 } from "@dxos/echo";
@@ -85,6 +7,7 @@ import { Format as Format4, FormatEnums, formatToType } from "@dxos/echo/interna
85
7
  import { log as log2 } from "@dxos/log";
86
8
  import { useAsyncEffect, useTranslation as useTranslation9 } from "@dxos/react-ui";
87
9
  import { formatToAdditionalPropertyAttributes, getFormatSchema } from "@dxos/schema";
10
+ import { translationKey as translationKey9 } from "#translations";
88
11
 
89
12
  // src/util/field.ts
90
13
  import { Format, GeoLocation, TypeEnum } from "@dxos/echo/internal";
@@ -214,6 +137,9 @@ var detectFieldType = (ast) => {
214
137
  if (isLiteralUnion(ast)) {
215
138
  return "select";
216
139
  }
140
+ if (SchemaAST.isTypeLiteral(ast)) {
141
+ return "struct";
142
+ }
217
143
  switch (ast._tag) {
218
144
  case "BooleanKeyword":
219
145
  return "boolean";
@@ -425,6 +351,7 @@ import * as SchemaAST4 from "effect/SchemaAST";
425
351
  import React5, { useCallback as useCallback3 } from "react";
426
352
  import { findNode as findNode2, getArrayElementType as getArrayElementType2, getDiscriminatedType as getDiscriminatedType2, isDiscriminatedUnion as isDiscriminatedUnion2, isNestedType as isNestedType2 } from "@dxos/effect";
427
353
  import { IconButton as IconButton2, useTranslation as useTranslation3 } from "@dxos/react-ui";
354
+ import { translationKey as translationKey3 } from "#translations";
428
355
 
429
356
  // src/components/Form/Form.tsx
430
357
  import { createContext } from "@radix-ui/react-context";
@@ -436,6 +363,7 @@ import { Annotation as EchoAnnotation } from "@dxos/echo";
436
363
  import { createJsonPath as createJsonPath3, getValue as getValue$2 } from "@dxos/effect";
437
364
  import { IconButton, ScrollArea, useMergeRefs, useTranslation as useTranslation2 } from "@dxos/react-ui";
438
365
  import { composable, composableProps, mx, withColumn } from "@dxos/ui-theme";
366
+ import { translationKey as translationKey2 } from "#translations";
439
367
 
440
368
  // src/hooks/useFormHandler.ts
441
369
  import { useControllableState } from "@radix-ui/react-use-controllable-state";
@@ -473,12 +401,7 @@ var useFormHandler = ({ schema, autoSave, values: valuesProp, defaultValues: def
473
401
  log("validate", {
474
402
  values: values2,
475
403
  errors: errors2
476
- }, {
477
- F: __dxlog_file,
478
- L: 155,
479
- S: void 0,
480
- C: (f, a) => f(...a)
481
- });
404
+ }, { "~LogMeta": "~LogMeta", F: __dxlog_file, L: 42, S: void 0 });
482
405
  if (errors2.length === 0 && onValidate) {
483
406
  const validatedValues = values2;
484
407
  errors2 = onValidate(validatedValues) ?? [];
@@ -566,12 +489,7 @@ var useFormHandler = ({ schema, autoSave, values: valuesProp, defaultValues: def
566
489
  log("onValueChange", {
567
490
  path,
568
491
  value: value3
569
- }, {
570
- F: __dxlog_file,
571
- L: 254,
572
- S: void 0,
573
- C: (f, a) => f(...a)
574
- });
492
+ }, { "~LogMeta": "~LogMeta", F: __dxlog_file, L: 138, S: void 0 });
575
493
  const jsonPath = createJsonPath(path);
576
494
  const pathArray = path;
577
495
  let parsedValue = value3;
@@ -580,12 +498,7 @@ var useFormHandler = ({ schema, autoSave, values: valuesProp, defaultValues: def
580
498
  parsedValue = parseFloat(value3) || 0;
581
499
  }
582
500
  } catch (err) {
583
- log.catch(err, void 0, {
584
- F: __dxlog_file,
585
- L: 264,
586
- S: void 0,
587
- C: (f, a) => f(...a)
588
- });
501
+ log.catch(err, void 0, { "~LogMeta": "~LogMeta", F: __dxlog_file, L: 150, S: void 0 });
589
502
  parsedValue = void 0;
590
503
  }
591
504
  const newValues = mergeAtPath(values, pathArray, parsedValue);
@@ -731,7 +644,6 @@ import { inputTextLabel } from "@dxos/ui-theme";
731
644
  var FormFieldLabel = ({ label, error, readonly, asChild }) => {
732
645
  const Label = readonly || asChild ? "span" : Input.Label;
733
646
  return /* @__PURE__ */ React.createElement("div", {
734
- role: "none",
735
647
  className: "flex items-center justify-between"
736
648
  }, /* @__PURE__ */ React.createElement(Label, {
737
649
  className: inputTextLabel
@@ -755,7 +667,6 @@ var FormFieldWrapper = (props) => {
755
667
  }
756
668
  const str = String(value3 ?? "");
757
669
  return /* @__PURE__ */ React.createElement("div", {
758
- role: "none",
759
670
  className: "contents"
760
671
  }, /* @__PURE__ */ React.createElement(Input.Root, {
761
672
  validationValence: status
@@ -786,7 +697,7 @@ var FormFieldErrorBoundary = class extends Component {
786
697
  return /* @__PURE__ */ React.createElement("div", {
787
698
  className: "flex gap-2 border border-rose-fill font-mono text-sm"
788
699
  }, /* @__PURE__ */ React.createElement("span", {
789
- className: "bg-rose-fill text-surface-text px-1 font-thin"
700
+ className: "bg-rose-fill text-base-foreground px-1 font-thin"
790
701
  }, "ERROR"), String(this.props.path?.join(".")));
791
702
  }
792
703
  return this.props.children;
@@ -811,6 +722,7 @@ import React2, { useMemo as useMemo2 } from "react";
811
722
  import { Format as Format3 } from "@dxos/echo";
812
723
  import { createJsonPath as createJsonPath2, findNode, getAnnotation as getAnnotation2, getDiscriminatedType, isArrayType as isArrayType2, isDiscriminatedUnion, isLiteralUnion as isLiteralUnion2, isNestedType } from "@dxos/effect";
813
724
  import { useTranslation } from "@dxos/react-ui";
725
+ import { translationKey } from "#translations";
814
726
  var FormField = (props) => {
815
727
  const {
816
728
  type,
@@ -1143,13 +1055,12 @@ var FormFieldSet2 = (props) => {
1143
1055
  FormFieldSet2.displayName = FORM_FIELDSET_NAME2;
1144
1056
  var FORM_ACTIONS_NAME = "Form.Actions";
1145
1057
  var FormActions = ({ classNames }) => {
1146
- const { t } = useTranslation2(translationKey);
1058
+ const { t } = useTranslation2(translationKey2);
1147
1059
  const { form: { canSave, onSave, onCancel }, readonly, layout } = useFormContext(FORM_ACTIONS_NAME);
1148
1060
  if (readonly || layout === "static") {
1149
1061
  return null;
1150
1062
  }
1151
1063
  return /* @__PURE__ */ React4.createElement("div", {
1152
- role: "none",
1153
1064
  className: mx(withColumn.center(), "grid grid-flow-col gap-form-gap auto-cols-fr py-form-padding", classNames)
1154
1065
  }, onCancel && /* @__PURE__ */ React4.createElement(IconButton, {
1155
1066
  icon: "ph--x--regular",
@@ -1185,13 +1096,12 @@ var FormSection = composable(({ children, label, description, ...props }, forwar
1185
1096
  FormSection.displayName = FORM_SECTION_NAME;
1186
1097
  var FORM_SUBMIT_NAME = "Form.Submit";
1187
1098
  var FormSubmit = ({ classNames, label, icon, disabled }) => {
1188
- const { t } = useTranslation2(translationKey);
1099
+ const { t } = useTranslation2(translationKey2);
1189
1100
  const { form: { canSave, onSave }, readonly, layout } = useFormContext(FORM_SUBMIT_NAME);
1190
1101
  if (readonly || layout === "static") {
1191
1102
  return null;
1192
1103
  }
1193
1104
  return /* @__PURE__ */ React4.createElement("div", {
1194
- role: "none",
1195
1105
  className: mx("flex w-full pt-form-padding", classNames)
1196
1106
  }, /* @__PURE__ */ React4.createElement(IconButton, {
1197
1107
  classNames: "w-full",
@@ -1218,7 +1128,7 @@ var Form = {
1218
1128
 
1219
1129
  // src/components/Form/fields/ArrayField.tsx
1220
1130
  var ArrayField = ({ type, path, label, readonly, layout, fieldProps: inputProps, ...props }) => {
1221
- const { t } = useTranslation3(translationKey);
1131
+ const { t } = useTranslation3(translationKey3);
1222
1132
  const elementType = getArrayElementType2(type);
1223
1133
  const { onValueChange } = inputProps;
1224
1134
  const values = useFormValues(ArrayField.displayName, path, () => []);
@@ -1263,11 +1173,9 @@ var ArrayField = ({ type, path, label, readonly, layout, fieldProps: inputProps,
1263
1173
  label,
1264
1174
  asChild: true
1265
1175
  }), /* @__PURE__ */ React5.createElement("div", {
1266
- role: "none",
1267
1176
  className: "flex flex-col gap-form-gap"
1268
1177
  }, values?.map((_, index) => {
1269
1178
  return /* @__PURE__ */ React5.createElement("div", {
1270
- role: "none",
1271
1179
  key: index,
1272
1180
  className: "grid grid-cols-[1fr_min-content] gap-form-gap last:mb-form-gap items-center"
1273
1181
  }, /* @__PURE__ */ React5.createElement(FormField, {
@@ -1281,10 +1189,8 @@ var ArrayField = ({ type, path, label, readonly, layout, fieldProps: inputProps,
1281
1189
  layout: "inline",
1282
1190
  ...props
1283
1191
  }), !readonly && layout !== "static" && /* @__PURE__ */ React5.createElement("div", {
1284
- role: "none",
1285
1192
  className: "flex flex-col h-full justify-end"
1286
1193
  }, /* @__PURE__ */ React5.createElement("div", {
1287
- role: "none",
1288
1194
  className: "flex items-center h-[2rem]"
1289
1195
  }, /* @__PURE__ */ React5.createElement(IconButton2, {
1290
1196
  icon: "ph--x--regular",
@@ -1348,8 +1254,9 @@ import React7, { useCallback as useCallback5, useEffect as useEffect3, useMemo a
1348
1254
  import { GeoLocation as GeoLocation3 } from "@dxos/echo/internal";
1349
1255
  import { Input as Input3, useTranslation as useTranslation4 } from "@dxos/react-ui";
1350
1256
  import { safeParseFloat } from "@dxos/util";
1257
+ import { translationKey as translationKey4 } from "#translations";
1351
1258
  var GeoPointField = ({ type, label, readonly, layout, getStatus, getValue, onValueChange, onBlur }) => {
1352
- const { t } = useTranslation4(translationKey);
1259
+ const { t } = useTranslation4(translationKey4);
1353
1260
  const { status, error } = getStatus();
1354
1261
  const geoPoint = useMemo5(() => getValue() ?? [
1355
1262
  0,
@@ -1403,7 +1310,6 @@ var GeoPointField = ({ type, label, readonly, layout, getStatus, getValue, onVal
1403
1310
  label,
1404
1311
  asChild: true
1405
1312
  }), layout === "static" ? /* @__PURE__ */ React7.createElement(LatLng, value3) : /* @__PURE__ */ React7.createElement("div", {
1406
- role: "none",
1407
1313
  className: "grid grid-cols-2 gap-form-gap"
1408
1314
  }, /* @__PURE__ */ React7.createElement("div", null, /* @__PURE__ */ React7.createElement(Input3.Root, null, layout !== "inline" && /* @__PURE__ */ React7.createElement(Input3.Label, null, t("latitude.label")), /* @__PURE__ */ React7.createElement(Input3.TextInput, {
1409
1315
  type: "number",
@@ -1449,6 +1355,7 @@ import { Button, Icon as Icon2, Input as Input4, useTranslation as useTranslatio
1449
1355
  import { Editor, useBasicMarkdownExtensions } from "@dxos/react-ui-editor";
1450
1356
  import { Text } from "@dxos/schema";
1451
1357
  import { createDataExtensions } from "@dxos/ui-editor";
1358
+ import { translationKey as translationKey5 } from "#translations";
1452
1359
  var editorClassNames = "transition-colors bg-input-surface focus-within:bg-focus-surface border border-separator rounded-xs p-1 px-2";
1453
1360
  var MarkdownField = ({ type, readonly, label, placeholder, layout, db, getStatus, getValue, onValueChange }) => {
1454
1361
  const { status, error } = getStatus();
@@ -1554,7 +1461,7 @@ var StringMarkdownEditor = ({ value: value3, placeholder, readonly, onChange })
1554
1461
  }));
1555
1462
  };
1556
1463
  var CreateTextButton = ({ db, disabled, onCreate }) => {
1557
- const { t } = useTranslation5(translationKey);
1464
+ const { t } = useTranslation5(translationKey5);
1558
1465
  const handleClick = useCallback6(() => {
1559
1466
  if (!db) {
1560
1467
  return;
@@ -1609,16 +1516,19 @@ import { DXN } from "@dxos/keys";
1609
1516
  import { DxAnchor } from "@dxos/lit-ui/react";
1610
1517
  import { Button as Button2, Icon as Icon3, Input as Input6, useTranslation as useTranslation7 } from "@dxos/react-ui";
1611
1518
  import { ParentLabelAnnotationId } from "@dxos/schema";
1519
+ import { translationKey as translationKey7 } from "#translations";
1612
1520
 
1613
1521
  // src/components/ObjectPicker/ObjectPicker.tsx
1614
1522
  import React10, { forwardRef, useCallback as useCallback8, useState as useState3 } from "react";
1615
1523
  import { Popover, useTranslation as useTranslation6 } from "@dxos/react-ui";
1616
- import { Combobox, useSearchListInput, useSearchListResults } from "@dxos/react-ui-search";
1524
+ import { Combobox } from "@dxos/react-ui-list";
1525
+ import { useSearchListResults } from "@dxos/react-ui-search";
1526
+ import { translationKey as translationKey6 } from "#translations";
1617
1527
  var ObjectPickerContent = /* @__PURE__ */ forwardRef(({ options, selectedIds, createSchema, createOptionLabel, createOptionIcon, createInitialValuePath, createFieldMap: createFieldMap3, onSelect, onCreate, ...props }, forwardedRef) => {
1618
- const { t } = useTranslation6(translationKey);
1528
+ const { t } = useTranslation6(translationKey6);
1619
1529
  const [showForm, setShowForm] = useState3(false);
1620
1530
  const [formInitialValue, setFormInitialValue] = useState3("");
1621
- const { results, handleSearch } = useSearchListResults({
1531
+ const { results, query, handleSearch } = useSearchListResults({
1622
1532
  items: options
1623
1533
  });
1624
1534
  const handleFormSave = useCallback8(async (values) => {
@@ -1647,7 +1557,6 @@ var ObjectPickerContent = /* @__PURE__ */ forwardRef(({ options, selectedIds, cr
1647
1557
  if (showForm && createSchema) {
1648
1558
  return /* @__PURE__ */ React10.createElement(Combobox.Content, {
1649
1559
  ...props,
1650
- onSearch: handleSearch,
1651
1560
  onKeyDownCapture: handleKeyDown,
1652
1561
  ref: forwardedRef
1653
1562
  }, /* @__PURE__ */ React10.createElement(Popover.Viewport, null, /* @__PURE__ */ React10.createElement(Form.Root, {
@@ -1663,12 +1572,13 @@ var ObjectPickerContent = /* @__PURE__ */ forwardRef(({ options, selectedIds, cr
1663
1572
  }
1664
1573
  return /* @__PURE__ */ React10.createElement(Combobox.Content, {
1665
1574
  ...props,
1666
- onSearch: handleSearch,
1667
1575
  onKeyDownCapture: handleKeyDown,
1668
1576
  ref: forwardedRef
1669
1577
  }, /* @__PURE__ */ React10.createElement(Combobox.Input, {
1670
1578
  placeholder: t("ref-field-combobox-input.placeholder"),
1671
- autoFocus: true
1579
+ autoFocus: true,
1580
+ value: query,
1581
+ onValueChange: handleSearch
1672
1582
  }), /* @__PURE__ */ React10.createElement(Combobox.List, null, results.map((option) => /* @__PURE__ */ React10.createElement(Combobox.Item, {
1673
1583
  key: option.id,
1674
1584
  value: option.id,
@@ -1677,17 +1587,17 @@ var ObjectPickerContent = /* @__PURE__ */ forwardRef(({ options, selectedIds, cr
1677
1587
  onSelect: () => onSelect(option.id),
1678
1588
  classNames: "flex items-center gap-2"
1679
1589
  })), createSchema && onCreate && /* @__PURE__ */ React10.createElement(CreateItem, {
1590
+ query,
1680
1591
  createOptionLabel,
1681
1592
  createOptionIcon: createOptionIcon ?? "ph--plus--regular",
1682
- onCreateItemSelect: (query) => {
1683
- setFormInitialValue(query);
1593
+ onCreateItemSelect: (currentQuery) => {
1594
+ setFormInitialValue(currentQuery);
1684
1595
  setShowForm(true);
1685
1596
  }
1686
1597
  })), /* @__PURE__ */ React10.createElement(Combobox.Arrow, null));
1687
1598
  });
1688
- var CreateItem = ({ createOptionLabel, createOptionIcon, onCreateItemSelect }) => {
1689
- const { t } = useTranslation6(translationKey);
1690
- const { query } = useSearchListInput();
1599
+ var CreateItem = ({ query, createOptionLabel, createOptionIcon, onCreateItemSelect }) => {
1600
+ const { t } = useTranslation6(translationKey6);
1691
1601
  const label = createOptionLabel ? t(createOptionLabel[0], {
1692
1602
  ns: createOptionLabel[1].ns,
1693
1603
  text: query
@@ -1728,7 +1638,7 @@ var defaultGetOptions = (results, { parentLabel } = {}) => results.map((result)
1728
1638
  var defaultUseResults = (db, typename) => useQuery(db, typename ? typename === Type.getTypename(Obj2.Unknown) ? Filter.everything() : Filter.typename(typename) : Filter.nothing());
1729
1639
  var RefField = (props) => {
1730
1640
  const { type, readonly, label, placeholder, layout, getStatus, getValue, createOptionLabel, createOptionIcon, createInitialValuePath, createFieldMap: createFieldMap3, db, useSchema = defaultUseSchema, useResults = defaultUseResults, getOptions = defaultGetOptions, onCreate, onValueChange } = props;
1731
- const { t } = useTranslation7(translationKey);
1641
+ const { t } = useTranslation7(translationKey7);
1732
1642
  const { status, error } = getStatus();
1733
1643
  const typename = useMemo7(() => type ? findAnnotation2(type, ReferenceAnnotationId2)?.typename : void 0, [
1734
1644
  type
@@ -1828,7 +1738,6 @@ var RefField = (props) => {
1828
1738
  asChild: true,
1829
1739
  classNames: "p-0"
1830
1740
  }, item ? /* @__PURE__ */ React11.createElement("div", {
1831
- role: "none",
1832
1741
  className: "flex gap-form-gap w-full"
1833
1742
  }, /* @__PURE__ */ React11.createElement(Input6.Root, {
1834
1743
  key: item.id
@@ -1839,7 +1748,6 @@ var RefField = (props) => {
1839
1748
  }))) : /* @__PURE__ */ React11.createElement(Button2, {
1840
1749
  classNames: "w-full text-start gap-form-gap"
1841
1750
  }, /* @__PURE__ */ React11.createElement("div", {
1842
- role: "none",
1843
1751
  className: "grow overflow-hidden"
1844
1752
  }, /* @__PURE__ */ React11.createElement("span", {
1845
1753
  className: "truncate text-description"
@@ -1904,9 +1812,10 @@ import { PublicKey } from "@dxos/keys";
1904
1812
  import { IconButton as IconButton3, Input as Input8, Tag, useTranslation as useTranslation8 } from "@dxos/react-ui";
1905
1813
  import { List } from "@dxos/react-ui-list";
1906
1814
  import { HuePicker } from "@dxos/react-ui-pickers";
1907
- import { hues, osTranslations, subtleHover } from "@dxos/ui-theme";
1815
+ import { hues, osTranslations } from "@dxos/ui-theme";
1816
+ import { translationKey as translationKey8 } from "#translations";
1908
1817
  var SelectOptionField = ({ type, readonly, label, getStatus, getValue, onValueChange }) => {
1909
- const { t } = useTranslation8(translationKey);
1818
+ const { t } = useTranslation8(translationKey8);
1910
1819
  const { status, error } = getStatus();
1911
1820
  const [selected, setSelectedId] = useState5(null);
1912
1821
  const [isNewOption, setIsNewOption] = useState5(false);
@@ -2018,9 +1927,7 @@ var SelectOptionField = ({ type, readonly, label, getStatus, getValue, onValueCh
2018
1927
  error,
2019
1928
  readonly,
2020
1929
  label
2021
- }), /* @__PURE__ */ React13.createElement("div", {
2022
- role: "none"
2023
- }, options && /* @__PURE__ */ React13.createElement(List.Root, {
1930
+ }), /* @__PURE__ */ React13.createElement("div", null, options && /* @__PURE__ */ React13.createElement(List.Root, {
2024
1931
  items: options,
2025
1932
  isItem: (_item) => true,
2026
1933
  onMove: readonly ? void 0 : handleMove,
@@ -2033,10 +1940,7 @@ var SelectOptionField = ({ type, readonly, label, getStatus, getValue, onValueCh
2033
1940
  }, /* @__PURE__ */ React13.createElement(List.Item, {
2034
1941
  role: "button",
2035
1942
  item,
2036
- classNames: [
2037
- subtleHover,
2038
- "flex flex-col cursor-pointer rounded-xs"
2039
- ],
1943
+ classNames: "flex flex-col cursor-pointer rounded-xs dx-hover",
2040
1944
  "aria-expanded": selected === item.id
2041
1945
  }, /* @__PURE__ */ React13.createElement("div", {
2042
1946
  className: "flex items-center"
@@ -2050,7 +1954,7 @@ var SelectOptionField = ({ type, readonly, label, getStatus, getValue, onValueCh
2050
1954
  }, item.title || "\u200B")), /* @__PURE__ */ React13.createElement(IconButton3, {
2051
1955
  iconOnly: true,
2052
1956
  variant: "ghost",
2053
- label: t(selected === item.id ? "collapse label" : "expand label", {
1957
+ label: t(selected === item.id ? "collapse.label" : "expand.label", {
2054
1958
  ns: osTranslations
2055
1959
  }),
2056
1960
  icon: selected === item.id ? "ph--caret-down--regular" : "ph--caret-right--regular",
@@ -2171,7 +2075,7 @@ var TupleField = ({ binding, type, readonly, label, getStatus, getValue, onValue
2171
2075
  // src/components/FieldEditor/FieldEditor.tsx
2172
2076
  var __dxlog_file2 = "/__w/dxos/dxos/packages/ui/react-ui-form/src/components/FieldEditor/FieldEditor.tsx";
2173
2077
  var FieldEditor = ({ readonly, projection, field, registry, view, onSave, onCancel }) => {
2174
- const { t } = useTranslation9(translationKey);
2078
+ const { t } = useTranslation9(translationKey9);
2175
2079
  const [props, setProps] = useState6(projection.getFieldProjection(field.id).props);
2176
2080
  useEffect5(() => setProps(projection.getFieldProjection(field.id).props), [
2177
2081
  field,
@@ -2280,7 +2184,7 @@ var FieldEditor = ({ readonly, projection, field, registry, view, onSave, onCanc
2280
2184
  ]);
2281
2185
  const handleSave = useCallback14((props2) => {
2282
2186
  if (view) {
2283
- Obj3.change(view, () => {
2187
+ Obj3.update(view, () => {
2284
2188
  projection.setFieldProjection({
2285
2189
  field,
2286
2190
  props: props2
@@ -2308,12 +2212,7 @@ var FieldEditor = ({ readonly, projection, field, registry, view, onSave, onCanc
2308
2212
  if (!fieldSchema) {
2309
2213
  log2.warn("invalid format", {
2310
2214
  props
2311
- }, {
2312
- F: __dxlog_file2,
2313
- L: 172,
2314
- S: void 0,
2315
- C: (f, a) => f(...a)
2316
- });
2215
+ }, { "~LogMeta": "~LogMeta", F: __dxlog_file2, L: 156, S: void 0 });
2317
2216
  return null;
2318
2217
  }
2319
2218
  return /* @__PURE__ */ React17.createElement(Form.Root, {
@@ -2343,6 +2242,7 @@ import { splitJsonPath } from "@dxos/echo/internal";
2343
2242
  import { invariant } from "@dxos/invariant";
2344
2243
  import { HuePicker as HuePicker2 } from "@dxos/react-ui-pickers";
2345
2244
  import { isNonNullable } from "@dxos/util";
2245
+ import { translationKey as translationKey10 } from "#translations";
2346
2246
  var __dxlog_file3 = "/__w/dxos/dxos/packages/ui/react-ui-form/src/components/ObjectForm/ObjectForm.tsx";
2347
2247
  var createFieldMap = {
2348
2248
  hue: ({ type, label, layout, getValue, onValueChange }) => {
@@ -2380,27 +2280,11 @@ var ObjectForm = ({ object, schema }) => {
2380
2280
  schema
2381
2281
  ]);
2382
2282
  const handleCreate = useCallback15((schema2, values2) => {
2383
- invariant(db, void 0, {
2384
- F: __dxlog_file3,
2385
- L: 51,
2386
- S: void 0,
2387
- A: [
2388
- "db",
2389
- ""
2390
- ]
2391
- });
2392
- invariant(Type2.isObjectSchema(schema2), void 0, {
2393
- F: __dxlog_file3,
2394
- L: 52,
2395
- S: void 0,
2396
- A: [
2397
- "Type.isObjectSchema(schema)",
2398
- ""
2399
- ]
2400
- });
2283
+ invariant(db, void 0, { "~LogMeta": "~LogMeta", F: __dxlog_file3, L: 49, S: void 0, A: ["db", ""] });
2284
+ invariant(Type2.isObjectSchema(schema2), void 0, { "~LogMeta": "~LogMeta", F: __dxlog_file3, L: 50, S: void 0, A: ["Type.isObjectSchema(schema)", ""] });
2401
2285
  const newObject = db.add(Obj4.make(schema2, values2));
2402
2286
  if (Obj4.instanceOf(Tag2.Tag, newObject)) {
2403
- Obj4.change(object, (object2) => {
2287
+ Obj4.update(object, (object2) => {
2404
2288
  Obj4.getMeta(object2).tags = [
2405
2289
  ...Obj4.getMeta(object2).tags ?? [],
2406
2290
  Obj4.getDXN(newObject).toString()
@@ -2415,13 +2299,13 @@ var ObjectForm = ({ object, schema }) => {
2415
2299
  const changedPaths = Object.keys(changed).filter((path) => changed[path]);
2416
2300
  const hasTagsChange = changedPaths.some((path) => splitJsonPath(path)[0] === "tags");
2417
2301
  if (hasTagsChange) {
2418
- Obj4.change(object, (object2) => {
2302
+ Obj4.update(object, (object2) => {
2419
2303
  Obj4.getMeta(object2).tags = tags2?.map((tag) => tag.dxn.toString()) ?? [];
2420
2304
  });
2421
2305
  }
2422
2306
  const nonTagPaths = changedPaths.filter((path) => splitJsonPath(path)[0] !== "tags");
2423
2307
  if (nonTagPaths.length > 0) {
2424
- Obj4.change(object, () => {
2308
+ Obj4.update(object, () => {
2425
2309
  for (const path of nonTagPaths) {
2426
2310
  const parts = splitJsonPath(path);
2427
2311
  const value3 = Obj4.getValue(values2, parts);
@@ -2440,7 +2324,7 @@ var ObjectForm = ({ object, schema }) => {
2440
2324
  createOptionLabel: [
2441
2325
  "add-tag.label",
2442
2326
  {
2443
- ns: translationKey
2327
+ ns: translationKey10
2444
2328
  }
2445
2329
  ],
2446
2330
  createInitialValuePath: "label",
@@ -2463,6 +2347,7 @@ import { HuePicker as HuePicker3 } from "@dxos/react-ui-pickers";
2463
2347
  import { FactoryAnnotation } from "@dxos/schema";
2464
2348
  import { composable as composable2, composableProps as composableProps2 } from "@dxos/ui-theme";
2465
2349
  import { isNonNullable as isNonNullable2 } from "@dxos/util";
2350
+ import { translationKey as translationKey11 } from "#translations";
2466
2351
  var __dxlog_file4 = "/__w/dxos/dxos/packages/ui/react-ui-form/src/components/ObjectProperties/ObjectProperties.tsx";
2467
2352
  var ObjectProperties = composable2(({ children, object, ...props }, forwardedRef) => {
2468
2353
  const db = Obj5.getDatabase(object);
@@ -2481,24 +2366,8 @@ var ObjectProperties = composable2(({ children, object, ...props }, forwardedRef
2481
2366
  object
2482
2367
  ]);
2483
2368
  const handleCreate = useCallback16((schema, values2) => {
2484
- invariant2(db, void 0, {
2485
- F: __dxlog_file4,
2486
- L: 52,
2487
- S: void 0,
2488
- A: [
2489
- "db",
2490
- ""
2491
- ]
2492
- });
2493
- invariant2(Type3.isObjectSchema(schema), void 0, {
2494
- F: __dxlog_file4,
2495
- L: 53,
2496
- S: void 0,
2497
- A: [
2498
- "Type.isObjectSchema(schema)",
2499
- ""
2500
- ]
2501
- });
2369
+ invariant2(db, void 0, { "~LogMeta": "~LogMeta", F: __dxlog_file4, L: 45, S: void 0, A: ["db", ""] });
2370
+ invariant2(Type3.isObjectSchema(schema), void 0, { "~LogMeta": "~LogMeta", F: __dxlog_file4, L: 46, S: void 0, A: ["Type.isObjectSchema(schema)", ""] });
2502
2371
  const factory = Option5.getOrUndefined(FactoryAnnotation.get(schema));
2503
2372
  const newObject = factory ? factory(values2) : Obj5.make(schema, values2);
2504
2373
  return db.add(newObject);
@@ -2512,13 +2381,13 @@ var ObjectProperties = composable2(({ children, object, ...props }, forwardedRef
2512
2381
  const changedPaths = Object.keys(changed).filter((path) => changed[path]);
2513
2382
  const hasTagsChange = changedPaths.some((path) => splitJsonPath2(path)[0] === "tags");
2514
2383
  if (hasTagsChange) {
2515
- Obj5.change(object, (object2) => {
2384
+ Obj5.update(object, (object2) => {
2516
2385
  Obj5.getMeta(object2).tags = tags2?.map((tag) => tag.dxn.toString()) ?? [];
2517
2386
  });
2518
2387
  }
2519
2388
  const nonTagPaths = changedPaths.filter((path) => splitJsonPath2(path)[0] !== "tags");
2520
2389
  if (nonTagPaths.length > 0) {
2521
- Obj5.change(object, () => {
2390
+ Obj5.update(object, () => {
2522
2391
  for (const path of nonTagPaths) {
2523
2392
  const parts = splitJsonPath2(path);
2524
2393
  const value3 = Obj5.getValue(values2, parts);
@@ -2540,7 +2409,7 @@ var ObjectProperties = composable2(({ children, object, ...props }, forwardedRef
2540
2409
  createOptionLabel: [
2541
2410
  "add-tag.label",
2542
2411
  {
2543
- ns: translationKey
2412
+ ns: translationKey11
2544
2413
  }
2545
2414
  ],
2546
2415
  createInitialValuePath: "label",
@@ -2580,6 +2449,7 @@ var BaseSchema = Schema4.Struct({
2580
2449
  import React22 from "react";
2581
2450
  import { ScrollArea as ScrollArea2, toLocalizedString as toLocalizedString2, useTranslation as useTranslation11 } from "@dxos/react-ui";
2582
2451
  import { composable as composable3, composableProps as composableProps3, mx as mx4 } from "@dxos/ui-theme";
2452
+ import { translationKey as translationKey13 } from "#translations";
2583
2453
 
2584
2454
  // src/components/Settings/SettingsFieldSet.tsx
2585
2455
  import * as SchemaAST5 from "effect/SchemaAST";
@@ -2592,32 +2462,31 @@ import { Input as Input13, Select as Select2 } from "@dxos/react-ui";
2592
2462
  import React20 from "react";
2593
2463
  import { Input as Input12, toLocalizedString, useTranslation as useTranslation10 } from "@dxos/react-ui";
2594
2464
  import { mx as mx3 } from "@dxos/ui-theme";
2465
+ import { translationKey as translationKey12 } from "#translations";
2595
2466
  var SETTINGS_PANEL_NAME = "Settings.Panel";
2596
2467
  var SETTINGS_ITEM_NAME = "Settings.Item";
2597
2468
  var SettingsPanel = ({ classNames, children }) => {
2598
2469
  return /* @__PURE__ */ React20.createElement("div", {
2599
- role: "none",
2600
2470
  className: mx3("flex flex-col gap-3 p-trim-md border border-separator rounded-sm", classNames)
2601
2471
  }, children);
2602
2472
  };
2603
2473
  SettingsPanel.displayName = SETTINGS_PANEL_NAME;
2604
2474
  var SettingsItem = ({ title, description = "", children }) => {
2605
- const { t } = useTranslation10(translationKey);
2475
+ const { t } = useTranslation10(translationKey12);
2606
2476
  return /* @__PURE__ */ React20.createElement(Input12.Root, null, /* @__PURE__ */ React20.createElement(SettingsPanel, {
2607
2477
  classNames: "grid grid-cols-1 md:grid-cols-[1fr_1fr] gap-x-trim-lg gap-y-0"
2608
2478
  }, /* @__PURE__ */ React20.createElement(Input12.Label, {
2609
- classNames: "pb-trim-md text-base-surface-text text-lg md:col-span-2"
2479
+ classNames: "pb-trim-md text-base-foreground text-lg md:col-span-2"
2610
2480
  }, toLocalizedString(title, t)), /* @__PURE__ */ React20.createElement(Input12.DescriptionAndValidation, null, /* @__PURE__ */ React20.createElement(Input12.Description, {
2611
2481
  classNames: "text-base text-description"
2612
2482
  }, toLocalizedString(description, t))), /* @__PURE__ */ React20.createElement("div", {
2613
- role: "none",
2614
2483
  className: "text-end py-1"
2615
2484
  }, children)));
2616
2485
  };
2617
2486
  SettingsItem.displayName = SETTINGS_ITEM_NAME;
2618
2487
 
2619
2488
  // src/components/Settings/SettingsFieldSet.tsx
2620
- var SettingsFieldSet = ({ schema, values, onValuesChanged, readonly, fieldMap, visible, sort }) => {
2489
+ var SettingsFieldSet = ({ schema, values, onValuesChanged, readonly, fieldMap, visible, sort, pathPrefix = "" }) => {
2621
2490
  const properties = useMemo11(() => {
2622
2491
  const props = getFormProperties(schema.ast);
2623
2492
  if (!sort) {
@@ -2645,21 +2514,27 @@ var SettingsFieldSet = ({ schema, values, onValuesChanged, readonly, fieldMap, v
2645
2514
  ]);
2646
2515
  return /* @__PURE__ */ React21.createElement(React21.Fragment, null, properties.map((property) => {
2647
2516
  const name = property.name.toString();
2648
- if (visible && !visible(name, values)) {
2517
+ const path = pathPrefix ? `${pathPrefix}.${name}` : name;
2518
+ if (visible && !visible(path, values)) {
2649
2519
  return null;
2650
2520
  }
2521
+ const entry = fieldMap?.[name];
2651
2522
  return /* @__PURE__ */ React21.createElement(SettingsFieldItem, {
2652
2523
  key: name,
2524
+ path,
2653
2525
  property,
2654
2526
  value: values[name],
2655
2527
  onChange: (value3) => handleChange(name, value3),
2656
2528
  readonly,
2657
- customField: fieldMap?.[name]
2529
+ customField: typeof entry === "function" ? entry : void 0,
2530
+ nestedFieldMap: typeof entry === "object" ? entry : void 0,
2531
+ visible,
2532
+ sort
2658
2533
  });
2659
2534
  }));
2660
2535
  };
2661
2536
  SettingsFieldSet.displayName = "Settings.FieldSet";
2662
- var SettingsFieldItem = ({ property, value: value3, onChange, readonly, customField }) => {
2537
+ var SettingsFieldItem = ({ property, path, value: value3, onChange, readonly, customField, nestedFieldMap, visible, sort }) => {
2663
2538
  const { type } = property;
2664
2539
  const name = property.name.toString();
2665
2540
  const title = getAnnotation3(SchemaAST5.TitleAnnotationId)(type) ?? String3.capitalize(name);
@@ -2677,6 +2552,19 @@ var SettingsFieldItem = ({ property, value: value3, onChange, readonly, customFi
2677
2552
  }
2678
2553
  const fieldType = detectFieldType(type);
2679
2554
  switch (fieldType) {
2555
+ case "struct":
2556
+ return /* @__PURE__ */ React21.createElement(SettingsFieldSet, {
2557
+ schema: {
2558
+ ast: type
2559
+ },
2560
+ values: value3 ?? {},
2561
+ onValuesChanged: onChange,
2562
+ readonly,
2563
+ fieldMap: nestedFieldMap,
2564
+ visible,
2565
+ sort,
2566
+ pathPrefix: path
2567
+ });
2680
2568
  case "boolean":
2681
2569
  return /* @__PURE__ */ React21.createElement(SettingsItem, {
2682
2570
  title,
@@ -2756,13 +2644,12 @@ var SettingsViewport = composable3(({ children, ...props }, forwardedRef) => {
2756
2644
  }, /* @__PURE__ */ React22.createElement(ScrollArea2.Viewport, {
2757
2645
  classNames: "px-4 pointer-coarse:px-2"
2758
2646
  }, /* @__PURE__ */ React22.createElement("div", {
2759
- role: "none",
2760
2647
  className: "dx-document flex flex-col gap-2 py-4"
2761
2648
  }, children)));
2762
2649
  });
2763
2650
  SettingsViewport.displayName = SETTINGS_VIEWPORT_NAME;
2764
2651
  var SettingsSection = ({ title, description, children }) => {
2765
- const { t } = useTranslation11(translationKey);
2652
+ const { t } = useTranslation11(translationKey13);
2766
2653
  return /* @__PURE__ */ React22.createElement(React22.Fragment, null, /* @__PURE__ */ React22.createElement("h2", {
2767
2654
  className: "px-trim-md mt-trim-md text-xl"
2768
2655
  }, toLocalizedString2(title, t)), description && /* @__PURE__ */ React22.createElement("p", {
@@ -2781,15 +2668,38 @@ var Settings = {
2781
2668
  FieldSet: SettingsFieldSet
2782
2669
  };
2783
2670
 
2671
+ // src/components/Settings/SettingsSelectField.tsx
2672
+ import React23 from "react";
2673
+ import { Select as Select3 } from "@dxos/react-ui";
2674
+ var createSelectField = ({ options, defaultLabel = "Default" }) => {
2675
+ const normalized = options.map((option) => typeof option === "string" ? {
2676
+ value: option,
2677
+ label: option
2678
+ } : option);
2679
+ const hasDefault = defaultLabel !== null;
2680
+ const sentinel = hasDefault ? `__default__${Math.random().toString(36).slice(2)}` : "";
2681
+ return ({ value: value3, onChange, readonly }) => /* @__PURE__ */ React23.createElement(Select3.Root, {
2682
+ disabled: readonly,
2683
+ value: value3 ?? sentinel,
2684
+ onValueChange: (next) => onChange(hasDefault && next === sentinel ? void 0 : next)
2685
+ }, /* @__PURE__ */ React23.createElement(Select3.TriggerButton, {
2686
+ disabled: readonly
2687
+ }), /* @__PURE__ */ React23.createElement(Select3.Portal, null, /* @__PURE__ */ React23.createElement(Select3.Content, null, /* @__PURE__ */ React23.createElement(Select3.Viewport, null, hasDefault && /* @__PURE__ */ React23.createElement(Select3.Option, {
2688
+ value: sentinel
2689
+ }, defaultLabel), normalized.map((option) => /* @__PURE__ */ React23.createElement(Select3.Option, {
2690
+ key: option.value,
2691
+ value: option.value
2692
+ }, option.label ?? option.value))), /* @__PURE__ */ React23.createElement(Select3.Arrow, null))));
2693
+ };
2694
+
2784
2695
  // src/components/ViewEditor/ViewEditor.tsx
2785
2696
  import { RegistryContext } from "@effect-atom/atom-react";
2786
2697
  import * as Array4 from "effect/Array";
2787
2698
  import * as Match2 from "effect/Match";
2788
2699
  import * as Option6 from "effect/Option";
2789
2700
  import * as Schema5 from "effect/Schema";
2790
- import React23, { forwardRef as forwardRef2, useCallback as useCallback18, useContext, useImperativeHandle, useMemo as useMemo12, useState as useState7 } from "react";
2791
- import { Entity as Entity2, Feed, Filter as Filter2, Format as Format5, Obj as Obj6, Query, QueryAST, Ref as Ref6 } from "@dxos/echo";
2792
- import { View } from "@dxos/echo";
2701
+ import React24, { forwardRef as forwardRef2, useCallback as useCallback18, useContext, useImperativeHandle, useMemo as useMemo12, useState as useState7 } from "react";
2702
+ import { Entity as Entity2, Feed, Filter as Filter2, Format as Format5, Obj as Obj6, Query, QueryAST, Ref as Ref6, View } from "@dxos/echo";
2793
2703
  import { EchoSchema, isMutable, toJsonSchema } from "@dxos/echo/internal";
2794
2704
  import { invariant as invariant3 } from "@dxos/invariant";
2795
2705
  import { useObject, useQuery as useQuery2 } from "@dxos/react-client/echo";
@@ -2797,12 +2707,13 @@ import { IconButton as IconButton4, Input as Input14, Message, useTranslation as
2797
2707
  import { QueryForm } from "@dxos/react-ui-components";
2798
2708
  import { List as List2 } from "@dxos/react-ui-list";
2799
2709
  import { ParentLabelAnnotation, ProjectionModel, VIEW_FIELD_LIMIT, createEchoChangeCallback, getTypenameFromQuery } from "@dxos/schema";
2800
- import { mx as mx5, osTranslations as osTranslations2, subtleHover as subtleHover2 } from "@dxos/ui-theme";
2710
+ import { mx as mx5, osTranslations as osTranslations2 } from "@dxos/ui-theme";
2711
+ import { translationKey as translationKey14 } from "#translations";
2801
2712
  var __dxlog_file5 = "/__w/dxos/dxos/packages/ui/react-ui-form/src/components/ViewEditor/ViewEditor.tsx";
2802
2713
  var ViewEditor = /* @__PURE__ */ forwardRef2(({ classNames, schema, view, mode = "schema", registry, db, readonly, showHeading = false, types, tags, onQueryChanged, onDelete }, forwardedRef) => {
2803
2714
  const atomRegistry = useContext(RegistryContext);
2804
2715
  const schemaReadonly = !isMutable(schema);
2805
- const { t } = useTranslation12(translationKey);
2716
+ const { t } = useTranslation12(translationKey14);
2806
2717
  const projectionModel = useMemo12(() => {
2807
2718
  const jsonSchema = schema instanceof EchoSchema ? schema.jsonSchema : toJsonSchema(schema);
2808
2719
  const change = createEchoChangeCallback(view, schema instanceof EchoSchema ? schema : void 0);
@@ -2827,7 +2738,7 @@ var ViewEditor = /* @__PURE__ */ forwardRef2(({ classNames, schema, view, mode =
2827
2738
  if (from._tag !== "scope") {
2828
2739
  return void 0;
2829
2740
  }
2830
- return Option6.fromNullable(from.scope.queues).pipe(Option6.flatMap((queues) => Array4.head(queues)), Option6.map(String), Option6.getOrUndefined);
2741
+ return Option6.fromNullable(from.scope.feeds).pipe(Option6.flatMap((feeds2) => Array4.head(feeds2)), Option6.map(String), Option6.getOrUndefined);
2831
2742
  }), Match2.orElse(() => void 0));
2832
2743
  const feeds = useQuery2(db, Filter2.type(Feed.Feed));
2833
2744
  const targetRef = useMemo12(() => {
@@ -2879,52 +2790,43 @@ var ViewEditor = /* @__PURE__ */ forwardRef2(({ classNames, schema, view, mode =
2879
2790
  ]);
2880
2791
  const handleUpdate = useCallback18((values) => {
2881
2792
  const targetValue = values.target;
2882
- let queueDxn;
2793
+ let feedDXN;
2883
2794
  if (Ref6.isRef(targetValue)) {
2884
- const feedDxn = targetValue.dxn.toString();
2885
- const feed = feeds.find((feed2) => Obj6.getDXN(feed2).toString() === feedDxn);
2795
+ const targetDXN = targetValue.dxn.toString();
2796
+ const feed = feeds.find((feed2) => Obj6.getDXN(feed2).toString() === targetDXN);
2886
2797
  if (feed) {
2887
- queueDxn = Feed.getQueueDxn(feed)?.toString();
2798
+ feedDXN = Feed.getQueueDxn(feed)?.toString();
2888
2799
  }
2889
2800
  }
2890
2801
  const query = mode === "schema" ? Query.select(Filter2.typename(values.query)).ast : JSON.parse(JSON.stringify(values.query));
2891
- onQueryChanged?.(query, queueDxn);
2802
+ onQueryChanged?.(query, feedDXN);
2892
2803
  }, [
2893
2804
  onQueryChanged,
2894
2805
  mode,
2895
2806
  feeds
2896
2807
  ]);
2897
2808
  const handleDelete = useCallback18((fieldId) => {
2898
- invariant3(!readonly, void 0, {
2899
- F: __dxlog_file5,
2900
- L: 185,
2901
- S: void 0,
2902
- A: [
2903
- "!readonly",
2904
- ""
2905
- ]
2906
- });
2809
+ invariant3(!readonly, void 0, { "~LogMeta": "~LogMeta", F: __dxlog_file5, L: 126, S: void 0, A: ["!readonly", ""] });
2907
2810
  onDelete?.(fieldId);
2908
2811
  }, [
2909
2812
  onDelete,
2910
2813
  readonly
2911
2814
  ]);
2912
- return /* @__PURE__ */ React23.createElement("div", {
2913
- role: "none",
2815
+ return /* @__PURE__ */ React24.createElement("div", {
2914
2816
  className: mx5(classNames)
2915
- }, schemaReadonly && !readonly && /* @__PURE__ */ React23.createElement(Message.Root, {
2817
+ }, schemaReadonly && !readonly && /* @__PURE__ */ React24.createElement(Message.Root, {
2916
2818
  valence: "info",
2917
2819
  classNames: "my-form-padding"
2918
- }, /* @__PURE__ */ React23.createElement(Message.Title, null, t("system-schema.description"))), /* @__PURE__ */ React23.createElement(Form.Root, {
2820
+ }, /* @__PURE__ */ React24.createElement(Message.Title, null, t("system-schema.description"))), /* @__PURE__ */ React24.createElement(Form.Root, {
2919
2821
  schema: viewSchema,
2920
2822
  values: viewValues,
2921
2823
  fieldMap,
2922
2824
  db,
2923
2825
  onValuesChanged: handleUpdate
2924
- }, /* @__PURE__ */ React23.createElement(Form.FieldSet, null), /* @__PURE__ */ React23.createElement(FormFieldLabel, {
2826
+ }, /* @__PURE__ */ React24.createElement(Form.FieldSet, null), /* @__PURE__ */ React24.createElement(FormFieldLabel, {
2925
2827
  label: t("fields.label"),
2926
2828
  asChild: true
2927
- }), /* @__PURE__ */ React23.createElement(FieldList, {
2829
+ }), /* @__PURE__ */ React24.createElement(FieldList, {
2928
2830
  schema,
2929
2831
  view,
2930
2832
  registry,
@@ -2936,7 +2838,7 @@ var ViewEditor = /* @__PURE__ */ forwardRef2(({ classNames, schema, view, mode =
2936
2838
  var FieldList = ({ schema, view, registry, readonly, showHeading = false, onDelete }) => {
2937
2839
  const atomRegistry = useContext(RegistryContext);
2938
2840
  const schemaReadonly = !isMutable(schema);
2939
- const { t } = useTranslation12(translationKey);
2841
+ const { t } = useTranslation12(translationKey14);
2940
2842
  const [viewSnapshot] = useObject(view);
2941
2843
  const projectionModel = useMemo12(() => {
2942
2844
  const jsonSchema = schema instanceof EchoSchema ? schema.jsonSchema : toJsonSchema(schema);
@@ -2955,15 +2857,7 @@ var FieldList = ({ schema, view, registry, readonly, showHeading = false, onDele
2955
2857
  ]);
2956
2858
  const [expandedField, setExpandedField] = useState7();
2957
2859
  const handleAdd = useCallback18(() => {
2958
- invariant3(!readonly, void 0, {
2959
- F: __dxlog_file5,
2960
- L: 250,
2961
- S: void 0,
2962
- A: [
2963
- "!readonly",
2964
- ""
2965
- ]
2966
- });
2860
+ invariant3(!readonly, void 0, { "~LogMeta": "~LogMeta", F: __dxlog_file5, L: 181, S: void 0, A: ["!readonly", ""] });
2967
2861
  const field = projectionModel.createFieldProjection();
2968
2862
  setExpandedField(field.id);
2969
2863
  }, [
@@ -2976,15 +2870,7 @@ var FieldList = ({ schema, view, registry, readonly, showHeading = false, onDele
2976
2870
  readonly
2977
2871
  ]);
2978
2872
  const handleDelete = useCallback18((fieldId) => {
2979
- invariant3(!readonly, void 0, {
2980
- F: __dxlog_file5,
2981
- L: 264,
2982
- S: void 0,
2983
- A: [
2984
- "!readonly",
2985
- ""
2986
- ]
2987
- });
2873
+ invariant3(!readonly, void 0, { "~LogMeta": "~LogMeta", F: __dxlog_file5, L: 194, S: void 0, A: ["!readonly", ""] });
2988
2874
  if (fieldId === expandedField) {
2989
2875
  setExpandedField(void 0);
2990
2876
  }
@@ -2995,16 +2881,8 @@ var FieldList = ({ schema, view, registry, readonly, showHeading = false, onDele
2995
2881
  readonly
2996
2882
  ]);
2997
2883
  const handleMove = useCallback18((fromIndex, toIndex) => {
2998
- invariant3(!readonly, void 0, {
2999
- F: __dxlog_file5,
3000
- L: 276,
3001
- S: void 0,
3002
- A: [
3003
- "!readonly",
3004
- ""
3005
- ]
3006
- });
3007
- Obj6.change(view, (view2) => {
2884
+ invariant3(!readonly, void 0, { "~LogMeta": "~LogMeta", F: __dxlog_file5, L: 205, S: void 0, A: ["!readonly", ""] });
2885
+ Obj6.update(view, (view2) => {
3008
2886
  const fields = [
3009
2887
  ...view2.projection.fields
3010
2888
  ];
@@ -3032,46 +2910,45 @@ var FieldList = ({ schema, view, registry, readonly, showHeading = false, onDele
3032
2910
  if (!viewSnapshot) {
3033
2911
  return null;
3034
2912
  }
3035
- return /* @__PURE__ */ React23.createElement(List2.Root, {
2913
+ return /* @__PURE__ */ React24.createElement(List2.Root, {
3036
2914
  items: viewSnapshot.projection.fields,
3037
2915
  isItem: Schema5.is(View.FieldSchema),
3038
2916
  getId: (field) => field.id,
3039
2917
  onMove: readonly ? void 0 : handleMove,
3040
2918
  readonly
3041
- }, ({ items: fields }) => /* @__PURE__ */ React23.createElement(React23.Fragment, null, showHeading && /* @__PURE__ */ React23.createElement("h3", {
2919
+ }, ({ items: fields }) => /* @__PURE__ */ React24.createElement(React24.Fragment, null, showHeading && /* @__PURE__ */ React24.createElement("h3", {
3042
2920
  className: "text-sm"
3043
- }, t("field-path.label")), /* @__PURE__ */ React23.createElement("div", {
2921
+ }, t("field-path.label")), /* @__PURE__ */ React24.createElement("div", {
3044
2922
  role: "list",
3045
2923
  className: "grid grid-cols-[min-content_1fr_min-content_min-content_min-content]"
3046
2924
  }, fields?.map((field) => {
3047
2925
  const hidden = field.visible === false;
3048
- return /* @__PURE__ */ React23.createElement(List2.Item, {
2926
+ return /* @__PURE__ */ React24.createElement(List2.Item, {
3049
2927
  key: field.id,
3050
2928
  item: field,
3051
2929
  classNames: "grid grid-cols-subgrid col-span-5",
3052
2930
  "aria-expanded": expandedField === field.id
3053
- }, /* @__PURE__ */ React23.createElement("div", {
3054
- role: "none",
3055
- className: mx5(subtleHover2, "grid grid-cols-subgrid col-span-5", "rounded-xs cursor-pointer min-h-10")
3056
- }, /* @__PURE__ */ React23.createElement(List2.ItemDragHandle, {
2931
+ }, /* @__PURE__ */ React24.createElement("div", {
2932
+ className: "grid grid-cols-subgrid col-span-5 rounded-xs cursor-pointer min-h-10 dx-hover"
2933
+ }, /* @__PURE__ */ React24.createElement(List2.ItemDragHandle, {
3057
2934
  disabled: readonly || schemaReadonly
3058
- }), /* @__PURE__ */ React23.createElement(List2.ItemTitle, {
2935
+ }), /* @__PURE__ */ React24.createElement(List2.ItemTitle, {
3059
2936
  classNames: hidden && "text-subdued",
3060
2937
  onClick: () => handleToggleField(field)
3061
- }, field.path), /* @__PURE__ */ React23.createElement(List2.ItemIconButton, {
3062
- label: t(hidden ? "show field label" : "hide field label"),
2938
+ }, field.path), /* @__PURE__ */ React24.createElement(List2.ItemIconButton, {
2939
+ label: t(hidden ? "show-field.label" : "hide-field.label"),
3063
2940
  "data-testid": hidden ? "show-field-button" : "hide-field-button",
3064
2941
  icon: hidden ? "ph--eye-closed--regular" : "ph--eye--regular",
3065
2942
  autoHide: false,
3066
2943
  disabled: readonly || !hidden && projectionModel.getFields().length <= 1,
3067
2944
  onClick: () => hidden ? handleShow(field.path) : handleHide(field.id)
3068
- }), !readonly && /* @__PURE__ */ React23.createElement(React23.Fragment, null, /* @__PURE__ */ React23.createElement(List2.ItemDeleteButton, {
2945
+ }), !readonly && /* @__PURE__ */ React24.createElement(React24.Fragment, null, /* @__PURE__ */ React24.createElement(List2.ItemDeleteButton, {
3069
2946
  label: t("delete-field.label"),
3070
2947
  autoHide: false,
3071
2948
  disabled: readonly || schemaReadonly || viewSnapshot.projection.fields.length <= 1,
3072
2949
  onClick: () => handleDelete(field.id),
3073
2950
  "data-testid": "field.delete"
3074
- }), /* @__PURE__ */ React23.createElement(List2.ItemIconButton, {
2951
+ }), /* @__PURE__ */ React24.createElement(List2.ItemIconButton, {
3075
2952
  iconOnly: true,
3076
2953
  variant: "ghost",
3077
2954
  label: t("toggle-expand.label", {
@@ -3080,20 +2957,18 @@ var FieldList = ({ schema, view, registry, readonly, showHeading = false, onDele
3080
2957
  icon: expandedField === field.id ? "ph--caret-down--regular" : "ph--caret-right--regular",
3081
2958
  onClick: () => handleToggleField(field),
3082
2959
  "data-testid": "field.toggle"
3083
- }))), expandedField === field.id && !readonly && /* @__PURE__ */ React23.createElement("div", {
3084
- role: "none",
2960
+ }))), expandedField === field.id && !readonly && /* @__PURE__ */ React24.createElement("div", {
3085
2961
  className: "col-span-full mt-1 mb-1 border border-separator rounded-md"
3086
- }, /* @__PURE__ */ React23.createElement(FieldEditor, {
2962
+ }, /* @__PURE__ */ React24.createElement(FieldEditor, {
3087
2963
  readonly: readonly || schemaReadonly,
3088
2964
  registry,
3089
2965
  projection: projectionModel,
3090
2966
  field,
3091
2967
  onSave: handleClose
3092
2968
  })));
3093
- })), !readonly && !expandedField && /* @__PURE__ */ React23.createElement("div", {
3094
- role: "none",
2969
+ })), !readonly && !expandedField && /* @__PURE__ */ React24.createElement("div", {
3095
2970
  className: "my-form-padding"
3096
- }, /* @__PURE__ */ React23.createElement(IconButton4, {
2971
+ }, /* @__PURE__ */ React24.createElement(IconButton4, {
3097
2972
  icon: "ph--plus--regular",
3098
2973
  label: t("add-property-button.label"),
3099
2974
  onClick: handleAdd,
@@ -3106,10 +2981,10 @@ var customFields = ({ types, tags }) => ({
3106
2981
  const handleChange = useCallback18((query) => onValueChange(type, query.ast), [
3107
2982
  onValueChange
3108
2983
  ]);
3109
- return /* @__PURE__ */ React23.createElement(Input14.Root, null, /* @__PURE__ */ React23.createElement(FormFieldLabel, {
2984
+ return /* @__PURE__ */ React24.createElement(Input14.Root, null, /* @__PURE__ */ React24.createElement(FormFieldLabel, {
3110
2985
  readonly,
3111
2986
  label
3112
- }), /* @__PURE__ */ React23.createElement(QueryForm, {
2987
+ }), /* @__PURE__ */ React24.createElement(QueryForm, {
3113
2988
  initialQuery: getValue(),
3114
2989
  types,
3115
2990
  tags,
@@ -3140,6 +3015,7 @@ export {
3140
3015
  TupleField,
3141
3016
  ViewEditor,
3142
3017
  cellClassesForFieldType,
3018
+ createSelectField,
3143
3019
  detectFieldType,
3144
3020
  formatForDisplay,
3145
3021
  formatForEditing,
@@ -3151,7 +3027,6 @@ export {
3151
3027
  omitId,
3152
3028
  parseValue,
3153
3029
  pathNotUniqueError,
3154
- translations,
3155
3030
  useFormContext,
3156
3031
  useFormFieldState,
3157
3032
  useFormHandler,