@fonixtree/magic-design 2.0.212 → 2.0.214

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.
@@ -191,7 +191,7 @@ function (_super) {
191
191
  }, /*#__PURE__*/_react["default"].createElement(_common.Iconfont, {
192
192
  className: "icon",
193
193
  color: "#fff",
194
- size: 18,
194
+ size: 14,
195
195
  type: "icon-a-EssentionalUI"
196
196
  }), /*#__PURE__*/_react["default"].createElement("span", null, (0, _locale.i18n)('GIFT'))), // panelProps.label?.open && data.discountPercent && !isGift && (
197
197
  this.isSpecialPrice() && !isGift && _discountPercent && /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
@@ -22,27 +22,24 @@
22
22
  }
23
23
 
24
24
  .discount-tag {
25
- // font-size: 12px;
26
- // font-weight: 700;
27
- // color: #fff;
28
- // background-color: #ff8650;
29
- // padding: 5px;
30
- // border-radius: 0 5px 5px 0;
31
- position: absolute;
32
- top: 15px;
33
- left: 0;
34
- }
35
-
36
- .giftL-tag {
37
25
  font-size: 12px;
38
26
  font-weight: 700;
39
27
  color: #fff;
40
- background-color: #FA7373;
41
- padding: 5px;
28
+ background-color: #ff8650;
29
+ height: 28px;
30
+ padding: 0;
42
31
  border-radius: 0 5px 5px 0;
43
32
  display: flex;
44
33
  align-items: center;
34
+ position: absolute;
35
+ top: 15px;
36
+ left: 0;
37
+ }
45
38
 
39
+ .giftL-tag {
40
+ padding: 0 5px;
41
+ background-color: #FA7373;
42
+ font-size: 11px;
46
43
  .icon {
47
44
  margin-right: 4px;
48
45
  }
@@ -76,8 +76,8 @@ var getDefaultJSON = function getDefaultJSON() {
76
76
  mobile: '#fff'
77
77
  },
78
78
  backgroundColor: {
79
- pc: 'transparent',
80
- mobile: 'transparent'
79
+ pc: 'unset',
80
+ mobile: 'unset'
81
81
  },
82
82
  iconColor: {
83
83
  pc: '#fff',
@@ -86,11 +86,38 @@ function (_super) {
86
86
  var _this = _super !== null && _super.apply(this, arguments) || this;
87
87
 
88
88
  _this.state = {
89
- carouseIndex: 0
89
+ carouseIndex: 0,
90
+ value: ''
90
91
  };
91
92
  _this.carouselRef = /*#__PURE__*/_react["default"].createRef();
92
93
  _this.destroy = null;
93
94
 
95
+ _this.onFocus = function () {
96
+ var _a;
97
+
98
+ var value = _this.state.value;
99
+
100
+ if (value === ((_a = _this.props.data.content.keyword) === null || _a === void 0 ? void 0 : _a.placeholder)) {
101
+ _this.setState({
102
+ value: '',
103
+ editing: true
104
+ });
105
+ }
106
+ };
107
+
108
+ _this.onBlur = function () {
109
+ var _a, _b, _c, _d, _e, _f;
110
+
111
+ var value = _this.state.value;
112
+
113
+ if (((_c = (_b = (_a = _this.props.data) === null || _a === void 0 ? void 0 : _a.content) === null || _b === void 0 ? void 0 : _b.keyword) === null || _c === void 0 ? void 0 : _c.open) && !value) {
114
+ _this.setState({
115
+ value: (_f = (_e = (_d = _this.props.data) === null || _d === void 0 ? void 0 : _d.content) === null || _e === void 0 ? void 0 : _e.keyword) === null || _f === void 0 ? void 0 : _f.placeholder,
116
+ editing: false
117
+ });
118
+ }
119
+ };
120
+
94
121
  _this.bannerGoto = function (groupSource) {
95
122
  var nextIndex = groupSource.findIndex(function (item) {
96
123
  return item.id === _mobx.store.clickedGroup;
@@ -125,13 +152,35 @@ function (_super) {
125
152
  SearchBannerMobile.prototype.componentDidMount = function () {
126
153
  var _this = this;
127
154
 
155
+ var _a, _b, _c, _d, _e, _f;
156
+
128
157
  this.destroy = (0, _mobx.autorun)(function () {
129
158
  _this.bannerGoto(_this.props.data.groupSource);
130
159
  });
160
+
161
+ if ((_c = (_b = (_a = this.props.data) === null || _a === void 0 ? void 0 : _a.content) === null || _b === void 0 ? void 0 : _b.keyword) === null || _c === void 0 ? void 0 : _c.open) {
162
+ this.setState({
163
+ value: (_f = (_e = (_d = this.props.data) === null || _d === void 0 ? void 0 : _d.content) === null || _e === void 0 ? void 0 : _e.keyword) === null || _f === void 0 ? void 0 : _f.placeholder
164
+ });
165
+ }
131
166
  };
132
167
 
133
168
  SearchBannerMobile.prototype.componentWillReceiveProps = function (nextProps) {
169
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j;
170
+
134
171
  this.bannerGoto(nextProps.data.groupSource);
172
+
173
+ if (((_c = (_b = (_a = nextProps.data) === null || _a === void 0 ? void 0 : _a.content) === null || _b === void 0 ? void 0 : _b.keyword) === null || _c === void 0 ? void 0 : _c.open) && !this.state.editing) {
174
+ this.setState({
175
+ value: (_f = (_e = (_d = nextProps.data) === null || _d === void 0 ? void 0 : _d.content) === null || _e === void 0 ? void 0 : _e.keyword) === null || _f === void 0 ? void 0 : _f.placeholder
176
+ });
177
+ }
178
+
179
+ if (!((_j = (_h = (_g = nextProps.data) === null || _g === void 0 ? void 0 : _g.content) === null || _h === void 0 ? void 0 : _h.keyword) === null || _j === void 0 ? void 0 : _j.open)) {
180
+ this.setState({
181
+ value: ''
182
+ });
183
+ }
135
184
  };
136
185
 
137
186
  SearchBannerMobile.prototype.componentWillUnmount = function () {
@@ -222,7 +222,8 @@ function (_super) {
222
222
  messageNum: '',
223
223
  cartNum: '',
224
224
  editing: false,
225
- points: 0
225
+ points: 0,
226
+ value: ''
226
227
  };
227
228
 
228
229
  _this.getCartNum = function () {
@@ -124,7 +124,7 @@ function (_super) {
124
124
  }, /*#__PURE__*/_react["default"].createElement(_common.Iconfont, {
125
125
  className: "icon",
126
126
  color: "#fff",
127
- size: 18,
127
+ size: 14,
128
128
  type: "icon-a-EssentionalUI"
129
129
  }), /*#__PURE__*/_react["default"].createElement("span", null, (0, _locale.i18n)('GIFT'))), /*#__PURE__*/_react["default"].createElement(_WatermarkLabel["default"], {
130
130
  show: data.targetCustomer === 'A'
@@ -22,21 +22,18 @@
22
22
  font-weight: 700;
23
23
  color: #fff;
24
24
  background-color: #ff8650;
25
- padding: 0.1rem;
25
+ height: 0.56rem;
26
+ padding: 0 0.1rem;
26
27
  border-radius: 0 0.1rem 0.1rem 0;
28
+ display: flex;
29
+ align-items: center;
27
30
  position: absolute;
28
31
  top: 0.3rem;
29
32
  left: 0;
30
33
  }
31
34
  .monpay-interest-product-item-wrap .img-wrap .giftL-tag {
32
- font-size: 0.24rem;
33
- font-weight: 700;
34
- color: #fff;
35
35
  background-color: #FA7373;
36
- padding: 0.1rem;
37
- border-radius: 0 0.1rem 0.1rem 0;
38
- display: flex;
39
- align-items: center;
36
+ font-size: 0.22rem;
40
37
  }
41
38
  .monpay-interest-product-item-wrap .img-wrap .giftL-tag .icon {
42
39
  margin-right: 0.08rem;
@@ -52,11 +52,14 @@ function (_super) {
52
52
  _this.onLabelAdd = function (label) {
53
53
  var startOffset = (window._currentRange || {}).startOffset;
54
54
  var text = _this.props.data.text;
55
+ var html = _this.props.data.html;
55
56
 
56
57
  if (startOffset) {
57
58
  _this.props.data.text = text.slice(0, startOffset) + label + text.slice(startOffset);
59
+ if (html) _this.props.data.html = html.slice(0, startOffset) + label + html.slice(startOffset);
58
60
  } else {
59
61
  _this.props.data.text = text + label;
62
+ if (html) _this.props.data.html = html + label;
60
63
  }
61
64
 
62
65
  (0, _coreUtil.renderPreview)();
@@ -191,7 +191,7 @@ function (_super) {
191
191
  }, /*#__PURE__*/_react["default"].createElement(_common.Iconfont, {
192
192
  className: "icon",
193
193
  color: "#fff",
194
- size: 18,
194
+ size: 14,
195
195
  type: "icon-a-EssentionalUI"
196
196
  }), /*#__PURE__*/_react["default"].createElement("span", null, (0, _locale.i18n)('GIFT'))), // panelProps.label?.open && data.discountPercent && !isGift && (
197
197
  this.isSpecialPrice() && !isGift && _discountPercent && /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
@@ -22,27 +22,24 @@
22
22
  }
23
23
 
24
24
  .discount-tag {
25
- // font-size: 12px;
26
- // font-weight: 700;
27
- // color: #fff;
28
- // background-color: #ff8650;
29
- // padding: 5px;
30
- // border-radius: 0 5px 5px 0;
31
- position: absolute;
32
- top: 15px;
33
- left: 0;
34
- }
35
-
36
- .giftL-tag {
37
25
  font-size: 12px;
38
26
  font-weight: 700;
39
27
  color: #fff;
40
- background-color: #FA7373;
41
- padding: 5px;
28
+ background-color: #ff8650;
29
+ height: 28px;
30
+ padding: 0;
42
31
  border-radius: 0 5px 5px 0;
43
32
  display: flex;
44
33
  align-items: center;
34
+ position: absolute;
35
+ top: 15px;
36
+ left: 0;
37
+ }
45
38
 
39
+ .giftL-tag {
40
+ padding: 0 5px;
41
+ background-color: #FA7373;
42
+ font-size: 11px;
46
43
  .icon {
47
44
  margin-right: 4px;
48
45
  }
@@ -76,8 +76,8 @@ var getDefaultJSON = function getDefaultJSON() {
76
76
  mobile: '#fff'
77
77
  },
78
78
  backgroundColor: {
79
- pc: 'transparent',
80
- mobile: 'transparent'
79
+ pc: 'unset',
80
+ mobile: 'unset'
81
81
  },
82
82
  iconColor: {
83
83
  pc: '#fff',
@@ -86,11 +86,38 @@ function (_super) {
86
86
  var _this = _super !== null && _super.apply(this, arguments) || this;
87
87
 
88
88
  _this.state = {
89
- carouseIndex: 0
89
+ carouseIndex: 0,
90
+ value: ''
90
91
  };
91
92
  _this.carouselRef = /*#__PURE__*/_react["default"].createRef();
92
93
  _this.destroy = null;
93
94
 
95
+ _this.onFocus = function () {
96
+ var _a;
97
+
98
+ var value = _this.state.value;
99
+
100
+ if (value === ((_a = _this.props.data.content.keyword) === null || _a === void 0 ? void 0 : _a.placeholder)) {
101
+ _this.setState({
102
+ value: '',
103
+ editing: true
104
+ });
105
+ }
106
+ };
107
+
108
+ _this.onBlur = function () {
109
+ var _a, _b, _c, _d, _e, _f;
110
+
111
+ var value = _this.state.value;
112
+
113
+ if (((_c = (_b = (_a = _this.props.data) === null || _a === void 0 ? void 0 : _a.content) === null || _b === void 0 ? void 0 : _b.keyword) === null || _c === void 0 ? void 0 : _c.open) && !value) {
114
+ _this.setState({
115
+ value: (_f = (_e = (_d = _this.props.data) === null || _d === void 0 ? void 0 : _d.content) === null || _e === void 0 ? void 0 : _e.keyword) === null || _f === void 0 ? void 0 : _f.placeholder,
116
+ editing: false
117
+ });
118
+ }
119
+ };
120
+
94
121
  _this.bannerGoto = function (groupSource) {
95
122
  var nextIndex = groupSource.findIndex(function (item) {
96
123
  return item.id === _mobx.store.clickedGroup;
@@ -125,13 +152,35 @@ function (_super) {
125
152
  SearchBannerMobile.prototype.componentDidMount = function () {
126
153
  var _this = this;
127
154
 
155
+ var _a, _b, _c, _d, _e, _f;
156
+
128
157
  this.destroy = (0, _mobx.autorun)(function () {
129
158
  _this.bannerGoto(_this.props.data.groupSource);
130
159
  });
160
+
161
+ if ((_c = (_b = (_a = this.props.data) === null || _a === void 0 ? void 0 : _a.content) === null || _b === void 0 ? void 0 : _b.keyword) === null || _c === void 0 ? void 0 : _c.open) {
162
+ this.setState({
163
+ value: (_f = (_e = (_d = this.props.data) === null || _d === void 0 ? void 0 : _d.content) === null || _e === void 0 ? void 0 : _e.keyword) === null || _f === void 0 ? void 0 : _f.placeholder
164
+ });
165
+ }
131
166
  };
132
167
 
133
168
  SearchBannerMobile.prototype.componentWillReceiveProps = function (nextProps) {
169
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j;
170
+
134
171
  this.bannerGoto(nextProps.data.groupSource);
172
+
173
+ if (((_c = (_b = (_a = nextProps.data) === null || _a === void 0 ? void 0 : _a.content) === null || _b === void 0 ? void 0 : _b.keyword) === null || _c === void 0 ? void 0 : _c.open) && !this.state.editing) {
174
+ this.setState({
175
+ value: (_f = (_e = (_d = nextProps.data) === null || _d === void 0 ? void 0 : _d.content) === null || _e === void 0 ? void 0 : _e.keyword) === null || _f === void 0 ? void 0 : _f.placeholder
176
+ });
177
+ }
178
+
179
+ if (!((_j = (_h = (_g = nextProps.data) === null || _g === void 0 ? void 0 : _g.content) === null || _h === void 0 ? void 0 : _h.keyword) === null || _j === void 0 ? void 0 : _j.open)) {
180
+ this.setState({
181
+ value: ''
182
+ });
183
+ }
135
184
  };
136
185
 
137
186
  SearchBannerMobile.prototype.componentWillUnmount = function () {
@@ -222,7 +222,8 @@ function (_super) {
222
222
  messageNum: '',
223
223
  cartNum: '',
224
224
  editing: false,
225
- points: 0
225
+ points: 0,
226
+ value: ''
226
227
  };
227
228
 
228
229
  _this.getCartNum = function () {
@@ -124,7 +124,7 @@ function (_super) {
124
124
  }, /*#__PURE__*/_react["default"].createElement(_common.Iconfont, {
125
125
  className: "icon",
126
126
  color: "#fff",
127
- size: 18,
127
+ size: 14,
128
128
  type: "icon-a-EssentionalUI"
129
129
  }), /*#__PURE__*/_react["default"].createElement("span", null, (0, _locale.i18n)('GIFT'))), /*#__PURE__*/_react["default"].createElement(_WatermarkLabel["default"], {
130
130
  show: data.targetCustomer === 'A'
@@ -22,21 +22,18 @@
22
22
  font-weight: 700;
23
23
  color: #fff;
24
24
  background-color: #ff8650;
25
- padding: 0.1rem;
25
+ height: 0.56rem;
26
+ padding: 0 0.1rem;
26
27
  border-radius: 0 0.1rem 0.1rem 0;
28
+ display: flex;
29
+ align-items: center;
27
30
  position: absolute;
28
31
  top: 0.3rem;
29
32
  left: 0;
30
33
  }
31
34
  .monpay-interest-product-item-wrap .img-wrap .giftL-tag {
32
- font-size: 0.24rem;
33
- font-weight: 700;
34
- color: #fff;
35
35
  background-color: #FA7373;
36
- padding: 0.1rem;
37
- border-radius: 0 0.1rem 0.1rem 0;
38
- display: flex;
39
- align-items: center;
36
+ font-size: 0.22rem;
40
37
  }
41
38
  .monpay-interest-product-item-wrap .img-wrap .giftL-tag .icon {
42
39
  margin-right: 0.08rem;
@@ -52,11 +52,14 @@ function (_super) {
52
52
  _this.onLabelAdd = function (label) {
53
53
  var startOffset = (window._currentRange || {}).startOffset;
54
54
  var text = _this.props.data.text;
55
+ var html = _this.props.data.html;
55
56
 
56
57
  if (startOffset) {
57
58
  _this.props.data.text = text.slice(0, startOffset) + label + text.slice(startOffset);
59
+ if (html) _this.props.data.html = html.slice(0, startOffset) + label + html.slice(startOffset);
58
60
  } else {
59
61
  _this.props.data.text = text + label;
62
+ if (html) _this.props.data.html = html + label;
60
63
  }
61
64
 
62
65
  (0, _coreUtil.renderPreview)();
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@fonixtree/magic-design",
3
3
  "author": "Cylon Team",
4
- "version": "2.0.212",
4
+ "version": "2.0.214",
5
5
  "description": "Magic Design",
6
6
  "license": "MIT",
7
7
  "module": "es/index.js",