@driveflux/ui 3.0.4 → 3.0.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/bottom-sheet/BottomSheetProvider.js +29 -157
- package/dist/bottom-sheet/context.js +4 -3
- package/dist/bottom-sheet/index.js +1 -0
- package/dist/bottom-sheet/use-bottom-sheet.js +2 -3
- package/dist/bottom-sheet/utils.js +5 -4
- package/dist/chakra.js +1 -0
- package/dist/modal/ModalProvider.js +59 -197
- package/dist/modal/components/EnhancedModalCustomWrapper.js +6 -127
- package/dist/modal/components/EnhancedModalFooter.js +5 -156
- package/dist/modal/components/MinimalModalContent.js +6 -88
- package/dist/modal/components/StandardModalContent.js +25 -359
- package/dist/modal/context.js +8 -7
- package/dist/modal/index.js +1 -0
- package/dist/modal/use-enhanced-modal.js +2 -1
- package/dist/theme/colors.js +63 -44
- package/dist/theme/index.js +1 -0
- package/dist/toast/index.js +3 -1
- package/dist/toast/use-toast-result.js +54 -161
- package/dist/translations.js +6 -5
- package/dist/types.js +2 -1
- package/dist/utils/accessors.js +11 -23
- package/dist/utils/index.js +1 -0
- package/dist/utils/react.js +12 -18
- package/package.json +10 -10
|
@@ -1,192 +1,85 @@
|
|
|
1
|
-
function _define_property(obj, key, value) {
|
|
2
|
-
if (key in obj) {
|
|
3
|
-
Object.defineProperty(obj, key, {
|
|
4
|
-
value: value,
|
|
5
|
-
enumerable: true,
|
|
6
|
-
configurable: true,
|
|
7
|
-
writable: true
|
|
8
|
-
});
|
|
9
|
-
} else {
|
|
10
|
-
obj[key] = value;
|
|
11
|
-
}
|
|
12
|
-
return obj;
|
|
13
|
-
}
|
|
14
|
-
function _object_spread(target) {
|
|
15
|
-
for(var i = 1; i < arguments.length; i++){
|
|
16
|
-
var source = arguments[i] != null ? arguments[i] : {};
|
|
17
|
-
var ownKeys = Object.keys(source);
|
|
18
|
-
if (typeof Object.getOwnPropertySymbols === "function") {
|
|
19
|
-
ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
|
|
20
|
-
return Object.getOwnPropertyDescriptor(source, sym).enumerable;
|
|
21
|
-
}));
|
|
22
|
-
}
|
|
23
|
-
ownKeys.forEach(function(key) {
|
|
24
|
-
_define_property(target, key, source[key]);
|
|
25
|
-
});
|
|
26
|
-
}
|
|
27
|
-
return target;
|
|
28
|
-
}
|
|
29
|
-
function ownKeys(object, enumerableOnly) {
|
|
30
|
-
var keys = Object.keys(object);
|
|
31
|
-
if (Object.getOwnPropertySymbols) {
|
|
32
|
-
var symbols = Object.getOwnPropertySymbols(object);
|
|
33
|
-
if (enumerableOnly) {
|
|
34
|
-
symbols = symbols.filter(function(sym) {
|
|
35
|
-
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
|
|
36
|
-
});
|
|
37
|
-
}
|
|
38
|
-
keys.push.apply(keys, symbols);
|
|
39
|
-
}
|
|
40
|
-
return keys;
|
|
41
|
-
}
|
|
42
|
-
function _object_spread_props(target, source) {
|
|
43
|
-
source = source != null ? source : {};
|
|
44
|
-
if (Object.getOwnPropertyDescriptors) {
|
|
45
|
-
Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
|
|
46
|
-
} else {
|
|
47
|
-
ownKeys(Object(source)).forEach(function(key) {
|
|
48
|
-
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
|
|
49
|
-
});
|
|
50
|
-
}
|
|
51
|
-
return target;
|
|
52
|
-
}
|
|
53
|
-
function _object_without_properties(source, excluded) {
|
|
54
|
-
if (source == null) return {};
|
|
55
|
-
var target = {}, sourceKeys, key, i;
|
|
56
|
-
if (typeof Reflect !== "undefined" && Reflect.ownKeys) {
|
|
57
|
-
sourceKeys = Reflect.ownKeys(Object(source));
|
|
58
|
-
for(i = 0; i < sourceKeys.length; i++){
|
|
59
|
-
key = sourceKeys[i];
|
|
60
|
-
if (excluded.indexOf(key) >= 0) continue;
|
|
61
|
-
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
|
|
62
|
-
target[key] = source[key];
|
|
63
|
-
}
|
|
64
|
-
return target;
|
|
65
|
-
}
|
|
66
|
-
target = _object_without_properties_loose(source, excluded);
|
|
67
|
-
if (Object.getOwnPropertySymbols) {
|
|
68
|
-
sourceKeys = Object.getOwnPropertySymbols(source);
|
|
69
|
-
for(i = 0; i < sourceKeys.length; i++){
|
|
70
|
-
key = sourceKeys[i];
|
|
71
|
-
if (excluded.indexOf(key) >= 0) continue;
|
|
72
|
-
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
|
|
73
|
-
target[key] = source[key];
|
|
74
|
-
}
|
|
75
|
-
}
|
|
76
|
-
return target;
|
|
77
|
-
}
|
|
78
|
-
function _object_without_properties_loose(source, excluded) {
|
|
79
|
-
if (source == null) return {};
|
|
80
|
-
var target = {}, sourceKeys = Object.getOwnPropertyNames(source), key, i;
|
|
81
|
-
for(i = 0; i < sourceKeys.length; i++){
|
|
82
|
-
key = sourceKeys[i];
|
|
83
|
-
if (excluded.indexOf(key) >= 0) continue;
|
|
84
|
-
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
|
|
85
|
-
target[key] = source[key];
|
|
86
|
-
}
|
|
87
|
-
return target;
|
|
88
|
-
}
|
|
89
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
90
2
|
import merge from 'lodash/merge.js';
|
|
91
3
|
import { useCallback } from 'react';
|
|
92
|
-
import { Box, ListItem, Text, UnorderedList, useToast } from '../chakra.js';
|
|
4
|
+
import { Box, ListItem, Text, UnorderedList, useToast, } from '../chakra.js';
|
|
93
5
|
import { translations } from '../translations.js';
|
|
94
6
|
import { accessReactNode } from '../utils/accessors.js';
|
|
95
|
-
|
|
7
|
+
const accessStatus = (s, data) => {
|
|
96
8
|
return typeof s === 'function' ? s(data) : s;
|
|
97
9
|
};
|
|
98
|
-
|
|
10
|
+
const defaultUseToastResultOptions = {
|
|
99
11
|
success: {
|
|
100
12
|
status: 'success',
|
|
101
13
|
title: translations.success,
|
|
102
14
|
description: translations.successDescription,
|
|
103
|
-
isClosable: true
|
|
15
|
+
isClosable: true,
|
|
104
16
|
},
|
|
105
17
|
error: {
|
|
106
18
|
status: 'error',
|
|
107
19
|
title: translations.failed,
|
|
108
20
|
defaultDescription: translations.failedDescription,
|
|
109
21
|
showValidationErrors: true,
|
|
110
|
-
isClosable: true
|
|
111
|
-
}
|
|
22
|
+
isClosable: true,
|
|
23
|
+
},
|
|
112
24
|
};
|
|
113
|
-
export
|
|
114
|
-
return Object.values(validation.fieldErrors).flatMap(
|
|
115
|
-
return v.map(function(vd) {
|
|
116
|
-
return vd.message;
|
|
117
|
-
});
|
|
118
|
-
});
|
|
25
|
+
export const getValidationErrorsList = (validation) => {
|
|
26
|
+
return Object.values(validation.fieldErrors).flatMap((v) => v.map((vd) => vd.message));
|
|
119
27
|
};
|
|
120
|
-
|
|
28
|
+
const accessOptions = (options, data) => {
|
|
121
29
|
if (!options) {
|
|
122
30
|
return options;
|
|
123
31
|
}
|
|
124
|
-
return
|
|
32
|
+
return {
|
|
33
|
+
...options,
|
|
125
34
|
status: accessStatus(options.status, data),
|
|
126
35
|
title: accessReactNode(options.title, data),
|
|
127
|
-
description: accessReactNode(options.description, data)
|
|
128
|
-
}
|
|
36
|
+
description: accessReactNode(options.description, data),
|
|
37
|
+
};
|
|
129
38
|
};
|
|
130
|
-
export
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
}));
|
|
157
|
-
}, [
|
|
158
|
-
originalToast
|
|
159
|
-
]);
|
|
160
|
-
var toastError = useCallback(function(providedOptions) {
|
|
161
|
-
var _$options = accessOptions(merge({}, defaultUseToastResultOptions.error, providedOptions));
|
|
162
|
-
return originalToast(_object_spread({}, _$options));
|
|
163
|
-
}, [
|
|
164
|
-
originalToast
|
|
165
|
-
]);
|
|
166
|
-
var toastSuccess = useCallback(function(providedOptions) {
|
|
167
|
-
var _$options = accessOptions(merge({}, defaultUseToastResultOptions.success, providedOptions));
|
|
168
|
-
return originalToast(_object_spread({}, _$options));
|
|
169
|
-
}, [
|
|
170
|
-
originalToast
|
|
171
|
-
]);
|
|
172
|
-
var toastResult = useCallback(function(result, generalToastOptions) {
|
|
173
|
-
var _$options = merge({}, defaultUseToastResultOptions, generalToastOptions);
|
|
174
|
-
var toastType = result.ok ? 'success' : 'error';
|
|
175
|
-
var toastOptions = _$options[toastType];
|
|
39
|
+
export const useToastResult = (options) => {
|
|
40
|
+
const originalToast = useToast(accessOptions(options?.defaultOptions));
|
|
41
|
+
const toastProblem = useCallback((problem, providedOptions) => {
|
|
42
|
+
const { description, defaultDescription, showValidationErrors, ...rest } = merge({}, defaultUseToastResultOptions.error, providedOptions);
|
|
43
|
+
const problemMessage = problem.message || defaultDescription;
|
|
44
|
+
return originalToast({
|
|
45
|
+
...accessOptions(rest, problem),
|
|
46
|
+
description: accessReactNode(description, problem) || (_jsxs(Box, { children: [problemMessage && _jsx(Text, { color: 'inherit', children: problemMessage }), problem.validation && showValidationErrors && (_jsx(UnorderedList, { color: 'inherit', children: getValidationErrorsList(problem.validation).map((message, _i) => (_jsx(ListItem, { children: message }, message))) }))] })),
|
|
47
|
+
});
|
|
48
|
+
}, [originalToast]);
|
|
49
|
+
const toastError = useCallback((providedOptions) => {
|
|
50
|
+
const options = accessOptions(merge({}, defaultUseToastResultOptions.error, providedOptions));
|
|
51
|
+
return originalToast({
|
|
52
|
+
...options,
|
|
53
|
+
});
|
|
54
|
+
}, [originalToast]);
|
|
55
|
+
const toastSuccess = useCallback((providedOptions) => {
|
|
56
|
+
const options = accessOptions(merge({}, defaultUseToastResultOptions.success, providedOptions));
|
|
57
|
+
return originalToast({
|
|
58
|
+
...options,
|
|
59
|
+
});
|
|
60
|
+
}, [originalToast]);
|
|
61
|
+
const toastResult = useCallback((result, generalToastOptions) => {
|
|
62
|
+
const options = merge({}, defaultUseToastResultOptions, generalToastOptions);
|
|
63
|
+
const toastType = result.ok ? 'success' : 'error';
|
|
64
|
+
const toastOptions = options[toastType];
|
|
176
65
|
if (!toastOptions) {
|
|
177
66
|
return;
|
|
178
67
|
}
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
68
|
+
const finalToastOptions = {
|
|
69
|
+
...accessOptions(typeof toastOptions === 'boolean'
|
|
70
|
+
? defaultUseToastResultOptions[toastType]
|
|
71
|
+
: toastOptions, result.val),
|
|
72
|
+
};
|
|
73
|
+
return result.ok
|
|
74
|
+
? toastSuccess(finalToastOptions)
|
|
75
|
+
: toastProblem(result.val, finalToastOptions);
|
|
76
|
+
}, [toastProblem, toastSuccess]);
|
|
185
77
|
return {
|
|
186
|
-
toastProblem
|
|
187
|
-
toastSuccess
|
|
188
|
-
toastResult
|
|
189
|
-
toastError
|
|
190
|
-
toast: originalToast
|
|
78
|
+
toastProblem,
|
|
79
|
+
toastSuccess,
|
|
80
|
+
toastResult,
|
|
81
|
+
toastError,
|
|
82
|
+
toast: originalToast,
|
|
191
83
|
};
|
|
192
84
|
};
|
|
85
|
+
//# sourceMappingURL=use-toast-result.js.map
|
package/dist/translations.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { singleton } from '@driveflux/singleton';
|
|
2
|
-
export
|
|
2
|
+
export const translations = singleton('uiTranslations', {
|
|
3
3
|
success: 'Success',
|
|
4
4
|
successDescription: 'Operation completed successfully.',
|
|
5
5
|
failed: 'Operation Failed',
|
|
@@ -7,15 +7,16 @@ export var translations = singleton('uiTranslations', {
|
|
|
7
7
|
cancel: 'Cancel',
|
|
8
8
|
confirm: 'Confirm',
|
|
9
9
|
close: 'Close',
|
|
10
|
-
ok: 'Ok'
|
|
10
|
+
ok: 'Ok',
|
|
11
11
|
});
|
|
12
|
-
export
|
|
13
|
-
for(
|
|
12
|
+
export const setTranslations = (ts) => {
|
|
13
|
+
for (const key in ts) {
|
|
14
14
|
// TODO
|
|
15
15
|
// @ts-expect-error
|
|
16
16
|
translations[key] = ts[key];
|
|
17
17
|
}
|
|
18
18
|
};
|
|
19
|
-
export
|
|
19
|
+
export const setTranslation = (key, value) => {
|
|
20
20
|
translations[key] = value;
|
|
21
21
|
};
|
|
22
|
+
//# sourceMappingURL=translations.js.map
|
package/dist/types.js
CHANGED
|
@@ -1 +1,2 @@
|
|
|
1
|
-
export {
|
|
1
|
+
export {};
|
|
2
|
+
//# sourceMappingURL=types.js.map
|
package/dist/utils/accessors.js
CHANGED
|
@@ -1,32 +1,20 @@
|
|
|
1
|
-
|
|
2
|
-
"@swc/helpers - typeof";
|
|
3
|
-
return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
|
|
4
|
-
}
|
|
5
|
-
export var accessSelf = function accessSelf(s, data, defaultValue) {
|
|
1
|
+
export const accessSelf = (s, data, defaultValue) => {
|
|
6
2
|
if (!s) {
|
|
7
3
|
return defaultValue;
|
|
8
4
|
}
|
|
9
5
|
return typeof s === 'function' ? s(data) : s;
|
|
10
6
|
};
|
|
11
|
-
export
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
export
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
export var accessStringOrNull = function accessStringOrNull(s, data) {
|
|
18
|
-
var defaultText = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : null;
|
|
19
|
-
return accessSelf(s, data, defaultText);
|
|
20
|
-
};
|
|
21
|
-
export var accessQuery = function accessQuery(s, data, defaultQuery) {
|
|
22
|
-
return accessSelf(s, data, defaultQuery);
|
|
23
|
-
};
|
|
24
|
-
export var accessReactNode = function accessReactNode(s, data, defaultNode) {
|
|
25
|
-
return accessSelf(s, data, defaultNode);
|
|
26
|
-
};
|
|
27
|
-
export var accessFunction = function accessFunction(f, data, defaultFunction) {
|
|
7
|
+
export const accessBoolean = (s, data, defaultBoolean) => accessSelf(s, data, defaultBoolean);
|
|
8
|
+
export const accessString = (s, data, defaultText) => accessSelf(s, data, defaultText);
|
|
9
|
+
export const accessStringOrNull = (s, data, defaultText = null) => accessSelf(s, data, defaultText);
|
|
10
|
+
export const accessQuery = (s, data, defaultQuery) => accessSelf(s, data, defaultQuery);
|
|
11
|
+
export const accessReactNode = (s, data, defaultNode) => accessSelf(s, data, defaultNode);
|
|
12
|
+
export const accessFunction = (f, data, defaultFunction) => {
|
|
28
13
|
if (!f) {
|
|
29
14
|
return defaultFunction;
|
|
30
15
|
}
|
|
31
|
-
return
|
|
16
|
+
return typeof f === 'object' && 'generateFunction' in f
|
|
17
|
+
? f.generateFunction(data)
|
|
18
|
+
: f;
|
|
32
19
|
};
|
|
20
|
+
//# sourceMappingURL=accessors.js.map
|
package/dist/utils/index.js
CHANGED
package/dist/utils/react.js
CHANGED
|
@@ -1,16 +1,10 @@
|
|
|
1
|
-
|
|
2
|
-
"@swc/helpers - instanceof";
|
|
3
|
-
if (right != null && typeof Symbol !== "undefined" && right[Symbol.hasInstance]) {
|
|
4
|
-
return !!right[Symbol.hasInstance](left);
|
|
5
|
-
} else {
|
|
6
|
-
return left instanceof right;
|
|
7
|
-
}
|
|
8
|
-
}
|
|
9
|
-
import { isValidElement } from 'react';
|
|
1
|
+
import { isValidElement, } from 'react';
|
|
10
2
|
export function isReactComponent(Component) {
|
|
11
|
-
return typeof Component === 'function' &&
|
|
12
|
-
|
|
13
|
-
|
|
3
|
+
return (typeof Component === 'function' &&
|
|
4
|
+
// TODO
|
|
5
|
+
// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access -- React component, it's fine
|
|
6
|
+
(Component.prototype instanceof Component ||
|
|
7
|
+
Component.displayName !== undefined));
|
|
14
8
|
}
|
|
15
9
|
export function isReactElement(element) {
|
|
16
10
|
// TODO
|
|
@@ -18,19 +12,19 @@ export function isReactElement(element) {
|
|
|
18
12
|
return isValidElement(element);
|
|
19
13
|
}
|
|
20
14
|
export function isReactNode(node) {
|
|
21
|
-
if (
|
|
15
|
+
if (
|
|
16
|
+
// TODO
|
|
22
17
|
// eslint-disable-next-line @typescript-eslint/no-unsafe-argument -- isValidElement is a validation function
|
|
23
18
|
isValidElement(node) || // Check if it's a React element
|
|
24
|
-
|
|
25
|
-
|
|
19
|
+
typeof node === 'string' || // Check if it's a string
|
|
20
|
+
typeof node === 'number' // Check if it's a number
|
|
26
21
|
) {
|
|
27
22
|
return true;
|
|
28
23
|
}
|
|
29
24
|
// Check if it's an array of React nodes
|
|
30
|
-
if (Array.isArray(node) && node.every(
|
|
31
|
-
return isReactNode(element);
|
|
32
|
-
})) {
|
|
25
|
+
if (Array.isArray(node) && node.every((element) => isReactNode(element))) {
|
|
33
26
|
return true;
|
|
34
27
|
}
|
|
35
28
|
return false;
|
|
36
29
|
}
|
|
30
|
+
//# sourceMappingURL=react.js.map
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@driveflux/ui",
|
|
3
|
-
"version": "3.0.
|
|
3
|
+
"version": "3.0.5",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"exports": {
|
|
6
6
|
".": {
|
|
@@ -37,23 +37,23 @@
|
|
|
37
37
|
],
|
|
38
38
|
"dependencies": {
|
|
39
39
|
"@chakra-ui/react": "^2.10.9",
|
|
40
|
-
"@driveflux/icons": "3.0.
|
|
41
|
-
"@driveflux/singleton": "3.0.
|
|
40
|
+
"@driveflux/icons": "3.0.2",
|
|
41
|
+
"@driveflux/singleton": "3.0.2",
|
|
42
42
|
"@emotion/react": "^11.14.0",
|
|
43
43
|
"@emotion/styled": "^11.14.1",
|
|
44
|
-
"framer-motion": "^12.
|
|
44
|
+
"framer-motion": "^12.39.0",
|
|
45
45
|
"lodash": "^4.18.1"
|
|
46
46
|
},
|
|
47
47
|
"devDependencies": {
|
|
48
|
-
"@driveflux/fab": "4.0.
|
|
49
|
-
"@driveflux/problem": "6.0.
|
|
50
|
-
"@driveflux/result": "6.0.
|
|
51
|
-
"@driveflux/tsconfig": "3.0.
|
|
48
|
+
"@driveflux/fab": "4.0.2",
|
|
49
|
+
"@driveflux/problem": "6.0.3",
|
|
50
|
+
"@driveflux/result": "6.0.3",
|
|
51
|
+
"@driveflux/tsconfig": "3.0.2",
|
|
52
52
|
"@swc/cli": "^0.8.1",
|
|
53
53
|
"@swc/core": "^1.15.33",
|
|
54
54
|
"@types/lodash": "^4.17.24",
|
|
55
|
-
"@types/node": "^25.
|
|
56
|
-
"@types/react": "19.2.
|
|
55
|
+
"@types/node": "^25.9.1",
|
|
56
|
+
"@types/react": "19.2.15",
|
|
57
57
|
"del-cli": "^7.0.0",
|
|
58
58
|
"next": "16.2.6",
|
|
59
59
|
"react": "19.2.6",
|