@contember/react-form 2.1.0-alpha.8 → 2.1.0-beta.1
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/CLAUDE.md +19 -0
- package/dist/development/index.cjs +6 -6
- package/dist/development/index.js +3 -3
- package/dist/development/src/components/FormCheckbox.cjs +2 -2
- package/dist/development/src/components/FormCheckbox.cjs.map +1 -1
- package/dist/development/src/components/FormCheckbox.js +2 -2
- package/dist/development/src/components/FormCheckbox.js.map +1 -1
- package/dist/development/src/components/FormError.cjs.map +1 -1
- package/dist/development/src/components/FormError.js.map +1 -1
- package/dist/development/src/components/FormFieldScope.cjs.map +1 -1
- package/dist/development/src/components/FormFieldScope.js.map +1 -1
- package/dist/development/src/components/FormFieldStateProvider.cjs +2 -2
- package/dist/development/src/components/FormFieldStateProvider.cjs.map +1 -1
- package/dist/development/src/components/FormFieldStateProvider.js +4 -4
- package/dist/development/src/components/FormFieldStateProvider.js.map +1 -1
- package/dist/development/src/components/FormHasManyRelationScope.cjs.map +1 -1
- package/dist/development/src/components/FormHasManyRelationScope.js.map +1 -1
- package/dist/development/src/components/FormHasOneRelationScope.cjs.map +1 -1
- package/dist/development/src/components/FormHasOneRelationScope.js.map +1 -1
- package/dist/development/src/components/FormInput.cjs +47 -44
- package/dist/development/src/components/FormInput.cjs.map +1 -1
- package/dist/development/src/components/FormInput.js +47 -44
- package/dist/development/src/components/FormInput.js.map +1 -1
- package/dist/development/src/components/FormLabel.cjs.map +1 -1
- package/dist/development/src/components/FormLabel.js.map +1 -1
- package/dist/development/src/components/FormRadioInput.cjs.map +1 -1
- package/dist/development/src/components/FormRadioInput.js.map +1 -1
- package/dist/development/src/contexts.cjs.map +1 -1
- package/dist/development/src/contexts.js.map +1 -1
- package/dist/development/src/hooks/useFormInputValidationHandler.cjs +1 -1
- package/dist/development/src/hooks/useFormInputValidationHandler.cjs.map +1 -1
- package/dist/development/src/hooks/useFormInputValidationHandler.js +1 -1
- package/dist/development/src/hooks/useFormInputValidationHandler.js.map +1 -1
- package/dist/development/src/internal/useFormInputHandler.cjs.map +1 -1
- package/dist/development/src/internal/useFormInputHandler.js.map +1 -1
- package/dist/production/index.cjs +6 -6
- package/dist/production/index.js +3 -3
- package/dist/production/src/components/FormCheckbox.cjs.map +1 -1
- package/dist/production/src/components/FormCheckbox.js.map +1 -1
- package/dist/production/src/components/FormError.cjs.map +1 -1
- package/dist/production/src/components/FormError.js.map +1 -1
- package/dist/production/src/components/FormFieldScope.cjs.map +1 -1
- package/dist/production/src/components/FormFieldScope.js.map +1 -1
- package/dist/production/src/components/FormFieldStateProvider.cjs.map +1 -1
- package/dist/production/src/components/FormFieldStateProvider.js +1 -1
- package/dist/production/src/components/FormFieldStateProvider.js.map +1 -1
- package/dist/production/src/components/FormHasManyRelationScope.cjs.map +1 -1
- package/dist/production/src/components/FormHasManyRelationScope.js.map +1 -1
- package/dist/production/src/components/FormHasOneRelationScope.cjs.map +1 -1
- package/dist/production/src/components/FormHasOneRelationScope.js.map +1 -1
- package/dist/production/src/components/FormInput.cjs +36 -33
- package/dist/production/src/components/FormInput.cjs.map +1 -1
- package/dist/production/src/components/FormInput.js +36 -33
- package/dist/production/src/components/FormInput.js.map +1 -1
- package/dist/production/src/components/FormLabel.cjs.map +1 -1
- package/dist/production/src/components/FormLabel.js.map +1 -1
- package/dist/production/src/components/FormRadioInput.cjs.map +1 -1
- package/dist/production/src/components/FormRadioInput.js.map +1 -1
- package/dist/production/src/contexts.cjs.map +1 -1
- package/dist/production/src/contexts.js.map +1 -1
- package/dist/production/src/hooks/useFormInputValidationHandler.cjs +1 -1
- package/dist/production/src/hooks/useFormInputValidationHandler.cjs.map +1 -1
- package/dist/production/src/hooks/useFormInputValidationHandler.js +1 -1
- package/dist/production/src/hooks/useFormInputValidationHandler.js.map +1 -1
- package/dist/production/src/internal/useFormInputHandler.cjs.map +1 -1
- package/dist/production/src/internal/useFormInputHandler.js.map +1 -1
- package/dist/types/components/FormCheckbox.d.ts.map +1 -1
- package/dist/types/components/FormError.d.ts +1 -1
- package/dist/types/components/FormError.d.ts.map +1 -1
- package/dist/types/components/FormFieldStateProvider.d.ts.map +1 -1
- package/dist/types/components/FormInput.d.ts.map +1 -1
- package/dist/types/contexts.d.ts.map +1 -1
- package/dist/types/hooks/useFormInputValidationHandler.d.ts +1 -1
- package/dist/types/tsconfig.tsbuildinfo +1 -1
- package/package.json +10 -10
- package/src/components/FormCheckbox.tsx +2 -1
- package/src/components/FormError.tsx +1 -1
- package/src/components/FormFieldStateProvider.tsx +0 -2
- package/src/components/FormInput.tsx +35 -32
- package/src/components/FormRadioInput.tsx +1 -1
- package/src/contexts.tsx +0 -2
- package/src/hooks/useFormInputValidationHandler.tsx +1 -1
- package/src/internal/useFormInputHandler.ts +6 -6
package/CLAUDE.md
ADDED
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
# react-form
|
|
2
|
+
|
|
3
|
+
Low-level form components for creating HTML inputs bound to entity fields.
|
|
4
|
+
|
|
5
|
+
## Core Components
|
|
6
|
+
|
|
7
|
+
- `FormInput` — slot-based input with value formatting/parsing via `FormInputHandler`
|
|
8
|
+
- `FormLabel` — accessible label component
|
|
9
|
+
- `FormCheckbox`, `FormRadioInput` — specialized inputs
|
|
10
|
+
- `FormFieldStateProvider` — context for field state (errors, dirty, validation)
|
|
11
|
+
- `FormFieldScope`, `FormHasOneRelationScope`, `FormHasManyRelationScope` — scope providers
|
|
12
|
+
|
|
13
|
+
## FormInputHandler
|
|
14
|
+
|
|
15
|
+
Type-specific parsing/formatting with `parseValue`, `formatValue`, and `defaultInputProps` for column types: String, Integer, Double, Date, DateTime, Time, Bool, Enum.
|
|
16
|
+
|
|
17
|
+
## Binding Integration
|
|
18
|
+
|
|
19
|
+
Uses `useField()` and `useEntity()` from react-binding. `FormInput` reads/writes via `FieldAccessor`, accesses schema info for type-aware parsing. Validation handled via `useFormInputValidationHandler` (blur/focus).
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
3
|
const contexts = require("./src/contexts.cjs");
|
|
4
|
-
const FormError = require("./src/components/FormError.cjs");
|
|
5
4
|
const FormCheckbox = require("./src/components/FormCheckbox.cjs");
|
|
6
|
-
const
|
|
5
|
+
const FormError = require("./src/components/FormError.cjs");
|
|
7
6
|
const FormFieldStateProvider = require("./src/components/FormFieldStateProvider.cjs");
|
|
8
|
-
const
|
|
7
|
+
const FormFieldScope = require("./src/components/FormFieldScope.cjs");
|
|
9
8
|
const FormHasManyRelationScope = require("./src/components/FormHasManyRelationScope.cjs");
|
|
9
|
+
const FormHasOneRelationScope = require("./src/components/FormHasOneRelationScope.cjs");
|
|
10
10
|
const FormInput = require("./src/components/FormInput.cjs");
|
|
11
11
|
const FormLabel = require("./src/components/FormLabel.cjs");
|
|
12
12
|
const FormRadioInput = require("./src/components/FormRadioInput.cjs");
|
|
@@ -15,14 +15,14 @@ exports.FormFieldStateContext = contexts.FormFieldStateContext;
|
|
|
15
15
|
exports.useFormError = contexts.useFormError;
|
|
16
16
|
exports.useFormFieldId = contexts.useFormFieldId;
|
|
17
17
|
exports.useFormFieldState = contexts.useFormFieldState;
|
|
18
|
-
exports.FormError = FormError.FormError;
|
|
19
18
|
exports.FormCheckbox = FormCheckbox.FormCheckbox;
|
|
20
|
-
exports.
|
|
19
|
+
exports.FormError = FormError.FormError;
|
|
21
20
|
exports.FormErrorContext = FormFieldStateProvider.FormErrorContext;
|
|
22
21
|
exports.FormFieldIdContext = FormFieldStateProvider.FormFieldIdContext;
|
|
23
22
|
exports.FormFieldStateProvider = FormFieldStateProvider.FormFieldStateProvider;
|
|
24
|
-
exports.
|
|
23
|
+
exports.FormFieldScope = FormFieldScope.FormFieldScope;
|
|
25
24
|
exports.FormHasManyRelationScope = FormHasManyRelationScope.FormHasManyRelationScope;
|
|
25
|
+
exports.FormHasOneRelationScope = FormHasOneRelationScope.FormHasOneRelationScope;
|
|
26
26
|
exports.FormInput = FormInput.FormInput;
|
|
27
27
|
exports.FormLabel = FormLabel.FormLabel;
|
|
28
28
|
exports.FormRadioInput = FormRadioInput.FormRadioInput;
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { FormFieldStateContext, useFormError, useFormFieldId, useFormFieldState } from "./src/contexts.js";
|
|
2
|
-
import { FormError } from "./src/components/FormError.js";
|
|
3
2
|
import { FormCheckbox } from "./src/components/FormCheckbox.js";
|
|
4
|
-
import {
|
|
3
|
+
import { FormError } from "./src/components/FormError.js";
|
|
5
4
|
import { FormErrorContext, FormFieldIdContext, FormFieldStateProvider } from "./src/components/FormFieldStateProvider.js";
|
|
6
|
-
import {
|
|
5
|
+
import { FormFieldScope } from "./src/components/FormFieldScope.js";
|
|
7
6
|
import { FormHasManyRelationScope } from "./src/components/FormHasManyRelationScope.js";
|
|
7
|
+
import { FormHasOneRelationScope } from "./src/components/FormHasOneRelationScope.js";
|
|
8
8
|
import { FormInput } from "./src/components/FormInput.js";
|
|
9
9
|
import { FormLabel } from "./src/components/FormLabel.js";
|
|
10
10
|
import { FormRadioInput } from "./src/components/FormRadioInput.js";
|
|
@@ -65,7 +65,7 @@ const FormCheckbox = reactBinding.Component(({ field, isNonbearing, defaultValue
|
|
|
65
65
|
false,
|
|
66
66
|
{
|
|
67
67
|
fileName: "/home/runner/work/contember/contember/packages/react-form/src/components/FormCheckbox.tsx",
|
|
68
|
-
lineNumber:
|
|
68
|
+
lineNumber: 46,
|
|
69
69
|
columnNumber: 3
|
|
70
70
|
},
|
|
71
71
|
void 0
|
|
@@ -75,7 +75,7 @@ const FormCheckbox = reactBinding.Component(({ field, isNonbearing, defaultValue
|
|
|
75
75
|
const resolvedDefaultValue = defaultValue !== void 0 ? defaultValue : node.field.defaultValue ?? (node.field.nullable ? null : false);
|
|
76
76
|
return /* @__PURE__ */ jsxDevRuntime.jsxDEV(reactBinding.Field, { field, isNonbearing, defaultValue: resolvedDefaultValue }, void 0, false, {
|
|
77
77
|
fileName: "/home/runner/work/contember/contember/packages/react-form/src/components/FormCheckbox.tsx",
|
|
78
|
-
lineNumber:
|
|
78
|
+
lineNumber: 69,
|
|
79
79
|
columnNumber: 9
|
|
80
80
|
}, void 0);
|
|
81
81
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormCheckbox.cjs","sources":["../../../../../packages/react-form/src/components/FormCheckbox.tsx"],"sourcesContent":["import * as React from 'react'\nimport { ChangeEventHandler, ReactElement, useCallback, useEffect } from 'react'\nimport {\n\tComponent,\n\tField,\n\tOptionallyVariableFieldValue,\n\tSugaredRelativeSingleField,\n\tTreeNodeEnvironmentFactory,\n\tuseField,\n} from '@contember/react-binding'\nimport { useFormFieldState } from '../contexts'\nimport { dataAttribute } from '@contember/utilities'\nimport { useFormInputValidationHandler } from '../hooks'\nimport { Slot } from '@radix-ui/react-slot'\n\nconst SlotInput = Slot as React.ForwardRefExoticComponent<React.RefAttributes<HTMLInputElement> & React.InputHTMLAttributes<HTMLInputElement>>\n\nexport interface FormCheckboxProps {\n\tfield: SugaredRelativeSingleField['field']\n\tisNonbearing?: boolean\n\tdefaultValue?: OptionallyVariableFieldValue\n\tchildren: ReactElement<HTMLInputElement, 'input'>\n}\n\nexport const FormCheckbox = Component<FormCheckboxProps>(({ field, isNonbearing, defaultValue, ...props }) => {\n\tconst accessor = useField<boolean>(field)\n\n\tconst formState = useFormFieldState()\n\tconst id = formState?.htmlId\n\tconst hasErrors = (formState?.errors.length ?? accessor.errors?.errors?.length ?? 0) > 0\n\tconst dirty = formState?.dirty ?? accessor.hasUnpersistedChanges\n\tconst value = accessor.value\n\tconst accessorGetter = accessor.getAccessor\n\tconst { ref, onFocus, onBlur } = useFormInputValidationHandler(accessor)\n\tconst [checkboxRef, setCheckboxRef] = React.useState<HTMLInputElement | null>(null)\n\n\tuseEffect(() => {\n\t\tif (!checkboxRef) {\n\t\t\treturn\n\t\t}\n\t\tcheckboxRef.indeterminate = value === null\n\t}, [checkboxRef, ref, value])\n\n\treturn (\n\t\t<SlotInput\n\t\t\tref={it => {\n\t\t\t\t(ref as any).current = checkboxRef\n\t\t\t\tsetCheckboxRef(it)\n\t\t\t}}\n\t\t\ttype=\"checkbox\"\n\t\t\tchecked={accessor.value === true}\n\t\t\tdata-state={value === null ? 'indeterminate' : (value ? 'checked' : 'unchecked')}\n\t\t\tdata-invalid={dataAttribute(hasErrors)}\n\t\t\tdata-dirty={dataAttribute(dirty)}\n\t\t\tid={id ? `${id}-input` : undefined}\n\t\t\tonFocus={onFocus}\n\t\t\tonBlur={onBlur}\n\t\t\tonChange={useCallback<ChangeEventHandler<HTMLInputElement>>(e => {\n\t\t\t\taccessorGetter().updateValue(e.target.checked)\n\t\t\t}, [accessorGetter])}\n\t\t\t{...props}\n\t\t/>\n\t)\n}, ({ field, isNonbearing, defaultValue }, env) => {\n\tconst node = TreeNodeEnvironmentFactory.createEnvironmentForField(env, { field }).getSubTreeNode()\n\tconst resolvedDefaultValue = defaultValue !== undefined ? defaultValue : (node.field.defaultValue ?? (node.field.nullable ? null : false))\n\n\treturn <Field field={field} isNonbearing={isNonbearing} defaultValue={resolvedDefaultValue} />\n})\n"],"names":["Slot","Component","useField","useFormFieldState","useFormInputValidationHandler","React","useEffect","jsxDEV","dataAttribute","useCallback","this","TreeNodeEnvironmentFactory","Field"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAeA,MAAM,YAAYA,
|
|
1
|
+
{"version":3,"file":"FormCheckbox.cjs","sources":["../../../../../packages/react-form/src/components/FormCheckbox.tsx"],"sourcesContent":["import * as React from 'react'\nimport { ChangeEventHandler, ReactElement, useCallback, useEffect } from 'react'\nimport {\n\tComponent,\n\tField,\n\tOptionallyVariableFieldValue,\n\tSugaredRelativeSingleField,\n\tTreeNodeEnvironmentFactory,\n\tuseField,\n} from '@contember/react-binding'\nimport { useFormFieldState } from '../contexts'\nimport { dataAttribute } from '@contember/utilities'\nimport { useFormInputValidationHandler } from '../hooks'\nimport { Slot } from '@radix-ui/react-slot'\n\nconst SlotInput = Slot as React.ForwardRefExoticComponent<React.RefAttributes<HTMLInputElement> & React.InputHTMLAttributes<HTMLInputElement>>\n\nexport interface FormCheckboxProps {\n\tfield: SugaredRelativeSingleField['field']\n\tisNonbearing?: boolean\n\tdefaultValue?: OptionallyVariableFieldValue\n\tchildren: ReactElement<HTMLInputElement, 'input'>\n}\n\nexport const FormCheckbox = Component<FormCheckboxProps>(({ field, isNonbearing, defaultValue, ...props }) => {\n\tconst accessor = useField<boolean>(field)\n\n\tconst formState = useFormFieldState()\n\tconst id = formState?.htmlId\n\tconst hasErrors = (formState?.errors.length ?? accessor.errors?.errors?.length ?? 0) > 0\n\tconst dirty = formState?.dirty ?? accessor.hasUnpersistedChanges\n\tconst value = accessor.value\n\tconst accessorGetter = accessor.getAccessor\n\tconst { ref, onFocus, onBlur } = useFormInputValidationHandler(accessor)\n\tconst [checkboxRef, setCheckboxRef] = React.useState<HTMLInputElement | null>(null)\n\n\t// biome-ignore lint/correctness/useExhaustiveDependencies: intentional\n\tuseEffect(() => {\n\t\tif (!checkboxRef) {\n\t\t\treturn\n\t\t}\n\t\tcheckboxRef.indeterminate = value === null\n\t}, [checkboxRef, ref, value])\n\n\treturn (\n\t\t<SlotInput\n\t\t\tref={it => {\n\t\t\t\t;(ref as any).current = checkboxRef\n\t\t\t\tsetCheckboxRef(it)\n\t\t\t}}\n\t\t\ttype=\"checkbox\"\n\t\t\tchecked={accessor.value === true}\n\t\t\tdata-state={value === null ? 'indeterminate' : (value ? 'checked' : 'unchecked')}\n\t\t\tdata-invalid={dataAttribute(hasErrors)}\n\t\t\tdata-dirty={dataAttribute(dirty)}\n\t\t\tid={id ? `${id}-input` : undefined}\n\t\t\tonFocus={onFocus}\n\t\t\tonBlur={onBlur}\n\t\t\tonChange={useCallback<ChangeEventHandler<HTMLInputElement>>(e => {\n\t\t\t\taccessorGetter().updateValue(e.target.checked)\n\t\t\t}, [accessorGetter])}\n\t\t\t{...props}\n\t\t/>\n\t)\n}, ({ field, isNonbearing, defaultValue }, env) => {\n\tconst node = TreeNodeEnvironmentFactory.createEnvironmentForField(env, { field }).getSubTreeNode()\n\tconst resolvedDefaultValue = defaultValue !== undefined ? defaultValue : (node.field.defaultValue ?? (node.field.nullable ? null : false))\n\n\treturn <Field field={field} isNonbearing={isNonbearing} defaultValue={resolvedDefaultValue} />\n})\n"],"names":["Slot","Component","useField","useFormFieldState","useFormInputValidationHandler","React","useEffect","jsxDEV","dataAttribute","useCallback","this","TreeNodeEnvironmentFactory","Field"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAeA,MAAM,YAAYA,UAAAA;AASX,MAAM,eAAeC,aAAAA,UAA6B,CAAC,EAAE,OAAO,cAAc,cAAc,GAAG,YAAY;AAC7G,QAAM,WAAWC,aAAAA,SAAkB,KAAK;AAExC,QAAM,YAAYC,SAAAA,kBAAA;AAClB,QAAM,KAAK,WAAW;AACtB,QAAM,aAAa,WAAW,OAAO,UAAU,SAAS,QAAQ,QAAQ,UAAU,KAAK;AACvF,QAAM,QAAQ,WAAW,SAAS,SAAS;AAC3C,QAAM,QAAQ,SAAS;AACvB,QAAM,iBAAiB,SAAS;AAChC,QAAM,EAAE,KAAK,SAAS,OAAA,IAAWC,8BAAAA,8BAA8B,QAAQ;AACvE,QAAM,CAAC,aAAa,cAAc,IAAIC,iBAAM,SAAkC,IAAI;AAGlFC,QAAAA,UAAU,MAAM;AACf,QAAI,CAAC,aAAa;AACjB;AAAA,IACD;AACA,gBAAY,gBAAgB,UAAU;AAAA,EACvC,GAAG,CAAC,aAAa,KAAK,KAAK,CAAC;AAE5B,SACCC,8BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACA,KAAK,CAAA,OAAM;AACR,YAAY,UAAU;AACxB,uBAAe,EAAE;AAAA,MAClB;AAAA,MACA,MAAK;AAAA,MACL,SAAS,SAAS,UAAU;AAAA,MAC5B,cAAY,UAAU,OAAO,kBAAmB,QAAQ,YAAY;AAAA,MACpE,gBAAcC,UAAAA,cAAc,SAAS;AAAA,MACrC,cAAYA,UAAAA,cAAc,KAAK;AAAA,MAC/B,IAAI,KAAK,GAAG,EAAE,WAAW;AAAA,MACzB;AAAA,MACA;AAAA,MACA,UAAUC,MAAAA,YAAkD,CAAA,MAAK;AAChE,uBAAA,EAAiB,YAAY,EAAE,OAAO,OAAO;AAAA,MAC9C,GAAG,CAAC,cAAc,CAAC;AAAA,MAClB,GAAG;AAAA,IAAA;AAAA,IAhBL;AAAA,IAAA;AAAA,IAAA;AAAA,MAAA,UAAA;AAAA,MAAA,YAAA;AAAA,MAAA,cAAA;AAAA,IAAA;AAAA,IAAAC;AAAAA,EAAA;AAmBF,GAAG,CAAC,EAAE,OAAO,cAAc,aAAA,GAAgB,QAAQ;AAClD,QAAM,OAAOC,aAAAA,2BAA2B,0BAA0B,KAAK,EAAE,MAAA,CAAO,EAAE,eAAA;AAClF,QAAM,uBAAuB,iBAAiB,SAAY,eAAgB,KAAK,MAAM,iBAAiB,KAAK,MAAM,WAAW,OAAO;AAEnI,SAAOJ,8BAAAA,OAACK,oBAAA,EAAM,OAAc,cAA4B,cAAc,qBAAA,GAA/D,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAF,MAAqF;AAC7F,CAAC;;"}
|
|
@@ -47,7 +47,7 @@ const FormCheckbox = Component(({ field, isNonbearing, defaultValue, ...props })
|
|
|
47
47
|
false,
|
|
48
48
|
{
|
|
49
49
|
fileName: "/home/runner/work/contember/contember/packages/react-form/src/components/FormCheckbox.tsx",
|
|
50
|
-
lineNumber:
|
|
50
|
+
lineNumber: 46,
|
|
51
51
|
columnNumber: 3
|
|
52
52
|
},
|
|
53
53
|
void 0
|
|
@@ -57,7 +57,7 @@ const FormCheckbox = Component(({ field, isNonbearing, defaultValue, ...props })
|
|
|
57
57
|
const resolvedDefaultValue = defaultValue !== void 0 ? defaultValue : node.field.defaultValue ?? (node.field.nullable ? null : false);
|
|
58
58
|
return /* @__PURE__ */ jsxDEV(Field, { field, isNonbearing, defaultValue: resolvedDefaultValue }, void 0, false, {
|
|
59
59
|
fileName: "/home/runner/work/contember/contember/packages/react-form/src/components/FormCheckbox.tsx",
|
|
60
|
-
lineNumber:
|
|
60
|
+
lineNumber: 69,
|
|
61
61
|
columnNumber: 9
|
|
62
62
|
}, void 0);
|
|
63
63
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormCheckbox.js","sources":["../../../../../packages/react-form/src/components/FormCheckbox.tsx"],"sourcesContent":["import * as React from 'react'\nimport { ChangeEventHandler, ReactElement, useCallback, useEffect } from 'react'\nimport {\n\tComponent,\n\tField,\n\tOptionallyVariableFieldValue,\n\tSugaredRelativeSingleField,\n\tTreeNodeEnvironmentFactory,\n\tuseField,\n} from '@contember/react-binding'\nimport { useFormFieldState } from '../contexts'\nimport { dataAttribute } from '@contember/utilities'\nimport { useFormInputValidationHandler } from '../hooks'\nimport { Slot } from '@radix-ui/react-slot'\n\nconst SlotInput = Slot as React.ForwardRefExoticComponent<React.RefAttributes<HTMLInputElement> & React.InputHTMLAttributes<HTMLInputElement>>\n\nexport interface FormCheckboxProps {\n\tfield: SugaredRelativeSingleField['field']\n\tisNonbearing?: boolean\n\tdefaultValue?: OptionallyVariableFieldValue\n\tchildren: ReactElement<HTMLInputElement, 'input'>\n}\n\nexport const FormCheckbox = Component<FormCheckboxProps>(({ field, isNonbearing, defaultValue, ...props }) => {\n\tconst accessor = useField<boolean>(field)\n\n\tconst formState = useFormFieldState()\n\tconst id = formState?.htmlId\n\tconst hasErrors = (formState?.errors.length ?? accessor.errors?.errors?.length ?? 0) > 0\n\tconst dirty = formState?.dirty ?? accessor.hasUnpersistedChanges\n\tconst value = accessor.value\n\tconst accessorGetter = accessor.getAccessor\n\tconst { ref, onFocus, onBlur } = useFormInputValidationHandler(accessor)\n\tconst [checkboxRef, setCheckboxRef] = React.useState<HTMLInputElement | null>(null)\n\n\tuseEffect(() => {\n\t\tif (!checkboxRef) {\n\t\t\treturn\n\t\t}\n\t\tcheckboxRef.indeterminate = value === null\n\t}, [checkboxRef, ref, value])\n\n\treturn (\n\t\t<SlotInput\n\t\t\tref={it => {\n\t\t\t\t(ref as any).current = checkboxRef\n\t\t\t\tsetCheckboxRef(it)\n\t\t\t}}\n\t\t\ttype=\"checkbox\"\n\t\t\tchecked={accessor.value === true}\n\t\t\tdata-state={value === null ? 'indeterminate' : (value ? 'checked' : 'unchecked')}\n\t\t\tdata-invalid={dataAttribute(hasErrors)}\n\t\t\tdata-dirty={dataAttribute(dirty)}\n\t\t\tid={id ? `${id}-input` : undefined}\n\t\t\tonFocus={onFocus}\n\t\t\tonBlur={onBlur}\n\t\t\tonChange={useCallback<ChangeEventHandler<HTMLInputElement>>(e => {\n\t\t\t\taccessorGetter().updateValue(e.target.checked)\n\t\t\t}, [accessorGetter])}\n\t\t\t{...props}\n\t\t/>\n\t)\n}, ({ field, isNonbearing, defaultValue }, env) => {\n\tconst node = TreeNodeEnvironmentFactory.createEnvironmentForField(env, { field }).getSubTreeNode()\n\tconst resolvedDefaultValue = defaultValue !== undefined ? defaultValue : (node.field.defaultValue ?? (node.field.nullable ? null : false))\n\n\treturn <Field field={field} isNonbearing={isNonbearing} defaultValue={resolvedDefaultValue} />\n})\n"],"names":["this"],"mappings":";;;;;;;;AAeA,MAAM,YAAY;
|
|
1
|
+
{"version":3,"file":"FormCheckbox.js","sources":["../../../../../packages/react-form/src/components/FormCheckbox.tsx"],"sourcesContent":["import * as React from 'react'\nimport { ChangeEventHandler, ReactElement, useCallback, useEffect } from 'react'\nimport {\n\tComponent,\n\tField,\n\tOptionallyVariableFieldValue,\n\tSugaredRelativeSingleField,\n\tTreeNodeEnvironmentFactory,\n\tuseField,\n} from '@contember/react-binding'\nimport { useFormFieldState } from '../contexts'\nimport { dataAttribute } from '@contember/utilities'\nimport { useFormInputValidationHandler } from '../hooks'\nimport { Slot } from '@radix-ui/react-slot'\n\nconst SlotInput = Slot as React.ForwardRefExoticComponent<React.RefAttributes<HTMLInputElement> & React.InputHTMLAttributes<HTMLInputElement>>\n\nexport interface FormCheckboxProps {\n\tfield: SugaredRelativeSingleField['field']\n\tisNonbearing?: boolean\n\tdefaultValue?: OptionallyVariableFieldValue\n\tchildren: ReactElement<HTMLInputElement, 'input'>\n}\n\nexport const FormCheckbox = Component<FormCheckboxProps>(({ field, isNonbearing, defaultValue, ...props }) => {\n\tconst accessor = useField<boolean>(field)\n\n\tconst formState = useFormFieldState()\n\tconst id = formState?.htmlId\n\tconst hasErrors = (formState?.errors.length ?? accessor.errors?.errors?.length ?? 0) > 0\n\tconst dirty = formState?.dirty ?? accessor.hasUnpersistedChanges\n\tconst value = accessor.value\n\tconst accessorGetter = accessor.getAccessor\n\tconst { ref, onFocus, onBlur } = useFormInputValidationHandler(accessor)\n\tconst [checkboxRef, setCheckboxRef] = React.useState<HTMLInputElement | null>(null)\n\n\t// biome-ignore lint/correctness/useExhaustiveDependencies: intentional\n\tuseEffect(() => {\n\t\tif (!checkboxRef) {\n\t\t\treturn\n\t\t}\n\t\tcheckboxRef.indeterminate = value === null\n\t}, [checkboxRef, ref, value])\n\n\treturn (\n\t\t<SlotInput\n\t\t\tref={it => {\n\t\t\t\t;(ref as any).current = checkboxRef\n\t\t\t\tsetCheckboxRef(it)\n\t\t\t}}\n\t\t\ttype=\"checkbox\"\n\t\t\tchecked={accessor.value === true}\n\t\t\tdata-state={value === null ? 'indeterminate' : (value ? 'checked' : 'unchecked')}\n\t\t\tdata-invalid={dataAttribute(hasErrors)}\n\t\t\tdata-dirty={dataAttribute(dirty)}\n\t\t\tid={id ? `${id}-input` : undefined}\n\t\t\tonFocus={onFocus}\n\t\t\tonBlur={onBlur}\n\t\t\tonChange={useCallback<ChangeEventHandler<HTMLInputElement>>(e => {\n\t\t\t\taccessorGetter().updateValue(e.target.checked)\n\t\t\t}, [accessorGetter])}\n\t\t\t{...props}\n\t\t/>\n\t)\n}, ({ field, isNonbearing, defaultValue }, env) => {\n\tconst node = TreeNodeEnvironmentFactory.createEnvironmentForField(env, { field }).getSubTreeNode()\n\tconst resolvedDefaultValue = defaultValue !== undefined ? defaultValue : (node.field.defaultValue ?? (node.field.nullable ? null : false))\n\n\treturn <Field field={field} isNonbearing={isNonbearing} defaultValue={resolvedDefaultValue} />\n})\n"],"names":["this"],"mappings":";;;;;;;;AAeA,MAAM,YAAY;AASX,MAAM,eAAe,UAA6B,CAAC,EAAE,OAAO,cAAc,cAAc,GAAG,YAAY;AAC7G,QAAM,WAAW,SAAkB,KAAK;AAExC,QAAM,YAAY,kBAAA;AAClB,QAAM,KAAK,WAAW;AACtB,QAAM,aAAa,WAAW,OAAO,UAAU,SAAS,QAAQ,QAAQ,UAAU,KAAK;AACvF,QAAM,QAAQ,WAAW,SAAS,SAAS;AAC3C,QAAM,QAAQ,SAAS;AACvB,QAAM,iBAAiB,SAAS;AAChC,QAAM,EAAE,KAAK,SAAS,OAAA,IAAW,8BAA8B,QAAQ;AACvE,QAAM,CAAC,aAAa,cAAc,IAAI,MAAM,SAAkC,IAAI;AAGlF,YAAU,MAAM;AACf,QAAI,CAAC,aAAa;AACjB;AAAA,IACD;AACA,gBAAY,gBAAgB,UAAU;AAAA,EACvC,GAAG,CAAC,aAAa,KAAK,KAAK,CAAC;AAE5B,SACC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,KAAK,CAAA,OAAM;AACR,YAAY,UAAU;AACxB,uBAAe,EAAE;AAAA,MAClB;AAAA,MACA,MAAK;AAAA,MACL,SAAS,SAAS,UAAU;AAAA,MAC5B,cAAY,UAAU,OAAO,kBAAmB,QAAQ,YAAY;AAAA,MACpE,gBAAc,cAAc,SAAS;AAAA,MACrC,cAAY,cAAc,KAAK;AAAA,MAC/B,IAAI,KAAK,GAAG,EAAE,WAAW;AAAA,MACzB;AAAA,MACA;AAAA,MACA,UAAU,YAAkD,CAAA,MAAK;AAChE,uBAAA,EAAiB,YAAY,EAAE,OAAO,OAAO;AAAA,MAC9C,GAAG,CAAC,cAAc,CAAC;AAAA,MAClB,GAAG;AAAA,IAAA;AAAA,IAhBL;AAAA,IAAA;AAAA,IAAA;AAAA,MAAA,UAAA;AAAA,MAAA,YAAA;AAAA,MAAA,cAAA;AAAA,IAAA;AAAA,IAAAA;AAAAA,EAAA;AAmBF,GAAG,CAAC,EAAE,OAAO,cAAc,aAAA,GAAgB,QAAQ;AAClD,QAAM,OAAO,2BAA2B,0BAA0B,KAAK,EAAE,MAAA,CAAO,EAAE,eAAA;AAClF,QAAM,uBAAuB,iBAAiB,SAAY,eAAgB,KAAK,MAAM,iBAAiB,KAAK,MAAM,WAAW,OAAO;AAEnI,SAAO,uBAAC,OAAA,EAAM,OAAc,cAA4B,cAAc,qBAAA,GAA/D,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAAqF;AAC7F,CAAC;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormError.cjs","sources":["../../../../../packages/react-form/src/components/FormError.tsx"],"sourcesContent":["import { cloneElement, ReactElement, ReactNode, useMemo } from 'react'\nimport { useFormFieldState } from '../contexts'\nimport { BindingError, ErrorAccessor } from '@contember/react-binding'\n\nexport const FormError = ({ children, formatter }: {\n\tformatter: (errors: ErrorAccessor.Error[]) => ReactNode[]\n\tchildren: ReactElement
|
|
1
|
+
{"version":3,"file":"FormError.cjs","sources":["../../../../../packages/react-form/src/components/FormError.tsx"],"sourcesContent":["import { cloneElement, ReactElement, ReactNode, useMemo } from 'react'\nimport { useFormFieldState } from '../contexts'\nimport { BindingError, ErrorAccessor } from '@contember/react-binding'\n\nexport const FormError = ({ children, formatter }: {\n\tformatter: (errors: ErrorAccessor.Error[]) => ReactNode[]\n\tchildren: ReactElement<any>\n}) => {\n\tconst formState = useFormFieldState()\n\tif (!formState) {\n\t\tthrow new BindingError('FormError must be used inside a FormField')\n\t}\n\tconst { errors, htmlId } = formState\n\tconst formatted = useMemo(() => formatter(errors ?? []).filter((it, index, arr) => arr.indexOf(it) === index), [errors, formatter])\n\treturn formatted.map((it, index) => {\n\t\treturn cloneElement(children, {\n\t\t\tkey: index,\n\t\t\t...(htmlId ? { id: `${htmlId}-error-${index}` } : {}),\n\t\t\tchildren: it,\n\t\t})\n\t})\n}\n"],"names":["useFormFieldState","BindingError","useMemo","cloneElement"],"mappings":";;;;;AAIO,MAAM,YAAY,CAAC,EAAE,UAAU,gBAGhC;AACL,QAAM,YAAYA,SAAAA,kBAAA;AAClB,MAAI,CAAC,WAAW;AACf,UAAM,IAAIC,aAAAA,aAAa,2CAA2C;AAAA,EACnE;AACA,QAAM,EAAE,QAAQ,OAAA,IAAW;AAC3B,QAAM,YAAYC,MAAAA,QAAQ,MAAM,UAAU,UAAU,EAAE,EAAE,OAAO,CAAC,IAAI,OAAO,QAAQ,IAAI,QAAQ,EAAE,MAAM,KAAK,GAAG,CAAC,QAAQ,SAAS,CAAC;AAClI,SAAO,UAAU,IAAI,CAAC,IAAI,UAAU;AACnC,WAAOC,MAAAA,aAAa,UAAU;AAAA,MAC7B,KAAK;AAAA,MACL,GAAI,SAAS,EAAE,IAAI,GAAG,MAAM,UAAU,KAAK,GAAA,IAAO,CAAA;AAAA,MAClD,UAAU;AAAA,IAAA,CACV;AAAA,EACF,CAAC;AACF;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormError.js","sources":["../../../../../packages/react-form/src/components/FormError.tsx"],"sourcesContent":["import { cloneElement, ReactElement, ReactNode, useMemo } from 'react'\nimport { useFormFieldState } from '../contexts'\nimport { BindingError, ErrorAccessor } from '@contember/react-binding'\n\nexport const FormError = ({ children, formatter }: {\n\tformatter: (errors: ErrorAccessor.Error[]) => ReactNode[]\n\tchildren: ReactElement
|
|
1
|
+
{"version":3,"file":"FormError.js","sources":["../../../../../packages/react-form/src/components/FormError.tsx"],"sourcesContent":["import { cloneElement, ReactElement, ReactNode, useMemo } from 'react'\nimport { useFormFieldState } from '../contexts'\nimport { BindingError, ErrorAccessor } from '@contember/react-binding'\n\nexport const FormError = ({ children, formatter }: {\n\tformatter: (errors: ErrorAccessor.Error[]) => ReactNode[]\n\tchildren: ReactElement<any>\n}) => {\n\tconst formState = useFormFieldState()\n\tif (!formState) {\n\t\tthrow new BindingError('FormError must be used inside a FormField')\n\t}\n\tconst { errors, htmlId } = formState\n\tconst formatted = useMemo(() => formatter(errors ?? []).filter((it, index, arr) => arr.indexOf(it) === index), [errors, formatter])\n\treturn formatted.map((it, index) => {\n\t\treturn cloneElement(children, {\n\t\t\tkey: index,\n\t\t\t...(htmlId ? { id: `${htmlId}-error-${index}` } : {}),\n\t\t\tchildren: it,\n\t\t})\n\t})\n}\n"],"names":[],"mappings":";;;AAIO,MAAM,YAAY,CAAC,EAAE,UAAU,gBAGhC;AACL,QAAM,YAAY,kBAAA;AAClB,MAAI,CAAC,WAAW;AACf,UAAM,IAAI,aAAa,2CAA2C;AAAA,EACnE;AACA,QAAM,EAAE,QAAQ,OAAA,IAAW;AAC3B,QAAM,YAAY,QAAQ,MAAM,UAAU,UAAU,EAAE,EAAE,OAAO,CAAC,IAAI,OAAO,QAAQ,IAAI,QAAQ,EAAE,MAAM,KAAK,GAAG,CAAC,QAAQ,SAAS,CAAC;AAClI,SAAO,UAAU,IAAI,CAAC,IAAI,UAAU;AACnC,WAAO,aAAa,UAAU;AAAA,MAC7B,KAAK;AAAA,MACL,GAAI,SAAS,EAAE,IAAI,GAAG,MAAM,UAAU,KAAK,GAAA,IAAO,CAAA;AAAA,MAClD,UAAU;AAAA,IAAA,CACV;AAAA,EACF,CAAC;AACF;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormFieldScope.cjs","sources":["../../../../../packages/react-form/src/components/FormFieldScope.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useMemo } from 'react'\nimport { SugaredRelativeSingleField, useField } from '@contember/react-binding'\nimport { FormFieldStateProvider } from './FormFieldStateProvider'\n\nexport type FormFieldScopeProps = {\n\tfield: SugaredRelativeSingleField['field']\n\tchildren: React.ReactNode\n\trequired?: boolean\n}\n\nexport const FormFieldScope = ({ field, children, required }: FormFieldScopeProps) => {\n\tconst fieldAccessor = useField({ field })\n\tconst entityName = fieldAccessor.getParent().name\n\tconst fieldName = fieldAccessor.fieldName\n\tconst enumName = fieldAccessor.schema.enumName ?? undefined\n\tconst fieldInfo = useMemo(() => ({ entityName, fieldName, enumName }), [entityName, fieldName, enumName])\n\n\treturn (\n\t\t<FormFieldStateProvider\n\t\t\terrors={fieldAccessor.errors?.errors}\n\t\t\trequired={required ?? !fieldAccessor.schema.nullable}\n\t\t\tdirty={fieldAccessor.hasUnpersistedChanges}\n\t\t\tfield={fieldInfo}\n\t\t>\n\t\t\t{children}\n\t\t</FormFieldStateProvider>\n\t)\n}\n"],"names":["useField","useMemo","jsxDEV","FormFieldStateProvider","this"],"mappings":";;;;;;AAWO,MAAM,iBAAiB,CAAC,EAAE,OAAO,UAAU,eAAoC;AACrF,QAAM,gBAAgBA,aAAAA,SAAS,EAAE,OAAO;
|
|
1
|
+
{"version":3,"file":"FormFieldScope.cjs","sources":["../../../../../packages/react-form/src/components/FormFieldScope.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useMemo } from 'react'\nimport { SugaredRelativeSingleField, useField } from '@contember/react-binding'\nimport { FormFieldStateProvider } from './FormFieldStateProvider'\n\nexport type FormFieldScopeProps = {\n\tfield: SugaredRelativeSingleField['field']\n\tchildren: React.ReactNode\n\trequired?: boolean\n}\n\nexport const FormFieldScope = ({ field, children, required }: FormFieldScopeProps) => {\n\tconst fieldAccessor = useField({ field })\n\tconst entityName = fieldAccessor.getParent().name\n\tconst fieldName = fieldAccessor.fieldName\n\tconst enumName = fieldAccessor.schema.enumName ?? undefined\n\tconst fieldInfo = useMemo(() => ({ entityName, fieldName, enumName }), [entityName, fieldName, enumName])\n\n\treturn (\n\t\t<FormFieldStateProvider\n\t\t\terrors={fieldAccessor.errors?.errors}\n\t\t\trequired={required ?? !fieldAccessor.schema.nullable}\n\t\t\tdirty={fieldAccessor.hasUnpersistedChanges}\n\t\t\tfield={fieldInfo}\n\t\t>\n\t\t\t{children}\n\t\t</FormFieldStateProvider>\n\t)\n}\n"],"names":["useField","useMemo","jsxDEV","FormFieldStateProvider","this"],"mappings":";;;;;;AAWO,MAAM,iBAAiB,CAAC,EAAE,OAAO,UAAU,eAAoC;AACrF,QAAM,gBAAgBA,aAAAA,SAAS,EAAE,OAAO;AACxC,QAAM,aAAa,cAAc,UAAA,EAAY;AAC7C,QAAM,YAAY,cAAc;AAChC,QAAM,WAAW,cAAc,OAAO,YAAY;AAClD,QAAM,YAAYC,MAAAA,QAAQ,OAAO,EAAE,YAAY,WAAW,SAAA,IAAa,CAAC,YAAY,WAAW,QAAQ,CAAC;AAExG,SACCC,8BAAAA;AAAAA,IAACC,uBAAAA;AAAAA,IAAA;AAAA,MACA,QAAQ,cAAc,QAAQ;AAAA,MAC9B,UAAU,YAAY,CAAC,cAAc,OAAO;AAAA,MAC5C,OAAO,cAAc;AAAA,MACrB,OAAO;AAAA,MAEN;AAAA,IAAA;AAAA,IANF;AAAA,IAAA;AAAA,IAAA;AAAA,MAAA,UAAA;AAAA,MAAA,YAAA;AAAA,MAAA,cAAA;AAAA,IAAA;AAAA,IAAAC;AAAAA,EAAA;AASF;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormFieldScope.js","sources":["../../../../../packages/react-form/src/components/FormFieldScope.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useMemo } from 'react'\nimport { SugaredRelativeSingleField, useField } from '@contember/react-binding'\nimport { FormFieldStateProvider } from './FormFieldStateProvider'\n\nexport type FormFieldScopeProps = {\n\tfield: SugaredRelativeSingleField['field']\n\tchildren: React.ReactNode\n\trequired?: boolean\n}\n\nexport const FormFieldScope = ({ field, children, required }: FormFieldScopeProps) => {\n\tconst fieldAccessor = useField({ field })\n\tconst entityName = fieldAccessor.getParent().name\n\tconst fieldName = fieldAccessor.fieldName\n\tconst enumName = fieldAccessor.schema.enumName ?? undefined\n\tconst fieldInfo = useMemo(() => ({ entityName, fieldName, enumName }), [entityName, fieldName, enumName])\n\n\treturn (\n\t\t<FormFieldStateProvider\n\t\t\terrors={fieldAccessor.errors?.errors}\n\t\t\trequired={required ?? !fieldAccessor.schema.nullable}\n\t\t\tdirty={fieldAccessor.hasUnpersistedChanges}\n\t\t\tfield={fieldInfo}\n\t\t>\n\t\t\t{children}\n\t\t</FormFieldStateProvider>\n\t)\n}\n"],"names":["this"],"mappings":";;;;AAWO,MAAM,iBAAiB,CAAC,EAAE,OAAO,UAAU,eAAoC;AACrF,QAAM,gBAAgB,SAAS,EAAE,OAAO;
|
|
1
|
+
{"version":3,"file":"FormFieldScope.js","sources":["../../../../../packages/react-form/src/components/FormFieldScope.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useMemo } from 'react'\nimport { SugaredRelativeSingleField, useField } from '@contember/react-binding'\nimport { FormFieldStateProvider } from './FormFieldStateProvider'\n\nexport type FormFieldScopeProps = {\n\tfield: SugaredRelativeSingleField['field']\n\tchildren: React.ReactNode\n\trequired?: boolean\n}\n\nexport const FormFieldScope = ({ field, children, required }: FormFieldScopeProps) => {\n\tconst fieldAccessor = useField({ field })\n\tconst entityName = fieldAccessor.getParent().name\n\tconst fieldName = fieldAccessor.fieldName\n\tconst enumName = fieldAccessor.schema.enumName ?? undefined\n\tconst fieldInfo = useMemo(() => ({ entityName, fieldName, enumName }), [entityName, fieldName, enumName])\n\n\treturn (\n\t\t<FormFieldStateProvider\n\t\t\terrors={fieldAccessor.errors?.errors}\n\t\t\trequired={required ?? !fieldAccessor.schema.nullable}\n\t\t\tdirty={fieldAccessor.hasUnpersistedChanges}\n\t\t\tfield={fieldInfo}\n\t\t>\n\t\t\t{children}\n\t\t</FormFieldStateProvider>\n\t)\n}\n"],"names":["this"],"mappings":";;;;AAWO,MAAM,iBAAiB,CAAC,EAAE,OAAO,UAAU,eAAoC;AACrF,QAAM,gBAAgB,SAAS,EAAE,OAAO;AACxC,QAAM,aAAa,cAAc,UAAA,EAAY;AAC7C,QAAM,YAAY,cAAc;AAChC,QAAM,WAAW,cAAc,OAAO,YAAY;AAClD,QAAM,YAAY,QAAQ,OAAO,EAAE,YAAY,WAAW,SAAA,IAAa,CAAC,YAAY,WAAW,QAAQ,CAAC;AAExG,SACC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,QAAQ,cAAc,QAAQ;AAAA,MAC9B,UAAU,YAAY,CAAC,cAAc,OAAO;AAAA,MAC5C,OAAO,cAAc;AAAA,MACrB,OAAO;AAAA,MAEN;AAAA,IAAA;AAAA,IANF;AAAA,IAAA;AAAA,IAAA;AAAA,MAAA,UAAA;AAAA,MAAA,YAAA;AAAA,MAAA,cAAA;AAAA,IAAA;AAAA,IAAAA;AAAAA,EAAA;AASF;"}
|
|
@@ -27,7 +27,7 @@ const FormFieldIdContext = {
|
|
|
27
27
|
}
|
|
28
28
|
return /* @__PURE__ */ jsxDevRuntime.jsxDEV(FormFieldStateProvider, { ...state, htmlId: value, children }, void 0, false, {
|
|
29
29
|
fileName: "/home/runner/work/contember/contember/packages/react-form/src/components/FormFieldStateProvider.tsx",
|
|
30
|
-
lineNumber:
|
|
30
|
+
lineNumber: 42,
|
|
31
31
|
columnNumber: 4
|
|
32
32
|
}, void 0);
|
|
33
33
|
}
|
|
@@ -45,7 +45,7 @@ const FormErrorContext = {
|
|
|
45
45
|
}
|
|
46
46
|
return /* @__PURE__ */ jsxDevRuntime.jsxDEV(FormFieldStateProvider, { ...state, errors: value, children }, void 0, false, {
|
|
47
47
|
fileName: "/home/runner/work/contember/contember/packages/react-form/src/components/FormFieldStateProvider.tsx",
|
|
48
|
-
lineNumber:
|
|
48
|
+
lineNumber: 64,
|
|
49
49
|
columnNumber: 4
|
|
50
50
|
}, void 0);
|
|
51
51
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormFieldStateProvider.cjs","sources":["../../../../../packages/react-form/src/components/FormFieldStateProvider.tsx"],"sourcesContent":["import { ErrorAccessor } from '@contember/react-binding'\nimport { useEffect, useId, useMemo } from 'react'\nimport { FormFieldStateContext, useFormFieldState } from '../contexts'\nimport { FormFieldState } from '../types'\n\nconst emptyArr: [] = []\n\nexport type FormFieldStateProvider =\n\t& Partial<FormFieldState>\n\t& {\n\t\tchildren: React.ReactNode\n\t}\n\nexport const FormFieldStateProvider = ({ children, required = false, errors = emptyArr, dirty = false, htmlId, field }: FormFieldStateProvider) => {\n\tconst generatedId = useId()\n\thtmlId ??= generatedId\n\tconst value = useMemo(() => ({ htmlId, required, errors, dirty, field }), [htmlId, required, errors, dirty, field])\n\treturn <FormFieldStateContext.Provider value={value}>{children}</FormFieldStateContext.Provider>\n}\n\n/**\n * BC for\n * \t<FormFieldIdContext.Provider value={id}>\n * \t<FormErrorContext.Provider value={[]}>\n */\n\n/**\n * @deprecated use `FormFieldStateProvider` instead\n */\nexport const FormFieldIdContext = {\n\t/**\n\t * @deprecated use `FormFieldStateProvider` instead\n\t */\n\tProvider: ({ children, value }: { children: React.ReactNode; value: string }) => {\n\t\tconst state = useFormFieldState()\n\t\tif (import.meta.env.DEV) {\n\t\t\
|
|
1
|
+
{"version":3,"file":"FormFieldStateProvider.cjs","sources":["../../../../../packages/react-form/src/components/FormFieldStateProvider.tsx"],"sourcesContent":["import { ErrorAccessor } from '@contember/react-binding'\nimport { useEffect, useId, useMemo } from 'react'\nimport { FormFieldStateContext, useFormFieldState } from '../contexts'\nimport { FormFieldState } from '../types'\n\nconst emptyArr: [] = []\n\nexport type FormFieldStateProvider =\n\t& Partial<FormFieldState>\n\t& {\n\t\tchildren: React.ReactNode\n\t}\n\nexport const FormFieldStateProvider = ({ children, required = false, errors = emptyArr, dirty = false, htmlId, field }: FormFieldStateProvider) => {\n\tconst generatedId = useId()\n\thtmlId ??= generatedId\n\tconst value = useMemo(() => ({ htmlId, required, errors, dirty, field }), [htmlId, required, errors, dirty, field])\n\treturn <FormFieldStateContext.Provider value={value}>{children}</FormFieldStateContext.Provider>\n}\n\n/**\n * BC for\n * \t<FormFieldIdContext.Provider value={id}>\n * \t<FormErrorContext.Provider value={[]}>\n */\n\n/**\n * @deprecated use `FormFieldStateProvider` instead\n */\nexport const FormFieldIdContext = {\n\t/**\n\t * @deprecated use `FormFieldStateProvider` instead\n\t */\n\tProvider: ({ children, value }: { children: React.ReactNode; value: string }) => {\n\t\tconst state = useFormFieldState()\n\t\tif (import.meta.env.DEV) {\n\t\t\tuseEffect(() => {\n\t\t\t\tconsole.warn('FormFieldIdContext.Provider is deprecated, use FormFieldStateProvider instead')\n\t\t\t}, [])\n\t\t}\n\t\treturn (\n\t\t\t<FormFieldStateProvider {...state} htmlId={value}>\n\t\t\t\t{children}\n\t\t\t</FormFieldStateProvider>\n\t\t)\n\t},\n}\n\n/**\n * @deprecated use `FormFieldStateProvider` instead\n */\nexport const FormErrorContext = {\n\t/**\n\t * @deprecated use `FormFieldStateProvider` instead\n\t */\n\tProvider: ({ children, value }: { children: React.ReactNode; value: ErrorAccessor.Error[] }) => {\n\t\tconst state = useFormFieldState()\n\t\tif (import.meta.env.DEV) {\n\t\t\tuseEffect(() => {\n\t\t\t\tconsole.warn('FormErrorContext.Provider is deprecated, use FormFieldStateProvider instead')\n\t\t\t}, [])\n\t\t}\n\t\treturn (\n\t\t\t<FormFieldStateProvider {...state} errors={value}>\n\t\t\t\t{children}\n\t\t\t</FormFieldStateProvider>\n\t\t)\n\t},\n}\n"],"names":["useId","useMemo","jsxDEV","FormFieldStateContext","useFormFieldState","useEffect"],"mappings":";;;;;AAKA,MAAM,WAAe,CAAA;AAQd,MAAM,yBAAyB,CAAC,EAAE,UAAU,WAAW,OAAO,SAAS,UAAU,QAAQ,OAAO,QAAQ,MAAA,MAAoC;AAClJ,QAAM,cAAcA,MAAAA,MAAA;AACpB,aAAA,SAAW;AACX,QAAM,QAAQC,MAAAA,QAAQ,OAAO,EAAE,QAAQ,UAAU,QAAQ,OAAO,MAAA,IAAU,CAAC,QAAQ,UAAU,QAAQ,OAAO,KAAK,CAAC;AAClH,SAAOC,8BAAAA,OAACC,SAAAA,sBAAsB,UAAtB,EAA+B,OAAe,SAAA,GAA/C,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAA,MAAwD;AAChE;AAWO,MAAM,qBAAqB;AAAA;AAAA;AAAA;AAAA,EAIjC,UAAU,CAAC,EAAE,UAAU,YAA0D;AAChF,UAAM,QAAQC,SAAAA,kBAAA;AACW;AACxBC,YAAAA,UAAU,MAAM;AACf,gBAAQ,KAAK,+EAA+E;AAAA,MAC7F,GAAG,CAAA,CAAE;AAAA,IACN;AACA,gDACE,wBAAA,EAAwB,GAAG,OAAO,QAAQ,OACzC,SAAA,GADF,QAAA,OAAA;AAAA,MAAA,UAAA;AAAA,MAAA,YAAA;AAAA,MAAA,cAAA;AAAA,IAAA,GAAA,MAEA;AAAA,EAEF;AACD;AAKO,MAAM,mBAAmB;AAAA;AAAA;AAAA;AAAA,EAI/B,UAAU,CAAC,EAAE,UAAU,YAAyE;AAC/F,UAAM,QAAQD,SAAAA,kBAAA;AACW;AACxBC,YAAAA,UAAU,MAAM;AACf,gBAAQ,KAAK,6EAA6E;AAAA,MAC3F,GAAG,CAAA,CAAE;AAAA,IACN;AACA,gDACE,wBAAA,EAAwB,GAAG,OAAO,QAAQ,OACzC,SAAA,GADF,QAAA,OAAA;AAAA,MAAA,UAAA;AAAA,MAAA,YAAA;AAAA,MAAA,cAAA;AAAA,IAAA,GAAA,MAEA;AAAA,EAEF;AACD;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsxDEV } from "react/jsx-dev-runtime";
|
|
2
|
-
import { useId, useMemo
|
|
3
|
-
import {
|
|
2
|
+
import { useEffect, useId, useMemo } from "react";
|
|
3
|
+
import { useFormFieldState, FormFieldStateContext } from "../contexts.js";
|
|
4
4
|
const emptyArr = [];
|
|
5
5
|
const FormFieldStateProvider = ({ children, required = false, errors = emptyArr, dirty = false, htmlId, field }) => {
|
|
6
6
|
const generatedId = useId();
|
|
@@ -25,7 +25,7 @@ const FormFieldIdContext = {
|
|
|
25
25
|
}
|
|
26
26
|
return /* @__PURE__ */ jsxDEV(FormFieldStateProvider, { ...state, htmlId: value, children }, void 0, false, {
|
|
27
27
|
fileName: "/home/runner/work/contember/contember/packages/react-form/src/components/FormFieldStateProvider.tsx",
|
|
28
|
-
lineNumber:
|
|
28
|
+
lineNumber: 42,
|
|
29
29
|
columnNumber: 4
|
|
30
30
|
}, void 0);
|
|
31
31
|
}
|
|
@@ -43,7 +43,7 @@ const FormErrorContext = {
|
|
|
43
43
|
}
|
|
44
44
|
return /* @__PURE__ */ jsxDEV(FormFieldStateProvider, { ...state, errors: value, children }, void 0, false, {
|
|
45
45
|
fileName: "/home/runner/work/contember/contember/packages/react-form/src/components/FormFieldStateProvider.tsx",
|
|
46
|
-
lineNumber:
|
|
46
|
+
lineNumber: 64,
|
|
47
47
|
columnNumber: 4
|
|
48
48
|
}, void 0);
|
|
49
49
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormFieldStateProvider.js","sources":["../../../../../packages/react-form/src/components/FormFieldStateProvider.tsx"],"sourcesContent":["import { ErrorAccessor } from '@contember/react-binding'\nimport { useEffect, useId, useMemo } from 'react'\nimport { FormFieldStateContext, useFormFieldState } from '../contexts'\nimport { FormFieldState } from '../types'\n\nconst emptyArr: [] = []\n\nexport type FormFieldStateProvider =\n\t& Partial<FormFieldState>\n\t& {\n\t\tchildren: React.ReactNode\n\t}\n\nexport const FormFieldStateProvider = ({ children, required = false, errors = emptyArr, dirty = false, htmlId, field }: FormFieldStateProvider) => {\n\tconst generatedId = useId()\n\thtmlId ??= generatedId\n\tconst value = useMemo(() => ({ htmlId, required, errors, dirty, field }), [htmlId, required, errors, dirty, field])\n\treturn <FormFieldStateContext.Provider value={value}>{children}</FormFieldStateContext.Provider>\n}\n\n/**\n * BC for\n * \t<FormFieldIdContext.Provider value={id}>\n * \t<FormErrorContext.Provider value={[]}>\n */\n\n/**\n * @deprecated use `FormFieldStateProvider` instead\n */\nexport const FormFieldIdContext = {\n\t/**\n\t * @deprecated use `FormFieldStateProvider` instead\n\t */\n\tProvider: ({ children, value }: { children: React.ReactNode; value: string }) => {\n\t\tconst state = useFormFieldState()\n\t\tif (import.meta.env.DEV) {\n\t\t\
|
|
1
|
+
{"version":3,"file":"FormFieldStateProvider.js","sources":["../../../../../packages/react-form/src/components/FormFieldStateProvider.tsx"],"sourcesContent":["import { ErrorAccessor } from '@contember/react-binding'\nimport { useEffect, useId, useMemo } from 'react'\nimport { FormFieldStateContext, useFormFieldState } from '../contexts'\nimport { FormFieldState } from '../types'\n\nconst emptyArr: [] = []\n\nexport type FormFieldStateProvider =\n\t& Partial<FormFieldState>\n\t& {\n\t\tchildren: React.ReactNode\n\t}\n\nexport const FormFieldStateProvider = ({ children, required = false, errors = emptyArr, dirty = false, htmlId, field }: FormFieldStateProvider) => {\n\tconst generatedId = useId()\n\thtmlId ??= generatedId\n\tconst value = useMemo(() => ({ htmlId, required, errors, dirty, field }), [htmlId, required, errors, dirty, field])\n\treturn <FormFieldStateContext.Provider value={value}>{children}</FormFieldStateContext.Provider>\n}\n\n/**\n * BC for\n * \t<FormFieldIdContext.Provider value={id}>\n * \t<FormErrorContext.Provider value={[]}>\n */\n\n/**\n * @deprecated use `FormFieldStateProvider` instead\n */\nexport const FormFieldIdContext = {\n\t/**\n\t * @deprecated use `FormFieldStateProvider` instead\n\t */\n\tProvider: ({ children, value }: { children: React.ReactNode; value: string }) => {\n\t\tconst state = useFormFieldState()\n\t\tif (import.meta.env.DEV) {\n\t\t\tuseEffect(() => {\n\t\t\t\tconsole.warn('FormFieldIdContext.Provider is deprecated, use FormFieldStateProvider instead')\n\t\t\t}, [])\n\t\t}\n\t\treturn (\n\t\t\t<FormFieldStateProvider {...state} htmlId={value}>\n\t\t\t\t{children}\n\t\t\t</FormFieldStateProvider>\n\t\t)\n\t},\n}\n\n/**\n * @deprecated use `FormFieldStateProvider` instead\n */\nexport const FormErrorContext = {\n\t/**\n\t * @deprecated use `FormFieldStateProvider` instead\n\t */\n\tProvider: ({ children, value }: { children: React.ReactNode; value: ErrorAccessor.Error[] }) => {\n\t\tconst state = useFormFieldState()\n\t\tif (import.meta.env.DEV) {\n\t\t\tuseEffect(() => {\n\t\t\t\tconsole.warn('FormErrorContext.Provider is deprecated, use FormFieldStateProvider instead')\n\t\t\t}, [])\n\t\t}\n\t\treturn (\n\t\t\t<FormFieldStateProvider {...state} errors={value}>\n\t\t\t\t{children}\n\t\t\t</FormFieldStateProvider>\n\t\t)\n\t},\n}\n"],"names":[],"mappings":";;;AAKA,MAAM,WAAe,CAAA;AAQd,MAAM,yBAAyB,CAAC,EAAE,UAAU,WAAW,OAAO,SAAS,UAAU,QAAQ,OAAO,QAAQ,MAAA,MAAoC;AAClJ,QAAM,cAAc,MAAA;AACpB,aAAA,SAAW;AACX,QAAM,QAAQ,QAAQ,OAAO,EAAE,QAAQ,UAAU,QAAQ,OAAO,MAAA,IAAU,CAAC,QAAQ,UAAU,QAAQ,OAAO,KAAK,CAAC;AAClH,SAAO,uBAAC,sBAAsB,UAAtB,EAA+B,OAAe,SAAA,GAA/C,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAA,MAAwD;AAChE;AAWO,MAAM,qBAAqB;AAAA;AAAA;AAAA;AAAA,EAIjC,UAAU,CAAC,EAAE,UAAU,YAA0D;AAChF,UAAM,QAAQ,kBAAA;AACW;AACxB,gBAAU,MAAM;AACf,gBAAQ,KAAK,+EAA+E;AAAA,MAC7F,GAAG,CAAA,CAAE;AAAA,IACN;AACA,kCACE,wBAAA,EAAwB,GAAG,OAAO,QAAQ,OACzC,SAAA,GADF,QAAA,OAAA;AAAA,MAAA,UAAA;AAAA,MAAA,YAAA;AAAA,MAAA,cAAA;AAAA,IAAA,GAAA,MAEA;AAAA,EAEF;AACD;AAKO,MAAM,mBAAmB;AAAA;AAAA;AAAA;AAAA,EAI/B,UAAU,CAAC,EAAE,UAAU,YAAyE;AAC/F,UAAM,QAAQ,kBAAA;AACW;AACxB,gBAAU,MAAM;AACf,gBAAQ,KAAK,6EAA6E;AAAA,MAC3F,GAAG,CAAA,CAAE;AAAA,IACN;AACA,kCACE,wBAAA,EAAwB,GAAG,OAAO,QAAQ,OACzC,SAAA,GADF,QAAA,OAAA;AAAA,MAAA,UAAA;AAAA,MAAA,YAAA;AAAA,MAAA,cAAA;AAAA,IAAA,GAAA,MAEA;AAAA,EAEF;AACD;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormHasManyRelationScope.cjs","sources":["../../../../../packages/react-form/src/components/FormHasManyRelationScope.tsx"],"sourcesContent":["import { HasManyRelationMarker, SugaredRelativeEntityList, useEntityList } from '@contember/react-binding'\nimport * as React from 'react'\nimport { FormFieldStateProvider } from './FormFieldStateProvider'\nimport { useMemo } from 'react'\n\nexport type FormHasManyRelationScopeProps = {\n\tfield: SugaredRelativeEntityList['field']\n\torderBy?: SugaredRelativeEntityList['orderBy']\n\tlimit?: SugaredRelativeEntityList['limit']\n\toffset?: SugaredRelativeEntityList['offset']\n\tchildren: React.ReactNode\n\trequired?: boolean\n}\n\nexport const FormHasManyRelationScope = ({ children, required, ...props }: FormHasManyRelationScopeProps) => {\n\tconst entityRelation = useEntityList(props)\n\tconst entityName = entityRelation.getParent()!.name\n\tconst marker = entityRelation.getMarker() as HasManyRelationMarker\n\tconst fieldName = marker.parameters.field\n\tconst fieldInfo = useMemo(() => ({ entityName, fieldName }), [entityName, fieldName])\n\n\treturn (\n\t\t<FormFieldStateProvider\n\t\t\terrors={entityRelation.errors?.errors}\n\t\t\tdirty={entityRelation.hasUnpersistedChanges}\n\t\t\trequired={required}\n\t\t\tfield={fieldInfo}\n\t\t>\n\t\t\t{children}\n\t\t</FormFieldStateProvider>\n\t)\n}\n"],"names":["useEntityList","useMemo","jsxDEV","FormFieldStateProvider","this"],"mappings":";;;;;;AAcO,MAAM,2BAA2B,CAAC,EAAE,UAAU,UAAU,GAAG,YAA2C;
|
|
1
|
+
{"version":3,"file":"FormHasManyRelationScope.cjs","sources":["../../../../../packages/react-form/src/components/FormHasManyRelationScope.tsx"],"sourcesContent":["import { HasManyRelationMarker, SugaredRelativeEntityList, useEntityList } from '@contember/react-binding'\nimport * as React from 'react'\nimport { FormFieldStateProvider } from './FormFieldStateProvider'\nimport { useMemo } from 'react'\n\nexport type FormHasManyRelationScopeProps = {\n\tfield: SugaredRelativeEntityList['field']\n\torderBy?: SugaredRelativeEntityList['orderBy']\n\tlimit?: SugaredRelativeEntityList['limit']\n\toffset?: SugaredRelativeEntityList['offset']\n\tchildren: React.ReactNode\n\trequired?: boolean\n}\n\nexport const FormHasManyRelationScope = ({ children, required, ...props }: FormHasManyRelationScopeProps) => {\n\tconst entityRelation = useEntityList(props)\n\tconst entityName = entityRelation.getParent()!.name\n\tconst marker = entityRelation.getMarker() as HasManyRelationMarker\n\tconst fieldName = marker.parameters.field\n\tconst fieldInfo = useMemo(() => ({ entityName, fieldName }), [entityName, fieldName])\n\n\treturn (\n\t\t<FormFieldStateProvider\n\t\t\terrors={entityRelation.errors?.errors}\n\t\t\tdirty={entityRelation.hasUnpersistedChanges}\n\t\t\trequired={required}\n\t\t\tfield={fieldInfo}\n\t\t>\n\t\t\t{children}\n\t\t</FormFieldStateProvider>\n\t)\n}\n"],"names":["useEntityList","useMemo","jsxDEV","FormFieldStateProvider","this"],"mappings":";;;;;;AAcO,MAAM,2BAA2B,CAAC,EAAE,UAAU,UAAU,GAAG,YAA2C;AAC5G,QAAM,iBAAiBA,aAAAA,cAAc,KAAK;AAC1C,QAAM,aAAa,eAAe,UAAA,EAAa;AAC/C,QAAM,SAAS,eAAe,UAAA;AAC9B,QAAM,YAAY,OAAO,WAAW;AACpC,QAAM,YAAYC,cAAQ,OAAO,EAAE,YAAY,cAAc,CAAC,YAAY,SAAS,CAAC;AAEpF,SACCC,8BAAAA;AAAAA,IAACC,uBAAAA;AAAAA,IAAA;AAAA,MACA,QAAQ,eAAe,QAAQ;AAAA,MAC/B,OAAO,eAAe;AAAA,MACtB;AAAA,MACA,OAAO;AAAA,MAEN;AAAA,IAAA;AAAA,IANF;AAAA,IAAA;AAAA,IAAA;AAAA,MAAA,UAAA;AAAA,MAAA,YAAA;AAAA,MAAA,cAAA;AAAA,IAAA;AAAA,IAAAC;AAAAA,EAAA;AASF;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormHasManyRelationScope.js","sources":["../../../../../packages/react-form/src/components/FormHasManyRelationScope.tsx"],"sourcesContent":["import { HasManyRelationMarker, SugaredRelativeEntityList, useEntityList } from '@contember/react-binding'\nimport * as React from 'react'\nimport { FormFieldStateProvider } from './FormFieldStateProvider'\nimport { useMemo } from 'react'\n\nexport type FormHasManyRelationScopeProps = {\n\tfield: SugaredRelativeEntityList['field']\n\torderBy?: SugaredRelativeEntityList['orderBy']\n\tlimit?: SugaredRelativeEntityList['limit']\n\toffset?: SugaredRelativeEntityList['offset']\n\tchildren: React.ReactNode\n\trequired?: boolean\n}\n\nexport const FormHasManyRelationScope = ({ children, required, ...props }: FormHasManyRelationScopeProps) => {\n\tconst entityRelation = useEntityList(props)\n\tconst entityName = entityRelation.getParent()!.name\n\tconst marker = entityRelation.getMarker() as HasManyRelationMarker\n\tconst fieldName = marker.parameters.field\n\tconst fieldInfo = useMemo(() => ({ entityName, fieldName }), [entityName, fieldName])\n\n\treturn (\n\t\t<FormFieldStateProvider\n\t\t\terrors={entityRelation.errors?.errors}\n\t\t\tdirty={entityRelation.hasUnpersistedChanges}\n\t\t\trequired={required}\n\t\t\tfield={fieldInfo}\n\t\t>\n\t\t\t{children}\n\t\t</FormFieldStateProvider>\n\t)\n}\n"],"names":["this"],"mappings":";;;;AAcO,MAAM,2BAA2B,CAAC,EAAE,UAAU,UAAU,GAAG,YAA2C;
|
|
1
|
+
{"version":3,"file":"FormHasManyRelationScope.js","sources":["../../../../../packages/react-form/src/components/FormHasManyRelationScope.tsx"],"sourcesContent":["import { HasManyRelationMarker, SugaredRelativeEntityList, useEntityList } from '@contember/react-binding'\nimport * as React from 'react'\nimport { FormFieldStateProvider } from './FormFieldStateProvider'\nimport { useMemo } from 'react'\n\nexport type FormHasManyRelationScopeProps = {\n\tfield: SugaredRelativeEntityList['field']\n\torderBy?: SugaredRelativeEntityList['orderBy']\n\tlimit?: SugaredRelativeEntityList['limit']\n\toffset?: SugaredRelativeEntityList['offset']\n\tchildren: React.ReactNode\n\trequired?: boolean\n}\n\nexport const FormHasManyRelationScope = ({ children, required, ...props }: FormHasManyRelationScopeProps) => {\n\tconst entityRelation = useEntityList(props)\n\tconst entityName = entityRelation.getParent()!.name\n\tconst marker = entityRelation.getMarker() as HasManyRelationMarker\n\tconst fieldName = marker.parameters.field\n\tconst fieldInfo = useMemo(() => ({ entityName, fieldName }), [entityName, fieldName])\n\n\treturn (\n\t\t<FormFieldStateProvider\n\t\t\terrors={entityRelation.errors?.errors}\n\t\t\tdirty={entityRelation.hasUnpersistedChanges}\n\t\t\trequired={required}\n\t\t\tfield={fieldInfo}\n\t\t>\n\t\t\t{children}\n\t\t</FormFieldStateProvider>\n\t)\n}\n"],"names":["this"],"mappings":";;;;AAcO,MAAM,2BAA2B,CAAC,EAAE,UAAU,UAAU,GAAG,YAA2C;AAC5G,QAAM,iBAAiB,cAAc,KAAK;AAC1C,QAAM,aAAa,eAAe,UAAA,EAAa;AAC/C,QAAM,SAAS,eAAe,UAAA;AAC9B,QAAM,YAAY,OAAO,WAAW;AACpC,QAAM,YAAY,QAAQ,OAAO,EAAE,YAAY,cAAc,CAAC,YAAY,SAAS,CAAC;AAEpF,SACC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,QAAQ,eAAe,QAAQ;AAAA,MAC/B,OAAO,eAAe;AAAA,MACtB;AAAA,MACA,OAAO;AAAA,MAEN;AAAA,IAAA;AAAA,IANF;AAAA,IAAA;AAAA,IAAA;AAAA,MAAA,UAAA;AAAA,MAAA,YAAA;AAAA,MAAA,cAAA;AAAA,IAAA;AAAA,IAAAA;AAAAA,EAAA;AASF;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormHasOneRelationScope.cjs","sources":["../../../../../packages/react-form/src/components/FormHasOneRelationScope.tsx"],"sourcesContent":["import * as React from 'react'\nimport { HasOneRelationMarker, SugaredRelativeSingleEntity, useEntity } from '@contember/react-binding'\nimport { FormFieldStateProvider } from './FormFieldStateProvider'\nimport { useMemo } from 'react'\n\nexport type FormHasOneRelationScopeProps = {\n\tfield: SugaredRelativeSingleEntity['field']\n\tchildren: React.ReactNode\n\trequired?: boolean\n}\n\nexport const FormHasOneRelationScope = ({ field, children, required }: FormHasOneRelationScopeProps) => {\n\tconst entityRelation = useEntity({ field })\n\tconst marker = entityRelation.getMarker() as HasOneRelationMarker\n\tconst fieldName = marker.parameters.field\n\tconst entityName = entityRelation.getParent()!.name\n\tconst fieldInfo = useMemo(() => ({ entityName, fieldName }), [entityName, fieldName])\n\treturn (\n\t\t<FormFieldStateProvider\n\t\t\terrors={entityRelation.errors?.errors}\n\t\t\tdirty={entityRelation.hasUnpersistedChanges}\n\t\t\trequired={required}\n\t\t\tfield={fieldInfo}\n\t\t>\n\t\t\t{children}\n\t\t</FormFieldStateProvider>\n\t)\n}\n"],"names":["useEntity","useMemo","jsxDEV","FormFieldStateProvider","this"],"mappings":";;;;;;AAWO,MAAM,0BAA0B,CAAC,EAAE,OAAO,UAAU,eAA6C;AACvG,QAAM,iBAAiBA,aAAAA,UAAU,EAAE,OAAO;
|
|
1
|
+
{"version":3,"file":"FormHasOneRelationScope.cjs","sources":["../../../../../packages/react-form/src/components/FormHasOneRelationScope.tsx"],"sourcesContent":["import * as React from 'react'\nimport { HasOneRelationMarker, SugaredRelativeSingleEntity, useEntity } from '@contember/react-binding'\nimport { FormFieldStateProvider } from './FormFieldStateProvider'\nimport { useMemo } from 'react'\n\nexport type FormHasOneRelationScopeProps = {\n\tfield: SugaredRelativeSingleEntity['field']\n\tchildren: React.ReactNode\n\trequired?: boolean\n}\n\nexport const FormHasOneRelationScope = ({ field, children, required }: FormHasOneRelationScopeProps) => {\n\tconst entityRelation = useEntity({ field })\n\tconst marker = entityRelation.getMarker() as HasOneRelationMarker\n\tconst fieldName = marker.parameters.field\n\tconst entityName = entityRelation.getParent()!.name\n\tconst fieldInfo = useMemo(() => ({ entityName, fieldName }), [entityName, fieldName])\n\treturn (\n\t\t<FormFieldStateProvider\n\t\t\terrors={entityRelation.errors?.errors}\n\t\t\tdirty={entityRelation.hasUnpersistedChanges}\n\t\t\trequired={required}\n\t\t\tfield={fieldInfo}\n\t\t>\n\t\t\t{children}\n\t\t</FormFieldStateProvider>\n\t)\n}\n"],"names":["useEntity","useMemo","jsxDEV","FormFieldStateProvider","this"],"mappings":";;;;;;AAWO,MAAM,0BAA0B,CAAC,EAAE,OAAO,UAAU,eAA6C;AACvG,QAAM,iBAAiBA,aAAAA,UAAU,EAAE,OAAO;AAC1C,QAAM,SAAS,eAAe,UAAA;AAC9B,QAAM,YAAY,OAAO,WAAW;AACpC,QAAM,aAAa,eAAe,UAAA,EAAa;AAC/C,QAAM,YAAYC,cAAQ,OAAO,EAAE,YAAY,cAAc,CAAC,YAAY,SAAS,CAAC;AACpF,SACCC,8BAAAA;AAAAA,IAACC,uBAAAA;AAAAA,IAAA;AAAA,MACA,QAAQ,eAAe,QAAQ;AAAA,MAC/B,OAAO,eAAe;AAAA,MACtB;AAAA,MACA,OAAO;AAAA,MAEN;AAAA,IAAA;AAAA,IANF;AAAA,IAAA;AAAA,IAAA;AAAA,MAAA,UAAA;AAAA,MAAA,YAAA;AAAA,MAAA,cAAA;AAAA,IAAA;AAAA,IAAAC;AAAAA,EAAA;AASF;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormHasOneRelationScope.js","sources":["../../../../../packages/react-form/src/components/FormHasOneRelationScope.tsx"],"sourcesContent":["import * as React from 'react'\nimport { HasOneRelationMarker, SugaredRelativeSingleEntity, useEntity } from '@contember/react-binding'\nimport { FormFieldStateProvider } from './FormFieldStateProvider'\nimport { useMemo } from 'react'\n\nexport type FormHasOneRelationScopeProps = {\n\tfield: SugaredRelativeSingleEntity['field']\n\tchildren: React.ReactNode\n\trequired?: boolean\n}\n\nexport const FormHasOneRelationScope = ({ field, children, required }: FormHasOneRelationScopeProps) => {\n\tconst entityRelation = useEntity({ field })\n\tconst marker = entityRelation.getMarker() as HasOneRelationMarker\n\tconst fieldName = marker.parameters.field\n\tconst entityName = entityRelation.getParent()!.name\n\tconst fieldInfo = useMemo(() => ({ entityName, fieldName }), [entityName, fieldName])\n\treturn (\n\t\t<FormFieldStateProvider\n\t\t\terrors={entityRelation.errors?.errors}\n\t\t\tdirty={entityRelation.hasUnpersistedChanges}\n\t\t\trequired={required}\n\t\t\tfield={fieldInfo}\n\t\t>\n\t\t\t{children}\n\t\t</FormFieldStateProvider>\n\t)\n}\n"],"names":["this"],"mappings":";;;;AAWO,MAAM,0BAA0B,CAAC,EAAE,OAAO,UAAU,eAA6C;AACvG,QAAM,iBAAiB,UAAU,EAAE,OAAO;
|
|
1
|
+
{"version":3,"file":"FormHasOneRelationScope.js","sources":["../../../../../packages/react-form/src/components/FormHasOneRelationScope.tsx"],"sourcesContent":["import * as React from 'react'\nimport { HasOneRelationMarker, SugaredRelativeSingleEntity, useEntity } from '@contember/react-binding'\nimport { FormFieldStateProvider } from './FormFieldStateProvider'\nimport { useMemo } from 'react'\n\nexport type FormHasOneRelationScopeProps = {\n\tfield: SugaredRelativeSingleEntity['field']\n\tchildren: React.ReactNode\n\trequired?: boolean\n}\n\nexport const FormHasOneRelationScope = ({ field, children, required }: FormHasOneRelationScopeProps) => {\n\tconst entityRelation = useEntity({ field })\n\tconst marker = entityRelation.getMarker() as HasOneRelationMarker\n\tconst fieldName = marker.parameters.field\n\tconst entityName = entityRelation.getParent()!.name\n\tconst fieldInfo = useMemo(() => ({ entityName, fieldName }), [entityName, fieldName])\n\treturn (\n\t\t<FormFieldStateProvider\n\t\t\terrors={entityRelation.errors?.errors}\n\t\t\tdirty={entityRelation.hasUnpersistedChanges}\n\t\t\trequired={required}\n\t\t\tfield={fieldInfo}\n\t\t>\n\t\t\t{children}\n\t\t</FormFieldStateProvider>\n\t)\n}\n"],"names":["this"],"mappings":";;;;AAWO,MAAM,0BAA0B,CAAC,EAAE,OAAO,UAAU,eAA6C;AACvG,QAAM,iBAAiB,UAAU,EAAE,OAAO;AAC1C,QAAM,SAAS,eAAe,UAAA;AAC9B,QAAM,YAAY,OAAO,WAAW;AACpC,QAAM,aAAa,eAAe,UAAA,EAAa;AAC/C,QAAM,YAAY,QAAQ,OAAO,EAAE,YAAY,cAAc,CAAC,YAAY,SAAS,CAAC;AACpF,SACC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,QAAQ,eAAe,QAAQ;AAAA,MAC/B,OAAO,eAAe;AAAA,MACtB;AAAA,MACA,OAAO;AAAA,MAEN;AAAA,IAAA;AAAA,IANF;AAAA,IAAA;AAAA,IAAA;AAAA,MAAA,UAAA;AAAA,MAAA,YAAA;AAAA,MAAA,cAAA;AAAA,IAAA;AAAA,IAAAA;AAAAA,EAAA;AASF;"}
|
|
@@ -10,50 +10,53 @@ const contexts = require("../contexts.cjs");
|
|
|
10
10
|
const useFormInputValidationHandler = require("../hooks/useFormInputValidationHandler.cjs");
|
|
11
11
|
const reactUtils = require("@contember/react-utils");
|
|
12
12
|
const SlotInput = reactSlot.Slot;
|
|
13
|
-
const FormInput = reactBinding.Component(
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
13
|
+
const FormInput = reactBinding.Component(
|
|
14
|
+
({ field, isNonbearing, defaultValue, formatValue: formatValueIn, parseValue: parseValueIn, ...props }) => {
|
|
15
|
+
const accessor = reactBinding.useField(field);
|
|
16
|
+
const formState = contexts.useFormFieldState();
|
|
17
|
+
const id = formState?.htmlId;
|
|
18
|
+
const hasErrors = (formState?.errors.length ?? accessor.errors?.errors?.length ?? 0) > 0;
|
|
19
|
+
const dirty = formState?.dirty ?? accessor.hasUnpersistedChanges;
|
|
20
|
+
const required = formState?.required ?? !accessor.schema.nullable;
|
|
21
|
+
const [state, setState] = React.useState(void 0);
|
|
22
|
+
const { parseValue, formatValue, defaultInputProps } = useFormInputHandler.useFormInputHandler(accessor, { formatValue: formatValueIn, parseValue: parseValueIn });
|
|
23
|
+
const accessorGetter = accessor.getAccessor;
|
|
24
|
+
const { ref, onFocus, onBlur } = useFormInputValidationHandler.useFormInputValidationHandler(accessor);
|
|
25
|
+
return /* @__PURE__ */ jsxDevRuntime.jsxDEV(
|
|
26
|
+
SlotInput,
|
|
27
|
+
{
|
|
28
|
+
ref,
|
|
29
|
+
value: formatValue(accessor.value, { state, setState }),
|
|
30
|
+
"data-invalid": utilities.dataAttribute(hasErrors),
|
|
31
|
+
"data-dirty": utilities.dataAttribute(dirty),
|
|
32
|
+
"data-required": utilities.dataAttribute(required),
|
|
33
|
+
onFocus,
|
|
34
|
+
onBlur,
|
|
35
|
+
onChange: reactUtils.useReferentiallyStableCallback((e) => {
|
|
36
|
+
accessorGetter().updateValue(parseValue(e.target.value, { state, setState }));
|
|
37
|
+
}),
|
|
38
|
+
...defaultInputProps,
|
|
39
|
+
id: id ? `${id}-input` : void 0,
|
|
40
|
+
required,
|
|
41
|
+
...props
|
|
42
|
+
},
|
|
43
|
+
void 0,
|
|
44
|
+
false,
|
|
45
|
+
{
|
|
46
|
+
fileName: "/home/runner/work/contember/contember/packages/react-form/src/components/FormInput.tsx",
|
|
47
|
+
lineNumber: 41,
|
|
48
|
+
columnNumber: 4
|
|
49
|
+
},
|
|
50
|
+
void 0
|
|
51
|
+
);
|
|
52
|
+
},
|
|
53
|
+
({ field, isNonbearing, defaultValue }) => {
|
|
54
|
+
return /* @__PURE__ */ jsxDevRuntime.jsxDEV(reactBinding.Field, { field, isNonbearing, defaultValue }, void 0, false, {
|
|
45
55
|
fileName: "/home/runner/work/contember/contember/packages/react-form/src/components/FormInput.tsx",
|
|
46
|
-
lineNumber:
|
|
47
|
-
columnNumber:
|
|
48
|
-
},
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
}, ({ field, isNonbearing, defaultValue }) => {
|
|
52
|
-
return /* @__PURE__ */ jsxDevRuntime.jsxDEV(reactBinding.Field, { field, isNonbearing, defaultValue }, void 0, false, {
|
|
53
|
-
fileName: "/home/runner/work/contember/contember/packages/react-form/src/components/FormInput.tsx",
|
|
54
|
-
lineNumber: 58,
|
|
55
|
-
columnNumber: 9
|
|
56
|
-
}, void 0);
|
|
57
|
-
});
|
|
56
|
+
lineNumber: 60,
|
|
57
|
+
columnNumber: 10
|
|
58
|
+
}, void 0);
|
|
59
|
+
}
|
|
60
|
+
);
|
|
58
61
|
exports.FormInput = FormInput;
|
|
59
62
|
//# sourceMappingURL=FormInput.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormInput.cjs","sources":["../../../../../packages/react-form/src/components/FormInput.tsx"],"sourcesContent":["import * as React from 'react'\nimport { ChangeEventHandler, ComponentType, useCallback, useState } from 'react'\nimport { Slot } from '@radix-ui/react-slot'\nimport { Component, Field, OptionallyVariableFieldValue, SugaredRelativeSingleField, useField } from '@contember/react-binding'\nimport { dataAttribute } from '@contember/utilities'\nimport { useFormInputHandler } from '../internal/useFormInputHandler'\nimport { useFormFieldState } from '../contexts'\nimport { useFormInputValidationHandler } from '../hooks/useFormInputValidationHandler'\nimport { FormInputHandler } from '../types'\nimport { useReferentiallyStableCallback } from '@contember/react-utils'\n\ntype InputProps = React.JSX.IntrinsicElements['input']\nconst SlotInput = Slot as ComponentType<InputProps>\n\nexport interface FormInputProps {\n\tfield: SugaredRelativeSingleField['field']\n\tisNonbearing?: boolean\n\tdefaultValue?: OptionallyVariableFieldValue\n\tchildren: React.ReactElement\n\tformatValue?: FormInputHandler['formatValue']\n\tparseValue?: FormInputHandler['parseValue']\n}\n\nexport const FormInput = Component<FormInputProps>(({ field, isNonbearing, defaultValue, formatValue: formatValueIn, parseValue: parseValueIn, ...props }) => {\n\tconst accessor = useField(field)\n\n\tconst formState = useFormFieldState()\n\tconst id = formState?.htmlId\n\tconst hasErrors = (formState?.errors.length ?? accessor.errors?.errors?.length ?? 0) > 0\n\tconst dirty = formState?.dirty ?? accessor.hasUnpersistedChanges\n\tconst required = formState?.required ?? !accessor.schema.nullable\n\n\tconst [state, setState] = useState<any>(undefined)\n\n\tconst { parseValue, formatValue, defaultInputProps } = useFormInputHandler(accessor, { formatValue: formatValueIn, parseValue: parseValueIn })\n\tconst accessorGetter = accessor.getAccessor\n\tconst { ref, onFocus, onBlur } = useFormInputValidationHandler(accessor)\n\n\treturn (\n\t\t<SlotInput\n\t\t\tref={ref}\n\t\t\tvalue={formatValue(accessor.value, { state, setState })}\n\t\t\tdata-invalid={dataAttribute(hasErrors)}\n\t\t\tdata-dirty={dataAttribute(dirty)}\n\t\t\tdata-required={dataAttribute(required)}\n\t\t\tonFocus={onFocus}\n\t\t\tonBlur={onBlur}\n\t\t\tonChange={useReferentiallyStableCallback<ChangeEventHandler<HTMLInputElement>>(e => {\n\t\t\t\taccessorGetter().updateValue(parseValue(e.target.value, { state, setState }))\n\t\t\t})}\n\t\t\t{...defaultInputProps}\n\t\t\tid={id ? `${id}-input` : undefined}\n\t\t\trequired={required}\n\t\t\t{...props}\n\t\t/>\n\t)\n}
|
|
1
|
+
{"version":3,"file":"FormInput.cjs","sources":["../../../../../packages/react-form/src/components/FormInput.tsx"],"sourcesContent":["import * as React from 'react'\nimport { ChangeEventHandler, ComponentType, useCallback, useState } from 'react'\nimport { Slot } from '@radix-ui/react-slot'\nimport { Component, Field, OptionallyVariableFieldValue, SugaredRelativeSingleField, useField } from '@contember/react-binding'\nimport { dataAttribute } from '@contember/utilities'\nimport { useFormInputHandler } from '../internal/useFormInputHandler'\nimport { useFormFieldState } from '../contexts'\nimport { useFormInputValidationHandler } from '../hooks/useFormInputValidationHandler'\nimport { FormInputHandler } from '../types'\nimport { useReferentiallyStableCallback } from '@contember/react-utils'\n\ntype InputProps = React.JSX.IntrinsicElements['input']\nconst SlotInput = Slot as ComponentType<InputProps>\n\nexport interface FormInputProps {\n\tfield: SugaredRelativeSingleField['field']\n\tisNonbearing?: boolean\n\tdefaultValue?: OptionallyVariableFieldValue\n\tchildren: React.ReactElement\n\tformatValue?: FormInputHandler['formatValue']\n\tparseValue?: FormInputHandler['parseValue']\n}\n\nexport const FormInput = Component<FormInputProps>(\n\t({ field, isNonbearing, defaultValue, formatValue: formatValueIn, parseValue: parseValueIn, ...props }) => {\n\t\tconst accessor = useField(field)\n\n\t\tconst formState = useFormFieldState()\n\t\tconst id = formState?.htmlId\n\t\tconst hasErrors = (formState?.errors.length ?? accessor.errors?.errors?.length ?? 0) > 0\n\t\tconst dirty = formState?.dirty ?? accessor.hasUnpersistedChanges\n\t\tconst required = formState?.required ?? !accessor.schema.nullable\n\n\t\tconst [state, setState] = useState<any>(undefined)\n\n\t\tconst { parseValue, formatValue, defaultInputProps } = useFormInputHandler(accessor, { formatValue: formatValueIn, parseValue: parseValueIn })\n\t\tconst accessorGetter = accessor.getAccessor\n\t\tconst { ref, onFocus, onBlur } = useFormInputValidationHandler(accessor)\n\n\t\treturn (\n\t\t\t<SlotInput\n\t\t\t\tref={ref}\n\t\t\t\tvalue={formatValue(accessor.value, { state, setState })}\n\t\t\t\tdata-invalid={dataAttribute(hasErrors)}\n\t\t\t\tdata-dirty={dataAttribute(dirty)}\n\t\t\t\tdata-required={dataAttribute(required)}\n\t\t\t\tonFocus={onFocus}\n\t\t\t\tonBlur={onBlur}\n\t\t\t\tonChange={useReferentiallyStableCallback<ChangeEventHandler<HTMLInputElement>>(e => {\n\t\t\t\t\taccessorGetter().updateValue(parseValue(e.target.value, { state, setState }))\n\t\t\t\t})}\n\t\t\t\t{...defaultInputProps}\n\t\t\t\tid={id ? `${id}-input` : undefined}\n\t\t\t\trequired={required}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t)\n\t},\n\t({ field, isNonbearing, defaultValue }) => {\n\t\treturn <Field field={field} isNonbearing={isNonbearing} defaultValue={defaultValue} />\n\t},\n)\n"],"names":["Slot","Component","useField","useFormFieldState","useState","useFormInputHandler","useFormInputValidationHandler","jsxDEV","dataAttribute","useReferentiallyStableCallback","this","Field"],"mappings":";;;;;;;;;;;AAYA,MAAM,YAAYA,UAAAA;AAWX,MAAM,YAAYC,aAAAA;AAAAA,EACxB,CAAC,EAAE,OAAO,cAAc,cAAc,aAAa,eAAe,YAAY,cAAc,GAAG,YAAY;AAC1G,UAAM,WAAWC,aAAAA,SAAS,KAAK;AAE/B,UAAM,YAAYC,SAAAA,kBAAA;AAClB,UAAM,KAAK,WAAW;AACtB,UAAM,aAAa,WAAW,OAAO,UAAU,SAAS,QAAQ,QAAQ,UAAU,KAAK;AACvF,UAAM,QAAQ,WAAW,SAAS,SAAS;AAC3C,UAAM,WAAW,WAAW,YAAY,CAAC,SAAS,OAAO;AAEzD,UAAM,CAAC,OAAO,QAAQ,IAAIC,MAAAA,SAAc,MAAS;AAEjD,UAAM,EAAE,YAAY,aAAa,kBAAA,IAAsBC,oBAAAA,oBAAoB,UAAU,EAAE,aAAa,eAAe,YAAY,aAAA,CAAc;AAC7I,UAAM,iBAAiB,SAAS;AAChC,UAAM,EAAE,KAAK,SAAS,OAAA,IAAWC,8BAAAA,8BAA8B,QAAQ;AAEvE,WACCC,8BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACA;AAAA,QACA,OAAO,YAAY,SAAS,OAAO,EAAE,OAAO,UAAU;AAAA,QACtD,gBAAcC,UAAAA,cAAc,SAAS;AAAA,QACrC,cAAYA,UAAAA,cAAc,KAAK;AAAA,QAC/B,iBAAeA,UAAAA,cAAc,QAAQ;AAAA,QACrC;AAAA,QACA;AAAA,QACA,UAAUC,WAAAA,+BAAqE,CAAA,MAAK;AACnF,yBAAA,EAAiB,YAAY,WAAW,EAAE,OAAO,OAAO,EAAE,OAAO,SAAA,CAAU,CAAC;AAAA,QAC7E,CAAC;AAAA,QACA,GAAG;AAAA,QACJ,IAAI,KAAK,GAAG,EAAE,WAAW;AAAA,QACzB;AAAA,QACC,GAAG;AAAA,MAAA;AAAA,MAdL;AAAA,MAAA;AAAA,MAAA;AAAA,QAAA,UAAA;AAAA,QAAA,YAAA;AAAA,QAAA,cAAA;AAAA,MAAA;AAAA,MAAAC;AAAAA,IAAA;AAAA,EAiBF;AAAA,EACA,CAAC,EAAE,OAAO,cAAc,mBAAmB;AAC1C,WAAOH,8BAAAA,OAACI,aAAAA,OAAA,EAAM,OAAc,cAA4B,aAAA,GAAjD,QAAA,OAAA;AAAA,MAAA,UAAA;AAAA,MAAA,YAAA;AAAA,MAAA,cAAA;AAAA,IAAA,GAAAD,MAA6E;AAAA,EACrF;AACD;;"}
|
|
@@ -8,51 +8,54 @@ import { useFormFieldState } from "../contexts.js";
|
|
|
8
8
|
import { useFormInputValidationHandler } from "../hooks/useFormInputValidationHandler.js";
|
|
9
9
|
import { useReferentiallyStableCallback } from "@contember/react-utils";
|
|
10
10
|
const SlotInput = Slot;
|
|
11
|
-
const FormInput = Component(
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
11
|
+
const FormInput = Component(
|
|
12
|
+
({ field, isNonbearing, defaultValue, formatValue: formatValueIn, parseValue: parseValueIn, ...props }) => {
|
|
13
|
+
const accessor = useField(field);
|
|
14
|
+
const formState = useFormFieldState();
|
|
15
|
+
const id = formState?.htmlId;
|
|
16
|
+
const hasErrors = (formState?.errors.length ?? accessor.errors?.errors?.length ?? 0) > 0;
|
|
17
|
+
const dirty = formState?.dirty ?? accessor.hasUnpersistedChanges;
|
|
18
|
+
const required = formState?.required ?? !accessor.schema.nullable;
|
|
19
|
+
const [state, setState] = useState(void 0);
|
|
20
|
+
const { parseValue, formatValue, defaultInputProps } = useFormInputHandler(accessor, { formatValue: formatValueIn, parseValue: parseValueIn });
|
|
21
|
+
const accessorGetter = accessor.getAccessor;
|
|
22
|
+
const { ref, onFocus, onBlur } = useFormInputValidationHandler(accessor);
|
|
23
|
+
return /* @__PURE__ */ jsxDEV(
|
|
24
|
+
SlotInput,
|
|
25
|
+
{
|
|
26
|
+
ref,
|
|
27
|
+
value: formatValue(accessor.value, { state, setState }),
|
|
28
|
+
"data-invalid": dataAttribute(hasErrors),
|
|
29
|
+
"data-dirty": dataAttribute(dirty),
|
|
30
|
+
"data-required": dataAttribute(required),
|
|
31
|
+
onFocus,
|
|
32
|
+
onBlur,
|
|
33
|
+
onChange: useReferentiallyStableCallback((e) => {
|
|
34
|
+
accessorGetter().updateValue(parseValue(e.target.value, { state, setState }));
|
|
35
|
+
}),
|
|
36
|
+
...defaultInputProps,
|
|
37
|
+
id: id ? `${id}-input` : void 0,
|
|
38
|
+
required,
|
|
39
|
+
...props
|
|
40
|
+
},
|
|
41
|
+
void 0,
|
|
42
|
+
false,
|
|
43
|
+
{
|
|
44
|
+
fileName: "/home/runner/work/contember/contember/packages/react-form/src/components/FormInput.tsx",
|
|
45
|
+
lineNumber: 41,
|
|
46
|
+
columnNumber: 4
|
|
47
|
+
},
|
|
48
|
+
void 0
|
|
49
|
+
);
|
|
50
|
+
},
|
|
51
|
+
({ field, isNonbearing, defaultValue }) => {
|
|
52
|
+
return /* @__PURE__ */ jsxDEV(Field, { field, isNonbearing, defaultValue }, void 0, false, {
|
|
43
53
|
fileName: "/home/runner/work/contember/contember/packages/react-form/src/components/FormInput.tsx",
|
|
44
|
-
lineNumber:
|
|
45
|
-
columnNumber:
|
|
46
|
-
},
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
}, ({ field, isNonbearing, defaultValue }) => {
|
|
50
|
-
return /* @__PURE__ */ jsxDEV(Field, { field, isNonbearing, defaultValue }, void 0, false, {
|
|
51
|
-
fileName: "/home/runner/work/contember/contember/packages/react-form/src/components/FormInput.tsx",
|
|
52
|
-
lineNumber: 58,
|
|
53
|
-
columnNumber: 9
|
|
54
|
-
}, void 0);
|
|
55
|
-
});
|
|
54
|
+
lineNumber: 60,
|
|
55
|
+
columnNumber: 10
|
|
56
|
+
}, void 0);
|
|
57
|
+
}
|
|
58
|
+
);
|
|
56
59
|
export {
|
|
57
60
|
FormInput
|
|
58
61
|
};
|