@gympass/yoga 7.53.2 → 7.53.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.
|
@@ -9,19 +9,25 @@ var _propTypes = require("prop-types");
|
|
|
9
9
|
|
|
10
10
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
11
11
|
|
|
12
|
+
var _yogaHelpers = require("@gympass/yoga-helpers");
|
|
13
|
+
|
|
12
14
|
var _ActionRequirementStyles = require("./ActionRequirementStyles");
|
|
13
15
|
|
|
14
16
|
var _Text = _interopRequireDefault(require("../../Text"));
|
|
15
17
|
|
|
16
18
|
var _Box = _interopRequireDefault(require("../../Box"));
|
|
17
19
|
|
|
18
|
-
var _templateObject;
|
|
20
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
|
|
19
21
|
|
|
20
22
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
21
23
|
|
|
22
24
|
function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
|
|
23
25
|
|
|
24
|
-
var StyledActionRequirement = _styledComponents["default"].div(_templateObject || (_templateObject = _taggedTemplateLiteralLoose([""])));
|
|
26
|
+
var StyledActionRequirement = _styledComponents["default"].div(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n display: flex;\n ", "\n ", "\n"])), _yogaHelpers.media.xxs(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n flex-direction: column;\n "]))), _yogaHelpers.media.lg(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n flex-direction: row-reverse;\n "]))));
|
|
27
|
+
|
|
28
|
+
var Content = _styledComponents["default"].div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n width: 520px;\n margin-right: 120px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n"])));
|
|
29
|
+
|
|
30
|
+
var BoxIllustration = (0, _styledComponents["default"])(_Box["default"])(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n text-align: center;\n"])));
|
|
25
31
|
|
|
26
32
|
function isChildFromComponent(child, component) {
|
|
27
33
|
return child.type.displayName === component.displayName;
|
|
@@ -45,19 +51,17 @@ function ActionRequirement(props) {
|
|
|
45
51
|
}
|
|
46
52
|
|
|
47
53
|
defineCompoundComponents();
|
|
48
|
-
return /*#__PURE__*/_react["default"].createElement(StyledActionRequirement, props, illustration && /*#__PURE__*/_react["default"].createElement(
|
|
54
|
+
return /*#__PURE__*/_react["default"].createElement(StyledActionRequirement, props, illustration && /*#__PURE__*/_react["default"].createElement(BoxIllustration, null, illustration), /*#__PURE__*/_react["default"].createElement(Content, null, /*#__PURE__*/_react["default"].createElement(_ActionRequirementStyles.Title, null, title), /*#__PURE__*/_react["default"].createElement(_Text["default"], {
|
|
49
55
|
mt: "small",
|
|
50
56
|
color: "deep"
|
|
51
57
|
}, description), /*#__PURE__*/_react["default"].createElement(_Text["default"], {
|
|
52
|
-
mt: "
|
|
58
|
+
mt: "large",
|
|
53
59
|
color: "deep"
|
|
54
|
-
}, list && /*#__PURE__*/_react["default"].createElement(_Box["default"], {
|
|
55
|
-
mt: "
|
|
56
|
-
}, list)), checkable && /*#__PURE__*/_react["default"].createElement(_Box["default"], {
|
|
57
|
-
mt: "xxxlarge"
|
|
60
|
+
}, list && /*#__PURE__*/_react["default"].createElement(_Box["default"], null, list)), checkable && /*#__PURE__*/_react["default"].createElement(_Box["default"], {
|
|
61
|
+
mt: "xxlarge"
|
|
58
62
|
}, checkable), /*#__PURE__*/_react["default"].createElement(_ActionRequirementStyles.Actions, {
|
|
59
63
|
mt: "xlarge"
|
|
60
|
-
}, primaryButton, secondaryButton));
|
|
64
|
+
}, primaryButton, secondaryButton)));
|
|
61
65
|
}
|
|
62
66
|
|
|
63
67
|
ActionRequirement.propTypes = {
|
|
@@ -5,13 +5,15 @@ exports.Title = exports.SecondaryButton = exports.PrimaryButton = exports.Action
|
|
|
5
5
|
|
|
6
6
|
var _styledComponents = _interopRequireWildcard(require("styled-components"));
|
|
7
7
|
|
|
8
|
+
var _yogaHelpers = require("@gympass/yoga-helpers");
|
|
9
|
+
|
|
8
10
|
var _Text = _interopRequireDefault(require("../../Text"));
|
|
9
11
|
|
|
10
12
|
var _Box = _interopRequireDefault(require("../../Box"));
|
|
11
13
|
|
|
12
14
|
var _Button = _interopRequireDefault(require("../../Button"));
|
|
13
15
|
|
|
14
|
-
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
|
|
16
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
|
|
15
17
|
|
|
16
18
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
17
19
|
|
|
@@ -25,7 +27,7 @@ var Title = (0, _styledComponents["default"])(_Text["default"].H4).attrs({
|
|
|
25
27
|
as: 'p'
|
|
26
28
|
})(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n ", "\n"])), function (_ref) {
|
|
27
29
|
var fontSizes = _ref.theme.yoga.fontSizes;
|
|
28
|
-
return (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n @media (min-width: 769px) {\n max-width: 700px;\n font-size: ", "px;\n line-height: ", "px;\n }\n "])), fontSizes.huge, fontSizes.huge);
|
|
30
|
+
return (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n margin-bottom: 6px;\n @media (min-width: 769px) {\n max-width: 700px;\n font-size: ", "px;\n line-height: ", "px;\n }\n "])), fontSizes.huge, fontSizes.huge);
|
|
29
31
|
});
|
|
30
32
|
exports.Title = Title;
|
|
31
33
|
var Actions = (0, _styledComponents["default"])(_Box["default"])(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n ", "\n"])), function (_ref2) {
|
|
@@ -33,13 +35,13 @@ var Actions = (0, _styledComponents["default"])(_Box["default"])(_templateObject
|
|
|
33
35
|
return (0, _styledComponents.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n\n @media (min-width: 769px) {\n flex-direction: row;\n margin-top: ", "px;\n }\n "])), spacing.xlarge);
|
|
34
36
|
});
|
|
35
37
|
exports.Actions = Actions;
|
|
36
|
-
var buttonsStyles = (0, _styledComponents.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n ", "\n"])),
|
|
37
|
-
var spacing = _ref3.theme.yoga.spacing;
|
|
38
|
-
return (0, _styledComponents.css)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n width: 100%;\n\n :last-child(:not(:first-child)) {\n margin-top: ", "px;\n }\n\n @media (min-width: 769px) {\n width: auto;\n\n :last-child(:not(:first-child)) {\n margin-top: 0;\n margin-left: ", "px;\n }\n }\n "])), spacing.small, spacing.large);
|
|
39
|
-
});
|
|
38
|
+
var buttonsStyles = (0, _styledComponents.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n width: 100%;\n\n ", "\n"])), _yogaHelpers.media.lg(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n width: auto;\n "]))));
|
|
40
39
|
var PrimaryButton = (0, _styledComponents["default"])(_Button["default"])(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n ", "\n"])), buttonsStyles);
|
|
41
40
|
exports.PrimaryButton = PrimaryButton;
|
|
42
|
-
var SecondaryButton = (0, _styledComponents["default"])(_Button["default"].Text)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n ", "\n"])),
|
|
41
|
+
var SecondaryButton = (0, _styledComponents["default"])(_Button["default"].Text)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n ", "\n"])), function (_ref3) {
|
|
42
|
+
var spacing = _ref3.theme.yoga.spacing;
|
|
43
|
+
return (0, _styledComponents.css)(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n ", "\n ", "\n ", "\n "])), buttonsStyles, _yogaHelpers.media.xxs(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["\n margin-top: ", "px;\n "])), spacing.small), _yogaHelpers.media.lg(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["\n margin-top: 0;\n margin-left: ", "px;\n "])), spacing.large));
|
|
44
|
+
});
|
|
43
45
|
exports.SecondaryButton = SecondaryButton;
|
|
44
46
|
Title.displayName = 'ActionRequirement.Title';
|
|
45
47
|
PrimaryButton.displayName = 'ActionRequirement.PrimaryButton';
|
|
@@ -1,14 +1,17 @@
|
|
|
1
|
-
var _templateObject;
|
|
1
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
|
|
2
2
|
|
|
3
3
|
function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
|
|
4
4
|
|
|
5
5
|
import React from 'react';
|
|
6
6
|
import { arrayOf, node, oneOfType, string } from 'prop-types';
|
|
7
7
|
import styled from 'styled-components';
|
|
8
|
+
import { media } from '@gympass/yoga-helpers';
|
|
8
9
|
import { Actions, Title, PrimaryButton, SecondaryButton } from './ActionRequirementStyles';
|
|
9
10
|
import Text from '../../Text';
|
|
10
11
|
import Box from '../../Box';
|
|
11
|
-
var StyledActionRequirement = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteralLoose([""])));
|
|
12
|
+
var StyledActionRequirement = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n display: flex;\n ", "\n ", "\n"])), media.xxs(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n flex-direction: column;\n "]))), media.lg(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n flex-direction: row-reverse;\n "]))));
|
|
13
|
+
var Content = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n width: 520px;\n margin-right: 120px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n"])));
|
|
14
|
+
var BoxIllustration = styled(Box)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n text-align: center;\n"])));
|
|
12
15
|
|
|
13
16
|
function isChildFromComponent(child, component) {
|
|
14
17
|
return child.type.displayName === component.displayName;
|
|
@@ -32,19 +35,17 @@ function ActionRequirement(props) {
|
|
|
32
35
|
}
|
|
33
36
|
|
|
34
37
|
defineCompoundComponents();
|
|
35
|
-
return /*#__PURE__*/React.createElement(StyledActionRequirement, props, illustration && /*#__PURE__*/React.createElement(
|
|
38
|
+
return /*#__PURE__*/React.createElement(StyledActionRequirement, props, illustration && /*#__PURE__*/React.createElement(BoxIllustration, null, illustration), /*#__PURE__*/React.createElement(Content, null, /*#__PURE__*/React.createElement(Title, null, title), /*#__PURE__*/React.createElement(Text, {
|
|
36
39
|
mt: "small",
|
|
37
40
|
color: "deep"
|
|
38
41
|
}, description), /*#__PURE__*/React.createElement(Text, {
|
|
39
|
-
mt: "
|
|
42
|
+
mt: "large",
|
|
40
43
|
color: "deep"
|
|
41
|
-
}, list && /*#__PURE__*/React.createElement(Box, {
|
|
42
|
-
mt: "
|
|
43
|
-
}, list)), checkable && /*#__PURE__*/React.createElement(Box, {
|
|
44
|
-
mt: "xxxlarge"
|
|
44
|
+
}, list && /*#__PURE__*/React.createElement(Box, null, list)), checkable && /*#__PURE__*/React.createElement(Box, {
|
|
45
|
+
mt: "xxlarge"
|
|
45
46
|
}, checkable), /*#__PURE__*/React.createElement(Actions, {
|
|
46
47
|
mt: "xlarge"
|
|
47
|
-
}, primaryButton, secondaryButton));
|
|
48
|
+
}, primaryButton, secondaryButton)));
|
|
48
49
|
}
|
|
49
50
|
|
|
50
51
|
ActionRequirement.propTypes = {
|
|
@@ -1,8 +1,9 @@
|
|
|
1
|
-
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
|
|
1
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
|
|
2
2
|
|
|
3
3
|
function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
|
|
4
4
|
|
|
5
5
|
import styled, { css } from 'styled-components';
|
|
6
|
+
import { media } from '@gympass/yoga-helpers';
|
|
6
7
|
import Text from '../../Text';
|
|
7
8
|
import Box from '../../Box';
|
|
8
9
|
import Button from '../../Button';
|
|
@@ -10,18 +11,18 @@ export var Title = styled(Text.H4).attrs({
|
|
|
10
11
|
as: 'p'
|
|
11
12
|
})(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n ", "\n"])), function (_ref) {
|
|
12
13
|
var fontSizes = _ref.theme.yoga.fontSizes;
|
|
13
|
-
return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n @media (min-width: 769px) {\n max-width: 700px;\n font-size: ", "px;\n line-height: ", "px;\n }\n "])), fontSizes.huge, fontSizes.huge);
|
|
14
|
+
return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n margin-bottom: 6px;\n @media (min-width: 769px) {\n max-width: 700px;\n font-size: ", "px;\n line-height: ", "px;\n }\n "])), fontSizes.huge, fontSizes.huge);
|
|
14
15
|
});
|
|
15
16
|
export var Actions = styled(Box)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n ", "\n"])), function (_ref2) {
|
|
16
17
|
var spacing = _ref2.theme.yoga.spacing;
|
|
17
18
|
return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n\n @media (min-width: 769px) {\n flex-direction: row;\n margin-top: ", "px;\n }\n "])), spacing.xlarge);
|
|
18
19
|
});
|
|
19
|
-
var buttonsStyles = css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n ", "\n"])),
|
|
20
|
+
var buttonsStyles = css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n width: 100%;\n\n ", "\n"])), media.lg(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n width: auto;\n "]))));
|
|
21
|
+
export var PrimaryButton = styled(Button)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n ", "\n"])), buttonsStyles);
|
|
22
|
+
export var SecondaryButton = styled(Button.Text)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n ", "\n"])), function (_ref3) {
|
|
20
23
|
var spacing = _ref3.theme.yoga.spacing;
|
|
21
|
-
return css(
|
|
24
|
+
return css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n ", "\n ", "\n ", "\n "])), buttonsStyles, media.xxs(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["\n margin-top: ", "px;\n "])), spacing.small), media.lg(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["\n margin-top: 0;\n margin-left: ", "px;\n "])), spacing.large));
|
|
22
25
|
});
|
|
23
|
-
export var PrimaryButton = styled(Button)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n ", "\n"])), buttonsStyles);
|
|
24
|
-
export var SecondaryButton = styled(Button.Text)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n ", "\n"])), buttonsStyles);
|
|
25
26
|
Title.displayName = 'ActionRequirement.Title';
|
|
26
27
|
PrimaryButton.displayName = 'ActionRequirement.PrimaryButton';
|
|
27
28
|
SecondaryButton.displayName = 'ActionRequirement.SecondaryButton';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@gympass/yoga",
|
|
3
|
-
"version": "7.53.
|
|
3
|
+
"version": "7.53.4",
|
|
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": "e81463e5bdc834483aa2f300abad56ec061a4ae1",
|
|
56
56
|
"module": "./esm",
|
|
57
57
|
"private": false,
|
|
58
58
|
"react-native": "./cjs/index.native.js"
|