@dxos/react-ui-form 0.7.2-main.f1adc9f → 0.7.2
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/dist/lib/browser/index.mjs +31 -31
- package/dist/lib/browser/index.mjs.map +3 -3
- package/dist/lib/browser/meta.json +1 -1
- package/dist/lib/node/index.cjs +31 -31
- package/dist/lib/node/index.cjs.map +3 -3
- package/dist/lib/node/meta.json +1 -1
- package/dist/lib/node-esm/index.mjs +31 -31
- package/dist/lib/node-esm/index.mjs.map +3 -3
- package/dist/lib/node-esm/meta.json +1 -1
- package/dist/types/src/components/FieldEditor/FieldEditor.d.ts +2 -2
- package/dist/types/src/components/FieldEditor/FieldEditor.d.ts.map +1 -1
- package/dist/types/src/components/Form/Custom.d.ts +1 -1
- package/dist/types/src/components/Form/Custom.d.ts.map +1 -1
- package/dist/types/src/components/Form/Defaults.d.ts +5 -5
- package/dist/types/src/components/Form/Defaults.d.ts.map +1 -1
- package/dist/types/src/components/Form/Form.d.ts +4 -4
- package/dist/types/src/components/Form/Form.d.ts.map +1 -1
- package/dist/types/src/components/Form/Input.d.ts +2 -2
- package/dist/types/src/components/Form/Input.d.ts.map +1 -1
- package/dist/types/src/components/Form/factory.d.ts +1 -1
- package/dist/types/src/components/Form/factory.d.ts.map +1 -1
- package/dist/types/src/components/ViewEditor/ViewEditor.d.ts.map +1 -1
- package/dist/types/src/hooks/useForm.d.ts +6 -6
- package/dist/types/src/hooks/useForm.d.ts.map +1 -1
- package/package.json +22 -22
- package/src/components/FieldEditor/FieldEditor.stories.tsx +2 -2
- package/src/components/FieldEditor/FieldEditor.tsx +8 -8
- package/src/components/Form/Custom.tsx +1 -1
- package/src/components/Form/Defaults.tsx +5 -5
- package/src/components/Form/Form.stories.tsx +4 -4
- package/src/components/Form/Form.tsx +13 -13
- package/src/components/Form/Input.tsx +2 -2
- package/src/components/Form/factory.tsx +1 -1
- package/src/components/ViewEditor/ViewEditor.tsx +7 -8
- package/src/hooks/useForm.ts +16 -16
|
@@ -1 +1 @@
|
|
|
1
|
-
{"inputs":{"packages/ui/react-ui-form/src/translations.ts":{"bytes":5683,"imports":[],"format":"esm"},"packages/ui/react-ui-form/src/components/deprecated/FormInput.tsx":{"bytes":4795,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-form/src/components/deprecated/index.ts":{"bytes":520,"imports":[{"path":"packages/ui/react-ui-form/src/components/deprecated/FormInput.tsx","kind":"import-statement","original":"./FormInput"}],"format":"esm"},"packages/ui/react-ui-form/src/components/Form/Input.tsx":{"bytes":3857,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-form/src/components/Form/Defaults.tsx":{"bytes":11805,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-form/src/components/Form/Input.tsx","kind":"import-statement","original":"./Input"}],"format":"esm"},"packages/ui/react-ui-form/src/components/Form/Custom.tsx":{"bytes":6405,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-form/src/components/Form/Input.tsx","kind":"import-statement","original":"./Input"},{"path":"packages/ui/react-ui-form/src/translations.ts","kind":"import-statement","original":"../../translations"}],"format":"esm"},"packages/ui/react-ui-form/src/components/Form/factory.tsx":{"bytes":2493,"imports":[{"path":"@dxos/echo-schema","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-form/src/components/Form/Custom.tsx","kind":"import-statement","original":"./Custom"},{"path":"packages/ui/react-ui-form/src/components/Form/Defaults.tsx","kind":"import-statement","original":"./Defaults"}],"format":"esm"},"packages/ui/react-ui-form/src/hooks/useForm.ts":{"bytes":19458,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/invariant","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"@dxos/schema","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-form/src/hooks/index.ts":{"bytes":502,"imports":[{"path":"packages/ui/react-ui-form/src/hooks/useForm.ts","kind":"import-statement","original":"./useForm"}],"format":"esm"},"packages/ui/react-ui-form/src/components/Form/Form.tsx":{"bytes":21512,"imports":[{"path":"effect","kind":"import-statement","external":true},{"path":"effect/String","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/echo-schema","kind":"import-statement","external":true},{"path":"@dxos/effect","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@dxos/schema","kind":"import-statement","external":true},{"path":"@dxos/util","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-form/src/components/Form/Defaults.tsx","kind":"import-statement","original":"./Defaults"},{"path":"packages/ui/react-ui-form/src/components/Form/factory.tsx","kind":"import-statement","original":"./factory"},{"path":"packages/ui/react-ui-form/src/hooks/index.ts","kind":"import-statement","original":"../../hooks"},{"path":"packages/ui/react-ui-form/src/translations.ts","kind":"import-statement","original":"../../translations"}],"format":"esm"},"packages/ui/react-ui-form/src/components/Form/index.ts":{"bytes":760,"imports":[{"path":"packages/ui/react-ui-form/src/components/Form/Form.tsx","kind":"import-statement","original":"./Form"},{"path":"packages/ui/react-ui-form/src/components/Form/Custom.tsx","kind":"import-statement","original":"./Custom"},{"path":"packages/ui/react-ui-form/src/components/Form/Defaults.tsx","kind":"import-statement","original":"./Defaults"},{"path":"packages/ui/react-ui-form/src/components/Form/Input.tsx","kind":"import-statement","original":"./Input"}],"format":"esm"},"packages/ui/react-ui-form/src/components/FieldEditor/FieldEditor.tsx":{"bytes":17911,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/echo-schema","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/schema","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-form/src/translations.ts","kind":"import-statement","original":"../../translations"},{"path":"packages/ui/react-ui-form/src/components/Form/index.ts","kind":"import-statement","original":"../Form"}],"format":"esm"},"packages/ui/react-ui-form/src/components/FieldEditor/index.ts":{"bytes":531,"imports":[{"path":"packages/ui/react-ui-form/src/components/FieldEditor/FieldEditor.tsx","kind":"import-statement","original":"./FieldEditor"}],"format":"esm"},"packages/ui/react-ui-form/src/components/ViewEditor/ViewEditor.tsx":{"bytes":16960,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/echo-schema","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-list","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@dxos/schema","kind":"import-statement","external":true},{"path":"@dxos/util","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-form/src/translations.ts","kind":"import-statement","original":"../../translations"},{"path":"packages/ui/react-ui-form/src/components/FieldEditor/index.ts","kind":"import-statement","original":"../FieldEditor"},{"path":"packages/ui/react-ui-form/src/components/Form/index.ts","kind":"import-statement","original":"../Form"}],"format":"esm"},"packages/ui/react-ui-form/src/components/ViewEditor/index.ts":{"bytes":525,"imports":[{"path":"packages/ui/react-ui-form/src/components/ViewEditor/ViewEditor.tsx","kind":"import-statement","original":"./ViewEditor"}],"format":"esm"},"packages/ui/react-ui-form/src/components/index.ts":{"bytes":787,"imports":[{"path":"packages/ui/react-ui-form/src/components/deprecated/index.ts","kind":"import-statement","original":"./deprecated"},{"path":"packages/ui/react-ui-form/src/components/FieldEditor/index.ts","kind":"import-statement","original":"./FieldEditor"},{"path":"packages/ui/react-ui-form/src/components/Form/index.ts","kind":"import-statement","original":"./Form"},{"path":"packages/ui/react-ui-form/src/components/ViewEditor/index.ts","kind":"import-statement","original":"./ViewEditor"}],"format":"esm"},"packages/ui/react-ui-form/src/util/field.ts":{"bytes":12238,"imports":[{"path":"@dxos/echo-schema","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-form/src/util/formatting.ts":{"bytes":12559,"imports":[{"path":"@dxos/echo-schema","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-form/src/util/index.ts":{"bytes":589,"imports":[{"path":"packages/ui/react-ui-form/src/util/field.ts","kind":"import-statement","original":"./field"},{"path":"packages/ui/react-ui-form/src/util/formatting.ts","kind":"import-statement","original":"./formatting"}],"format":"esm"},"packages/ui/react-ui-form/src/index.ts":{"bytes":916,"imports":[{"path":"packages/ui/react-ui-form/src/translations.ts","kind":"import-statement","original":"./translations"},{"path":"packages/ui/react-ui-form/src/components/index.ts","kind":"import-statement","original":"./components"},{"path":"packages/ui/react-ui-form/src/hooks/index.ts","kind":"import-statement","original":"./hooks"},{"path":"packages/ui/react-ui-form/src/util/index.ts","kind":"import-statement","original":"./util"}],"format":"esm"}},"outputs":{"packages/ui/react-ui-form/dist/lib/node-esm/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":69109},"packages/ui/react-ui-form/dist/lib/node-esm/index.mjs":{"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/echo-schema","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/schema","kind":"import-statement","external":true},{"path":"effect","kind":"import-statement","external":true},{"path":"effect/String","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/echo-schema","kind":"import-statement","external":true},{"path":"@dxos/effect","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@dxos/schema","kind":"import-statement","external":true},{"path":"@dxos/util","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@dxos/echo-schema","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/invariant","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"@dxos/schema","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/echo-schema","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-list","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@dxos/schema","kind":"import-statement","external":true},{"path":"@dxos/util","kind":"import-statement","external":true},{"path":"@dxos/echo-schema","kind":"import-statement","external":true},{"path":"@dxos/echo-schema","kind":"import-statement","external":true}],"exports":["BooleanInput","DeprecatedFormInput","FieldEditor","Form","GeiPointInput","InputHeader","NumberInput","SelectInput","TextInput","ViewEditor","cellClassesForFieldType","cellClassesForRowSelection","formatForDisplay","formatForEditing","parseValue","pathNotUniqueError","translations","useForm"],"entryPoint":"packages/ui/react-ui-form/src/index.ts","inputs":{"packages/ui/react-ui-form/src/translations.ts":{"bytesInOutput":1666},"packages/ui/react-ui-form/src/components/deprecated/FormInput.tsx":{"bytesInOutput":1121},"packages/ui/react-ui-form/src/components/deprecated/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-form/src/components/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-form/src/components/FieldEditor/FieldEditor.tsx":{"bytesInOutput":4164},"packages/ui/react-ui-form/src/components/Form/Form.tsx":{"bytesInOutput":5016},"packages/ui/react-ui-form/src/components/Form/Defaults.tsx":{"bytesInOutput":2997},"packages/ui/react-ui-form/src/components/Form/Input.tsx":{"bytesInOutput":737},"packages/ui/react-ui-form/src/components/Form/factory.tsx":{"bytesInOutput":332},"packages/ui/react-ui-form/src/components/Form/Custom.tsx":{"bytesInOutput":1388},"packages/ui/react-ui-form/src/hooks/useForm.ts":{"bytesInOutput":3548},"packages/ui/react-ui-form/src/hooks/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-form/src/components/Form/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-form/src/components/FieldEditor/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-form/src/components/ViewEditor/ViewEditor.tsx":{"bytesInOutput":4320},"packages/ui/react-ui-form/src/components/ViewEditor/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-form/src/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-form/src/util/field.ts":{"bytesInOutput":2809},"packages/ui/react-ui-form/src/util/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-form/src/util/formatting.ts":{"bytesInOutput":2779}},"bytes":32328}}}
|
|
1
|
+
{"inputs":{"packages/ui/react-ui-form/src/translations.ts":{"bytes":5683,"imports":[],"format":"esm"},"packages/ui/react-ui-form/src/components/deprecated/FormInput.tsx":{"bytes":4795,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-form/src/components/deprecated/index.ts":{"bytes":520,"imports":[{"path":"packages/ui/react-ui-form/src/components/deprecated/FormInput.tsx","kind":"import-statement","original":"./FormInput"}],"format":"esm"},"packages/ui/react-ui-form/src/components/Form/Input.tsx":{"bytes":3849,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-form/src/components/Form/Defaults.tsx":{"bytes":11785,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-form/src/components/Form/Input.tsx","kind":"import-statement","original":"./Input"}],"format":"esm"},"packages/ui/react-ui-form/src/components/Form/Custom.tsx":{"bytes":6401,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-form/src/components/Form/Input.tsx","kind":"import-statement","original":"./Input"},{"path":"packages/ui/react-ui-form/src/translations.ts","kind":"import-statement","original":"../../translations"}],"format":"esm"},"packages/ui/react-ui-form/src/components/Form/factory.tsx":{"bytes":2489,"imports":[{"path":"@dxos/echo-schema","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-form/src/components/Form/Custom.tsx","kind":"import-statement","original":"./Custom"},{"path":"packages/ui/react-ui-form/src/components/Form/Defaults.tsx","kind":"import-statement","original":"./Defaults"}],"format":"esm"},"packages/ui/react-ui-form/src/hooks/useForm.ts":{"bytes":19494,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/invariant","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"@dxos/schema","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-form/src/hooks/index.ts":{"bytes":502,"imports":[{"path":"packages/ui/react-ui-form/src/hooks/useForm.ts","kind":"import-statement","original":"./useForm"}],"format":"esm"},"packages/ui/react-ui-form/src/components/Form/Form.tsx":{"bytes":21560,"imports":[{"path":"effect","kind":"import-statement","external":true},{"path":"effect/String","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/echo-schema","kind":"import-statement","external":true},{"path":"@dxos/effect","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@dxos/schema","kind":"import-statement","external":true},{"path":"@dxos/util","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-form/src/components/Form/Defaults.tsx","kind":"import-statement","original":"./Defaults"},{"path":"packages/ui/react-ui-form/src/components/Form/factory.tsx","kind":"import-statement","original":"./factory"},{"path":"packages/ui/react-ui-form/src/hooks/index.ts","kind":"import-statement","original":"../../hooks"},{"path":"packages/ui/react-ui-form/src/translations.ts","kind":"import-statement","original":"../../translations"}],"format":"esm"},"packages/ui/react-ui-form/src/components/Form/index.ts":{"bytes":760,"imports":[{"path":"packages/ui/react-ui-form/src/components/Form/Form.tsx","kind":"import-statement","original":"./Form"},{"path":"packages/ui/react-ui-form/src/components/Form/Custom.tsx","kind":"import-statement","original":"./Custom"},{"path":"packages/ui/react-ui-form/src/components/Form/Defaults.tsx","kind":"import-statement","original":"./Defaults"},{"path":"packages/ui/react-ui-form/src/components/Form/Input.tsx","kind":"import-statement","original":"./Input"}],"format":"esm"},"packages/ui/react-ui-form/src/components/FieldEditor/FieldEditor.tsx":{"bytes":17958,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/echo-schema","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/schema","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-form/src/translations.ts","kind":"import-statement","original":"../../translations"},{"path":"packages/ui/react-ui-form/src/components/Form/index.ts","kind":"import-statement","original":"../Form"}],"format":"esm"},"packages/ui/react-ui-form/src/components/FieldEditor/index.ts":{"bytes":531,"imports":[{"path":"packages/ui/react-ui-form/src/components/FieldEditor/FieldEditor.tsx","kind":"import-statement","original":"./FieldEditor"}],"format":"esm"},"packages/ui/react-ui-form/src/components/ViewEditor/ViewEditor.tsx":{"bytes":16911,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/echo-schema","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-list","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@dxos/schema","kind":"import-statement","external":true},{"path":"@dxos/util","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-form/src/translations.ts","kind":"import-statement","original":"../../translations"},{"path":"packages/ui/react-ui-form/src/components/FieldEditor/index.ts","kind":"import-statement","original":"../FieldEditor"},{"path":"packages/ui/react-ui-form/src/components/Form/index.ts","kind":"import-statement","original":"../Form"}],"format":"esm"},"packages/ui/react-ui-form/src/components/ViewEditor/index.ts":{"bytes":525,"imports":[{"path":"packages/ui/react-ui-form/src/components/ViewEditor/ViewEditor.tsx","kind":"import-statement","original":"./ViewEditor"}],"format":"esm"},"packages/ui/react-ui-form/src/components/index.ts":{"bytes":787,"imports":[{"path":"packages/ui/react-ui-form/src/components/deprecated/index.ts","kind":"import-statement","original":"./deprecated"},{"path":"packages/ui/react-ui-form/src/components/FieldEditor/index.ts","kind":"import-statement","original":"./FieldEditor"},{"path":"packages/ui/react-ui-form/src/components/Form/index.ts","kind":"import-statement","original":"./Form"},{"path":"packages/ui/react-ui-form/src/components/ViewEditor/index.ts","kind":"import-statement","original":"./ViewEditor"}],"format":"esm"},"packages/ui/react-ui-form/src/util/field.ts":{"bytes":12238,"imports":[{"path":"@dxos/echo-schema","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-form/src/util/formatting.ts":{"bytes":12559,"imports":[{"path":"@dxos/echo-schema","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-form/src/util/index.ts":{"bytes":589,"imports":[{"path":"packages/ui/react-ui-form/src/util/field.ts","kind":"import-statement","original":"./field"},{"path":"packages/ui/react-ui-form/src/util/formatting.ts","kind":"import-statement","original":"./formatting"}],"format":"esm"},"packages/ui/react-ui-form/src/index.ts":{"bytes":916,"imports":[{"path":"packages/ui/react-ui-form/src/translations.ts","kind":"import-statement","original":"./translations"},{"path":"packages/ui/react-ui-form/src/components/index.ts","kind":"import-statement","original":"./components"},{"path":"packages/ui/react-ui-form/src/hooks/index.ts","kind":"import-statement","original":"./hooks"},{"path":"packages/ui/react-ui-form/src/util/index.ts","kind":"import-statement","original":"./util"}],"format":"esm"}},"outputs":{"packages/ui/react-ui-form/dist/lib/node-esm/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":69129},"packages/ui/react-ui-form/dist/lib/node-esm/index.mjs":{"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/echo-schema","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/schema","kind":"import-statement","external":true},{"path":"effect","kind":"import-statement","external":true},{"path":"effect/String","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/echo-schema","kind":"import-statement","external":true},{"path":"@dxos/effect","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@dxos/schema","kind":"import-statement","external":true},{"path":"@dxos/util","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@dxos/echo-schema","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/invariant","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"@dxos/schema","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/echo-schema","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-list","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@dxos/schema","kind":"import-statement","external":true},{"path":"@dxos/util","kind":"import-statement","external":true},{"path":"@dxos/echo-schema","kind":"import-statement","external":true},{"path":"@dxos/echo-schema","kind":"import-statement","external":true}],"exports":["BooleanInput","DeprecatedFormInput","FieldEditor","Form","GeiPointInput","InputHeader","NumberInput","SelectInput","TextInput","ViewEditor","cellClassesForFieldType","cellClassesForRowSelection","formatForDisplay","formatForEditing","parseValue","pathNotUniqueError","translations","useForm"],"entryPoint":"packages/ui/react-ui-form/src/index.ts","inputs":{"packages/ui/react-ui-form/src/translations.ts":{"bytesInOutput":1666},"packages/ui/react-ui-form/src/components/deprecated/FormInput.tsx":{"bytesInOutput":1121},"packages/ui/react-ui-form/src/components/deprecated/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-form/src/components/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-form/src/components/FieldEditor/FieldEditor.tsx":{"bytesInOutput":4175},"packages/ui/react-ui-form/src/components/Form/Form.tsx":{"bytesInOutput":5036},"packages/ui/react-ui-form/src/components/Form/Defaults.tsx":{"bytesInOutput":2997},"packages/ui/react-ui-form/src/components/Form/Input.tsx":{"bytesInOutput":737},"packages/ui/react-ui-form/src/components/Form/factory.tsx":{"bytesInOutput":332},"packages/ui/react-ui-form/src/components/Form/Custom.tsx":{"bytesInOutput":1388},"packages/ui/react-ui-form/src/hooks/useForm.ts":{"bytesInOutput":3562},"packages/ui/react-ui-form/src/hooks/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-form/src/components/Form/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-form/src/components/FieldEditor/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-form/src/components/ViewEditor/ViewEditor.tsx":{"bytesInOutput":4295},"packages/ui/react-ui-form/src/components/ViewEditor/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-form/src/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-form/src/util/field.ts":{"bytesInOutput":2809},"packages/ui/react-ui-form/src/util/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-form/src/util/formatting.ts":{"bytesInOutput":2779}},"bytes":32348}}}
|
|
@@ -6,11 +6,11 @@ export type FieldEditorProps = {
|
|
|
6
6
|
projection: ViewProjection;
|
|
7
7
|
field: FieldType;
|
|
8
8
|
registry?: SchemaResolver;
|
|
9
|
-
|
|
9
|
+
onClose: () => void;
|
|
10
10
|
onCancel?: () => void;
|
|
11
11
|
};
|
|
12
12
|
/**
|
|
13
13
|
* Displays a Form representing the metadata for a given `Field` and `View`.
|
|
14
14
|
*/
|
|
15
|
-
export declare const FieldEditor: ({ view, projection, field, registry,
|
|
15
|
+
export declare const FieldEditor: ({ view, projection, field, registry, onClose, onCancel }: FieldEditorProps) => React.JSX.Element | null;
|
|
16
16
|
//# sourceMappingURL=FieldEditor.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FieldEditor.d.ts","sourceRoot":"","sources":["../../../../../src/components/FieldEditor/FieldEditor.tsx"],"names":[],"mappings":"AAIA,OAAO,KAA2C,MAAM,OAAO,CAAC;AAEhE,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,eAAe,CAAC;AAIpD,OAAO,EAIL,KAAK,SAAS,EAEd,KAAK,QAAQ,EACb,KAAK,cAAc,EACpB,MAAM,cAAc,CAAC;AAKtB,MAAM,MAAM,gBAAgB,GAAG;IAC7B,IAAI,EAAE,QAAQ,CAAC;IACf,UAAU,EAAE,cAAc,CAAC;IAC3B,KAAK,EAAE,SAAS,CAAC;IACjB,QAAQ,CAAC,EAAE,cAAc,CAAC;IAC1B,
|
|
1
|
+
{"version":3,"file":"FieldEditor.d.ts","sourceRoot":"","sources":["../../../../../src/components/FieldEditor/FieldEditor.tsx"],"names":[],"mappings":"AAIA,OAAO,KAA2C,MAAM,OAAO,CAAC;AAEhE,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,eAAe,CAAC;AAIpD,OAAO,EAIL,KAAK,SAAS,EAEd,KAAK,QAAQ,EACb,KAAK,cAAc,EACpB,MAAM,cAAc,CAAC;AAKtB,MAAM,MAAM,gBAAgB,GAAG;IAC7B,IAAI,EAAE,QAAQ,CAAC;IACf,UAAU,EAAE,cAAc,CAAC;IAC3B,KAAK,EAAE,SAAS,CAAC;IACjB,QAAQ,CAAC,EAAE,cAAc,CAAC;IAC1B,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,WAAW,6DAA8D,gBAAgB,6BAmIrG,CAAC"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { type BaseObject } from '@dxos/echo-schema';
|
|
3
3
|
import { type InputProps } from './Input';
|
|
4
|
-
export declare const GeiPointInput: <T extends BaseObject
|
|
4
|
+
export declare const GeiPointInput: <T extends BaseObject>({ property, type, label, disabled, getStatus, getValue, onValueChange, onBlur, }: InputProps<T>) => React.JSX.Element;
|
|
5
5
|
//# sourceMappingURL=Custom.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Custom.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/Custom.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,KAAK,UAAU,EAAiB,MAAM,mBAAmB,CAAC;AAGnE,OAAO,EAAe,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAOvD,eAAO,MAAM,aAAa,GAAI,CAAC,SAAS,UAAU,
|
|
1
|
+
{"version":3,"file":"Custom.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/Custom.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,KAAK,UAAU,EAAiB,MAAM,mBAAmB,CAAC;AAGnE,OAAO,EAAe,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAOvD,eAAO,MAAM,aAAa,GAAI,CAAC,SAAS,UAAU,oFAS/C,UAAU,CAAC,CAAC,CAAC,sBA8Bf,CAAC"}
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { type BaseObject } from '@dxos/echo-schema';
|
|
3
3
|
import { type InputProps } from './Input';
|
|
4
|
-
export declare const TextInput: <T extends BaseObject
|
|
5
|
-
export declare const NumberInput: <T extends BaseObject
|
|
6
|
-
export declare const BooleanInput: <T extends BaseObject
|
|
7
|
-
export type SelectInputOptions<T extends BaseObject
|
|
4
|
+
export declare const TextInput: <T extends BaseObject>({ property, type, label, disabled, placeholder, getStatus, getValue, onValueChange, onBlur, }: InputProps<T>) => React.JSX.Element;
|
|
5
|
+
export declare const NumberInput: <T extends BaseObject>({ property, type, label, disabled, placeholder, getStatus, getValue, onValueChange, onBlur, }: InputProps<T>) => React.JSX.Element;
|
|
6
|
+
export declare const BooleanInput: <T extends BaseObject>({ property, type, label, getStatus, getValue, onValueChange, }: InputProps<T>) => React.JSX.Element;
|
|
7
|
+
export type SelectInputOptions<T extends BaseObject> = InputProps<T> & {
|
|
8
8
|
options?: Array<{
|
|
9
9
|
value: string | number;
|
|
10
10
|
label?: string;
|
|
11
11
|
}>;
|
|
12
12
|
};
|
|
13
|
-
export declare const SelectInput: <T extends BaseObject
|
|
13
|
+
export declare const SelectInput: <T extends BaseObject>({ property, type, label, disabled, placeholder, options, getStatus, getValue, onValueChange, }: SelectInputOptions<T>) => React.JSX.Element;
|
|
14
14
|
//# sourceMappingURL=Defaults.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Defaults.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/Defaults.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAGpD,OAAO,EAAE,KAAK,UAAU,EAAe,MAAM,SAAS,CAAC;AAEvD,eAAO,MAAM,SAAS,GAAI,CAAC,SAAS,UAAU,
|
|
1
|
+
{"version":3,"file":"Defaults.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/Defaults.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAGpD,OAAO,EAAE,KAAK,UAAU,EAAe,MAAM,SAAS,CAAC;AAEvD,eAAO,MAAM,SAAS,GAAI,CAAC,SAAS,UAAU,iGAU3C,UAAU,CAAC,CAAC,CAAC,sBAiBf,CAAC;AAEF,eAAO,MAAM,WAAW,GAAI,CAAC,SAAS,UAAU,iGAU7C,UAAU,CAAC,CAAC,CAAC,sBAmBf,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,CAAC,SAAS,UAAU,kEAO9C,UAAU,CAAC,CAAC,CAAC,sBAcf,CAAC;AAEF,MAAM,MAAM,kBAAkB,CAAC,CAAC,SAAS,UAAU,IAAI,UAAU,CAAC,CAAC,CAAC,GAAG;IACrE,OAAO,CAAC,EAAE,KAAK,CAAC;QAAE,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;CAC7D,CAAC;AAEF,eAAO,MAAM,WAAW,GAAI,CAAC,SAAS,UAAU,kGAU7C,kBAAkB,CAAC,CAAC,CAAC,sBA0BvB,CAAC"}
|
|
@@ -4,8 +4,8 @@ import { type ThemedClassName } from '@dxos/react-ui';
|
|
|
4
4
|
import { type SchemaProperty } from '@dxos/schema';
|
|
5
5
|
import { type InputComponent } from './Input';
|
|
6
6
|
import { type FormOptions } from '../../hooks';
|
|
7
|
-
export type PropsFilter<T extends BaseObject
|
|
8
|
-
export type FormProps<T extends BaseObject
|
|
7
|
+
export type PropsFilter<T extends BaseObject> = (props: SchemaProperty<T>[]) => SchemaProperty<T>[];
|
|
8
|
+
export type FormProps<T extends BaseObject> = ThemedClassName<{
|
|
9
9
|
values: T;
|
|
10
10
|
/** Path to the current object from the root. Used with nested forms. */
|
|
11
11
|
path?: string[];
|
|
@@ -19,9 +19,9 @@ export type FormProps<T extends BaseObject<T>> = ThemedClassName<{
|
|
|
19
19
|
* Map of custom renderers for specific properties.
|
|
20
20
|
*/
|
|
21
21
|
Custom?: Partial<Record<string, InputComponent<T>>>;
|
|
22
|
-
} & Pick<FormOptions<T>, 'schema' | 'onValuesChanged' | 'onValidate' | '
|
|
22
|
+
} & Pick<FormOptions<T>, 'schema' | 'onValuesChanged' | 'onValidate' | 'onSubmit'>>;
|
|
23
23
|
/**
|
|
24
24
|
* General purpose form component that displays field controls based on the given schema.
|
|
25
25
|
*/
|
|
26
|
-
export declare const Form: <T extends BaseObject
|
|
26
|
+
export declare const Form: <T extends BaseObject>({ classNames, schema, values: initialValues, path, readonly, filter, sort, autoSave, onValuesChanged, onValidate, onSubmit, onCancel, Custom, }: FormProps<T>) => React.JSX.Element;
|
|
27
27
|
//# sourceMappingURL=Form.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Form.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/Form.tsx"],"names":[],"mappings":"AAMA,OAAO,KAA6B,MAAM,OAAO,CAAC;AAElD,OAAO,EAAO,KAAK,UAAU,EAAK,KAAK,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAG9E,OAAO,EAAc,KAAK,eAAe,EAAkB,MAAM,gBAAgB,CAAC;AAElF,OAAO,EAAuB,KAAK,cAAc,EAAE,MAAM,cAAc,CAAC;AAIxE,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,SAAS,CAAC;AAE9C,OAAO,EAAE,KAAK,WAAW,EAAW,MAAM,aAAa,CAAC;AAOxD,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,UAAU,
|
|
1
|
+
{"version":3,"file":"Form.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/Form.tsx"],"names":[],"mappings":"AAMA,OAAO,KAA6B,MAAM,OAAO,CAAC;AAElD,OAAO,EAAO,KAAK,UAAU,EAAK,KAAK,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAG9E,OAAO,EAAc,KAAK,eAAe,EAAkB,MAAM,gBAAgB,CAAC;AAElF,OAAO,EAAuB,KAAK,cAAc,EAAE,MAAM,cAAc,CAAC;AAIxE,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,SAAS,CAAC;AAE9C,OAAO,EAAE,KAAK,WAAW,EAAW,MAAM,aAAa,CAAC;AAOxD,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,UAAU,IAAI,CAAC,KAAK,EAAE,cAAc,CAAC,CAAC,CAAC,EAAE,KAAK,cAAc,CAAC,CAAC,CAAC,EAAE,CAAC;AAEpG,MAAM,MAAM,SAAS,CAAC,CAAC,SAAS,UAAU,IAAI,eAAe,CAC3D;IACE,MAAM,EAAE,CAAC,CAAC;IACV,wEAAwE;IACxE,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC;IAGhB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,MAAM,CAAC,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC;IACxB,IAAI,CAAC,EAAE,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IAEtB;;OAEG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;CACrD,GAAG,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,QAAQ,GAAG,iBAAiB,GAAG,YAAY,GAAG,UAAU,CAAC,CACnF,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,IAAI,GAAI,CAAC,SAAS,UAAU,mJActC,SAAS,CAAC,CAAC,CAAC,sBAoId,CAAC"}
|
|
@@ -5,7 +5,7 @@ import { type FormHandler } from '../../hooks';
|
|
|
5
5
|
/**
|
|
6
6
|
* Props passed to input components.
|
|
7
7
|
*/
|
|
8
|
-
export type InputProps<T extends BaseObject
|
|
8
|
+
export type InputProps<T extends BaseObject> = {
|
|
9
9
|
property: PropertyKey<T>;
|
|
10
10
|
type: SimpleType;
|
|
11
11
|
format?: FormatEnum;
|
|
@@ -16,7 +16,7 @@ export type InputProps<T extends BaseObject<T>> = {
|
|
|
16
16
|
/**
|
|
17
17
|
* Form input component.
|
|
18
18
|
*/
|
|
19
|
-
export type InputComponent<T extends BaseObject
|
|
19
|
+
export type InputComponent<T extends BaseObject> = FC<InputProps<T>>;
|
|
20
20
|
export type InputHeaderProps = PropsWithChildren<{
|
|
21
21
|
error?: string;
|
|
22
22
|
}>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/Input.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,EAAE,KAAK,EAAE,EAAE,KAAK,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE/D,OAAO,EAAE,KAAK,UAAU,EAAE,KAAK,UAAU,EAAE,KAAK,WAAW,EAAE,MAAM,mBAAmB,CAAC;AACvF,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,cAAc,CAAC;AAI/C,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,aAAa,CAAC;AAE/C;;GAEG;AACH,MAAM,MAAM,UAAU,CAAC,CAAC,SAAS,UAAU,
|
|
1
|
+
{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/Input.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,EAAE,KAAK,EAAE,EAAE,KAAK,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE/D,OAAO,EAAE,KAAK,UAAU,EAAE,KAAK,UAAU,EAAE,KAAK,WAAW,EAAE,MAAM,mBAAmB,CAAC;AACvF,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,cAAc,CAAC;AAI/C,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,aAAa,CAAC;AAE/C;;GAEG;AACH,MAAM,MAAM,UAAU,CAAC,CAAC,SAAS,UAAU,IAAI;IAC7C,QAAQ,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC;IACzB,IAAI,EAAE,UAAU,CAAC;IACjB,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GAAG,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,WAAW,GAAG,UAAU,GAAG,eAAe,GAAG,QAAQ,CAAC,CAAC;AAEhF;;GAEG;AACH,MAAM,MAAM,cAAc,CAAC,CAAC,SAAS,UAAU,IAAI,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC;AAErE,MAAM,MAAM,gBAAgB,GAAG,iBAAiB,CAAC;IAC/C,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC,CAAC;AAEH,eAAO,MAAM,WAAW,wBAAyB,gBAAgB,sBAiBhE,CAAC"}
|
|
@@ -4,5 +4,5 @@ import { type InputComponent } from './Input';
|
|
|
4
4
|
/**
|
|
5
5
|
* Get property input component.
|
|
6
6
|
*/
|
|
7
|
-
export declare const getInputComponent: <T extends BaseObject
|
|
7
|
+
export declare const getInputComponent: <T extends BaseObject>(type: SimpleType, format?: FormatEnum) => InputComponent<T> | undefined;
|
|
8
8
|
//# sourceMappingURL=factory.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"factory.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/factory.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,UAAU,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAChE,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,CAAC,SAAS,UAAU,
|
|
1
|
+
{"version":3,"file":"factory.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/factory.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,UAAU,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAChE,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,CAAC,SAAS,UAAU,QAC9C,UAAU,WACP,UAAU,KAClB,cAAc,CAAC,CAAC,CAAC,GAAG,SActB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ViewEditor.d.ts","sourceRoot":"","sources":["../../../../../src/components/ViewEditor/ViewEditor.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAE9D,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,eAAe,CAAC;AACpD,OAAO,EAAe,KAAK,aAAa,EAAK,MAAM,mBAAmB,CAAC;AACvE,OAAO,EAAc,KAAK,eAAe,EAAkB,MAAM,gBAAgB,CAAC;AAGlF,OAAO,EAA+B,KAAK,QAAQ,EAAoC,MAAM,cAAc,CAAC;AAoB5G,MAAM,MAAM,eAAe,GAAG,eAAe,CAAC;IAC5C,MAAM,EAAE,aAAa,CAAC;IACtB,IAAI,EAAE,QAAQ,CAAC;IACf,QAAQ,CAAC,EAAE,cAAc,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;CACrC,CAAC,CAAC;AAEH;;GAEG;AACH,eAAO,MAAM,UAAU,6EAQpB,eAAe,
|
|
1
|
+
{"version":3,"file":"ViewEditor.d.ts","sourceRoot":"","sources":["../../../../../src/components/ViewEditor/ViewEditor.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAE9D,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,eAAe,CAAC;AACpD,OAAO,EAAe,KAAK,aAAa,EAAK,MAAM,mBAAmB,CAAC;AACvE,OAAO,EAAc,KAAK,eAAe,EAAkB,MAAM,gBAAgB,CAAC;AAGlF,OAAO,EAA+B,KAAK,QAAQ,EAAoC,MAAM,cAAc,CAAC;AAoB5G,MAAM,MAAM,eAAe,GAAG,eAAe,CAAC;IAC5C,MAAM,EAAE,aAAa,CAAC;IACtB,IAAI,EAAE,QAAQ,CAAC;IACf,QAAQ,CAAC,EAAE,cAAc,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;CACrC,CAAC,CAAC;AAEH;;GAEG;AACH,eAAO,MAAM,UAAU,6EAQpB,eAAe,sBA0GjB,CAAC"}
|
|
@@ -5,13 +5,13 @@ import { type ValidationError } from '@dxos/schema';
|
|
|
5
5
|
/**
|
|
6
6
|
* Return type from `useForm` hook.
|
|
7
7
|
*/
|
|
8
|
-
export type FormHandler<T extends BaseObject
|
|
8
|
+
export type FormHandler<T extends BaseObject> = {
|
|
9
9
|
values: T;
|
|
10
10
|
errors: Record<PropertyKey<T>, string>;
|
|
11
11
|
touched: Record<PropertyKey<T>, boolean>;
|
|
12
12
|
changed: Record<PropertyKey<T>, boolean>;
|
|
13
|
-
|
|
14
|
-
|
|
13
|
+
canSubmit: boolean;
|
|
14
|
+
handleSubmit: () => void;
|
|
15
15
|
getStatus: (property: PropertyKey<T>) => {
|
|
16
16
|
status?: 'error';
|
|
17
17
|
error?: string;
|
|
@@ -23,7 +23,7 @@ export type FormHandler<T extends BaseObject<T>> = {
|
|
|
23
23
|
/**
|
|
24
24
|
* Hook options.
|
|
25
25
|
*/
|
|
26
|
-
export interface FormOptions<T extends BaseObject
|
|
26
|
+
export interface FormOptions<T extends BaseObject> {
|
|
27
27
|
schema: S.Schema<T>;
|
|
28
28
|
initialValues: T;
|
|
29
29
|
/**
|
|
@@ -47,7 +47,7 @@ export interface FormOptions<T extends BaseObject<T>> {
|
|
|
47
47
|
/**
|
|
48
48
|
* Called when the form is submitted and passes validation.
|
|
49
49
|
*/
|
|
50
|
-
|
|
50
|
+
onSubmit?: (values: T, meta: {
|
|
51
51
|
changed: FormHandler<T>['changed'];
|
|
52
52
|
}) => void;
|
|
53
53
|
}
|
|
@@ -55,5 +55,5 @@ export interface FormOptions<T extends BaseObject<T>> {
|
|
|
55
55
|
* Creates a hook for managing form state, including values, validation, and submission.
|
|
56
56
|
* Deeply integrated with `@dxos/schema` for schema-based validation.
|
|
57
57
|
*/
|
|
58
|
-
export declare const useForm: <T extends BaseObject
|
|
58
|
+
export declare const useForm: <T extends BaseObject>({ schema, initialValues, onValuesChanged, onValidate, onValid, onSubmit, }: FormOptions<T>) => FormHandler<T>;
|
|
59
59
|
//# sourceMappingURL=useForm.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useForm.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useForm.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,UAAU,EAA6C,MAAM,OAAO,CAAC;AAEnF,OAAO,EAAE,KAAK,UAAU,EAAE,KAAK,WAAW,EAAE,MAAM,mBAAmB,CAAC;AACtE,OAAO,EAAE,KAAK,UAAU,EAAE,KAAK,CAAC,EAAE,MAAM,cAAc,CAAC;AAGvD,OAAO,EAAkB,KAAK,eAAe,EAAE,MAAM,cAAc,CAAC;AAEpE;;GAEG;AACH,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,UAAU,
|
|
1
|
+
{"version":3,"file":"useForm.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useForm.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,UAAU,EAA6C,MAAM,OAAO,CAAC;AAEnF,OAAO,EAAE,KAAK,UAAU,EAAE,KAAK,WAAW,EAAE,MAAM,mBAAmB,CAAC;AACtE,OAAO,EAAE,KAAK,UAAU,EAAE,KAAK,CAAC,EAAE,MAAM,cAAc,CAAC;AAGvD,OAAO,EAAkB,KAAK,eAAe,EAAE,MAAM,cAAc,CAAC;AAEpE;;GAEG;AACH,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,UAAU,IAAI;IAK9C,MAAM,EAAE,CAAC,CAAC;IACV,MAAM,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC;IACvC,OAAO,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC;IACzC,OAAO,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC;IACzC,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,MAAM,IAAI,CAAC;IAMzB,SAAS,EAAE,CAAC,QAAQ,EAAE,WAAW,CAAC,CAAC,CAAC,KAAK;QAAE,MAAM,CAAC,EAAE,OAAO,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAC9E,QAAQ,EAAE,CAAC,CAAC,EAAE,QAAQ,EAAE,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;IAC7C,aAAa,EAAE,CAAC,CAAC,EAAE,QAAQ,EAAE,WAAW,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IACjF,MAAM,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,gBAAgB,GAAG,mBAAmB,CAAC,KAAK,IAAI,CAAC;CAC7E,CAAC;AAEF;;GAEG;AACH,MAAM,WAAW,WAAW,CAAC,CAAC,SAAS,UAAU;IAC/C,MAAM,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IAGpB,aAAa,EAAE,CAAC,CAAC;IAEjB;;;;OAIG;IACH,eAAe,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,IAAI,CAAC;IAEtC;;;;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,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE;QAAE,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAA;KAAE,KAAK,IAAI,CAAC;CAC9E;AAED;;;GAGG;AACH,eAAO,MAAM,OAAO,GAAI,CAAC,SAAS,UAAU,8EAOzC,WAAW,CAAC,CAAC,CAAC,KAAG,WAAW,CAAC,CAAC,CAiIhC,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@dxos/react-ui-form",
|
|
3
|
-
"version": "0.7.2
|
|
3
|
+
"version": "0.7.2",
|
|
4
4
|
"description": "Data components.",
|
|
5
5
|
"homepage": "https://dxos.org",
|
|
6
6
|
"bugs": "https://github.com/dxos/dxos/issues",
|
|
@@ -29,19 +29,19 @@
|
|
|
29
29
|
"date-fns": "^3.3.1",
|
|
30
30
|
"effect": "^3.9.2",
|
|
31
31
|
"jsonpath": "^1.1.1",
|
|
32
|
-
"@dxos/async": "0.7.2
|
|
33
|
-
"@dxos/
|
|
34
|
-
"@dxos/
|
|
35
|
-
"@dxos/
|
|
36
|
-
"@dxos/
|
|
37
|
-
"@dxos/
|
|
38
|
-
"@dxos/
|
|
39
|
-
"@dxos/log": "0.7.2
|
|
40
|
-
"@dxos/react-client": "0.7.2
|
|
41
|
-
"@dxos/react-ui-list": "0.7.2
|
|
42
|
-
"@dxos/
|
|
43
|
-
"@dxos/
|
|
44
|
-
"@dxos/
|
|
32
|
+
"@dxos/async": "0.7.2",
|
|
33
|
+
"@dxos/debug": "0.7.2",
|
|
34
|
+
"@dxos/echo-db": "0.7.2",
|
|
35
|
+
"@dxos/echo-schema": "0.7.2",
|
|
36
|
+
"@dxos/effect": "0.7.2",
|
|
37
|
+
"@dxos/keys": "0.7.2",
|
|
38
|
+
"@dxos/invariant": "0.7.2",
|
|
39
|
+
"@dxos/log": "0.7.2",
|
|
40
|
+
"@dxos/react-client": "0.7.2",
|
|
41
|
+
"@dxos/react-ui-list": "0.7.2",
|
|
42
|
+
"@dxos/react-ui-types": "0.7.2",
|
|
43
|
+
"@dxos/schema": "0.7.2",
|
|
44
|
+
"@dxos/util": "0.7.2"
|
|
45
45
|
},
|
|
46
46
|
"devDependencies": {
|
|
47
47
|
"@phosphor-icons/react": "^2.1.5",
|
|
@@ -52,12 +52,12 @@
|
|
|
52
52
|
"react": "~18.2.0",
|
|
53
53
|
"react-dom": "~18.2.0",
|
|
54
54
|
"vite": "5.4.7",
|
|
55
|
-
"@dxos/echo-signals": "0.7.2
|
|
56
|
-
"@dxos/random": "0.7.2
|
|
57
|
-
"@dxos/react-ui-syntax-highlighter": "0.7.2
|
|
58
|
-
"@dxos/react-ui
|
|
59
|
-
"@dxos/react-ui": "0.7.2
|
|
60
|
-
"@dxos/storybook-utils": "0.7.2
|
|
55
|
+
"@dxos/echo-signals": "0.7.2",
|
|
56
|
+
"@dxos/random": "0.7.2",
|
|
57
|
+
"@dxos/react-ui-syntax-highlighter": "0.7.2",
|
|
58
|
+
"@dxos/react-ui": "0.7.2",
|
|
59
|
+
"@dxos/react-ui-theme": "0.7.2",
|
|
60
|
+
"@dxos/storybook-utils": "0.7.2"
|
|
61
61
|
},
|
|
62
62
|
"peerDependencies": {
|
|
63
63
|
"@effect/schema": "^0.75.5",
|
|
@@ -65,8 +65,8 @@
|
|
|
65
65
|
"effect": "^3.9.2",
|
|
66
66
|
"react": "~18.2.0",
|
|
67
67
|
"react-dom": "~18.2.0",
|
|
68
|
-
"@dxos/react-ui": "0.7.2
|
|
69
|
-
"@dxos/react-ui
|
|
68
|
+
"@dxos/react-ui-theme": "0.7.2",
|
|
69
|
+
"@dxos/react-ui": "0.7.2"
|
|
70
70
|
},
|
|
71
71
|
"publishConfig": {
|
|
72
72
|
"access": "public"
|
|
@@ -20,14 +20,14 @@ import { TestLayout, TestPanel } from '../testing';
|
|
|
20
20
|
type StoryProps = FieldEditorProps;
|
|
21
21
|
|
|
22
22
|
const DefaultStory = (props: FieldEditorProps) => {
|
|
23
|
-
const handleComplete: FieldEditorProps['
|
|
23
|
+
const handleComplete: FieldEditorProps['onClose'] = () => {
|
|
24
24
|
log.info('onClose', { props });
|
|
25
25
|
};
|
|
26
26
|
|
|
27
27
|
return (
|
|
28
28
|
<TestLayout json={{ props }}>
|
|
29
29
|
<TestPanel>
|
|
30
|
-
<FieldEditor {...props}
|
|
30
|
+
<FieldEditor {...props} onClose={handleComplete} />
|
|
31
31
|
</TestPanel>
|
|
32
32
|
</TestLayout>
|
|
33
33
|
);
|
|
@@ -26,14 +26,14 @@ export type FieldEditorProps = {
|
|
|
26
26
|
projection: ViewProjection;
|
|
27
27
|
field: FieldType;
|
|
28
28
|
registry?: SchemaResolver;
|
|
29
|
-
|
|
29
|
+
onClose: () => void;
|
|
30
30
|
onCancel?: () => void;
|
|
31
31
|
};
|
|
32
32
|
|
|
33
33
|
/**
|
|
34
34
|
* Displays a Form representing the metadata for a given `Field` and `View`.
|
|
35
35
|
*/
|
|
36
|
-
export const FieldEditor = ({ view, projection, field, registry,
|
|
36
|
+
export const FieldEditor = ({ view, projection, field, registry, onClose, onCancel }: FieldEditorProps) => {
|
|
37
37
|
const { t } = useTranslation(translationKey);
|
|
38
38
|
const [props, setProps] = useState<PropertyType>(projection.getFieldProjection(field.id).props);
|
|
39
39
|
useEffect(() => setProps(projection.getFieldProjection(field.id).props), [field, projection]);
|
|
@@ -100,19 +100,19 @@ export const FieldEditor = ({ view, projection, field, registry, onSave, onCance
|
|
|
100
100
|
[view.fields, field],
|
|
101
101
|
);
|
|
102
102
|
|
|
103
|
-
const
|
|
103
|
+
const handleSubmit = useCallback<NonNullable<FormProps<PropertyType>['onSubmit']>>(
|
|
104
104
|
(props) => {
|
|
105
105
|
projection.setFieldProjection({ field, props });
|
|
106
|
-
|
|
106
|
+
onClose();
|
|
107
107
|
},
|
|
108
|
-
[projection, field,
|
|
108
|
+
[projection, field, onClose],
|
|
109
109
|
);
|
|
110
110
|
|
|
111
111
|
const handleCancel = useCallback<NonNullable<FormProps<PropertyType>['onCancel']>>(() => {
|
|
112
112
|
// Need to defer to allow form to close.
|
|
113
113
|
requestAnimationFrame(() => onCancel?.());
|
|
114
|
-
|
|
115
|
-
}, [
|
|
114
|
+
onClose();
|
|
115
|
+
}, [onClose]);
|
|
116
116
|
|
|
117
117
|
if (!fieldSchema) {
|
|
118
118
|
log.warn('invalid format', { props });
|
|
@@ -129,7 +129,7 @@ export const FieldEditor = ({ view, projection, field, registry, onSave, onCance
|
|
|
129
129
|
sort={['property', 'format']}
|
|
130
130
|
onValuesChanged={handleValuesChanged}
|
|
131
131
|
onValidate={handleValidate}
|
|
132
|
-
|
|
132
|
+
onSubmit={handleSubmit}
|
|
133
133
|
onCancel={handleCancel}
|
|
134
134
|
Custom={{
|
|
135
135
|
['format' satisfies keyof PropertyType]: (props) => (
|
|
@@ -9,7 +9,7 @@ import { Input, Select } from '@dxos/react-ui';
|
|
|
9
9
|
|
|
10
10
|
import { type InputProps, InputHeader } from './Input';
|
|
11
11
|
|
|
12
|
-
export const TextInput = <T extends BaseObject
|
|
12
|
+
export const TextInput = <T extends BaseObject>({
|
|
13
13
|
property,
|
|
14
14
|
type,
|
|
15
15
|
label,
|
|
@@ -38,7 +38,7 @@ export const TextInput = <T extends BaseObject<T>>({
|
|
|
38
38
|
);
|
|
39
39
|
};
|
|
40
40
|
|
|
41
|
-
export const NumberInput = <T extends BaseObject
|
|
41
|
+
export const NumberInput = <T extends BaseObject>({
|
|
42
42
|
property,
|
|
43
43
|
type,
|
|
44
44
|
label,
|
|
@@ -69,7 +69,7 @@ export const NumberInput = <T extends BaseObject<T>>({
|
|
|
69
69
|
);
|
|
70
70
|
};
|
|
71
71
|
|
|
72
|
-
export const BooleanInput = <T extends BaseObject
|
|
72
|
+
export const BooleanInput = <T extends BaseObject>({
|
|
73
73
|
property,
|
|
74
74
|
type,
|
|
75
75
|
label,
|
|
@@ -92,11 +92,11 @@ export const BooleanInput = <T extends BaseObject<T>>({
|
|
|
92
92
|
);
|
|
93
93
|
};
|
|
94
94
|
|
|
95
|
-
export type SelectInputOptions<T extends BaseObject
|
|
95
|
+
export type SelectInputOptions<T extends BaseObject> = InputProps<T> & {
|
|
96
96
|
options?: Array<{ value: string | number; label?: string }>;
|
|
97
97
|
};
|
|
98
98
|
|
|
99
|
-
export const SelectInput = <T extends BaseObject
|
|
99
|
+
export const SelectInput = <T extends BaseObject>({
|
|
100
100
|
property,
|
|
101
101
|
type,
|
|
102
102
|
label,
|
|
@@ -37,14 +37,14 @@ type StoryProps = FormProps<TestType>;
|
|
|
37
37
|
|
|
38
38
|
const DefaultStory = ({ values: initialValues }: StoryProps) => {
|
|
39
39
|
const [values, setValues] = useState(initialValues);
|
|
40
|
-
const
|
|
40
|
+
const handleSubmit = useCallback<NonNullable<FormProps<TestType>['onSubmit']>>((values) => {
|
|
41
41
|
setValues(values);
|
|
42
42
|
}, []);
|
|
43
43
|
|
|
44
44
|
return (
|
|
45
45
|
<TestLayout json={{ values, schema: TestSchema.ast.toJSON() }}>
|
|
46
46
|
<TestPanel>
|
|
47
|
-
<Form<TestType> schema={TestSchema} values={values}
|
|
47
|
+
<Form<TestType> schema={TestSchema} values={values} onSubmit={handleSubmit} />
|
|
48
48
|
</TestPanel>
|
|
49
49
|
</TestLayout>
|
|
50
50
|
);
|
|
@@ -96,7 +96,7 @@ type DiscriminatedUnionStoryProps = FormProps<ShapeType>;
|
|
|
96
96
|
|
|
97
97
|
const DiscriminatedUnionStory = ({ values: initialValues }: DiscriminatedUnionStoryProps) => {
|
|
98
98
|
const [values, setValues] = useState(initialValues);
|
|
99
|
-
const
|
|
99
|
+
const handleSubmit = useCallback<NonNullable<FormProps<ShapeType>['onSubmit']>>((values) => {
|
|
100
100
|
setValues(values);
|
|
101
101
|
}, []);
|
|
102
102
|
|
|
@@ -106,7 +106,7 @@ const DiscriminatedUnionStory = ({ values: initialValues }: DiscriminatedUnionSt
|
|
|
106
106
|
<Form<ShapeType>
|
|
107
107
|
schema={ShapeSchema}
|
|
108
108
|
values={values}
|
|
109
|
-
|
|
109
|
+
onSubmit={handleSubmit}
|
|
110
110
|
Custom={{
|
|
111
111
|
['shape.type' as const]: (props) => (
|
|
112
112
|
<SelectInput<ShapeType>
|
|
@@ -24,9 +24,9 @@ import { translationKey } from '../../translations';
|
|
|
24
24
|
|
|
25
25
|
const padding = 'px-2';
|
|
26
26
|
|
|
27
|
-
export type PropsFilter<T extends BaseObject
|
|
27
|
+
export type PropsFilter<T extends BaseObject> = (props: SchemaProperty<T>[]) => SchemaProperty<T>[];
|
|
28
28
|
|
|
29
|
-
export type FormProps<T extends BaseObject
|
|
29
|
+
export type FormProps<T extends BaseObject> = ThemedClassName<
|
|
30
30
|
{
|
|
31
31
|
values: T;
|
|
32
32
|
/** Path to the current object from the root. Used with nested forms. */
|
|
@@ -45,13 +45,13 @@ export type FormProps<T extends BaseObject<T>> = ThemedClassName<
|
|
|
45
45
|
* Map of custom renderers for specific properties.
|
|
46
46
|
*/
|
|
47
47
|
Custom?: Partial<Record<string, InputComponent<T>>>;
|
|
48
|
-
} & Pick<FormOptions<T>, 'schema' | 'onValuesChanged' | 'onValidate' | '
|
|
48
|
+
} & Pick<FormOptions<T>, 'schema' | 'onValuesChanged' | 'onValidate' | 'onSubmit'>
|
|
49
49
|
>;
|
|
50
50
|
|
|
51
51
|
/**
|
|
52
52
|
* General purpose form component that displays field controls based on the given schema.
|
|
53
53
|
*/
|
|
54
|
-
export const Form = <T extends BaseObject
|
|
54
|
+
export const Form = <T extends BaseObject>({
|
|
55
55
|
classNames,
|
|
56
56
|
schema,
|
|
57
57
|
values: initialValues,
|
|
@@ -62,19 +62,19 @@ export const Form = <T extends BaseObject<T>>({
|
|
|
62
62
|
autoSave,
|
|
63
63
|
onValuesChanged,
|
|
64
64
|
onValidate,
|
|
65
|
-
|
|
65
|
+
onSubmit,
|
|
66
66
|
onCancel,
|
|
67
67
|
Custom,
|
|
68
68
|
}: FormProps<T>) => {
|
|
69
69
|
const { t } = useTranslation(translationKey);
|
|
70
|
-
const onValid = useMemo(() => (autoSave ?
|
|
71
|
-
const {
|
|
70
|
+
const onValid = useMemo(() => (autoSave ? onSubmit : undefined), [autoSave, onSubmit]);
|
|
71
|
+
const { canSubmit, values, errors, handleSubmit, ...inputProps } = useForm<T>({
|
|
72
72
|
schema,
|
|
73
73
|
initialValues,
|
|
74
74
|
onValuesChanged,
|
|
75
75
|
onValidate,
|
|
76
76
|
onValid,
|
|
77
|
-
|
|
77
|
+
onSubmit,
|
|
78
78
|
});
|
|
79
79
|
|
|
80
80
|
// Filter and sort props.
|
|
@@ -103,7 +103,7 @@ export const Form = <T extends BaseObject<T>>({
|
|
|
103
103
|
.map((property) => {
|
|
104
104
|
const { ast, name, type, format, title, description, examples, options } = property;
|
|
105
105
|
const key = [...path, name];
|
|
106
|
-
const label = title ??
|
|
106
|
+
const label = pipe(title ?? name, capitalize);
|
|
107
107
|
const placeholder = examples?.length ? `Example: "${examples[0]}"` : description;
|
|
108
108
|
|
|
109
109
|
// Get generic input.
|
|
@@ -177,19 +177,19 @@ export const Form = <T extends BaseObject<T>>({
|
|
|
177
177
|
})
|
|
178
178
|
.filter(isNotFalsy)}
|
|
179
179
|
|
|
180
|
-
{(onCancel ||
|
|
180
|
+
{(onCancel || onSubmit) && !autoSave && (
|
|
181
181
|
<div role='none' className='flex justify-center'>
|
|
182
182
|
<div role='none' className={mx(onCancel && !readonly && 'grid grid-cols-2 gap-2')}>
|
|
183
183
|
{onCancel && !readonly && (
|
|
184
184
|
<IconButton icon='ph--x--regular' label={t('button cancel')} onClick={onCancel} />
|
|
185
185
|
)}
|
|
186
|
-
{
|
|
186
|
+
{onSubmit && (
|
|
187
187
|
<IconButton
|
|
188
188
|
type='submit'
|
|
189
|
-
disabled={!
|
|
189
|
+
disabled={!canSubmit}
|
|
190
190
|
icon='ph--check--regular'
|
|
191
191
|
label={t('button save')}
|
|
192
|
-
onClick={
|
|
192
|
+
onClick={handleSubmit}
|
|
193
193
|
/>
|
|
194
194
|
)}
|
|
195
195
|
</div>
|