@expressms/smartapp-ui 0.0.4 → 0.0.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/build/main/styles/styles.min.css +15 -12
- package/build/main//321/201omponents/ActionModal/ActionModal.d.ts +1 -2
- package/build/main//321/201omponents/AttachedFile/AttachedFile.d.ts +1 -2
- package/build/main//321/201omponents/AttachedFile/AttachedFile.js +2 -2
- package/build/main//321/201omponents/AttachedFile/types.d.ts +1 -1
- package/build/main//321/201omponents/Avatar/Avatar.d.ts +1 -2
- package/build/main//321/201omponents/Button/Button.d.ts +1 -2
- package/build/main//321/201omponents/Button/Button.js +2 -2
- package/build/main//321/201omponents/Button/types.d.ts +1 -1
- package/build/main//321/201omponents/Calendar/Calendar.d.ts +1 -2
- package/build/main//321/201omponents/Calendar/Calendar.js +1 -1
- package/build/main//321/201omponents/Calendar/types.d.ts +1 -1
- package/build/main//321/201omponents/Checkbox/Checkbox.d.ts +1 -2
- package/build/main//321/201omponents/Chips/Chips.d.ts +1 -2
- package/build/main//321/201omponents/ConfirmationModal/ConfirmationModal.d.ts +1 -2
- package/build/main//321/201omponents/ConfirmationModal/ConfirmationModal.js +1 -1
- package/build/main//321/201omponents/CustomSelect/CustomSelect.d.ts +1 -2
- package/build/main//321/201omponents/CustomSelect/CustomSelect.js +3 -3
- package/build/main//321/201omponents/CustomSelect/types.d.ts +1 -1
- package/build/main//321/201omponents/CustomSelectPriority/CustomSelectPriority.d.ts +1 -2
- package/build/main//321/201omponents/CustomSelectPriority/CustomSelectPriority.js +3 -3
- package/build/main//321/201omponents/CustomSelectPriority/types.d.ts +1 -1
- package/build/main//321/201omponents/CustomSelectProfiles/CustomSelectProfiles.d.ts +1 -2
- package/build/main//321/201omponents/CustomSelectProfiles/CustomSelectProfiles.js +3 -3
- package/build/main//321/201omponents/CustomSelectProfiles/types.d.ts +1 -1
- package/build/main//321/201omponents/DragAndDrop/DragAndDrop.d.ts +1 -2
- package/build/main//321/201omponents/DragAndDrop/DragAndDrop.js +1 -1
- package/build/main//321/201omponents/DragAndDrop/types.d.ts +1 -1
- package/build/main//321/201omponents/Error/Error.d.ts +1 -2
- package/build/main//321/201omponents/Header/Header.d.ts +1 -2
- package/build/main//321/201omponents/Input/Input.d.ts +1 -2
- package/build/main//321/201omponents/Input/Input.js +2 -2
- package/build/main//321/201omponents/Input/types.d.ts +1 -1
- package/build/main//321/201omponents/Loader/Loader.d.ts +1 -2
- package/build/main//321/201omponents/Profile/Profile.d.ts +1 -2
- package/build/main//321/201omponents/Profile/Profile.js +2 -2
- package/build/main//321/201omponents/Profile/types.d.ts +1 -1
- package/build/main//321/201omponents/Switcher/Switcher.d.ts +1 -2
- package/build/main//321/201omponents/Toggle/Toggle.d.ts +1 -2
- package/package.json +8 -7
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { IActionModalProps } from './types';
|
|
3
2
|
import '../../styles/stories.module.scss';
|
|
4
|
-
declare function ActionModal({ title, buttonName, confirmButtonFunction, isModalOpen, placeholder, cancelButtonFunction, defaultValue, }: IActionModalProps): JSX.Element;
|
|
3
|
+
declare function ActionModal({ title, buttonName, confirmButtonFunction, isModalOpen, placeholder, cancelButtonFunction, defaultValue, }: IActionModalProps): import("react/jsx-runtime").JSX.Element;
|
|
5
4
|
export default ActionModal;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { IAttachedFile } from './types';
|
|
3
2
|
import '../../styles/stories.module.scss';
|
|
4
|
-
declare function AttachedFile({ fileName, weight, weightType, isSpaceBetween, onClickDownloadFile, onClickRemoveFile, isRemoveFile, isDownloadFile, width, }: IAttachedFile): JSX.Element;
|
|
3
|
+
declare function AttachedFile({ fileName, weight, weightType, isSpaceBetween, onClickDownloadFile, onClickRemoveFile, isRemoveFile, isDownloadFile, width, }: IAttachedFile): import("react/jsx-runtime").JSX.Element;
|
|
5
4
|
export default AttachedFile;
|
|
@@ -16,7 +16,7 @@ import { ReactComponent as Download } from '../../assets/icons/download.svg';
|
|
|
16
16
|
import '../../styles/stories.module.scss';
|
|
17
17
|
import classNames from 'classnames';
|
|
18
18
|
function AttachedFile(_a) {
|
|
19
|
-
var fileName = _a.fileName, weight = _a.weight, weightType = _a.weightType, _b = _a.isSpaceBetween, isSpaceBetween = _b === void 0 ? false : _b, _c = _a.onClickDownloadFile, onClickDownloadFile = _c === void 0 ? undefined : _c, _d = _a.onClickRemoveFile, onClickRemoveFile = _d === void 0 ? undefined : _d, _e = _a.isRemoveFile, isRemoveFile = _e === void 0 ? false : _e, _f = _a.isDownloadFile, isDownloadFile = _f === void 0 ? false : _f,
|
|
20
|
-
return (_jsxs("div", __assign({ style: { width: "".concat(width, "
|
|
19
|
+
var fileName = _a.fileName, weight = _a.weight, weightType = _a.weightType, _b = _a.isSpaceBetween, isSpaceBetween = _b === void 0 ? false : _b, _c = _a.onClickDownloadFile, onClickDownloadFile = _c === void 0 ? undefined : _c, _d = _a.onClickRemoveFile, onClickRemoveFile = _d === void 0 ? undefined : _d, _e = _a.isRemoveFile, isRemoveFile = _e === void 0 ? false : _e, _f = _a.isDownloadFile, isDownloadFile = _f === void 0 ? false : _f, _g = _a.width, width = _g === void 0 ? 100 : _g;
|
|
20
|
+
return (_jsxs("div", __assign({ style: { width: "".concat(width, "%") }, className: "smartapp-attached-file" }, { children: [_jsx("div", __assign({ className: "smartapp-attached-file--icon" }, { children: _jsx(File, {}) })), _jsxs("div", __assign({ className: classNames({ 'smartapp-attached-file__value': true }, { 'justify-space-between': isSpaceBetween }) }, { children: [_jsxs("div", __assign({ className: "smartapp-attached-file__value--info" }, { children: [_jsx("p", __assign({ className: "smartapp-attached-file__value--info__name" }, { children: fileName })), _jsx("p", __assign({ className: "smartapp-attached-file__value--info__weight" }, { children: "".concat(weight, " ").concat(weightType) }))] })), _jsxs("div", __assign({ className: "smartapp-attached-file__value--icons" }, { children: [onClickRemoveFile && isRemoveFile && (_jsx("div", __assign({ onClick: function () { return onClickRemoveFile(fileName); }, className: "smartapp-attached-file__value--icons__close" }, { children: _jsx(Close, {}) }))), onClickDownloadFile && isDownloadFile && (_jsx("div", __assign({ onClick: function () { return onClickDownloadFile(fileName); }, className: "smartapp-attached-file__value--icons__download" }, { children: _jsx(Download, {}) })))] }))] }))] }), weight));
|
|
21
21
|
}
|
|
22
22
|
export default AttachedFile;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { IAvatar } from './types';
|
|
3
2
|
import '../../styles/stories.module.scss';
|
|
4
|
-
declare function Avatar({ username, onClick, widthHeight }: IAvatar): JSX.Element;
|
|
3
|
+
declare function Avatar({ username, onClick, widthHeight }: IAvatar): import("react/jsx-runtime").JSX.Element;
|
|
5
4
|
export default Avatar;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { IButtonProps } from './types';
|
|
3
2
|
import '../../styles/stories.module.scss';
|
|
4
|
-
declare const Button: (props: IButtonProps) => JSX.Element;
|
|
3
|
+
declare const Button: (props: IButtonProps) => import("react/jsx-runtime").JSX.Element;
|
|
5
4
|
export default Button;
|
|
@@ -13,7 +13,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
13
13
|
import cn from 'classnames';
|
|
14
14
|
import '../../styles/stories.module.scss';
|
|
15
15
|
var Button = function (props) {
|
|
16
|
-
var title = props.title, _a = props.isDisabled, isDisabled = _a === void 0 ? false : _a, _b = props.typeButton, typeButton = _b === void 0 ? 'standart' : _b, _c = props.color, color = _c === void 0 ? 'white' : _c,
|
|
17
|
-
return (_jsx("button", __assign({ onClick: function () { return onClickFunction(); }, className: cn(typeButton ? 'smartapp-button__' + typeButton : null, color ? 'smartapp-button__color--' + color : null, isDisabled && 'smartapp-button__disabled'), style:
|
|
16
|
+
var title = props.title, _a = props.isDisabled, isDisabled = _a === void 0 ? false : _a, _b = props.typeButton, typeButton = _b === void 0 ? 'standart' : _b, _c = props.color, color = _c === void 0 ? 'white' : _c, _d = props.width, width = _d === void 0 ? 100 : _d, _e = props.onClickFunction, onClickFunction = _e === void 0 ? function () { return undefined; } : _e;
|
|
17
|
+
return (_jsx("button", __assign({ onClick: function () { return onClickFunction(); }, className: cn(typeButton ? 'smartapp-button__' + typeButton : null, color ? 'smartapp-button__color--' + color : null, isDisabled && 'smartapp-button__disabled'), style: { width: "".concat(width, "%") } }, { children: title })));
|
|
18
18
|
};
|
|
19
19
|
export default Button;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import '../../styles/stories.module.scss';
|
|
3
2
|
import { ICalendarProps } from './types';
|
|
4
|
-
declare function CalendarDatepicker({ placeholder, initialCurrentDate, initialCurrentDateRange, minDate, onChangeCurrentDate, onChangeCurrentDateRange, calendarComponentClassName, calendarInputClassName, isRange, width, }: ICalendarProps): JSX.Element;
|
|
3
|
+
declare function CalendarDatepicker({ placeholder, initialCurrentDate, initialCurrentDateRange, minDate, onChangeCurrentDate, onChangeCurrentDateRange, calendarComponentClassName, calendarInputClassName, isRange, width, }: ICalendarProps): import("react/jsx-runtime").JSX.Element;
|
|
5
4
|
export default CalendarDatepicker;
|
|
@@ -36,7 +36,7 @@ function CalendarDatepicker(_a) {
|
|
|
36
36
|
return (_jsx("div", __assign({ className: classNames({
|
|
37
37
|
'smartapp-calendar-component': !calendarInputClassName,
|
|
38
38
|
calendarInputClassName: calendarInputClassName,
|
|
39
|
-
}), style: { width: "".concat(width, "
|
|
39
|
+
}), style: { width: "".concat(width, "%") } }, { children: isRange ? (_jsx(DatePicker, { selectsRange: true, startDate: startDate, endDate: endDate, dateFormat: "dd.MM.yyyy", placeholderText: placeholder, locale: ru, className: classNames({
|
|
40
40
|
'smartapp-calendar-input': !calendarComponentClassName,
|
|
41
41
|
calendarComponentClassName: calendarComponentClassName,
|
|
42
42
|
}), onChange: function (period) { return onChangeDateRange(period); } })) : (_jsx(DatePicker, { selected: currentDate, dateFormat: "dd.MM.yyyy", locale: ru, placeholderText: placeholder, minDate: minDate, className: classNames({
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { ICheckBoxProps } from './types';
|
|
3
2
|
import '../../styles/stories.module.scss';
|
|
4
|
-
declare function CheckBox({ id, onChange, disabled, checked }: ICheckBoxProps): JSX.Element;
|
|
3
|
+
declare function CheckBox({ id, onChange, disabled, checked }: ICheckBoxProps): import("react/jsx-runtime").JSX.Element;
|
|
5
4
|
export default CheckBox;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { IChipsProps } from './types';
|
|
3
2
|
import '../../styles/stories.module.scss';
|
|
4
|
-
declare function Chips({ name, onCancelFunction }: IChipsProps): JSX.Element;
|
|
3
|
+
declare function Chips({ name, onCancelFunction }: IChipsProps): import("react/jsx-runtime").JSX.Element;
|
|
5
4
|
export default Chips;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { IConfirmationModalProps } from './types';
|
|
3
2
|
import '../../styles/stories.module.scss';
|
|
4
|
-
declare function ConfirmationModal({ title, text, cancelButtonName, confirmButtonName, cancelButtonFunction, confirmButtonFunction, isModalOpen, }: IConfirmationModalProps): JSX.Element;
|
|
3
|
+
declare function ConfirmationModal({ title, text, cancelButtonName, confirmButtonName, cancelButtonFunction, confirmButtonFunction, isModalOpen, }: IConfirmationModalProps): import("react/jsx-runtime").JSX.Element;
|
|
5
4
|
export default ConfirmationModal;
|
|
@@ -28,6 +28,6 @@ function ConfirmationModal(_a) {
|
|
|
28
28
|
document === null || document === void 0 ? void 0 : document.removeEventListener('click', checkIfClickedOutside, true);
|
|
29
29
|
};
|
|
30
30
|
}, [isModalOpen, cancelButtonFunction]);
|
|
31
|
-
return (_jsx(Popup, __assign({ closeOnDocumentClick: true, modal: true, open: isModalOpen }, { children: _jsx("div", __assign({ ref: ref, className: "smartapp-confirmation-modal" }, { children: _jsxs("div", __assign({ className: "smartapp-confirmation-modal__content" }, { children: [_jsx("p", __assign({ className: "smartapp-confirmation-modal__content--title" }, { children: title })), _jsx("p", __assign({ className: "smartapp-confirmation-modal__content--text" }, { children: text })), _jsxs("div", __assign({ className: "smartapp-confirmation-modal__content--buttons" }, { children: [_jsx(Button, {
|
|
31
|
+
return (_jsx(Popup, __assign({ closeOnDocumentClick: true, modal: true, open: isModalOpen }, { children: _jsx("div", __assign({ ref: ref, className: "smartapp-confirmation-modal" }, { children: _jsxs("div", __assign({ className: "smartapp-confirmation-modal__content" }, { children: [_jsx("p", __assign({ className: "smartapp-confirmation-modal__content--title" }, { children: title })), _jsx("p", __assign({ className: "smartapp-confirmation-modal__content--text" }, { children: text })), _jsxs("div", __assign({ className: "smartapp-confirmation-modal__content--buttons" }, { children: [_jsx(Button, { width: 50, title: cancelButtonName, typeButton: "low", onClickFunction: cancelButtonFunction, color: "white" }), _jsx(Button, { width: 50, title: confirmButtonName, typeButton: "low", onClickFunction: confirmButtonFunction, color: "red" })] }))] })) })) })));
|
|
32
32
|
}
|
|
33
33
|
export default ConfirmationModal;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { ICustomSelect } from './types';
|
|
3
2
|
import '../../styles/stories.module.scss';
|
|
4
|
-
declare function CustomSelect({ options, defaultValue, placeholder, onChange, width }: ICustomSelect): JSX.Element;
|
|
3
|
+
declare function CustomSelect({ options, defaultValue, placeholder, onChange, width }: ICustomSelect): import("react/jsx-runtime").JSX.Element;
|
|
5
4
|
export default CustomSelect;
|
|
@@ -13,9 +13,9 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
13
13
|
import Select from 'react-select';
|
|
14
14
|
import '../../styles/stories.module.scss';
|
|
15
15
|
function CustomSelect(_a) {
|
|
16
|
-
var options = _a.options, defaultValue = _a.defaultValue, placeholder = _a.placeholder, onChange = _a.onChange,
|
|
16
|
+
var options = _a.options, defaultValue = _a.defaultValue, placeholder = _a.placeholder, onChange = _a.onChange, _b = _a.width, width = _b === void 0 ? 100 : _b;
|
|
17
17
|
var customStyles = {
|
|
18
|
-
option: function (provided, state) { return (__assign(__assign({}, provided), { cursor: 'pointer', background: '#ffffff', color: (state === null || state === void 0 ? void 0 : state.isSelected) ? '#4799E3' : '#000000', width:
|
|
18
|
+
option: function (provided, state) { return (__assign(__assign({}, provided), { cursor: 'pointer', background: '#ffffff', color: (state === null || state === void 0 ? void 0 : state.isSelected) ? '#4799E3' : '#000000', width: "".concat(width, "%"), textOverflow: 'ellipsis', '&:focus': {
|
|
19
19
|
background: '#ffffff',
|
|
20
20
|
color: 'none',
|
|
21
21
|
}, '&:hover': {
|
|
@@ -25,7 +25,7 @@ function CustomSelect(_a) {
|
|
|
25
25
|
color: '#4799E3',
|
|
26
26
|
background: '#000000',
|
|
27
27
|
} })); },
|
|
28
|
-
control: function (provided) { return (__assign(__assign({}, provided), { width:
|
|
28
|
+
control: function (provided) { return (__assign(__assign({}, provided), { width: "".concat(width, "%"), textOverflow: 'ellipsis' })); },
|
|
29
29
|
};
|
|
30
30
|
return (_jsx("div", __assign({ className: "smartapp-custom-select" }, { children: _jsx(Select
|
|
31
31
|
/* @ts-ignore */
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { ICustomSelectPriority } from './types';
|
|
3
2
|
import '../../styles/stories.module.scss';
|
|
4
|
-
declare function CustomSelectPriority({ options, defaultValue, placeholder, onChange, width }: ICustomSelectPriority): JSX.Element;
|
|
3
|
+
declare function CustomSelectPriority({ options, defaultValue, placeholder, onChange, width }: ICustomSelectPriority): import("react/jsx-runtime").JSX.Element;
|
|
5
4
|
export default CustomSelectPriority;
|
|
@@ -25,18 +25,18 @@ import Select, { components } from 'react-select';
|
|
|
25
25
|
import { ReactComponent as Ellipse } from '../../assets/icons/ellipse.svg';
|
|
26
26
|
import '../../styles/stories.module.scss';
|
|
27
27
|
function CustomSelectPriority(_a) {
|
|
28
|
-
var options = _a.options, defaultValue = _a.defaultValue, placeholder = _a.placeholder, onChange = _a.onChange,
|
|
28
|
+
var options = _a.options, defaultValue = _a.defaultValue, placeholder = _a.placeholder, onChange = _a.onChange, _b = _a.width, width = _b === void 0 ? 100 : _b;
|
|
29
29
|
var customStyles = {
|
|
30
30
|
option: function (provided, state) {
|
|
31
31
|
var _a;
|
|
32
|
-
return (__assign(__assign({}, provided), { cursor: 'pointer', background: state.isSelected ? 'rgba(71, 153, 227, 0.1)' : '#ffffff', color: (_a = state === null || state === void 0 ? void 0 : state.value) === null || _a === void 0 ? void 0 : _a.color, display: 'flex', textOverflow: 'ellipsis', width:
|
|
32
|
+
return (__assign(__assign({}, provided), { cursor: 'pointer', background: state.isSelected ? 'rgba(71, 153, 227, 0.1)' : '#ffffff', color: (_a = state === null || state === void 0 ? void 0 : state.value) === null || _a === void 0 ? void 0 : _a.color, display: 'flex', textOverflow: 'ellipsis', width: "".concat(width, "%"), '&:focus': {
|
|
33
33
|
background: '#ffffff',
|
|
34
34
|
color: 'none',
|
|
35
35
|
}, '&:hover': {
|
|
36
36
|
background: 'rgba(71, 153, 227, 0.1)',
|
|
37
37
|
} }));
|
|
38
38
|
},
|
|
39
|
-
control: function (provided) { return (__assign(__assign({}, provided), { width:
|
|
39
|
+
control: function (provided) { return (__assign(__assign({}, provided), { width: "".concat(width, "%"), textOverflow: 'ellipsis' })); },
|
|
40
40
|
};
|
|
41
41
|
var DropdownIndicator = function (props) {
|
|
42
42
|
return _jsx(components.DropdownIndicator, __assign({}, props));
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { ICustomSelectProfiles } from './types';
|
|
3
2
|
import '../../styles/stories.module.scss';
|
|
4
|
-
declare function CustomSelectPriority({ options, defaultValue, placeholder, onChange, width }: ICustomSelectProfiles): JSX.Element;
|
|
3
|
+
declare function CustomSelectPriority({ options, defaultValue, placeholder, onChange, width }: ICustomSelectProfiles): import("react/jsx-runtime").JSX.Element;
|
|
5
4
|
export default CustomSelectPriority;
|
|
@@ -25,15 +25,15 @@ import Select, { components } from 'react-select';
|
|
|
25
25
|
import '../../styles/stories.module.scss';
|
|
26
26
|
import Avatar from '../Avatar';
|
|
27
27
|
function CustomSelectPriority(_a) {
|
|
28
|
-
var options = _a.options, defaultValue = _a.defaultValue, placeholder = _a.placeholder, onChange = _a.onChange,
|
|
28
|
+
var options = _a.options, defaultValue = _a.defaultValue, placeholder = _a.placeholder, onChange = _a.onChange, _b = _a.width, width = _b === void 0 ? 100 : _b;
|
|
29
29
|
var customStyles = {
|
|
30
|
-
option: function (provided, state) { return (__assign(__assign({}, provided), { cursor: 'pointer', color: '#000000', background: state.isSelected ? 'rgba(71, 153, 227, 0.1)' : '#ffffff', display: 'flex', textOverflow: 'ellipsis', width:
|
|
30
|
+
option: function (provided, state) { return (__assign(__assign({}, provided), { cursor: 'pointer', color: '#000000', background: state.isSelected ? 'rgba(71, 153, 227, 0.1)' : '#ffffff', display: 'flex', textOverflow: 'ellipsis', width: "".concat(width, "%"), padding: '10px 0', '&:focus': {
|
|
31
31
|
background: '#ffffff',
|
|
32
32
|
color: 'none',
|
|
33
33
|
}, '&:hover': {
|
|
34
34
|
background: 'rgba(71, 153, 227, 0.1)',
|
|
35
35
|
} })); },
|
|
36
|
-
control: function (provided) { return (__assign(__assign({}, provided), { width:
|
|
36
|
+
control: function (provided) { return (__assign(__assign({}, provided), { width: "".concat(width, "%"), textOverflow: 'ellipsis', padding: '5px 0 5px 5px' })); },
|
|
37
37
|
};
|
|
38
38
|
var DropdownIndicator = function (props) {
|
|
39
39
|
return _jsx(components.DropdownIndicator, __assign({}, props));
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { IDragAndDrop } from './types';
|
|
3
2
|
import '../../styles/stories.module.scss';
|
|
4
|
-
declare function DragAndDrop({ options, onDragEndFunction, onChangeIsCompletedOption, onChangeOption, onClickDeleteOption, placeholder, width, }: IDragAndDrop): JSX.Element;
|
|
3
|
+
declare function DragAndDrop({ options, onDragEndFunction, onChangeIsCompletedOption, onChangeOption, onClickDeleteOption, placeholder, width, }: IDragAndDrop): import("react/jsx-runtime").JSX.Element;
|
|
5
4
|
export default DragAndDrop;
|
|
@@ -49,6 +49,6 @@ function DragAndDrop(_a) {
|
|
|
49
49
|
var newOptions = reorderOptions(options, result.source.index, result.destination.index);
|
|
50
50
|
onDragEndFunction(newOptions);
|
|
51
51
|
};
|
|
52
|
-
return (_jsx("div", __assign({ style: { width: "".concat(width, "
|
|
52
|
+
return (_jsx("div", __assign({ style: { width: "".concat(width, "%") }, className: "smartapp-drag-drop" }, { children: _jsx(DragDropContext, __assign({ onDragStart: onDragStart, onDragEnd: onDragEnd }, { children: _jsx(Droppable, __assign({ droppableId: "droppable" }, { children: function (provided) { return (_jsx("div", __assign({}, provided.droppableProps, { ref: provided.innerRef, className: "smartapp-drag-drop__container" }, { children: options === null || options === void 0 ? void 0 : options.map(function (instanceOption, index) { return (_jsx(Draggable, __assign({ draggableId: instanceOption.id, index: index }, { children: function (provided) { return (_jsxs("div", __assign({ ref: provided.innerRef }, provided.draggableProps, provided.dragHandleProps, { className: "smartapp-drag-drop__container--instance" }, { children: [_jsxs("div", __assign({ className: "smartapp-drag-drop__container--instance__info" }, { children: [isCheckbox(instanceOption) && onChangeIsCompletedOption && (_jsx(CheckBox, { checked: instanceOption.isCompleted, id: instanceOption.id, onChange: function () { return onChangeIsCompletedOption(instanceOption); } })), onChangeOption ? (_jsx("input", { onChange: function (e) { return onChangeOption && onChangeOption(e, instanceOption); }, defaultValue: instanceOption.defaultValue, className: "smartapp-drag-drop__container--instance__info--name", type: "text", enterKeyHint: "enter", placeholder: placeholder }, instanceOption === null || instanceOption === void 0 ? void 0 : instanceOption.id)) : (_jsx("p", __assign({ className: "smartapp-drag-drop__container--instance__info--name" }, { children: instanceOption.defaultValue })))] })), _jsxs("div", __assign({ className: "smartapp-drag-drop__container--instance__icons" }, { children: [_jsx(Order, {}), onClickDeleteOption && _jsx(Close, { onClick: function () { return onClickDeleteOption(instanceOption); }, className: "cp" })] }))] }))); } }), instanceOption.id)); }) }))); } })) })) })));
|
|
53
53
|
}
|
|
54
54
|
export default DragAndDrop;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { IErrorProps } from './types';
|
|
3
2
|
import '../../styles/stories.module.scss';
|
|
4
|
-
declare function Error({ title, text }: IErrorProps): JSX.Element;
|
|
3
|
+
declare function Error({ title, text }: IErrorProps): import("react/jsx-runtime").JSX.Element;
|
|
5
4
|
export default Error;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { IHeaderProps } from './types';
|
|
3
2
|
import '../../styles/stories.module.scss';
|
|
4
|
-
declare function Header(props: IHeaderProps): JSX.Element;
|
|
3
|
+
declare function Header(props: IHeaderProps): import("react/jsx-runtime").JSX.Element;
|
|
5
4
|
export default Header;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { IInput } from './types';
|
|
3
2
|
import '../../styles/stories.module.scss';
|
|
4
|
-
declare function Input({ title, onChange, placeholder, width, defaultValue }: IInput): JSX.Element;
|
|
3
|
+
declare function Input({ title, onChange, placeholder, width, defaultValue }: IInput): import("react/jsx-runtime").JSX.Element;
|
|
5
4
|
export default Input;
|
|
@@ -12,7 +12,7 @@ var __assign = (this && this.__assign) || function () {
|
|
|
12
12
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
13
|
import '../../styles/stories.module.scss';
|
|
14
14
|
function Input(_a) {
|
|
15
|
-
var title = _a.title, onChange = _a.onChange, placeholder = _a.placeholder,
|
|
16
|
-
return (_jsxs("div", __assign({ style: { width: "".concat(width, "
|
|
15
|
+
var title = _a.title, onChange = _a.onChange, placeholder = _a.placeholder, _b = _a.width, width = _b === void 0 ? 100 : _b, defaultValue = _a.defaultValue;
|
|
16
|
+
return (_jsxs("div", __assign({ style: { width: "".concat(width, "%") }, className: "smartapp-input" }, { children: [title && _jsx("p", __assign({ className: "smartapp-input__title" }, { children: title })), _jsx("input", { defaultValue: defaultValue, placeholder: placeholder, onChange: function (e) { return onChange(e.target.value); }, className: "smartapp-input__field" })] })));
|
|
17
17
|
}
|
|
18
18
|
export default Input;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { ILoaderProps } from './types';
|
|
3
2
|
import '../../styles/stories.module.scss';
|
|
4
|
-
declare function Loader({ isLoader, title }: ILoaderProps): JSX.Element;
|
|
3
|
+
declare function Loader({ isLoader, title }: ILoaderProps): import("react/jsx-runtime").JSX.Element;
|
|
5
4
|
export default Loader;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { IProfileProps } from './types';
|
|
3
2
|
import '../../styles/stories.module.scss';
|
|
4
|
-
declare function Profile({ username, email, isShowProfile, onChange, onClickLogout, isMultipleProfile, onClickAddProfile, width, }: IProfileProps): JSX.Element;
|
|
3
|
+
declare function Profile({ username, email, isShowProfile, onChange, onClickLogout, isMultipleProfile, onClickAddProfile, width, }: IProfileProps): import("react/jsx-runtime").JSX.Element;
|
|
5
4
|
export default Profile;
|
|
@@ -16,7 +16,7 @@ import { ReactComponent as AddProfile } from '../../assets/icons/plus.svg';
|
|
|
16
16
|
import '../../styles/stories.module.scss';
|
|
17
17
|
function Profile(_a) {
|
|
18
18
|
var _b, _c, _d;
|
|
19
|
-
var username = _a.username, email = _a.email, _e = _a.isShowProfile, isShowProfile = _e === void 0 ? false : _e, _f = _a.onChange, onChange = _f === void 0 ? function () { return undefined; } : _f, onClickLogout = _a.onClickLogout, isMultipleProfile = _a.isMultipleProfile, onClickAddProfile = _a.onClickAddProfile,
|
|
19
|
+
var username = _a.username, email = _a.email, _e = _a.isShowProfile, isShowProfile = _e === void 0 ? false : _e, _f = _a.onChange, onChange = _f === void 0 ? function () { return undefined; } : _f, onClickLogout = _a.onClickLogout, isMultipleProfile = _a.isMultipleProfile, onClickAddProfile = _a.onClickAddProfile, _g = _a.width, width = _g === void 0 ? 100 : _g;
|
|
20
20
|
var ref = useRef(null);
|
|
21
21
|
var initials = (_d = (_c = (_b = username === null || username === void 0 ? void 0 : username.split(' ')) === null || _b === void 0 ? void 0 : _b.map(function (n) { return n[0]; })) === null || _c === void 0 ? void 0 : _c.join('.')) === null || _d === void 0 ? void 0 : _d.toUpperCase();
|
|
22
22
|
useEffect(function () {
|
|
@@ -31,6 +31,6 @@ function Profile(_a) {
|
|
|
31
31
|
document.removeEventListener('mousedown', checkIfClickedOutside);
|
|
32
32
|
};
|
|
33
33
|
}, [isShowProfile, onChange]);
|
|
34
|
-
return (_jsxs("div", __assign({ ref: ref, className: "smartapp-profile__container" }, { children: [_jsx("div", __assign({ onClick: function () { return onChange(!isShowProfile); }, className: "smartapp-profile__avatar" }, { children: initials })), isShowProfile && (_jsxs("div", __assign({ style: { width: "".concat(width, "
|
|
34
|
+
return (_jsxs("div", __assign({ ref: ref, className: "smartapp-profile__container" }, { children: [_jsx("div", __assign({ onClick: function () { return onChange(!isShowProfile); }, className: "smartapp-profile__avatar" }, { children: initials })), isShowProfile && (_jsxs("div", __assign({ style: { width: "".concat(width, "%") }, className: "smartapp-profile" }, { children: [_jsxs("div", __assign({ className: "smartapp-profile__current-profile" }, { children: [_jsxs("div", __assign({ className: "smartapp-profile__current-profile--info" }, { children: [_jsx("div", __assign({ className: "smartapp-profile__avatar" }, { children: initials })), _jsxs("div", __assign({ className: "smartapp-profile__current-profile--info__data" }, { children: [_jsx("p", __assign({ className: "smartapp-profile__current-profile--info__data--username" }, { children: username })), email && _jsx("p", __assign({ className: "smartapp-profile__current-profile--info__data--email" }, { children: email }))] }))] })), _jsx("div", __assign({ onClick: onClickLogout, className: "smartapp-profile__current-profile--logout" }, { children: _jsx(Logout, {}) }))] })), isMultipleProfile && (_jsxs("div", __assign({ onClick: onClickAddProfile, className: "smartapp-profile__add-profile" }, { children: [_jsx("div", __assign({ className: "smartapp-profile__add-profile--icon" }, { children: _jsx(AddProfile, {}) })), _jsx("p", __assign({ className: "smartapp-profile__add-profile--title" }, { children: "\u0414\u043E\u0431\u0430\u0432\u044C\u0442\u0435 \u0430\u043A\u043A\u0430\u0443\u043D\u0442" }))] })))] })))] })));
|
|
35
35
|
}
|
|
36
36
|
export default Profile;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { ISwitcherProps } from './types';
|
|
3
2
|
import '../../styles/stories.module.scss';
|
|
4
|
-
declare function Switcher({ pages }: ISwitcherProps): JSX.Element;
|
|
3
|
+
declare function Switcher({ pages }: ISwitcherProps): import("react/jsx-runtime").JSX.Element;
|
|
5
4
|
export default Switcher;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { IToggleProps } from './types';
|
|
3
2
|
import '../../styles/stories.module.scss';
|
|
4
|
-
declare function Toggle({ id, onClick, checked }: IToggleProps): JSX.Element;
|
|
3
|
+
declare function Toggle({ id, onClick, checked }: IToggleProps): import("react/jsx-runtime").JSX.Element;
|
|
5
4
|
export default Toggle;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@expressms/smartapp-ui",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.6",
|
|
4
4
|
"description": "SmartApp UI library",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"main": "build/main/index.js",
|
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
"@storybook/addon-links": "^6.5.15",
|
|
18
18
|
"@storybook/preset-scss": "^1.0.3",
|
|
19
19
|
"@storybook/react": "^6.5.15",
|
|
20
|
-
"@svgr/webpack": "
|
|
20
|
+
"@svgr/webpack": "5.5",
|
|
21
21
|
"@testing-library/jest-dom": "^5.16.5",
|
|
22
22
|
"@testing-library/react": "^13.4.0",
|
|
23
23
|
"@testing-library/user-event": "^13.5.0",
|
|
@@ -28,8 +28,8 @@
|
|
|
28
28
|
"@types/react-datepicker": "^4.8.0",
|
|
29
29
|
"@types/react-dom": "^18.0.10",
|
|
30
30
|
"@types/react-slick": "^0.23.10",
|
|
31
|
-
"babel-jest": "^
|
|
32
|
-
"babel-loader": "
|
|
31
|
+
"babel-jest": "^18.0.0",
|
|
32
|
+
"babel-loader": "8.2.3",
|
|
33
33
|
"babel-plugin-named-asset-import": "^0.3.8",
|
|
34
34
|
"babel-preset-react-app": "^10.0.1",
|
|
35
35
|
"bfj": "^7.0.2",
|
|
@@ -44,16 +44,17 @@
|
|
|
44
44
|
"dotenv-expand": "^5.1.0",
|
|
45
45
|
"enhanced-resolve": "^5.12.0",
|
|
46
46
|
"eslint": "^8.3.0",
|
|
47
|
-
"eslint-config-react-app": "^
|
|
47
|
+
"eslint-config-react-app": "^6.0.0",
|
|
48
48
|
"eslint-webpack-plugin": "^3.1.1",
|
|
49
49
|
"file-loader": "^6.2.0",
|
|
50
50
|
"fs-extra": "^10.0.0",
|
|
51
51
|
"html-webpack-plugin": "^5.5.0",
|
|
52
52
|
"identity-obj-proxy": "^3.0.0",
|
|
53
|
-
"jest": "^
|
|
53
|
+
"jest": "^25.0.0",
|
|
54
54
|
"jest-resolve": "^27.4.2",
|
|
55
55
|
"jest-watch-typeahead": "^1.0.0",
|
|
56
56
|
"mini-css-extract-plugin": "^2.4.5",
|
|
57
|
+
"node-sass": "^8.0.0",
|
|
57
58
|
"postcss": "^8.4.4",
|
|
58
59
|
"postcss-flexbugs-fixes": "^5.0.2",
|
|
59
60
|
"postcss-loader": "^6.2.1",
|
|
@@ -74,7 +75,7 @@
|
|
|
74
75
|
"reactjs-popup": "^2.0.5",
|
|
75
76
|
"resolve": "^1.20.0",
|
|
76
77
|
"resolve-url-loader": "2.3.1",
|
|
77
|
-
"sass": "^1.
|
|
78
|
+
"sass": "^1.57.1",
|
|
78
79
|
"sass-loader": "^12.3.0",
|
|
79
80
|
"semver": "^7.3.5",
|
|
80
81
|
"source-map-loader": "^3.0.0",
|