@d-matrix/utils 1.24.0 → 1.26.0

package/dist/algorithm/tree.d.ts

@@ -20,6 +20,14 @@ export declare const findNode: <T extends Record<string, any>>(tree: T[], predic
  * @param child 子节点
  * @param indentityKey 节点唯一id字段名称
  * @param childrenKey 节点的子节点的字段名称
- * @returns
+ * @returns 父节点
  */
 export declare const findParent: <T extends Record<string, any>>(tree: T | undefined, child: T | undefined, indentityKey?: string, childrenKey?: string) => T | null;
+/**
+ * 查找节点路径
+ * @param tree
+ * @param func 符合条件的节点函数,返回 boolean
+ * @param childrenKey 子节点key
+ * @returns 节点路径
+ */
+export declare function findPath<T extends Record<string, any>>(tree: T[], func: (node: T) => boolean, childrenKey?: string): T[] | null;

package/dist/algorithm/tree.js

@@ -47,7 +47,7 @@ export const findNode = (tree, predicate, childrenKey = 'children') => {
  * @param child 子节点
  * @param indentityKey 节点唯一id字段名称
  * @param childrenKey 节点的子节点的字段名称
- * @returns
+ * @returns 父节点
  */
 export const findParent = (tree, child, indentityKey = 'id', childrenKey = 'children') => {
     if (tree === undefined || child === undefined) {
@@ -68,3 +68,30 @@ export const findParent = (tree, child, indentityKey = 'id', childrenKey = 'chil
     }
     return null;
 };
+/**
+ * 查找节点路径
+ * @param tree
+ * @param func 符合条件的节点函数,返回 boolean
+ * @param childrenKey 子节点key
+ * @returns 节点路径
+ */
+export function findPath(tree, func, childrenKey = 'children') {
+    const path = [];
+    const list = [...tree];
+    const visitedSet = new Set();
+    while (list.length) {
+        const node = list[0];
+        if (visitedSet.has(node)) {
+            path.pop();
+            list.shift();
+        }
+        else {
+            visitedSet.add(node);
+            Array.isArray(node[childrenKey]) && list.unshift(...node[childrenKey]);
+            path.push(node);
+            if (func(node))
+                return path;
+        }
+    }
+    return null;
+}

package/dist/file.js

@@ -109,6 +109,8 @@ export function download(source, fileName = '', target) {
             link.target = target;
         }
         else {
+            // https://stackoverflow.com/questions/33909763/download-attribute-with-a-file-name-not-working
+            // download 只在同源 URL 或 blob:、data: 协议起作用, 如果下载不同源的oss文件，download属性无效
             link.download = fileName;
         }
         link.href = source;

package/dist/react/index.d.ts

@@ -9,3 +9,4 @@ export * from './types';
 export * from './useForwardRef';
 export * from './useIsomorphicLayoutEffect';
 export * from './useMediaQuery';
+export * from './useIsFirstRender';

package/dist/react/index.js

@@ -9,3 +9,4 @@ export * from './types';
 export * from './useForwardRef';
 export * from './useIsomorphicLayoutEffect';
 export * from './useMediaQuery';
+export * from './useIsFirstRender';

package/dist/react/useIsFirstRender.d.ts

@@ -0,0 +1,6 @@
+/**
+ * 使用 useIsFirstRender 区分第一次和后续渲染
+ * useIsFirstRender 对于确定当前渲染是否是组件的第一个渲染很有用。当你想在初始渲染时有条件地执行某些逻辑或渲染特定组件时，这个钩子特别有价值，提供了一种有效的方法来区分第一次和后续渲染。
+ * @returns boolean true 表示第一次渲染，false 表示其他渲染
+ */
+export declare function useIsFirstRender(): boolean;

package/dist/react/useIsFirstRender.js

@@ -0,0 +1,14 @@
+import { useRef } from 'react';
+/**
+ * 使用 useIsFirstRender 区分第一次和后续渲染
+ * useIsFirstRender 对于确定当前渲染是否是组件的第一个渲染很有用。当你想在初始渲染时有条件地执行某些逻辑或渲染特定组件时，这个钩子特别有价值，提供了一种有效的方法来区分第一次和后续渲染。
+ * @returns boolean true 表示第一次渲染，false 表示其他渲染
+ */
+export function useIsFirstRender() {
+    const renderRef = useRef(true);
+    if (renderRef.current === true) {
+        renderRef.current = false;
+        return true;
+    }
+    return renderRef.current;
+}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@d-matrix/utils",
   "sideEffects": false,
-  "version": "1.24.0",
+  "version": "1.26.0",
   "description": "A dozen of utils for Front-End Development",
   "main": "dist/index.js",
   "scripts": {

package/readme.md

@@ -198,6 +198,10 @@ export default function Component() {
 }
 ```
 
+- `useIsFirstRender(): boolean`
+
+对于确定当前渲染是否是组件的第一个渲染很有用。当你想在初始渲染时有条件地执行某些逻辑或渲染特定组件时，这个 hook 特别有价值，提供了一种有效的方法来区分第一次和后续渲染。
+
 ### dom
 
 - `scrollToTop(element: Element | null | undefined): void`
@@ -407,6 +411,23 @@ const actual = tree.findParent(treeData, treeData.subs[1].subs[2], 'code', 'subs
 expect(actual).to.be.deep.equal(treeData.subs[1]);
 ```
 
+- `function findPath<T extends Record<string, any>>(tree: T[], func: (node: T) => boolean, childrenKey = 'children'): T[] | null`
+
+查找节点路径, 返回节点数组或`null`
+
+```ts
+const treeData = {
+  code: 1,
+  subs: [
+    { code: 2, subs: [{ code: 21 }, { code: 22 }, { code: 23 }] },
+    { code: 3, subs: [{ code: 31 }, { code: 32 }, { code: 33 }] },
+  ],
+};
+
+const actual = tree.findPath([root], (node) => node.id === 33);
+expect(actual).to.be.deep.equal([root, root.children[1], root.children[1].children[2]]);
+```
+
 ### file
 
 - `toImage(file: BlobPart | FileURL, options?: BlobPropertyBag): Promise<HTMLImageElement>`