@douyinfe/semi-ui 2.24.0-alpha.1 → 2.24.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 (67) hide show
  1. package/dist/css/semi.css +37 -10
  2. package/dist/css/semi.min.css +1 -1
  3. package/dist/umd/semi-ui.js +384 -225
  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/_base/base.css +4 -0
  8. package/lib/cjs/_utils/index.d.ts +3 -3
  9. package/lib/cjs/carousel/CarouselIndicator.d.ts +1 -1
  10. package/lib/cjs/carousel/index.d.ts +2 -2
  11. package/lib/cjs/form/baseForm.d.ts +3 -3
  12. package/lib/cjs/form/field.d.ts +3 -3
  13. package/lib/cjs/form/hoc/withField.js +4 -0
  14. package/lib/cjs/highlight/index.d.ts +37 -0
  15. package/lib/cjs/highlight/index.js +72 -0
  16. package/lib/cjs/image/image.js +4 -1
  17. package/lib/cjs/image/index.d.ts +1 -1
  18. package/lib/cjs/image/interface.d.ts +2 -0
  19. package/lib/cjs/image/previewImage.js +4 -2
  20. package/lib/cjs/image/previewInner.d.ts +5 -0
  21. package/lib/cjs/image/previewInner.js +43 -0
  22. package/lib/cjs/index.d.ts +1 -0
  23. package/lib/cjs/index.js +8 -0
  24. package/lib/cjs/modal/Modal.d.ts +1 -1
  25. package/lib/cjs/modal/Modal.js +4 -4
  26. package/lib/cjs/navigation/SubNav.js +6 -1
  27. package/lib/cjs/navigation/index.d.ts +2 -0
  28. package/lib/cjs/navigation/index.js +6 -3
  29. package/lib/cjs/navigation/nav-context.d.ts +3 -1
  30. package/lib/cjs/radio/radio.d.ts +1 -1
  31. package/lib/cjs/radio/radioGroup.d.ts +1 -1
  32. package/lib/cjs/select/index.d.ts +2 -0
  33. package/lib/cjs/select/index.js +9 -1
  34. package/lib/cjs/timePicker/TimePicker.js +0 -1
  35. package/lib/cjs/typography/numeral.d.ts +1 -1
  36. package/lib/cjs/typography/title.d.ts +1 -1
  37. package/lib/es/_base/base.css +4 -0
  38. package/lib/es/_utils/index.d.ts +3 -3
  39. package/lib/es/carousel/CarouselIndicator.d.ts +1 -1
  40. package/lib/es/carousel/index.d.ts +2 -2
  41. package/lib/es/form/baseForm.d.ts +3 -3
  42. package/lib/es/form/field.d.ts +3 -3
  43. package/lib/es/form/hoc/withField.js +4 -0
  44. package/lib/es/highlight/index.d.ts +37 -0
  45. package/lib/es/highlight/index.js +56 -0
  46. package/lib/es/image/image.js +3 -1
  47. package/lib/es/image/index.d.ts +1 -1
  48. package/lib/es/image/interface.d.ts +2 -0
  49. package/lib/es/image/previewImage.js +4 -2
  50. package/lib/es/image/previewInner.d.ts +5 -0
  51. package/lib/es/image/previewInner.js +43 -0
  52. package/lib/es/index.d.ts +1 -0
  53. package/lib/es/index.js +1 -0
  54. package/lib/es/modal/Modal.d.ts +1 -1
  55. package/lib/es/modal/Modal.js +4 -4
  56. package/lib/es/navigation/SubNav.js +6 -1
  57. package/lib/es/navigation/index.d.ts +2 -0
  58. package/lib/es/navigation/index.js +6 -3
  59. package/lib/es/navigation/nav-context.d.ts +3 -1
  60. package/lib/es/radio/radio.d.ts +1 -1
  61. package/lib/es/radio/radioGroup.d.ts +1 -1
  62. package/lib/es/select/index.d.ts +2 -0
  63. package/lib/es/select/index.js +8 -1
  64. package/lib/es/timePicker/TimePicker.js +0 -1
  65. package/lib/es/typography/numeral.d.ts +1 -1
  66. package/lib/es/typography/title.d.ts +1 -1
  67. package/package.json +8 -8
package/dist/css/semi.css CHANGED
@@ -419,6 +419,8 @@ body, body[theme-mode=dark] .semi-always-light {
419
419
  --semi-border-radius-large: 12px;
420
420
  --semi-border-radius-circle: 50%;
421
421
  --semi-border-radius-full: 9999px;
422
+ --semi-color-highlight-bg: rgba(var(--semi-yellow-4), 1);
423
+ --semi-color-highlight: rgba(var(--semi-black), 1);
422
424
  }
423
425
 
424
426
  body[theme-mode=dark], body .semi-always-dark {
@@ -507,6 +509,8 @@ body[theme-mode=dark], body .semi-always-dark {
507
509
  --semi-border-radius-large: 12px;
508
510
  --semi-border-radius-circle: 50%;
509
511
  --semi-border-radius-full: 9999px;
512
+ --semi-color-highlight-bg: rgba(var(--semi-yellow-2), 1);
513
+ --semi-color-highlight: rgba(var(--semi-white), 1);
510
514
  }
511
515
 
512
516
  body {
@@ -3181,18 +3185,28 @@ body {
3181
3185
  background: transparent;
3182
3186
  margin-left: -4px;
3183
3187
  }
3188
+ .semi-cascader-selection .semi-tagInput-wrapper-default {
3189
+ min-height: 30px;
3190
+ }
3191
+ .semi-cascader-selection .semi-tagInput-wrapper-small {
3192
+ min-height: 22px;
3193
+ }
3194
+ .semi-cascader-selection .semi-tagInput-wrapper-large {
3195
+ min-height: 38px;
3196
+ }
3184
3197
  .semi-cascader-selection .semi-tagInput .semi-input-wrapper {
3185
- height: 30px;
3186
3198
  margin-left: 4px;
3187
3199
  }
3188
3200
  .semi-cascader-selection .semi-tagInput .semi-input-wrapper .semi-input {
3189
3201
  padding-left: 0;
3190
3202
  }
3191
- .semi-cascader-selection .semi-tagInput .semi-input-wrapper-small {
3192
- height: 22px;
3203
+ .semi-cascader-selection .semi-tagInput .semi-input-wrapper-default {
3204
+ margin-top: 1px;
3205
+ margin-bottom: 1px;
3193
3206
  }
3194
3207
  .semi-cascader-selection .semi-tagInput .semi-input-wrapper-large {
3195
- height: 38px;
3208
+ margin-top: 1px;
3209
+ margin-bottom: 1px;
3196
3210
  }
3197
3211
  .semi-cascader-selection-text-inactive {
3198
3212
  color: var(--semi-color-text-2);
@@ -11143,6 +11157,12 @@ body {
11143
11157
  direction: rtl;
11144
11158
  }
11145
11159
 
11160
+ .semi-highlight-tag {
11161
+ color: var(--semi-color-highlight);
11162
+ background-color: var(--semi-color-highlight-bg);
11163
+ font-weight: 600;
11164
+ }
11165
+
11146
11166
  .semi-image {
11147
11167
  border-radius: var(--semi-border-radius-small);
11148
11168
  position: relative;
@@ -18317,7 +18337,6 @@ img[src=""], img:not([src]) {
18317
18337
  .semi-tagInput-wrapper .semi-tagInput-wrapper-input {
18318
18338
  flex-grow: 1;
18319
18339
  width: min-content;
18320
- min-width: 38px;
18321
18340
  border: none;
18322
18341
  outline: none;
18323
18342
  background-color: transparent;
@@ -19811,17 +19830,25 @@ img[src=""], img:not([src]) {
19811
19830
  padding-left: 4px;
19812
19831
  padding-right: 4px;
19813
19832
  }
19814
- .semi-tree-select-selection .semi-tagInput .semi-tagInput-wrapper .semi-input-wrapper {
19815
- height: 30px;
19833
+ .semi-tree-select-selection .semi-tagInput .semi-tagInput-wrapper-default {
19834
+ min-height: 30px;
19835
+ }
19836
+ .semi-tree-select-selection .semi-tagInput .semi-tagInput-wrapper-small {
19837
+ min-height: 22px;
19838
+ }
19839
+ .semi-tree-select-selection .semi-tagInput .semi-tagInput-wrapper-large {
19840
+ min-height: 38px;
19816
19841
  }
19817
19842
  .semi-tree-select-selection .semi-tagInput .semi-tagInput-wrapper .semi-input-wrapper .semi-input {
19818
19843
  padding-left: 0;
19819
19844
  }
19820
- .semi-tree-select-selection .semi-tagInput .semi-tagInput-wrapper .semi-input-wrapper-small {
19821
- height: 22px;
19845
+ .semi-tree-select-selection .semi-tagInput .semi-tagInput-wrapper .semi-input-wrapper-default {
19846
+ margin-top: 1px;
19847
+ margin-bottom: 1px;
19822
19848
  }
19823
19849
  .semi-tree-select-selection .semi-tagInput .semi-tagInput-wrapper .semi-input-wrapper-large {
19824
- height: 38px;
19850
+ margin-top: 1px;
19851
+ margin-bottom: 1px;
19825
19852
  }
19826
19853
  .semi-tree-select-multiple-tagInput-notEmpty .semi-tagInput {
19827
19854
  margin-left: -4px;