@douyinfe/semi-ui 2.26.0 → 2.27.0-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 (71) hide show
  1. package/dist/css/semi.css +207 -0
  2. package/dist/css/semi.min.css +1 -1
  3. package/dist/umd/semi-ui.js +314 -198
  4. package/dist/umd/semi-ui.js.map +1 -1
  5. package/dist/umd/semi-ui.min.js +1 -1
  6. package/dist/umd/semi-ui.min.js.map +1 -1
  7. package/lib/cjs/anchor/index.d.ts +1 -1
  8. package/lib/cjs/autoComplete/index.d.ts +1 -1
  9. package/lib/cjs/button/Button.d.ts +1 -1
  10. package/lib/cjs/button/buttonGroup.d.ts +1 -1
  11. package/lib/cjs/button/index.d.ts +1 -1
  12. package/lib/cjs/carousel/CarouselIndicator.d.ts +1 -1
  13. package/lib/cjs/carousel/index.d.ts +1 -1
  14. package/lib/cjs/cascader/index.d.ts +1 -1
  15. package/lib/cjs/cascader/item.d.ts +1 -1
  16. package/lib/cjs/datePicker/dateInput.d.ts +1 -1
  17. package/lib/cjs/datePicker/datePicker.d.ts +2 -2
  18. package/lib/cjs/datePicker/monthsGrid.d.ts +1 -1
  19. package/lib/cjs/form/baseForm.d.ts +1 -1
  20. package/lib/cjs/form/field.d.ts +1 -1
  21. package/lib/cjs/input/index.d.ts +1 -1
  22. package/lib/cjs/input/inputGroup.d.ts +1 -1
  23. package/lib/cjs/popover/index.d.ts +1 -1
  24. package/lib/cjs/rating/index.d.ts +1 -1
  25. package/lib/cjs/rating/item.d.ts +1 -1
  26. package/lib/cjs/switch/index.d.ts +1 -1
  27. package/lib/cjs/table/Table.d.ts +2 -2
  28. package/lib/cjs/table/index.d.ts +1 -1
  29. package/lib/cjs/tabs/TabBar.d.ts +1 -0
  30. package/lib/cjs/tabs/TabBar.js +28 -2
  31. package/lib/cjs/tabs/TabItem.d.ts +38 -0
  32. package/lib/cjs/tabs/TabItem.js +104 -0
  33. package/lib/cjs/tabs/index.d.ts +2 -0
  34. package/lib/cjs/tabs/index.js +3 -0
  35. package/lib/cjs/tagInput/index.d.ts +1 -1
  36. package/lib/cjs/timePicker/TimePicker.d.ts +1 -1
  37. package/lib/cjs/timePicker/index.d.ts +1 -1
  38. package/lib/cjs/tooltip/index.d.ts +1 -1
  39. package/lib/es/anchor/index.d.ts +1 -1
  40. package/lib/es/autoComplete/index.d.ts +1 -1
  41. package/lib/es/button/Button.d.ts +1 -1
  42. package/lib/es/button/buttonGroup.d.ts +1 -1
  43. package/lib/es/button/index.d.ts +1 -1
  44. package/lib/es/carousel/CarouselIndicator.d.ts +1 -1
  45. package/lib/es/carousel/index.d.ts +1 -1
  46. package/lib/es/cascader/index.d.ts +1 -1
  47. package/lib/es/cascader/item.d.ts +1 -1
  48. package/lib/es/datePicker/dateInput.d.ts +1 -1
  49. package/lib/es/datePicker/datePicker.d.ts +2 -2
  50. package/lib/es/datePicker/monthsGrid.d.ts +1 -1
  51. package/lib/es/form/baseForm.d.ts +1 -1
  52. package/lib/es/form/field.d.ts +1 -1
  53. package/lib/es/input/index.d.ts +1 -1
  54. package/lib/es/input/inputGroup.d.ts +1 -1
  55. package/lib/es/popover/index.d.ts +1 -1
  56. package/lib/es/rating/index.d.ts +1 -1
  57. package/lib/es/rating/item.d.ts +1 -1
  58. package/lib/es/switch/index.d.ts +1 -1
  59. package/lib/es/table/Table.d.ts +2 -2
  60. package/lib/es/table/index.d.ts +1 -1
  61. package/lib/es/tabs/TabBar.d.ts +1 -0
  62. package/lib/es/tabs/TabBar.js +27 -2
  63. package/lib/es/tabs/TabItem.d.ts +38 -0
  64. package/lib/es/tabs/TabItem.js +88 -0
  65. package/lib/es/tabs/index.d.ts +2 -0
  66. package/lib/es/tabs/index.js +2 -0
  67. package/lib/es/tagInput/index.d.ts +1 -1
  68. package/lib/es/timePicker/TimePicker.d.ts +1 -1
  69. package/lib/es/timePicker/index.d.ts +1 -1
  70. package/lib/es/tooltip/index.d.ts +1 -1
  71. package/package.json +8 -8
@@ -48,7 +48,7 @@ export default class Item extends PureComponent<CascaderItemProps> {
48
48
  onItemClick: PropTypes.Requireable<(...args: any[]) => any>;
49
49
  onItemHover: PropTypes.Requireable<(...args: any[]) => any>;
50
50
  multiple: PropTypes.Requireable<boolean>;
51
- showNext: PropTypes.Requireable<"hover" | "click">;
51
+ showNext: PropTypes.Requireable<"click" | "hover">;
52
52
  checkedKeys: PropTypes.Requireable<object>;
53
53
  halfCheckedKeys: PropTypes.Requireable<object>;
54
54
  onItemCheckboxClick: PropTypes.Requireable<(...args: any[]) => any>;
@@ -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>;
@@ -46,8 +46,8 @@ export default class DatePicker extends BaseComponent<DatePickerProps, DatePicke
46
46
  'aria-invalid': PropTypes.Requireable<boolean>;
47
47
  'aria-labelledby': PropTypes.Requireable<string>;
48
48
  'aria-required': PropTypes.Requireable<boolean>;
49
- type: PropTypes.Requireable<"dateTime" | "date" | "month" | "dateRange" | "year" | "dateTimeRange">;
50
- size: PropTypes.Requireable<"default" | "small" | "large">;
49
+ type: PropTypes.Requireable<"date" | "month" | "dateTime" | "dateRange" | "year" | "dateTimeRange">;
50
+ size: PropTypes.Requireable<"small" | "default" | "large">;
51
51
  clearIcon: PropTypes.Requireable<PropTypes.ReactNodeLike>;
52
52
  density: PropTypes.Requireable<"default" | "compact">;
53
53
  defaultValue: PropTypes.Requireable<NonNullable<string | number | object>>;
@@ -19,7 +19,7 @@ export interface MonthsGridProps extends MonthsGridFoundationProps, BaseProps {
19
19
  export declare type MonthsGridState = MonthsGridFoundationState;
20
20
  export default class MonthsGrid extends BaseComponent<MonthsGridProps, MonthsGridState> {
21
21
  static propTypes: {
22
- type: PropTypes.Requireable<"dateTime" | "date" | "month" | "dateRange" | "year" | "dateTimeRange">;
22
+ type: PropTypes.Requireable<"date" | "month" | "dateTime" | "dateRange" | "year" | "dateTimeRange">;
23
23
  defaultValue: PropTypes.Requireable<NonNullable<string | number | object>>;
24
24
  defaultPickerValue: PropTypes.Requireable<NonNullable<string | number | object>>;
25
25
  multiple: PropTypes.Requireable<boolean>;
@@ -135,7 +135,7 @@ declare class Form<Values extends Record<string, any> = any> extends BaseCompone
135
135
  preventScroll?: boolean;
136
136
  showRestTagsPopover?: boolean;
137
137
  restTagsPopoverProps?: import("../popover").PopoverProps;
138
- } & Pick<import("../tooltip").TooltipProps, "stopPropagation" | "motion" | "getPopupContainer" | "spacing" | "mouseEnterDelay" | "autoAdjustOverflow" | "mouseLeaveDelay"> & React.RefAttributes<any> & import("./interface").CommonFieldProps, import("./interface").CommonexcludeType>> & import("./interface").SelectStatic;
138
+ } & Pick<import("../tooltip").TooltipProps, "motion" | "stopPropagation" | "getPopupContainer" | "spacing" | "mouseEnterDelay" | "autoAdjustOverflow" | "mouseLeaveDelay"> & React.RefAttributes<any> & import("./interface").CommonFieldProps, import("./interface").CommonexcludeType>> & import("./interface").SelectStatic;
139
139
  static Checkbox: React.ComponentType<import("utility-types").Subtract<import("./interface").CommonFieldProps, import("./interface").RadioCheckboxExcludeProps> & import("../checkbox").CheckboxProps & import("./interface").RCIncludeType>;
140
140
  static CheckboxGroup: React.ComponentType<import("utility-types").Subtract<import("../checkbox").CheckboxGroupProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps & React.RefAttributes<any>>;
141
141
  static Radio: React.ComponentType<import("utility-types").Subtract<import("./interface").CommonFieldProps, import("./interface").RadioCheckboxExcludeProps> & import("../radio").RadioProps & import("./interface").RCIncludeType>;
@@ -83,7 +83,7 @@ declare const FormSelect: import("react").ComponentType<import("utility-types").
83
83
  preventScroll?: boolean;
84
84
  showRestTagsPopover?: boolean;
85
85
  restTagsPopoverProps?: import("../popover").PopoverProps;
86
- } & Pick<import("../tooltip").TooltipProps, "stopPropagation" | "motion" | "getPopupContainer" | "spacing" | "mouseEnterDelay" | "autoAdjustOverflow" | "mouseLeaveDelay"> & import("react").RefAttributes<any> & import("./interface").CommonFieldProps, import("./interface").CommonexcludeType>> & import("./interface").SelectStatic;
86
+ } & Pick<import("../tooltip").TooltipProps, "motion" | "stopPropagation" | "getPopupContainer" | "spacing" | "mouseEnterDelay" | "autoAdjustOverflow" | "mouseLeaveDelay"> & import("react").RefAttributes<any> & import("./interface").CommonFieldProps, import("./interface").CommonexcludeType>> & import("./interface").SelectStatic;
87
87
  declare const FormCheckboxGroup: import("react").ComponentType<import("utility-types").Subtract<import("../checkbox/checkboxGroup").CheckboxGroupProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps & import("react").RefAttributes<any>>;
88
88
  declare const FormCheckbox: import("react").ComponentType<import("utility-types").Subtract<import("./interface").CommonFieldProps, import("./interface").RadioCheckboxExcludeProps> & import("../checkbox/checkbox").CheckboxProps & import("./interface").RCIncludeType>;
89
89
  declare const FormRadioGroup: import("react").ComponentType<import("utility-types").Subtract<import("../radio/radioGroup").RadioGroupProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps & import("react").RefAttributes<any>>;
@@ -83,7 +83,7 @@ declare class Input extends BaseComponent<InputProps, InputState> {
83
83
  showClear: PropTypes.Requireable<boolean>;
84
84
  hideSuffix: PropTypes.Requireable<boolean>;
85
85
  placeholder: PropTypes.Requireable<any>;
86
- size: PropTypes.Requireable<"default" | "small" | "large">;
86
+ size: PropTypes.Requireable<"small" | "default" | "large">;
87
87
  className: PropTypes.Requireable<string>;
88
88
  style: PropTypes.Requireable<object>;
89
89
  validateStatus: PropTypes.Requireable<"default" | "error" | "warning" | "success">;
@@ -21,7 +21,7 @@ export default class inputGroup extends BaseComponent<InputGroupProps, InputGrou
21
21
  static propTypes: {
22
22
  className: PropTypes.Requireable<string>;
23
23
  children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
24
- size: PropTypes.Requireable<"default" | "small" | "large">;
24
+ size: PropTypes.Requireable<"small" | "default" | "large">;
25
25
  style: PropTypes.Requireable<object>;
26
26
  onBlur: PropTypes.Requireable<(...args: any[]) => any>;
27
27
  onFocus: PropTypes.Requireable<(...args: any[]) => any>;
@@ -58,7 +58,7 @@ declare class Popover extends React.PureComponent<PopoverProps, PopoverState> {
58
58
  margin: PropTypes.Requireable<NonNullable<number | object>>;
59
59
  mouseEnterDelay: PropTypes.Requireable<number>;
60
60
  mouseLeaveDelay: PropTypes.Requireable<number>;
61
- trigger: PropTypes.Validator<NonNullable<"hover" | "focus" | "click" | "custom">>;
61
+ trigger: PropTypes.Validator<NonNullable<"click" | "focus" | "hover" | "custom">>;
62
62
  contentClassName: PropTypes.Requireable<NonNullable<string | any[]>>;
63
63
  onVisibleChange: PropTypes.Requireable<(...args: any[]) => any>;
64
64
  onClickOutSide: PropTypes.Requireable<(...args: any[]) => any>;
@@ -69,7 +69,7 @@ export default class Rating extends BaseComponent<RatingProps, RatingState> {
69
69
  onBlur: PropTypes.Requireable<(...args: any[]) => any>;
70
70
  onKeyDown: PropTypes.Requireable<(...args: any[]) => any>;
71
71
  autoFocus: PropTypes.Requireable<boolean>;
72
- size: PropTypes.Requireable<NonNullable<number | "default" | "small">>;
72
+ size: PropTypes.Requireable<NonNullable<number | "small" | "default">>;
73
73
  tooltips: PropTypes.Requireable<string[]>;
74
74
  id: PropTypes.Requireable<string>;
75
75
  preventScroll: PropTypes.Requireable<boolean>;
@@ -40,7 +40,7 @@ export default class Item extends BaseComponent<RatingItemProps, RatingItemState
40
40
  disabled: PropTypes.Requireable<boolean>;
41
41
  count: PropTypes.Requireable<number>;
42
42
  ariaLabelPrefix: PropTypes.Requireable<string>;
43
- size: PropTypes.Requireable<NonNullable<number | "default" | "small">>;
43
+ size: PropTypes.Requireable<NonNullable<number | "small" | "default">>;
44
44
  'aria-describedby': PropTypes.Requireable<string>;
45
45
  onFocus: PropTypes.Requireable<(...args: any[]) => any>;
46
46
  onBlur: PropTypes.Requireable<(...args: any[]) => any>;
@@ -45,7 +45,7 @@ declare class Switch extends BaseComponent<SwitchProps, SwitchState> {
45
45
  onMouseEnter: PropTypes.Requireable<(...args: any[]) => any>;
46
46
  onMouseLeave: PropTypes.Requireable<(...args: any[]) => any>;
47
47
  style: PropTypes.Requireable<object>;
48
- size: PropTypes.Requireable<"default" | "small" | "large">;
48
+ size: PropTypes.Requireable<"small" | "default" | "large">;
49
49
  uncheckedText: PropTypes.Requireable<PropTypes.ReactNodeLike>;
50
50
  id: PropTypes.Requireable<string>;
51
51
  };
@@ -52,7 +52,7 @@ declare class Table<RecordType extends Record<string, any>> extends BaseComponen
52
52
  components: PropTypes.Requireable<any>;
53
53
  bordered: PropTypes.Requireable<boolean>;
54
54
  loading: PropTypes.Requireable<boolean>;
55
- size: PropTypes.Requireable<"default" | "small" | "middle">;
55
+ size: PropTypes.Requireable<"small" | "default" | "middle">;
56
56
  tableLayout: PropTypes.Requireable<"" | "fixed" | "auto">;
57
57
  columns: PropTypes.Requireable<PropTypes.InferProps<{
58
58
  align: PropTypes.Requireable<"left" | "right" | "center">;
@@ -289,7 +289,7 @@ declare class Table<RecordType extends Record<string, any>> extends BaseComponen
289
289
  showTotal?: boolean;
290
290
  pageSize?: number;
291
291
  pageSizeOpts?: number[];
292
- size?: "default" | "small";
292
+ size?: "small" | "default";
293
293
  currentPage?: number;
294
294
  defaultCurrentPage?: number;
295
295
  onPageChange?: (currentPage: number) => void;
@@ -15,7 +15,7 @@ declare class Table<RecordType extends Record<string, any> = Data> extends React
15
15
  components: PropTypes.Requireable<any>;
16
16
  bordered: PropTypes.Requireable<boolean>;
17
17
  loading: PropTypes.Requireable<boolean>;
18
- size: PropTypes.Requireable<"default" | "small" | "middle">;
18
+ size: PropTypes.Requireable<"small" | "default" | "middle">;
19
19
  tableLayout: PropTypes.Requireable<"" | "fixed" | "auto">;
20
20
  columns: PropTypes.Requireable<PropTypes.InferProps<{
21
21
  align: PropTypes.Requireable<"left" | "right" | "center">;
@@ -31,6 +31,7 @@ declare class TabBar extends React.Component<TabBarProps, TabBarState> {
31
31
  renderExtra(): ReactNode;
32
32
  handleItemClick: (itemKey: string, e: MouseEvent<Element>) => void;
33
33
  handleKeyDown: (event: React.KeyboardEvent, itemKey: string, closable: boolean) => void;
34
+ renderTabItemInOverflowList: (panel: PlainTab) => ReactNode;
34
35
  renderTabItem: (panel: PlainTab) => ReactNode;
35
36
  renderTabComponents: (list: Array<PlainTab>) => Array<ReactNode>;
36
37
  handleArrowClick: (items: Array<OverflowItem>, pos: 'start' | 'end') => void;
@@ -21,6 +21,7 @@ import Dropdown from '../dropdown';
21
21
  import Button from '../button';
22
22
  import { IconChevronRight, IconChevronLeft, IconClose } from '@douyinfe/semi-icons';
23
23
  import { getUuidv4 } from '@douyinfe/semi-foundation/lib/es/utils/uuid';
24
+ import TabItem from './TabItem';
24
25
 
25
26
  class TabBar extends React.Component {
26
27
  constructor(props) {
@@ -46,7 +47,7 @@ class TabBar extends React.Component {
46
47
  this.props.handleKeyDown(event, itemKey, closable);
47
48
  };
48
49
 
49
- this.renderTabItem = panel => {
50
+ this.renderTabItemInOverflowList = panel => {
50
51
  const {
51
52
  size,
52
53
  type,
@@ -91,6 +92,30 @@ class TabBar extends React.Component {
91
92
  }), panelIcon, panel.tab, closableIcon);
92
93
  };
93
94
 
95
+ this.renderTabItem = panel => {
96
+ const {
97
+ size,
98
+ type,
99
+ deleteTabItem,
100
+ handleKeyDown,
101
+ tabPosition
102
+ } = this.props;
103
+
104
+ const isSelected = this._isActive(panel.itemKey);
105
+
106
+ return /*#__PURE__*/React.createElement(TabItem, Object.assign({
107
+ key: this._getItemKey(panel.itemKey)
108
+ }, panel, {
109
+ selected: isSelected,
110
+ size: size,
111
+ type: type,
112
+ tabPosition: tabPosition,
113
+ handleKeyDown: handleKeyDown,
114
+ deleteTabItem: deleteTabItem,
115
+ onClick: this.handleItemClick
116
+ }));
117
+ };
118
+
94
119
  this.renderTabComponents = list => list.map(panel => this.renderTabItem(panel));
95
120
 
96
121
  this.handleArrowClick = (items, pos) => {
@@ -194,7 +219,7 @@ class TabBar extends React.Component {
194
219
  overflowRenderer: this.renderOverflow,
195
220
  renderMode: "scroll",
196
221
  className: "".concat(cssClasses.TABS_BAR, "-overflow-list"),
197
- visibleItemRenderer: this.renderTabItem
222
+ visibleItemRenderer: this.renderTabItemInOverflowList
198
223
  });
199
224
  };
200
225
 
@@ -0,0 +1,38 @@
1
+ import React, { ReactNode, MouseEvent } from 'react';
2
+ import PropTypes from 'prop-types';
3
+ import { TabType, TabSize, TabPosition } from './interface';
4
+ export interface TabItemProps {
5
+ tab?: ReactNode;
6
+ icon?: ReactNode;
7
+ size?: TabSize;
8
+ type?: TabType;
9
+ tabPosition?: TabPosition;
10
+ selected?: boolean;
11
+ closable?: boolean;
12
+ disabled?: boolean;
13
+ itemKey?: string;
14
+ handleKeyDown?: (event: React.KeyboardEvent, itemKey: string, closable: boolean) => void;
15
+ deleteTabItem?: (tabKey: string, event: MouseEvent<Element>) => void;
16
+ onClick?: (itemKey: string, e: MouseEvent<Element>) => void;
17
+ }
18
+ export default class TabItem extends React.Component<TabItemProps> {
19
+ static propsTypes: {
20
+ tab: PropTypes.Requireable<PropTypes.ReactNodeLike>;
21
+ icon: PropTypes.Requireable<PropTypes.ReactNodeLike>;
22
+ size: PropTypes.Requireable<string>;
23
+ type: PropTypes.Requireable<string>;
24
+ tabPosition: PropTypes.Requireable<string>;
25
+ selected: PropTypes.Requireable<boolean>;
26
+ closable: PropTypes.Requireable<boolean>;
27
+ disabled: PropTypes.Requireable<boolean>;
28
+ itemKey: PropTypes.Requireable<string>;
29
+ handleKeyDown: PropTypes.Requireable<(...args: any[]) => any>;
30
+ deleteTabItem: PropTypes.Requireable<(...args: any[]) => any>;
31
+ onClick: PropTypes.Requireable<(...args: any[]) => any>;
32
+ };
33
+ static elementType: string;
34
+ renderIcon(icon: ReactNode): ReactNode;
35
+ handleKeyDown: (event: React.KeyboardEvent) => void;
36
+ handleClick: (e: React.MouseEvent) => void;
37
+ render(): JSX.Element;
38
+ }
@@ -0,0 +1,88 @@
1
+ import React from 'react';
2
+ import PropTypes from 'prop-types';
3
+ import cls from 'classnames';
4
+ import { cssClasses, strings } from '@douyinfe/semi-foundation/lib/es/tabs/constants';
5
+ import { IconClose } from '@douyinfe/semi-icons';
6
+ export default class TabItem extends React.Component {
7
+ constructor() {
8
+ super(...arguments);
9
+
10
+ this.handleKeyDown = event => {
11
+ const {
12
+ itemKey,
13
+ closable,
14
+ handleKeyDown
15
+ } = this.props;
16
+ handleKeyDown && handleKeyDown(event, itemKey, closable);
17
+ };
18
+
19
+ this.handleClick = e => {
20
+ const {
21
+ itemKey,
22
+ onClick,
23
+ disabled
24
+ } = this.props;
25
+ !disabled && onClick && onClick(itemKey, e);
26
+ };
27
+ }
28
+
29
+ renderIcon(icon) {
30
+ return /*#__PURE__*/React.createElement("span", null, icon);
31
+ }
32
+
33
+ render() {
34
+ const {
35
+ tab,
36
+ size,
37
+ type,
38
+ icon,
39
+ selected,
40
+ closable,
41
+ disabled,
42
+ itemKey,
43
+ deleteTabItem,
44
+ tabPosition
45
+ } = this.props;
46
+ const panelIcon = icon ? this.renderIcon(icon) : null;
47
+ const className = cls(cssClasses.TABS_TAB, "".concat(cssClasses.TABS_TAB, "-").concat(type), "".concat(cssClasses.TABS_TAB, "-").concat(tabPosition), "".concat(cssClasses.TABS_TAB, "-single"), {
48
+ [cssClasses.TABS_TAB_ACTIVE]: selected,
49
+ [cssClasses.TABS_TAB_DISABLED]: disabled,
50
+ ["".concat(cssClasses.TABS_TAB, "-small")]: size === 'small',
51
+ ["".concat(cssClasses.TABS_TAB, "-medium")]: size === 'medium'
52
+ });
53
+ const closableIcon = type === 'card' && closable ? /*#__PURE__*/React.createElement(IconClose, {
54
+ "aria-label": "Close",
55
+ role: "button",
56
+ className: "".concat(cssClasses.TABS_TAB, "-icon-close"),
57
+ onClick: e => deleteTabItem(itemKey, e)
58
+ }) : null;
59
+ return /*#__PURE__*/React.createElement("div", {
60
+ role: "tab",
61
+ id: "semiTab".concat(itemKey),
62
+ "data-tabkey": "semiTab".concat(itemKey),
63
+ "aria-controls": "semiTabPanel".concat(itemKey),
64
+ "aria-disabled": disabled ? 'true' : 'false',
65
+ "aria-selected": selected ? 'true' : 'false',
66
+ tabIndex: selected ? 0 : -1,
67
+ onKeyDown: this.handleKeyDown,
68
+ onClick: this.handleClick,
69
+ className: className
70
+ }, panelIcon, tab, closableIcon);
71
+ }
72
+
73
+ }
74
+ TabItem.propsTypes = {
75
+ tab: PropTypes.node,
76
+ icon: PropTypes.node,
77
+ size: PropTypes.oneOf(strings.SIZE),
78
+ type: PropTypes.oneOf(strings.TYPE_MAP),
79
+ tabPosition: PropTypes.oneOf(strings.POSITION_MAP),
80
+ selected: PropTypes.bool,
81
+ closable: PropTypes.bool,
82
+ disabled: PropTypes.bool,
83
+ itemKey: PropTypes.string,
84
+ handleKeyDown: PropTypes.func,
85
+ deleteTabItem: PropTypes.func,
86
+ onClick: PropTypes.func
87
+ };
88
+ TabItem.elementType = 'TabItem';
@@ -4,6 +4,7 @@ import TabsFoundation, { TabsAdapter } from '@douyinfe/semi-foundation/lib/es/ta
4
4
  import BaseComponent from '../_base/baseComponent';
5
5
  import '@douyinfe/semi-foundation/lib/es/tabs/tabs.css';
6
6
  import TabPane from './TabPane';
7
+ import TabItem from './TabItem';
7
8
  import { PlainTab, TabsProps } from './interface';
8
9
  export * from './interface';
9
10
  export interface TabsState {
@@ -14,6 +15,7 @@ export interface TabsState {
14
15
  }
15
16
  declare class Tabs extends BaseComponent<TabsProps, TabsState> {
16
17
  static TabPane: typeof TabPane;
18
+ static TabItem: typeof TabItem;
17
19
  static propTypes: {
18
20
  activeKey: PropTypes.Requireable<string>;
19
21
  className: PropTypes.Requireable<string>;
@@ -23,6 +23,7 @@ import BaseComponent from '../_base/baseComponent';
23
23
  import '@douyinfe/semi-foundation/lib/es/tabs/tabs.css';
24
24
  import TabBar from './TabBar';
25
25
  import TabPane from './TabPane';
26
+ import TabItem from './TabItem';
26
27
  import TabsContext from './tabs-context';
27
28
  const panePickKeys = ['className', 'style', 'disabled', 'itemKey', 'tab', 'icon'];
28
29
  export * from './interface';
@@ -335,6 +336,7 @@ class Tabs extends BaseComponent {
335
336
  }
336
337
 
337
338
  Tabs.TabPane = TabPane;
339
+ Tabs.TabItem = TabItem;
338
340
  Tabs.propTypes = {
339
341
  activeKey: PropTypes.string,
340
342
  className: PropTypes.string,
@@ -92,7 +92,7 @@ declare class TagInput extends BaseComponent<TagInputProps, TagInputState> {
92
92
  onAdd: PropTypes.Requireable<(...args: any[]) => any>;
93
93
  onRemove: PropTypes.Requireable<(...args: any[]) => any>;
94
94
  onKeyDown: PropTypes.Requireable<(...args: any[]) => any>;
95
- size: PropTypes.Requireable<"default" | "small" | "large">;
95
+ size: PropTypes.Requireable<"small" | "default" | "large">;
96
96
  validateStatus: PropTypes.Requireable<"default" | "error" | "warning" | "success">;
97
97
  prefix: PropTypes.Requireable<NonNullable<PropTypes.ReactNodeLike>>;
98
98
  suffix: PropTypes.Requireable<NonNullable<PropTypes.ReactNodeLike>>;
@@ -130,7 +130,7 @@ export default class TimePicker extends BaseComponent<TimePickerProps, TimePicke
130
130
  secondStep: PropTypes.Requireable<number>;
131
131
  focusOnOpen: PropTypes.Requireable<boolean>;
132
132
  autoFocus: PropTypes.Requireable<boolean>;
133
- size: PropTypes.Requireable<"default" | "small" | "large">;
133
+ size: PropTypes.Requireable<"small" | "default" | "large">;
134
134
  panels: PropTypes.Requireable<PropTypes.InferProps<{
135
135
  panelHeader: PropTypes.Requireable<NonNullable<PropTypes.ReactNodeLike>>;
136
136
  panelFooter: PropTypes.Requireable<NonNullable<PropTypes.ReactNodeLike>>;
@@ -48,7 +48,7 @@ export default class LocaleTimePicker extends React.PureComponent<LocalePickerPr
48
48
  secondStep: import("prop-types").Requireable<number>;
49
49
  focusOnOpen: import("prop-types").Requireable<boolean>;
50
50
  autoFocus: import("prop-types").Requireable<boolean>;
51
- size: import("prop-types").Requireable<"default" | "small" | "large">;
51
+ size: import("prop-types").Requireable<"small" | "default" | "large">;
52
52
  panels: import("prop-types").Requireable<import("prop-types").InferProps<{
53
53
  panelHeader: import("prop-types").Requireable<NonNullable<import("prop-types").ReactNodeLike>>;
54
54
  panelFooter: import("prop-types").Requireable<NonNullable<import("prop-types").ReactNodeLike>>;
@@ -90,7 +90,7 @@ export default class Tooltip extends BaseComponent<TooltipProps, TooltipState> {
90
90
  getPopupContainer: PropTypes.Requireable<(...args: any[]) => any>;
91
91
  mouseEnterDelay: PropTypes.Requireable<number>;
92
92
  mouseLeaveDelay: PropTypes.Requireable<number>;
93
- trigger: PropTypes.Validator<NonNullable<"hover" | "focus" | "click" | "custom">>;
93
+ trigger: PropTypes.Validator<NonNullable<"click" | "focus" | "hover" | "custom">>;
94
94
  className: PropTypes.Requireable<string>;
95
95
  wrapperClassName: PropTypes.Requireable<string>;
96
96
  clickToHide: PropTypes.Requireable<boolean>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@douyinfe/semi-ui",
3
- "version": "2.26.0",
3
+ "version": "2.27.0-alpha.0",
4
4
  "description": "",
5
5
  "main": "lib/cjs/index.js",
6
6
  "module": "lib/es/index.js",
@@ -17,12 +17,12 @@
17
17
  "lib/*"
18
18
  ],
19
19
  "dependencies": {
20
- "@douyinfe/semi-animation": "2.26.0",
21
- "@douyinfe/semi-animation-react": "2.26.0",
22
- "@douyinfe/semi-foundation": "2.26.0",
23
- "@douyinfe/semi-icons": "2.26.0",
24
- "@douyinfe/semi-illustrations": "2.26.0",
25
- "@douyinfe/semi-theme-default": "2.26.0",
20
+ "@douyinfe/semi-animation": "2.27.0-alpha.0",
21
+ "@douyinfe/semi-animation-react": "2.27.0-alpha.0",
22
+ "@douyinfe/semi-foundation": "2.27.0-alpha.0",
23
+ "@douyinfe/semi-icons": "2.27.0-alpha.0",
24
+ "@douyinfe/semi-illustrations": "2.27.0-alpha.0",
25
+ "@douyinfe/semi-theme-default": "2.27.0-alpha.0",
26
26
  "async-validator": "^3.5.0",
27
27
  "classnames": "^2.2.6",
28
28
  "copy-text-to-clipboard": "^2.1.1",
@@ -69,7 +69,7 @@
69
69
  ],
70
70
  "author": "",
71
71
  "license": "MIT",
72
- "gitHead": "7fed74a6b19a9bf9d45f56eb36c97fce0ac9de76",
72
+ "gitHead": "3e818e5687041820aab8c5094c3b6fae7c8f2049",
73
73
  "devDependencies": {
74
74
  "@babel/plugin-proposal-decorators": "^7.15.8",
75
75
  "@babel/plugin-transform-runtime": "^7.15.8",