@times-components/slice-layout 0.49.6 → 0.50.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.
- package/CHANGELOG.md +19 -0
- package/CONTRIBUTING.md +2 -5
- package/README.md +2 -3
- package/babel.config.js +6 -5
- package/dist/slice-layout.js +15 -1
- package/dist/templates/shared/index.js +19 -1
- package/dist/templates/shared/item-separators.js +52 -1
- package/dist/templates/shared/styles.js +25 -1
- package/dist/templates/standard/config.js +57 -1
- package/dist/templates/standard/index.js +118 -1
- package/dist/templates/standard/responsive.js +48 -1
- package/dist/templates/styles/index.js +25 -1
- package/dist/templates/styles/responsive.js +30 -1
- package/package.json +10 -17
- package/rnw.js +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,25 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [0.50.1](https://github.com/newsuk/times-components/compare/@times-components/slice-layout@0.50.0...@times-components/slice-layout@0.50.1) (2022-10-13)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @times-components/slice-layout
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
# [0.50.0](https://github.com/newsuk/times-components/compare/@times-components/slice-layout@0.49.6...@times-components/slice-layout@0.50.0) (2022-08-18)
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
### Features
|
|
18
|
+
|
|
19
|
+
* **TDP-1712:** remove react-native foreverrrrr ([#3064](https://github.com/newsuk/times-components/issues/3064)) ([2a20cb5](https://github.com/newsuk/times-components/commit/2a20cb5abc10a4e7ca2d62487967f8fcf4eccb62)), closes [#3037](https://github.com/newsuk/times-components/issues/3037) [#3045](https://github.com/newsuk/times-components/issues/3045) [#3050](https://github.com/newsuk/times-components/issues/3050) [#3056](https://github.com/newsuk/times-components/issues/3056) [#3057](https://github.com/newsuk/times-components/issues/3057) [#3066](https://github.com/newsuk/times-components/issues/3066) [#3065](https://github.com/newsuk/times-components/issues/3065) [#3037](https://github.com/newsuk/times-components/issues/3037) [#3045](https://github.com/newsuk/times-components/issues/3045) [#3045](https://github.com/newsuk/times-components/issues/3045) [#3056](https://github.com/newsuk/times-components/issues/3056) [#3066](https://github.com/newsuk/times-components/issues/3066) [#3069](https://github.com/newsuk/times-components/issues/3069) [#3068](https://github.com/newsuk/times-components/issues/3068) [#3070](https://github.com/newsuk/times-components/issues/3070) [#3072](https://github.com/newsuk/times-components/issues/3072) [#3073](https://github.com/newsuk/times-components/issues/3073) [#3071](https://github.com/newsuk/times-components/issues/3071) [#3074](https://github.com/newsuk/times-components/issues/3074) [#3076](https://github.com/newsuk/times-components/issues/3076) [#3079](https://github.com/newsuk/times-components/issues/3079) [#3078](https://github.com/newsuk/times-components/issues/3078) [#3083](https://github.com/newsuk/times-components/issues/3083) [#3087](https://github.com/newsuk/times-components/issues/3087) [#3091](https://github.com/newsuk/times-components/issues/3091) [#3096](https://github.com/newsuk/times-components/issues/3096) [#3102](https://github.com/newsuk/times-components/issues/3102) [#3105](https://github.com/newsuk/times-components/issues/3105) [#3108](https://github.com/newsuk/times-components/issues/3108) [#3111](https://github.com/newsuk/times-components/issues/3111) [#3112](https://github.com/newsuk/times-components/issues/3112) [#3113](https://github.com/newsuk/times-components/issues/3113) [#3114](https://github.com/newsuk/times-components/issues/3114) [#3120](https://github.com/newsuk/times-components/issues/3120) [#3119](https://github.com/newsuk/times-components/issues/3119) [#3112](https://github.com/newsuk/times-components/issues/3112) [#3126](https://github.com/newsuk/times-components/issues/3126) [#3112](https://github.com/newsuk/times-components/issues/3112) [#3126](https://github.com/newsuk/times-components/issues/3126) [#3127](https://github.com/newsuk/times-components/issues/3127) [#3116](https://github.com/newsuk/times-components/issues/3116) [#3128](https://github.com/newsuk/times-components/issues/3128) [#3132](https://github.com/newsuk/times-components/issues/3132) [#3133](https://github.com/newsuk/times-components/issues/3133)
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
|
|
23
|
+
|
|
24
|
+
|
|
6
25
|
## [0.49.6](https://github.com/newsuk/times-components/compare/@times-components/slice-layout@0.49.5...@times-components/slice-layout@0.49.6) (2022-08-05)
|
|
7
26
|
|
|
8
27
|
**Note:** Version bump only for package @times-components/slice-layout
|
package/CONTRIBUTING.md
CHANGED
|
@@ -9,8 +9,7 @@ ideas, conventions and information on submitting a PR
|
|
|
9
9
|
Slice layout templates sit within their own named directory within the `/templates`
|
|
10
10
|
directory. The Components take functions as `props` (render props) that pass
|
|
11
11
|
configuration objects to consumers of Slice layout. The configuration objects are
|
|
12
|
-
generated from `config.js
|
|
13
|
-
The objects manage JS properties for native and both JS properties _and_
|
|
12
|
+
generated is from `config.js`. The objects manage JS properties _and_
|
|
14
13
|
responsive CSS class names for web, that provide a suggested layout and format
|
|
15
14
|
for the children that will be laid out in each template.
|
|
16
15
|
|
|
@@ -48,11 +47,9 @@ An example template looks like this:
|
|
|
48
47
|
.
|
|
49
48
|
└── standard
|
|
50
49
|
├── config.js
|
|
51
|
-
├── config.web.js
|
|
52
50
|
├── index.js
|
|
53
|
-
├── index.web.js
|
|
54
51
|
├── proptypes.js
|
|
55
|
-
└── responsive.
|
|
52
|
+
└── responsive.js
|
|
56
53
|
```
|
|
57
54
|
|
|
58
55
|
### Image placeholder rules
|
package/README.md
CHANGED
|
@@ -4,7 +4,7 @@ Slice layouts are re-usable templates. A slice layout lays itself out according
|
|
|
4
4
|
set of self-defined rules. The slice layout also provides a suggested default
|
|
5
5
|
configuration that can be applied to the given components that are to be laid
|
|
6
6
|
out within the template - this configuration is provided in the form of CSS
|
|
7
|
-
class names and JS objects
|
|
7
|
+
class names and JS objects. The consumer of
|
|
8
8
|
slice layout can opt-in or out of utilising these suggested default configurations
|
|
9
9
|
|
|
10
10
|
## Contributing
|
|
@@ -27,8 +27,7 @@ yarn lint
|
|
|
27
27
|
|
|
28
28
|
## Testing
|
|
29
29
|
|
|
30
|
-
This package uses [yarn](https://yarnpkg.com) (latest) to run unit tests
|
|
31
|
-
platform with [jest](https://facebook.github.io/jest/).
|
|
30
|
+
This package uses [yarn](https://yarnpkg.com) (latest) to run unit tests with [jest](https://facebook.github.io/jest/).
|
|
32
31
|
|
|
33
32
|
```
|
|
34
33
|
yarn test:web
|
package/babel.config.js
CHANGED
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
module.exports = api => {
|
|
2
2
|
api.cache(true);
|
|
3
3
|
return {
|
|
4
|
-
plugins: [
|
|
5
|
-
|
|
6
|
-
"@babel/
|
|
7
|
-
|
|
8
|
-
|
|
4
|
+
plugins: ["babel-plugin-styled-components"],
|
|
5
|
+
presets: [
|
|
6
|
+
"@babel/preset-env",
|
|
7
|
+
"@babel/preset-react",
|
|
8
|
+
"@babel/preset-typescript"
|
|
9
|
+
]
|
|
9
10
|
};
|
|
10
11
|
};
|
package/dist/slice-layout.js
CHANGED
|
@@ -1 +1,15 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "StandardSlice", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function get() {
|
|
9
|
+
return _standard["default"];
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
|
|
13
|
+
var _standard = _interopRequireDefault(require("./templates/standard"));
|
|
14
|
+
|
|
15
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
@@ -1 +1,19 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "ItemColSeparator", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function get() {
|
|
9
|
+
return _itemSeparators.ItemColSeparator;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
Object.defineProperty(exports, "ItemRowSeparator", {
|
|
13
|
+
enumerable: true,
|
|
14
|
+
get: function get() {
|
|
15
|
+
return _itemSeparators.ItemRowSeparator;
|
|
16
|
+
}
|
|
17
|
+
});
|
|
18
|
+
|
|
19
|
+
var _itemSeparators = require("./item-separators");
|
|
@@ -1 +1,52 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.ItemRowSeparator = exports.ItemColSeparator = void 0;
|
|
7
|
+
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
|
|
10
|
+
var _utils = require("@times-components/utils");
|
|
11
|
+
|
|
12
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
13
|
+
|
|
14
|
+
var _styles = _interopRequireDefault(require("./styles"));
|
|
15
|
+
|
|
16
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
17
|
+
|
|
18
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
19
|
+
|
|
20
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
21
|
+
|
|
22
|
+
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
23
|
+
|
|
24
|
+
var ItemColSeparator = function ItemColSeparator(_ref) {
|
|
25
|
+
var style = _ref.style;
|
|
26
|
+
return /*#__PURE__*/_react["default"].createElement(_utils.TcView, {
|
|
27
|
+
style: _objectSpread(_objectSpread({}, _styles["default"].itemColSeparator), style)
|
|
28
|
+
});
|
|
29
|
+
};
|
|
30
|
+
|
|
31
|
+
exports.ItemColSeparator = ItemColSeparator;
|
|
32
|
+
|
|
33
|
+
var ItemRowSeparator = function ItemRowSeparator(_ref2) {
|
|
34
|
+
var style = _ref2.style;
|
|
35
|
+
return /*#__PURE__*/_react["default"].createElement(_utils.TcView, {
|
|
36
|
+
style: _objectSpread(_objectSpread({}, _styles["default"].itemRowSeparator), style)
|
|
37
|
+
});
|
|
38
|
+
};
|
|
39
|
+
|
|
40
|
+
exports.ItemRowSeparator = ItemRowSeparator;
|
|
41
|
+
ItemColSeparator.defaultProps = {
|
|
42
|
+
style: {}
|
|
43
|
+
};
|
|
44
|
+
ItemRowSeparator.defaultProps = {
|
|
45
|
+
style: {}
|
|
46
|
+
};
|
|
47
|
+
ItemColSeparator.propTypes = {
|
|
48
|
+
style: _propTypes["default"].shape({})
|
|
49
|
+
};
|
|
50
|
+
ItemRowSeparator.propTypes = {
|
|
51
|
+
style: _propTypes["default"].shape({})
|
|
52
|
+
};
|
|
@@ -1 +1,25 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports["default"] = void 0;
|
|
7
|
+
|
|
8
|
+
var _tsStyleguide = require("@times-components/ts-styleguide");
|
|
9
|
+
|
|
10
|
+
var styles = {
|
|
11
|
+
itemColSeparator: {
|
|
12
|
+
borderColor: _tsStyleguide.colours.functional.keyline,
|
|
13
|
+
borderRightWidth: 1,
|
|
14
|
+
borderStyle: "solid",
|
|
15
|
+
marginLeft: (0, _tsStyleguide.spacing)(2),
|
|
16
|
+
marginRight: (0, _tsStyleguide.spacing)(2)
|
|
17
|
+
},
|
|
18
|
+
itemRowSeparator: {
|
|
19
|
+
borderBottomWidth: 1,
|
|
20
|
+
borderColor: _tsStyleguide.colours.functional.keyline,
|
|
21
|
+
borderStyle: "solid"
|
|
22
|
+
}
|
|
23
|
+
};
|
|
24
|
+
var _default = styles;
|
|
25
|
+
exports["default"] = _default;
|
|
@@ -1 +1,57 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.getConfigWrapper = exports.getConfig = void 0;
|
|
7
|
+
|
|
8
|
+
var _utils = require("@times-components/utils");
|
|
9
|
+
|
|
10
|
+
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
11
|
+
|
|
12
|
+
var _tsStyleguide = require("@times-components/ts-styleguide");
|
|
13
|
+
|
|
14
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
15
|
+
|
|
16
|
+
var summaryConfig = {
|
|
17
|
+
1: [125],
|
|
18
|
+
2: [125],
|
|
19
|
+
3: [125, 145]
|
|
20
|
+
};
|
|
21
|
+
|
|
22
|
+
var getConfig = function getConfig(_ref) {
|
|
23
|
+
var itemCount = _ref.itemCount;
|
|
24
|
+
return {
|
|
25
|
+
contentContainerClass: "contentContainerClass",
|
|
26
|
+
headlineClass: "headlineClass",
|
|
27
|
+
imageContainerClass: "imageContainerClass",
|
|
28
|
+
summaryConfig: {
|
|
29
|
+
lengths: summaryConfig[itemCount]
|
|
30
|
+
}
|
|
31
|
+
};
|
|
32
|
+
};
|
|
33
|
+
|
|
34
|
+
exports.getConfig = getConfig;
|
|
35
|
+
|
|
36
|
+
var getConfigWrapper = function getConfigWrapper(_ref2) {
|
|
37
|
+
var itemCount = _ref2.itemCount;
|
|
38
|
+
var Base = (0, _styledComponents["default"])(_utils.TcView).withConfig({
|
|
39
|
+
displayName: "config__Base",
|
|
40
|
+
componentId: "bs1997-0"
|
|
41
|
+
})([".imageContainerClass{display:", ";}.summaryHidden{display:none;}.summary125Class{display:block;}@media (min-width:", "px){.imageContainerClass{display:block;}.headlineClass{font-size:25px;line-height:28px;margin-top:", ";}}"], itemCount >= 3 ? "none" : "block", _tsStyleguide.breakpoints.medium, (0, _tsStyleguide.spacing)(1));
|
|
42
|
+
|
|
43
|
+
if (itemCount === 1) {
|
|
44
|
+
Base = (0, _styledComponents["default"])(Base).withConfig({
|
|
45
|
+
displayName: "config__Base",
|
|
46
|
+
componentId: "bs1997-1"
|
|
47
|
+
})(["@media (min-width:", "px){.imageContainerClass{flex:1;margin-bottom:0;min-width:auto;padding-right:", ";}.contentContainerClass{flex-basis:0 !important;flex-grow:1;min-width:300px;}}"], _tsStyleguide.breakpoints.medium, (0, _tsStyleguide.spacing)(2));
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
Base = (0, _styledComponents["default"])(Base).withConfig({
|
|
51
|
+
displayName: "config__Base",
|
|
52
|
+
componentId: "bs1997-2"
|
|
53
|
+
})(["@media (min-width:", "px){.summary125Class{display:", ";}.summary145Class{display:", ";}}"], _tsStyleguide.breakpoints.wide, itemCount === 3 ? "none" : "block", itemCount === 3 ? "block" : "none");
|
|
54
|
+
return Base;
|
|
55
|
+
};
|
|
56
|
+
|
|
57
|
+
exports.getConfigWrapper = getConfigWrapper;
|
|
@@ -1 +1,118 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports["default"] = void 0;
|
|
9
|
+
|
|
10
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
11
|
+
|
|
12
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
13
|
+
|
|
14
|
+
var _responsive = require("../styles/responsive");
|
|
15
|
+
|
|
16
|
+
var _responsive2 = require("./responsive");
|
|
17
|
+
|
|
18
|
+
var _config = require("./config");
|
|
19
|
+
|
|
20
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
21
|
+
|
|
22
|
+
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); }
|
|
23
|
+
|
|
24
|
+
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; }
|
|
25
|
+
|
|
26
|
+
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
27
|
+
|
|
28
|
+
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
29
|
+
|
|
30
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
31
|
+
|
|
32
|
+
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
|
33
|
+
|
|
34
|
+
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
|
35
|
+
|
|
36
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
37
|
+
|
|
38
|
+
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
39
|
+
|
|
40
|
+
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
|
|
41
|
+
|
|
42
|
+
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
|
|
43
|
+
|
|
44
|
+
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
|
|
45
|
+
|
|
46
|
+
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
|
|
47
|
+
|
|
48
|
+
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
|
49
|
+
|
|
50
|
+
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
|
|
51
|
+
|
|
52
|
+
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
|
|
53
|
+
|
|
54
|
+
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
|
|
55
|
+
|
|
56
|
+
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
|
|
57
|
+
|
|
58
|
+
var Separator = (0, _responsive.getSeparator)({
|
|
59
|
+
hasLeftRightMargin: true
|
|
60
|
+
});
|
|
61
|
+
|
|
62
|
+
var StandardSlice = /*#__PURE__*/function (_Component) {
|
|
63
|
+
_inherits(StandardSlice, _Component);
|
|
64
|
+
|
|
65
|
+
var _super = _createSuper(StandardSlice);
|
|
66
|
+
|
|
67
|
+
function StandardSlice(props) {
|
|
68
|
+
var _this;
|
|
69
|
+
|
|
70
|
+
_classCallCheck(this, StandardSlice);
|
|
71
|
+
|
|
72
|
+
_this = _super.call(this, props);
|
|
73
|
+
var itemCount = _this.props.itemCount;
|
|
74
|
+
_this.ConfigWrapper = (0, _config.getConfigWrapper)({
|
|
75
|
+
itemCount: itemCount
|
|
76
|
+
});
|
|
77
|
+
_this.config = (0, _config.getConfig)({
|
|
78
|
+
itemCount: itemCount
|
|
79
|
+
});
|
|
80
|
+
_this.ChildrenContainer = (0, _responsive2.getChildrenContainer)({
|
|
81
|
+
childCount: itemCount
|
|
82
|
+
});
|
|
83
|
+
return _this;
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
_createClass(StandardSlice, [{
|
|
87
|
+
key: "render",
|
|
88
|
+
value: function render() {
|
|
89
|
+
var renderItems = this.props.renderItems;
|
|
90
|
+
var items = renderItems(this.config);
|
|
91
|
+
|
|
92
|
+
if (items.length === 0) {
|
|
93
|
+
return null;
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
var ChildrenContainer = this.ChildrenContainer,
|
|
97
|
+
ConfigWrapper = this.ConfigWrapper;
|
|
98
|
+
return /*#__PURE__*/_react["default"].createElement(ConfigWrapper, null, /*#__PURE__*/_react["default"].createElement(_responsive.SliceContainer, null, /*#__PURE__*/_react["default"].createElement(ChildrenContainer, null, items.map(function (item) {
|
|
99
|
+
return /*#__PURE__*/_react["default"].createElement(_responsive2.ChildContainer, {
|
|
100
|
+
key: item.props.id
|
|
101
|
+
}, item);
|
|
102
|
+
}).reduce(function (previous, current) {
|
|
103
|
+
return [].concat(_toConsumableArray(previous.length > 0 ? previous : [previous]), [/*#__PURE__*/_react["default"].createElement(Separator, {
|
|
104
|
+
key: "separator-".concat(current.key)
|
|
105
|
+
}), current]);
|
|
106
|
+
}))));
|
|
107
|
+
}
|
|
108
|
+
}]);
|
|
109
|
+
|
|
110
|
+
return StandardSlice;
|
|
111
|
+
}(_react.Component);
|
|
112
|
+
|
|
113
|
+
StandardSlice.propTypes = {
|
|
114
|
+
itemCount: _propTypes["default"].number.isRequired,
|
|
115
|
+
renderItems: _propTypes["default"].func.isRequired
|
|
116
|
+
};
|
|
117
|
+
var _default = StandardSlice;
|
|
118
|
+
exports["default"] = _default;
|
|
@@ -1 +1,48 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.getChildrenContainer = exports.ChildContainer = void 0;
|
|
7
|
+
|
|
8
|
+
var _utils = require("@times-components/utils");
|
|
9
|
+
|
|
10
|
+
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
11
|
+
|
|
12
|
+
var _tsStyleguide = require("@times-components/ts-styleguide");
|
|
13
|
+
|
|
14
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
15
|
+
|
|
16
|
+
var ChildContainer = (0, _styledComponents["default"])(_utils.TcView).withConfig({
|
|
17
|
+
displayName: "responsive__ChildContainer",
|
|
18
|
+
componentId: "sc-1lqbq6a-0"
|
|
19
|
+
})(["flex:1;padding-left:", ";padding-right:", ";@media (min-width:", "px){flex-basis:0 !important;padding-left:0;padding-right:0;}"], (0, _tsStyleguide.spacing)(2), (0, _tsStyleguide.spacing)(2), _tsStyleguide.breakpoints.medium);
|
|
20
|
+
exports.ChildContainer = ChildContainer;
|
|
21
|
+
|
|
22
|
+
var getChildrenContainer = function getChildrenContainer(_ref) {
|
|
23
|
+
var childCount = _ref.childCount;
|
|
24
|
+
var Base = (0, _styledComponents["default"])(_utils.TcView).withConfig({
|
|
25
|
+
displayName: "responsive__Base",
|
|
26
|
+
componentId: "sc-1lqbq6a-1"
|
|
27
|
+
})(["flex:1;flex-direction:column;flex-wrap:wrap;padding-bottom:", ";padding-top:", ";width:100%;@media (min-width:", "px){flex-direction:row;}"], (0, _tsStyleguide.spacing)(2), (0, _tsStyleguide.spacing)(2), _tsStyleguide.breakpoints.medium);
|
|
28
|
+
|
|
29
|
+
if (childCount >= 3) {
|
|
30
|
+
Base = (0, _styledComponents["default"])(Base).withConfig({
|
|
31
|
+
displayName: "responsive__Base",
|
|
32
|
+
componentId: "sc-1lqbq6a-2"
|
|
33
|
+
})(["@media (min-width:", "px){padding-left:", ";padding-right:", ";width:100%;}"], _tsStyleguide.breakpoints.medium, (0, _tsStyleguide.spacing)(4), (0, _tsStyleguide.spacing)(4));
|
|
34
|
+
} else {
|
|
35
|
+
Base = (0, _styledComponents["default"])(Base).withConfig({
|
|
36
|
+
displayName: "responsive__Base",
|
|
37
|
+
componentId: "sc-1lqbq6a-3"
|
|
38
|
+
})(["@media (min-width:", "px){width:80.8%;}"], _tsStyleguide.breakpoints.medium);
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
Base = (0, _styledComponents["default"])(Base).withConfig({
|
|
42
|
+
displayName: "responsive__Base",
|
|
43
|
+
componentId: "sc-1lqbq6a-4"
|
|
44
|
+
})(["@media (min-width:", "px){width:", ";}"], _tsStyleguide.breakpoints.wide, childCount >= 3 ? "100%" : "56.2%");
|
|
45
|
+
return Base;
|
|
46
|
+
};
|
|
47
|
+
|
|
48
|
+
exports.getChildrenContainer = getChildrenContainer;
|
|
@@ -1 +1,25 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports["default"] = void 0;
|
|
7
|
+
|
|
8
|
+
var _tsStyleguide = require("@times-components/ts-styleguide");
|
|
9
|
+
|
|
10
|
+
var styles = {
|
|
11
|
+
item: {
|
|
12
|
+
width: "100%"
|
|
13
|
+
},
|
|
14
|
+
itemContainer: {
|
|
15
|
+
borderBottomColor: _tsStyleguide.colours.functional.keyline,
|
|
16
|
+
borderBottomWidth: 1,
|
|
17
|
+
borderStyle: "solid",
|
|
18
|
+
width: "100%"
|
|
19
|
+
},
|
|
20
|
+
itemContainerWithoutBorders: {
|
|
21
|
+
width: "100%"
|
|
22
|
+
}
|
|
23
|
+
};
|
|
24
|
+
var _default = styles;
|
|
25
|
+
exports["default"] = _default;
|
|
@@ -1 +1,30 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.getSeparator = exports.SliceContainer = void 0;
|
|
7
|
+
|
|
8
|
+
var _utils = require("@times-components/utils");
|
|
9
|
+
|
|
10
|
+
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
11
|
+
|
|
12
|
+
var _tsStyleguide = require("@times-components/ts-styleguide");
|
|
13
|
+
|
|
14
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
15
|
+
|
|
16
|
+
var SliceContainer = (0, _styledComponents["default"])(_utils.TcView).withConfig({
|
|
17
|
+
displayName: "responsive__SliceContainer",
|
|
18
|
+
componentId: "sc-1kirgpc-0"
|
|
19
|
+
})(["align-items:center;border-bottom-color:", ";border-bottom-width:1px;border-style:solid;flex:1;justify-content:center;@media (-webkit-min-device-pixel-ratio:2){border-bottom-width:0.5px;}"], _tsStyleguide.colours.functional.keyline);
|
|
20
|
+
exports.SliceContainer = SliceContainer;
|
|
21
|
+
|
|
22
|
+
var getSeparator = function getSeparator(_ref) {
|
|
23
|
+
var hasLeftRightMargin = _ref.hasLeftRightMargin;
|
|
24
|
+
return (0, _styledComponents["default"])(_utils.TcView).withConfig({
|
|
25
|
+
displayName: "responsive",
|
|
26
|
+
componentId: "sc-1kirgpc-1"
|
|
27
|
+
})(["border-bottom-color:", ";border-bottom-style:solid;border-bottom-width:1px;flex:1;margin-bottom:", ";margin-top:", ";min-width:auto;@media (min-width:", "px){border-bottom:none;border-right-color:", ";border-right-style:solid;border-right-width:1px;flex:0 !important;margin:", ";}"], _tsStyleguide.colours.functional.keyline, (0, _tsStyleguide.spacing)(2), (0, _tsStyleguide.spacing)(2), _tsStyleguide.breakpoints.medium, _tsStyleguide.colours.functional.keyline, hasLeftRightMargin ? "0 ".concat((0, _tsStyleguide.spacing)(2)) : "0");
|
|
28
|
+
};
|
|
29
|
+
|
|
30
|
+
exports.getSeparator = getSeparator;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@times-components/slice-layout",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.50.1",
|
|
4
4
|
"description": "Slice layout",
|
|
5
5
|
"main": "dist/slice-layout",
|
|
6
6
|
"scripts": {
|
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
"prettier:diff": "prettier --list-different '**/*.*'",
|
|
9
9
|
"depcheck": "depcheck --ignores='@babel/*,babel-*,depcheck,eslint,jest,prettier,react-art,stylelint*,webpack*' --ignore-bin-package=false --skip-missing",
|
|
10
10
|
"lint": "eslint . && stylelint . && yarn prettier:diff && yarn depcheck",
|
|
11
|
-
"test:web": "jest --config='./__tests__/
|
|
11
|
+
"test:web": "jest --config='./__tests__/jest.config.js'",
|
|
12
12
|
"prepublishOnly": "yarn transpile && yarn bundle",
|
|
13
13
|
"cleanup-dist": "rm -rf dist",
|
|
14
14
|
"transpile": "yarn cleanup-dist && babel src -d dist",
|
|
@@ -33,14 +33,12 @@
|
|
|
33
33
|
"devDependencies": {
|
|
34
34
|
"@babel/core": "7.4.4",
|
|
35
35
|
"@times-components/eslint-config-thetimes": "0.8.18",
|
|
36
|
-
"@times-components/jest-configurator": "
|
|
37
|
-
"@times-components/jest-serializer": "3.
|
|
38
|
-
"@times-components/storybook": "4.
|
|
39
|
-
"@times-components/test-utils": "2.
|
|
36
|
+
"@times-components/jest-configurator-web": "0.8.0",
|
|
37
|
+
"@times-components/jest-serializer": "3.4.1",
|
|
38
|
+
"@times-components/storybook": "4.5.1",
|
|
39
|
+
"@times-components/test-utils": "2.4.0",
|
|
40
40
|
"babel-jest": "24.8.0",
|
|
41
41
|
"babel-loader": "8.0.5",
|
|
42
|
-
"babel-plugin-add-react-displayname": "0.0.5",
|
|
43
|
-
"babel-plugin-styled-components": "1.10.6",
|
|
44
42
|
"depcheck": "0.6.9",
|
|
45
43
|
"enzyme": "3.9.0",
|
|
46
44
|
"eslint": "5.9.0",
|
|
@@ -48,18 +46,13 @@
|
|
|
48
46
|
"jest-styled-components": "6.3.1",
|
|
49
47
|
"prettier": "1.14.3",
|
|
50
48
|
"react": "16.9.0",
|
|
51
|
-
"react-art": "16.6.3",
|
|
52
49
|
"react-dom": "16.9.0",
|
|
53
50
|
"stylelint": "9.4.0",
|
|
54
|
-
"
|
|
55
|
-
"stylelint-config-styled-components": "0.1.1",
|
|
56
|
-
"stylelint-processor-styled-components": "1.3.2",
|
|
57
|
-
"webpack": "4.30.0",
|
|
58
|
-
"webpack-cli": "3.3.1"
|
|
51
|
+
"webpack": "4.30.0"
|
|
59
52
|
},
|
|
60
53
|
"dependencies": {
|
|
61
|
-
"@times-components/ts-styleguide": "1.
|
|
62
|
-
"@times-components/utils": "6.
|
|
54
|
+
"@times-components/ts-styleguide": "1.37.1",
|
|
55
|
+
"@times-components/utils": "6.15.1",
|
|
63
56
|
"prop-types": "15.7.2",
|
|
64
57
|
"styled-components": "4.3.2"
|
|
65
58
|
},
|
|
@@ -75,5 +68,5 @@
|
|
|
75
68
|
"access": "public"
|
|
76
69
|
},
|
|
77
70
|
"dev": "src/slice-layout",
|
|
78
|
-
"gitHead": "
|
|
71
|
+
"gitHead": "d33c3115e165e09794ffdfd7931e217620f7ce07"
|
|
79
72
|
}
|
package/rnw.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
module.exports=function(e){var t={};function n(r){if(t[r])return t[r].exports;var
|
|
1
|
+
module.exports=function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}return n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=5)}([function(e,t){e.exports=require("@times-components/ts-styleguide/rnw")},function(e,t){e.exports=require("styled-components")},function(e,t){e.exports=require("@times-components/utils/rnw")},function(e,t){e.exports=require("react")},function(e,t){e.exports=require("prop-types")},function(e,t,n){"use strict";n.r(t);var r=n(3),o=n.n(r),i=(n(4),n(2)),a=n(1),c=n.n(a),s=n(0),l=c()(i.TcView).withConfig({displayName:"responsive__SliceContainer",componentId:"sc-1kirgpc-0"})(["align-items:center;border-bottom-color:",";border-bottom-width:1px;border-style:solid;flex:1;justify-content:center;@media (-webkit-min-device-pixel-ratio:2){border-bottom-width:0.5px;}"],s.colours.functional.keyline),u=c()(i.TcView).withConfig({displayName:"responsive__ChildContainer",componentId:"sc-1lqbq6a-0"})(["flex:1;padding-left:",";padding-right:",";@media (min-width:","px){flex-basis:0 !important;padding-left:0;padding-right:0;}"],Object(s.spacing)(2),Object(s.spacing)(2),s.breakpoints.medium),p={1:[125],2:[125],3:[125,145]};function f(e){return(f="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function d(e){return function(e){if(Array.isArray(e))return m(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||function(e,t){if(!e)return;if("string"==typeof e)return m(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);"Object"===n&&e.constructor&&(n=e.constructor.name);if("Map"===n||"Set"===n)return Array.from(e);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return m(e,t)}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function m(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function b(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function y(e,t){return(y=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function g(e){var t=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}();return function(){var n,r=w(e);if(t){var o=w(this).constructor;n=Reflect.construct(r,arguments,o)}else n=r.apply(this,arguments);return h(this,n)}}function h(e,t){return!t||"object"!==f(t)&&"function"!=typeof t?function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(e):t}function w(e){return(w=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}var C,x=(C={hasLeftRightMargin:!0}.hasLeftRightMargin,c()(i.TcView).withConfig({displayName:"responsive",componentId:"sc-1kirgpc-1"})(["border-bottom-color:",";border-bottom-style:solid;border-bottom-width:1px;flex:1;margin-bottom:",";margin-top:",";min-width:auto;@media (min-width:","px){border-bottom:none;border-right-color:",";border-right-style:solid;border-right-width:1px;flex:0 !important;margin:",";}"],s.colours.functional.keyline,Object(s.spacing)(2),Object(s.spacing)(2),s.breakpoints.medium,s.colours.functional.keyline,C?"0 ".concat(Object(s.spacing)(2)):"0")),v=function(e){!function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),t&&y(e,t)}(f,e);var t,n,r,a=g(f);function f(e){var t;!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,f);var n=(t=a.call(this,e)).props.itemCount;return t.ConfigWrapper=function(e){var t=e.itemCount,n=c()(i.TcView).withConfig({displayName:"config__Base",componentId:"bs1997-0"})([".imageContainerClass{display:",";}.summaryHidden{display:none;}.summary125Class{display:block;}@media (min-width:","px){.imageContainerClass{display:block;}.headlineClass{font-size:25px;line-height:28px;margin-top:",";}}"],t>=3?"none":"block",s.breakpoints.medium,Object(s.spacing)(1));return 1===t&&(n=c()(n).withConfig({displayName:"config__Base",componentId:"bs1997-1"})(["@media (min-width:","px){.imageContainerClass{flex:1;margin-bottom:0;min-width:auto;padding-right:",";}.contentContainerClass{flex-basis:0 !important;flex-grow:1;min-width:300px;}}"],s.breakpoints.medium,Object(s.spacing)(2))),n=c()(n).withConfig({displayName:"config__Base",componentId:"bs1997-2"})(["@media (min-width:","px){.summary125Class{display:",";}.summary145Class{display:",";}}"],s.breakpoints.wide,3===t?"none":"block",3===t?"block":"none")}({itemCount:n}),t.config=function(e){var t=e.itemCount;return{contentContainerClass:"contentContainerClass",headlineClass:"headlineClass",imageContainerClass:"imageContainerClass",summaryConfig:{lengths:p[t]}}}({itemCount:n}),t.ChildrenContainer=function(e){var t=e.childCount,n=c()(i.TcView).withConfig({displayName:"responsive__Base",componentId:"sc-1lqbq6a-1"})(["flex:1;flex-direction:column;flex-wrap:wrap;padding-bottom:",";padding-top:",";width:100%;@media (min-width:","px){flex-direction:row;}"],Object(s.spacing)(2),Object(s.spacing)(2),s.breakpoints.medium);return n=t>=3?c()(n).withConfig({displayName:"responsive__Base",componentId:"sc-1lqbq6a-2"})(["@media (min-width:","px){padding-left:",";padding-right:",";width:100%;}"],s.breakpoints.medium,Object(s.spacing)(4),Object(s.spacing)(4)):c()(n).withConfig({displayName:"responsive__Base",componentId:"sc-1lqbq6a-3"})(["@media (min-width:","px){width:80.8%;}"],s.breakpoints.medium),n=c()(n).withConfig({displayName:"responsive__Base",componentId:"sc-1lqbq6a-4"})(["@media (min-width:","px){width:",";}"],s.breakpoints.wide,t>=3?"100%":"56.2%")}({childCount:n}),t}return t=f,(n=[{key:"render",value:function(){var e=(0,this.props.renderItems)(this.config);if(0===e.length)return null;var t=this.ChildrenContainer,n=this.ConfigWrapper;return o.a.createElement(n,null,o.a.createElement(l,null,o.a.createElement(t,null,e.map((function(e){return o.a.createElement(u,{key:e.props.id},e)})).reduce((function(e,t){return[].concat(d(e.length>0?e:[e]),[o.a.createElement(x,{key:"separator-".concat(t.key)}),t])})))))}}])&&b(t.prototype,n),r&&b(t,r),f}(r.Component);n.d(t,"StandardSlice",(function(){return v}))}]);
|