@itcase/storybook-config 1.2.70 → 1.2.72
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/README.md +9 -0
- package/dist/{FormSubmitWrapper-DA2tkSEl.js → FormSubmitWrapper-DXUEGLuS.js} +103 -99
- package/dist/cjs/components/FormSubmitWrapper.js +1 -1
- package/dist/cjs/decorators/withFigmaSourceLink.js +58 -2
- package/dist/cjs/decorators/withFormSubmitDecorator.js +1109 -2
- package/dist/cjs/decorators/withNextDecorator.js +6 -11
- package/dist/cjs/decorators/withUiDecorator.js +4 -9
- package/dist/cjs/decorators.js +4 -7
- package/dist/components/EmailTemplatePreview.js +2 -2
- package/dist/components/{FormSubmitWrapper--d5p3re1.js → FormSubmitWrapper-CytvWwKi.js} +107 -103
- package/dist/components/FormSubmitWrapper.js +2 -2
- package/dist/components/{_rollupPluginBabelHelpers-DQ-fuxJg.js → _rollupPluginBabelHelpers-OwKVS06F.js} +1 -1
- package/dist/components/isArray-CPoGkdXv.js +43 -0
- package/dist/config/sourceLink/sourceLink.js +8 -16
- package/dist/decorators/withClearStoresDecorator.js +2 -2
- package/dist/decorators/withExtraProviders.js +2 -2
- package/dist/decorators/withFigmaSourceLink.js +61 -5
- package/dist/decorators/withFormSubmitDecorator.js +1114 -7
- package/dist/decorators/withLayoutDecorator.js +9 -9
- package/dist/decorators/withNextDecorator.js +8 -13
- package/dist/decorators/withUiDecorator.js +5 -10
- package/dist/decorators.js +5 -8
- package/dist/isArray-DJguRq_2.js +47 -0
- package/package.json +23 -17
- package/dist/Notification-Cqx2_tCE.js +0 -7945
- package/dist/components/Notification-qLYjGbKN.js +0 -7923
package/README.md
CHANGED
|
@@ -67,3 +67,12 @@ npm run storybook-react-native-web
|
|
|
67
67
|
# или:
|
|
68
68
|
make storybook-react-native-web
|
|
69
69
|
```
|
|
70
|
+
|
|
71
|
+
## Peer dependencies
|
|
72
|
+
|
|
73
|
+
Декораторы `withNextDecoratorFactory` и `withUiDecorator` используют `UIProvider` и уведомления из пакетов ITCase UI. В проекте-потребителе должны быть установлены:
|
|
74
|
+
|
|
75
|
+
- `@itcase/ui-core` — контекст устройства (`useUserDeviceContext`)
|
|
76
|
+
- `@itcase/ui-web` — `NotificationWrapper`
|
|
77
|
+
|
|
78
|
+
Оба пакета резолвятся из `node_modules` потребителя (не бандлятся в `@itcase/storybook-config`), чтобы React Context был общим с компонентами приложения.
|
|
@@ -3,11 +3,11 @@
|
|
|
3
3
|
var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-D8XyM9rZ.js');
|
|
4
4
|
var React = require('react');
|
|
5
5
|
|
|
6
|
-
var SUBMIT_TIMEOUT_MS =
|
|
6
|
+
var SUBMIT_TIMEOUT_MS = 5000;
|
|
7
7
|
var SUBMIT_POLL_MS = 50;
|
|
8
8
|
function getMountRoot() {
|
|
9
|
-
var
|
|
10
|
-
return (
|
|
9
|
+
var _document$getElementB;
|
|
10
|
+
return (_document$getElementB = document.getElementById('storybook-root')) !== null && _document$getElementB !== void 0 ? _document$getElementB : document.body;
|
|
11
11
|
}
|
|
12
12
|
function sleep() {
|
|
13
13
|
var ms = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : SUBMIT_POLL_MS;
|
|
@@ -15,145 +15,137 @@ function sleep() {
|
|
|
15
15
|
setTimeout(resolve, ms);
|
|
16
16
|
});
|
|
17
17
|
}
|
|
18
|
-
function prepareFormForAutoSubmit(form) {
|
|
19
|
-
var _config$field, _fieldState$value, _config$suffix;
|
|
20
|
-
var config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
21
|
-
var fieldNames = typeof (form === null || form === void 0 ? void 0 : form.getRegisteredFields) === 'function' ? form.getRegisteredFields() : [];
|
|
22
|
-
var fieldName = (_config$field = config.field) !== null && _config$field !== void 0 ? _config$field : fieldNames[0];
|
|
23
|
-
if (!fieldName) {
|
|
24
|
-
return false;
|
|
25
|
-
}
|
|
26
|
-
var fieldState = form.getFieldState(fieldName);
|
|
27
|
-
var value = (_fieldState$value = fieldState === null || fieldState === void 0 ? void 0 : fieldState.value) !== null && _fieldState$value !== void 0 ? _fieldState$value : '';
|
|
28
|
-
var suffix = (_config$suffix = config.suffix) !== null && _config$suffix !== void 0 ? _config$suffix : "\u200B";
|
|
29
|
-
var nextValue = "".concat(value).concat(suffix);
|
|
30
|
-
if (nextValue === value) {
|
|
31
|
-
return false;
|
|
32
|
-
}
|
|
33
|
-
form.change(fieldName, nextValue);
|
|
34
|
-
return true;
|
|
35
|
-
}
|
|
36
18
|
function findSubmitButton(root) {
|
|
19
|
+
var _root$querySelector;
|
|
37
20
|
if (!root) {
|
|
38
21
|
return null;
|
|
39
22
|
}
|
|
40
|
-
|
|
41
|
-
if (byType) {
|
|
42
|
-
return byType;
|
|
43
|
-
}
|
|
44
|
-
var form = root.querySelector('form[data-testid], form');
|
|
45
|
-
if (!form) {
|
|
46
|
-
return null;
|
|
47
|
-
}
|
|
48
|
-
var primaryInGroup = form.querySelector('.form__button .form__button-item, .form__button-item');
|
|
49
|
-
if (primaryInGroup) {
|
|
50
|
-
return primaryInGroup;
|
|
51
|
-
}
|
|
52
|
-
var byTestId = form.querySelector('button[data-testid*="Submit"], button[data-testid*="SignIn"], button[data-testid*="Create"]');
|
|
53
|
-
return byTestId;
|
|
23
|
+
return (_root$querySelector = root.querySelector('button[type="submit"]')) !== null && _root$querySelector !== void 0 ? _root$querySelector : root.querySelector('button.form__button-item');
|
|
54
24
|
}
|
|
55
|
-
function
|
|
56
|
-
return
|
|
25
|
+
function isSubmitButton(button) {
|
|
26
|
+
return (button === null || button === void 0 ? void 0 : button.type) === 'submit';
|
|
57
27
|
}
|
|
58
|
-
function
|
|
59
|
-
|
|
60
|
-
return false;
|
|
61
|
-
}
|
|
62
|
-
var type = button.type || button.getAttribute('type');
|
|
63
|
-
return type === 'submit';
|
|
28
|
+
function canUseFormApi(form) {
|
|
29
|
+
return typeof (form === null || form === void 0 ? void 0 : form.submit) === 'function';
|
|
64
30
|
}
|
|
65
|
-
function
|
|
66
|
-
var
|
|
67
|
-
|
|
68
|
-
if (
|
|
69
|
-
|
|
70
|
-
return true;
|
|
31
|
+
function prepareFormForAutoSubmit(form) {
|
|
32
|
+
var _config$field, _form$getFieldState$v, _form$getFieldState, _config$suffix;
|
|
33
|
+
var config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
34
|
+
if (!canUseFormApi(form) || typeof form.getRegisteredFields !== 'function') {
|
|
35
|
+
return;
|
|
71
36
|
}
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
return
|
|
37
|
+
var fieldName = (_config$field = config.field) !== null && _config$field !== void 0 ? _config$field : form.getRegisteredFields()[0];
|
|
38
|
+
if (!fieldName) {
|
|
39
|
+
return;
|
|
75
40
|
}
|
|
76
|
-
var
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
41
|
+
var value = (_form$getFieldState$v = (_form$getFieldState = form.getFieldState(fieldName)) === null || _form$getFieldState === void 0 ? void 0 : _form$getFieldState.value) !== null && _form$getFieldState$v !== void 0 ? _form$getFieldState$v : '';
|
|
42
|
+
var nextValue = "".concat(value).concat((_config$suffix = config.suffix) !== null && _config$suffix !== void 0 ? _config$suffix : "\u200B");
|
|
43
|
+
if (nextValue !== value) {
|
|
44
|
+
form.change(fieldName, nextValue);
|
|
80
45
|
}
|
|
81
|
-
|
|
46
|
+
}
|
|
47
|
+
function triggerFormSubmit(_ref) {
|
|
48
|
+
var _submitButton$closest, _submitButton$closest2;
|
|
49
|
+
var form = _ref.form,
|
|
50
|
+
submitButton = _ref.submitButton;
|
|
51
|
+
if (isSubmitButton(submitButton)) {
|
|
82
52
|
submitButton.click();
|
|
83
|
-
return
|
|
53
|
+
return;
|
|
54
|
+
}
|
|
55
|
+
if (canUseFormApi(form)) {
|
|
56
|
+
form.submit();
|
|
57
|
+
return;
|
|
84
58
|
}
|
|
85
|
-
|
|
59
|
+
submitButton === null || submitButton === void 0 || (_submitButton$closest = submitButton.closest('form')) === null || _submitButton$closest === void 0 || (_submitButton$closest2 = _submitButton$closest.requestSubmit) === null || _submitButton$closest2 === void 0 || _submitButton$closest2.call(_submitButton$closest);
|
|
86
60
|
}
|
|
87
|
-
function
|
|
88
|
-
var
|
|
89
|
-
var submitButton = findSubmitButton(root);
|
|
90
|
-
var form = formRef.current;
|
|
91
|
-
var hasFields = typeof (form === null || form === void 0 ? void 0 : form.getRegisteredFields) === 'function' && form.getRegisteredFields().length > 0;
|
|
61
|
+
function getSubmitTarget(formRef) {
|
|
62
|
+
var submitButton = findSubmitButton(getMountRoot());
|
|
92
63
|
return {
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
form: form,
|
|
64
|
+
canSubmit: Boolean(submitButton) || canUseFormApi(formRef.current),
|
|
65
|
+
form: formRef.current,
|
|
96
66
|
submitButton: submitButton
|
|
97
67
|
};
|
|
98
68
|
}
|
|
99
|
-
function
|
|
69
|
+
function bindSubmitButtonClick(formRef, signal) {
|
|
70
|
+
var root = getMountRoot();
|
|
71
|
+
if (!root) {
|
|
72
|
+
return undefined;
|
|
73
|
+
}
|
|
74
|
+
var handler = function handler(event) {
|
|
75
|
+
if (signal.aborted) {
|
|
76
|
+
return;
|
|
77
|
+
}
|
|
78
|
+
var submitButton = findSubmitButton(root);
|
|
79
|
+
if (!submitButton || isSubmitButton(submitButton)) {
|
|
80
|
+
return;
|
|
81
|
+
}
|
|
82
|
+
if (event.target !== submitButton && !submitButton.contains(event.target)) {
|
|
83
|
+
return;
|
|
84
|
+
}
|
|
85
|
+
event.preventDefault();
|
|
86
|
+
triggerFormSubmit({
|
|
87
|
+
form: formRef.current,
|
|
88
|
+
submitButton: submitButton
|
|
89
|
+
});
|
|
90
|
+
};
|
|
91
|
+
root.addEventListener('click', handler, true);
|
|
92
|
+
return function () {
|
|
93
|
+
root.removeEventListener('click', handler, true);
|
|
94
|
+
};
|
|
95
|
+
}
|
|
96
|
+
function autoSubmitForm(_x) {
|
|
100
97
|
return _autoSubmitForm.apply(this, arguments);
|
|
101
98
|
}
|
|
102
99
|
function _autoSubmitForm() {
|
|
103
|
-
_autoSubmitForm = _rollupPluginBabelHelpers._asyncToGenerator(/*#__PURE__*/_rollupPluginBabelHelpers._regenerator().m(function _callee(formRef
|
|
104
|
-
var
|
|
100
|
+
_autoSubmitForm = _rollupPluginBabelHelpers._asyncToGenerator(/*#__PURE__*/_rollupPluginBabelHelpers._regenerator().m(function _callee(formRef) {
|
|
101
|
+
var formSubmitConfig,
|
|
102
|
+
signal,
|
|
103
|
+
didPrepareUnchangedSubmit,
|
|
104
|
+
deadline,
|
|
105
|
+
_getSubmitTarget,
|
|
106
|
+
canSubmit,
|
|
107
|
+
form,
|
|
108
|
+
submitButton,
|
|
109
|
+
_args = arguments;
|
|
105
110
|
return _rollupPluginBabelHelpers._regenerator().w(function (_context) {
|
|
106
111
|
while (1) switch (_context.n) {
|
|
107
112
|
case 0:
|
|
108
|
-
|
|
113
|
+
formSubmitConfig = _args.length > 1 && _args[1] !== undefined ? _args[1] : {};
|
|
114
|
+
signal = _args.length > 2 ? _args[2] : undefined;
|
|
109
115
|
didPrepareUnchangedSubmit = false;
|
|
116
|
+
deadline = Date.now() + SUBMIT_TIMEOUT_MS;
|
|
110
117
|
case 1:
|
|
111
|
-
if (!(Date.now() < deadline)) {
|
|
112
|
-
_context.n =
|
|
113
|
-
break;
|
|
114
|
-
}
|
|
115
|
-
if (!signal.aborted) {
|
|
116
|
-
_context.n = 2;
|
|
118
|
+
if (!(Date.now() < deadline && !signal.aborted)) {
|
|
119
|
+
_context.n = 6;
|
|
117
120
|
break;
|
|
118
121
|
}
|
|
119
|
-
|
|
120
|
-
case 2:
|
|
121
|
-
_getFormSubmitTarget = getFormSubmitTarget(formRef), canMarkForm = _getFormSubmitTarget.canMarkForm, canSubmit = _getFormSubmitTarget.canSubmit, form = _getFormSubmitTarget.form, submitButton = _getFormSubmitTarget.submitButton;
|
|
122
|
+
_getSubmitTarget = getSubmitTarget(formRef), canSubmit = _getSubmitTarget.canSubmit, form = _getSubmitTarget.form, submitButton = _getSubmitTarget.submitButton;
|
|
122
123
|
if (canSubmit) {
|
|
123
|
-
_context.n =
|
|
124
|
+
_context.n = 3;
|
|
124
125
|
break;
|
|
125
126
|
}
|
|
126
|
-
_context.n =
|
|
127
|
+
_context.n = 2;
|
|
127
128
|
return sleep();
|
|
128
|
-
case
|
|
129
|
+
case 2:
|
|
129
130
|
return _context.a(3, 1);
|
|
130
|
-
case
|
|
131
|
+
case 3:
|
|
131
132
|
if (!(formSubmitConfig !== null && formSubmitConfig !== void 0 && formSubmitConfig.allowUnchangedSubmit && !didPrepareUnchangedSubmit)) {
|
|
132
|
-
_context.n =
|
|
133
|
-
break;
|
|
134
|
-
}
|
|
135
|
-
if (!canMarkForm) {
|
|
136
|
-
_context.n = 6;
|
|
133
|
+
_context.n = 5;
|
|
137
134
|
break;
|
|
138
135
|
}
|
|
139
136
|
prepareFormForAutoSubmit(form, formSubmitConfig);
|
|
140
137
|
didPrepareUnchangedSubmit = true;
|
|
141
|
-
_context.n =
|
|
138
|
+
_context.n = 4;
|
|
142
139
|
return sleep();
|
|
143
|
-
case
|
|
144
|
-
return _context.a(3, 1);
|
|
145
|
-
case 6:
|
|
146
|
-
_context.n = 7;
|
|
147
|
-
return sleep();
|
|
148
|
-
case 7:
|
|
140
|
+
case 4:
|
|
149
141
|
return _context.a(3, 1);
|
|
150
|
-
case
|
|
142
|
+
case 5:
|
|
151
143
|
triggerFormSubmit({
|
|
152
144
|
form: form,
|
|
153
145
|
submitButton: submitButton
|
|
154
146
|
});
|
|
155
147
|
return _context.a(2);
|
|
156
|
-
case
|
|
148
|
+
case 6:
|
|
157
149
|
return _context.a(2);
|
|
158
150
|
}
|
|
159
151
|
}, _callee);
|
|
@@ -204,7 +196,8 @@ function withFormRef(children, formRef, bindings) {
|
|
|
204
196
|
|
|
205
197
|
/**
|
|
206
198
|
* Авто-submit для интерактивного Storybook (Require / Validation / ServerError).
|
|
207
|
-
* При
|
|
199
|
+
* При primaryButtonHtmlType="button" вызывает formRef.current.submit() (final-form API)
|
|
200
|
+
* и вешает click на кнопку, чтобы ручной submit тоже работал.
|
|
208
201
|
* В Vitest не используется — submit делается в play.
|
|
209
202
|
*/
|
|
210
203
|
function FormSubmitWrapper(props) {
|
|
@@ -219,6 +212,17 @@ function FormSubmitWrapper(props) {
|
|
|
219
212
|
submit = _props$submit === void 0 ? true : _props$submit,
|
|
220
213
|
children = props.children;
|
|
221
214
|
var formSubmitConfig = parameters === null || parameters === void 0 ? void 0 : parameters.formSubmit;
|
|
215
|
+
React.useEffect(function () {
|
|
216
|
+
if (!submit) {
|
|
217
|
+
return undefined;
|
|
218
|
+
}
|
|
219
|
+
var abortController = new AbortController();
|
|
220
|
+
var unbindClick = bindSubmitButtonClick(formRef, abortController.signal);
|
|
221
|
+
return function () {
|
|
222
|
+
abortController.abort();
|
|
223
|
+
unbindClick === null || unbindClick === void 0 || unbindClick();
|
|
224
|
+
};
|
|
225
|
+
}, [formSubmitConfig, submit]);
|
|
222
226
|
React.useEffect(function () {
|
|
223
227
|
if (!submit) {
|
|
224
228
|
return undefined;
|
|
@@ -2,7 +2,63 @@
|
|
|
2
2
|
|
|
3
3
|
var _rollupPluginBabelHelpers = require('../../_rollupPluginBabelHelpers-D8XyM9rZ.js');
|
|
4
4
|
var React = require('react');
|
|
5
|
-
var
|
|
5
|
+
var isArray = require('../../isArray-DJguRq_2.js');
|
|
6
|
+
|
|
7
|
+
var castArray_1;
|
|
8
|
+
var hasRequiredCastArray;
|
|
9
|
+
|
|
10
|
+
function requireCastArray () {
|
|
11
|
+
if (hasRequiredCastArray) return castArray_1;
|
|
12
|
+
hasRequiredCastArray = 1;
|
|
13
|
+
var isArray$1 = isArray.requireIsArray();
|
|
14
|
+
|
|
15
|
+
/**
|
|
16
|
+
* Casts `value` as an array if it's not one.
|
|
17
|
+
*
|
|
18
|
+
* @static
|
|
19
|
+
* @memberOf _
|
|
20
|
+
* @since 4.4.0
|
|
21
|
+
* @category Lang
|
|
22
|
+
* @param {*} value The value to inspect.
|
|
23
|
+
* @returns {Array} Returns the cast array.
|
|
24
|
+
* @example
|
|
25
|
+
*
|
|
26
|
+
* _.castArray(1);
|
|
27
|
+
* // => [1]
|
|
28
|
+
*
|
|
29
|
+
* _.castArray({ 'a': 1 });
|
|
30
|
+
* // => [{ 'a': 1 }]
|
|
31
|
+
*
|
|
32
|
+
* _.castArray('abc');
|
|
33
|
+
* // => ['abc']
|
|
34
|
+
*
|
|
35
|
+
* _.castArray(null);
|
|
36
|
+
* // => [null]
|
|
37
|
+
*
|
|
38
|
+
* _.castArray(undefined);
|
|
39
|
+
* // => [undefined]
|
|
40
|
+
*
|
|
41
|
+
* _.castArray();
|
|
42
|
+
* // => []
|
|
43
|
+
*
|
|
44
|
+
* var array = [1, 2, 3];
|
|
45
|
+
* console.log(_.castArray(array) === array);
|
|
46
|
+
* // => true
|
|
47
|
+
*/
|
|
48
|
+
function castArray() {
|
|
49
|
+
if (!arguments.length) {
|
|
50
|
+
return [];
|
|
51
|
+
}
|
|
52
|
+
var value = arguments[0];
|
|
53
|
+
return isArray$1(value) ? value : [value];
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
castArray_1 = castArray;
|
|
57
|
+
return castArray_1;
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
var castArrayExports = requireCastArray();
|
|
61
|
+
var castArray = /*@__PURE__*/isArray.getDefaultExportFromCjs(castArrayExports);
|
|
6
62
|
|
|
7
63
|
function withFigmaSourceLink() {
|
|
8
64
|
var decorator = function decorator(Story, _ref) {
|
|
@@ -10,7 +66,7 @@ function withFigmaSourceLink() {
|
|
|
10
66
|
context = _ref.context;
|
|
11
67
|
var sourceLink = parameters.sourceLink || {};
|
|
12
68
|
if (parameters.design) {
|
|
13
|
-
var designList =
|
|
69
|
+
var designList = castArray(parameters.design);
|
|
14
70
|
if (!sourceLink.links) {
|
|
15
71
|
sourceLink.links = {};
|
|
16
72
|
}
|