@dxos/react-ui-form 0.8.4-main.fffef41 → 0.9.0
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.
- package/LICENSE +102 -5
- package/README.md +0 -1
- package/dist/lib/browser/index.mjs +4005 -2402
- package/dist/lib/browser/index.mjs.map +4 -4
- package/dist/lib/browser/meta.json +1 -1
- package/dist/lib/browser/translations.mjs +87 -0
- package/dist/lib/browser/translations.mjs.map +7 -0
- package/dist/lib/node-esm/index.mjs +4005 -2402
- package/dist/lib/node-esm/index.mjs.map +4 -4
- package/dist/lib/node-esm/meta.json +1 -1
- package/dist/lib/node-esm/translations.mjs +89 -0
- package/dist/lib/node-esm/translations.mjs.map +7 -0
- package/dist/types/src/components/FieldEditor/FieldEditor.d.ts +8 -7
- package/dist/types/src/components/FieldEditor/FieldEditor.d.ts.map +1 -1
- package/dist/types/src/components/FieldEditor/FieldEditor.stories.d.ts +73 -59
- package/dist/types/src/components/FieldEditor/FieldEditor.stories.d.ts.map +1 -1
- package/dist/types/src/components/Form/Form.d.ts +135 -27
- package/dist/types/src/components/Form/Form.d.ts.map +1 -1
- package/dist/types/src/components/Form/Form.stories.d.ts +192 -137
- package/dist/types/src/components/Form/Form.stories.d.ts.map +1 -1
- package/dist/types/src/components/Form/FormField.d.ts +52 -0
- package/dist/types/src/components/Form/FormField.d.ts.map +1 -0
- package/dist/types/src/components/Form/FormFieldComponent.d.ts +98 -0
- package/dist/types/src/components/Form/FormFieldComponent.d.ts.map +1 -0
- package/dist/types/src/components/Form/FormFieldComponent.stories.d.ts +9 -0
- package/dist/types/src/components/Form/FormFieldComponent.stories.d.ts.map +1 -0
- package/dist/types/src/components/Form/FormFieldSet.d.ts +26 -0
- package/dist/types/src/components/Form/FormFieldSet.d.ts.map +1 -0
- package/dist/types/src/components/Form/FormTooltipsContext.d.ts +19 -0
- package/dist/types/src/components/Form/FormTooltipsContext.d.ts.map +1 -0
- package/dist/types/src/components/Form/Layout/FormLayout.d.ts +50 -0
- package/dist/types/src/components/Form/Layout/FormLayout.d.ts.map +1 -0
- package/dist/types/src/components/Form/Layout/FormLayout.stories.d.ts +123 -0
- package/dist/types/src/components/Form/Layout/FormLayout.stories.d.ts.map +1 -0
- package/dist/types/src/components/Form/Layout/FormLayout.stories.test.d.ts +2 -0
- package/dist/types/src/components/Form/Layout/FormLayout.stories.test.d.ts.map +1 -0
- package/dist/types/src/components/Form/Layout/FormLayout.test.d.ts +2 -0
- package/dist/types/src/components/Form/Layout/FormLayout.test.d.ts.map +1 -0
- package/dist/types/src/components/Form/Layout/annotation.d.ts +30 -0
- package/dist/types/src/components/Form/Layout/annotation.d.ts.map +1 -0
- package/dist/types/src/components/Form/Layout/index.d.ts +4 -0
- package/dist/types/src/components/Form/Layout/index.d.ts.map +1 -0
- package/dist/types/src/components/Form/Layout/parser.d.ts +31 -0
- package/dist/types/src/components/Form/Layout/parser.d.ts.map +1 -0
- package/dist/types/src/components/Form/Layout/parser.test.d.ts +2 -0
- package/dist/types/src/components/Form/Layout/parser.test.d.ts.map +1 -0
- package/dist/types/src/components/Form/fields/ArrayField.d.ts +18 -0
- package/dist/types/src/components/Form/fields/ArrayField.d.ts.map +1 -0
- package/dist/types/src/components/Form/fields/BooleanField.d.ts +4 -0
- package/dist/types/src/components/Form/fields/BooleanField.d.ts.map +1 -0
- package/dist/types/src/components/Form/fields/DateField.d.ts +4 -0
- package/dist/types/src/components/Form/fields/DateField.d.ts.map +1 -0
- package/dist/types/src/components/Form/fields/GeoPointField.d.ts +5 -0
- package/dist/types/src/components/Form/fields/GeoPointField.d.ts.map +1 -0
- package/dist/types/src/components/Form/fields/InlineRefField.d.ts +13 -0
- package/dist/types/src/components/Form/fields/InlineRefField.d.ts.map +1 -0
- package/dist/types/src/components/Form/fields/MarkdownField.d.ts +11 -0
- package/dist/types/src/components/Form/fields/MarkdownField.d.ts.map +1 -0
- package/dist/types/src/components/Form/fields/MarkdownField.stories.d.ts +89 -0
- package/dist/types/src/components/Form/fields/MarkdownField.stories.d.ts.map +1 -0
- package/dist/types/src/components/Form/fields/NumberField.d.ts +4 -0
- package/dist/types/src/components/Form/fields/NumberField.d.ts.map +1 -0
- package/dist/types/src/components/Form/fields/RefField.d.ts +34 -0
- package/dist/types/src/components/Form/fields/RefField.d.ts.map +1 -0
- package/dist/types/src/components/Form/fields/RefField.test.d.ts +2 -0
- package/dist/types/src/components/Form/fields/RefField.test.d.ts.map +1 -0
- package/dist/types/src/components/Form/fields/SelectField.d.ts +13 -0
- package/dist/types/src/components/Form/fields/SelectField.d.ts.map +1 -0
- package/dist/types/src/components/Form/fields/SelectOptionField.d.ts +5 -0
- package/dist/types/src/components/Form/fields/SelectOptionField.d.ts.map +1 -0
- package/dist/types/src/components/Form/fields/SelectOptionField.stories.d.ts +89 -0
- package/dist/types/src/components/Form/fields/SelectOptionField.stories.d.ts.map +1 -0
- package/dist/types/src/components/Form/fields/TextAreaField.d.ts +4 -0
- package/dist/types/src/components/Form/fields/TextAreaField.d.ts.map +1 -0
- package/dist/types/src/components/Form/fields/TextField.d.ts +4 -0
- package/dist/types/src/components/Form/fields/TextField.d.ts.map +1 -0
- package/dist/types/src/components/Form/fields/TupleField.d.ts +6 -0
- package/dist/types/src/components/Form/fields/TupleField.d.ts.map +1 -0
- package/dist/types/src/components/Form/fields/index.d.ts +14 -0
- package/dist/types/src/components/Form/fields/index.d.ts.map +1 -0
- package/dist/types/src/components/Form/index.d.ts +5 -4
- package/dist/types/src/components/Form/index.d.ts.map +1 -1
- package/dist/types/src/components/Form/meta-tags.d.ts +30 -0
- package/dist/types/src/components/Form/meta-tags.d.ts.map +1 -0
- package/dist/types/src/components/Form/meta-tags.test.d.ts +2 -0
- package/dist/types/src/components/Form/meta-tags.test.d.ts.map +1 -0
- package/dist/types/src/components/ObjectForm/ObjectForm.d.ts +8 -0
- package/dist/types/src/components/ObjectForm/ObjectForm.d.ts.map +1 -0
- package/dist/types/src/components/ObjectForm/ObjectForm.stories.d.ts +87 -0
- package/dist/types/src/components/ObjectForm/ObjectForm.stories.d.ts.map +1 -0
- package/dist/types/src/components/ObjectForm/index.d.ts +2 -0
- package/dist/types/src/components/ObjectForm/index.d.ts.map +1 -0
- package/dist/types/src/components/ObjectPicker/ObjectPicker.d.ts +39 -12
- package/dist/types/src/components/ObjectPicker/ObjectPicker.d.ts.map +1 -1
- package/dist/types/src/components/ObjectPicker/ObjectPicker.stories.d.ts +69 -58
- package/dist/types/src/components/ObjectPicker/ObjectPicker.stories.d.ts.map +1 -1
- package/dist/types/src/components/ObjectProperties/ObjectProperties.d.ts +9 -0
- package/dist/types/src/components/ObjectProperties/ObjectProperties.d.ts.map +1 -0
- package/dist/types/src/components/ObjectProperties/ObjectProperties.stories.d.ts +132 -0
- package/dist/types/src/components/ObjectProperties/ObjectProperties.stories.d.ts.map +1 -0
- package/dist/types/src/components/ObjectProperties/ObjectProperties.test.d.ts +2 -0
- package/dist/types/src/components/ObjectProperties/ObjectProperties.test.d.ts.map +1 -0
- package/dist/types/src/components/ObjectProperties/index.d.ts +2 -0
- package/dist/types/src/components/ObjectProperties/index.d.ts.map +1 -0
- package/dist/types/src/components/ObjectTree/ObjectTree.d.ts +9 -0
- package/dist/types/src/components/ObjectTree/ObjectTree.d.ts.map +1 -0
- package/dist/types/src/components/ObjectTree/ObjectTree.stories.d.ts +91 -0
- package/dist/types/src/components/ObjectTree/ObjectTree.stories.d.ts.map +1 -0
- package/dist/types/src/components/ObjectTree/index.d.ts +2 -0
- package/dist/types/src/components/ObjectTree/index.d.ts.map +1 -0
- package/dist/types/src/components/RefEditor/RefEditor.d.ts +73 -0
- package/dist/types/src/components/RefEditor/RefEditor.d.ts.map +1 -0
- package/dist/types/src/components/RefEditor/RefEditor.stories.d.ts +92 -0
- package/dist/types/src/components/RefEditor/RefEditor.stories.d.ts.map +1 -0
- package/dist/types/src/components/RefEditor/index.d.ts +3 -0
- package/dist/types/src/components/RefEditor/index.d.ts.map +1 -0
- package/dist/types/src/components/RefEditor/ref-editor-extension.d.ts +47 -0
- package/dist/types/src/components/RefEditor/ref-editor-extension.d.ts.map +1 -0
- package/dist/types/src/components/Settings/Settings.d.ts +51 -0
- package/dist/types/src/components/Settings/Settings.d.ts.map +1 -0
- package/dist/types/src/components/Settings/Settings.stories.d.ts +89 -0
- package/dist/types/src/components/Settings/Settings.stories.d.ts.map +1 -0
- package/dist/types/src/components/Settings/SettingsFieldSet.d.ts +43 -0
- package/dist/types/src/components/Settings/SettingsFieldSet.d.ts.map +1 -0
- package/dist/types/src/components/Settings/SettingsItem.d.ts +16 -0
- package/dist/types/src/components/Settings/SettingsItem.d.ts.map +1 -0
- package/dist/types/src/components/Settings/SettingsSelectField.d.ts +18 -0
- package/dist/types/src/components/Settings/SettingsSelectField.d.ts.map +1 -0
- package/dist/types/src/components/Settings/index.d.ts +4 -0
- package/dist/types/src/components/Settings/index.d.ts.map +1 -0
- package/dist/types/src/components/ViewEditor/ViewEditor.d.ts +15 -19
- package/dist/types/src/components/ViewEditor/ViewEditor.d.ts.map +1 -1
- package/dist/types/src/components/ViewEditor/ViewEditor.stories.d.ts +75 -64
- package/dist/types/src/components/ViewEditor/ViewEditor.stories.d.ts.map +1 -1
- package/dist/types/src/components/index.d.ts +5 -1
- package/dist/types/src/components/index.d.ts.map +1 -1
- package/dist/types/src/components/testing.d.ts +13 -6
- package/dist/types/src/components/testing.d.ts.map +1 -1
- package/dist/types/src/hooks/index.d.ts +2 -3
- package/dist/types/src/hooks/index.d.ts.map +1 -1
- package/dist/types/src/hooks/useFormHandler.d.ts +82 -0
- package/dist/types/src/hooks/useFormHandler.d.ts.map +1 -0
- package/dist/types/src/hooks/useKeyHandler.d.ts +7 -0
- package/dist/types/src/hooks/useKeyHandler.d.ts.map +1 -0
- package/dist/types/src/index.d.ts +0 -2
- package/dist/types/src/index.d.ts.map +1 -1
- package/dist/types/src/translations.d.ts +70 -59
- package/dist/types/src/translations.d.ts.map +1 -1
- package/dist/types/src/util/field-type.d.ts +19 -0
- package/dist/types/src/util/field-type.d.ts.map +1 -0
- package/dist/types/src/util/field.d.ts +3 -3
- package/dist/types/src/util/field.d.ts.map +1 -1
- package/dist/types/src/util/formatting.d.ts +2 -2
- package/dist/types/src/util/formatting.d.ts.map +1 -1
- package/dist/types/src/util/index.d.ts +2 -1
- package/dist/types/src/util/index.d.ts.map +1 -1
- package/dist/types/src/util/properties.d.ts +35 -0
- package/dist/types/src/util/properties.d.ts.map +1 -0
- package/dist/types/src/util/properties.test.d.ts +2 -0
- package/dist/types/src/util/properties.test.d.ts.map +1 -0
- package/dist/types/src/util/refs.d.ts +2 -2
- package/dist/types/src/util/refs.d.ts.map +1 -1
- package/dist/types/tsconfig.tsbuildinfo +1 -1
- package/package.json +64 -52
- package/src/components/FieldEditor/FieldEditor.stories.tsx +44 -25
- package/src/components/FieldEditor/FieldEditor.test.tsx +4 -2
- package/src/components/FieldEditor/FieldEditor.tsx +91 -86
- package/src/components/Form/AUDIT.md +17 -0
- package/src/components/Form/Form.stories.tsx +147 -252
- package/src/components/Form/Form.tsx +461 -108
- package/src/components/Form/FormField.tsx +345 -0
- package/src/components/Form/FormFieldComponent.stories.tsx +65 -0
- package/src/components/Form/FormFieldComponent.tsx +253 -0
- package/src/components/Form/FormFieldSet.tsx +213 -0
- package/src/components/Form/FormTooltipsContext.ts +25 -0
- package/src/components/Form/Layout/FormLayout.stories.test.tsx +51 -0
- package/src/components/Form/Layout/FormLayout.stories.tsx +422 -0
- package/src/components/Form/Layout/FormLayout.test.ts +59 -0
- package/src/components/Form/Layout/FormLayout.tsx +251 -0
- package/src/components/Form/Layout/annotation.ts +38 -0
- package/src/components/Form/Layout/index.ts +7 -0
- package/src/components/Form/Layout/parser.test.ts +120 -0
- package/src/components/Form/Layout/parser.ts +167 -0
- package/src/components/Form/README.md +3 -0
- package/src/components/Form/fields/ArrayField.tsx +173 -0
- package/src/components/Form/fields/BooleanField.tsx +22 -0
- package/src/components/Form/fields/DateField.tsx +101 -0
- package/src/components/Form/fields/GeoPointField.tsx +124 -0
- package/src/components/Form/fields/InlineRefField.tsx +138 -0
- package/src/components/Form/fields/MarkdownField.stories.tsx +206 -0
- package/src/components/Form/fields/MarkdownField.tsx +167 -0
- package/src/components/Form/fields/NumberField.tsx +76 -0
- package/src/components/Form/fields/RefField.test.ts +45 -0
- package/src/components/Form/fields/RefField.tsx +266 -0
- package/src/components/Form/fields/SelectField.tsx +77 -0
- package/src/components/Form/{custom/SelectOptionsInput.stories.tsx → fields/SelectOptionField.stories.tsx} +23 -18
- package/src/components/Form/{custom/SelectOptionsInput.tsx → fields/SelectOptionField.tsx} +33 -26
- package/src/components/Form/fields/TextAreaField.tsx +38 -0
- package/src/components/Form/fields/TextField.tsx +38 -0
- package/src/components/Form/{custom/TupleInput.tsx → fields/TupleField.tsx} +17 -9
- package/src/components/Form/fields/index.ts +17 -0
- package/src/components/Form/index.ts +6 -4
- package/src/components/Form/meta-tags.test.ts +47 -0
- package/src/components/Form/meta-tags.ts +33 -0
- package/src/components/ObjectForm/ObjectForm.stories.tsx +62 -0
- package/src/components/ObjectForm/ObjectForm.tsx +111 -0
- package/src/components/{ControlSection → ObjectForm}/index.ts +1 -1
- package/src/components/ObjectPicker/ObjectPicker.stories.tsx +26 -21
- package/src/components/ObjectPicker/ObjectPicker.tsx +123 -82
- package/src/components/ObjectProperties/ObjectProperties.stories.tsx +350 -0
- package/src/components/ObjectProperties/ObjectProperties.test.tsx +111 -0
- package/src/components/ObjectProperties/ObjectProperties.tsx +146 -0
- package/src/components/ObjectProperties/index.ts +5 -0
- package/src/components/ObjectTree/ObjectTree.stories.tsx +134 -0
- package/src/components/ObjectTree/ObjectTree.tsx +190 -0
- package/src/components/ObjectTree/index.ts +5 -0
- package/src/components/RefEditor/RefEditor.stories.tsx +148 -0
- package/src/components/RefEditor/RefEditor.tsx +275 -0
- package/src/components/RefEditor/index.ts +6 -0
- package/src/components/RefEditor/ref-editor-extension.ts +254 -0
- package/src/components/Settings/AUDIT.md +51 -0
- package/src/components/Settings/Settings.stories.tsx +104 -0
- package/src/components/Settings/Settings.tsx +81 -0
- package/src/components/Settings/SettingsFieldSet.tsx +257 -0
- package/src/components/Settings/SettingsItem.tsx +58 -0
- package/src/components/Settings/SettingsSelectField.tsx +59 -0
- package/src/components/Settings/index.ts +7 -0
- package/src/components/ViewEditor/ViewEditor.stories.tsx +70 -76
- package/src/components/ViewEditor/ViewEditor.test.tsx +17 -13
- package/src/components/ViewEditor/ViewEditor.tsx +340 -226
- package/src/components/index.ts +5 -1
- package/src/components/testing.tsx +24 -11
- package/src/hooks/index.ts +2 -3
- package/src/hooks/useFormHandler.ts +380 -0
- package/src/hooks/useKeyHandler.tsx +37 -0
- package/src/index.ts +0 -4
- package/src/translations.ts +76 -64
- package/src/util/field-type.ts +60 -0
- package/src/util/field.ts +25 -25
- package/src/util/formatting.ts +22 -22
- package/src/util/index.ts +2 -1
- package/src/util/properties.test.ts +153 -0
- package/src/util/properties.ts +100 -0
- package/src/util/refs.ts +16 -15
- package/src/vite-env.d.ts +10 -0
- package/dist/types/src/components/ControlSection/ControlSection.d.ts +0 -23
- package/dist/types/src/components/ControlSection/ControlSection.d.ts.map +0 -1
- package/dist/types/src/components/ControlSection/ControlSection.stories.d.ts +0 -83
- package/dist/types/src/components/ControlSection/ControlSection.stories.d.ts.map +0 -1
- package/dist/types/src/components/ControlSection/index.d.ts +0 -2
- package/dist/types/src/components/ControlSection/index.d.ts.map +0 -1
- package/dist/types/src/components/Form/ArrayField.d.ts +0 -16
- package/dist/types/src/components/Form/ArrayField.d.ts.map +0 -1
- package/dist/types/src/components/Form/Defaults.d.ts +0 -14
- package/dist/types/src/components/Form/Defaults.d.ts.map +0 -1
- package/dist/types/src/components/Form/FormActions.d.ts +0 -9
- package/dist/types/src/components/Form/FormActions.d.ts.map +0 -1
- package/dist/types/src/components/Form/FormContent.d.ts +0 -63
- package/dist/types/src/components/Form/FormContent.d.ts.map +0 -1
- package/dist/types/src/components/Form/FormContext.d.ts +0 -23
- package/dist/types/src/components/Form/FormContext.d.ts.map +0 -1
- package/dist/types/src/components/Form/Input.d.ts +0 -29
- package/dist/types/src/components/Form/Input.d.ts.map +0 -1
- package/dist/types/src/components/Form/RefField.d.ts +0 -22
- package/dist/types/src/components/Form/RefField.d.ts.map +0 -1
- package/dist/types/src/components/Form/custom/GeoPointInput.d.ts +0 -4
- package/dist/types/src/components/Form/custom/GeoPointInput.d.ts.map +0 -1
- package/dist/types/src/components/Form/custom/SelectOptionsInput.d.ts +0 -4
- package/dist/types/src/components/Form/custom/SelectOptionsInput.d.ts.map +0 -1
- package/dist/types/src/components/Form/custom/SelectOptionsInput.stories.d.ts +0 -78
- package/dist/types/src/components/Form/custom/SelectOptionsInput.stories.d.ts.map +0 -1
- package/dist/types/src/components/Form/custom/TupleInput.d.ts +0 -6
- package/dist/types/src/components/Form/custom/TupleInput.d.ts.map +0 -1
- package/dist/types/src/components/Form/custom/index.d.ts +0 -4
- package/dist/types/src/components/Form/custom/index.d.ts.map +0 -1
- package/dist/types/src/components/Form/factory.d.ts +0 -8
- package/dist/types/src/components/Form/factory.d.ts.map +0 -1
- package/dist/types/src/hooks/useForm.d.ts +0 -67
- package/dist/types/src/hooks/useForm.d.ts.map +0 -1
- package/dist/types/src/hooks/useQueryRefOptions.d.ts +0 -29
- package/dist/types/src/hooks/useQueryRefOptions.d.ts.map +0 -1
- package/dist/types/src/hooks/useRefQueryLookupHandler.d.ts +0 -8
- package/dist/types/src/hooks/useRefQueryLookupHandler.d.ts.map +0 -1
- package/dist/types/src/util/schema.d.ts +0 -3
- package/dist/types/src/util/schema.d.ts.map +0 -1
- package/src/components/ControlSection/ControlSection.stories.tsx +0 -38
- package/src/components/ControlSection/ControlSection.tsx +0 -153
- package/src/components/Form/ArrayField.tsx +0 -125
- package/src/components/Form/Defaults.tsx +0 -205
- package/src/components/Form/FormActions.tsx +0 -54
- package/src/components/Form/FormContent.tsx +0 -362
- package/src/components/Form/FormContext.tsx +0 -110
- package/src/components/Form/Input.tsx +0 -54
- package/src/components/Form/RefField.tsx +0 -283
- package/src/components/Form/custom/GeoPointInput.tsx +0 -80
- package/src/components/Form/custom/index.ts +0 -7
- package/src/components/Form/factory.tsx +0 -31
- package/src/hooks/useForm.ts +0 -296
- package/src/hooks/useQueryRefOptions.ts +0 -62
- package/src/hooks/useRefQueryLookupHandler.ts +0 -39
- package/src/util/schema.ts +0 -12
|
@@ -1,154 +1,209 @@
|
|
|
1
1
|
import { type StoryObj } from '@storybook/react-vite';
|
|
2
2
|
import * as Schema from 'effect/Schema';
|
|
3
3
|
import React from 'react';
|
|
4
|
-
import {
|
|
5
|
-
import { type
|
|
6
|
-
import { type
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
4
|
+
import { Obj, Type } from '@dxos/echo';
|
|
5
|
+
import { type AnyProperties } from '@dxos/echo/internal';
|
|
6
|
+
import { type ExcludeId, type FormRootProps } from './Form';
|
|
7
|
+
declare const Organization: Type.Obj<{
|
|
8
|
+
readonly name: string;
|
|
9
|
+
}, Schema.Struct.Fields>;
|
|
10
|
+
export type Organization = Type.InstanceType<typeof Organization>;
|
|
11
|
+
declare const Person: Type.Obj<{
|
|
12
|
+
readonly name: string;
|
|
13
|
+
readonly ignore?: string | undefined;
|
|
14
|
+
readonly active?: boolean | undefined;
|
|
15
|
+
readonly address?: {
|
|
16
|
+
readonly street: string;
|
|
17
|
+
readonly city: string;
|
|
18
|
+
readonly state: string;
|
|
19
|
+
readonly zip: number;
|
|
20
|
+
} | undefined;
|
|
21
|
+
readonly employer?: import("@dxos/echo/internal").Ref<{
|
|
22
|
+
readonly name: string;
|
|
23
|
+
} & import("@dxos/echo/Entity").OfKind<import("@dxos/echo/internal").EntityKind.Object> & Obj.Unknown> | undefined;
|
|
24
|
+
readonly tags?: readonly import("@dxos/echo/internal").Ref<{
|
|
25
|
+
readonly label: string;
|
|
26
|
+
readonly hue?: string | undefined;
|
|
27
|
+
} & import("@dxos/echo/Entity").OfKind<import("@dxos/echo/internal").EntityKind.Object> & Obj.Unknown>[] | undefined;
|
|
28
|
+
readonly status?: "active" | "inactive" | undefined;
|
|
29
|
+
readonly notes?: string | undefined;
|
|
30
|
+
readonly location?: readonly [number, number, (number | undefined)?] | undefined;
|
|
31
|
+
readonly birthday?: string | undefined;
|
|
32
|
+
readonly meetingAt?: string | undefined;
|
|
33
|
+
readonly reminderAt?: string | undefined;
|
|
34
|
+
readonly tasks?: readonly string[] | undefined;
|
|
35
|
+
readonly locations?: readonly (readonly [number, number, (number | undefined)?])[] | undefined;
|
|
36
|
+
readonly identities?: readonly {
|
|
37
|
+
readonly type: string;
|
|
38
|
+
readonly value: string;
|
|
39
|
+
}[] | undefined;
|
|
40
|
+
}, Schema.Struct.Fields>;
|
|
41
|
+
export type Person = Type.InstanceType<typeof Person>;
|
|
42
|
+
type DefaultStoryProps<T extends AnyProperties> = {
|
|
43
|
+
schema?: Schema.Schema<T>;
|
|
44
|
+
} & FormRootProps<T>;
|
|
11
45
|
declare const meta: {
|
|
12
46
|
title: string;
|
|
13
|
-
component:
|
|
14
|
-
|
|
47
|
+
component: {
|
|
48
|
+
<T extends AnyProperties = AnyProperties>({ children, schema, values, onSave, onCancel, ...props }: FormRootProps<T>): React.JSX.Element;
|
|
49
|
+
displayName: string;
|
|
50
|
+
};
|
|
51
|
+
render: <T extends AnyProperties = AnyProperties>({ schema, values: valuesProp, ...props }: DefaultStoryProps<T>) => React.JSX.Element;
|
|
15
52
|
decorators: import("@storybook/react").Decorator[];
|
|
16
53
|
parameters: {
|
|
17
54
|
layout: string;
|
|
18
55
|
translations: [{
|
|
19
56
|
readonly 'en-US': {
|
|
20
|
-
readonly "react-ui-form": {
|
|
21
|
-
readonly '
|
|
22
|
-
readonly '
|
|
23
|
-
readonly '
|
|
24
|
-
readonly '
|
|
25
|
-
readonly 'field
|
|
26
|
-
readonly 'field
|
|
27
|
-
readonly 'field
|
|
28
|
-
readonly 'field
|
|
29
|
-
readonly '
|
|
30
|
-
readonly '
|
|
31
|
-
readonly '
|
|
32
|
-
readonly '
|
|
33
|
-
readonly 'boolean
|
|
34
|
-
readonly '
|
|
35
|
-
readonly '
|
|
36
|
-
readonly '
|
|
37
|
-
readonly '
|
|
38
|
-
readonly '
|
|
39
|
-
readonly '
|
|
40
|
-
readonly '
|
|
41
|
-
readonly '
|
|
42
|
-
readonly '
|
|
43
|
-
readonly '
|
|
44
|
-
readonly '
|
|
45
|
-
readonly '
|
|
46
|
-
readonly '
|
|
47
|
-
readonly '
|
|
48
|
-
readonly '
|
|
49
|
-
readonly '
|
|
50
|
-
readonly '
|
|
51
|
-
readonly '
|
|
52
|
-
readonly 'format
|
|
53
|
-
readonly 'format
|
|
54
|
-
readonly 'format
|
|
55
|
-
readonly 'format
|
|
56
|
-
readonly 'format
|
|
57
|
-
readonly 'format
|
|
58
|
-
readonly 'format
|
|
59
|
-
readonly 'format
|
|
60
|
-
readonly 'format
|
|
61
|
-
readonly 'format
|
|
62
|
-
readonly 'format
|
|
63
|
-
readonly 'format
|
|
64
|
-
readonly 'format
|
|
65
|
-
readonly 'format
|
|
66
|
-
readonly 'format
|
|
67
|
-
readonly 'format
|
|
68
|
-
readonly 'format
|
|
69
|
-
readonly '
|
|
70
|
-
readonly '
|
|
71
|
-
readonly 'select
|
|
72
|
-
readonly '
|
|
73
|
-
readonly '
|
|
74
|
-
readonly '
|
|
75
|
-
readonly '
|
|
76
|
-
readonly '
|
|
77
|
-
readonly '
|
|
57
|
+
readonly "@dxos/react-ui-form": {
|
|
58
|
+
readonly 'ref-editor.placeholder': "Type '@' to add a reference, or enter a value";
|
|
59
|
+
readonly 'ref-editor-auto.placeholder': 'Search by name, or enter a value';
|
|
60
|
+
readonly 'fields.label': 'Fields';
|
|
61
|
+
readonly 'hidden-fields.label': 'Hidden Fields';
|
|
62
|
+
readonly 'empty-readonly-ref-field.label': '(none)';
|
|
63
|
+
readonly 'field-property.label': 'Property';
|
|
64
|
+
readonly 'field-property.placeholder': 'Property name';
|
|
65
|
+
readonly 'field-format.label': 'Type';
|
|
66
|
+
readonly 'field-path.label': 'Field path';
|
|
67
|
+
readonly 'remove-item.button': 'Delete item';
|
|
68
|
+
readonly 'add-item.button': 'Add item';
|
|
69
|
+
readonly 'add-property-button.label': 'Add property';
|
|
70
|
+
readonly 'boolean-input-true.value': 'Yes';
|
|
71
|
+
readonly 'boolean-input-false.value': 'No';
|
|
72
|
+
readonly 'show-field.label': 'Show field';
|
|
73
|
+
readonly 'hide-field.label': 'Hide field';
|
|
74
|
+
readonly 'expand-fields.label': 'Expand';
|
|
75
|
+
readonly 'collapse-fields.label': 'Collapse';
|
|
76
|
+
readonly 'delete-field.label': 'Delete field';
|
|
77
|
+
readonly 'create-option.label': 'Create';
|
|
78
|
+
readonly 'add-tag.label': 'Add tag';
|
|
79
|
+
readonly 'ref-field-combobox-input.placeholder': 'Search\u2026';
|
|
80
|
+
readonly 'ref-field.placeholder': 'Select\u2026';
|
|
81
|
+
readonly 'ref-field.placeholder_one': 'Select\u2026';
|
|
82
|
+
readonly 'ref-field.placeholder_other': 'Select items\u2026';
|
|
83
|
+
readonly 'example.placeholder': 'Example';
|
|
84
|
+
readonly 'latitude.placeholder': 'Latitude (e.g., 40.7128)';
|
|
85
|
+
readonly 'longitude.placeholder': 'Longitude (e.g., -74.0060)';
|
|
86
|
+
readonly 'cancel-button.label': 'Cancel';
|
|
87
|
+
readonly 'save-button.label': 'Save';
|
|
88
|
+
readonly 'create-text.label': 'Create text';
|
|
89
|
+
readonly 'format.boolean.label': 'Boolean';
|
|
90
|
+
readonly 'format.currency.label': 'Currency';
|
|
91
|
+
readonly 'format.date.label': 'Date';
|
|
92
|
+
readonly 'format.date-time.label': 'DateTime';
|
|
93
|
+
readonly 'format.did.label': 'DID';
|
|
94
|
+
readonly 'format.duration.label': 'Duration';
|
|
95
|
+
readonly 'format.dxn.label': 'DXN';
|
|
96
|
+
readonly 'format.email.label': 'Email';
|
|
97
|
+
readonly 'format.formula.label': 'Formula';
|
|
98
|
+
readonly 'format.hostname.label': 'Hostname';
|
|
99
|
+
readonly 'format.integer.label': 'Integer';
|
|
100
|
+
readonly 'format.json.label': 'JSON';
|
|
101
|
+
readonly 'format.lnglat.label': 'Geopoint';
|
|
102
|
+
readonly 'format.markdown.label': 'Markdown';
|
|
103
|
+
readonly 'format.percent.label': 'Percent';
|
|
104
|
+
readonly 'format.ref.label': 'Reference';
|
|
105
|
+
readonly 'format.regex.label': 'RegExp';
|
|
106
|
+
readonly 'format.string.label': 'String';
|
|
107
|
+
readonly 'format.single-select.label': 'Select';
|
|
108
|
+
readonly 'format.multi-select.label': 'Multi-select';
|
|
109
|
+
readonly 'format.text.label': 'Long text';
|
|
110
|
+
readonly 'format.time.label': 'Time';
|
|
111
|
+
readonly 'format.timestamp.label': 'Timestamp';
|
|
112
|
+
readonly 'format.user.label': 'User';
|
|
113
|
+
readonly 'format.number.label': 'Number';
|
|
114
|
+
readonly 'format.uri.label': 'URI';
|
|
115
|
+
readonly 'format.url.label': 'URL';
|
|
116
|
+
readonly 'format.uuid.label': 'UUID';
|
|
117
|
+
readonly 'latitude.label': 'Latitude';
|
|
118
|
+
readonly 'longitude.label': 'Longitude';
|
|
119
|
+
readonly 'select-option.label': 'Label';
|
|
120
|
+
readonly 'select-option-label.placeholder': 'Option label';
|
|
121
|
+
readonly 'select-option-delete.button': 'Delete';
|
|
122
|
+
readonly 'select-option-add.button': 'Add option';
|
|
123
|
+
readonly 'system-schema.title': 'System type';
|
|
124
|
+
readonly 'system-schema.description': 'System type: cannot add or remove fields.';
|
|
125
|
+
readonly 'remove.button': 'Delete';
|
|
78
126
|
};
|
|
79
127
|
};
|
|
80
128
|
}];
|
|
81
129
|
};
|
|
82
|
-
argTypes: {
|
|
83
|
-
readonly: {
|
|
84
|
-
control: "boolean";
|
|
85
|
-
description: string;
|
|
86
|
-
};
|
|
87
|
-
};
|
|
88
130
|
};
|
|
89
131
|
export default meta;
|
|
90
|
-
type Story = StoryObj<
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
}
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
}
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
132
|
+
type Story<T extends AnyProperties> = StoryObj<DefaultStoryProps<T>>;
|
|
133
|
+
declare const PersonSchema: Schema.Schema<{
|
|
134
|
+
readonly name: string;
|
|
135
|
+
readonly ignore?: string | undefined;
|
|
136
|
+
readonly active?: boolean | undefined;
|
|
137
|
+
readonly address?: {
|
|
138
|
+
readonly street: string;
|
|
139
|
+
readonly city: string;
|
|
140
|
+
readonly state: string;
|
|
141
|
+
readonly zip: number;
|
|
142
|
+
} | undefined;
|
|
143
|
+
readonly employer?: import("@dxos/echo/internal").Ref<{
|
|
144
|
+
readonly name: string;
|
|
145
|
+
} & import("@dxos/echo/Entity").OfKind<import("@dxos/echo/internal").EntityKind.Object> & Obj.Unknown> | undefined;
|
|
146
|
+
readonly tags?: readonly import("@dxos/echo/internal").Ref<{
|
|
147
|
+
readonly label: string;
|
|
148
|
+
readonly hue?: string | undefined;
|
|
149
|
+
} & import("@dxos/echo/Entity").OfKind<import("@dxos/echo/internal").EntityKind.Object> & Obj.Unknown>[] | undefined;
|
|
150
|
+
readonly status?: "active" | "inactive" | undefined;
|
|
151
|
+
readonly notes?: string | undefined;
|
|
152
|
+
readonly location?: readonly [number, number, (number | undefined)?] | undefined;
|
|
153
|
+
readonly birthday?: string | undefined;
|
|
154
|
+
readonly meetingAt?: string | undefined;
|
|
155
|
+
readonly reminderAt?: string | undefined;
|
|
156
|
+
readonly tasks?: readonly string[] | undefined;
|
|
157
|
+
readonly locations?: readonly (readonly [number, number, (number | undefined)?])[] | undefined;
|
|
158
|
+
readonly identities?: readonly {
|
|
159
|
+
readonly type: string;
|
|
160
|
+
readonly value: string;
|
|
161
|
+
}[] | undefined;
|
|
162
|
+
} & import("@dxos/echo/Entity").OfKind<import("@dxos/echo/internal").EntityKind.Object>, {
|
|
163
|
+
readonly name: string;
|
|
164
|
+
readonly ignore?: string | undefined;
|
|
165
|
+
readonly active?: boolean | undefined;
|
|
166
|
+
readonly address?: {
|
|
167
|
+
readonly street: string;
|
|
168
|
+
readonly city: string;
|
|
169
|
+
readonly state: string;
|
|
170
|
+
readonly zip: number;
|
|
171
|
+
} | undefined;
|
|
172
|
+
readonly employer?: import("@dxos/echo/internal").Ref<{
|
|
173
|
+
readonly name: string;
|
|
174
|
+
} & import("@dxos/echo/Entity").OfKind<import("@dxos/echo/internal").EntityKind.Object> & Obj.Unknown> | undefined;
|
|
175
|
+
readonly tags?: readonly import("@dxos/echo/internal").Ref<{
|
|
176
|
+
readonly label: string;
|
|
177
|
+
readonly hue?: string | undefined;
|
|
178
|
+
} & import("@dxos/echo/Entity").OfKind<import("@dxos/echo/internal").EntityKind.Object> & Obj.Unknown>[] | undefined;
|
|
179
|
+
readonly status?: "active" | "inactive" | undefined;
|
|
180
|
+
readonly notes?: string | undefined;
|
|
181
|
+
readonly location?: readonly [number, number, (number | undefined)?] | undefined;
|
|
182
|
+
readonly birthday?: string | undefined;
|
|
183
|
+
readonly meetingAt?: string | undefined;
|
|
184
|
+
readonly reminderAt?: string | undefined;
|
|
185
|
+
readonly tasks?: readonly string[] | undefined;
|
|
186
|
+
readonly locations?: readonly (readonly [number, number, (number | undefined)?])[] | undefined;
|
|
187
|
+
readonly identities?: readonly {
|
|
188
|
+
readonly type: string;
|
|
189
|
+
readonly value: string;
|
|
190
|
+
}[] | undefined;
|
|
191
|
+
} & import("@dxos/echo/Entity").OfKind<import("@dxos/echo/internal").EntityKind.Object>, never>;
|
|
192
|
+
/**
|
|
193
|
+
* Build a data-entry surface by handing an Effect schema to `Form.Root` — the form derives its fields,
|
|
194
|
+
* types, validation, and selects from the schema, so you don't hand-wire one control per property.
|
|
195
|
+
* Customize individual fields with `fieldMap` (keyed by JSON path), render discriminated unions
|
|
196
|
+
* conditionally via the discriminator, and label ref-picker options by their parent object with
|
|
197
|
+
* `ParentLabelAnnotation`.
|
|
198
|
+
*
|
|
199
|
+
* @idiom org.dxos.react-ui-form.schemaForm
|
|
200
|
+
* applies: Any data-entry section bound to an Effect schema — settings, object/article editors, create dialogs
|
|
201
|
+
* instead-of: Hand-wiring Input/Select/Switch controls per field in bespoke React
|
|
202
|
+
* uses: {@link Form.Root}, {@link Form.FieldSet}
|
|
203
|
+
* related: org.dxos.react-ui-menu.toolbarMenu
|
|
204
|
+
*/
|
|
205
|
+
export declare const Default: Story<ExcludeId<typeof PersonSchema>>;
|
|
206
|
+
export declare const Readonly: Story<ExcludeId<typeof PersonSchema>>;
|
|
207
|
+
export declare const Static: Story<ExcludeId<typeof PersonSchema>>;
|
|
208
|
+
export declare const Empty: Story<ExcludeId<typeof PersonSchema>>;
|
|
154
209
|
//# sourceMappingURL=Form.stories.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Form.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/Form.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAa,KAAK,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjE,OAAO,KAAK,MAAM,MAAM,eAAe,CAAC;AACxC,OAAO,KAAgC,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"Form.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/Form.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAa,KAAK,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjE,OAAO,KAAK,MAAM,MAAM,eAAe,CAAC;AACxC,OAAO,KAAgC,MAAM,OAAO,CAAC;AAErD,OAAO,EAA2B,GAAG,EAAY,IAAI,EAAE,MAAM,YAAY,CAAC;AAC1E,OAAO,EAAE,KAAK,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAUzD,OAAO,EAAE,KAAK,SAAS,EAAQ,KAAK,aAAa,EAAU,MAAM,QAAQ,CAAC;AAE1E,QAAA,MAAM,YAAY;;wBAE0D,CAAC;AAE7E,MAAM,MAAM,YAAY,GAAG,IAAI,CAAC,YAAY,CAAC,OAAO,YAAY,CAAC,CAAC;AAElE,QAAA,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wBAoCuD,CAAC;AAEpE,MAAM,MAAM,MAAM,GAAG,IAAI,CAAC,YAAY,CAAC,OAAO,MAAM,CAAC,CAAC;AAEtD,KAAK,iBAAiB,CAAC,CAAC,SAAS,aAAa,IAAI;IAChD,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;CAC3B,GAAG,aAAa,CAAC,CAAC,CAAC,CAAC;AAgDrB,QAAA,MAAM,IAAI;;;;;;aA9CY,CAAC,SAAS,aAAa,4DAI1C,iBAAiB,CAAC,CAAC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiEiB,CAAC;eAE1B,IAAI;AAEnB,KAAK,KAAK,CAAC,CAAC,SAAS,aAAa,IAAI,QAAQ,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,CAAC;AAErE,QAAA,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+FAAyB,CAAC;AAW5C;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC,OAAO,YAAY,CAAC,CAMzD,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,OAAO,YAAY,CAAC,CAM1D,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC,OAAO,YAAY,CAAC,CAMxD,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC,OAAO,YAAY,CAAC,CAEvD,CAAC"}
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
import * as SchemaAST from 'effect/SchemaAST';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import { IconButtonProps } from '@dxos/react-ui';
|
|
4
|
+
import { type ProjectionModel } from '@dxos/schema';
|
|
5
|
+
import { type RefFieldProps } from './fields';
|
|
6
|
+
import { type FormFieldComponentProps, type FormFieldMap, type FormFieldProvider } from './FormFieldComponent';
|
|
7
|
+
export type FormFieldProps = {
|
|
8
|
+
/**
|
|
9
|
+
* AST of the property to render.
|
|
10
|
+
*/
|
|
11
|
+
type: SchemaAST.AST;
|
|
12
|
+
/**
|
|
13
|
+
* Name of the property. Used to derive a default label
|
|
14
|
+
* (`title ?? capitalize(name)`) and as the projection lookup key. Pass
|
|
15
|
+
* `null` to suppress the header label entirely -- the form still renders
|
|
16
|
+
* the field/struct, but `FormFieldSet`'s top-level `<FormFieldLabel>` is
|
|
17
|
+
* skipped. Used by `ArrayField` for object-array items, where every item
|
|
18
|
+
* would otherwise repeat the array's parent name.
|
|
19
|
+
*/
|
|
20
|
+
name: string | null;
|
|
21
|
+
/**
|
|
22
|
+
* Path to the current object from the root. Used with nested forms.
|
|
23
|
+
*/
|
|
24
|
+
path?: (string | number)[];
|
|
25
|
+
/**
|
|
26
|
+
* Optional projection for projection-based field management.
|
|
27
|
+
*/
|
|
28
|
+
projection?: ProjectionModel;
|
|
29
|
+
/**
|
|
30
|
+
* Map of custom renderers for specific properties.
|
|
31
|
+
* Prefer fieldProvider for plugin specific input surfaces.
|
|
32
|
+
*/
|
|
33
|
+
fieldMap?: FormFieldMap;
|
|
34
|
+
/**
|
|
35
|
+
* Function to lookup custom renderers for specific properties.
|
|
36
|
+
*/
|
|
37
|
+
fieldProvider?: FormFieldProvider;
|
|
38
|
+
/**
|
|
39
|
+
* Typename of the ref type that the create props apply to.
|
|
40
|
+
* When set, createOptionLabel/createOptionIcon/createInitialValuePath/createFieldMap/onCreate
|
|
41
|
+
* are only passed to ref fields whose typename matches.
|
|
42
|
+
*/
|
|
43
|
+
createTypename?: string;
|
|
44
|
+
} & Pick<FormFieldComponentProps, 'autoFocus' | 'readonly' | 'layout'> & Pick<RefFieldProps, 'createOptionLabel' | 'createOptionIcon' | 'createInitialValuePath' | 'createFieldMap' | 'db' | 'useType' | 'getOptions' | 'onCreate'>;
|
|
45
|
+
export declare function FormField(props: FormFieldProps): React.JSX.Element | null;
|
|
46
|
+
export declare namespace FormField {
|
|
47
|
+
var displayName: string;
|
|
48
|
+
}
|
|
49
|
+
export declare const IconBlock: ({ inline, ...props }: IconButtonProps & {
|
|
50
|
+
inline?: boolean;
|
|
51
|
+
}) => React.JSX.Element;
|
|
52
|
+
//# sourceMappingURL=FormField.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FormField.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/FormField.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,SAAS,MAAM,kBAAkB,CAAC;AAE9C,OAAO,KAAkB,MAAM,OAAO,CAAC;AAIvC,OAAO,EAAc,eAAe,EAAkB,MAAM,gBAAgB,CAAC;AAC7E,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,cAAc,CAAC;AAMpD,OAAO,EASL,KAAK,aAAa,EAInB,MAAM,UAAU,CAAC;AAElB,OAAO,EAEL,KAAK,uBAAuB,EAC5B,KAAK,YAAY,EACjB,KAAK,iBAAiB,EACvB,MAAM,sBAAsB,CAAC;AAG9B,MAAM,MAAM,cAAc,GAAG;IAC3B;;OAEG;IACH,IAAI,EAAE,SAAS,CAAC,GAAG,CAAC;IAEpB;;;;;;;OAOG;IACH,IAAI,EAAE,MAAM,GAAG,IAAI,CAAC;IAEpB;;OAEG;IACH,IAAI,CAAC,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,CAAC;IAE3B;;OAEG;IACH,UAAU,CAAC,EAAE,eAAe,CAAC;IAE7B;;;OAGG;IACH,QAAQ,CAAC,EAAE,YAAY,CAAC;IAExB;;OAEG;IACH,aAAa,CAAC,EAAE,iBAAiB,CAAC;IAElC;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,GAAG,IAAI,CAAC,uBAAuB,EAAE,WAAW,GAAG,UAAU,GAAG,QAAQ,CAAC,GACpE,IAAI,CACF,aAAa,EACX,mBAAmB,GACnB,kBAAkB,GAClB,wBAAwB,GACxB,gBAAgB,GAChB,IAAI,GACJ,SAAS,GACT,YAAY,GACZ,UAAU,CACb,CAAC;kCAEsB,KAAK,EAAE,cAAc;;;;AAiM/C,eAAO,MAAM,SAAS,yBAA0B,eAAe,GAAG;IAAE,MAAM,CAAC,EAAE,OAAO,CAAA;CAAE,sBAMrF,CAAC"}
|
|
@@ -0,0 +1,98 @@
|
|
|
1
|
+
import type * as Schema from 'effect/Schema';
|
|
2
|
+
import type * as SchemaAST from 'effect/SchemaAST';
|
|
3
|
+
import React, { Component, type FC, type FocusEvent, type PropsWithChildren, type ReactElement, type ReactNode } from 'react';
|
|
4
|
+
import { type Database, Format } from '@dxos/echo';
|
|
5
|
+
import { ThemedClassName } from '@dxos/react-ui';
|
|
6
|
+
import { type FormFieldStatus } from '../../hooks';
|
|
7
|
+
/**
|
|
8
|
+
* Dynamic props passed to input components.
|
|
9
|
+
*/
|
|
10
|
+
export type FormFieldStateProps<T = any> = {
|
|
11
|
+
getStatus: () => FormFieldStatus;
|
|
12
|
+
getValue: () => T | undefined;
|
|
13
|
+
onBlur: (event: FocusEvent<HTMLElement>) => void;
|
|
14
|
+
onValueChange: (type: SchemaAST.AST, value: T) => void;
|
|
15
|
+
};
|
|
16
|
+
/**
|
|
17
|
+
* Presentation mode.
|
|
18
|
+
* - full: Show label, control, and status.
|
|
19
|
+
* - compact: Show label and control.
|
|
20
|
+
* - inline: Control only.
|
|
21
|
+
* - static: Plain DOM; omit all undefined values.
|
|
22
|
+
*/
|
|
23
|
+
export type Presentation = 'full' | 'compact' | 'inline' | 'static';
|
|
24
|
+
/**
|
|
25
|
+
* Props passed to input components.
|
|
26
|
+
*/
|
|
27
|
+
export type FormFieldComponentProps<T = any> = {
|
|
28
|
+
/** Database the form is editing against; populated for fields whose value is an ECHO object/Ref. */
|
|
29
|
+
db?: Database.Database;
|
|
30
|
+
type: SchemaAST.AST;
|
|
31
|
+
format?: Format.TypeFormat;
|
|
32
|
+
readonly?: boolean;
|
|
33
|
+
label: string;
|
|
34
|
+
/**
|
|
35
|
+
* Dotted JSON path of this field within the form values (e.g.
|
|
36
|
+
* `runtime.client.storage.persistent`). Forwarded to `FormFieldLabel` so
|
|
37
|
+
* that it can render the path as a debug hint when the enclosing
|
|
38
|
+
* `Form.Root` has `debug` enabled.
|
|
39
|
+
*/
|
|
40
|
+
jsonPath?: string;
|
|
41
|
+
placeholder?: string;
|
|
42
|
+
autoFocus?: boolean;
|
|
43
|
+
layout?: Presentation;
|
|
44
|
+
} & FormFieldStateProps<T>;
|
|
45
|
+
export type FormFieldComponent = FC<FormFieldComponentProps>;
|
|
46
|
+
export type FormFieldMap = Record<string, FormFieldComponent>;
|
|
47
|
+
export type FormFieldProvider = (props: {
|
|
48
|
+
prop: string;
|
|
49
|
+
schema: Schema.Schema<any>;
|
|
50
|
+
fieldProps: FormFieldComponentProps;
|
|
51
|
+
}) => ReactElement | null | undefined;
|
|
52
|
+
export type FormFieldLabelProps = ThemedClassName<{
|
|
53
|
+
asChild?: boolean;
|
|
54
|
+
error?: string;
|
|
55
|
+
/**
|
|
56
|
+
* JSON path of the field this label describes (e.g. `runtime.client.storage.persistent`).
|
|
57
|
+
* Surfaced as a hover tooltip on the label when the enclosing `Form.Root`
|
|
58
|
+
* has `tooltips` enabled (the default) -- useful for spotting which field
|
|
59
|
+
* maps to which path when authoring schemas or filing bugs against a form.
|
|
60
|
+
* Callers can supply the path unconditionally; the label suppresses the
|
|
61
|
+
* tooltip when `Form.Root tooltips={false}`.
|
|
62
|
+
*/
|
|
63
|
+
path?: string;
|
|
64
|
+
/**
|
|
65
|
+
* Trailing button rendered at the end of the label row (third grid column).
|
|
66
|
+
* Used by nested-object field sets to surface a collapse toggle.
|
|
67
|
+
*/
|
|
68
|
+
button?: ReactNode;
|
|
69
|
+
onClick?: () => void;
|
|
70
|
+
} & Pick<FormFieldComponentProps, 'label' | 'readonly'>>;
|
|
71
|
+
export declare function FormFieldLabel({ classNames, label, error, readonly, asChild, path, button, onClick }: FormFieldLabelProps): React.JSX.Element;
|
|
72
|
+
export declare namespace FormFieldLabel {
|
|
73
|
+
var displayName: string;
|
|
74
|
+
}
|
|
75
|
+
export type FormFieldWrapperProps<T = any> = Pick<FormFieldComponentProps, 'readonly' | 'label' | 'layout' | 'getStatus' | 'getValue' | 'jsonPath' | 'format'> & {
|
|
76
|
+
children?: (props: {
|
|
77
|
+
value: T;
|
|
78
|
+
}) => ReactNode;
|
|
79
|
+
};
|
|
80
|
+
export declare const FormFieldWrapper: <T>(props: FormFieldWrapperProps<T>) => React.JSX.Element | null;
|
|
81
|
+
type FormFieldErrorState = {
|
|
82
|
+
error: Error | undefined;
|
|
83
|
+
};
|
|
84
|
+
type FormFieldErrorBoundaryProps = PropsWithChildren<{
|
|
85
|
+
path?: (string | number)[];
|
|
86
|
+
}>;
|
|
87
|
+
export declare class FormFieldErrorBoundary extends Component<FormFieldErrorBoundaryProps, FormFieldErrorState> {
|
|
88
|
+
static getDerivedStateFromError(error: Error): {
|
|
89
|
+
error: Error;
|
|
90
|
+
};
|
|
91
|
+
state: {
|
|
92
|
+
error: undefined;
|
|
93
|
+
};
|
|
94
|
+
componentDidUpdate(prevProps: FormFieldErrorBoundaryProps): void;
|
|
95
|
+
render(): string | number | bigint | boolean | React.JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | Iterable<ReactNode> | ReactElement<unknown, string | React.JSXElementConstructor<any>> | React.ReactPortal | null | undefined> | null | undefined;
|
|
96
|
+
private resetError;
|
|
97
|
+
}
|
|
98
|
+
//# sourceMappingURL=FormFieldComponent.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FormFieldComponent.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/FormFieldComponent.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { type Meta, type StoryObj } from '@storybook/react-vite';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import { type FormFieldComponentProps } from './FormFieldComponent';
|
|
4
|
+
declare const DefaultStory: ({ type, placeholder, readonly, onBlur, onValueChange, ...props }: FormFieldComponentProps<string>) => React.JSX.Element;
|
|
5
|
+
declare const meta: Meta<typeof DefaultStory>;
|
|
6
|
+
export default meta;
|
|
7
|
+
type Story = StoryObj<typeof meta>;
|
|
8
|
+
export declare const Default: Story;
|
|
9
|
+
//# sourceMappingURL=FormFieldComponent.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FormFieldComponent.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/FormFieldComponent.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,IAAI,EAAE,KAAK,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjE,OAAO,KAAwC,MAAM,OAAO,CAAC;AAK7D,OAAO,EAAE,KAAK,uBAAuB,EAAoB,MAAM,sBAAsB,CAAC;AAEtF,QAAA,MAAM,YAAY,qEAOf,uBAAuB,CAAC,MAAM,CAAC,sBAsBjC,CAAC;AAEF,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,YAAY,CAOnC,CAAC;eAEa,IAAI;AAEnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAQrB,CAAC"}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { type AnyProperties } from '@dxos/echo/internal';
|
|
3
|
+
import { SchemaEx } from '@dxos/effect';
|
|
4
|
+
import { type FormHandlerProps } from '../../hooks';
|
|
5
|
+
import { type FormFieldProps } from './FormField';
|
|
6
|
+
export type FormFieldSetProps<T extends AnyProperties> = {
|
|
7
|
+
label?: string;
|
|
8
|
+
sort?: string[];
|
|
9
|
+
/**
|
|
10
|
+
* When set, renders a toggle button at the end of the label row that
|
|
11
|
+
* shows/hides the field set body. Used for nested objects.
|
|
12
|
+
*/
|
|
13
|
+
collapsible?: boolean;
|
|
14
|
+
exclude?: (props: SchemaEx.SchemaProperty[]) => SchemaEx.SchemaProperty[];
|
|
15
|
+
/**
|
|
16
|
+
* Picks a named layout out of `FormLayoutAnnotation` when present.
|
|
17
|
+
* Falls back to `'default'`. Ignored when the schema has no annotation
|
|
18
|
+
* (linear rendering then takes over).
|
|
19
|
+
*/
|
|
20
|
+
layoutName?: string;
|
|
21
|
+
} & Pick<FormHandlerProps<T>, 'schema'> & Pick<FormFieldProps, 'path' | 'autoFocus' | 'readonly' | 'layout' | 'projection' | 'fieldMap' | 'fieldProvider' | 'createTypename' | 'createOptionLabel' | 'createOptionIcon' | 'createInitialValuePath' | 'createFieldMap' | 'db' | 'useType' | 'getOptions' | 'onCreate'>;
|
|
22
|
+
export declare function FormFieldSet({ label, schema, readonly, path, sort, collapsible, exclude, projection, layout, layoutName, ...props }: FormFieldSetProps<any>): React.JSX.Element | null;
|
|
23
|
+
export declare namespace FormFieldSet {
|
|
24
|
+
var displayName: string;
|
|
25
|
+
}
|
|
26
|
+
//# sourceMappingURL=FormFieldSet.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FormFieldSet.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/FormFieldSet.tsx"],"names":[],"mappings":"AAKA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAEjD,OAAO,EAAE,KAAK,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAMxC,OAAO,EAAE,KAAK,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAGpD,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,aAAa,CAAC;AAM7D,MAAM,MAAM,iBAAiB,CAAC,CAAC,SAAS,aAAa,IAAI;IACvD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC;IAChB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,QAAQ,CAAC,cAAc,EAAE,KAAK,QAAQ,CAAC,cAAc,EAAE,CAAC;IAC1E;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB,GAAG,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,EAAE,QAAQ,CAAC,GACrC,IAAI,CACF,cAAc,EACZ,MAAM,GACN,WAAW,GACX,UAAU,GACV,QAAQ,GACR,YAAY,GACZ,UAAU,GACV,eAAe,GACf,gBAAgB,GAChB,mBAAmB,GACnB,kBAAkB,GAClB,wBAAwB,GACxB,gBAAgB,GAChB,IAAI,GACJ,SAAS,GACT,YAAY,GACZ,UAAU,CACb,CAAC;qCAKyB,EAC3B,KAAK,EACL,MAAM,EACN,QAAQ,EACR,IAAI,EACJ,IAAI,EACJ,WAAW,EACX,OAAO,EACP,UAAU,EACV,MAAM,EACN,UAAgC,EAChC,GAAG,KAAK,EACT,EAAE,iBAAiB,CAAC,GAAG,CAAC"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* A standalone context for the `tooltips` flag (Form.Root's only label
|
|
3
|
+
* decoration today: a JSON-path hover tooltip rendered by
|
|
4
|
+
* `FormFieldLabel`).
|
|
5
|
+
*
|
|
6
|
+
* Lives in its own module so that `FormFieldComponent.tsx` -- imported at
|
|
7
|
+
* the top of `Form.tsx` -- can read the flag without re-importing from
|
|
8
|
+
* `Form.tsx`. That round-trip used to create a circular module-eval
|
|
9
|
+
* dependency that intermittently hit a TDZ ("Cannot access 'FormFieldLabel'
|
|
10
|
+
* before initialization") in browser-mode storybook tests.
|
|
11
|
+
*
|
|
12
|
+
* Defaults to `true` both when `Form.Root` doesn't pass an explicit value
|
|
13
|
+
* AND when there is no enclosing `Form.Root` (e.g. `FormFieldWrapper`
|
|
14
|
+
* stories that render an input without a Form provider).
|
|
15
|
+
*/
|
|
16
|
+
export declare const FormTooltipsContext: import("react").Context<boolean>;
|
|
17
|
+
/** Returns whether the enclosing `Form.Root` has field tooltips enabled. */
|
|
18
|
+
export declare const useFormTooltips: () => boolean;
|
|
19
|
+
//# sourceMappingURL=FormTooltipsContext.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FormTooltipsContext.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/FormTooltipsContext.ts"],"names":[],"mappings":"AAMA;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,mBAAmB,kCAA+B,CAAC;AAEhE,4EAA4E;AAC5E,eAAO,MAAM,eAAe,QAAO,OAA0C,CAAC"}
|