@douyinfe/semi-ui 2.12.1-alpha.0 → 2.13.0-beta.0

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 (188) hide show
  1. package/autoComplete/_story/autoComplete.stories.js +0 -1
  2. package/autoComplete/index.tsx +1 -1
  3. package/avatar/index.tsx +2 -2
  4. package/backtop/index.tsx +7 -11
  5. package/badge/index.tsx +1 -1
  6. package/banner/index.tsx +5 -5
  7. package/breadcrumb/index.tsx +3 -5
  8. package/button/Button.tsx +8 -10
  9. package/card/index.tsx +41 -43
  10. package/carousel/CarouselArrow.tsx +0 -2
  11. package/carousel/index.tsx +0 -1
  12. package/cascader/index.tsx +123 -101
  13. package/cascader/item.tsx +1 -1
  14. package/checkbox/checkbox.tsx +28 -20
  15. package/checkbox/checkboxInner.tsx +11 -1
  16. package/collapsible/index.tsx +1 -8
  17. package/datePicker/dateInput.tsx +0 -1
  18. package/datePicker/datePicker.tsx +5 -13
  19. package/dist/css/semi.css +49 -41
  20. package/dist/css/semi.min.css +1 -1
  21. package/dist/umd/semi-ui.js +5372 -3695
  22. package/dist/umd/semi-ui.js.map +1 -1
  23. package/dist/umd/semi-ui.min.js +1 -1
  24. package/dist/umd/semi-ui.min.js.map +1 -1
  25. package/divider/index.tsx +4 -8
  26. package/dropdown/index.tsx +1 -1
  27. package/empty/index.tsx +5 -13
  28. package/form/hoc/withField.tsx +1 -1
  29. package/form/label.tsx +1 -1
  30. package/grid/col.tsx +1 -1
  31. package/grid/row.tsx +1 -1
  32. package/iconButton/index.tsx +1 -2
  33. package/input/index.tsx +11 -38
  34. package/inputNumber/__test__/inputNumber.test.js +2 -3
  35. package/inputNumber/_story/inputNumber.stories.js +53 -0
  36. package/inputNumber/index.tsx +0 -4
  37. package/lib/cjs/autoComplete/index.js +1 -1
  38. package/lib/cjs/avatar/index.js +2 -4
  39. package/lib/cjs/backtop/index.js +1 -2
  40. package/lib/cjs/badge/index.js +1 -2
  41. package/lib/cjs/banner/index.js +4 -9
  42. package/lib/cjs/breadcrumb/index.js +3 -4
  43. package/lib/cjs/button/Button.js +3 -13
  44. package/lib/cjs/card/index.js +5 -10
  45. package/lib/cjs/carousel/CarouselArrow.js +2 -6
  46. package/lib/cjs/carousel/index.js +1 -2
  47. package/lib/cjs/cascader/index.js +6 -9
  48. package/lib/cjs/cascader/item.js +1 -2
  49. package/lib/cjs/checkbox/checkbox.d.ts +3 -2
  50. package/lib/cjs/checkbox/checkbox.js +33 -15
  51. package/lib/cjs/checkbox/checkboxInner.d.ts +6 -0
  52. package/lib/cjs/checkbox/checkboxInner.js +14 -4
  53. package/lib/cjs/collapsible/index.js +1 -2
  54. package/lib/cjs/datePicker/dateInput.js +1 -2
  55. package/lib/cjs/datePicker/datePicker.js +2 -4
  56. package/lib/cjs/divider/index.js +1 -2
  57. package/lib/cjs/dropdown/index.js +1 -2
  58. package/lib/cjs/empty/index.js +4 -8
  59. package/lib/cjs/form/hoc/withField.js +1 -2
  60. package/lib/cjs/form/label.js +1 -2
  61. package/lib/cjs/grid/col.js +1 -2
  62. package/lib/cjs/grid/row.js +1 -2
  63. package/lib/cjs/iconButton/index.js +1 -3
  64. package/lib/cjs/input/index.js +5 -9
  65. package/lib/cjs/inputNumber/index.js +0 -4
  66. package/lib/cjs/list/index.js +3 -6
  67. package/lib/cjs/modal/ConfirmModal.js +1 -2
  68. package/lib/cjs/modal/Modal.js +2 -6
  69. package/lib/cjs/modal/ModalContent.js +6 -13
  70. package/lib/cjs/notification/notice.js +3 -6
  71. package/lib/cjs/pagination/index.js +2 -4
  72. package/lib/cjs/popconfirm/index.js +3 -6
  73. package/lib/cjs/popover/index.d.ts +1 -0
  74. package/lib/cjs/radio/radio.js +2 -4
  75. package/lib/cjs/rating/item.js +1 -2
  76. package/lib/cjs/scrollList/index.js +3 -6
  77. package/lib/cjs/select/index.js +4 -8
  78. package/lib/cjs/select/option.js +1 -2
  79. package/lib/cjs/sideSheet/SideSheetContent.js +3 -6
  80. package/lib/cjs/skeleton/index.js +1 -3
  81. package/lib/cjs/space/index.js +1 -2
  82. package/lib/cjs/spin/index.js +3 -7
  83. package/lib/cjs/switch/index.js +4 -6
  84. package/lib/cjs/table/Table.js +3 -6
  85. package/lib/cjs/tabs/TabBar.js +1 -2
  86. package/lib/cjs/tabs/TabPane.js +2 -5
  87. package/lib/cjs/tagInput/index.d.ts +6 -1
  88. package/lib/cjs/tagInput/index.js +42 -10
  89. package/lib/cjs/timePicker/Combobox.js +1 -3
  90. package/lib/cjs/toast/toast.js +3 -6
  91. package/lib/cjs/transfer/index.js +1 -2
  92. package/lib/cjs/tree/treeNode.js +1 -2
  93. package/lib/cjs/treeSelect/index.js +3 -6
  94. package/lib/cjs/typography/base.js +1 -2
  95. package/lib/cjs/upload/index.d.ts +1 -1
  96. package/lib/cjs/upload/index.js +6 -13
  97. package/lib/es/autoComplete/index.js +1 -1
  98. package/lib/es/avatar/index.js +2 -4
  99. package/lib/es/backtop/index.js +1 -2
  100. package/lib/es/badge/index.js +1 -2
  101. package/lib/es/banner/index.js +4 -9
  102. package/lib/es/breadcrumb/index.js +3 -4
  103. package/lib/es/button/Button.js +3 -11
  104. package/lib/es/card/index.js +5 -10
  105. package/lib/es/carousel/CarouselArrow.js +2 -6
  106. package/lib/es/carousel/index.js +1 -2
  107. package/lib/es/cascader/index.js +6 -9
  108. package/lib/es/cascader/item.js +1 -2
  109. package/lib/es/checkbox/checkbox.d.ts +3 -2
  110. package/lib/es/checkbox/checkbox.js +33 -15
  111. package/lib/es/checkbox/checkboxInner.d.ts +6 -0
  112. package/lib/es/checkbox/checkboxInner.js +14 -4
  113. package/lib/es/collapsible/index.js +1 -2
  114. package/lib/es/datePicker/dateInput.js +1 -2
  115. package/lib/es/datePicker/datePicker.js +2 -4
  116. package/lib/es/divider/index.js +1 -2
  117. package/lib/es/dropdown/index.js +1 -2
  118. package/lib/es/empty/index.js +4 -8
  119. package/lib/es/form/hoc/withField.js +1 -2
  120. package/lib/es/form/label.js +1 -2
  121. package/lib/es/grid/col.js +1 -2
  122. package/lib/es/grid/row.js +1 -2
  123. package/lib/es/iconButton/index.js +1 -3
  124. package/lib/es/input/index.js +5 -9
  125. package/lib/es/inputNumber/index.js +0 -4
  126. package/lib/es/list/index.js +3 -6
  127. package/lib/es/modal/ConfirmModal.js +1 -2
  128. package/lib/es/modal/Modal.js +2 -6
  129. package/lib/es/modal/ModalContent.js +6 -13
  130. package/lib/es/notification/notice.js +3 -6
  131. package/lib/es/pagination/index.js +2 -4
  132. package/lib/es/popconfirm/index.js +3 -6
  133. package/lib/es/popover/index.d.ts +1 -0
  134. package/lib/es/radio/radio.js +2 -4
  135. package/lib/es/rating/item.js +1 -2
  136. package/lib/es/scrollList/index.js +3 -6
  137. package/lib/es/select/index.js +4 -8
  138. package/lib/es/select/option.js +1 -2
  139. package/lib/es/sideSheet/SideSheetContent.js +3 -6
  140. package/lib/es/skeleton/index.js +1 -3
  141. package/lib/es/space/index.js +1 -2
  142. package/lib/es/spin/index.js +3 -7
  143. package/lib/es/switch/index.js +4 -6
  144. package/lib/es/table/Table.js +3 -6
  145. package/lib/es/tabs/TabBar.js +1 -2
  146. package/lib/es/tabs/TabPane.js +2 -5
  147. package/lib/es/tagInput/index.d.ts +6 -1
  148. package/lib/es/tagInput/index.js +41 -10
  149. package/lib/es/timePicker/Combobox.js +1 -3
  150. package/lib/es/toast/toast.js +3 -6
  151. package/lib/es/transfer/index.js +1 -2
  152. package/lib/es/tree/treeNode.js +1 -2
  153. package/lib/es/treeSelect/index.js +3 -6
  154. package/lib/es/typography/base.js +1 -2
  155. package/lib/es/upload/index.d.ts +1 -1
  156. package/lib/es/upload/index.js +6 -13
  157. package/list/index.tsx +4 -16
  158. package/modal/ConfirmModal.tsx +1 -1
  159. package/modal/Modal.tsx +0 -2
  160. package/modal/ModalContent.tsx +14 -27
  161. package/notification/notice.tsx +4 -16
  162. package/package.json +9 -9
  163. package/pagination/index.tsx +2 -16
  164. package/popconfirm/index.tsx +3 -11
  165. package/popover/index.tsx +1 -1
  166. package/radio/radio.tsx +2 -10
  167. package/rating/item.tsx +1 -1
  168. package/scrollList/index.tsx +3 -19
  169. package/select/_story/select.stories.js +11 -0
  170. package/select/index.tsx +4 -12
  171. package/select/option.tsx +1 -5
  172. package/sideSheet/SideSheetContent.tsx +3 -3
  173. package/skeleton/index.tsx +1 -1
  174. package/space/index.tsx +1 -1
  175. package/spin/index.tsx +9 -15
  176. package/switch/index.tsx +14 -9
  177. package/table/Table.tsx +3 -5
  178. package/tabs/TabBar.tsx +1 -1
  179. package/tabs/TabPane.tsx +4 -9
  180. package/tagInput/index.tsx +38 -11
  181. package/timePicker/Combobox.tsx +1 -6
  182. package/toast/toast.tsx +3 -3
  183. package/transfer/index.tsx +0 -1
  184. package/tree/treeNode.tsx +1 -1
  185. package/treeSelect/index.tsx +3 -15
  186. package/typography/base.tsx +1 -1
  187. package/upload/index.tsx +38 -107
  188. package/yarn-error.log +0 -26235
@@ -718,8 +718,7 @@ class Select extends _baseComponent.default {
718
718
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
719
719
  className: contentWrapperCls
720
720
  }, /*#__PURE__*/_react.default.createElement("span", {
721
- className: spanCls,
722
- "x-semi-prop": "placeholder"
721
+ className: spanCls
723
722
  }, renderText || renderText === 0 ? renderText : placeholder), filterable && showInput ? this.renderInput() : null));
724
723
  }
725
724
 
@@ -878,8 +877,7 @@ class Select extends _baseComponent.default {
878
877
  ["".concat(prefixcls, "-suffix-icon")]: (0, _utils2.isSemiIcon)(suffix)
879
878
  });
880
879
  return /*#__PURE__*/_react.default.createElement("div", {
881
- className: suffixWrapperCls,
882
- "x-semi-prop": "suffix"
880
+ className: suffixWrapperCls
883
881
  }, suffix);
884
882
  }
885
883
 
@@ -898,8 +896,7 @@ class Select extends _baseComponent.default {
898
896
  });
899
897
  return /*#__PURE__*/_react.default.createElement("div", {
900
898
  className: prefixWrapperCls,
901
- id: insetLabelId,
902
- "x-semi-prop": "prefix,insetLabel"
899
+ id: insetLabelId
903
900
  }, labelNode);
904
901
  }
905
902
 
@@ -951,8 +948,7 @@ class Select extends _baseComponent.default {
951
948
  });
952
949
  const showClear = this.props.showClear && (selections.size || inputValue) && !disabled && (isHovering || isOpen);
953
950
  const arrowContent = showArrow ? /*#__PURE__*/_react.default.createElement("div", {
954
- className: "".concat(prefixcls, "-arrow"),
955
- "x-semi-prop": "arrowIcon"
951
+ className: "".concat(prefixcls, "-arrow")
956
952
  }, arrowIcon) : /*#__PURE__*/_react.default.createElement("div", {
957
953
  className: "".concat(prefixcls, "-arrow-empty")
958
954
  });
@@ -129,8 +129,7 @@ class Option extends _react.PureComponent {
129
129
  return /*#__PURE__*/_react.default.createElement(_localeConsumer.default, {
130
130
  componentName: "Select"
131
131
  }, locale => /*#__PURE__*/_react.default.createElement("div", {
132
- className: optionClassName,
133
- "x-semi-prop": "emptyContent"
132
+ className: optionClassName
134
133
  }, emptyContent || locale.emptyText));
135
134
  } // Since there are empty, locale and other logic, the custom renderOptionItem is directly converged to the internal option instead of being placed in Select/index
136
135
 
@@ -102,8 +102,7 @@ class SideSheetContent extends _react.default.PureComponent {
102
102
 
103
103
  if (title) {
104
104
  header = /*#__PURE__*/_react.default.createElement("div", {
105
- className: "".concat(prefixCls, "-title"),
106
- "x-semi-prop": "title"
105
+ className: "".concat(prefixCls, "-title")
107
106
  }, this.props.title);
108
107
  }
109
108
 
@@ -159,11 +158,9 @@ class SideSheetContent extends _react.default.PureComponent {
159
158
  className: "".concat(prefixCls, "-content")
160
159
  }, header, /*#__PURE__*/_react.default.createElement("div", {
161
160
  className: "".concat(prefixCls, "-body"),
162
- style: props.bodyStyle,
163
- "x-semi-prop": "children"
161
+ style: props.bodyStyle
164
162
  }, props.children), props.footer ? /*#__PURE__*/_react.default.createElement("div", {
165
- className: "".concat(prefixCls, "-footer"),
166
- "x-semi-prop": "footer"
163
+ className: "".concat(prefixCls, "-footer")
167
164
  }, props.footer) : null));
168
165
 
169
166
  return dialogElement;
@@ -71,9 +71,7 @@ class Skeleton extends _react.PureComponent {
71
71
  content = /*#__PURE__*/_react.default.createElement("div", (0, _assign.default)({
72
72
  className: skCls,
73
73
  style: style
74
- }, others, {
75
- "x-semi-prop": "placeholder"
76
- }), placeholder);
74
+ }, others), placeholder);
77
75
  } else {
78
76
  content = children;
79
77
  }
@@ -95,8 +95,7 @@ class Space extends _react.PureComponent {
95
95
  const childrenNodes = (0, _utils.flatten)(children);
96
96
  return /*#__PURE__*/_react.default.createElement("div", {
97
97
  className: classNames,
98
- style: realStyle,
99
- "x-semi-prop": "children"
98
+ style: realStyle
100
99
  }, childrenNodes);
101
100
  }
102
101
 
@@ -89,11 +89,8 @@ class Spin extends _baseComponent.default {
89
89
  return loading ? /*#__PURE__*/_react.default.createElement("div", {
90
90
  className: "".concat(prefixCls, "-wrapper")
91
91
  }, indicator ? /*#__PURE__*/_react.default.createElement("div", {
92
- className: spinIconCls,
93
- "x-semi-prop": "indicator"
94
- }, indicator) : /*#__PURE__*/_react.default.createElement(_icon.default, null), tip ? /*#__PURE__*/_react.default.createElement("div", {
95
- "x-semi-prop": "tip"
96
- }, tip) : null) : null;
92
+ className: spinIconCls
93
+ }, indicator) : /*#__PURE__*/_react.default.createElement(_icon.default, null), tip ? /*#__PURE__*/_react.default.createElement("div", null, tip) : null) : null;
97
94
  }
98
95
 
99
96
  render() {
@@ -120,8 +117,7 @@ class Spin extends _baseComponent.default {
120
117
  style: style
121
118
  }, this.renderSpin(), /*#__PURE__*/_react.default.createElement("div", {
122
119
  className: "".concat(prefixCls, "-children"),
123
- style: childStyle,
124
- "x-semi-prop": "children"
120
+ style: childStyle
125
121
  }, children));
126
122
  }
127
123
 
@@ -139,21 +139,19 @@ class Switch extends _baseComponent.default {
139
139
  className: _constants.cssClasses.KNOB,
140
140
  "aria-hidden": true
141
141
  }), showCheckedText ? /*#__PURE__*/_react.default.createElement("div", {
142
- className: _constants.cssClasses.CHECKED_TEXT,
143
- "x-semi-prop": "checkedText"
142
+ className: _constants.cssClasses.CHECKED_TEXT
144
143
  }, checkedText) : null, showUncheckedText ? /*#__PURE__*/_react.default.createElement("div", {
145
- className: _constants.cssClasses.UNCHECKED_TEXT,
146
- "x-semi-prop": "uncheckedText"
144
+ className: _constants.cssClasses.UNCHECKED_TEXT
147
145
  }, uncheckedText) : null, /*#__PURE__*/_react.default.createElement("input", (0, _assign.default)({}, switchProps, {
148
146
  ref: this.switchRef,
149
147
  id: id,
150
- role: "switch",
148
+ role: 'switch',
151
149
  "aria-checked": nativeControlChecked,
152
150
  "aria-invalid": this.props['aria-invalid'],
153
151
  "aria-errormessage": this.props['aria-errormessage'],
154
152
  "aria-label": this.props['aria-label'],
155
153
  "aria-labelledby": this.props['aria-labelledby'],
156
- "aria-describedby": this.props['aria-describedby'],
154
+ "aria-describedby": this.props["aria-describedby"],
157
155
  "aria-disabled": this.props['disabled'],
158
156
  onChange: e => this.foundation.handleChange(e.target.checked, e),
159
157
  onFocus: e => this.handleFocusVisible(e),
@@ -642,8 +642,7 @@ class Table extends _baseComponent.default {
642
642
  }
643
643
 
644
644
  return /*#__PURE__*/(0, _react.isValidElement)(title) || typeof title === 'string' ? /*#__PURE__*/_react.default.createElement("div", {
645
- className: "".concat(prefixCls, "-title"),
646
- "x-semi-prop": "title"
645
+ className: "".concat(prefixCls, "-title")
647
646
  }, title) : null;
648
647
  };
649
648
 
@@ -668,8 +667,7 @@ class Table extends _baseComponent.default {
668
667
  }, (locale, localeCode) => /*#__PURE__*/_react.default.createElement("div", {
669
668
  className: wrapCls
670
669
  }, /*#__PURE__*/_react.default.createElement("div", {
671
- className: "".concat(prefixCls, "-empty"),
672
- "x-semi-prop": "empty"
670
+ className: "".concat(prefixCls, "-empty")
673
671
  }, empty || locale.emptyText)));
674
672
  };
675
673
 
@@ -689,8 +687,7 @@ class Table extends _baseComponent.default {
689
687
 
690
688
  return /*#__PURE__*/(0, _react.isValidElement)(footer) || typeof footer === 'string' ? /*#__PURE__*/_react.default.createElement("div", {
691
689
  className: "".concat(prefixCls, "-footer"),
692
- key: "footer",
693
- "x-semi-prop": "footer"
690
+ key: "footer"
694
691
  }, footer) : null;
695
692
  };
696
693
 
@@ -271,8 +271,7 @@ class TabBar extends _react.default.Component {
271
271
  const tabBarStyle = (0, _assign.default)((0, _assign.default)({}, tabBarExtraContentDefaultStyle), tabBarExtraContentStyle);
272
272
  return /*#__PURE__*/_react.default.createElement("div", {
273
273
  className: extraCls,
274
- style: tabBarStyle,
275
- "x-semi-prop": "tabBarExtraContent"
274
+ style: tabBarStyle
276
275
  }, tabBarExtraContent);
277
276
  }
278
277
 
@@ -143,17 +143,14 @@ class TabPane extends _react.PureComponent {
143
143
  style: style,
144
144
  "aria-hidden": active ? 'false' : 'true',
145
145
  tabIndex: 0
146
- }, (0, _getDataAttr.default)(restProps), {
147
- "x-semi-prop": "children"
148
- }), motion ? /*#__PURE__*/_react.default.createElement(_TabPaneTransition.default, {
146
+ }, (0, _getDataAttr.default)(restProps)), motion ? /*#__PURE__*/_react.default.createElement(_TabPaneTransition.default, {
149
147
  direction: this.getDirection(this.context.activeKey, itemKey, this.context.panes),
150
148
  motion: motion,
151
149
  mode: tabPosition === 'top' ? 'horizontal' : 'vertical',
152
150
  state: active ? 'enter' : 'leave'
153
151
  }, transitionStyle => /*#__PURE__*/_react.default.createElement("div", {
154
152
  className: "".concat(_constants.cssClasses.TABS_PANE_MOTION_OVERLAY),
155
- style: (0, _assign.default)({}, transitionStyle),
156
- "x-semi-prop": "children"
153
+ style: (0, _assign.default)({}, transitionStyle)
157
154
  }, shouldRender ? children : null)) : shouldRender ? children : null);
158
155
  }
159
156
 
@@ -2,7 +2,7 @@ import React from 'react';
2
2
  import PropTypes from 'prop-types';
3
3
  import { strings } from '@douyinfe/semi-foundation/lib/cjs/tagInput/constants';
4
4
  import '@douyinfe/semi-foundation/lib/cjs/tagInput/tagInput.css';
5
- import { TagInputAdapter } from '@douyinfe/semi-foundation/lib/cjs/tagInput/foundation';
5
+ import TagInputFoundation, { TagInputAdapter } from '@douyinfe/semi-foundation/lib/cjs/tagInput/foundation';
6
6
  import { ArrayElement } from '../_base/base';
7
7
  import BaseComponent from '../_base/baseComponent';
8
8
  import { PopoverProps } from '../popover';
@@ -32,6 +32,8 @@ export interface TagInputProps {
32
32
  onKeyDown?: (e: React.MouseEvent<HTMLInputElement>) => void;
33
33
  onRemove?: (removedValue: string, idx: number) => void;
34
34
  placeholder?: string;
35
+ insetLabel?: React.ReactNode;
36
+ insetLabelId?: string;
35
37
  prefix?: React.ReactNode;
36
38
  renderTagItem?: (value: string, index: number) => React.ReactNode;
37
39
  separator?: string | string[] | null;
@@ -108,6 +110,7 @@ declare class TagInput extends BaseComponent<TagInputProps, TagInputState> {
108
110
  onKeyDown: (...args: any[]) => void;
109
111
  };
110
112
  inputRef: React.RefObject<HTMLInputElement>;
113
+ foundation: TagInputFoundation;
111
114
  constructor(props: TagInputProps);
112
115
  static getDerivedStateFromProps(nextProps: TagInputProps, prevState: TagInputState): {
113
116
  tagsArray: string[];
@@ -124,6 +127,8 @@ declare class TagInput extends BaseComponent<TagInputProps, TagInputState> {
124
127
  handleTagClose: (idx: number) => void;
125
128
  handleInputMouseLeave: (e: React.MouseEvent<HTMLDivElement>) => void;
126
129
  handleInputMouseEnter: (e: React.MouseEvent<HTMLDivElement>) => void;
130
+ handleClickPrefixOrSuffix: (e: React.MouseEvent<HTMLInputElement>) => void;
131
+ handlePreventMouseDown: (e: React.MouseEvent<HTMLInputElement>) => void;
127
132
  renderClearBtn(): JSX.Element;
128
133
  renderPrefix(): JSX.Element;
129
134
  renderSuffix(): JSX.Element;
@@ -40,6 +40,8 @@ require("@douyinfe/semi-foundation/lib/cjs/tagInput/tagInput.css");
40
40
 
41
41
  var _foundation = _interopRequireDefault(require("@douyinfe/semi-foundation/lib/cjs/tagInput/foundation"));
42
42
 
43
+ var _utils = require("../_utils");
44
+
43
45
  var _baseComponent = _interopRequireDefault(require("../_base/baseComponent"));
44
46
 
45
47
  var _tag = _interopRequireDefault(require("../tag"));
@@ -94,6 +96,14 @@ class TagInput extends _baseComponent.default {
94
96
  this.foundation.handleInputMouseEnter();
95
97
  };
96
98
 
99
+ this.handleClickPrefixOrSuffix = e => {
100
+ this.foundation.handleClickPrefixOrSuffix(e);
101
+ };
102
+
103
+ this.handlePreventMouseDown = e => {
104
+ this.foundation.handlePreventMouseDown(e);
105
+ };
106
+
97
107
  this.foundation = new _foundation.default(this.adapter);
98
108
  this.state = {
99
109
  tagsArray: props.defaultValue || [],
@@ -145,6 +155,19 @@ class TagInput extends _baseComponent.default {
145
155
  focusing
146
156
  });
147
157
  },
158
+ toggleFocusing: isFocus => {
159
+ const input = this.inputRef && this.inputRef.current;
160
+
161
+ if (isFocus) {
162
+ input && input.focus();
163
+ } else {
164
+ input && input.blur();
165
+ }
166
+
167
+ this.setState({
168
+ focusing: isFocus
169
+ });
170
+ },
148
171
  setHovering: hovering => {
149
172
  this.setState({
150
173
  hovering
@@ -215,22 +238,29 @@ class TagInput extends _baseComponent.default {
215
238
 
216
239
  renderPrefix() {
217
240
  const {
218
- prefix
241
+ prefix,
242
+ insetLabel,
243
+ insetLabelId
219
244
  } = this.props;
245
+ const labelNode = prefix || insetLabel;
220
246
 
221
- if ((0, _isNull2.default)(prefix) || (0, _isUndefined2.default)(prefix)) {
247
+ if ((0, _isNull2.default)(labelNode) || (0, _isUndefined2.default)(labelNode)) {
222
248
  return null;
223
249
  }
224
250
 
225
251
  const prefixWrapperCls = (0, _classnames.default)("".concat(prefixCls, "-prefix"), {
226
- ["".concat(prefixCls, "-prefix-text")]: prefix && (0, _isString2.default)(prefix),
252
+ ["".concat(prefixCls, "-inset-label")]: insetLabel,
253
+ ["".concat(prefixCls, "-prefix-text")]: labelNode && (0, _isString2.default)(labelNode),
227
254
  // eslint-disable-next-line max-len
228
- ["".concat(prefixCls, "-prefix-icon")]: /*#__PURE__*/_react.default.isValidElement(prefix) && !(prefix && (0, _isString2.default)(prefix))
229
- });
255
+ ["".concat(prefixCls, "-prefix-icon")]: (0, _utils.isSemiIcon)(labelNode)
256
+ }); // eslint-disable-next-line jsx-a11y/no-static-element-interactions,jsx-a11y/click-events-have-key-events
257
+
230
258
  return /*#__PURE__*/_react.default.createElement("div", {
231
259
  className: prefixWrapperCls,
232
- "x-semi-prop": "prefix"
233
- }, prefix);
260
+ onMouseDown: this.handlePreventMouseDown,
261
+ onClick: this.handleClickPrefixOrSuffix,
262
+ id: insetLabelId
263
+ }, labelNode);
234
264
  }
235
265
 
236
266
  renderSuffix() {
@@ -245,11 +275,13 @@ class TagInput extends _baseComponent.default {
245
275
  const suffixWrapperCls = (0, _classnames.default)("".concat(prefixCls, "-suffix"), {
246
276
  ["".concat(prefixCls, "-suffix-text")]: suffix && (0, _isString2.default)(suffix),
247
277
  // eslint-disable-next-line max-len
248
- ["".concat(prefixCls, "-suffix-icon")]: /*#__PURE__*/_react.default.isValidElement(suffix) && !(suffix && (0, _isString2.default)(suffix))
249
- });
278
+ ["".concat(prefixCls, "-suffix-icon")]: (0, _utils.isSemiIcon)(suffix)
279
+ }); // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions
280
+
250
281
  return /*#__PURE__*/_react.default.createElement("div", {
251
282
  className: suffixWrapperCls,
252
- "x-semi-prop": "suffix"
283
+ onMouseDown: this.handlePreventMouseDown,
284
+ onClick: this.handleClickPrefixOrSuffix
253
285
  }, suffix);
254
286
  }
255
287
 
@@ -311,9 +311,7 @@ class Combobox extends _baseComponent.default {
311
311
  componentName: "TimePicker"
312
312
  }, (locale, localeCode) => /*#__PURE__*/_react.default.createElement(_index.default, {
313
313
  header: panelHeader,
314
- footer: panelFooter,
315
- "x-semi-header-alias": "panelHeader",
316
- "x-semi-footer-alias": "panelFooter"
314
+ footer: panelFooter
317
315
  }, this.renderAMPMSelect(locale, localeCode), this.renderHourSelect(value.getHours(), locale), this.renderMinuteSelect(value.getMinutes(), locale), this.renderSecondSelect(value.getSeconds(), locale)));
318
316
  }
319
317
 
@@ -135,7 +135,7 @@ class Toast extends _baseComponent.default {
135
135
  const btnTheme = 'borderless';
136
136
  const btnSize = 'small';
137
137
  return /*#__PURE__*/_react.default.createElement("div", {
138
- role: "alert",
138
+ role: 'alert',
139
139
  "aria-label": "".concat(type ? type : 'default', " type"),
140
140
  className: toastCls,
141
141
  style: style,
@@ -145,16 +145,13 @@ class Toast extends _baseComponent.default {
145
145
  className: "".concat(prefixCls, "-content")
146
146
  }, this.renderIcon(), /*#__PURE__*/_react.default.createElement("span", {
147
147
  className: "".concat(prefixCls, "-content-text"),
148
- style: textStyle,
149
- "x-semi-prop": "content"
148
+ style: textStyle
150
149
  }, content), showClose && /*#__PURE__*/_react.default.createElement("div", {
151
150
  className: "".concat(prefixCls, "-close-button")
152
151
  }, /*#__PURE__*/_react.default.createElement(_index.default, {
153
152
  onClick: e => this.close(e),
154
153
  type: "tertiary",
155
- icon: /*#__PURE__*/_react.default.createElement(_semiIcons.IconClose, {
156
- "x-semi-prop": "icon"
157
- }),
154
+ icon: /*#__PURE__*/_react.default.createElement(_semiIcons.IconClose, null),
158
155
  theme: btnTheme,
159
156
  size: btnSize
160
157
  }))));
@@ -279,8 +279,7 @@ class Transfer extends _baseComponent.default {
279
279
  className: leftItemCls,
280
280
  checked: checked,
281
281
  role: "listitem",
282
- onChange: () => this.onSelectOrRemove(item),
283
- "x-semi-children-alias": "dataSource[".concat(index, "].label")
282
+ onChange: () => this.onSelectOrRemove(item)
284
283
  }, item.label);
285
284
  }
286
285
 
@@ -410,8 +410,7 @@ class TreeNode extends _react.PureComponent {
410
410
  return /*#__PURE__*/_react.default.createElement("ul", {
411
411
  className: wrapperCls
412
412
  }, /*#__PURE__*/_react.default.createElement("li", {
413
- className: (0, _concat.default)(_context2 = "".concat(prefixcls, "-label ")).call(_context2, prefixcls, "-label-empty"),
414
- "x-semi-prop": "emptyContent"
413
+ className: (0, _concat.default)(_context2 = "".concat(prefixcls, "-label ")).call(_context2, prefixcls, "-label-empty")
415
414
  }, emptyContent));
416
415
  } // eslint-disable-next-line max-lines-per-function
417
416
 
@@ -120,8 +120,7 @@ class TreeSelect extends _baseComponent.default {
120
120
  ["".concat(prefixcls, "-suffix-icon")]: (0, _utils.isSemiIcon)(suffix)
121
121
  });
122
122
  return /*#__PURE__*/_react.default.createElement("div", {
123
- className: suffixWrapperCls,
124
- "x-semi-prop": "suffix"
123
+ className: suffixWrapperCls
125
124
  }, suffix);
126
125
  };
127
126
 
@@ -141,8 +140,7 @@ class TreeSelect extends _baseComponent.default {
141
140
  });
142
141
  return /*#__PURE__*/_react.default.createElement("div", {
143
142
  className: prefixWrapperCls,
144
- id: insetLabelId,
145
- "x-semi-prop": "prefix,insetLabel"
143
+ id: insetLabelId
146
144
  }, labelNode);
147
145
  };
148
146
 
@@ -396,8 +394,7 @@ class TreeSelect extends _baseComponent.default {
396
394
  }
397
395
 
398
396
  return arrowIcon ? /*#__PURE__*/_react.default.createElement("div", {
399
- className: (0, _classnames.default)("".concat(prefixcls, "-arrow")),
400
- "x-semi-prop": "arrowIcon"
397
+ className: (0, _classnames.default)("".concat(prefixcls, "-arrow"))
401
398
  }, arrowIcon) : null;
402
399
  };
403
400
 
@@ -571,8 +571,7 @@ class Base extends _react.Component {
571
571
 
572
572
  const iconSize = size === 'small' ? 'small' : 'default';
573
573
  return /*#__PURE__*/_react.default.createElement("span", {
574
- className: "".concat(prefixCls, "-icon"),
575
- "x-semi-prop": "icon"
574
+ className: "".concat(prefixCls, "-icon")
576
575
  }, (0, _utils.isSemiIcon)(icon) ? /*#__PURE__*/_react.default.cloneElement(icon, {
577
576
  size: iconSize
578
577
  }) : icon);
@@ -6,7 +6,7 @@ import BaseComponent, { ValidateStatus } from '../_base/baseComponent';
6
6
  import { FileItem, RenderFileItemProps, UploadListType, PromptPositionType, BeforeUploadProps, AfterUploadProps, OnChangeProps, customRequestArgs, CustomError } from './interface';
7
7
  import { Locale } from '../locale/interface';
8
8
  import '@douyinfe/semi-foundation/lib/cjs/upload/upload.css';
9
- export { FileItem, RenderFileItemProps, UploadListType, PromptPositionType, BeforeUploadProps, AfterUploadProps, OnChangeProps, customRequestArgs, CustomError, BeforeUploadObjectResult, AfterUploadResult, };
9
+ export { FileItem, RenderFileItemProps, UploadListType, PromptPositionType, BeforeUploadProps, AfterUploadProps, OnChangeProps, customRequestArgs, CustomError, BeforeUploadObjectResult, AfterUploadResult };
10
10
  export interface UploadProps {
11
11
  accept?: string;
12
12
  action: string;
@@ -256,9 +256,7 @@ class Upload extends _baseComponent.default {
256
256
  });
257
257
  }
258
258
 
259
- const addContent = /*#__PURE__*/_react.default.createElement("div", (0, _assign.default)({}, addContentProps, {
260
- "x-semi-prop": "children"
261
- }), children);
259
+ const addContent = /*#__PURE__*/_react.default.createElement("div", (0, _assign.default)({}, addContentProps), children);
262
260
 
263
261
  if (!showUploadList || !fileList.length) {
264
262
  if (showAddTriggerInList) {
@@ -391,18 +389,15 @@ class Upload extends _baseComponent.default {
391
389
  onDragEnter: this.onDragEnter,
392
390
  onClick: this.onClick
393
391
  }, children ? children : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
394
- className: "".concat(dragAreaBaseCls, "-icon"),
395
- "x-semi-prop": "dragIcon"
392
+ className: "".concat(dragAreaBaseCls, "-icon")
396
393
  }, dragIcon || /*#__PURE__*/_react.default.createElement(_semiIcons.IconUpload, {
397
394
  size: "extra-large"
398
395
  })), /*#__PURE__*/_react.default.createElement("div", {
399
396
  className: "".concat(dragAreaBaseCls, "-text")
400
397
  }, /*#__PURE__*/_react.default.createElement("div", {
401
- className: "".concat(dragAreaBaseCls, "-main-text"),
402
- "x-semi-prop": "dragMainText"
398
+ className: "".concat(dragAreaBaseCls, "-main-text")
403
399
  }, dragMainText || locale.mainText), /*#__PURE__*/_react.default.createElement("div", {
404
- className: "".concat(dragAreaBaseCls, "-sub-text"),
405
- "x-semi-prop": "dragSubText"
400
+ className: "".concat(dragAreaBaseCls, "-sub-text")
406
401
  }, dragSubText), /*#__PURE__*/_react.default.createElement("div", {
407
402
  className: "".concat(dragAreaBaseCls, "-tips")
408
403
  }, dragAreaStatus === _constants.strings.DRAG_AREA_LEGAL && /*#__PURE__*/_react.default.createElement("span", {
@@ -588,11 +583,9 @@ class Upload extends _baseComponent.default {
588
583
  className: inputReplaceCls,
589
584
  ref: this.replaceInputRef
590
585
  }), this.renderAddContent(), prompt ? /*#__PURE__*/_react.default.createElement("div", {
591
- className: promptCls,
592
- "x-semi-prop": "prompt"
586
+ className: promptCls
593
587
  }, prompt) : null, validateMessage ? /*#__PURE__*/_react.default.createElement("div", {
594
- className: validateMsgCls,
595
- "x-semi-prop": "validateMessage"
588
+ className: validateMsgCls
596
589
  }, validateMessage) : null, this.renderFileList());
597
590
  }
598
591
 
@@ -404,7 +404,7 @@ AutoComplete.defaultProps = {
404
404
  onChange: _noop,
405
405
  onSelectWithObject: false,
406
406
  onDropdownVisibleChange: _noop,
407
- defaultActiveFirstOption: true,
407
+ defaultActiveFirstOption: false,
408
408
  dropdownMatchSelectWidth: true,
409
409
  loading: false,
410
410
  maxHeight: 300,
@@ -156,8 +156,7 @@ export default class Avatar extends BaseComponent {
156
156
  }, className);
157
157
  let content = children;
158
158
  const hoverRender = hoverContent ? /*#__PURE__*/React.createElement("div", {
159
- className: "".concat(prefixCls, "-hover"),
160
- "x-semi-prop": "hoverContent"
159
+ className: "".concat(prefixCls, "-hover")
161
160
  }, hoverContent) : null;
162
161
 
163
162
  if (isImg) {
@@ -171,8 +170,7 @@ export default class Avatar extends BaseComponent {
171
170
  content = /*#__PURE__*/React.createElement("span", {
172
171
  className: "".concat(prefixCls, "-content")
173
172
  }, /*#__PURE__*/React.createElement("span", {
174
- className: "".concat(prefixCls, "-label"),
175
- "x-semi-prop": "children"
173
+ className: "".concat(prefixCls, "-label")
176
174
  }, children));
177
175
  }
178
176
 
@@ -98,8 +98,7 @@ export default class BackTop extends BaseComponent {
98
98
  const content = visible ? /*#__PURE__*/React.createElement("div", _Object$assign({}, others, {
99
99
  className: preCls,
100
100
  style: style,
101
- onClick: e => this.handleClick(e),
102
- "x-semi-prop": "children"
101
+ onClick: e => this.handleClick(e)
103
102
  }), backtopBtn) : null;
104
103
  return content;
105
104
  }
@@ -71,8 +71,7 @@ export default class Badge extends PureComponent {
71
71
  className: prefixCls
72
72
  }, rest), children, /*#__PURE__*/React.createElement("span", {
73
73
  className: wrapper,
74
- style: style,
75
- "x-semi-prop": "count"
74
+ style: style
76
75
  }, dot ? null : content));
77
76
  }
78
77
 
@@ -68,7 +68,6 @@ export default class Banner extends BaseComponent {
68
68
  className: "".concat(prefixCls, "-close"),
69
69
  onClick: this.remove,
70
70
  icon: closeIcon || /*#__PURE__*/React.createElement(IconClose, {
71
- "x-semi-prop": "closeIcon",
72
71
  "aria-hidden": true
73
72
  }),
74
73
  theme: "borderless",
@@ -114,8 +113,7 @@ export default class Banner extends BaseComponent {
114
113
 
115
114
  if (iconType) {
116
115
  return /*#__PURE__*/React.createElement("div", {
117
- className: iconCls,
118
- "x-semi-prop": "icon"
116
+ className: iconCls
119
117
  }, iconType);
120
118
  }
121
119
 
@@ -157,15 +155,12 @@ export default class Banner extends BaseComponent {
157
155
  }, title ? /*#__PURE__*/React.createElement(Typography.Title, {
158
156
  heading: 5,
159
157
  className: "".concat(prefixCls, "-title"),
160
- component: "div",
161
- "x-semi-prop": "title"
158
+ component: "div"
162
159
  }, title) : null, description ? /*#__PURE__*/React.createElement(Typography.Paragraph, {
163
160
  className: "".concat(prefixCls, "-description"),
164
- component: "div",
165
- "x-semi-prop": "description"
161
+ component: "div"
166
162
  }, description) : null)), this.renderCloser()), children ? /*#__PURE__*/React.createElement("div", {
167
- className: "".concat(prefixCls, "-extra"),
168
- "x-semi-prop": "children"
163
+ className: "".concat(prefixCls, "-extra")
169
164
  }, children) : null) : null;
170
165
  return banner;
171
166
  }
@@ -47,15 +47,14 @@ class Breadcrumb extends BaseComponent {
47
47
  }, /*#__PURE__*/React.createElement("span", {
48
48
  className: "".concat(clsPrefix, "-item-wrap")
49
49
  }, /*#__PURE__*/React.createElement("span", {
50
- role: "button",
50
+ role: 'button',
51
51
  tabIndex: 0,
52
- "aria-label": "Expand breadcrumb items",
52
+ "aria-label": 'Expand breadcrumb items',
53
53
  className: _concatInstanceProperty(_context = "".concat(clsPrefix, "-item ")).call(_context, clsPrefix, "-item-more"),
54
54
  onClick: item => this.foundation.handleExpand(item),
55
55
  onKeyPress: e => this.foundation.handleExpandEnterPress(e)
56
56
  }, hasRenderMore && renderMore(restItem), !hasRenderMore && moreType === 'default' && /*#__PURE__*/React.createElement(IconMore, null), !hasRenderMore && moreType === 'popover' && this.renderPopoverMore(restItem)), /*#__PURE__*/React.createElement("span", {
57
- className: "".concat(clsPrefix, "-separator"),
58
- "x-semi-prop": "separator"
57
+ className: "".concat(clsPrefix, "-separator")
59
58
  }, this.props.separator)));
60
59
 
61
60
  _spliceInstanceProperty(template).call(template, 1, itemsLen - maxItemCount, spread);