@douyinfe/semi-foundation 2.34.0 → 2.34.1-alpha.3

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 (60) hide show
  1. package/breadcrumb/breadcrumb.scss +4 -4
  2. package/calendar/eventUtil.ts +7 -9
  3. package/calendar/foundation.ts +4 -4
  4. package/card/card.scss +2 -1
  5. package/cascader/foundation.ts +13 -24
  6. package/lib/cjs/breadcrumb/breadcrumb.css +3 -0
  7. package/lib/cjs/breadcrumb/breadcrumb.scss +4 -4
  8. package/lib/cjs/calendar/eventUtil.d.ts +6 -7
  9. package/lib/cjs/calendar/eventUtil.js +6 -8
  10. package/lib/cjs/calendar/foundation.d.ts +2 -2
  11. package/lib/cjs/calendar/foundation.js +2 -2
  12. package/lib/cjs/card/card.css +1 -1
  13. package/lib/cjs/card/card.scss +2 -1
  14. package/lib/cjs/cascader/foundation.d.ts +1 -3
  15. package/lib/cjs/cascader/foundation.js +8 -26
  16. package/lib/cjs/radio/radio.css +0 -1
  17. package/lib/cjs/radio/radio.scss +0 -1
  18. package/lib/cjs/steps/bacisSteps.scss +2 -2
  19. package/lib/cjs/steps/fillSteps.scss +3 -3
  20. package/lib/cjs/steps/steps.css +12 -12
  21. package/lib/cjs/table/foundation.d.ts +0 -5
  22. package/lib/cjs/table/table.css +5 -23
  23. package/lib/cjs/table/table.scss +5 -25
  24. package/lib/cjs/table/utils.d.ts +0 -2
  25. package/lib/cjs/table/utils.js +0 -6
  26. package/lib/cjs/timePicker/foundation.js +1 -15
  27. package/lib/cjs/typography/typography.css +0 -8
  28. package/lib/cjs/typography/typography.scss +0 -13
  29. package/lib/es/breadcrumb/breadcrumb.css +3 -0
  30. package/lib/es/breadcrumb/breadcrumb.scss +4 -4
  31. package/lib/es/calendar/eventUtil.d.ts +6 -7
  32. package/lib/es/calendar/eventUtil.js +6 -8
  33. package/lib/es/calendar/foundation.d.ts +2 -2
  34. package/lib/es/calendar/foundation.js +2 -2
  35. package/lib/es/card/card.css +1 -1
  36. package/lib/es/card/card.scss +2 -1
  37. package/lib/es/cascader/foundation.d.ts +1 -3
  38. package/lib/es/cascader/foundation.js +8 -26
  39. package/lib/es/radio/radio.css +0 -1
  40. package/lib/es/radio/radio.scss +0 -1
  41. package/lib/es/steps/bacisSteps.scss +2 -2
  42. package/lib/es/steps/fillSteps.scss +3 -3
  43. package/lib/es/steps/steps.css +12 -12
  44. package/lib/es/table/foundation.d.ts +0 -5
  45. package/lib/es/table/table.css +5 -23
  46. package/lib/es/table/table.scss +5 -25
  47. package/lib/es/table/utils.d.ts +0 -2
  48. package/lib/es/table/utils.js +0 -5
  49. package/lib/es/timePicker/foundation.js +1 -14
  50. package/lib/es/typography/typography.css +0 -8
  51. package/lib/es/typography/typography.scss +0 -13
  52. package/package.json +2 -2
  53. package/radio/radio.scss +0 -1
  54. package/steps/bacisSteps.scss +2 -2
  55. package/steps/fillSteps.scss +3 -3
  56. package/table/foundation.ts +2 -6
  57. package/table/table.scss +5 -25
  58. package/table/utils.ts +0 -6
  59. package/timePicker/foundation.ts +3 -12
  60. package/typography/typography.scss +0 -13
@@ -82,14 +82,14 @@ $module: #{$prefix}-breadcrumb;
82
82
  }
83
83
  }
84
84
 
85
- // &-item-icon+&-item-title {
86
- // margin-left: $spacing-breadcrumb_item_text-marginLeft;
87
- // }
85
+ &-item-icon+&-item-title {
86
+ margin-left: $spacing-breadcrumb_item_text-marginLeft;
87
+ }
88
88
 
89
89
  &-item-link {
90
90
  display: inline-flex;
91
91
  align-items: center;
92
- column-gap: $spacing-breadcrumb_item_text-marginLeft;
92
+ column-gap: 4px;
93
93
  text-decoration: inherit;
94
94
  transition: color $transition_duration-breadcrumb_link-text $transition-function_breadcrumb_link-text $transition_delay-breadcrumb_link-text;
95
95
  transform: scale($transform_scale-breadcrumb_link-text);
@@ -96,9 +96,9 @@ export interface DateObj {
96
96
  month: string
97
97
  }
98
98
 
99
- export type weekStartsOnEnum = 0 | 1 | 2 | 3 | 4 | 5 | 6;
99
+ export type weeekStartsOnEnum = 0 | 1 | 2 | 3 | 4 | 5 | 6;
100
100
 
101
- export const calcRangeData = (value: Date, start: Date, rangeLen: number, mode: string, locale: Locale, weekStartsOn: weekStartsOnEnum) => {
101
+ export const calcRangeData = (value: Date, start: Date, rangeLen: number, mode: string, locale: Locale, weekStartsOn: weeekStartsOnEnum) => {
102
102
  const today = getCurrDate();
103
103
  const arr: Array<DateObj> = [];
104
104
  [...Array(rangeLen).keys()].map(ind => {
@@ -121,17 +121,15 @@ export const calcRangeData = (value: Date, start: Date, rangeLen: number, mode:
121
121
 
122
122
  /**
123
123
  *
124
- * @param {Date} date
125
- * @param {Date} monthStart current month start date, using for month mode
124
+ * @param {value} date
126
125
  * @param {string} mode
127
126
  * @param {string} locale
128
127
  * @returns {object[]} { date: Date, dayString: string, ind: number, isToday: boolean, isWeekend: boolean, weekday: string }
129
128
  * create weekly object array
130
129
  */
131
- export const calcWeekData = (value: Date, monthStart: Date | null, mode = 'week', locale: Locale, weekStartsOn: weekStartsOnEnum) => {
130
+ export const calcWeekData = (value: Date, mode = 'week', locale: Locale, weekStartsOn: weeekStartsOnEnum) => {
132
131
  const start = startOfWeek(value, { weekStartsOn });
133
- const realValue = monthStart || value;
134
- return calcRangeData(realValue, start, 7, mode, locale, weekStartsOn);
132
+ return calcRangeData(value, start, 7, mode, locale, weekStartsOn);
135
133
  };
136
134
 
137
135
  /**
@@ -252,7 +250,7 @@ export const filterEvents = (events: Map<string, EventObject[]>, start: Date, en
252
250
  * filter out event that is not in the week range
253
251
  */
254
252
  // eslint-disable-next-line max-len
255
- export const filterWeeklyEvents = (events: Map<string, EventObject[]>, weekStart: Date, weekStartsOn: weekStartsOnEnum ) => filterEvents(events, weekStart, addDays(endOfWeek(weekStart, { weekStartsOn }), 1));
253
+ export const filterWeeklyEvents = (events: Map<string, EventObject[]>, weekStart: Date, weekStartsOn: weeekStartsOnEnum ) => filterEvents(events, weekStart, addDays(endOfWeek(weekStart, { weekStartsOn }), 1));
256
254
 
257
255
  /**
258
256
  * @returns {arr}
@@ -311,7 +309,7 @@ export const parseWeeklyAllDayEvent = (
311
309
  startDate: Date,
312
310
  weekStart: Date,
313
311
  parsed: Array<Array<ParsedRangeEvent>>,
314
- weekStartsOn: weekStartsOnEnum
312
+ weekStartsOn: weeekStartsOnEnum
315
313
  ) => parseRangeAllDayEvent(event, startDate, weekStart, addDays(endOfWeek(startDate, { weekStartsOn }), 1), parsed);
316
314
 
317
315
 
@@ -33,9 +33,9 @@ import {
33
33
  DateObj,
34
34
  checkWeekend,
35
35
  } from './eventUtil';
36
- import type { weekStartsOnEnum } from './eventUtil';
36
+ import type { weeekStartsOnEnum } from './eventUtil';
37
37
 
38
- export { weekStartsOnEnum };
38
+ export { weeekStartsOnEnum };
39
39
  export interface EventObject {
40
40
  [x: string]: any;
41
41
  key: string;
@@ -191,7 +191,7 @@ export default class CalendarFoundation<P = Record<string, any>, S = Record<stri
191
191
  const data = {} as WeeklyData;
192
192
  const { weekStartsOn } = this.getProps();
193
193
  data.month = format(value, 'LLL', { locale: dateFnsLocale, weekStartsOn });
194
- data.week = calcWeekData(value, null, 'week', dateFnsLocale, weekStartsOn);
194
+ data.week = calcWeekData(value, 'week', dateFnsLocale, weekStartsOn);
195
195
  this._adapter.setWeeklyData(data);
196
196
  return data;
197
197
  }
@@ -212,7 +212,7 @@ export default class CalendarFoundation<P = Record<string, any>, S = Record<stri
212
212
  const { weekStartsOn } = this.getProps();
213
213
  const numberOfWeek = getWeeksInMonth(value, { weekStartsOn });
214
214
  [...Array(numberOfWeek).keys()].map(ind => {
215
- data[ind] = calcWeekData(addDays(monthStart, ind * 7), monthStart, 'month', dateFnsLocale, weekStartsOn);
215
+ data[ind] = calcWeekData(addDays(monthStart, ind * 7), 'month', dateFnsLocale, weekStartsOn);
216
216
  });
217
217
  this._adapter.setMonthlyData(data);
218
218
  return data;
package/card/card.scss CHANGED
@@ -45,7 +45,8 @@ $module: #{$prefix}-card;
45
45
  &-wrapper {
46
46
  display: flex;
47
47
  align-items: flex-start;
48
- flex-direction: row-reverse;
48
+ flex-direction: row;
49
+ // flex-direction: row-reverse;
49
50
  justify-content: space-between;
50
51
 
51
52
  &-spacing {
@@ -92,9 +92,9 @@ export interface BasicTriggerRenderProps {
92
92
  * customized by triggerRender is updated to synchronize the state
93
93
  * with Cascader. */
94
94
  onSearch: (inputValue: string) => void;
95
- /* This function is the same as onSearch (supported since v2.32.0),
96
- * because this function was used before, and to align with TreeSelect,
97
- * use onSearch instead of onChange is more suitable,
95
+ /* This function is the same as onSearch (supported since v2.32.0),
96
+ * because this function was used before, and to align with TreeSelect,
97
+ * use onSearch instead of onChange is more suitable,
98
98
  * onChange needs to be deleted in the next Major
99
99
  */
100
100
  onChange: (inputValue: string) => void;
@@ -203,7 +203,6 @@ export interface CascaderAdapter extends DefaultAdapter<BasicCascaderProps, Basi
203
203
  updateInputValue: (value: string) => void;
204
204
  updateInputPlaceHolder: (value: string) => void;
205
205
  focusInput: () => void;
206
- blurInput: () => void;
207
206
  registerClickOutsideHandler: (cb: (e: any) => void) => void;
208
207
  unregisterClickOutsideHandler: () => void;
209
208
  rePositionDropdown: () => void;
@@ -260,7 +259,7 @@ export default class CascaderFoundation extends BaseFoundation<CascaderAdapter,
260
259
  if (multiple) {
261
260
  const valuePath: BasicValue = [];
262
261
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
263
- // @ts-ignore
262
+ // @ts-ignore
264
263
  item.forEach((checkedKey: string) => {
265
264
  const valuePathItem = this.getItemPropPath(checkedKey, valueProp);
266
265
  valuePath.push(valuePathItem as any);
@@ -450,7 +449,7 @@ export default class CascaderFoundation extends BaseFoundation<CascaderAdapter,
450
449
  if (filterable && !multiple) {
451
450
  const displayText = this.renderDisplayText(selectedKey, keyEntities);
452
451
  updateStates.inputPlaceHolder = displayText;
453
- /*
452
+ /*
454
453
  * displayText should not be assign to inputValue,
455
454
  * cause inputValue should only change by user enter
456
455
  */
@@ -485,7 +484,7 @@ export default class CascaderFoundation extends BaseFoundation<CascaderAdapter,
485
484
  if (filterable && !multiple) {
486
485
  const displayText = this._defaultRenderText(valuePath);
487
486
  updateStates.inputPlaceHolder = displayText;
488
- /*
487
+ /*
489
488
  * displayText should not be assign to inputValue,
490
489
  * cause inputValue should only change by user enter
491
490
  */
@@ -556,30 +555,20 @@ export default class CascaderFoundation extends BaseFoundation<CascaderAdapter,
556
555
  this._notifyBlur(e);
557
556
  }
558
557
 
559
- focus() {
560
- const { filterTreeNode } = this.getProps();
561
- if (filterTreeNode) {
562
- this._adapter.focusInput();
563
- }
564
- this._adapter.updateFocusState(true);
565
- }
566
-
567
- blur() {
568
- const { filterTreeNode } = this.getProps();
569
- if (filterTreeNode) {
570
- this._adapter.blurInput();
571
- }
572
- this._adapter.updateFocusState(false);
573
- }
574
-
575
558
  toggle2SearchInput(isShow: boolean) {
576
559
  if (isShow) {
577
- this._adapter.toggleInputShow(isShow, () => this.focus());
560
+ this._adapter.toggleInputShow(isShow, () => this.focusInput());
578
561
  } else {
579
562
  this._adapter.toggleInputShow(isShow, () => undefined);
580
563
  }
581
564
  }
582
565
 
566
+ focusInput() {
567
+ this._adapter.focusInput();
568
+ this._adapter.updateFocusState(true);
569
+ }
570
+
571
+
583
572
  updateSearching = (isSearching: boolean)=>{
584
573
  this._adapter.updateStates({ isSearching: false });
585
574
  }
@@ -54,6 +54,9 @@
54
54
  .semi-breadcrumb-item-more svg {
55
55
  vertical-align: middle;
56
56
  }
57
+ .semi-breadcrumb-item-icon + .semi-breadcrumb-item-title {
58
+ margin-left: 4px;
59
+ }
57
60
  .semi-breadcrumb-item-link {
58
61
  display: inline-flex;
59
62
  align-items: center;
@@ -82,14 +82,14 @@ $module: #{$prefix}-breadcrumb;
82
82
  }
83
83
  }
84
84
 
85
- // &-item-icon+&-item-title {
86
- // margin-left: $spacing-breadcrumb_item_text-marginLeft;
87
- // }
85
+ &-item-icon+&-item-title {
86
+ margin-left: $spacing-breadcrumb_item_text-marginLeft;
87
+ }
88
88
 
89
89
  &-item-link {
90
90
  display: inline-flex;
91
91
  align-items: center;
92
- column-gap: $spacing-breadcrumb_item_text-marginLeft;
92
+ column-gap: 4px;
93
93
  text-decoration: inherit;
94
94
  transition: color $transition_duration-breadcrumb_link-text $transition-function_breadcrumb_link-text $transition_delay-breadcrumb_link-text;
95
95
  transform: scale($transform_scale-breadcrumb_link-text);
@@ -30,18 +30,17 @@ export interface DateObj {
30
30
  isSameMonth: boolean;
31
31
  month: string;
32
32
  }
33
- export declare type weekStartsOnEnum = 0 | 1 | 2 | 3 | 4 | 5 | 6;
34
- export declare const calcRangeData: (value: Date, start: Date, rangeLen: number, mode: string, locale: Locale, weekStartsOn: weekStartsOnEnum) => DateObj[];
33
+ export declare type weeekStartsOnEnum = 0 | 1 | 2 | 3 | 4 | 5 | 6;
34
+ export declare const calcRangeData: (value: Date, start: Date, rangeLen: number, mode: string, locale: Locale, weekStartsOn: weeekStartsOnEnum) => DateObj[];
35
35
  /**
36
36
  *
37
- * @param {Date} date
38
- * @param {Date} monthStart current month start date, using for month mode
37
+ * @param {value} date
39
38
  * @param {string} mode
40
39
  * @param {string} locale
41
40
  * @returns {object[]} { date: Date, dayString: string, ind: number, isToday: boolean, isWeekend: boolean, weekday: string }
42
41
  * create weekly object array
43
42
  */
44
- export declare const calcWeekData: (value: Date, monthStart: Date | null, mode: string, locale: Locale, weekStartsOn: weekStartsOnEnum) => DateObj[];
43
+ export declare const calcWeekData: (value: Date, mode: string, locale: Locale, weekStartsOn: weeekStartsOnEnum) => DateObj[];
45
44
  /**
46
45
  *
47
46
  * @param {object} event
@@ -75,7 +74,7 @@ export declare const filterEvents: (events: Map<string, EventObject[]>, start: D
75
74
  * @returns {arr}
76
75
  * filter out event that is not in the week range
77
76
  */
78
- export declare const filterWeeklyEvents: (events: Map<string, EventObject[]>, weekStart: Date, weekStartsOn: weekStartsOnEnum) => Map<string, EventObject[]>;
77
+ export declare const filterWeeklyEvents: (events: Map<string, EventObject[]>, weekStart: Date, weekStartsOn: weeekStartsOnEnum) => Map<string, EventObject[]>;
79
78
  /**
80
79
  * @returns {arr}
81
80
  * arrange and sort all day event for a range
@@ -85,7 +84,7 @@ export declare const parseRangeAllDayEvent: (event: EventObject[], startDate: Da
85
84
  * @returns {arr}
86
85
  * arrange and sort weekly all day event
87
86
  */
88
- export declare const parseWeeklyAllDayEvent: (event: EventObject[], startDate: Date, weekStart: Date, parsed: Array<Array<ParsedRangeEvent>>, weekStartsOn: weekStartsOnEnum) => ParsedRangeEvent[][];
87
+ export declare const parseWeeklyAllDayEvent: (event: EventObject[], startDate: Date, weekStart: Date, parsed: Array<Array<ParsedRangeEvent>>, weekStartsOn: weeekStartsOnEnum) => ParsedRangeEvent[][];
89
88
  export declare const collectDailyEvents: (events: ParsedRangeEvent[][]) => ParsedRangeEvent[][];
90
89
  export declare const renderDailyEvent: (event: EventObject) => {
91
90
  startPos: number;
@@ -127,8 +127,7 @@ const calcRangeData = (value, start, rangeLen, mode, locale, weekStartsOn) => {
127
127
  };
128
128
  /**
129
129
  *
130
- * @param {Date} date
131
- * @param {Date} monthStart current month start date, using for month mode
130
+ * @param {value} date
132
131
  * @param {string} mode
133
132
  * @param {string} locale
134
133
  * @returns {object[]} { date: Date, dayString: string, ind: number, isToday: boolean, isWeekend: boolean, weekday: string }
@@ -138,15 +137,14 @@ const calcRangeData = (value, start, rangeLen, mode, locale, weekStartsOn) => {
138
137
 
139
138
  exports.calcRangeData = calcRangeData;
140
139
 
141
- const calcWeekData = function (value, monthStart) {
142
- let mode = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'week';
143
- let locale = arguments.length > 3 ? arguments[3] : undefined;
144
- let weekStartsOn = arguments.length > 4 ? arguments[4] : undefined;
140
+ const calcWeekData = function (value) {
141
+ let mode = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'week';
142
+ let locale = arguments.length > 2 ? arguments[2] : undefined;
143
+ let weekStartsOn = arguments.length > 3 ? arguments[3] : undefined;
145
144
  const start = (0, _dateFns.startOfWeek)(value, {
146
145
  weekStartsOn
147
146
  });
148
- const realValue = monthStart || value;
149
- return calcRangeData(realValue, start, 7, mode, locale, weekStartsOn);
147
+ return calcRangeData(value, start, 7, mode, locale, weekStartsOn);
150
148
  };
151
149
  /**
152
150
  *
@@ -1,8 +1,8 @@
1
1
  import BaseFoundation, { DefaultAdapter } from '../base/foundation';
2
2
  import { Locale } from 'date-fns';
3
3
  import { DateObj } from './eventUtil';
4
- import type { weekStartsOnEnum } from './eventUtil';
5
- export { weekStartsOnEnum };
4
+ import type { weeekStartsOnEnum } from './eventUtil';
5
+ export { weeekStartsOnEnum };
6
6
  export interface EventObject {
7
7
  [x: string]: any;
8
8
  key: string;
@@ -119,7 +119,7 @@ class CalendarFoundation extends _foundation.default {
119
119
  locale: dateFnsLocale,
120
120
  weekStartsOn
121
121
  });
122
- data.week = (0, _eventUtil.calcWeekData)(value, null, 'week', dateFnsLocale, weekStartsOn);
122
+ data.week = (0, _eventUtil.calcWeekData)(value, 'week', dateFnsLocale, weekStartsOn);
123
123
 
124
124
  this._adapter.setWeeklyData(data);
125
125
 
@@ -154,7 +154,7 @@ class CalendarFoundation extends _foundation.default {
154
154
  weekStartsOn
155
155
  });
156
156
  [...Array(numberOfWeek).keys()].map(ind => {
157
- data[ind] = (0, _eventUtil.calcWeekData)((0, _dateFns.addDays)(monthStart, ind * 7), monthStart, 'month', dateFnsLocale, weekStartsOn);
157
+ data[ind] = (0, _eventUtil.calcWeekData)((0, _dateFns.addDays)(monthStart, ind * 7), 'month', dateFnsLocale, weekStartsOn);
158
158
  });
159
159
 
160
160
  this._adapter.setMonthlyData(data);
@@ -37,7 +37,7 @@
37
37
  .semi-card-header-wrapper {
38
38
  display: flex;
39
39
  align-items: flex-start;
40
- flex-direction: row-reverse;
40
+ flex-direction: row;
41
41
  justify-content: space-between;
42
42
  }
43
43
  .semi-card-header-wrapper-spacing {
@@ -45,7 +45,8 @@ $module: #{$prefix}-card;
45
45
  &-wrapper {
46
46
  display: flex;
47
47
  align-items: flex-start;
48
- flex-direction: row-reverse;
48
+ flex-direction: row;
49
+ // flex-direction: row-reverse;
49
50
  justify-content: space-between;
50
51
 
51
52
  &-spacing {
@@ -149,7 +149,6 @@ export interface CascaderAdapter extends DefaultAdapter<BasicCascaderProps, Basi
149
149
  updateInputValue: (value: string) => void;
150
150
  updateInputPlaceHolder: (value: string) => void;
151
151
  focusInput: () => void;
152
- blurInput: () => void;
153
152
  registerClickOutsideHandler: (cb: (e: any) => void) => void;
154
153
  unregisterClickOutsideHandler: () => void;
155
154
  rePositionDropdown: () => void;
@@ -197,9 +196,8 @@ export default class CascaderFoundation extends BaseFoundation<CascaderAdapter,
197
196
  open(): void;
198
197
  reCalcActiveKeys(): void;
199
198
  close(e: any, key?: string): void;
200
- focus(): void;
201
- blur(): void;
202
199
  toggle2SearchInput(isShow: boolean): void;
200
+ focusInput(): void;
203
201
  updateSearching: (isSearching: boolean) => void;
204
202
  handleItemClick(e: any, item: BasicEntity | BasicData): void;
205
203
  handleItemHover(e: any, item: BasicEntity): void;
@@ -79,7 +79,7 @@ class CascaderFoundation extends _foundation.default {
79
79
 
80
80
  if (multiple) {
81
81
  const valuePath = []; // eslint-disable-next-line @typescript-eslint/ban-ts-comment
82
- // @ts-ignore
82
+ // @ts-ignore
83
83
 
84
84
  item.forEach(checkedKey => {
85
85
  const valuePathItem = this.getItemPropPath(checkedKey, valueProp);
@@ -449,38 +449,20 @@ class CascaderFoundation extends _foundation.default {
449
449
  this._notifyBlur(e);
450
450
  }
451
451
 
452
- focus() {
453
- const {
454
- filterTreeNode
455
- } = this.getProps();
456
-
457
- if (filterTreeNode) {
458
- this._adapter.focusInput();
459
- }
460
-
461
- this._adapter.updateFocusState(true);
462
- }
463
-
464
- blur() {
465
- const {
466
- filterTreeNode
467
- } = this.getProps();
468
-
469
- if (filterTreeNode) {
470
- this._adapter.blurInput();
471
- }
472
-
473
- this._adapter.updateFocusState(false);
474
- }
475
-
476
452
  toggle2SearchInput(isShow) {
477
453
  if (isShow) {
478
- this._adapter.toggleInputShow(isShow, () => this.focus());
454
+ this._adapter.toggleInputShow(isShow, () => this.focusInput());
479
455
  } else {
480
456
  this._adapter.toggleInputShow(isShow, () => undefined);
481
457
  }
482
458
  }
483
459
 
460
+ focusInput() {
461
+ this._adapter.focusInput();
462
+
463
+ this._adapter.updateFocusState(true);
464
+ }
465
+
484
466
  handleItemClick(e, item) {
485
467
  const isDisabled = this._isDisabled();
486
468
 
@@ -301,7 +301,6 @@
301
301
  .semi-radioGroup-horizontal {
302
302
  display: inline-flex;
303
303
  flex-wrap: wrap;
304
- vertical-align: bottom;
305
304
  gap: 16px;
306
305
  }
307
306
  .semi-radioGroup-buttonRadio {
@@ -416,7 +416,6 @@ $inner-width: $width-icon-medium;
416
416
  &-horizontal {
417
417
  display: inline-flex;
418
418
  flex-wrap: wrap;
419
- vertical-align: bottom; // Fix 1573
420
419
  gap: $spacing-radio_group_horizontal-marginRight;
421
420
  }
422
421
 
@@ -173,7 +173,7 @@ $basicType: #{$module}-basic;
173
173
 
174
174
  transform:scale($transform_scale-step-item);
175
175
 
176
- &-hover:hover {
176
+ &:hover {
177
177
 
178
178
  .#{$item}-title {
179
179
  color: $color-steps_item_title-text-hover;
@@ -267,7 +267,7 @@ $basicType: #{$module}-basic;
267
267
  }
268
268
  }
269
269
 
270
- &-hover:hover {
270
+ &:hover {
271
271
  .#{$item}-left {
272
272
 
273
273
  .#{$item}-icon {
@@ -92,7 +92,7 @@ $module: #{$prefix}-steps;
92
92
  color: $color-steps_success-text-default;
93
93
  }
94
94
 
95
- &-hover:hover {
95
+ &:hover {
96
96
  background-color: $color-steps-bg-hover;
97
97
 
98
98
  .#{$prefix}-icon,
@@ -118,7 +118,7 @@ $module: #{$prefix}-steps;
118
118
  color: $color-steps_danger-text-default;
119
119
  }
120
120
 
121
- &-hover:hover {
121
+ &:hover {
122
122
  background: $color-steps-bg-hover;
123
123
 
124
124
  .#{$prefix}-icon,
@@ -144,7 +144,7 @@ $module: #{$prefix}-steps;
144
144
  color: $color-steps_warning-text-default;
145
145
  }
146
146
 
147
- &-hover:hover {
147
+ &:hover {
148
148
  background: $color-steps-bg-hover;
149
149
 
150
150
  .#{$module}-item-title,
@@ -64,11 +64,11 @@
64
64
  .semi-steps .semi-steps-item-finish .semi-steps-item-title {
65
65
  color: var(--semi-color-success);
66
66
  }
67
- .semi-steps .semi-steps-item-finish-hover:hover {
67
+ .semi-steps .semi-steps-item-finish:hover {
68
68
  background-color: var(--semi-color-fill-0);
69
69
  }
70
- .semi-steps .semi-steps-item-finish-hover:hover .semi-icon,
71
- .semi-steps .semi-steps-item-finish-hover:hover .semi-steps-item-title {
70
+ .semi-steps .semi-steps-item-finish:hover .semi-icon,
71
+ .semi-steps .semi-steps-item-finish:hover .semi-steps-item-title {
72
72
  color: var(--semi-color-success-hover);
73
73
  }
74
74
  .semi-steps .semi-steps-item-finish:active {
@@ -82,11 +82,11 @@
82
82
  .semi-steps .semi-steps-item-error .semi-steps-item-title {
83
83
  color: var(--semi-color-danger);
84
84
  }
85
- .semi-steps .semi-steps-item-error-hover:hover {
85
+ .semi-steps .semi-steps-item-error:hover {
86
86
  background: var(--semi-color-fill-0);
87
87
  }
88
- .semi-steps .semi-steps-item-error-hover:hover .semi-icon,
89
- .semi-steps .semi-steps-item-error-hover:hover .semi-steps-item-title {
88
+ .semi-steps .semi-steps-item-error:hover .semi-icon,
89
+ .semi-steps .semi-steps-item-error:hover .semi-steps-item-title {
90
90
  color: var(--semi-color-danger-hover);
91
91
  }
92
92
  .semi-steps .semi-steps-item-error:active {
@@ -100,11 +100,11 @@
100
100
  .semi-steps .semi-steps-item-warning .semi-icon {
101
101
  color: var(--semi-color-warning);
102
102
  }
103
- .semi-steps .semi-steps-item-warning-hover:hover {
103
+ .semi-steps .semi-steps-item-warning:hover {
104
104
  background: var(--semi-color-fill-0);
105
105
  }
106
- .semi-steps .semi-steps-item-warning-hover:hover .semi-steps-item-title,
107
- .semi-steps .semi-steps-item-warning-hover:hover .semi-icon {
106
+ .semi-steps .semi-steps-item-warning:hover .semi-steps-item-title,
107
+ .semi-steps .semi-steps-item-warning:hover .semi-icon {
108
108
  color: var(--semi-color-warning-hover);
109
109
  }
110
110
  .semi-steps .semi-steps-item-warning:active {
@@ -264,10 +264,10 @@
264
264
  transition: color var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none), background-color var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none);
265
265
  transform: scale(var(--semi-transform_scale-small));
266
266
  }
267
- .semi-steps-basic .semi-steps-item-hover:hover .semi-steps-item-title {
267
+ .semi-steps-basic .semi-steps-item:hover .semi-steps-item-title {
268
268
  color: var(--semi-color-focus-border);
269
269
  }
270
- .semi-steps-basic .semi-steps-item-hover:hover .semi-steps-item-description {
270
+ .semi-steps-basic .semi-steps-item:hover .semi-steps-item-description {
271
271
  color: var(--semi-color-focus-border);
272
272
  }
273
273
  .semi-steps-basic .semi-steps-item .semi-steps-item-container {
@@ -330,7 +330,7 @@
330
330
  background: var(--semi-color-fill-0);
331
331
  color: var(--semi-color-text-2);
332
332
  }
333
- .semi-steps-basic .semi-steps-item-wait-hover:hover .semi-steps-item-left .semi-steps-item-icon .semi-steps-item-number-icon {
333
+ .semi-steps-basic .semi-steps-item-wait:hover .semi-steps-item-left .semi-steps-item-icon .semi-steps-item-number-icon {
334
334
  background: var(--semi-color-secondary-light-default);
335
335
  color: var(--semi-color-focus-border);
336
336
  }
@@ -32,7 +32,6 @@ export interface BaseColumnProps<RecordType> {
32
32
  title?: any;
33
33
  useFullRender?: boolean;
34
34
  width?: string | number;
35
- ellipsis?: BaseEllipsis;
36
35
  }
37
36
  export interface TableAdapter<RecordType> extends DefaultAdapter {
38
37
  resetScrollY: () => void;
@@ -82,7 +81,6 @@ export interface TableAdapter<RecordType> extends DefaultAdapter {
82
81
  getHandleColumns: () => (queries: BaseColumnProps<RecordType>[], cachedColumns: BaseColumnProps<RecordType>[]) => BaseColumnProps<RecordType>[];
83
82
  getMergePagination: () => (pagination: BasePagination) => BasePagination;
84
83
  setBodyHasScrollbar: (bodyHasScrollBar: boolean) => void;
85
- getTableLayout: () => 'fixed' | 'auto';
86
84
  }
87
85
  declare class TableFoundation<RecordType> extends BaseFoundation<TableAdapter<RecordType>> {
88
86
  memoizedWithFnsColumns: (queries: BaseColumnProps<RecordType>[], cachedColumns: BaseColumnProps<RecordType>[], rowSelectionUpdate: boolean, hideExpandedColumn: boolean, bodyHasScrollBar: boolean) => BaseColumnProps<RecordType>[];
@@ -368,7 +366,4 @@ export interface BaseChangeInfoSorter<RecordType> {
368
366
  export declare type BaseIncludeGroupRecord<RecordType> = RecordType | {
369
367
  groupKey: string;
370
368
  };
371
- export declare type BaseEllipsis = boolean | {
372
- showTitle: boolean;
373
- };
374
369
  export default TableFoundation;
@@ -94,10 +94,6 @@
94
94
  .semi-table-header-sticky .semi-table-thead > .semi-table-row > .semi-table-row-head {
95
95
  background-color: var(--semi-color-bg-1);
96
96
  }
97
- .semi-table-operate-wrapper {
98
- display: flex;
99
- justify-content: flex-start;
100
- }
101
97
  .semi-table-body {
102
98
  overflow: auto;
103
99
  width: 100%;
@@ -123,7 +119,8 @@
123
119
  padding-top: 8px;
124
120
  padding-bottom: 8px;
125
121
  vertical-align: middle;
126
- overflow-wrap: break-word;
122
+ word-break: break-all;
123
+ word-wrap: break-word;
127
124
  position: relative;
128
125
  }
129
126
  .semi-table-thead > .semi-table-row > .semi-table-row-head.semi-table-cell-fixed-left, .semi-table-thead > .semi-table-row > .semi-table-row-head.semi-table-cell-fixed-right {
@@ -176,16 +173,6 @@
176
173
  display: inline-flex;
177
174
  align-items: center;
178
175
  }
179
- .semi-table-thead > .semi-table-row > .semi-table-row-head-ellipsis {
180
- overflow: hidden;
181
- text-overflow: ellipsis;
182
- white-space: nowrap;
183
- }
184
- .semi-table-thead > .semi-table-row > .semi-table-row-head-ellipsis .semi-table-row-head-title {
185
- overflow: hidden;
186
- text-overflow: ellipsis;
187
- white-space: nowrap;
188
- }
189
176
  .semi-table-thead > .semi-table-row .react-resizable {
190
177
  position: relative;
191
178
  background-clip: padding-box;
@@ -236,7 +223,8 @@
236
223
  }
237
224
  .semi-table-tbody > .semi-table-row > .semi-table-row-cell {
238
225
  display: table-cell;
239
- overflow-wrap: break-word;
226
+ word-wrap: break-word;
227
+ word-break: break-all;
240
228
  border-left: none;
241
229
  border-right: none;
242
230
  border-bottom: 1px solid var(--semi-color-border);
@@ -248,11 +236,6 @@
248
236
  .semi-table-tbody > .semi-table-row > .semi-table-row-cell.resizing {
249
237
  border-right: 2px solid var(--semi-color-primary);
250
238
  }
251
- .semi-table-tbody > .semi-table-row > .semi-table-row-cell-ellipsis {
252
- overflow: hidden;
253
- text-overflow: ellipsis;
254
- white-space: nowrap;
255
- }
256
239
  .semi-table-tbody > .semi-table-row.semi-table-row-expand > .semi-table-row-cell {
257
240
  background-color: var(--semi-color-fill-0);
258
241
  }
@@ -353,10 +336,9 @@
353
336
  text-align: center;
354
337
  }
355
338
  .semi-table .semi-table-column-sorter-wrapper {
356
- display: flex;
339
+ display: inline-flex;
357
340
  align-items: center;
358
341
  cursor: pointer;
359
- overflow: hidden;
360
342
  }
361
343
  .semi-table .semi-table-column-sorter-up, .semi-table .semi-table-column-sorter-down {
362
344
  height: 0;