@strictly/react-form 0.0.10 → 0.0.12
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/.out/core/mobx/field_adapter_builder.js +18 -6
- package/.out/core/mobx/{form_presenter.d.ts → form_model.d.ts} +15 -21
- package/.out/core/mobx/form_model.js +513 -0
- package/.out/core/mobx/hooks.d.ts +6 -25
- package/.out/core/mobx/hooks.js +14 -50
- package/.out/core/mobx/merge_field_adapters_with_validators.js +1 -5
- package/.out/core/mobx/specs/fixtures.js +2 -1
- package/.out/core/mobx/specs/{form_presenter.tests.js → form_model.tests.js} +52 -43
- package/.out/core/mobx/specs/sub_form_field_adapters.tests.js +2 -1
- package/.out/core/mobx/types.d.ts +4 -4
- package/.out/field_converters/integer_to_string_converter.js +12 -4
- package/.out/field_converters/maybe_identity_converter.js +12 -4
- package/.out/field_converters/nullable_to_boolean_converter.js +24 -7
- package/.out/field_converters/select_value_type_converter.js +36 -12
- package/.out/index.d.ts +1 -1
- package/.out/index.js +1 -1
- package/.out/mantine/create_checkbox.js +8 -4
- package/.out/mantine/create_fields_view.js +7 -4
- package/.out/mantine/create_form.js +1 -1
- package/.out/mantine/create_radio_group.js +8 -4
- package/.out/mantine/create_text_input.js +8 -4
- package/.out/mantine/create_value_input.js +8 -4
- package/.out/mantine/hooks.js +218 -92
- package/.out/mantine/specs/checkbox_hooks.stories.js +13 -1
- package/.out/mantine/specs/checkbox_hooks.tests.js +22 -9
- package/.out/mantine/specs/fields_view_hooks.stories.js +15 -2
- package/.out/mantine/specs/fields_view_hooks.tests.js +12 -3
- package/.out/mantine/specs/radio_group_hooks.stories.js +13 -1
- package/.out/mantine/specs/radio_group_hooks.tests.js +23 -10
- package/.out/mantine/specs/select_hooks.stories.js +13 -1
- package/.out/mantine/specs/text_input_hooks.stories.js +13 -1
- package/.out/mantine/specs/text_input_hooks.tests.js +18 -7
- package/.out/mantine/specs/value_input_hooks.stories.js +14 -2
- package/.out/tsconfig.tsbuildinfo +1 -1
- package/.out/tsup.config.js +2 -9
- package/.out/types/merge_validators.js +1 -4
- package/.out/util/partial.js +5 -5
- package/.out/vitest.workspace.js +2 -10
- package/.turbo/turbo-build.log +9 -9
- package/.turbo/turbo-check-types.log +1 -1
- package/.turbo/turbo-release$colon$exports.log +1 -1
- package/core/mobx/{form_presenter.ts → form_model.ts} +287 -329
- package/core/mobx/hooks.tsx +26 -123
- package/core/mobx/specs/{form_presenter.tests.ts → form_model.tests.ts} +101 -94
- package/core/mobx/types.ts +12 -12
- package/dist/index.cjs +639 -600
- package/dist/index.d.cts +51 -73
- package/dist/index.d.ts +51 -73
- package/dist/index.js +644 -601
- package/index.ts +1 -1
- package/mantine/hooks.tsx +2 -0
- package/package.json +1 -1
- package/.out/core/mobx/form_presenter.js +0 -422
- /package/.out/core/mobx/specs/{form_presenter.tests.d.ts → form_model.tests.d.ts} +0 -0
|
@@ -3,17 +3,21 @@ import { createUnsafePartialObserverComponent } from 'util/partial';
|
|
|
3
3
|
import { DefaultErrorRenderer, } from './error_renderer';
|
|
4
4
|
export function createCheckbox(valuePath, Checkbox) {
|
|
5
5
|
const onChange = (e) => {
|
|
6
|
-
|
|
6
|
+
var _a;
|
|
7
|
+
(_a = this.onFieldValueChange) === null || _a === void 0 ? void 0 : _a.call(this, valuePath, e.target.checked);
|
|
7
8
|
};
|
|
8
9
|
const onFocus = () => {
|
|
9
|
-
|
|
10
|
+
var _a;
|
|
11
|
+
(_a = this.onFieldFocus) === null || _a === void 0 ? void 0 : _a.call(this, valuePath);
|
|
10
12
|
};
|
|
11
13
|
const onBlur = () => {
|
|
12
|
-
|
|
14
|
+
var _a;
|
|
15
|
+
(_a = this.onFieldBlur) === null || _a === void 0 ? void 0 : _a.call(this, valuePath);
|
|
13
16
|
};
|
|
14
17
|
const onKeyUp = (e) => {
|
|
18
|
+
var _a;
|
|
15
19
|
if (e.key === 'Enter') {
|
|
16
|
-
if (this.onFieldSubmit
|
|
20
|
+
if ((_a = this.onFieldSubmit) === null || _a === void 0 ? void 0 : _a.call(this, valuePath)) {
|
|
17
21
|
e.preventDefault();
|
|
18
22
|
}
|
|
19
23
|
}
|
|
@@ -14,13 +14,16 @@ export function createFieldsView(valuePath, FieldsView, observableProps) {
|
|
|
14
14
|
observableProps.onFieldValueChange(toKey(subKey), value);
|
|
15
15
|
}
|
|
16
16
|
function onFieldBlur(subKey) {
|
|
17
|
-
|
|
17
|
+
var _a;
|
|
18
|
+
(_a = observableProps.onFieldBlur) === null || _a === void 0 ? void 0 : _a.call(observableProps, toKey(subKey));
|
|
18
19
|
}
|
|
19
20
|
function onFieldFocus(subKey) {
|
|
20
|
-
|
|
21
|
+
var _a;
|
|
22
|
+
(_a = observableProps.onFieldFocus) === null || _a === void 0 ? void 0 : _a.call(observableProps, toKey(subKey));
|
|
21
23
|
}
|
|
22
24
|
function onFieldSubmit(subKey) {
|
|
23
|
-
|
|
25
|
+
var _a;
|
|
26
|
+
(_a = observableProps.onFieldSubmit) === null || _a === void 0 ? void 0 : _a.call(observableProps, toKey(subKey));
|
|
24
27
|
}
|
|
25
28
|
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
26
29
|
const Component = observer(function (props) {
|
|
@@ -34,7 +37,7 @@ export function createFieldsView(valuePath, FieldsView, observableProps) {
|
|
|
34
37
|
},
|
|
35
38
|
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
36
39
|
{});
|
|
37
|
-
return (_jsx(FieldsView, {
|
|
40
|
+
return (_jsx(FieldsView, Object.assign({}, props, { fields: subFields, onFieldBlur: onFieldBlur, onFieldFocus: onFieldFocus, onFieldSubmit: onFieldSubmit, onFieldValueChange: onFieldValueChange })));
|
|
38
41
|
});
|
|
39
42
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/consistent-type-assertions
|
|
40
43
|
const callbackMapper = ((callback) => {
|
|
@@ -8,6 +8,6 @@ export function createForm(valuePath, Form, observableProps) {
|
|
|
8
8
|
const onValueChange = useCallback((value) => {
|
|
9
9
|
observableProps.onFieldValueChange(valuePath, value);
|
|
10
10
|
}, []);
|
|
11
|
-
return (_jsx(Form, {
|
|
11
|
+
return (_jsx(Form, Object.assign({}, props, { onValueChange: onValueChange, value: value })));
|
|
12
12
|
});
|
|
13
13
|
}
|
|
@@ -3,17 +3,21 @@ import { createUnsafePartialObserverComponent, } from 'util/partial';
|
|
|
3
3
|
import { DefaultErrorRenderer, } from './error_renderer';
|
|
4
4
|
export function createRadioGroup(valuePath, RadioGroup) {
|
|
5
5
|
const onChange = (value) => {
|
|
6
|
-
|
|
6
|
+
var _a;
|
|
7
|
+
(_a = this.onFieldValueChange) === null || _a === void 0 ? void 0 : _a.call(this, valuePath, value);
|
|
7
8
|
};
|
|
8
9
|
const onFocus = () => {
|
|
9
|
-
|
|
10
|
+
var _a;
|
|
11
|
+
(_a = this.onFieldFocus) === null || _a === void 0 ? void 0 : _a.call(this, valuePath);
|
|
10
12
|
};
|
|
11
13
|
const onBlur = () => {
|
|
12
|
-
|
|
14
|
+
var _a;
|
|
15
|
+
(_a = this.onFieldBlur) === null || _a === void 0 ? void 0 : _a.call(this, valuePath);
|
|
13
16
|
};
|
|
14
17
|
const onKeyUp = (e) => {
|
|
18
|
+
var _a;
|
|
15
19
|
if (e.key === 'Enter') {
|
|
16
|
-
if (this.onFieldSubmit
|
|
20
|
+
if ((_a = this.onFieldSubmit) === null || _a === void 0 ? void 0 : _a.call(this, valuePath)) {
|
|
17
21
|
e.preventDefault();
|
|
18
22
|
}
|
|
19
23
|
}
|
|
@@ -3,17 +3,21 @@ import { createUnsafePartialObserverComponent } from 'util/partial';
|
|
|
3
3
|
import { DefaultErrorRenderer, } from './error_renderer';
|
|
4
4
|
export function createTextInput(valuePath, TextInput) {
|
|
5
5
|
const onChange = (e) => {
|
|
6
|
-
|
|
6
|
+
var _a;
|
|
7
|
+
(_a = this.onFieldValueChange) === null || _a === void 0 ? void 0 : _a.call(this, valuePath, e.target.value);
|
|
7
8
|
};
|
|
8
9
|
const onFocus = () => {
|
|
9
|
-
|
|
10
|
+
var _a;
|
|
11
|
+
(_a = this.onFieldFocus) === null || _a === void 0 ? void 0 : _a.call(this, valuePath);
|
|
10
12
|
};
|
|
11
13
|
const onBlur = () => {
|
|
12
|
-
|
|
14
|
+
var _a;
|
|
15
|
+
(_a = this.onFieldBlur) === null || _a === void 0 ? void 0 : _a.call(this, valuePath);
|
|
13
16
|
};
|
|
14
17
|
const onKeyUp = (e) => {
|
|
18
|
+
var _a;
|
|
15
19
|
if (e.key === 'Enter') {
|
|
16
|
-
if (this.onFieldSubmit
|
|
20
|
+
if ((_a = this.onFieldSubmit) === null || _a === void 0 ? void 0 : _a.call(this, valuePath)) {
|
|
17
21
|
e.preventDefault();
|
|
18
22
|
}
|
|
19
23
|
}
|
|
@@ -3,17 +3,21 @@ import { createUnsafePartialObserverComponent } from 'util/partial';
|
|
|
3
3
|
import { DefaultErrorRenderer, } from './error_renderer';
|
|
4
4
|
export function createValueInput(valuePath, ValueInput) {
|
|
5
5
|
const onChange = (value) => {
|
|
6
|
-
|
|
6
|
+
var _a;
|
|
7
|
+
(_a = this.onFieldValueChange) === null || _a === void 0 ? void 0 : _a.call(this, valuePath, value);
|
|
7
8
|
};
|
|
8
9
|
const onFocus = () => {
|
|
9
|
-
|
|
10
|
+
var _a;
|
|
11
|
+
(_a = this.onFieldFocus) === null || _a === void 0 ? void 0 : _a.call(this, valuePath);
|
|
10
12
|
};
|
|
11
13
|
const onBlur = () => {
|
|
12
|
-
|
|
14
|
+
var _a;
|
|
15
|
+
(_a = this.onFieldBlur) === null || _a === void 0 ? void 0 : _a.call(this, valuePath);
|
|
13
16
|
};
|
|
14
17
|
const onKeyUp = (e) => {
|
|
18
|
+
var _a;
|
|
15
19
|
if (e.key === 'Enter') {
|
|
16
|
-
if (this.onFieldSubmit
|
|
20
|
+
if ((_a = this.onFieldSubmit) === null || _a === void 0 ? void 0 : _a.call(this, valuePath)) {
|
|
17
21
|
e.preventDefault();
|
|
18
22
|
}
|
|
19
23
|
}
|
package/.out/mantine/hooks.js
CHANGED
|
@@ -1,3 +1,48 @@
|
|
|
1
|
+
var __esDecorate = (this && this.__esDecorate) || function (ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) {
|
|
2
|
+
function accept(f) { if (f !== void 0 && typeof f !== "function") throw new TypeError("Function expected"); return f; }
|
|
3
|
+
var kind = contextIn.kind, key = kind === "getter" ? "get" : kind === "setter" ? "set" : "value";
|
|
4
|
+
var target = !descriptorIn && ctor ? contextIn["static"] ? ctor : ctor.prototype : null;
|
|
5
|
+
var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {});
|
|
6
|
+
var _, done = false;
|
|
7
|
+
for (var i = decorators.length - 1; i >= 0; i--) {
|
|
8
|
+
var context = {};
|
|
9
|
+
for (var p in contextIn) context[p] = p === "access" ? {} : contextIn[p];
|
|
10
|
+
for (var p in contextIn.access) context.access[p] = contextIn.access[p];
|
|
11
|
+
context.addInitializer = function (f) { if (done) throw new TypeError("Cannot add initializers after decoration has completed"); extraInitializers.push(accept(f || null)); };
|
|
12
|
+
var result = (0, decorators[i])(kind === "accessor" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context);
|
|
13
|
+
if (kind === "accessor") {
|
|
14
|
+
if (result === void 0) continue;
|
|
15
|
+
if (result === null || typeof result !== "object") throw new TypeError("Object expected");
|
|
16
|
+
if (_ = accept(result.get)) descriptor.get = _;
|
|
17
|
+
if (_ = accept(result.set)) descriptor.set = _;
|
|
18
|
+
if (_ = accept(result.init)) initializers.unshift(_);
|
|
19
|
+
}
|
|
20
|
+
else if (_ = accept(result)) {
|
|
21
|
+
if (kind === "field") initializers.unshift(_);
|
|
22
|
+
else descriptor[key] = _;
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
if (target) Object.defineProperty(target, contextIn.name, descriptor);
|
|
26
|
+
done = true;
|
|
27
|
+
};
|
|
28
|
+
var __runInitializers = (this && this.__runInitializers) || function (thisArg, initializers, value) {
|
|
29
|
+
var useValue = arguments.length > 2;
|
|
30
|
+
for (var i = 0; i < initializers.length; i++) {
|
|
31
|
+
value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg);
|
|
32
|
+
}
|
|
33
|
+
return useValue ? value : void 0;
|
|
34
|
+
};
|
|
35
|
+
var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
|
|
36
|
+
if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
|
|
37
|
+
if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
|
|
38
|
+
return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
|
|
39
|
+
};
|
|
40
|
+
var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
|
|
41
|
+
if (kind === "m") throw new TypeError("Private method is not writable");
|
|
42
|
+
if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
|
|
43
|
+
if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
|
|
44
|
+
return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
|
|
45
|
+
};
|
|
1
46
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
47
|
import { Checkbox as CheckboxImpl, Pill as PillImpl, Radio as RadioImpl, Select, TextInput as TextInputImpl, } from '@mantine/core';
|
|
3
48
|
import { Cache, } from '@strictly/base';
|
|
@@ -13,7 +58,7 @@ import { createRadioGroup, } from './create_radio_group';
|
|
|
13
58
|
import { createTextInput, } from './create_text_input';
|
|
14
59
|
import { createValueInput, } from './create_value_input';
|
|
15
60
|
function SimpleSelect(props) {
|
|
16
|
-
return _jsx(Select, {
|
|
61
|
+
return _jsx(Select, Object.assign({}, props));
|
|
17
62
|
}
|
|
18
63
|
export function useMantineFormFields({ onFieldValueChange, onFieldBlur, onFieldFocus, onFieldSubmit, fields, }) {
|
|
19
64
|
const form = useMemo(function () {
|
|
@@ -56,94 +101,175 @@ export function useMantineFormFields({ onFieldValueChange, onFieldBlur, onFieldF
|
|
|
56
101
|
]);
|
|
57
102
|
return form;
|
|
58
103
|
}
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
}
|
|
104
|
+
let MantineFormImpl = (() => {
|
|
105
|
+
var _a, _MantineFormImpl_fields_accessor_storage;
|
|
106
|
+
var _b;
|
|
107
|
+
let _fields_decorators;
|
|
108
|
+
let _fields_initializers = [];
|
|
109
|
+
let _fields_extraInitializers = [];
|
|
110
|
+
return _a = class MantineFormImpl {
|
|
111
|
+
get fields() { return __classPrivateFieldGet(this, _MantineFormImpl_fields_accessor_storage, "f"); }
|
|
112
|
+
set fields(value) { __classPrivateFieldSet(this, _MantineFormImpl_fields_accessor_storage, value, "f"); }
|
|
113
|
+
constructor(fields) {
|
|
114
|
+
Object.defineProperty(this, "textInputCache", {
|
|
115
|
+
enumerable: true,
|
|
116
|
+
configurable: true,
|
|
117
|
+
writable: true,
|
|
118
|
+
value: new Cache(createTextInput.bind(this))
|
|
119
|
+
});
|
|
120
|
+
Object.defineProperty(this, "valueInputCache", {
|
|
121
|
+
enumerable: true,
|
|
122
|
+
configurable: true,
|
|
123
|
+
writable: true,
|
|
124
|
+
value: new Cache(createValueInput.bind(this))
|
|
125
|
+
});
|
|
126
|
+
Object.defineProperty(this, "checkboxCache", {
|
|
127
|
+
enumerable: true,
|
|
128
|
+
configurable: true,
|
|
129
|
+
writable: true,
|
|
130
|
+
value: new Cache(createCheckbox.bind(this))
|
|
131
|
+
});
|
|
132
|
+
Object.defineProperty(this, "radioGroupCache", {
|
|
133
|
+
enumerable: true,
|
|
134
|
+
configurable: true,
|
|
135
|
+
writable: true,
|
|
136
|
+
value: new Cache(createRadioGroup.bind(this))
|
|
137
|
+
});
|
|
138
|
+
Object.defineProperty(this, "radioCache", {
|
|
139
|
+
enumerable: true,
|
|
140
|
+
configurable: true,
|
|
141
|
+
writable: true,
|
|
142
|
+
value: new Cache(createRadio.bind(this))
|
|
143
|
+
});
|
|
144
|
+
Object.defineProperty(this, "pillCache", {
|
|
145
|
+
enumerable: true,
|
|
146
|
+
configurable: true,
|
|
147
|
+
writable: true,
|
|
148
|
+
value: new Cache(createPill.bind(this))
|
|
149
|
+
});
|
|
150
|
+
Object.defineProperty(this, "listCache", {
|
|
151
|
+
enumerable: true,
|
|
152
|
+
configurable: true,
|
|
153
|
+
writable: true,
|
|
154
|
+
value: new Cache(createList.bind(this))
|
|
155
|
+
});
|
|
156
|
+
Object.defineProperty(this, "fieldsViewCache", {
|
|
157
|
+
enumerable: true,
|
|
158
|
+
configurable: true,
|
|
159
|
+
writable: true,
|
|
160
|
+
value: new Cache(createFieldsView.bind(this))
|
|
161
|
+
});
|
|
162
|
+
Object.defineProperty(this, "formCache", {
|
|
163
|
+
enumerable: true,
|
|
164
|
+
configurable: true,
|
|
165
|
+
writable: true,
|
|
166
|
+
value: new Cache(createForm.bind(this))
|
|
167
|
+
});
|
|
168
|
+
_MantineFormImpl_fields_accessor_storage.set(this, __runInitializers(this, _fields_initializers, void 0));
|
|
169
|
+
Object.defineProperty(this, "onFieldValueChange", {
|
|
170
|
+
enumerable: true,
|
|
171
|
+
configurable: true,
|
|
172
|
+
writable: true,
|
|
173
|
+
value: __runInitializers(this, _fields_extraInitializers)
|
|
174
|
+
});
|
|
175
|
+
Object.defineProperty(this, "onFieldFocus", {
|
|
176
|
+
enumerable: true,
|
|
177
|
+
configurable: true,
|
|
178
|
+
writable: true,
|
|
179
|
+
value: void 0
|
|
180
|
+
});
|
|
181
|
+
Object.defineProperty(this, "onFieldBlur", {
|
|
182
|
+
enumerable: true,
|
|
183
|
+
configurable: true,
|
|
184
|
+
writable: true,
|
|
185
|
+
value: void 0
|
|
186
|
+
});
|
|
187
|
+
Object.defineProperty(this, "onFieldSubmit", {
|
|
188
|
+
enumerable: true,
|
|
189
|
+
configurable: true,
|
|
190
|
+
writable: true,
|
|
191
|
+
value: void 0
|
|
192
|
+
});
|
|
193
|
+
this.fields = fields;
|
|
194
|
+
}
|
|
195
|
+
textInput(valuePath,
|
|
196
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
197
|
+
TextInput = TextInputImpl) {
|
|
198
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
199
|
+
return this.textInputCache.retrieveOrCreate(valuePath,
|
|
200
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
201
|
+
TextInput);
|
|
202
|
+
}
|
|
203
|
+
valueInput(valuePath, ValueInput) {
|
|
204
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
205
|
+
return this.valueInputCache.retrieveOrCreate(valuePath,
|
|
206
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
207
|
+
ValueInput);
|
|
208
|
+
}
|
|
209
|
+
select(valuePath) {
|
|
210
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
211
|
+
return this.valueInputCache.retrieveOrCreate(valuePath,
|
|
212
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
213
|
+
SimpleSelect);
|
|
214
|
+
}
|
|
215
|
+
checkbox(valuePath,
|
|
216
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
217
|
+
Checkbox = CheckboxImpl) {
|
|
218
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
219
|
+
return this.checkboxCache.retrieveOrCreate(valuePath,
|
|
220
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
221
|
+
Checkbox);
|
|
222
|
+
}
|
|
223
|
+
radioGroup(valuePath,
|
|
224
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
225
|
+
RadioGroup = RadioImpl.Group) {
|
|
226
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
227
|
+
return this.radioGroupCache.retrieveOrCreate(valuePath,
|
|
228
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
229
|
+
RadioGroup);
|
|
230
|
+
}
|
|
231
|
+
radio(valuePath, value,
|
|
232
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
233
|
+
Radio = RadioImpl) {
|
|
234
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
235
|
+
return this.radioCache.retrieveOrCreate(valuePath, value,
|
|
236
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
237
|
+
Radio);
|
|
238
|
+
}
|
|
239
|
+
pill(valuePath,
|
|
240
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
241
|
+
Pill = PillImpl) {
|
|
242
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
243
|
+
return this.pillCache.retrieveOrCreate(valuePath,
|
|
244
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
245
|
+
Pill);
|
|
246
|
+
}
|
|
247
|
+
list(valuePath) {
|
|
248
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
249
|
+
return this.listCache.retrieveOrCreate(valuePath, DefaultList);
|
|
250
|
+
}
|
|
251
|
+
fieldsView(valuePath, FieldsView) {
|
|
252
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
253
|
+
return this.fieldsViewCache.retrieveOrCreate(valuePath,
|
|
254
|
+
// strip props from component since we lose information in the cache
|
|
255
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
256
|
+
FieldsView, this);
|
|
257
|
+
}
|
|
258
|
+
form(valuePath, Form) {
|
|
259
|
+
// strip props from component since we lose information in the cache
|
|
260
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
261
|
+
return this.formCache.retrieveOrCreate(valuePath,
|
|
262
|
+
// strip props from component since we lose information in the cache
|
|
263
|
+
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
264
|
+
Form, this);
|
|
265
|
+
}
|
|
266
|
+
},
|
|
267
|
+
_MantineFormImpl_fields_accessor_storage = new WeakMap(),
|
|
268
|
+
(() => {
|
|
269
|
+
const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(null) : void 0;
|
|
270
|
+
_fields_decorators = [(_b = observable).ref.bind(_b)];
|
|
271
|
+
__esDecorate(_a, null, _fields_decorators, { kind: "accessor", name: "fields", static: false, private: false, access: { has: obj => "fields" in obj, get: obj => obj.fields, set: (obj, value) => { obj.fields = value; } }, metadata: _metadata }, _fields_initializers, _fields_extraInitializers);
|
|
272
|
+
if (_metadata) Object.defineProperty(_a, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
|
|
273
|
+
})(),
|
|
274
|
+
_a;
|
|
275
|
+
})();
|
|
@@ -1,3 +1,14 @@
|
|
|
1
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
2
|
+
var t = {};
|
|
3
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
4
|
+
t[p] = s[p];
|
|
5
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
6
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
7
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
8
|
+
t[p[i]] = s[p[i]];
|
|
9
|
+
}
|
|
10
|
+
return t;
|
|
11
|
+
};
|
|
1
12
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
13
|
import { action } from '@storybook/addon-actions';
|
|
3
14
|
import { useMantineFormFields } from 'mantine/hooks';
|
|
@@ -5,7 +16,8 @@ import { CHECKBOX_LABEL } from './checkbox_constants';
|
|
|
5
16
|
function ErrorRenderer({ error }) {
|
|
6
17
|
return `Error ${error}`;
|
|
7
18
|
}
|
|
8
|
-
function Component(
|
|
19
|
+
function Component(_a) {
|
|
20
|
+
var props = __rest(_a, []);
|
|
9
21
|
const inputProps = useMantineFormFields(props);
|
|
10
22
|
const CheckboxComponent = inputProps.checkbox('$');
|
|
11
23
|
return (_jsx(CheckboxComponent, { ErrorRenderer: ErrorRenderer, label: CHECKBOX_LABEL }));
|
|
@@ -1,3 +1,12 @@
|
|
|
1
|
+
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
2
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
3
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
|
4
|
+
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
5
|
+
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
6
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
7
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
8
|
+
});
|
|
9
|
+
};
|
|
1
10
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
11
|
import { composeStories } from '@storybook/react';
|
|
3
12
|
import { toArray } from '@strictly/base';
|
|
@@ -27,10 +36,12 @@ describe('mantine checkbox hooks', function () {
|
|
|
27
36
|
let onFieldValueChange;
|
|
28
37
|
let wrapper;
|
|
29
38
|
let checkbox;
|
|
30
|
-
beforeEach(
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
39
|
+
beforeEach(function () {
|
|
40
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
41
|
+
onFieldValueChange = vi.fn();
|
|
42
|
+
wrapper = render(_jsx(Component, { onFieldValueChange: onFieldValueChange }));
|
|
43
|
+
checkbox = yield wrapper.findByLabelText(CHECKBOX_LABEL);
|
|
44
|
+
});
|
|
34
45
|
});
|
|
35
46
|
it('requests toggle', function () {
|
|
36
47
|
fireEvent.click(checkbox);
|
|
@@ -43,11 +54,13 @@ describe('mantine checkbox hooks', function () {
|
|
|
43
54
|
let onFieldBlur;
|
|
44
55
|
let wrapper;
|
|
45
56
|
let checkbox;
|
|
46
|
-
beforeEach(
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
57
|
+
beforeEach(function () {
|
|
58
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
59
|
+
onFieldFocus = vi.fn();
|
|
60
|
+
onFieldBlur = vi.fn();
|
|
61
|
+
wrapper = render((_jsx(Off, { onFieldBlur: onFieldBlur, onFieldFocus: onFieldFocus })));
|
|
62
|
+
checkbox = yield wrapper.findByLabelText(CHECKBOX_LABEL);
|
|
63
|
+
});
|
|
51
64
|
});
|
|
52
65
|
describe('focus', function () {
|
|
53
66
|
beforeEach(function () {
|
|
@@ -1,3 +1,14 @@
|
|
|
1
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
2
|
+
var t = {};
|
|
3
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
4
|
+
t[p] = s[p];
|
|
5
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
6
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
7
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
8
|
+
t[p[i]] = s[p[i]];
|
|
9
|
+
}
|
|
10
|
+
return t;
|
|
11
|
+
};
|
|
1
12
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
13
|
import { Paper, Stack, Text, } from '@mantine/core';
|
|
3
14
|
import { action } from '@storybook/addon-actions';
|
|
@@ -12,7 +23,8 @@ export function SubFieldLabel() {
|
|
|
12
23
|
function ErrorRenderer({ error }) {
|
|
13
24
|
return `error ${error}`;
|
|
14
25
|
}
|
|
15
|
-
function SubFieldsView(
|
|
26
|
+
function SubFieldsView(_a) {
|
|
27
|
+
var { onClickField: onClickFieldImpl } = _a, props = __rest(_a, ["onClickField"]);
|
|
16
28
|
const form = useMantineFormFields(props);
|
|
17
29
|
const TextInput = form.textInput('$');
|
|
18
30
|
const onClick$ = useCallback(() => {
|
|
@@ -20,7 +32,8 @@ function SubFieldsView({ onClickField: onClickFieldImpl, ...props }) {
|
|
|
20
32
|
}, [onClickFieldImpl]);
|
|
21
33
|
return (_jsx(Stack, { children: _jsx(TextInput, { ErrorRenderer: ErrorRenderer, label: SubFieldLabel(), onClick: onClick$ }) }));
|
|
22
34
|
}
|
|
23
|
-
function Component(
|
|
35
|
+
function Component(_a) {
|
|
36
|
+
var { onClickField: onClickFieldImpl } = _a, props = __rest(_a, ["onClickField"]);
|
|
24
37
|
const form = useMantineFormFields(props);
|
|
25
38
|
const { Component, callbackMapper, } = form.fieldsView('$.a', SubFieldsView);
|
|
26
39
|
const TextInput = form.textInput('$');
|
|
@@ -1,3 +1,12 @@
|
|
|
1
|
+
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
2
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
3
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
|
4
|
+
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
5
|
+
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
6
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
7
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
8
|
+
});
|
|
9
|
+
};
|
|
1
10
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
11
|
import { composeStories } from '@storybook/react';
|
|
3
12
|
import { toArray } from '@strictly/base';
|
|
@@ -20,13 +29,13 @@ describe('field view hooks', function () {
|
|
|
20
29
|
'$.a',
|
|
21
30
|
stories.SubFieldLabel(),
|
|
22
31
|
],
|
|
23
|
-
])('calls back with the correct paths for field at %s',
|
|
32
|
+
])('calls back with the correct paths for field at %s', (valuePath, labelText) => __awaiter(this, void 0, void 0, function* () {
|
|
24
33
|
const onClickField = vi.fn();
|
|
25
34
|
const wrapper = render(_jsx(Empty, { onClickField: onClickField }));
|
|
26
|
-
const element =
|
|
35
|
+
const element = yield wrapper.findByLabelText(labelText);
|
|
27
36
|
fireEvent.click(element);
|
|
28
37
|
expect(onClickField).toHaveBeenCalledOnce();
|
|
29
38
|
expect(onClickField).toHaveBeenCalledWith(valuePath);
|
|
30
|
-
});
|
|
39
|
+
}));
|
|
31
40
|
});
|
|
32
41
|
});
|
|
@@ -1,3 +1,14 @@
|
|
|
1
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
2
|
+
var t = {};
|
|
3
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
4
|
+
t[p] = s[p];
|
|
5
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
6
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
7
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
8
|
+
t[p[i]] = s[p[i]];
|
|
9
|
+
}
|
|
10
|
+
return t;
|
|
11
|
+
};
|
|
1
12
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
13
|
import { Stack, } from '@mantine/core';
|
|
3
14
|
import { action } from '@storybook/addon-actions';
|
|
@@ -6,7 +17,8 @@ import { RADIO_GROUP_LABEL, RADIO_LABELS, RADIO_VALUES, } from './radio_group_co
|
|
|
6
17
|
function ErrorRenderer({ error }) {
|
|
7
18
|
return `custom error ${error}`;
|
|
8
19
|
}
|
|
9
|
-
function Component(
|
|
20
|
+
function Component(_a) {
|
|
21
|
+
var props = __rest(_a, []);
|
|
10
22
|
const form = useMantineFormFields(props);
|
|
11
23
|
const RadioGroupComponent = form.radioGroup('$');
|
|
12
24
|
return (_jsx(RadioGroupComponent, { ErrorRenderer: ErrorRenderer, label: RADIO_GROUP_LABEL, children: _jsx(Stack, { children: RADIO_VALUES.map(function (value) {
|