@gingkoo/pandora-explorer 0.1.7 → 0.1.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.
- package/lib/es/components/icons/index.d.ts +1 -0
- package/lib/es/components/menu/index.d.ts +1 -1
- package/lib/es/components/menu/menulist.d.ts +1 -0
- package/lib/es/components/tree/components/utils/diffUtil.d.ts +1 -0
- package/lib/es/css.d.ts +7 -7
- package/lib/es/index.js +56 -28
- package/lib/es/index.js.map +1 -1
- package/lib/es/types.d.ts +1 -0
- package/package.json +1 -1
|
@@ -4,7 +4,7 @@ interface MenuProps {
|
|
|
4
4
|
menu?: MenuItem[];
|
|
5
5
|
info?: any;
|
|
6
6
|
onChange?: (key: string, parent?: MenuItem) => any;
|
|
7
|
-
loadMenu?: (item: MenuItem) => MenuItem | MenuItem[];
|
|
7
|
+
loadMenu?: (item: MenuItem) => MenuItem | MenuItem[] | undefined;
|
|
8
8
|
store?: any;
|
|
9
9
|
}
|
|
10
10
|
export interface MenuItem {
|
package/lib/es/css.d.ts
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
export declare const flush: () => void, hydrate: (ids:
|
|
2
|
-
(template: TemplateStringsArray, ...args:
|
|
3
|
-
(...args:
|
|
1
|
+
export declare const flush: () => void, hydrate: (ids: string[]) => void, cx: (...classNames: import("@emotion/css/create-instance").ClassNamesArg[]) => string, merge: (className: string) => string, getRegisteredStyles: (registeredStyles: string[], className: string) => string, injectGlobal: {
|
|
2
|
+
(template: TemplateStringsArray, ...args: import("@emotion/css/create-instance").CSSInterpolation[]): void;
|
|
3
|
+
(...args: import("@emotion/css/create-instance").CSSInterpolation[]): void;
|
|
4
4
|
}, keyframes: {
|
|
5
|
-
(template: TemplateStringsArray, ...args:
|
|
6
|
-
(...args:
|
|
5
|
+
(template: TemplateStringsArray, ...args: import("@emotion/css/create-instance").CSSInterpolation[]): string;
|
|
6
|
+
(...args: import("@emotion/css/create-instance").CSSInterpolation[]): string;
|
|
7
7
|
}, css: {
|
|
8
|
-
(template: TemplateStringsArray, ...args:
|
|
9
|
-
(...args:
|
|
8
|
+
(template: TemplateStringsArray, ...args: import("@emotion/css/create-instance").CSSInterpolation[]): string;
|
|
9
|
+
(...args: import("@emotion/css/create-instance").CSSInterpolation[]): string;
|
|
10
10
|
}, sheet: import("@emotion/css/create-instance").CSSStyleSheet, cache: import("@emotion/css/create-instance").EmotionCache;
|
package/lib/es/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* @gingkoo/pandora-explorer v0.1.
|
|
2
|
+
* @gingkoo/pandora-explorer v0.1.8
|
|
3
3
|
*/
|
|
4
4
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
5
5
|
import cx$1 from 'classnames';
|
|
@@ -1291,6 +1291,9 @@ var css_248z$9 = "._dropdown_menu {\n background: #fff;\n min-width: 45px;\n
|
|
|
1291
1291
|
styleInject(css_248z$9);
|
|
1292
1292
|
|
|
1293
1293
|
function returnDocument(element) {
|
|
1294
|
+
if (element) {
|
|
1295
|
+
return element.ownerDocument;
|
|
1296
|
+
}
|
|
1294
1297
|
return window.document;
|
|
1295
1298
|
}
|
|
1296
1299
|
function Dropdown(props) {
|
|
@@ -1886,7 +1889,7 @@ function menuIcon(icon) {
|
|
|
1886
1889
|
suffix: icon
|
|
1887
1890
|
}, 'explorer-menu-icon');
|
|
1888
1891
|
}
|
|
1889
|
-
if (/*#__PURE__*/React__default.isValidElement(icon)) {
|
|
1892
|
+
if ( /*#__PURE__*/React__default.isValidElement(icon)) {
|
|
1890
1893
|
return jsx("span", {
|
|
1891
1894
|
className: 'explorer-menu-icon x-icon',
|
|
1892
1895
|
children: icon
|
|
@@ -1917,6 +1920,7 @@ function Menu(props) {
|
|
|
1917
1920
|
} else if (loadMenu) {
|
|
1918
1921
|
data = loadMenu(v);
|
|
1919
1922
|
}
|
|
1923
|
+
if (!data) return;
|
|
1920
1924
|
if (Array.isArray(data)) {
|
|
1921
1925
|
_menu = [..._menu, ...data];
|
|
1922
1926
|
} else {
|
|
@@ -2032,6 +2036,7 @@ function Menu(props) {
|
|
|
2032
2036
|
}, index);
|
|
2033
2037
|
});
|
|
2034
2038
|
}, [data]);
|
|
2039
|
+
if (!data?.length) return jsx(Fragment, {});
|
|
2035
2040
|
return jsx("div", {
|
|
2036
2041
|
className: 'explorer-menu',
|
|
2037
2042
|
children: menus
|
|
@@ -3634,6 +3639,7 @@ const MotionTreeNode = ({
|
|
|
3634
3639
|
});
|
|
3635
3640
|
};
|
|
3636
3641
|
MotionTreeNode.displayName = 'MotionTreeNode';
|
|
3642
|
+
//@ts-ignore
|
|
3637
3643
|
const RefMotionTreeNode = /*#__PURE__*/React.forwardRef(MotionTreeNode);
|
|
3638
3644
|
|
|
3639
3645
|
function findExpandedKeys(prev = [], next = []) {
|
|
@@ -4346,7 +4352,9 @@ function cleanConductCheck(keys, halfKeys, levelEntities, maxLevel, syntheticGet
|
|
|
4346
4352
|
*/
|
|
4347
4353
|
function conductCheck(keyList, checked, keyEntities, getCheckDisabled) {
|
|
4348
4354
|
let syntheticGetCheckDisabled;
|
|
4349
|
-
{
|
|
4355
|
+
if (getCheckDisabled) {
|
|
4356
|
+
syntheticGetCheckDisabled = getCheckDisabled;
|
|
4357
|
+
} else {
|
|
4350
4358
|
syntheticGetCheckDisabled = isCheckDisabled;
|
|
4351
4359
|
}
|
|
4352
4360
|
// We only handle exist keys
|
|
@@ -4995,6 +5003,7 @@ let Tree$1 = class Tree extends React.Component {
|
|
|
4995
5003
|
checkedKeys,
|
|
4996
5004
|
halfCheckedKeys
|
|
4997
5005
|
} = conductCheck(Array.from(keySet), {
|
|
5006
|
+
checked: false,
|
|
4998
5007
|
halfCheckedKeys
|
|
4999
5008
|
}, keyEntities));
|
|
5000
5009
|
}
|
|
@@ -5617,7 +5626,7 @@ function TableItem(props) {
|
|
|
5617
5626
|
key: props.id
|
|
5618
5627
|
});
|
|
5619
5628
|
},
|
|
5620
|
-
children: columns
|
|
5629
|
+
children: columns?.map((v, i) => {
|
|
5621
5630
|
let x = width[i] - (i ? 0 : 58 + 8) + (i ? 10 : 0);
|
|
5622
5631
|
if (i == 0 && typeof param.level === 'number') {
|
|
5623
5632
|
x = x - param.level * 16;
|
|
@@ -5749,7 +5758,7 @@ function TableItem(props) {
|
|
|
5749
5758
|
});
|
|
5750
5759
|
}
|
|
5751
5760
|
|
|
5752
|
-
var TreeItem = props => {
|
|
5761
|
+
var TreeItem = (props => {
|
|
5753
5762
|
const {
|
|
5754
5763
|
onRename,
|
|
5755
5764
|
onMenuClick,
|
|
@@ -5863,7 +5872,7 @@ var TreeItem = props => {
|
|
|
5863
5872
|
})]
|
|
5864
5873
|
})
|
|
5865
5874
|
});
|
|
5866
|
-
};
|
|
5875
|
+
});
|
|
5867
5876
|
|
|
5868
5877
|
var css_248z$6 = ".explorer-notdata {\n display: flex;\n height: 100%;\n justify-content: center;\n}\n.explorer-notdata .tree-empty {\n position: relative;\n top: 100px;\n width: 200px;\n height: 135px;\n text-align: center;\n}\n.explorer-notdata .tree-empty .empty-svg {\n width: 200px;\n height: 115px;\n overflow: hidden;\n}\n.explorer-notdata .tree-empty > span {\n display: inline-block;\n background: rgba(160, 160, 160, 0.1);\n padding: 3px 10px;\n border-radius: 10px;\n font-size: 0.9em;\n margin-top: 10px;\n line-height: 1;\n color: #999;\n user-select: none;\n}\n";
|
|
5869
5878
|
styleInject(css_248z$6);
|
|
@@ -5930,6 +5939,7 @@ const motion = {
|
|
|
5930
5939
|
height: 0
|
|
5931
5940
|
})
|
|
5932
5941
|
};
|
|
5942
|
+
//@ts-ignore
|
|
5933
5943
|
var Tree = /*#__PURE__*/forwardRef((props, _ref) => {
|
|
5934
5944
|
const {
|
|
5935
5945
|
type = 'table',
|
|
@@ -6075,7 +6085,7 @@ var Tree = /*#__PURE__*/forwardRef((props, _ref) => {
|
|
|
6075
6085
|
//树s的懒加载
|
|
6076
6086
|
const getNewTreeData = (treeData, curKey, child, level) => {
|
|
6077
6087
|
const loop = (data, levelkey) => {
|
|
6078
|
-
if (curKey.length - 3 > level * 2) return;
|
|
6088
|
+
if (level < 1 || curKey.length - 3 > level * 2) return;
|
|
6079
6089
|
data.forEach((item, index) => {
|
|
6080
6090
|
let l = levelkey + `-${index}`;
|
|
6081
6091
|
if (curKey.indexOf(l) === 0) {
|
|
@@ -8017,7 +8027,10 @@ const SelectBox = props => {
|
|
|
8017
8027
|
menu: menudata,
|
|
8018
8028
|
info: store.curInfo,
|
|
8019
8029
|
loadMenu: v => {
|
|
8020
|
-
let menu =
|
|
8030
|
+
let menu = v;
|
|
8031
|
+
if (typeof loadMenu === 'function') {
|
|
8032
|
+
menu = loadMenu?.(menu);
|
|
8033
|
+
}
|
|
8021
8034
|
if (menu?.key == 'rename') return undefined;
|
|
8022
8035
|
if (menu?.key == 'copy') return undefined;
|
|
8023
8036
|
return menu;
|
|
@@ -8847,8 +8860,8 @@ const Layout$1 = props => {
|
|
|
8847
8860
|
}
|
|
8848
8861
|
function _onDblclick(key, info) {
|
|
8849
8862
|
if (info.type == 'folder') {
|
|
8850
|
-
if (!isNavtab) return;
|
|
8851
|
-
if (Array.isArray(info?.children) &&
|
|
8863
|
+
if (store?.menutype !== 'tile' && !isNavtab) return;
|
|
8864
|
+
if (Array.isArray(info?.children) && info?.children?.length) {
|
|
8852
8865
|
store.setCurInfo(info);
|
|
8853
8866
|
store.setCurList(info?.children);
|
|
8854
8867
|
} else {
|
|
@@ -9530,8 +9543,8 @@ const Explorer = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9530
9543
|
const [menutype, setMenutype] = useState('tile');
|
|
9531
9544
|
const [infoshow, setInfoShow] = useState(false);
|
|
9532
9545
|
const [loading, setLoading] = useState(ApiStatusEnum.READY);
|
|
9533
|
-
|
|
9534
|
-
|
|
9546
|
+
useState(100);
|
|
9547
|
+
useState(1);
|
|
9535
9548
|
const [totalNum, setTotalNum] = useState(0);
|
|
9536
9549
|
const [shift, setShift] = useState(false);
|
|
9537
9550
|
const [control, setControl] = useState(false);
|
|
@@ -9652,13 +9665,6 @@ const Explorer = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9652
9665
|
boxMenu.current = null;
|
|
9653
9666
|
menu.current = null;
|
|
9654
9667
|
};
|
|
9655
|
-
useEffect(() => {
|
|
9656
|
-
if (!isNavtab) return;
|
|
9657
|
-
if (!curInfo) {
|
|
9658
|
-
setCurList(data?.[0]?.children || []);
|
|
9659
|
-
setCurInfo(data?.[0] || null);
|
|
9660
|
-
}
|
|
9661
|
-
}, [data, isNavtab]);
|
|
9662
9668
|
useEffect(() => {
|
|
9663
9669
|
/**
|
|
9664
9670
|
* 分栏的 mapping 因为结构不同 所以在 columns 执行
|
|
@@ -9689,6 +9695,20 @@ const Explorer = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9689
9695
|
let map = addLevel(curlist, param, '');
|
|
9690
9696
|
setDataMap(map);
|
|
9691
9697
|
}, [curlist, curSelectFile, curInfo, menutype]);
|
|
9698
|
+
//默认选中 处理默认选中效果 这里指处理 data
|
|
9699
|
+
useEffect(() => {
|
|
9700
|
+
if (isNavtab) {
|
|
9701
|
+
if (!curlist?.length) {
|
|
9702
|
+
setCurList(data || []);
|
|
9703
|
+
}
|
|
9704
|
+
} else {
|
|
9705
|
+
if (!curInfo) {
|
|
9706
|
+
setCurInfo(data?.[0] || null);
|
|
9707
|
+
setCurList(data?.[0]?.children || []);
|
|
9708
|
+
}
|
|
9709
|
+
}
|
|
9710
|
+
//关闭导航时
|
|
9711
|
+
}, [data, isNavtab]);
|
|
9692
9712
|
//切换当前 文件目录时 需要清空的内容
|
|
9693
9713
|
useEffect(() => {
|
|
9694
9714
|
if (!curInfo?.key) return;
|
|
@@ -9697,14 +9717,6 @@ const Explorer = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9697
9717
|
setCurSelect(null);
|
|
9698
9718
|
props?.onCheck?.([]);
|
|
9699
9719
|
}, [curInfo?.key]);
|
|
9700
|
-
useEffect(() => {
|
|
9701
|
-
if (isNavtab) return;
|
|
9702
|
-
if (!curlist?.length) {
|
|
9703
|
-
if (Array.isArray(data)) {
|
|
9704
|
-
setCurList(data);
|
|
9705
|
-
}
|
|
9706
|
-
}
|
|
9707
|
-
}, [curlist, isNavtab, data]);
|
|
9708
9720
|
useEffect(() => {
|
|
9709
9721
|
onChangeCurMap?.(dataMap);
|
|
9710
9722
|
}, [dataMap]);
|
|
@@ -9800,19 +9812,35 @@ const Explorer = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
9800
9812
|
item.children = arr;
|
|
9801
9813
|
return item;
|
|
9802
9814
|
};
|
|
9815
|
+
const updateinfo = (item, params) => {
|
|
9816
|
+
return {
|
|
9817
|
+
...item,
|
|
9818
|
+
...params
|
|
9819
|
+
};
|
|
9820
|
+
};
|
|
9821
|
+
const delNode = (arr, index) => {
|
|
9822
|
+
arr.splice(index, 1);
|
|
9823
|
+
return arr;
|
|
9824
|
+
};
|
|
9803
9825
|
const filterData = (data, key) => {
|
|
9804
9826
|
let arr = data;
|
|
9805
9827
|
let i = 0;
|
|
9828
|
+
let del_index = null;
|
|
9806
9829
|
while (i < arr.length) {
|
|
9807
9830
|
let item = arr[i];
|
|
9808
9831
|
if (key == item.key) {
|
|
9809
|
-
item = addNode(item, params);
|
|
9832
|
+
if (type == 'add') item = addNode(item, params);
|
|
9833
|
+
if (type == 'update') item = updateinfo(item, params);
|
|
9834
|
+
if (type == 'del') del_index = i;
|
|
9810
9835
|
}
|
|
9811
9836
|
if (Array.isArray(item.children)) {
|
|
9812
9837
|
item.children = filterData(item.children, key);
|
|
9813
9838
|
}
|
|
9814
9839
|
i++;
|
|
9815
9840
|
}
|
|
9841
|
+
if (type == 'del' && typeof del_index == 'number') {
|
|
9842
|
+
arr = delNode(arr, del_index);
|
|
9843
|
+
}
|
|
9816
9844
|
return arr || [];
|
|
9817
9845
|
};
|
|
9818
9846
|
let datas = filterData(cloneDeep(data) || [], key);
|