@gympass/yoga 7.72.2 → 7.72.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.
Files changed (7) hide show
  1. package/cjs/Accordion/web/Accordion.js +100 -72
  2. package/cjs/Feedback/web/Feedback.js +1 -1
  3. package/cjs/Popover/web/Popover.js +11 -2
  4. package/esm/Accordion/web/Accordion.js +96 -67
  5. package/esm/Feedback/web/Feedback.js +2 -2
  6. package/esm/Popover/web/Popover.js +11 -2
  7. package/package.json +2 -2
package/cjs/Accordion/web/Accordion.js CHANGED
@@ -15,94 +15,119 @@ var _yoga = require("@gympass/yoga");
15
15
 
16
16
  var _Content = _interopRequireDefault(require("./Content"));
17
17
 
18
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9;
19
-
20
18
  var _excluded = ["title", "subtitle", "children", "disabled", "expanded", "small", "hasHorizontalPadding"];
21
19
 
20
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9;
21
+
22
22
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
23
23
 
24
24
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
25
25
 
26
26
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
27
27
 
28
- function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
28
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
29
29
 
30
30
  function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
31
31
 
32
- var Accordion = function Accordion(_ref) {
33
- var title = _ref.title,
34
- subtitle = _ref.subtitle,
35
- children = _ref.children,
36
- disabled = _ref.disabled,
37
- expanded = _ref.expanded,
38
- small = _ref.small,
39
- hasHorizontalPadding = _ref.hasHorizontalPadding,
40
- props = _objectWithoutPropertiesLoose(_ref, _excluded);
32
+ function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
41
33
 
42
- var _useState = (0, _react.useState)(expanded),
43
- open = _useState[0],
44
- setOpen = _useState[1];
34
+ var AccordionWrapper = _styledComponents["default"].div(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n border: none;\n display: flex;\n flex-direction: column;\n position: relative;\n width: 100%;\n z-index: 1;\n\n ", "\n\n hr {\n bottom: 0;\n left: 0;\n margin: 0;\n position: absolute;\n z-index: -1;\n }\n"])), function (_ref) {
35
+ var _ref$theme$yoga$color = _ref.theme.yoga.colors,
36
+ white = _ref$theme$yoga$color.white,
37
+ elements = _ref$theme$yoga$color.elements,
38
+ disabled = _ref.disabled;
39
+ return "\n background: " + (disabled ? elements.backgroundAndDisabled : white) + "\n";
40
+ });
41
+
42
+ var getVerticalPadding = function getVerticalPadding(accordion, small) {
43
+ if (small) return accordion.padding.small;
44
+ return accordion.padding.large;
45
+ };
45
46
 
46
- var getVerticalPadding = function getVerticalPadding(accordion) {
47
- if (small) return accordion.padding.small;
48
- return accordion.padding.large;
49
- };
50
-
51
- var getHorizontalPadding = function getHorizontalPadding(accordion) {
52
- if (hasHorizontalPadding) return accordion.padding.standard;
53
- return accordion.padding.zero;
54
- };
55
-
56
- var AccordionWrapper = _styledComponents["default"].div(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n border: none;\n display: flex;\n flex-direction: column;\n position: relative;\n width: 100%;\n z-index: 1;\n\n ", "\n\n hr {\n bottom: 0;\n left: 0;\n margin: 0;\n position: absolute;\n z-index: -1;\n }\n "])), function (_ref2) {
57
- var _ref2$theme$yoga$colo = _ref2.theme.yoga.colors,
58
- white = _ref2$theme$yoga$colo.white,
59
- elements = _ref2$theme$yoga$colo.elements;
60
- return "\n background: " + (disabled ? elements.backgroundAndDisabled : white) + "\n ";
61
- });
47
+ var getHorizontalPadding = function getHorizontalPadding(accordion, hasHorizontalPadding) {
48
+ if (hasHorizontalPadding) return accordion.padding.standard;
49
+ return accordion.padding.zero;
50
+ };
62
51
 
63
- var Header = _styledComponents["default"].button(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n align-items: center;\n background-color: transparent;\n border: none;\n cursor: pointer;\n display: flex;\n justify-content: space-between;\n width: 100%;\n\n ", "\n\n &:focus-visible {\n ", "\n }\n\n ", "\n "])), function (_ref3) {
64
- var accordion = _ref3.theme.yoga.components.accordion;
65
- return "\n padding:" + getVerticalPadding(accordion) + "px " + getHorizontalPadding(accordion) + "px;\n ";
66
- }, function (_ref4) {
67
- var elements = _ref4.theme.yoga.colors.elements;
68
- return "\n background: " + elements.backgroundAndDisabled + ";\n\n ";
69
- }, disabled && (0, _styledComponents.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n cursor: not-allowed;\n "]))));
70
-
71
- var Title = _styledComponents["default"].div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n align-items: flex-start;\n display: flex;\n flex-direction: column;\n text-align: start;\n\n ", "\n\n ", "\n "])), function (_ref5) {
72
- var accordion = _ref5.theme.yoga.components.accordion;
73
- return "\n gap: " + (subtitle ? accordion.gap.header : 0) + "px;\n margin: " + (subtitle ? 0 : accordion.paddingArrow.total + "px 0") + ";\n ";
74
- }, disabled && (0, _styledComponents.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n ", "\n "])), function (_ref6) {
75
- var text = _ref6.theme.yoga.colors.text;
76
- return "\n color: " + text.secundary + ";\n ";
77
- }));
78
-
79
- var AccordionContent = _styledComponents["default"].div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n height: auto;\n max-height: ", ";\n overflow: hidden;\n transition: max-height 200ms ease-in-out;\n\n ", "\n\n ", "\n "])), function (_ref7) {
80
- var isOpen = _ref7.isOpen;
81
- return isOpen ? '9999px' : '0';
82
- }, function (_ref8) {
83
- var accordion = _ref8.theme.yoga.components.accordion;
84
- return small && (0, _styledComponents.css)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n ", " {\n padding-bottom: ", "px;\n }\n "])), _Content["default"], accordion.padding.small);
85
- }, !hasHorizontalPadding && (0, _styledComponents.css)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n ", " {\n padding-left: 0;\n padding-right: 0;\n }\n "])), _Content["default"]));
86
-
87
- var ArrowWrapper = _styledComponents["default"].div(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n align-items: center;\n display: flex;\n justify-content: center;\n\n svg {\n transform: ", ";\n transition: all 200ms ease-out 0s;\n\n ", "\n }\n\n ", "\n "])), function (_ref9) {
88
- var isOpen = _ref9.isOpen;
89
- return isOpen ? 'rotate(180deg)' : 'rotate(0deg)';
90
- }, function (_ref10) {
91
- var _ref10$theme$yoga$col = _ref10.theme.yoga.colors,
92
- primary = _ref10$theme$yoga$col.primary,
93
- text = _ref10$theme$yoga$col.text;
94
- return "\n fill: " + (disabled ? text.secondary : primary) + ";\n ";
95
- }, function (_ref11) {
96
- var accordion = _ref11.theme.yoga.components.accordion;
97
- return "\n padding: " + accordion.paddingArrow.total + "px;\n ";
52
+ var Header = _styledComponents["default"].button(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n align-items: center;\n background-color: transparent;\n border: none;\n cursor: pointer;\n display: flex;\n justify-content: space-between;\n width: 100%;\n\n ", "\n\n &:focus-visible {\n ", "\n }\n\n ", "\n"])), function (_ref2) {
53
+ var accordion = _ref2.theme.yoga.components.accordion,
54
+ small = _ref2.small,
55
+ hasHorizontalPadding = _ref2.hasHorizontalPadding;
56
+ return "\n padding:" + getVerticalPadding(accordion, small) + "px " + getHorizontalPadding(accordion, hasHorizontalPadding) + "px;\n";
57
+ }, function (_ref3) {
58
+ var elements = _ref3.theme.yoga.colors.elements;
59
+ return "\n background: " + elements.backgroundAndDisabled + ";\n\n ";
60
+ }, function (_ref4) {
61
+ var disabled = _ref4.disabled;
62
+ return disabled && (0, _styledComponents.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n cursor: not-allowed;\n "])));
63
+ });
64
+
65
+ var Title = _styledComponents["default"].div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n align-items: flex-start;\n display: flex;\n flex-direction: column;\n text-align: start;\n\n ", "\n\n ", "\n"])), function (_ref5) {
66
+ var accordion = _ref5.theme.yoga.components.accordion,
67
+ subtitle = _ref5.subtitle;
68
+ return "\n gap: " + (subtitle ? accordion.gap.header : 0) + "px;\n margin: " + (subtitle ? 0 : accordion.paddingArrow.total + "px 0") + ";\n";
69
+ }, function (_ref6) {
70
+ var disabled = _ref6.disabled;
71
+ return disabled && (0, _styledComponents.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n ", "\n "])), function (_ref7) {
72
+ var text = _ref7.theme.yoga.colors.text;
73
+ return "\n color: " + text.secundary + ";\n ";
98
74
  });
75
+ });
76
+
77
+ var AccordionContent = _styledComponents["default"].div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n height: auto;\n max-height: ", ";\n overflow: hidden;\n transition: max-height 200ms ease-in-out;\n\n ", "\n\n ", "\n"])), function (_ref8) {
78
+ var isOpen = _ref8.isOpen;
79
+ return isOpen ? '9999px' : '0';
80
+ }, function (_ref9) {
81
+ var accordion = _ref9.theme.yoga.components.accordion,
82
+ small = _ref9.small;
83
+ return small && (0, _styledComponents.css)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n ", " {\n padding-bottom: ", "px;\n }\n "])), _Content["default"], accordion.padding.small);
84
+ }, function (_ref10) {
85
+ var hasHorizontalPadding = _ref10.hasHorizontalPadding;
86
+ return !hasHorizontalPadding && (0, _styledComponents.css)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n ", " {\n padding-left: 0;\n padding-right: 0;\n }\n "])), _Content["default"]);
87
+ });
88
+
89
+ var ArrowWrapper = _styledComponents["default"].div(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n align-items: center;\n display: flex;\n justify-content: center;\n\n svg {\n transform: ", ";\n transition: all 200ms ease-out 0s;\n\n ", "\n }\n\n ", "\n"])), function (_ref11) {
90
+ var isOpen = _ref11.isOpen;
91
+ return isOpen ? 'rotate(180deg)' : 'rotate(0deg)';
92
+ }, function (_ref12) {
93
+ var _ref12$theme$yoga$col = _ref12.theme.yoga.colors,
94
+ primary = _ref12$theme$yoga$col.primary,
95
+ text = _ref12$theme$yoga$col.text,
96
+ disabled = _ref12.disabled;
97
+ return "\n fill: " + (disabled ? text.secondary : primary) + ";\n ";
98
+ }, function (_ref13) {
99
+ var accordion = _ref13.theme.yoga.components.accordion;
100
+ return "\n padding: " + accordion.paddingArrow.total + "px;\n";
101
+ });
102
+
103
+ var Accordion = function Accordion(_ref14) {
104
+ var title = _ref14.title,
105
+ subtitle = _ref14.subtitle,
106
+ children = _ref14.children,
107
+ disabled = _ref14.disabled,
108
+ expanded = _ref14.expanded,
109
+ small = _ref14.small,
110
+ hasHorizontalPadding = _ref14.hasHorizontalPadding,
111
+ props = _objectWithoutPropertiesLoose(_ref14, _excluded);
112
+
113
+ var _useState = (0, _react.useState)(expanded),
114
+ open = _useState[0],
115
+ setOpen = _useState[1];
99
116
 
100
- return /*#__PURE__*/_react["default"].createElement(AccordionWrapper, props, /*#__PURE__*/_react["default"].createElement(Header, {
117
+ return /*#__PURE__*/_react["default"].createElement(AccordionWrapper, _extends({
118
+ disabled: disabled
119
+ }, props), /*#__PURE__*/_react["default"].createElement(Header, {
101
120
  disabled: disabled,
102
121
  onClick: function onClick() {
103
- setOpen(!open);
104
- }
105
- }, /*#__PURE__*/_react["default"].createElement(Title, null, small ? /*#__PURE__*/_react["default"].createElement(_yoga.Text.Small, {
122
+ setOpen(function (o) {
123
+ return !o;
124
+ });
125
+ },
126
+ small: small,
127
+ hasHorizontalPadding: hasHorizontalPadding
128
+ }, /*#__PURE__*/_react["default"].createElement(Title, {
129
+ subtitle: subtitle
130
+ }, small ? /*#__PURE__*/_react["default"].createElement(_yoga.Text.Small, {
106
131
  color: disabled ? 'deep' : undefined
107
132
  }, title) : /*#__PURE__*/_react["default"].createElement(_yoga.Text.Medium, {
108
133
  color: disabled ? 'deep' : undefined,
@@ -110,12 +135,15 @@ var Accordion = function Accordion(_ref) {
110
135
  }, title), /*#__PURE__*/_react["default"].createElement(_yoga.Text.Small, {
111
136
  color: "deep"
112
137
  }, subtitle)), /*#__PURE__*/_react["default"].createElement(ArrowWrapper, {
113
- isOpen: open
138
+ isOpen: open,
139
+ disabled: disabled
114
140
  }, /*#__PURE__*/_react["default"].createElement(_yogaIcons.ChevronDown, {
115
141
  width: 24,
116
142
  height: 24
117
143
  }))), /*#__PURE__*/_react["default"].createElement(AccordionContent, {
118
- isOpen: open
144
+ isOpen: open,
145
+ small: small,
146
+ hasHorizontalPadding: hasHorizontalPadding
119
147
  }, children), /*#__PURE__*/_react["default"].createElement(_yoga.Divider, null));
120
148
  };
121
149
 
package/cjs/Feedback/web/Feedback.js CHANGED
@@ -32,7 +32,7 @@ var VARIANT_ICONS = {
32
32
  fill: 'hope'
33
33
  },
34
34
  informative: {
35
- as: _yogaIcons.AlertCircle,
35
+ as: _yogaIcons.Info,
36
36
  fill: 'relax'
37
37
  },
38
38
  attention: {
package/cjs/Popover/web/Popover.js CHANGED
@@ -52,9 +52,18 @@ function Popover(_ref) {
52
52
  }, title), /*#__PURE__*/_react["default"].createElement(_yoga.Text.Small, {
53
53
  m: "zero",
54
54
  color: "white"
55
- }, description)), /*#__PURE__*/_react["default"].createElement("div", {
55
+ }, description)), /*#__PURE__*/_react["default"].createElement("button", {
56
+ type: "button",
57
+ style: {
58
+ all: 'unset'
59
+ },
56
60
  onMouseEnter: handleShowPopover,
57
- onMouseLeave: handleHidePopover
61
+ onMouseLeave: handleHidePopover,
62
+ onTouchStart: handleShowPopover,
63
+ onTouchEnd: handleHidePopover,
64
+ onClick: function onClick(event) {
65
+ return event.preventDefault();
66
+ }
58
67
  }, children));
59
68
  }
60
69
 
package/esm/Accordion/web/Accordion.js CHANGED
@@ -1,87 +1,113 @@
1
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9;
2
-
3
1
  var _excluded = ["title", "subtitle", "children", "disabled", "expanded", "small", "hasHorizontalPadding"];
4
2
 
5
- function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
3
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9;
4
+
5
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
6
6
 
7
7
  function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
8
8
 
9
+ function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
10
+
9
11
  import React, { useState } from 'react';
10
12
  import styled, { css } from 'styled-components';
11
13
  import { string, node, bool } from 'prop-types';
12
14
  import { ChevronDown } from '@gympass/yoga-icons';
13
15
  import { Text, Divider } from '@gympass/yoga';
14
16
  import Content from './Content';
17
+ var AccordionWrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n border: none;\n display: flex;\n flex-direction: column;\n position: relative;\n width: 100%;\n z-index: 1;\n\n ", "\n\n hr {\n bottom: 0;\n left: 0;\n margin: 0;\n position: absolute;\n z-index: -1;\n }\n"])), function (_ref) {
18
+ var _ref$theme$yoga$color = _ref.theme.yoga.colors,
19
+ white = _ref$theme$yoga$color.white,
20
+ elements = _ref$theme$yoga$color.elements,
21
+ disabled = _ref.disabled;
22
+ return "\n background: " + (disabled ? elements.backgroundAndDisabled : white) + "\n";
23
+ });
15
24
 
16
- var Accordion = function Accordion(_ref) {
17
- var title = _ref.title,
18
- subtitle = _ref.subtitle,
19
- children = _ref.children,
20
- disabled = _ref.disabled,
21
- expanded = _ref.expanded,
22
- small = _ref.small,
23
- hasHorizontalPadding = _ref.hasHorizontalPadding,
24
- props = _objectWithoutPropertiesLoose(_ref, _excluded);
25
+ var getVerticalPadding = function getVerticalPadding(accordion, small) {
26
+ if (small) return accordion.padding.small;
27
+ return accordion.padding.large;
28
+ };
29
+
30
+ var getHorizontalPadding = function getHorizontalPadding(accordion, hasHorizontalPadding) {
31
+ if (hasHorizontalPadding) return accordion.padding.standard;
32
+ return accordion.padding.zero;
33
+ };
34
+
35
+ var Header = styled.button(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n align-items: center;\n background-color: transparent;\n border: none;\n cursor: pointer;\n display: flex;\n justify-content: space-between;\n width: 100%;\n\n ", "\n\n &:focus-visible {\n ", "\n }\n\n ", "\n"])), function (_ref2) {
36
+ var accordion = _ref2.theme.yoga.components.accordion,
37
+ small = _ref2.small,
38
+ hasHorizontalPadding = _ref2.hasHorizontalPadding;
39
+ return "\n padding:" + getVerticalPadding(accordion, small) + "px " + getHorizontalPadding(accordion, hasHorizontalPadding) + "px;\n";
40
+ }, function (_ref3) {
41
+ var elements = _ref3.theme.yoga.colors.elements;
42
+ return "\n background: " + elements.backgroundAndDisabled + ";\n\n ";
43
+ }, function (_ref4) {
44
+ var disabled = _ref4.disabled;
45
+ return disabled && css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n cursor: not-allowed;\n "])));
46
+ });
47
+ var Title = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n align-items: flex-start;\n display: flex;\n flex-direction: column;\n text-align: start;\n\n ", "\n\n ", "\n"])), function (_ref5) {
48
+ var accordion = _ref5.theme.yoga.components.accordion,
49
+ subtitle = _ref5.subtitle;
50
+ return "\n gap: " + (subtitle ? accordion.gap.header : 0) + "px;\n margin: " + (subtitle ? 0 : accordion.paddingArrow.total + "px 0") + ";\n";
51
+ }, function (_ref6) {
52
+ var disabled = _ref6.disabled;
53
+ return disabled && css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n ", "\n "])), function (_ref7) {
54
+ var text = _ref7.theme.yoga.colors.text;
55
+ return "\n color: " + text.secundary + ";\n ";
56
+ });
57
+ });
58
+ var AccordionContent = styled.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n height: auto;\n max-height: ", ";\n overflow: hidden;\n transition: max-height 200ms ease-in-out;\n\n ", "\n\n ", "\n"])), function (_ref8) {
59
+ var isOpen = _ref8.isOpen;
60
+ return isOpen ? '9999px' : '0';
61
+ }, function (_ref9) {
62
+ var accordion = _ref9.theme.yoga.components.accordion,
63
+ small = _ref9.small;
64
+ return small && css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n ", " {\n padding-bottom: ", "px;\n }\n "])), Content, accordion.padding.small);
65
+ }, function (_ref10) {
66
+ var hasHorizontalPadding = _ref10.hasHorizontalPadding;
67
+ return !hasHorizontalPadding && css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n ", " {\n padding-left: 0;\n padding-right: 0;\n }\n "])), Content);
68
+ });
69
+ var ArrowWrapper = styled.div(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n align-items: center;\n display: flex;\n justify-content: center;\n\n svg {\n transform: ", ";\n transition: all 200ms ease-out 0s;\n\n ", "\n }\n\n ", "\n"])), function (_ref11) {
70
+ var isOpen = _ref11.isOpen;
71
+ return isOpen ? 'rotate(180deg)' : 'rotate(0deg)';
72
+ }, function (_ref12) {
73
+ var _ref12$theme$yoga$col = _ref12.theme.yoga.colors,
74
+ primary = _ref12$theme$yoga$col.primary,
75
+ text = _ref12$theme$yoga$col.text,
76
+ disabled = _ref12.disabled;
77
+ return "\n fill: " + (disabled ? text.secondary : primary) + ";\n ";
78
+ }, function (_ref13) {
79
+ var accordion = _ref13.theme.yoga.components.accordion;
80
+ return "\n padding: " + accordion.paddingArrow.total + "px;\n";
81
+ });
82
+
83
+ var Accordion = function Accordion(_ref14) {
84
+ var title = _ref14.title,
85
+ subtitle = _ref14.subtitle,
86
+ children = _ref14.children,
87
+ disabled = _ref14.disabled,
88
+ expanded = _ref14.expanded,
89
+ small = _ref14.small,
90
+ hasHorizontalPadding = _ref14.hasHorizontalPadding,
91
+ props = _objectWithoutPropertiesLoose(_ref14, _excluded);
25
92
 
26
93
  var _useState = useState(expanded),
27
94
  open = _useState[0],
28
95
  setOpen = _useState[1];
29
96
 
30
- var getVerticalPadding = function getVerticalPadding(accordion) {
31
- if (small) return accordion.padding.small;
32
- return accordion.padding.large;
33
- };
34
-
35
- var getHorizontalPadding = function getHorizontalPadding(accordion) {
36
- if (hasHorizontalPadding) return accordion.padding.standard;
37
- return accordion.padding.zero;
38
- };
39
-
40
- var AccordionWrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n border: none;\n display: flex;\n flex-direction: column;\n position: relative;\n width: 100%;\n z-index: 1;\n\n ", "\n\n hr {\n bottom: 0;\n left: 0;\n margin: 0;\n position: absolute;\n z-index: -1;\n }\n "])), function (_ref2) {
41
- var _ref2$theme$yoga$colo = _ref2.theme.yoga.colors,
42
- white = _ref2$theme$yoga$colo.white,
43
- elements = _ref2$theme$yoga$colo.elements;
44
- return "\n background: " + (disabled ? elements.backgroundAndDisabled : white) + "\n ";
45
- });
46
- var Header = styled.button(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n align-items: center;\n background-color: transparent;\n border: none;\n cursor: pointer;\n display: flex;\n justify-content: space-between;\n width: 100%;\n\n ", "\n\n &:focus-visible {\n ", "\n }\n\n ", "\n "])), function (_ref3) {
47
- var accordion = _ref3.theme.yoga.components.accordion;
48
- return "\n padding:" + getVerticalPadding(accordion) + "px " + getHorizontalPadding(accordion) + "px;\n ";
49
- }, function (_ref4) {
50
- var elements = _ref4.theme.yoga.colors.elements;
51
- return "\n background: " + elements.backgroundAndDisabled + ";\n\n ";
52
- }, disabled && css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n cursor: not-allowed;\n "]))));
53
- var Title = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n align-items: flex-start;\n display: flex;\n flex-direction: column;\n text-align: start;\n\n ", "\n\n ", "\n "])), function (_ref5) {
54
- var accordion = _ref5.theme.yoga.components.accordion;
55
- return "\n gap: " + (subtitle ? accordion.gap.header : 0) + "px;\n margin: " + (subtitle ? 0 : accordion.paddingArrow.total + "px 0") + ";\n ";
56
- }, disabled && css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n ", "\n "])), function (_ref6) {
57
- var text = _ref6.theme.yoga.colors.text;
58
- return "\n color: " + text.secundary + ";\n ";
59
- }));
60
- var AccordionContent = styled.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n height: auto;\n max-height: ", ";\n overflow: hidden;\n transition: max-height 200ms ease-in-out;\n\n ", "\n\n ", "\n "])), function (_ref7) {
61
- var isOpen = _ref7.isOpen;
62
- return isOpen ? '9999px' : '0';
63
- }, function (_ref8) {
64
- var accordion = _ref8.theme.yoga.components.accordion;
65
- return small && css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n ", " {\n padding-bottom: ", "px;\n }\n "])), Content, accordion.padding.small);
66
- }, !hasHorizontalPadding && css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n ", " {\n padding-left: 0;\n padding-right: 0;\n }\n "])), Content));
67
- var ArrowWrapper = styled.div(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n align-items: center;\n display: flex;\n justify-content: center;\n\n svg {\n transform: ", ";\n transition: all 200ms ease-out 0s;\n\n ", "\n }\n\n ", "\n "])), function (_ref9) {
68
- var isOpen = _ref9.isOpen;
69
- return isOpen ? 'rotate(180deg)' : 'rotate(0deg)';
70
- }, function (_ref10) {
71
- var _ref10$theme$yoga$col = _ref10.theme.yoga.colors,
72
- primary = _ref10$theme$yoga$col.primary,
73
- text = _ref10$theme$yoga$col.text;
74
- return "\n fill: " + (disabled ? text.secondary : primary) + ";\n ";
75
- }, function (_ref11) {
76
- var accordion = _ref11.theme.yoga.components.accordion;
77
- return "\n padding: " + accordion.paddingArrow.total + "px;\n ";
78
- });
79
- return /*#__PURE__*/React.createElement(AccordionWrapper, props, /*#__PURE__*/React.createElement(Header, {
97
+ return /*#__PURE__*/React.createElement(AccordionWrapper, _extends({
98
+ disabled: disabled
99
+ }, props), /*#__PURE__*/React.createElement(Header, {
80
100
  disabled: disabled,
81
101
  onClick: function onClick() {
82
- setOpen(!open);
83
- }
84
- }, /*#__PURE__*/React.createElement(Title, null, small ? /*#__PURE__*/React.createElement(Text.Small, {
102
+ setOpen(function (o) {
103
+ return !o;
104
+ });
105
+ },
106
+ small: small,
107
+ hasHorizontalPadding: hasHorizontalPadding
108
+ }, /*#__PURE__*/React.createElement(Title, {
109
+ subtitle: subtitle
110
+ }, small ? /*#__PURE__*/React.createElement(Text.Small, {
85
111
  color: disabled ? 'deep' : undefined
86
112
  }, title) : /*#__PURE__*/React.createElement(Text.Medium, {
87
113
  color: disabled ? 'deep' : undefined,
@@ -89,12 +115,15 @@ var Accordion = function Accordion(_ref) {
89
115
  }, title), /*#__PURE__*/React.createElement(Text.Small, {
90
116
  color: "deep"
91
117
  }, subtitle)), /*#__PURE__*/React.createElement(ArrowWrapper, {
92
- isOpen: open
118
+ isOpen: open,
119
+ disabled: disabled
93
120
  }, /*#__PURE__*/React.createElement(ChevronDown, {
94
121
  width: 24,
95
122
  height: 24
96
123
  }))), /*#__PURE__*/React.createElement(AccordionContent, {
97
- isOpen: open
124
+ isOpen: open,
125
+ small: small,
126
+ hasHorizontalPadding: hasHorizontalPadding
98
127
  }, children), /*#__PURE__*/React.createElement(Divider, null));
99
128
  };
100
129
 
package/esm/Feedback/web/Feedback.js CHANGED
@@ -6,7 +6,7 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
6
6
 
7
7
  import { arrayOf, node, oneOf, oneOfType, string, bool } from 'prop-types';
8
8
  import React from 'react';
9
- import { CheckedFull, AlertCircle, AlertTriangle } from '@gympass/yoga-icons';
9
+ import { CheckedFull, Info, AlertTriangle } from '@gympass/yoga-icons';
10
10
  import Icon from '../../Icon';
11
11
  import Box from '../../Box';
12
12
  import Text from '../../Text';
@@ -18,7 +18,7 @@ var VARIANT_ICONS = {
18
18
  fill: 'hope'
19
19
  },
20
20
  informative: {
21
- as: AlertCircle,
21
+ as: Info,
22
22
  fill: 'relax'
23
23
  },
24
24
  attention: {
package/esm/Popover/web/Popover.js CHANGED
@@ -40,9 +40,18 @@ function Popover(_ref) {
40
40
  }, title), /*#__PURE__*/React.createElement(Text.Small, {
41
41
  m: "zero",
42
42
  color: "white"
43
- }, description)), /*#__PURE__*/React.createElement("div", {
43
+ }, description)), /*#__PURE__*/React.createElement("button", {
44
+ type: "button",
45
+ style: {
46
+ all: 'unset'
47
+ },
44
48
  onMouseEnter: handleShowPopover,
45
- onMouseLeave: handleHidePopover
49
+ onMouseLeave: handleHidePopover,
50
+ onTouchStart: handleShowPopover,
51
+ onTouchEnd: handleHidePopover,
52
+ onClick: function onClick(event) {
53
+ return event.preventDefault();
54
+ }
46
55
  }, children));
47
56
  }
48
57
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gympass/yoga",
3
- "version": "7.72.2",
3
+ "version": "7.72.4",
4
4
  "description": "Gympass component library",
5
5
  "main": "./cjs",
6
6
  "sideEffects": false,
@@ -53,7 +53,7 @@
53
53
  "react": ">=16",
54
54
  "styled-components": "^4.4.0"
55
55
  },
56
- "gitHead": "b7d7d085f0f2c59c3ae24ed8d0ba3d0be8ca48f7",
56
+ "gitHead": "56a1fbb6108c24a4c9e4610e7ae93c1bcd7b245d",
57
57
  "module": "./esm",
58
58
  "private": false,
59
59
  "react-native": "./cjs/index.native.js"