@steroidsjs/core 3.1.3 → 3.1.4
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/components/StoreComponent.d.ts +1 -1
- package/components/UiComponent.js +2 -2
- package/docs-autogen-result.json +29 -4
- package/en.json +6 -5
- package/hooks/useApplication.d.ts +2 -1
- package/hooks/useFetch.d.ts +1 -1
- package/hooks/useFile.js +1 -1
- package/package.json +3 -3
- package/reducers/list.d.ts +1 -1
- package/ui/content/CalendarSystem/hooks/useCalendarSystem.d.ts +2 -2
- package/ui/content/CalendarSystem/hooks/useCalendarSystemEventGroupModals.d.ts +2 -1
- package/ui/content/CalendarSystem/hooks/useCalendarSystemEventGroupModals.js +4 -1
- package/ui/content/CalendarSystem/hooks/useDisplayDate.d.ts +1 -1
- package/ui/content/CalendarSystem/hooks/useMonthGrid.d.ts +1 -1
- package/ui/content/CalendarSystem/utils/utils.d.ts +3 -2
- package/ui/content/Detail/Detail.js +2 -2
- package/ui/content/Icon/Icon.js +1 -1
- package/ui/content/Kanban/enums/KanbanPrioritiesEnum.d.ts +2 -2
- package/ui/form/NumberField/NumberField.d.ts +11 -4
- package/ui/form/NumberField/NumberField.js +78 -24
- package/ui/format/EnumFormatter/EnumFormatter.js +1 -1
- package/ui/modal/ModalPortal/ModalPortal.js +5 -5
- package/ui/nav/Router/Router.js +2 -2
- package/ui/nav/Router/helpers.d.ts +1 -1
- package/utils/data.d.ts +1 -1
- package/utils/data.js +1 -1
- package/ui/form/NumberField/hooks/useInputTypeNumber.d.ts +0 -11
- package/ui/form/NumberField/hooks/useInputTypeNumber.js +0 -66
|
@@ -4,7 +4,7 @@ import { History, LocationState } from 'history';
|
|
|
4
4
|
import { Store, Dispatch, Unsubscribe, Reducer, AnyAction } from 'redux';
|
|
5
5
|
declare global {
|
|
6
6
|
interface Window {
|
|
7
|
-
APP_REDUX_PRELOAD_STATES?: any;
|
|
7
|
+
APP_REDUX_PRELOAD_STATES?: [any];
|
|
8
8
|
__REDUX_DEVTOOLS_EXTENSION__?: any;
|
|
9
9
|
}
|
|
10
10
|
}
|
|
@@ -42,7 +42,7 @@ var UiComponent = /** @class */ (function () {
|
|
|
42
42
|
Component = this._getComponent('views', Component);
|
|
43
43
|
}
|
|
44
44
|
if (!forceNode && (0, isFunction_1["default"])(Component)) {
|
|
45
|
-
if (Component.defaultProps) {
|
|
45
|
+
if ('defaultProps' in Component && (0, isObject_1["default"])(Component.defaultProps)) {
|
|
46
46
|
return Component(__assign(__assign({}, Component.defaultProps), props));
|
|
47
47
|
}
|
|
48
48
|
return Component(props);
|
|
@@ -111,7 +111,7 @@ var UiComponent = /** @class */ (function () {
|
|
|
111
111
|
var _this = this;
|
|
112
112
|
if (defaultNamespace === void 0) { defaultNamespace = null; }
|
|
113
113
|
// require.context()
|
|
114
|
-
if ((0, isFunction_1["default"])(items) && (0, isFunction_1["default"])(items.keys)) {
|
|
114
|
+
if ((0, isFunction_1["default"])(items) && 'keys' in items && (0, isFunction_1["default"])(items.keys)) {
|
|
115
115
|
items.keys().forEach(function (fileName) {
|
|
116
116
|
var matches = fileName.match(/^\.\/(.*\/)?[^\\/]+\/([^\\/]+)\.(js|ts)x?$/);
|
|
117
117
|
if (matches) {
|
package/docs-autogen-result.json
CHANGED
|
@@ -2996,7 +2996,7 @@
|
|
|
2996
2996
|
"decorators": [],
|
|
2997
2997
|
"description": "",
|
|
2998
2998
|
"required": false,
|
|
2999
|
-
"type": "
|
|
2999
|
+
"type": "{}",
|
|
3000
3000
|
"example": null
|
|
3001
3001
|
}
|
|
3002
3002
|
],
|
|
@@ -27117,6 +27117,15 @@
|
|
|
27117
27117
|
"example": "{width: '45%'}",
|
|
27118
27118
|
"defaultValue": null
|
|
27119
27119
|
},
|
|
27120
|
+
{
|
|
27121
|
+
"name": "thousandSeparator",
|
|
27122
|
+
"decorators": [],
|
|
27123
|
+
"description": "Разделитель тысяч (по умолчанию пустая строка — без разделителя, например 1000).\nДля отображения \"1 000\" передать пробел: thousandSeparator=\" \"",
|
|
27124
|
+
"required": false,
|
|
27125
|
+
"type": "string",
|
|
27126
|
+
"example": "','",
|
|
27127
|
+
"defaultValue": null
|
|
27128
|
+
},
|
|
27120
27129
|
{
|
|
27121
27130
|
"name": "value",
|
|
27122
27131
|
"decorators": [],
|
|
@@ -27305,7 +27314,7 @@
|
|
|
27305
27314
|
"decorators": [],
|
|
27306
27315
|
"description": "Свойства для элемента input",
|
|
27307
27316
|
"required": true,
|
|
27308
|
-
"type": "{disabled: boolean, max: number, min: number, name: string, placeholder: string, required: boolean, step: string | number, type: string, value: number,
|
|
27317
|
+
"type": "{disabled: boolean, max: number, min: number, name: string, placeholder: string, required: boolean, step: string | number, type: string, value: string | number, onInput: null}",
|
|
27309
27318
|
"example": null
|
|
27310
27319
|
},
|
|
27311
27320
|
{
|
|
@@ -27444,6 +27453,14 @@
|
|
|
27444
27453
|
"type": "CSSProperties",
|
|
27445
27454
|
"example": "{width: '45%'}"
|
|
27446
27455
|
},
|
|
27456
|
+
{
|
|
27457
|
+
"name": "thousandSeparator",
|
|
27458
|
+
"decorators": [],
|
|
27459
|
+
"description": "Разделитель тысяч (по умолчанию пустая строка — без разделителя, например 1000).\nДля отображения \"1 000\" передать пробел: thousandSeparator=\" \"",
|
|
27460
|
+
"required": false,
|
|
27461
|
+
"type": "string",
|
|
27462
|
+
"example": "','"
|
|
27463
|
+
},
|
|
27447
27464
|
{
|
|
27448
27465
|
"name": "value",
|
|
27449
27466
|
"decorators": [],
|
|
@@ -41897,6 +41914,14 @@
|
|
|
41897
41914
|
"type": "\"top\" | \"bottom\" | \"both\" | string",
|
|
41898
41915
|
"example": null
|
|
41899
41916
|
},
|
|
41917
|
+
"ComponentConstructor": {
|
|
41918
|
+
"name": "ComponentConstructor",
|
|
41919
|
+
"decorators": [],
|
|
41920
|
+
"description": "",
|
|
41921
|
+
"required": true,
|
|
41922
|
+
"type": "{}",
|
|
41923
|
+
"example": null
|
|
41924
|
+
},
|
|
41900
41925
|
"DataProviderItems": {
|
|
41901
41926
|
"name": "DataProviderItems",
|
|
41902
41927
|
"decorators": [],
|
|
@@ -45447,7 +45472,7 @@
|
|
|
45447
45472
|
"decorators": [],
|
|
45448
45473
|
"description": "",
|
|
45449
45474
|
"required": false,
|
|
45450
|
-
"type": "
|
|
45475
|
+
"type": "number",
|
|
45451
45476
|
"example": null,
|
|
45452
45477
|
"parameters": []
|
|
45453
45478
|
},
|
|
@@ -45510,7 +45535,7 @@
|
|
|
45510
45535
|
"decorators": [],
|
|
45511
45536
|
"description": "",
|
|
45512
45537
|
"required": false,
|
|
45513
|
-
"type": "
|
|
45538
|
+
"type": "ITaskPriority",
|
|
45514
45539
|
"example": null,
|
|
45515
45540
|
"parameters": [
|
|
45516
45541
|
{
|
package/en.json
CHANGED
|
@@ -1057,9 +1057,10 @@
|
|
|
1057
1057
|
"Применяется для SSR. Если fetch критический — SSR вернет страницу со статус кодом ошибки.": "Used for SSR. If the fetch is critical, SSR will return the page with an error status code.",
|
|
1058
1058
|
"Дополнительное содержание сообщения.": "Additional message content.",
|
|
1059
1059
|
"Метки на ползунке. В объекте {key: 'value'} key определяет положение, а value определяет, что будет отображаться.\nЕсли вы хотите задать стиль определенной точки метки, значением должен быть объект,\nсодержащий свойства style и label.": "Labels on the slider. In the object {key: 'value'}, the key determines the position, and the value determines what will be displayed.\nIf you want to set a style for a specific label point, the value must be an object\ncontaining the style and label properties.",
|
|
1060
|
-
"Применяется для ssr. Если fetch критический — ssr вернет страницу со статус кодом ошибки.": "",
|
|
1061
|
-
"
|
|
1062
|
-
"Название цвета для
|
|
1063
|
-
"Название цвета для
|
|
1064
|
-
"Название цвета для
|
|
1060
|
+
"Применяется для ssr. Если fetch критический — ssr вернет страницу со статус кодом ошибки.": "Used for SSR. If the fetch is critical, the SSR will return the page with an error status code.",
|
|
1061
|
+
"Разделитель тысяч (по умолчанию пустая строка — без разделителя, например 1000).\nДля отображения \"1 000\" передать пробел: thousandSeparator=\" \"": "Thousands separator (default is an empty string — no separator, e.g., 1000).\nTo display \"1 000\", pass a space: thousandSeparator=\" \"",
|
|
1062
|
+
"Название цвета для Alert и Notification": "Color name for Alert and Notification",
|
|
1063
|
+
"Название цвета для Badge": "Color name for Badge",
|
|
1064
|
+
"Название цвета для Button": "Color name for Button",
|
|
1065
|
+
"Название цвета для Text, Title": "Color name for Text, Title"
|
|
1065
1066
|
}
|
|
@@ -15,8 +15,9 @@ import { IComponents } from '../providers/ComponentsProvider';
|
|
|
15
15
|
import { IScreenProviderProps } from '../providers/ScreenProvider';
|
|
16
16
|
import { IThemeProviderProps } from '../providers/ThemeProvider';
|
|
17
17
|
import { IRouteItem, IRouterProps } from '../ui/nav/Router/Router';
|
|
18
|
+
export type ComponentConstructor = new (components: IComponents, config?: Record<string, any>) => any;
|
|
18
19
|
export interface IComponentConfig {
|
|
19
|
-
className?:
|
|
20
|
+
className?: ComponentConstructor;
|
|
20
21
|
[key: string]: any;
|
|
21
22
|
}
|
|
22
23
|
/**
|
package/hooks/useFetch.d.ts
CHANGED
|
@@ -25,7 +25,7 @@ export interface IFetchResult<T> {
|
|
|
25
25
|
axiosError: AxiosError | null;
|
|
26
26
|
}
|
|
27
27
|
export declare const normalizeConfig: (config: any) => any;
|
|
28
|
-
export declare const getConfigId: (config: any) =>
|
|
28
|
+
export declare const getConfigId: (config: any) => string;
|
|
29
29
|
export declare const defaultFetchHandler: (config: any, components: any, addCancelToken: any) => any;
|
|
30
30
|
export declare const fetchData: (config: any, components: any, addCancelToken: any) => any;
|
|
31
31
|
/**
|
package/hooks/useFile.js
CHANGED
|
@@ -219,7 +219,7 @@ function useFile(props) {
|
|
|
219
219
|
var prevInputValue = (0, react_use_1.usePrevious)(props.input.value);
|
|
220
220
|
//todo refactoring
|
|
221
221
|
(0, react_1.useEffect)(function () {
|
|
222
|
-
if (prevInputValue && !(0, isEqual_1["default"])(prevInputValue
|
|
222
|
+
if (prevInputValue && !(0, isEqual_1["default"])(prevInputValue, props.input.value)) {
|
|
223
223
|
var toRemove_1 = (0, difference_1["default"])([].concat(prevInputValue || []), [].concat(props.input.value || []));
|
|
224
224
|
if (toRemove_1.length > 0) {
|
|
225
225
|
uploader.queue.remove(uploader.queue.getFiles().filter(function (file) { return (toRemove_1.indexOf((0, get_1["default"])(file.getResultHttpMessage(), 'id')) !== -1); }));
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@steroidsjs/core",
|
|
3
|
-
"version": "3.1.
|
|
3
|
+
"version": "3.1.4",
|
|
4
4
|
"description": "",
|
|
5
5
|
"author": "Vladimir Kozhin <hello@kozhindev.com>",
|
|
6
6
|
"repository": {
|
|
@@ -39,8 +39,7 @@
|
|
|
39
39
|
"intl-messageformat": "^10.1.4",
|
|
40
40
|
"js-cookie": "^2.2.1",
|
|
41
41
|
"load-js": "^3.0.3",
|
|
42
|
-
"lodash": "^4.17.
|
|
43
|
-
"lodash-es": "^4.17.21",
|
|
42
|
+
"lodash-es": "^4.17.23",
|
|
44
43
|
"path-to-regexp": "1.9.0",
|
|
45
44
|
"qs": "^6.15.0",
|
|
46
45
|
"react": "^18.2.0",
|
|
@@ -72,6 +71,7 @@
|
|
|
72
71
|
"@types/enzyme": "^3.10.8",
|
|
73
72
|
"@types/enzyme-adapter-react-16": "^1.0.6",
|
|
74
73
|
"@types/jest": "^26.0.22",
|
|
74
|
+
"@types/lodash-es": "^4.17.12",
|
|
75
75
|
"@types/markdown-to-jsx": "^7.0.1",
|
|
76
76
|
"@types/reach__router": "^1.3.7",
|
|
77
77
|
"@types/react": "^18.0.20",
|
package/reducers/list.d.ts
CHANGED
|
@@ -9,4 +9,4 @@ export declare const getIds: (state: any, listId: any) => any;
|
|
|
9
9
|
export declare const getListItems: (state: any, listId: any) => any;
|
|
10
10
|
export declare const getSelectedIds: (state: any, listId: any) => any;
|
|
11
11
|
export declare const isSelected: (state: any, listId: any, itemId: any) => any;
|
|
12
|
-
export declare const isSelectedAll: (state: any, listId: any) =>
|
|
12
|
+
export declare const isSelectedAll: (state: any, listId: any) => boolean;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { ICalendarSystemProps, ICalendarUser, IEventGroup } from '../CalendarSystem';
|
|
3
3
|
export declare const useCalendarSystem: (props: ICalendarSystemProps) => {
|
|
4
|
-
monthGridWeekDays:
|
|
4
|
+
monthGridWeekDays: string[];
|
|
5
5
|
monthGridCalendarDays: import("../CalendarSystem").IDay[];
|
|
6
6
|
weekGridTwentyFourHoursArray: string[];
|
|
7
7
|
weekGridCurrentWeekDays: {
|
|
@@ -13,7 +13,7 @@ export declare const useCalendarSystem: (props: ICalendarSystemProps) => {
|
|
|
13
13
|
}[];
|
|
14
14
|
dayGridTwentyFourHoursArray: string[];
|
|
15
15
|
dayGridCurrentDay: import("../CalendarSystem").IDay;
|
|
16
|
-
dateToDisplay: any
|
|
16
|
+
dateToDisplay: Capitalize<any>;
|
|
17
17
|
innerEventGroups: IEventGroup[];
|
|
18
18
|
calendarType: string;
|
|
19
19
|
users: ICalendarUser[];
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
+
import { Dispatch, SetStateAction } from 'react';
|
|
1
2
|
import { IModalProps } from '../../../modal/Modal/Modal';
|
|
2
3
|
import { IEventGroup } from '../CalendarSystem';
|
|
3
|
-
export declare const useCalendarSystemEventGroupModals: (innerEventGroups: IEventGroup[], setInnerEventGroups:
|
|
4
|
+
export declare const useCalendarSystemEventGroupModals: (innerEventGroups: IEventGroup[], setInnerEventGroups: Dispatch<SetStateAction<IEventGroup[]>>, eventGroupModalProps: IModalProps) => {
|
|
4
5
|
openCreateEventGroupModal: () => void;
|
|
5
6
|
};
|
|
@@ -30,8 +30,11 @@ var useCalendarSystemEventGroupModals = function (innerEventGroups, setInnerEven
|
|
|
30
30
|
var defaultEventGroupColor = (0, react_1.useMemo)(function () { return theme === 'light' ? PRIMARY_LIGHT : PRIMARY_DARK; }, [theme]);
|
|
31
31
|
var onSubmit = (0, react_1.useCallback)(function (fields) {
|
|
32
32
|
var _a;
|
|
33
|
+
var maxGroup = (0, maxBy_1["default"])(innerEventGroups, function (group) { return group.id; });
|
|
34
|
+
var maxId = (_a = Number(maxGroup === null || maxGroup === void 0 ? void 0 : maxGroup.id)) !== null && _a !== void 0 ? _a : DEFAULT_ID;
|
|
35
|
+
var id = maxId + 1;
|
|
33
36
|
var newEventGroup = {
|
|
34
|
-
id:
|
|
37
|
+
id: id,
|
|
35
38
|
label: fields.label,
|
|
36
39
|
color: fields.color,
|
|
37
40
|
events: []
|
|
@@ -1,8 +1,9 @@
|
|
|
1
|
+
/// <reference types="lodash" />
|
|
1
2
|
import { CSSProperties } from 'react';
|
|
2
3
|
import { IDay, IEvent, IEventGroup } from '../CalendarSystem';
|
|
3
4
|
export declare const getWeekDaysFromDate: (date: Date) => IDay[];
|
|
4
5
|
export declare const isDateIsToday: (date: Date) => boolean;
|
|
5
|
-
export declare const getOmittedEvent: (event: IEvent | Omit<IEvent, 'color'>) =>
|
|
6
|
+
export declare const getOmittedEvent: (event: IEvent | Omit<IEvent, 'color'>) => import("lodash").Omit<IEvent | Omit<IEvent, "color">, "color" | "eventGroupId">;
|
|
6
7
|
export declare const sortEventsInGroup: (group: IEventGroup) => Omit<IEvent, "color">[];
|
|
7
8
|
export declare const getSourceCalendarControl: (control: string) => HTMLElement;
|
|
8
9
|
export declare const getFormattedDay: (date?: Date) => IDay;
|
|
@@ -14,7 +15,7 @@ export declare const getFormattedWeekFromDate: (fromDate?: Date) => {
|
|
|
14
15
|
formattedDisplay?: string;
|
|
15
16
|
}[];
|
|
16
17
|
export declare const getTwentyFourHoursArray: () => string[];
|
|
17
|
-
export declare const getWeekDays: () =>
|
|
18
|
+
export declare const getWeekDays: () => string[];
|
|
18
19
|
export declare const getProportionFromEvent: (event: IEvent) => number;
|
|
19
20
|
export declare const getTopMarginFromEvent: (event: IEvent) => CSSProperties;
|
|
20
21
|
export declare const formatEventTime: (date: Date) => any;
|
|
@@ -15,8 +15,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
15
15
|
};
|
|
16
16
|
exports.__esModule = true;
|
|
17
17
|
exports.constants = exports.DetailLayoutEnum = void 0;
|
|
18
|
-
var isArray_1 = __importDefault(require("lodash/isArray"));
|
|
19
|
-
var orderBy_1 = __importDefault(require("lodash/orderBy"));
|
|
18
|
+
var isArray_1 = __importDefault(require("lodash-es/isArray"));
|
|
19
|
+
var orderBy_1 = __importDefault(require("lodash-es/orderBy"));
|
|
20
20
|
var react_1 = require("react");
|
|
21
21
|
var DetailItem_1 = __importDefault(require("./DetailItem"));
|
|
22
22
|
var hooks_1 = require("../../../hooks");
|
package/ui/content/Icon/Icon.js
CHANGED
|
@@ -19,7 +19,7 @@ function Icon(props) {
|
|
|
19
19
|
icon = name.indexOf('<svg') === 0 || name.indexOf('http') === 0
|
|
20
20
|
? name
|
|
21
21
|
: components.ui.getIcon(name);
|
|
22
|
-
if ((0, isObject_1["default"])(icon) && (0, isString_1["default"])(icon["default"])) {
|
|
22
|
+
if ((0, isObject_1["default"])(icon) && 'default' in icon && (0, isString_1["default"])(icon["default"])) {
|
|
23
23
|
icon = icon["default"];
|
|
24
24
|
}
|
|
25
25
|
// Fix width attribute in icon
|
|
@@ -13,6 +13,6 @@ export default class KanbanPrioritiesEnum extends Enum {
|
|
|
13
13
|
};
|
|
14
14
|
static getColorByType(type: any): string;
|
|
15
15
|
static getPrioritiesArray(): ITaskPriority[];
|
|
16
|
-
static getPriorityById(id: any):
|
|
17
|
-
static getDefaultSelectedPriorityId():
|
|
16
|
+
static getPriorityById(id: any): ITaskPriority;
|
|
17
|
+
static getDefaultSelectedPriorityId(): number;
|
|
18
18
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ISaveCursorPositionDebounceConfig } from '@steroidsjs/core/hooks/useSaveCursorPosition';
|
|
2
|
-
import { ChangeEvent } from 'react';
|
|
2
|
+
import { ChangeEvent, MutableRefObject } from 'react';
|
|
3
3
|
import { IFieldWrapperInputProps, IFieldWrapperOutputProps } from '../Field/fieldWrapper';
|
|
4
4
|
import { IBaseFieldProps } from '../InputField/InputField';
|
|
5
5
|
/**
|
|
@@ -35,13 +35,20 @@ export interface INumberFieldProps extends IFieldWrapperInputProps, IBaseFieldPr
|
|
|
35
35
|
* Задержка применения введённого значения
|
|
36
36
|
*/
|
|
37
37
|
debounce?: boolean | ISaveCursorPositionDebounceConfig;
|
|
38
|
+
/**
|
|
39
|
+
* Разделитель тысяч (по умолчанию пустая строка — без разделителя, например 1000).
|
|
40
|
+
* Для отображения "1 000" передать пробел: thousandSeparator=" "
|
|
41
|
+
* @example ' '
|
|
42
|
+
* @example ','
|
|
43
|
+
*/
|
|
44
|
+
thousandSeparator?: string;
|
|
38
45
|
}
|
|
39
46
|
export interface INumberFieldViewProps extends INumberFieldProps, IFieldWrapperOutputProps {
|
|
40
47
|
inputProps: {
|
|
41
48
|
type: string;
|
|
42
49
|
name: string;
|
|
43
|
-
|
|
44
|
-
value: number;
|
|
50
|
+
onInput: (event: ChangeEvent<HTMLInputElement>, value?: string) => void;
|
|
51
|
+
value: number | string;
|
|
45
52
|
placeholder: string;
|
|
46
53
|
disabled: boolean;
|
|
47
54
|
min: number;
|
|
@@ -49,7 +56,7 @@ export interface INumberFieldViewProps extends INumberFieldProps, IFieldWrapperO
|
|
|
49
56
|
step: string | number;
|
|
50
57
|
required: boolean;
|
|
51
58
|
};
|
|
52
|
-
inputRef:
|
|
59
|
+
inputRef: MutableRefObject<HTMLInputElement | null>;
|
|
53
60
|
onStepUp: VoidFunction;
|
|
54
61
|
onStepDown: VoidFunction;
|
|
55
62
|
onKeyDown: VoidFunction;
|
|
@@ -14,12 +14,19 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
14
14
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
15
15
|
};
|
|
16
16
|
exports.__esModule = true;
|
|
17
|
-
|
|
18
|
-
var
|
|
17
|
+
/* eslint-disable max-len */
|
|
18
|
+
var core_1 = require("@maskito/core");
|
|
19
|
+
var kit_1 = require("@maskito/kit");
|
|
20
|
+
var react_1 = require("@maskito/react");
|
|
21
|
+
var isNil_1 = __importDefault(require("lodash-es/isNil"));
|
|
22
|
+
var react_2 = require("react");
|
|
19
23
|
var enums_1 = require("../../../enums");
|
|
20
24
|
var hooks_1 = require("../../../hooks");
|
|
21
25
|
var fieldWrapper_1 = __importDefault(require("../Field/fieldWrapper"));
|
|
22
26
|
var DEFAULT_STEP = 1;
|
|
27
|
+
var DECIMAL_SEPARATOR = '.';
|
|
28
|
+
var MINUS_SIGN = '-';
|
|
29
|
+
var isNotEmptyValue = function (rawValue) { return !(0, isNil_1["default"])(rawValue) && rawValue !== ''; };
|
|
23
30
|
function NumberField(props) {
|
|
24
31
|
var _a;
|
|
25
32
|
var components = (0, hooks_1.useComponents)();
|
|
@@ -30,27 +37,59 @@ function NumberField(props) {
|
|
|
30
37
|
enabled: props.debounce
|
|
31
38
|
} : ((_a = props.debounce) !== null && _a !== void 0 ? _a : {})))
|
|
32
39
|
}), currentInputRef = _b.inputRef, onChange = _b.onChange, value = _b.value;
|
|
33
|
-
var step = (0,
|
|
34
|
-
var
|
|
35
|
-
|
|
36
|
-
min: props.
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
40
|
+
var step = (0, react_2.useMemo)(function () { var _a; return (_a = props.step) !== null && _a !== void 0 ? _a : DEFAULT_STEP; }, [props.step]);
|
|
41
|
+
var numberMaskOptions = (0, react_2.useMemo)(function () {
|
|
42
|
+
var _a, _b, _c, _d;
|
|
43
|
+
var min = (_a = props.min) !== null && _a !== void 0 ? _a : (props.isCanBeNegative ? -Infinity : 0);
|
|
44
|
+
var max = (_b = props.max) !== null && _b !== void 0 ? _b : Infinity;
|
|
45
|
+
return (0, kit_1.maskitoNumberOptionsGenerator)({
|
|
46
|
+
min: min,
|
|
47
|
+
max: max,
|
|
48
|
+
precision: (_c = props.decimal) !== null && _c !== void 0 ? _c : 0,
|
|
49
|
+
decimalSeparator: DECIMAL_SEPARATOR,
|
|
50
|
+
minusSign: MINUS_SIGN,
|
|
51
|
+
thousandSeparator: (_d = props.thousandSeparator) !== null && _d !== void 0 ? _d : ''
|
|
52
|
+
});
|
|
53
|
+
}, [props.min, props.max, props.isCanBeNegative, props.decimal, props.thousandSeparator]);
|
|
54
|
+
var maskedInputRef = (0, react_1.useMaskito)({
|
|
55
|
+
options: numberMaskOptions
|
|
56
|
+
});
|
|
57
|
+
(0, react_2.useEffect)(function () {
|
|
58
|
+
if (currentInputRef.current) {
|
|
59
|
+
maskedInputRef(currentInputRef.current);
|
|
60
|
+
}
|
|
61
|
+
}, [currentInputRef, maskedInputRef]);
|
|
62
|
+
(0, react_2.useEffect)(function () {
|
|
63
|
+
var input = currentInputRef.current;
|
|
64
|
+
var currentValue = props.input.value;
|
|
65
|
+
var hasValue = isNotEmptyValue(currentValue);
|
|
66
|
+
var numberValue = Number(currentValue);
|
|
67
|
+
var isValid = !props.required
|
|
68
|
+
|| (hasValue && numberValue >= props.min && numberValue <= props.max);
|
|
69
|
+
input.setCustomValidity(isValid ? '' : __('The number is not valid.'));
|
|
70
|
+
}, [currentInputRef, props.required, props.min, props.max, props.input.value, props]);
|
|
71
|
+
var clampToMinMax = (0, react_2.useCallback)(function (rawValue) {
|
|
72
|
+
var val = rawValue;
|
|
73
|
+
if (val < props.min) {
|
|
74
|
+
val = props.min;
|
|
47
75
|
}
|
|
48
|
-
|
|
49
|
-
|
|
76
|
+
if (val > props.max) {
|
|
77
|
+
val = props.max;
|
|
50
78
|
}
|
|
51
|
-
|
|
52
|
-
}, [
|
|
53
|
-
var
|
|
79
|
+
return val;
|
|
80
|
+
}, [props.min, props.max]);
|
|
81
|
+
var onStep = (0, react_2.useCallback)(function (isIncrement) {
|
|
82
|
+
var _a;
|
|
83
|
+
var currentValue = Number((_a = currentInputRef === null || currentInputRef === void 0 ? void 0 : currentInputRef.current) === null || _a === void 0 ? void 0 : _a.value) || 0;
|
|
84
|
+
var fixToDecimal = function (raw) { return props.decimal
|
|
85
|
+
? raw.toFixed(props.decimal)
|
|
86
|
+
: String(raw); };
|
|
87
|
+
var newValue = isIncrement
|
|
88
|
+
? currentValue + step
|
|
89
|
+
: currentValue - step;
|
|
90
|
+
onChange(null, fixToDecimal(clampToMinMax(newValue)));
|
|
91
|
+
}, [currentInputRef, onChange, props.decimal, step, clampToMinMax]);
|
|
92
|
+
var onKeyDown = (0, react_2.useCallback)(function (event) {
|
|
54
93
|
if (event.key === 'ArrowUp') {
|
|
55
94
|
onStep(true);
|
|
56
95
|
}
|
|
@@ -58,12 +97,27 @@ function NumberField(props) {
|
|
|
58
97
|
onStep(false);
|
|
59
98
|
}
|
|
60
99
|
}, [onStep]);
|
|
61
|
-
var
|
|
62
|
-
|
|
100
|
+
var onBlur = (0, react_2.useCallback)(function (event) {
|
|
101
|
+
var rawValue = event.target.value;
|
|
102
|
+
if (rawValue === '') {
|
|
103
|
+
return;
|
|
104
|
+
}
|
|
105
|
+
var numberValue = Number(rawValue);
|
|
106
|
+
var shouldApplyMin = !(0, isNil_1["default"])(props.min) && !Number.isNaN(numberValue) && numberValue < props.min;
|
|
107
|
+
if (shouldApplyMin) {
|
|
108
|
+
onChange(event, String(props.min));
|
|
109
|
+
}
|
|
110
|
+
}, [onChange, props]);
|
|
111
|
+
var displayValue = (0, react_2.useMemo)(function () { return isNotEmptyValue(value)
|
|
112
|
+
? (0, core_1.maskitoTransform)(String(value), numberMaskOptions)
|
|
113
|
+
: value; }, [value, numberMaskOptions]);
|
|
114
|
+
var inputProps = (0, react_2.useMemo)(function () { return (__assign({ type: 'text', name: props.input.name, value: displayValue, onInput: onChange, placeholder: props.placeholder, min: props.min, max: props.max, step: props.step, disabled: props.disabled, required: props.required, autoComplete: 'off', onKeyDown: onKeyDown }, props.inputProps)); }, [props.inputProps, props.input.name, props.min, props.max, props.step, props.placeholder, props.disabled, props.required, displayValue, onChange, onKeyDown]);
|
|
115
|
+
var viewProps = (0, react_2.useMemo)(function () { return ({
|
|
63
116
|
viewProps: props.viewProps,
|
|
64
117
|
inputProps: inputProps,
|
|
65
118
|
onStepUp: function () { return onStep(true); },
|
|
66
119
|
onStepDown: function () { return onStep(false); },
|
|
120
|
+
onBlur: onBlur,
|
|
67
121
|
input: props.input,
|
|
68
122
|
inputRef: currentInputRef,
|
|
69
123
|
size: props.size,
|
|
@@ -71,7 +125,7 @@ function NumberField(props) {
|
|
|
71
125
|
className: props.className,
|
|
72
126
|
disabled: props.disabled,
|
|
73
127
|
id: props.id
|
|
74
|
-
}); }, [currentInputRef, inputProps, onStep, props.className, props.disabled, props.errors, props.id, props.input, props.size, props.viewProps]);
|
|
128
|
+
}); }, [currentInputRef, inputProps, onBlur, onStep, props.className, props.disabled, props.errors, props.id, props.input, props.size, props.viewProps]);
|
|
75
129
|
return components.ui.renderView(props.view || 'form.NumberFieldView', viewProps);
|
|
76
130
|
}
|
|
77
131
|
NumberField.defaultProps = {
|
|
@@ -20,7 +20,7 @@ var getLabel = function (items, id) {
|
|
|
20
20
|
return foundItem ? foundItem.label : null;
|
|
21
21
|
}
|
|
22
22
|
// Enum
|
|
23
|
-
if ((0, isObject_1["default"])(items) && (0, isFunction_1["default"])(items.getLabel)) {
|
|
23
|
+
if ((0, isObject_1["default"])(items) && 'getLabel' in items && (0, isFunction_1["default"])(items.getLabel)) {
|
|
24
24
|
return items.getLabel(id);
|
|
25
25
|
}
|
|
26
26
|
return null;
|
|
@@ -42,11 +42,11 @@ function ModalPortal(props) {
|
|
|
42
42
|
closeInternal(item);
|
|
43
43
|
}
|
|
44
44
|
}, [closeInternal, dispatch, props.animationDelayMc, props.group]);
|
|
45
|
-
return (0, orderBy_1["default"])(opened, 'id').map(function (item, index) {
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
45
|
+
return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, orderBy_1["default"])(opened, 'id').map(function (item, index) {
|
|
46
|
+
var ModalComponent = item.modal;
|
|
47
|
+
var modalProps = __assign(__assign({}, item.props), { index: index, group: group, isClosing: item.isClosing, onClose: function () { return onClose(item); }, closeTimeoutMs: item.props.closeTimeoutMs || props.animationDelayMc });
|
|
48
|
+
return ((0, jsx_runtime_1.jsx)(ModalComponent, __assign({}, modalProps), item.id));
|
|
49
|
+
}) }));
|
|
50
50
|
}
|
|
51
51
|
ModalPortal.defaultProps = {
|
|
52
52
|
group: modal_2.MODAL_DEFAULT_GROUP,
|
package/ui/nav/Router/Router.js
CHANGED
|
@@ -94,8 +94,8 @@ function Router(props) {
|
|
|
94
94
|
// Routes state
|
|
95
95
|
var _c = (0, react_1.useState)((0, helpers_1.treeToList)(props.routes, true, null, props.alwaysAppendParentRoutePath)), routes = _c[0], setRoutes = _c[1];
|
|
96
96
|
(0, react_use_1.useUpdateEffect)(function () {
|
|
97
|
-
setRoutes(props.routes);
|
|
98
|
-
}, [props.routes]);
|
|
97
|
+
setRoutes((0, helpers_1.treeToList)(props.routes, true, null, props.alwaysAppendParentRoutePath));
|
|
98
|
+
}, [props.alwaysAppendParentRoutePath, props.routes]);
|
|
99
99
|
// Fix end slash on switch to base route
|
|
100
100
|
(0, react_use_1.useUpdateEffect)(function () {
|
|
101
101
|
if (window.history && pathname === '/' && window.location.pathname.match(/\/$/)) {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import { IRouteItem } from './Router';
|
|
2
2
|
export declare const findRedirectPathRecursive: (route: IRouteItem, parentPath?: string) => any;
|
|
3
3
|
export declare const walkRoutesRecursive: (item: IRouteItem | Record<string, any>, defaultItem?: any, parentItem?: any, alwaysAppendParentRoutePath?: boolean) => any;
|
|
4
|
-
export declare const treeToList: (item: IRouteItem | Record<string, any>, isRoot?: boolean, parentItem?: any, alwaysAppendParentRoutePath?: boolean) =>
|
|
4
|
+
export declare const treeToList: (item: IRouteItem | Record<string, any>, isRoot?: boolean, parentItem?: any, alwaysAppendParentRoutePath?: boolean) => any[];
|
package/utils/data.d.ts
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
* @param {array|object} items
|
|
4
4
|
* @returns {*}
|
|
5
5
|
*/
|
|
6
|
-
export declare const normalizeItems: (items: any) => any;
|
|
6
|
+
export declare const normalizeItems: (items: any) => any[];
|
|
7
7
|
export declare const checkCondition: (item: any, condition: any) => any;
|
|
8
8
|
export declare const filterItems: (items: Array<any>, condition: any) => any[];
|
|
9
9
|
export declare const shouldUpdateSingle: (a: any, b: any) => boolean;
|
package/utils/data.js
CHANGED
|
@@ -51,7 +51,7 @@ var normalizeItems = function (items) {
|
|
|
51
51
|
return items;
|
|
52
52
|
}
|
|
53
53
|
// Enum
|
|
54
|
-
if ((0, isObject_1["default"])(items) && (0, isFunction_1["default"])(items.getLabels)) {
|
|
54
|
+
if ((0, isObject_1["default"])(items) && 'getLabels' in items && (0, isFunction_1["default"])(items.getLabels)) {
|
|
55
55
|
var labels_1 = items.getLabels();
|
|
56
56
|
return Object.keys(labels_1).map(function (id) { return ({
|
|
57
57
|
id: id,
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import { ChangeEvent, MutableRefObject } from 'react';
|
|
2
|
-
interface IInputTypeNumberProps {
|
|
3
|
-
max: any;
|
|
4
|
-
min: any;
|
|
5
|
-
value: string | undefined | null;
|
|
6
|
-
required?: boolean;
|
|
7
|
-
}
|
|
8
|
-
declare const useInputTypeNumber: (currentInputRef: MutableRefObject<HTMLInputElement>, inputTypeNumberProps: IInputTypeNumberProps, onChange: (event: ChangeEvent<HTMLInputElement>, value?: any) => void, decimal: number, isCanBeNegative?: boolean) => {
|
|
9
|
-
onInputChange: (event: ChangeEvent<HTMLInputElement>, newValue?: string) => void;
|
|
10
|
-
};
|
|
11
|
-
export default useInputTypeNumber;
|
|
@@ -1,66 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
exports.__esModule = true;
|
|
3
|
-
var react_1 = require("react");
|
|
4
|
-
var useInputTypeNumber = function (currentInputRef, inputTypeNumberProps, onChange, decimal, isCanBeNegative) {
|
|
5
|
-
(0, react_1.useEffect)(function () {
|
|
6
|
-
var _a;
|
|
7
|
-
var defaultValidity = __('The number is not valid.');
|
|
8
|
-
var errorMessage = inputTypeNumberProps.required
|
|
9
|
-
&& (inputTypeNumberProps.value > inputTypeNumberProps.max
|
|
10
|
-
|| inputTypeNumberProps.value < inputTypeNumberProps.min
|
|
11
|
-
|| !inputTypeNumberProps.value)
|
|
12
|
-
? defaultValidity
|
|
13
|
-
: '';
|
|
14
|
-
(_a = currentInputRef.current) === null || _a === void 0 ? void 0 : _a.setCustomValidity(errorMessage);
|
|
15
|
-
}, [currentInputRef, inputTypeNumberProps.value, inputTypeNumberProps.max, inputTypeNumberProps.min, inputTypeNumberProps.required]);
|
|
16
|
-
var isValueNumeric = function (value) {
|
|
17
|
-
if (!value) {
|
|
18
|
-
return true;
|
|
19
|
-
}
|
|
20
|
-
var numericFloatRegExp = isCanBeNegative
|
|
21
|
-
/**
|
|
22
|
-
* Подходят отрицательные и положительные числа с плавающей точкой
|
|
23
|
-
* @example -1.0
|
|
24
|
-
* @example 1.1
|
|
25
|
-
*/
|
|
26
|
-
? new RegExp("^-?\\d*\\.?\\d{0,".concat(decimal, "}$"))
|
|
27
|
-
/**
|
|
28
|
-
* Подходят положительные числа с плавающей точкой
|
|
29
|
-
* @example 1.1
|
|
30
|
-
*/
|
|
31
|
-
: new RegExp("^\\d*\\.?\\d{0,".concat(decimal, "}$"));
|
|
32
|
-
var numericRegExp = isCanBeNegative
|
|
33
|
-
/**
|
|
34
|
-
* Подходят отрицательные и положительные целые числа
|
|
35
|
-
* @example 1
|
|
36
|
-
* @example -2
|
|
37
|
-
*/
|
|
38
|
-
? /^-?\d*$/
|
|
39
|
-
/**
|
|
40
|
-
* Подходят положительные целые числа
|
|
41
|
-
* @example 1
|
|
42
|
-
*/
|
|
43
|
-
: /^\d+$/;
|
|
44
|
-
return decimal ? numericFloatRegExp.test(value) : numericRegExp.test(value);
|
|
45
|
-
};
|
|
46
|
-
var onInputChange = function (event, newValue) {
|
|
47
|
-
var _a;
|
|
48
|
-
var value = newValue || ((_a = event === null || event === void 0 ? void 0 : event.target) === null || _a === void 0 ? void 0 : _a.value);
|
|
49
|
-
if (isValueNumeric(value)) {
|
|
50
|
-
if (value !== '') {
|
|
51
|
-
var numericValue = Number(value);
|
|
52
|
-
if (numericValue > inputTypeNumberProps.max) {
|
|
53
|
-
value = inputTypeNumberProps.max;
|
|
54
|
-
}
|
|
55
|
-
else if (numericValue < inputTypeNumberProps.min) {
|
|
56
|
-
value = inputTypeNumberProps.min;
|
|
57
|
-
}
|
|
58
|
-
}
|
|
59
|
-
onChange(event, value);
|
|
60
|
-
}
|
|
61
|
-
};
|
|
62
|
-
return {
|
|
63
|
-
onInputChange: onInputChange
|
|
64
|
-
};
|
|
65
|
-
};
|
|
66
|
-
exports["default"] = useInputTypeNumber;
|