@dxos/react-ui-form 0.8.4-main.ead640a → 0.8.4-main.effb148878

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 (268) hide show
  1. package/LICENSE +102 -5
  2. package/README.md +0 -1
  3. package/dist/lib/browser/index.mjs +3252 -2315
  4. package/dist/lib/browser/index.mjs.map +4 -4
  5. package/dist/lib/browser/meta.json +1 -1
  6. package/dist/lib/browser/translations.mjs +83 -0
  7. package/dist/lib/browser/translations.mjs.map +7 -0
  8. package/dist/lib/node-esm/index.mjs +3252 -2315
  9. package/dist/lib/node-esm/index.mjs.map +4 -4
  10. package/dist/lib/node-esm/meta.json +1 -1
  11. package/dist/lib/node-esm/translations.mjs +85 -0
  12. package/dist/lib/node-esm/translations.mjs.map +7 -0
  13. package/dist/types/src/components/FieldEditor/FieldEditor.d.ts +8 -7
  14. package/dist/types/src/components/FieldEditor/FieldEditor.d.ts.map +1 -1
  15. package/dist/types/src/components/FieldEditor/FieldEditor.stories.d.ts +69 -60
  16. package/dist/types/src/components/FieldEditor/FieldEditor.stories.d.ts.map +1 -1
  17. package/dist/types/src/components/Form/Form.d.ts +123 -26
  18. package/dist/types/src/components/Form/Form.d.ts.map +1 -1
  19. package/dist/types/src/components/Form/Form.stories.d.ts +175 -138
  20. package/dist/types/src/components/Form/Form.stories.d.ts.map +1 -1
  21. package/dist/types/src/components/Form/FormField.d.ts +48 -0
  22. package/dist/types/src/components/Form/FormField.d.ts.map +1 -0
  23. package/dist/types/src/components/Form/FormFieldComponent.d.ts +95 -0
  24. package/dist/types/src/components/Form/FormFieldComponent.d.ts.map +1 -0
  25. package/dist/types/src/components/Form/FormFieldComponent.stories.d.ts +9 -0
  26. package/dist/types/src/components/Form/FormFieldComponent.stories.d.ts.map +1 -0
  27. package/dist/types/src/components/Form/FormFieldSet.d.ts +21 -0
  28. package/dist/types/src/components/Form/FormFieldSet.d.ts.map +1 -0
  29. package/dist/types/src/components/Form/FormTooltipsContext.d.ts +19 -0
  30. package/dist/types/src/components/Form/FormTooltipsContext.d.ts.map +1 -0
  31. package/dist/types/src/components/Form/Layout/FormLayout.d.ts +25 -0
  32. package/dist/types/src/components/Form/Layout/FormLayout.d.ts.map +1 -0
  33. package/dist/types/src/components/Form/Layout/FormLayout.stories.d.ts +116 -0
  34. package/dist/types/src/components/Form/Layout/FormLayout.stories.d.ts.map +1 -0
  35. package/dist/types/src/components/Form/Layout/annotation.d.ts +30 -0
  36. package/dist/types/src/components/Form/Layout/annotation.d.ts.map +1 -0
  37. package/dist/types/src/components/Form/Layout/index.d.ts +4 -0
  38. package/dist/types/src/components/Form/Layout/index.d.ts.map +1 -0
  39. package/dist/types/src/components/Form/Layout/parser.d.ts +31 -0
  40. package/dist/types/src/components/Form/Layout/parser.d.ts.map +1 -0
  41. package/dist/types/src/components/Form/Layout/parser.test.d.ts +2 -0
  42. package/dist/types/src/components/Form/Layout/parser.test.d.ts.map +1 -0
  43. package/dist/types/src/components/Form/fields/ArrayField.d.ts +18 -0
  44. package/dist/types/src/components/Form/fields/ArrayField.d.ts.map +1 -0
  45. package/dist/types/src/components/Form/fields/BooleanField.d.ts +4 -0
  46. package/dist/types/src/components/Form/fields/BooleanField.d.ts.map +1 -0
  47. package/dist/types/src/components/Form/fields/DateField.d.ts +4 -0
  48. package/dist/types/src/components/Form/fields/DateField.d.ts.map +1 -0
  49. package/dist/types/src/components/Form/fields/GeoPointField.d.ts +5 -0
  50. package/dist/types/src/components/Form/fields/GeoPointField.d.ts.map +1 -0
  51. package/dist/types/src/components/Form/fields/MarkdownField.d.ts +11 -0
  52. package/dist/types/src/components/Form/fields/MarkdownField.d.ts.map +1 -0
  53. package/dist/types/src/components/Form/fields/MarkdownField.stories.d.ts +85 -0
  54. package/dist/types/src/components/Form/fields/MarkdownField.stories.d.ts.map +1 -0
  55. package/dist/types/src/components/Form/fields/NumberField.d.ts +4 -0
  56. package/dist/types/src/components/Form/fields/NumberField.d.ts.map +1 -0
  57. package/dist/types/src/components/Form/fields/RefField.d.ts +22 -0
  58. package/dist/types/src/components/Form/fields/RefField.d.ts.map +1 -0
  59. package/dist/types/src/components/Form/fields/SelectField.d.ts +13 -0
  60. package/dist/types/src/components/Form/fields/SelectField.d.ts.map +1 -0
  61. package/dist/types/src/components/Form/fields/SelectOptionField.d.ts +5 -0
  62. package/dist/types/src/components/Form/fields/SelectOptionField.d.ts.map +1 -0
  63. package/dist/types/src/components/Form/fields/SelectOptionField.stories.d.ts +85 -0
  64. package/dist/types/src/components/Form/fields/SelectOptionField.stories.d.ts.map +1 -0
  65. package/dist/types/src/components/Form/fields/TextAreaField.d.ts +4 -0
  66. package/dist/types/src/components/Form/fields/TextAreaField.d.ts.map +1 -0
  67. package/dist/types/src/components/Form/fields/TextField.d.ts +4 -0
  68. package/dist/types/src/components/Form/fields/TextField.d.ts.map +1 -0
  69. package/dist/types/src/components/Form/fields/TupleField.d.ts +6 -0
  70. package/dist/types/src/components/Form/fields/TupleField.d.ts.map +1 -0
  71. package/dist/types/src/components/Form/fields/index.d.ts +13 -0
  72. package/dist/types/src/components/Form/fields/index.d.ts.map +1 -0
  73. package/dist/types/src/components/Form/index.d.ts +4 -4
  74. package/dist/types/src/components/Form/index.d.ts.map +1 -1
  75. package/dist/types/src/components/ObjectForm/ObjectForm.d.ts +8 -0
  76. package/dist/types/src/components/ObjectForm/ObjectForm.d.ts.map +1 -0
  77. package/dist/types/src/components/ObjectForm/index.d.ts +2 -0
  78. package/dist/types/src/components/ObjectForm/index.d.ts.map +1 -0
  79. package/dist/types/src/components/ObjectPicker/ObjectPicker.d.ts +37 -10
  80. package/dist/types/src/components/ObjectPicker/ObjectPicker.d.ts.map +1 -1
  81. package/dist/types/src/components/ObjectPicker/ObjectPicker.stories.d.ts +65 -59
  82. package/dist/types/src/components/ObjectPicker/ObjectPicker.stories.d.ts.map +1 -1
  83. package/dist/types/src/components/ObjectProperties/ObjectProperties.d.ts +9 -0
  84. package/dist/types/src/components/ObjectProperties/ObjectProperties.d.ts.map +1 -0
  85. package/dist/types/src/components/ObjectProperties/ObjectProperties.stories.d.ts +128 -0
  86. package/dist/types/src/components/ObjectProperties/ObjectProperties.stories.d.ts.map +1 -0
  87. package/dist/types/src/components/ObjectProperties/ObjectProperties.test.d.ts +2 -0
  88. package/dist/types/src/components/ObjectProperties/ObjectProperties.test.d.ts.map +1 -0
  89. package/dist/types/src/components/ObjectProperties/index.d.ts +2 -0
  90. package/dist/types/src/components/ObjectProperties/index.d.ts.map +1 -0
  91. package/dist/types/src/components/ObjectTree/ObjectTree.d.ts +9 -0
  92. package/dist/types/src/components/ObjectTree/ObjectTree.d.ts.map +1 -0
  93. package/dist/types/src/components/ObjectTree/ObjectTree.stories.d.ts +87 -0
  94. package/dist/types/src/components/ObjectTree/ObjectTree.stories.d.ts.map +1 -0
  95. package/dist/types/src/components/ObjectTree/index.d.ts +2 -0
  96. package/dist/types/src/components/ObjectTree/index.d.ts.map +1 -0
  97. package/dist/types/src/components/Settings/Settings.d.ts +51 -0
  98. package/dist/types/src/components/Settings/Settings.d.ts.map +1 -0
  99. package/dist/types/src/components/Settings/Settings.stories.d.ts +85 -0
  100. package/dist/types/src/components/Settings/Settings.stories.d.ts.map +1 -0
  101. package/dist/types/src/components/Settings/SettingsFieldSet.d.ts +43 -0
  102. package/dist/types/src/components/Settings/SettingsFieldSet.d.ts.map +1 -0
  103. package/dist/types/src/components/Settings/SettingsItem.d.ts +16 -0
  104. package/dist/types/src/components/Settings/SettingsItem.d.ts.map +1 -0
  105. package/dist/types/src/components/Settings/SettingsSelectField.d.ts +18 -0
  106. package/dist/types/src/components/Settings/SettingsSelectField.d.ts.map +1 -0
  107. package/dist/types/src/components/Settings/index.d.ts +4 -0
  108. package/dist/types/src/components/Settings/index.d.ts.map +1 -0
  109. package/dist/types/src/components/ViewEditor/ViewEditor.d.ts +16 -20
  110. package/dist/types/src/components/ViewEditor/ViewEditor.d.ts.map +1 -1
  111. package/dist/types/src/components/ViewEditor/ViewEditor.stories.d.ts +72 -66
  112. package/dist/types/src/components/ViewEditor/ViewEditor.stories.d.ts.map +1 -1
  113. package/dist/types/src/components/index.d.ts +4 -1
  114. package/dist/types/src/components/index.d.ts.map +1 -1
  115. package/dist/types/src/components/testing.d.ts +13 -6
  116. package/dist/types/src/components/testing.d.ts.map +1 -1
  117. package/dist/types/src/hooks/index.d.ts +2 -3
  118. package/dist/types/src/hooks/index.d.ts.map +1 -1
  119. package/dist/types/src/hooks/useFormHandler.d.ts +82 -0
  120. package/dist/types/src/hooks/useFormHandler.d.ts.map +1 -0
  121. package/dist/types/src/hooks/useKeyHandler.d.ts +7 -0
  122. package/dist/types/src/hooks/useKeyHandler.d.ts.map +1 -0
  123. package/dist/types/src/index.d.ts +0 -2
  124. package/dist/types/src/index.d.ts.map +1 -1
  125. package/dist/types/src/translations.d.ts +66 -60
  126. package/dist/types/src/translations.d.ts.map +1 -1
  127. package/dist/types/src/util/field-type.d.ts +19 -0
  128. package/dist/types/src/util/field-type.d.ts.map +1 -0
  129. package/dist/types/src/util/field.d.ts +3 -3
  130. package/dist/types/src/util/field.d.ts.map +1 -1
  131. package/dist/types/src/util/formatting.d.ts +2 -2
  132. package/dist/types/src/util/formatting.d.ts.map +1 -1
  133. package/dist/types/src/util/index.d.ts +2 -1
  134. package/dist/types/src/util/index.d.ts.map +1 -1
  135. package/dist/types/src/util/properties.d.ts +17 -0
  136. package/dist/types/src/util/properties.d.ts.map +1 -0
  137. package/dist/types/src/util/properties.test.d.ts +2 -0
  138. package/dist/types/src/util/properties.test.d.ts.map +1 -0
  139. package/dist/types/src/util/refs.d.ts +2 -2
  140. package/dist/types/src/util/refs.d.ts.map +1 -1
  141. package/dist/types/tsconfig.tsbuildinfo +1 -1
  142. package/package.json +61 -51
  143. package/src/components/FieldEditor/FieldEditor.stories.tsx +44 -25
  144. package/src/components/FieldEditor/FieldEditor.test.tsx +0 -1
  145. package/src/components/FieldEditor/FieldEditor.tsx +84 -84
  146. package/src/components/Form/AUDIT.md +17 -0
  147. package/src/components/Form/Form.stories.tsx +134 -252
  148. package/src/components/Form/Form.tsx +417 -107
  149. package/src/components/Form/FormField.tsx +332 -0
  150. package/src/components/Form/FormFieldComponent.stories.tsx +65 -0
  151. package/src/components/Form/FormFieldComponent.tsx +206 -0
  152. package/src/components/Form/FormFieldSet.tsx +173 -0
  153. package/src/components/Form/FormTooltipsContext.ts +25 -0
  154. package/src/components/Form/Layout/FormLayout.stories.tsx +339 -0
  155. package/src/components/Form/Layout/FormLayout.tsx +123 -0
  156. package/src/components/Form/Layout/annotation.ts +38 -0
  157. package/src/components/Form/Layout/index.ts +7 -0
  158. package/src/components/Form/Layout/parser.test.ts +120 -0
  159. package/src/components/Form/Layout/parser.ts +167 -0
  160. package/src/components/Form/README.md +3 -0
  161. package/src/components/Form/fields/ArrayField.tsx +185 -0
  162. package/src/components/Form/fields/BooleanField.tsx +22 -0
  163. package/src/components/Form/fields/DateField.tsx +95 -0
  164. package/src/components/Form/fields/GeoPointField.tsx +124 -0
  165. package/src/components/Form/fields/MarkdownField.stories.tsx +206 -0
  166. package/src/components/Form/fields/MarkdownField.tsx +168 -0
  167. package/src/components/Form/fields/NumberField.tsx +39 -0
  168. package/src/components/Form/fields/RefField.tsx +232 -0
  169. package/src/components/Form/fields/SelectField.tsx +77 -0
  170. package/src/components/Form/{custom/SelectOptionsInput.stories.tsx → fields/SelectOptionField.stories.tsx} +23 -18
  171. package/src/components/Form/{custom/SelectOptionsInput.tsx → fields/SelectOptionField.tsx} +31 -24
  172. package/src/components/Form/fields/TextAreaField.tsx +38 -0
  173. package/src/components/Form/fields/TextField.tsx +38 -0
  174. package/src/components/Form/{custom/TupleInput.tsx → fields/TupleField.tsx} +17 -9
  175. package/src/components/Form/fields/index.ts +16 -0
  176. package/src/components/Form/index.ts +5 -4
  177. package/src/components/ObjectForm/ObjectForm.tsx +115 -0
  178. package/src/components/{ControlSection → ObjectForm}/index.ts +1 -1
  179. package/src/components/ObjectPicker/ObjectPicker.stories.tsx +30 -25
  180. package/src/components/ObjectPicker/ObjectPicker.tsx +122 -81
  181. package/src/components/ObjectProperties/ObjectProperties.stories.tsx +350 -0
  182. package/src/components/ObjectProperties/ObjectProperties.test.tsx +108 -0
  183. package/src/components/ObjectProperties/ObjectProperties.tsx +147 -0
  184. package/src/components/ObjectProperties/index.ts +5 -0
  185. package/src/components/ObjectTree/ObjectTree.stories.tsx +134 -0
  186. package/src/components/ObjectTree/ObjectTree.tsx +190 -0
  187. package/src/components/ObjectTree/index.ts +5 -0
  188. package/src/components/Settings/AUDIT.md +51 -0
  189. package/src/components/Settings/Settings.stories.tsx +104 -0
  190. package/src/components/Settings/Settings.tsx +81 -0
  191. package/src/components/Settings/SettingsFieldSet.tsx +257 -0
  192. package/src/components/Settings/SettingsItem.tsx +58 -0
  193. package/src/components/Settings/SettingsSelectField.tsx +59 -0
  194. package/src/components/Settings/index.ts +7 -0
  195. package/src/components/ViewEditor/ViewEditor.stories.tsx +65 -73
  196. package/src/components/ViewEditor/ViewEditor.test.tsx +11 -11
  197. package/src/components/ViewEditor/ViewEditor.tsx +308 -214
  198. package/src/components/index.ts +4 -1
  199. package/src/components/testing.tsx +24 -11
  200. package/src/hooks/index.ts +2 -3
  201. package/src/hooks/useFormHandler.ts +380 -0
  202. package/src/hooks/useKeyHandler.tsx +37 -0
  203. package/src/index.ts +0 -4
  204. package/src/translations.ts +71 -65
  205. package/src/util/field-type.ts +60 -0
  206. package/src/util/field.ts +25 -25
  207. package/src/util/formatting.ts +22 -22
  208. package/src/util/index.ts +2 -1
  209. package/src/util/properties.test.ts +78 -0
  210. package/src/util/properties.ts +38 -0
  211. package/src/util/refs.ts +16 -18
  212. package/src/vite-env.d.ts +10 -0
  213. package/dist/types/src/components/ControlSection/ControlSection.d.ts +0 -23
  214. package/dist/types/src/components/ControlSection/ControlSection.d.ts.map +0 -1
  215. package/dist/types/src/components/ControlSection/ControlSection.stories.d.ts +0 -84
  216. package/dist/types/src/components/ControlSection/ControlSection.stories.d.ts.map +0 -1
  217. package/dist/types/src/components/ControlSection/index.d.ts +0 -2
  218. package/dist/types/src/components/ControlSection/index.d.ts.map +0 -1
  219. package/dist/types/src/components/Form/ArrayField.d.ts +0 -16
  220. package/dist/types/src/components/Form/ArrayField.d.ts.map +0 -1
  221. package/dist/types/src/components/Form/Defaults.d.ts +0 -14
  222. package/dist/types/src/components/Form/Defaults.d.ts.map +0 -1
  223. package/dist/types/src/components/Form/FormActions.d.ts +0 -9
  224. package/dist/types/src/components/Form/FormActions.d.ts.map +0 -1
  225. package/dist/types/src/components/Form/FormContent.d.ts +0 -63
  226. package/dist/types/src/components/Form/FormContent.d.ts.map +0 -1
  227. package/dist/types/src/components/Form/FormContext.d.ts +0 -23
  228. package/dist/types/src/components/Form/FormContext.d.ts.map +0 -1
  229. package/dist/types/src/components/Form/Input.d.ts +0 -29
  230. package/dist/types/src/components/Form/Input.d.ts.map +0 -1
  231. package/dist/types/src/components/Form/RefField.d.ts +0 -22
  232. package/dist/types/src/components/Form/RefField.d.ts.map +0 -1
  233. package/dist/types/src/components/Form/custom/GeoPointInput.d.ts +0 -4
  234. package/dist/types/src/components/Form/custom/GeoPointInput.d.ts.map +0 -1
  235. package/dist/types/src/components/Form/custom/SelectOptionsInput.d.ts +0 -4
  236. package/dist/types/src/components/Form/custom/SelectOptionsInput.d.ts.map +0 -1
  237. package/dist/types/src/components/Form/custom/SelectOptionsInput.stories.d.ts +0 -79
  238. package/dist/types/src/components/Form/custom/SelectOptionsInput.stories.d.ts.map +0 -1
  239. package/dist/types/src/components/Form/custom/TupleInput.d.ts +0 -6
  240. package/dist/types/src/components/Form/custom/TupleInput.d.ts.map +0 -1
  241. package/dist/types/src/components/Form/custom/index.d.ts +0 -4
  242. package/dist/types/src/components/Form/custom/index.d.ts.map +0 -1
  243. package/dist/types/src/components/Form/factory.d.ts +0 -8
  244. package/dist/types/src/components/Form/factory.d.ts.map +0 -1
  245. package/dist/types/src/hooks/useForm.d.ts +0 -67
  246. package/dist/types/src/hooks/useForm.d.ts.map +0 -1
  247. package/dist/types/src/hooks/useQueryRefOptions.d.ts +0 -29
  248. package/dist/types/src/hooks/useQueryRefOptions.d.ts.map +0 -1
  249. package/dist/types/src/hooks/useRefQueryLookupHandler.d.ts +0 -8
  250. package/dist/types/src/hooks/useRefQueryLookupHandler.d.ts.map +0 -1
  251. package/dist/types/src/util/schema.d.ts +0 -3
  252. package/dist/types/src/util/schema.d.ts.map +0 -1
  253. package/src/components/ControlSection/ControlSection.stories.tsx +0 -38
  254. package/src/components/ControlSection/ControlSection.tsx +0 -153
  255. package/src/components/Form/ArrayField.tsx +0 -125
  256. package/src/components/Form/Defaults.tsx +0 -205
  257. package/src/components/Form/FormActions.tsx +0 -54
  258. package/src/components/Form/FormContent.tsx +0 -322
  259. package/src/components/Form/FormContext.tsx +0 -110
  260. package/src/components/Form/Input.tsx +0 -54
  261. package/src/components/Form/RefField.tsx +0 -283
  262. package/src/components/Form/custom/GeoPointInput.tsx +0 -80
  263. package/src/components/Form/custom/index.ts +0 -7
  264. package/src/components/Form/factory.tsx +0 -31
  265. package/src/hooks/useForm.ts +0 -296
  266. package/src/hooks/useQueryRefOptions.ts +0 -62
  267. package/src/hooks/useRefQueryLookupHandler.ts +0 -39
  268. package/src/util/schema.ts +0 -12
@@ -1,63 +0,0 @@
1
- import * as Schema from 'effect/Schema';
2
- import React from 'react';
3
- import { type ThemedClassName } from '@dxos/react-ui';
4
- import { type ProjectionModel, type SchemaProperty } from '@dxos/schema';
5
- import { type QueryRefOptions } from '../../hooks';
6
- import { type ComponentLookup } from './Form';
7
- import { type InputComponent } from './Input';
8
- import { type RefFieldProps } from './RefField';
9
- export type FormFieldProps = {
10
- property: SchemaProperty<any>;
11
- path?: (string | number)[];
12
- /** Used to indicate if input should be presented inline (e.g. for array items). */
13
- inline?: boolean;
14
- projection?: ProjectionModel;
15
- lookupComponent?: ComponentLookup;
16
- Custom?: Partial<Record<string, InputComponent>>;
17
- } & Pick<RefFieldProps, 'readonly' | 'onQueryRefOptions' | 'createOptionLabel' | 'createOptionIcon' | 'onCreate' | 'createSchema' | 'createInitialValuePath'>;
18
- export declare const FormField: ({ property, path, readonly, inline, projection, onQueryRefOptions, createOptionLabel, createOptionIcon, onCreate, createSchema, createInitialValuePath, lookupComponent, Custom, }: FormFieldProps) => React.JSX.Element | null;
19
- export type FormFieldsProps = ThemedClassName<{
20
- testId?: string;
21
- schema: Schema.Schema.All;
22
- /**
23
- * Path to the current object from the root. Used with nested forms.
24
- */
25
- path?: (string | number)[];
26
- filter?: (props: SchemaProperty<any>[]) => SchemaProperty<any>[];
27
- sort?: string[];
28
- /**
29
- * Optional projection for projection-based field management
30
- */
31
- projection?: ProjectionModel;
32
- lookupComponent?: ComponentLookup;
33
- /**
34
- * Map of custom renderers for specific properties.
35
- * Prefer lookupComponent for plugin specific input surfaces.
36
- */
37
- Custom?: Partial<Record<string, InputComponent>>;
38
- onQueryRefOptions?: QueryRefOptions;
39
- } & Pick<FormFieldProps, 'readonly'> & Pick<RefFieldProps, 'onQueryRefOptions' | 'createOptionLabel' | 'createOptionIcon' | 'onCreate' | 'createSchema' | 'createInitialValuePath'>>;
40
- export declare const FormFields: React.ForwardRefExoticComponent<Omit<{
41
- testId?: string;
42
- schema: Schema.Schema.All;
43
- /**
44
- * Path to the current object from the root. Used with nested forms.
45
- */
46
- path?: (string | number)[];
47
- filter?: (props: SchemaProperty<any>[]) => SchemaProperty<any>[];
48
- sort?: string[];
49
- /**
50
- * Optional projection for projection-based field management
51
- */
52
- projection?: ProjectionModel;
53
- lookupComponent?: ComponentLookup;
54
- /**
55
- * Map of custom renderers for specific properties.
56
- * Prefer lookupComponent for plugin specific input surfaces.
57
- */
58
- Custom?: Partial<Record<string, InputComponent>>;
59
- onQueryRefOptions?: QueryRefOptions;
60
- } & Pick<FormFieldProps, "readonly"> & Pick<RefFieldProps, "onQueryRefOptions" | "createOptionLabel" | "createOptionIcon" | "onCreate" | "createSchema" | "createInitialValuePath">, "className"> & {
61
- classNames?: import("@dxos/react-ui-types").ClassNameValue;
62
- } & React.RefAttributes<HTMLDivElement>>;
63
- //# sourceMappingURL=FormContent.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"FormContent.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/FormContent.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,MAAM,MAAM,eAAe,CAAC;AAGxC,OAAO,KAA8B,MAAM,OAAO,CAAC;AAGnD,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAEtD,OAAO,EAAE,KAAK,eAAe,EAAE,KAAK,cAAc,EAAuB,MAAM,cAAc,CAAC;AAG9F,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,aAAa,CAAC;AAMnD,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,QAAQ,CAAC;AAE9C,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,SAAS,CAAC;AAC9C,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,YAAY,CAAC;AAE1D,MAAM,MAAM,cAAc,GAAG;IAC3B,QAAQ,EAAE,cAAc,CAAC,GAAG,CAAC,CAAC;IAC9B,IAAI,CAAC,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,CAAC;IAC3B,mFAAmF;IACnF,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,UAAU,CAAC,EAAE,eAAe,CAAC;IAC7B,eAAe,CAAC,EAAE,eAAe,CAAC;IAClC,MAAM,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,CAAC,CAAC;CAClD,GAAG,IAAI,CACN,aAAa,EACX,UAAU,GACV,mBAAmB,GACnB,mBAAmB,GACnB,kBAAkB,GAClB,UAAU,GACV,cAAc,GACd,wBAAwB,CAC3B,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,oLAcvB,cAAc,6BAwJhB,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG,eAAe,CAC3C;IACE,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,MAAM,CAAC,MAAM,CAAC,GAAG,CAAC;IAC1B;;OAEG;IACH,IAAI,CAAC,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,CAAC;IAC3B,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,CAAC,GAAG,CAAC,EAAE,KAAK,cAAc,CAAC,GAAG,CAAC,EAAE,CAAC;IACjE,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC;IAChB;;OAEG;IACH,UAAU,CAAC,EAAE,eAAe,CAAC;IAC7B,eAAe,CAAC,EAAE,eAAe,CAAC;IAClC;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,CAAC,CAAC;IACjD,iBAAiB,CAAC,EAAE,eAAe,CAAC;CACrC,GAAG,IAAI,CAAC,cAAc,EAAE,UAAU,CAAC,GAClC,IAAI,CACF,aAAa,EACX,mBAAmB,GACnB,mBAAmB,GACnB,kBAAkB,GAClB,UAAU,GACV,cAAc,GACd,wBAAwB,CAC3B,CACJ,CAAC;AAEF,eAAO,MAAM,UAAU;aA/BV,MAAM;YACP,MAAM,CAAC,MAAM,CAAC,GAAG;IACzB;;OAEG;WACI,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE;aACjB,CAAC,KAAK,EAAE,cAAc,CAAC,GAAG,CAAC,EAAE,KAAK,cAAc,CAAC,GAAG,CAAC,EAAE;WACzD,MAAM,EAAE;IACf;;OAEG;iBACU,eAAe;sBACV,eAAe;IACjC;;;OAGG;aACM,OAAO,CAAC,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,CAAC;wBAC5B,eAAe;;;wCAuFtC,CAAC"}
@@ -1,23 +0,0 @@
1
- import React, { type FocusEvent, type PropsWithChildren, type RefObject } from 'react';
2
- import { type BaseObject } from '@dxos/echo/internal';
3
- import { type SimpleType } from '@dxos/effect';
4
- import { type FormHandler, type FormOptions } from '../../hooks';
5
- type FormContextValue<T extends BaseObject> = FormHandler<T>;
6
- export declare const useFormContext: <T extends BaseObject>() => FormContextValue<T>;
7
- export declare const useFormValues: (path?: (string | number)[]) => any;
8
- export type FormInputStateProps = {
9
- getStatus: () => {
10
- status?: 'error';
11
- error?: string;
12
- };
13
- getValue: <V>() => V | undefined;
14
- onValueChange: (type: SimpleType, value: any) => void;
15
- onBlur: (event: FocusEvent<HTMLElement>) => void;
16
- };
17
- export declare const useInputProps: (path?: (string | number)[]) => FormInputStateProps;
18
- export declare const FormProvider: ({ children, formRef, autoSave, ...formOptions }: PropsWithChildren<FormOptions<any> & {
19
- formRef?: RefObject<HTMLDivElement | null>;
20
- autoSave?: boolean;
21
- }>) => React.JSX.Element;
22
- export {};
23
- //# sourceMappingURL=FormContext.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"FormContext.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/FormContext.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,EACZ,KAAK,UAAU,EACf,KAAK,iBAAiB,EACtB,KAAK,SAAS,EAMf,MAAM,OAAO,CAAC;AAGf,OAAO,EAAE,KAAK,UAAU,EAAY,MAAM,qBAAqB,CAAC;AAChE,OAAO,EAAE,KAAK,UAAU,EAAkB,MAAM,cAAc,CAAC;AAE/D,OAAO,EAAE,KAAK,WAAW,EAAE,KAAK,WAAW,EAAW,MAAM,aAAa,CAAC;AAE1E,KAAK,gBAAgB,CAAC,CAAC,SAAS,UAAU,IAAI,WAAW,CAAC,CAAC,CAAC,CAAC;AAI7D,eAAO,MAAM,cAAc,GAAI,CAAC,SAAS,UAAU,OAAK,gBAAgB,CAAC,CAAC,CAEzE,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,OAAM,CAAC,MAAM,GAAG,MAAM,CAAC,EAAO,KAAG,GAI9D,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,SAAS,EAAE,MAAM;QAAE,MAAM,CAAC,EAAE,OAAO,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACtD,QAAQ,EAAE,CAAC,CAAC,OAAO,CAAC,GAAG,SAAS,CAAC;IACjC,aAAa,EAAE,CAAC,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;IACtD,MAAM,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;CAClD,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,OAAM,CAAC,MAAM,GAAG,MAAM,CAAC,EAAO,KAAG,mBAa9D,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,iDAK1B,iBAAiB,CAClB,WAAW,CAAC,GAAG,CAAC,GAAG;IACjB,OAAO,CAAC,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IAC3C,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CACF,sBA0CA,CAAC"}
@@ -1,29 +0,0 @@
1
- import React, { type FC } from 'react';
2
- import { type FormatEnum } from '@dxos/echo/internal';
3
- import { type SimpleType } from '@dxos/effect';
4
- import { type FormInputStateProps } from './FormContext';
5
- /**
6
- * Props passed to input components.
7
- */
8
- export type InputProps = {
9
- type: SimpleType;
10
- format?: FormatEnum;
11
- label: string;
12
- placeholder?: string;
13
- inputOnly?: boolean;
14
- /**
15
- * Specifies the readonly variant: either disabled inputs, elements indicating they are usually editable but currently are not; or `static`, a field’s representation as regular content without signifiers that it is ever editable.
16
- */
17
- readonly?: 'disabled-input' | 'static' | false;
18
- } & FormInputStateProps;
19
- /**
20
- * Form input component.
21
- */
22
- export type InputComponent = FC<InputProps>;
23
- export type InputHeaderProps = {
24
- error?: string;
25
- label: string;
26
- readonly?: boolean;
27
- };
28
- export declare const InputHeader: ({ error, label, readonly }: InputHeaderProps) => React.JSX.Element;
29
- //# sourceMappingURL=Input.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/Input.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,EAAE,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,cAAc,CAAC;AAK/C,OAAO,EAAE,KAAK,mBAAmB,EAAE,MAAM,eAAe,CAAC;AAEzD;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG;IACvB,IAAI,EAAE,UAAU,CAAC;IACjB,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,QAAQ,CAAC,EAAE,gBAAgB,GAAG,QAAQ,GAAG,KAAK,CAAC;CAChD,GAAG,mBAAmB,CAAC;AAExB;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG,EAAE,CAAC,UAAU,CAAC,CAAC;AAE5C,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,WAAW,GAAI,4BAA4B,gBAAgB,sBAavE,CAAC"}
@@ -1,22 +0,0 @@
1
- import '@dxos/lit-ui/dx-tag-picker.pcss';
2
- import type * as Schema from 'effect/Schema';
3
- import type * as SchemaAST from 'effect/SchemaAST';
4
- import React from 'react';
5
- import { type EchoSchema } from '@dxos/echo/internal';
6
- import { type QueryRefOptions } from '../../hooks';
7
- import { type InputProps } from './Input';
8
- export type RefFieldProps = InputProps & {
9
- ast?: SchemaAST.AST;
10
- array?: boolean;
11
- createOptionLabel?: [string, {
12
- ns: string;
13
- }];
14
- createOptionIcon?: string;
15
- onCreate?: (values: any) => void;
16
- createSchema?: Schema.Schema.AnyNoContext;
17
- createInitialValuePath?: string;
18
- onQueryRefOptions?: QueryRefOptions;
19
- schema?: EchoSchema;
20
- };
21
- export declare const RefField: ({ type, label, readonly, placeholder, inputOnly, array, ast, getValue, createOptionLabel, createOptionIcon, onBlur, onCreate, createSchema, createInitialValuePath, onQueryRefOptions, onValueChange, ...restInputProps }: RefFieldProps) => React.JSX.Element | null;
22
- //# sourceMappingURL=RefField.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"RefField.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/RefField.tsx"],"names":[],"mappings":"AAIA,OAAO,iCAAiC,CAAC;AAEzC,OAAO,KAAK,KAAK,MAAM,MAAM,eAAe,CAAC;AAC7C,OAAO,KAAK,KAAK,SAAS,MAAM,kBAAkB,CAAC;AACnD,OAAO,KAA+B,MAAM,OAAO,CAAC;AAEpD,OAAO,EACL,KAAK,UAAU,EAMhB,MAAM,qBAAqB,CAAC;AAS7B,OAAO,EAAE,KAAK,eAAe,EAAsB,MAAM,aAAa,CAAC;AAKvE,OAAO,EAAe,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAEvD,MAAM,MAAM,aAAa,GAAG,UAAU,GAAG;IACvC,GAAG,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC;IACpB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,iBAAiB,CAAC,EAAE,CAAC,MAAM,EAAE;QAAE,EAAE,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC7C,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,GAAG,KAAK,IAAI,CAAC;IACjC,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,YAAY,CAAC;IAC1C,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,iBAAiB,CAAC,EAAE,eAAe,CAAC;IACpC,MAAM,CAAC,EAAE,UAAU,CAAC;CACrB,CAAC;AAOF,eAAO,MAAM,QAAQ,GAAI,2NAkBtB,aAAa,6BAuKf,CAAC"}
@@ -1,4 +0,0 @@
1
- import React from 'react';
2
- import { type InputProps } from '../Input';
3
- export declare const GeoPointInput: ({ type, label, readonly, getStatus, getValue, onValueChange, onBlur }: InputProps) => React.JSX.Element;
4
- //# sourceMappingURL=GeoPointInput.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"GeoPointInput.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Form/custom/GeoPointInput.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAsE,MAAM,OAAO,CAAC;AAO3F,OAAO,EAAe,KAAK,UAAU,EAAE,MAAM,UAAU,CAAC;AAExD,eAAO,MAAM,aAAa,GAAI,uEAAuE,UAAU,sBAkE9G,CAAC"}
@@ -1,4 +0,0 @@
1
- import React from 'react';
2
- import { type InputProps } from '../Input';
3
- export declare const SelectOptionInput: ({ type, label, readonly, getStatus, getValue, onValueChange }: InputProps) => React.JSX.Element;
4
- //# sourceMappingURL=SelectOptionsInput.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"SelectOptionsInput.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Form/custom/SelectOptionsInput.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAyF,MAAM,OAAO,CAAC;AAU9G,OAAO,EAAe,KAAK,UAAU,EAAE,MAAM,UAAU,CAAC;AAExD,eAAO,MAAM,iBAAiB,GAAI,+DAA+D,UAAU,sBA8K1G,CAAC"}
@@ -1,79 +0,0 @@
1
- import { type StoryObj } from '@storybook/react-vite';
2
- import React from 'react';
3
- declare const meta: {
4
- title: string;
5
- component: any;
6
- render: () => React.JSX.Element;
7
- decorators: import("@storybook/react").Decorator[];
8
- parameters: {
9
- layout: string;
10
- translations: [{
11
- readonly 'en-US': {
12
- readonly "react-ui-form": {
13
- readonly 'fields label': "Fields";
14
- readonly 'hidden fields label': "Hidden Fields";
15
- readonly 'empty readonly ref field label': "(none)";
16
- readonly 'button add property': "Add property";
17
- readonly 'field property label': "Property";
18
- readonly 'field property placeholder': "Property name";
19
- readonly 'field format label': "Type";
20
- readonly 'field path label': "Field path";
21
- readonly 'add field': "Add field";
22
- readonly 'delete field': "Delete field";
23
- readonly 'field limit reached': "Maximum number of fields reached";
24
- readonly 'boolean input true value': "Yes";
25
- readonly 'boolean input false value': "No";
26
- readonly 'show field label': "Show field";
27
- readonly 'hide field label': "Hide field";
28
- readonly 'delete field label': "Delete field";
29
- readonly 'ref field combobox input placeholder': "Search…";
30
- readonly 'ref field placeholder_one': "Select…";
31
- readonly 'ref field placeholder_other': "Select items…";
32
- readonly 'button cancel': "Cancel";
33
- readonly 'button save': "Save";
34
- readonly 'format boolean': "Boolean";
35
- readonly 'format currency': "Currency";
36
- readonly 'format date': "Date";
37
- readonly 'format date-time': "DateTime";
38
- readonly 'format did': "DID";
39
- readonly 'format duration': "Duration";
40
- readonly 'format dxn': "DXN";
41
- readonly 'format email': "Email";
42
- readonly 'format formula': "Formula";
43
- readonly 'format hostname': "Hostname";
44
- readonly 'format integer': "Integer";
45
- readonly 'format json': "JSON";
46
- readonly 'format lnglat': "Geopoint";
47
- readonly 'format markdown': "Markdown";
48
- readonly 'format percent': "Percent";
49
- readonly 'format ref': "Reference";
50
- readonly 'format regex': "RegExp";
51
- readonly 'format string': "String";
52
- readonly 'format single-select': "Select";
53
- readonly 'format multi-select': "Multi-select";
54
- readonly 'format text': "Long text";
55
- readonly 'format time': "Time";
56
- readonly 'format timestamp': "Timestamp";
57
- readonly 'format user': "User";
58
- readonly 'format number': "Number";
59
- readonly 'format uri': "URI";
60
- readonly 'format url': "URL";
61
- readonly 'format uuid': "UUID";
62
- readonly 'latitude label': "Latitude";
63
- readonly 'longitude label': "Longitude";
64
- readonly 'select option label': "Label";
65
- readonly 'select option label placeholder': "Option label";
66
- readonly 'select option color': "Color";
67
- readonly 'select option delete': "Delete";
68
- readonly 'select option add': "Add option";
69
- readonly 'system schema title': "System record type";
70
- readonly 'system schema description': "This is a system record type and cannot be modified, though the view can still be configured.";
71
- };
72
- };
73
- }];
74
- };
75
- };
76
- export default meta;
77
- type Story = StoryObj<typeof meta>;
78
- export declare const Default: Story;
79
- //# sourceMappingURL=SelectOptionsInput.stories.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"SelectOptionsInput.stories.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Form/custom/SelectOptionsInput.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAa,KAAK,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAEjE,OAAO,KAAmB,MAAM,OAAO,CAAC;AAuCxC,QAAA,MAAM,IAAI;;eAEwB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAOA,CAAC;AAEtC,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAAU,CAAC"}
@@ -1,6 +0,0 @@
1
- import React from 'react';
2
- import { type InputProps } from '../Input';
3
- export declare const TupleInput: ({ binding, type, label, readonly, getStatus, getValue, onValueChange, onBlur, }: InputProps & {
4
- binding: string[];
5
- }) => React.JSX.Element;
6
- //# sourceMappingURL=TupleInput.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"TupleInput.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Form/custom/TupleInput.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,EAAe,KAAK,UAAU,EAAE,MAAM,UAAU,CAAC;AAIxD,eAAO,MAAM,UAAU,GAAI,iFASxB,UAAU,GAAG;IAAE,OAAO,EAAE,MAAM,EAAE,CAAA;CAAE,sBAuBpC,CAAC"}
@@ -1,4 +0,0 @@
1
- export * from './GeoPointInput';
2
- export * from './SelectOptionsInput';
3
- export * from './TupleInput';
4
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Form/custom/index.ts"],"names":[],"mappings":"AAIA,cAAc,iBAAiB,CAAC;AAChC,cAAc,sBAAsB,CAAC;AACrC,cAAc,cAAc,CAAC"}
@@ -1,8 +0,0 @@
1
- import { FormatEnum } from '@dxos/echo/internal';
2
- import { type SimpleType } from '@dxos/effect';
3
- import { type InputComponent } from './Input';
4
- /**
5
- * Get property input component.
6
- */
7
- export declare const getInputComponent: (type: SimpleType, format?: FormatEnum | string) => InputComponent | undefined;
8
- //# sourceMappingURL=factory.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"factory.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/factory.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACjD,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,cAAc,CAAC;AAI/C,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,SAAS,CAAC;AAE9C;;GAEG;AACH,eAAO,MAAM,iBAAiB,GAAI,MAAM,UAAU,EAAE,SAAS,UAAU,GAAG,MAAM,KAAG,cAAc,GAAG,SAgBnG,CAAC"}
@@ -1,67 +0,0 @@
1
- import type * as Schema from 'effect/Schema';
2
- import { type BaseObject } from '@dxos/echo/internal';
3
- import { type JsonPath, type SimpleType } from '@dxos/effect';
4
- import { type ValidationError } from '@dxos/schema';
5
- import { type MaybePromise } from '@dxos/util';
6
- /**
7
- * Return type from `useForm` hook.
8
- */
9
- export type FormHandler<T extends BaseObject> = {
10
- values: Partial<T>;
11
- errors: Record<JsonPath, string>;
12
- touched: Record<JsonPath, boolean>;
13
- changed: Record<JsonPath, boolean>;
14
- canSave: boolean;
15
- formIsValid: boolean;
16
- handleSave: () => void;
17
- getStatus: (path: string | (string | number)[]) => {
18
- status?: 'error';
19
- error?: string;
20
- };
21
- getValue: <V>(path: (string | number)[]) => V | undefined;
22
- onValueChange: <V>(path: (string | number)[], type: SimpleType, value: V) => void;
23
- onTouched: (path: (string | number)[]) => void;
24
- };
25
- /**
26
- * Hook options.
27
- */
28
- export interface FormOptions<T extends BaseObject> {
29
- /**
30
- * Effect schema (Type literal).
31
- */
32
- schema: Schema.Schema<T, any>;
33
- /**
34
- * Initial values (which may not pass validation).
35
- */
36
- initialValues: Partial<T>;
37
- /**
38
- * Callback for value changes. Note: This is called even when values are invalid.
39
- * Sometimes the parent component may want to know about changes even if the form is
40
- * in an invalid state.
41
- */
42
- onValuesChanged?: (values: Partial<T>) => void;
43
- /**
44
- * Custom validation function that runs only after schema validation passes.
45
- * Use this for complex validation logic that can't be expressed in the schema.
46
- * @returns Array of validation errors, or undefined if validation passes
47
- */
48
- onValidate?: (values: T) => ValidationError[] | undefined;
49
- /**
50
- * Called when the form is valid.
51
- */
52
- onValid?: (values: T, meta: {
53
- changed: FormHandler<T>['changed'];
54
- }) => void;
55
- /**
56
- * Called when the form is submitted and passes validation.
57
- */
58
- onSave?: (values: T, meta: {
59
- changed: FormHandler<T>['changed'];
60
- }) => MaybePromise<void>;
61
- }
62
- /**
63
- * Creates a hook for managing form state, including values, validation, and submission.
64
- * Deeply integrated with `@dxos/schema` for schema-based validation.
65
- */
66
- export declare const useForm: <T extends BaseObject>({ schema, initialValues, onValuesChanged, onValidate, onValid, onSave, }: FormOptions<T>) => FormHandler<T>;
67
- //# sourceMappingURL=useForm.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useForm.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useForm.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,MAAM,eAAe,CAAC;AAI7C,OAAO,EAAE,KAAK,UAAU,EAAsB,MAAM,qBAAqB,CAAC;AAC1E,OAAO,EAAE,KAAK,QAAQ,EAAE,KAAK,UAAU,EAA4C,MAAM,cAAc,CAAC;AAGxG,OAAO,EAAE,KAAK,eAAe,EAAkB,MAAM,cAAc,CAAC;AACpE,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,YAAY,CAAC;AAE/C;;GAEG;AACH,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,UAAU,IAAI;IAK9C,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;IACnB,MAAM,EAAE,MAAM,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC;IACjC,OAAO,EAAE,MAAM,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;IACnC,OAAO,EAAE,MAAM,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;IACnC,OAAO,EAAE,OAAO,CAAC;IACjB,WAAW,EAAE,OAAO,CAAC;IAGrB,UAAU,EAAE,MAAM,IAAI,CAAC;IAMvB,SAAS,EAAE,CAAC,IAAI,EAAE,MAAM,GAAG,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,KAAK;QAAE,MAAM,CAAC,EAAE,OAAO,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACxF,QAAQ,EAAE,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,KAAK,CAAC,GAAG,SAAS,CAAC;IAC1D,aAAa,EAAE,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAClF,SAAS,EAAE,CAAC,IAAI,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,KAAK,IAAI,CAAC;CAChD,CAAC;AAEF;;GAEG;AACH,MAAM,WAAW,WAAW,CAAC,CAAC,SAAS,UAAU;IAC/C;;OAEG;IACH,MAAM,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC;IAE9B;;OAEG;IACH,aAAa,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;IAE1B;;;;OAIG;IACH,eAAe,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IAE/C;;;;OAIG;IAEH,UAAU,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,eAAe,EAAE,GAAG,SAAS,CAAC;IAE1D;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE;QAAE,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAA;KAAE,KAAK,IAAI,CAAC;IAE5E;;OAEG;IACH,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE;QAAE,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAA;KAAE,KAAK,YAAY,CAAC,IAAI,CAAC,CAAC;CAC1F;AAED;;;GAGG;AACH,eAAO,MAAM,OAAO,GAAI,CAAC,SAAS,UAAU,EAAE,0EAO3C,WAAW,CAAC,CAAC,CAAC,KAAG,WAAW,CAAC,CAAC,CAsLhC,CAAC"}
@@ -1,29 +0,0 @@
1
- import { type TypeAnnotation } from '@dxos/echo/internal';
2
- import { type DXN } from '@dxos/keys';
3
- import { type Palette } from '@dxos/react-ui-types';
4
- import { type MaybePromise } from '@dxos/util';
5
- export type RefOption = {
6
- dxn: DXN;
7
- label?: string;
8
- };
9
- export type QueryRefOptions = (type: TypeAnnotation) => MaybePromise<RefOption[]>;
10
- export type QueryTag = {
11
- id: string;
12
- label: string;
13
- hue?: Palette;
14
- };
15
- type UseQueryRefOptionsProps = {
16
- refTypeInfo: TypeAnnotation | undefined;
17
- onQueryRefOptions?: QueryRefOptions;
18
- };
19
- /**
20
- * Hook to query reference options based on type information.
21
- * Used internally within forms to fetch and format reference options for reference fields.
22
- */
23
- export declare const useQueryRefOptions: ({ refTypeInfo, onQueryRefOptions }: UseQueryRefOptionsProps) => {
24
- options: QueryTag[];
25
- update: () => void;
26
- loading: boolean;
27
- };
28
- export {};
29
- //# sourceMappingURL=useQueryRefOptions.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useQueryRefOptions.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useQueryRefOptions.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAC1D,OAAO,EAAE,KAAK,GAAG,EAAE,MAAM,YAAY,CAAC;AAEtC,OAAO,EAAE,KAAK,OAAO,EAAE,MAAM,sBAAsB,CAAC;AACpD,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,YAAY,CAAC;AAE/C,MAAM,MAAM,SAAS,GAAG;IAAE,GAAG,EAAE,GAAG,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AACrD,MAAM,MAAM,eAAe,GAAG,CAAC,IAAI,EAAE,cAAc,KAAK,YAAY,CAAC,SAAS,EAAE,CAAC,CAAC;AAElF,MAAM,MAAM,QAAQ,GAAG;IACrB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,CAAC,EAAE,OAAO,CAAC;CACf,CAAC;AAEF,KAAK,uBAAuB,GAAG;IAAE,WAAW,EAAE,cAAc,GAAG,SAAS,CAAC;IAAC,iBAAiB,CAAC,EAAE,eAAe,CAAA;CAAE,CAAC;AAEhH;;;GAGG;AAEH,eAAO,MAAM,kBAAkB,GAAI,oCAAoC,uBAAuB;;;;CAiC7F,CAAC"}
@@ -1,8 +0,0 @@
1
- import { type Space } from '@dxos/react-client/echo';
2
- import { type QueryRefOptions } from './useQueryRefOptions';
3
- type UseRefQueryLookupProps = {
4
- space?: Space;
5
- };
6
- export declare const useRefQueryLookupHandler: ({ space }: UseRefQueryLookupProps) => QueryRefOptions;
7
- export {};
8
- //# sourceMappingURL=useRefQueryLookupHandler.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useRefQueryLookupHandler.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useRefQueryLookupHandler.ts"],"names":[],"mappings":"AAQA,OAAO,EAAU,KAAK,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAG7D,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAE5D,KAAK,sBAAsB,GAAG;IAAE,KAAK,CAAC,EAAE,KAAK,CAAA;CAAE,CAAC;AAEhD,eAAO,MAAM,wBAAwB,GAAI,WAAW,sBAAsB,KAAG,eAuB5E,CAAC"}
@@ -1,3 +0,0 @@
1
- import * as SchemaAST from 'effect/SchemaAST';
2
- export declare const findArrayElementType: (ast: SchemaAST.AST) => SchemaAST.AST | undefined;
3
- //# sourceMappingURL=schema.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"schema.d.ts","sourceRoot":"","sources":["../../../../src/util/schema.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,SAAS,MAAM,kBAAkB,CAAC;AAI9C,eAAO,MAAM,oBAAoB,GAAI,KAAK,SAAS,CAAC,GAAG,8BAGtD,CAAC"}
@@ -1,38 +0,0 @@
1
- //
2
- // Copyright 2024 DXOS.org
3
- //
4
-
5
- import { type Meta, type StoryObj } from '@storybook/react-vite';
6
- import React from 'react';
7
-
8
- import { withTheme } from '@dxos/react-ui/testing';
9
-
10
- import { translations } from '../../translations';
11
-
12
- import { ControlPage, ControlSection } from './ControlSection';
13
-
14
- const meta = {
15
- title: 'ui/react-ui-form/ControlSection',
16
- component: ControlSection,
17
- render: (args) => (
18
- <ControlPage classNames='w-[40rem]'>
19
- <ControlSection {...args} />
20
- </ControlPage>
21
- ),
22
- decorators: [withTheme],
23
- parameters: {
24
- layout: 'centered',
25
- translations,
26
- },
27
- } satisfies Meta<typeof ControlSection>;
28
-
29
- export default meta;
30
-
31
- type Story = StoryObj<typeof meta>;
32
-
33
- export const Default: Story = {
34
- args: {
35
- title: 'Control Section',
36
- description: 'This is a control section',
37
- },
38
- };
@@ -1,153 +0,0 @@
1
- //
2
- // Copyright 2025 DXOS.org
3
- //
4
-
5
- import React, { type ComponentPropsWithoutRef, type PropsWithChildren } from 'react';
6
-
7
- import {
8
- Button,
9
- type ButtonProps,
10
- Input,
11
- type Label,
12
- type ThemedClassName,
13
- toLocalizedString,
14
- useTranslation,
15
- } from '@dxos/react-ui';
16
- import { StackItem } from '@dxos/react-ui-stack';
17
- import { mx } from '@dxos/react-ui-theme';
18
-
19
- import { translationKey } from '../../translations';
20
-
21
- export type ControlPageProps = ThemedClassName<ComponentPropsWithoutRef<'div'>>;
22
-
23
- export const ControlPage = ({ children, classNames, ...props }: ControlPageProps) => {
24
- return (
25
- <StackItem.Content scrollable classNames='[--control-spacing:var(--dx-trimMd)]'>
26
- <div role='none' className={mx('pli-cardSpacingInline pbe-trimLg', classNames)} {...props}>
27
- {children}
28
- </div>
29
- </StackItem.Content>
30
- );
31
- };
32
-
33
- export type ControlSectionProps = PropsWithChildren<{
34
- title: Label;
35
- description?: Label;
36
- }>;
37
-
38
- export const ControlSection = ({ title, description, children }: ControlSectionProps) => {
39
- return (
40
- <>
41
- <ControlSectionHeading title={title} description={description} />
42
- {children}
43
- </>
44
- );
45
- };
46
-
47
- export const ControlSectionHeading = ({ title, description }: Omit<ControlSectionProps, 'children'>) => {
48
- const { t } = useTranslation(translationKey);
49
- return (
50
- <>
51
- <h2 className='pli-trimMd container-max-width text-xl mbs-trimLg mbe-trimMd'>{toLocalizedString(title, t)}</h2>
52
- {description && (
53
- <p className='pli-trimMd mlb-trimMd container-max-width text-description'>
54
- {toLocalizedString(description, t)}
55
- </p>
56
- )}
57
- </>
58
- );
59
- };
60
-
61
- export const ControlGroupButton = ({ classNames, ...props }: ButtonProps) => {
62
- return <Button {...props} classNames={['md:col-span-2', classNames]} />;
63
- };
64
-
65
- export type ControlGroupProps = ThemedClassName<PropsWithChildren>;
66
-
67
- export const ControlGroup = ({ children, classNames }: ControlGroupProps) => (
68
- <div
69
- role='none'
70
- className={mx(
71
- 'group container-max-width grid grid-cols-1 md:grid-cols-[1fr_min-content] gap-trimMd',
72
- '[--control-spacing:0px] [&_input]:justify-self-end [&_button]:justify-self-end',
73
- classNames,
74
- )}
75
- >
76
- {children}
77
- </div>
78
- );
79
-
80
- export const ControlFrame = ({ children }: ControlGroupProps) => (
81
- <div
82
- role='none'
83
- className={mx(
84
- 'container-max-width grid grid-cols-1 md:grid-cols-[1fr_1fr] gap-trimSm md:gap-trimMd p-trimMd',
85
- 'border border-separator rounded-md',
86
- )}
87
- >
88
- {children}
89
- </div>
90
- );
91
-
92
- export const controlItemClasses = mx([
93
- 'container-max-width grid md:col-span-2 grid-cols-subgrid gap-trimSm items-center',
94
- // TODO(burdon): Use grid gap consistently or apply margins consistently?
95
- 'mlb-[--control-spacing] *:first:!mbs-0 *:last:!mbe-0 pli-trimMd plb-trimMd',
96
- 'border border-separator rounded-md',
97
- ]);
98
-
99
- const controlItemTitleClasses = 'mbe-0 text-lg text-baseText font-normal';
100
- const controlItemDescriptionClasses = 'mlb-trimSm md:mbe-0 text-base text-description';
101
-
102
- export type ControlItemProps = PropsWithChildren<{
103
- title: Label;
104
- description?: Label;
105
- }>;
106
-
107
- export const ControlItem = ({ title, description, children }: ControlItemProps) => {
108
- const { t } = useTranslation(translationKey);
109
-
110
- return (
111
- <div className={controlItemClasses}>
112
- <div role='none'>
113
- <h3 className={controlItemTitleClasses}>{toLocalizedString(title, t)}</h3>
114
- {description && <p className={controlItemDescriptionClasses}>{toLocalizedString(description, t)}</p>}
115
- </div>
116
- {children}
117
- </div>
118
- );
119
- };
120
-
121
- export const ControlItemInput = ({ title, description, children }: ControlItemProps) => {
122
- const { t } = useTranslation(translationKey);
123
-
124
- return (
125
- <Input.Root>
126
- <div className={controlItemClasses}>
127
- <div role='none'>
128
- <Input.Label classNames={controlItemTitleClasses}>{toLocalizedString(title, t)}</Input.Label>
129
- {description && (
130
- <Input.DescriptionAndValidation>
131
- <Input.Description classNames={controlItemDescriptionClasses}>
132
- {toLocalizedString(description, t)}
133
- </Input.Description>
134
- </Input.DescriptionAndValidation>
135
- )}
136
- </div>
137
- {children}
138
- </div>
139
- </Input.Root>
140
- );
141
- };
142
-
143
- export const ControlFrameItem = ({ title, description, children }: ControlItemProps) => {
144
- const { t } = useTranslation(translationKey);
145
-
146
- return (
147
- <div role='group' className='min-is-0'>
148
- <h3 className='text-lg mbe-2'>{toLocalizedString(title, t)}</h3>
149
- {description && <p className='mlb-trimSm md:mbe-0 text-description'>{toLocalizedString(description, t)}</p>}
150
- {children}
151
- </div>
152
- );
153
- };