@homecode/ui 4.19.2 → 4.19.4

package/dist/esm/src/components/Draggable/Draggable.js

@@ -1,15 +1,15 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
-import { Component } from 'react';
-import { createStore } from 'justorm/react';
-import cn from 'classnames';
-import Time from 'timen';
 import 'nanoid';
 import '../../tools/dom.js';
-import debounce from '../../tools/debounce.js';
+import throttle from '../../tools/throttle.js';
+import Time from 'timen';
 import 'compareq';
 import 'lodash.pick';
 import '../../tools/queryParams.js';
+import { Component } from 'react';
 import S from './Draggable.styl.js';
+import cn from 'classnames';
+import { createStore } from 'justorm/react';
 
 class Draggable extends Component {
     store;
@@ -60,7 +60,7 @@ class Draggable extends Component {
         this.transformInner(this.draggingElem, `translate(${dx}px, ${dy}px)`);
         this.checkUnderElem(x, y);
     };
-    checkUnderElem = debounce((x, y) => {
+    checkUnderElem = throttle((x, y) => {
         const underItem = document.elementFromPoint(x, y)?.closest(`.${S.item}`);
         if (!underItem) {
             this.store.underOffset = '';
@@ -129,7 +129,7 @@ class Draggable extends Component {
     render() {
         const { items, className, itemClassName, renderItem, children } = this.props;
         const { draggingId, underId, underOffset } = this.store;
-        return (jsxs("div", { className: cn(S.root, draggingId && S.dragging, className), children: [items.map(id => (jsx("div", { className: cn(S.item, itemClassName, id === draggingId && S.active), onPointerDown: this.onPointerDown, "data-id": id, children: jsx("div", { className: S.inner, style: underId === id ? { transform: underOffset } : null, children: renderItem(id, id === draggingId) }) }, id))), children] }));
+        return (jsxs("div", { className: cn(S.root, draggingId && S.dragging, className), children: [items.map((id, index) => (jsx("div", { className: cn(S.item, itemClassName, id === draggingId && S.active), onPointerDown: this.onPointerDown, "data-id": id, children: jsx("div", { className: S.inner, style: underId === id ? { transform: underOffset } : null, children: renderItem(id, index, id === draggingId) }) }, id))), children] }));
     }
 }
 

package/dist/esm/types/src/components/Draggable/Draggable.d.ts

@@ -1,5 +1,5 @@
-import { Component } from 'react';
 import * as T from './Draggable.types';
+import { Component } from 'react';
 export declare class Draggable extends Component<T.Props> {
     store: any;
     startPos: any;

package/dist/esm/types/src/components/Draggable/Draggable.types.d.ts

@@ -3,7 +3,7 @@ export type Props = {
     items: string[];
     className?: string;
     itemClassName?: string;
-    renderItem: (id: string, isActive: boolean) => ReactNode;
+    renderItem: (id: string, index: number, isActive: boolean) => ReactNode;
     onDragStart?: (id: string) => void;
     onDragEnd?: (id: string) => void;
     onChange: (items: string[]) => void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@homecode/ui",
-  "version": "4.19.2",
+  "version": "4.19.4",
   "description": "React UI components library",
   "scripts": {
     "test": "jest",