wargerm 0.4.7 → 0.4.8

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 (6) hide show
  1. package/dist/components/Table/index.d.ts +1 -1
  2. package/dist/index.css +134 -18
  3. package/dist/index.esm.css +134 -18
  4. package/dist/index.esm.js +76 -29
  5. package/dist/index.js +76 -29
  6. package/package.json +2 -2
package/dist/components/Table/index.d.ts CHANGED
@@ -52,7 +52,7 @@ interface Iscroll {
52
52
  /**
53
53
  * 设置横向滚动，也可用于指定滚动区域的宽，可以设置为像素值，百分比，true 和 'max-content'
54
54
  */
55
- x?: string | number | true;
55
+ x?: string | number;
56
56
  /**
57
57
  * 设置纵向滚动，也可用于指定滚动区域的高，可以设置为像素值
58
58
  */
package/dist/index.css CHANGED
@@ -116,6 +116,14 @@
116
116
  }
117
117
  [data-prefers-color='dark'] .container {
118
118
  position: relative;
119
+ width: 100%;
120
+ overflow: auto;
121
+ }
122
+ [data-prefers-color='dark'] .container .theader {
123
+ position: -webkit-sticky;
124
+ position: sticky;
125
+ top: 0;
126
+ z-index: 4;
119
127
  }
120
128
  [data-prefers-color='dark'] .container .theader .th {
121
129
  padding-left: 4px;
@@ -151,12 +159,11 @@
151
159
  z-index: 2;
152
160
  min-height: 32px;
153
161
  }
154
- [data-prefers-color='dark'] .container .tbody {
155
- overflow: auto;
162
+ [data-prefers-color='dark'] .container .tbodyContainer .tbody {
156
163
  padding-top: 5px;
157
164
  margin-top: 19px;
158
165
  }
159
- [data-prefers-color='dark'] .container .tbody .tr {
166
+ [data-prefers-color='dark'] .container .tbodyContainer .tbody .tr {
160
167
  padding-left: 6px;
161
168
  width: 100%;
162
169
  min-height: 32px;
@@ -165,7 +172,7 @@
165
172
  position: relative;
166
173
  border-radius: 6px;
167
174
  }
168
- [data-prefers-color='dark'] .container .tbody .tr::before {
175
+ [data-prefers-color='dark'] .container .tbodyContainer .tbody .tr::before {
169
176
  background-color: rgba(25, 37, 71, 0.43);
170
177
  content: '';
171
178
  position: absolute;
@@ -182,7 +189,7 @@
182
189
  border-image-repeat: stretch stretch;
183
190
  border-radius: 6px;
184
191
  }
185
- [data-prefers-color='dark'] .container .tbody .tr.active::before {
192
+ [data-prefers-color='dark'] .container .tbodyContainer .tbody .tr.active::before {
186
193
  background-color: rgba(140, 75, 102, 0.43);
187
194
  border-width: 30px 20px 4px 4px;
188
195
  border-style: solid;
@@ -193,7 +200,7 @@
193
200
  border-image-repeat: stretch stretch;
194
201
  border-radius: 6px;
195
202
  }
196
- [data-prefers-color='dark'] .container .tbody .tr.active .td {
203
+ [data-prefers-color='dark'] .container .tbodyContainer .tbody .tr.active .td {
197
204
  flex: 1;
198
205
  display: flex;
199
206
  align-items: center;
@@ -202,7 +209,7 @@
202
209
  position: relative;
203
210
  z-index: 2;
204
211
  }
205
- [data-prefers-color='dark'] .container .tbody .tr .td {
212
+ [data-prefers-color='dark'] .container .tbodyContainer .tbody .tr .td {
206
213
  flex: 1;
207
214
  display: flex;
208
215
  align-items: center;
@@ -226,8 +233,7 @@
226
233
  background-color: transparent;
227
234
  }
228
235
  [data-prefers-color='dark'] .w-frame-box-table.container .theader .th {
229
- background-color: rgba(22, 93, 134, 0.49);
230
- background: rgba(22, 28, 38, 0.7);
236
+ background-color: #192335;
231
237
  border-top: 1px solid rgba(118, 214, 255, 0.4);
232
238
  border-bottom: 1px solid rgba(118, 214, 255, 0.4);
233
239
  border-radius: 0px;
@@ -252,6 +258,58 @@
252
258
  [data-prefers-color='dark'] .w-frame-box-table.container .tbody .frame .tr::before {
253
259
  content: none;
254
260
  }
261
+ [data-prefers-color='dark'] .th .fixedLeft,
262
+ [data-prefers-color='dark'] .th .fixedRight {
263
+ position: -webkit-sticky !important;
264
+ position: sticky !important;
265
+ z-index: 4 !important;
266
+ }
267
+ [data-prefers-color='dark'] .th .fixedLeft.td,
268
+ [data-prefers-color='dark'] .th .fixedRight.td {
269
+ background: #192235;
270
+ transition: all 0.3s;
271
+ }
272
+ [data-prefers-color='dark'] .tr .fixedLeft,
273
+ [data-prefers-color='dark'] .tr .fixedRight {
274
+ position: -webkit-sticky !important;
275
+ position: sticky !important;
276
+ z-index: 3 !important;
277
+ }
278
+ [data-prefers-color='dark'] .tr .fixedLeft.td,
279
+ [data-prefers-color='dark'] .tr .fixedRight.td {
280
+ background: #233b62;
281
+ transition: all 0.3s;
282
+ }
283
+ [data-prefers-color='dark'] .fixedRight {
284
+ position: -webkit-sticky !important;
285
+ position: sticky !important;
286
+ z-index: 3 !important;
287
+ }
288
+ [data-prefers-color='dark'] .fixedRight.td:after {
289
+ box-shadow: inset -10px 0 8px -8px #00000026;
290
+ position: absolute;
291
+ top: 0;
292
+ bottom: -1px;
293
+ left: 0;
294
+ width: 30px;
295
+ transform: translate(-100%);
296
+ transition: box-shadow 0.3s;
297
+ content: '';
298
+ pointer-events: none;
299
+ }
300
+ [data-prefers-color='dark'] .fixedLeft .th.td:after,
301
+ [data-prefers-color='dark'] .fixedLeft .tr.td:after {
302
+ box-shadow: inset -10px 0 8px -8px #00000026;
303
+ position: absolute;
304
+ top: 0;
305
+ right: 0;
306
+ bottom: -1px;
307
+ width: 30px;
308
+ transform: translate(100%);
309
+ transition: box-shadow 0.3s;
310
+ content: '';
311
+ pointer-events: none;
312
+ }
255
313
  [data-prefers-color='dark'] .ant-select:not(.ant-select-customize-input) .ant-select-selector {
256
314
  background-color: transparent;
257
315
  color: #4383a4;
@@ -1322,6 +1380,14 @@ button[data-prefers-color='dark'] .swiper-pagination-bullet {
1322
1380
  }
1323
1381
  [data-prefers-color='light'] .container {
1324
1382
  position: relative;
1383
+ width: 100%;
1384
+ overflow: auto;
1385
+ }
1386
+ [data-prefers-color='light'] .container .theader {
1387
+ position: -webkit-sticky;
1388
+ position: sticky;
1389
+ top: 0;
1390
+ z-index: 4;
1325
1391
  }
1326
1392
  [data-prefers-color='light'] .container .theader .th {
1327
1393
  padding-left: 4px;
@@ -1357,12 +1423,11 @@ button[data-prefers-color='dark'] .swiper-pagination-bullet {
1357
1423
  z-index: 2;
1358
1424
  min-height: 32px;
1359
1425
  }
1360
- [data-prefers-color='light'] .container .tbody {
1361
- overflow: auto;
1426
+ [data-prefers-color='light'] .container .tbodyContainer .tbody {
1362
1427
  padding-top: 5px;
1363
1428
  margin-top: 19px;
1364
1429
  }
1365
- [data-prefers-color='light'] .container .tbody .tr {
1430
+ [data-prefers-color='light'] .container .tbodyContainer .tbody .tr {
1366
1431
  padding-left: 6px;
1367
1432
  width: 100%;
1368
1433
  min-height: 32px;
@@ -1371,7 +1436,7 @@ button[data-prefers-color='dark'] .swiper-pagination-bullet {
1371
1436
  position: relative;
1372
1437
  border-radius: 6px;
1373
1438
  }
1374
- [data-prefers-color='light'] .container .tbody .tr::before {
1439
+ [data-prefers-color='light'] .container .tbodyContainer .tbody .tr::before {
1375
1440
  background-color: rgba(25, 37, 71, 0.43);
1376
1441
  content: '';
1377
1442
  position: absolute;
@@ -1388,7 +1453,7 @@ button[data-prefers-color='dark'] .swiper-pagination-bullet {
1388
1453
  border-image-repeat: stretch stretch;
1389
1454
  border-radius: 6px;
1390
1455
  }
1391
- [data-prefers-color='light'] .container .tbody .tr.active::before {
1456
+ [data-prefers-color='light'] .container .tbodyContainer .tbody .tr.active::before {
1392
1457
  background-color: rgba(140, 75, 102, 0.43);
1393
1458
  border-width: 30px 20px 4px 4px;
1394
1459
  border-style: solid;
@@ -1399,7 +1464,7 @@ button[data-prefers-color='dark'] .swiper-pagination-bullet {
1399
1464
  border-image-repeat: stretch stretch;
1400
1465
  border-radius: 6px;
1401
1466
  }
1402
- [data-prefers-color='light'] .container .tbody .tr.active .td {
1467
+ [data-prefers-color='light'] .container .tbodyContainer .tbody .tr.active .td {
1403
1468
  flex: 1;
1404
1469
  display: flex;
1405
1470
  align-items: center;
@@ -1408,7 +1473,7 @@ button[data-prefers-color='dark'] .swiper-pagination-bullet {
1408
1473
  position: relative;
1409
1474
  z-index: 2;
1410
1475
  }
1411
- [data-prefers-color='light'] .container .tbody .tr .td {
1476
+ [data-prefers-color='light'] .container .tbodyContainer .tbody .tr .td {
1412
1477
  flex: 1;
1413
1478
  display: flex;
1414
1479
  align-items: center;
@@ -1432,8 +1497,7 @@ button[data-prefers-color='dark'] .swiper-pagination-bullet {
1432
1497
  background-color: transparent;
1433
1498
  }
1434
1499
  [data-prefers-color='light'] .w-frame-box-table.container .theader .th {
1435
- background-color: rgba(22, 93, 134, 0.49);
1436
- background: rgba(22, 28, 38, 0.7);
1500
+ background-color: #192335;
1437
1501
  border-top: 1px solid rgba(118, 214, 255, 0.4);
1438
1502
  border-bottom: 1px solid rgba(118, 214, 255, 0.4);
1439
1503
  border-radius: 0px;
@@ -1458,6 +1522,58 @@ button[data-prefers-color='dark'] .swiper-pagination-bullet {
1458
1522
  [data-prefers-color='light'] .w-frame-box-table.container .tbody .frame .tr::before {
1459
1523
  content: none;
1460
1524
  }
1525
+ [data-prefers-color='light'] .th .fixedLeft,
1526
+ [data-prefers-color='light'] .th .fixedRight {
1527
+ position: -webkit-sticky !important;
1528
+ position: sticky !important;
1529
+ z-index: 4 !important;
1530
+ }
1531
+ [data-prefers-color='light'] .th .fixedLeft.td,
1532
+ [data-prefers-color='light'] .th .fixedRight.td {
1533
+ background: #192235;
1534
+ transition: all 0.3s;
1535
+ }
1536
+ [data-prefers-color='light'] .tr .fixedLeft,
1537
+ [data-prefers-color='light'] .tr .fixedRight {
1538
+ position: -webkit-sticky !important;
1539
+ position: sticky !important;
1540
+ z-index: 3 !important;
1541
+ }
1542
+ [data-prefers-color='light'] .tr .fixedLeft.td,
1543
+ [data-prefers-color='light'] .tr .fixedRight.td {
1544
+ background: #233b62;
1545
+ transition: all 0.3s;
1546
+ }
1547
+ [data-prefers-color='light'] .fixedRight {
1548
+ position: -webkit-sticky !important;
1549
+ position: sticky !important;
1550
+ z-index: 3 !important;
1551
+ }
1552
+ [data-prefers-color='light'] .fixedRight.td:after {
1553
+ box-shadow: inset -10px 0 8px -8px #00000026;
1554
+ position: absolute;
1555
+ top: 0;
1556
+ bottom: -1px;
1557
+ left: 0;
1558
+ width: 30px;
1559
+ transform: translate(-100%);
1560
+ transition: box-shadow 0.3s;
1561
+ content: '';
1562
+ pointer-events: none;
1563
+ }
1564
+ [data-prefers-color='light'] .fixedLeft .th.td:after,
1565
+ [data-prefers-color='light'] .fixedLeft .tr.td:after {
1566
+ box-shadow: inset -10px 0 8px -8px #00000026;
1567
+ position: absolute;
1568
+ top: 0;
1569
+ right: 0;
1570
+ bottom: -1px;
1571
+ width: 30px;
1572
+ transform: translate(100%);
1573
+ transition: box-shadow 0.3s;
1574
+ content: '';
1575
+ pointer-events: none;
1576
+ }
1461
1577
  [data-prefers-color='light'] .ant-select:not(.ant-select-customize-input) .ant-select-selector {
1462
1578
  position: relative;
1463
1579
  background-color: #f4f4f4;
package/dist/index.esm.css CHANGED
@@ -116,6 +116,14 @@
116
116
  }
117
117
  [data-prefers-color='dark'] .container {
118
118
  position: relative;
119
+ width: 100%;
120
+ overflow: auto;
121
+ }
122
+ [data-prefers-color='dark'] .container .theader {
123
+ position: -webkit-sticky;
124
+ position: sticky;
125
+ top: 0;
126
+ z-index: 4;
119
127
  }
120
128
  [data-prefers-color='dark'] .container .theader .th {
121
129
  padding-left: 4px;
@@ -151,12 +159,11 @@
151
159
  z-index: 2;
152
160
  min-height: 32px;
153
161
  }
154
- [data-prefers-color='dark'] .container .tbody {
155
- overflow: auto;
162
+ [data-prefers-color='dark'] .container .tbodyContainer .tbody {
156
163
  padding-top: 5px;
157
164
  margin-top: 19px;
158
165
  }
159
- [data-prefers-color='dark'] .container .tbody .tr {
166
+ [data-prefers-color='dark'] .container .tbodyContainer .tbody .tr {
160
167
  padding-left: 6px;
161
168
  width: 100%;
162
169
  min-height: 32px;
@@ -165,7 +172,7 @@
165
172
  position: relative;
166
173
  border-radius: 6px;
167
174
  }
168
- [data-prefers-color='dark'] .container .tbody .tr::before {
175
+ [data-prefers-color='dark'] .container .tbodyContainer .tbody .tr::before {
169
176
  background-color: rgba(25, 37, 71, 0.43);
170
177
  content: '';
171
178
  position: absolute;
@@ -182,7 +189,7 @@
182
189
  border-image-repeat: stretch stretch;
183
190
  border-radius: 6px;
184
191
  }
185
- [data-prefers-color='dark'] .container .tbody .tr.active::before {
192
+ [data-prefers-color='dark'] .container .tbodyContainer .tbody .tr.active::before {
186
193
  background-color: rgba(140, 75, 102, 0.43);
187
194
  border-width: 30px 20px 4px 4px;
188
195
  border-style: solid;
@@ -193,7 +200,7 @@
193
200
  border-image-repeat: stretch stretch;
194
201
  border-radius: 6px;
195
202
  }
196
- [data-prefers-color='dark'] .container .tbody .tr.active .td {
203
+ [data-prefers-color='dark'] .container .tbodyContainer .tbody .tr.active .td {
197
204
  flex: 1;
198
205
  display: flex;
199
206
  align-items: center;
@@ -202,7 +209,7 @@
202
209
  position: relative;
203
210
  z-index: 2;
204
211
  }
205
- [data-prefers-color='dark'] .container .tbody .tr .td {
212
+ [data-prefers-color='dark'] .container .tbodyContainer .tbody .tr .td {
206
213
  flex: 1;
207
214
  display: flex;
208
215
  align-items: center;
@@ -226,8 +233,7 @@
226
233
  background-color: transparent;
227
234
  }
228
235
  [data-prefers-color='dark'] .w-frame-box-table.container .theader .th {
229
- background-color: rgba(22, 93, 134, 0.49);
230
- background: rgba(22, 28, 38, 0.7);
236
+ background-color: #192335;
231
237
  border-top: 1px solid rgba(118, 214, 255, 0.4);
232
238
  border-bottom: 1px solid rgba(118, 214, 255, 0.4);
233
239
  border-radius: 0px;
@@ -252,6 +258,58 @@
252
258
  [data-prefers-color='dark'] .w-frame-box-table.container .tbody .frame .tr::before {
253
259
  content: none;
254
260
  }
261
+ [data-prefers-color='dark'] .th .fixedLeft,
262
+ [data-prefers-color='dark'] .th .fixedRight {
263
+ position: -webkit-sticky !important;
264
+ position: sticky !important;
265
+ z-index: 4 !important;
266
+ }
267
+ [data-prefers-color='dark'] .th .fixedLeft.td,
268
+ [data-prefers-color='dark'] .th .fixedRight.td {
269
+ background: #192235;
270
+ transition: all 0.3s;
271
+ }
272
+ [data-prefers-color='dark'] .tr .fixedLeft,
273
+ [data-prefers-color='dark'] .tr .fixedRight {
274
+ position: -webkit-sticky !important;
275
+ position: sticky !important;
276
+ z-index: 3 !important;
277
+ }
278
+ [data-prefers-color='dark'] .tr .fixedLeft.td,
279
+ [data-prefers-color='dark'] .tr .fixedRight.td {
280
+ background: #233b62;
281
+ transition: all 0.3s;
282
+ }
283
+ [data-prefers-color='dark'] .fixedRight {
284
+ position: -webkit-sticky !important;
285
+ position: sticky !important;
286
+ z-index: 3 !important;
287
+ }
288
+ [data-prefers-color='dark'] .fixedRight.td:after {
289
+ box-shadow: inset -10px 0 8px -8px #00000026;
290
+ position: absolute;
291
+ top: 0;
292
+ bottom: -1px;
293
+ left: 0;
294
+ width: 30px;
295
+ transform: translate(-100%);
296
+ transition: box-shadow 0.3s;
297
+ content: '';
298
+ pointer-events: none;
299
+ }
300
+ [data-prefers-color='dark'] .fixedLeft .th.td:after,
301
+ [data-prefers-color='dark'] .fixedLeft .tr.td:after {
302
+ box-shadow: inset -10px 0 8px -8px #00000026;
303
+ position: absolute;
304
+ top: 0;
305
+ right: 0;
306
+ bottom: -1px;
307
+ width: 30px;
308
+ transform: translate(100%);
309
+ transition: box-shadow 0.3s;
310
+ content: '';
311
+ pointer-events: none;
312
+ }
255
313
  [data-prefers-color='dark'] .ant-select:not(.ant-select-customize-input) .ant-select-selector {
256
314
  background-color: transparent;
257
315
  color: #4383a4;
@@ -1322,6 +1380,14 @@ button[data-prefers-color='dark'] .swiper-pagination-bullet {
1322
1380
  }
1323
1381
  [data-prefers-color='light'] .container {
1324
1382
  position: relative;
1383
+ width: 100%;
1384
+ overflow: auto;
1385
+ }
1386
+ [data-prefers-color='light'] .container .theader {
1387
+ position: -webkit-sticky;
1388
+ position: sticky;
1389
+ top: 0;
1390
+ z-index: 4;
1325
1391
  }
1326
1392
  [data-prefers-color='light'] .container .theader .th {
1327
1393
  padding-left: 4px;
@@ -1357,12 +1423,11 @@ button[data-prefers-color='dark'] .swiper-pagination-bullet {
1357
1423
  z-index: 2;
1358
1424
  min-height: 32px;
1359
1425
  }
1360
- [data-prefers-color='light'] .container .tbody {
1361
- overflow: auto;
1426
+ [data-prefers-color='light'] .container .tbodyContainer .tbody {
1362
1427
  padding-top: 5px;
1363
1428
  margin-top: 19px;
1364
1429
  }
1365
- [data-prefers-color='light'] .container .tbody .tr {
1430
+ [data-prefers-color='light'] .container .tbodyContainer .tbody .tr {
1366
1431
  padding-left: 6px;
1367
1432
  width: 100%;
1368
1433
  min-height: 32px;
@@ -1371,7 +1436,7 @@ button[data-prefers-color='dark'] .swiper-pagination-bullet {
1371
1436
  position: relative;
1372
1437
  border-radius: 6px;
1373
1438
  }
1374
- [data-prefers-color='light'] .container .tbody .tr::before {
1439
+ [data-prefers-color='light'] .container .tbodyContainer .tbody .tr::before {
1375
1440
  background-color: rgba(25, 37, 71, 0.43);
1376
1441
  content: '';
1377
1442
  position: absolute;
@@ -1388,7 +1453,7 @@ button[data-prefers-color='dark'] .swiper-pagination-bullet {
1388
1453
  border-image-repeat: stretch stretch;
1389
1454
  border-radius: 6px;
1390
1455
  }
1391
- [data-prefers-color='light'] .container .tbody .tr.active::before {
1456
+ [data-prefers-color='light'] .container .tbodyContainer .tbody .tr.active::before {
1392
1457
  background-color: rgba(140, 75, 102, 0.43);
1393
1458
  border-width: 30px 20px 4px 4px;
1394
1459
  border-style: solid;
@@ -1399,7 +1464,7 @@ button[data-prefers-color='dark'] .swiper-pagination-bullet {
1399
1464
  border-image-repeat: stretch stretch;
1400
1465
  border-radius: 6px;
1401
1466
  }
1402
- [data-prefers-color='light'] .container .tbody .tr.active .td {
1467
+ [data-prefers-color='light'] .container .tbodyContainer .tbody .tr.active .td {
1403
1468
  flex: 1;
1404
1469
  display: flex;
1405
1470
  align-items: center;
@@ -1408,7 +1473,7 @@ button[data-prefers-color='dark'] .swiper-pagination-bullet {
1408
1473
  position: relative;
1409
1474
  z-index: 2;
1410
1475
  }
1411
- [data-prefers-color='light'] .container .tbody .tr .td {
1476
+ [data-prefers-color='light'] .container .tbodyContainer .tbody .tr .td {
1412
1477
  flex: 1;
1413
1478
  display: flex;
1414
1479
  align-items: center;
@@ -1432,8 +1497,7 @@ button[data-prefers-color='dark'] .swiper-pagination-bullet {
1432
1497
  background-color: transparent;
1433
1498
  }
1434
1499
  [data-prefers-color='light'] .w-frame-box-table.container .theader .th {
1435
- background-color: rgba(22, 93, 134, 0.49);
1436
- background: rgba(22, 28, 38, 0.7);
1500
+ background-color: #192335;
1437
1501
  border-top: 1px solid rgba(118, 214, 255, 0.4);
1438
1502
  border-bottom: 1px solid rgba(118, 214, 255, 0.4);
1439
1503
  border-radius: 0px;
@@ -1458,6 +1522,58 @@ button[data-prefers-color='dark'] .swiper-pagination-bullet {
1458
1522
  [data-prefers-color='light'] .w-frame-box-table.container .tbody .frame .tr::before {
1459
1523
  content: none;
1460
1524
  }
1525
+ [data-prefers-color='light'] .th .fixedLeft,
1526
+ [data-prefers-color='light'] .th .fixedRight {
1527
+ position: -webkit-sticky !important;
1528
+ position: sticky !important;
1529
+ z-index: 4 !important;
1530
+ }
1531
+ [data-prefers-color='light'] .th .fixedLeft.td,
1532
+ [data-prefers-color='light'] .th .fixedRight.td {
1533
+ background: #192235;
1534
+ transition: all 0.3s;
1535
+ }
1536
+ [data-prefers-color='light'] .tr .fixedLeft,
1537
+ [data-prefers-color='light'] .tr .fixedRight {
1538
+ position: -webkit-sticky !important;
1539
+ position: sticky !important;
1540
+ z-index: 3 !important;
1541
+ }
1542
+ [data-prefers-color='light'] .tr .fixedLeft.td,
1543
+ [data-prefers-color='light'] .tr .fixedRight.td {
1544
+ background: #233b62;
1545
+ transition: all 0.3s;
1546
+ }
1547
+ [data-prefers-color='light'] .fixedRight {
1548
+ position: -webkit-sticky !important;
1549
+ position: sticky !important;
1550
+ z-index: 3 !important;
1551
+ }
1552
+ [data-prefers-color='light'] .fixedRight.td:after {
1553
+ box-shadow: inset -10px 0 8px -8px #00000026;
1554
+ position: absolute;
1555
+ top: 0;
1556
+ bottom: -1px;
1557
+ left: 0;
1558
+ width: 30px;
1559
+ transform: translate(-100%);
1560
+ transition: box-shadow 0.3s;
1561
+ content: '';
1562
+ pointer-events: none;
1563
+ }
1564
+ [data-prefers-color='light'] .fixedLeft .th.td:after,
1565
+ [data-prefers-color='light'] .fixedLeft .tr.td:after {
1566
+ box-shadow: inset -10px 0 8px -8px #00000026;
1567
+ position: absolute;
1568
+ top: 0;
1569
+ right: 0;
1570
+ bottom: -1px;
1571
+ width: 30px;
1572
+ transform: translate(100%);
1573
+ transition: box-shadow 0.3s;
1574
+ content: '';
1575
+ pointer-events: none;
1576
+ }
1461
1577
  [data-prefers-color='light'] .ant-select:not(.ant-select-customize-input) .ant-select-selector {
1462
1578
  position: relative;
1463
1579
  background-color: #f4f4f4;
package/dist/index.esm.js CHANGED
@@ -7966,7 +7966,7 @@ var WForm$1 = /*#__PURE__*/React.forwardRef(WForm);
7966
7966
 
7967
7967
  var _excluded$7 = ["columns", "dataSource", "request", "onLoad", "params", "onSubmit", "rowKey", "onRow", "className", "rowClassName", "rowSelection", "style", "tbodyStyle", "thStyle", "border", "scroll", "pagination", "search", "frameBoxTable", "frameBoxDirection", "formRef", "none"];
7968
7968
  function Table(_ref) {
7969
- var _formSearchRef$curren4, _classnames2;
7969
+ var _formSearchRef$curren4, _classnames2, _columns$, _columns$2;
7970
7970
 
7971
7971
  var columns = _ref.columns,
7972
7972
  tableList = _ref.dataSource,
@@ -8079,6 +8079,22 @@ function Table(_ref) {
8079
8079
  return !c.hideInTable;
8080
8080
  });
8081
8081
  }, [columns]);
8082
+
8083
+ var calcWidth = function calcWidth(columns) {
8084
+ return columns.reduce(function (pre, cur) {
8085
+ var width = cur.width;
8086
+
8087
+ if (width) {
8088
+ return pre + width;
8089
+ }
8090
+
8091
+ return pre;
8092
+ }, 0);
8093
+ };
8094
+
8095
+ var showColumns = columns.filter(function (c) {
8096
+ return !c.hideInTable;
8097
+ });
8082
8098
  var renderTh = useMemo(function () {
8083
8099
  var renderThFc = function renderThFc(columns, parentHeight, isChild) {
8084
8100
  var showColumns = columns.filter(function (c) {
@@ -8116,13 +8132,17 @@ function Table(_ref) {
8116
8132
  } else {
8117
8133
  return /*#__PURE__*/React.createElement("div", {
8118
8134
  key: c.dataIndex,
8119
- style: {
8135
+ style: _objectSpread2({
8120
8136
  width: c.width + 'px',
8121
8137
  flex: c.width ? '0 1 auto' : '1',
8122
8138
  height: !c.children ? '100%' : '32px',
8123
8139
  borderRight: index != showColumns.length - 1 && filterColumns.length !== showColumns.length ? '1px solid #3b5173' : 'none'
8124
- },
8125
- className: "td"
8140
+ }, c.fixed == 'left' ? {
8141
+ left: ((rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.type) ? 56 : 6) + calcWidth(showColumns.slice(0, index - 2 > 0 ? index - 1 : 0))
8142
+ } : c.fixed == 'right' ? {
8143
+ right: calcWidth(showColumns.slice(index + 1))
8144
+ } : {}),
8145
+ className: "td ".concat(c.fixed == 'left' ? 'fixedLeft' : c.fixed == 'right' ? 'fixedRight' : '')
8126
8146
  }, c.title);
8127
8147
  }
8128
8148
  });
@@ -8164,12 +8184,16 @@ function Table(_ref) {
8164
8184
  placement: "top",
8165
8185
  title: record[c.dataIndex]
8166
8186
  }, /*#__PURE__*/React.createElement("div", {
8167
- className: 'td' + (c.ellipsis ? ' ellipsis' : ''),
8168
- style: {
8187
+ className: "td ".concat(c.fixed == 'left' ? 'fixedLeft' : c.fixed == 'right' ? 'fixedRight' : '', " ").concat(c.ellipsis ? ' ellipsis' : ''),
8188
+ style: _objectSpread2({
8169
8189
  width: c.width + 'px',
8170
8190
  flex: c.width ? '0 1 auto' : '1',
8171
8191
  overflow: 'hidden'
8172
- }
8192
+ }, c.fixed == 'left' ? {
8193
+ left: ((rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.type) ? 56 : 6) + calcWidth(showColumns.slice(0, index - 2 > 0 ? index - 1 : 0))
8194
+ } : c.fixed == 'right' ? {
8195
+ right: calcWidth(showColumns.slice(index + 1))
8196
+ } : {})
8173
8197
  }, /*#__PURE__*/React.createElement("div", {
8174
8198
  style: {
8175
8199
  width: '100%',
@@ -8185,12 +8209,16 @@ function Table(_ref) {
8185
8209
 
8186
8210
  return /*#__PURE__*/React.createElement("div", {
8187
8211
  key: c.dataIndex,
8188
- className: 'td' + (c.ellipsis ? ' ellipsis' : ''),
8189
- style: {
8212
+ className: "td ".concat(c.fixed == 'left' ? 'fixedLeft' : c.fixed == 'right' ? 'fixedRight' : '', " ").concat(c.ellipsis ? ' ellipsis' : ''),
8213
+ style: _objectSpread2({
8190
8214
  width: c.width + 'px',
8191
8215
  flex: c.width ? '0 1 auto' : '1',
8192
8216
  overflow: 'hidden'
8193
- },
8217
+ }, c.fixed == 'left' ? {
8218
+ left: ((rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.type) ? 56 : 6) + calcWidth(showColumns.slice(0, index - 2 > 0 ? index - 1 : 0))
8219
+ } : c.fixed == 'right' ? {
8220
+ right: calcWidth(showColumns.slice(index + 1))
8221
+ } : {}),
8194
8222
  title: record[c.dataIndex]
8195
8223
  }, c.ellipsis ? /*#__PURE__*/React.createElement("div", {
8196
8224
  style: {
@@ -8221,11 +8249,13 @@ function Table(_ref) {
8221
8249
  tr: true
8222
8250
  }, typeof rowClassName === 'function' ? rowClassName(record, index) : '', true))
8223
8251
  }, typeof onRow === 'function' ? onRow(record, index) : {}), (rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.type) === 'checkbox' && /*#__PURE__*/React.createElement("div", {
8224
- style: {
8252
+ style: _objectSpread2({
8225
8253
  width: '50px',
8226
8254
  flex: '0 1 auto'
8227
- },
8228
- className: "td"
8255
+ }, showColumns[0].fixed == 'left' ? {
8256
+ left: 6
8257
+ } : {}),
8258
+ className: "td ".concat(showColumns[0].fixed == 'left' ? 'fixedLeft' : '')
8229
8259
  }, /*#__PURE__*/React.createElement(Index$3, {
8230
8260
  checked: (_ref2 = [].concat(_toConsumableArray((rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.selectedRowKeys) || []), _toConsumableArray(selectedRowKeys))) === null || _ref2 === void 0 ? void 0 : _ref2.includes(key),
8231
8261
  onClick: function onClick(e) {
@@ -8259,11 +8289,13 @@ function Table(_ref) {
8259
8289
  });
8260
8290
  }
8261
8291
  })), (rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.type) === 'radio' && /*#__PURE__*/React.createElement("div", {
8262
- style: {
8292
+ style: _objectSpread2({
8263
8293
  width: '50px',
8264
8294
  flex: '0 1 auto'
8265
- },
8266
- className: "td"
8295
+ }, showColumns[0].fixed == 'left' ? {
8296
+ left: 6
8297
+ } : {}),
8298
+ className: "td ".concat(showColumns[0].fixed == 'left' ? 'fixedLeft' : '')
8267
8299
  }, /*#__PURE__*/React.createElement(Index$2, {
8268
8300
  checked: (_ref3 = [].concat(_toConsumableArray((rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.selectedRowKeys) || []), _toConsumableArray(selectedRowKeys))) === null || _ref3 === void 0 ? void 0 : _ref3.includes(key),
8269
8301
  onClick: function onClick(e) {
@@ -8419,20 +8451,27 @@ function Table(_ref) {
8419
8451
  className: classnames((_classnames2 = {
8420
8452
  container: true
8421
8453
  }, _defineProperty(_classnames2, 'w-table', true), _defineProperty(_classnames2, 'w-frame-box-table', frameBoxTable), _defineProperty(_classnames2, className || 'defalut-table', true), _classnames2)),
8422
- style: style
8454
+ style: _objectSpread2(_objectSpread2({}, (scroll === null || scroll === void 0 ? void 0 : scroll.y) ? {
8455
+ height: scroll.y
8456
+ } : {}), style)
8423
8457
  }, /*#__PURE__*/React.createElement("div", {
8424
8458
  className: "theader"
8425
8459
  }, /*#__PURE__*/React.createElement("div", {
8426
8460
  className: "th",
8427
8461
  style: _objectSpread2(_objectSpread2({}, thStyle), {}, {
8428
8462
  height: layerIndex * 32 + 'px'
8429
- })
8463
+ }, (scroll === null || scroll === void 0 ? void 0 : scroll.x) ? {
8464
+ width: scroll.x
8465
+ } : {})
8430
8466
  }, (rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.type) === 'checkbox' && /*#__PURE__*/React.createElement("div", {
8431
- style: {
8467
+ style: _objectSpread2({
8432
8468
  width: '50px',
8433
- flex: '0 1 auto'
8434
- },
8435
- className: "td"
8469
+ flex: '0 1 auto',
8470
+ height: '100%'
8471
+ }, showColumns[0].fixed == 'left' ? {
8472
+ left: 6
8473
+ } : {}),
8474
+ className: "td ".concat(((_columns$ = columns[0]) === null || _columns$ === void 0 ? void 0 : _columns$.fixed) == 'left' ? 'fixedLeft' : '')
8436
8475
  }, /*#__PURE__*/React.createElement(Index$3, {
8437
8476
  checked: dataSource.every(function (record) {
8438
8477
  return selectedRowKeys.includes(typeof rowKey === 'function' ? record[rowKey(record)] : record[rowKey]);
@@ -8444,15 +8483,23 @@ function Table(_ref) {
8444
8483
  }),
8445
8484
  onChange: onSelectAllChange
8446
8485
  })), (rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.type) === 'radio' && /*#__PURE__*/React.createElement("div", {
8447
- style: {
8486
+ style: _objectSpread2({
8448
8487
  width: '50px',
8449
- flex: '0 1 auto'
8450
- },
8451
- className: "td"
8488
+ flex: '0 1 auto',
8489
+ height: '100%'
8490
+ }, showColumns[0].fixed == 'left' ? {
8491
+ left: 6
8492
+ } : {}),
8493
+ className: "td ".concat(((_columns$2 = columns[0]) === null || _columns$2 === void 0 ? void 0 : _columns$2.fixed) == 'left' ? 'fixedLeft' : '')
8452
8494
  }), renderTh)), /*#__PURE__*/React.createElement("div", {
8495
+ className: "tbodyContainer",
8496
+ style: _objectSpread2({}, (scroll === null || scroll === void 0 ? void 0 : scroll.x) ? {
8497
+ width: scroll.x
8498
+ } : {})
8499
+ }, /*#__PURE__*/React.createElement("div", {
8453
8500
  className: "tbody",
8454
8501
  style: _objectSpread2({
8455
- height: (style === null || style === void 0 ? void 0 : style.height) ? "calc(".concat(style.height, " - ").concat(52 + (pagination === false ? 0 : 42), "px)") : '200px'
8502
+ height: (style === null || style === void 0 ? void 0 : style.height) || (scroll === null || scroll === void 0 ? void 0 : scroll.y) ? "calc(".concat(style === null || style === void 0 ? void 0 : style.height, " - ").concat(52 + (pagination === false ? 0 : 42), "px)") : '200px'
8456
8503
  }, tbodyStyle)
8457
8504
  }, dataSource.length > 0 ? dataSource.map(function (record, index) {
8458
8505
  var key = typeof rowKey === 'function' ? record[rowKey(record)] : record[rowKey];
@@ -8471,12 +8518,12 @@ function Table(_ref) {
8471
8518
  justifyContent: 'center',
8472
8519
  alignItems: 'center'
8473
8520
  }
8474
- }, none || '暂无数据')), _typeof(pagination) === 'object' && /*#__PURE__*/React.createElement(_Pagination, _objectSpread2({
8521
+ }, none || '暂无数据')))), _typeof(pagination) === 'object' && /*#__PURE__*/React.createElement(_Pagination, _objectSpread2({
8475
8522
  style: {
8476
8523
  textAlign: 'right',
8477
8524
  marginTop: '10px'
8478
8525
  }
8479
- }, paginationParams))));
8526
+ }, paginationParams)));
8480
8527
  }
8481
8528
  Table.defaultProps = {
8482
8529
  rowKey: 'key'
package/dist/index.js CHANGED
@@ -8001,7 +8001,7 @@ var WForm$1 = /*#__PURE__*/React__default['default'].forwardRef(WForm);
8001
8001
 
8002
8002
  var _excluded$7 = ["columns", "dataSource", "request", "onLoad", "params", "onSubmit", "rowKey", "onRow", "className", "rowClassName", "rowSelection", "style", "tbodyStyle", "thStyle", "border", "scroll", "pagination", "search", "frameBoxTable", "frameBoxDirection", "formRef", "none"];
8003
8003
  function Table(_ref) {
8004
- var _formSearchRef$curren4, _classnames2;
8004
+ var _formSearchRef$curren4, _classnames2, _columns$, _columns$2;
8005
8005
 
8006
8006
  var columns = _ref.columns,
8007
8007
  tableList = _ref.dataSource,
@@ -8114,6 +8114,22 @@ function Table(_ref) {
8114
8114
  return !c.hideInTable;
8115
8115
  });
8116
8116
  }, [columns]);
8117
+
8118
+ var calcWidth = function calcWidth(columns) {
8119
+ return columns.reduce(function (pre, cur) {
8120
+ var width = cur.width;
8121
+
8122
+ if (width) {
8123
+ return pre + width;
8124
+ }
8125
+
8126
+ return pre;
8127
+ }, 0);
8128
+ };
8129
+
8130
+ var showColumns = columns.filter(function (c) {
8131
+ return !c.hideInTable;
8132
+ });
8117
8133
  var renderTh = React.useMemo(function () {
8118
8134
  var renderThFc = function renderThFc(columns, parentHeight, isChild) {
8119
8135
  var showColumns = columns.filter(function (c) {
@@ -8151,13 +8167,17 @@ function Table(_ref) {
8151
8167
  } else {
8152
8168
  return /*#__PURE__*/React__default['default'].createElement("div", {
8153
8169
  key: c.dataIndex,
8154
- style: {
8170
+ style: _objectSpread2({
8155
8171
  width: c.width + 'px',
8156
8172
  flex: c.width ? '0 1 auto' : '1',
8157
8173
  height: !c.children ? '100%' : '32px',
8158
8174
  borderRight: index != showColumns.length - 1 && filterColumns.length !== showColumns.length ? '1px solid #3b5173' : 'none'
8159
- },
8160
- className: "td"
8175
+ }, c.fixed == 'left' ? {
8176
+ left: ((rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.type) ? 56 : 6) + calcWidth(showColumns.slice(0, index - 2 > 0 ? index - 1 : 0))
8177
+ } : c.fixed == 'right' ? {
8178
+ right: calcWidth(showColumns.slice(index + 1))
8179
+ } : {}),
8180
+ className: "td ".concat(c.fixed == 'left' ? 'fixedLeft' : c.fixed == 'right' ? 'fixedRight' : '')
8161
8181
  }, c.title);
8162
8182
  }
8163
8183
  });
@@ -8199,12 +8219,16 @@ function Table(_ref) {
8199
8219
  placement: "top",
8200
8220
  title: record[c.dataIndex]
8201
8221
  }, /*#__PURE__*/React__default['default'].createElement("div", {
8202
- className: 'td' + (c.ellipsis ? ' ellipsis' : ''),
8203
- style: {
8222
+ className: "td ".concat(c.fixed == 'left' ? 'fixedLeft' : c.fixed == 'right' ? 'fixedRight' : '', " ").concat(c.ellipsis ? ' ellipsis' : ''),
8223
+ style: _objectSpread2({
8204
8224
  width: c.width + 'px',
8205
8225
  flex: c.width ? '0 1 auto' : '1',
8206
8226
  overflow: 'hidden'
8207
- }
8227
+ }, c.fixed == 'left' ? {
8228
+ left: ((rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.type) ? 56 : 6) + calcWidth(showColumns.slice(0, index - 2 > 0 ? index - 1 : 0))
8229
+ } : c.fixed == 'right' ? {
8230
+ right: calcWidth(showColumns.slice(index + 1))
8231
+ } : {})
8208
8232
  }, /*#__PURE__*/React__default['default'].createElement("div", {
8209
8233
  style: {
8210
8234
  width: '100%',
@@ -8220,12 +8244,16 @@ function Table(_ref) {
8220
8244
 
8221
8245
  return /*#__PURE__*/React__default['default'].createElement("div", {
8222
8246
  key: c.dataIndex,
8223
- className: 'td' + (c.ellipsis ? ' ellipsis' : ''),
8224
- style: {
8247
+ className: "td ".concat(c.fixed == 'left' ? 'fixedLeft' : c.fixed == 'right' ? 'fixedRight' : '', " ").concat(c.ellipsis ? ' ellipsis' : ''),
8248
+ style: _objectSpread2({
8225
8249
  width: c.width + 'px',
8226
8250
  flex: c.width ? '0 1 auto' : '1',
8227
8251
  overflow: 'hidden'
8228
- },
8252
+ }, c.fixed == 'left' ? {
8253
+ left: ((rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.type) ? 56 : 6) + calcWidth(showColumns.slice(0, index - 2 > 0 ? index - 1 : 0))
8254
+ } : c.fixed == 'right' ? {
8255
+ right: calcWidth(showColumns.slice(index + 1))
8256
+ } : {}),
8229
8257
  title: record[c.dataIndex]
8230
8258
  }, c.ellipsis ? /*#__PURE__*/React__default['default'].createElement("div", {
8231
8259
  style: {
@@ -8256,11 +8284,13 @@ function Table(_ref) {
8256
8284
  tr: true
8257
8285
  }, typeof rowClassName === 'function' ? rowClassName(record, index) : '', true))
8258
8286
  }, typeof onRow === 'function' ? onRow(record, index) : {}), (rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.type) === 'checkbox' && /*#__PURE__*/React__default['default'].createElement("div", {
8259
- style: {
8287
+ style: _objectSpread2({
8260
8288
  width: '50px',
8261
8289
  flex: '0 1 auto'
8262
- },
8263
- className: "td"
8290
+ }, showColumns[0].fixed == 'left' ? {
8291
+ left: 6
8292
+ } : {}),
8293
+ className: "td ".concat(showColumns[0].fixed == 'left' ? 'fixedLeft' : '')
8264
8294
  }, /*#__PURE__*/React__default['default'].createElement(Index$3, {
8265
8295
  checked: (_ref2 = [].concat(_toConsumableArray((rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.selectedRowKeys) || []), _toConsumableArray(selectedRowKeys))) === null || _ref2 === void 0 ? void 0 : _ref2.includes(key),
8266
8296
  onClick: function onClick(e) {
@@ -8294,11 +8324,13 @@ function Table(_ref) {
8294
8324
  });
8295
8325
  }
8296
8326
  })), (rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.type) === 'radio' && /*#__PURE__*/React__default['default'].createElement("div", {
8297
- style: {
8327
+ style: _objectSpread2({
8298
8328
  width: '50px',
8299
8329
  flex: '0 1 auto'
8300
- },
8301
- className: "td"
8330
+ }, showColumns[0].fixed == 'left' ? {
8331
+ left: 6
8332
+ } : {}),
8333
+ className: "td ".concat(showColumns[0].fixed == 'left' ? 'fixedLeft' : '')
8302
8334
  }, /*#__PURE__*/React__default['default'].createElement(Index$2, {
8303
8335
  checked: (_ref3 = [].concat(_toConsumableArray((rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.selectedRowKeys) || []), _toConsumableArray(selectedRowKeys))) === null || _ref3 === void 0 ? void 0 : _ref3.includes(key),
8304
8336
  onClick: function onClick(e) {
@@ -8454,20 +8486,27 @@ function Table(_ref) {
8454
8486
  className: classnames__default['default']((_classnames2 = {
8455
8487
  container: true
8456
8488
  }, _defineProperty(_classnames2, 'w-table', true), _defineProperty(_classnames2, 'w-frame-box-table', frameBoxTable), _defineProperty(_classnames2, className || 'defalut-table', true), _classnames2)),
8457
- style: style
8489
+ style: _objectSpread2(_objectSpread2({}, (scroll === null || scroll === void 0 ? void 0 : scroll.y) ? {
8490
+ height: scroll.y
8491
+ } : {}), style)
8458
8492
  }, /*#__PURE__*/React__default['default'].createElement("div", {
8459
8493
  className: "theader"
8460
8494
  }, /*#__PURE__*/React__default['default'].createElement("div", {
8461
8495
  className: "th",
8462
8496
  style: _objectSpread2(_objectSpread2({}, thStyle), {}, {
8463
8497
  height: layerIndex * 32 + 'px'
8464
- })
8498
+ }, (scroll === null || scroll === void 0 ? void 0 : scroll.x) ? {
8499
+ width: scroll.x
8500
+ } : {})
8465
8501
  }, (rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.type) === 'checkbox' && /*#__PURE__*/React__default['default'].createElement("div", {
8466
- style: {
8502
+ style: _objectSpread2({
8467
8503
  width: '50px',
8468
- flex: '0 1 auto'
8469
- },
8470
- className: "td"
8504
+ flex: '0 1 auto',
8505
+ height: '100%'
8506
+ }, showColumns[0].fixed == 'left' ? {
8507
+ left: 6
8508
+ } : {}),
8509
+ className: "td ".concat(((_columns$ = columns[0]) === null || _columns$ === void 0 ? void 0 : _columns$.fixed) == 'left' ? 'fixedLeft' : '')
8471
8510
  }, /*#__PURE__*/React__default['default'].createElement(Index$3, {
8472
8511
  checked: dataSource.every(function (record) {
8473
8512
  return selectedRowKeys.includes(typeof rowKey === 'function' ? record[rowKey(record)] : record[rowKey]);
@@ -8479,15 +8518,23 @@ function Table(_ref) {
8479
8518
  }),
8480
8519
  onChange: onSelectAllChange
8481
8520
  })), (rowSelection === null || rowSelection === void 0 ? void 0 : rowSelection.type) === 'radio' && /*#__PURE__*/React__default['default'].createElement("div", {
8482
- style: {
8521
+ style: _objectSpread2({
8483
8522
  width: '50px',
8484
- flex: '0 1 auto'
8485
- },
8486
- className: "td"
8523
+ flex: '0 1 auto',
8524
+ height: '100%'
8525
+ }, showColumns[0].fixed == 'left' ? {
8526
+ left: 6
8527
+ } : {}),
8528
+ className: "td ".concat(((_columns$2 = columns[0]) === null || _columns$2 === void 0 ? void 0 : _columns$2.fixed) == 'left' ? 'fixedLeft' : '')
8487
8529
  }), renderTh)), /*#__PURE__*/React__default['default'].createElement("div", {
8530
+ className: "tbodyContainer",
8531
+ style: _objectSpread2({}, (scroll === null || scroll === void 0 ? void 0 : scroll.x) ? {
8532
+ width: scroll.x
8533
+ } : {})
8534
+ }, /*#__PURE__*/React__default['default'].createElement("div", {
8488
8535
  className: "tbody",
8489
8536
  style: _objectSpread2({
8490
- height: (style === null || style === void 0 ? void 0 : style.height) ? "calc(".concat(style.height, " - ").concat(52 + (pagination === false ? 0 : 42), "px)") : '200px'
8537
+ height: (style === null || style === void 0 ? void 0 : style.height) || (scroll === null || scroll === void 0 ? void 0 : scroll.y) ? "calc(".concat(style === null || style === void 0 ? void 0 : style.height, " - ").concat(52 + (pagination === false ? 0 : 42), "px)") : '200px'
8491
8538
  }, tbodyStyle)
8492
8539
  }, dataSource.length > 0 ? dataSource.map(function (record, index) {
8493
8540
  var key = typeof rowKey === 'function' ? record[rowKey(record)] : record[rowKey];
@@ -8506,12 +8553,12 @@ function Table(_ref) {
8506
8553
  justifyContent: 'center',
8507
8554
  alignItems: 'center'
8508
8555
  }
8509
- }, none || '暂无数据')), _typeof(pagination) === 'object' && /*#__PURE__*/React__default['default'].createElement(_Pagination__default['default'], _objectSpread2({
8556
+ }, none || '暂无数据')))), _typeof(pagination) === 'object' && /*#__PURE__*/React__default['default'].createElement(_Pagination__default['default'], _objectSpread2({
8510
8557
  style: {
8511
8558
  textAlign: 'right',
8512
8559
  marginTop: '10px'
8513
8560
  }
8514
- }, paginationParams))));
8561
+ }, paginationParams)));
8515
8562
  }
8516
8563
  Table.defaultProps = {
8517
8564
  rowKey: 'key'
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "private": false,
3
3
  "name": "wargerm",
4
- "version": "0.4.7",
4
+ "version": "0.4.8",
5
5
  "scripts": {
6
6
  "dev": "dumi dev",
7
7
  "docs:build": "dumi build",
@@ -76,4 +76,4 @@
76
76
  "react": "^16.12.0",
77
77
  "yorkie": "^2.0.0"
78
78
  }
79
- }
79
+ }