x-star-design 0.0.39 → 0.0.41

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 (14) hide show
  1. package/dist/contact-button/index.js +3 -1
  2. package/dist/index.d.ts +2 -2
  3. package/dist/index.js +1 -1
  4. package/dist/input-numbers/index.d.ts +3 -3
  5. package/dist/input-numbers/index.js +12 -14
  6. package/dist/sort-table/index.d.ts +4 -4
  7. package/dist/sort-table/index.js +24 -15
  8. package/dist/styles/index.css +195 -195
  9. package/dist/title-with-icon/index.d.ts +2 -2
  10. package/dist/user-avatar/index.js +3 -1
  11. package/dist/virtual-table/index.js +31 -35
  12. package/package.json +1 -1
  13. /package/dist/{ali-player → aliplayer}/index.d.ts +0 -0
  14. /package/dist/{ali-player → aliplayer}/index.js +0 -0
package/dist/contact-button/index.js CHANGED
@@ -18,6 +18,7 @@ var ContactButton = function ContactButton() {
18
18
  direction: "vertical",
19
19
  align: "center"
20
20
  }, /*#__PURE__*/React.createElement("img", {
21
+ "data-testid": "qrCode",
21
22
  alt: "",
22
23
  style: {
23
24
  height: 100
@@ -25,7 +26,8 @@ var ContactButton = function ContactButton() {
25
26
  src: getTransResult(lang, wechatCode, xcQrCode)
26
27
  }), t('CONTACT_TIP'), t('CONTACT_TELEPHONE'))
27
28
  }, /*#__PURE__*/React.createElement(Card, {
28
- className: "".concat(prefix, "contactButtonCard")
29
+ className: "".concat(prefix, "contactButtonCard"),
30
+ "data-testid": 'contactButtonText'
29
31
  }, /*#__PURE__*/React.createElement(Space, {
30
32
  direction: "vertical",
31
33
  align: "center"
package/dist/index.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  export { default as AcAnimation } from './ac-animation';
2
- export { default as Aliplayer } from './ali-player';
3
- export type { AliplayerConfig, AliplayerInstance } from './ali-player';
2
+ export { default as Aliplayer } from './aliplayer';
3
+ export type { AliplayerConfig, AliplayerInstance } from './aliplayer';
4
4
  export { default as CodeDetailModal } from './code-detail-modal';
5
5
  export { default as CodeMirrorWrapper } from './code-mirror-wrapper';
6
6
  export { LangId, Language, Theme } from './code-mirror-wrapper/define';
package/dist/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  export { default as AcAnimation } from "./ac-animation";
2
- export { default as Aliplayer } from "./ali-player";
2
+ export { default as Aliplayer } from "./aliplayer";
3
3
  export { default as CodeDetailModal } from "./code-detail-modal";
4
4
  export { default as CodeMirrorWrapper } from "./code-mirror-wrapper";
5
5
  export { LangId, Language, Theme } from "./code-mirror-wrapper/define";
package/dist/input-numbers/index.d.ts CHANGED
@@ -1,10 +1,10 @@
1
1
  import { InputNumberProps } from 'antd';
2
2
  import React from 'react';
3
3
  export interface InputNumbersValue {
4
- start?: number;
5
- end?: number;
4
+ start?: string | number | null;
5
+ end?: string | number | null;
6
6
  }
7
- type InputNumbersValueProps = InputNumberProps & {
7
+ type InputNumbersValueProps = Omit<InputNumberProps, 'value' | 'onChange'> & {
8
8
  value?: InputNumbersValue;
9
9
  onChange?: (value: InputNumbersValue) => void;
10
10
  };
package/dist/input-numbers/index.js CHANGED
@@ -21,32 +21,30 @@ var InputNumbers = function InputNumbers(_ref) {
21
21
  split: '-',
22
22
  align: "center"
23
23
  }, /*#__PURE__*/React.createElement(InputNumber, _extends({
24
+ "data-testid": "start-input",
24
25
  min: 0,
25
26
  max: 100
26
27
  }, props, {
27
28
  value: (value === null || value === void 0 ? void 0 : value.start) || start,
28
29
  onChange: function onChange(v) {
29
- if (typeof v === 'number') {
30
- setStart(v);
31
- _onChange === null || _onChange === void 0 ? void 0 : _onChange({
32
- start: v,
33
- end: end
34
- });
35
- }
30
+ setStart(v);
31
+ _onChange === null || _onChange === void 0 ? void 0 : _onChange({
32
+ start: v,
33
+ end: end
34
+ });
36
35
  }
37
36
  })), /*#__PURE__*/React.createElement(InputNumber, _extends({
37
+ "data-testid": "end-input",
38
38
  min: 0,
39
39
  max: 100,
40
40
  value: (value === null || value === void 0 ? void 0 : value.end) || end
41
41
  }, props, {
42
42
  onChange: function onChange(v) {
43
- if (typeof v === 'number') {
44
- setEnd(v);
45
- _onChange === null || _onChange === void 0 ? void 0 : _onChange({
46
- start: start,
47
- end: v
48
- });
49
- }
43
+ setEnd(v);
44
+ _onChange === null || _onChange === void 0 ? void 0 : _onChange({
45
+ start: start,
46
+ end: v
47
+ });
50
48
  }
51
49
  }))));
52
50
  };
package/dist/sort-table/index.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import type { TableProps } from 'antd';
2
2
  import React from 'react';
3
- type customProps = {
4
- onSortEnd?: (newDataSource: Array<any>) => Promise<void>;
5
- };
6
- declare const SortTable: (props: TableProps<any> & customProps) => React.JSX.Element;
3
+ interface SortTableProps<RecordType> extends TableProps<RecordType> {
4
+ onSortEnd?: (newDataSource: RecordType[]) => void;
5
+ }
6
+ declare const SortTable: <RecordType extends Record<string, unknown>>(props: SortTableProps<RecordType>) => React.JSX.Element;
7
7
  export default SortTable;
package/dist/sort-table/index.js CHANGED
@@ -1,21 +1,24 @@
1
- import _extends from "@babel/runtime/helpers/esm/extends";
2
1
  import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
2
+ import _extends from "@babel/runtime/helpers/esm/extends";
3
3
  import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
4
4
  import { MenuOutlined } from '@ant-design/icons';
5
5
  import { Table } from 'antd';
6
- import React from 'react';
6
+ import React, { useRef } from 'react';
7
7
  import { SortableContainer, SortableElement, SortableHandle } from 'react-sortable-hoc';
8
8
  import ConfigProviderWrapper from "../config-provider-wrapper";
9
9
  var SortTable = function SortTable(props) {
10
- var dataSource = (props === null || props === void 0 ? void 0 : props.dataSource) || [];
11
- var rowKey = props.rowKey,
10
+ var _props$columns;
11
+ var _props$dataSource = props.dataSource,
12
+ dataSource = _props$dataSource === void 0 ? [] : _props$dataSource,
13
+ rowKey = props.rowKey,
12
14
  onEnd = props.onSortEnd;
13
15
  var DragHandle = SortableHandle(function () {
14
16
  return /*#__PURE__*/React.createElement(MenuOutlined, {
15
17
  style: {
16
18
  cursor: 'grab',
17
19
  color: '#999'
18
- }
20
+ },
21
+ "data-testid": "dragHandle"
19
22
  });
20
23
  });
21
24
  var newColumns = [{
@@ -28,12 +31,17 @@ var SortTable = function SortTable(props) {
28
31
  render: function render() {
29
32
  return /*#__PURE__*/React.createElement(DragHandle, null);
30
33
  }
31
- }].concat(_toConsumableArray(props !== null && props !== void 0 && props.columns ? props === null || props === void 0 ? void 0 : props.columns : []));
34
+ }].concat(_toConsumableArray((_props$columns = props.columns) !== null && _props$columns !== void 0 ? _props$columns : []));
32
35
  var SortableItem = SortableElement(function (props) {
33
- return /*#__PURE__*/React.createElement("tr", props);
36
+ return /*#__PURE__*/React.createElement("tr", _extends({}, props, {
37
+ "data-testid": "tableRow"
38
+ }));
34
39
  });
40
+ var bodyRef = useRef(null);
35
41
  var SortableBody = SortableContainer(function (props) {
36
- return /*#__PURE__*/React.createElement("tbody", props);
42
+ return /*#__PURE__*/React.createElement("tbody", _extends({}, props, {
43
+ ref: bodyRef
44
+ }));
37
45
  });
38
46
  var onSortEnd = function onSortEnd(sortEnd) {
39
47
  var oldIndex = sortEnd.oldIndex,
@@ -48,9 +56,7 @@ var SortTable = function SortTable(props) {
48
56
  var filteredData = newData.filter(function (el) {
49
57
  return !!el;
50
58
  }); // 过滤掉空元素
51
- if (typeof onEnd === 'function') {
52
- onEnd(filteredData);
53
- }
59
+ onEnd === null || onEnd === void 0 ? void 0 : onEnd(filteredData);
54
60
  }
55
61
  };
56
62
  var DraggableContainer = function DraggableContainer(props) {
@@ -58,23 +64,26 @@ var SortTable = function SortTable(props) {
58
64
  useDragHandle: true,
59
65
  disableAutoscroll: true,
60
66
  helperClass: "row-dragging",
67
+ helperContainer: function helperContainer() {
68
+ return bodyRef.current;
69
+ },
61
70
  onSortEnd: onSortEnd
62
71
  }));
63
72
  };
64
73
  var DraggableBodyRow = function DraggableBodyRow(props) {
65
74
  // function findIndex base on Table rowKey props and should always be a right array index
66
75
  var index = dataSource.findIndex(function (x) {
67
- return x[String(rowKey)] === props['data-row-key'];
76
+ return typeof rowKey === 'string' && x[rowKey] === props['data-row-key'];
68
77
  });
69
78
  return /*#__PURE__*/React.createElement(SortableItem, _extends({}, props, {
70
- index: index,
71
- key: index
79
+ key: index,
80
+ index: index
72
81
  }));
73
82
  };
74
83
  return /*#__PURE__*/React.createElement(ConfigProviderWrapper, null, /*#__PURE__*/React.createElement(Table, _extends({}, props, {
75
84
  columns: newColumns,
76
- rowKey: rowKey,
77
85
  dataSource: dataSource,
86
+ rowKey: rowKey,
78
87
  components: {
79
88
  body: {
80
89
  wrapper: DraggableContainer,
package/dist/styles/index.css CHANGED
@@ -1,33 +1,18 @@
1
1
  @charset "UTF-8";
2
- .x-star-design-statusTag {
3
- position: relative;
4
- display: flex;
5
- justify-content: center;
6
- align-items: center;
7
- cursor: pointer;
8
- width: 1.6rem;
9
- height: 1.6rem;
10
- font-size: 1rem;
11
- border-width: 1px;
12
- border: 1px dashed #b7b7b7;
13
- background-color: #efefef;
14
- }
15
- .x-star-design-statusTag img {
16
- width: 1rem;
17
- height: 1rem;
18
- }
19
- .x-star-design-statusTag .x-star-design-required {
20
- position: absolute;
21
- width: 0.8rem;
22
- height: 0.8rem;
23
- }
24
- .x-star-design-statusTag .x-star-design-circleRequired {
25
- top: -3px;
26
- right: -3px;
2
+ .x-star-design-codeDetailModal .x-star-design-codeCompileResult {
3
+ padding: 10px 20px;
4
+ background-color: #fafafa;
5
+ border: 1px solid #e3e3e3;
6
+ border-radius: 3px;
7
+ box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
8
+ overflow: auto;
9
+ margin-top: 1%;
10
+ min-height: 200px;
11
+ height: 50vh;
27
12
  }
28
- .x-star-design-statusTag .x-star-design-rectRequired {
29
- top: -5px;
30
- right: -5px;
13
+ .x-star-design-codeDetailModal .x-star-design-codeMirror {
14
+ min-height: 200px;
15
+ height: 50vh;
31
16
  }
32
17
 
33
18
  .x-star-design-codeMirror {
@@ -44,6 +29,21 @@
44
29
  outline: unset;
45
30
  }
46
31
 
32
+ .x-star-design-contactButtonCard {
33
+ position: fixed !important;
34
+ right: 3rem;
35
+ top: 70%;
36
+ display: flex;
37
+ flex-direction: column;
38
+ cursor: pointer !important;
39
+ z-index: 999;
40
+ border: 3px dashed orange !important;
41
+ }
42
+ .x-star-design-contactButtonCard .ant-card-body,
43
+ .x-star-design-contactButtonCard .x-star-design-card-body {
44
+ padding: 5px;
45
+ }
46
+
47
47
  .x-star-design-draggable-layout {
48
48
  position: relative;
49
49
  width: 100%;
@@ -83,42 +83,89 @@
83
83
  height: 100%;
84
84
  }
85
85
 
86
- .x-star-design-rainbowContent {
87
- height: 100vh;
86
+ .x-star-design-errorPage {
87
+ position: relative;
88
+ height: calc(100vh - 64px);
89
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
90
+ }
91
+ .x-star-design-errorPage .hello {
92
+ position: absolute;
93
+ bottom: 240px;
94
+ left: 100px;
95
+ width: 204px;
96
+ height: 96px;
97
+ background: url("https://media.strapi.turingstar.com.cn/production/2023/3/hello_0dd8b00bbf.png") 100% no-repeat;
98
+ background-size: 100% 100%;
99
+ }
100
+ .x-star-design-errorPage .ip {
101
+ position: absolute;
102
+ bottom: 0;
103
+ left: 0;
104
+ width: 240px;
105
+ height: 280px;
106
+ background: url("https://media.strapi.turingstar.com.cn/production/2023/3/_31e3aca7f2.png") 100% no-repeat;
107
+ background-size: 100% 100%;
108
+ }
109
+ .x-star-design-errorPage .planets {
110
+ position: absolute;
111
+ top: 0;
112
+ right: 0;
113
+ width: 240px;
114
+ height: 280px;
115
+ background: url("https://media.strapi.turingstar.com.cn/production/2023/3/background_right_6ff67955bc.png") 100% no-repeat;
116
+ background-size: 100% 100%;
117
+ }
118
+ .x-star-design-errorPage .content {
119
+ position: absolute;
120
+ top: 50%;
121
+ left: 50%;
88
122
  display: flex;
89
- justify-content: center;
123
+ justify-content: space-around;
90
124
  align-items: center;
125
+ color: rgba(0, 0, 0, 0.88);
126
+ transform: translate(-50%, -50%);
91
127
  flex-direction: column;
92
128
  }
93
- .x-star-design-rainbowContent img {
94
- margin-bottom: 20px;
129
+ .x-star-design-errorPage .content .alert {
130
+ position: relative;
131
+ display: flex;
132
+ align-items: flex-start;
133
+ margin: 0;
134
+ padding: 8px 12px;
135
+ border: 1px solid #ffccc7;
136
+ border-radius: 8px;
137
+ font-size: 16px;
138
+ color: rgba(0, 0, 0, 0.88);
139
+ background-color: #fff2f0;
140
+ padding-inline: 24px;
141
+ padding-block: 20px;
142
+ box-sizing: border-box;
95
143
  }
96
- .x-star-design-rainbowContent .x-star-design-rainbowDot {
97
- font-family: simsun, monospace;
98
- /* 固定字体避免设置的宽度无效 */
99
- display: inline-block;
100
- overflow: hidden;
101
- animation: dot 0.8s infinite step-start;
102
- margin-left: 6px;
144
+ .x-star-design-errorPage .content .alert .description {
145
+ display: flex;
146
+ flex-direction: column;
103
147
  }
104
- @keyframes dot {
105
- /* 动态改变显示宽度，但始终让总占据空间不变，避免抖动 */
106
- 0% {
107
- width: 0;
108
- margin-right: 1.5em;
109
- }
110
- 33% {
111
- width: 0.5em;
112
- margin-right: 1em;
113
- }
114
- 66% {
115
- width: 1em;
116
- margin-right: 0.5em;
117
- }
118
- 100% {
119
- width: 1.5em;
120
- margin-right: 0;
121
- }
148
+ .x-star-design-errorPage .content .alert .description div {
149
+ line-height: 2.5rem;
150
+ }
151
+ .x-star-design-errorPage .content .alert .description .actions {
152
+ display: flex;
153
+ justify-content: space-between;
154
+ width: 50%;
155
+ }
156
+ .x-star-design-errorPage .content a {
157
+ color: #1890ff;
158
+ text-decoration: none;
159
+ background-color: transparent;
160
+ outline: none;
161
+ cursor: pointer;
162
+ transition: color 0.3s;
163
+ touch-action: manipulation;
164
+ }
165
+ .x-star-design-errorPage .content a:hover {
166
+ text-decoration: none;
167
+ outline: 0;
168
+ color: #40a9ff;
122
169
  }
123
170
 
124
171
  .x-star-design-loadingMask {
@@ -266,6 +313,75 @@
266
313
  transform: translate(-66px, 0);
267
314
  }
268
315
  }
316
+ .x-star-design-rainbowContent {
317
+ height: 100vh;
318
+ display: flex;
319
+ justify-content: center;
320
+ align-items: center;
321
+ flex-direction: column;
322
+ }
323
+ .x-star-design-rainbowContent img {
324
+ margin-bottom: 20px;
325
+ }
326
+ .x-star-design-rainbowContent .x-star-design-rainbowDot {
327
+ font-family: simsun, monospace;
328
+ /* 固定字体避免设置的宽度无效 */
329
+ display: inline-block;
330
+ overflow: hidden;
331
+ animation: dot 0.8s infinite step-start;
332
+ margin-left: 6px;
333
+ }
334
+ @keyframes dot {
335
+ /* 动态改变显示宽度，但始终让总占据空间不变，避免抖动 */
336
+ 0% {
337
+ width: 0;
338
+ margin-right: 1.5em;
339
+ }
340
+ 33% {
341
+ width: 0.5em;
342
+ margin-right: 1em;
343
+ }
344
+ 66% {
345
+ width: 1em;
346
+ margin-right: 0.5em;
347
+ }
348
+ 100% {
349
+ width: 1.5em;
350
+ margin-right: 0;
351
+ }
352
+ }
353
+
354
+ .x-star-design-statusTag {
355
+ position: relative;
356
+ display: flex;
357
+ justify-content: center;
358
+ align-items: center;
359
+ cursor: pointer;
360
+ width: 1.6rem;
361
+ height: 1.6rem;
362
+ font-size: 1rem;
363
+ border-width: 1px;
364
+ border: 1px dashed #b7b7b7;
365
+ background-color: #efefef;
366
+ }
367
+ .x-star-design-statusTag img {
368
+ width: 1rem;
369
+ height: 1rem;
370
+ }
371
+ .x-star-design-statusTag .x-star-design-required {
372
+ position: absolute;
373
+ width: 0.8rem;
374
+ height: 0.8rem;
375
+ }
376
+ .x-star-design-statusTag .x-star-design-circleRequired {
377
+ top: -3px;
378
+ right: -3px;
379
+ }
380
+ .x-star-design-statusTag .x-star-design-rectRequired {
381
+ top: -5px;
382
+ right: -5px;
383
+ }
384
+
269
385
  .x-star-design-titleSection {
270
386
  font-size: 18px;
271
387
  margin: 15px 10px 20px 0;
@@ -326,6 +442,27 @@
326
442
  background: #141414;
327
443
  }
328
444
 
445
+ .x-star-design-visualForm {
446
+ width: 90%;
447
+ }
448
+ .x-star-design-visualForm .x-star-design-row {
449
+ width: 100%;
450
+ }
451
+ .x-star-design-visualForm .x-star-design-row .x-star-design-explainItem {
452
+ margin: -20px 0 16px;
453
+ }
454
+ .x-star-design-visualForm .x-star-design-row .x-star-design-form-item-extra {
455
+ clear: both;
456
+ color: rgba(0, 0, 0, 0.4509803922);
457
+ font-size: 14px;
458
+ line-height: 1.5715;
459
+ transition: color 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
460
+ min-height: 24px;
461
+ }
462
+ .x-star-design-visualForm .x-star-design-formList {
463
+ width: 100%;
464
+ }
465
+
329
466
  .x-star-design-XTabs.x-star-design-tabs, .x-star-design-XTabs.ant-tabs {
330
467
  width: 100%;
331
468
  min-height: 80vh;
@@ -381,140 +518,3 @@
381
518
  padding-top: 10px;
382
519
  font-style: normal;
383
520
  }
384
-
385
- .x-star-design-visualForm {
386
- width: 90%;
387
- }
388
- .x-star-design-visualForm .x-star-design-row {
389
- width: 100%;
390
- }
391
- .x-star-design-visualForm .x-star-design-row .x-star-design-explainItem {
392
- margin: -20px 0 16px;
393
- }
394
- .x-star-design-visualForm .x-star-design-row .x-star-design-form-item-extra {
395
- clear: both;
396
- color: rgba(0, 0, 0, 0.4509803922);
397
- font-size: 14px;
398
- line-height: 1.5715;
399
- transition: color 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
400
- min-height: 24px;
401
- }
402
- .x-star-design-visualForm .x-star-design-formList {
403
- width: 100%;
404
- }
405
-
406
- .x-star-design-codeDetailModal .x-star-design-codeCompileResult {
407
- padding: 10px 20px;
408
- background-color: #fafafa;
409
- border: 1px solid #e3e3e3;
410
- border-radius: 3px;
411
- box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
412
- overflow: auto;
413
- margin-top: 1%;
414
- min-height: 200px;
415
- height: 50vh;
416
- }
417
- .x-star-design-codeDetailModal .x-star-design-codeMirror {
418
- min-height: 200px;
419
- height: 50vh;
420
- }
421
-
422
- .x-star-design-contactButtonCard {
423
- position: fixed !important;
424
- right: 3rem;
425
- top: 70%;
426
- display: flex;
427
- flex-direction: column;
428
- cursor: pointer !important;
429
- z-index: 999;
430
- border: 3px dashed orange !important;
431
- }
432
- .x-star-design-contactButtonCard .ant-card-body,
433
- .x-star-design-contactButtonCard .x-star-design-card-body {
434
- padding: 5px;
435
- }
436
-
437
- .x-star-design-errorPage {
438
- position: relative;
439
- height: calc(100vh - 64px);
440
- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
441
- }
442
- .x-star-design-errorPage .hello {
443
- position: absolute;
444
- bottom: 240px;
445
- left: 100px;
446
- width: 204px;
447
- height: 96px;
448
- background: url("https://media.strapi.turingstar.com.cn/production/2023/3/hello_0dd8b00bbf.png") 100% no-repeat;
449
- background-size: 100% 100%;
450
- }
451
- .x-star-design-errorPage .ip {
452
- position: absolute;
453
- bottom: 0;
454
- left: 0;
455
- width: 240px;
456
- height: 280px;
457
- background: url("https://media.strapi.turingstar.com.cn/production/2023/3/_31e3aca7f2.png") 100% no-repeat;
458
- background-size: 100% 100%;
459
- }
460
- .x-star-design-errorPage .planets {
461
- position: absolute;
462
- top: 0;
463
- right: 0;
464
- width: 240px;
465
- height: 280px;
466
- background: url("https://media.strapi.turingstar.com.cn/production/2023/3/background_right_6ff67955bc.png") 100% no-repeat;
467
- background-size: 100% 100%;
468
- }
469
- .x-star-design-errorPage .content {
470
- position: absolute;
471
- top: 50%;
472
- left: 50%;
473
- display: flex;
474
- justify-content: space-around;
475
- align-items: center;
476
- color: rgba(0, 0, 0, 0.88);
477
- transform: translate(-50%, -50%);
478
- flex-direction: column;
479
- }
480
- .x-star-design-errorPage .content .alert {
481
- position: relative;
482
- display: flex;
483
- align-items: flex-start;
484
- margin: 0;
485
- padding: 8px 12px;
486
- border: 1px solid #ffccc7;
487
- border-radius: 8px;
488
- font-size: 16px;
489
- color: rgba(0, 0, 0, 0.88);
490
- background-color: #fff2f0;
491
- padding-inline: 24px;
492
- padding-block: 20px;
493
- box-sizing: border-box;
494
- }
495
- .x-star-design-errorPage .content .alert .description {
496
- display: flex;
497
- flex-direction: column;
498
- }
499
- .x-star-design-errorPage .content .alert .description div {
500
- line-height: 2.5rem;
501
- }
502
- .x-star-design-errorPage .content .alert .description .actions {
503
- display: flex;
504
- justify-content: space-between;
505
- width: 50%;
506
- }
507
- .x-star-design-errorPage .content a {
508
- color: #1890ff;
509
- text-decoration: none;
510
- background-color: transparent;
511
- outline: none;
512
- cursor: pointer;
513
- transition: color 0.3s;
514
- touch-action: manipulation;
515
- }
516
- .x-star-design-errorPage .content a:hover {
517
- text-decoration: none;
518
- outline: 0;
519
- color: #40a9ff;
520
- }
package/dist/title-with-icon/index.d.ts CHANGED
@@ -1,8 +1,8 @@
1
1
  import React from 'react';
2
2
  type TitleWithIconProps = {
3
- title: string;
3
+ title: React.ReactNode;
4
4
  className?: string;
5
- description?: string;
5
+ description?: React.ReactNode;
6
6
  id?: string;
7
7
  };
8
8
  declare const TitleWithIcon: ({ className, title, description, id, }: TitleWithIconProps) => React.JSX.Element;
package/dist/user-avatar/index.js CHANGED
@@ -25,6 +25,8 @@ var UserAvatar = function UserAvatar(_ref) {
25
25
  style: _objectSpread({
26
26
  background: background
27
27
  }, style)
28
- }, props), name[0].toUpperCase())));
28
+ }, props, {
29
+ "data-testid": 'userAvatar'
30
+ }), name[0].toUpperCase())));
29
31
  };
30
32
  export default UserAvatar;
package/dist/virtual-table/index.js CHANGED
@@ -18,7 +18,7 @@ var VirtualTable = function VirtualTable(props) {
18
18
  /**
19
19
  * 表格实际宽度
20
20
  */
21
- var _useState = useState(0),
21
+ var _useState = useState(100),
22
22
  _useState2 = _slicedToArray(_useState, 2),
23
23
  tableWidth = _useState2[0],
24
24
  setTableWidth = _useState2[1];
@@ -89,18 +89,14 @@ var VirtualTable = function VirtualTable(props) {
89
89
  var obj = {};
90
90
  Object.defineProperty(obj, 'scrollLeft', {
91
91
  get: function get() {
92
- if (gridRef.current) {
93
- var _gridRef$current, _gridRef$current$stat;
94
- return (_gridRef$current = gridRef.current) === null || _gridRef$current === void 0 ? void 0 : (_gridRef$current$stat = _gridRef$current.state) === null || _gridRef$current$stat === void 0 ? void 0 : _gridRef$current$stat.scrollLeft;
95
- }
96
- return null;
92
+ var _gridRef$current;
93
+ return (_gridRef$current = gridRef.current) === null || _gridRef$current === void 0 ? void 0 : _gridRef$current.state.scrollLeft;
97
94
  },
98
95
  set: function set(scrollLeft) {
99
- if (gridRef.current) {
100
- gridRef.current.scrollTo({
101
- scrollLeft: scrollLeft
102
- });
103
- }
96
+ var _gridRef$current2;
97
+ return (_gridRef$current2 = gridRef.current) === null || _gridRef$current2 === void 0 ? void 0 : _gridRef$current2.scrollTo({
98
+ scrollLeft: scrollLeft
99
+ });
104
100
  }
105
101
  });
106
102
  return obj;
@@ -108,8 +104,8 @@ var VirtualTable = function VirtualTable(props) {
108
104
  _useState4 = _slicedToArray(_useState3, 1),
109
105
  connectObject = _useState4[0];
110
106
  var resetVirtualGrid = function resetVirtualGrid() {
111
- var _gridRef$current2;
112
- return (_gridRef$current2 = gridRef.current) === null || _gridRef$current2 === void 0 ? void 0 : _gridRef$current2.resetAfterIndices({
107
+ var _gridRef$current3;
108
+ return (_gridRef$current3 = gridRef.current) === null || _gridRef$current3 === void 0 ? void 0 : _gridRef$current3.resetAfterIndices({
113
109
  columnIndex: 0,
114
110
  shouldForceUpdate: true
115
111
  });
@@ -137,7 +133,7 @@ var VirtualTable = function VirtualTable(props) {
137
133
  var totalHeight = rawData.length * 54;
138
134
 
139
135
  /**
140
- * 渲染单元格
136
+ * 单元格
141
137
  */
142
138
  var Cell = function Cell(_ref3) {
143
139
  var _column$onCell;
@@ -175,39 +171,39 @@ var VirtualTable = function VirtualTable(props) {
175
171
  * 渲染固定列
176
172
  */
177
173
  fixedColumns.map(function (column, columnIndex) {
178
- var _gridRef$current3, _gridRef$current3$sta, _gridRef$current4, _gridRef$current4$sta;
179
- /**
180
- * 左边距设置为左侧列宽度之和加水平滚动距离，模拟固定效果
181
- */
182
- var left = fixedColumns.slice(0, columnIndex).reduce(function (value, column) {
183
- return value + column.width;
184
- }, 0) + ((_gridRef$current3 = gridRef.current) === null || _gridRef$current3 === void 0 ? void 0 : (_gridRef$current3$sta = _gridRef$current3.state) === null || _gridRef$current3$sta === void 0 ? void 0 : _gridRef$current3$sta.scrollLeft);
185
-
186
- /**
187
- * 水平滚动距离大于 0 时最右侧的固定列加上阴影
188
- */
189
- var boxShadow = ((_gridRef$current4 = gridRef.current) === null || _gridRef$current4 === void 0 ? void 0 : (_gridRef$current4$sta = _gridRef$current4.state) === null || _gridRef$current4$sta === void 0 ? void 0 : _gridRef$current4$sta.scrollLeft) > 0 && columnIndex === fixedColumns.length - 1 ? '4px 0px 4px #e8e8e8' : undefined;
190
- return rawData.slice(startRowIndex.current, startRowIndex.current + Math.ceil(scroll.y / 54) + 2).map(function (_, rowIndex) {
174
+ return /*#__PURE__*/React.createElement("div", {
175
+ key: columnIndex,
176
+ style: {
177
+ position: 'sticky',
178
+ left: fixedColumns.slice(0, columnIndex).reduce(function (value, column) {
179
+ return value + column.width;
180
+ }, 0),
181
+ width: column.width,
182
+ zIndex: 1
183
+ }
184
+ }, rawData.slice(startRowIndex.current, startRowIndex.current + Math.ceil(scroll.y / 54) + 2).map(function (_, rowIndex) {
185
+ var _gridRef$current4;
191
186
  return /*#__PURE__*/React.createElement(Cell, {
192
- key: "".concat(columnIndex, ",").concat(rowIndex),
187
+ key: rowIndex,
193
188
  columnIndex: columnIndex,
194
189
  rowIndex: rowIndex + startRowIndex.current,
195
190
  style: {
196
191
  position: 'absolute',
197
192
  top: (rowIndex + startRowIndex.current) * 54,
198
- left: left,
199
- width: column.width,
193
+ width: '100%',
200
194
  height: 54,
201
- boxShadow: boxShadow,
202
- transition: 'box-shadow 0.3s',
203
- zIndex: 1
195
+ /**
196
+ * 水平滚动距离大于 0 时最右侧的固定列加上阴影
197
+ */
198
+ boxShadow: ((_gridRef$current4 = gridRef.current) === null || _gridRef$current4 === void 0 ? void 0 : _gridRef$current4.state.scrollLeft) > 0 && columnIndex === fixedColumns.length - 1 ? '4px 0px 4px #f0f0f0' : undefined,
199
+ transition: 'box-shadow 0.3s'
204
200
  }
205
201
  /**
206
202
  * 传递任意数据以渲染固定列的单元格
207
203
  */,
208
204
  data: true
209
205
  });
210
- });
206
+ }));
211
207
  }),
212
208
  /**
213
209
  * 渲染其余内容
@@ -268,7 +264,7 @@ var VirtualTable = function VirtualTable(props) {
268
264
  });
269
265
  left += _props.column.width;
270
266
  }
271
- return /*#__PURE__*/React.createElement("tr", rest, children);
267
+ return /*#__PURE__*/React.createElement("tr", rest, newChildren);
272
268
  }
273
269
  },
274
270
  body: renderVirtualList
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "x-star-design",
3
- "version": "0.0.39",
3
+ "version": "0.0.41",
4
4
  "description": "A react component library developed by turingstar",
5
5
  "license": "MIT",
6
6
  "module": "dist/index.js",
/package/dist/{ali-player → aliplayer}/index.d.ts RENAMED
File without changes
/package/dist/{ali-player → aliplayer}/index.js RENAMED
File without changes