@dxos/react-ui-form 0.8.4-main.72ec0f3 → 0.8.4-main.7ace549
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 +82 -101
- package/dist/lib/browser/index.mjs.map +3 -3
- package/dist/lib/browser/meta.json +1 -1
- package/dist/lib/node-esm/index.mjs +82 -101
- package/dist/lib/node-esm/index.mjs.map +3 -3
- package/dist/lib/node-esm/meta.json +1 -1
- package/dist/types/src/components/ControlSection/ControlSection.stories.d.ts +5 -4
- package/dist/types/src/components/ControlSection/ControlSection.stories.d.ts.map +1 -1
- package/dist/types/src/components/FieldEditor/FieldEditor.stories.d.ts +5 -4
- package/dist/types/src/components/FieldEditor/FieldEditor.stories.d.ts.map +1 -1
- package/dist/types/src/components/Form/ArrayField.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/Form.stories.d.ts +46 -31
- package/dist/types/src/components/Form/Form.stories.d.ts.map +1 -1
- package/dist/types/src/components/Form/FormActions.d.ts.map +1 -1
- package/dist/types/src/components/Form/FormContext.d.ts +3 -3
- package/dist/types/src/components/Form/FormContext.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/custom/SelectOptionsInput.stories.d.ts +5 -4
- package/dist/types/src/components/Form/custom/SelectOptionsInput.stories.d.ts.map +1 -1
- package/dist/types/src/components/Form/factory.d.ts +2 -2
- package/dist/types/src/components/Form/factory.d.ts.map +1 -1
- package/dist/types/src/components/ObjectPicker/ObjectPicker.stories.d.ts +5 -4
- package/dist/types/src/components/ObjectPicker/ObjectPicker.stories.d.ts.map +1 -1
- package/dist/types/src/components/ViewEditor/ViewEditor.d.ts +2 -2
- package/dist/types/src/components/ViewEditor/ViewEditor.d.ts.map +1 -1
- package/dist/types/src/components/ViewEditor/ViewEditor.stories.d.ts +6 -5
- package/dist/types/src/components/ViewEditor/ViewEditor.stories.d.ts.map +1 -1
- package/dist/types/src/hooks/useForm.d.ts +4 -4
- package/dist/types/src/hooks/useForm.d.ts.map +1 -1
- package/dist/types/src/translations.d.ts +5 -4
- package/dist/types/src/translations.d.ts.map +1 -1
- 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/tsconfig.tsbuildinfo +1 -1
- package/package.json +31 -31
- package/src/components/FieldEditor/FieldEditor.stories.tsx +2 -2
- package/src/components/FieldEditor/FieldEditor.tsx +3 -3
- package/src/components/Form/ArrayField.tsx +3 -1
- package/src/components/Form/Form.stories.tsx +21 -21
- package/src/components/Form/Form.tsx +4 -4
- package/src/components/Form/FormActions.tsx +7 -2
- package/src/components/Form/FormContent.tsx +1 -1
- package/src/components/Form/FormContext.tsx +4 -4
- package/src/components/Form/Input.tsx +2 -2
- package/src/components/Form/factory.tsx +7 -4
- package/src/components/ViewEditor/ViewEditor.stories.tsx +3 -6
- package/src/components/ViewEditor/ViewEditor.tsx +13 -24
- package/src/hooks/useForm.ts +5 -5
- package/src/hooks/useRefQueryLookupHandler.ts +3 -3
- package/src/translations.ts +5 -4
- package/src/util/field.ts +25 -25
- package/src/util/formatting.ts +22 -22
- package/src/util/refs.ts +2 -2
package/src/util/field.ts
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
// Copyright 2024 DXOS.org
|
|
3
3
|
//
|
|
4
4
|
|
|
5
|
-
import {
|
|
5
|
+
import { Format, GeoLocation, TypeEnum } from '@dxos/echo/internal';
|
|
6
6
|
import { type ValidationError } from '@dxos/schema';
|
|
7
7
|
|
|
8
8
|
/**
|
|
@@ -13,7 +13,7 @@ import { type ValidationError } from '@dxos/schema';
|
|
|
13
13
|
*/
|
|
14
14
|
export type ParseProps = {
|
|
15
15
|
type?: TypeEnum;
|
|
16
|
-
format?:
|
|
16
|
+
format?: Format.TypeFormat;
|
|
17
17
|
value: any;
|
|
18
18
|
};
|
|
19
19
|
|
|
@@ -57,31 +57,31 @@ export const parseValue = ({ type, format, value }: ParseProps) => {
|
|
|
57
57
|
}
|
|
58
58
|
|
|
59
59
|
switch (format) {
|
|
60
|
-
case
|
|
60
|
+
case Format.TypeFormat.Boolean:
|
|
61
61
|
return parseScalar(TypeEnum.Boolean);
|
|
62
62
|
|
|
63
|
-
case
|
|
64
|
-
case
|
|
65
|
-
case
|
|
63
|
+
case Format.TypeFormat.Number:
|
|
64
|
+
case Format.TypeFormat.Percent:
|
|
65
|
+
case Format.TypeFormat.Currency:
|
|
66
66
|
return parseScalar(TypeEnum.Number);
|
|
67
67
|
|
|
68
|
-
case
|
|
69
|
-
case
|
|
68
|
+
case Format.TypeFormat.String:
|
|
69
|
+
case Format.TypeFormat.Markdown: {
|
|
70
70
|
return parseScalar(TypeEnum.String);
|
|
71
71
|
}
|
|
72
72
|
|
|
73
|
-
case
|
|
74
|
-
throw new Error(`unexpected format: ${
|
|
73
|
+
case Format.TypeFormat.Ref:
|
|
74
|
+
throw new Error(`unexpected format: ${Format.TypeFormat.Ref}`);
|
|
75
75
|
|
|
76
|
-
case
|
|
77
|
-
case
|
|
78
|
-
case
|
|
79
|
-
case
|
|
76
|
+
case Format.TypeFormat.DateTime:
|
|
77
|
+
case Format.TypeFormat.Date:
|
|
78
|
+
case Format.TypeFormat.Time:
|
|
79
|
+
case Format.TypeFormat.Timestamp: {
|
|
80
80
|
const date = new Date(value as string | number);
|
|
81
81
|
return isNaN(date.getTime()) ? null : date;
|
|
82
82
|
}
|
|
83
83
|
|
|
84
|
-
case
|
|
84
|
+
case Format.TypeFormat.GeoPoint: {
|
|
85
85
|
// Parse string in format "lat,long" to GeoPoint [longitude, latitude].
|
|
86
86
|
if (typeof value === 'string') {
|
|
87
87
|
// Only keep digits, decimal points, minus signs, and commas.
|
|
@@ -108,23 +108,23 @@ export const parseValue = ({ type, format, value }: ParseProps) => {
|
|
|
108
108
|
// TODO(burdon): Type and format.
|
|
109
109
|
export type CellClassesForFieldTypeProps = {
|
|
110
110
|
type?: TypeEnum;
|
|
111
|
-
format?:
|
|
111
|
+
format?: Format.TypeFormat;
|
|
112
112
|
};
|
|
113
113
|
|
|
114
114
|
export const cellClassesForFieldType = ({ type, format }: CellClassesForFieldTypeProps): string[] | undefined => {
|
|
115
115
|
switch (format || type) {
|
|
116
|
-
case
|
|
116
|
+
case Format.TypeFormat.Markdown:
|
|
117
117
|
return undefined;
|
|
118
|
-
case
|
|
119
|
-
case
|
|
120
|
-
case
|
|
121
|
-
case
|
|
122
|
-
case
|
|
118
|
+
case Format.TypeFormat.Time:
|
|
119
|
+
case Format.TypeFormat.Timestamp:
|
|
120
|
+
case Format.TypeFormat.DateTime:
|
|
121
|
+
case Format.TypeFormat.Date:
|
|
122
|
+
case Format.TypeFormat.Duration:
|
|
123
123
|
return ['font-mono', 'text-right'];
|
|
124
|
-
case
|
|
124
|
+
case Format.TypeFormat.Currency:
|
|
125
125
|
return ['text-right'];
|
|
126
|
-
case
|
|
127
|
-
case
|
|
126
|
+
case Format.TypeFormat.JSON:
|
|
127
|
+
case Format.TypeFormat.DID:
|
|
128
128
|
return ['font-mono'];
|
|
129
129
|
case TypeEnum.Number:
|
|
130
130
|
case TypeEnum.Boolean:
|
package/src/util/formatting.ts
CHANGED
|
@@ -4,11 +4,11 @@
|
|
|
4
4
|
|
|
5
5
|
import { format as formatDate } from 'date-fns/format';
|
|
6
6
|
|
|
7
|
-
import {
|
|
7
|
+
import { Format, GeoLocation, TypeEnum } from '@dxos/echo/internal';
|
|
8
8
|
|
|
9
9
|
type ValueFormatProps = {
|
|
10
10
|
type: TypeEnum;
|
|
11
|
-
format?:
|
|
11
|
+
format?: Format.TypeFormat | undefined;
|
|
12
12
|
value: any;
|
|
13
13
|
locale?: string | undefined;
|
|
14
14
|
};
|
|
@@ -41,20 +41,20 @@ export const formatForDisplay = ({ type, format, value, locale = undefined }: Va
|
|
|
41
41
|
}
|
|
42
42
|
|
|
43
43
|
switch (format) {
|
|
44
|
-
case
|
|
44
|
+
case Format.TypeFormat.Boolean: {
|
|
45
45
|
return formatScalar(TypeEnum.Boolean);
|
|
46
46
|
}
|
|
47
|
-
case
|
|
47
|
+
case Format.TypeFormat.Number: {
|
|
48
48
|
return formatScalar(TypeEnum.Number);
|
|
49
49
|
}
|
|
50
|
-
case
|
|
51
|
-
case
|
|
50
|
+
case Format.TypeFormat.String:
|
|
51
|
+
case Format.TypeFormat.Ref: {
|
|
52
52
|
return formatScalar(TypeEnum.String);
|
|
53
53
|
}
|
|
54
|
-
case
|
|
54
|
+
case Format.TypeFormat.Percent: {
|
|
55
55
|
return `${(value as number) * 100}%`;
|
|
56
56
|
}
|
|
57
|
-
case
|
|
57
|
+
case Format.TypeFormat.Currency: {
|
|
58
58
|
// TODO(burdon): Get from property annotation.
|
|
59
59
|
return (value as number).toLocaleString(locale, {
|
|
60
60
|
style: 'currency',
|
|
@@ -63,28 +63,28 @@ export const formatForDisplay = ({ type, format, value, locale = undefined }: Va
|
|
|
63
63
|
maximumFractionDigits: 2,
|
|
64
64
|
});
|
|
65
65
|
}
|
|
66
|
-
case
|
|
66
|
+
case Format.TypeFormat.Date: {
|
|
67
67
|
try {
|
|
68
68
|
return formatDate(new Date(value as number), 'yyyy-MM-dd');
|
|
69
69
|
} catch (error) {
|
|
70
70
|
return 'Invalid Date';
|
|
71
71
|
}
|
|
72
72
|
}
|
|
73
|
-
case
|
|
73
|
+
case Format.TypeFormat.Time: {
|
|
74
74
|
try {
|
|
75
75
|
return formatDate(new Date(value as number), 'HH:mm:ss');
|
|
76
76
|
} catch (error) {
|
|
77
77
|
return 'Invalid Time';
|
|
78
78
|
}
|
|
79
79
|
}
|
|
80
|
-
case
|
|
80
|
+
case Format.TypeFormat.DateTime: {
|
|
81
81
|
try {
|
|
82
82
|
return formatDate(new Date(value as number), 'yyyy-MM-dd HH:mm:ss');
|
|
83
83
|
} catch (error) {
|
|
84
84
|
return 'Invalid DateTime';
|
|
85
85
|
}
|
|
86
86
|
}
|
|
87
|
-
case
|
|
87
|
+
case Format.TypeFormat.GeoPoint: {
|
|
88
88
|
if (value === null || value === undefined) {
|
|
89
89
|
return '';
|
|
90
90
|
}
|
|
@@ -125,31 +125,31 @@ export const formatForEditing = ({ type, format, value, locale = undefined }: Va
|
|
|
125
125
|
}
|
|
126
126
|
|
|
127
127
|
switch (format) {
|
|
128
|
-
case
|
|
129
|
-
case
|
|
130
|
-
case
|
|
131
|
-
case
|
|
128
|
+
case Format.TypeFormat.Boolean:
|
|
129
|
+
case Format.TypeFormat.Number:
|
|
130
|
+
case Format.TypeFormat.String:
|
|
131
|
+
case Format.TypeFormat.Ref: {
|
|
132
132
|
return formatScalar(type);
|
|
133
133
|
}
|
|
134
|
-
case
|
|
134
|
+
case Format.TypeFormat.Percent: {
|
|
135
135
|
return String(value * 100);
|
|
136
136
|
}
|
|
137
|
-
case
|
|
137
|
+
case Format.TypeFormat.Currency: {
|
|
138
138
|
return String(value);
|
|
139
139
|
}
|
|
140
|
-
case
|
|
140
|
+
case Format.TypeFormat.DateTime: {
|
|
141
141
|
const date = new Date(value as number);
|
|
142
142
|
return date.toISOString();
|
|
143
143
|
}
|
|
144
|
-
case
|
|
144
|
+
case Format.TypeFormat.Date: {
|
|
145
145
|
const date = new Date(value as number);
|
|
146
146
|
return date.toISOString().split('T')[0];
|
|
147
147
|
}
|
|
148
|
-
case
|
|
148
|
+
case Format.TypeFormat.Time: {
|
|
149
149
|
const date = new Date(value as number);
|
|
150
150
|
return date.toISOString().split('T')[1].split('.')[0];
|
|
151
151
|
}
|
|
152
|
-
case
|
|
152
|
+
case Format.TypeFormat.GeoPoint: {
|
|
153
153
|
// Handle null or undefined
|
|
154
154
|
if (value === null || value === undefined) {
|
|
155
155
|
return '';
|
package/src/util/refs.ts
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
|
|
5
5
|
import type * as SchemaAST from 'effect/SchemaAST';
|
|
6
6
|
|
|
7
|
-
import {
|
|
7
|
+
import { Format, ReferenceAnnotationId } from '@dxos/echo/internal';
|
|
8
8
|
import { findAnnotation } from '@dxos/effect';
|
|
9
9
|
import { type SchemaProperty } from '@dxos/schema';
|
|
10
10
|
|
|
@@ -30,7 +30,7 @@ export const getRefProps = (property: SchemaProperty<any>): RefProps | undefined
|
|
|
30
30
|
}
|
|
31
31
|
|
|
32
32
|
// Direct reference.
|
|
33
|
-
if (format ===
|
|
33
|
+
if (format === Format.TypeFormat.Ref) {
|
|
34
34
|
return { ast, isArray: false };
|
|
35
35
|
}
|
|
36
36
|
|