@univerjs/preset-docs-core 1.0.0-alpha.8 → 1.0.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 (2) hide show
  1. package/lib/index.css +338 -102
  2. package/package.json +11 -11
package/lib/index.css CHANGED
@@ -91,10 +91,7 @@
91
91
  }
92
92
 
93
93
  .univer-inset-0 {
94
- top: 0;
95
- bottom: 0;
96
- left: 0;
97
- right: 0;
94
+ inset: 0;
98
95
  }
99
96
 
100
97
  .univer-inset-x-0 {
@@ -658,6 +655,12 @@
658
655
  transform: translate(var(--univer-tw-translate-x), var(--univer-tw-translate-y)) rotate(var(--univer-tw-rotate)) skewX(var(--univer-tw-skew-x)) skewY(var(--univer-tw-skew-y)) scaleX(var(--univer-tw-scale-x)) scaleY(var(--univer-tw-scale-y));
659
656
  }
660
657
 
658
+ .univer-rotate-90 {
659
+ --univer-tw-rotate: 90deg;
660
+ transform: translate(var(--univer-tw-translate-x), var(--univer-tw-translate-y)) rotate(90deg) skewX(var(--univer-tw-skew-x)) skewY(var(--univer-tw-skew-y)) scaleX(var(--univer-tw-scale-x)) scaleY(var(--univer-tw-scale-y));
661
+ transform: translate(var(--univer-tw-translate-x), var(--univer-tw-translate-y)) rotate(var(--univer-tw-rotate)) skewX(var(--univer-tw-skew-x)) skewY(var(--univer-tw-skew-y)) scaleX(var(--univer-tw-scale-x)) scaleY(var(--univer-tw-scale-y));
662
+ }
663
+
661
664
  .univer-rotate-\[-90deg\] {
662
665
  --univer-tw-rotate: -90deg;
663
666
  transform: translate(var(--univer-tw-translate-x), var(--univer-tw-translate-y)) rotate(-90deg) skewX(var(--univer-tw-skew-x)) skewY(var(--univer-tw-skew-y)) scaleX(var(--univer-tw-scale-x)) scaleY(var(--univer-tw-scale-y));
@@ -723,7 +726,6 @@
723
726
  }
724
727
 
725
728
  .univer-appearance-none {
726
- -webkit-appearance: none;
727
729
  appearance: none;
728
730
  }
729
731
 
@@ -1042,6 +1044,10 @@
1042
1044
  border-color: var(--univer-gray-200) !important;
1043
1045
  }
1044
1046
 
1047
+ .univer-border-gray-0 {
1048
+ border-color: var(--univer-gray-0);
1049
+ }
1050
+
1045
1051
  .univer-border-gray-100 {
1046
1052
  border-color: var(--univer-gray-100);
1047
1053
  }
@@ -1078,10 +1084,6 @@
1078
1084
  border-color: #0000;
1079
1085
  }
1080
1086
 
1081
- .univer-border-white {
1082
- border-color: var(--univer-white);
1083
- }
1084
-
1085
1087
  .\!univer-bg-gray-500 {
1086
1088
  background-color: var(--univer-gray-500) !important;
1087
1089
  }
@@ -1104,6 +1106,10 @@
1104
1106
  background-color: #000c;
1105
1107
  }
1106
1108
 
1109
+ .univer-bg-gray-0 {
1110
+ background-color: var(--univer-gray-0);
1111
+ }
1112
+
1107
1113
  .univer-bg-gray-100 {
1108
1114
  background-color: var(--univer-gray-100);
1109
1115
  }
@@ -1160,10 +1166,6 @@
1160
1166
  background-color: #0000;
1161
1167
  }
1162
1168
 
1163
- .univer-bg-white {
1164
- background-color: var(--univer-white);
1165
- }
1166
-
1167
1169
  .univer-bg-gradient-to-br {
1168
1170
  background-image: linear-gradient(to bottom right, var(--univer-tw-gradient-stops));
1169
1171
  }
@@ -1476,6 +1478,10 @@
1476
1478
  letter-spacing: .1em;
1477
1479
  }
1478
1480
 
1481
+ .\!univer-text-gray-0 {
1482
+ color: var(--univer-gray-0) !important;
1483
+ }
1484
+
1479
1485
  .\!univer-text-gray-400 {
1480
1486
  color: var(--univer-gray-400) !important;
1481
1487
  }
@@ -1484,10 +1490,6 @@
1484
1490
  color: var(--univer-primary-500) !important;
1485
1491
  }
1486
1492
 
1487
- .\!univer-text-white {
1488
- color: var(--univer-white) !important;
1489
- }
1490
-
1491
1493
  .univer-text-amber-500 {
1492
1494
  --univer-tw-text-opacity: 1;
1493
1495
  color: rgba(245, 158, 11, var(--univer-tw-text-opacity, 1));
@@ -1502,6 +1504,10 @@
1502
1504
  color: rgba(14, 116, 144, var(--univer-tw-text-opacity, 1));
1503
1505
  }
1504
1506
 
1507
+ .univer-text-gray-0 {
1508
+ color: var(--univer-gray-0);
1509
+ }
1510
+
1505
1511
  .univer-text-gray-400 {
1506
1512
  color: var(--univer-gray-400);
1507
1513
  }
@@ -1582,10 +1588,6 @@
1582
1588
  color: rgba(139, 92, 246, var(--univer-tw-text-opacity, 1));
1583
1589
  }
1584
1590
 
1585
- .univer-text-white {
1586
- color: var(--univer-white);
1587
- }
1588
-
1589
1591
  .univer-underline-offset-4 {
1590
1592
  text-underline-offset: 4px;
1591
1593
  }
@@ -1672,6 +1674,10 @@
1672
1674
  --univer-tw-ring-color: var(--univer-primary-900) !important;
1673
1675
  }
1674
1676
 
1677
+ .univer-ring-gray-0 {
1678
+ --univer-tw-ring-color: var(--univer-gray-0);
1679
+ }
1680
+
1675
1681
  .univer-ring-primary-50 {
1676
1682
  --univer-tw-ring-color: var(--univer-primary-50);
1677
1683
  }
@@ -1680,10 +1686,6 @@
1680
1686
  --univer-tw-ring-color: var(--univer-primary-500);
1681
1687
  }
1682
1688
 
1683
- .univer-ring-white {
1684
- --univer-tw-ring-color: var(--univer-white);
1685
- }
1686
-
1687
1689
  .univer-ring-offset-2 {
1688
1690
  --univer-tw-ring-offset-width: 2px;
1689
1691
  }
@@ -1692,8 +1694,8 @@
1692
1694
  --univer-tw-ring-offset-color: var(--univer-gray-600) !important;
1693
1695
  }
1694
1696
 
1695
- .univer-ring-offset-white {
1696
- --univer-tw-ring-offset-color: var(--univer-white);
1697
+ .univer-ring-offset-gray-0 {
1698
+ --univer-tw-ring-offset-color: var(--univer-gray-0);
1697
1699
  }
1698
1700
 
1699
1701
  .univer-drop-shadow-sm {
@@ -2114,6 +2116,10 @@
2114
2116
  background-color: var(--univer-red-400);
2115
2117
  }
2116
2118
 
2119
+ .hover\:univer-text-gray-0:hover {
2120
+ color: var(--univer-gray-0);
2121
+ }
2122
+
2117
2123
  .hover\:univer-text-gray-500:hover {
2118
2124
  color: var(--univer-gray-500);
2119
2125
  }
@@ -2126,10 +2132,6 @@
2126
2132
  color: var(--univer-primary-500);
2127
2133
  }
2128
2134
 
2129
- .hover\:univer-text-white:hover {
2130
- color: var(--univer-white);
2131
- }
2132
-
2133
2135
  .hover\:univer-underline:hover {
2134
2136
  text-decoration-line: underline;
2135
2137
  }
@@ -2284,6 +2286,16 @@
2284
2286
  transform: translate(var(--univer-tw-translate-x), var(--univer-tw-translate-y)) rotate(var(--univer-tw-rotate)) skewX(var(--univer-tw-skew-x)) skewY(var(--univer-tw-skew-y)) scaleX(var(--univer-tw-scale-x)) scaleY(var(--univer-tw-scale-y));
2285
2287
  }
2286
2288
 
2289
+ .rtl\:univer-rotate-90:where([dir="rtl"], [dir="rtl"] *) {
2290
+ --univer-tw-rotate: 90deg;
2291
+ transform: translate(var(--univer-tw-translate-x), var(--univer-tw-translate-y)) rotate(90deg) skewX(var(--univer-tw-skew-x)) skewY(var(--univer-tw-skew-y)) scaleX(var(--univer-tw-scale-x)) scaleY(var(--univer-tw-scale-y));
2292
+ transform: translate(var(--univer-tw-translate-x), var(--univer-tw-translate-y)) rotate(var(--univer-tw-rotate)) skewX(var(--univer-tw-skew-x)) skewY(var(--univer-tw-skew-y)) scaleX(var(--univer-tw-scale-x)) scaleY(var(--univer-tw-scale-y));
2293
+ }
2294
+
2295
+ .rtl\:univer-flex-row-reverse:where([dir="rtl"], [dir="rtl"] *) {
2296
+ flex-direction: row-reverse;
2297
+ }
2298
+
2287
2299
  .rtl\:univer-rounded-l-md:where([dir="rtl"], [dir="rtl"] *) {
2288
2300
  border-top-left-radius: .375rem;
2289
2301
  border-bottom-left-radius: .375rem;
@@ -2380,6 +2392,10 @@
2380
2392
  background-color: #0000 !important;
2381
2393
  }
2382
2394
 
2395
+ .dark\:\!univer-text-gray-0:where(.univer-dark, .univer-dark *) {
2396
+ color: var(--univer-gray-0) !important;
2397
+ }
2398
+
2383
2399
  .dark\:\!univer-text-gray-100:where(.univer-dark, .univer-dark *) {
2384
2400
  color: var(--univer-gray-100) !important;
2385
2401
  }
@@ -2417,10 +2433,6 @@
2417
2433
  color: rgba(56, 189, 248, var(--univer-tw-text-opacity, 1)) !important;
2418
2434
  }
2419
2435
 
2420
- .dark\:\!univer-text-white:where(.univer-dark, .univer-dark *) {
2421
- color: var(--univer-white) !important;
2422
- }
2423
-
2424
2436
  .dark\:\!univer-ring-primary-600:where(.univer-dark, .univer-dark *) {
2425
2437
  --univer-tw-ring-color: var(--univer-primary-600) !important;
2426
2438
  }
@@ -2446,11 +2458,7 @@
2446
2458
  background-color: var(--univer-gray-600) !important;
2447
2459
  }
2448
2460
 
2449
- .dark\:data-\[selected\=true\]\:\!univer-bg-gray-600[data-selected="true"]:where(.univer-dark, .univer-dark *) {
2450
- background-color: var(--univer-gray-600) !important;
2451
- }
2452
-
2453
- .dark\:data-\[state\=open\]\:\!univer-bg-gray-600[data-state="open"]:where(.univer-dark, .univer-dark *) {
2461
+ .dark\:data-\[selected\=true\]\:\!univer-bg-gray-600[data-selected="true"]:where(.univer-dark, .univer-dark *), .dark\:data-\[state\=open\]\:\!univer-bg-gray-600[data-state="open"]:where(.univer-dark, .univer-dark *) {
2454
2462
  background-color: var(--univer-gray-600) !important;
2455
2463
  }
2456
2464
 
@@ -2466,8 +2474,8 @@
2466
2474
  background-color: var(--univer-gray-700) !important;
2467
2475
  }
2468
2476
 
2469
- .dark\:hover\:\!univer-text-white:hover:where(.univer-dark, .univer-dark *) {
2470
- color: var(--univer-white) !important;
2477
+ .dark\:hover\:\!univer-text-gray-0:hover:where(.univer-dark, .univer-dark *) {
2478
+ color: var(--univer-gray-0) !important;
2471
2479
  }
2472
2480
 
2473
2481
  .dark\:focus\:\!univer-border-primary-500:focus:where(.univer-dark, .univer-dark *) {
@@ -2503,7 +2511,6 @@
2503
2511
  }
2504
2512
 
2505
2513
  .\[\&\:\:-webkit-calendar-picker-indicator\]\:univer-appearance-none::-webkit-calendar-picker-indicator {
2506
- -webkit-appearance: none;
2507
2514
  appearance: none;
2508
2515
  }
2509
2516
 
@@ -2523,8 +2530,8 @@
2523
2530
  border-color: var(--univer-gray-600) !important;
2524
2531
  }
2525
2532
 
2526
- .dark\:\[\&\>input\]\:\!univer-text-white > input:where(.univer-dark, .univer-dark *) {
2527
- color: var(--univer-white) !important;
2533
+ .dark\:\[\&\>input\]\:\!univer-text-gray-0 > input:where(.univer-dark, .univer-dark *) {
2534
+ color: var(--univer-gray-0) !important;
2528
2535
  }
2529
2536
 
2530
2537
  .\[\&\>svg\]\:univer-block > svg {
@@ -2769,12 +2776,12 @@
2769
2776
  line-height: 1.25rem;
2770
2777
  }
2771
2778
 
2772
- .\[\&_input\]\:univer-text-gray-700 input {
2773
- color: var(--univer-gray-700);
2779
+ .\[\&_input\]\:univer-text-gray-0 input {
2780
+ color: var(--univer-gray-0);
2774
2781
  }
2775
2782
 
2776
- .\[\&_input\]\:univer-text-white input {
2777
- color: var(--univer-white);
2783
+ .\[\&_input\]\:univer-text-gray-700 input {
2784
+ color: var(--univer-gray-700);
2778
2785
  }
2779
2786
 
2780
2787
  .\[\&_input\]\:univer-outline-none input {
@@ -2850,6 +2857,10 @@
2850
2857
  z-index: 1019;
2851
2858
  }
2852
2859
 
2860
+ .univer-m-0 {
2861
+ margin: 0;
2862
+ }
2863
+
2853
2864
  .univer-my-1 {
2854
2865
  margin-top: .25rem;
2855
2866
  margin-bottom: .25rem;
@@ -2863,6 +2874,10 @@
2863
2874
  margin-bottom: .5rem;
2864
2875
  }
2865
2876
 
2877
+ .univer-mb-3 {
2878
+ margin-bottom: .75rem;
2879
+ }
2880
+
2866
2881
  .univer-mb-4 {
2867
2882
  margin-bottom: 1rem;
2868
2883
  }
@@ -2871,6 +2886,10 @@
2871
2886
  margin-right: .25rem;
2872
2887
  }
2873
2888
 
2889
+ .univer-mt-0\.5 {
2890
+ margin-top: .125rem;
2891
+ }
2892
+
2874
2893
  .univer-mt-1\.5 {
2875
2894
  margin-top: .375rem;
2876
2895
  }
@@ -2907,11 +2926,30 @@
2907
2926
  display: grid;
2908
2927
  }
2909
2928
 
2929
+ .univer-contents {
2930
+ display: contents;
2931
+ }
2932
+
2910
2933
  .univer-size-0\.5 {
2911
2934
  width: .125rem;
2912
2935
  height: .125rem;
2913
2936
  }
2914
2937
 
2938
+ .univer-size-3 {
2939
+ width: .75rem;
2940
+ height: .75rem;
2941
+ }
2942
+
2943
+ .univer-size-3\.5 {
2944
+ width: .875rem;
2945
+ height: .875rem;
2946
+ }
2947
+
2948
+ .univer-size-4 {
2949
+ width: 1rem;
2950
+ height: 1rem;
2951
+ }
2952
+
2915
2953
  .univer-size-5 {
2916
2954
  width: 1.25rem;
2917
2955
  height: 1.25rem;
@@ -2927,10 +2965,18 @@
2927
2965
  height: 100%;
2928
2966
  }
2929
2967
 
2968
+ .\!univer-h-7 {
2969
+ height: 1.75rem !important;
2970
+ }
2971
+
2930
2972
  .univer-h-0\.5 {
2931
2973
  height: .125rem;
2932
2974
  }
2933
2975
 
2976
+ .univer-h-1 {
2977
+ height: .25rem;
2978
+ }
2979
+
2934
2980
  .univer-h-16 {
2935
2981
  height: 4rem;
2936
2982
  }
@@ -2975,10 +3021,18 @@
2975
3021
  width: 7rem;
2976
3022
  }
2977
3023
 
3024
+ .univer-w-3 {
3025
+ width: .75rem;
3026
+ }
3027
+
2978
3028
  .univer-w-4\/5 {
2979
3029
  width: 80%;
2980
3030
  }
2981
3031
 
3032
+ .univer-w-80 {
3033
+ width: 20rem;
3034
+ }
3035
+
2982
3036
  .univer-w-\[0px\] {
2983
3037
  width: 0;
2984
3038
  }
@@ -3011,10 +3065,20 @@
3011
3065
  flex: 1;
3012
3066
  }
3013
3067
 
3014
- .univer-flex-shrink-0 {
3068
+ .univer-flex-shrink-0, .univer-shrink-0 {
3015
3069
  flex-shrink: 0;
3016
3070
  }
3017
3071
 
3072
+ @keyframes univer-spin {
3073
+ to {
3074
+ transform: rotate(360deg);
3075
+ }
3076
+ }
3077
+
3078
+ .univer-animate-spin {
3079
+ animation: 1s linear infinite univer-spin;
3080
+ }
3081
+
3018
3082
  .univer-cursor-grab {
3019
3083
  cursor: grab;
3020
3084
  }
@@ -3035,6 +3099,14 @@
3035
3099
  grid-template-columns: repeat(4, minmax(0, 1fr));
3036
3100
  }
3037
3101
 
3102
+ .univer-grid-cols-\[1fr_auto\] {
3103
+ grid-template-columns: 1fr auto;
3104
+ }
3105
+
3106
+ .univer-grid-rows-4 {
3107
+ grid-template-rows: repeat(4, minmax(0, 1fr));
3108
+ }
3109
+
3038
3110
  .univer-flex-col {
3039
3111
  flex-direction: column;
3040
3112
  }
@@ -3071,6 +3143,10 @@
3071
3143
  gap: .25rem;
3072
3144
  }
3073
3145
 
3146
+ .univer-gap-1\.5 {
3147
+ gap: .375rem;
3148
+ }
3149
+
3074
3150
  .univer-gap-2 {
3075
3151
  gap: .5rem;
3076
3152
  }
@@ -3092,6 +3168,15 @@
3092
3168
  column-gap: .125rem;
3093
3169
  }
3094
3170
 
3171
+ .univer-gap-x-5 {
3172
+ -moz-column-gap: 1.25rem;
3173
+ column-gap: 1.25rem;
3174
+ }
3175
+
3176
+ .univer-gap-y-2 {
3177
+ row-gap: .5rem;
3178
+ }
3179
+
3095
3180
  .univer-gap-y-px {
3096
3181
  row-gap: 1px;
3097
3182
  }
@@ -3179,6 +3264,10 @@
3179
3264
  background-color: var(--univer-primary-900) !important;
3180
3265
  }
3181
3266
 
3267
+ .univer-bg-gray-0 {
3268
+ background-color: var(--univer-gray-0);
3269
+ }
3270
+
3182
3271
  .univer-bg-gray-100 {
3183
3272
  background-color: var(--univer-gray-100);
3184
3273
  }
@@ -3191,6 +3280,10 @@
3191
3280
  background-color: var(--univer-gray-400);
3192
3281
  }
3193
3282
 
3283
+ .univer-bg-gray-50 {
3284
+ background-color: var(--univer-gray-50);
3285
+ }
3286
+
3194
3287
  .univer-bg-primary-600 {
3195
3288
  background-color: var(--univer-primary-600);
3196
3289
  }
@@ -3199,10 +3292,6 @@
3199
3292
  background-color: #0000;
3200
3293
  }
3201
3294
 
3202
- .univer-bg-white {
3203
- background-color: var(--univer-white);
3204
- }
3205
-
3206
3295
  .univer-p-0 {
3207
3296
  padding: 0;
3208
3297
  }
@@ -3215,6 +3304,14 @@
3215
3304
  padding: .375rem;
3216
3305
  }
3217
3306
 
3307
+ .univer-p-2 {
3308
+ padding: .5rem;
3309
+ }
3310
+
3311
+ .univer-p-4 {
3312
+ padding: 1rem;
3313
+ }
3314
+
3218
3315
  .univer-px-2 {
3219
3316
  padding-left: .5rem;
3220
3317
  padding-right: .5rem;
@@ -3252,6 +3349,14 @@
3252
3349
  padding-left: .375rem;
3253
3350
  }
3254
3351
 
3352
+ .univer-pl-2 {
3353
+ padding-left: .5rem;
3354
+ }
3355
+
3356
+ .univer-pl-4 {
3357
+ padding-left: 1rem;
3358
+ }
3359
+
3255
3360
  .univer-pr-1 {
3256
3361
  padding-right: .25rem;
3257
3362
  }
@@ -3272,6 +3377,18 @@
3272
3377
  padding-top: .5rem;
3273
3378
  }
3274
3379
 
3380
+ .univer-text-center {
3381
+ text-align: center;
3382
+ }
3383
+
3384
+ .univer-text-right {
3385
+ text-align: right;
3386
+ }
3387
+
3388
+ .univer-text-\[10px\] {
3389
+ font-size: 10px;
3390
+ }
3391
+
3275
3392
  .univer-text-base {
3276
3393
  font-size: 1rem;
3277
3394
  line-height: 1.5rem;
@@ -3304,6 +3421,14 @@
3304
3421
  font-weight: 600;
3305
3422
  }
3306
3423
 
3424
+ .univer-tabular-nums {
3425
+ --univer-tw-numeric-spacing: tabular-nums;
3426
+ font-feature-settings: var(--univer-tw-ordinal) var(--univer-tw-slashed-zero) var(--univer-tw-numeric-figure) tabular-nums var(--univer-tw-numeric-fraction);
3427
+ font-feature-settings: var(--univer-tw-ordinal) var(--univer-tw-slashed-zero) var(--univer-tw-numeric-figure) var(--univer-tw-numeric-spacing) var(--univer-tw-numeric-fraction);
3428
+ font-variant-numeric: var(--univer-tw-ordinal) var(--univer-tw-slashed-zero) var(--univer-tw-numeric-figure) tabular-nums var(--univer-tw-numeric-fraction);
3429
+ font-variant-numeric: var(--univer-tw-ordinal) var(--univer-tw-slashed-zero) var(--univer-tw-numeric-figure) var(--univer-tw-numeric-spacing) var(--univer-tw-numeric-fraction);
3430
+ }
3431
+
3307
3432
  .univer-leading-5 {
3308
3433
  line-height: 1.25rem;
3309
3434
  }
@@ -3312,6 +3437,14 @@
3312
3437
  line-height: 24px;
3313
3438
  }
3314
3439
 
3440
+ .univer-leading-none {
3441
+ line-height: 1;
3442
+ }
3443
+
3444
+ .\!univer-text-gray-0 {
3445
+ color: var(--univer-gray-0) !important;
3446
+ }
3447
+
3315
3448
  .\!univer-text-gray-200 {
3316
3449
  color: var(--univer-gray-200) !important;
3317
3450
  }
@@ -3320,12 +3453,12 @@
3320
3453
  color: var(--univer-gray-400) !important;
3321
3454
  }
3322
3455
 
3323
- .\!univer-text-primary-600 {
3324
- color: var(--univer-primary-600) !important;
3456
+ .\!univer-text-gray-600 {
3457
+ color: var(--univer-gray-600) !important;
3325
3458
  }
3326
3459
 
3327
- .\!univer-text-white {
3328
- color: var(--univer-white) !important;
3460
+ .\!univer-text-primary-600 {
3461
+ color: var(--univer-primary-600) !important;
3329
3462
  }
3330
3463
 
3331
3464
  .univer-text-gray-400 {
@@ -3359,6 +3492,13 @@
3359
3492
  box-shadow: var(--univer-tw-ring-offset-shadow, 0 0 #0000), var(--univer-tw-ring-shadow, 0 0 #0000), var(--univer-tw-shadow);
3360
3493
  }
3361
3494
 
3495
+ .univer-shadow-lg {
3496
+ --univer-tw-shadow: 0px 4px 6px 0px #1e284d0d, 0px 10px 15px -3px #1e284d1a;
3497
+ --univer-tw-shadow-colored: 0px 4px 6px 0px var(--univer-tw-shadow-color), 0px 10px 15px -3px var(--univer-tw-shadow-color);
3498
+ box-shadow: 0 0 #0000, 0 0 #0000, 0 4px 6px #1e284d0d, 0 10px 15px -3px #1e284d1a;
3499
+ box-shadow: var(--univer-tw-ring-offset-shadow, 0 0 #0000), var(--univer-tw-ring-shadow, 0 0 #0000), var(--univer-tw-shadow);
3500
+ }
3501
+
3362
3502
  .univer-shadow-md {
3363
3503
  --univer-tw-shadow: 0px 1px 6px -2px #1e284d14, 0px 2px 6px -1px #1e284d1a;
3364
3504
  --univer-tw-shadow-colored: 0px 1px 6px -2px var(--univer-tw-shadow-color), 0px 2px 6px -1px var(--univer-tw-shadow-color);
@@ -3402,12 +3542,12 @@
3402
3542
  border-color: var(--univer-primary-500);
3403
3543
  }
3404
3544
 
3405
- .hover\:univer-bg-gray-50:hover {
3406
- background-color: var(--univer-gray-50);
3545
+ .hover\:univer-bg-gray-0:hover {
3546
+ background-color: var(--univer-gray-0);
3407
3547
  }
3408
3548
 
3409
- .hover\:univer-bg-white:hover {
3410
- background-color: var(--univer-white);
3549
+ .hover\:univer-bg-gray-50:hover {
3550
+ background-color: var(--univer-gray-50);
3411
3551
  }
3412
3552
 
3413
3553
  .hover\:univer-text-gray-900:hover {
@@ -3425,10 +3565,25 @@
3425
3565
  box-shadow: var(--univer-tw-ring-offset-shadow, 0 0 #0000), var(--univer-tw-ring-shadow, 0 0 #0000), var(--univer-tw-shadow);
3426
3566
  }
3427
3567
 
3568
+ .focus-visible\:univer-ring-2:focus-visible {
3569
+ --univer-tw-ring-offset-shadow: var(--univer-tw-ring-inset) 0 0 0 var(--univer-tw-ring-offset-width) var(--univer-tw-ring-offset-color);
3570
+ --univer-tw-ring-shadow: var(--univer-tw-ring-inset) 0 0 0 calc(2px + var(--univer-tw-ring-offset-width)) var(--univer-tw-ring-color);
3571
+ box-shadow: var(--univer-tw-ring-offset-shadow), var(--univer-tw-ring-shadow), 0 0 #0000;
3572
+ box-shadow: var(--univer-tw-ring-offset-shadow), var(--univer-tw-ring-shadow), var(--univer-tw-shadow, 0 0 #0000);
3573
+ }
3574
+
3575
+ .focus-visible\:univer-ring-primary-500:focus-visible {
3576
+ --univer-tw-ring-color: var(--univer-primary-500);
3577
+ }
3578
+
3428
3579
  .active\:univer-cursor-grabbing:active {
3429
3580
  cursor: grabbing;
3430
3581
  }
3431
3582
 
3583
+ .dark\:\!univer-border-gray-600:where(.univer-dark, .univer-dark *) {
3584
+ border-color: var(--univer-gray-600) !important;
3585
+ }
3586
+
3432
3587
  .dark\:\!univer-border-gray-700:where(.univer-dark, .univer-dark *) {
3433
3588
  border-color: var(--univer-gray-700) !important;
3434
3589
  }
@@ -3461,6 +3616,10 @@
3461
3616
  background-color: var(--univer-gray-700);
3462
3617
  }
3463
3618
 
3619
+ .dark\:\!univer-text-gray-0:where(.univer-dark, .univer-dark *) {
3620
+ color: var(--univer-gray-0) !important;
3621
+ }
3622
+
3464
3623
  .dark\:\!univer-text-gray-100:where(.univer-dark, .univer-dark *) {
3465
3624
  color: var(--univer-gray-100) !important;
3466
3625
  }
@@ -3477,10 +3636,6 @@
3477
3636
  color: var(--univer-gray-400) !important;
3478
3637
  }
3479
3638
 
3480
- .dark\:\!univer-text-white:where(.univer-dark, .univer-dark *) {
3481
- color: var(--univer-white) !important;
3482
- }
3483
-
3484
3639
  .univer-group:hover .dark\:group-hover\:\!univer-bg-gray-300:where(.univer-dark, .univer-dark *) {
3485
3640
  background-color: var(--univer-gray-300) !important;
3486
3641
  }
@@ -3508,6 +3663,10 @@
3508
3663
  position: fixed;
3509
3664
  }
3510
3665
 
3666
+ .\!univer-absolute {
3667
+ position: absolute !important;
3668
+ }
3669
+
3511
3670
  .univer-absolute {
3512
3671
  position: absolute;
3513
3672
  }
@@ -3520,11 +3679,20 @@
3520
3679
  position: sticky;
3521
3680
  }
3522
3681
 
3682
+ .-univer-inset-full {
3683
+ inset: -100%;
3684
+ }
3685
+
3523
3686
  .univer-inset-0 {
3524
- top: 0;
3525
- bottom: 0;
3526
- left: 0;
3527
- right: 0;
3687
+ inset: 0;
3688
+ }
3689
+
3690
+ .\!univer-bottom-0\.5 {
3691
+ bottom: .125rem !important;
3692
+ }
3693
+
3694
+ .\!univer-right-0\.5 {
3695
+ right: .125rem !important;
3528
3696
  }
3529
3697
 
3530
3698
  .\!univer-top-auto {
@@ -3684,6 +3852,11 @@
3684
3852
  display: none;
3685
3853
  }
3686
3854
 
3855
+ .\!univer-size-2\.5 {
3856
+ width: .625rem !important;
3857
+ height: .625rem !important;
3858
+ }
3859
+
3687
3860
  .\!univer-size-3\.5 {
3688
3861
  width: .875rem !important;
3689
3862
  height: .875rem !important;
@@ -4086,7 +4259,6 @@
4086
4259
  }
4087
4260
 
4088
4261
  .univer-appearance-none {
4089
- -webkit-appearance: none;
4090
4262
  appearance: none;
4091
4263
  }
4092
4264
 
@@ -4309,6 +4481,10 @@
4309
4481
  border-radius: 10px;
4310
4482
  }
4311
4483
 
4484
+ .univer-rounded-\[inherit\] {
4485
+ border-radius: inherit;
4486
+ }
4487
+
4312
4488
  .univer-rounded-full {
4313
4489
  border-radius: 9999px;
4314
4490
  }
@@ -4395,12 +4571,12 @@
4395
4571
  border-color: var(--univer-gray-300) !important;
4396
4572
  }
4397
4573
 
4398
- .univer-border-gray-200 {
4399
- border-color: var(--univer-gray-200);
4574
+ .univer-border-gray-0 {
4575
+ border-color: var(--univer-gray-0);
4400
4576
  }
4401
4577
 
4402
- .univer-border-gray-300 {
4403
- border-color: var(--univer-gray-300);
4578
+ .univer-border-gray-200 {
4579
+ border-color: var(--univer-gray-200);
4404
4580
  }
4405
4581
 
4406
4582
  .univer-border-primary-600 {
@@ -4411,22 +4587,30 @@
4411
4587
  border-color: #0000;
4412
4588
  }
4413
4589
 
4414
- .univer-border-white {
4415
- border-color: var(--univer-white);
4416
- }
4417
-
4418
4590
  .\!univer-bg-gray-200 {
4419
4591
  background-color: var(--univer-gray-200) !important;
4420
4592
  }
4421
4593
 
4594
+ .\!univer-bg-gray-700 {
4595
+ background-color: var(--univer-gray-700) !important;
4596
+ }
4597
+
4422
4598
  .\!univer-bg-gray-800 {
4423
4599
  background-color: var(--univer-gray-800) !important;
4424
4600
  }
4425
4601
 
4602
+ .\!univer-bg-transparent {
4603
+ background-color: #0000 !important;
4604
+ }
4605
+
4426
4606
  .univer-bg-\[rgba\(15\,23\,42\,0\.32\)\] {
4427
4607
  background-color: #0f172a52;
4428
4608
  }
4429
4609
 
4610
+ .univer-bg-gray-0 {
4611
+ background-color: var(--univer-gray-0);
4612
+ }
4613
+
4430
4614
  .univer-bg-gray-100 {
4431
4615
  background-color: var(--univer-gray-100);
4432
4616
  }
@@ -4463,8 +4647,8 @@
4463
4647
  background-color: #0000;
4464
4648
  }
4465
4649
 
4466
- .univer-bg-white {
4467
- background-color: var(--univer-white);
4650
+ .univer-bg-\[conic-gradient\(from_0deg\,transparent_0deg\,transparent_282deg\,var\(--univer-primary-700\)_318deg\,var\(--univer-primary-500\)_342deg\,transparent_360deg\)\] {
4651
+ background-image: conic-gradient(from 0deg,transparent 0deg,transparent 282deg,var(--univer-primary-700) 318deg,var(--univer-primary-500) 342deg,transparent 360deg);
4468
4652
  }
4469
4653
 
4470
4654
  .univer-bg-gradient-to-tr {
@@ -4518,6 +4702,10 @@
4518
4702
  padding: 2rem;
4519
4703
  }
4520
4704
 
4705
+ .univer-p-px {
4706
+ padding: 1px;
4707
+ }
4708
+
4521
4709
  .\!univer-px-0 {
4522
4710
  padding-left: 0 !important;
4523
4711
  padding-right: 0 !important;
@@ -4730,6 +4918,10 @@
4730
4918
  color: currentColor;
4731
4919
  }
4732
4920
 
4921
+ .univer-text-gray-0 {
4922
+ color: var(--univer-gray-0);
4923
+ }
4924
+
4733
4925
  .univer-text-gray-200 {
4734
4926
  color: var(--univer-gray-200);
4735
4927
  }
@@ -4779,10 +4971,6 @@
4779
4971
  color: rgba(226, 232, 240, var(--univer-tw-text-opacity, 1));
4780
4972
  }
4781
4973
 
4782
- .univer-text-white {
4783
- color: var(--univer-white);
4784
- }
4785
-
4786
4974
  .univer-underline {
4787
4975
  text-decoration-line: underline;
4788
4976
  }
@@ -4886,6 +5074,16 @@
4886
5074
  transition-timing-function: cubic-bezier(.4, 0, .2, 1);
4887
5075
  }
4888
5076
 
5077
+ .univer-transition-opacity {
5078
+ transition-property: opacity;
5079
+ transition-duration: .15s;
5080
+ transition-timing-function: cubic-bezier(.4, 0, .2, 1);
5081
+ }
5082
+
5083
+ .univer-duration-150 {
5084
+ transition-duration: .15s;
5085
+ }
5086
+
4889
5087
  @keyframes enter {
4890
5088
  from {
4891
5089
  opacity: 1;
@@ -4922,6 +5120,10 @@
4922
5120
  --univer-tw-enter-opacity: .7;
4923
5121
  }
4924
5122
 
5123
+ .univer-duration-150 {
5124
+ animation-duration: .15s;
5125
+ }
5126
+
4925
5127
  .univer-context-menu-hover-suppressed button:hover:not(:focus) {
4926
5128
  background-color: #0000 !important;
4927
5129
  }
@@ -4934,14 +5136,18 @@
4934
5136
  display: none;
4935
5137
  }
4936
5138
 
4937
- .hover\:univer-border-gray-400:hover {
4938
- border-color: var(--univer-gray-400);
5139
+ .univer-group\/hover-track:hover .group-hover\/hover-track\:univer-opacity-100 {
5140
+ opacity: 1;
4939
5141
  }
4940
5142
 
4941
5143
  .hover\:univer-border-primary-600:hover {
4942
5144
  border-color: var(--univer-primary-600);
4943
5145
  }
4944
5146
 
5147
+ .hover\:\!univer-bg-transparent:hover {
5148
+ background-color: #0000 !important;
5149
+ }
5150
+
4945
5151
  .hover\:univer-bg-gray-100:hover {
4946
5152
  background-color: var(--univer-gray-100);
4947
5153
  }
@@ -4977,12 +5183,12 @@
4977
5183
  box-shadow: var(--univer-tw-ring-offset-shadow, 0 0 #0000), var(--univer-tw-ring-shadow, 0 0 #0000), var(--univer-tw-shadow);
4978
5184
  }
4979
5185
 
4980
- .focus\:univer-bg-gray-50:focus {
4981
- background-color: var(--univer-gray-50);
5186
+ .focus\:univer-bg-gray-0:focus {
5187
+ background-color: var(--univer-gray-0);
4982
5188
  }
4983
5189
 
4984
- .focus\:univer-bg-white:focus {
4985
- background-color: var(--univer-white);
5190
+ .focus\:univer-bg-gray-50:focus {
5191
+ background-color: var(--univer-gray-50);
4986
5192
  }
4987
5193
 
4988
5194
  .focus\:univer-outline-none:focus {
@@ -5002,6 +5208,13 @@
5002
5208
  outline: 2px solid #0000;
5003
5209
  }
5004
5210
 
5211
+ .focus-visible\:univer-ring-1:focus-visible {
5212
+ --univer-tw-ring-offset-shadow: var(--univer-tw-ring-inset) 0 0 0 var(--univer-tw-ring-offset-width) var(--univer-tw-ring-offset-color);
5213
+ --univer-tw-ring-shadow: var(--univer-tw-ring-inset) 0 0 0 calc(1px + var(--univer-tw-ring-offset-width)) var(--univer-tw-ring-color);
5214
+ box-shadow: var(--univer-tw-ring-offset-shadow), var(--univer-tw-ring-shadow), 0 0 #0000;
5215
+ box-shadow: var(--univer-tw-ring-offset-shadow), var(--univer-tw-ring-shadow), var(--univer-tw-shadow, 0 0 #0000);
5216
+ }
5217
+
5005
5218
  .focus-visible\:univer-ring-2:focus-visible {
5006
5219
  --univer-tw-ring-offset-shadow: var(--univer-tw-ring-inset) 0 0 0 var(--univer-tw-ring-offset-width) var(--univer-tw-ring-offset-color);
5007
5220
  --univer-tw-ring-shadow: var(--univer-tw-ring-inset) 0 0 0 calc(2px + var(--univer-tw-ring-offset-width)) var(--univer-tw-ring-color);
@@ -5057,10 +5270,26 @@
5057
5270
  background-color: #0000;
5058
5271
  }
5059
5272
 
5273
+ @media (prefers-reduced-motion: no-preference) {
5274
+ @keyframes univer-spin {
5275
+ to {
5276
+ transform: rotate(360deg);
5277
+ }
5278
+ }
5279
+
5280
+ .univer-group\/hover-track:hover .motion-safe\:group-hover\/hover-track\:univer-animate-\[spin_5s_linear_infinite\] {
5281
+ animation: 5s linear infinite univer-spin;
5282
+ }
5283
+ }
5284
+
5060
5285
  @media (prefers-reduced-motion: reduce) {
5061
5286
  .motion-reduce\:univer-animate-none {
5062
5287
  animation: none;
5063
5288
  }
5289
+
5290
+ .motion-reduce\:univer-bg-primary-700 {
5291
+ background-color: var(--univer-primary-700);
5292
+ }
5064
5293
  }
5065
5294
 
5066
5295
  @media (min-width: 640px) {
@@ -5169,6 +5398,14 @@
5169
5398
  background-color: var(--univer-primary-900) !important;
5170
5399
  }
5171
5400
 
5401
+ .dark\:univer-bg-\[conic-gradient\(from_0deg\,transparent_0deg\,transparent_282deg\,var\(--univer-primary-300\)_318deg\,var\(--univer-primary-500\)_342deg\,transparent_360deg\)\]:where(.univer-dark, .univer-dark *) {
5402
+ background-image: conic-gradient(from 0deg,transparent 0deg,transparent 282deg,var(--univer-primary-300) 318deg,var(--univer-primary-500) 342deg,transparent 360deg);
5403
+ }
5404
+
5405
+ .dark\:\!univer-text-gray-0:where(.univer-dark, .univer-dark *) {
5406
+ color: var(--univer-gray-0) !important;
5407
+ }
5408
+
5172
5409
  .dark\:\!univer-text-gray-100:where(.univer-dark, .univer-dark *) {
5173
5410
  color: var(--univer-gray-100) !important;
5174
5411
  }
@@ -5209,10 +5446,6 @@
5209
5446
  color: var(--univer-primary-400) !important;
5210
5447
  }
5211
5448
 
5212
- .dark\:\!univer-text-white:where(.univer-dark, .univer-dark *) {
5213
- color: var(--univer-white) !important;
5214
- }
5215
-
5216
5449
  .dark\:\!univer-shadow-sm:where(.univer-dark, .univer-dark *) {
5217
5450
  --univer-tw-shadow: 0px 1px 2px 0px #1e284d14 !important;
5218
5451
  --univer-tw-shadow-colored: 0px 1px 2px 0px var(--univer-tw-shadow-color) !important;
@@ -5240,12 +5473,12 @@
5240
5473
  background-color: #0000 !important;
5241
5474
  }
5242
5475
 
5243
- .dark\:hover\:\!univer-text-gray-300:hover:where(.univer-dark, .univer-dark *) {
5244
- color: var(--univer-gray-300) !important;
5476
+ .dark\:hover\:\!univer-text-gray-0:hover:where(.univer-dark, .univer-dark *) {
5477
+ color: var(--univer-gray-0) !important;
5245
5478
  }
5246
5479
 
5247
- .dark\:hover\:\!univer-text-white:hover:where(.univer-dark, .univer-dark *) {
5248
- color: var(--univer-white) !important;
5480
+ .dark\:hover\:\!univer-text-gray-300:hover:where(.univer-dark, .univer-dark *) {
5481
+ color: var(--univer-gray-300) !important;
5249
5482
  }
5250
5483
 
5251
5484
  .dark\:focus\:\!univer-bg-gray-600:focus:where(.univer-dark, .univer-dark *) {
@@ -5264,6 +5497,12 @@
5264
5497
  color: var(--univer-gray-600) !important;
5265
5498
  }
5266
5499
 
5500
+ @media (prefers-reduced-motion: reduce) {
5501
+ .dark\:motion-reduce\:univer-bg-primary-300:where(.univer-dark, .univer-dark *) {
5502
+ background-color: var(--univer-primary-300);
5503
+ }
5504
+ }
5505
+
5267
5506
  .\[\&\:\:-webkit-scrollbar\]\:univer-hidden::-webkit-scrollbar {
5268
5507
  display: none;
5269
5508
  }
@@ -5289,7 +5528,6 @@
5289
5528
  }
5290
5529
 
5291
5530
  .\[\&\>\*\]\:univer-appearance-none > * {
5292
- -webkit-appearance: none;
5293
5531
  appearance: none;
5294
5532
  }
5295
5533
 
@@ -5531,7 +5769,6 @@
5531
5769
  }
5532
5770
 
5533
5771
  .\[\&_button\]\:\!univer-appearance-none button {
5534
- -webkit-appearance: none !important;
5535
5772
  appearance: none !important;
5536
5773
  }
5537
5774
 
@@ -5589,7 +5826,6 @@
5589
5826
  }
5590
5827
 
5591
5828
  .\[\&_input\]\:\!univer-appearance-none input {
5592
- -webkit-appearance: none !important;
5593
5829
  appearance: none !important;
5594
5830
  }
5595
5831
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@univerjs/preset-docs-core",
3
- "version": "1.0.0-alpha.8",
3
+ "version": "1.0.0-beta.1",
4
4
  "private": false,
5
5
  "description": "Preset for core Univer Docs editing and UI features.",
6
6
  "author": "DreamNum Co., Ltd. <developer@univer.ai>",
@@ -56,22 +56,22 @@
56
56
  "rxjs": ">=7.0.0"
57
57
  },
58
58
  "dependencies": {
59
- "@univerjs/design": "1.0.0-alpha.8",
60
- "@univerjs/docs": "1.0.0-alpha.8",
61
- "@univerjs/engine-formula": "1.0.0-alpha.8",
62
- "@univerjs/docs-ui": "1.0.0-alpha.8",
63
- "@univerjs/engine-render": "1.0.0-alpha.8",
64
- "@univerjs/network": "1.0.0-alpha.8",
65
- "@univerjs/ui": "1.0.0-alpha.8"
59
+ "@univerjs/design": "1.0.0-beta.1",
60
+ "@univerjs/docs": "1.0.0-beta.1",
61
+ "@univerjs/docs-ui": "1.0.0-beta.1",
62
+ "@univerjs/engine-formula": "1.0.0-beta.1",
63
+ "@univerjs/engine-render": "1.0.0-beta.1",
64
+ "@univerjs/network": "1.0.0-beta.1",
65
+ "@univerjs/ui": "1.0.0-beta.1"
66
66
  },
67
67
  "devDependencies": {
68
68
  "react": "18.3.1",
69
69
  "react-dom": "18.3.1",
70
70
  "rxjs": "^7.8.2",
71
71
  "typescript": "^6.0.3",
72
- "@univerjs/core": "1.0.0-alpha.8",
73
- "@univerjs-infra/shared": "1.0.0-alpha.8",
74
- "@univerjs/presets": "1.0.0-alpha.8"
72
+ "@univerjs-infra/shared": "1.0.0-beta.1",
73
+ "@univerjs/presets": "1.0.0-beta.1",
74
+ "@univerjs/core": "1.0.0-beta.1"
75
75
  },
76
76
  "scripts": {
77
77
  "build:bundle": "univer-cli preset build --cleanup",