@douyinfe/semi-ui 2.17.1 → 2.18.1-alpha.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 (212) hide show
  1. package/anchor/index.tsx +1 -1
  2. package/anchor/link.tsx +3 -4
  3. package/autoComplete/__test__/autoComplete.test.js +6 -6
  4. package/autoComplete/index.tsx +1 -1
  5. package/autoComplete/option.tsx +164 -0
  6. package/calendar/__test__/calendar.test.js +21 -2
  7. package/calendar/_story/calendar.stories.js +31 -0
  8. package/calendar/index.tsx +3 -1
  9. package/calendar/interface.ts +2 -1
  10. package/carousel/index.tsx +5 -5
  11. package/checkbox/checkbox.tsx +10 -2
  12. package/dist/css/semi.css +133 -28
  13. package/dist/css/semi.min.css +1 -1
  14. package/dist/umd/semi-ui.js +7478 -8726
  15. package/dist/umd/semi-ui.js.map +1 -1
  16. package/dist/umd/semi-ui.min.js +1 -1
  17. package/dist/umd/semi-ui.min.js.map +1 -1
  18. package/form/_story/FieldProps/labelOptional.jsx +30 -0
  19. package/form/_story/form.stories.js +7 -0
  20. package/form/baseForm.tsx +0 -1
  21. package/form/hoc/withField.tsx +1 -0
  22. package/form/label.tsx +21 -7
  23. package/gulpfile.js +3 -1
  24. package/lib/cjs/_base/base.css +35 -0
  25. package/lib/cjs/anchor/index.js +2 -1
  26. package/lib/cjs/anchor/link.d.ts +1 -1
  27. package/lib/cjs/anchor/link.js +9 -5
  28. package/lib/cjs/autoComplete/index.d.ts +1 -1
  29. package/lib/cjs/autoComplete/index.js +1 -1
  30. package/lib/cjs/autoComplete/option.d.ts +50 -0
  31. package/lib/cjs/autoComplete/option.js +218 -0
  32. package/lib/cjs/button/Button.d.ts +1 -1
  33. package/lib/cjs/button/index.d.ts +1 -1
  34. package/lib/cjs/calendar/index.d.ts +2 -0
  35. package/lib/cjs/calendar/index.js +3 -1
  36. package/lib/cjs/calendar/interface.d.ts +2 -1
  37. package/lib/cjs/carousel/CarouselIndicator.d.ts +1 -1
  38. package/lib/cjs/carousel/index.d.ts +1 -1
  39. package/lib/cjs/carousel/index.js +2 -2
  40. package/lib/cjs/checkbox/checkbox.d.ts +4 -0
  41. package/lib/cjs/checkbox/checkbox.js +9 -3
  42. package/lib/cjs/datePicker/dateInput.d.ts +1 -1
  43. package/lib/cjs/datePicker/datePicker.d.ts +1 -1
  44. package/lib/cjs/datePicker/monthsGrid.d.ts +1 -1
  45. package/lib/cjs/form/baseForm.js +0 -1
  46. package/lib/cjs/form/hoc/withField.js +2 -1
  47. package/lib/cjs/form/label.d.ts +8 -5
  48. package/lib/cjs/form/label.js +15 -4
  49. package/lib/cjs/locale/interface.d.ts +3 -0
  50. package/lib/cjs/locale/source/ar.js +3 -0
  51. package/lib/cjs/locale/source/de.js +3 -0
  52. package/lib/cjs/locale/source/en_GB.js +3 -0
  53. package/lib/cjs/locale/source/en_US.js +3 -0
  54. package/lib/cjs/locale/source/es.js +3 -0
  55. package/lib/cjs/locale/source/fr.js +3 -0
  56. package/lib/cjs/locale/source/id_ID.js +3 -0
  57. package/lib/cjs/locale/source/it.js +3 -0
  58. package/lib/cjs/locale/source/ja_JP.js +3 -0
  59. package/lib/cjs/locale/source/ko_KR.js +3 -0
  60. package/lib/cjs/locale/source/ms_MY.js +3 -0
  61. package/lib/cjs/locale/source/pt_BR.js +3 -0
  62. package/lib/cjs/locale/source/ru_RU.js +3 -0
  63. package/lib/cjs/locale/source/th_TH.js +3 -0
  64. package/lib/cjs/locale/source/tr_TR.js +3 -0
  65. package/lib/cjs/locale/source/vi_VN.js +3 -0
  66. package/lib/cjs/locale/source/zh_CN.js +3 -0
  67. package/lib/cjs/locale/source/zh_TW.js +3 -0
  68. package/lib/cjs/modal/Modal.js +0 -8
  69. package/lib/cjs/modal/ModalContent.js +4 -1
  70. package/lib/cjs/radio/radio.d.ts +3 -1
  71. package/lib/cjs/radio/radio.js +33 -8
  72. package/lib/cjs/radio/radioGroup.d.ts +1 -1
  73. package/lib/cjs/table/ColumnFilter.js +4 -2
  74. package/lib/cjs/table/ColumnSorter.d.ts +1 -0
  75. package/lib/cjs/table/ColumnSorter.js +9 -6
  76. package/lib/cjs/table/Table.js +11 -4
  77. package/lib/cjs/tabs/TabBar.js +5 -1
  78. package/lib/cjs/tag/group.d.ts +3 -0
  79. package/lib/cjs/tag/group.js +24 -6
  80. package/lib/cjs/tag/index.d.ts +2 -1
  81. package/lib/cjs/tag/index.js +7 -5
  82. package/lib/cjs/tag/interface.d.ts +2 -1
  83. package/lib/cjs/timePicker/TimePicker.d.ts +2 -2
  84. package/lib/cjs/timePicker/TimeShape.d.ts +1 -1
  85. package/lib/cjs/timePicker/index.d.ts +2 -2
  86. package/lib/cjs/transfer/index.js +7 -2
  87. package/lib/cjs/tree/index.d.ts +3 -1
  88. package/lib/cjs/tree/index.js +23 -0
  89. package/lib/cjs/tree/interface.d.ts +4 -0
  90. package/lib/cjs/typography/base.d.ts +1 -1
  91. package/lib/cjs/typography/paragraph.d.ts +1 -1
  92. package/lib/cjs/typography/text.d.ts +1 -1
  93. package/lib/cjs/typography/title.d.ts +2 -2
  94. package/lib/cjs/upload/index.d.ts +1 -1
  95. package/lib/es/_base/base.css +35 -0
  96. package/lib/es/anchor/index.js +2 -1
  97. package/lib/es/anchor/link.d.ts +1 -1
  98. package/lib/es/anchor/link.js +9 -5
  99. package/lib/es/autoComplete/index.d.ts +1 -1
  100. package/lib/es/autoComplete/index.js +1 -1
  101. package/lib/es/autoComplete/option.d.ts +50 -0
  102. package/lib/es/autoComplete/option.js +188 -0
  103. package/lib/es/button/Button.d.ts +1 -1
  104. package/lib/es/button/index.d.ts +1 -1
  105. package/lib/es/calendar/index.d.ts +2 -0
  106. package/lib/es/calendar/index.js +3 -1
  107. package/lib/es/calendar/interface.d.ts +2 -1
  108. package/lib/es/carousel/CarouselIndicator.d.ts +1 -1
  109. package/lib/es/carousel/index.d.ts +1 -1
  110. package/lib/es/carousel/index.js +2 -2
  111. package/lib/es/checkbox/checkbox.d.ts +4 -0
  112. package/lib/es/checkbox/checkbox.js +10 -4
  113. package/lib/es/datePicker/dateInput.d.ts +1 -1
  114. package/lib/es/datePicker/datePicker.d.ts +1 -1
  115. package/lib/es/datePicker/monthsGrid.d.ts +1 -1
  116. package/lib/es/form/baseForm.js +0 -1
  117. package/lib/es/form/hoc/withField.js +2 -1
  118. package/lib/es/form/label.d.ts +8 -5
  119. package/lib/es/form/label.js +13 -4
  120. package/lib/es/locale/interface.d.ts +3 -0
  121. package/lib/es/locale/source/ar.js +3 -0
  122. package/lib/es/locale/source/de.js +3 -0
  123. package/lib/es/locale/source/en_GB.js +3 -0
  124. package/lib/es/locale/source/en_US.js +3 -0
  125. package/lib/es/locale/source/es.js +3 -0
  126. package/lib/es/locale/source/fr.js +3 -0
  127. package/lib/es/locale/source/id_ID.js +3 -0
  128. package/lib/es/locale/source/it.js +3 -0
  129. package/lib/es/locale/source/ja_JP.js +3 -0
  130. package/lib/es/locale/source/ko_KR.js +3 -0
  131. package/lib/es/locale/source/ms_MY.js +3 -0
  132. package/lib/es/locale/source/pt_BR.js +3 -0
  133. package/lib/es/locale/source/ru_RU.js +3 -0
  134. package/lib/es/locale/source/th_TH.js +3 -0
  135. package/lib/es/locale/source/tr_TR.js +3 -0
  136. package/lib/es/locale/source/vi_VN.js +3 -0
  137. package/lib/es/locale/source/zh_CN.js +3 -0
  138. package/lib/es/locale/source/zh_TW.js +3 -0
  139. package/lib/es/modal/Modal.js +0 -8
  140. package/lib/es/modal/ModalContent.js +4 -1
  141. package/lib/es/radio/radio.d.ts +3 -1
  142. package/lib/es/radio/radio.js +31 -8
  143. package/lib/es/radio/radioGroup.d.ts +1 -1
  144. package/lib/es/table/ColumnFilter.js +4 -2
  145. package/lib/es/table/ColumnSorter.d.ts +1 -0
  146. package/lib/es/table/ColumnSorter.js +9 -6
  147. package/lib/es/table/Table.js +10 -4
  148. package/lib/es/tabs/TabBar.js +5 -1
  149. package/lib/es/tag/group.d.ts +3 -0
  150. package/lib/es/tag/group.js +24 -6
  151. package/lib/es/tag/index.d.ts +2 -1
  152. package/lib/es/tag/index.js +7 -5
  153. package/lib/es/tag/interface.d.ts +2 -1
  154. package/lib/es/timePicker/TimePicker.d.ts +2 -2
  155. package/lib/es/timePicker/TimeShape.d.ts +1 -1
  156. package/lib/es/timePicker/index.d.ts +2 -2
  157. package/lib/es/transfer/index.js +7 -2
  158. package/lib/es/tree/index.d.ts +3 -1
  159. package/lib/es/tree/index.js +22 -0
  160. package/lib/es/tree/interface.d.ts +4 -0
  161. package/lib/es/typography/base.d.ts +1 -1
  162. package/lib/es/typography/paragraph.d.ts +1 -1
  163. package/lib/es/typography/text.d.ts +1 -1
  164. package/lib/es/typography/title.d.ts +2 -2
  165. package/lib/es/upload/index.d.ts +1 -1
  166. package/locale/interface.ts +3 -0
  167. package/locale/source/ar.ts +3 -0
  168. package/locale/source/de.ts +3 -0
  169. package/locale/source/en_GB.ts +3 -0
  170. package/locale/source/en_US.ts +3 -0
  171. package/locale/source/es.ts +3 -0
  172. package/locale/source/fr.ts +3 -0
  173. package/locale/source/id_ID.ts +3 -0
  174. package/locale/source/it.ts +3 -0
  175. package/locale/source/ja_JP.ts +3 -0
  176. package/locale/source/ko_KR.ts +3 -0
  177. package/locale/source/ms_MY.ts +3 -0
  178. package/locale/source/pt_BR.ts +3 -0
  179. package/locale/source/ru_RU.ts +3 -0
  180. package/locale/source/th_TH.ts +3 -0
  181. package/locale/source/tr_TR.ts +4 -1
  182. package/locale/source/vi_VN.ts +3 -0
  183. package/locale/source/zh_CN.ts +3 -0
  184. package/locale/source/zh_TW.ts +3 -0
  185. package/modal/Modal.tsx +0 -6
  186. package/modal/ModalContent.tsx +4 -1
  187. package/modal/__test__/modal.test.js +1 -1
  188. package/modal/_story/__snapshots__/modal.stories.tsx.snap +203 -0
  189. package/package.json +7 -7
  190. package/radio/_story/radio.stories.js +2 -2
  191. package/radio/radio.tsx +27 -5
  192. package/rating/__test__/rating.test.js +1 -1
  193. package/select/__test__/select.test.js +11 -17
  194. package/select/_story/select.stories.js +6 -6
  195. package/steps/_story/steps.stories.js +3 -3
  196. package/switch/_story/switch.stories.js +4 -4
  197. package/switch/_story/switch.stories.tsx +4 -4
  198. package/table/ColumnFilter.tsx +2 -1
  199. package/table/ColumnSorter.tsx +16 -10
  200. package/table/Table.tsx +7 -4
  201. package/tabs/TabBar.tsx +7 -1
  202. package/tag/_story/tag.stories.js +57 -1
  203. package/tag/group.tsx +20 -3
  204. package/tag/index.tsx +6 -5
  205. package/tag/interface.ts +2 -1
  206. package/transfer/_story/transfer.stories.js +2 -2
  207. package/transfer/index.tsx +7 -2
  208. package/tree/_story/tree.stories.js +152 -3
  209. package/tree/index.tsx +16 -1
  210. package/tree/interface.ts +6 -0
  211. package/upload/_story/upload.stories.js +2 -2
  212. package/webpack.config.js +13 -3
@@ -0,0 +1,188 @@
1
+ import _isString from "lodash/isString";
2
+ import _indexOfInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/index-of";
3
+ import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
4
+ import _Object$assign from "@babel/runtime-corejs3/core-js-stable/object/assign";
5
+
6
+ var __rest = this && this.__rest || function (s, e) {
7
+ var t = {};
8
+
9
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && _indexOfInstanceProperty(e).call(e, p) < 0) t[p] = s[p];
10
+
11
+ if (s != null && typeof _Object$getOwnPropertySymbols === "function") for (var i = 0, p = _Object$getOwnPropertySymbols(s); i < p.length; i++) {
12
+ if (_indexOfInstanceProperty(e).call(e, p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
13
+ }
14
+ return t;
15
+ };
16
+ /* eslint-disable max-len */
17
+
18
+
19
+ import React, { PureComponent } from 'react';
20
+ import classNames from 'classnames';
21
+ import PropTypes from 'prop-types';
22
+ import { cssClasses } from '@douyinfe/semi-foundation/lib/es/autoComplete/constants';
23
+ import LocaleConsumer from '../locale/localeConsumer';
24
+ import { IconTick } from '@douyinfe/semi-icons';
25
+ import { getHighLightTextHTML } from '../_utils/index';
26
+
27
+ class Option extends PureComponent {
28
+ onClick(_a, event) {
29
+ var {
30
+ value,
31
+ label,
32
+ children
33
+ } = _a,
34
+ rest = __rest(_a, ["value", "label", "children"]);
35
+
36
+ const {
37
+ props
38
+ } = this;
39
+ const isDisabled = props.disabled;
40
+
41
+ if (!isDisabled) {
42
+ props.onSelect(_Object$assign(_Object$assign({}, rest), {
43
+ value,
44
+ label: label || children
45
+ }), event);
46
+ }
47
+ }
48
+
49
+ renderOptionContent(_ref) {
50
+ let {
51
+ config,
52
+ children,
53
+ inputValue,
54
+ prefixCls
55
+ } = _ref;
56
+
57
+ if (_isString(children) && inputValue) {
58
+ return getHighLightTextHTML(config);
59
+ }
60
+
61
+ return children;
62
+ }
63
+
64
+ render() {
65
+ const _a = this.props,
66
+ {
67
+ children,
68
+ disabled,
69
+ value,
70
+ selected,
71
+ label,
72
+ empty,
73
+ emptyContent,
74
+ onSelect,
75
+ focused,
76
+ showTick,
77
+ className,
78
+ style,
79
+ onMouseEnter,
80
+ prefixCls,
81
+ renderOptionItem,
82
+ inputValue
83
+ } = _a,
84
+ rest = __rest(_a, ["children", "disabled", "value", "selected", "label", "empty", "emptyContent", "onSelect", "focused", "showTick", "className", "style", "onMouseEnter", "prefixCls", "renderOptionItem", "inputValue"]);
85
+
86
+ const optionClassName = classNames(prefixCls, {
87
+ ["".concat(prefixCls, "-disabled")]: disabled,
88
+ ["".concat(prefixCls, "-selected")]: selected,
89
+ ["".concat(prefixCls, "-focused")]: focused,
90
+ ["".concat(prefixCls, "-empty")]: empty,
91
+ [className]: className
92
+ });
93
+ const selectedIconClassName = classNames(["".concat(prefixCls, "-icon")]);
94
+
95
+ if (empty) {
96
+ if (emptyContent === null) {
97
+ return null;
98
+ }
99
+
100
+ return /*#__PURE__*/React.createElement(LocaleConsumer, {
101
+ componentName: "Select"
102
+ }, locale => /*#__PURE__*/React.createElement("div", {
103
+ className: optionClassName,
104
+ "x-semi-prop": "emptyContent"
105
+ }, emptyContent || locale.emptyText));
106
+ } // 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
107
+
108
+
109
+ if (typeof renderOptionItem === 'function') {
110
+ return renderOptionItem(_Object$assign({
111
+ disabled,
112
+ focused,
113
+ selected,
114
+ style,
115
+ label,
116
+ value,
117
+ inputValue,
118
+ onMouseEnter: e => onMouseEnter(e),
119
+ onClick: e => this.onClick(_Object$assign({
120
+ value,
121
+ label,
122
+ children
123
+ }, rest), e)
124
+ }, rest));
125
+ }
126
+
127
+ const config = {
128
+ searchWords: inputValue,
129
+ sourceString: children,
130
+ option: {
131
+ highlightClassName: "".concat(prefixCls, "-keyword")
132
+ }
133
+ };
134
+ return (
135
+ /*#__PURE__*/
136
+ // eslint-disable-next-line jsx-a11y/interactive-supports-focus,jsx-a11y/click-events-have-key-events
137
+ React.createElement("div", {
138
+ className: optionClassName,
139
+ onClick: e => {
140
+ this.onClick(_Object$assign({
141
+ value,
142
+ label,
143
+ children
144
+ }, rest), e);
145
+ },
146
+ onMouseEnter: e => onMouseEnter && onMouseEnter(e),
147
+ role: "option",
148
+ "aria-selected": selected ? "true" : "false",
149
+ "aria-disabled": disabled ? "true" : "false",
150
+ style: style
151
+ }, showTick ? /*#__PURE__*/React.createElement("div", {
152
+ className: selectedIconClassName
153
+ }, /*#__PURE__*/React.createElement(IconTick, null)) : null, _isString(children) ? /*#__PURE__*/React.createElement("div", {
154
+ className: "".concat(prefixCls, "-text")
155
+ }, this.renderOptionContent({
156
+ children,
157
+ config,
158
+ inputValue,
159
+ prefixCls
160
+ })) : children)
161
+ );
162
+ }
163
+
164
+ }
165
+
166
+ Option.isSelectOption = true;
167
+ Option.propTypes = {
168
+ children: PropTypes.node,
169
+ disabled: PropTypes.bool,
170
+ value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
171
+ selected: PropTypes.bool,
172
+ label: PropTypes.node,
173
+ empty: PropTypes.bool,
174
+ emptyContent: PropTypes.node,
175
+ onSelect: PropTypes.func,
176
+ focused: PropTypes.bool,
177
+ showTick: PropTypes.bool,
178
+ className: PropTypes.string,
179
+ style: PropTypes.object,
180
+ onMouseEnter: PropTypes.func,
181
+ prefixCls: PropTypes.string,
182
+ renderOptionItem: PropTypes.func,
183
+ inputValue: PropTypes.string
184
+ };
185
+ Option.defaultProps = {
186
+ prefixCls: cssClasses.PREFIX_OPTION
187
+ };
188
+ export default Option;
@@ -48,7 +48,7 @@ export default class Button extends PureComponent<ButtonProps> {
48
48
  prefixCls: PropTypes.Requireable<string>;
49
49
  style: PropTypes.Requireable<object>;
50
50
  size: PropTypes.Requireable<"default" | "small" | "large">;
51
- type: PropTypes.Requireable<"warning" | "primary" | "tertiary" | "secondary" | "danger">;
51
+ type: PropTypes.Requireable<"warning" | "primary" | "secondary" | "tertiary" | "danger">;
52
52
  block: PropTypes.Requireable<boolean>;
53
53
  onClick: PropTypes.Requireable<(...args: any[]) => any>;
54
54
  onMouseDown: PropTypes.Requireable<(...args: any[]) => any>;
@@ -23,7 +23,7 @@ declare class Button extends React.PureComponent<ButtonProps> {
23
23
  onMouseLeave: import("prop-types").Requireable<(...args: any[]) => any>;
24
24
  disabled: import("prop-types").Requireable<boolean>;
25
25
  size: import("prop-types").Requireable<"default" | "small" | "large">;
26
- type: import("prop-types").Requireable<"warning" | "primary" | "tertiary" | "secondary" | "danger">;
26
+ type: import("prop-types").Requireable<"warning" | "primary" | "secondary" | "tertiary" | "danger">;
27
27
  block: import("prop-types").Requireable<boolean>;
28
28
  onClick: import("prop-types").Requireable<(...args: any[]) => any>;
29
29
  onMouseDown: import("prop-types").Requireable<(...args: any[]) => any>;
@@ -18,6 +18,7 @@ declare class Calendar extends BaseComponent<CalendarProps, {}> {
18
18
  }>[]>;
19
19
  mode: PropTypes.Requireable<string>;
20
20
  showCurrTime: PropTypes.Requireable<boolean>;
21
+ weekStartsOn: PropTypes.Requireable<number>;
21
22
  scrollTop: PropTypes.Requireable<number>;
22
23
  onClick: PropTypes.Requireable<(...args: any[]) => any>;
23
24
  renderTimeDisplay: PropTypes.Requireable<(...args: any[]) => any>;
@@ -35,6 +36,7 @@ declare class Calendar extends BaseComponent<CalendarProps, {}> {
35
36
  markWeekend: boolean;
36
37
  height: number;
37
38
  scrollTop: number;
39
+ weekStartsOn: number;
38
40
  };
39
41
  render(): React.FunctionComponentElement<any>;
40
42
  }
@@ -54,6 +54,7 @@ Calendar.propTypes = {
54
54
  })),
55
55
  mode: PropTypes.string,
56
56
  showCurrTime: PropTypes.bool,
57
+ weekStartsOn: PropTypes.number,
57
58
  scrollTop: PropTypes.number,
58
59
  onClick: PropTypes.func,
59
60
  renderTimeDisplay: PropTypes.func,
@@ -70,6 +71,7 @@ Calendar.defaultProps = {
70
71
  mode: 'week',
71
72
  markWeekend: false,
72
73
  height: 600,
73
- scrollTop: 400
74
+ scrollTop: 400,
75
+ weekStartsOn: 0
74
76
  };
75
77
  export default Calendar;
@@ -1,5 +1,5 @@
1
1
  /// <reference types="react" />
2
- import { EventObject } from '@douyinfe/semi-foundation/lib/es/calendar/foundation';
2
+ import { EventObject, weeekStartsOnEnum } from '@douyinfe/semi-foundation/lib/es/calendar/foundation';
3
3
  import { strings } from '@douyinfe/semi-foundation/lib/es/calendar/constants';
4
4
  import { ArrayElement } from '../_base/base';
5
5
  import { BaseProps } from '../_base/baseComponent';
@@ -10,6 +10,7 @@ export interface CalendarProps extends BaseProps {
10
10
  events?: EventObject[];
11
11
  mode?: ArrayElement<typeof strings.MODE>;
12
12
  showCurrTime?: boolean;
13
+ weekStartsOn?: weeekStartsOnEnum;
13
14
  scrollTop?: number;
14
15
  onClick?: (e: React.MouseEvent, value: Date) => void;
15
16
  onClose?: (e: React.MouseEvent) => void;
@@ -8,7 +8,7 @@ declare class CarouselIndicator extends React.PureComponent<CarouselIndicatorPro
8
8
  position: PropTypes.Requireable<"left" | "right" | "center">;
9
9
  size: PropTypes.Requireable<"small" | "medium">;
10
10
  style: PropTypes.Requireable<object>;
11
- theme: PropTypes.Requireable<"primary" | "dark" | "light">;
11
+ theme: PropTypes.Requireable<"dark" | "light" | "primary">;
12
12
  total: PropTypes.Requireable<number>;
13
13
  onIndicatorChange: PropTypes.Requireable<(...args: any[]) => any>;
14
14
  type: PropTypes.Requireable<"line" | "dot" | "columnar">;
@@ -22,7 +22,7 @@ declare class Carousel extends BaseComponent<CarouselProps, CarouselState> {
22
22
  indicatorPosition: PropTypes.Requireable<"left" | "right" | "center">;
23
23
  indicatorSize: PropTypes.Requireable<"small" | "medium">;
24
24
  indicatorType: PropTypes.Requireable<"line" | "dot" | "columnar">;
25
- theme: PropTypes.Requireable<"primary" | "dark" | "light">;
25
+ theme: PropTypes.Requireable<"dark" | "light" | "primary">;
26
26
  onChange: PropTypes.Requireable<(...args: any[]) => any>;
27
27
  arrowType: PropTypes.Requireable<"hover" | "always">;
28
28
  showArrow: PropTypes.Requireable<boolean>;
@@ -41,7 +41,7 @@ class Carousel extends BaseComponent {
41
41
  };
42
42
 
43
43
  this.handleAutoPlay = () => {
44
- if (!this.foundation.getIsControledComponent()) {
44
+ if (!this.foundation.getIsControlledComponent()) {
45
45
  this.foundation.handleAutoPlay();
46
46
  }
47
47
  };
@@ -61,7 +61,7 @@ class Carousel extends BaseComponent {
61
61
  autoPlay
62
62
  } = this.props;
63
63
 
64
- if ((typeof autoPlay !== 'object' || autoPlay.hoverToPause) && !this.foundation.getIsControledComponent()) {
64
+ if ((typeof autoPlay !== 'object' || autoPlay.hoverToPause) && !this.foundation.getIsControlledComponent()) {
65
65
  this.foundation.handleAutoPlay();
66
66
  }
67
67
  };
@@ -5,6 +5,7 @@ import CheckboxInner from './checkboxInner';
5
5
  import BaseComponent from '../_base/baseComponent';
6
6
  import '@douyinfe/semi-foundation/lib/es/checkbox/checkbox.css';
7
7
  import { CheckboxContextType } from './context';
8
+ import { CheckboxType } from './checkboxGroup';
8
9
  export declare type CheckboxEvent = BasicCheckboxEvent;
9
10
  export declare type TargetObject = BasicTargetObject;
10
11
  export interface CheckboxProps extends BaseCheckboxProps {
@@ -24,6 +25,7 @@ export interface CheckboxProps extends BaseCheckboxProps {
24
25
  tabIndex?: number;
25
26
  addonId?: string;
26
27
  extraId?: string;
28
+ type?: CheckboxType;
27
29
  }
28
30
  interface CheckboxState {
29
31
  checked: boolean;
@@ -55,6 +57,7 @@ declare class Checkbox extends BaseComponent<CheckboxProps, CheckboxState> {
55
57
  'aria-label': PropTypes.Requireable<string>;
56
58
  tabIndex: PropTypes.Requireable<number>;
57
59
  preventScroll: PropTypes.Requireable<boolean>;
60
+ type: PropTypes.Requireable<string>;
58
61
  };
59
62
  static defaultProps: {
60
63
  defaultChecked: boolean;
@@ -62,6 +65,7 @@ declare class Checkbox extends BaseComponent<CheckboxProps, CheckboxState> {
62
65
  onChange: (...args: any[]) => void;
63
66
  onMouseEnter: (...args: any[]) => void;
64
67
  onMouseLeave: (...args: any[]) => void;
68
+ type: string;
65
69
  };
66
70
  checkboxEntity: CheckboxInner;
67
71
  context: CheckboxContextType;
@@ -8,7 +8,7 @@ import _includesInstanceProperty from "@babel/runtime-corejs3/core-js-stable/ins
8
8
  import React from 'react';
9
9
  import PropTypes from 'prop-types';
10
10
  import classnames from 'classnames';
11
- import { checkboxClasses as css } from '@douyinfe/semi-foundation/lib/es/checkbox/constants';
11
+ import { checkboxClasses as css, strings } from '@douyinfe/semi-foundation/lib/es/checkbox/constants';
12
12
  import CheckboxFoundation from '@douyinfe/semi-foundation/lib/es/checkbox/checkboxFoundation';
13
13
  import CheckboxInner from './checkboxInner';
14
14
  import BaseComponent from '../_base/baseComponent';
@@ -126,7 +126,8 @@ class Checkbox extends BaseComponent {
126
126
  value,
127
127
  role,
128
128
  tabIndex,
129
- id
129
+ id,
130
+ type
130
131
  } = this.props;
131
132
  const {
132
133
  checked,
@@ -160,6 +161,9 @@ class Checkbox extends BaseComponent {
160
161
  props.isCardType = isCardType;
161
162
  props.isPureCardType = isPureCardType;
162
163
  props['name'] = this.context.checkboxGroup.name;
164
+ } else {
165
+ props.isPureCardType = type === strings.TYPE_PURECARD;
166
+ props.isCardType = type === strings.TYPE_CARD || props.isPureCardType;
163
167
  }
164
168
 
165
169
  const prefix = prefixCls || css.PREFIX;
@@ -250,13 +254,15 @@ Checkbox.propTypes = {
250
254
  index: PropTypes.number,
251
255
  'aria-label': PropTypes.string,
252
256
  tabIndex: PropTypes.number,
253
- preventScroll: PropTypes.bool
257
+ preventScroll: PropTypes.bool,
258
+ type: PropTypes.string
254
259
  };
255
260
  Checkbox.defaultProps = {
256
261
  defaultChecked: false,
257
262
  indeterminate: false,
258
263
  onChange: _noop,
259
264
  onMouseEnter: _noop,
260
- onMouseLeave: _noop
265
+ onMouseLeave: _noop,
266
+ type: 'default'
261
267
  };
262
268
  export default Checkbox;
@@ -26,7 +26,7 @@ export default class DateInput extends BaseComponent<DateInputProps, {}> {
26
26
  onFocus: PropTypes.Requireable<(...args: any[]) => any>;
27
27
  value: PropTypes.Requireable<any[]>;
28
28
  disabled: PropTypes.Requireable<boolean>;
29
- type: PropTypes.Requireable<"dateTime" | "date" | "month" | "dateRange" | "year" | "dateTimeRange">;
29
+ type: PropTypes.Requireable<"date" | "month" | "dateTime" | "dateRange" | "year" | "dateTimeRange">;
30
30
  showClear: PropTypes.Requireable<boolean>;
31
31
  format: PropTypes.Requireable<string>;
32
32
  inputStyle: PropTypes.Requireable<object>;
@@ -41,7 +41,7 @@ export default class DatePicker extends BaseComponent<DatePickerProps, DatePicke
41
41
  'aria-invalid': PropTypes.Requireable<boolean>;
42
42
  'aria-labelledby': PropTypes.Requireable<string>;
43
43
  'aria-required': PropTypes.Requireable<boolean>;
44
- type: PropTypes.Requireable<"dateTime" | "date" | "month" | "dateRange" | "year" | "dateTimeRange">;
44
+ type: PropTypes.Requireable<"date" | "month" | "dateTime" | "dateRange" | "year" | "dateTimeRange">;
45
45
  size: PropTypes.Requireable<"default" | "small" | "large">;
46
46
  density: PropTypes.Requireable<"default" | "compact">;
47
47
  defaultValue: PropTypes.Requireable<string | number | object>;
@@ -17,7 +17,7 @@ export interface MonthsGridProps extends MonthsGridFoundationProps, BaseProps {
17
17
  export declare type MonthsGridState = MonthsGridFoundationState;
18
18
  export default class MonthsGrid extends BaseComponent<MonthsGridProps, MonthsGridState> {
19
19
  static propTypes: {
20
- type: PropTypes.Requireable<"dateTime" | "date" | "month" | "dateRange" | "year" | "dateTimeRange">;
20
+ type: PropTypes.Requireable<"date" | "month" | "dateTime" | "dateRange" | "year" | "dateTimeRange">;
21
21
  defaultValue: PropTypes.Requireable<string | number | object>;
22
22
  defaultPickerValue: PropTypes.Requireable<string | number | object>;
23
23
  multiple: PropTypes.Requireable<boolean>;
@@ -68,7 +68,6 @@ class Form extends BaseComponent {
68
68
 
69
69
  componentWillUnmount() {
70
70
  this.foundation.destroy();
71
- this.formApi = null;
72
71
  }
73
72
 
74
73
  get adapter() {
@@ -99,7 +99,8 @@ function withField(Component, opts) {
99
99
  if (arrayFieldState) {
100
100
  initVal = arrayFieldState.shouldUseInitValue && typeof initValue !== 'undefined' ? initValue : initValueInFormOpts;
101
101
  }
102
- } catch (err) {}
102
+ } catch (err) {} // FIXME typeof initVal
103
+
103
104
 
104
105
  const [value, setValue, getVal] = useStateWithGetter(typeof initVal !== undefined ? initVal : null);
105
106
 
@@ -1,22 +1,23 @@
1
1
  import React, { PureComponent } from 'react';
2
2
  import PropTypes from 'prop-types';
3
3
  export interface LabelProps {
4
+ /** text-align of label */
5
+ align?: string;
6
+ className?: string;
7
+ children?: React.ReactNode;
8
+ disabled?: boolean;
4
9
  id?: string;
5
10
  /** Whether to display the required * symbol */
6
11
  required?: boolean;
7
12
  /** Content of label */
8
13
  text?: React.ReactNode;
9
- disabled?: boolean;
10
14
  /** Used to configure the htmlFor attribute of the label tag */
11
15
  name?: string;
12
- /** text-align of label */
13
- align?: string;
14
16
  /** width of label */
15
17
  width?: number | string;
16
18
  style?: React.CSSProperties;
17
- className?: string;
18
- children?: React.ReactNode;
19
19
  extra?: React.ReactNode;
20
+ optional?: boolean;
20
21
  }
21
22
  export default class Label extends PureComponent<LabelProps> {
22
23
  static defaultProps: {
@@ -24,6 +25,7 @@ export default class Label extends PureComponent<LabelProps> {
24
25
  name: string;
25
26
  align: string;
26
27
  className: string;
28
+ optional: boolean;
27
29
  };
28
30
  static propTypes: {
29
31
  id: PropTypes.Requireable<string>;
@@ -37,6 +39,7 @@ export default class Label extends PureComponent<LabelProps> {
37
39
  style: PropTypes.Requireable<object>;
38
40
  className: PropTypes.Requireable<string>;
39
41
  extra: PropTypes.Requireable<PropTypes.ReactNodeLike>;
42
+ optional: PropTypes.Requireable<boolean>;
40
43
  };
41
44
  render(): JSX.Element;
42
45
  }
@@ -2,6 +2,7 @@ import React, { PureComponent } from 'react';
2
2
  import classNames from 'classnames';
3
3
  import PropTypes from 'prop-types';
4
4
  import { cssClasses } from '@douyinfe/semi-foundation/lib/es/form/constants';
5
+ import LocaleConsumer from '../locale/localeConsumer';
5
6
  const prefixCls = cssClasses.PREFIX;
6
7
  export default class Label extends PureComponent {
7
8
  render() {
@@ -16,7 +17,8 @@ export default class Label extends PureComponent {
16
17
  style,
17
18
  className,
18
19
  extra,
19
- id
20
+ id,
21
+ optional
20
22
  } = this.props;
21
23
  const labelCls = classNames(className, {
22
24
  ["".concat(prefixCls, "-field-label")]: true,
@@ -28,10 +30,15 @@ export default class Label extends PureComponent {
28
30
  });
29
31
  const labelStyle = style ? style : {};
30
32
  width ? labelStyle.width = width : null;
33
+ const optionalText = /*#__PURE__*/React.createElement(LocaleConsumer, {
34
+ componentName: "Form"
35
+ }, locale => /*#__PURE__*/React.createElement("span", {
36
+ className: "".concat(prefixCls, "-field-label-optional-text")
37
+ }, locale.optional));
31
38
  const textContent = /*#__PURE__*/React.createElement("div", {
32
39
  className: "".concat(prefixCls, "-field-label-text"),
33
40
  "x-semi-prop": "label"
34
- }, typeof text !== 'undefined' ? text : children);
41
+ }, typeof text !== 'undefined' ? text : children, optional ? optionalText : null);
35
42
  const contentWithExtra = /*#__PURE__*/React.createElement(React.Fragment, null, textContent, /*#__PURE__*/React.createElement("div", {
36
43
  className: "".concat(prefixCls, "-field-label-extra")
37
44
  }, extra));
@@ -48,7 +55,8 @@ Label.defaultProps = {
48
55
  required: false,
49
56
  name: '',
50
57
  align: 'left',
51
- className: ''
58
+ className: '',
59
+ optional: false
52
60
  };
53
61
  Label.propTypes = {
54
62
  id: PropTypes.string,
@@ -61,5 +69,6 @@ Label.propTypes = {
61
69
  width: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
62
70
  style: PropTypes.object,
63
71
  className: PropTypes.string,
64
- extra: PropTypes.node
72
+ extra: PropTypes.node,
73
+ optional: PropTypes.bool
65
74
  };
@@ -148,4 +148,7 @@ export interface Locale {
148
148
  total: string;
149
149
  selected: string;
150
150
  };
151
+ Form: {
152
+ optional: string;
153
+ };
151
154
  }
@@ -147,6 +147,9 @@ const local = {
147
147
  clearSelectAll: 'إلغاء تحديد الكل',
148
148
  total: 'مجموع ${total} العناصر',
149
149
  selected: '${total} العناصر المحدد'
150
+ },
151
+ Form: {
152
+ optional: '(اختياري)'
150
153
  }
151
154
  }; // [i18n-Arabic]
152
155
 
@@ -147,6 +147,9 @@ const local = {
147
147
  clearSelectAll: 'Alles abwählen',
148
148
  total: 'Gesamt ${total} Artikel',
149
149
  selected: '${total} ausgewählte Artikel'
150
+ },
151
+ Form: {
152
+ optional: '(Optional)'
150
153
  }
151
154
  }; // [i18n-German]
152
155
 
@@ -147,6 +147,9 @@ const local = {
147
147
  clearSelectAll: 'Unselect all',
148
148
  total: 'Total ${total} items',
149
149
  selected: '${total} items selected'
150
+ },
151
+ Form: {
152
+ optional: '(optional)'
150
153
  }
151
154
  }; // [i18n-English(GB)]
152
155
 
@@ -147,6 +147,9 @@ const local = {
147
147
  clearSelectAll: 'Unselect all',
148
148
  total: 'Total ${total} items',
149
149
  selected: '${total} items selected'
150
+ },
151
+ Form: {
152
+ optional: '(optional)'
150
153
  }
151
154
  }; // [i18n-English(US)]
152
155
 
@@ -152,6 +152,9 @@ const locale = {
152
152
  clearSelectAll: 'Deseleccionar todo',
153
153
  total: 'Total ${total} objetos',
154
154
  selected: '${total} objetos seleccionados'
155
+ },
156
+ Form: {
157
+ optional: '(opcional)'
155
158
  }
156
159
  };
157
160
  export default locale;
@@ -147,6 +147,9 @@ const local = {
147
147
  clearSelectAll: 'Désélectionner tout',
148
148
  total: 'Totale ${total} articles',
149
149
  selected: '${total} articles sélectionnés'
150
+ },
151
+ Form: {
152
+ optional: '(optionnel)'
150
153
  }
151
154
  }; // [i18n-French]
152
155
 
@@ -147,6 +147,9 @@ const local = {
147
147
  clearSelectAll: 'Nyahpilih Semua',
148
148
  total: 'Total ${total} proyek',
149
149
  selected: '${total} item dipilih'
150
+ },
151
+ Form: {
152
+ optional: '(opsional)'
150
153
  }
151
154
  }; // [i18n-Indonesia(ID)]
152
155
 
@@ -147,6 +147,9 @@ const local = {
147
147
  clearSelectAll: 'Deseleziona tutto',
148
148
  total: 'Totale ${total} elementi',
149
149
  selected: '${total} elementi selezionati'
150
+ },
151
+ Form: {
152
+ optional: '(opzionale)'
150
153
  }
151
154
  }; // [i18n-Italian]
152
155
 
@@ -148,6 +148,9 @@ const local = {
148
148
  clearSelectAll: 'すべてを選択解除',
149
149
  total: '合計 ${total} アイテム',
150
150
  selected: '選択済み ${total} アイテム'
151
+ },
152
+ Form: {
153
+ optional: '(オプション)'
151
154
  }
152
155
  }; // [i18n-Japan]
153
156
 
@@ -148,6 +148,9 @@ const local = {
148
148
  clearSelectAll: '모두 선택 취소',
149
149
  total: '총 {total} 개 항목',
150
150
  selected: '선택된 {Total} 개 항목'
151
+ },
152
+ Form: {
153
+ optional: '(선택 과목)'
151
154
  }
152
155
  }; // [i18n-Korea]
153
156
 
@@ -147,6 +147,9 @@ const local = {
147
147
  clearSelectAll: 'Nyahpilih semua',
148
148
  total: 'Jumlah ${total} item',
149
149
  selected: '${total} projek dipilih'
150
+ },
151
+ Form: {
152
+ optional: '(pilihan)'
150
153
  }
151
154
  }; // [i18n-Malaysia(MY)]
152
155