@hipay/hipay-material-ui 3.7.12 → 3.7.13

Sign up to get free protection for your applications and to get access to all the features.
@@ -187,6 +187,13 @@ var useStyles = (0, _styles.makeStyles)(function (theme) {
187
187
  width: 234,
188
188
  textTransform: "uppercase"
189
189
  },
190
+ entityLabel: {
191
+ float: "left",
192
+ paddingLeft: 12,
193
+ height: 10,
194
+ width: 234,
195
+ textTransform: "uppercase"
196
+ },
190
197
  number: {
191
198
  display: "block",
192
199
  float: "left",
@@ -231,6 +238,15 @@ var useStyles = (0, _styles.makeStyles)(function (theme) {
231
238
  whiteSpace: "nowrap",
232
239
  textOverflow: "ellipsis"
233
240
  },
241
+ entityNumber: {
242
+ fontSize: 14,
243
+ height: 16,
244
+ width: 256,
245
+ paddingLeft: 12,
246
+ overflow: "hidden",
247
+ whiteSpace: "nowrap",
248
+ textOverflow: "ellipsis"
249
+ },
234
250
  memberSince: {
235
251
  display: "block",
236
252
  float: "left",
@@ -357,7 +373,8 @@ var HiPaymentMeans = function HiPaymentMeans(props) {
357
373
  translations = props.translations,
358
374
  type = props.type,
359
375
  yearMember = props.yearMember,
360
- fallbackImage = props.fallbackImage;
376
+ fallbackImage = props.fallbackImage,
377
+ entity = props.entity;
361
378
  var classes = useStyles(props);
362
379
  var theme = (0, _styles.useTheme)();
363
380
  var formatNumber = (0, _react.useMemo)(function () {
@@ -524,7 +541,11 @@ var HiPaymentMeans = function HiPaymentMeans(props) {
524
541
  }, PAYMENT_REFERENCE === type ? "REFERENCE" : translations.iban), /*#__PURE__*/_react.default.createElement("div", {
525
542
  className: (0, _classnames.default)(classes.number, classes.ibanNumber),
526
543
  "data-name": "card_number"
527
- }, formatNumber), /*#__PURE__*/_react.default.createElement("div", {
544
+ }, formatNumber), entity && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
545
+ className: (0, _classnames.default)(classes.labelMedium, classes.entityLabel)
546
+ }, translations.entity ? translations.entity : "ENTITY"), /*#__PURE__*/_react.default.createElement("div", {
547
+ className: (0, _classnames.default)(classes.number, classes.entityNumber)
548
+ }, entity)), /*#__PURE__*/_react.default.createElement("div", {
528
549
  className: (0, _classnames.default)(classes.labelLarge, classes.userNameSepa),
529
550
  title: username,
530
551
  "data-name": "card_name"
@@ -187,6 +187,13 @@ var useStyles = (0, _styles.makeStyles)(function (theme) {
187
187
  width: 234,
188
188
  textTransform: "uppercase"
189
189
  },
190
+ entityLabel: {
191
+ float: "left",
192
+ paddingLeft: 12,
193
+ height: 10,
194
+ width: 234,
195
+ textTransform: "uppercase"
196
+ },
190
197
  number: {
191
198
  display: "block",
192
199
  float: "left",
@@ -231,6 +238,15 @@ var useStyles = (0, _styles.makeStyles)(function (theme) {
231
238
  whiteSpace: "nowrap",
232
239
  textOverflow: "ellipsis"
233
240
  },
241
+ entityNumber: {
242
+ fontSize: 14,
243
+ height: 16,
244
+ width: 256,
245
+ paddingLeft: 12,
246
+ overflow: "hidden",
247
+ whiteSpace: "nowrap",
248
+ textOverflow: "ellipsis"
249
+ },
234
250
  memberSince: {
235
251
  display: "block",
236
252
  float: "left",
@@ -357,7 +373,8 @@ var HiPaymentMeans = function HiPaymentMeans(props) {
357
373
  translations = props.translations,
358
374
  type = props.type,
359
375
  yearMember = props.yearMember,
360
- fallbackImage = props.fallbackImage;
376
+ fallbackImage = props.fallbackImage,
377
+ entity = props.entity;
361
378
  var classes = useStyles(props);
362
379
  var theme = (0, _styles.useTheme)();
363
380
  var formatNumber = (0, _react.useMemo)(function () {
@@ -524,7 +541,11 @@ var HiPaymentMeans = function HiPaymentMeans(props) {
524
541
  }, PAYMENT_REFERENCE === type ? "REFERENCE" : translations.iban), /*#__PURE__*/_react.default.createElement("div", {
525
542
  className: (0, _classnames.default)(classes.number, classes.ibanNumber),
526
543
  "data-name": "card_number"
527
- }, formatNumber), /*#__PURE__*/_react.default.createElement("div", {
544
+ }, formatNumber), entity && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
545
+ className: (0, _classnames.default)(classes.labelMedium, classes.entityLabel)
546
+ }, translations.entity ? translations.entity : "ENTITY"), /*#__PURE__*/_react.default.createElement("div", {
547
+ className: (0, _classnames.default)(classes.number, classes.entityNumber)
548
+ }, entity)), /*#__PURE__*/_react.default.createElement("div", {
528
549
  className: (0, _classnames.default)(classes.labelLarge, classes.userNameSepa),
529
550
  title: username,
530
551
  "data-name": "card_name"
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@hipay/hipay-material-ui",
3
3
  "private": false,
4
- "version": "3.7.12",
4
+ "version": "3.7.13",
5
5
  "description": "React components that implement Google's Material Design.",
6
6
  "repository": {
7
7
  "type": "git",
package/HiMap/HiMap.js DELETED
@@ -1,315 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports.default = exports.styles = void 0;
9
-
10
- var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/classCallCheck"));
11
-
12
- var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/createClass"));
13
-
14
- var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/possibleConstructorReturn"));
15
-
16
- var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/getPrototypeOf"));
17
-
18
- var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/assertThisInitialized"));
19
-
20
- var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/inherits"));
21
-
22
- var _react = _interopRequireDefault(require("react"));
23
-
24
- var _styles = require("@material-ui/core/styles");
25
-
26
- var _HiButton = _interopRequireDefault(require("../HiButton"));
27
-
28
- var _HiIcon = _interopRequireDefault(require("../HiIcon"));
29
-
30
- var _HiLoader = _interopRequireDefault(require("../HiLoader"));
31
-
32
- var _leaflet = _interopRequireDefault(require("leaflet"));
33
-
34
- var _reactLeaflet = require("react-leaflet");
35
-
36
- var apiUrl = 'https://nominatim.openstreetmap.org/search?q='; // The original CSS can be found here : https://unpkg.com/leaflet@1.3.1/dist/leaflet.css
37
-
38
- var styles = function styles(theme) {
39
- return {
40
- map: {
41
- height: '100%',
42
- overflow: 'hidden',
43
- // eslint-disable-next-line max-len
44
- '& .leaflet-pane, & .leaflet-tile, & .leaflet-marker-icon, & .leaflet-marker-shadow, & .leaflet-tile-container, & .leaflet-pane > svg, & .leaflet-pane > canvas, & .leaflet-zoom-box, & .leaflet-image-layer, & .leaflet-layer': {
45
- position: 'absolute',
46
- left: 0,
47
- top: 0
48
- },
49
- '& .leaflet-container': {
50
- overflow: 'hidden',
51
- height: '100%'
52
- },
53
- '& .leaflet-tile, & .leaflet-marker-icon, & .leaflet-marker-shadow': {
54
- '-webkit-user-select': 'none',
55
- '-moz-user-select': 'none',
56
- userSelect: 'none',
57
- '-webkit-user-drag': 'none'
58
- },
59
- '& .leaflet-control': {
60
- display: 'none'
61
- },
62
- '& .map_marker': {
63
- fill: theme.palette.primary.light
64
- }
65
- },
66
- controlButtons: {
67
- position: 'absolute',
68
- bottom: 16,
69
- right: 16
70
- },
71
- centerIcon: {
72
- fontSize: 14
73
- },
74
- centerButtonContainer: {
75
- backgroundColor: theme.palette.background1,
76
- borderRadius: 3,
77
- padding: 3,
78
- fontFamily: theme.typography.fontFamily,
79
- boxShadow: '1px 1px 5px rgba(0, 0, 0, .16)',
80
- color: theme.palette.neutral.normal,
81
- '&>button:first-child': {
82
- borderBottom: "1px solid ".concat(theme.palette.neutral.normal)
83
- }
84
- },
85
- centerButton: {
86
- color: theme.palette.neutral.normal,
87
- padding: '1px !important',
88
- height: 26,
89
- minHeight: 26,
90
- width: 26,
91
- minWidth: 26
92
- },
93
- zoomButtons: {
94
- backgroundColor: theme.palette.background1,
95
- borderRadius: 3,
96
- padding: 3,
97
- fontFamily: theme.typography.fontFamily,
98
- boxShadow: '1px 1px 5px rgba(0, 0, 0, .16)',
99
- color: theme.palette.neutral.normal,
100
- '&>button:first-child': {
101
- borderBottom: "1px solid ".concat(theme.palette.neutral.normal)
102
- }
103
- },
104
- zoomButton: {
105
- paddingTop: '0px !important',
106
- paddingBottom: 0,
107
- paddingRight: 6,
108
- paddingLeft: 6,
109
- minWidth: 0,
110
- minHeight: 0,
111
- borderRadius: 0,
112
- display: 'block',
113
- fontSize: 24,
114
- fontWeight: 'bold',
115
- lineHeight: '26px',
116
- '&>span': {
117
- width: 14
118
- }
119
- }
120
- };
121
- };
122
-
123
- exports.styles = styles;
124
-
125
- var _ref = _react.default.createElement(_reactLeaflet.TileLayer, {
126
- url: "http://{s}.tile.openstreetmap.se/hydda/full/{z}/{x}/{y}.png"
127
- });
128
-
129
- var _ref2 = _react.default.createElement(_HiLoader.default, {
130
- loading: true
131
- });
132
-
133
- var HiMap =
134
- /*#__PURE__*/
135
- function (_React$PureComponent) {
136
- (0, _inherits2.default)(HiMap, _React$PureComponent);
137
-
138
- function HiMap(props) {
139
- var _this;
140
-
141
- (0, _classCallCheck2.default)(this, HiMap);
142
- _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(HiMap).call(this, props));
143
- _this.mounted = false;
144
- _this.state = {
145
- lat: 0,
146
- lng: 0,
147
- notFound: false,
148
- loaded: false,
149
- zoom: 16
150
- };
151
- _this.handleClickZoomIn = _this.handleClickZoomIn.bind((0, _assertThisInitialized2.default)(_this));
152
- _this.handleScrollZoom = _this.handleScrollZoom.bind((0, _assertThisInitialized2.default)(_this));
153
- _this.handleClickZoomOut = _this.handleClickZoomOut.bind((0, _assertThisInitialized2.default)(_this));
154
- _this.handleCenter = _this.handleCenter.bind((0, _assertThisInitialized2.default)(_this));
155
- return _this;
156
- } // Loads the libraries once the component mounted to avoid error caused by server-cli rendering.
157
-
158
-
159
- (0, _createClass2.default)(HiMap, [{
160
- key: "componentDidMount",
161
- value: function componentDidMount() {
162
- this.mounted = true;
163
- this.findCoords();
164
- }
165
- }, {
166
- key: "componentWillUnmount",
167
- value: function componentWillUnmount() {
168
- this.mounted = false;
169
- }
170
- }, {
171
- key: "handleScrollZoom",
172
- value: function handleScrollZoom(event) {
173
- this.setState({
174
- zoom: event.zoom
175
- });
176
- }
177
- }, {
178
- key: "handleClickZoomIn",
179
- value: function handleClickZoomIn() {
180
- this.setState(function (prevState) {
181
- return {
182
- zoom: prevState.zoom + 1
183
- };
184
- });
185
- }
186
- }, {
187
- key: "handleClickZoomOut",
188
- value: function handleClickZoomOut() {
189
- this.setState(function (prevState) {
190
- return {
191
- zoom: prevState.zoom - 1
192
- };
193
- });
194
- }
195
- }, {
196
- key: "handleCenter",
197
- value: function handleCenter() {
198
- // trick to center the map.
199
- this.setState(function (prevState) {
200
- return {
201
- lat: prevState.lat + 0.0000000001
202
- };
203
- });
204
- } // Call to the geocoding API.
205
-
206
- }, {
207
- key: "findCoords",
208
- value: function findCoords() {
209
- var _this2 = this;
210
-
211
- fetch("".concat(apiUrl).concat(this.props.address, "&format=jsonv2&limit=5&bounded=1&dedupe=1&namedetails=1")).then(function (result) {
212
- return result.json();
213
- }).then(function (response) {
214
- if (_this2.mounted) {
215
- if (response.length !== 0) {
216
- _this2.setState({
217
- lat: parseFloat(response[0].lat),
218
- lng: parseFloat(response[0].lon),
219
- notFound: false,
220
- loaded: true
221
- });
222
- } else {
223
- _this2.setState({
224
- notFound: true
225
- });
226
-
227
- _this2.props.onAddressNotFound();
228
- }
229
- }
230
- });
231
- }
232
- }, {
233
- key: "render",
234
- value: function render() {
235
- var _this$state = this.state,
236
- zoom = _this$state.zoom,
237
- lng = _this$state.lng,
238
- lat = _this$state.lat,
239
- notFound = _this$state.notFound,
240
- loaded = _this$state.loaded;
241
- var _this$props = this.props,
242
- translations = _this$props.translations,
243
- classes = _this$props.classes;
244
- var position = [lat, lng];
245
- var element;
246
- var myIcon;
247
- if (notFound) element = translations.notFound;
248
-
249
- if (loaded && _leaflet.default && _reactLeaflet.Map) {
250
- myIcon = _leaflet.default.divIcon({
251
- html: '<svg x="0px" y="0px" viewBox="0 0 365 560" enable-background="new 0 0 365 560" xml:space="preserve">\n' + '<path class="map_marker" ' + 'd="M182.9,551.7c0,0.1,0.2,0.3,0.2,0.3S358.3,283,358.3,194.6c0-130.1-88.8-186.7-175.4-186.9 ' + 'C96.3,7.9,7.5,64.5,7.5,194.6c0,88.4,175.3,357.4,175.3,357.4S182.9,551.7,182.9,551.7z' + ' M122.2,187.2c0-33.6,27.2-60.8,60.8-60.8 ' + 'c33.6,0,60.8,27.2,60.8,60.8S216.5,248,182.9,248C149.4,248,122.2,220.8,122.2,187.2z"/>\n' + '</svg>',
252
- iconSize: [24, 36],
253
- iconAnchor: [11, 36]
254
- });
255
- element = _react.default.createElement(_reactLeaflet.Map, {
256
- zoom: zoom,
257
- center: position,
258
- className: classes.map,
259
- onViewportChange: this.handleScrollZoom
260
- }, _ref, _react.default.createElement(_reactLeaflet.Marker, {
261
- position: position,
262
- icon: myIcon
263
- }), _react.default.createElement("div", {
264
- className: classes.controlButtons
265
- }, _react.default.createElement("div", {
266
- className: classes.centerButtonContainer
267
- }, _react.default.createElement(_HiButton.default, {
268
- className: classes.centerButton,
269
- onClick: this.handleCenter
270
- }, _react.default.createElement(_HiIcon.default, {
271
- className: classes.centerIcon,
272
- icon: 'my_location',
273
- size: 24
274
- }))), _react.default.createElement("div", {
275
- className: classes.zoomButtons
276
- }, _react.default.createElement(_HiButton.default, {
277
- onClick: this.handleClickZoomIn,
278
- className: classes.zoomButton
279
- }, "+"), _react.default.createElement(_HiButton.default, {
280
- onClick: this.handleClickZoomOut,
281
- className: classes.zoomButton
282
- }, "-"))));
283
- } else {
284
- element = _react.default.createElement("div", {
285
- style: {
286
- top: '50%',
287
- left: '50%',
288
- position: 'absolute'
289
- }
290
- }, _ref2);
291
- }
292
-
293
- return _react.default.createElement("div", {
294
- style: {
295
- height: '352px',
296
- width: '100%',
297
- position: 'relative'
298
- }
299
- }, element);
300
- }
301
- }]);
302
- return HiMap;
303
- }(_react.default.PureComponent);
304
-
305
- HiMap.defaultProps = {
306
- translations: {
307
- notFound: 'Address not found'
308
- }
309
- };
310
-
311
- var _default = (0, _styles.withStyles)(styles, {
312
- name: 'HmuiHiMap'
313
- })(HiMap);
314
-
315
- exports.default = _default;
@@ -1,200 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports.default = void 0;
9
-
10
- var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/defineProperty"));
11
-
12
- var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/classCallCheck"));
13
-
14
- var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/createClass"));
15
-
16
- var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/possibleConstructorReturn"));
17
-
18
- var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/getPrototypeOf"));
19
-
20
- var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/assertThisInitialized"));
21
-
22
- var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/inherits"));
23
-
24
- var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
25
-
26
- var _react = _interopRequireDefault(require("react"));
27
-
28
- var _classnames = _interopRequireDefault(require("classnames"));
29
-
30
- var _ExpansionPanel = _interopRequireDefault(require("@material-ui/core/ExpansionPanel"));
31
-
32
- var _ExpansionPanelDetails = _interopRequireDefault(require("@material-ui/core/ExpansionPanelDetails"));
33
-
34
- var _ExpansionPanelSummary = _interopRequireDefault(require("@material-ui/core/ExpansionPanelSummary"));
35
-
36
- var _styles = require("@material-ui/core/styles");
37
-
38
- var _HiMap = _interopRequireDefault(require("./HiMap"));
39
-
40
- var _HiIcon = _interopRequireDefault(require("../HiIcon/HiIcon"));
41
-
42
- var styles = function styles(theme) {
43
- return {
44
- column: {
45
- flexBasis: '33.33%'
46
- },
47
- root: {
48
- flexGrow: 1,
49
- boxShadow: 'none'
50
- },
51
- imgListItem: {
52
- width: 24,
53
- height: 'auto',
54
- marginRight: 8,
55
- verticalAlign: 'middle'
56
- },
57
- expandMoreIcon: {},
58
- disabledIcon: {
59
- color: theme.palette.action.disabled
60
- },
61
- panelSummaryExpanded: {
62
- minHeight: 0
63
- },
64
- panelSummary: {
65
- '&>div:first-child': {
66
- margin: '12px 0'
67
- }
68
- },
69
- expanded: {
70
- '& $expandMoreIcon': {
71
- transform: 'translateY(-50%) rotate(0) !important',
72
- color: theme.palette.primary.light
73
- },
74
- minHeight: '0 !important'
75
- },
76
- heading: (0, _objectSpread2.default)({}, theme.typography.b1, {
77
- margin: 0,
78
- fontSize: 15,
79
- lineHeight: '24px'
80
- }),
81
- secondaryHeading: (0, _objectSpread2.default)({}, theme.typography.b3, {
82
- margin: 0,
83
- fontSize: 15,
84
- lineHeight: '24px',
85
- float: 'left',
86
- '&>svg': {
87
- fontSize: 18,
88
- marginLeft: 3,
89
- marginBottom: -5
90
- }
91
- })
92
- };
93
- };
94
-
95
- var HiMapExpand =
96
- /*#__PURE__*/
97
- function (_React$PureComponent) {
98
- (0, _inherits2.default)(HiMapExpand, _React$PureComponent);
99
-
100
- function HiMapExpand(props) {
101
- var _this;
102
-
103
- (0, _classCallCheck2.default)(this, HiMapExpand);
104
- _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(HiMapExpand).call(this, props));
105
- _this.state = {
106
- addressNotFound: false,
107
- expanded: false
108
- };
109
- _this.handleAddressNotFound = _this.handleAddressNotFound.bind((0, _assertThisInitialized2.default)(_this));
110
- _this.handleExpand = _this.handleExpand.bind((0, _assertThisInitialized2.default)(_this));
111
- return _this;
112
- }
113
-
114
- (0, _createClass2.default)(HiMapExpand, [{
115
- key: "handleExpand",
116
- value: function handleExpand() {
117
- this.setState(function (prevState) {
118
- return {
119
- expanded: !prevState.addressNotFound && !prevState.expanded
120
- };
121
- });
122
- }
123
- }, {
124
- key: "handleAddressNotFound",
125
- value: function handleAddressNotFound() {
126
- this.setState({
127
- addressNotFound: true
128
- });
129
- }
130
- }, {
131
- key: "render",
132
- value: function render() {
133
- var _this$props = this.props,
134
- classes = _this$props.classes,
135
- address = _this$props.address,
136
- countryFlagPath = _this$props.countryFlagPath,
137
- hideLabel = _this$props.hideLabel,
138
- translations = _this$props.translations;
139
- var _this$state = this.state,
140
- addressNotFound = _this$state.addressNotFound,
141
- expanded = _this$state.expanded;
142
- var flag = countryFlagPath ? _react.default.createElement("img", {
143
- src: countryFlagPath,
144
- className: classes.imgListItem,
145
- alt: 'country flag'
146
- }) : '';
147
- return _react.default.createElement(_ExpansionPanel.default, {
148
- className: classes.root,
149
- defaultExpanded: false,
150
- expanded: expanded,
151
- onChange: this.handleExpand
152
- }, _react.default.createElement(_ExpansionPanelSummary.default, {
153
- classes: {
154
- root: classes.panelSummary,
155
- expanded: classes.expanded,
156
- expandIcon: classes.expandMoreIcon
157
- },
158
- expandIcon: _react.default.createElement(_HiIcon.default, {
159
- icon: 'place',
160
- style: {
161
- position: 'relative',
162
- top: 2,
163
- marginRight: 5
164
- },
165
- className: (0, _classnames.default)((0, _defineProperty2.default)({}, classes.disabledIcon, addressNotFound)),
166
- title: addressNotFound ? translations.notFound : ''
167
- })
168
- }, _react.default.createElement(_react.default.Fragment, null, hideLabel || _react.default.createElement("div", {
169
- className: classes.column
170
- }, _react.default.createElement("p", {
171
- className: classes.secondaryHeading
172
- }, translations.label)), _react.default.createElement("div", null, _react.default.createElement("p", {
173
- className: classes.heading
174
- }, flag, address)))), _react.default.createElement(_ExpansionPanelDetails.default, {
175
- style: {
176
- padding: 0
177
- }
178
- }, _react.default.createElement(_HiMap.default, {
179
- address: address,
180
- onAddressNotFound: this.handleAddressNotFound
181
- })));
182
- }
183
- }]);
184
- return HiMapExpand;
185
- }(_react.default.PureComponent);
186
-
187
- HiMapExpand.defaultProps = {
188
- countryFlagPath: '',
189
- hideLabel: false,
190
- translations: {
191
- label: 'Adresse',
192
- notFound: 'Adresse inconnue'
193
- }
194
- };
195
-
196
- var _default = (0, _styles.withStyles)(styles, {
197
- name: 'HmuiHiMapExpand'
198
- })(HiMapExpand);
199
-
200
- exports.default = _default;
package/HiMap/index.js DELETED
@@ -1,23 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- Object.defineProperty(exports, "default", {
9
- enumerable: true,
10
- get: function get() {
11
- return _HiMap.default;
12
- }
13
- });
14
- Object.defineProperty(exports, "HiMapExpand", {
15
- enumerable: true,
16
- get: function get() {
17
- return _HiMapExpand.default;
18
- }
19
- });
20
-
21
- var _HiMap = _interopRequireDefault(require("./HiMap"));
22
-
23
- var _HiMapExpand = _interopRequireDefault(require("./HiMapExpand"));
package/es/HiMap/HiMap.js DELETED
@@ -1,315 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports.default = exports.styles = void 0;
9
-
10
- var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/classCallCheck"));
11
-
12
- var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/createClass"));
13
-
14
- var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/possibleConstructorReturn"));
15
-
16
- var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/getPrototypeOf"));
17
-
18
- var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/assertThisInitialized"));
19
-
20
- var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/inherits"));
21
-
22
- var _react = _interopRequireDefault(require("react"));
23
-
24
- var _styles = require("@material-ui/core/styles");
25
-
26
- var _HiButton = _interopRequireDefault(require("../HiButton"));
27
-
28
- var _HiIcon = _interopRequireDefault(require("../HiIcon"));
29
-
30
- var _HiLoader = _interopRequireDefault(require("../HiLoader"));
31
-
32
- var _leaflet = _interopRequireDefault(require("leaflet"));
33
-
34
- var _reactLeaflet = require("react-leaflet");
35
-
36
- var apiUrl = 'https://nominatim.openstreetmap.org/search?q='; // The original CSS can be found here : https://unpkg.com/leaflet@1.3.1/dist/leaflet.css
37
-
38
- var styles = function styles(theme) {
39
- return {
40
- map: {
41
- height: '100%',
42
- overflow: 'hidden',
43
- // eslint-disable-next-line max-len
44
- '& .leaflet-pane, & .leaflet-tile, & .leaflet-marker-icon, & .leaflet-marker-shadow, & .leaflet-tile-container, & .leaflet-pane > svg, & .leaflet-pane > canvas, & .leaflet-zoom-box, & .leaflet-image-layer, & .leaflet-layer': {
45
- position: 'absolute',
46
- left: 0,
47
- top: 0
48
- },
49
- '& .leaflet-container': {
50
- overflow: 'hidden',
51
- height: '100%'
52
- },
53
- '& .leaflet-tile, & .leaflet-marker-icon, & .leaflet-marker-shadow': {
54
- '-webkit-user-select': 'none',
55
- '-moz-user-select': 'none',
56
- userSelect: 'none',
57
- '-webkit-user-drag': 'none'
58
- },
59
- '& .leaflet-control': {
60
- display: 'none'
61
- },
62
- '& .map_marker': {
63
- fill: theme.palette.primary.light
64
- }
65
- },
66
- controlButtons: {
67
- position: 'absolute',
68
- bottom: 16,
69
- right: 16
70
- },
71
- centerIcon: {
72
- fontSize: 14
73
- },
74
- centerButtonContainer: {
75
- backgroundColor: theme.palette.background1,
76
- borderRadius: 3,
77
- padding: 3,
78
- fontFamily: theme.typography.fontFamily,
79
- boxShadow: '1px 1px 5px rgba(0, 0, 0, .16)',
80
- color: theme.palette.neutral.normal,
81
- '&>button:first-child': {
82
- borderBottom: "1px solid ".concat(theme.palette.neutral.normal)
83
- }
84
- },
85
- centerButton: {
86
- color: theme.palette.neutral.normal,
87
- padding: '1px !important',
88
- height: 26,
89
- minHeight: 26,
90
- width: 26,
91
- minWidth: 26
92
- },
93
- zoomButtons: {
94
- backgroundColor: theme.palette.background1,
95
- borderRadius: 3,
96
- padding: 3,
97
- fontFamily: theme.typography.fontFamily,
98
- boxShadow: '1px 1px 5px rgba(0, 0, 0, .16)',
99
- color: theme.palette.neutral.normal,
100
- '&>button:first-child': {
101
- borderBottom: "1px solid ".concat(theme.palette.neutral.normal)
102
- }
103
- },
104
- zoomButton: {
105
- paddingTop: '0px !important',
106
- paddingBottom: 0,
107
- paddingRight: 6,
108
- paddingLeft: 6,
109
- minWidth: 0,
110
- minHeight: 0,
111
- borderRadius: 0,
112
- display: 'block',
113
- fontSize: 24,
114
- fontWeight: 'bold',
115
- lineHeight: '26px',
116
- '&>span': {
117
- width: 14
118
- }
119
- }
120
- };
121
- };
122
-
123
- exports.styles = styles;
124
-
125
- var _ref = _react.default.createElement(_reactLeaflet.TileLayer, {
126
- url: "http://{s}.tile.openstreetmap.se/hydda/full/{z}/{x}/{y}.png"
127
- });
128
-
129
- var _ref2 = _react.default.createElement(_HiLoader.default, {
130
- loading: true
131
- });
132
-
133
- var HiMap =
134
- /*#__PURE__*/
135
- function (_React$PureComponent) {
136
- (0, _inherits2.default)(HiMap, _React$PureComponent);
137
-
138
- function HiMap(props) {
139
- var _this;
140
-
141
- (0, _classCallCheck2.default)(this, HiMap);
142
- _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(HiMap).call(this, props));
143
- _this.mounted = false;
144
- _this.state = {
145
- lat: 0,
146
- lng: 0,
147
- notFound: false,
148
- loaded: false,
149
- zoom: 16
150
- };
151
- _this.handleClickZoomIn = _this.handleClickZoomIn.bind((0, _assertThisInitialized2.default)(_this));
152
- _this.handleScrollZoom = _this.handleScrollZoom.bind((0, _assertThisInitialized2.default)(_this));
153
- _this.handleClickZoomOut = _this.handleClickZoomOut.bind((0, _assertThisInitialized2.default)(_this));
154
- _this.handleCenter = _this.handleCenter.bind((0, _assertThisInitialized2.default)(_this));
155
- return _this;
156
- } // Loads the libraries once the component mounted to avoid error caused by server-cli rendering.
157
-
158
-
159
- (0, _createClass2.default)(HiMap, [{
160
- key: "componentDidMount",
161
- value: function componentDidMount() {
162
- this.mounted = true;
163
- this.findCoords();
164
- }
165
- }, {
166
- key: "componentWillUnmount",
167
- value: function componentWillUnmount() {
168
- this.mounted = false;
169
- }
170
- }, {
171
- key: "handleScrollZoom",
172
- value: function handleScrollZoom(event) {
173
- this.setState({
174
- zoom: event.zoom
175
- });
176
- }
177
- }, {
178
- key: "handleClickZoomIn",
179
- value: function handleClickZoomIn() {
180
- this.setState(function (prevState) {
181
- return {
182
- zoom: prevState.zoom + 1
183
- };
184
- });
185
- }
186
- }, {
187
- key: "handleClickZoomOut",
188
- value: function handleClickZoomOut() {
189
- this.setState(function (prevState) {
190
- return {
191
- zoom: prevState.zoom - 1
192
- };
193
- });
194
- }
195
- }, {
196
- key: "handleCenter",
197
- value: function handleCenter() {
198
- // trick to center the map.
199
- this.setState(function (prevState) {
200
- return {
201
- lat: prevState.lat + 0.0000000001
202
- };
203
- });
204
- } // Call to the geocoding API.
205
-
206
- }, {
207
- key: "findCoords",
208
- value: function findCoords() {
209
- var _this2 = this;
210
-
211
- fetch("".concat(apiUrl).concat(this.props.address, "&format=jsonv2&limit=5&bounded=1&dedupe=1&namedetails=1")).then(function (result) {
212
- return result.json();
213
- }).then(function (response) {
214
- if (_this2.mounted) {
215
- if (response.length !== 0) {
216
- _this2.setState({
217
- lat: parseFloat(response[0].lat),
218
- lng: parseFloat(response[0].lon),
219
- notFound: false,
220
- loaded: true
221
- });
222
- } else {
223
- _this2.setState({
224
- notFound: true
225
- });
226
-
227
- _this2.props.onAddressNotFound();
228
- }
229
- }
230
- });
231
- }
232
- }, {
233
- key: "render",
234
- value: function render() {
235
- var _this$state = this.state,
236
- zoom = _this$state.zoom,
237
- lng = _this$state.lng,
238
- lat = _this$state.lat,
239
- notFound = _this$state.notFound,
240
- loaded = _this$state.loaded;
241
- var _this$props = this.props,
242
- translations = _this$props.translations,
243
- classes = _this$props.classes;
244
- var position = [lat, lng];
245
- var element;
246
- var myIcon;
247
- if (notFound) element = translations.notFound;
248
-
249
- if (loaded && _leaflet.default && _reactLeaflet.Map) {
250
- myIcon = _leaflet.default.divIcon({
251
- html: '<svg x="0px" y="0px" viewBox="0 0 365 560" enable-background="new 0 0 365 560" xml:space="preserve">\n' + '<path class="map_marker" ' + 'd="M182.9,551.7c0,0.1,0.2,0.3,0.2,0.3S358.3,283,358.3,194.6c0-130.1-88.8-186.7-175.4-186.9 ' + 'C96.3,7.9,7.5,64.5,7.5,194.6c0,88.4,175.3,357.4,175.3,357.4S182.9,551.7,182.9,551.7z' + ' M122.2,187.2c0-33.6,27.2-60.8,60.8-60.8 ' + 'c33.6,0,60.8,27.2,60.8,60.8S216.5,248,182.9,248C149.4,248,122.2,220.8,122.2,187.2z"/>\n' + '</svg>',
252
- iconSize: [24, 36],
253
- iconAnchor: [11, 36]
254
- });
255
- element = _react.default.createElement(_reactLeaflet.Map, {
256
- zoom: zoom,
257
- center: position,
258
- className: classes.map,
259
- onViewportChange: this.handleScrollZoom
260
- }, _ref, _react.default.createElement(_reactLeaflet.Marker, {
261
- position: position,
262
- icon: myIcon
263
- }), _react.default.createElement("div", {
264
- className: classes.controlButtons
265
- }, _react.default.createElement("div", {
266
- className: classes.centerButtonContainer
267
- }, _react.default.createElement(_HiButton.default, {
268
- className: classes.centerButton,
269
- onClick: this.handleCenter
270
- }, _react.default.createElement(_HiIcon.default, {
271
- className: classes.centerIcon,
272
- icon: 'my_location',
273
- size: 24
274
- }))), _react.default.createElement("div", {
275
- className: classes.zoomButtons
276
- }, _react.default.createElement(_HiButton.default, {
277
- onClick: this.handleClickZoomIn,
278
- className: classes.zoomButton
279
- }, "+"), _react.default.createElement(_HiButton.default, {
280
- onClick: this.handleClickZoomOut,
281
- className: classes.zoomButton
282
- }, "-"))));
283
- } else {
284
- element = _react.default.createElement("div", {
285
- style: {
286
- top: '50%',
287
- left: '50%',
288
- position: 'absolute'
289
- }
290
- }, _ref2);
291
- }
292
-
293
- return _react.default.createElement("div", {
294
- style: {
295
- height: '352px',
296
- width: '100%',
297
- position: 'relative'
298
- }
299
- }, element);
300
- }
301
- }]);
302
- return HiMap;
303
- }(_react.default.PureComponent);
304
-
305
- HiMap.defaultProps = {
306
- translations: {
307
- notFound: 'Address not found'
308
- }
309
- };
310
-
311
- var _default = (0, _styles.withStyles)(styles, {
312
- name: 'HmuiHiMap'
313
- })(HiMap);
314
-
315
- exports.default = _default;
@@ -1,200 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports.default = void 0;
9
-
10
- var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/defineProperty"));
11
-
12
- var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/classCallCheck"));
13
-
14
- var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/createClass"));
15
-
16
- var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/possibleConstructorReturn"));
17
-
18
- var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/getPrototypeOf"));
19
-
20
- var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/assertThisInitialized"));
21
-
22
- var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/inherits"));
23
-
24
- var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
25
-
26
- var _react = _interopRequireDefault(require("react"));
27
-
28
- var _classnames = _interopRequireDefault(require("classnames"));
29
-
30
- var _ExpansionPanel = _interopRequireDefault(require("@material-ui/core/ExpansionPanel"));
31
-
32
- var _ExpansionPanelDetails = _interopRequireDefault(require("@material-ui/core/ExpansionPanelDetails"));
33
-
34
- var _ExpansionPanelSummary = _interopRequireDefault(require("@material-ui/core/ExpansionPanelSummary"));
35
-
36
- var _styles = require("@material-ui/core/styles");
37
-
38
- var _HiMap = _interopRequireDefault(require("./HiMap"));
39
-
40
- var _HiIcon = _interopRequireDefault(require("../HiIcon/HiIcon"));
41
-
42
- var styles = function styles(theme) {
43
- return {
44
- column: {
45
- flexBasis: '33.33%'
46
- },
47
- root: {
48
- flexGrow: 1,
49
- boxShadow: 'none'
50
- },
51
- imgListItem: {
52
- width: 24,
53
- height: 'auto',
54
- marginRight: 8,
55
- verticalAlign: 'middle'
56
- },
57
- expandMoreIcon: {},
58
- disabledIcon: {
59
- color: theme.palette.action.disabled
60
- },
61
- panelSummaryExpanded: {
62
- minHeight: 0
63
- },
64
- panelSummary: {
65
- '&>div:first-child': {
66
- margin: '12px 0'
67
- }
68
- },
69
- expanded: {
70
- '& $expandMoreIcon': {
71
- transform: 'translateY(-50%) rotate(0) !important',
72
- color: theme.palette.primary.light
73
- },
74
- minHeight: '0 !important'
75
- },
76
- heading: (0, _objectSpread2.default)({}, theme.typography.b1, {
77
- margin: 0,
78
- fontSize: 15,
79
- lineHeight: '24px'
80
- }),
81
- secondaryHeading: (0, _objectSpread2.default)({}, theme.typography.b3, {
82
- margin: 0,
83
- fontSize: 15,
84
- lineHeight: '24px',
85
- float: 'left',
86
- '&>svg': {
87
- fontSize: 18,
88
- marginLeft: 3,
89
- marginBottom: -5
90
- }
91
- })
92
- };
93
- };
94
-
95
- var HiMapExpand =
96
- /*#__PURE__*/
97
- function (_React$PureComponent) {
98
- (0, _inherits2.default)(HiMapExpand, _React$PureComponent);
99
-
100
- function HiMapExpand(props) {
101
- var _this;
102
-
103
- (0, _classCallCheck2.default)(this, HiMapExpand);
104
- _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(HiMapExpand).call(this, props));
105
- _this.state = {
106
- addressNotFound: false,
107
- expanded: false
108
- };
109
- _this.handleAddressNotFound = _this.handleAddressNotFound.bind((0, _assertThisInitialized2.default)(_this));
110
- _this.handleExpand = _this.handleExpand.bind((0, _assertThisInitialized2.default)(_this));
111
- return _this;
112
- }
113
-
114
- (0, _createClass2.default)(HiMapExpand, [{
115
- key: "handleExpand",
116
- value: function handleExpand() {
117
- this.setState(function (prevState) {
118
- return {
119
- expanded: !prevState.addressNotFound && !prevState.expanded
120
- };
121
- });
122
- }
123
- }, {
124
- key: "handleAddressNotFound",
125
- value: function handleAddressNotFound() {
126
- this.setState({
127
- addressNotFound: true
128
- });
129
- }
130
- }, {
131
- key: "render",
132
- value: function render() {
133
- var _this$props = this.props,
134
- classes = _this$props.classes,
135
- address = _this$props.address,
136
- countryFlagPath = _this$props.countryFlagPath,
137
- hideLabel = _this$props.hideLabel,
138
- translations = _this$props.translations;
139
- var _this$state = this.state,
140
- addressNotFound = _this$state.addressNotFound,
141
- expanded = _this$state.expanded;
142
- var flag = countryFlagPath ? _react.default.createElement("img", {
143
- src: countryFlagPath,
144
- className: classes.imgListItem,
145
- alt: 'country flag'
146
- }) : '';
147
- return _react.default.createElement(_ExpansionPanel.default, {
148
- className: classes.root,
149
- defaultExpanded: false,
150
- expanded: expanded,
151
- onChange: this.handleExpand
152
- }, _react.default.createElement(_ExpansionPanelSummary.default, {
153
- classes: {
154
- root: classes.panelSummary,
155
- expanded: classes.expanded,
156
- expandIcon: classes.expandMoreIcon
157
- },
158
- expandIcon: _react.default.createElement(_HiIcon.default, {
159
- icon: 'place',
160
- style: {
161
- position: 'relative',
162
- top: 2,
163
- marginRight: 5
164
- },
165
- className: (0, _classnames.default)((0, _defineProperty2.default)({}, classes.disabledIcon, addressNotFound)),
166
- title: addressNotFound ? translations.notFound : ''
167
- })
168
- }, _react.default.createElement(_react.default.Fragment, null, hideLabel || _react.default.createElement("div", {
169
- className: classes.column
170
- }, _react.default.createElement("p", {
171
- className: classes.secondaryHeading
172
- }, translations.label)), _react.default.createElement("div", null, _react.default.createElement("p", {
173
- className: classes.heading
174
- }, flag, address)))), _react.default.createElement(_ExpansionPanelDetails.default, {
175
- style: {
176
- padding: 0
177
- }
178
- }, _react.default.createElement(_HiMap.default, {
179
- address: address,
180
- onAddressNotFound: this.handleAddressNotFound
181
- })));
182
- }
183
- }]);
184
- return HiMapExpand;
185
- }(_react.default.PureComponent);
186
-
187
- HiMapExpand.defaultProps = {
188
- countryFlagPath: '',
189
- hideLabel: false,
190
- translations: {
191
- label: 'Adresse',
192
- notFound: 'Adresse inconnue'
193
- }
194
- };
195
-
196
- var _default = (0, _styles.withStyles)(styles, {
197
- name: 'HmuiHiMapExpand'
198
- })(HiMapExpand);
199
-
200
- exports.default = _default;
package/es/HiMap/index.js DELETED
@@ -1,23 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- Object.defineProperty(exports, "default", {
9
- enumerable: true,
10
- get: function get() {
11
- return _HiMap.default;
12
- }
13
- });
14
- Object.defineProperty(exports, "HiMapExpand", {
15
- enumerable: true,
16
- get: function get() {
17
- return _HiMapExpand.default;
18
- }
19
- });
20
-
21
- var _HiMap = _interopRequireDefault(require("./HiMap"));
22
-
23
- var _HiMapExpand = _interopRequireDefault(require("./HiMapExpand"));
@@ -1,51 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- var _fs = _interopRequireDefault(require("fs"));
6
-
7
- var _path = _interopRequireDefault(require("path"));
8
-
9
- var _react = _interopRequireDefault(require("react"));
10
-
11
- var _chai = require("chai");
12
-
13
- var _testUtils = require("../test-utils");
14
-
15
- describe('hi-svg-icons', function () {
16
- var shallow;
17
- before(function () {
18
- shallow = (0, _testUtils.createShallow)();
19
- });
20
- it('should be able to render all of them', function (done) {
21
- // This test can only be run on the node env
22
- if (!_fs.default.readdir) {
23
- done();
24
- return;
25
- }
26
-
27
- _fs.default.readdir(__dirname, function (err, files) {
28
- files.forEach(function (file) {
29
- // Ignore no js files and tests
30
- if (file.indexOf('.js') === -1 || file.indexOf('text.js') > -1) {
31
- return;
32
- } // eslint-disable-next-line global-require, import/no-dynamic-require
33
-
34
-
35
- var fileLoaded = require(_path.default.join(__dirname, file));
36
-
37
- if (!fileLoaded.default) {
38
- return;
39
- }
40
-
41
- var Icon = fileLoaded.default;
42
- var wrapper = shallow(_react.default.createElement(Icon, {
43
- className: "foo"
44
- }));
45
-
46
- _chai.assert.strictEqual(wrapper.hasClass('foo'), true);
47
- });
48
- done();
49
- });
50
- });
51
- });
@@ -1,51 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- var _fs = _interopRequireDefault(require("fs"));
6
-
7
- var _path = _interopRequireDefault(require("path"));
8
-
9
- var _react = _interopRequireDefault(require("react"));
10
-
11
- var _chai = require("chai");
12
-
13
- var _testUtils = require("../test-utils");
14
-
15
- describe('hi-svg-icons', function () {
16
- var shallow;
17
- before(function () {
18
- shallow = (0, _testUtils.createShallow)();
19
- });
20
- it('should be able to render all of them', function (done) {
21
- // This test can only be run on the node env
22
- if (!_fs.default.readdir) {
23
- done();
24
- return;
25
- }
26
-
27
- _fs.default.readdir(__dirname, function (err, files) {
28
- files.forEach(function (file) {
29
- // Ignore no js files and tests
30
- if (file.indexOf('.js') === -1 || file.indexOf('text.js') > -1) {
31
- return;
32
- } // eslint-disable-next-line global-require, import/no-dynamic-require
33
-
34
-
35
- var fileLoaded = require(_path.default.join(__dirname, file));
36
-
37
- if (!fileLoaded.default) {
38
- return;
39
- }
40
-
41
- var Icon = fileLoaded.default;
42
- var wrapper = shallow(_react.default.createElement(Icon, {
43
- className: "foo"
44
- }));
45
-
46
- _chai.assert.strictEqual(wrapper.hasClass('foo'), true);
47
- });
48
- done();
49
- });
50
- });
51
- });