diginet-core-ui 1.4.42-beta.1 → 1.4.43
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.
|
@@ -652,7 +652,7 @@ const renderNavigator = (className, refs, dbLeftFn, leftFn, rightFn, dbRightFn,
|
|
|
652
652
|
color: 'primary',
|
|
653
653
|
type: 'h3',
|
|
654
654
|
ref: refs.content,
|
|
655
|
-
format: ['
|
|
655
|
+
format: ['lowercase']
|
|
656
656
|
}))), jsx("div", {
|
|
657
657
|
className: className.navigator.around
|
|
658
658
|
}, jsx(ButtonIcon, {
|
|
@@ -226,7 +226,7 @@ const Calendar = /*#__PURE__*/memo( /*#__PURE__*/forwardRef((inProps, reference)
|
|
|
226
226
|
* START EFFECT
|
|
227
227
|
*/
|
|
228
228
|
useEffect(() => {
|
|
229
|
-
if (defaultValue && defaultValue !== '' && isValidDate(defaultValue)
|
|
229
|
+
if (defaultValue && defaultValue !== '' && isValidDate(defaultValue)) {
|
|
230
230
|
if (isBeforeLimit(min, defaultValue)) {
|
|
231
231
|
onUpdate(min);
|
|
232
232
|
} else if (isAfterLimit(max, defaultValue)) {
|
|
@@ -1,15 +1,13 @@
|
|
|
1
1
|
/** @jsxRuntime classic */
|
|
2
2
|
/** @jsx jsx */
|
|
3
3
|
import { css, jsx } from '@emotion/core';
|
|
4
|
-
import { ButtonIcon, InputBase, Label, Popover, PopoverBody
|
|
4
|
+
import { ButtonIcon, InputBase, Label, Popover, PopoverBody } from "../..";
|
|
5
5
|
import PropTypes from 'prop-types';
|
|
6
|
-
import { Fragment, forwardRef, memo, useEffect, useImperativeHandle, useLayoutEffect, useRef, useState
|
|
6
|
+
import { Fragment, forwardRef, memo, useEffect, useImperativeHandle, useLayoutEffect, useRef, useState } from 'react';
|
|
7
7
|
import { animation, borderColor, displayBlock, overflowHidden, parseHeight, parseMinWidth, positionRelative, scaleX } from "../../../styles/general";
|
|
8
8
|
import { useTheme } from "../../../theme";
|
|
9
9
|
import useThemeProps from "../../../theme/utils/useThemeProps";
|
|
10
10
|
import { classNames, getProp } from "../../../utils";
|
|
11
|
-
const regexBetween = /[^{}]+(?=})/g;
|
|
12
|
-
const regexInclude = /{|}/g;
|
|
13
11
|
const DropdownBox = /*#__PURE__*/memo( /*#__PURE__*/forwardRef((inProps, reference) => {
|
|
14
12
|
if (!reference) reference = useRef(null);
|
|
15
13
|
const theme = useTheme();
|
|
@@ -24,14 +22,10 @@ const DropdownBox = /*#__PURE__*/memo( /*#__PURE__*/forwardRef((inProps, referen
|
|
|
24
22
|
});
|
|
25
23
|
const {
|
|
26
24
|
action = {},
|
|
27
|
-
allowInput,
|
|
28
25
|
bgColor: bgColorProp,
|
|
29
26
|
children,
|
|
30
27
|
className,
|
|
31
28
|
delayOnInput,
|
|
32
|
-
disabled,
|
|
33
|
-
displayExpr: displayExprProp,
|
|
34
|
-
error,
|
|
35
29
|
endIcon,
|
|
36
30
|
inputProps,
|
|
37
31
|
inputRef,
|
|
@@ -45,19 +39,10 @@ const DropdownBox = /*#__PURE__*/memo( /*#__PURE__*/forwardRef((inProps, referen
|
|
|
45
39
|
placeholder,
|
|
46
40
|
startIcon,
|
|
47
41
|
style,
|
|
48
|
-
value
|
|
49
|
-
|
|
50
|
-
viewType,
|
|
51
|
-
helperTextProps
|
|
42
|
+
value,
|
|
43
|
+
viewType
|
|
52
44
|
} = props;
|
|
53
|
-
let displayExpr = displayExprProp;
|
|
54
45
|
const bgColor = typeof bgColorProp === 'string' ? getProp(colors, bgColorProp, bgColorProp) : bgColorProp;
|
|
55
|
-
const ErrorView = useMemo(() => {
|
|
56
|
-
return error ? jsx(HelperText, {
|
|
57
|
-
...helperTextProps,
|
|
58
|
-
disabled: disabled
|
|
59
|
-
}, error) : null;
|
|
60
|
-
}, [disabled, error, helperTextProps]);
|
|
61
46
|
const ref = useRef(null);
|
|
62
47
|
const dropdownBoxRef = useRef(null);
|
|
63
48
|
const timer = useRef(null);
|
|
@@ -100,28 +85,6 @@ const DropdownBox = /*#__PURE__*/memo( /*#__PURE__*/forwardRef((inProps, referen
|
|
|
100
85
|
onClosed === null || onClosed === void 0 ? void 0 : onClosed();
|
|
101
86
|
}
|
|
102
87
|
};
|
|
103
|
-
|
|
104
|
-
/**
|
|
105
|
-
* Chuyển đổi data thành giá trị cần hiện thị dựa vào displayExpr [string, string object {field} - {field}], renderSelectedItem, displayExpr, valueExpr
|
|
106
|
-
* @param data {object} rowData of dataSource
|
|
107
|
-
* @return {string}
|
|
108
|
-
*/
|
|
109
|
-
const displayValue = data => {
|
|
110
|
-
let text = '';
|
|
111
|
-
if (data || data === 0) {
|
|
112
|
-
displayExpr = displayExpr || valueExpr;
|
|
113
|
-
let mask = data === null || data === void 0 ? void 0 : data[displayExpr];
|
|
114
|
-
// convert {id} - {name} to {<data[id]>} - {<data[name]>}
|
|
115
|
-
if (!mask && regexBetween.test(displayExpr)) {
|
|
116
|
-
var _displayExpr;
|
|
117
|
-
mask = (_displayExpr = displayExpr) === null || _displayExpr === void 0 ? void 0 : _displayExpr.replace(regexBetween, _ => (data === null || data === void 0 ? void 0 : data[_]) || '');
|
|
118
|
-
} else if (!mask) {
|
|
119
|
-
mask = typeof data !== 'object' ? data : '';
|
|
120
|
-
}
|
|
121
|
-
text = mask.toString().replace(regexInclude, '');
|
|
122
|
-
}
|
|
123
|
-
return text;
|
|
124
|
-
};
|
|
125
88
|
useLayoutEffect(() => {
|
|
126
89
|
if (ref.current) {
|
|
127
90
|
const {
|
|
@@ -167,17 +130,15 @@ const DropdownBox = /*#__PURE__*/memo( /*#__PURE__*/forwardRef((inProps, referen
|
|
|
167
130
|
onClick: openOnClickAt === 'icon' ? onTriggerDropdown : null
|
|
168
131
|
}) : null;
|
|
169
132
|
};
|
|
170
|
-
const value = displayValue(valueProps);
|
|
171
133
|
return jsx(Fragment, null, jsx("div", {
|
|
172
134
|
ref: ref,
|
|
173
135
|
css: _DropdownBoxRootCSS,
|
|
174
|
-
className: classNames('DGN-UI-Dropdown-Box', className
|
|
136
|
+
className: classNames('DGN-UI-Dropdown-Box', className),
|
|
175
137
|
style: style
|
|
176
138
|
}, label ? jsx(Label, {
|
|
177
139
|
...labelProps
|
|
178
140
|
}, label) : null, jsx(InputBase, {
|
|
179
141
|
...inputProps,
|
|
180
|
-
readOnly: !allowInput,
|
|
181
142
|
style: inputStyle,
|
|
182
143
|
viewType: viewType,
|
|
183
144
|
inputRef: inputRef,
|
|
@@ -196,7 +157,7 @@ const DropdownBox = /*#__PURE__*/memo( /*#__PURE__*/forwardRef((inProps, referen
|
|
|
196
157
|
anchor: ref.current,
|
|
197
158
|
width: popoverWidth,
|
|
198
159
|
onClose: closeDropdownBox
|
|
199
|
-
}, jsx(PopoverBody, null, children))
|
|
160
|
+
}, jsx(PopoverBody, null, children)));
|
|
200
161
|
}));
|
|
201
162
|
const DropdownBoxRootCSS = (bgColorProp, {
|
|
202
163
|
colors
|
|
@@ -205,17 +166,6 @@ const DropdownBoxRootCSS = (bgColorProp, {
|
|
|
205
166
|
${positionRelative};
|
|
206
167
|
${parseMinWidth(150)};
|
|
207
168
|
${parseHeight('max-content')};
|
|
208
|
-
&.error {
|
|
209
|
-
.DGN-UI-InputBase {
|
|
210
|
-
${borderColor(getProp(colors, 'semantic/danger'))};
|
|
211
|
-
&::before {
|
|
212
|
-
${borderColor(getProp(colors, 'semantic/danger'))};
|
|
213
|
-
}
|
|
214
|
-
&::after {
|
|
215
|
-
${borderColor(getProp(colors, 'semantic/danger'))};
|
|
216
|
-
}
|
|
217
|
-
}
|
|
218
|
-
}
|
|
219
169
|
.DGN-UI-InputBase {
|
|
220
170
|
background: ${bgColorProp ? bgColorProp === true ? getProp(colors, 'fill/disabled') : bgColorProp : 'inherit'} !important;
|
|
221
171
|
${openState && css`
|
|
@@ -233,6 +183,20 @@ const DropdownBoxCSS = ({
|
|
|
233
183
|
margin-top: ${spacing([1])};
|
|
234
184
|
${overflowHidden};
|
|
235
185
|
`;
|
|
186
|
+
|
|
187
|
+
// DropdownBox.defaultProps = {
|
|
188
|
+
// className: '',
|
|
189
|
+
// label: '',
|
|
190
|
+
// placeholder: '',
|
|
191
|
+
// startIcon: 'Search',
|
|
192
|
+
// endIcon: 'ArrowDown',
|
|
193
|
+
// openOnClickAt: 'icon',
|
|
194
|
+
// viewType: 'underlined',
|
|
195
|
+
// inputProps: {},
|
|
196
|
+
// delayOnInput: 700,
|
|
197
|
+
// zIndex: zIndexCORE(1),
|
|
198
|
+
// };
|
|
199
|
+
|
|
236
200
|
DropdownBox.propTypes = {
|
|
237
201
|
/** class for dropdown */
|
|
238
202
|
className: PropTypes.string,
|
|
@@ -269,12 +233,6 @@ DropdownBox.propTypes = {
|
|
|
269
233
|
/** the function will run after open */
|
|
270
234
|
onOpened: PropTypes.func,
|
|
271
235
|
/** the function will run after close */
|
|
272
|
-
onClosed: PropTypes.func
|
|
273
|
-
/** Error message displayed below the input. */
|
|
274
|
-
error: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
|
|
275
|
-
/** If `true`, the component is disabled. */
|
|
276
|
-
disabled: PropTypes.bool,
|
|
277
|
-
/** If `true`, the input is enable. */
|
|
278
|
-
allowInput: PropTypes.bool
|
|
236
|
+
onClosed: PropTypes.func
|
|
279
237
|
};
|
|
280
238
|
export default DropdownBox;
|
|
@@ -49,7 +49,7 @@ const NumberInput = /*#__PURE__*/forwardRef((inProps, reference) => {
|
|
|
49
49
|
labelProps,
|
|
50
50
|
max: maxProp,
|
|
51
51
|
maxDigit,
|
|
52
|
-
min
|
|
52
|
+
min,
|
|
53
53
|
nonStyle,
|
|
54
54
|
onBlur,
|
|
55
55
|
onChange,
|
|
@@ -69,12 +69,9 @@ const NumberInput = /*#__PURE__*/forwardRef((inProps, reference) => {
|
|
|
69
69
|
viewType
|
|
70
70
|
} = props;
|
|
71
71
|
let max = maxProp;
|
|
72
|
-
let min = minProp;
|
|
73
72
|
let thousandSymbol = thousandSeparator;
|
|
74
73
|
let decimalSymbol = decimalSymbolProp;
|
|
75
74
|
let valueProps = valueProp;
|
|
76
|
-
if (!min && min !== 0) min = -Infinity;
|
|
77
|
-
if (!max && max !== 0) max = Infinity;
|
|
78
75
|
const pos = useRef(null);
|
|
79
76
|
const ref = useRef(null);
|
|
80
77
|
const globalRef = useRef({});
|
|
@@ -98,13 +95,13 @@ const NumberInput = /*#__PURE__*/forwardRef((inProps, reference) => {
|
|
|
98
95
|
|
|
99
96
|
// if (valueProps || valueProps === 0) valueProps = clamp(valueProps, min, max);
|
|
100
97
|
|
|
101
|
-
/**
|
|
102
|
-
* Convert number to format money
|
|
103
|
-
* @param vl {number} - value
|
|
104
|
-
* @type {function}
|
|
105
|
-
* @return {string}
|
|
106
|
-
* @example 1200300.123 => 1,200,300.123
|
|
107
|
-
* @example 1200300,123 => 1.200.300,123
|
|
98
|
+
/**
|
|
99
|
+
* Convert number to format money
|
|
100
|
+
* @param vl {number} - value
|
|
101
|
+
* @type {function}
|
|
102
|
+
* @return {string}
|
|
103
|
+
* @example 1200300.123 => 1,200,300.123
|
|
104
|
+
* @example 1200300,123 => 1.200.300,123
|
|
108
105
|
*/
|
|
109
106
|
const parseNumberToMoney = useCallback((vl, isNumber) => {
|
|
110
107
|
var _number, _number2, _number$, _number3;
|
|
@@ -140,13 +137,13 @@ const NumberInput = /*#__PURE__*/forwardRef((inProps, reference) => {
|
|
|
140
137
|
return number;
|
|
141
138
|
}, [decimalSymbol, max, value]);
|
|
142
139
|
|
|
143
|
-
/**
|
|
144
|
-
* Convert money to format number
|
|
145
|
-
* @param vl {string} - value
|
|
146
|
-
* @type {function}
|
|
147
|
-
* @return {number}
|
|
148
|
-
* @example 1,200,300.123 => 1200300.123
|
|
149
|
-
* @example 1.200.300,123 => 1200300.123
|
|
140
|
+
/**
|
|
141
|
+
* Convert money to format number
|
|
142
|
+
* @param vl {string} - value
|
|
143
|
+
* @type {function}
|
|
144
|
+
* @return {number}
|
|
145
|
+
* @example 1,200,300.123 => 1200300.123
|
|
146
|
+
* @example 1.200.300,123 => 1200300.123
|
|
150
147
|
*/
|
|
151
148
|
const convertMoneyToNumber = useCallback((vl, isNumber) => {
|
|
152
149
|
var _number4, _number4$toString, _number4$toString$rep, _number4$toString$rep2, _number4$toString$rep3;
|
|
@@ -470,10 +467,10 @@ NumberInput.propTypes = {
|
|
|
470
467
|
style: PropTypes.object,
|
|
471
468
|
/** Thousand separator character. */
|
|
472
469
|
thousandSeparator: PropTypes.oneOfType([PropTypes.bool, PropTypes.oneOf(['.', ','])]),
|
|
473
|
-
/** Validation value, argument can:<br/>
|
|
474
|
-
* * string: the validation rule. Example required.<br/>
|
|
475
|
-
* * object: the validation rule insist name, property, message. Example {name: 'min', compareValue: 9, message: 'Error'} or {max: 99}<br/>
|
|
476
|
-
* * array: the validation rule list, insist object/string
|
|
470
|
+
/** Validation value, argument can:<br/>
|
|
471
|
+
* * string: the validation rule. Example required.<br/>
|
|
472
|
+
* * object: the validation rule insist name, property, message. Example {name: 'min', compareValue: 9, message: 'Error'} or {max: 99}<br/>
|
|
473
|
+
* * array: the validation rule list, insist object/string
|
|
477
474
|
*/
|
|
478
475
|
validates: PropTypes.oneOfType([PropTypes.string, PropTypes.object, PropTypes.array, PropTypes.func]),
|
|
479
476
|
/** The value of the input element, required for a controlled component. */
|
package/package.json
CHANGED
|
@@ -1,78 +1,44 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "diginet-core-ui",
|
|
3
|
-
"version": "1.4.
|
|
4
|
-
"description": "",
|
|
5
|
-
"
|
|
6
|
-
"
|
|
7
|
-
"scripts": {
|
|
8
|
-
"start": "
|
|
9
|
-
"start
|
|
10
|
-
"build
|
|
11
|
-
"
|
|
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
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
"devDependencies": {
|
|
46
|
-
"@babel/cli": "^7.14.3",
|
|
47
|
-
"@babel/plugin-proposal-class-properties": "^7.13.0",
|
|
48
|
-
"@babel/plugin-proposal-logical-assignment-operators": "^7.16.0",
|
|
49
|
-
"@babel/plugin-proposal-nullish-coalescing-operator": "^7.16.0",
|
|
50
|
-
"@babel/plugin-proposal-optional-chaining": "^7.14.2",
|
|
51
|
-
"@babel/plugin-proposal-private-methods": "^7.18.6",
|
|
52
|
-
"@babel/plugin-proposal-private-property-in-object": "^7.18.6",
|
|
53
|
-
"@babel/preset-react": "^7.13.13",
|
|
54
|
-
"@storybook/addon-actions": "6.2.9",
|
|
55
|
-
"@storybook/addon-essentials": "6.2.9",
|
|
56
|
-
"@storybook/addon-links": "6.2.9",
|
|
57
|
-
"@storybook/addon-postcss": "^2.0.0",
|
|
58
|
-
"@storybook/react": "6.2.9",
|
|
59
|
-
"@storybook/test-runner": "^0.7.1",
|
|
60
|
-
"autoprefixer": "^10.3.1",
|
|
61
|
-
"babel-loader": "^8.2.2",
|
|
62
|
-
"eslint": "^8.4.1",
|
|
63
|
-
"eslint-plugin-react": "^7.27.1",
|
|
64
|
-
"eslint-plugin-regex": "^1.10.0",
|
|
65
|
-
"husky": "^7.0.4",
|
|
66
|
-
"jest": "^27.5.1",
|
|
67
|
-
"lint-staged": "^12.1.2",
|
|
68
|
-
"mkdirp": "^1.0.4",
|
|
69
|
-
"npm-run-all": "^4.1.5",
|
|
70
|
-
"onchange": "^7.1.0",
|
|
71
|
-
"postcss-flexbugs-fixes": "^5.0.2",
|
|
72
|
-
"react": "^17.0.1",
|
|
73
|
-
"react-dom": "^17.0.1",
|
|
74
|
-
"rimraf": "^3.0.2",
|
|
75
|
-
"run-script-os": "^1.1.6",
|
|
76
|
-
"sass": "1.58.3"
|
|
77
|
-
}
|
|
78
|
-
}
|
|
1
|
+
{
|
|
2
|
+
"name": "diginet-core-ui",
|
|
3
|
+
"version": "1.4.43",
|
|
4
|
+
"description": "The DigiNet core ui",
|
|
5
|
+
"homepage": "https://diginet.com.vn",
|
|
6
|
+
"main": "index.js",
|
|
7
|
+
"scripts": {
|
|
8
|
+
"start-js": "react-scripts start --max_old_space_size=4096",
|
|
9
|
+
"start": "npx npm-run-all -p start-js",
|
|
10
|
+
"build": "GENERATE_SOURCEMAP=false && react-scripts build --env=production --max_old_space_size=8192",
|
|
11
|
+
"eject": "react-scripts eject",
|
|
12
|
+
"test": "echo \"Error: no test specified\" && exit 1"
|
|
13
|
+
},
|
|
14
|
+
"dependencies": {
|
|
15
|
+
"@emotion/core": "^10.0.35",
|
|
16
|
+
"prop-types": "^15.7.2",
|
|
17
|
+
"@emotion/css": "^11.11.0",
|
|
18
|
+
"@emotion/react": "^11.10.6"
|
|
19
|
+
},
|
|
20
|
+
"repository": {
|
|
21
|
+
"type": "git",
|
|
22
|
+
"url": "git+https://diginetvn@bitbucket.org/diginetvn/diginet-core-ui.git"
|
|
23
|
+
},
|
|
24
|
+
"keywords": [
|
|
25
|
+
"core ui",
|
|
26
|
+
"diginet"
|
|
27
|
+
],
|
|
28
|
+
"author": "rocachien",
|
|
29
|
+
"contributors": [
|
|
30
|
+
{
|
|
31
|
+
"name": "Chien Do",
|
|
32
|
+
"email": "rocachien@gmail.com"
|
|
33
|
+
},
|
|
34
|
+
{
|
|
35
|
+
"name": "Nhat Tran",
|
|
36
|
+
"email": "tranminhnhat1005@gmail.com"
|
|
37
|
+
},
|
|
38
|
+
{
|
|
39
|
+
"name": "Thuan Nguyen",
|
|
40
|
+
"email": "nt.thuan.hutech@gmail.com"
|
|
41
|
+
}
|
|
42
|
+
],
|
|
43
|
+
"license": "MIT"
|
|
44
|
+
}
|
package/readme.md
CHANGED
|
@@ -41,12 +41,14 @@ npm test
|
|
|
41
41
|
```
|
|
42
42
|
|
|
43
43
|
## Changelog
|
|
44
|
+
## 1.4.43
|
|
45
|
+
|
|
46
|
+
- \[Fixed\]: NumberInput – Fix NumberInput focus wrong position onFocus
|
|
44
47
|
|
|
45
48
|
## 1.4.42
|
|
46
49
|
|
|
47
50
|
- \[Added\]: Icon – Add IconMenu MHRP29N0031
|
|
48
51
|
- \[Fixed\]: DropDown – Fix the bug where the DropDown Core jumps when typing in the Search box
|
|
49
|
-
- \[Fixed\]: NumberInput – Fix NumberInput focus wrong position onFocus
|
|
50
52
|
|
|
51
53
|
## 1.4.41
|
|
52
54
|
|