@itcase/ui 1.0.3 → 1.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Accordion.js +1 -1
- package/dist/components/Avatar.js +1 -1
- package/dist/components/Background.js +1 -1
- package/dist/components/Breadcrumbs.js +1 -1
- package/dist/components/Button.js +1 -1
- package/dist/components/Caption.js +1 -1
- package/dist/components/Card.js +1 -1
- package/dist/components/Cell.js +1 -1
- package/dist/components/Checkbox.js +4 -4
- package/dist/components/Chips.js +2 -2
- package/dist/components/ContextMenu.js +4 -2
- package/dist/components/CookiesWarning.js +1 -1
- package/dist/components/Counter.js +1 -1
- package/dist/components/Divider.js +1 -1
- package/dist/components/Dropdown.js +87 -27
- package/dist/components/Emoji.js +1 -1
- package/dist/components/Fader.js +1 -1
- package/dist/components/Flex.js +1 -1
- package/dist/components/FormField.js +1 -1
- package/dist/components/Grid.js +1 -1
- package/dist/components/Group.js +1 -1
- package/dist/components/Icon.js +1 -1
- package/dist/components/Image.js +1 -1
- package/dist/components/Label.js +3 -2
- package/dist/components/LanguageSelector.js +1 -1
- package/dist/components/Link.js +1 -1
- package/dist/components/List.js +1 -1
- package/dist/components/Loader.js +1 -1
- package/dist/components/Logo.js +13 -11
- package/dist/components/Menu.js +1 -1
- package/dist/components/MenuItem.js +1 -1
- package/dist/components/Notification.js +1 -1
- package/dist/components/Pagination.js +1 -1
- package/dist/components/Popup.js +3 -2
- package/dist/components/Profile.js +1 -1
- package/dist/components/RangeSlider.js +18 -10
- package/dist/components/Search.js +2 -18301
- package/dist/components/Select.js +217 -110
- package/dist/components/SiteMenu.js +1 -1
- package/dist/components/Swiper.js +3 -2
- package/dist/components/Switch.js +20 -5
- package/dist/components/Text.js +1 -1
- package/dist/components/Tile.js +1 -1
- package/dist/components/Title.js +1 -1
- package/dist/components/Tooltip.js +1 -1
- package/dist/components/Video.js +1 -1
- package/dist/components/Wrapper.js +1 -1
- package/dist/hooks/useStyles.js +1 -1
- package/dist/{useStyles-77c3b520.js → useStyles-e4accb53.js} +1 -1
- package/package.json +1 -1
- package/dist/_commonjsHelpers-facfc6d6.js +0 -7
|
@@ -10,7 +10,7 @@ var shape = require('../constants/componentProps/shape.js');
|
|
|
10
10
|
var index = require('./Icon.js');
|
|
11
11
|
var index$1 = require('../index-f1505c84.js');
|
|
12
12
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
13
|
-
var useStyles = require('../useStyles-
|
|
13
|
+
var useStyles = require('../useStyles-e4accb53.js');
|
|
14
14
|
require('react-inlinesvg');
|
|
15
15
|
require('../constants/componentProps/iconSize.js');
|
|
16
16
|
require('../constants/componentProps/strokeColor.js');
|
|
@@ -12,7 +12,7 @@ require('../constants/componentProps/resizeMode.js');
|
|
|
12
12
|
require('../constants/componentProps/shape.js');
|
|
13
13
|
require('../constants/componentProps/verticalContentAlign.js');
|
|
14
14
|
require('../constants/componentProps/width.js');
|
|
15
|
-
require('../useStyles-
|
|
15
|
+
require('../useStyles-e4accb53.js');
|
|
16
16
|
require('lodash/camelCase');
|
|
17
17
|
require('lodash/maxBy');
|
|
18
18
|
require('lodash/upperFirst');
|
|
@@ -7,7 +7,7 @@ var fill = require('../constants/componentProps/fill.js');
|
|
|
7
7
|
var shape = require('../constants/componentProps/shape.js');
|
|
8
8
|
var width = require('../constants/componentProps/width.js');
|
|
9
9
|
var position = require('../constants/componentProps/position.js');
|
|
10
|
-
var useStyles = require('../useStyles-
|
|
10
|
+
var useStyles = require('../useStyles-e4accb53.js');
|
|
11
11
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
12
12
|
require('lodash/camelCase');
|
|
13
13
|
require('lodash/maxBy');
|
|
@@ -14,7 +14,7 @@ var index$1 = require('./Icon.js');
|
|
|
14
14
|
var index$2 = require('./Text.js');
|
|
15
15
|
var index = require('./Link.js');
|
|
16
16
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
17
|
-
var useStyles = require('../useStyles-
|
|
17
|
+
var useStyles = require('../useStyles-e4accb53.js');
|
|
18
18
|
require('react-inlinesvg');
|
|
19
19
|
require('../constants/componentProps/iconSize.js');
|
|
20
20
|
require('../constants/componentProps/strokeColor.js');
|
|
@@ -7,7 +7,7 @@ var fill = require('../constants/componentProps/fill.js');
|
|
|
7
7
|
var fillGradient = require('../constants/componentProps/fillGradient.js');
|
|
8
8
|
var captionPosition = require('../constants/componentProps/captionPosition.js');
|
|
9
9
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
10
|
-
var useStyles = require('../useStyles-
|
|
10
|
+
var useStyles = require('../useStyles-e4accb53.js');
|
|
11
11
|
require('lodash/castArray');
|
|
12
12
|
require('lodash/camelCase');
|
|
13
13
|
require('../context/UIContext.js');
|
package/dist/components/Card.js
CHANGED
|
@@ -14,7 +14,7 @@ require('../constants/componentProps/textColorActive.js');
|
|
|
14
14
|
require('../constants/componentProps/textColorHover.js');
|
|
15
15
|
require('../constants/componentProps/textStyle.js');
|
|
16
16
|
require('../constants/componentProps/textWeight.js');
|
|
17
|
-
require('../useStyles-
|
|
17
|
+
require('../useStyles-e4accb53.js');
|
|
18
18
|
require('lodash/camelCase');
|
|
19
19
|
require('lodash/maxBy');
|
|
20
20
|
require('lodash/upperFirst');
|
package/dist/components/Cell.js
CHANGED
|
@@ -13,7 +13,7 @@ require('../constants/componentProps/iconSize.js');
|
|
|
13
13
|
require('../constants/componentProps/shape.js');
|
|
14
14
|
require('../constants/componentProps/strokeColor.js');
|
|
15
15
|
require('./Link.js');
|
|
16
|
-
require('../useStyles-
|
|
16
|
+
require('../useStyles-e4accb53.js');
|
|
17
17
|
require('lodash/camelCase');
|
|
18
18
|
require('lodash/maxBy');
|
|
19
19
|
require('lodash/upperFirst');
|
|
@@ -49,12 +49,12 @@ function Checkbox(props) {
|
|
|
49
49
|
return /*#__PURE__*/React__default.default.createElement("div", {
|
|
50
50
|
className: clsx__default.default(className, 'checkbox', fillCheckmarkClass, fillCheckedClass, fillClass, fillDisableClass, shapeClass, borderColorClass)
|
|
51
51
|
}, /*#__PURE__*/React__default.default.createElement("input", {
|
|
52
|
-
type: "checkbox",
|
|
53
|
-
id: id,
|
|
54
52
|
checked: checked,
|
|
53
|
+
className: "checkbox__checkbox",
|
|
55
54
|
disabled: disabled,
|
|
56
|
-
|
|
57
|
-
|
|
55
|
+
id: id,
|
|
56
|
+
type: "checkbox",
|
|
57
|
+
onChange: onChange
|
|
58
58
|
}), /*#__PURE__*/React__default.default.createElement("div", {
|
|
59
59
|
className: "checkbox__bg"
|
|
60
60
|
}, "\xA0"), /*#__PURE__*/React__default.default.createElement("div", {
|
package/dist/components/Chips.js
CHANGED
|
@@ -11,7 +11,7 @@ var fill = require('../constants/componentProps/fill.js');
|
|
|
11
11
|
var shape = require('../constants/componentProps/shape.js');
|
|
12
12
|
var emojiSize = require('../constants/componentProps/emojiSize.js');
|
|
13
13
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
14
|
-
var useStyles = require('../useStyles-
|
|
14
|
+
var useStyles = require('../useStyles-e4accb53.js');
|
|
15
15
|
require('../constants/componentProps/direction.js');
|
|
16
16
|
require('../constants/componentProps/horizontalResizeMode.js');
|
|
17
17
|
require('../constants/componentProps/textColor.js');
|
|
@@ -129,7 +129,7 @@ Chips.propTypes = {
|
|
|
129
129
|
type: PropTypes__default.default.string
|
|
130
130
|
};
|
|
131
131
|
Chips.defaultProps = {
|
|
132
|
-
label: '
|
|
132
|
+
label: ''
|
|
133
133
|
};
|
|
134
134
|
|
|
135
135
|
exports.Chips = Chips;
|
|
@@ -19,7 +19,7 @@ require('../constants/componentProps/textColorHover.js');
|
|
|
19
19
|
require('../constants/componentProps/size.js');
|
|
20
20
|
require('../constants/componentProps/textStyle.js');
|
|
21
21
|
require('../constants/componentProps/textWeight.js');
|
|
22
|
-
require('../useStyles-
|
|
22
|
+
require('../useStyles-e4accb53.js');
|
|
23
23
|
require('lodash/maxBy');
|
|
24
24
|
require('lodash/upperFirst');
|
|
25
25
|
require('../hooks/styleAttributes.js');
|
|
@@ -94,6 +94,7 @@ function ContextMenuItem(props) {
|
|
|
94
94
|
iconAfterFill = props.iconAfterFill,
|
|
95
95
|
iconAfterStroke = props.iconAfterStroke;
|
|
96
96
|
props.isActive;
|
|
97
|
+
var onClick = props.onClick;
|
|
97
98
|
var labelTextSizeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
|
|
98
99
|
propsKey: 'labelTextSize'
|
|
99
100
|
});
|
|
@@ -113,7 +114,8 @@ function ContextMenuItem(props) {
|
|
|
113
114
|
});
|
|
114
115
|
return /*#__PURE__*/React__default.default.createElement("div", {
|
|
115
116
|
className: clsx__default.default(className, 'context-menu__item', fillClass, fillHoverClass),
|
|
116
|
-
id: id
|
|
117
|
+
id: id,
|
|
118
|
+
onClick: onClick
|
|
117
119
|
}, /*#__PURE__*/React__default.default.createElement("div", {
|
|
118
120
|
className: "context-menu__item-wrapper"
|
|
119
121
|
}, iconBefore && /*#__PURE__*/React__default.default.createElement(index.Icon, {
|
|
@@ -18,7 +18,7 @@ require('../constants/componentProps/textColorHover.js');
|
|
|
18
18
|
require('../constants/componentProps/size.js');
|
|
19
19
|
require('../constants/componentProps/textStyle.js');
|
|
20
20
|
require('../constants/componentProps/textWeight.js');
|
|
21
|
-
require('../useStyles-
|
|
21
|
+
require('../useStyles-e4accb53.js');
|
|
22
22
|
require('../hooks/styleAttributes.js');
|
|
23
23
|
require('../constants/componentProps/borderType.js');
|
|
24
24
|
require('../constants/componentProps/fill.js');
|
|
@@ -14,7 +14,7 @@ require('../constants/componentProps/textColorActive.js');
|
|
|
14
14
|
require('../constants/componentProps/textColorHover.js');
|
|
15
15
|
require('../constants/componentProps/textStyle.js');
|
|
16
16
|
require('../constants/componentProps/textWeight.js');
|
|
17
|
-
require('../useStyles-
|
|
17
|
+
require('../useStyles-e4accb53.js');
|
|
18
18
|
require('lodash/camelCase');
|
|
19
19
|
require('lodash/maxBy');
|
|
20
20
|
require('lodash/upperFirst');
|
|
@@ -7,7 +7,7 @@ var fill = require('../constants/componentProps/fill.js');
|
|
|
7
7
|
var size = require('../constants/componentProps/size.js');
|
|
8
8
|
var direction = require('../constants/componentProps/direction.js');
|
|
9
9
|
var width = require('../constants/componentProps/width.js');
|
|
10
|
-
var useStyles = require('../useStyles-
|
|
10
|
+
var useStyles = require('../useStyles-e4accb53.js');
|
|
11
11
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
12
12
|
require('lodash/camelCase');
|
|
13
13
|
require('lodash/maxBy');
|
|
@@ -6,20 +6,13 @@ var clsx = require('clsx');
|
|
|
6
6
|
var index = require('./Text.js');
|
|
7
7
|
var index$1 = require('./Button.js');
|
|
8
8
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
9
|
+
var useStyles = require('../useStyles-e4accb53.js');
|
|
9
10
|
require('../constants/componentProps/textColor.js');
|
|
10
11
|
require('../constants/componentProps/textColorActive.js');
|
|
11
12
|
require('../constants/componentProps/textColorHover.js');
|
|
12
13
|
require('../constants/componentProps/size.js');
|
|
13
14
|
require('../constants/componentProps/textStyle.js');
|
|
14
15
|
require('../constants/componentProps/textWeight.js');
|
|
15
|
-
require('../useStyles-77c3b520.js');
|
|
16
|
-
require('lodash/camelCase');
|
|
17
|
-
require('lodash/maxBy');
|
|
18
|
-
require('lodash/upperFirst');
|
|
19
|
-
require('../hooks/styleAttributes.js');
|
|
20
|
-
require('../context/UIContext.js');
|
|
21
|
-
require('../hooks/useMediaQueries.js');
|
|
22
|
-
require('react-responsive');
|
|
23
16
|
require('../constants/componentProps/borderType.js');
|
|
24
17
|
require('../constants/componentProps/fill.js');
|
|
25
18
|
require('../constants/componentProps/horizontalResizeMode.js');
|
|
@@ -34,6 +27,13 @@ require('./Link.js');
|
|
|
34
27
|
require('../constants/componentProps/textGradient.js');
|
|
35
28
|
require('../constants/componentProps/underline.js');
|
|
36
29
|
require('lodash/castArray');
|
|
30
|
+
require('lodash/camelCase');
|
|
31
|
+
require('../context/UIContext.js');
|
|
32
|
+
require('../hooks/useMediaQueries.js');
|
|
33
|
+
require('react-responsive');
|
|
34
|
+
require('lodash/maxBy');
|
|
35
|
+
require('lodash/upperFirst');
|
|
36
|
+
require('../hooks/styleAttributes.js');
|
|
37
37
|
|
|
38
38
|
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
39
39
|
|
|
@@ -42,17 +42,18 @@ var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
|
|
|
42
42
|
var clsx__default = /*#__PURE__*/_interopDefault(clsx);
|
|
43
43
|
|
|
44
44
|
function Dropdown(props) {
|
|
45
|
-
props.
|
|
46
|
-
|
|
45
|
+
var animationClose = props.animationClose,
|
|
46
|
+
animationOpen = props.animationOpen,
|
|
47
47
|
children = props.children,
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
label = props.label,
|
|
51
|
-
labelIcon = props.labelIcon
|
|
48
|
+
className = props.className;
|
|
49
|
+
props.id;
|
|
50
|
+
var label = props.label,
|
|
51
|
+
labelIcon = props.labelIcon,
|
|
52
|
+
labelIconFill = props.labelIconFill;
|
|
52
53
|
props.labelIconOpen;
|
|
53
|
-
var
|
|
54
|
-
|
|
55
|
-
|
|
54
|
+
var set = props.set,
|
|
55
|
+
title = props.title;
|
|
56
|
+
var dropdownRef = React.useRef(null);
|
|
56
57
|
var _useState = React.useState(false),
|
|
57
58
|
isOpen = _useState[0],
|
|
58
59
|
setIsOpen = _useState[1];
|
|
@@ -61,7 +62,7 @@ function Dropdown(props) {
|
|
|
61
62
|
}),
|
|
62
63
|
animationState = _useState2[0],
|
|
63
64
|
setAnimationState = _useState2[1];
|
|
64
|
-
var onClick = React.useCallback(function (
|
|
65
|
+
var onClick = React.useCallback(function () {
|
|
65
66
|
setIsOpen(function (prevState) {
|
|
66
67
|
return !prevState;
|
|
67
68
|
});
|
|
@@ -71,6 +72,52 @@ function Dropdown(props) {
|
|
|
71
72
|
};
|
|
72
73
|
});
|
|
73
74
|
}, []);
|
|
75
|
+
var onAnimationEnd = React.useCallback(function (event) {
|
|
76
|
+
// When component is change his visibility(display) in DOM,
|
|
77
|
+
// animation of close can run unnecessary on showing element.
|
|
78
|
+
console.info('------ onAnimationEnd -------------');
|
|
79
|
+
console.log('event: ', event);
|
|
80
|
+
console.log('event.target: ', event.target);
|
|
81
|
+
console.log('isOpen: ', isOpen);
|
|
82
|
+
console.log('animationOpen: ', animationOpen);
|
|
83
|
+
console.log('animationClose: ', animationClose);
|
|
84
|
+
// const dropdownElement = dropdownRef.current
|
|
85
|
+
// console.log('dropdownElement', dropdownElement)
|
|
86
|
+
// console.log('dropdownElement hasClass', dropdownElement.hasClass(animationClose))
|
|
87
|
+
setAnimationState(function (prevState) {
|
|
88
|
+
return {
|
|
89
|
+
className: isOpen ? prevState.className : ''
|
|
90
|
+
};
|
|
91
|
+
});
|
|
92
|
+
}, [isOpen]);
|
|
93
|
+
|
|
94
|
+
// Close dropdown by click outside
|
|
95
|
+
React.useEffect(function () {
|
|
96
|
+
console.info('--------- useEffect Dropdown -------');
|
|
97
|
+
// Add a handler to keep track of the click target.
|
|
98
|
+
function onClickWindow(event) {
|
|
99
|
+
var dropdownElement = dropdownRef.current;
|
|
100
|
+
if (dropdownElement) {
|
|
101
|
+
// Is event target inside of dropdown element
|
|
102
|
+
var isContainsTarget = dropdownElement.contains(event.target);
|
|
103
|
+
// Is dropdown element has "open" class
|
|
104
|
+
var hasOpenClass = dropdownElement.classList.contains(animationOpen);
|
|
105
|
+
if (!isContainsTarget && hasOpenClass) {
|
|
106
|
+
// Trigger close event with animation
|
|
107
|
+
// dropdownElement.click() - trigger "onClickWindow" again
|
|
108
|
+
onClick();
|
|
109
|
+
}
|
|
110
|
+
}
|
|
111
|
+
}
|
|
112
|
+
// Add event listener for current dropdown on first render
|
|
113
|
+
window.addEventListener('click', onClickWindow);
|
|
114
|
+
return function () {
|
|
115
|
+
console.info('--------- UNMOUNT useEffect Dropdown -------');
|
|
116
|
+
// Remove event listener for current dropdown on unmount
|
|
117
|
+
window.removeEventListener('click', onClickWindow);
|
|
118
|
+
};
|
|
119
|
+
}, []); // eslint-disable-line react-hooks/exhaustive-deps
|
|
120
|
+
|
|
74
121
|
var fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
|
|
75
122
|
prefix: 'fill_',
|
|
76
123
|
propsKey: 'fill'
|
|
@@ -107,29 +154,42 @@ function Dropdown(props) {
|
|
|
107
154
|
var labelTextSizeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
|
|
108
155
|
propsKey: 'labelTextSize'
|
|
109
156
|
});
|
|
157
|
+
var _useStyles = useStyles.useStyles(props),
|
|
158
|
+
styles = _useStyles.styles;
|
|
159
|
+
console.warn('====== Dropdown ========');
|
|
160
|
+
console.log('props: ', props);
|
|
161
|
+
console.log('isOpen: ', isOpen);
|
|
162
|
+
console.log('animationState: ', animationState);
|
|
110
163
|
return /*#__PURE__*/React__default.default.createElement("div", {
|
|
111
164
|
className: clsx__default.default(className, 'dropdown', set && "dropdown_set_" + set, shapeClass, fillClass, fillHoverClass, isOpen ? 'dropdown_state_open' : 'dropdown_state_close', animationState.className),
|
|
165
|
+
ref: dropdownRef,
|
|
166
|
+
style: styles,
|
|
112
167
|
onClick: onClick
|
|
113
168
|
}, title && /*#__PURE__*/React__default.default.createElement(index.Text, {
|
|
114
|
-
textColor: titleTextColorClass,
|
|
115
169
|
size: titleSizeClass,
|
|
170
|
+
textColor: titleTextColorClass,
|
|
116
171
|
textWeight: titleTextWeightClass
|
|
117
172
|
}, title), /*#__PURE__*/React__default.default.createElement(index$1.Button, {
|
|
118
173
|
className: clsx__default.default('dropdown__button', isOpen ? 'dropdown__button_state_open' : 'dropdown__button_state_close'),
|
|
119
174
|
fill: labelFillClass,
|
|
120
175
|
fillHover: labelFillHoverClass,
|
|
121
|
-
size: labelSizeClass,
|
|
122
|
-
labelTextColor: labelTextColorClass,
|
|
123
|
-
labelSize: labelTextSizeClass,
|
|
124
|
-
label: label,
|
|
125
176
|
iconAfter: labelIcon,
|
|
126
|
-
iconAfterFill: labelIconFill
|
|
127
|
-
|
|
128
|
-
|
|
177
|
+
iconAfterFill: labelIconFill,
|
|
178
|
+
label: label,
|
|
179
|
+
labelSize: labelTextSizeClass,
|
|
180
|
+
labelTextColor: labelTextColorClass,
|
|
181
|
+
size: labelSizeClass
|
|
182
|
+
}), children &&
|
|
183
|
+
/*#__PURE__*/
|
|
184
|
+
// Add "onAnimationEnd" only for wrapper for ignore dropdown button
|
|
185
|
+
React__default.default.createElement("div", {
|
|
186
|
+
className: "dropdown__wrapper",
|
|
187
|
+
onAnimationEnd: onAnimationEnd
|
|
129
188
|
}, children));
|
|
130
189
|
}
|
|
131
190
|
Dropdown.propTypes = {
|
|
132
|
-
className: PropTypes__default.default.string
|
|
191
|
+
className: PropTypes__default.default.string,
|
|
192
|
+
isCloseByClickOutside: PropTypes__default.default.bool
|
|
133
193
|
};
|
|
134
194
|
Dropdown.defaultProps = {
|
|
135
195
|
animationOpen: 'dropdown_animation_open',
|
package/dist/components/Emoji.js
CHANGED
|
@@ -8,7 +8,7 @@ var direction = require('../constants/componentProps/direction.js');
|
|
|
8
8
|
var horizontalResizeMode = require('../constants/componentProps/horizontalResizeMode.js');
|
|
9
9
|
var shape = require('../constants/componentProps/shape.js');
|
|
10
10
|
var emojiSize = require('../constants/componentProps/emojiSize.js');
|
|
11
|
-
var useStyles = require('../useStyles-
|
|
11
|
+
var useStyles = require('../useStyles-e4accb53.js');
|
|
12
12
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
13
13
|
require('lodash/camelCase');
|
|
14
14
|
require('lodash/maxBy');
|
package/dist/components/Fader.js
CHANGED
|
@@ -6,7 +6,7 @@ var clsx = require('clsx');
|
|
|
6
6
|
var fill = require('../constants/componentProps/fill.js');
|
|
7
7
|
var fillGradient = require('../constants/componentProps/fillGradient.js');
|
|
8
8
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
9
|
-
var useStyles = require('../useStyles-
|
|
9
|
+
var useStyles = require('../useStyles-e4accb53.js');
|
|
10
10
|
require('lodash/castArray');
|
|
11
11
|
require('lodash/camelCase');
|
|
12
12
|
require('../context/UIContext.js');
|
package/dist/components/Flex.js
CHANGED
|
@@ -11,7 +11,7 @@ var flexWrap = require('../constants/componentProps/flexWrap.js');
|
|
|
11
11
|
var shape = require('../constants/componentProps/shape.js');
|
|
12
12
|
var width = require('../constants/componentProps/width.js');
|
|
13
13
|
var position = require('../constants/componentProps/position.js');
|
|
14
|
-
var useStyles = require('../useStyles-
|
|
14
|
+
var useStyles = require('../useStyles-e4accb53.js');
|
|
15
15
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
16
16
|
var horizontalResizeMode = require('../constants/componentProps/horizontalResizeMode.js');
|
|
17
17
|
require('lodash/camelCase');
|
|
@@ -8,7 +8,7 @@ var size = require('../constants/componentProps/size.js');
|
|
|
8
8
|
var index$2 = require('./Divider.js');
|
|
9
9
|
var index = require('./Text.js');
|
|
10
10
|
var index$1 = require('./Icon.js');
|
|
11
|
-
var useStyles = require('../useStyles-
|
|
11
|
+
var useStyles = require('../useStyles-e4accb53.js');
|
|
12
12
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
13
13
|
var index$3 = require('./RadioButton.js');
|
|
14
14
|
require('lodash/castArray');
|
package/dist/components/Grid.js
CHANGED
|
@@ -10,7 +10,7 @@ var shape = require('../constants/componentProps/shape.js');
|
|
|
10
10
|
var horizontalResizeMode = require('../constants/componentProps/horizontalResizeMode.js');
|
|
11
11
|
var verticalResizeMode = require('../constants/componentProps/verticalResizeMode.js');
|
|
12
12
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
13
|
-
var useStyles = require('../useStyles-
|
|
13
|
+
var useStyles = require('../useStyles-e4accb53.js');
|
|
14
14
|
var UIContext = require('../context/UIContext.js');
|
|
15
15
|
var gridAlignSelf = require('../constants/componentProps/gridAlignSelf.js');
|
|
16
16
|
var gridJustifySelf = require('../constants/componentProps/gridJustifySelf.js');
|
package/dist/components/Group.js
CHANGED
|
@@ -9,7 +9,7 @@ var shape = require('../constants/componentProps/shape.js');
|
|
|
9
9
|
var stacking = require('../constants/componentProps/stacking.js');
|
|
10
10
|
var wrap = require('../constants/componentProps/wrap.js');
|
|
11
11
|
var width = require('../constants/componentProps/width.js');
|
|
12
|
-
var useStyles = require('../useStyles-
|
|
12
|
+
var useStyles = require('../useStyles-e4accb53.js');
|
|
13
13
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
14
14
|
require('lodash/camelCase');
|
|
15
15
|
require('lodash/maxBy');
|
package/dist/components/Icon.js
CHANGED
|
@@ -10,7 +10,7 @@ var shape = require('../constants/componentProps/shape.js');
|
|
|
10
10
|
var strokeColor = require('../constants/componentProps/strokeColor.js');
|
|
11
11
|
var index = require('./Link.js');
|
|
12
12
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
13
|
-
var useStyles = require('../useStyles-
|
|
13
|
+
var useStyles = require('../useStyles-e4accb53.js');
|
|
14
14
|
require('../constants/componentProps/size.js');
|
|
15
15
|
require('../constants/componentProps/textColor.js');
|
|
16
16
|
require('../constants/componentProps/textGradient.js');
|
package/dist/components/Image.js
CHANGED
|
@@ -9,7 +9,7 @@ var resizeMode = require('../constants/componentProps/resizeMode.js');
|
|
|
9
9
|
var shape = require('../constants/componentProps/shape.js');
|
|
10
10
|
var verticalContentAlign = require('../constants/componentProps/verticalContentAlign.js');
|
|
11
11
|
var width = require('../constants/componentProps/width.js');
|
|
12
|
-
var useStyles = require('../useStyles-
|
|
12
|
+
var useStyles = require('../useStyles-e4accb53.js');
|
|
13
13
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
14
14
|
require('lodash/camelCase');
|
|
15
15
|
require('lodash/maxBy');
|
package/dist/components/Label.js
CHANGED
|
@@ -10,7 +10,7 @@ var fill = require('../constants/componentProps/fill.js');
|
|
|
10
10
|
var shape = require('../constants/componentProps/shape.js');
|
|
11
11
|
var emojiSize = require('../constants/componentProps/emojiSize.js');
|
|
12
12
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
13
|
-
var useStyles = require('../useStyles-
|
|
13
|
+
var useStyles = require('../useStyles-e4accb53.js');
|
|
14
14
|
require('../constants/componentProps/textColor.js');
|
|
15
15
|
require('../constants/componentProps/textColorActive.js');
|
|
16
16
|
require('../constants/componentProps/textColorHover.js');
|
|
@@ -38,6 +38,7 @@ function Label(props) {
|
|
|
38
38
|
labelTextSize = props.labelTextSize,
|
|
39
39
|
labelTextWrap = props.labelTextWrap,
|
|
40
40
|
labelTextColor = props.labelTextColor,
|
|
41
|
+
set = props.set,
|
|
41
42
|
type = props.type;
|
|
42
43
|
var alignDirectionClass = useDeviceTargetClass.useDeviceTargetClass(props, {
|
|
43
44
|
prefix: 'align_',
|
|
@@ -70,7 +71,7 @@ function Label(props) {
|
|
|
70
71
|
var _useStyles = useStyles.useStyles(props),
|
|
71
72
|
labelStyles = _useStyles.styles;
|
|
72
73
|
return /*#__PURE__*/React__default.default.createElement("div", {
|
|
73
|
-
className: clsx__default.default(className, 'label', fillClass, shapeClass, borderClass, borderTypeClass, sizeClass, alignDirectionClass, alignClass, type && "label_type_" + type),
|
|
74
|
+
className: clsx__default.default(className, 'label', fillClass, shapeClass, borderClass, borderTypeClass, sizeClass, alignDirectionClass, alignClass, type && "label_type_" + type, set && "label_set_" + set),
|
|
74
75
|
style: labelStyles
|
|
75
76
|
}, /*#__PURE__*/React__default.default.createElement("div", {
|
|
76
77
|
className: "label__inner"
|
|
@@ -10,7 +10,7 @@ require('../constants/componentProps/iconSize.js');
|
|
|
10
10
|
require('../constants/componentProps/shape.js');
|
|
11
11
|
require('../constants/componentProps/strokeColor.js');
|
|
12
12
|
require('./Link.js');
|
|
13
|
-
require('../useStyles-
|
|
13
|
+
require('../useStyles-e4accb53.js');
|
|
14
14
|
require('lodash/camelCase');
|
|
15
15
|
require('lodash/maxBy');
|
|
16
16
|
require('lodash/upperFirst');
|
package/dist/components/Link.js
CHANGED
package/dist/components/List.js
CHANGED
|
@@ -7,7 +7,7 @@ var direction = require('../constants/componentProps/direction.js');
|
|
|
7
7
|
var fill = require('../constants/componentProps/fill.js');
|
|
8
8
|
var textColor = require('../constants/componentProps/textColor.js');
|
|
9
9
|
var size = require('../constants/componentProps/size.js');
|
|
10
|
-
var useStyles = require('../useStyles-
|
|
10
|
+
var useStyles = require('../useStyles-e4accb53.js');
|
|
11
11
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
12
12
|
var textStyle = require('../constants/componentProps/textStyle.js');
|
|
13
13
|
var textWeight = require('../constants/componentProps/textWeight.js');
|
|
@@ -11,7 +11,7 @@ require('../constants/componentProps/textColorHover.js');
|
|
|
11
11
|
require('../constants/componentProps/size.js');
|
|
12
12
|
require('../constants/componentProps/textStyle.js');
|
|
13
13
|
require('../constants/componentProps/textWeight.js');
|
|
14
|
-
require('../useStyles-
|
|
14
|
+
require('../useStyles-e4accb53.js');
|
|
15
15
|
require('lodash/camelCase');
|
|
16
16
|
require('lodash/maxBy');
|
|
17
17
|
require('lodash/upperFirst');
|
package/dist/components/Logo.js
CHANGED
|
@@ -4,7 +4,7 @@ var React = require('react');
|
|
|
4
4
|
var PropTypes = require('prop-types');
|
|
5
5
|
var clsx = require('clsx');
|
|
6
6
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
7
|
-
var useStyles = require('../useStyles-
|
|
7
|
+
var useStyles = require('../useStyles-e4accb53.js');
|
|
8
8
|
require('lodash/castArray');
|
|
9
9
|
require('lodash/camelCase');
|
|
10
10
|
require('../context/UIContext.js');
|
|
@@ -23,33 +23,35 @@ var clsx__default = /*#__PURE__*/_interopDefault(clsx);
|
|
|
23
23
|
function Logo(props) {
|
|
24
24
|
var children = props.children,
|
|
25
25
|
className = props.className;
|
|
26
|
-
|
|
27
|
-
props.
|
|
28
|
-
props.link;
|
|
29
|
-
props.target;
|
|
30
|
-
props.rel;
|
|
26
|
+
props.isLink;
|
|
27
|
+
var logoSrc = props.logoSrc;
|
|
31
28
|
var alignItemsClass = useDeviceTargetClass.useDeviceTargetClass(props, {
|
|
32
29
|
prefix: 'logo_align-items_',
|
|
33
30
|
propsKey: 'alignItems'
|
|
34
31
|
});
|
|
35
32
|
var _useStyles = useStyles.useStyles(props),
|
|
36
|
-
logo = _useStyles.styles
|
|
33
|
+
logo = _useStyles.styles,
|
|
34
|
+
logoStyles = _useStyles.logo;
|
|
37
35
|
return /*#__PURE__*/React__default.default.createElement("div", {
|
|
38
36
|
className: clsx__default.default(className, 'logo', alignItemsClass),
|
|
39
37
|
style: logo
|
|
40
|
-
}, children
|
|
38
|
+
}, children, /*#__PURE__*/React__default.default.createElement("img", {
|
|
39
|
+
className: "logo__link-second",
|
|
40
|
+
src: logoSrc,
|
|
41
|
+
style: logoStyles
|
|
42
|
+
}));
|
|
41
43
|
}
|
|
42
44
|
Logo.propTypes = {
|
|
43
45
|
children: PropTypes__default.default.any,
|
|
44
46
|
className: PropTypes__default.default.string,
|
|
47
|
+
isLink: PropTypes__default.default.bool,
|
|
48
|
+
logoSrc: PropTypes__default.default.string,
|
|
45
49
|
LinkComponent: PropTypes__default.default.any,
|
|
46
50
|
href: PropTypes__default.default.string,
|
|
47
51
|
link: PropTypes__default.default.string,
|
|
48
52
|
target: PropTypes__default.default.string,
|
|
49
53
|
rel: PropTypes__default.default.string
|
|
50
54
|
};
|
|
51
|
-
Logo.defaultProps = {
|
|
52
|
-
LinkComponent: 'a'
|
|
53
|
-
};
|
|
55
|
+
Logo.defaultProps = {};
|
|
54
56
|
|
|
55
57
|
exports.Logo = Logo;
|
package/dist/components/Menu.js
CHANGED
|
@@ -5,7 +5,7 @@ var PropTypes = require('prop-types');
|
|
|
5
5
|
var clsx = require('clsx');
|
|
6
6
|
var direction = require('../constants/componentProps/direction.js');
|
|
7
7
|
var type = require('../constants/componentProps/type.js');
|
|
8
|
-
var useStyles = require('../useStyles-
|
|
8
|
+
var useStyles = require('../useStyles-e4accb53.js');
|
|
9
9
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
10
10
|
var index = require('./MenuItem.js');
|
|
11
11
|
require('lodash/camelCase');
|
|
@@ -15,7 +15,7 @@ var textStyle = require('../constants/componentProps/textStyle.js');
|
|
|
15
15
|
var textWeight = require('../constants/componentProps/textWeight.js');
|
|
16
16
|
var type = require('../constants/componentProps/type.js');
|
|
17
17
|
var underline = require('../constants/componentProps/underline.js');
|
|
18
|
-
var useStyles = require('../useStyles-
|
|
18
|
+
var useStyles = require('../useStyles-e4accb53.js');
|
|
19
19
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
20
20
|
var size = require('../constants/componentProps/size.js');
|
|
21
21
|
require('lodash/camelCase');
|
|
@@ -20,7 +20,7 @@ require('../constants/componentProps/textWeight.js');
|
|
|
20
20
|
require('../constants/componentProps/titleSize.js');
|
|
21
21
|
require('../constants/componentProps/type.js');
|
|
22
22
|
require('../constants/componentProps/wrap.js');
|
|
23
|
-
require('../useStyles-
|
|
23
|
+
require('../useStyles-e4accb53.js');
|
|
24
24
|
require('../hooks/styleAttributes.js');
|
|
25
25
|
require('lodash/castArray');
|
|
26
26
|
require('../hooks/useMediaQueries.js');
|
|
@@ -13,7 +13,7 @@ require('../constants/componentProps/iconSize.js');
|
|
|
13
13
|
require('../constants/componentProps/shape.js');
|
|
14
14
|
require('../constants/componentProps/strokeColor.js');
|
|
15
15
|
require('./Link.js');
|
|
16
|
-
require('../useStyles-
|
|
16
|
+
require('../useStyles-e4accb53.js');
|
|
17
17
|
require('lodash/camelCase');
|
|
18
18
|
require('lodash/maxBy');
|
|
19
19
|
require('lodash/upperFirst');
|
package/dist/components/Popup.js
CHANGED
|
@@ -19,7 +19,7 @@ require('../constants/componentProps/iconSize.js');
|
|
|
19
19
|
require('../constants/componentProps/shape.js');
|
|
20
20
|
require('../constants/componentProps/strokeColor.js');
|
|
21
21
|
require('./Link.js');
|
|
22
|
-
require('../useStyles-
|
|
22
|
+
require('../useStyles-e4accb53.js');
|
|
23
23
|
require('../hooks/styleAttributes.js');
|
|
24
24
|
require('../constants/componentProps/size.js');
|
|
25
25
|
require('../constants/componentProps/textColor.js');
|
|
@@ -181,7 +181,8 @@ var Popup = /*#__PURE__*/React__default.default.forwardRef(function Popup(props,
|
|
|
181
181
|
return {
|
|
182
182
|
isOpen: isOpen,
|
|
183
183
|
openPopup: openPopup,
|
|
184
|
-
closePopup: closePopup
|
|
184
|
+
closePopup: closePopup,
|
|
185
|
+
popupElement: popupElement
|
|
185
186
|
};
|
|
186
187
|
});
|
|
187
188
|
var contentFillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
|
|
@@ -8,7 +8,7 @@ var index = require('./Avatar.js');
|
|
|
8
8
|
var index$2 = require('./Text.js');
|
|
9
9
|
var index$1 = require('./Title.js');
|
|
10
10
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
11
|
-
var useStyles = require('../useStyles-
|
|
11
|
+
var useStyles = require('../useStyles-e4accb53.js');
|
|
12
12
|
require('./Image.js');
|
|
13
13
|
require('../constants/componentProps/borderColor.js');
|
|
14
14
|
require('../constants/componentProps/horizontalContentAlign.js');
|