@times-components/image 6.12.8 → 6.13.2
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 +33 -0
- package/README.md +0 -13
- package/babel.config.js +6 -5
- package/dist/image-prop-types.js +36 -1
- package/dist/image.js +220 -1
- package/dist/index.js +29 -1
- package/dist/logo/index.js +13 -1
- package/dist/logo/t.js +36 -1
- package/dist/modal-image/index.js +13 -1
- package/dist/modal-image/modal-image.js +13 -1
- package/dist/placeholder/index.js +13 -1
- package/dist/placeholder/placeholder.js +45 -1
- package/dist/styles/index.js +24 -1
- package/dist/styles/responsive.js +23 -1
- package/dist/utils/index.js +25 -1
- package/package.json +12 -20
- package/rnw.js +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,39 @@
|
|
|
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
|
+
## [6.13.2](https://github.com/newsuk/times-components/compare/@times-components/image@6.13.1...@times-components/image@6.13.2) (2022-09-06)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### Reverts
|
|
10
|
+
|
|
11
|
+
* **TDP-000:** Image without resize attribute ([#3141](https://github.com/newsuk/times-components/issues/3141)) ([437d3c9](https://github.com/newsuk/times-components/commit/437d3c919a53a00fa8f2dd5f320b49dcbee7ea0f))
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
## [6.13.1](https://github.com/newsuk/times-components/compare/@times-components/image@6.13.0...@times-components/image@6.13.1) (2022-09-06)
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
### Bug Fixes
|
|
21
|
+
|
|
22
|
+
* **TDP-000:** image without resize ([#3137](https://github.com/newsuk/times-components/issues/3137)) ([1238250](https://github.com/newsuk/times-components/commit/123825054ca14d8db8c8202d68adf7d709c22bdd))
|
|
23
|
+
|
|
24
|
+
|
|
25
|
+
|
|
26
|
+
|
|
27
|
+
|
|
28
|
+
# [6.13.0](https://github.com/newsuk/times-components/compare/@times-components/image@6.12.8...@times-components/image@6.13.0) (2022-08-18)
|
|
29
|
+
|
|
30
|
+
|
|
31
|
+
### Features
|
|
32
|
+
|
|
33
|
+
* **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)
|
|
34
|
+
|
|
35
|
+
|
|
36
|
+
|
|
37
|
+
|
|
38
|
+
|
|
6
39
|
## [6.12.8](https://github.com/newsuk/times-components/compare/@times-components/image@6.12.7...@times-components/image@6.12.8) (2022-08-05)
|
|
7
40
|
|
|
8
41
|
**Note:** Version bump only for package @times-components/image
|
package/README.md
CHANGED
|
@@ -10,12 +10,6 @@ still be visible.
|
|
|
10
10
|
For web the package is very simple, with the image component serving simple DOM
|
|
11
11
|
elements. There is no concept of a modal for web.
|
|
12
12
|
|
|
13
|
-
## On native
|
|
14
|
-
|
|
15
|
-
## Android only
|
|
16
|
-
|
|
17
|
-
Code for iOs and Android displaying a modal-image has been removed, and now modal-image just renders the web image.
|
|
18
|
-
|
|
19
13
|
## Contributing
|
|
20
14
|
|
|
21
15
|
Please read [CONTRIBUTING.md](./CONTRIBUTING.md) before contributing to this
|
|
@@ -46,10 +40,3 @@ yarn test:web
|
|
|
46
40
|
Visit the official
|
|
47
41
|
[storybook](http://components.thetimes.co.uk/?knob-Size%20of%20ad%20placeholder%3A=default&selectedKind=Primitives%2FImage&selectedStory=Fills%20parent%20width&full=0&addons=1&stories=1&panelRight=0&addonPanel=storybooks%2Fstorybook-addon-knobs)
|
|
48
42
|
to see our available image templates.
|
|
49
|
-
|
|
50
|
-
## Issues
|
|
51
|
-
|
|
52
|
-
On Android, SVGs rendered using ART from React Native are disappearing after the
|
|
53
|
-
app is moved into the background, and then refocused. This is a known RN issue
|
|
54
|
-
which we intend to address shortly, perhaps by moving away from ART. Track the
|
|
55
|
-
issue on [JIRA](https://nidigitalsolutions.jira.com/browse/REPLAT-3385).
|
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/image-prop-types.js
CHANGED
|
@@ -1 +1,36 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.defaultProps = exports.propTypes = void 0;
|
|
7
|
+
|
|
8
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
9
|
+
|
|
10
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
11
|
+
|
|
12
|
+
var propTypes = {
|
|
13
|
+
style: _propTypes["default"].object,
|
|
14
|
+
accessibilityLabel: _propTypes["default"].string,
|
|
15
|
+
aspectRatio: _propTypes["default"].number,
|
|
16
|
+
borderRadius: _propTypes["default"].number,
|
|
17
|
+
disablePlaceholder: _propTypes["default"].bool,
|
|
18
|
+
fadeImageIn: _propTypes["default"].bool,
|
|
19
|
+
highResSize: _propTypes["default"].number,
|
|
20
|
+
lowResQuality: _propTypes["default"].number,
|
|
21
|
+
lowResSize: _propTypes["default"].number,
|
|
22
|
+
onLayout: _propTypes["default"].func,
|
|
23
|
+
rounded: _propTypes["default"].bool,
|
|
24
|
+
uri: _propTypes["default"].string
|
|
25
|
+
};
|
|
26
|
+
exports.propTypes = propTypes;
|
|
27
|
+
var defaultProps = {
|
|
28
|
+
aspectRatio: undefined,
|
|
29
|
+
disablePlaceholder: false,
|
|
30
|
+
fadeImageIn: false,
|
|
31
|
+
highResSize: null,
|
|
32
|
+
lowResSize: null,
|
|
33
|
+
rounded: false,
|
|
34
|
+
uri: null
|
|
35
|
+
};
|
|
36
|
+
exports.defaultProps = defaultProps;
|
package/dist/image.js
CHANGED
|
@@ -1 +1,220 @@
|
|
|
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 _utils = require("@times-components/utils");
|
|
13
|
+
|
|
14
|
+
var _placeholder = _interopRequireDefault(require("./placeholder"));
|
|
15
|
+
|
|
16
|
+
var _imagePropTypes = require("./image-prop-types");
|
|
17
|
+
|
|
18
|
+
var _responsive = _interopRequireDefault(require("./styles/responsive"));
|
|
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 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; }
|
|
27
|
+
|
|
28
|
+
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; }
|
|
29
|
+
|
|
30
|
+
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; }
|
|
31
|
+
|
|
32
|
+
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
33
|
+
|
|
34
|
+
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); } }
|
|
35
|
+
|
|
36
|
+
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
|
|
37
|
+
|
|
38
|
+
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); }
|
|
39
|
+
|
|
40
|
+
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
|
|
41
|
+
|
|
42
|
+
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); }; }
|
|
43
|
+
|
|
44
|
+
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
|
|
45
|
+
|
|
46
|
+
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
|
|
47
|
+
|
|
48
|
+
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; } }
|
|
49
|
+
|
|
50
|
+
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
|
|
51
|
+
|
|
52
|
+
var TimesImage = /*#__PURE__*/function (_Component) {
|
|
53
|
+
_inherits(TimesImage, _Component);
|
|
54
|
+
|
|
55
|
+
var _super = _createSuper(TimesImage);
|
|
56
|
+
|
|
57
|
+
function TimesImage(props) {
|
|
58
|
+
var _this;
|
|
59
|
+
|
|
60
|
+
_classCallCheck(this, TimesImage);
|
|
61
|
+
|
|
62
|
+
_this = _super.call(this, props);
|
|
63
|
+
_this.state = {
|
|
64
|
+
highResIsLoaded: false,
|
|
65
|
+
highResIsVisible: false,
|
|
66
|
+
imageIsLoaded: false,
|
|
67
|
+
lowResIsLoaded: !props.fadeImageIn
|
|
68
|
+
};
|
|
69
|
+
_this.handleHighResOnLoad = _this.handleHighResOnLoad.bind(_assertThisInitialized(_this));
|
|
70
|
+
_this.handleLowResOnLoad = _this.handleLowResOnLoad.bind(_assertThisInitialized(_this));
|
|
71
|
+
_this.onHighResTransitionEnd = _this.onHighResTransitionEnd.bind(_assertThisInitialized(_this));
|
|
72
|
+
_this.getLowResImage = _this.getLowResImage.bind(_assertThisInitialized(_this));
|
|
73
|
+
_this.getHighResImage = _this.getHighResImage.bind(_assertThisInitialized(_this));
|
|
74
|
+
return _this;
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
_createClass(TimesImage, [{
|
|
78
|
+
key: "onHighResTransitionEnd",
|
|
79
|
+
value: function onHighResTransitionEnd() {
|
|
80
|
+
this.setState({
|
|
81
|
+
highResIsVisible: true
|
|
82
|
+
});
|
|
83
|
+
}
|
|
84
|
+
}, {
|
|
85
|
+
key: "getHighResImage",
|
|
86
|
+
value: function getHighResImage(img) {
|
|
87
|
+
if (img && img.complete) {
|
|
88
|
+
this.handleHighResOnLoad();
|
|
89
|
+
}
|
|
90
|
+
}
|
|
91
|
+
}, {
|
|
92
|
+
key: "getLowResImage",
|
|
93
|
+
value: function getLowResImage(img) {
|
|
94
|
+
if (img && img.complete) {
|
|
95
|
+
this.handleLowResOnLoad();
|
|
96
|
+
}
|
|
97
|
+
}
|
|
98
|
+
}, {
|
|
99
|
+
key: "handleLowResOnLoad",
|
|
100
|
+
value: function handleLowResOnLoad() {
|
|
101
|
+
this.setState({
|
|
102
|
+
imageIsLoaded: true,
|
|
103
|
+
lowResIsLoaded: true
|
|
104
|
+
});
|
|
105
|
+
}
|
|
106
|
+
}, {
|
|
107
|
+
key: "handleHighResOnLoad",
|
|
108
|
+
value: function handleHighResOnLoad() {
|
|
109
|
+
this.setState({
|
|
110
|
+
highResIsLoaded: true,
|
|
111
|
+
imageIsLoaded: true
|
|
112
|
+
});
|
|
113
|
+
}
|
|
114
|
+
}, {
|
|
115
|
+
key: "highResImage",
|
|
116
|
+
value: function highResImage(_ref) {
|
|
117
|
+
var highResSize = _ref.highResSize,
|
|
118
|
+
lowResSize = _ref.lowResSize,
|
|
119
|
+
url = _ref.url;
|
|
120
|
+
var highResIsLoaded = this.state.highResIsLoaded;
|
|
121
|
+
var accessibilityLabel = this.props.accessibilityLabel;
|
|
122
|
+
|
|
123
|
+
if (!lowResSize || highResSize) {
|
|
124
|
+
return /*#__PURE__*/_react["default"].createElement(_responsive["default"], {
|
|
125
|
+
alt: accessibilityLabel,
|
|
126
|
+
ref: this.getHighResImage,
|
|
127
|
+
isLoaded: highResIsLoaded,
|
|
128
|
+
onLoad: this.handleHighResOnLoad,
|
|
129
|
+
onTransitionEnd: this.onHighResTransitionEnd,
|
|
130
|
+
src: (0, _utils.appendToImageURL)(url, "resize", highResSize),
|
|
131
|
+
zIndex: 2
|
|
132
|
+
});
|
|
133
|
+
}
|
|
134
|
+
|
|
135
|
+
return null;
|
|
136
|
+
}
|
|
137
|
+
}, {
|
|
138
|
+
key: "lowResImage",
|
|
139
|
+
value: function lowResImage(_ref2) {
|
|
140
|
+
var lowResQuality = _ref2.lowResQuality,
|
|
141
|
+
lowResSize = _ref2.lowResSize,
|
|
142
|
+
url = _ref2.url;
|
|
143
|
+
var _this$state = this.state,
|
|
144
|
+
highResIsVisible = _this$state.highResIsVisible,
|
|
145
|
+
lowResIsLoaded = _this$state.lowResIsLoaded;
|
|
146
|
+
var accessibilityLabel = this.props.accessibilityLabel;
|
|
147
|
+
|
|
148
|
+
if (lowResSize && !highResIsVisible) {
|
|
149
|
+
var imageSource = (0, _utils.appendToImageURL)(url, "resize", lowResSize);
|
|
150
|
+
|
|
151
|
+
if (lowResQuality) {
|
|
152
|
+
imageSource = (0, _utils.appendToImageURL)(imageSource, "quality", lowResQuality);
|
|
153
|
+
}
|
|
154
|
+
|
|
155
|
+
return /*#__PURE__*/_react["default"].createElement(_responsive["default"], {
|
|
156
|
+
alt: accessibilityLabel,
|
|
157
|
+
ref: this.getLowResImage,
|
|
158
|
+
isLoaded: lowResIsLoaded,
|
|
159
|
+
onLoad: this.handleLowResOnLoad,
|
|
160
|
+
src: imageSource,
|
|
161
|
+
zIndex: 1
|
|
162
|
+
});
|
|
163
|
+
}
|
|
164
|
+
|
|
165
|
+
return null;
|
|
166
|
+
}
|
|
167
|
+
}, {
|
|
168
|
+
key: "render",
|
|
169
|
+
value: function render() {
|
|
170
|
+
var _this$props = this.props,
|
|
171
|
+
aspectRatio = _this$props.aspectRatio,
|
|
172
|
+
disablePlaceholder = _this$props.disablePlaceholder,
|
|
173
|
+
highResSize = _this$props.highResSize,
|
|
174
|
+
lowResQuality = _this$props.lowResQuality,
|
|
175
|
+
lowResSize = _this$props.lowResSize,
|
|
176
|
+
style = _this$props.style,
|
|
177
|
+
uri = _this$props.uri,
|
|
178
|
+
onLayout = _this$props.onLayout,
|
|
179
|
+
rounded = _this$props.rounded;
|
|
180
|
+
var imageIsLoaded = this.state.imageIsLoaded;
|
|
181
|
+
var url = (0, _utils.addMissingProtocol)(uri);
|
|
182
|
+
|
|
183
|
+
var styles = _objectSpread({}, style);
|
|
184
|
+
|
|
185
|
+
if (rounded) {
|
|
186
|
+
Object.assign(styles, {
|
|
187
|
+
borderRadius: "50%",
|
|
188
|
+
overflow: "hidden"
|
|
189
|
+
});
|
|
190
|
+
}
|
|
191
|
+
|
|
192
|
+
return /*#__PURE__*/_react["default"].createElement(_utils.TcView, {
|
|
193
|
+
onLayout: onLayout,
|
|
194
|
+
style: styles,
|
|
195
|
+
testID: "Image"
|
|
196
|
+
}, /*#__PURE__*/_react["default"].createElement("div", {
|
|
197
|
+
style: {
|
|
198
|
+
paddingBottom: "".concat(100 / aspectRatio, "%")
|
|
199
|
+
}
|
|
200
|
+
}, this.highResImage({
|
|
201
|
+
highResSize: highResSize,
|
|
202
|
+
lowResSize: lowResSize,
|
|
203
|
+
url: url
|
|
204
|
+
}), this.lowResImage({
|
|
205
|
+
lowResQuality: lowResQuality,
|
|
206
|
+
lowResSize: lowResSize,
|
|
207
|
+
url: url
|
|
208
|
+
}), disablePlaceholder || imageIsLoaded ? null : /*#__PURE__*/_react["default"].createElement(_placeholder["default"], {
|
|
209
|
+
borderRadius: rounded ? "50%" : 0
|
|
210
|
+
})));
|
|
211
|
+
}
|
|
212
|
+
}]);
|
|
213
|
+
|
|
214
|
+
return TimesImage;
|
|
215
|
+
}(_react.Component);
|
|
216
|
+
|
|
217
|
+
TimesImage.propTypes = _imagePropTypes.propTypes;
|
|
218
|
+
TimesImage.defaultProps = _imagePropTypes.defaultProps;
|
|
219
|
+
var _default = TimesImage;
|
|
220
|
+
exports["default"] = _default;
|
package/dist/index.js
CHANGED
|
@@ -1 +1,29 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "ModalImage", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function get() {
|
|
9
|
+
return _modalImage["default"];
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
Object.defineProperty(exports, "Placeholder", {
|
|
13
|
+
enumerable: true,
|
|
14
|
+
get: function get() {
|
|
15
|
+
return _placeholder["default"];
|
|
16
|
+
}
|
|
17
|
+
});
|
|
18
|
+
exports["default"] = void 0;
|
|
19
|
+
|
|
20
|
+
var _image = _interopRequireDefault(require("./image"));
|
|
21
|
+
|
|
22
|
+
var _modalImage = _interopRequireDefault(require("./modal-image"));
|
|
23
|
+
|
|
24
|
+
var _placeholder = _interopRequireDefault(require("./placeholder"));
|
|
25
|
+
|
|
26
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
27
|
+
|
|
28
|
+
var _default = _image["default"];
|
|
29
|
+
exports["default"] = _default;
|
package/dist/logo/index.js
CHANGED
|
@@ -1 +1,13 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports["default"] = void 0;
|
|
7
|
+
|
|
8
|
+
var _t = _interopRequireDefault(require("./t"));
|
|
9
|
+
|
|
10
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
11
|
+
|
|
12
|
+
var _default = _t["default"];
|
|
13
|
+
exports["default"] = _default;
|
package/dist/logo/t.js
CHANGED
|
@@ -1 +1,36 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports["default"] = void 0;
|
|
7
|
+
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
|
|
10
|
+
var _tsStyleguide = require("@times-components/ts-styleguide");
|
|
11
|
+
|
|
12
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
13
|
+
|
|
14
|
+
function T() {
|
|
15
|
+
return /*#__PURE__*/_react["default"].createElement("svg", {
|
|
16
|
+
height: "auto",
|
|
17
|
+
version: "1.1",
|
|
18
|
+
viewBox: "145 50 108 120",
|
|
19
|
+
width: "100%",
|
|
20
|
+
style: {
|
|
21
|
+
maxWidth: "25%",
|
|
22
|
+
maxHeight: "50%"
|
|
23
|
+
}
|
|
24
|
+
}, /*#__PURE__*/_react["default"].createElement("g", {
|
|
25
|
+
fill: "none",
|
|
26
|
+
fillRule: "evenodd",
|
|
27
|
+
stroke: "none",
|
|
28
|
+
strokeWidth: "1"
|
|
29
|
+
}, /*#__PURE__*/_react["default"].createElement("path", {
|
|
30
|
+
d: "M211.26076,54 L211.231367,54 L147.67512,54 L145,85.7081465 L146.922096,86.4489102 C146.922096,86.4489102 164.867589,68.1355181 168.301115,65.0001546 C171.728017,61.8689133 174.237132,61.0885763 176.436179,60.3527593 C180.998206,59.169681 185.977937,59.2150255 185.977937,59.2150255 L186.109581,59.2150255 L186.109581,156.560932 L169.259886,164.473953 L169.259886,166 L228.735147,166 L228.735147,164.473953 L211.889177,156.560932 L211.889177,59.2150255 L212.01751,59.2150255 C212.01751,59.2150255 216.992272,59.169681 221.558854,60.3527593 C223.757072,61.0885763 226.266601,61.8689133 229.691848,65.0001546 C233.130341,68.1355181 251.071695,86.4489102 251.071695,86.4489102 L253,85.7081465 L250.317842,54 L211.270695,54 L211.242545,54",
|
|
31
|
+
fill: _tsStyleguide.colours.functional.contrast
|
|
32
|
+
})));
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
var _default = T;
|
|
36
|
+
exports["default"] = _default;
|
|
@@ -1 +1,13 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports["default"] = void 0;
|
|
7
|
+
|
|
8
|
+
var _modalImage = _interopRequireDefault(require("./modal-image"));
|
|
9
|
+
|
|
10
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
11
|
+
|
|
12
|
+
var _default = _modalImage["default"];
|
|
13
|
+
exports["default"] = _default;
|
|
@@ -1 +1,13 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports["default"] = void 0;
|
|
7
|
+
|
|
8
|
+
var _image = _interopRequireDefault(require("../image"));
|
|
9
|
+
|
|
10
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
11
|
+
|
|
12
|
+
var _default = _image["default"];
|
|
13
|
+
exports["default"] = _default;
|
|
@@ -1 +1,13 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports["default"] = void 0;
|
|
7
|
+
|
|
8
|
+
var _placeholder = _interopRequireDefault(require("./placeholder"));
|
|
9
|
+
|
|
10
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
11
|
+
|
|
12
|
+
var _default = _placeholder["default"];
|
|
13
|
+
exports["default"] = _default;
|
|
@@ -1 +1,45 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports["default"] = void 0;
|
|
7
|
+
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
|
|
10
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
11
|
+
|
|
12
|
+
var _utils = require("@times-components/utils");
|
|
13
|
+
|
|
14
|
+
var _index = _interopRequireDefault(require("../styles/index"));
|
|
15
|
+
|
|
16
|
+
var _t = _interopRequireDefault(require("../logo/t"));
|
|
17
|
+
|
|
18
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
19
|
+
|
|
20
|
+
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; }
|
|
21
|
+
|
|
22
|
+
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; }
|
|
23
|
+
|
|
24
|
+
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; }
|
|
25
|
+
|
|
26
|
+
function Placeholder(_ref) {
|
|
27
|
+
var _ref$borderRadius = _ref.borderRadius,
|
|
28
|
+
borderRadius = _ref$borderRadius === void 0 ? 0 : _ref$borderRadius;
|
|
29
|
+
|
|
30
|
+
var viewStyles = _objectSpread(_objectSpread({}, _index["default"].placeholder), {}, {
|
|
31
|
+
borderRadius: borderRadius
|
|
32
|
+
});
|
|
33
|
+
|
|
34
|
+
return /*#__PURE__*/_react["default"].createElement(_utils.TcView, {
|
|
35
|
+
height: "100%",
|
|
36
|
+
style: viewStyles,
|
|
37
|
+
width: "100%"
|
|
38
|
+
}, /*#__PURE__*/_react["default"].createElement(_t["default"], null));
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
Placeholder.propTypes = {
|
|
42
|
+
borderRadius: _propTypes["default"].oneOfType([_propTypes["default"].number, _propTypes["default"].string])
|
|
43
|
+
};
|
|
44
|
+
var _default = Placeholder;
|
|
45
|
+
exports["default"] = _default;
|
package/dist/styles/index.js
CHANGED
|
@@ -1 +1,24 @@
|
|
|
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
|
+
placeholder: {
|
|
12
|
+
alignItems: "center",
|
|
13
|
+
backgroundColor: _tsStyleguide.colours.functional.backgroundSecondary,
|
|
14
|
+
bottom: 0,
|
|
15
|
+
justifyContent: "center",
|
|
16
|
+
left: 0,
|
|
17
|
+
position: "absolute",
|
|
18
|
+
right: 0,
|
|
19
|
+
top: 0,
|
|
20
|
+
zIndex: 0
|
|
21
|
+
}
|
|
22
|
+
};
|
|
23
|
+
var _default = styles;
|
|
24
|
+
exports["default"] = _default;
|
|
@@ -1 +1,23 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports["default"] = void 0;
|
|
7
|
+
|
|
8
|
+
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
9
|
+
|
|
10
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
11
|
+
|
|
12
|
+
var _default = _styledComponents["default"].img.withConfig({
|
|
13
|
+
displayName: "responsive",
|
|
14
|
+
componentId: "sc-1nnon4d-0"
|
|
15
|
+
})(["display:block;opacity:", ";position:absolute;transition:opacity 0.3s ease-in-out;width:100%;z-index:", ";"], function (_ref) {
|
|
16
|
+
var isLoaded = _ref.isLoaded;
|
|
17
|
+
return isLoaded ? 1 : 0;
|
|
18
|
+
}, function (_ref2) {
|
|
19
|
+
var zIndex = _ref2.zIndex;
|
|
20
|
+
return zIndex;
|
|
21
|
+
});
|
|
22
|
+
|
|
23
|
+
exports["default"] = _default;
|
package/dist/utils/index.js
CHANGED
|
@@ -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 _url = _interopRequireDefault(require("url"));
|
|
9
|
+
|
|
10
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
11
|
+
|
|
12
|
+
var appendParamsToQuery = function appendParamsToQuery(uriString, paramMap) {
|
|
13
|
+
if (!uriString || !paramMap) {
|
|
14
|
+
return uriString;
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
var uri = _url["default"].parse(uriString, true);
|
|
18
|
+
|
|
19
|
+
uri.search = undefined;
|
|
20
|
+
Object.assign(uri.query, paramMap);
|
|
21
|
+
return _url["default"].format(uri);
|
|
22
|
+
};
|
|
23
|
+
|
|
24
|
+
var _default = appendParamsToQuery;
|
|
25
|
+
exports["default"] = _default;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@times-components/image",
|
|
3
|
-
"version": "6.
|
|
3
|
+
"version": "6.13.2",
|
|
4
4
|
"main": "dist/index",
|
|
5
5
|
"dev": "src/index",
|
|
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
|
"watch": "watch 'yarn bundle' ./src --ignoreDotFiles --ignoreUnreadable",
|
|
14
14
|
"cleanup-dist": "rm -rf dist",
|
|
@@ -32,33 +32,27 @@
|
|
|
32
32
|
"devDependencies": {
|
|
33
33
|
"@babel/core": "7.4.4",
|
|
34
34
|
"@times-components/eslint-config-thetimes": "0.8.18",
|
|
35
|
-
"@times-components/jest-configurator": "
|
|
36
|
-
"@times-components/jest-serializer": "3.
|
|
37
|
-
"@times-components/storybook": "4.
|
|
38
|
-
"@times-components/test-utils": "2.
|
|
39
|
-
"@times-components/webpack-configurator": "2.0
|
|
35
|
+
"@times-components/jest-configurator-web": "0.8.0",
|
|
36
|
+
"@times-components/jest-serializer": "3.4.0",
|
|
37
|
+
"@times-components/storybook": "4.5.0",
|
|
38
|
+
"@times-components/test-utils": "2.4.0",
|
|
39
|
+
"@times-components/webpack-configurator": "2.1.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
|
"eslint": "5.9.0",
|
|
46
44
|
"jest": "24.8.0",
|
|
47
45
|
"jest-styled-components": "6.3.1",
|
|
48
46
|
"prettier": "1.14.3",
|
|
49
47
|
"react": "16.9.0",
|
|
50
|
-
"react-art": "16.6.3",
|
|
51
48
|
"react-dom": "16.9.0",
|
|
52
|
-
"react-native": "0.61.5",
|
|
53
|
-
"react-native-web": "0.11.4",
|
|
54
49
|
"react-test-renderer": "16.9.0",
|
|
55
50
|
"stylelint": "9.4.0",
|
|
56
|
-
"webpack": "4.30.0"
|
|
57
|
-
"webpack-cli": "3.3.1"
|
|
51
|
+
"webpack": "4.30.0"
|
|
58
52
|
},
|
|
59
53
|
"dependencies": {
|
|
60
|
-
"@times-components/ts-styleguide": "1.
|
|
61
|
-
"@times-components/utils": "6.
|
|
54
|
+
"@times-components/ts-styleguide": "1.37.0",
|
|
55
|
+
"@times-components/utils": "6.15.0",
|
|
62
56
|
"prop-types": "15.7.2",
|
|
63
57
|
"styled-components": "4.3.2"
|
|
64
58
|
},
|
|
@@ -68,12 +62,10 @@
|
|
|
68
62
|
},
|
|
69
63
|
"peerDependencies": {
|
|
70
64
|
"react": ">=16.9",
|
|
71
|
-
"react-dom": ">=16.9"
|
|
72
|
-
"react-native": ">=0.59",
|
|
73
|
-
"react-native-web": "0.11.4"
|
|
65
|
+
"react-dom": ">=16.9"
|
|
74
66
|
},
|
|
75
67
|
"publishConfig": {
|
|
76
68
|
"access": "public"
|
|
77
69
|
},
|
|
78
|
-
"gitHead": "
|
|
70
|
+
"gitHead": "a4cb8f16b75e0d54adf6ad9e23bb6cce1dda01fc"
|
|
79
71
|
}
|
package/rnw.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
module.exports=function(e){var t={};function r(n){if(t[n])return t[n].exports;var o=t[n]={i:n,l:!1,exports:{}};return e[n].call(o.exports,o,o.exports,r),o.l=!0,o.exports}return r.m=e,r.c=t,r.d=function(e,t,n){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)r.d(n,o,function(t){return e[t]}.bind(null,o));return n},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="",r(r.s=8)}([function(e,t){e.exports=require("@babel/runtime/helpers/interopRequireDefault")},function(e,t){e.exports=require("react")},function(e,t,r){var n=r(0);Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var o=n(r(9)),a=n(r(3)),i=n(r(10)),u=n(r(11)),l=n(r(12)),s=n(r(13)),d=n(r(14)),f=n(r(15)),c=function(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var r=y(t);if(r&&r.has(e))return r.get(e);var n={},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var a in e)if("default"!==a&&Object.prototype.hasOwnProperty.call(e,a)){var i=o?Object.getOwnPropertyDescriptor(e,a):null;i&&(i.get||i.set)?Object.defineProperty(n,a,i):n[a]=e[a]}n.default=e,r&&r.set(e,n);return n}(r(1)),p=r(4),b=n(r(5)),h=r(19),g=n(r(20));function y(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,r=new WeakMap;return(y=function(e){return e?r:t})(e)}function v(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function m(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 r,n=(0,f.default)(e);if(t){var o=(0,f.default)(this).constructor;r=Reflect.construct(n,arguments,o)}else r=n.apply(this,arguments);return(0,d.default)(this,r)}}var O=function(e){(0,s.default)(r,e);var t=m(r);function r(e){var n;return(0,i.default)(this,r),(n=t.call(this,e)).state={highResIsLoaded:!1,highResIsVisible:!1,imageIsLoaded:!1,lowResIsLoaded:!e.fadeImageIn},n.handleHighResOnLoad=n.handleHighResOnLoad.bind((0,l.default)(n)),n.handleLowResOnLoad=n.handleLowResOnLoad.bind((0,l.default)(n)),n.onHighResTransitionEnd=n.onHighResTransitionEnd.bind((0,l.default)(n)),n.getLowResImage=n.getLowResImage.bind((0,l.default)(n)),n.getHighResImage=n.getHighResImage.bind((0,l.default)(n)),n}return(0,u.default)(r,[{key:"onHighResTransitionEnd",value:function(){this.setState({highResIsVisible:!0})}},{key:"getHighResImage",value:function(e){e&&e.complete&&this.handleHighResOnLoad()}},{key:"getLowResImage",value:function(e){e&&e.complete&&this.handleLowResOnLoad()}},{key:"handleLowResOnLoad",value:function(){this.setState({imageIsLoaded:!0,lowResIsLoaded:!0})}},{key:"handleHighResOnLoad",value:function(){this.setState({highResIsLoaded:!0,imageIsLoaded:!0})}},{key:"highResImage",value:function(e){var t=e.highResSize,r=e.lowResSize,n=e.url,o=this.state.highResIsLoaded,a=this.props.accessibilityLabel;return!r||t?c.default.createElement(g.default,{alt:a,ref:this.getHighResImage,isLoaded:o,onLoad:this.handleHighResOnLoad,onTransitionEnd:this.onHighResTransitionEnd,src:(0,p.appendToImageURL)(n,"resize",t),zIndex:2}):null}},{key:"lowResImage",value:function(e){var t=e.lowResQuality,r=e.lowResSize,n=e.url,o=this.state,a=o.highResIsVisible,i=o.lowResIsLoaded,u=this.props.accessibilityLabel;if(r&&!a){var l=(0,p.appendToImageURL)(n,"resize",r);return t&&(l=(0,p.appendToImageURL)(l,"quality",t)),c.default.createElement(g.default,{alt:u,ref:this.getLowResImage,isLoaded:i,onLoad:this.handleLowResOnLoad,src:l,zIndex:1})}return null}},{key:"render",value:function(){var e=this.props,t=e.aspectRatio,r=e.disablePlaceholder,n=e.highResSize,i=e.lowResQuality,u=e.lowResSize,l=e.style,s=e.uri,d=e.onLayout,f=e.rounded,h=this.state.imageIsLoaded,g=(0,p.addMissingProtocol)(s),y=function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?v(Object(r),!0).forEach((function(t){(0,a.default)(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):v(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}({},l);return f&&(0,o.default)(y,{borderRadius:"50%",overflow:"hidden"}),c.default.createElement(p.TcView,{onLayout:d,style:y,testID:"Image"},c.default.createElement("div",{style:{paddingBottom:100/t+"%"}},this.highResImage({highResSize:n,lowResSize:u,url:g}),this.lowResImage({lowResQuality:i,lowResSize:u,url:g}),r||h?null:c.default.createElement(b.default,{borderRadius:f?"50%":0})))}}]),r}(c.Component);O.defaultProps=h.defaultProps;var R=O;t.default=R},function(e,t){e.exports=require("@babel/runtime/helpers/defineProperty")},function(e,t){e.exports=require("@times-components/utils/rnw")},function(e,t,r){var n=r(0);Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var o=n(r(16)).default;t.default=o},function(e,t){e.exports=require("prop-types")},function(e,t){e.exports=require("@times-components/ts-styleguide/rnw")},function(e,t,r){var n=r(0);Object.defineProperty(t,"__esModule",{value:!0}),Object.defineProperty(t,"ModalImage",{enumerable:!0,get:function(){return a.default}}),Object.defineProperty(t,"Placeholder",{enumerable:!0,get:function(){return i.default}}),t.default=void 0;var o=n(r(2)),a=n(r(22)),i=n(r(5)),u=o.default;t.default=u},function(e,t){e.exports=require("@babel/runtime/helpers/extends")},function(e,t){e.exports=require("@babel/runtime/helpers/classCallCheck")},function(e,t){e.exports=require("@babel/runtime/helpers/createClass")},function(e,t){e.exports=require("@babel/runtime/helpers/assertThisInitialized")},function(e,t){e.exports=require("@babel/runtime/helpers/inherits")},function(e,t){e.exports=require("@babel/runtime/helpers/possibleConstructorReturn")},function(e,t){e.exports=require("@babel/runtime/helpers/getPrototypeOf")},function(e,t,r){var n=r(0);Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var o=n(r(3)),a=n(r(1)),i=(n(r(6)),r(4)),u=n(r(17)),l=n(r(18));function s(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function d(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?s(Object(r),!0).forEach((function(t){(0,o.default)(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):s(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}var f=function(e){var t=e.borderRadius,r=void 0===t?0:t,n=d(d({},u.default.placeholder),{},{borderRadius:r});return a.default.createElement(i.TcView,{height:"100%",style:n,width:"100%"},a.default.createElement(l.default,null))};t.default=f},function(e,t,r){Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var n={placeholder:{alignItems:"center",backgroundColor:r(7).colours.functional.backgroundSecondary,bottom:0,justifyContent:"center",left:0,position:"absolute",right:0,top:0,zIndex:0}};t.default=n},function(e,t,r){var n=r(0);Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var o=n(r(1)),a=r(7);var i=function(){return o.default.createElement("svg",{height:"auto",version:"1.1",viewBox:"145 50 108 120",width:"100%",style:{maxWidth:"25%",maxHeight:"50%"}},o.default.createElement("g",{fill:"none",fillRule:"evenodd",stroke:"none",strokeWidth:"1"},o.default.createElement("path",{d:"M211.26076,54 L211.231367,54 L147.67512,54 L145,85.7081465 L146.922096,86.4489102 C146.922096,86.4489102 164.867589,68.1355181 168.301115,65.0001546 C171.728017,61.8689133 174.237132,61.0885763 176.436179,60.3527593 C180.998206,59.169681 185.977937,59.2150255 185.977937,59.2150255 L186.109581,59.2150255 L186.109581,156.560932 L169.259886,164.473953 L169.259886,166 L228.735147,166 L228.735147,164.473953 L211.889177,156.560932 L211.889177,59.2150255 L212.01751,59.2150255 C212.01751,59.2150255 216.992272,59.169681 221.558854,60.3527593 C223.757072,61.0885763 226.266601,61.8689133 229.691848,65.0001546 C233.130341,68.1355181 251.071695,86.4489102 251.071695,86.4489102 L253,85.7081465 L250.317842,54 L211.270695,54 L211.242545,54",fill:a.colours.functional.contrast})))};t.default=i},function(e,t,r){var n=r(0);Object.defineProperty(t,"__esModule",{value:!0}),t.defaultProps=t.propTypes=void 0;var o=n(r(6)),a={style:o.default.object,accessibilityLabel:o.default.string,aspectRatio:o.default.number,borderRadius:o.default.number,disablePlaceholder:o.default.bool,fadeImageIn:o.default.bool,highResSize:o.default.number,lowResQuality:o.default.number,lowResSize:o.default.number,onLayout:o.default.func,rounded:o.default.bool,uri:o.default.string};t.propTypes=a;var i={aspectRatio:void 0,disablePlaceholder:!1,fadeImageIn:!1,highResSize:null,lowResSize:null,rounded:!1,uri:null};t.defaultProps=i},function(e,t,r){var n=r(0);Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var o=n(r(21)).default.img.withConfig({displayName:"responsive",componentId:"sc-1nnon4d-0"})(["display:block;opacity:",";position:absolute;transition:opacity 0.3s ease-in-out;width:100%;z-index:",";"],(function(e){return e.isLoaded?1:0}),(function(e){return e.zIndex}));t.default=o},function(e,t){e.exports=require("styled-components")},function(e,t,r){var n=r(0);Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var o=n(r(23)).default;t.default=o},function(e,t,r){var n=r(0);Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var o=n(r(2)).default;t.default=o}]);
|
|
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("react")},function(e,t){e.exports=require("prop-types")},function(e,t){e.exports=require("@times-components/utils/rnw")},function(e,t){e.exports=require("@times-components/ts-styleguide/rnw")},function(e,t){e.exports=require("styled-components")},function(e,t,n){"use strict";n.r(t);var r=n(0),o=n.n(r),i=n(2),a=n(1),s=n.n(a),u=n(3),c={placeholder:{alignItems:"center",backgroundColor:u.colours.functional.backgroundSecondary,bottom:0,justifyContent:"center",left:0,position:"absolute",right:0,top:0,zIndex:0}};var l=function(){return o.a.createElement("svg",{height:"auto",version:"1.1",viewBox:"145 50 108 120",width:"100%",style:{maxWidth:"25%",maxHeight:"50%"}},o.a.createElement("g",{fill:"none",fillRule:"evenodd",stroke:"none",strokeWidth:"1"},o.a.createElement("path",{d:"M211.26076,54 L211.231367,54 L147.67512,54 L145,85.7081465 L146.922096,86.4489102 C146.922096,86.4489102 164.867589,68.1355181 168.301115,65.0001546 C171.728017,61.8689133 174.237132,61.0885763 176.436179,60.3527593 C180.998206,59.169681 185.977937,59.2150255 185.977937,59.2150255 L186.109581,59.2150255 L186.109581,156.560932 L169.259886,164.473953 L169.259886,166 L228.735147,166 L228.735147,164.473953 L211.889177,156.560932 L211.889177,59.2150255 L212.01751,59.2150255 C212.01751,59.2150255 216.992272,59.169681 221.558854,60.3527593 C223.757072,61.0885763 226.266601,61.8689133 229.691848,65.0001546 C233.130341,68.1355181 251.071695,86.4489102 251.071695,86.4489102 L253,85.7081465 L250.317842,54 L211.270695,54 L211.242545,54",fill:u.colours.functional.contrast})))};function f(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function d(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?f(Object(n),!0).forEach((function(t){p(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):f(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function p(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var b=function(e){var t=e.borderRadius,n=void 0===t?0:t,r=d(d({},c.placeholder),{},{borderRadius:n});return o.a.createElement(i.TcView,{height:"100%",style:r,width:"100%"},o.a.createElement(l,null))},h=(s.a.object,s.a.string,s.a.number,s.a.number,s.a.bool,s.a.bool,s.a.number,s.a.number,s.a.number,s.a.func,s.a.bool,s.a.string,{aspectRatio:void 0,disablePlaceholder:!1,fadeImageIn:!1,highResSize:null,lowResSize:null,rounded:!1,uri:null}),g=n(4),y=n.n(g).a.img.withConfig({displayName:"responsive",componentId:"sc-1nnon4d-0"})(["display:block;opacity:",";position:absolute;transition:opacity 0.3s ease-in-out;width:100%;z-index:",";"],(function(e){return e.isLoaded?1:0}),(function(e){return e.zIndex}));function m(e){return(m="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 O(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function R(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function L(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 v(e,t){return(v=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function w(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=P(e);if(t){var o=P(this).constructor;n=Reflect.construct(r,arguments,o)}else n=r.apply(this,arguments);return j(this,n)}}function j(e,t){return!t||"object"!==m(t)&&"function"!=typeof t?I(e):t}function I(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function P(e){return(P=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}var S=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&&v(e,t)}(s,e);var t,n,r,a=w(s);function s(e){var t;return function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,s),(t=a.call(this,e)).state={highResIsLoaded:!1,highResIsVisible:!1,imageIsLoaded:!1,lowResIsLoaded:!e.fadeImageIn},t.handleHighResOnLoad=t.handleHighResOnLoad.bind(I(t)),t.handleLowResOnLoad=t.handleLowResOnLoad.bind(I(t)),t.onHighResTransitionEnd=t.onHighResTransitionEnd.bind(I(t)),t.getLowResImage=t.getLowResImage.bind(I(t)),t.getHighResImage=t.getHighResImage.bind(I(t)),t}return t=s,(n=[{key:"onHighResTransitionEnd",value:function(){this.setState({highResIsVisible:!0})}},{key:"getHighResImage",value:function(e){e&&e.complete&&this.handleHighResOnLoad()}},{key:"getLowResImage",value:function(e){e&&e.complete&&this.handleLowResOnLoad()}},{key:"handleLowResOnLoad",value:function(){this.setState({imageIsLoaded:!0,lowResIsLoaded:!0})}},{key:"handleHighResOnLoad",value:function(){this.setState({highResIsLoaded:!0,imageIsLoaded:!0})}},{key:"highResImage",value:function(e){var t=e.highResSize,n=e.lowResSize,r=e.url,a=this.state.highResIsLoaded,s=this.props.accessibilityLabel;return!n||t?o.a.createElement(y,{alt:s,ref:this.getHighResImage,isLoaded:a,onLoad:this.handleHighResOnLoad,onTransitionEnd:this.onHighResTransitionEnd,src:Object(i.appendToImageURL)(r,"resize",t),zIndex:2}):null}},{key:"lowResImage",value:function(e){var t=e.lowResQuality,n=e.lowResSize,r=e.url,a=this.state,s=a.highResIsVisible,u=a.lowResIsLoaded,c=this.props.accessibilityLabel;if(n&&!s){var l=Object(i.appendToImageURL)(r,"resize",n);return t&&(l=Object(i.appendToImageURL)(l,"quality",t)),o.a.createElement(y,{alt:c,ref:this.getLowResImage,isLoaded:u,onLoad:this.handleLowResOnLoad,src:l,zIndex:1})}return null}},{key:"render",value:function(){var e=this.props,t=e.aspectRatio,n=e.disablePlaceholder,r=e.highResSize,a=e.lowResQuality,s=e.lowResSize,u=e.style,c=e.uri,l=e.onLayout,f=e.rounded,d=this.state.imageIsLoaded,p=Object(i.addMissingProtocol)(c),h=function(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?O(Object(n),!0).forEach((function(t){R(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):O(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}({},u);return f&&Object.assign(h,{borderRadius:"50%",overflow:"hidden"}),o.a.createElement(i.TcView,{onLayout:l,style:h,testID:"Image"},o.a.createElement("div",{style:{paddingBottom:"".concat(100/t,"%")}},this.highResImage({highResSize:r,lowResSize:s,url:p}),this.lowResImage({lowResQuality:a,lowResSize:s,url:p}),n||d?null:o.a.createElement(b,{borderRadius:f?"50%":0})))}}])&&L(t.prototype,n),r&&L(t,r),s}(r.Component);S.defaultProps=h;var E=S,x=E;n.d(t,"ModalImage",(function(){return x})),n.d(t,"Placeholder",(function(){return b}));t.default=E}]);
|