@itcase/ui 1.2.0 → 1.2.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{Button-CmZbTSyf.js → Button-BA3ZeUjj.js} +5 -5
- package/dist/{Button-DvDXesom.js → Button-VkatyBmt.js} +5 -5
- package/dist/cjs/components/Button.js +1 -1
- package/dist/cjs/components/CookiesWarning.js +1 -1
- package/dist/cjs/components/DatePicker.js +1 -1
- package/dist/cjs/components/Response.js +1 -1
- package/dist/components/Button.js +1 -1
- package/dist/components/CookiesWarning.js +1 -1
- package/dist/components/DatePicker.js +1 -1
- package/dist/components/Response.js +1 -1
- package/dist/css/components/Chips/Chips.css +1 -1
- package/dist/css/components/DatePicker/DatePicker.css +1 -1
- package/dist/css/components/Notification/Notification.css +11 -0
- package/dist/css/components/Notification/css/__item/notification__item_status.css +11 -0
- package/dist/css/components/Swiper/Swiper.css +0 -3
- package/package.json +11 -10
|
@@ -15,11 +15,11 @@ var buttonConfig = {
|
|
|
15
15
|
},
|
|
16
16
|
};
|
|
17
17
|
var Button = React.forwardRef(function Button(props, ref) {
|
|
18
|
-
var
|
|
18
|
+
var children = props.children; props.width; var isDisabled = props.isDisabled, after = props.after, appearance = props.appearance, Badge = props.Badge, before = props.before, className = props.className, dataTestId = props.dataTestId, dataTour = props.dataTour, fillIcon = props.fillIcon, fillIconAfter = props.fillIconAfter, fillIconBefore = props.fillIconBefore, href = props.href, _b = props.htmlType, htmlType = _b === void 0 ? 'button' : _b, icon = props.icon, iconAfter = props.iconAfter, iconAfterFill = props.iconAfterFill, iconAfterFillSize = props.iconAfterFillSize, iconAfterShape = props.iconAfterShape, iconAfterSize = props.iconAfterSize, iconAfterSrc = props.iconAfterSrc, iconBefore = props.iconBefore, iconBeforeFill = props.iconBeforeFill, iconBeforeFillSize = props.iconBeforeFillSize, iconBeforeShape = props.iconBeforeShape, iconBeforeSize = props.iconBeforeSize, iconBeforeSrc = props.iconBeforeSrc, iconFill = props.iconFill, iconFillSize = props.iconFillSize, iconShape = props.iconShape, iconSize = props.iconSize, iconSrc = props.iconSrc, label = props.label, labelTextColor = props.labelTextColor, labelTextColorHover = props.labelTextColorHover, labelTextSize = props.labelTextSize, labelTextSizeMobile = props.labelTextSizeMobile,
|
|
19
19
|
// @ts-expect-error
|
|
20
|
-
labelTextTruncate = props.labelTextTruncate,
|
|
20
|
+
labelTextTruncate = props.labelTextTruncate, labelTextWeight = props.labelTextWeight,
|
|
21
21
|
// @ts-expect-error
|
|
22
|
-
labelTextWidth = props.labelTextWidth, labelTextWrap = props.labelTextWrap,
|
|
22
|
+
labelTextWidth = props.labelTextWidth, labelTextWrap = props.labelTextWrap, link = props.link, loaderFill = props.loaderFill, loaderItemFill = props.loaderItemFill, _c = props.loaderSet, loaderSet = _c === void 0 ? 'simple' : _c, _d = props.loading, loading = _d === void 0 ? false : _d, rel = props.rel, set = props.set; props.size; var target = props.target, onClick = props.onClick, onMouseDown = props.onMouseDown;
|
|
23
23
|
var widthClass = useDeviceTargetClass(props, {
|
|
24
24
|
prefix: 'button_width_',
|
|
25
25
|
propsKey: 'width',
|
|
@@ -57,7 +57,7 @@ var Button = React.forwardRef(function Button(props, ref) {
|
|
|
57
57
|
propsKey: 'elevation',
|
|
58
58
|
});
|
|
59
59
|
// @ts-expect-error
|
|
60
|
-
var _f = useStyles(props),
|
|
60
|
+
var _f = useStyles(props), labelStyles = _f.label, buttonStyles = _f.styles;
|
|
61
61
|
var appearanceConfig = appearance && buttonConfig.appearance && buttonConfig.appearance[appearance];
|
|
62
62
|
return (jsx(LinkWrapper, { className: clsx(className, 'button', label && 'button_type_label', borderColorClass ? 'button_set_outlined' : set ? "button_set_".concat(set) : 'button_set_filled', borderWidthClass ||
|
|
63
63
|
((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.borderWidth) &&
|
|
@@ -84,7 +84,7 @@ var Button = React.forwardRef(function Button(props, ref) {
|
|
|
84
84
|
iconBefore ||
|
|
85
85
|
iconBeforeSrc ||
|
|
86
86
|
iconSrc) &&
|
|
87
|
-
'button_type_with-icon', loading && 'button_state_loading button_type_loader'), "data-test-id": dataTestId && "".concat(dataTestId, "Button"), "data-tour": dataTour, DefaultComponent: "button", disabled: isDisabled, href: link || href, rel: rel, style: buttonStyles, target: target, type: htmlType, onClick: onClick, onMouseDown: onMouseDown, children: jsxs("div", { className: "button__wrapper", ref: ref, children: [loading && (jsx(Loader, { className:
|
|
87
|
+
'button_type_with-icon', loading && 'button_state_loading button_type_loader'), "data-test-id": dataTestId && "".concat(dataTestId, "Button"), "data-tour": dataTour, DefaultComponent: "button", disabled: isDisabled, href: link || href, rel: rel, style: buttonStyles, target: target, type: htmlType, onClick: onClick, onMouseDown: onMouseDown, children: jsxs("div", { className: "button__wrapper", ref: ref, children: [loading && (jsx(Loader, { className: clsx(className, 'button__loader', shapeClass), fill: loaderFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.loaderFill), itemFill: loaderItemFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.loaderItemFill), set: loaderSet })), before, (iconBefore || iconBeforeSrc) && (jsx(Icon, { className: "button__icon_before", fill: fillIconBefore, fillSize: iconBeforeFillSize, iconFill: iconBeforeFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconBeforeFill), imageSrc: iconBeforeSrc, shape: iconBeforeShape, size: iconBeforeSize, SvgImage: iconBefore })), (icon || iconSrc) && (jsx(Icon, { className: "button__icon", fill: fillIcon, fillSize: iconFillSize, iconFill: iconFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconFill), imageSrc: iconSrc, shape: iconShape, size: iconSize, SvgImage: icon })), (children || label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label)) && (jsx(Text, { className: "button__label", width: labelTextWidth, size: labelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextSize) || undefined, sizeMobile: labelTextSizeMobile, style: labelStyles, textColor: labelTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColor), textColorHover: labelTextColorHover || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColorHover), textTruncate: labelTextTruncate, textWeight: labelTextWeight, textWrap: labelTextWrap, children: children || label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label) })), (iconAfter || iconAfterSrc) && (jsx(Icon, { className: "button__icon_after", fill: fillIconAfter, fillSize: iconAfterFillSize, iconFill: iconAfterFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconAfterFill), imageSrc: iconAfterSrc, shape: iconAfterShape, size: iconAfterSize, SvgImage: iconAfter })), Badge, after] }) }));
|
|
88
88
|
});
|
|
89
89
|
|
|
90
90
|
export { Button as B, buttonConfig as b };
|
|
@@ -17,11 +17,11 @@ var buttonConfig = {
|
|
|
17
17
|
},
|
|
18
18
|
};
|
|
19
19
|
var Button = React.forwardRef(function Button(props, ref) {
|
|
20
|
-
var
|
|
20
|
+
var children = props.children; props.width; var isDisabled = props.isDisabled, after = props.after, appearance = props.appearance, Badge = props.Badge, before = props.before, className = props.className, dataTestId = props.dataTestId, dataTour = props.dataTour, fillIcon = props.fillIcon, fillIconAfter = props.fillIconAfter, fillIconBefore = props.fillIconBefore, href = props.href, _b = props.htmlType, htmlType = _b === void 0 ? 'button' : _b, icon = props.icon, iconAfter = props.iconAfter, iconAfterFill = props.iconAfterFill, iconAfterFillSize = props.iconAfterFillSize, iconAfterShape = props.iconAfterShape, iconAfterSize = props.iconAfterSize, iconAfterSrc = props.iconAfterSrc, iconBefore = props.iconBefore, iconBeforeFill = props.iconBeforeFill, iconBeforeFillSize = props.iconBeforeFillSize, iconBeforeShape = props.iconBeforeShape, iconBeforeSize = props.iconBeforeSize, iconBeforeSrc = props.iconBeforeSrc, iconFill = props.iconFill, iconFillSize = props.iconFillSize, iconShape = props.iconShape, iconSize = props.iconSize, iconSrc = props.iconSrc, label = props.label, labelTextColor = props.labelTextColor, labelTextColorHover = props.labelTextColorHover, labelTextSize = props.labelTextSize, labelTextSizeMobile = props.labelTextSizeMobile,
|
|
21
21
|
// @ts-expect-error
|
|
22
|
-
labelTextTruncate = props.labelTextTruncate,
|
|
22
|
+
labelTextTruncate = props.labelTextTruncate, labelTextWeight = props.labelTextWeight,
|
|
23
23
|
// @ts-expect-error
|
|
24
|
-
labelTextWidth = props.labelTextWidth, labelTextWrap = props.labelTextWrap,
|
|
24
|
+
labelTextWidth = props.labelTextWidth, labelTextWrap = props.labelTextWrap, link = props.link, loaderFill = props.loaderFill, loaderItemFill = props.loaderItemFill, _c = props.loaderSet, loaderSet = _c === void 0 ? 'simple' : _c, _d = props.loading, loading = _d === void 0 ? false : _d, rel = props.rel, set = props.set; props.size; var target = props.target, onClick = props.onClick, onMouseDown = props.onMouseDown;
|
|
25
25
|
var widthClass = useDeviceTargetClass.useDeviceTargetClass(props, {
|
|
26
26
|
prefix: 'button_width_',
|
|
27
27
|
propsKey: 'width',
|
|
@@ -59,7 +59,7 @@ var Button = React.forwardRef(function Button(props, ref) {
|
|
|
59
59
|
propsKey: 'elevation',
|
|
60
60
|
});
|
|
61
61
|
// @ts-expect-error
|
|
62
|
-
var _f = useStyles.useStyles(props),
|
|
62
|
+
var _f = useStyles.useStyles(props), labelStyles = _f.label, buttonStyles = _f.styles;
|
|
63
63
|
var appearanceConfig = appearance && buttonConfig.appearance && buttonConfig.appearance[appearance];
|
|
64
64
|
return (jsxRuntime.jsx(Link.LinkWrapper, { className: clsx(className, 'button', label && 'button_type_label', borderColorClass ? 'button_set_outlined' : set ? "button_set_".concat(set) : 'button_set_filled', borderWidthClass ||
|
|
65
65
|
((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.borderWidth) &&
|
|
@@ -86,7 +86,7 @@ var Button = React.forwardRef(function Button(props, ref) {
|
|
|
86
86
|
iconBefore ||
|
|
87
87
|
iconBeforeSrc ||
|
|
88
88
|
iconSrc) &&
|
|
89
|
-
'button_type_with-icon', loading && 'button_state_loading button_type_loader'), "data-test-id": dataTestId && "".concat(dataTestId, "Button"), "data-tour": dataTour, DefaultComponent: "button", disabled: isDisabled, href: link || href, rel: rel, style: buttonStyles, target: target, type: htmlType, onClick: onClick, onMouseDown: onMouseDown, children: jsxRuntime.jsxs("div", { className: "button__wrapper", ref: ref, children: [loading && (jsxRuntime.jsx(Loader.Loader, { className:
|
|
89
|
+
'button_type_with-icon', loading && 'button_state_loading button_type_loader'), "data-test-id": dataTestId && "".concat(dataTestId, "Button"), "data-tour": dataTour, DefaultComponent: "button", disabled: isDisabled, href: link || href, rel: rel, style: buttonStyles, target: target, type: htmlType, onClick: onClick, onMouseDown: onMouseDown, children: jsxRuntime.jsxs("div", { className: "button__wrapper", ref: ref, children: [loading && (jsxRuntime.jsx(Loader.Loader, { className: clsx(className, 'button__loader', shapeClass), fill: loaderFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.loaderFill), itemFill: loaderItemFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.loaderItemFill), set: loaderSet })), before, (iconBefore || iconBeforeSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "button__icon_before", fill: fillIconBefore, fillSize: iconBeforeFillSize, iconFill: iconBeforeFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconBeforeFill), imageSrc: iconBeforeSrc, shape: iconBeforeShape, size: iconBeforeSize, SvgImage: iconBefore })), (icon || iconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "button__icon", fill: fillIcon, fillSize: iconFillSize, iconFill: iconFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconFill), imageSrc: iconSrc, shape: iconShape, size: iconSize, SvgImage: icon })), (children || label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label)) && (jsxRuntime.jsx(Text.Text, { className: "button__label", width: labelTextWidth, size: labelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextSize) || undefined, sizeMobile: labelTextSizeMobile, style: labelStyles, textColor: labelTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColor), textColorHover: labelTextColorHover || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColorHover), textTruncate: labelTextTruncate, textWeight: labelTextWeight, textWrap: labelTextWrap, children: children || label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label) })), (iconAfter || iconAfterSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "button__icon_after", fill: fillIconAfter, fillSize: iconAfterFillSize, iconFill: iconAfterFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconAfterFill), imageSrc: iconAfterSrc, shape: iconAfterShape, size: iconAfterSize, SvgImage: iconAfter })), Badge, after] }) }));
|
|
90
90
|
});
|
|
91
91
|
|
|
92
92
|
exports.Button = Button;
|
|
@@ -5,7 +5,7 @@ var React = require('react');
|
|
|
5
5
|
var clsx = require('clsx');
|
|
6
6
|
var Cookies = require('js-cookie');
|
|
7
7
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
8
|
-
var Button = require('../../Button-
|
|
8
|
+
var Button = require('../../Button-VkatyBmt.js');
|
|
9
9
|
var Group = require('../../Group-Buo_BxGT.js');
|
|
10
10
|
var Text = require('../../Text-_YhyTsQ1.js');
|
|
11
11
|
require('lodash/castArray');
|
|
@@ -6,7 +6,7 @@ var React = require('react');
|
|
|
6
6
|
var clsx = require('clsx');
|
|
7
7
|
var DatePicker = require('react-datepicker');
|
|
8
8
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
9
|
-
var Button = require('../../Button-
|
|
9
|
+
var Button = require('../../Button-VkatyBmt.js');
|
|
10
10
|
var Icon = require('../../Icon-Co5Mtpt_.js');
|
|
11
11
|
var Input = require('../../Input-C7gBdx1m.js');
|
|
12
12
|
var Label = require('../../Label-CpSzGRtr.js');
|
|
@@ -6,7 +6,7 @@ var clsx = require('clsx');
|
|
|
6
6
|
var SVG = require('react-inlinesvg');
|
|
7
7
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
8
8
|
var useStyles = require('../hooks/useStyles.js');
|
|
9
|
-
var Button = require('../../Button-
|
|
9
|
+
var Button = require('../../Button-VkatyBmt.js');
|
|
10
10
|
var Group = require('../../Group-Buo_BxGT.js');
|
|
11
11
|
var Text = require('../../Text-_YhyTsQ1.js');
|
|
12
12
|
var Title = require('../../Title-zwP6c2U2.js');
|
|
@@ -3,7 +3,7 @@ import { useRef, useMemo, useCallback, useEffect } from 'react';
|
|
|
3
3
|
import clsx from 'clsx';
|
|
4
4
|
import Cookies from 'js-cookie';
|
|
5
5
|
import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
|
|
6
|
-
import { B as Button } from '../Button-
|
|
6
|
+
import { B as Button } from '../Button-BA3ZeUjj.js';
|
|
7
7
|
import { G as Group } from '../Group-BXfLh7AZ.js';
|
|
8
8
|
import { T as Text } from '../Text-CG3xPG27.js';
|
|
9
9
|
import 'lodash/castArray';
|
|
@@ -4,7 +4,7 @@ import React, { useMemo, useCallback, useRef, useState, useEffect } from 'react'
|
|
|
4
4
|
import clsx from 'clsx';
|
|
5
5
|
import DatePicker from 'react-datepicker';
|
|
6
6
|
import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
|
|
7
|
-
import { B as Button } from '../Button-
|
|
7
|
+
import { B as Button } from '../Button-BA3ZeUjj.js';
|
|
8
8
|
import { I as Icon } from '../Icon-CsE2-ieX.js';
|
|
9
9
|
import { I as Input } from '../Input-BQ6Plt1n.js';
|
|
10
10
|
import { L as Label } from '../Label-BA_CnRBq.js';
|
|
@@ -4,7 +4,7 @@ import clsx from 'clsx';
|
|
|
4
4
|
import SVG from 'react-inlinesvg';
|
|
5
5
|
import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
|
|
6
6
|
import { useStyles } from '../hooks/useStyles.js';
|
|
7
|
-
import { B as Button } from '../Button-
|
|
7
|
+
import { B as Button } from '../Button-BA3ZeUjj.js';
|
|
8
8
|
import { G as Group } from '../Group-BXfLh7AZ.js';
|
|
9
9
|
import { T as Text } from '../Text-CG3xPG27.js';
|
|
10
10
|
import { T as Title } from '../Title-BfSFPJtJ.js';
|
|
@@ -122,6 +122,17 @@
|
|
|
122
122
|
}
|
|
123
123
|
}
|
|
124
124
|
}
|
|
125
|
+
&_info {
|
|
126
|
+
background: var(--color-info-primary);
|
|
127
|
+
^^&-wrapper {
|
|
128
|
+
^^^&-title {
|
|
129
|
+
color: var(--color-info-text-primary);
|
|
130
|
+
}
|
|
131
|
+
^^^&-text {
|
|
132
|
+
color: var(--color-info-text-primary);
|
|
133
|
+
}
|
|
134
|
+
}
|
|
135
|
+
}
|
|
125
136
|
}
|
|
126
137
|
}
|
|
127
138
|
.notification__item {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@itcase/ui",
|
|
3
|
-
"version": "1.2.
|
|
3
|
+
"version": "1.2.1",
|
|
4
4
|
"description": "UI components (Modal, Loader, Popup, etc)",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"Modal",
|
|
@@ -14,31 +14,32 @@
|
|
|
14
14
|
"typesVersions": {
|
|
15
15
|
"*": {
|
|
16
16
|
"components/*": [
|
|
17
|
-
"dist/types/components
|
|
17
|
+
"dist/types/components/*/*.d.ts"
|
|
18
18
|
],
|
|
19
19
|
"constants": [
|
|
20
|
-
"dist/types/constants
|
|
20
|
+
"dist/types/constants/*.d.ts"
|
|
21
21
|
],
|
|
22
22
|
"types": [
|
|
23
|
-
"dist/types/types
|
|
23
|
+
"dist/types/types/*.d.ts"
|
|
24
24
|
],
|
|
25
25
|
"constants/*": [
|
|
26
|
-
"dist/types/constants
|
|
26
|
+
"dist/types/constants/*.d.ts"
|
|
27
27
|
],
|
|
28
28
|
"context/*": [
|
|
29
|
-
"dist/types/context
|
|
29
|
+
"dist/types/context/*.d.ts"
|
|
30
30
|
],
|
|
31
31
|
"hooks/*": [
|
|
32
|
-
"dist/types/hooks
|
|
32
|
+
"dist/types/hooks/*.d.ts"
|
|
33
33
|
],
|
|
34
34
|
"stories/*": [
|
|
35
|
-
"dist/types/stories
|
|
35
|
+
"dist/types/stories/*.d.ts"
|
|
36
36
|
]
|
|
37
37
|
}
|
|
38
38
|
},
|
|
39
39
|
"exports": {
|
|
40
|
-
"./types": {
|
|
41
|
-
"
|
|
40
|
+
"./types/components/Modal/Modal.interface": {
|
|
41
|
+
"import": "./dist/types/components/Modal/Modal.interface.d.ts",
|
|
42
|
+
"types": "./dist/types/components/Modal/Modal.interface.d.ts"
|
|
42
43
|
},
|
|
43
44
|
"./components/*": {
|
|
44
45
|
"import": "./dist/components/*.js",
|