@gympass/yoga 7.57.1 → 7.59.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.
|
@@ -167,11 +167,20 @@ function Datepicker(_ref8) {
|
|
|
167
167
|
triggerOnOpen();
|
|
168
168
|
};
|
|
169
169
|
|
|
170
|
+
var checkInputFilled = function checkInputFilled() {
|
|
171
|
+
if (type === 'range') {
|
|
172
|
+
if (!customOnSelectRange) setInputFilled(!!(startDateLocal && endDateLocal));else {
|
|
173
|
+
setInputFilled(startDateLocal && endDateLocal);
|
|
174
|
+
}
|
|
175
|
+
} else {
|
|
176
|
+
setInputFilled(startDate);
|
|
177
|
+
}
|
|
178
|
+
};
|
|
179
|
+
|
|
170
180
|
(0, _react.useEffect)(function () {
|
|
171
|
-
|
|
172
|
-
}, [startDate,
|
|
181
|
+
checkInputFilled();
|
|
182
|
+
}, [startDate, startDateLocal, endDateLocal]);
|
|
173
183
|
(0, _react.useEffect)(function () {
|
|
174
|
-
setInputFilled(startDate || endDate);
|
|
175
184
|
setStartDateLocal(startDate);
|
|
176
185
|
setEndDateLocal(endDate);
|
|
177
186
|
|
|
@@ -28,19 +28,23 @@ var StyledDivider = _styledComponents["default"].hr(_templateObject || (_templat
|
|
|
28
28
|
});
|
|
29
29
|
|
|
30
30
|
var Divider = /*#__PURE__*/_react["default"].forwardRef(function (_ref2, ref) {
|
|
31
|
-
var vertical = _ref2.vertical
|
|
31
|
+
var vertical = _ref2.vertical,
|
|
32
|
+
style = _ref2.style;
|
|
32
33
|
return /*#__PURE__*/_react["default"].createElement(StyledDivider, {
|
|
33
34
|
vertical: vertical,
|
|
34
|
-
ref: ref
|
|
35
|
+
ref: ref,
|
|
36
|
+
style: style
|
|
35
37
|
});
|
|
36
38
|
});
|
|
37
39
|
|
|
38
40
|
Divider.propTypes = {
|
|
39
41
|
/** If this value is defined, the divider will be in vertical if the flexDirection is row type */
|
|
40
|
-
vertical: _propTypes.bool
|
|
42
|
+
vertical: _propTypes.bool,
|
|
43
|
+
style: (0, _propTypes.shape)({})
|
|
41
44
|
};
|
|
42
45
|
Divider.defaultProps = {
|
|
43
|
-
vertical: false
|
|
46
|
+
vertical: false,
|
|
47
|
+
style: undefined
|
|
44
48
|
};
|
|
45
49
|
|
|
46
50
|
var _default = (0, _styledComponents.withTheme)(Divider);
|
package/cjs/Menu/web/MenuItem.js
CHANGED
|
@@ -9,9 +9,11 @@ var _reactDropdownMenu = require("@radix-ui/react-dropdown-menu");
|
|
|
9
9
|
|
|
10
10
|
var _propTypes = require("prop-types");
|
|
11
11
|
|
|
12
|
-
var _styledComponents =
|
|
12
|
+
var _styledComponents = _interopRequireWildcard(require("styled-components"));
|
|
13
13
|
|
|
14
|
-
var
|
|
14
|
+
var _lodash = _interopRequireDefault(require("lodash.get"));
|
|
15
|
+
|
|
16
|
+
var _excluded = ["icon", "href", "active", "disabled", "iconColor", "iconSize", "children", "theme"];
|
|
15
17
|
|
|
16
18
|
var _templateObject;
|
|
17
19
|
|
|
@@ -30,8 +32,11 @@ function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.s
|
|
|
30
32
|
var StyledMenuItem = _styledComponents["default"].li(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n ", "\n"])), function (_ref) {
|
|
31
33
|
var active = _ref.active,
|
|
32
34
|
disabled = _ref.disabled,
|
|
33
|
-
|
|
34
|
-
|
|
35
|
+
iconColor = _ref.iconColor,
|
|
36
|
+
yoga = _ref.theme.yoga;
|
|
37
|
+
var menu = yoga.components.menu,
|
|
38
|
+
colors = yoga.colors;
|
|
39
|
+
return "\n margin-right: auto;\n padding: " + menu.padding.vertical + "px " + menu.padding.horizontal + "px;\n\n width: 100%;\n cursor: pointer;\n text-decoration: none;\n color: " + menu.text["default"].color + ";\n\n " + (active ? "\n font-weight: " + menu.font.weight + ";\n color: " + menu.text.active.color + "\n " : '') + "\n\n " + (disabled ? "\n color: " + menu.text.disabled.color + ";\n pointer-events: none;\n\n svg {\n fill: " + menu.text.disabled.color + ";\n opacity: 0.5;\n }\n\n cursor: not-allowed;\n " : '') + "\n\n svg {\n margin-right: " + menu.margin["default"] + "px;\n fill: " + (0, _lodash["default"])(colors, iconColor, iconColor) + ";\n }\n\n &:focus {\n outline: none;\n background: " + menu.backgroundColor.disabled + ";\n }\n\n &:hover {\n background: " + menu.backgroundColor.disabled + ";\n }\n\n &:first-child {\n margin-top: " + menu.margin.xxsmall + "px;\n }\n\n &:last-child {\n margin-bottom: " + menu.margin.xxsmall + "px;\n }\n ";
|
|
35
40
|
});
|
|
36
41
|
|
|
37
42
|
var MenuItem = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
|
|
@@ -39,7 +44,10 @@ var MenuItem = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
|
|
|
39
44
|
href = _ref2.href,
|
|
40
45
|
active = _ref2.active,
|
|
41
46
|
disabled = _ref2.disabled,
|
|
47
|
+
iconColor = _ref2.iconColor,
|
|
48
|
+
iconSize = _ref2.iconSize,
|
|
42
49
|
children = _ref2.children,
|
|
50
|
+
theme = _ref2.theme,
|
|
43
51
|
rest = _objectWithoutPropertiesLoose(_ref2, _excluded);
|
|
44
52
|
|
|
45
53
|
var finalProps = _extends({}, rest);
|
|
@@ -49,16 +57,18 @@ var MenuItem = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
|
|
|
49
57
|
finalProps.href = href;
|
|
50
58
|
}
|
|
51
59
|
|
|
60
|
+
var size = (0, _lodash["default"])(theme.yoga.spacing, iconSize, 20);
|
|
52
61
|
return /*#__PURE__*/_react["default"].createElement(_reactDropdownMenu.Item, {
|
|
53
62
|
disabled: disabled,
|
|
54
63
|
asChild: true
|
|
55
64
|
}, /*#__PURE__*/_react["default"].createElement(StyledMenuItem, _extends({
|
|
56
65
|
active: active,
|
|
57
66
|
disabled: disabled,
|
|
67
|
+
iconColor: iconColor,
|
|
58
68
|
ref: ref
|
|
59
69
|
}, finalProps), Icon && /*#__PURE__*/_react["default"].createElement(Icon, {
|
|
60
|
-
width:
|
|
61
|
-
height:
|
|
70
|
+
width: size,
|
|
71
|
+
height: size
|
|
62
72
|
}), children));
|
|
63
73
|
});
|
|
64
74
|
MenuItem.propTypes = {
|
|
@@ -67,14 +77,20 @@ MenuItem.propTypes = {
|
|
|
67
77
|
children: _propTypes.node.isRequired,
|
|
68
78
|
href: _propTypes.string,
|
|
69
79
|
disabled: _propTypes.bool,
|
|
70
|
-
active: _propTypes.bool
|
|
80
|
+
active: _propTypes.bool,
|
|
81
|
+
iconColor: _propTypes.string,
|
|
82
|
+
iconSize: _propTypes.string
|
|
71
83
|
};
|
|
72
84
|
MenuItem.defaultProps = {
|
|
73
85
|
icon: undefined,
|
|
74
86
|
href: undefined,
|
|
75
87
|
disabled: false,
|
|
76
|
-
active: false
|
|
88
|
+
active: false,
|
|
89
|
+
iconColor: undefined,
|
|
90
|
+
iconSize: undefined
|
|
77
91
|
};
|
|
78
92
|
MenuItem.displayName = 'Menu.Item';
|
|
79
|
-
|
|
93
|
+
|
|
94
|
+
var _default = (0, _styledComponents.withTheme)(MenuItem);
|
|
95
|
+
|
|
80
96
|
exports["default"] = _default;
|
|
@@ -142,11 +142,20 @@ function Datepicker(_ref8) {
|
|
|
142
142
|
triggerOnOpen();
|
|
143
143
|
};
|
|
144
144
|
|
|
145
|
+
var checkInputFilled = function checkInputFilled() {
|
|
146
|
+
if (type === 'range') {
|
|
147
|
+
if (!customOnSelectRange) setInputFilled(!!(startDateLocal && endDateLocal));else {
|
|
148
|
+
setInputFilled(startDateLocal && endDateLocal);
|
|
149
|
+
}
|
|
150
|
+
} else {
|
|
151
|
+
setInputFilled(startDate);
|
|
152
|
+
}
|
|
153
|
+
};
|
|
154
|
+
|
|
145
155
|
useEffect(function () {
|
|
146
|
-
|
|
147
|
-
}, [startDate,
|
|
156
|
+
checkInputFilled();
|
|
157
|
+
}, [startDate, startDateLocal, endDateLocal]);
|
|
148
158
|
useEffect(function () {
|
|
149
|
-
setInputFilled(startDate || endDate);
|
|
150
159
|
setStartDateLocal(startDate);
|
|
151
160
|
setEndDateLocal(endDate);
|
|
152
161
|
|
|
@@ -2,7 +2,7 @@ var _templateObject, _templateObject2;
|
|
|
2
2
|
|
|
3
3
|
function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
|
|
4
4
|
|
|
5
|
-
import { bool } from 'prop-types';
|
|
5
|
+
import { bool, shape } from 'prop-types';
|
|
6
6
|
import React from 'react';
|
|
7
7
|
import styled, { css, withTheme } from 'styled-components';
|
|
8
8
|
var StyledDivider = styled.hr(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n ", "\n"])), function (_ref) {
|
|
@@ -13,17 +13,21 @@ var StyledDivider = styled.hr(_templateObject || (_templateObject = _taggedTempl
|
|
|
13
13
|
return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n ", ";\n border-width: 0px;\n border-left-width: ", "px;\n border-bottom-width: ", "px;\n border-color: ", ";\n "])), vertical ? 'height: auto' : 'width: 100%', vertical ? borders.small : 0, vertical ? 0 : borders.small, colors.text.disabled);
|
|
14
14
|
});
|
|
15
15
|
var Divider = /*#__PURE__*/React.forwardRef(function (_ref2, ref) {
|
|
16
|
-
var vertical = _ref2.vertical
|
|
16
|
+
var vertical = _ref2.vertical,
|
|
17
|
+
style = _ref2.style;
|
|
17
18
|
return /*#__PURE__*/React.createElement(StyledDivider, {
|
|
18
19
|
vertical: vertical,
|
|
19
|
-
ref: ref
|
|
20
|
+
ref: ref,
|
|
21
|
+
style: style
|
|
20
22
|
});
|
|
21
23
|
});
|
|
22
24
|
Divider.propTypes = {
|
|
23
25
|
/** If this value is defined, the divider will be in vertical if the flexDirection is row type */
|
|
24
|
-
vertical: bool
|
|
26
|
+
vertical: bool,
|
|
27
|
+
style: shape({})
|
|
25
28
|
};
|
|
26
29
|
Divider.defaultProps = {
|
|
27
|
-
vertical: false
|
|
30
|
+
vertical: false,
|
|
31
|
+
style: undefined
|
|
28
32
|
};
|
|
29
33
|
export default withTheme(Divider);
|
package/esm/Menu/web/MenuItem.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var _excluded = ["icon", "href", "active", "disabled", "children"];
|
|
1
|
+
var _excluded = ["icon", "href", "active", "disabled", "iconColor", "iconSize", "children", "theme"];
|
|
2
2
|
|
|
3
3
|
var _templateObject;
|
|
4
4
|
|
|
@@ -11,19 +11,26 @@ function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.s
|
|
|
11
11
|
import React, { forwardRef } from 'react';
|
|
12
12
|
import { Item as MenuItemRoot } from '@radix-ui/react-dropdown-menu';
|
|
13
13
|
import { oneOfType, func, node, string, bool } from 'prop-types';
|
|
14
|
-
import styled from 'styled-components';
|
|
14
|
+
import styled, { withTheme } from 'styled-components';
|
|
15
|
+
import get from 'lodash.get';
|
|
15
16
|
var StyledMenuItem = styled.li(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n ", "\n"])), function (_ref) {
|
|
16
17
|
var active = _ref.active,
|
|
17
18
|
disabled = _ref.disabled,
|
|
18
|
-
|
|
19
|
-
|
|
19
|
+
iconColor = _ref.iconColor,
|
|
20
|
+
yoga = _ref.theme.yoga;
|
|
21
|
+
var menu = yoga.components.menu,
|
|
22
|
+
colors = yoga.colors;
|
|
23
|
+
return "\n margin-right: auto;\n padding: " + menu.padding.vertical + "px " + menu.padding.horizontal + "px;\n\n width: 100%;\n cursor: pointer;\n text-decoration: none;\n color: " + menu.text["default"].color + ";\n\n " + (active ? "\n font-weight: " + menu.font.weight + ";\n color: " + menu.text.active.color + "\n " : '') + "\n\n " + (disabled ? "\n color: " + menu.text.disabled.color + ";\n pointer-events: none;\n\n svg {\n fill: " + menu.text.disabled.color + ";\n opacity: 0.5;\n }\n\n cursor: not-allowed;\n " : '') + "\n\n svg {\n margin-right: " + menu.margin["default"] + "px;\n fill: " + get(colors, iconColor, iconColor) + ";\n }\n\n &:focus {\n outline: none;\n background: " + menu.backgroundColor.disabled + ";\n }\n\n &:hover {\n background: " + menu.backgroundColor.disabled + ";\n }\n\n &:first-child {\n margin-top: " + menu.margin.xxsmall + "px;\n }\n\n &:last-child {\n margin-bottom: " + menu.margin.xxsmall + "px;\n }\n ";
|
|
20
24
|
});
|
|
21
25
|
var MenuItem = /*#__PURE__*/forwardRef(function (_ref2, ref) {
|
|
22
26
|
var Icon = _ref2.icon,
|
|
23
27
|
href = _ref2.href,
|
|
24
28
|
active = _ref2.active,
|
|
25
29
|
disabled = _ref2.disabled,
|
|
30
|
+
iconColor = _ref2.iconColor,
|
|
31
|
+
iconSize = _ref2.iconSize,
|
|
26
32
|
children = _ref2.children,
|
|
33
|
+
theme = _ref2.theme,
|
|
27
34
|
rest = _objectWithoutPropertiesLoose(_ref2, _excluded);
|
|
28
35
|
|
|
29
36
|
var finalProps = _extends({}, rest);
|
|
@@ -33,16 +40,18 @@ var MenuItem = /*#__PURE__*/forwardRef(function (_ref2, ref) {
|
|
|
33
40
|
finalProps.href = href;
|
|
34
41
|
}
|
|
35
42
|
|
|
43
|
+
var size = get(theme.yoga.spacing, iconSize, 20);
|
|
36
44
|
return /*#__PURE__*/React.createElement(MenuItemRoot, {
|
|
37
45
|
disabled: disabled,
|
|
38
46
|
asChild: true
|
|
39
47
|
}, /*#__PURE__*/React.createElement(StyledMenuItem, _extends({
|
|
40
48
|
active: active,
|
|
41
49
|
disabled: disabled,
|
|
50
|
+
iconColor: iconColor,
|
|
42
51
|
ref: ref
|
|
43
52
|
}, finalProps), Icon && /*#__PURE__*/React.createElement(Icon, {
|
|
44
|
-
width:
|
|
45
|
-
height:
|
|
53
|
+
width: size,
|
|
54
|
+
height: size
|
|
46
55
|
}), children));
|
|
47
56
|
});
|
|
48
57
|
MenuItem.propTypes = {
|
|
@@ -51,13 +60,17 @@ MenuItem.propTypes = {
|
|
|
51
60
|
children: node.isRequired,
|
|
52
61
|
href: string,
|
|
53
62
|
disabled: bool,
|
|
54
|
-
active: bool
|
|
63
|
+
active: bool,
|
|
64
|
+
iconColor: string,
|
|
65
|
+
iconSize: string
|
|
55
66
|
};
|
|
56
67
|
MenuItem.defaultProps = {
|
|
57
68
|
icon: undefined,
|
|
58
69
|
href: undefined,
|
|
59
70
|
disabled: false,
|
|
60
|
-
active: false
|
|
71
|
+
active: false,
|
|
72
|
+
iconColor: undefined,
|
|
73
|
+
iconSize: undefined
|
|
61
74
|
};
|
|
62
75
|
MenuItem.displayName = 'Menu.Item';
|
|
63
|
-
export default MenuItem;
|
|
76
|
+
export default withTheme(MenuItem);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@gympass/yoga",
|
|
3
|
-
"version": "7.
|
|
3
|
+
"version": "7.59.0",
|
|
4
4
|
"description": "Gympass component library",
|
|
5
5
|
"main": "./cjs",
|
|
6
6
|
"sideEffects": false,
|
|
@@ -52,7 +52,7 @@
|
|
|
52
52
|
"react": ">=16",
|
|
53
53
|
"styled-components": "^4.4.0"
|
|
54
54
|
},
|
|
55
|
-
"gitHead": "
|
|
55
|
+
"gitHead": "cd343325b87264d19f91c3bb3663ec9b00220b6e",
|
|
56
56
|
"module": "./esm",
|
|
57
57
|
"private": false,
|
|
58
58
|
"react-native": "./cjs/index.native.js"
|