@douyinfe/semi-ui 2.22.2 → 2.23.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 (53) hide show
  1. package/dist/css/semi.css +8 -1
  2. package/dist/css/semi.min.css +1 -1
  3. package/dist/umd/semi-ui.js +69 -35
  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/form/baseForm.d.ts +4 -4
  8. package/lib/cjs/form/errorMessage.d.ts +2 -1
  9. package/lib/cjs/form/hooks/useFormState.d.ts +2 -1
  10. package/lib/cjs/form/interface.d.ts +15 -15
  11. package/lib/cjs/image/image.js +12 -0
  12. package/lib/cjs/image/interface.d.ts +1 -1
  13. package/lib/cjs/image/preview.d.ts +1 -1
  14. package/lib/cjs/image/preview.js +2 -2
  15. package/lib/cjs/image/previewImage.d.ts +1 -1
  16. package/lib/cjs/image/previewImage.js +1 -1
  17. package/lib/cjs/image/previewInner.d.ts +1 -1
  18. package/lib/cjs/image/previewInner.js +13 -5
  19. package/lib/cjs/locale/source/tr_TR.js +2 -2
  20. package/lib/cjs/navigation/Item.d.ts +3 -0
  21. package/lib/cjs/navigation/Item.js +9 -5
  22. package/lib/cjs/table/Body/index.js +2 -2
  23. package/lib/cjs/table/Table.js +3 -2
  24. package/lib/cjs/tabs/TabPane.js +4 -3
  25. package/lib/cjs/tabs/interface.d.ts +1 -0
  26. package/lib/cjs/tagInput/index.d.ts +1 -1
  27. package/lib/cjs/tagInput/index.js +6 -4
  28. package/lib/cjs/transfer/index.d.ts +1 -0
  29. package/lib/cjs/transfer/index.js +7 -1
  30. package/lib/es/form/baseForm.d.ts +4 -4
  31. package/lib/es/form/errorMessage.d.ts +2 -1
  32. package/lib/es/form/hooks/useFormState.d.ts +2 -1
  33. package/lib/es/form/interface.d.ts +15 -15
  34. package/lib/es/image/image.js +11 -0
  35. package/lib/es/image/interface.d.ts +1 -1
  36. package/lib/es/image/preview.d.ts +1 -1
  37. package/lib/es/image/preview.js +2 -2
  38. package/lib/es/image/previewImage.d.ts +1 -1
  39. package/lib/es/image/previewImage.js +1 -1
  40. package/lib/es/image/previewInner.d.ts +1 -1
  41. package/lib/es/image/previewInner.js +13 -5
  42. package/lib/es/locale/source/tr_TR.js +2 -2
  43. package/lib/es/navigation/Item.d.ts +3 -0
  44. package/lib/es/navigation/Item.js +9 -5
  45. package/lib/es/table/Body/index.js +3 -3
  46. package/lib/es/table/Table.js +3 -2
  47. package/lib/es/tabs/TabPane.js +4 -3
  48. package/lib/es/tabs/interface.d.ts +1 -0
  49. package/lib/es/tagInput/index.d.ts +1 -1
  50. package/lib/es/tagInput/index.js +6 -4
  51. package/lib/es/transfer/index.d.ts +1 -0
  52. package/lib/es/transfer/index.js +7 -1
  53. package/package.json +7 -7
@@ -105,11 +105,19 @@ export default class PreviewInner extends BaseComponent {
105
105
  get adapter() {
106
106
  return Object.assign(Object.assign({}, super.adapter), {
107
107
  getIsInGroup: () => this.isInGroup(),
108
- notifyChange: index => {
108
+ notifyChange: (index, direction) => {
109
109
  const {
110
- onChange
110
+ onChange,
111
+ onPrev,
112
+ onNext
111
113
  } = this.props;
112
114
  _isFunction(onChange) && onChange(index);
115
+
116
+ if (direction === "prev") {
117
+ onPrev && onPrev(index);
118
+ } else {
119
+ onNext && onNext(index);
120
+ }
113
121
  },
114
122
  notifyZoom: (zoom, increase) => {
115
123
  const {
@@ -143,9 +151,9 @@ export default class PreviewInner extends BaseComponent {
143
151
  },
144
152
  notifyRotateChange: angle => {
145
153
  const {
146
- onRotateChange
154
+ onRotateLeft
147
155
  } = this.props;
148
- _isFunction(onRotateChange) && onRotateChange(angle);
156
+ _isFunction(onRotateLeft) && onRotateLeft(angle);
149
157
  },
150
158
  notifyDownload: (src, index) => {
151
159
  const {
@@ -403,7 +411,7 @@ PreviewInner.propTypes = {
403
411
  onNext: PropTypes.func,
404
412
  onDownload: PropTypes.func,
405
413
  onRatioChange: PropTypes.func,
406
- onRotateChange: PropTypes.func
414
+ onRotateLeft: PropTypes.func
407
415
  };
408
416
  PreviewInner.defaultProps = {
409
417
  showTooltip: false,
@@ -80,8 +80,8 @@ const local = {
80
80
  Wed: 'Çar',
81
81
  Thu: 'Perş',
82
82
  Fri: 'Cum',
83
- Sat: 'Oturdu',
84
- Sun: 'Güneş'
83
+ Sat: 'Cmt',
84
+ Sun: 'Paz'
85
85
  },
86
86
  localeFormatToken: {
87
87
  FORMAT_SWITCH_DATE: 'yyyy-MM-dd'
@@ -12,6 +12,7 @@ export interface NavItemProps extends ItemProps, BaseProps {
12
12
  level?: number;
13
13
  link?: string;
14
14
  linkOptions?: React.AnchorHTMLAttributes<HTMLAnchorElement>;
15
+ tabIndex?: number;
15
16
  text?: React.ReactNode;
16
17
  tooltipHideDelay?: number;
17
18
  tooltipShowDelay?: number;
@@ -45,6 +46,7 @@ export default class NavItem extends BaseComponent<NavItemProps, NavItemState> {
45
46
  link: PropTypes.Requireable<string>;
46
47
  linkOptions: PropTypes.Requireable<object>;
47
48
  disabled: PropTypes.Requireable<boolean>;
49
+ tabIndex: PropTypes.Requireable<number>;
48
50
  };
49
51
  static defaultProps: {
50
52
  isSubNav: boolean;
@@ -55,6 +57,7 @@ export default class NavItem extends BaseComponent<NavItemProps, NavItemState> {
55
57
  onMouseEnter: (...args: any[]) => void;
56
58
  onMouseLeave: (...args: any[]) => void;
57
59
  disabled: boolean;
60
+ tabIndex: number;
58
61
  };
59
62
  foundation: ItemFoundation;
60
63
  context: NavContextType;
@@ -148,7 +148,8 @@ export default class NavItem extends BaseComponent {
148
148
  link,
149
149
  linkOptions,
150
150
  disabled,
151
- level = 0
151
+ level = 0,
152
+ tabIndex
152
153
  } = this.props;
153
154
  const {
154
155
  mode,
@@ -211,7 +212,8 @@ export default class NavItem extends BaseComponent {
211
212
  ["".concat(clsPrefix, "-sub")]: isSubNav,
212
213
  ["".concat(clsPrefix, "-selected")]: selected && !isSubNav,
213
214
  ["".concat(clsPrefix, "-collapsed")]: isCollapsed,
214
- ["".concat(clsPrefix, "-disabled")]: disabled
215
+ ["".concat(clsPrefix, "-disabled")]: disabled,
216
+ ["".concat(clsPrefix, "-has-link")]: typeof link === 'string'
215
217
  });
216
218
  const ariaProps = {
217
219
  'aria-disabled': disabled
@@ -228,7 +230,7 @@ export default class NavItem extends BaseComponent {
228
230
  React.createElement("li", Object.assign({
229
231
  // if role = menuitem, the narration will read all expanded li
230
232
  role: isSubNav ? null : "menuitem",
231
- tabIndex: isSubNav ? -1 : 0
233
+ tabIndex: isSubNav ? -1 : tabIndex
232
234
  }, ariaProps, {
233
235
  style: style,
234
236
  ref: this.setItemRef,
@@ -267,7 +269,8 @@ NavItem.propTypes = {
267
269
  isSubNav: PropTypes.bool,
268
270
  link: PropTypes.string,
269
271
  linkOptions: PropTypes.object,
270
- disabled: PropTypes.bool
272
+ disabled: PropTypes.bool,
273
+ tabIndex: PropTypes.number
271
274
  };
272
275
  NavItem.defaultProps = {
273
276
  isSubNav: false,
@@ -277,5 +280,6 @@ NavItem.defaultProps = {
277
280
  onClick: _noop,
278
281
  onMouseEnter: _noop,
279
282
  onMouseLeave: _noop,
280
- disabled: false
283
+ disabled: false,
284
+ tabIndex: 0
281
285
  };
@@ -30,7 +30,7 @@ import classnames from 'classnames';
30
30
  import { VariableSizeList as List } from 'react-window';
31
31
  import { arrayAdd, getRecordKey, isExpanded, isSelected, isDisabled, getRecord, genExpandedRowKey, getDefaultVirtualizedRowConfig, isTreeTable } from '@douyinfe/semi-foundation/lib/es/table/utils';
32
32
  import BodyFoundation from '@douyinfe/semi-foundation/lib/es/table/bodyFoundation';
33
- import { strings } from '@douyinfe/semi-foundation/lib/es/table/constants';
33
+ import { strings, numbers } from '@douyinfe/semi-foundation/lib/es/table/constants';
34
34
  import BaseComponent from '../../_base/baseComponent';
35
35
  import { logger } from '../utils';
36
36
  import ColGroup from '../ColGroup';
@@ -247,7 +247,7 @@ class Body extends BaseComponent {
247
247
  width: tableWidth
248
248
  },
249
249
  className: tableCls
250
- }, _size(dataSource) === 0 ? emptySlot : children));
250
+ }, children), _size(dataSource) === 0 && emptySlot);
251
251
  });
252
252
 
253
253
  this.onItemsRendered = props => {
@@ -287,7 +287,7 @@ class Body extends BaseComponent {
287
287
 
288
288
  const listStyle = {
289
289
  width: '100%',
290
- height: (virtualizedData === null || virtualizedData === void 0 ? void 0 : virtualizedData.length) ? y : 0,
290
+ height: (virtualizedData === null || virtualizedData === void 0 ? void 0 : virtualizedData.length) ? y : numbers.DEFAULT_EMPTYSLOT_HEIGHT,
291
291
  overflowX: 'auto',
292
292
  overflowY: 'auto'
293
293
  };
@@ -632,8 +632,9 @@ class Table extends BaseComponent {
632
632
  useFixedHeader,
633
633
  headerRef: this._cacheHeaderRef,
634
634
  bodyRef: this.bodyWrapRef,
635
- includeHeader: !useFixedHeader
636
- })), emptySlot, this.renderFooter(props)];
635
+ includeHeader: !useFixedHeader,
636
+ emptySlot
637
+ })), this.renderFooter(props)];
637
638
  return table;
638
639
  };
639
640
 
@@ -64,9 +64,10 @@ class TabPane extends PureComponent {
64
64
  className,
65
65
  style,
66
66
  children,
67
- itemKey
67
+ itemKey,
68
+ tabIndex
68
69
  } = _a,
69
- restProps = __rest(_a, ["className", "style", "children", "itemKey"]);
70
+ restProps = __rest(_a, ["className", "style", "children", "itemKey", "tabIndex"]);
70
71
 
71
72
  const active = this.context.activeKey === itemKey;
72
73
  const classNames = cls(className, {
@@ -104,7 +105,7 @@ class TabPane extends PureComponent {
104
105
  className: classNames,
105
106
  style: style,
106
107
  "aria-hidden": active ? 'false' : 'true',
107
- tabIndex: 0
108
+ tabIndex: tabIndex ? tabIndex : 0
108
109
  }, getDataAttr(restProps), {
109
110
  "x-semi-prop": "children"
110
111
  }), /*#__PURE__*/React.createElement(CSSAnimation, {
@@ -61,6 +61,7 @@ export interface TabPaneProps {
61
61
  style?: CSSProperties;
62
62
  tab?: ReactNode;
63
63
  closable?: boolean;
64
+ tabIndex?: number;
64
65
  }
65
66
  export interface TabPaneTransitionProps {
66
67
  [key: string]: any;
@@ -37,7 +37,7 @@ export interface TagInputProps {
37
37
  insetLabel?: React.ReactNode;
38
38
  insetLabelId?: string;
39
39
  prefix?: React.ReactNode;
40
- renderTagItem?: (value: string, index: number) => React.ReactNode;
40
+ renderTagItem?: (value: string, index: number, onClose: () => void) => React.ReactNode;
41
41
  separator?: string | string[] | null;
42
42
  showClear?: boolean;
43
43
  size?: Size;
@@ -123,20 +123,22 @@ class TagInput extends BaseComponent {
123
123
  return tagsArray.map((value, index) => {
124
124
  const elementKey = showIconHandler ? value : "".concat(index).concat(value);
125
125
 
126
+ const onClose = () => {
127
+ !disabled && this.handleTagClose(index);
128
+ };
129
+
126
130
  if (_isFunction(renderTagItem)) {
127
131
  return showIconHandler ? /*#__PURE__*/React.createElement("div", {
128
132
  className: itemWrapperCls,
129
133
  key: elementKey
130
- }, /*#__PURE__*/React.createElement(DragHandle, null), renderTagItem(value, index)) : renderTagItem(value, index);
134
+ }, /*#__PURE__*/React.createElement(DragHandle, null), renderTagItem(value, index, onClose)) : renderTagItem(value, index, onClose);
131
135
  } else {
132
136
  return /*#__PURE__*/React.createElement(Tag, {
133
137
  className: tagCls,
134
138
  color: "white",
135
139
  size: size === 'small' ? 'small' : 'large',
136
140
  type: "light",
137
- onClose: () => {
138
- !disabled && this.handleTagClose(index);
139
- },
141
+ onClose: onClose,
140
142
  closable: !disabled,
141
143
  key: elementKey,
142
144
  visible: true,
@@ -152,6 +152,7 @@ declare class Transfer extends BaseComponent<TransferProps, TransferState> {
152
152
  static getDerivedStateFromProps(props: TransferProps, state: TransferState): TransferState;
153
153
  get adapter(): TransferAdapter<TransferProps, TransferState>;
154
154
  onInputChange(value: string): void;
155
+ search(value: string): void;
155
156
  onSelectOrRemove(item: ResolvedDataItem): void;
156
157
  onSortEnd(callbackProps: OnSortEndProps): void;
157
158
  renderFilter(locale: Locale['Transfer']): JSX.Element;
@@ -125,7 +125,13 @@ class Transfer extends BaseComponent {
125
125
  }
126
126
 
127
127
  onInputChange(value) {
128
- this.foundation.handleInputChange(value);
128
+ this.foundation.handleInputChange(value, true);
129
+ }
130
+
131
+ search(value) {
132
+ // The search method is used to provide the user with a manually triggered search
133
+ // Since the method is manually called by the user, setting the second parameter to false does not trigger the onSearch callback to notify the user
134
+ this.foundation.handleInputChange(value, false);
129
135
  }
130
136
 
131
137
  onSelectOrRemove(item) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@douyinfe/semi-ui",
3
- "version": "2.22.2",
3
+ "version": "2.23.0-beta.0",
4
4
  "description": "",
5
5
  "main": "lib/cjs/index.js",
6
6
  "module": "lib/es/index.js",
@@ -18,11 +18,11 @@
18
18
  ],
19
19
  "dependencies": {
20
20
  "@douyinfe/semi-animation": "2.12.0",
21
- "@douyinfe/semi-animation-react": "2.22.2",
22
- "@douyinfe/semi-foundation": "2.22.2",
23
- "@douyinfe/semi-icons": "2.22.2",
21
+ "@douyinfe/semi-animation-react": "2.23.0-beta.0",
22
+ "@douyinfe/semi-foundation": "2.23.0-beta.0",
23
+ "@douyinfe/semi-icons": "2.23.0-beta.0",
24
24
  "@douyinfe/semi-illustrations": "2.15.0",
25
- "@douyinfe/semi-theme-default": "2.22.2",
25
+ "@douyinfe/semi-theme-default": "2.23.0-beta.0",
26
26
  "async-validator": "^3.5.0",
27
27
  "classnames": "^2.2.6",
28
28
  "copy-text-to-clipboard": "^2.1.1",
@@ -69,13 +69,13 @@
69
69
  ],
70
70
  "author": "",
71
71
  "license": "MIT",
72
- "gitHead": "9d7513d744a1dce3969e680679708edfe26fde6f",
72
+ "gitHead": "043a62790406e9ee86cd77e91190be8245baa9f6",
73
73
  "devDependencies": {
74
74
  "@babel/plugin-proposal-decorators": "^7.15.8",
75
75
  "@babel/plugin-transform-runtime": "^7.15.8",
76
76
  "@babel/preset-env": "^7.15.8",
77
77
  "@babel/preset-react": "^7.14.5",
78
- "@douyinfe/semi-scss-compile": "2.22.2",
78
+ "@douyinfe/semi-scss-compile": "2.23.0-beta.0",
79
79
  "@storybook/addon-knobs": "^6.3.1",
80
80
  "@types/lodash": "^4.14.176",
81
81
  "@types/react": ">=16.0.0",