wini-web-components 1.3.1 → 1.3.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.
@@ -14,6 +14,7 @@ interface SelectMultipleProps {
14
14
  style?: CSSProperties;
15
15
  handleSearch?: (e: string) => Promise<Array<OptionsItem>>;
16
16
  showClearValueButton?: boolean;
17
+ popupClassName?: string;
17
18
  }
18
19
  interface SelectMultipleState {
19
20
  value: Array<string | number>;
@@ -256,7 +256,7 @@ var SelectMultiple = /** @class */ (function (_super) {
256
256
  };
257
257
  SelectMultiple.prototype.render = function () {
258
258
  var _this = this;
259
- var _a, _b, _c, _d, _e, _f, _g, _h;
259
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j;
260
260
  return react_1.default.createElement("div", { id: this.props.id, ref: this.containerRef, className: "select-multi-container row ".concat(this.props.disabled ? 'disabled' : '', " ").concat(((_a = this.props.helperText) === null || _a === void 0 ? void 0 : _a.length) && 'helper-text', " ").concat((_b = this.props.className) !== null && _b !== void 0 ? _b : 'body-3'), "helper-text": this.props.helperText, style: this.props.style ? __assign(__assign({}, { '--helper-text-color': (_c = this.props.helperTextColor) !== null && _c !== void 0 ? _c : '#e14337' }), this.props.style) : { '--helper-text-color': (_d = this.props.helperTextColor) !== null && _d !== void 0 ? _d : '#e14337' }, onClick: function () {
261
261
  var _a, _b;
262
262
  if (!_this.state.isOpen)
@@ -282,7 +282,7 @@ var SelectMultiple = /** @class */ (function (_super) {
282
282
  } },
283
283
  react_1.default.createElement(react_fontawesome_1.FontAwesomeIcon, { icon: free_solid_svg_icons_1.faXmarkCircle, style: { fontSize: '1.6rem', color: '#161C24' } })),
284
284
  this.state.isOpen &&
285
- react_dom_1.default.createPortal(react_1.default.createElement("div", { className: 'select-multi-popup col', style: (_e = this.state.style) !== null && _e !== void 0 ? _e : {
285
+ react_dom_1.default.createPortal(react_1.default.createElement("div", { className: "select-multi-popup col ".concat((_e = this.props.popupClassName) !== null && _e !== void 0 ? _e : ""), style: (_f = this.state.style) !== null && _f !== void 0 ? _f : {
286
286
  top: this.state.offset.y + this.state.offset.height + 2 + 'px',
287
287
  left: this.state.offset.x + 'px',
288
288
  width: this.state.offset.width,
@@ -307,8 +307,8 @@ var SelectMultiple = /** @class */ (function (_super) {
307
307
  }, className: 'button-text-3', style: { color: _list.length ? 'var(--infor-color)' : '#00204D99', } }, _list.length && isSelectedAll ? 'Bỏ chọn tất cả' : 'Chọn tất cả');
308
308
  })()),
309
309
  react_1.default.createElement("div", { className: 'col select-body' },
310
- ((_f = this.state.search) !== null && _f !== void 0 ? _f : this.state.options).filter(function (e) { return !e.parentId; }).map(function (item) { return _this.renderOptions(item); }),
311
- (((_g = this.state.search) === null || _g === void 0 ? void 0 : _g.length) === 0 || ((_h = this.props.options) === null || _h === void 0 ? void 0 : _h.length) === 0) && (react_1.default.createElement("div", { className: 'no-results-found' }, "No result found")))), document.body));
310
+ ((_g = this.state.search) !== null && _g !== void 0 ? _g : this.state.options).filter(function (e) { return !e.parentId; }).map(function (item) { return _this.renderOptions(item); }),
311
+ (((_h = this.state.search) === null || _h === void 0 ? void 0 : _h.length) === 0 || ((_j = this.props.options) === null || _j === void 0 ? void 0 : _j.length) === 0) && (react_1.default.createElement("div", { className: 'no-results-found' }, "No result found")))), document.body));
312
312
  };
313
313
  return SelectMultiple;
314
314
  }(react_1.default.Component));
@@ -21,6 +21,7 @@ interface Select1Props {
21
21
  handleSearch?: (e: string) => Promise<Array<OptionsItem>>;
22
22
  showClearValueButton?: boolean;
23
23
  readOnly?: boolean;
24
+ popupClassName?: string;
24
25
  }
25
26
  interface Select1State {
26
27
  value?: string | number;
@@ -271,7 +271,7 @@ var Select1 = /** @class */ (function (_super) {
271
271
  };
272
272
  Select1.prototype.render = function () {
273
273
  var _this = this;
274
- var _a, _b, _c, _d, _e, _f, _g, _h;
274
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j;
275
275
  var _value = this.state.options.find(function (e) { return e.id === _this.state.value; });
276
276
  return react_1.default.createElement("div", { id: this.props.id, ref: this.containerRef, className: "select1-container row ".concat(this.props.disabled ? 'disabled' : '', " ").concat(((_a = this.props.helperText) === null || _a === void 0 ? void 0 : _a.length) && 'helper-text', " ").concat((_b = this.props.className) !== null && _b !== void 0 ? _b : 'body-3'), "helper-text": this.props.helperText, style: this.props.style ? __assign(__assign({}, { '--helper-text-color': (_c = this.props.helperTextColor) !== null && _c !== void 0 ? _c : '#e14337' }), this.props.style) : { '--helper-text-color': (_d = this.props.helperTextColor) !== null && _d !== void 0 ? _d : '#e14337' }, onClick: function () {
277
277
  var _a, _b, _c;
@@ -293,14 +293,14 @@ var Select1 = /** @class */ (function (_super) {
293
293
  } },
294
294
  react_1.default.createElement(react_fontawesome_1.FontAwesomeIcon, { icon: free_solid_svg_icons_1.faXmarkCircle, style: { fontSize: '1.6rem', color: '#161C24' } })),
295
295
  this.state.isOpen &&
296
- react_dom_1.default.createPortal(react_1.default.createElement("div", { className: 'select1-popup col', style: (_e = this.state.style) !== null && _e !== void 0 ? _e : {
296
+ react_dom_1.default.createPortal(react_1.default.createElement("div", { className: "select1-popup col ".concat((_e = this.props.popupClassName) !== null && _e !== void 0 ? _e : ""), style: (_f = this.state.style) !== null && _f !== void 0 ? _f : {
297
297
  top: this.state.offset.y + this.state.offset.height + 2 + 'px',
298
298
  left: this.state.offset.x + 'px',
299
299
  width: this.state.offset.width,
300
300
  }, onMouseOver: function (ev) { return _this.setState(__assign(__assign({}, _this.state), { onSelect: ev.target })); }, onMouseOut: function () { return _this.setState(__assign(__assign({}, _this.state), { onSelect: null })); } },
301
301
  react_1.default.createElement("div", { className: 'col select-body' },
302
- ((_f = this.state.search) !== null && _f !== void 0 ? _f : this.state.options).filter(function (e) { return !e.parentId; }).map(function (item) { return _this.renderOptions(item); }),
303
- (((_g = this.state.search) === null || _g === void 0 ? void 0 : _g.length) === 0 || ((_h = this.props.options) === null || _h === void 0 ? void 0 : _h.length) === 0) && (react_1.default.createElement("div", { className: 'no-results-found' }, "No result found")))), document.body));
302
+ ((_g = this.state.search) !== null && _g !== void 0 ? _g : this.state.options).filter(function (e) { return !e.parentId; }).map(function (item) { return _this.renderOptions(item); }),
303
+ (((_h = this.state.search) === null || _h === void 0 ? void 0 : _h.length) === 0 || ((_j = this.props.options) === null || _j === void 0 ? void 0 : _j.length) === 0) && (react_1.default.createElement("div", { className: 'no-results-found' }, "No result found")))), document.body));
304
304
  };
305
305
  return Select1;
306
306
  }(react_1.default.Component));