@king-design/react 2.0.7 → 2.0.9
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.
- package/__tests__/__snapshots__/React Demos.md +33 -33
- package/__tests__/components/drawer.spec.tsx +66 -0
- package/__tests__/components/dropdown.spec.tsx +59 -1
- package/__tests__/components/menu.spec.tsx +58 -0
- package/__tests__/components/{form.spec.tsx → tooltip.spec.tsx} +1 -1
- package/components/datepicker/index.spec.js +28 -22
- package/components/dialog/useEscClosable.js +9 -3
- package/components/dropdown/useKeyboard.js +2 -2
- package/components/portal.d.ts +1 -0
- package/components/portal.js +11 -11
- package/components/table/styles.js +5 -1
- package/components/table/useFixedColumns.d.ts +1 -1
- package/components/table/useFixedColumns.js +3 -2
- package/index.d.ts +2 -2
- package/index.js +2 -2
- package/package.json +2 -2
- package/yarn-error.log +37 -40
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
import React, {createRef} from 'react';
|
|
2
|
+
import * as ReactDOM from 'react-dom';
|
|
3
|
+
import {Drawer, Card, Button} from '../../';
|
|
4
|
+
import {Component} from 'intact-react';
|
|
5
|
+
import {getElement, wait, dispatchEvent} from '../../../../test/utils';
|
|
6
|
+
|
|
7
|
+
describe('Drawer', () => {
|
|
8
|
+
it('should render react element correctly', async () => {
|
|
9
|
+
const container = document.createElement('div');
|
|
10
|
+
document.body.appendChild(container);
|
|
11
|
+
|
|
12
|
+
class Test extends Component {
|
|
13
|
+
static template = `<div ref="a">test</div>`;
|
|
14
|
+
mounted() {
|
|
15
|
+
expect(document.body.contains(this.refs.a));
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
ReactDOM.render(
|
|
20
|
+
<Card>
|
|
21
|
+
<Drawer>
|
|
22
|
+
<div><Test /></div>
|
|
23
|
+
</Drawer>
|
|
24
|
+
</Card>,
|
|
25
|
+
container
|
|
26
|
+
);
|
|
27
|
+
|
|
28
|
+
ReactDOM.unmountComponentAtNode(container);
|
|
29
|
+
document.body.removeChild(container);
|
|
30
|
+
});
|
|
31
|
+
|
|
32
|
+
it('should handle event correctly', async () => {
|
|
33
|
+
const container = document.createElement('div');
|
|
34
|
+
document.body.appendChild(container);
|
|
35
|
+
|
|
36
|
+
const click1 = sinon.spy(() => console.log(1));
|
|
37
|
+
const click2 = sinon.spy(() => console.log(2));
|
|
38
|
+
|
|
39
|
+
ReactDOM.render(
|
|
40
|
+
<div>
|
|
41
|
+
<Drawer value={true} title="1">
|
|
42
|
+
<div className="click" onClick={click1}>click</div>
|
|
43
|
+
</Drawer>
|
|
44
|
+
<Drawer value={true} placement="left" title="2">
|
|
45
|
+
<Card>
|
|
46
|
+
<div className="click" onClick={click2}>click</div>
|
|
47
|
+
</Card>
|
|
48
|
+
</Drawer>
|
|
49
|
+
</div>,
|
|
50
|
+
container
|
|
51
|
+
);
|
|
52
|
+
|
|
53
|
+
const [element1, element2] = document.querySelectorAll<HTMLElement>('.click');
|
|
54
|
+
|
|
55
|
+
dispatchEvent(element1, 'click');
|
|
56
|
+
await wait();
|
|
57
|
+
expect(click1.callCount).to.eql(1);
|
|
58
|
+
|
|
59
|
+
dispatchEvent(element2, 'click');
|
|
60
|
+
await wait();
|
|
61
|
+
expect(click2.callCount).to.eql(1);
|
|
62
|
+
|
|
63
|
+
ReactDOM.unmountComponentAtNode(container);
|
|
64
|
+
document.body.removeChild(container);
|
|
65
|
+
});
|
|
66
|
+
});
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import React, {createRef} from 'react';
|
|
2
2
|
import * as ReactDOM from 'react-dom';
|
|
3
|
-
import {Dropdown, DropdownMenu, DropdownItem} from '../../';
|
|
3
|
+
import {Dropdown, DropdownMenu, DropdownItem, Tree, Dialog, Layout} from '../../';
|
|
4
4
|
import {getElement, wait} from '../../../../test/utils';
|
|
5
|
+
import {Component} from 'intact-react';
|
|
5
6
|
|
|
6
7
|
describe('Dropdown', () => {
|
|
7
8
|
it('should save original events', async () => {
|
|
@@ -32,4 +33,61 @@ describe('Dropdown', () => {
|
|
|
32
33
|
ReactDOM.unmountComponentAtNode(container);
|
|
33
34
|
document.body.removeChild(container);
|
|
34
35
|
});
|
|
36
|
+
|
|
37
|
+
it('reproduce #764', async () => {
|
|
38
|
+
const mounted = sinon.spy(() => console.log('mounted'));
|
|
39
|
+
const updated = sinon.spy(() => console.log('updated'));
|
|
40
|
+
class Demo extends Component<{title: string}> {
|
|
41
|
+
static template = `<div>demo {this.get('title')}</div>`;
|
|
42
|
+
|
|
43
|
+
mounted() {
|
|
44
|
+
mounted();
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
updated() {
|
|
48
|
+
updated();
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
const FooDialog: React.FC = () => {
|
|
52
|
+
const [title, setTitle] = React.useState({title: '0'});
|
|
53
|
+
React.useEffect(() => {
|
|
54
|
+
setTitle({title: '1'});
|
|
55
|
+
}, []);
|
|
56
|
+
|
|
57
|
+
return <Dialog title={title.title} value={true}>
|
|
58
|
+
<div><Demo title={title.title} /></div>
|
|
59
|
+
</Dialog>
|
|
60
|
+
};
|
|
61
|
+
const Foo: React.FC<{data: any}> = ({data}) => {
|
|
62
|
+
return <div>
|
|
63
|
+
<FooDialog />
|
|
64
|
+
</div>
|
|
65
|
+
};
|
|
66
|
+
|
|
67
|
+
let set: any;
|
|
68
|
+
const Test: React.FC = () => {
|
|
69
|
+
const [isFoo, setIsFoo] = React.useState(false);
|
|
70
|
+
const [data, setData] = React.useState<any>([{label: 1, key: 1}]);
|
|
71
|
+
set = setIsFoo;
|
|
72
|
+
|
|
73
|
+
return <Layout>
|
|
74
|
+
<div onClick={() => setIsFoo(!isFoo)}>toggle</div>
|
|
75
|
+
{isFoo ? <Foo key="foo" data={data} /> : <div>test</div>}
|
|
76
|
+
</Layout>
|
|
77
|
+
};
|
|
78
|
+
|
|
79
|
+
const container = document.createElement('div');
|
|
80
|
+
document.body.appendChild(container);
|
|
81
|
+
ReactDOM.render(<Test />, container);
|
|
82
|
+
|
|
83
|
+
set(true);
|
|
84
|
+
|
|
85
|
+
await wait(0)
|
|
86
|
+
|
|
87
|
+
expect(getElement('.k-dialog')).to.be.exist;
|
|
88
|
+
expect(mounted.calledBefore(updated)).to.be.true;
|
|
89
|
+
|
|
90
|
+
ReactDOM.unmountComponentAtNode(container);
|
|
91
|
+
document.body.removeChild(container);
|
|
92
|
+
});
|
|
35
93
|
});
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
import React, {createRef, useState, useEffect} from 'react';
|
|
2
|
+
import * as ReactDOM from 'react-dom';
|
|
3
|
+
import {Menu, MenuItem, Layout, Aside} from '../../';
|
|
4
|
+
import {getElement, wait, dispatchEvent} from '../../../../test/utils';
|
|
5
|
+
|
|
6
|
+
describe('Menu', () => {
|
|
7
|
+
it('when we collapse menu, all dropdown menus should be hidden', async () => {
|
|
8
|
+
const container = document.createElement('div');
|
|
9
|
+
document.body.appendChild(container);
|
|
10
|
+
|
|
11
|
+
const AsideMenu = ({collapse}: {collapse: boolean}) => {
|
|
12
|
+
const [selectedKey, setSelectedKey] = useState('');
|
|
13
|
+
|
|
14
|
+
return <Menu collapse={collapse} selectedKey={selectedKey}>
|
|
15
|
+
<MenuItem key="1">
|
|
16
|
+
option 1
|
|
17
|
+
<Menu>
|
|
18
|
+
<MenuItem key="1-1"><span>option 1-1</span></MenuItem>
|
|
19
|
+
</Menu>
|
|
20
|
+
</MenuItem>
|
|
21
|
+
<MenuItem key="2">
|
|
22
|
+
option 2
|
|
23
|
+
<Menu>
|
|
24
|
+
<MenuItem key="2-1"><span>option 2-1</span></MenuItem>
|
|
25
|
+
</Menu>
|
|
26
|
+
</MenuItem>
|
|
27
|
+
<MenuItem key="3">
|
|
28
|
+
option 2
|
|
29
|
+
<Menu>
|
|
30
|
+
<MenuItem key="2-1"><span>option 2-1</span></MenuItem>
|
|
31
|
+
<MenuItem key="2-2"><span>option 2-1</span></MenuItem>
|
|
32
|
+
</Menu>
|
|
33
|
+
</MenuItem>
|
|
34
|
+
</Menu>
|
|
35
|
+
};
|
|
36
|
+
|
|
37
|
+
let setCollapse: any;
|
|
38
|
+
const Test = () => {
|
|
39
|
+
const [collapse, _setCollapse] = useState(false);
|
|
40
|
+
setCollapse = _setCollapse;
|
|
41
|
+
|
|
42
|
+
return <>
|
|
43
|
+
<div onClick={() => _setCollapse(!collapse)}>click</div>
|
|
44
|
+
<AsideMenu collapse={collapse} />
|
|
45
|
+
</>
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
ReactDOM.render(<Test />, container);
|
|
49
|
+
|
|
50
|
+
setCollapse!(true);
|
|
51
|
+
|
|
52
|
+
await wait();
|
|
53
|
+
expect(getElement('.k-dropdown-menu.k-menu')).to.be.not.exist;
|
|
54
|
+
|
|
55
|
+
ReactDOM.unmountComponentAtNode(container);
|
|
56
|
+
document.body.removeChild(container);
|
|
57
|
+
});
|
|
58
|
+
});
|
|
@@ -3,7 +3,7 @@ import * as ReactDOM from 'react-dom';
|
|
|
3
3
|
import { Tooltip, Form, FormItem } from '../../';
|
|
4
4
|
import {getElement, wait, dispatchEvent} from '../../../../test/utils';
|
|
5
5
|
|
|
6
|
-
describe('
|
|
6
|
+
describe('Tooltip', () => {
|
|
7
7
|
it('should show Tooltip in append slot', async () => {
|
|
8
8
|
const click = sinon.spy(() => console.log(1));
|
|
9
9
|
const container = document.createElement('div');
|
|
@@ -234,7 +234,7 @@ describe('Datepicker', function () {
|
|
|
234
234
|
}, _callee6);
|
|
235
235
|
})));
|
|
236
236
|
it('range date', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee7() {
|
|
237
|
-
var _mount6, instance, element, select, content, _content$querySelecto, panel1, panel2, _panel1$querySelector, nextMonth, nextYear, _content$querySelecto2, monthValues1, monthValues2, _panel2$querySelector, prevYear;
|
|
237
|
+
var _mount6, instance, element, select, content, _content$querySelecto, panel1, panel2, _panel1$querySelector, nextMonth, nextYear, _content$querySelecto2, monthValues1, monthValues2, monthStart, yearStart, monthEnd, yearEnd, _panel2$querySelector, prevYear, firstDecadeStart, secondDecadeStart;
|
|
238
238
|
|
|
239
239
|
return _regeneratorRuntime.wrap(function _callee7$(_context7) {
|
|
240
240
|
while (1) {
|
|
@@ -252,45 +252,51 @@ describe('Datepicker', function () {
|
|
|
252
252
|
_panel1$querySelector = panel1.querySelectorAll('.k-next'), nextMonth = _panel1$querySelector[0], nextYear = _panel1$querySelector[1];
|
|
253
253
|
_content$querySelecto2 = content.querySelectorAll('.k-month-values'), monthValues1 = _content$querySelecto2[0], monthValues2 = _content$querySelecto2[1];
|
|
254
254
|
nextMonth.click();
|
|
255
|
-
|
|
255
|
+
monthStart = (month + 1) % 12 + 1;
|
|
256
|
+
yearStart = year + Math.floor((month + 1) / 12);
|
|
257
|
+
monthEnd = (month + 2) % 12 + 1;
|
|
258
|
+
yearEnd = year + Math.floor((month + 2) / 12);
|
|
259
|
+
_context7.next = 16;
|
|
256
260
|
return wait();
|
|
257
261
|
|
|
258
|
-
case
|
|
259
|
-
expect(monthValues1.textContent).to.eql(
|
|
260
|
-
expect(monthValues2.textContent).to.eql(
|
|
262
|
+
case 16:
|
|
263
|
+
expect(monthValues1.textContent).to.eql(yearStart + "\u5E74" + monthStart + "\u6708");
|
|
264
|
+
expect(monthValues2.textContent).to.eql(yearEnd + "\u5E74" + monthEnd + "\u6708");
|
|
261
265
|
nextYear.click();
|
|
262
|
-
_context7.next =
|
|
266
|
+
_context7.next = 21;
|
|
263
267
|
return wait();
|
|
264
268
|
|
|
265
|
-
case
|
|
266
|
-
expect(monthValues1.textContent).to.eql(
|
|
267
|
-
expect(monthValues2.textContent).to.eql(
|
|
269
|
+
case 21:
|
|
270
|
+
expect(monthValues1.textContent).to.eql(yearStart + 1 + "\u5E74" + monthStart + "\u6708");
|
|
271
|
+
expect(monthValues2.textContent).to.eql(yearEnd + 1 + "\u5E74" + monthEnd + "\u6708");
|
|
268
272
|
_panel2$querySelector = panel2.querySelectorAll('.k-prev'), prevYear = _panel2$querySelector[0];
|
|
269
273
|
prevYear.click();
|
|
270
|
-
_context7.next =
|
|
274
|
+
_context7.next = 27;
|
|
271
275
|
return wait();
|
|
272
276
|
|
|
273
|
-
case
|
|
274
|
-
expect(monthValues1.textContent).to.eql(
|
|
275
|
-
expect(monthValues2.textContent).to.eql(
|
|
277
|
+
case 27:
|
|
278
|
+
expect(monthValues1.textContent).to.eql(yearStart + "\u5E74" + monthStart + "\u6708");
|
|
279
|
+
expect(monthValues2.textContent).to.eql(yearEnd + "\u5E74" + monthEnd + "\u6708"); // year panel
|
|
276
280
|
|
|
277
281
|
dispatchEvent(monthValues1.firstElementChild, 'click');
|
|
278
282
|
dispatchEvent(monthValues2.firstElementChild, 'click');
|
|
279
|
-
_context7.next =
|
|
283
|
+
_context7.next = 33;
|
|
280
284
|
return wait();
|
|
281
285
|
|
|
282
|
-
case
|
|
283
|
-
|
|
284
|
-
|
|
286
|
+
case 33:
|
|
287
|
+
firstDecadeStart = Math.floor(yearStart / 10) * 10;
|
|
288
|
+
secondDecadeStart = Math.floor(yearEnd / 10) * 10;
|
|
289
|
+
expect(monthValues1.textContent).to.eql(firstDecadeStart + "\u5E74 - " + (firstDecadeStart + 9) + "\u5E74");
|
|
290
|
+
expect(monthValues1.textContent).to.eql(secondDecadeStart + "\u5E74 - " + (secondDecadeStart + 9) + "\u5E74");
|
|
285
291
|
nextYear.click();
|
|
286
|
-
_context7.next =
|
|
292
|
+
_context7.next = 40;
|
|
287
293
|
return wait();
|
|
288
294
|
|
|
289
|
-
case
|
|
290
|
-
expect(monthValues1.textContent).to.eql(
|
|
291
|
-
expect(monthValues1.textContent).to.eql(
|
|
295
|
+
case 40:
|
|
296
|
+
expect(monthValues1.textContent).to.eql(firstDecadeStart + 10 + "\u5E74 - " + (secondDecadeStart + 19) + "\u5E74");
|
|
297
|
+
expect(monthValues1.textContent).to.eql(secondDecadeStart + 10 + "\u5E74 - " + (secondDecadeStart + 19) + "\u5E74");
|
|
292
298
|
|
|
293
|
-
case
|
|
299
|
+
case 42:
|
|
294
300
|
case "end":
|
|
295
301
|
return _context7.stop();
|
|
296
302
|
}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import _spliceInstanceProperty from "@babel/runtime-corejs3/core-js/instance/splice";
|
|
1
2
|
import { useInstance, onUnmounted } from 'intact-react';
|
|
2
3
|
import { SHOW, HIDE } from './constants'; // only close the top dialog when press ESC
|
|
3
4
|
|
|
@@ -22,14 +23,19 @@ export function useEscClosable() {
|
|
|
22
23
|
});
|
|
23
24
|
|
|
24
25
|
function onHide() {
|
|
25
|
-
|
|
26
|
+
// the order is uncertain in different frameworks
|
|
27
|
+
var index = dialogs.indexOf(instance); // const dialog = dialogs.pop();
|
|
28
|
+
// const dialog = dialogs.shift();
|
|
26
29
|
|
|
27
30
|
if (process.env.NODE_ENV !== 'production') {
|
|
28
|
-
if (dialog !== instance) {
|
|
29
|
-
|
|
31
|
+
// if (dialog !== instance) {
|
|
32
|
+
if (index === -1) {
|
|
33
|
+
throw new Error('The dialog has handled hide callback. Maybe it is a bug of KPC');
|
|
30
34
|
}
|
|
31
35
|
}
|
|
32
36
|
|
|
37
|
+
_spliceInstanceProperty(dialogs).call(dialogs, 0, index);
|
|
38
|
+
|
|
33
39
|
if (!dialogs.length) {
|
|
34
40
|
document.removeEventListener('keydown', escClose);
|
|
35
41
|
}
|
|
@@ -123,8 +123,8 @@ export function useMenuKeyboard() {
|
|
|
123
123
|
reset: reset,
|
|
124
124
|
focus: function focus(item) {
|
|
125
125
|
// reset();
|
|
126
|
-
var index = items.indexOf(item);
|
|
127
|
-
|
|
126
|
+
var index = items.indexOf(item); // if (index === -1) debugger
|
|
127
|
+
|
|
128
128
|
focusIndex = index;
|
|
129
129
|
focusItem(item);
|
|
130
130
|
}
|
package/components/portal.d.ts
CHANGED
|
@@ -10,6 +10,7 @@ export declare class Portal<T extends PortalProps = PortalProps> extends Compone
|
|
|
10
10
|
private dialog;
|
|
11
11
|
mountedQueue?: Function[];
|
|
12
12
|
mountedDone?: boolean;
|
|
13
|
+
$isPortal: boolean;
|
|
13
14
|
$render(lastVNode: VNodeComponentClass<this> | null, nextVNode: VNodeComponentClass<this>, parentDom: Element, anchor: IntactDom | null, mountedQueue: Function[]): void;
|
|
14
15
|
$update(lastVNode: VNodeComponentClass<this>, nextVNode: VNodeComponentClass<this>, parentDom: Element, anchor: IntactDom | null, mountedQueue: Function[], force: boolean): void;
|
|
15
16
|
$unmount(vNode: VNodeComponentClass<this>, nextVNode: VNodeComponentClass<this> | null): void;
|
package/components/portal.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _inheritsLoose from "@babel/runtime-corejs3/helpers/inheritsLoose";
|
|
2
2
|
import _concatInstanceProperty from "@babel/runtime-corejs3/core-js/instance/concat";
|
|
3
|
-
import { Component, createCommentVNode, createTextVNode, mount, patch, remove, inject
|
|
3
|
+
import { Component, createCommentVNode, createTextVNode, mount, patch, remove, inject } from 'intact-react';
|
|
4
4
|
import { isString } from 'intact-shared';
|
|
5
5
|
import { DIALOG } from './dialog/constants';
|
|
6
6
|
var typeDefs = {
|
|
@@ -23,6 +23,7 @@ export var Portal = /*#__PURE__*/function (_Component) {
|
|
|
23
23
|
_this.dialog = inject(DIALOG, null);
|
|
24
24
|
_this.mountedQueue = void 0;
|
|
25
25
|
_this.mountedDone = void 0;
|
|
26
|
+
_this.$isPortal = true;
|
|
26
27
|
return _this;
|
|
27
28
|
}
|
|
28
29
|
|
|
@@ -39,21 +40,20 @@ export var Portal = /*#__PURE__*/function (_Component) {
|
|
|
39
40
|
_proto.$render = function $render(lastVNode, nextVNode, parentDom, anchor, mountedQueue) {
|
|
40
41
|
var _this2 = this;
|
|
41
42
|
|
|
43
|
+
/**
|
|
44
|
+
* In React, we cannot render real elements in mountedQueue.
|
|
45
|
+
* Because the rendering time of react element is uncontrollable
|
|
46
|
+
*/
|
|
47
|
+
var nextProps = nextVNode.props;
|
|
48
|
+
var fakeContainer = document.createDocumentFragment();
|
|
42
49
|
mountedQueue.push(function () {
|
|
43
|
-
var nextProps = nextVNode.props;
|
|
44
50
|
var parentDom = _this2.$lastInput.dom.parentElement;
|
|
45
|
-
/**
|
|
46
|
-
* initialize a new mountedQueue to place the callbacks of sub-components to it,
|
|
47
|
-
* so that we can call them before the sibling components of the Portal
|
|
48
|
-
*/
|
|
49
|
-
|
|
50
|
-
var mountedQueue = [];
|
|
51
51
|
|
|
52
52
|
_this2.initContainer(nextProps.container, parentDom, anchor);
|
|
53
53
|
|
|
54
|
-
|
|
55
|
-
callAll(mountedQueue);
|
|
54
|
+
_this2.container.appendChild(fakeContainer);
|
|
56
55
|
});
|
|
56
|
+
mount(nextProps.children, fakeContainer, this, this.$SVG, null, mountedQueue);
|
|
57
57
|
|
|
58
58
|
_Component.prototype.$render.call(this, lastVNode, nextVNode, parentDom, anchor, mountedQueue);
|
|
59
59
|
};
|
|
@@ -99,7 +99,7 @@ export var Portal = /*#__PURE__*/function (_Component) {
|
|
|
99
99
|
// find the closest dialog if exists
|
|
100
100
|
var tmp;
|
|
101
101
|
|
|
102
|
-
if ((tmp = this.dialog) && (tmp = tmp.dialogRef.value)) {
|
|
102
|
+
if ((tmp = this.dialog) && tmp !== this.$senior && (tmp = tmp.dialogRef.value)) {
|
|
103
103
|
this.container = tmp;
|
|
104
104
|
} else {
|
|
105
105
|
this.container = document.body;
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import _sortInstanceProperty from "@babel/runtime-corejs3/core-js/instance/sort";
|
|
2
|
+
import _mapInstanceProperty from "@babel/runtime-corejs3/core-js/instance/map";
|
|
2
3
|
import { css } from '@emotion/css';
|
|
3
4
|
import { theme, setDefault } from '../../styles/theme';
|
|
4
5
|
import { deepDefaults, palette } from '../../styles/utils';
|
|
@@ -75,6 +76,7 @@ var defaults = {
|
|
|
75
76
|
resizeWidth: "5px",
|
|
76
77
|
draggingOpacity: ".4"
|
|
77
78
|
};
|
|
79
|
+
var aligns = ['left', 'right', 'center'];
|
|
78
80
|
var table;
|
|
79
81
|
setDefault(function () {
|
|
80
82
|
table = deepDefaults(theme, {
|
|
@@ -82,7 +84,9 @@ setDefault(function () {
|
|
|
82
84
|
}).table;
|
|
83
85
|
});
|
|
84
86
|
export function makeStyles() {
|
|
85
|
-
return /*#__PURE__*/css("font-size:", table.fontSize, ";color:", table.color, ";border-top:", table.border, ";position:relative;z-index:0;.k-table-wrapper{border-bottom:", table.border, ";overflow:auto;}table{width:100%;border-spacing:0;table-layout:fixed;td,th{transition:all ", table.transition, ";}}thead{text-align:", table.thead.textAlign, ";font-size:", table.thead.fontSize, ";font-weight:", table.thead.fontWeight, ";position:sticky;top:0;z-index:2;tr{height:", table.thead.height, ";}}th{padding:", table.thead.padding, ";position:relative;background:", table.thead.bgColor, ";border-bottom:", table.border, ";&:before{content:'';height:", table.thead.delimiterHeight, ";position:absolute;background-color:", table.thead.delimiterColor, ";width:1px;left:1px;top:50%;transform:translateY(-50%);}&:first-of-type:before{display:none;}}.k-table-title{display:inline-flex;align-items:center;max-width:100%;}.k-table-title-text{flex:1;}tbody{tr{&:hover td{background:", table.tbody.hoverBgcolor, ";}&:last-of-type td{border-bottom-color:transparent;}}}td{padding:", table.tbody.padding, ";border-bottom:", table.border, ";background:", table.bgColor, ";word-wrap:break-word;}.k-fixed-left,.k-fixed-right{position:sticky;z-index:1;&:after{content:'';display:block;transition:box-shadow ", table.transition, ";position:absolute;top:0;bottom:0px;width:10px;pointer-events:none;}}.k-fixed-left:after{right:-11px;}.k-fixed-right:after{left:-11px;}&.k-scroll-left .k-fixed-right:after{box-shadow:", table.fixRightShadow, ";}&.k-scroll-right .k-fixed-left:after{box-shadow:", table.fixLeftShadow, ";}&.k-scroll-middle{.k-fixed-left:after{box-shadow:", table.fixLeftShadow, ";}.k-fixed-right:after{box-shadow:", table.fixRightShadow, ";}}.k-fixed-right+.k-fixed-right:after{display:none;}.k-table-affix-header{position:sticky;top:0;left:0;.k-affix-wrapper{overflow:hidden;}&.k-fixed{position:relative;}}&.k-border,&.k-grid{.k-table-wrapper{border-left:", table.border, ";border-right:", table.border, ";}}&.k-grid{td:not(:last-of-type),th:not(:last-of-type){border-right:", table.border, ";}th:before{display:none;}}&.k-stripe{tr:nth-child(even):not(:hover) td{background:", table.stripeBgColor, ";}}.k-table-group{width:", table.group.width, "!important;height:", table.group.width, "!important;margin-left:", table.group.gap, ";position:relative;color:", table.group.color, ";&:hover{color:", theme.color.primary, ";}.k-icon{transition:transform ", table.transition, ";}&.k-dropdown-open .k-icon{transform:rotate(180deg);}}.k-table-check{.k-checkbox,.k-radio{position:relative;top:-1px;}}.k-column-sortable{cursor:pointer;}.k-column-sort{.k-icon{display:block;height:", _sortInstanceProperty(table).iconHeight, ";line-height:", _sortInstanceProperty(table).iconHeight, ";margin-left:", _sortInstanceProperty(table).gap, ";color:", _sortInstanceProperty(table).color, ";}&.k-asc .k-icon.k-desc,&.k-desc .k-icon.k-asc{color:", _sortInstanceProperty(table).disabledColor, ";}}.k-table-spin.k-overlay{z-index:2;}.k-table-empty{text-align:center;}tr.k-expand{td{padding:0;background:#fdfcff;}}&.k-with-expand{tr:not(.k-expand){td{border-bottom:none;}}}.k-table-expand{border-top:", table.border, ";box-sizing:content-box;}tbody tr.k-selected td{background:", table.selectedBgColor, ";}.k-table-arrow{margin-right:", table.arrow.gap, ";transition:transform ", table.transition, ";position:relative;top:-1px;}tr.k-spreaded{.k-table-arrow{transform:rotate(90deg);}}.k-table-resize{height:100%;width:", table.resizeWidth, ";position:absolute;top:0;left:-1px;cursor:ew-resize;}tr.k-dragging{opacity:", table.draggingOpacity, ";}.k-table-scrollbar{overflow-x:auto;overflow-y:hidden;}.k-table-scrollbar-inner{height:1px;}")
|
|
87
|
+
return /*#__PURE__*/css("font-size:", table.fontSize, ";color:", table.color, ";border-top:", table.border, ";position:relative;z-index:0;.k-table-wrapper{border-bottom:", table.border, ";overflow:auto;}table{width:100%;border-spacing:0;table-layout:fixed;td,th{transition:all ", table.transition, ";}}thead{text-align:", table.thead.textAlign, ";font-size:", table.thead.fontSize, ";font-weight:", table.thead.fontWeight, ";position:sticky;top:0;z-index:2;tr{height:", table.thead.height, ";}}th{padding:", table.thead.padding, ";position:relative;background:", table.thead.bgColor, ";border-bottom:", table.border, ";&:before{content:'';height:", table.thead.delimiterHeight, ";position:absolute;background-color:", table.thead.delimiterColor, ";width:1px;left:1px;top:50%;transform:translateY(-50%);}&:first-of-type:before{display:none;}}.k-table-title{display:inline-flex;align-items:center;max-width:100%;}.k-table-title-text{flex:1;}tbody{tr{&:hover td{background:", table.tbody.hoverBgcolor, ";}&:last-of-type td{border-bottom-color:transparent;}}}td{padding:", table.tbody.padding, ";border-bottom:", table.border, ";background:", table.bgColor, ";word-wrap:break-word;}.k-fixed-left,.k-fixed-right{position:sticky;z-index:1;&:after{content:'';display:block;transition:box-shadow ", table.transition, ";position:absolute;top:0;bottom:0px;width:10px;pointer-events:none;}}.k-fixed-left:after{right:-11px;}.k-fixed-right:after{left:-11px;}&.k-scroll-left .k-fixed-right:after{box-shadow:", table.fixRightShadow, ";}&.k-scroll-right .k-fixed-left:after{box-shadow:", table.fixLeftShadow, ";}&.k-scroll-middle{.k-fixed-left:after{box-shadow:", table.fixLeftShadow, ";}.k-fixed-right:after{box-shadow:", table.fixRightShadow, ";}}.k-fixed-right+.k-fixed-right:after{display:none;}.k-table-affix-header{position:sticky;top:0;left:0;.k-affix-wrapper{overflow:hidden;}&.k-fixed{position:relative;}}&.k-border,&.k-grid{.k-table-wrapper{border-left:", table.border, ";border-right:", table.border, ";}}&.k-grid{td:not(:last-of-type),th:not(:last-of-type){border-right:", table.border, ";}th:before{display:none;}}&.k-stripe{tr:nth-child(even):not(:hover) td{background:", table.stripeBgColor, ";}}.k-table-group{width:", table.group.width, "!important;height:", table.group.width, "!important;margin-left:", table.group.gap, ";position:relative;color:", table.group.color, ";&:hover{color:", theme.color.primary, ";}.k-icon{transition:transform ", table.transition, ";}&.k-dropdown-open .k-icon{transform:rotate(180deg);}}.k-table-check{.k-checkbox,.k-radio{position:relative;top:-1px;}}.k-column-sortable{cursor:pointer;}.k-column-sort{.k-icon{display:block;height:", _sortInstanceProperty(table).iconHeight, ";line-height:", _sortInstanceProperty(table).iconHeight, ";margin-left:", _sortInstanceProperty(table).gap, ";color:", _sortInstanceProperty(table).color, ";}&.k-asc .k-icon.k-desc,&.k-desc .k-icon.k-asc{color:", _sortInstanceProperty(table).disabledColor, ";}}.k-table-spin.k-overlay{z-index:2;}.k-table-empty{text-align:center;}tr.k-expand{td{padding:0;background:#fdfcff;}}&.k-with-expand{tr:not(.k-expand){td{border-bottom:none;}}}.k-table-expand{border-top:", table.border, ";box-sizing:content-box;}tbody tr.k-selected td{background:", table.selectedBgColor, ";}.k-table-arrow{margin-right:", table.arrow.gap, ";transition:transform ", table.transition, ";position:relative;top:-1px;}tr.k-spreaded{.k-table-arrow{transform:rotate(90deg);}}.k-table-resize{height:100%;width:", table.resizeWidth, ";position:absolute;top:0;left:-1px;cursor:ew-resize;}tr.k-dragging{opacity:", table.draggingOpacity, ";}.k-table-scrollbar{overflow-x:auto;overflow-y:hidden;}.k-table-scrollbar-inner{height:1px;}", _mapInstanceProperty(aligns).call(aligns, function (type) {
|
|
88
|
+
return /*#__PURE__*/css(".k-align-", type, "{text-align:", type, ";}");
|
|
89
|
+
}), ";");
|
|
86
90
|
}
|
|
87
91
|
export function makeGroupMenuStyles() {
|
|
88
92
|
return /*#__PURE__*/css("max-height:", table.group.menuMaxHeight, ";overflow:auto;.k-dropdown-item.k-active{color:", table.group.activeColor, ";}");
|
|
@@ -15,7 +15,7 @@ export declare function useFixedColumns(getColumns: () => VNodeComponentClass<Ta
|
|
|
15
15
|
getHasFixedLeft: () => boolean;
|
|
16
16
|
getOffsetMap: () => Record<Key, number>;
|
|
17
17
|
};
|
|
18
|
-
export declare function getClassAndStyleForFixed({ className, fixed }: Props<TableColumnProps>, offset: number, checkType?: TableProps['checkType']): {
|
|
18
|
+
export declare function getClassAndStyleForFixed({ className, fixed, align }: Props<TableColumnProps>, offset: number, checkType?: TableProps['checkType']): {
|
|
19
19
|
className: string;
|
|
20
20
|
style: {
|
|
21
21
|
[x: string]: string;
|
|
@@ -125,10 +125,11 @@ export function getClassAndStyleForFixed(_ref2, offset, checkType) {
|
|
|
125
125
|
var _cx, _ref3;
|
|
126
126
|
|
|
127
127
|
var className = _ref2.className,
|
|
128
|
-
fixed = _ref2.fixed
|
|
128
|
+
fixed = _ref2.fixed,
|
|
129
|
+
align = _ref2.align;
|
|
129
130
|
var extraOffset = checkType && checkType !== 'none' && fixed === 'left' ? 40 : 0;
|
|
130
131
|
return {
|
|
131
|
-
className: cx((_cx = {}, _cx[className] = !!className, _cx["k-fixed-" + fixed] = !!fixed, _cx)),
|
|
132
|
+
className: cx((_cx = {}, _cx[className] = !!className, _cx["k-fixed-" + fixed] = !!fixed, _cx["k-align-" + align] = !!align, _cx)),
|
|
132
133
|
style: fixed ? (_ref3 = {}, _ref3[fixed] = offset + extraOffset + "px", _ref3) : null
|
|
133
134
|
};
|
|
134
135
|
}
|
package/index.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* @king-design v2.0.
|
|
2
|
+
* @king-design v2.0.9
|
|
3
3
|
*
|
|
4
4
|
* Copyright (c) Kingsoft Cloud
|
|
5
5
|
* Released under the MIT License
|
|
@@ -57,7 +57,7 @@ export * from './components/tree';
|
|
|
57
57
|
export * from './components/treeSelect';
|
|
58
58
|
export * from './components/upload';
|
|
59
59
|
export * from './components/wave';
|
|
60
|
-
export declare const version = "2.0.
|
|
60
|
+
export declare const version = "2.0.9";
|
|
61
61
|
|
|
62
62
|
|
|
63
63
|
export {normalize} from 'intact-react';
|
package/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* @king-design v2.0.
|
|
2
|
+
* @king-design v2.0.9
|
|
3
3
|
*
|
|
4
4
|
* Copyright (c) Kingsoft Cloud
|
|
5
5
|
* Released under the MIT License
|
|
@@ -59,7 +59,7 @@ export * from './components/tree';
|
|
|
59
59
|
export * from './components/treeSelect';
|
|
60
60
|
export * from './components/upload';
|
|
61
61
|
export * from './components/wave';
|
|
62
|
-
export var version = '2.0.
|
|
62
|
+
export var version = '2.0.9';
|
|
63
63
|
/* generate end */
|
|
64
64
|
|
|
65
65
|
export {normalize} from 'intact-react';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@king-design/react",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.9",
|
|
4
4
|
"description": "King-Design UI components for React.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"component",
|
|
@@ -37,7 +37,7 @@
|
|
|
37
37
|
"dayjs": "^1.10.7",
|
|
38
38
|
"downloadjs": "^1.4.7",
|
|
39
39
|
"enquire.js": "^2.1.6",
|
|
40
|
-
"intact-react": "3.0.
|
|
40
|
+
"intact-react": "3.0.10",
|
|
41
41
|
"monaco-editor": "^0.26.1",
|
|
42
42
|
"mxgraphx": "^4.0.7",
|
|
43
43
|
"resize-observer-polyfill": "^1.5.1",
|
package/yarn-error.log
CHANGED
|
@@ -14,15 +14,12 @@ Platform:
|
|
|
14
14
|
darwin x64
|
|
15
15
|
|
|
16
16
|
Trace:
|
|
17
|
-
Error: https://registry.yarnpkg.com/intact-
|
|
18
|
-
at Timeout._onTimeout (/Users/javey/.node/corepack/yarn/1.22.15/lib/cli.js:141545:19)
|
|
19
|
-
at listOnTimeout (internal/timers.js:557:17)
|
|
20
|
-
at processTimers (internal/timers.js:500:7)
|
|
17
|
+
Error: https://registry.yarnpkg.com/intact/-/intact-3.0.10.tgz: ENOENT: no such file or directory, open '/Users/javey/Library/Caches/Yarn/v6/npm-intact-3.0.10-eab07b631228e2cbeb1445fe2ad9ce0fbf6d45b3-integrity/node_modules/intact/.yarn-tarball.tgz'
|
|
21
18
|
|
|
22
19
|
npm manifest:
|
|
23
20
|
{
|
|
24
21
|
"name": "@king-design/react",
|
|
25
|
-
"version": "2.0.
|
|
22
|
+
"version": "2.0.8",
|
|
26
23
|
"description": "King-Design UI components for React.",
|
|
27
24
|
"keywords": [
|
|
28
25
|
"component",
|
|
@@ -59,7 +56,7 @@ npm manifest:
|
|
|
59
56
|
"dayjs": "^1.10.7",
|
|
60
57
|
"downloadjs": "^1.4.7",
|
|
61
58
|
"enquire.js": "^2.1.6",
|
|
62
|
-
"intact-react": "
|
|
59
|
+
"intact-react": "3.0.10",
|
|
63
60
|
"monaco-editor": "^0.26.1",
|
|
64
61
|
"mxgraphx": "^4.0.7",
|
|
65
62
|
"resize-observer-polyfill": "^1.5.1",
|
|
@@ -361,29 +358,29 @@ Lockfile:
|
|
|
361
358
|
parent-module "^1.0.0"
|
|
362
359
|
resolve-from "^4.0.0"
|
|
363
360
|
|
|
364
|
-
intact-react
|
|
365
|
-
version "3.0.
|
|
366
|
-
resolved "https://registry.yarnpkg.com/intact-react/-/intact-react-3.0.
|
|
367
|
-
integrity sha512-
|
|
361
|
+
intact-react@3.0.9:
|
|
362
|
+
version "3.0.9"
|
|
363
|
+
resolved "https://registry.yarnpkg.com/intact-react/-/intact-react-3.0.9.tgz#03c01b33ea05a0d8d09341c752897569325dfe44"
|
|
364
|
+
integrity sha512-QSwmy13k7rXZz7T9qwqNtKEX2CdbPOCFJYje3WOrf9AWAG/NX6tzggLM1Br6Rf3kcuq7LrsOiW1LEcvgJrz3Rg==
|
|
368
365
|
dependencies:
|
|
369
|
-
intact "^3.0.
|
|
366
|
+
intact "^3.0.9"
|
|
370
367
|
tslib "^2.3.1"
|
|
371
368
|
|
|
372
|
-
intact-shared@^3.0.
|
|
373
|
-
version "3.0.
|
|
374
|
-
resolved "https://registry.yarnpkg.com/intact-shared/-/intact-shared-3.0.
|
|
375
|
-
integrity sha512-
|
|
369
|
+
intact-shared@^3.0.9:
|
|
370
|
+
version "3.0.9"
|
|
371
|
+
resolved "https://registry.yarnpkg.com/intact-shared/-/intact-shared-3.0.9.tgz#de7c67de2bfd5078a729d20c84182cd43610db48"
|
|
372
|
+
integrity sha512-c/T+EyJeBCIh4XGphVOK7tH3t+J4FXoknzV/gSTiZYsLZDSGA2cBRD6z6NGWGDnj/XAXPbFaFIAFKXNhCaTjNQ==
|
|
376
373
|
|
|
377
|
-
intact@^3.0.
|
|
378
|
-
version "3.0.
|
|
379
|
-
resolved "https://registry.yarnpkg.com/intact/-/intact-3.0.
|
|
380
|
-
integrity sha512-
|
|
374
|
+
intact@^3.0.9:
|
|
375
|
+
version "3.0.9"
|
|
376
|
+
resolved "https://registry.yarnpkg.com/intact/-/intact-3.0.9.tgz#a4c0b3574d97c77c62cd1a1e84d6e27742888e6f"
|
|
377
|
+
integrity sha512-liBz/xo0XAKIuXBoBs0G6yvWHGJTb43ChF4AUJzQNr4CHX5YWZPgIKGvw34UScBmYWpu3SzwvMDLs7aoVDITxg==
|
|
381
378
|
dependencies:
|
|
382
|
-
intact-shared "^3.0.
|
|
383
|
-
misstime "^3.0.
|
|
379
|
+
intact-shared "^3.0.9"
|
|
380
|
+
misstime "^3.0.9"
|
|
384
381
|
tslib "^2.2.0"
|
|
385
|
-
vdt "^3.0.
|
|
386
|
-
vdt-compiler "^3.0.
|
|
382
|
+
vdt "^3.0.9"
|
|
383
|
+
vdt-compiler "^3.0.9"
|
|
387
384
|
|
|
388
385
|
is-arrayish@^0.2.1:
|
|
389
386
|
version "0.2.1"
|
|
@@ -412,12 +409,12 @@ Lockfile:
|
|
|
412
409
|
resolved "https://registry.npmmirror.com/lines-and-columns/-/lines-and-columns-1.2.4.tgz#eca284f75d2965079309dc0ad9255abb2ebc1632"
|
|
413
410
|
integrity sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==
|
|
414
411
|
|
|
415
|
-
misstime@^3.0.
|
|
416
|
-
version "3.0.
|
|
417
|
-
resolved "https://registry.yarnpkg.com/misstime/-/misstime-3.0.
|
|
418
|
-
integrity sha512-
|
|
412
|
+
misstime@^3.0.9:
|
|
413
|
+
version "3.0.9"
|
|
414
|
+
resolved "https://registry.yarnpkg.com/misstime/-/misstime-3.0.9.tgz#0f6094109768c71c7fc4bdd47aba7e847c12f672"
|
|
415
|
+
integrity sha512-LYgnqiU2eucjimJbjM5p4VHNR27mVAl8ISbolYUHQS9J0fk2JN00MPH7H4uEbCAFmSrVVHLAJgQ+qGRj+/GNeg==
|
|
419
416
|
dependencies:
|
|
420
|
-
intact-shared "^3.0.
|
|
417
|
+
intact-shared "^3.0.9"
|
|
421
418
|
|
|
422
419
|
monaco-editor@^0.26.1:
|
|
423
420
|
version "0.26.1"
|
|
@@ -522,22 +519,22 @@ Lockfile:
|
|
|
522
519
|
resolved "https://registry.npmmirror.com/tslib/-/tslib-2.3.1.tgz#e8a335add5ceae51aa261d32a490158ef042ef01"
|
|
523
520
|
integrity sha512-77EbyPPpMz+FRFRuAFlWMtmgUWGe9UOG2Z25NqCwiIjRhOf5iKGuzSe5P2w1laq+FkRy4p+PCuVkJSGkzTEKVw==
|
|
524
521
|
|
|
525
|
-
vdt-compiler@^3.0.
|
|
526
|
-
version "3.0.
|
|
527
|
-
resolved "https://registry.yarnpkg.com/vdt-compiler/-/vdt-compiler-3.0.
|
|
528
|
-
integrity sha512-
|
|
522
|
+
vdt-compiler@^3.0.9:
|
|
523
|
+
version "3.0.9"
|
|
524
|
+
resolved "https://registry.yarnpkg.com/vdt-compiler/-/vdt-compiler-3.0.9.tgz#4d33cedd92bf622b553869480ef3f1c1e0490bea"
|
|
525
|
+
integrity sha512-pK9aQUxcpXs6fho5bJ8jrlp/jfBJPomLUtSFexK6nDgShw4yTmXErZUV51tnSSXauO4QsF75OLFdvgcH+F1/Tg==
|
|
529
526
|
dependencies:
|
|
530
|
-
intact-shared "^3.0.
|
|
531
|
-
misstime "^3.0.
|
|
527
|
+
intact-shared "^3.0.9"
|
|
528
|
+
misstime "^3.0.9"
|
|
532
529
|
tslib "^2.2.0"
|
|
533
530
|
|
|
534
|
-
vdt@^3.0.
|
|
535
|
-
version "3.0.
|
|
536
|
-
resolved "https://registry.yarnpkg.com/vdt/-/vdt-3.0.
|
|
537
|
-
integrity sha512-
|
|
531
|
+
vdt@^3.0.9:
|
|
532
|
+
version "3.0.9"
|
|
533
|
+
resolved "https://registry.yarnpkg.com/vdt/-/vdt-3.0.9.tgz#de3b3259cb2dfd7934c0bb179c6de1b3b4ac025a"
|
|
534
|
+
integrity sha512-TyKJxDaIDryxdseZW7UXN9lQMngTygFPazhQ+O2M+biH6QzP1yk7iTYH4BPKoyJGEfd3zm7z1n/ifRdMRXp7Tw==
|
|
538
535
|
dependencies:
|
|
539
|
-
intact-shared "^3.0.
|
|
540
|
-
misstime "^3.0.
|
|
536
|
+
intact-shared "^3.0.9"
|
|
537
|
+
misstime "^3.0.9"
|
|
541
538
|
tslib "^2.2.0"
|
|
542
539
|
|
|
543
540
|
yaml@^1.7.2:
|