@commercetools-uikit/collapsible-motion 19.11.0 → 19.12.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.
@@ -12,7 +12,6 @@ var _Object$defineProperties = require('@babel/runtime-corejs3/core-js-stable/ob
12
12
  var _Object$defineProperty = require('@babel/runtime-corejs3/core-js-stable/object/define-property');
13
13
  var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
14
14
  var _slicedToArray = require('@babel/runtime-corejs3/helpers/slicedToArray');
15
- var _taggedTemplateLiteral = require('@babel/runtime-corejs3/helpers/taggedTemplateLiteral');
16
15
  var _pt = require('prop-types');
17
16
  var react$1 = require('react');
18
17
  var utils = require('@commercetools-uikit/utils');
@@ -34,21 +33,27 @@ var _Object$defineProperty__default = /*#__PURE__*/_interopDefault(_Object$defin
34
33
  var _pt__default = /*#__PURE__*/_interopDefault(_pt);
35
34
  var isNil__default = /*#__PURE__*/_interopDefault(isNil);
36
35
 
37
- var _templateObject, _templateObject2, _templateObject3, _templateObject4;
38
36
  function ownKeys(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
39
37
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
40
38
  const defaultProps = {
41
39
  minHeight: 0
42
40
  };
43
- const getMinHeight = minHeight => minHeight !== 0 ? "".concat(minHeight, "px") : minHeight;
41
+ const getMinHeight = minHeight => minHeight !== 0 ? `${minHeight}px` : minHeight;
44
42
  const getVisibility = height => height === 0 ? 'hidden' : 'visible';
45
43
  const createOpeningAnimation = function (height) {
46
44
  let minHeight = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
47
- return react.keyframes(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n 0% { height: ", "; overflow: hidden; visibility: ", "; }\n 99% { height: ", "px; overflow: hidden; }\n 100% { height: auto; overflow: visible; }\n "])), getMinHeight(minHeight), getVisibility(minHeight), height);
45
+ return react.keyframes`
46
+ 0% { height: ${getMinHeight(minHeight)}; overflow: hidden; visibility: ${getVisibility(minHeight)}; }
47
+ 99% { height: ${height}px; overflow: hidden; }
48
+ 100% { height: auto; overflow: visible; }
49
+ `;
48
50
  };
49
51
  const createClosingAnimation = function (height) {
50
52
  let minHeight = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
51
- return react.keyframes(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n from { height: ", "px; }\n to { height: ", "; overflow: hidden; visibility: ", "; }\n "])), height, getMinHeight(minHeight), getVisibility(minHeight));
53
+ return react.keyframes`
54
+ from { height: ${height}px; }
55
+ to { height: ${getMinHeight(minHeight)}; overflow: hidden; visibility: ${getVisibility(minHeight)}; }
56
+ `;
52
57
  };
53
58
  const useToggleAnimation = function (isOpen, toggle) {
54
59
  let minHeight = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
@@ -95,9 +100,12 @@ const ControlledCollapsibleMotion = props => {
95
100
  if (animation) {
96
101
  // By calling `css`, emotion injects the required CSS into the document head.
97
102
  // eslint-disable-next-line no-unused-expressions
98
- css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n animation: ", " 200ms\n forwards;\n "])), animation);
103
+ css`
104
+ animation: ${animation} 200ms
105
+ forwards;
106
+ `;
99
107
  animationStyle = {
100
- animation: "".concat(animation.name, " 200ms forwards")
108
+ animation: `${animation.name} 200ms forwards`
101
109
  };
102
110
  }
103
111
  return props.children({
@@ -135,9 +143,12 @@ const UncontrolledCollapsibleMotion = props => {
135
143
  if (animation) {
136
144
  // By calling `css`, emotion injects the required CSS into the document head.
137
145
  // eslint-disable-next-line no-unused-expressions
138
- css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n animation: ", " 200ms\n forwards;\n "])), animation);
146
+ css`
147
+ animation: ${animation} 200ms
148
+ forwards;
149
+ `;
139
150
  animationStyle = {
140
- animation: "".concat(animation.name, " 200ms forwards")
151
+ animation: `${animation.name} 200ms forwards`
141
152
  };
142
153
  }
143
154
  return props.children({
@@ -177,7 +188,7 @@ CollapsibleMotion.defaultProps = defaultProps;
177
188
  var CollapsibleMotion$1 = CollapsibleMotion;
178
189
 
179
190
  // NOTE: This string will be replaced on build time with the package version.
180
- var version = "19.11.0";
191
+ var version = "19.12.1";
181
192
 
182
193
  exports["default"] = CollapsibleMotion$1;
183
194
  exports.version = version;
@@ -12,7 +12,6 @@ var _Object$defineProperties = require('@babel/runtime-corejs3/core-js-stable/ob
12
12
  var _Object$defineProperty = require('@babel/runtime-corejs3/core-js-stable/object/define-property');
13
13
  var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
14
14
  var _slicedToArray = require('@babel/runtime-corejs3/helpers/slicedToArray');
15
- var _taggedTemplateLiteral = require('@babel/runtime-corejs3/helpers/taggedTemplateLiteral');
16
15
  require('prop-types');
17
16
  var react$1 = require('react');
18
17
  require('@commercetools-uikit/utils');
@@ -33,21 +32,27 @@ var _Object$defineProperties__default = /*#__PURE__*/_interopDefault(_Object$def
33
32
  var _Object$defineProperty__default = /*#__PURE__*/_interopDefault(_Object$defineProperty);
34
33
  var isNil__default = /*#__PURE__*/_interopDefault(isNil);
35
34
 
36
- var _templateObject, _templateObject2, _templateObject3, _templateObject4;
37
35
  function ownKeys(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
38
36
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
39
37
  const defaultProps = {
40
38
  minHeight: 0
41
39
  };
42
- const getMinHeight = minHeight => minHeight !== 0 ? "".concat(minHeight, "px") : minHeight;
40
+ const getMinHeight = minHeight => minHeight !== 0 ? `${minHeight}px` : minHeight;
43
41
  const getVisibility = height => height === 0 ? 'hidden' : 'visible';
44
42
  const createOpeningAnimation = function (height) {
45
43
  let minHeight = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
46
- return react.keyframes(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n 0% { height: ", "; overflow: hidden; visibility: ", "; }\n 99% { height: ", "px; overflow: hidden; }\n 100% { height: auto; overflow: visible; }\n "])), getMinHeight(minHeight), getVisibility(minHeight), height);
44
+ return react.keyframes`
45
+ 0% { height: ${getMinHeight(minHeight)}; overflow: hidden; visibility: ${getVisibility(minHeight)}; }
46
+ 99% { height: ${height}px; overflow: hidden; }
47
+ 100% { height: auto; overflow: visible; }
48
+ `;
47
49
  };
48
50
  const createClosingAnimation = function (height) {
49
51
  let minHeight = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
50
- return react.keyframes(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n from { height: ", "px; }\n to { height: ", "; overflow: hidden; visibility: ", "; }\n "])), height, getMinHeight(minHeight), getVisibility(minHeight));
52
+ return react.keyframes`
53
+ from { height: ${height}px; }
54
+ to { height: ${getMinHeight(minHeight)}; overflow: hidden; visibility: ${getVisibility(minHeight)}; }
55
+ `;
51
56
  };
52
57
  const useToggleAnimation = function (isOpen, toggle) {
53
58
  let minHeight = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
@@ -92,9 +97,12 @@ const ControlledCollapsibleMotion = props => {
92
97
  if (animation) {
93
98
  // By calling `css`, emotion injects the required CSS into the document head.
94
99
  // eslint-disable-next-line no-unused-expressions
95
- css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n animation: ", " 200ms\n forwards;\n "])), animation);
100
+ css`
101
+ animation: ${animation} 200ms
102
+ forwards;
103
+ `;
96
104
  animationStyle = {
97
- animation: "".concat(animation.name, " 200ms forwards")
105
+ animation: `${animation.name} 200ms forwards`
98
106
  };
99
107
  }
100
108
  return props.children({
@@ -126,9 +134,12 @@ const UncontrolledCollapsibleMotion = props => {
126
134
  if (animation) {
127
135
  // By calling `css`, emotion injects the required CSS into the document head.
128
136
  // eslint-disable-next-line no-unused-expressions
129
- css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n animation: ", " 200ms\n forwards;\n "])), animation);
137
+ css`
138
+ animation: ${animation} 200ms
139
+ forwards;
140
+ `;
130
141
  animationStyle = {
131
- animation: "".concat(animation.name, " 200ms forwards")
142
+ animation: `${animation.name} 200ms forwards`
132
143
  };
133
144
  }
134
145
  return props.children({
@@ -156,7 +167,7 @@ CollapsibleMotion.defaultProps = defaultProps;
156
167
  var CollapsibleMotion$1 = CollapsibleMotion;
157
168
 
158
169
  // NOTE: This string will be replaced on build time with the package version.
159
- var version = "19.11.0";
170
+ var version = "19.12.1";
160
171
 
161
172
  exports["default"] = CollapsibleMotion$1;
162
173
  exports.version = version;
@@ -8,7 +8,6 @@ import _Object$defineProperties from '@babel/runtime-corejs3/core-js-stable/obje
8
8
  import _Object$defineProperty from '@babel/runtime-corejs3/core-js-stable/object/define-property';
9
9
  import _defineProperty from '@babel/runtime-corejs3/helpers/esm/defineProperty';
10
10
  import _slicedToArray from '@babel/runtime-corejs3/helpers/esm/slicedToArray';
11
- import _taggedTemplateLiteral from '@babel/runtime-corejs3/helpers/esm/taggedTemplateLiteral';
12
11
  import _pt from 'prop-types';
13
12
  import { useRef, useEffect, useCallback } from 'react';
14
13
  import { warning } from '@commercetools-uikit/utils';
@@ -17,21 +16,27 @@ import isNil from 'lodash/isNil';
17
16
  import { useToggleState, usePrevious } from '@commercetools-uikit/hooks';
18
17
  import { jsx } from '@emotion/react/jsx-runtime';
19
18
 
20
- var _templateObject, _templateObject2, _templateObject3, _templateObject4;
21
19
  function ownKeys(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
22
20
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
23
21
  const defaultProps = {
24
22
  minHeight: 0
25
23
  };
26
- const getMinHeight = minHeight => minHeight !== 0 ? "".concat(minHeight, "px") : minHeight;
24
+ const getMinHeight = minHeight => minHeight !== 0 ? `${minHeight}px` : minHeight;
27
25
  const getVisibility = height => height === 0 ? 'hidden' : 'visible';
28
26
  const createOpeningAnimation = function (height) {
29
27
  let minHeight = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
30
- return keyframes(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n 0% { height: ", "; overflow: hidden; visibility: ", "; }\n 99% { height: ", "px; overflow: hidden; }\n 100% { height: auto; overflow: visible; }\n "])), getMinHeight(minHeight), getVisibility(minHeight), height);
28
+ return keyframes`
29
+ 0% { height: ${getMinHeight(minHeight)}; overflow: hidden; visibility: ${getVisibility(minHeight)}; }
30
+ 99% { height: ${height}px; overflow: hidden; }
31
+ 100% { height: auto; overflow: visible; }
32
+ `;
31
33
  };
32
34
  const createClosingAnimation = function (height) {
33
35
  let minHeight = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
34
- return keyframes(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n from { height: ", "px; }\n to { height: ", "; overflow: hidden; visibility: ", "; }\n "])), height, getMinHeight(minHeight), getVisibility(minHeight));
36
+ return keyframes`
37
+ from { height: ${height}px; }
38
+ to { height: ${getMinHeight(minHeight)}; overflow: hidden; visibility: ${getVisibility(minHeight)}; }
39
+ `;
35
40
  };
36
41
  const useToggleAnimation = function (isOpen, toggle) {
37
42
  let minHeight = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
@@ -78,9 +83,12 @@ const ControlledCollapsibleMotion = props => {
78
83
  if (animation) {
79
84
  // By calling `css`, emotion injects the required CSS into the document head.
80
85
  // eslint-disable-next-line no-unused-expressions
81
- css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n animation: ", " 200ms\n forwards;\n "])), animation);
86
+ css`
87
+ animation: ${animation} 200ms
88
+ forwards;
89
+ `;
82
90
  animationStyle = {
83
- animation: "".concat(animation.name, " 200ms forwards")
91
+ animation: `${animation.name} 200ms forwards`
84
92
  };
85
93
  }
86
94
  return props.children({
@@ -118,9 +126,12 @@ const UncontrolledCollapsibleMotion = props => {
118
126
  if (animation) {
119
127
  // By calling `css`, emotion injects the required CSS into the document head.
120
128
  // eslint-disable-next-line no-unused-expressions
121
- css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n animation: ", " 200ms\n forwards;\n "])), animation);
129
+ css`
130
+ animation: ${animation} 200ms
131
+ forwards;
132
+ `;
122
133
  animationStyle = {
123
- animation: "".concat(animation.name, " 200ms forwards")
134
+ animation: `${animation.name} 200ms forwards`
124
135
  };
125
136
  }
126
137
  return props.children({
@@ -160,6 +171,6 @@ CollapsibleMotion.defaultProps = defaultProps;
160
171
  var CollapsibleMotion$1 = CollapsibleMotion;
161
172
 
162
173
  // NOTE: This string will be replaced on build time with the package version.
163
- var version = "19.11.0";
174
+ var version = "19.12.1";
164
175
 
165
176
  export { CollapsibleMotion$1 as default, version };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@commercetools-uikit/collapsible-motion",
3
3
  "description": "A component which allows building collapsible elements with an arbitrary height.",
4
- "version": "19.11.0",
4
+ "version": "19.12.1",
5
5
  "bugs": "https://github.com/commercetools/ui-kit/issues",
6
6
  "repository": {
7
7
  "type": "git",
@@ -21,8 +21,8 @@
21
21
  "dependencies": {
22
22
  "@babel/runtime": "^7.20.13",
23
23
  "@babel/runtime-corejs3": "^7.20.13",
24
- "@commercetools-uikit/hooks": "19.11.0",
25
- "@commercetools-uikit/utils": "19.11.0",
24
+ "@commercetools-uikit/hooks": "19.12.1",
25
+ "@commercetools-uikit/utils": "19.12.1",
26
26
  "@emotion/react": "^11.10.5",
27
27
  "@emotion/styled": "^11.10.5",
28
28
  "lodash": "4.17.21",