@d-matrix/utils 1.2.5 → 1.2.6

package/dist/algorithm.d.ts

@@ -0,0 +1 @@
+export declare const moveMulti: <T extends unknown>(arr: T[], indexes: number[], start: number) => T[];

package/dist/algorithm.js

@@ -0,0 +1,21 @@
+"use strict";
+var __spreadArray = (this && this.__spreadArray) || function (to, from) {
+    for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
+        to[j] = from[i];
+    return to;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.moveMulti = void 0;
+var removeSymbol = Symbol('Placeholder for removed element');
+var moveMulti = function (arr, indexes, start) {
+    var cloned = arr.slice();
+    for (var i = 0; i < cloned.length; i++) {
+        if (indexes.includes(i)) {
+            cloned[i] = removeSymbol;
+        }
+    }
+    var els = arr.filter(function (__, i) { return indexes.includes(i); });
+    cloned.splice.apply(cloned, __spreadArray([start, 0], els));
+    return cloned.filter(function (v) { return v !== removeSymbol; });
+};
+exports.moveMulti = moveMulti;

package/dist/clipboard.d.ts

@@ -1 +1 @@
-export declare function writeImage(element: HTMLImageElement | null): Promise<unknown>;
+export declare function writeImage(element: HTMLImageElement | null | string): Promise<unknown>;

package/dist/clipboard.js

@@ -52,11 +52,22 @@ function writeImage(element) {
                     var img = new Image();
                     //浏览器在加载图像时要使用匿名身份验证，以允许跨域资源共享（CORS）。
                     img.crossOrigin = 'anonymous';
-                    img.src = element.src;
+                    if (typeof element === 'string') {
+                        img.src = element;
+                    }
+                    else {
+                        img.src = element.src;
+                    }
                     img.onload = function () {
                         //创建一个画布，赋予画布宽高为图片的原始宽高
-                        canvas.width = element.naturalWidth;
-                        canvas.height = element.naturalHeight;
+                        if (typeof element === 'string') {
+                            canvas.width = img.width;
+                            canvas.height = img.height;
+                        }
+                        else {
+                            canvas.width = element.naturalWidth;
+                            canvas.height = element.naturalHeight;
+                        }
                         //防止有缓存，绘制之前先清除画布
                         ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
                         ctx.drawImage(img, 0, 0);

package/dist/index.d.ts

@@ -3,3 +3,4 @@ export * as react from './react';
 export * as dom from './dom';
 export * as date from './date';
 export * as types from './types';
+export * as algorithm from './algorithm';

package/dist/index.js

@@ -19,9 +19,10 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.types = exports.date = exports.dom = exports.react = exports.clipboard = void 0;
+exports.algorithm = exports.types = exports.date = exports.dom = exports.react = exports.clipboard = void 0;
 exports.clipboard = __importStar(require("./clipboard"));
 exports.react = __importStar(require("./react"));
 exports.dom = __importStar(require("./dom"));
 exports.date = __importStar(require("./date"));
 exports.types = __importStar(require("./types"));
+exports.algorithm = __importStar(require("./algorithm"));

package/dist/react.d.ts

@@ -7,4 +7,8 @@ declare type ContextMenuTarget = () => Element | Document | undefined | null;
  * @param target 默认为 () => document
  */
 export declare const useDisableContextMenu: (target?: ContextMenuTarget) => void;
+/** 等价与类组件 setState(updater[, callback]) */
+export declare function useStateCallback<T>(initialState: T): [T, (state: T, cb?: (state: T) => void) => void];
+/** 用于判断组件是否挂载 */
+export declare function useMountedRef(): React.MutableRefObject<boolean>;
 export {};

package/dist/react.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useDisableContextMenu = exports.cleanup = exports.render = void 0;
+exports.useMountedRef = exports.useStateCallback = exports.useDisableContextMenu = exports.cleanup = exports.render = void 0;
 var react_1 = require("react");
 var react_dom_1 = __importDefault(require("react-dom"));
 var container;
@@ -62,3 +62,32 @@ var useDisableContextMenu = function (target) {
     }, []);
 };
 exports.useDisableContextMenu = useDisableContextMenu;
+/** 等价与类组件 setState(updater[, callback]) */
+function useStateCallback(initialState) {
+    var _a = react_1.useState(initialState), state = _a[0], setState = _a[1];
+    var cbRef = react_1.useRef(undefined);
+    var setStateCallback = react_1.useCallback(function (state, cb) {
+        cbRef.current = cb;
+        setState(state);
+    }, []);
+    react_1.useEffect(function () {
+        if (cbRef.current) {
+            cbRef.current(state);
+            cbRef.current = undefined;
+        }
+    }, [state]);
+    return [state, setStateCallback];
+}
+exports.useStateCallback = useStateCallback;
+/** 用于判断组件是否挂载 */
+function useMountedRef() {
+    var mountedRef = react_1.useRef(false);
+    react_1.useEffect(function () {
+        mountedRef.current = true;
+        return function () {
+            mountedRef.current = false;
+        };
+    }, []);
+    return mountedRef;
+}
+exports.useMountedRef = useMountedRef;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@d-matrix/utils",
-  "version": "1.2.5",
+  "version": "1.2.6",
   "description": "A dozen of utils for Front-End Development",
   "main": "dist/index.js",
   "scripts": {

package/readme.md

@@ -12,10 +12,11 @@ A dozen of utils for Front-End Development
 - [dom](#dom)
 - [date](#date)
 - [types](#types)
+- [algorithm]($algorithm)
 
 ### clipboard
 
-- `clipboard.writeImage(element: HTMLImageElement): void`
+- `clipboard.writeImage(element: HTMLImageElement | null | string): void`
 
 复制图片到剪贴板。
 
@@ -59,6 +60,14 @@ const TestComp = () => {
 }
 ```
 
+- `useStateCallback<T>(initialState: T): [T, (state: T, cb?: (state: T) => void) => void]`
+
+返回值`setState()`函数类似类组件中的`setState(updater[, callback])`,可以在`callback`中获取更新后的`state`
+
+- `useMountedRef(): React.MutableRefObject<boolean>`
+
+获取当前组件是否已挂载的 Hook
+
 ### dom
 
 - `scrollToTop(element: Element | null | undefined): void`
@@ -80,6 +89,12 @@ type A = { a: number; b: number; c: number; };
 type T0 = WithOptional<A, 'b' | 'c'>;  // { a: number; b?: number; c?: number }
 ```
 
+### algorithm
+
+- `moveMulti = <T extends unknown>(arr: T[], indexes: number[], start: number): T[]`
+
+移动多个元素到数组中指定的位置,用法,见[测试用例](tests/algorithm.cy.ts)
+
 ## 测试
 
 运行全部组件测试