versacall-dashboards-library-react 2.0.2 → 2.0.3

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.
Files changed (3) hide show
  1. package/dist/components/DashboardsRatio/DashboardsRatio.js +178 -101
  2. package/dist/components/DashboardsRatio/DashboardsRatioOld.js +211 -0
  3. package/package.json +2 -2
package/dist/components/DashboardsRatio/DashboardsRatio.js CHANGED
@@ -5,14 +5,10 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.default = void 0;
7
7
 
8
- var _react = _interopRequireDefault(require("react"));
9
-
10
- var _FormControlLabel = _interopRequireDefault(require("@material-ui/core/FormControlLabel"));
8
+ var _react = _interopRequireWildcard(require("react"));
11
9
 
12
10
  var _TextField = _interopRequireDefault(require("@material-ui/core/TextField"));
13
11
 
14
- var _Switch = _interopRequireDefault(require("@material-ui/core/Switch"));
15
-
16
12
  var _Grid = _interopRequireDefault(require("@material-ui/core/Grid"));
17
13
 
18
14
  var _reactIntl = require("react-intl");
@@ -21,130 +17,172 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
21
17
 
22
18
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
23
19
 
20
+ function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
21
+
22
+ function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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; }
23
+
24
24
  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; }
25
25
 
26
26
  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; }
27
27
 
28
28
  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; }
29
29
 
30
- function DashboardsRatio(props) {
31
- var intl = props.intl,
32
- value = props.value;
33
- var custom;
30
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
31
+
32
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
33
+
34
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
35
+
36
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
37
+
38
+ function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
39
+
40
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
34
41
 
35
- switch ("".concat(value.width, ":").concat(value.height)) {
42
+ // const aspectRatios = ['stetch', '16:9', '4:3', '1:1', 'custom'];
43
+ function determineIfCustom(ratio) {
44
+ if (ratio.stretch) {
45
+ return false;
46
+ }
47
+
48
+ switch ("".concat(ratio.width, ":").concat(ratio.height)) {
36
49
  case '16:9':
37
50
  case '4:3':
38
51
  case '1:1':
39
- custom = false;
40
- break;
52
+ return false;
41
53
 
42
54
  default:
43
- custom = true;
55
+ return true;
44
56
  }
57
+ }
45
58
 
46
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Grid.default, {
47
- xs: 3,
59
+ function DashboardsRatio(props) {
60
+ var intl = props.intl,
61
+ ratio = props.ratio;
62
+
63
+ var _useState = (0, _react.useState)(determineIfCustom(ratio)),
64
+ _useState2 = _slicedToArray(_useState, 2),
65
+ showCustom = _useState2[0],
66
+ setShowCustom = _useState2[1];
67
+
68
+ var showAlignment = !ratio.stretch;
69
+
70
+ function determineAspectRatio() {
71
+ if (ratio.stretch) {
72
+ return 'stretch';
73
+ }
74
+
75
+ switch ("".concat(ratio.width, ":").concat(ratio.height)) {
76
+ case '16:9':
77
+ return '16:9';
78
+
79
+ case '4:3':
80
+ return '4:3';
81
+
82
+ case '1:1':
83
+ return '1:1';
84
+
85
+ default:
86
+ return 'custom';
87
+ }
88
+ }
89
+
90
+ function handleAspectRatioChange(val) {
91
+ var newRatio = _objectSpread({}, ratio);
92
+
93
+ var sCustom = false;
94
+
95
+ if (val === 'stretch') {
96
+ newRatio.stretch = true;
97
+ } else {
98
+ newRatio.stretch = false;
99
+ }
100
+
101
+ switch (val) {
102
+ case 'stretch':
103
+ break;
104
+
105
+ case '16:9':
106
+ newRatio.width = 16;
107
+ newRatio.height = 9;
108
+ break;
109
+
110
+ case '4:3':
111
+ newRatio.width = 4;
112
+ newRatio.height = 3;
113
+ break;
114
+
115
+ case '1:1':
116
+ newRatio.width = 1;
117
+ newRatio.height = 1;
118
+ break;
119
+
120
+ default:
121
+ newRatio.width = 2;
122
+ newRatio.height = 1;
123
+ sCustom = true;
124
+ break;
125
+ }
126
+
127
+ setShowCustom(sCustom);
128
+ props.updateRatio(newRatio);
129
+ }
130
+
131
+ return /*#__PURE__*/_react.default.createElement(_Grid.default, {
132
+ container: true
133
+ }, /*#__PURE__*/_react.default.createElement(_Grid.default, {
134
+ item: true,
135
+ xs: 2,
48
136
  style: {
49
- textAlign: 'center'
50
- },
51
- item: true
52
- }, /*#__PURE__*/_react.default.createElement(_FormControlLabel.default, {
53
- labelPlacement: "bottom",
54
- label: intl.formatMessage({
55
- id: '__stretch'
56
- }),
57
- control: /*#__PURE__*/_react.default.createElement(_Switch.default, {
58
- checked: value.stretch,
59
- onChange: event => props.updateValue({
60
- ratio: _objectSpread(_objectSpread({}, value), {}, {
61
- stretch: event.target.checked
62
- })
63
- })
64
- })
65
- })), !value.stretch && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Grid.default, {
66
- xs: 3,
67
- item: true
137
+ paddingRight: 5
138
+ }
68
139
  }, /*#__PURE__*/_react.default.createElement(_TextField.default, {
69
140
  margin: "normal",
70
141
  variant: "outlined",
71
142
  SelectProps: {
72
143
  native: true
73
144
  },
74
- value: "".concat(value.width, ":").concat(value.height),
145
+ value: determineAspectRatio(),
75
146
  label: intl.formatMessage({
76
147
  id: '__aspect_ratio'
77
148
  }),
78
- onChange: event => props.updateValue({
79
- ratio: _objectSpread(_objectSpread({}, value), {}, {
80
- width: Number(event.target.value.split(':')[0]),
81
- height: Number(event.target.value.split(':')[1])
82
- })
83
- }),
149
+ onChange: event => handleAspectRatioChange(event.target.value),
84
150
  fullWidth: true,
85
151
  select: true
86
152
  }, /*#__PURE__*/_react.default.createElement("option", {
153
+ value: "stretch"
154
+ }, intl.formatMessage({
155
+ id: '__stretch'
156
+ })), /*#__PURE__*/_react.default.createElement("option", {
87
157
  value: "16:9"
88
158
  }, "16:9"), /*#__PURE__*/_react.default.createElement("option", {
89
159
  value: "4:3"
90
160
  }, "4:3"), /*#__PURE__*/_react.default.createElement("option", {
91
161
  value: "1:1"
92
- }, "1:1"), custom && /*#__PURE__*/_react.default.createElement("option", {
93
- value: "".concat(value.width, ":").concat(value.height)
94
- }, "".concat(intl.formatMessage({
162
+ }, "1:1"), /*#__PURE__*/_react.default.createElement("option", {
163
+ value: "custom"
164
+ }, intl.formatMessage({
95
165
  id: '__custom'
96
- }), ": ").concat(value.width, ":").concat(value.height)))), /*#__PURE__*/_react.default.createElement(_Grid.default, {
166
+ })))), /*#__PURE__*/_react.default.createElement(_Grid.default, {
167
+ item: true,
97
168
  xs: 3,
98
- item: true
99
- }, /*#__PURE__*/_react.default.createElement(_TextField.default, {
100
- type: "number",
101
- margin: "normal",
102
- variant: "outlined",
103
- value: value.width,
104
- label: intl.formatMessage({
105
- id: '__width'
106
- }),
107
- onChange: event => props.updateValue({
108
- ratio: _objectSpread(_objectSpread({}, value), {}, {
109
- width: Number(event.target.value)
110
- })
111
- }),
112
- fullWidth: true
113
- })), /*#__PURE__*/_react.default.createElement(_Grid.default, {
114
- xs: 3,
115
- item: true
116
- }, /*#__PURE__*/_react.default.createElement(_TextField.default, {
117
- type: "number",
118
- margin: "normal",
119
- variant: "outlined",
120
- value: value.height,
121
- label: intl.formatMessage({
122
- id: '__height'
123
- }),
124
- onChange: event => props.updateValue({
125
- ratio: _objectSpread(_objectSpread({}, value), {}, {
126
- height: Number(event.target.value)
127
- })
128
- }),
129
- fullWidth: true
130
- }))), !value.stretch && /*#__PURE__*/_react.default.createElement(_Grid.default, {
131
- xs: 6,
132
- item: true
133
- }, /*#__PURE__*/_react.default.createElement(_TextField.default, {
169
+ style: {
170
+ paddingLeft: 5,
171
+ paddingRight: 5
172
+ }
173
+ }, showAlignment && /*#__PURE__*/_react.default.createElement(_TextField.default, {
134
174
  margin: "normal",
135
175
  variant: "outlined",
136
176
  SelectProps: {
137
177
  native: true
138
178
  },
139
- value: value.verticalAlignment,
179
+ value: ratio.verticalAlignment,
140
180
  label: intl.formatMessage({
141
181
  id: '__vertical_alignment'
142
182
  }),
143
- onChange: event => props.updateValue({
144
- ratio: _objectSpread(_objectSpread({}, value), {}, {
145
- verticalAlignment: event.target.value
146
- })
147
- }),
183
+ onChange: event => props.updateRatio(_objectSpread(_objectSpread({}, ratio), {}, {
184
+ verticalAlignment: event.target.value
185
+ })),
148
186
  fullWidth: true,
149
187
  select: true
150
188
  }, /*#__PURE__*/_react.default.createElement("option", {
@@ -159,24 +197,26 @@ function DashboardsRatio(props) {
159
197
  value: "flex-end"
160
198
  }, intl.formatMessage({
161
199
  id: '__bottom'
162
- })))), !value.stretch && /*#__PURE__*/_react.default.createElement(_Grid.default, {
163
- xs: 6,
164
- item: true
165
- }, /*#__PURE__*/_react.default.createElement(_TextField.default, {
200
+ })))), /*#__PURE__*/_react.default.createElement(_Grid.default, {
201
+ item: true,
202
+ xs: 3,
203
+ style: {
204
+ paddingLeft: 5,
205
+ paddingRight: 5
206
+ }
207
+ }, showAlignment && /*#__PURE__*/_react.default.createElement(_TextField.default, {
166
208
  margin: "normal",
167
209
  variant: "outlined",
168
210
  SelectProps: {
169
211
  native: true
170
212
  },
171
- value: value.horizontalAlignment,
213
+ value: ratio.horizontalAlignment,
172
214
  label: intl.formatMessage({
173
215
  id: '__horizontal_alignment'
174
216
  }),
175
- onChange: event => props.updateValue({
176
- ratio: _objectSpread(_objectSpread({}, value), {}, {
177
- horizontalAlignment: event.target.value
178
- })
179
- }),
217
+ onChange: event => props.updateRatio(_objectSpread(_objectSpread({}, ratio), {}, {
218
+ horizontalAlignment: event.target.value
219
+ })),
180
220
  fullWidth: true,
181
221
  select: true
182
222
  }, /*#__PURE__*/_react.default.createElement("option", {
@@ -191,19 +231,56 @@ function DashboardsRatio(props) {
191
231
  value: "flex-end"
192
232
  }, intl.formatMessage({
193
233
  id: '__right'
194
- })))));
234
+ })))), /*#__PURE__*/_react.default.createElement(_Grid.default, {
235
+ item: true,
236
+ xs: 2,
237
+ style: {
238
+ paddingLeft: 5,
239
+ paddingRight: 5
240
+ }
241
+ }, showCustom && /*#__PURE__*/_react.default.createElement(_TextField.default, {
242
+ type: "number",
243
+ margin: "normal",
244
+ variant: "outlined",
245
+ value: ratio.width,
246
+ label: intl.formatMessage({
247
+ id: '__width'
248
+ }),
249
+ onChange: event => props.updateRatio(_objectSpread(_objectSpread({}, ratio), {}, {
250
+ width: Number(event.target.value)
251
+ })),
252
+ fullWidth: true
253
+ })), /*#__PURE__*/_react.default.createElement(_Grid.default, {
254
+ item: true,
255
+ xs: 2,
256
+ style: {
257
+ paddingLeft: 5
258
+ }
259
+ }, showCustom && /*#__PURE__*/_react.default.createElement(_TextField.default, {
260
+ type: "number",
261
+ margin: "normal",
262
+ variant: "outlined",
263
+ value: ratio.height,
264
+ label: intl.formatMessage({
265
+ id: '__height'
266
+ }),
267
+ onChange: event => props.updateRatio(_objectSpread(_objectSpread({}, ratio), {}, {
268
+ height: Number(event.target.value)
269
+ })),
270
+ fullWidth: true
271
+ })));
195
272
  }
196
273
 
197
274
  DashboardsRatio.propTypes = {
198
- value: _propTypes.default.shape({
275
+ intl: _propTypes.default.shape().isRequired,
276
+ ratio: _propTypes.default.shape({
199
277
  height: _propTypes.default.number,
200
278
  width: _propTypes.default.number,
201
279
  stretch: _propTypes.default.bool,
202
280
  verticalAlignment: _propTypes.default.string,
203
281
  horizontalAlignment: _propTypes.default.string
204
282
  }).isRequired,
205
- updateValue: _propTypes.default.func.isRequired,
206
- intl: _propTypes.default.shape().isRequired
283
+ updateRatio: _propTypes.default.func.isRequired
207
284
  };
208
285
 
209
286
  var _default = (0, _reactIntl.injectIntl)(DashboardsRatio);
package/dist/components/DashboardsRatio/DashboardsRatioOld.js ADDED
@@ -0,0 +1,211 @@
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 _FormControlLabel = _interopRequireDefault(require("@material-ui/core/FormControlLabel"));
11
+
12
+ var _TextField = _interopRequireDefault(require("@material-ui/core/TextField"));
13
+
14
+ var _Switch = _interopRequireDefault(require("@material-ui/core/Switch"));
15
+
16
+ var _Grid = _interopRequireDefault(require("@material-ui/core/Grid"));
17
+
18
+ var _reactIntl = require("react-intl");
19
+
20
+ var _propTypes = _interopRequireDefault(require("prop-types"));
21
+
22
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
23
+
24
+ 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; }
25
+
26
+ 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; }
27
+
28
+ 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; }
29
+
30
+ function DashboardsRatio(props) {
31
+ var intl = props.intl,
32
+ value = props.value;
33
+ var custom;
34
+
35
+ switch ("".concat(value.width, ":").concat(value.height)) {
36
+ case '16:9':
37
+ case '4:3':
38
+ case '1:1':
39
+ custom = false;
40
+ break;
41
+
42
+ default:
43
+ custom = true;
44
+ }
45
+
46
+ return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Grid.default, {
47
+ xs: 3,
48
+ style: {
49
+ textAlign: 'center'
50
+ },
51
+ item: true
52
+ }, /*#__PURE__*/_react.default.createElement(_FormControlLabel.default, {
53
+ labelPlacement: "bottom",
54
+ label: intl.formatMessage({
55
+ id: '__stretch'
56
+ }),
57
+ control: /*#__PURE__*/_react.default.createElement(_Switch.default, {
58
+ checked: value.stretch,
59
+ onChange: event => props.updateValue({
60
+ ratio: _objectSpread(_objectSpread({}, value), {}, {
61
+ stretch: event.target.checked
62
+ })
63
+ })
64
+ })
65
+ })), !value.stretch && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Grid.default, {
66
+ xs: 3,
67
+ item: true
68
+ }, /*#__PURE__*/_react.default.createElement(_TextField.default, {
69
+ margin: "normal",
70
+ variant: "outlined",
71
+ SelectProps: {
72
+ native: true
73
+ },
74
+ value: "".concat(value.width, ":").concat(value.height),
75
+ label: intl.formatMessage({
76
+ id: '__aspect_ratio'
77
+ }),
78
+ onChange: event => props.updateValue({
79
+ ratio: _objectSpread(_objectSpread({}, value), {}, {
80
+ width: Number(event.target.value.split(':')[0]),
81
+ height: Number(event.target.value.split(':')[1])
82
+ })
83
+ }),
84
+ fullWidth: true,
85
+ select: true
86
+ }, /*#__PURE__*/_react.default.createElement("option", {
87
+ value: "16:9"
88
+ }, "16:9"), /*#__PURE__*/_react.default.createElement("option", {
89
+ value: "4:3"
90
+ }, "4:3"), /*#__PURE__*/_react.default.createElement("option", {
91
+ value: "1:1"
92
+ }, "1:1"), custom && /*#__PURE__*/_react.default.createElement("option", {
93
+ value: "".concat(value.width, ":").concat(value.height)
94
+ }, "".concat(intl.formatMessage({
95
+ id: '__custom'
96
+ }), ": ").concat(value.width, ":").concat(value.height)))), /*#__PURE__*/_react.default.createElement(_Grid.default, {
97
+ xs: 3,
98
+ item: true
99
+ }, /*#__PURE__*/_react.default.createElement(_TextField.default, {
100
+ type: "number",
101
+ margin: "normal",
102
+ variant: "outlined",
103
+ value: value.width,
104
+ label: intl.formatMessage({
105
+ id: '__width'
106
+ }),
107
+ onChange: event => props.updateValue({
108
+ ratio: _objectSpread(_objectSpread({}, value), {}, {
109
+ width: Number(event.target.value)
110
+ })
111
+ }),
112
+ fullWidth: true
113
+ })), /*#__PURE__*/_react.default.createElement(_Grid.default, {
114
+ xs: 3,
115
+ item: true
116
+ }, /*#__PURE__*/_react.default.createElement(_TextField.default, {
117
+ type: "number",
118
+ margin: "normal",
119
+ variant: "outlined",
120
+ value: value.height,
121
+ label: intl.formatMessage({
122
+ id: '__height'
123
+ }),
124
+ onChange: event => props.updateValue({
125
+ ratio: _objectSpread(_objectSpread({}, value), {}, {
126
+ height: Number(event.target.value)
127
+ })
128
+ }),
129
+ fullWidth: true
130
+ }))), !value.stretch && /*#__PURE__*/_react.default.createElement(_Grid.default, {
131
+ xs: 6,
132
+ item: true
133
+ }, /*#__PURE__*/_react.default.createElement(_TextField.default, {
134
+ margin: "normal",
135
+ variant: "outlined",
136
+ SelectProps: {
137
+ native: true
138
+ },
139
+ value: value.verticalAlignment,
140
+ label: intl.formatMessage({
141
+ id: '__vertical_alignment'
142
+ }),
143
+ onChange: event => props.updateValue({
144
+ ratio: _objectSpread(_objectSpread({}, value), {}, {
145
+ verticalAlignment: event.target.value
146
+ })
147
+ }),
148
+ fullWidth: true,
149
+ select: true
150
+ }, /*#__PURE__*/_react.default.createElement("option", {
151
+ value: "flex-start"
152
+ }, intl.formatMessage({
153
+ id: '__top'
154
+ })), /*#__PURE__*/_react.default.createElement("option", {
155
+ value: "center"
156
+ }, intl.formatMessage({
157
+ id: '__center'
158
+ })), /*#__PURE__*/_react.default.createElement("option", {
159
+ value: "flex-end"
160
+ }, intl.formatMessage({
161
+ id: '__bottom'
162
+ })))), !value.stretch && /*#__PURE__*/_react.default.createElement(_Grid.default, {
163
+ xs: 6,
164
+ item: true
165
+ }, /*#__PURE__*/_react.default.createElement(_TextField.default, {
166
+ margin: "normal",
167
+ variant: "outlined",
168
+ SelectProps: {
169
+ native: true
170
+ },
171
+ value: value.horizontalAlignment,
172
+ label: intl.formatMessage({
173
+ id: '__horizontal_alignment'
174
+ }),
175
+ onChange: event => props.updateValue({
176
+ ratio: _objectSpread(_objectSpread({}, value), {}, {
177
+ horizontalAlignment: event.target.value
178
+ })
179
+ }),
180
+ fullWidth: true,
181
+ select: true
182
+ }, /*#__PURE__*/_react.default.createElement("option", {
183
+ value: "flex-start"
184
+ }, intl.formatMessage({
185
+ id: '__left'
186
+ })), /*#__PURE__*/_react.default.createElement("option", {
187
+ value: "center"
188
+ }, intl.formatMessage({
189
+ id: '__middle'
190
+ })), /*#__PURE__*/_react.default.createElement("option", {
191
+ value: "flex-end"
192
+ }, intl.formatMessage({
193
+ id: '__right'
194
+ })))));
195
+ }
196
+
197
+ DashboardsRatio.propTypes = {
198
+ value: _propTypes.default.shape({
199
+ height: _propTypes.default.number,
200
+ width: _propTypes.default.number,
201
+ stretch: _propTypes.default.bool,
202
+ verticalAlignment: _propTypes.default.string,
203
+ horizontalAlignment: _propTypes.default.string
204
+ }).isRequired,
205
+ updateValue: _propTypes.default.func.isRequired,
206
+ intl: _propTypes.default.shape().isRequired
207
+ };
208
+
209
+ var _default = (0, _reactIntl.injectIntl)(DashboardsRatio);
210
+
211
+ exports.default = _default;
package/package.json CHANGED
@@ -2,10 +2,10 @@
2
2
  "versacall": {
3
3
  "title": "Versacall Dashboards Library React",
4
4
  "applicationType": "react-library",
5
- "build": 2
5
+ "build": 3
6
6
  },
7
7
  "name": "versacall-dashboards-library-react",
8
- "version": "2.0.2",
8
+ "version": "2.0.3",
9
9
  "description": "Versacall Dashboards Library",
10
10
  "main": "dist/index.js",
11
11
  "module": "dist/index.js",