@douyinfe/semi-foundation 2.2.0-beta.0 → 2.2.0-beta.1

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 (24) hide show
  1. package/datePicker/_utils/parser.ts +4 -3
  2. package/gulpfile.js +3 -1
  3. package/lib/cjs/datePicker/_utils/parser.d.ts +6 -1
  4. package/lib/cjs/datePicker/_utils/parser.js +3 -1
  5. package/lib/cjs/datePicker/datePicker.css +0 -1
  6. package/lib/cjs/navigation/navigation.css +0 -1
  7. package/lib/cjs/notification/notification.css +8 -4
  8. package/lib/cjs/notification/notification.scss +9 -5
  9. package/lib/cjs/notification/variables.scss +1 -0
  10. package/lib/cjs/select/foundation.d.ts +10 -1
  11. package/lib/cjs/select/foundation.js +11 -9
  12. package/lib/es/datePicker/_utils/parser.d.ts +6 -1
  13. package/lib/es/datePicker/_utils/parser.js +3 -1
  14. package/lib/es/datePicker/datePicker.css +0 -1
  15. package/lib/es/navigation/navigation.css +0 -1
  16. package/lib/es/notification/notification.css +8 -4
  17. package/lib/es/notification/notification.scss +9 -5
  18. package/lib/es/notification/variables.scss +1 -0
  19. package/lib/es/select/foundation.d.ts +10 -1
  20. package/lib/es/select/foundation.js +12 -9
  21. package/notification/notification.scss +9 -5
  22. package/notification/variables.scss +1 -0
  23. package/package.json +4 -4
  24. package/select/foundation.ts +11 -9
package/datePicker/_utils/parser.ts CHANGED
@@ -2,7 +2,7 @@
2
2
  * @file
3
3
  * Various date-related analysis methods
4
4
  */
5
- import { isValid, parseISO, parse } from 'date-fns';
5
+ import { isValid, parseISO, parse, Locale } from 'date-fns';
6
6
 
7
7
  /**
8
8
  * Parsing value to Date object
@@ -11,7 +11,7 @@ export function compatiableParse(
11
11
  value: string,
12
12
  formatToken?: string,
13
13
  baseDate?: Date,
14
- locale?: any
14
+ locale?: Locale
15
15
  ): Date | null {
16
16
  let result = null;
17
17
  if (value) {
@@ -25,7 +25,8 @@ export function compatiableParse(
25
25
  if (!isValid(result)) {
26
26
  result = new Date(Date.parse(value));
27
27
  }
28
- if (!isValid(result)) {
28
+ const yearInvalid = isValid(result) && String(result.getFullYear()).length > 4;
29
+ if (!isValid(result) || yearInvalid) {
29
30
  result = null;
30
31
  }
31
32
  }
package/gulpfile.js CHANGED
@@ -52,7 +52,9 @@ gulp.task('compileScss', function compileScss() {
52
52
  cb(null, chunk);
53
53
  }
54
54
  ))
55
- .pipe(sass().on('error', sass.logError))
55
+ .pipe(sass({
56
+ charset: false
57
+ }).on('error', sass.logError))
56
58
  .pipe(gulp.dest('lib/es'))
57
59
  .pipe(gulp.dest('lib/cjs'));
58
60
  });
package/lib/cjs/datePicker/_utils/parser.d.ts CHANGED
@@ -1,4 +1,9 @@
1
+ /**
2
+ * @file
3
+ * Various date-related analysis methods
4
+ */
5
+ import { Locale } from 'date-fns';
1
6
  /**
2
7
  * Parsing value to Date object
3
8
  */
4
- export declare function compatiableParse(value: string, formatToken?: string, baseDate?: Date, locale?: any): Date | null;
9
+ export declare function compatiableParse(value: string, formatToken?: string, baseDate?: Date, locale?: Locale): Date | null;
package/lib/cjs/datePicker/_utils/parser.js CHANGED
@@ -37,7 +37,9 @@ function compatiableParse(value, formatToken, baseDate, locale) {
37
37
  result = new Date(Date.parse(value));
38
38
  }
39
39
 
40
- if (!(0, _dateFns.isValid)(result)) {
40
+ const yearInvalid = (0, _dateFns.isValid)(result) && String(result.getFullYear()).length > 4;
41
+
42
+ if (!(0, _dateFns.isValid)(result) || yearInvalid) {
41
43
  result = null;
42
44
  }
43
45
  }
package/lib/cjs/datePicker/datePicker.css CHANGED
@@ -1,4 +1,3 @@
1
- @charset "UTF-8";
2
1
  /* shadow */
3
2
  /* sizing */
4
3
  /* spacing */
package/lib/cjs/navigation/navigation.css CHANGED
@@ -1,4 +1,3 @@
1
- @charset "UTF-8";
2
1
  /* shadow */
3
2
  /* sizing */
4
3
  /* spacing */
package/lib/cjs/notification/notification.css CHANGED
@@ -79,19 +79,23 @@
79
79
  color: var(--semi-color-success);
80
80
  }
81
81
  .semi-notification-notice-light.semi-notification-notice-warning {
82
- background-color: var(--semi-color-warning-light-default);
82
+ background-image: linear-gradient(0deg, var(--semi-color-warning-light-default), var(--semi-color-warning-light-default));
83
+ background-color: var(--semi-color-bg-0);
83
84
  border: 1px solid var(--semi-color-warning);
84
85
  }
85
86
  .semi-notification-notice-light.semi-notification-notice-success {
86
- background-color: var(--semi-color-success-light-default);
87
+ background-image: linear-gradient(0deg, var(--semi-color-success-light-default), var(--semi-color-success-light-default));
88
+ background-color: var(--semi-color-bg-0);
87
89
  border: 1px solid var(--semi-color-success);
88
90
  }
89
91
  .semi-notification-notice-light.semi-notification-notice-info, .semi-notification-notice-light.semi-notification-notice-default {
90
- background-color: var(--semi-color-info-light-default);
92
+ background-image: linear-gradient(0deg, var(--semi-color-info-light-default), var(--semi-color-info-light-default));
93
+ background-color: var(--semi-color-bg-0);
91
94
  border: 1px solid var(--semi-color-info);
92
95
  }
93
96
  .semi-notification-notice-light.semi-notification-notice-error {
94
- background-color: var(--semi-color-danger-light-default);
97
+ background-image: linear-gradient(0deg, var(--semi-color-danger-light-default), var(--semi-color-danger-light-default));
98
+ background-color: var(--semi-color-bg-0);
95
99
  border: 1px solid var(--semi-color-danger);
96
100
  }
97
101
  .semi-notification-notice-title {
package/lib/cjs/notification/notification.scss CHANGED
@@ -93,23 +93,27 @@ $module: #{$prefix}-notification;
93
93
 
94
94
  &-light {
95
95
  &.#{$module}-notice-warning {
96
- background-color: $color-notification_warning_light-bg;
96
+ background-image: linear-gradient(0deg, $color-notification_warning_light-bg, $color-notification_warning_light-bg);
97
+ background-color: $color-notification_ambient-bg;
97
98
  border: $width-notification_notice-border solid $color-notification_warning_light-border;
98
99
  }
99
100
 
100
101
  &.#{$module}-notice-success {
101
- background-color: $color-notification_success_light-bg;
102
+ background-image: linear-gradient(0deg, $color-notification_success_light-bg, $color-notification_success_light-bg);
103
+ background-color: $color-notification_ambient-bg;
102
104
  border: $width-notification_notice-border solid $color-notification_success_light-border;
103
105
  }
104
106
 
105
107
  &.#{$module}-notice-info,
106
108
  &.#{$module}-notice-default {
107
- background-color: $color-notification_info_light-bg;
109
+ background-image: linear-gradient(0deg, $color-notification_info_light-bg, $color-notification_info_light-bg);
110
+ background-color: $color-notification_ambient-bg;
108
111
  border: $width-notification_notice-border solid $color-notification_info_light-border;
109
112
  }
110
113
 
111
114
  &.#{$module}-notice-error {
112
- background-color: $color-notification_danger_light-bg;
115
+ background-image: linear-gradient(0deg, $color-notification_danger_light-bg, $color-notification_danger_light-bg);
116
+ background-color: $color-notification_ambient-bg;
113
117
  border: $width-notification_notice-border solid $color-notification_danger_light-border;
114
118
  }
115
119
  }
@@ -165,4 +169,4 @@ $module: #{$prefix}-notification;
165
169
  }
166
170
  }
167
171
 
168
- @import "./rtl.scss";
172
+ @import "./rtl.scss";
package/lib/cjs/notification/variables.scss CHANGED
@@ -15,6 +15,7 @@ $color-notification_info_light-bg: var(--semi-color-info-light-default); // 彩
15
15
  $color-notification_info_light-border: var(--semi-color-info); // 彩色通知信息描边色
16
16
  $color-notification_danger_light-bg: var(--semi-color-danger-light-default); // 彩色通知危险背景色
17
17
  $color-notification_danger_light-border: var(--semi-color-danger); // 彩色通知危险描边色
18
+ $color-notification_ambient-bg: var(--semi-color-bg-0); // 透明背景色叠加层(与bg0保持一致不建议修改)
18
19
 
19
20
  // Width/Height
20
21
  $width-notification_notice: auto; // 通知宽度
package/lib/cjs/select/foundation.d.ts CHANGED
@@ -82,7 +82,16 @@ export default class SelectFoundation extends BaseFoundation<SelectAdapter> {
82
82
  _handleEnterKeyDown(event: KeyboardEvent): void;
83
83
  _handleBackspaceKeyDown(): void;
84
84
  _notifyChange(selections: Map<any, any>): void;
85
- _removeInternalKey(option: BasicOptionProps): BasicOptionProps;
85
+ _removeInternalKey(option: BasicOptionProps): {
86
+ [x: string]: any;
87
+ value?: string | number;
88
+ label?: unknown;
89
+ children?: unknown;
90
+ disabled?: boolean;
91
+ showTick?: boolean;
92
+ className?: string;
93
+ style?: Record<string, any>;
94
+ };
86
95
  _notifySelect(value: BasicOptionProps['value'], option: BasicOptionProps): void;
87
96
  _notifyDeselect(value: BasicOptionProps['value'], option: BasicOptionProps): void;
88
97
  _diffSelections(selections: Map<any, any>, oldSelections: Map<any, any>, isMultiple: boolean): boolean;
package/lib/cjs/select/foundation.js CHANGED
@@ -1038,17 +1038,19 @@ class SelectFoundation extends _foundation.default {
1038
1038
  }
1039
1039
 
1040
1040
  _removeInternalKey(option) {
1041
- delete option._parentGroup;
1042
- delete option._show;
1043
- delete option._selected;
1044
- delete option._scrollIndex;
1045
-
1046
- if ('_keyInOptionList' in option) {
1047
- option.key = option._keyInOptionList;
1048
- delete option._keyInOptionList;
1041
+ // eslint-disable-next-line
1042
+ let newOption = (0, _assign.default)({}, option);
1043
+ delete newOption._parentGroup;
1044
+ delete newOption._show;
1045
+ delete newOption._selected;
1046
+ delete newOption._scrollIndex;
1047
+
1048
+ if ('_keyInOptionList' in newOption) {
1049
+ newOption.key = newOption._keyInOptionList;
1050
+ delete newOption._keyInOptionList;
1049
1051
  }
1050
1052
 
1051
- return option;
1053
+ return newOption;
1052
1054
  }
1053
1055
 
1054
1056
  _notifySelect(value, option) {
package/lib/es/datePicker/_utils/parser.d.ts CHANGED
@@ -1,4 +1,9 @@
1
+ /**
2
+ * @file
3
+ * Various date-related analysis methods
4
+ */
5
+ import { Locale } from 'date-fns';
1
6
  /**
2
7
  * Parsing value to Date object
3
8
  */
4
- export declare function compatiableParse(value: string, formatToken?: string, baseDate?: Date, locale?: any): Date | null;
9
+ export declare function compatiableParse(value: string, formatToken?: string, baseDate?: Date, locale?: Locale): Date | null;
package/lib/es/datePicker/_utils/parser.js CHANGED
@@ -26,7 +26,9 @@ export function compatiableParse(value, formatToken, baseDate, locale) {
26
26
  result = new Date(Date.parse(value));
27
27
  }
28
28
 
29
- if (!isValid(result)) {
29
+ const yearInvalid = isValid(result) && String(result.getFullYear()).length > 4;
30
+
31
+ if (!isValid(result) || yearInvalid) {
30
32
  result = null;
31
33
  }
32
34
  }
package/lib/es/datePicker/datePicker.css CHANGED
@@ -1,4 +1,3 @@
1
- @charset "UTF-8";
2
1
  /* shadow */
3
2
  /* sizing */
4
3
  /* spacing */
package/lib/es/navigation/navigation.css CHANGED
@@ -1,4 +1,3 @@
1
- @charset "UTF-8";
2
1
  /* shadow */
3
2
  /* sizing */
4
3
  /* spacing */
package/lib/es/notification/notification.css CHANGED
@@ -79,19 +79,23 @@
79
79
  color: var(--semi-color-success);
80
80
  }
81
81
  .semi-notification-notice-light.semi-notification-notice-warning {
82
- background-color: var(--semi-color-warning-light-default);
82
+ background-image: linear-gradient(0deg, var(--semi-color-warning-light-default), var(--semi-color-warning-light-default));
83
+ background-color: var(--semi-color-bg-0);
83
84
  border: 1px solid var(--semi-color-warning);
84
85
  }
85
86
  .semi-notification-notice-light.semi-notification-notice-success {
86
- background-color: var(--semi-color-success-light-default);
87
+ background-image: linear-gradient(0deg, var(--semi-color-success-light-default), var(--semi-color-success-light-default));
88
+ background-color: var(--semi-color-bg-0);
87
89
  border: 1px solid var(--semi-color-success);
88
90
  }
89
91
  .semi-notification-notice-light.semi-notification-notice-info, .semi-notification-notice-light.semi-notification-notice-default {
90
- background-color: var(--semi-color-info-light-default);
92
+ background-image: linear-gradient(0deg, var(--semi-color-info-light-default), var(--semi-color-info-light-default));
93
+ background-color: var(--semi-color-bg-0);
91
94
  border: 1px solid var(--semi-color-info);
92
95
  }
93
96
  .semi-notification-notice-light.semi-notification-notice-error {
94
- background-color: var(--semi-color-danger-light-default);
97
+ background-image: linear-gradient(0deg, var(--semi-color-danger-light-default), var(--semi-color-danger-light-default));
98
+ background-color: var(--semi-color-bg-0);
95
99
  border: 1px solid var(--semi-color-danger);
96
100
  }
97
101
  .semi-notification-notice-title {
package/lib/es/notification/notification.scss CHANGED
@@ -93,23 +93,27 @@ $module: #{$prefix}-notification;
93
93
 
94
94
  &-light {
95
95
  &.#{$module}-notice-warning {
96
- background-color: $color-notification_warning_light-bg;
96
+ background-image: linear-gradient(0deg, $color-notification_warning_light-bg, $color-notification_warning_light-bg);
97
+ background-color: $color-notification_ambient-bg;
97
98
  border: $width-notification_notice-border solid $color-notification_warning_light-border;
98
99
  }
99
100
 
100
101
  &.#{$module}-notice-success {
101
- background-color: $color-notification_success_light-bg;
102
+ background-image: linear-gradient(0deg, $color-notification_success_light-bg, $color-notification_success_light-bg);
103
+ background-color: $color-notification_ambient-bg;
102
104
  border: $width-notification_notice-border solid $color-notification_success_light-border;
103
105
  }
104
106
 
105
107
  &.#{$module}-notice-info,
106
108
  &.#{$module}-notice-default {
107
- background-color: $color-notification_info_light-bg;
109
+ background-image: linear-gradient(0deg, $color-notification_info_light-bg, $color-notification_info_light-bg);
110
+ background-color: $color-notification_ambient-bg;
108
111
  border: $width-notification_notice-border solid $color-notification_info_light-border;
109
112
  }
110
113
 
111
114
  &.#{$module}-notice-error {
112
- background-color: $color-notification_danger_light-bg;
115
+ background-image: linear-gradient(0deg, $color-notification_danger_light-bg, $color-notification_danger_light-bg);
116
+ background-color: $color-notification_ambient-bg;
113
117
  border: $width-notification_notice-border solid $color-notification_danger_light-border;
114
118
  }
115
119
  }
@@ -165,4 +169,4 @@ $module: #{$prefix}-notification;
165
169
  }
166
170
  }
167
171
 
168
- @import "./rtl.scss";
172
+ @import "./rtl.scss";
package/lib/es/notification/variables.scss CHANGED
@@ -15,6 +15,7 @@ $color-notification_info_light-bg: var(--semi-color-info-light-default); // 彩
15
15
  $color-notification_info_light-border: var(--semi-color-info); // 彩色通知信息描边色
16
16
  $color-notification_danger_light-bg: var(--semi-color-danger-light-default); // 彩色通知危险背景色
17
17
  $color-notification_danger_light-border: var(--semi-color-danger); // 彩色通知危险描边色
18
+ $color-notification_ambient-bg: var(--semi-color-bg-0); // 透明背景色叠加层(与bg0保持一致不建议修改)
18
19
 
19
20
  // Width/Height
20
21
  $width-notification_notice: auto; // 通知宽度
package/lib/es/select/foundation.d.ts CHANGED
@@ -82,7 +82,16 @@ export default class SelectFoundation extends BaseFoundation<SelectAdapter> {
82
82
  _handleEnterKeyDown(event: KeyboardEvent): void;
83
83
  _handleBackspaceKeyDown(): void;
84
84
  _notifyChange(selections: Map<any, any>): void;
85
- _removeInternalKey(option: BasicOptionProps): BasicOptionProps;
85
+ _removeInternalKey(option: BasicOptionProps): {
86
+ [x: string]: any;
87
+ value?: string | number;
88
+ label?: unknown;
89
+ children?: unknown;
90
+ disabled?: boolean;
91
+ showTick?: boolean;
92
+ className?: string;
93
+ style?: Record<string, any>;
94
+ };
86
95
  _notifySelect(value: BasicOptionProps['value'], option: BasicOptionProps): void;
87
96
  _notifyDeselect(value: BasicOptionProps['value'], option: BasicOptionProps): void;
88
97
  _diffSelections(selections: Map<any, any>, oldSelections: Map<any, any>, isMultiple: boolean): boolean;
package/lib/es/select/foundation.js CHANGED
@@ -1020,17 +1020,20 @@ export default class SelectFoundation extends BaseFoundation {
1020
1020
  }
1021
1021
 
1022
1022
  _removeInternalKey(option) {
1023
- delete option._parentGroup;
1024
- delete option._show;
1025
- delete option._selected;
1026
- delete option._scrollIndex;
1027
-
1028
- if ('_keyInOptionList' in option) {
1029
- option.key = option._keyInOptionList;
1030
- delete option._keyInOptionList;
1023
+ // eslint-disable-next-line
1024
+ let newOption = _Object$assign({}, option);
1025
+
1026
+ delete newOption._parentGroup;
1027
+ delete newOption._show;
1028
+ delete newOption._selected;
1029
+ delete newOption._scrollIndex;
1030
+
1031
+ if ('_keyInOptionList' in newOption) {
1032
+ newOption.key = newOption._keyInOptionList;
1033
+ delete newOption._keyInOptionList;
1031
1034
  }
1032
1035
 
1033
- return option;
1036
+ return newOption;
1034
1037
  }
1035
1038
 
1036
1039
  _notifySelect(value, option) {
package/notification/notification.scss CHANGED
@@ -93,23 +93,27 @@ $module: #{$prefix}-notification;
93
93
 
94
94
  &-light {
95
95
  &.#{$module}-notice-warning {
96
- background-color: $color-notification_warning_light-bg;
96
+ background-image: linear-gradient(0deg, $color-notification_warning_light-bg, $color-notification_warning_light-bg);
97
+ background-color: $color-notification_ambient-bg;
97
98
  border: $width-notification_notice-border solid $color-notification_warning_light-border;
98
99
  }
99
100
 
100
101
  &.#{$module}-notice-success {
101
- background-color: $color-notification_success_light-bg;
102
+ background-image: linear-gradient(0deg, $color-notification_success_light-bg, $color-notification_success_light-bg);
103
+ background-color: $color-notification_ambient-bg;
102
104
  border: $width-notification_notice-border solid $color-notification_success_light-border;
103
105
  }
104
106
 
105
107
  &.#{$module}-notice-info,
106
108
  &.#{$module}-notice-default {
107
- background-color: $color-notification_info_light-bg;
109
+ background-image: linear-gradient(0deg, $color-notification_info_light-bg, $color-notification_info_light-bg);
110
+ background-color: $color-notification_ambient-bg;
108
111
  border: $width-notification_notice-border solid $color-notification_info_light-border;
109
112
  }
110
113
 
111
114
  &.#{$module}-notice-error {
112
- background-color: $color-notification_danger_light-bg;
115
+ background-image: linear-gradient(0deg, $color-notification_danger_light-bg, $color-notification_danger_light-bg);
116
+ background-color: $color-notification_ambient-bg;
113
117
  border: $width-notification_notice-border solid $color-notification_danger_light-border;
114
118
  }
115
119
  }
@@ -165,4 +169,4 @@ $module: #{$prefix}-notification;
165
169
  }
166
170
  }
167
171
 
168
- @import "./rtl.scss";
172
+ @import "./rtl.scss";
package/notification/variables.scss CHANGED
@@ -15,6 +15,7 @@ $color-notification_info_light-bg: var(--semi-color-info-light-default); // 彩
15
15
  $color-notification_info_light-border: var(--semi-color-info); // 彩色通知信息描边色
16
16
  $color-notification_danger_light-bg: var(--semi-color-danger-light-default); // 彩色通知危险背景色
17
17
  $color-notification_danger_light-border: var(--semi-color-danger); // 彩色通知危险描边色
18
+ $color-notification_ambient-bg: var(--semi-color-bg-0); // 透明背景色叠加层(与bg0保持一致不建议修改)
18
19
 
19
20
  // Width/Height
20
21
  $width-notification_notice: auto; // 通知宽度
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@douyinfe/semi-foundation",
3
- "version": "2.2.0-beta.0",
3
+ "version": "2.2.0-beta.1",
4
4
  "description": "",
5
5
  "scripts": {
6
6
  "build:lib": "node ./scripts/compileLib.js",
@@ -8,7 +8,7 @@
8
8
  },
9
9
  "dependencies": {
10
10
  "@babel/runtime-corejs3": "^7.15.4",
11
- "@douyinfe/semi-animation": "2.2.0-beta.0",
11
+ "@douyinfe/semi-animation": "2.2.0-beta.1",
12
12
  "async-validator": "^3.5.0",
13
13
  "classnames": "^2.2.6",
14
14
  "date-fns": "^2.9.0",
@@ -24,7 +24,7 @@
24
24
  "*.scss",
25
25
  "*.css"
26
26
  ],
27
- "gitHead": "e8ea6a96a5ddd73a178a797548497cd6a64eb14b",
27
+ "gitHead": "b380360d4f966a59369dc1ab895cb23bb9903751",
28
28
  "devDependencies": {
29
29
  "@babel/plugin-proposal-decorators": "^7.15.8",
30
30
  "@babel/plugin-transform-runtime": "^7.15.8",
@@ -38,7 +38,7 @@
38
38
  "gulp-sass": "^5.0.0",
39
39
  "gulp-typescript": "^6.0.0-alpha.1",
40
40
  "merge2": "^1.4.1",
41
- "sass": "1.32.13",
41
+ "sass": "1.45.0",
42
42
  "through2": "^4.0.2"
43
43
  }
44
44
  }
package/select/foundation.ts CHANGED
@@ -785,15 +785,17 @@ export default class SelectFoundation extends BaseFoundation<SelectAdapter> {
785
785
  }
786
786
 
787
787
  _removeInternalKey(option: BasicOptionProps) {
788
- delete option._parentGroup;
789
- delete option._show;
790
- delete option._selected;
791
- delete option._scrollIndex;
792
- if ('_keyInOptionList' in option) {
793
- option.key = option._keyInOptionList;
794
- delete option._keyInOptionList;
795
- }
796
- return option;
788
+ // eslint-disable-next-line
789
+ let newOption = { ...option };
790
+ delete newOption._parentGroup;
791
+ delete newOption._show;
792
+ delete newOption._selected;
793
+ delete newOption._scrollIndex;
794
+ if ('_keyInOptionList' in newOption) {
795
+ newOption.key = newOption._keyInOptionList;
796
+ delete newOption._keyInOptionList;
797
+ }
798
+ return newOption;
797
799
  }
798
800
 
799
801
  _notifySelect(value: BasicOptionProps['value'], option: BasicOptionProps) {