@gympass/yoga 7.75.7 → 7.76.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -115,6 +115,11 @@ var Accordion = function Accordion(_ref15) {
115
115
  open = _useState[0],
116
116
  setOpen = _useState[1];
117
117
 
118
+ var _React$Children$toArr = _react["default"].Children.toArray(children),
119
+ summary = _React$Children$toArr[0],
120
+ contentChildren = _React$Children$toArr.slice(1);
121
+
122
+ var hasSummary = summary.type.displayName === 'Accordion.Summary';
118
123
  return /*#__PURE__*/_react["default"].createElement(AccordionWrapper, _extends({
119
124
  disabled: disabled
120
125
  }, props), /*#__PURE__*/_react["default"].createElement(Header, {
@@ -126,7 +131,7 @@ var Accordion = function Accordion(_ref15) {
126
131
  },
127
132
  small: small,
128
133
  hasHorizontalPadding: hasHorizontalPadding
129
- }, /*#__PURE__*/_react["default"].createElement(Title, {
134
+ }, hasSummary ? summary : /*#__PURE__*/_react["default"].createElement(Title, {
130
135
  subtitle: subtitle
131
136
  }, small ? /*#__PURE__*/_react["default"].createElement(_yoga.Text.Small, {
132
137
  color: disabled ? 'deep' : undefined
@@ -145,11 +150,11 @@ var Accordion = function Accordion(_ref15) {
145
150
  isOpen: open,
146
151
  small: small,
147
152
  hasHorizontalPadding: hasHorizontalPadding
148
- }, children), /*#__PURE__*/_react["default"].createElement(_yoga.Divider, null));
153
+ }, hasSummary ? contentChildren : children), /*#__PURE__*/_react["default"].createElement(_yoga.Divider, null));
149
154
  };
150
155
 
151
156
  Accordion.propTypes = {
152
- title: _propTypes.string.isRequired,
157
+ title: _propTypes.string,
153
158
  subtitle: _propTypes.string,
154
159
  children: _propTypes.node.isRequired,
155
160
  disabled: _propTypes.bool,
@@ -158,6 +163,7 @@ Accordion.propTypes = {
158
163
  hasHorizontalPadding: _propTypes.bool
159
164
  };
160
165
  Accordion.defaultProps = {
166
+ title: undefined,
161
167
  subtitle: undefined,
162
168
  disabled: false,
163
169
  expanded: false,
@@ -16,5 +16,6 @@ var Content = _styledComponents["default"].div(_templateObject || (_templateObje
16
16
  return "\n padding: 0 " + accordion.padding.standard + "px " + accordion.padding.standard + "px;\n ";
17
17
  });
18
18
 
19
+ Content.displayName = 'Accordion.Content';
19
20
  var _default = Content;
20
21
  exports["default"] = _default;
@@ -0,0 +1,22 @@
1
+ "use strict";
2
+
3
+ exports.__esModule = true;
4
+ exports["default"] = void 0;
5
+
6
+ var _react = _interopRequireDefault(require("react"));
7
+
8
+ var _Box = _interopRequireDefault(require("../../Box"));
9
+
10
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
11
+
12
+ 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); }
13
+
14
+ function Summary(props) {
15
+ return /*#__PURE__*/_react["default"].createElement(_Box["default"], _extends({
16
+ width: "100%"
17
+ }, props));
18
+ }
19
+
20
+ Summary.displayName = 'Accordion.Summary';
21
+ var _default = Summary;
22
+ exports["default"] = _default;
@@ -5,6 +5,8 @@ exports["default"] = void 0;
5
5
 
6
6
  var _Accordion = _interopRequireDefault(require("./Accordion"));
7
7
 
8
+ var _Summary = _interopRequireDefault(require("./Summary"));
9
+
8
10
  var _Content = _interopRequireDefault(require("./Content"));
9
11
 
10
12
  var _Small = _interopRequireDefault(require("./Small"));
@@ -12,6 +14,7 @@ var _Small = _interopRequireDefault(require("./Small"));
12
14
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
13
15
 
14
16
  _Accordion["default"].Content = _Content["default"];
17
+ _Accordion["default"].Summary = _Summary["default"];
15
18
  _Accordion["default"].Small = _Small["default"];
16
19
  var _default = _Accordion["default"];
17
20
  exports["default"] = _default;
@@ -11,12 +11,14 @@ var _yoga = require("@gympass/yoga");
11
11
 
12
12
  var _styles = require("./styles");
13
13
 
14
- var _excluded = ["children", "title", "description", "position", "width", "height"];
14
+ var _excluded = ["children", "title", "description", "position", "width", "height", "zIndex", "a11yId"];
15
15
 
16
16
  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); }
17
17
 
18
18
  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; }
19
19
 
20
+ 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); }
21
+
20
22
  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; }
21
23
 
22
24
  function Popover(_ref) {
@@ -26,48 +28,59 @@ function Popover(_ref) {
26
28
  position = _ref.position,
27
29
  width = _ref.width,
28
30
  height = _ref.height,
31
+ zIndex = _ref.zIndex,
32
+ a11yId = _ref.a11yId,
29
33
  props = _objectWithoutPropertiesLoose(_ref, _excluded);
30
34
 
31
35
  var _useState = (0, _react.useState)(false),
32
36
  isPopoverOpen = _useState[0],
33
37
  setIsPopoverOpen = _useState[1];
34
38
 
35
- function handleShowPopover() {
39
+ var handleShowPopover = function handleShowPopover() {
36
40
  setIsPopoverOpen(true);
37
- }
41
+ };
38
42
 
39
- function handleHidePopover() {
43
+ var handleHidePopover = function handleHidePopover() {
40
44
  setIsPopoverOpen(false);
41
- }
45
+ };
42
46
 
43
- return /*#__PURE__*/_react["default"].createElement(_styles.Wrapper, props, isPopoverOpen && /*#__PURE__*/_react["default"].createElement(_styles.PopoverContainer, {
47
+ return /*#__PURE__*/_react["default"].createElement(_styles.Wrapper, props, isPopoverOpen && /*#__PURE__*/_react["default"].createElement(_styles.PopoverContainer, _extends({}, a11yId && {
48
+ id: a11yId
49
+ }, {
44
50
  position: position,
45
51
  width: width,
46
52
  height: height,
47
- role: "tooltip"
48
- }, !!title && /*#__PURE__*/_react["default"].createElement(_yoga.Text.Small, {
53
+ role: "tooltip",
54
+ $zIndex: zIndex
55
+ }), !!title && /*#__PURE__*/_react["default"].createElement(_yoga.Text.Small, {
49
56
  mb: "xxxsmall",
50
57
  fw: "medium",
51
58
  color: "white"
52
59
  }, title), /*#__PURE__*/_react["default"].createElement(_yoga.Text.Small, {
53
60
  m: "zero",
54
61
  color: "white"
55
- }, description)), /*#__PURE__*/_react["default"].createElement("button", {
56
- type: "button",
57
- style: {
58
- all: 'unset'
59
- },
62
+ }, description)), /*#__PURE__*/_react["default"].createElement(_styles.PopoverButton, _extends({}, a11yId && {
63
+ 'aria-describedby': a11yId
64
+ }, {
60
65
  onMouseEnter: handleShowPopover,
61
66
  onMouseLeave: handleHidePopover,
62
67
  onTouchStart: handleShowPopover,
63
68
  onTouchEnd: handleHidePopover,
64
69
  onClick: function onClick(event) {
65
70
  return event.preventDefault();
71
+ },
72
+ onKeyDown: function onKeyDown(event) {
73
+ if (event.key === 'Enter') {
74
+ setIsPopoverOpen(function (current) {
75
+ return !current;
76
+ });
77
+ }
66
78
  }
67
- }, children));
79
+ }), children));
68
80
  }
69
81
 
70
82
  Popover.propTypes = {
83
+ a11yId: _propTypes.string,
71
84
  children: _propTypes.node.isRequired,
72
85
  title: _propTypes.string,
73
86
  description: _propTypes.string.isRequired,
@@ -75,13 +88,16 @@ Popover.propTypes = {
75
88
  /** Position of the popover relative to the children. Accepted values: bottom-[start|center|end], left-[start|center|end], top-[start|center|end] or right-[start|center|end] */
76
89
  position: (0, _propTypes.oneOf)(['bottom-start', 'bottom-center', 'bottom-end', 'left-start', 'left-center', 'left-end', 'top-start', 'top-center', 'top-end', 'right-start', 'right-center', 'right-end']),
77
90
  width: _propTypes.number,
78
- height: _propTypes.number
91
+ height: _propTypes.number,
92
+ zIndex: _propTypes.number
79
93
  };
80
94
  Popover.defaultProps = {
95
+ a11yId: undefined,
81
96
  title: undefined,
82
97
  position: 'bottom-center',
83
98
  width: 265,
84
- height: 116
99
+ height: 200,
100
+ zIndex: 1
85
101
  };
86
102
  var _default = Popover;
87
103
  exports["default"] = _default;
@@ -1,11 +1,11 @@
1
1
  "use strict";
2
2
 
3
3
  exports.__esModule = true;
4
- exports.Wrapper = exports.PopoverContainer = void 0;
4
+ exports.Wrapper = exports.PopoverContainer = exports.PopoverButton = void 0;
5
5
 
6
6
  var _styledComponents = _interopRequireWildcard(require("styled-components"));
7
7
 
8
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15;
8
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17;
9
9
 
10
10
  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); }
11
11
 
@@ -62,8 +62,18 @@ var PopoverContainer = _styledComponents["default"].div(_templateObject14 || (_t
62
62
  radii = _ref$theme$yoga.radii,
63
63
  position = _ref.position,
64
64
  width = _ref.width,
65
- height = _ref.height;
66
- return (0, _styledComponents.css)(_templateObject15 || (_templateObject15 = _taggedTemplateLiteralLoose(["\n position: absolute;\n\n width: max-content;\n max-width: ", "px;\n height: max-content;\n max-height: ", "px;\n\n border-radius: ", "px;\n background-color: ", ";\n padding: ", "px;\n\n ", ";\n "])), width, height, radii.small, colors.stamina, spacing.small, popoverContainerPositionModifier[position]);
65
+ height = _ref.height,
66
+ $zIndex = _ref.$zIndex;
67
+ return (0, _styledComponents.css)(_templateObject15 || (_templateObject15 = _taggedTemplateLiteralLoose(["\n position: absolute;\n overflow: auto;\n width: max-content;\n max-width: ", "px;\n height: max-content;\n max-height: ", "px;\n\n border-radius: ", "px;\n background-color: ", ";\n padding: ", "px;\n z-index: ", ";\n\n ", ";\n "])), width, height, radii.small, colors.stamina, spacing.small, $zIndex, popoverContainerPositionModifier[position]);
67
68
  });
68
69
 
69
- exports.PopoverContainer = PopoverContainer;
70
+ exports.PopoverContainer = PopoverContainer;
71
+
72
+ var PopoverButton = _styledComponents["default"].button.attrs({
73
+ type: 'button'
74
+ })(_templateObject16 || (_templateObject16 = _taggedTemplateLiteralLoose(["\n all: unset;\n\n ", "\n"])), function (_ref2) {
75
+ var elevations = _ref2.theme.yoga.elevations;
76
+ return (0, _styledComponents.css)(_templateObject17 || (_templateObject17 = _taggedTemplateLiteralLoose(["\n @media (hover: hover) and (pointer: fine) {\n &:focus {\n box-shadow: ", ";\n transition: box-shadow ease 0.5s;\n }\n }\n "])), elevations.small);
77
+ });
78
+
79
+ exports.PopoverButton = PopoverButton;
@@ -95,6 +95,11 @@ var Accordion = function Accordion(_ref15) {
95
95
  open = _useState[0],
96
96
  setOpen = _useState[1];
97
97
 
98
+ var _React$Children$toArr = React.Children.toArray(children),
99
+ summary = _React$Children$toArr[0],
100
+ contentChildren = _React$Children$toArr.slice(1);
101
+
102
+ var hasSummary = summary.type.displayName === 'Accordion.Summary';
98
103
  return /*#__PURE__*/React.createElement(AccordionWrapper, _extends({
99
104
  disabled: disabled
100
105
  }, props), /*#__PURE__*/React.createElement(Header, {
@@ -106,7 +111,7 @@ var Accordion = function Accordion(_ref15) {
106
111
  },
107
112
  small: small,
108
113
  hasHorizontalPadding: hasHorizontalPadding
109
- }, /*#__PURE__*/React.createElement(Title, {
114
+ }, hasSummary ? summary : /*#__PURE__*/React.createElement(Title, {
110
115
  subtitle: subtitle
111
116
  }, small ? /*#__PURE__*/React.createElement(Text.Small, {
112
117
  color: disabled ? 'deep' : undefined
@@ -125,11 +130,11 @@ var Accordion = function Accordion(_ref15) {
125
130
  isOpen: open,
126
131
  small: small,
127
132
  hasHorizontalPadding: hasHorizontalPadding
128
- }, children), /*#__PURE__*/React.createElement(Divider, null));
133
+ }, hasSummary ? contentChildren : children), /*#__PURE__*/React.createElement(Divider, null));
129
134
  };
130
135
 
131
136
  Accordion.propTypes = {
132
- title: string.isRequired,
137
+ title: string,
133
138
  subtitle: string,
134
139
  children: node.isRequired,
135
140
  disabled: bool,
@@ -138,6 +143,7 @@ Accordion.propTypes = {
138
143
  hasHorizontalPadding: bool
139
144
  };
140
145
  Accordion.defaultProps = {
146
+ title: undefined,
141
147
  subtitle: undefined,
142
148
  disabled: false,
143
149
  expanded: false,
@@ -102,6 +102,15 @@ describe('<Accordion />', function () {
102
102
  expect(container.firstChild).toMatchSnapshot();
103
103
  });
104
104
  });
105
+ it('should render the accordion summary', function () {
106
+ render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Accordion, {
107
+ title: "Title",
108
+ subtitle: "Subtitle"
109
+ }, /*#__PURE__*/React.createElement(Accordion.Summary, null, /*#__PURE__*/React.createElement(Text, null, "Summary")), /*#__PURE__*/React.createElement(Accordion.Content, null, /*#__PURE__*/React.createElement(Text, null, "Content")))));
110
+ expect(screen.getByText('Summary')).toBeInTheDocument();
111
+ expect(screen.queryByText('Title')).not.toBeInTheDocument();
112
+ expect(screen.queryByText('Subtitle')).not.toBeInTheDocument();
113
+ });
105
114
  it('should have className when passed as props', function () {
106
115
  render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Accordion, {
107
116
  title: "Title"
@@ -7,4 +7,5 @@ var Content = styled.div(_templateObject || (_templateObject = _taggedTemplateLi
7
7
  var accordion = _ref.theme.yoga.components.accordion;
8
8
  return "\n padding: 0 " + accordion.padding.standard + "px " + accordion.padding.standard + "px;\n ";
9
9
  });
10
+ Content.displayName = 'Accordion.Content';
10
11
  export default Content;
@@ -0,0 +1,13 @@
1
+ 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); }
2
+
3
+ import React from 'react';
4
+ import Box from '../../Box';
5
+
6
+ function Summary(props) {
7
+ return /*#__PURE__*/React.createElement(Box, _extends({
8
+ width: "100%"
9
+ }, props));
10
+ }
11
+
12
+ Summary.displayName = 'Accordion.Summary';
13
+ export default Summary;
@@ -1,6 +1,8 @@
1
1
  import Accordion from './Accordion';
2
+ import Summary from './Summary';
2
3
  import Content from './Content';
3
4
  import AccordionSmall from './Small';
4
5
  Accordion.Content = Content;
6
+ Accordion.Summary = Summary;
5
7
  Accordion.Small = AccordionSmall;
6
8
  export default Accordion;
@@ -1,11 +1,13 @@
1
- var _excluded = ["children", "title", "description", "position", "width", "height"];
1
+ var _excluded = ["children", "title", "description", "position", "width", "height", "zIndex", "a11yId"];
2
+
3
+ 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); }
2
4
 
3
5
  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; }
4
6
 
5
7
  import React, { useState } from 'react';
6
8
  import { node, number, oneOf, string } from 'prop-types';
7
9
  import { Text } from '@gympass/yoga';
8
- import { PopoverContainer, Wrapper } from './styles';
10
+ import { PopoverContainer, PopoverButton, Wrapper } from './styles';
9
11
 
10
12
  function Popover(_ref) {
11
13
  var children = _ref.children,
@@ -14,48 +16,59 @@ function Popover(_ref) {
14
16
  position = _ref.position,
15
17
  width = _ref.width,
16
18
  height = _ref.height,
19
+ zIndex = _ref.zIndex,
20
+ a11yId = _ref.a11yId,
17
21
  props = _objectWithoutPropertiesLoose(_ref, _excluded);
18
22
 
19
23
  var _useState = useState(false),
20
24
  isPopoverOpen = _useState[0],
21
25
  setIsPopoverOpen = _useState[1];
22
26
 
23
- function handleShowPopover() {
27
+ var handleShowPopover = function handleShowPopover() {
24
28
  setIsPopoverOpen(true);
25
- }
29
+ };
26
30
 
27
- function handleHidePopover() {
31
+ var handleHidePopover = function handleHidePopover() {
28
32
  setIsPopoverOpen(false);
29
- }
33
+ };
30
34
 
31
- return /*#__PURE__*/React.createElement(Wrapper, props, isPopoverOpen && /*#__PURE__*/React.createElement(PopoverContainer, {
35
+ return /*#__PURE__*/React.createElement(Wrapper, props, isPopoverOpen && /*#__PURE__*/React.createElement(PopoverContainer, _extends({}, a11yId && {
36
+ id: a11yId
37
+ }, {
32
38
  position: position,
33
39
  width: width,
34
40
  height: height,
35
- role: "tooltip"
36
- }, !!title && /*#__PURE__*/React.createElement(Text.Small, {
41
+ role: "tooltip",
42
+ $zIndex: zIndex
43
+ }), !!title && /*#__PURE__*/React.createElement(Text.Small, {
37
44
  mb: "xxxsmall",
38
45
  fw: "medium",
39
46
  color: "white"
40
47
  }, title), /*#__PURE__*/React.createElement(Text.Small, {
41
48
  m: "zero",
42
49
  color: "white"
43
- }, description)), /*#__PURE__*/React.createElement("button", {
44
- type: "button",
45
- style: {
46
- all: 'unset'
47
- },
50
+ }, description)), /*#__PURE__*/React.createElement(PopoverButton, _extends({}, a11yId && {
51
+ 'aria-describedby': a11yId
52
+ }, {
48
53
  onMouseEnter: handleShowPopover,
49
54
  onMouseLeave: handleHidePopover,
50
55
  onTouchStart: handleShowPopover,
51
56
  onTouchEnd: handleHidePopover,
52
57
  onClick: function onClick(event) {
53
58
  return event.preventDefault();
59
+ },
60
+ onKeyDown: function onKeyDown(event) {
61
+ if (event.key === 'Enter') {
62
+ setIsPopoverOpen(function (current) {
63
+ return !current;
64
+ });
65
+ }
54
66
  }
55
- }, children));
67
+ }), children));
56
68
  }
57
69
 
58
70
  Popover.propTypes = {
71
+ a11yId: string,
59
72
  children: node.isRequired,
60
73
  title: string,
61
74
  description: string.isRequired,
@@ -63,12 +76,15 @@ Popover.propTypes = {
63
76
  /** Position of the popover relative to the children. Accepted values: bottom-[start|center|end], left-[start|center|end], top-[start|center|end] or right-[start|center|end] */
64
77
  position: oneOf(['bottom-start', 'bottom-center', 'bottom-end', 'left-start', 'left-center', 'left-end', 'top-start', 'top-center', 'top-end', 'right-start', 'right-center', 'right-end']),
65
78
  width: number,
66
- height: number
79
+ height: number,
80
+ zIndex: number
67
81
  };
68
82
  Popover.defaultProps = {
83
+ a11yId: undefined,
69
84
  title: undefined,
70
85
  position: 'bottom-center',
71
86
  width: 265,
72
- height: 116
87
+ height: 200,
88
+ zIndex: 1
73
89
  };
74
90
  export default Popover;
@@ -1,4 +1,4 @@
1
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15;
1
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17;
2
2
 
3
3
  function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
4
4
 
@@ -49,6 +49,13 @@ export var PopoverContainer = styled.div(_templateObject14 || (_templateObject14
49
49
  radii = _ref$theme$yoga.radii,
50
50
  position = _ref.position,
51
51
  width = _ref.width,
52
- height = _ref.height;
53
- return css(_templateObject15 || (_templateObject15 = _taggedTemplateLiteralLoose(["\n position: absolute;\n\n width: max-content;\n max-width: ", "px;\n height: max-content;\n max-height: ", "px;\n\n border-radius: ", "px;\n background-color: ", ";\n padding: ", "px;\n\n ", ";\n "])), width, height, radii.small, colors.stamina, spacing.small, popoverContainerPositionModifier[position]);
52
+ height = _ref.height,
53
+ $zIndex = _ref.$zIndex;
54
+ return css(_templateObject15 || (_templateObject15 = _taggedTemplateLiteralLoose(["\n position: absolute;\n overflow: auto;\n width: max-content;\n max-width: ", "px;\n height: max-content;\n max-height: ", "px;\n\n border-radius: ", "px;\n background-color: ", ";\n padding: ", "px;\n z-index: ", ";\n\n ", ";\n "])), width, height, radii.small, colors.stamina, spacing.small, $zIndex, popoverContainerPositionModifier[position]);
55
+ });
56
+ export var PopoverButton = styled.button.attrs({
57
+ type: 'button'
58
+ })(_templateObject16 || (_templateObject16 = _taggedTemplateLiteralLoose(["\n all: unset;\n\n ", "\n"])), function (_ref2) {
59
+ var elevations = _ref2.theme.yoga.elevations;
60
+ return css(_templateObject17 || (_templateObject17 = _taggedTemplateLiteralLoose(["\n @media (hover: hover) and (pointer: fine) {\n &:focus {\n box-shadow: ", ";\n transition: box-shadow ease 0.5s;\n }\n }\n "])), elevations.small);
54
61
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gympass/yoga",
3
- "version": "7.75.7",
3
+ "version": "7.76.1",
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": "a8f9db2577dd79e2250ee1126db4ab46dbc7ae56",
56
+ "gitHead": "c5d3cd28c67e1bf206d267e6b736a99ac69868fd",
57
57
  "module": "./esm",
58
58
  "private": false,
59
59
  "react-native": "./cjs/index.native.js"