@fast-simon/dashboard-utilities 1.0.20 → 1.0.22
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/lib/components/DragAndDrop/DndContextWrapper.d.ts +1 -2
- package/lib/components/DragAndDrop/DndContextWrapper.js +1 -3
- package/lib/components/DragAndDrop/DndContextWrapper.js.map +1 -1
- package/lib/components/DragAndDrop/styles.module.css +0 -5
- package/lib/utils/useDragToSelect.js +0 -5
- package/lib/utils/useDragToSelect.js.map +1 -1
- package/package.json +11 -9
|
@@ -14,7 +14,6 @@ export interface DndContextWrapperProps {
|
|
|
14
14
|
selectedProductIds: Record<string, number>;
|
|
15
15
|
ProductCardComponent: React.ComponentType<any>;
|
|
16
16
|
SelectCardComponent: React.ComponentType<any>;
|
|
17
|
-
disableDragging?: boolean;
|
|
18
17
|
}
|
|
19
|
-
declare const DndContextWrapper: ({ children, onDragStart, onDragEnd, activeId, selectedProductIds, findActiveProduct, ProductCardComponent, SelectCardComponent
|
|
18
|
+
declare const DndContextWrapper: ({ children, onDragStart, onDragEnd, activeId, selectedProductIds, findActiveProduct, ProductCardComponent, SelectCardComponent }: DndContextWrapperProps) => import("react/jsx-runtime").JSX.Element;
|
|
20
19
|
export default DndContextWrapper;
|
|
@@ -1,14 +1,12 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
import { closestCorners, defaultDropAnimationSideEffects, DndContext, DragOverlay, MouseSensor, useSensor, useSensors, } from "@dnd-kit/core";
|
|
3
3
|
import { isEditorProduct } from "../../@types/editorProduct";
|
|
4
|
-
const DndContextWrapper = ({ children, onDragStart, onDragEnd, activeId, selectedProductIds, findActiveProduct, ProductCardComponent, SelectCardComponent
|
|
4
|
+
const DndContextWrapper = ({ children, onDragStart, onDragEnd, activeId, selectedProductIds, findActiveProduct, ProductCardComponent, SelectCardComponent }) => {
|
|
5
5
|
const sensors = useSensors(useSensor(MouseSensor, {
|
|
6
6
|
activationConstraint: {
|
|
7
7
|
distance: 10,
|
|
8
8
|
},
|
|
9
9
|
}));
|
|
10
|
-
// console.log(disableDragging)
|
|
11
|
-
// console.log({disableDragging: disableDragging, MouseSensor: MouseSensor, KeyboardSensor: KeyboardSensor})
|
|
12
10
|
return (_jsx(_Fragment, { children: _jsxs(DndContext, Object.assign({ sensors: sensors, collisionDetection: closestCorners, onDragStart: onDragStart, onDragEnd: onDragEnd }, { children: [children, _jsx(DragOverlay, Object.assign({ style: {
|
|
13
11
|
boxShadow: "0 25px 50px -12px rgb(0 0 0 / 0.25)",
|
|
14
12
|
zIndex: 9999999,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DndContextWrapper.js","sourceRoot":"","sources":["../../../src/components/DragAndDrop/DndContextWrapper.tsx"],"names":[],"mappings":";AACA,OAAO,EACL,cAAc,EACd,+BAA+B,EAC/B,UAAU,EACV,WAAW,EACX,WAAW,EACX,SAAS,EACT,UAAU,GACX,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;
|
|
1
|
+
{"version":3,"file":"DndContextWrapper.js","sourceRoot":"","sources":["../../../src/components/DragAndDrop/DndContextWrapper.tsx"],"names":[],"mappings":";AACA,OAAO,EACL,cAAc,EACd,+BAA+B,EAC/B,UAAU,EACV,WAAW,EACX,WAAW,EACX,SAAS,EACT,UAAU,GACX,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAa7D,MAAM,iBAAiB,GAAG,CAAC,EACI,QAAQ,EACR,WAAW,EACX,SAAS,EACT,QAAQ,EACR,kBAAkB,EAClB,iBAAiB,EACjB,oBAAoB,EACpB,mBAAmB,EACxB,EAAE,EAAE;IAE1B,MAAM,OAAO,GAAG,UAAU,CACxB,SAAS,CAAC,WAAW,EAAE;QACrB,oBAAoB,EAAE;YACpB,QAAQ,EAAE,EAAE;SACb;KACF,CAAC,CACH,CAAC;IAEJ,OAAO,CACH,4BACE,MAAC,UAAU,kBACP,OAAO,EAAE,OAAO,EAChB,kBAAkB,EAAE,cAAc,EAClC,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,iBAEnB,QAAQ,EACT,KAAC,WAAW,kBACV,KAAK,EAAE;wBACL,SAAS,EAAE,qCAAqC;wBAChD,MAAM,EAAE,OAAO;qBAChB,EACD,aAAa,EAAE;wBACb,MAAM,EAAE,gCAAgC;wBACxC,SAAS,EAAE,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC;wBAC/B,WAAW,EAAE,+BAA+B,CAAC;4BAC3C,MAAM,EAAE;gCACN,MAAM,EAAE;oCACN,OAAO,EAAE,KAAK;iCACf;6BACF;yBACF,CAAC;qBACH,gBAEA,QAAQ;wBACP,CAAC,MAAM,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC,MAAM,IAAI,CAAC;4BAC5C,eAAe,CAAC,iBAAiB,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAC3C,KAAC,oBAAoB,IACjB,UAAU,EAAE,KAAK,EACjB,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC,EACjB,OAAO,EAAE,iBAAiB,CAAC,QAAQ,CAAmB,GACtD,CACP,CAAC,CAAC,CAAC,CACC,KAAC,mBAAmB,IACjB,WAAW,EACT,CAAC,MAAM,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC,MAAM,CAAC;gCACxC,CAAC,QAAQ,IAAI,kBAAkB;oCAC7B,CAAC,CAAC,CAAC;oCACH,CAAC,CAAC,CAAC,CAAC,GAEZ,CACH,CAAC,IACQ,KACH,GACd,CACN,CAAC;AAEJ,CAAC,CAAC;AAEF,eAAe,iBAAiB,CAAC","sourcesContent":["import React, { ReactNode, useMemo, useState } from \"react\";\r\nimport {\r\n closestCorners,\r\n defaultDropAnimationSideEffects,\r\n DndContext,\r\n DragOverlay,\r\n MouseSensor,\r\n useSensor,\r\n useSensors,\r\n} from \"@dnd-kit/core\";\r\nimport { EditorProduct } from \"../../@types/editorProduct\";\r\nimport { isEditorProduct } from \"../../@types/editorProduct\";\r\n\r\nexport interface DndContextWrapperProps {\r\n children: ReactNode;\r\n onDragStart: ({active}: {active: any}) => void;\r\n onDragEnd: ({over, active}: {over: any, active: any}) => void;\r\n activeId: string | null;\r\n findActiveProduct: (activeId: string) => EditorProduct | undefined;\r\n selectedProductIds: Record<string, number>;\r\n ProductCardComponent: React.ComponentType<any>;\r\n SelectCardComponent: React.ComponentType<any>;\r\n}\r\n\r\nconst DndContextWrapper = ({\r\n children,\r\n onDragStart,\r\n onDragEnd,\r\n activeId,\r\n selectedProductIds,\r\n findActiveProduct,\r\n ProductCardComponent,\r\n SelectCardComponent\r\n} : DndContextWrapperProps) => {\r\n\r\n const sensors = useSensors(\r\n useSensor(MouseSensor, {\r\n activationConstraint: {\r\n distance: 10,\r\n },\r\n }),\r\n );\r\n\r\n return (\r\n <>\r\n <DndContext\r\n sensors={sensors}\r\n collisionDetection={closestCorners}\r\n onDragStart={onDragStart}\r\n onDragEnd={onDragEnd}\r\n >\r\n {children}\r\n <DragOverlay\r\n style={{\r\n boxShadow: \"0 25px 50px -12px rgb(0 0 0 / 0.25)\",\r\n zIndex: 9999999,\r\n }}\r\n dropAnimation={{\r\n easing: \"cubic-bezier(0.22, 1, 0.36, 1)\",\r\n keyframes: (parameters) => [{}],\r\n sideEffects: defaultDropAnimationSideEffects({\r\n styles: {\r\n active: {\r\n opacity: \"0.5\",\r\n },\r\n },\r\n }),\r\n }}\r\n >\r\n {activeId &&\r\n (Object.keys(selectedProductIds).length <= 1 &&\r\n isEditorProduct(findActiveProduct(activeId)) ? (\r\n <ProductCardComponent\r\n isSelected={false}\r\n onClick={() => {}}\r\n product={findActiveProduct(activeId)! as EditorProduct}\r\n />\r\n ) : (\r\n <SelectCardComponent\r\n numSelected={\r\n (Object.keys(selectedProductIds).length) +\r\n (activeId in selectedProductIds\r\n ? 0\r\n : 1)\r\n }\r\n />\r\n ))}\r\n </DragOverlay>\r\n </DndContext>\r\n </>\r\n );\r\n\r\n};\r\n\r\nexport default DndContextWrapper;\r\n"]}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import React, { useCallback, useEffect, useState } from "react";
|
|
2
2
|
import DragSelect from "dragselect";
|
|
3
3
|
export const useDragToSelect = ({ areaRef, selectables, areaId, onSelectCommitted, onSelect, isDragAndDropActive, disabled, onDispatch, }) => {
|
|
4
|
-
// const { state, dispatcher } = useVisualEditorContext();
|
|
5
4
|
const [dragselect, setDragSelect] = React.useState();
|
|
6
5
|
const [prevSelectables, setPrevSelectables] = useState([]);
|
|
7
6
|
const setSelected = useCallback((items) => {
|
|
@@ -39,7 +38,6 @@ export const useDragToSelect = ({ areaRef, selectables, areaId, onSelectCommitte
|
|
|
39
38
|
};
|
|
40
39
|
const commit = (callback_object) => {
|
|
41
40
|
var _a, _b, _c;
|
|
42
|
-
// dispatcher.setIsDragToSelectActive(false);
|
|
43
41
|
onDispatch("setIsDragToSelectActive", false);
|
|
44
42
|
if ((callback_object === null || callback_object === void 0 ? void 0 : callback_object.isDragging) ||
|
|
45
43
|
window.isDragAndDropActive) {
|
|
@@ -59,7 +57,6 @@ export const useDragToSelect = ({ areaRef, selectables, areaId, onSelectCommitte
|
|
|
59
57
|
};
|
|
60
58
|
const onSelectStart = (callback_object) => {
|
|
61
59
|
var _a, _b, _c, _d;
|
|
62
|
-
// dispatcher.setIsDragToSelectActive(true);
|
|
63
60
|
onDispatch("setIsDragToSelectActive", true);
|
|
64
61
|
if (!(callback_object === null || callback_object === void 0 ? void 0 : callback_object.isDragging) &&
|
|
65
62
|
!window.isDragAndDropActive &&
|
|
@@ -139,8 +136,6 @@ export const useDragToSelect = ({ areaRef, selectables, areaId, onSelectCommitte
|
|
|
139
136
|
return;
|
|
140
137
|
}
|
|
141
138
|
if (!((_a = e.target) === null || _a === void 0 ? void 0 : _a.closest("#" + areaId))) {
|
|
142
|
-
// dispatcher.setIsCutting(false);
|
|
143
|
-
// dispatcher.setSelectedProducts([]);
|
|
144
139
|
onDispatch("setIsCutting", false);
|
|
145
140
|
onDispatch("setSelectedProducts", []);
|
|
146
141
|
onSelect({});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useDragToSelect.js","sourceRoot":"","sources":["../../src/utils/useDragToSelect.ts"],"names":[],"mappings":"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","sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport DragSelect from \"dragselect\";\ninterface Props {\n areaRef: React.RefObject<HTMLDivElement>;\n selectables: HTMLElement[];\n areaId: string;\n onSelectCommitted?: (selectedIDS: string[]) => void;\n onSelect: (ids: Record<string, number>) => void;\n isDragAndDropActive: boolean;\n disabled?: boolean;\n onDispatch: (key: string, value: any) => void;\n}\nexport const useDragToSelect = ({\n areaRef,\n selectables,\n areaId,\n onSelectCommitted,\n onSelect,\n isDragAndDropActive,\n disabled,\n onDispatch,\n}: Props) => {\n // const { state, dispatcher } = useVisualEditorContext();\n\n const [dragselect, setDragSelect] = React.useState<DragSelect>();\n\n const [prevSelectables, setPrevSelectables] = useState<HTMLElement[]>([]);\n\n const setSelected = useCallback(\n (items: HTMLElement[]) => {\n const selected = items.map((el: HTMLElement) => {\n const wrapper =\n el.closest(\".main-product-container\") ||\n el.querySelector(\".main-product-container\");\n return {\n id: wrapper?.getAttribute(\"product-id\"),\n pos: wrapper?.getAttribute(\"product-index\"),\n };\n });\n const ids: Record<string, number> = {};\n selected.forEach((el: any) => {\n const id = el.id.includes(\"_\")\n ? el.id.split(\"_\")[1]\n : String(el.id);\n ids[id] = parseInt(el.pos);\n });\n\n onSelect(ids);\n },\n [onSelect]\n );\n\n const onselect = (callback_object: any) => {\n if (\n (window as any).isDragAndDropActive ||\n callback_object?.isDragging ||\n !callback_object.event?.target ||\n callback_object.event.target.localName === \"svg\"\n ) {\n return;\n }\n if (\n callback_object.event.target.classList.contains(\n \"material-symbols-outlined\"\n ) ||\n callback_object.event.target.className.includes(\"icon\") ||\n callback_object.event.target.className.includes(\"Tooltip\")\n ) {\n return;\n }\n\n setSelected(callback_object.items);\n };\n\n const commit = (callback_object: any) => {\n // dispatcher.setIsDragToSelectActive(false);\n onDispatch(\"setIsDragToSelectActive\", false);\n if (\n callback_object?.isDragging ||\n (window as any).isDragAndDropActive\n ) {\n const area = document.getElementById(areaId) as HTMLElement;\n if (area) {\n area.style.userSelect = \"\";\n area.style.webkitUserSelect = \"\";\n }\n dragselect?.clearSelection();\n return;\n }\n if (\n callback_object?.event?.target?.closest?.(\".main-product-container\")\n ) {\n return;\n }\n onselect(callback_object);\n dragselect?.clearSelection();\n };\n\n const onSelectStart = (callback_object: any) => {\n // dispatcher.setIsDragToSelectActive(true);\n onDispatch(\"setIsDragToSelectActive\", true);\n\n if (\n !callback_object?.isDragging &&\n !(window as any).isDragAndDropActive &&\n callback_object.items.length !== 1\n ) {\n dragselect?.clearSelection();\n }\n if (window.getSelection) {\n window.getSelection()?.removeAllRanges?.();\n } else if (document.getSelection) {\n document.getSelection()?.empty?.();\n }\n const area = document.getElementById(areaId) as HTMLElement;\n if (area) {\n area.style.userSelect = \"none\";\n area.style.webkitUserSelect = \"none\";\n }\n };\n\n const onscroll = (callback_object: any) => {\n if (\n callback_object?.items?.length > 1 &&\n !(window as any).isDragAndDropActive\n ) {\n setSelected(callback_object.items);\n }\n };\n\n useEffect(() => {\n dragselect?.subscribe(\"dragmove\", onselect);\n dragselect?.subscribe(\"callback\", commit);\n dragselect?.subscribe(\"dragstart\", onSelectStart);\n dragselect?.subscribe(\"autoscroll\", onscroll);\n return () => {\n dragselect?.unsubscribe(\"dragmove\", onselect);\n dragselect?.unsubscribe(\"callback\", commit);\n dragselect?.unsubscribe(\"dragstart\", onSelectStart);\n dragselect?.unsubscribe(\"autoscroll\", onscroll);\n };\n }, [dragselect, setSelected]);\n\n useEffect(() => {\n const prevIds = prevSelectables.map((el: HTMLElement) => {\n const wrapper = el.closest(\".main-product-container\");\n return wrapper?.getAttribute(\"product-id\");\n });\n const currentIds = selectables.map((el: HTMLElement) => {\n const wrapper = el.closest(\".main-product-container\");\n return wrapper?.getAttribute(\"product-id\");\n });\n\n if (!dragselect && areaRef.current) {\n if (onSelectCommitted) {\n console.log(\"init dragselect\");\n }\n setDragSelect(\n new DragSelect({\n selectables: selectables as HTMLElement[],\n area: document.getElementById(areaId) as HTMLElement,\n autoScrollSpeed: 15,\n overflowTolerance: { x: 0, y: 0 },\n })\n );\n } else if (\n dragselect &&\n JSON.stringify(prevIds) !== JSON.stringify(currentIds) &&\n !isDragAndDropActive\n ) {\n dragselect.setSettings({\n selectables: selectables as HTMLElement[],\n overflowTolerance: { x: 0, y: 0 },\n });\n setPrevSelectables(selectables);\n }\n }, [selectables, areaRef, disabled, isDragAndDropActive]);\n\n useEffect(() => {\n const mousedownCallback = (e: any) => {\n if (e.target.closest(\"#page_top\")) {\n return;\n }\n if (\n e.target.closest(\".actions-bar-container\") ||\n e.target.closest(\".scroll-to-top-btn\") ||\n e.target.closest(\".paste-button-container\")\n ) {\n return;\n }\n if (!e.target?.closest(\"#\" + areaId)) {\n // dispatcher.setIsCutting(false);\n // dispatcher.setSelectedProducts([]);\n onDispatch(\"setIsCutting\", false);\n onDispatch(\"setSelectedProducts\", []);\n onSelect({});\n }\n };\n\n document.addEventListener(\"mousedown\", mousedownCallback);\n return () => {\n document.removeEventListener(\"mousedown\", mousedownCallback);\n };\n }, []);\n\n useEffect(() => {\n document.querySelectorAll(\".ds-selector-area\").forEach((el: any) => {\n el.style.visibility = isDragAndDropActive ? \"hidden\" : \"visible\";\n });\n }, [isDragAndDropActive]);\n\n useEffect(() => {\n if (dragselect && disabled) {\n dragselect.clearSelection();\n dragselect.setSettings({\n selectables: [],\n area: document.createElement(\"div\"),\n overflowTolerance: { x: 0, y: 0 },\n });\n } else if (dragselect && disabled === false) {\n dragselect.setSettings({\n selectables: selectables as HTMLElement[],\n area: document.getElementById(areaId) as HTMLElement,\n overflowTolerance: { x: 0, y: 0 },\n });\n }\n }, [dragselect, disabled]);\n};\n"]}
|
|
1
|
+
{"version":3,"file":"useDragToSelect.js","sourceRoot":"","sources":["../../src/utils/useDragToSelect.ts"],"names":[],"mappings":"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","sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport DragSelect from \"dragselect\";\ninterface Props {\n areaRef: React.RefObject<HTMLDivElement>;\n selectables: HTMLElement[];\n areaId: string;\n onSelectCommitted?: (selectedIDS: string[]) => void;\n onSelect: (ids: Record<string, number>) => void;\n isDragAndDropActive: boolean;\n disabled?: boolean;\n onDispatch: (key: string, value: any) => void;\n}\nexport const useDragToSelect = ({\n areaRef,\n selectables,\n areaId,\n onSelectCommitted,\n onSelect,\n isDragAndDropActive,\n disabled,\n onDispatch,\n}: Props) => {\n\n const [dragselect, setDragSelect] = React.useState<DragSelect>();\n\n const [prevSelectables, setPrevSelectables] = useState<HTMLElement[]>([]);\n\n const setSelected = useCallback(\n (items: HTMLElement[]) => {\n const selected = items.map((el: HTMLElement) => {\n const wrapper =\n el.closest(\".main-product-container\") ||\n el.querySelector(\".main-product-container\");\n return {\n id: wrapper?.getAttribute(\"product-id\"),\n pos: wrapper?.getAttribute(\"product-index\"),\n };\n });\n const ids: Record<string, number> = {};\n selected.forEach((el: any) => {\n const id = el.id.includes(\"_\")\n ? el.id.split(\"_\")[1]\n : String(el.id);\n ids[id] = parseInt(el.pos);\n });\n\n onSelect(ids);\n },\n [onSelect]\n );\n\n const onselect = (callback_object: any) => {\n if (\n (window as any).isDragAndDropActive ||\n callback_object?.isDragging ||\n !callback_object.event?.target ||\n callback_object.event.target.localName === \"svg\"\n ) {\n return;\n }\n if (\n callback_object.event.target.classList.contains(\n \"material-symbols-outlined\"\n ) ||\n callback_object.event.target.className.includes(\"icon\") ||\n callback_object.event.target.className.includes(\"Tooltip\")\n ) {\n return;\n }\n\n setSelected(callback_object.items);\n };\n\n const commit = (callback_object: any) => {\n onDispatch(\"setIsDragToSelectActive\", false);\n if (\n callback_object?.isDragging ||\n (window as any).isDragAndDropActive\n ) {\n const area = document.getElementById(areaId) as HTMLElement;\n if (area) {\n area.style.userSelect = \"\";\n area.style.webkitUserSelect = \"\";\n }\n dragselect?.clearSelection();\n return;\n }\n if (\n callback_object?.event?.target?.closest?.(\".main-product-container\")\n ) {\n return;\n }\n onselect(callback_object);\n dragselect?.clearSelection();\n };\n\n const onSelectStart = (callback_object: any) => {\n onDispatch(\"setIsDragToSelectActive\", true);\n\n if (\n !callback_object?.isDragging &&\n !(window as any).isDragAndDropActive &&\n callback_object.items.length !== 1\n ) {\n dragselect?.clearSelection();\n }\n if (window.getSelection) {\n window.getSelection()?.removeAllRanges?.();\n } else if (document.getSelection) {\n document.getSelection()?.empty?.();\n }\n const area = document.getElementById(areaId) as HTMLElement;\n if (area) {\n area.style.userSelect = \"none\";\n area.style.webkitUserSelect = \"none\";\n }\n };\n\n const onscroll = (callback_object: any) => {\n if (\n callback_object?.items?.length > 1 &&\n !(window as any).isDragAndDropActive\n ) {\n setSelected(callback_object.items);\n }\n };\n\n useEffect(() => {\n dragselect?.subscribe(\"dragmove\", onselect);\n dragselect?.subscribe(\"callback\", commit);\n dragselect?.subscribe(\"dragstart\", onSelectStart);\n dragselect?.subscribe(\"autoscroll\", onscroll);\n return () => {\n dragselect?.unsubscribe(\"dragmove\", onselect);\n dragselect?.unsubscribe(\"callback\", commit);\n dragselect?.unsubscribe(\"dragstart\", onSelectStart);\n dragselect?.unsubscribe(\"autoscroll\", onscroll);\n };\n }, [dragselect, setSelected]);\n\n useEffect(() => {\n const prevIds = prevSelectables.map((el: HTMLElement) => {\n const wrapper = el.closest(\".main-product-container\");\n return wrapper?.getAttribute(\"product-id\");\n });\n const currentIds = selectables.map((el: HTMLElement) => {\n const wrapper = el.closest(\".main-product-container\");\n return wrapper?.getAttribute(\"product-id\");\n });\n\n if (!dragselect && areaRef.current) {\n if (onSelectCommitted) {\n console.log(\"init dragselect\");\n }\n setDragSelect(\n new DragSelect({\n selectables: selectables as HTMLElement[],\n area: document.getElementById(areaId) as HTMLElement,\n autoScrollSpeed: 15,\n overflowTolerance: { x: 0, y: 0 },\n })\n );\n } else if (\n dragselect &&\n JSON.stringify(prevIds) !== JSON.stringify(currentIds) &&\n !isDragAndDropActive\n ) {\n dragselect.setSettings({\n selectables: selectables as HTMLElement[],\n overflowTolerance: { x: 0, y: 0 },\n });\n setPrevSelectables(selectables);\n }\n }, [selectables, areaRef, disabled, isDragAndDropActive]);\n\n useEffect(() => {\n const mousedownCallback = (e: any) => {\n if (e.target.closest(\"#page_top\")) {\n return;\n }\n if (\n e.target.closest(\".actions-bar-container\") ||\n e.target.closest(\".scroll-to-top-btn\") ||\n e.target.closest(\".paste-button-container\")\n ) {\n return;\n }\n if (!e.target?.closest(\"#\" + areaId)) {\n onDispatch(\"setIsCutting\", false);\n onDispatch(\"setSelectedProducts\", []);\n onSelect({});\n }\n };\n\n document.addEventListener(\"mousedown\", mousedownCallback);\n return () => {\n document.removeEventListener(\"mousedown\", mousedownCallback);\n };\n }, []);\n\n useEffect(() => {\n document.querySelectorAll(\".ds-selector-area\").forEach((el: any) => {\n el.style.visibility = isDragAndDropActive ? \"hidden\" : \"visible\";\n });\n }, [isDragAndDropActive]);\n\n useEffect(() => {\n if (dragselect && disabled) {\n dragselect.clearSelection();\n dragselect.setSettings({\n selectables: [],\n area: document.createElement(\"div\"),\n overflowTolerance: { x: 0, y: 0 },\n });\n } else if (dragselect && disabled === false) {\n dragselect.setSettings({\n selectables: selectables as HTMLElement[],\n area: document.getElementById(areaId) as HTMLElement,\n overflowTolerance: { x: 0, y: 0 },\n });\n }\n }, [dragselect, disabled]);\n};\n"]}
|
package/package.json
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
"files": [
|
|
4
4
|
"lib/**/*"
|
|
5
5
|
],
|
|
6
|
-
"version": "1.0.
|
|
6
|
+
"version": "1.0.22",
|
|
7
7
|
"scripts": {
|
|
8
8
|
"dev": "vite",
|
|
9
9
|
"preview": "vite preview",
|
|
@@ -37,21 +37,21 @@
|
|
|
37
37
|
"moment": "^2.29.1",
|
|
38
38
|
"rc-slider": "^10.1.1",
|
|
39
39
|
"react-datepicker": "^4.10.0",
|
|
40
|
+
"react-select": "^5.2.1",
|
|
41
|
+
"tss-react": "^3.6.0",
|
|
42
|
+
"usehooks-ts": "^2.9.1",
|
|
40
43
|
"react-jss": "^10.6.0",
|
|
41
44
|
"react-loading-skeleton": "^2.2.0",
|
|
42
45
|
"react-multi-carousel": "^2.6.3",
|
|
43
|
-
"react-
|
|
44
|
-
"react-switch": "^6.0.0",
|
|
45
|
-
"tss-react": "^3.6.0",
|
|
46
|
-
"usehooks-ts": "^2.9.1"
|
|
46
|
+
"react-switch": "^6.0.0"
|
|
47
47
|
},
|
|
48
48
|
"devDependencies": {
|
|
49
49
|
"@types/node": "^18.13.0",
|
|
50
|
-
"@types/react": "^
|
|
50
|
+
"@types/react": "^17.0.33",
|
|
51
51
|
"@types/react-datepicker": "^4.10.0",
|
|
52
|
-
"@types/react-dom": "^
|
|
52
|
+
"@types/react-dom": "^17.0.10",
|
|
53
53
|
"@types/react-modal": "^3.13.1",
|
|
54
|
-
"@types/react-
|
|
54
|
+
"@types/react-router-dom": "^5.1.5",
|
|
55
55
|
"@vitejs/plugin-react": "^1.0.7",
|
|
56
56
|
"axios": "^0.24.0",
|
|
57
57
|
"copyfiles": "^2.4.1",
|
|
@@ -61,7 +61,9 @@
|
|
|
61
61
|
"react-datepicker": "^4.10.0",
|
|
62
62
|
"react-dom": "^17.0.2",
|
|
63
63
|
"react-modal": "3.14.4",
|
|
64
|
-
"
|
|
64
|
+
"react-router-dom": "^5.2.0",
|
|
65
|
+
"rimraf": "^3.0.2",
|
|
66
|
+
"typescript": "^4.4.4",
|
|
65
67
|
"vite": "^2.7.2"
|
|
66
68
|
}
|
|
67
69
|
}
|