@chasi/ui - npm Package Compare versions

Comparing version 0.1.48 to 0.1.49

dist/Actions/pannable.d.ts

@@ -13,5 +13,5 @@ type Coord = {
 };
-export default function (node: HTMLElement, params?: PannableParams): {
-    destroy?: () => void;
+export default function (node: HTMLElement | SVGElement, params?: PannableParams): {
+    destroy(): void;
 };
 export {};

dist/Actions/pannable.js

@@ -0,4 +1,15 @@
+import { throttle } from '../CGraph';
 export default function (node, params) {
     let x;
     let y;
+    const trotMove = throttle((event) => {
+        if (!params || !params.onMove)
+            return;
+        const e = event instanceof MouseEvent ? event : event.touches[0];
+        const dx = e.clientX - x;
+        const dy = e.clientY - y;
+        x = e.clientX;
+        y = e.clientY;
+        params.onMove(event, { x, y, dx, dy });
+    }, 50);
     function handleMousedown(event) {
@@ -12,17 +23,7 @@ event.stopPropagation();
         }
-        window.addEventListener('mousemove', handleMousemove);
+        window.addEventListener('mousemove', trotMove);
         window.addEventListener('mouseup', handleMouseup);
-        window.addEventListener('touchmove', handleMousemove);
+        window.addEventListener('touchmove', trotMove);
         window.addEventListener('touchend', handleMouseup);
     }
-    function handleMousemove(event) {
-        const e = event instanceof MouseEvent ? event : event.touches[0];
-        const dx = e.clientX - x;
-        const dy = e.clientY - y;
-        x = e.clientX;
-        y = e.clientY;
-        if (params && params.onMove) {
-            params.onMove(event, { x, y, dx, dy });
-        }
-    }
     function handleMouseup(event) {
@@ -35,12 +36,16 @@ const e = event instanceof MouseEvent ? event : event.changedTouches[0];
         }
-        window.removeEventListener('mousemove', handleMousemove);
+        window.removeEventListener('mousemove', trotMove);
         window.removeEventListener('mouseup', handleMouseup);
-        window.removeEventListener('touchmove', handleMousemove);
+        window.removeEventListener('touchmove', trotMove);
         window.removeEventListener('touchend', handleMouseup);
     }
+    // @ts-ignore
     node.addEventListener('mousedown', handleMousedown);
+    // @ts-ignore
     node.addEventListener('touchstart', handleMousedown);
     return {
         destroy() {
+            // @ts-ignore
             node.removeEventListener('mousedown', handleMousedown);
+            // @ts-ignore
             node.removeEventListener('touchstart', handleMousedown);
@@ -47,0 +52,0 @@ }

dist/Actions/zoomable.d.ts

 type ZoomableParams = {
-    onZoom?: (delta: number, center: {
+    onZoom: (delta: number, center: {
         x: number;
@@ -7,5 +7,5 @@ y: number;
 };
-export default function (node: HTMLElement, params: ZoomableParams): {
-    destroy?: () => void;
+export default function (node: HTMLElement | SVGElement, params?: ZoomableParams): {
+    destroy(): void;
 };
 export {};

dist/Actions/zoomable.js

@@ -0,9 +1,20 @@
+import { throttle } from '../CGraph';
 export default function (node, params) {
     let dist;
-    function scroll(e) {
-        e.preventDefault();
-        if (params.onZoom) {
+    const trotZoom = throttle((e) => {
+        if (!params || !params.onZoom)
+            return;
+        if (e instanceof WheelEvent) {
+            e.preventDefault();
             params.onZoom(e.deltaY, { x: e.clientX, y: e.clientY }, false);
         }
-    }
+        else {
+            const currentDist = Math.hypot(e.touches[0].pageX - e.touches[1].pageX, e.touches[0].pageY - e.touches[1].pageY);
+            const delta = dist - currentDist;
+            dist = currentDist;
+            const centerX = (e.touches[0].pageX + e.touches[1].pageX) / 2;
+            const centerY = (e.touches[0].pageY + e.touches[1].pageY) / 2;
+            params.onZoom(delta, { x: centerX, y: centerY }, true);
+        }
+    }, 50);
     function touchStart(e) {
@@ -13,25 +24,19 @@ e.preventDefault();
             dist = Math.hypot(e.touches[0].pageX - e.touches[1].pageX, e.touches[0].pageY - e.touches[1].pageY);
-            window.addEventListener('touchmove', handleTouchmove);
+            window.addEventListener('touchmove', trotZoom);
             window.addEventListener('touchend', handleTouchend);
         }
     }
-    function handleTouchmove(e) {
-        const currentDist = Math.hypot(e.touches[0].pageX - e.touches[1].pageX, e.touches[0].pageY - e.touches[1].pageY);
-        const delta = dist - currentDist;
-        dist = currentDist;
-        if (params.onZoom) {
-            const centerX = (e.touches[0].pageX + e.touches[1].pageX) / 2;
-            const centerY = (e.touches[0].pageY + e.touches[1].pageY) / 2;
-            params.onZoom(delta, { x: centerX, y: centerY }, true);
-        }
-    }
     function handleTouchend() {
-        window.removeEventListener('touchmove', handleTouchmove);
+        window.removeEventListener('touchmove', trotZoom);
         window.removeEventListener('touchend', handleTouchend);
     }
-    node.addEventListener('wheel', scroll);
+    // @ts-ignore
+    node.addEventListener('wheel', trotZoom);
+    // @ts-ignore
     node.addEventListener('touchstart', touchStart);
     return {
         destroy() {
-            node.removeEventListener('wheel', scroll);
+            // @ts-ignore
+            node.removeEventListener('wheel', trotZoom);
+            // @ts-ignore
             node.removeEventListener('touchstart', touchStart);
@@ -38,0 +43,0 @@ }

dist/CDraggableList/CDraggableList.svelte.d.ts

@@ -7,4 +7,2 @@ import { SvelteComponentTyped } from "svelte";
         handlerSelector?: string | undefined;
-        ignoreHandler?: string | undefined;
-        uid?: (T extends Record<string, any> ? keyof T : undefined) | undefined;
         class?: string | undefined;
@@ -18,6 +16,3 @@ };
     slots(): {
-        default: {
-            item: T;
-            index: any;
-        };
+        default: {};
     };
@@ -24,0 +19,0 @@ }

dist/CGraph/CGraph.svelte.d.ts

@@ -23,3 +23,6 @@ import { SvelteComponentTyped } from "svelte";
     slots: {
-        default: {};
+        default: {
+            width: number;
+            height: number;
+        };
     };
@@ -26,0 +29,0 @@ };

dist/CGraph/index.d.ts

@@ -5,4 +5,5 @@ export { default as CGraph } from './CGraph.svelte';
 export { default as CRect } from './CRect.svelte';
+export { default as CObject } from './CObject.svelte';
 export { default as CAxisX } from './CAxis-x.svelte';
 export { default as CAxisY } from './CAxis-y.svelte';
 export * from './utils';

dist/CGraph/index.js

@@ -5,4 +5,5 @@ export { default as CGraph } from './CGraph.svelte';
 export { default as CRect } from './CRect.svelte';
+export { default as CObject } from './CObject.svelte';
 export { default as CAxisX } from './CAxis-x.svelte';
 export { default as CAxisY } from './CAxis-y.svelte';
 export * from './utils';

dist/CGraph/utils.d.ts

@@ -11,1 +11,4 @@ export declare function distance(p1: [number, number], p2: [number, number]): number;
 export declare function ticks(min: number, max: number, count: number): number[];
+type ThrottledFunction<T extends (...args: any) => any> = (...args: Parameters<T>) => ReturnType<T>;
+export declare function throttle<T extends (...args: any) => any>(func: T, limit: number): ThrottledFunction<T>;
+export {};

dist/CGraph/utils.js

@@ -69,1 +69,16 @@ import d3Ticks from './ticks';
 }
+export function throttle(func, limit) {
+    let inThrottle;
+    let lastResult;
+    return function () {
+        const args = arguments;
+        const context = this;
+        if (!inThrottle) {
+            inThrottle = true;
+            setTimeout(() => (inThrottle = false), limit);
+            // @ts-ignore
+            lastResult = func.apply(context, args);
+        }
+        return lastResult;
+    };
+}

package.json

 {
   "name": "@chasi/ui",
-  "version": "0.1.48",
+  "version": "0.1.49",
   "type": "module",
@@ -5,0 +5,0 @@ "main": "./dist/index.js",

No alert changes

Improved metrics

Total package byte prevSize

176028

1.19%

Number of package files

82

2.5%

Lines of code

2074

2.57%

No dependency changes