@steroidsjs/bootstrap 3.0.44 → 3.1.0
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/content/Accordion/AccordionItemView.js +32 -42
- package/content/Accordion/AccordionView.js +12 -24
- package/content/Alert/AlertView.js +18 -15
- package/content/Avatar/AvatarGroupView.js +12 -24
- package/content/Avatar/AvatarView.js +4 -11
- package/content/Badge/BadgeView.js +14 -7
- package/content/Calendar/CalendarView.js +11 -8
- package/content/Calendar/CaptionElement.d.ts +1 -1
- package/content/Calendar/CaptionElement.js +49 -74
- package/content/CalendarSystem/AsideCalendars/AsideCalendars.d.ts +2 -2
- package/content/CalendarSystem/AsideCalendars/AsideCalendars.js +5 -33
- package/content/CalendarSystem/AsideHeader/AsideHeader.d.ts +2 -2
- package/content/CalendarSystem/AsideHeader/AsideHeader.js +14 -27
- package/content/CalendarSystem/CalendarSystemEventGroupModalView.js +15 -11
- package/content/CalendarSystem/CalendarSystemModalView.js +30 -33
- package/content/CalendarSystem/CalendarSystemView.js +8 -15
- package/content/CalendarSystem/ContentHeader/ContentHeader.d.ts +2 -2
- package/content/CalendarSystem/ContentHeader/ContentHeader.js +21 -13
- package/content/CalendarSystem/DayGrid/DayGrid.d.ts +2 -2
- package/content/CalendarSystem/DayGrid/DayGrid.js +25 -21
- package/content/CalendarSystem/DayGrid/views/DayHour/DayHour.d.ts +3 -3
- package/content/CalendarSystem/DayGrid/views/DayHour/DayHour.js +21 -9
- package/content/CalendarSystem/DayGrid/views/DayHour/views/DayEvent/DayEvent.js +2 -5
- package/content/CalendarSystem/MonthGrid/MonthGrid.d.ts +2 -2
- package/content/CalendarSystem/MonthGrid/MonthGrid.js +19 -32
- package/content/CalendarSystem/MonthGrid/views/MonthDay/MonthDay.d.ts +2 -2
- package/content/CalendarSystem/MonthGrid/views/MonthDay/MonthDay.js +26 -19
- package/content/CalendarSystem/MonthGrid/views/MonthDay/views/MonthEvent/MonthEvent.js +15 -5
- package/content/CalendarSystem/WeekGrid/WeekGrid.d.ts +2 -2
- package/content/CalendarSystem/WeekGrid/WeekGrid.js +25 -19
- package/content/CalendarSystem/WeekGrid/views/WeekHour/WeekHour.d.ts +2 -2
- package/content/CalendarSystem/WeekGrid/views/WeekHour/WeekHour.js +22 -10
- package/content/CalendarSystem/WeekGrid/views/WeekHour/views/WeekEvent/WeekEvent.js +2 -5
- package/content/Card/CardView.js +7 -26
- package/content/Chart/ChartView.js +11 -15
- package/content/Chat/ChatView.js +18 -33
- package/content/Chat/views/BubbleMessage/BubbleMessageView.d.ts +2 -2
- package/content/Chat/views/BubbleMessage/BubbleMessageView.js +10 -41
- package/content/Chat/views/BubblesDateGroup/BubblesDateGroup.d.ts +3 -3
- package/content/Chat/views/BubblesDateGroup/BubblesDateGroup.js +15 -33
- package/content/Chat/views/ChatFileItem/ChatFileItemView.d.ts +1 -1
- package/content/Chat/views/ChatFileItem/ChatFileItemView.js +28 -27
- package/content/Chat/views/ChatInput/ChatInputView.js +7 -34
- package/content/CopyToClipboard/CopyToClipboardView.js +16 -7
- package/content/Dashboard/DashboardItemView.js +13 -9
- package/content/Detail/DetailView.js +27 -25
- package/content/DropDown/DropDownView.js +16 -29
- package/content/Icon/IconView.js +7 -27
- package/content/Kanban/KanbanView.js +5 -10
- package/content/Kanban/views/KanbanColumn/KanbanColumnView.js +3 -14
- package/content/Kanban/views/KanbanModal/KanbanModalView.js +18 -29
- package/content/Kanban/views/KanbanModal/views/CreateOrEditTaskModalContent/CreateOrEditTaskModalContentView.js +9 -61
- package/content/Kanban/views/KanbanModal/views/CreateOrEditTaskModalContent/views/Label/Label.js +2 -5
- package/content/Kanban/views/KanbanModal/views/CreateOrEditTaskModalContent/views/TagsSelector/TagsSelector.js +14 -27
- package/content/Kanban/views/KanbanModal/views/TaskDetailsModalContent/TaskDetailsModalContentView.js +15 -38
- package/content/Kanban/views/KanbanTask/KanbanTaskView.d.ts +2 -2
- package/content/Kanban/views/KanbanTask/KanbanTaskView.js +6 -40
- package/content/Kanban/views/TaskTags/TaskTags.js +13 -5
- package/content/Menu/MenuItemView.js +16 -5
- package/content/Menu/MenuView.js +10 -8
- package/content/Slider/SliderView.js +14 -5
- package/crud/Crud/CrudView.js +13 -28
- package/form/AutoCompleteField/AutoCompleteFieldView.js +22 -57
- package/form/Button/ButtonView.js +18 -38
- package/form/CheckboxField/CheckboxFieldView.js +12 -33
- package/form/CheckboxListField/CheckboxListFieldView.js +28 -40
- package/form/CheckboxTreeField/CheckboxTreeFieldView.js +33 -22
- package/form/DateField/DateFieldView.js +12 -41
- package/form/DateRangeField/DateRangeFieldView.js +12 -47
- package/form/DateRangeField/views/RangeButtons/RangeButtons.js +5 -25
- package/form/DateTimeField/DateTimeFieldView.js +13 -45
- package/form/DateTimeRangeField/DateTimeRangeFieldView.js +17 -54
- package/form/DropDownField/DropDownFieldView.js +21 -57
- package/form/DropDownFieldItem/DropDownFieldItemView.js +18 -16
- package/form/FieldLayout/FieldLayoutView.js +20 -37
- package/form/FieldList/FieldListItemView.d.ts +2 -2
- package/form/FieldList/FieldListItemView.js +8 -34
- package/form/FieldList/FieldListView.js +19 -39
- package/form/FieldSet/FieldSetView.js +12 -26
- package/form/FileField/FileFieldItemView.js +32 -51
- package/form/FileField/FileFieldView.js +6 -29
- package/form/Form/FormView.d.ts +2 -2
- package/form/Form/FormView.js +8 -33
- package/form/HtmlField/HtmlFieldView.js +12 -5
- package/form/ImageField/ImageFieldModalView.js +4 -29
- package/form/ImageField/ImageFieldView.js +10 -40
- package/form/InputField/InputFieldView.js +12 -43
- package/form/NumberField/NumberFieldView.js +8 -38
- package/form/PasswordField/PasswordFieldView.js +11 -39
- package/form/RadioField/RadioFieldView.js +5 -32
- package/form/RadioListField/RadioListFieldView.js +27 -39
- package/form/RateField/RateFieldView.js +18 -36
- package/form/ReCaptchaField/ReCaptchaFieldView.js +2 -26
- package/form/SliderField/SliderFieldView.js +5 -6
- package/form/SwitcherField/SwitcherFieldView.js +8 -11
- package/form/SwitcherListField/SwitcherListFieldView.js +28 -40
- package/form/TextField/TextFieldView.js +4 -28
- package/form/TimeField/TimeFieldView.js +9 -39
- package/form/TimeField/TimePanelView.js +21 -36
- package/form/TimeField/utils.js +2 -2
- package/form/TimeField/views/TimePanelColumn/TimePanelColumn.js +14 -8
- package/form/TimeRangeField/TimeRangeFieldView.js +8 -40
- package/form/WizardForm/WizardFormView.js +3 -7
- package/hooks/useHideScroll.js +5 -4
- package/layout/Header/HeaderView.js +18 -54
- package/layout/Loader/LoaderView.js +13 -26
- package/layout/Notifications/NotificationsItemView.js +15 -29
- package/layout/Notifications/NotificationsView.js +13 -25
- package/layout/ProgressBar/CircleProgressBarView.js +28 -37
- package/layout/ProgressBar/LineProgressBarView.js +15 -28
- package/layout/Sidebar/FooterIcons/FooterIcons.d.ts +2 -2
- package/layout/Sidebar/FooterIcons/FooterIcons.js +6 -28
- package/layout/Sidebar/SidebarLogo/SidebarLogo.d.ts +3 -3
- package/layout/Sidebar/SidebarLogo/SidebarLogo.js +15 -30
- package/layout/Sidebar/SidebarUser/SidebarUser.d.ts +2 -2
- package/layout/Sidebar/SidebarUser/SidebarUser.js +4 -30
- package/layout/Sidebar/SidebarView.js +16 -12
- package/layout/Skeleton/SkeletonView.js +13 -25
- package/layout/Tooltip/TooltipView.js +16 -29
- package/list/CheckboxColumn/CheckboxColumnView.js +3 -27
- package/list/ControlsColumnView/ControlsColumnView.js +4 -28
- package/list/Empty/EmptyView.js +12 -24
- package/list/FlexGrid/FlexGridView.js +13 -38
- package/list/Grid/GridView.js +17 -56
- package/list/Grid/views/ContentColumnView/ContentColumnView.js +8 -14
- package/list/Grid/views/DiagramColumnView/DiagramColumnView.js +25 -19
- package/list/Grid/views/TreeColumnView/TreeColumnView.js +4 -4
- package/list/List/ListItemView.js +12 -24
- package/list/List/ListView.js +15 -35
- package/list/Pagination/PaginationButtonView.js +33 -47
- package/list/Pagination/PaginationMoreView.js +3 -27
- package/list/PaginationSize/PaginationSizeView.js +12 -25
- package/list/Steps/StepItemView.js +21 -40
- package/list/Steps/StepsView.js +12 -4
- package/modal/Modal/ModalView.js +5 -31
- package/modal/TwoFactorModal/TwoFactorModalView.js +4 -9
- package/nav/Breadcrubms/BreadcrumbsView.js +24 -37
- package/nav/ButtonGroup/ButtonGroupView.js +9 -13
- package/nav/Controls/ControlsView.js +4 -29
- package/nav/Nav/NavBarView.js +7 -33
- package/nav/Nav/NavButtonView.js +7 -33
- package/nav/Nav/NavIconView.js +18 -46
- package/nav/Nav/NavLinkView.js +7 -33
- package/nav/Nav/NavListView.js +5 -32
- package/nav/Nav/NavTabsView.js +7 -33
- package/nav/Tree/TreeView.js +3 -27
- package/nav/TreeItem/TreeItemView.js +5 -30
- package/package.json +5 -5
- package/typography/Text/TextView.d.ts +2 -2
- package/typography/Text/TextView.js +4 -28
- package/typography/Title/TitleView.d.ts +2 -2
- package/typography/Title/TitleView.js +4 -28
- package/utils/renderIcon.d.ts +2 -2
- package/utils/renderIcon.js +2 -2
|
@@ -10,39 +10,17 @@ var __assign = (this && this.__assign) || function () {
|
|
|
10
10
|
};
|
|
11
11
|
return __assign.apply(this, arguments);
|
|
12
12
|
};
|
|
13
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
14
|
-
if (k2 === undefined) k2 = k;
|
|
15
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
16
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
17
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
18
|
-
}
|
|
19
|
-
Object.defineProperty(o, k2, desc);
|
|
20
|
-
}) : (function(o, m, k, k2) {
|
|
21
|
-
if (k2 === undefined) k2 = k;
|
|
22
|
-
o[k2] = m[k];
|
|
23
|
-
}));
|
|
24
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
25
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
26
|
-
}) : function(o, v) {
|
|
27
|
-
o["default"] = v;
|
|
28
|
-
});
|
|
29
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
30
|
-
if (mod && mod.__esModule) return mod;
|
|
31
|
-
var result = {};
|
|
32
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
33
|
-
__setModuleDefault(result, mod);
|
|
34
|
-
return result;
|
|
35
|
-
};
|
|
36
13
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
37
14
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
38
15
|
};
|
|
39
16
|
exports.__esModule = true;
|
|
40
|
-
var
|
|
41
|
-
var React = __importStar(require("react"));
|
|
17
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
42
18
|
var hooks_1 = require("@steroidsjs/core/hooks");
|
|
43
|
-
var isEmpty_1 = __importDefault(require("lodash-es/isEmpty"));
|
|
44
|
-
var Text_1 = __importDefault(require("@steroidsjs/core/ui/typography/Text/Text"));
|
|
45
19
|
var content_1 = require("@steroidsjs/core/ui/content");
|
|
20
|
+
var Text_1 = __importDefault(require("@steroidsjs/core/ui/typography/Text/Text"));
|
|
21
|
+
var isArray_1 = __importDefault(require("lodash-es/isArray"));
|
|
22
|
+
var isEmpty_1 = __importDefault(require("lodash-es/isEmpty"));
|
|
23
|
+
var react_1 = require("react");
|
|
46
24
|
var normalizeItems = function (items) {
|
|
47
25
|
var categories = {};
|
|
48
26
|
var itemsWithoutCategory = [];
|
|
@@ -68,50 +46,37 @@ var renderItem = function (item, props, bem) {
|
|
|
68
46
|
var hasAdditionalText = !!((_b = item.additional) === null || _b === void 0 ? void 0 : _b.text);
|
|
69
47
|
var hasSomeAdditional = hasAdditionalText || hasAdditionalIcon;
|
|
70
48
|
var uniqId = item[props.primaryKey];
|
|
71
|
-
return (
|
|
49
|
+
return ((0, jsx_runtime_1.jsxs)("button", __assign({ type: "button", className: bem.element('item', {
|
|
72
50
|
hover: props.hoveredId === uniqId,
|
|
73
51
|
select: props.selectedIds.includes(uniqId)
|
|
74
|
-
}), onClick: function () { return props.onItemSelect(uniqId); }, onFocus: function () { return props.onItemHover(uniqId); }, onMouseOver: function () { return props.onItemHover(uniqId); } },
|
|
75
|
-
React.createElement("span", { className: bem.element('item-label') }, item.label),
|
|
76
|
-
hasSomeAdditional && (React.createElement("div", { className: bem.element('item-additional') },
|
|
77
|
-
hasAdditionalIcon && (React.createElement(content_1.Icon, { name: (_c = item.additional) === null || _c === void 0 ? void 0 : _c.icon, className: bem.element('item-additional-icon') })),
|
|
78
|
-
hasAdditionalText && (React.createElement("span", { className: bem.element('item-additional-text') }, item.additional.text))))));
|
|
52
|
+
}), onClick: function () { return props.onItemSelect(uniqId); }, onFocus: function () { return props.onItemHover(uniqId); }, onMouseOver: function () { return props.onItemHover(uniqId); } }, { children: [(0, jsx_runtime_1.jsx)("span", __assign({ className: bem.element('item-label') }, { children: item.label })), hasSomeAdditional && ((0, jsx_runtime_1.jsxs)("div", __assign({ className: bem.element('item-additional') }, { children: [hasAdditionalIcon && ((0, jsx_runtime_1.jsx)(content_1.Icon, { name: (_c = item.additional) === null || _c === void 0 ? void 0 : _c.icon, className: bem.element('item-additional-icon') })), hasAdditionalText && ((0, jsx_runtime_1.jsx)("span", __assign({ className: bem.element('item-additional-text') }, { children: item.additional.text })))] })))] }), String(uniqId)));
|
|
79
53
|
};
|
|
80
54
|
function AutoCompleteFieldView(props) {
|
|
81
55
|
var _a, _b, _c;
|
|
82
56
|
var bem = (0, hooks_1.useBem)('AutoCompleteFieldView');
|
|
83
|
-
var renderItems =
|
|
57
|
+
var renderItems = (0, react_1.useCallback)(function () {
|
|
84
58
|
if (!(0, isEmpty_1["default"])(props.categories)) {
|
|
85
59
|
var _a = normalizeItems(props.items), categories = _a.categories, itemsWithoutCategory = _a.itemsWithoutCategory;
|
|
86
|
-
return (
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
React.createElement("span", { className: bem.element('category__label') }, category),
|
|
91
|
-
React.createElement("div", { className: bem.element('category__content') }, categoryItems.map(function (item) { return renderItem(item, props, bem); }))));
|
|
92
|
-
}),
|
|
93
|
-
itemsWithoutCategory.map(function (item) { return renderItem(item, props, bem); })));
|
|
60
|
+
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [Object.entries(categories).map(function (_a) {
|
|
61
|
+
var category = _a[0], categoryItems = _a[1];
|
|
62
|
+
return ((0, jsx_runtime_1.jsxs)("div", __assign({ className: bem.element('category') }, { children: [(0, jsx_runtime_1.jsx)("span", __assign({ className: bem.element('category__label') }, { children: category })), (0, jsx_runtime_1.jsx)("div", __assign({ className: bem.element('category__content') }, { children: categoryItems.map(function (item) { return renderItem(item, props, bem); }) }))] }), category));
|
|
63
|
+
}), itemsWithoutCategory.map(function (item) { return renderItem(item, props, bem); })] }));
|
|
94
64
|
}
|
|
95
|
-
return (
|
|
65
|
+
return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: props.items.map(function (item) { return renderItem(item, props, bem); }) }));
|
|
96
66
|
}, [bem, props]);
|
|
97
|
-
return (
|
|
67
|
+
return ((0, jsx_runtime_1.jsxs)("div", __assign({ ref: props.forwardedRef, className: bem(bem.block({
|
|
98
68
|
size: props.size,
|
|
99
69
|
opened: props.isOpened,
|
|
100
70
|
hasClearIcon: props.showClear && !props.disabled,
|
|
101
71
|
filled: !!props.inputProps.value,
|
|
102
72
|
disabled: props.disabled
|
|
103
|
-
}), props.className), style: props.style },
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
!props.disabled && props.showClear && !!props.inputProps.value && (React.createElement(content_1.Icon, { name: 'cross_8x8', className: bem.element('icon-clear'), tabIndex: -1, onClick: props.onClear }))),
|
|
112
|
-
props.isOpened && (React.createElement("div", { className: bem.element('drop-down') },
|
|
113
|
-
React.createElement("div", { className: bem.element('list') }, !(0, isEmpty_1["default"])(props.items)
|
|
114
|
-
? renderItems()
|
|
115
|
-
: (React.createElement(Text_1["default"], { className: bem.element('nothing'), content: (_c = props.empty) !== null && _c !== void 0 ? _c : __('Ничего не найдено'), type: 'text' })))))));
|
|
73
|
+
}), props.className), style: props.style }, { children: [(0, jsx_runtime_1.jsxs)("div", __assign({ className: bem.element('input-wrapper') }, { children: [(0, jsx_runtime_1.jsx)("input", __assign({}, props.inputProps, { value: (0, isArray_1["default"])((_a = props.inputProps) === null || _a === void 0 ? void 0 : _a.value)
|
|
74
|
+
? (_b = props.inputProps.value) === null || _b === void 0 ? void 0 : _b.join(props.multipleSeparator)
|
|
75
|
+
: props.inputProps.value, className: bem(bem.element('input'), props.inputProps.className), onClick: function (e) {
|
|
76
|
+
e.preventDefault();
|
|
77
|
+
props.onOpen();
|
|
78
|
+
}, onChange: function (e) { return props.inputProps.onChange(e.target.value); }, placeholder: props.placeholder, disabled: props.disabled, required: props.required })), !props.disabled && props.showClear && !!props.inputProps.value && ((0, jsx_runtime_1.jsx)(content_1.Icon, { name: 'cross_8x8', className: bem.element('icon-clear'), tabIndex: -1, onClick: props.onClear }))] })), props.isOpened && ((0, jsx_runtime_1.jsx)("div", __assign({ className: bem.element('drop-down') }, { children: (0, jsx_runtime_1.jsx)("div", __assign({ className: bem.element('list') }, { children: !(0, isEmpty_1["default"])(props.items)
|
|
79
|
+
? renderItems()
|
|
80
|
+
: ((0, jsx_runtime_1.jsx)(Text_1["default"], { className: bem.element('nothing'), content: (_c = props.empty) !== null && _c !== void 0 ? _c : __('Ничего не найдено'), type: 'text' })) })) })))] })));
|
|
116
81
|
}
|
|
117
82
|
exports["default"] = AutoCompleteFieldView;
|
|
@@ -1,35 +1,23 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
}));
|
|
13
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
-
}) : function(o, v) {
|
|
16
|
-
o["default"] = v;
|
|
17
|
-
});
|
|
18
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
-
if (mod && mod.__esModule) return mod;
|
|
20
|
-
var result = {};
|
|
21
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
-
__setModuleDefault(result, mod);
|
|
23
|
-
return result;
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
24
12
|
};
|
|
25
13
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
26
14
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
27
15
|
};
|
|
28
16
|
exports.__esModule = true;
|
|
29
|
-
var
|
|
30
|
-
var isString_1 = __importDefault(require("lodash-es/isString"));
|
|
31
|
-
var Icon_1 = __importDefault(require("@steroidsjs/core/ui/content/Icon"));
|
|
17
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
32
18
|
var hooks_1 = require("@steroidsjs/core/hooks");
|
|
19
|
+
var Icon_1 = __importDefault(require("@steroidsjs/core/ui/content/Icon"));
|
|
20
|
+
var isString_1 = __importDefault(require("lodash-es/isString"));
|
|
33
21
|
function ButtonView(props) {
|
|
34
22
|
var _a;
|
|
35
23
|
var bem = (0, hooks_1.useBem)('ButtonView');
|
|
@@ -37,20 +25,16 @@ function ButtonView(props) {
|
|
|
37
25
|
var title = props.label && (0, isString_1["default"])(props.label)
|
|
38
26
|
? props.label
|
|
39
27
|
: (props.hint || null);
|
|
40
|
-
return (
|
|
41
|
-
props.isLoading && (React.createElement(Icon_1["default"], { className: bem.element('loader'), name: 'loading_icon_thick', tabIndex: -1 })),
|
|
42
|
-
!props.isLoading && (React.createElement("span", { title: props.hint, className: bem.element(props.link ? 'link' : 'label') },
|
|
43
|
-
props.icon && (React.createElement(Icon_1["default"], { name: props.icon, title: title, className: bem.element('icon', !props.label && 'without-label') })),
|
|
44
|
-
React.createElement("span", { className: bem.element('text') }, props.children)))));
|
|
28
|
+
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [props.isLoading && ((0, jsx_runtime_1.jsx)(Icon_1["default"], { className: bem.element('loader'), name: 'loading_icon_thick', tabIndex: -1 })), !props.isLoading && ((0, jsx_runtime_1.jsxs)("span", __assign({ title: props.hint, className: bem.element(props.link ? 'link' : 'label') }, { children: [props.icon && ((0, jsx_runtime_1.jsx)(Icon_1["default"], { name: props.icon, title: title, className: bem.element('icon', !props.label && 'without-label') })), (0, jsx_runtime_1.jsx)("span", __assign({ className: bem.element('text') }, { children: props.children }))] })))] }));
|
|
45
29
|
};
|
|
46
30
|
var renderBadge = function () {
|
|
47
31
|
var _a;
|
|
48
32
|
if (!props.badge || !props.badge.enable) {
|
|
49
33
|
return null;
|
|
50
34
|
}
|
|
51
|
-
return (
|
|
35
|
+
return ((0, jsx_runtime_1.jsx)("span", __assign({ className: bem(bem.element('badge', (_a = {},
|
|
52
36
|
_a["".concat(props.badge.color)] = !!props.badge.color,
|
|
53
|
-
_a)), props.badge.className) }, props.badge.value));
|
|
37
|
+
_a)), props.badge.className) }, { children: props.badge.value })));
|
|
54
38
|
};
|
|
55
39
|
var className = bem(bem.block((_a = {
|
|
56
40
|
button: !props.link
|
|
@@ -68,12 +52,8 @@ function ButtonView(props) {
|
|
|
68
52
|
_a["tag-".concat(props.tag)] = !!props.tag,
|
|
69
53
|
_a)), props.className);
|
|
70
54
|
if (props.tag === 'a') {
|
|
71
|
-
return (
|
|
72
|
-
renderLabel(),
|
|
73
|
-
renderBadge()));
|
|
55
|
+
return ((0, jsx_runtime_1.jsxs)("a", __assign({ className: className, href: props.url, onClick: props.onClick, style: props.style, target: props.target }, { children: [renderLabel(), renderBadge()] })));
|
|
74
56
|
}
|
|
75
|
-
return (
|
|
76
|
-
renderLabel(),
|
|
77
|
-
renderBadge()));
|
|
57
|
+
return ((0, jsx_runtime_1.jsxs)("button", __assign({ title: props.hint, type: props.type, disabled: props.disabled || props.isLoading, onClick: props.onClick, style: props.style, className: className }, { children: [renderLabel(), renderBadge()] })));
|
|
78
58
|
}
|
|
79
59
|
exports["default"] = ButtonView;
|
|
@@ -10,49 +10,28 @@ var __assign = (this && this.__assign) || function () {
|
|
|
10
10
|
};
|
|
11
11
|
return __assign.apply(this, arguments);
|
|
12
12
|
};
|
|
13
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
14
|
-
if (k2 === undefined) k2 = k;
|
|
15
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
16
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
17
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
18
|
-
}
|
|
19
|
-
Object.defineProperty(o, k2, desc);
|
|
20
|
-
}) : (function(o, m, k, k2) {
|
|
21
|
-
if (k2 === undefined) k2 = k;
|
|
22
|
-
o[k2] = m[k];
|
|
23
|
-
}));
|
|
24
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
25
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
26
|
-
}) : function(o, v) {
|
|
27
|
-
o["default"] = v;
|
|
28
|
-
});
|
|
29
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
30
|
-
if (mod && mod.__esModule) return mod;
|
|
31
|
-
var result = {};
|
|
32
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
33
|
-
__setModuleDefault(result, mod);
|
|
34
|
-
return result;
|
|
35
|
-
};
|
|
36
13
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
37
14
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
38
15
|
};
|
|
39
16
|
exports.__esModule = true;
|
|
40
|
-
var
|
|
17
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
41
18
|
var hooks_1 = require("@steroidsjs/core/hooks");
|
|
42
19
|
var useUniqueId_1 = __importDefault(require("@steroidsjs/core/hooks/useUniqueId"));
|
|
43
20
|
function CheckboxFieldView(props) {
|
|
44
21
|
var bem = (0, hooks_1.useBem)('CheckboxFieldView');
|
|
45
22
|
var id = (0, useUniqueId_1["default"])('checkbox');
|
|
46
|
-
var customVariableColorStyle = {
|
|
47
|
-
|
|
23
|
+
var customVariableColorStyle = {
|
|
24
|
+
'--checkbox-custom-color': props.color
|
|
25
|
+
};
|
|
26
|
+
return ((0, jsx_runtime_1.jsxs)("div", __assign({ className: bem(bem.block({
|
|
48
27
|
size: props.size,
|
|
49
28
|
hasErrors: !!props.errors
|
|
50
|
-
}), props.className), style: __assign(__assign({}, props.style), customVariableColorStyle), onClick: props.onChange },
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
29
|
+
}), props.className), style: __assign(__assign({}, props.style), customVariableColorStyle), onClick: props.onChange }, { children: [(0, jsx_runtime_1.jsx)("input", __assign({ className: bem.element('input', {
|
|
30
|
+
hasCustomColor: !!props.color
|
|
31
|
+
}), id: props.id || id, disabled: props.disabled, required: props.required }, props.inputProps)), (0, jsx_runtime_1.jsx)("label", __assign({ className: bem.element('label', {
|
|
32
|
+
'has-label-only': props.hasOnlyLeafCheckboxes && !props.id
|
|
33
|
+
}), htmlFor: props.id || id }, { children: props.label && ((0, jsx_runtime_1.jsx)("span", __assign({ className: bem.element('label-text', {
|
|
34
|
+
required: props.required
|
|
35
|
+
}) }, { children: props.label }))) }))] })));
|
|
57
36
|
}
|
|
58
37
|
exports["default"] = CheckboxFieldView;
|
|
@@ -1,56 +1,44 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
}));
|
|
13
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
-
}) : function(o, v) {
|
|
16
|
-
o["default"] = v;
|
|
17
|
-
});
|
|
18
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
-
if (mod && mod.__esModule) return mod;
|
|
20
|
-
var result = {};
|
|
21
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
-
__setModuleDefault(result, mod);
|
|
23
|
-
return result;
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
24
12
|
};
|
|
25
13
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
26
14
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
27
15
|
};
|
|
28
16
|
exports.__esModule = true;
|
|
29
|
-
var
|
|
17
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
30
18
|
var hooks_1 = require("@steroidsjs/core/hooks");
|
|
31
19
|
var useUniqueId_1 = __importDefault(require("@steroidsjs/core/hooks/useUniqueId"));
|
|
32
20
|
function CheckboxListFieldView(props) {
|
|
33
21
|
var _a;
|
|
34
22
|
var bem = (0, hooks_1.useBem)('CheckboxListFieldView');
|
|
35
23
|
var prefix = (0, useUniqueId_1["default"])('checkbox');
|
|
36
|
-
return (
|
|
24
|
+
return ((0, jsx_runtime_1.jsx)("div", __assign({ className: bem(bem.block((_a = {},
|
|
37
25
|
_a["".concat(props.orientation)] = !!props.orientation,
|
|
38
|
-
_a)), props.className), style: props.style }, props.items.map(function (checkbox, checkboxIndex) { return props.renderItem({
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
26
|
+
_a)), props.className), style: props.style }, { children: props.items.map(function (checkbox, checkboxIndex) { return props.renderItem({
|
|
27
|
+
key: checkboxIndex,
|
|
28
|
+
id: "".concat(prefix, "_").concat(checkbox.id),
|
|
29
|
+
label: checkbox.label,
|
|
30
|
+
inputProps: {
|
|
31
|
+
name: "".concat(prefix, "_").concat(checkbox.id),
|
|
32
|
+
type: 'checkbox',
|
|
33
|
+
checked: props.selectedIds.includes(checkbox.id),
|
|
34
|
+
onChange: function () {
|
|
35
|
+
props.onItemSelect(checkbox.id);
|
|
36
|
+
},
|
|
37
|
+
disabled: props.disabled || checkbox.disabled
|
|
48
38
|
},
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
required: checkbox.required
|
|
54
|
-
}); })));
|
|
39
|
+
size: checkbox.size || props.size,
|
|
40
|
+
color: checkbox.color,
|
|
41
|
+
required: checkbox.required
|
|
42
|
+
}); }) })));
|
|
55
43
|
}
|
|
56
44
|
exports["default"] = CheckboxListFieldView;
|
|
@@ -1,34 +1,45 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
2
13
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
14
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
15
|
};
|
|
5
16
|
exports.__esModule = true;
|
|
6
|
-
var
|
|
7
|
-
var useBem_1 = __importDefault(require("@steroidsjs/core/hooks/useBem"));
|
|
17
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
8
18
|
var hooks_1 = require("@steroidsjs/core/hooks");
|
|
19
|
+
var useBem_1 = __importDefault(require("@steroidsjs/core/hooks/useBem"));
|
|
9
20
|
function CheckboxTreeFieldView(props) {
|
|
10
21
|
var bem = (0, useBem_1["default"])('CheckboxTreeFieldView');
|
|
11
22
|
var prefix = (0, hooks_1.useUniqueId)('checkbox');
|
|
12
23
|
var TreeItemView = props.itemView;
|
|
13
|
-
return (
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
24
|
+
return ((0, jsx_runtime_1.jsx)("div", __assign({ className: bem.block() }, { children: props.items.map(function (checkbox) { return ((0, jsx_runtime_1.jsx)(TreeItemView, __assign({ item: checkbox, levelPadding: props.levelPadding, hasIconExpandOnly: props.hasIconExpandOnly, withoutPointerOnLabel: props.hasOnlyLeafCheckboxes && checkbox.hasItems && !checkbox.isOpened, itemProps: props.itemProps }, { children: props.renderCheckbox({
|
|
25
|
+
id: props.hasOnlyLeafCheckboxes && checkbox.hasItems ? null : "".concat(prefix, "_").concat(checkbox.id),
|
|
26
|
+
label: checkbox.label,
|
|
27
|
+
inputProps: {
|
|
28
|
+
name: "".concat(prefix, "_").concat(checkbox.id),
|
|
29
|
+
type: 'checkbox',
|
|
30
|
+
checked: props.selectedIds.includes(checkbox.id),
|
|
31
|
+
onChange: function () {
|
|
32
|
+
var isOpenedLabel = props.hasOnlyLeafCheckboxes && (checkbox.isOpened || !checkbox.hasItems);
|
|
33
|
+
if (isOpenedLabel || !props.hasOnlyLeafCheckboxes) {
|
|
34
|
+
props.onItemSelect(checkbox);
|
|
35
|
+
}
|
|
36
|
+
},
|
|
37
|
+
disabled: checkbox.disabled,
|
|
38
|
+
required: checkbox.required
|
|
39
|
+
},
|
|
40
|
+
size: props.size,
|
|
41
|
+
color: checkbox.color,
|
|
42
|
+
hasOnlyLeafCheckboxes: props.hasOnlyLeafCheckboxes
|
|
43
|
+
}) }), checkbox.uniqueId)); }) })));
|
|
33
44
|
}
|
|
34
45
|
exports["default"] = CheckboxTreeFieldView;
|
|
@@ -10,57 +10,28 @@ var __assign = (this && this.__assign) || function () {
|
|
|
10
10
|
};
|
|
11
11
|
return __assign.apply(this, arguments);
|
|
12
12
|
};
|
|
13
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
14
|
-
if (k2 === undefined) k2 = k;
|
|
15
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
16
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
17
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
18
|
-
}
|
|
19
|
-
Object.defineProperty(o, k2, desc);
|
|
20
|
-
}) : (function(o, m, k, k2) {
|
|
21
|
-
if (k2 === undefined) k2 = k;
|
|
22
|
-
o[k2] = m[k];
|
|
23
|
-
}));
|
|
24
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
25
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
26
|
-
}) : function(o, v) {
|
|
27
|
-
o["default"] = v;
|
|
28
|
-
});
|
|
29
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
30
|
-
if (mod && mod.__esModule) return mod;
|
|
31
|
-
var result = {};
|
|
32
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
33
|
-
__setModuleDefault(result, mod);
|
|
34
|
-
return result;
|
|
35
|
-
};
|
|
36
13
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
37
14
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
38
15
|
};
|
|
39
16
|
exports.__esModule = true;
|
|
40
|
-
var
|
|
41
|
-
var react_1 = require("react");
|
|
42
|
-
var Icon_1 = __importDefault(require("@steroidsjs/core/ui/content/Icon"));
|
|
17
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
43
18
|
var hooks_1 = require("@steroidsjs/core/hooks");
|
|
44
|
-
var DropDown_1 = __importDefault(require("@steroidsjs/core/ui/content/DropDown"));
|
|
45
19
|
var Calendar_1 = __importDefault(require("@steroidsjs/core/ui/content/Calendar"));
|
|
20
|
+
var DropDown_1 = __importDefault(require("@steroidsjs/core/ui/content/DropDown"));
|
|
21
|
+
var Icon_1 = __importDefault(require("@steroidsjs/core/ui/content/Icon"));
|
|
22
|
+
var react_1 = require("react");
|
|
46
23
|
function DateFieldView(props) {
|
|
47
24
|
var bem = (0, hooks_1.useBem)('DateFieldView');
|
|
48
|
-
var renderCalendar = (0, react_1.useCallback)(function () { return (
|
|
49
|
-
return (
|
|
50
|
-
React.createElement("div", { className: bem(bem.block({
|
|
25
|
+
var renderCalendar = (0, react_1.useCallback)(function () { return ((0, jsx_runtime_1.jsx)(Calendar_1["default"], __assign({}, props.calendarProps))); }, [props.calendarProps]);
|
|
26
|
+
return ((0, jsx_runtime_1.jsx)(DropDown_1["default"], __assign({ content: renderCalendar, position: "bottom", visible: props.isOpened, onClose: props.onClose, className: bem.element('dropdown'), autoPositioning: props.autoPositioning, hasArrow: false }, { children: (0, jsx_runtime_1.jsx)("div", __assign({ className: bem(bem.block({
|
|
51
27
|
size: props.size,
|
|
52
28
|
disabled: props.disabled,
|
|
53
29
|
'is-invalid': !!props.errors
|
|
54
|
-
}), props.className), style: props.style },
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
!props.inputProps.value && props.icon && (React.createElement(Icon_1["default"], { className: bem.element('date-icon'), name: typeof props.icon === 'string' ? props.icon : 'calendar_range', tabIndex: -1 })),
|
|
61
|
-
props.showRemove && props.inputProps.value && (React.createElement(Icon_1["default"], { className: bem.element('close-icon'), onClick: function (e) {
|
|
62
|
-
e.preventDefault();
|
|
63
|
-
props.onClear();
|
|
64
|
-
}, name: 'cross_8x8' })))))));
|
|
30
|
+
}), props.className), style: props.style }, { children: (0, jsx_runtime_1.jsxs)("div", __assign({ className: bem.element('body') }, { children: [(0, jsx_runtime_1.jsx)("input", __assign({}, props.inputProps, { id: props.id, ref: props.maskInputRef, onInput: function (e) {
|
|
31
|
+
props.inputProps.onChange(e.currentTarget.value);
|
|
32
|
+
}, className: bem(bem.element('input'), props.inputProps.className) })), (0, jsx_runtime_1.jsxs)("div", __assign({ className: bem.element('icon-container') }, { children: [!props.inputProps.value && props.icon && ((0, jsx_runtime_1.jsx)(Icon_1["default"], { className: bem.element('date-icon'), name: typeof props.icon === 'string' ? props.icon : 'calendar_range', tabIndex: -1 })), props.showRemove && props.inputProps.value && ((0, jsx_runtime_1.jsx)(Icon_1["default"], { className: bem.element('close-icon'), onClick: function (e) {
|
|
33
|
+
e.preventDefault();
|
|
34
|
+
props.onClear();
|
|
35
|
+
}, name: 'cross_8x8' }))] }))] })) })) })));
|
|
65
36
|
}
|
|
66
37
|
exports["default"] = DateFieldView;
|
|
@@ -10,67 +10,32 @@ var __assign = (this && this.__assign) || function () {
|
|
|
10
10
|
};
|
|
11
11
|
return __assign.apply(this, arguments);
|
|
12
12
|
};
|
|
13
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
14
|
-
if (k2 === undefined) k2 = k;
|
|
15
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
16
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
17
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
18
|
-
}
|
|
19
|
-
Object.defineProperty(o, k2, desc);
|
|
20
|
-
}) : (function(o, m, k, k2) {
|
|
21
|
-
if (k2 === undefined) k2 = k;
|
|
22
|
-
o[k2] = m[k];
|
|
23
|
-
}));
|
|
24
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
25
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
26
|
-
}) : function(o, v) {
|
|
27
|
-
o["default"] = v;
|
|
28
|
-
});
|
|
29
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
30
|
-
if (mod && mod.__esModule) return mod;
|
|
31
|
-
var result = {};
|
|
32
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
33
|
-
__setModuleDefault(result, mod);
|
|
34
|
-
return result;
|
|
35
|
-
};
|
|
36
13
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
37
14
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
38
15
|
};
|
|
39
16
|
exports.__esModule = true;
|
|
40
|
-
var
|
|
41
|
-
var react_1 = require("react");
|
|
17
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
42
18
|
var hooks_1 = require("@steroidsjs/core/hooks");
|
|
43
|
-
var Icon_1 = __importDefault(require("@steroidsjs/core/ui/content/Icon"));
|
|
44
|
-
var DropDown_1 = __importDefault(require("@steroidsjs/core/ui/content/DropDown"));
|
|
45
19
|
var Calendar_1 = __importDefault(require("@steroidsjs/core/ui/content/Calendar"));
|
|
20
|
+
var DropDown_1 = __importDefault(require("@steroidsjs/core/ui/content/DropDown"));
|
|
21
|
+
var Icon_1 = __importDefault(require("@steroidsjs/core/ui/content/Icon"));
|
|
22
|
+
var react_1 = require("react");
|
|
46
23
|
var RangeButtons_1 = __importDefault(require("./views/RangeButtons"));
|
|
47
24
|
function DateRangeFieldView(props) {
|
|
48
25
|
var bem = (0, hooks_1.useBem)('DateRangeFieldView');
|
|
49
26
|
var hasValue = props.inputPropsFrom.value || props.inputPropsTo.value;
|
|
50
|
-
var renderCalendar = (0, react_1.useCallback)(function () { return (props.withRangeButtons ? (
|
|
27
|
+
var renderCalendar = (0, react_1.useCallback)(function () { return (props.withRangeButtons ? ((0, jsx_runtime_1.jsxs)("div", __assign({ className: bem.element('calendar-wrapper', {
|
|
51
28
|
position: props.rangeButtonsPosition
|
|
52
|
-
}) },
|
|
53
|
-
|
|
54
|
-
React.createElement(RangeButtons_1["default"], { config: props.withRangeButtons, changeTo: props.inputPropsTo.onChange, changeFrom: props.inputPropsFrom.onChange, position: props.rangeButtonsPosition, format: props.displayFormat })),
|
|
55
|
-
React.createElement("div", { className: bem.element('calendar') },
|
|
56
|
-
React.createElement(Calendar_1["default"], __assign({}, props.calendarProps)))))
|
|
57
|
-
: (React.createElement(Calendar_1["default"], __assign({}, props.calendarProps)))); }, [bem, props.calendarProps, props.displayFormat, props.inputPropsFrom.onChange,
|
|
29
|
+
}) }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ className: bem.element('additional-buttons') }, { children: (0, jsx_runtime_1.jsx)(RangeButtons_1["default"], { config: props.withRangeButtons, changeTo: props.inputPropsTo.onChange, changeFrom: props.inputPropsFrom.onChange, position: props.rangeButtonsPosition, format: props.displayFormat }) })), (0, jsx_runtime_1.jsx)("div", __assign({ className: bem.element('calendar') }, { children: (0, jsx_runtime_1.jsx)(Calendar_1["default"], __assign({}, props.calendarProps)) }))] })))
|
|
30
|
+
: ((0, jsx_runtime_1.jsx)(Calendar_1["default"], __assign({}, props.calendarProps)))); }, [bem, props.calendarProps, props.displayFormat, props.inputPropsFrom.onChange,
|
|
58
31
|
props.inputPropsTo.onChange, props.rangeButtonsPosition, props.withRangeButtons]);
|
|
59
|
-
return (
|
|
60
|
-
React.createElement("div", { className: bem(bem.block({
|
|
32
|
+
return ((0, jsx_runtime_1.jsx)(DropDown_1["default"], __assign({ content: renderCalendar, position: 'bottomLeft', visible: props.isOpened, onClose: props.onClose, className: bem.element('split'), hasArrow: false }, { children: (0, jsx_runtime_1.jsx)("div", __assign({ className: bem(bem.block({
|
|
61
33
|
disabled: props.disabled,
|
|
62
34
|
size: props.size,
|
|
63
35
|
'is-invalid': !!props.errors
|
|
64
|
-
}), props.className), style: props.style },
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
React.createElement("div", { className: bem.element('icon-container') },
|
|
69
|
-
props.icon && !hasValue && (React.createElement(Icon_1["default"], { className: bem.element('date-icon'), name: typeof props.icon === 'string' ? props.icon : 'calendar_range', tabIndex: -1 })),
|
|
70
|
-
props.showRemove && hasValue && (React.createElement(Icon_1["default"], { className: bem.element('close-icon'), onClick: function (e) {
|
|
71
|
-
e.preventDefault();
|
|
72
|
-
props.onClear();
|
|
73
|
-
}, name: 'cross_8x8' }))),
|
|
74
|
-
React.createElement("span", { className: bem.element('effect') })))));
|
|
36
|
+
}), props.className), style: props.style }, { children: (0, jsx_runtime_1.jsxs)("div", __assign({ className: bem.element('body') }, { children: [(0, jsx_runtime_1.jsx)("input", __assign({}, props.inputPropsFrom, { id: props.id, className: bem(bem.element('input', {})), onInput: function (e) { return props.inputPropsFrom.onChange(e.currentTarget.value); } })), (0, jsx_runtime_1.jsx)("input", __assign({}, props.inputPropsTo, { className: bem.element('input'), onInput: function (e) { return props.inputPropsTo.onChange(e.currentTarget.value); } })), (0, jsx_runtime_1.jsxs)("div", __assign({ className: bem.element('icon-container') }, { children: [props.icon && !hasValue && ((0, jsx_runtime_1.jsx)(Icon_1["default"], { className: bem.element('date-icon'), name: typeof props.icon === 'string' ? props.icon : 'calendar_range', tabIndex: -1 })), props.showRemove && hasValue && ((0, jsx_runtime_1.jsx)(Icon_1["default"], { className: bem.element('close-icon'), onClick: function (e) {
|
|
37
|
+
e.preventDefault();
|
|
38
|
+
props.onClear();
|
|
39
|
+
}, name: 'cross_8x8' }))] })), (0, jsx_runtime_1.jsx)("span", { className: bem.element('effect') })] })) })) })));
|
|
75
40
|
}
|
|
76
41
|
exports["default"] = DateRangeFieldView;
|