@os-design/drag-sort 1.0.8 → 1.0.11
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/dist/cjs/DragAndDrop.js.map +1 -1
- package/dist/cjs/Draggable.js.map +1 -1
- package/dist/cjs/Droppable.js.map +1 -1
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/utils/ListStore.js.map +1 -1
- package/dist/cjs/utils/NodeList.js.map +1 -1
- package/dist/cjs/utils/getElementOffset.js.map +1 -1
- package/dist/cjs/utils/getElementScroll.js.map +1 -1
- package/dist/cjs/utils/getNodeRect.js.map +1 -1
- package/dist/cjs/utils/useAppendClassName.js.map +1 -1
- package/dist/cjs/utils/useBlankNode.js.map +1 -1
- package/dist/cjs/utils/useDragAndDrop.js.map +1 -1
- package/dist/cjs/utils/useDragEffect.js.map +1 -1
- package/dist/cjs/utils/useDroppable.js.map +1 -1
- package/dist/cjs/utils/useGeneratedId.js.map +1 -1
- package/dist/cjs/utils/useGetNodeStyle.js.map +1 -1
- package/dist/cjs/utils/useInitRect.js.map +1 -1
- package/dist/cjs/utils/useInitScrollOffset.js.map +1 -1
- package/dist/cjs/utils/useMoveNode.js.map +1 -1
- package/dist/cjs/utils/useScrollEventByPoint.js.map +1 -1
- package/dist/cjs/utils/useTargetList.js.map +1 -1
- package/dist/cjs/utils/useTransitionStyle.js.map +1 -1
- package/dist/esm/DragAndDrop.js.map +1 -1
- package/dist/esm/Draggable.js.map +1 -1
- package/dist/esm/Droppable.js.map +1 -1
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/utils/ListStore.js.map +1 -1
- package/dist/esm/utils/NodeList.js.map +1 -1
- package/dist/esm/utils/getElementOffset.js.map +1 -1
- package/dist/esm/utils/getElementScroll.js.map +1 -1
- package/dist/esm/utils/getNodeRect.js.map +1 -1
- package/dist/esm/utils/useAppendClassName.js.map +1 -1
- package/dist/esm/utils/useBlankNode.js.map +1 -1
- package/dist/esm/utils/useDragAndDrop.js.map +1 -1
- package/dist/esm/utils/useDragEffect.js.map +1 -1
- package/dist/esm/utils/useDroppable.js.map +1 -1
- package/dist/esm/utils/useGeneratedId.js.map +1 -1
- package/dist/esm/utils/useGetNodeStyle.js.map +1 -1
- package/dist/esm/utils/useInitRect.js.map +1 -1
- package/dist/esm/utils/useInitScrollOffset.js.map +1 -1
- package/dist/esm/utils/useMoveNode.js.map +1 -1
- package/dist/esm/utils/useScrollEventByPoint.js.map +1 -1
- package/dist/esm/utils/useTargetList.js.map +1 -1
- package/dist/esm/utils/useTransitionStyle.js.map +1 -1
- package/dist/types/utils/useInitRect.d.ts +1 -1
- package/dist/types/utils/useInitRect.d.ts.map +1 -1
- package/dist/types/utils/useInitScrollOffset.d.ts +1 -1
- package/dist/types/utils/useInitScrollOffset.d.ts.map +1 -1
- package/package.json +14 -13
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"useScrollEventByPoint.js","names":["useCallback","useEffect","useRef","getScrollableElements","compare","prevArr","nextArr","remove","add","forEach","item","includes","push","useScrollEventByPoint","point","listener","listenerRef","current","eventListener","e","elementsRef","scrollableElements","x","y","getTarget","document","body","window","index","indexOf","splice","removeEventListener","addEventListener"],"sources":["../../../src/utils/useScrollEventByPoint.ts"],"sourcesContent":["import { useCallback, useEffect, useRef } from 'react';\nimport { getScrollableElements } from '@os-design/use-auto-scroll';\n\nconst compare = <T>(prevArr: T[], nextArr: T[]) => {\n const remove: T[] = [];\n const add: T[] = [];\n prevArr.forEach((item) => {\n if (!nextArr.includes(item)) remove.push(item);\n });\n nextArr.forEach((item) => {\n if (!prevArr.includes(item)) add.push(item);\n });\n return { remove, add };\n};\n\nexport interface Point {\n x: number;\n y: number;\n}\n\n/**\n * Sets the listener that will be called whenever the scroll event occurs\n * in one of the elements located under the specified point.\n */\nconst useScrollEventByPoint = (\n point: Point | null,\n listener: (e: Event) => void\n) => {\n const listenerRef = useRef(listener);\n useEffect(() => {\n listenerRef.current = listener;\n }, [listener]);\n\n const eventListener = useCallback((e: Event) => listenerRef.current(e), []);\n const elementsRef = useRef<Element[]>([]);\n\n useEffect(() => {\n if (!point) return;\n const scrollableElements = getScrollableElements(point.x, point.y);\n const { remove, add } = compare(elementsRef.current, scrollableElements);\n const getTarget = (item: Element) =>\n item === document.body ? window : item;\n\n remove.forEach((item) => {\n const index = elementsRef.current.indexOf(item);\n if (index >= 0) elementsRef.current.splice(index, 1);\n getTarget(item).removeEventListener('scroll', eventListener);\n });\n add.forEach((item) => {\n elementsRef.current.push(item);\n getTarget(item).addEventListener('scroll', eventListener);\n });\n }, [eventListener, point]);\n};\n\nexport default useScrollEventByPoint;\n"],"mappings":"AAAA,SAASA,WAAT,EAAsBC,SAAtB,EAAiCC,MAAjC,QAA+C,OAA/C;AACA,SAASC,qBAAT,QAAsC,4BAAtC;;AAEA,MAAMC,OAAO,GAAG,CAAIC,OAAJ,EAAkBC,OAAlB,KAAmC;EACjD,MAAMC,MAAW,GAAG,EAApB;EACA,MAAMC,GAAQ,GAAG,EAAjB;EACAH,OAAO,CAACI,OAAR,CAAiBC,IAAD,IAAU;IACxB,IAAI,CAACJ,OAAO,CAACK,QAAR,CAAiBD,IAAjB,CAAL,EAA6BH,MAAM,CAACK,IAAP,CAAYF,IAAZ;EAC9B,CAFD;EAGAJ,OAAO,CAACG,OAAR,CAAiBC,IAAD,IAAU;IACxB,IAAI,CAACL,OAAO,CAACM,QAAR,CAAiBD,IAAjB,CAAL,EAA6BF,GAAG,CAACI,IAAJ,CAASF,IAAT;EAC9B,CAFD;EAGA,OAAO;IAAEH,MAAF;IAAUC;EAAV,CAAP;AACD,CAVD;;AAiBA;AACA;AACA;AACA;AACA,MAAMK,qBAAqB,GAAG,CAC5BC,KAD4B,EAE5BC,QAF4B,KAGzB;EACH,MAAMC,WAAW,GAAGd,MAAM,CAACa,QAAD,CAA1B;EACAd,SAAS,CAAC,MAAM;IACde,WAAW,CAACC,OAAZ,GAAsBF,QAAtB;EACD,CAFQ,EAEN,CAACA,QAAD,CAFM,CAAT;EAIA,MAAMG,aAAa,GAAGlB,WAAW,CAAEmB,CAAD,IAAcH,WAAW,CAACC,OAAZ,CAAoBE,CAApB,CAAf,EAAuC,EAAvC,CAAjC;EACA,MAAMC,WAAW,GAAGlB,MAAM,CAAY,EAAZ,CAA1B;EAEAD,SAAS,CAAC,MAAM;IACd,IAAI,CAACa,KAAL,EAAY;IACZ,MAAMO,kBAAkB,GAAGlB,qBAAqB,CAACW,KAAK,CAACQ,CAAP,EAAUR,KAAK,CAACS,CAAhB,CAAhD;IACA,MAAM;MAAEhB,MAAF;MAAUC;IAAV,IAAkBJ,OAAO,CAACgB,WAAW,CAACH,OAAb,EAAsBI,kBAAtB,CAA/B;;IACA,MAAMG,SAAS,GAAId,IAAD,IAChBA,IAAI,KAAKe,QAAQ,CAACC,IAAlB,GAAyBC,MAAzB,GAAkCjB,IADpC;;IAGAH,MAAM,CAACE,OAAP,CAAgBC,IAAD,IAAU;MACvB,MAAMkB,KAAK,GAAGR,WAAW,CAACH,OAAZ,CAAoBY,OAApB,CAA4BnB,IAA5B,CAAd;MACA,IAAIkB,KAAK,IAAI,CAAb,EAAgBR,WAAW,CAACH,OAAZ,CAAoBa,MAApB,CAA2BF,KAA3B,EAAkC,CAAlC;MAChBJ,SAAS,CAACd,IAAD,CAAT,CAAgBqB,mBAAhB,CAAoC,QAApC,EAA8Cb,aAA9C;IACD,CAJD;IAKAV,GAAG,CAACC,OAAJ,CAAaC,IAAD,IAAU;MACpBU,WAAW,CAACH,OAAZ,CAAoBL,IAApB,CAAyBF,IAAzB;MACAc,SAAS,CAACd,IAAD,CAAT,CAAgBsB,gBAAhB,CAAiC,QAAjC,EAA2Cd,aAA3C;IACD,CAHD;EAID,CAhBQ,EAgBN,CAACA,aAAD,EAAgBJ,KAAhB,CAhBM,CAAT;AAiBD,CA7BD;;AA+BA,eAAeD,qBAAf"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"useTargetList.js","names":["useCallback","useMemo","useState","useThrottle","useScrollEventByPoint","useTargetList","position","listStoreRef","number","setNumber","targetList","current","x","y","list","findByPosition","forceUpdate","n","throttledForceUpdate"],"sources":["../../../src/utils/useTargetList.ts"],"sourcesContent":["import { RefObject, useCallback, useMemo, useState } from 'react';\nimport useThrottle from '@os-design/use-throttle';\nimport { Position } from '@os-design/use-drag';\nimport ListStore from './ListStore';\nimport useScrollEventByPoint from './useScrollEventByPoint';\n\nconst useTargetList = (\n position: Position | null,\n listStoreRef: RefObject<ListStore>\n) => {\n const [number, setNumber] = useState(0);\n\n const targetList = useMemo(() => {\n if (!position || !listStoreRef.current) return null;\n const { x, y } = position;\n const list = listStoreRef.current.findByPosition(x, y);\n return list || null;\n }, [listStoreRef, position, number]); // eslint-disable-line react-hooks/exhaustive-deps\n\n const forceUpdate = useCallback(() => {\n setNumber((n) => n + 1);\n }, []);\n\n // Update the target list if one of the elements located under the specified point has been scrolled\n const [throttledForceUpdate] = useThrottle(forceUpdate, 100);\n useScrollEventByPoint(position, throttledForceUpdate);\n\n return targetList;\n};\n\nexport default useTargetList;\n"],"mappings":"AAAA,SAAoBA,WAApB,EAAiCC,OAAjC,EAA0CC,QAA1C,QAA0D,OAA1D;AACA,OAAOC,WAAP,MAAwB,yBAAxB;AAGA,OAAOC,qBAAP,MAAkC,yBAAlC;;AAEA,MAAMC,aAAa,GAAG,CACpBC,QADoB,EAEpBC,YAFoB,KAGjB;EACH,MAAM,CAACC,MAAD,EAASC,SAAT,IAAsBP,QAAQ,CAAC,CAAD,CAApC;EAEA,MAAMQ,UAAU,GAAGT,OAAO,CAAC,MAAM;IAC/B,IAAI,CAACK,QAAD,IAAa,CAACC,YAAY,CAACI,OAA/B,EAAwC,OAAO,IAAP;IACxC,MAAM;MAAEC,CAAF;MAAKC;IAAL,IAAWP,QAAjB;IACA,MAAMQ,IAAI,GAAGP,YAAY,CAACI,OAAb,CAAqBI,cAArB,CAAoCH,CAApC,EAAuCC,CAAvC,CAAb;IACA,OAAOC,IAAI,IAAI,IAAf;EACD,CALyB,EAKvB,CAACP,YAAD,EAAeD,QAAf,EAAyBE,MAAzB,CALuB,CAA1B,CAHG,CAQmC;;EAEtC,MAAMQ,WAAW,GAAGhB,WAAW,CAAC,MAAM;IACpCS,SAAS,CAAEQ,CAAD,IAAOA,CAAC,GAAG,CAAZ,CAAT;EACD,CAF8B,EAE5B,EAF4B,CAA/B,CAVG,CAcH;;EACA,MAAM,CAACC,oBAAD,IAAyBf,WAAW,CAACa,WAAD,EAAc,GAAd,CAA1C;EACAZ,qBAAqB,CAACE,QAAD,EAAWY,oBAAX,CAArB;EAEA,OAAOR,UAAP;AACD,CAtBD;;AAwBA,eAAeL,aAAf"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"useTransitionStyle.js","names":["useEffect","useTransitionStyle","props","className","ms","enabled","style","document","createElement","innerHTML","child","head","appendChild","removeChild"],"sources":["../../../src/utils/useTransitionStyle.ts"],"sourcesContent":["import { useEffect } from 'react';\n\ninterface UseTransitionStyleProps {\n className: string;\n ms: number;\n enabled: boolean;\n}\n\n/**\n * Creates the global style for setting the transition delay.\n */\nconst useTransitionStyle = (props: UseTransitionStyleProps) => {\n const { className, ms, enabled } = props;\n\n useEffect(() => {\n if (!enabled) return () => {};\n const style = document.createElement('style');\n style.innerHTML = `.${className}{transition:transform ${ms}ms;}`;\n const child = document.head.appendChild(style);\n return () => {\n document.head.removeChild(child);\n };\n }, [className, enabled, ms]);\n};\n\nexport default useTransitionStyle;\n"],"mappings":"AAAA,SAASA,SAAT,QAA0B,OAA1B;;AAQA;AACA;AACA;AACA,MAAMC,kBAAkB,GAAIC,KAAD,IAAoC;EAC7D,MAAM;IAAEC,SAAF;IAAaC,EAAb;IAAiBC;EAAjB,IAA6BH,KAAnC;EAEAF,SAAS,CAAC,MAAM;IACd,IAAI,CAACK,OAAL,EAAc,OAAO,MAAM,CAAE,CAAf;IACd,MAAMC,KAAK,GAAGC,QAAQ,CAACC,aAAT,CAAuB,OAAvB,CAAd;IACAF,KAAK,CAACG,SAAN,GAAmB,IAAGN,SAAU,yBAAwBC,EAAG,MAA3D;IACA,MAAMM,KAAK,GAAGH,QAAQ,CAACI,IAAT,CAAcC,WAAd,CAA0BN,KAA1B,CAAd;IACA,OAAO,MAAM;MACXC,QAAQ,CAACI,IAAT,CAAcE,WAAd,CAA0BH,KAA1B;IACD,CAFD;EAGD,CARQ,EAQN,CAACP,SAAD,EAAYE,OAAZ,EAAqBD,EAArB,CARM,CAAT;AASD,CAZD;;AAcA,eAAeH,kBAAf"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useInitRect.d.ts","sourceRoot":"","sources":["../../../src/utils/useInitRect.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAW,MAAM,OAAO,CAAC;AAE3C,QAAA,MAAM,WAAW;;;;;
|
|
1
|
+
{"version":3,"file":"useInitRect.d.ts","sourceRoot":"","sources":["../../../src/utils/useInitRect.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAW,MAAM,OAAO,CAAC;AAE3C,QAAA,MAAM,WAAW,SAAU,UAAU,WAAW,CAAC;;;;;QAYtC,CAAC;AAEZ,eAAe,WAAW,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useInitScrollOffset.d.ts","sourceRoot":"","sources":["../../../src/utils/useInitScrollOffset.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAW,MAAM,OAAO,CAAC;AAG3C,QAAA,MAAM,mBAAmB;;;
|
|
1
|
+
{"version":3,"file":"useInitScrollOffset.d.ts","sourceRoot":"","sources":["../../../src/utils/useInitScrollOffset.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAW,MAAM,OAAO,CAAC;AAG3C,QAAA,MAAM,mBAAmB,SAAU,UAAU,WAAW,CAAC;;;QAU9C,CAAC;AAEZ,eAAe,mBAAmB,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@os-design/drag-sort",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.11",
|
|
4
4
|
"license": "UNLICENSED",
|
|
5
5
|
"repository": "git@gitlab.com:os-team/libs/os-design.git",
|
|
6
6
|
"main": "dist/cjs/index.js",
|
|
@@ -10,7 +10,8 @@
|
|
|
10
10
|
".": {
|
|
11
11
|
"require": "./dist/cjs/index.js",
|
|
12
12
|
"default": "./dist/esm/index.js"
|
|
13
|
-
}
|
|
13
|
+
},
|
|
14
|
+
"./package.json": "./package.json"
|
|
14
15
|
},
|
|
15
16
|
"files": [
|
|
16
17
|
"dist"
|
|
@@ -28,22 +29,22 @@
|
|
|
28
29
|
"access": "public"
|
|
29
30
|
},
|
|
30
31
|
"dependencies": {
|
|
31
|
-
"@os-design/portal": "^1.0.
|
|
32
|
-
"@os-design/use-auto-scroll": "^1.0.
|
|
33
|
-
"@os-design/use-drag": "^1.0.
|
|
34
|
-
"@os-design/use-event": "^1.0.
|
|
35
|
-
"@os-design/use-memo-object": "^1.0.
|
|
36
|
-
"@os-design/use-prevent-default-event": "^1.0.
|
|
37
|
-
"@os-design/use-throttle": "^1.0.
|
|
32
|
+
"@os-design/portal": "^1.0.3",
|
|
33
|
+
"@os-design/use-auto-scroll": "^1.0.4",
|
|
34
|
+
"@os-design/use-drag": "^1.0.3",
|
|
35
|
+
"@os-design/use-event": "^1.0.8",
|
|
36
|
+
"@os-design/use-memo-object": "^1.0.3",
|
|
37
|
+
"@os-design/use-prevent-default-event": "^1.0.3",
|
|
38
|
+
"@os-design/use-throttle": "^1.0.8"
|
|
38
39
|
},
|
|
39
40
|
"devDependencies": {
|
|
40
|
-
"@os-design/omit-emotion-props": "^1.0.
|
|
41
|
-
"@os-design/use-size": "^1.0.
|
|
42
|
-
"react-window": "^1.8.
|
|
41
|
+
"@os-design/omit-emotion-props": "^1.0.5",
|
|
42
|
+
"@os-design/use-size": "^1.0.8",
|
|
43
|
+
"react-window": "^1.8.7"
|
|
43
44
|
},
|
|
44
45
|
"peerDependencies": {
|
|
45
46
|
"react": ">=18",
|
|
46
47
|
"react-dom": ">=18"
|
|
47
48
|
},
|
|
48
|
-
"gitHead": "
|
|
49
|
+
"gitHead": "6920c75ea791cbb8edc94c2dd506183d41ffeac6"
|
|
49
50
|
}
|