@fonixtree/magic-design 1.0.2 → 1.0.4

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.
Binary file
@@ -66,7 +66,8 @@ function (_super) {
66
66
 
67
67
  _this.state = {
68
68
  visible: false,
69
- imageWay: 'upload'
69
+ imageWay: 'upload',
70
+ inputVal: ''
70
71
  };
71
72
 
72
73
  _this.onChange = function (v) {
@@ -161,30 +162,34 @@ function (_super) {
161
162
  };
162
163
 
163
164
  _this.getImageUrl = function () {
164
- var _a = _this.props,
165
- _onChange = _a.onChange,
166
- value = _a.value;
165
+ var onChange = _this.props.onChange;
166
+ var inputVal = _this.state.inputVal;
167
167
  return /*#__PURE__*/_react["default"].createElement(_.Field, {
168
168
  title: (0, _locale.i18n)('IMAGE_URL')
169
169
  }, /*#__PURE__*/_react["default"].createElement("div", {
170
170
  className: "input-url"
171
171
  }, /*#__PURE__*/_react["default"].createElement("input", {
172
+ onBlur: function onBlur() {
173
+ onChange({
174
+ url: inputVal
175
+ });
176
+ },
172
177
  onChange: function onChange(e) {
173
- _onChange({
174
- url: e.target.value
178
+ _this.setState({
179
+ inputVal: e.target.value
175
180
  });
176
181
 
177
182
  console.log('---d', e.target.value);
178
183
  },
179
184
  placeholder: (0, _locale.i18n)('PLEASE_ADD_A_LINK'),
180
185
  type: "text",
181
- value: value
186
+ value: inputVal
182
187
  }), /*#__PURE__*/_react["default"].createElement("div", {
183
188
  className: "icon-btns"
184
189
  }, /*#__PURE__*/_react["default"].createElement(_Iconfont["default"], {
185
190
  color: "#FF4141",
186
191
  onClick: function onClick() {
187
- return _onChange({
192
+ return onChange({
188
193
  url: ''
189
194
  });
190
195
  },
@@ -196,6 +201,20 @@ function (_super) {
196
201
  return _this;
197
202
  }
198
203
 
204
+ ImagePicker.prototype.componentDidMount = function () {
205
+ this.setState({
206
+ inputVal: this.props.value
207
+ });
208
+ };
209
+
210
+ ImagePicker.prototype.componentWillReceiveProps = function (nextProps) {
211
+ if (nextProps.value != this.props.value) {
212
+ this.setState({
213
+ inputVal: nextProps.value
214
+ });
215
+ }
216
+ };
217
+
199
218
  ImagePicker.prototype.render = function () {
200
219
  var _this = this;
201
220
 
@@ -176,13 +176,14 @@ function (_super) {
176
176
  textAlign: item.customize.align
177
177
  };
178
178
 
179
- if (item.customize.vertical === 'top') {
180
- styleObj.top = 30;
181
- } else if (item.customize.vertical === 'bottom') {
179
+ if (item.customize.vertical === 'bottom') {
182
180
  styleObj.bottom = 30;
183
181
  } else if (item.customize.vertical === 'center') {
184
182
  styleObj.top = '50%';
185
183
  styleObj.transform = 'translateY(-50%)';
184
+ } else {
185
+ // item.customize.vertical === 'top'
186
+ styleObj.top = 30;
186
187
  }
187
188
 
188
189
  return styleObj;
@@ -218,7 +218,7 @@ function (_super) {
218
218
  /*break*/
219
219
  , 3];
220
220
  data.content.pcImgSrc = v.url;
221
- data.content.pcName = v.contentTitle;
221
+ data.content.pcName = v.contentTitle || '';
222
222
  if (!data.content.pcImgSrc) return [3
223
223
  /*break*/
224
224
  , 2];
@@ -0,0 +1,4 @@
1
+ .m-button-config {
2
+ padding: 0 12px;
3
+ background-color: #F5F6F7;
4
+ }
@@ -459,7 +459,7 @@ var getColorRgba = function getColorRgba(sHex, alpha) {
459
459
  exports.getColorRgba = getColorRgba;
460
460
 
461
461
  function asyncDataURLtoImage(dataUrl) {
462
- return new Promise(function (resolve, reject) {
462
+ return new Promise(function (resolve) {
463
463
  var img = new Image();
464
464
 
465
465
  img.onload = function () {
@@ -467,7 +467,8 @@ function asyncDataURLtoImage(dataUrl) {
467
467
  };
468
468
 
469
469
  img.onerror = function () {
470
- reject(new Error('img error'));
470
+ console.error(dataUrl + ' img error');
471
+ resolve({});
471
472
  };
472
473
 
473
474
  img.src = dataUrl;
Binary file
@@ -66,7 +66,8 @@ function (_super) {
66
66
 
67
67
  _this.state = {
68
68
  visible: false,
69
- imageWay: 'upload'
69
+ imageWay: 'upload',
70
+ inputVal: ''
70
71
  };
71
72
 
72
73
  _this.onChange = function (v) {
@@ -161,30 +162,34 @@ function (_super) {
161
162
  };
162
163
 
163
164
  _this.getImageUrl = function () {
164
- var _a = _this.props,
165
- _onChange = _a.onChange,
166
- value = _a.value;
165
+ var onChange = _this.props.onChange;
166
+ var inputVal = _this.state.inputVal;
167
167
  return /*#__PURE__*/_react["default"].createElement(_.Field, {
168
168
  title: (0, _locale.i18n)('IMAGE_URL')
169
169
  }, /*#__PURE__*/_react["default"].createElement("div", {
170
170
  className: "input-url"
171
171
  }, /*#__PURE__*/_react["default"].createElement("input", {
172
+ onBlur: function onBlur() {
173
+ onChange({
174
+ url: inputVal
175
+ });
176
+ },
172
177
  onChange: function onChange(e) {
173
- _onChange({
174
- url: e.target.value
178
+ _this.setState({
179
+ inputVal: e.target.value
175
180
  });
176
181
 
177
182
  console.log('---d', e.target.value);
178
183
  },
179
184
  placeholder: (0, _locale.i18n)('PLEASE_ADD_A_LINK'),
180
185
  type: "text",
181
- value: value
186
+ value: inputVal
182
187
  }), /*#__PURE__*/_react["default"].createElement("div", {
183
188
  className: "icon-btns"
184
189
  }, /*#__PURE__*/_react["default"].createElement(_Iconfont["default"], {
185
190
  color: "#FF4141",
186
191
  onClick: function onClick() {
187
- return _onChange({
192
+ return onChange({
188
193
  url: ''
189
194
  });
190
195
  },
@@ -196,6 +201,20 @@ function (_super) {
196
201
  return _this;
197
202
  }
198
203
 
204
+ ImagePicker.prototype.componentDidMount = function () {
205
+ this.setState({
206
+ inputVal: this.props.value
207
+ });
208
+ };
209
+
210
+ ImagePicker.prototype.componentWillReceiveProps = function (nextProps) {
211
+ if (nextProps.value != this.props.value) {
212
+ this.setState({
213
+ inputVal: nextProps.value
214
+ });
215
+ }
216
+ };
217
+
199
218
  ImagePicker.prototype.render = function () {
200
219
  var _this = this;
201
220
 
@@ -176,13 +176,14 @@ function (_super) {
176
176
  textAlign: item.customize.align
177
177
  };
178
178
 
179
- if (item.customize.vertical === 'top') {
180
- styleObj.top = 30;
181
- } else if (item.customize.vertical === 'bottom') {
179
+ if (item.customize.vertical === 'bottom') {
182
180
  styleObj.bottom = 30;
183
181
  } else if (item.customize.vertical === 'center') {
184
182
  styleObj.top = '50%';
185
183
  styleObj.transform = 'translateY(-50%)';
184
+ } else {
185
+ // item.customize.vertical === 'top'
186
+ styleObj.top = 30;
186
187
  }
187
188
 
188
189
  return styleObj;
@@ -218,7 +218,7 @@ function (_super) {
218
218
  /*break*/
219
219
  , 3];
220
220
  data.content.pcImgSrc = v.url;
221
- data.content.pcName = v.contentTitle;
221
+ data.content.pcName = v.contentTitle || '';
222
222
  if (!data.content.pcImgSrc) return [3
223
223
  /*break*/
224
224
  , 2];
@@ -0,0 +1,4 @@
1
+ .m-button-config {
2
+ padding: 0 12px;
3
+ background-color: #F5F6F7;
4
+ }
@@ -459,7 +459,7 @@ var getColorRgba = function getColorRgba(sHex, alpha) {
459
459
  exports.getColorRgba = getColorRgba;
460
460
 
461
461
  function asyncDataURLtoImage(dataUrl) {
462
- return new Promise(function (resolve, reject) {
462
+ return new Promise(function (resolve) {
463
463
  var img = new Image();
464
464
 
465
465
  img.onload = function () {
@@ -467,7 +467,8 @@ function asyncDataURLtoImage(dataUrl) {
467
467
  };
468
468
 
469
469
  img.onerror = function () {
470
- reject(new Error('img error'));
470
+ console.error(dataUrl + ' img error');
471
+ resolve({});
471
472
  };
472
473
 
473
474
  img.src = dataUrl;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@fonixtree/magic-design",
3
3
  "author": "Cylon Team",
4
- "version": "1.0.2",
4
+ "version": "1.0.4",
5
5
  "description": "Magic Design",
6
6
  "license": "MIT",
7
7
  "module": "es/index.js",