@fast-simon/dashboard-utilities 1.0.96 → 1.0.97

package/dist/components/CheckboxFilter/Checkbox/styles.module.css

@@ -1,143 +1,143 @@
-.fsCheckbox {
-    display: flex;
-    position: relative;
-    padding: 0 5px 0 0;
-    margin-top: 5px;
-    margin-bottom: 5px;
-    cursor: pointer;
-    -webkit-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
-    font-family: Arial, serif;
-    animation: growDown 300ms ease forwards;
-    align-items: center;
-}
-
-.fsCheckbox input {
-    position: fixed;
-    opacity: 0;
-    cursor: pointer;
-    height: 0;
-    width: 0;
-}
-
-.checkmark {
-    min-height: 16px;
-    min-width: 16px;
-    background-color: #eee;
-    margin-right: 10px;
-}
-
-.fsCheckbox:hover input ~ .checkmark {
-    background-color: #d00202cf;
-}
-
-.fsCheckbox input:checked ~ .checkmark {
-    background-color: white;
-}
-
-.fsCheckbox input:checked ~ .checkmark:after {
-    display: block;
-}
-
-.fsCheckboxx .checkmark:after {
-    left: 5px;
-    width: 4px;
-    height: 9px;
-    border: solid white;
-    border-width: 0 2px 2px 0;
-    -webkit-transform: rotate(45deg);
-    -ms-transform: rotate(45deg);
-    transform: rotate(45deg);
-}
-.fsSelectedCheckboxTrue{}
-.fsSelectedCheckboxFalse{}
-
-    @keyframes growDown {
-        0% {
-            transform: scaleY(0)
-        }
-        80% {
-            transform: scaleY(1.1)
-        }
-        100% {
-            transform: scaleY(1)
-        }
-    }
-
-    .checkbox {
-        display: flex;
-        position: relative;
-        padding: 0 5px 0 0;
-        margin-top: 5px;
-        margin-bottom: 5px;
-        cursor: pointer;
-        -webkit-user-select: none;
-        -moz-user-select: none;
-        -ms-user-select: none;
-        user-select: none;
-        font-family: Arial, serif;
-        animation: growDown 300ms ease forwards;
-        align-items: center;
-    }
-
-    .checkbox .checkboxLabel {
-        align-self: start;
-        text-transform: capitalize;
-        display: flex;
-        line-height: 20px;
-        align-items: center;
-        margin-top: 2px;
-        width: -webkit-fill-available;
-        justify-content: space-between;
-        text-overflow: ellipsis;
-        overflow: hidden;
-    }
-
-    .checkbox input {
-        position: fixed;
-        opacity: 0;
-        cursor: pointer;
-        height: 0;
-        width: 0;
-    }
-
-    .checkmark {
-        min-height: 16px;
-        min-width: 16px;
-        background-color: #eee;
-        margin-right: 10px;
-    }
-
-    .checkbox:hover input ~ .checkmark {
-        background-color: #ccc;
-    }
-
-    .checkbox input:checked ~ .checkmark {
-        background-color: #000000;
-    }
-
-    .checkmark:after {
-        content: "";
-        position: absolute;
-        display: none;
-    }
-
-    .checkbox input:checked ~ .checkmark:after {
-        display: block;
-    }
-
-    .checkbox .checkmark:after {
-        left: 5px;
-        width: 4px;
-        height: 9px;
-        border: solid white;
-        border-width: 0 2px 2px 0;
-        -webkit-transform: rotate(45deg);
-        -ms-transform: rotate(45deg);
-        transform: rotate(45deg);
-    }
-:global(.modal-mobile-filters .fs-serp-filter-count, .modal-mobile-filters .fsSerpCheckmark) {
-        display: none;
+.fsCheckbox {
+    display: flex;
+    position: relative;
+    padding: 0 5px 0 0;
+    margin-top: 5px;
+    margin-bottom: 5px;
+    cursor: pointer;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    font-family: Arial, serif;
+    animation: growDown 300ms ease forwards;
+    align-items: center;
+}
+
+.fsCheckbox input {
+    position: fixed;
+    opacity: 0;
+    cursor: pointer;
+    height: 0;
+    width: 0;
+}
+
+.checkmark {
+    min-height: 16px;
+    min-width: 16px;
+    background-color: #eee;
+    margin-right: 10px;
+}
+
+.fsCheckbox:hover input ~ .checkmark {
+    background-color: #d00202cf;
+}
+
+.fsCheckbox input:checked ~ .checkmark {
+    background-color: white;
+}
+
+.fsCheckbox input:checked ~ .checkmark:after {
+    display: block;
+}
+
+.fsCheckboxx .checkmark:after {
+    left: 5px;
+    width: 4px;
+    height: 9px;
+    border: solid white;
+    border-width: 0 2px 2px 0;
+    -webkit-transform: rotate(45deg);
+    -ms-transform: rotate(45deg);
+    transform: rotate(45deg);
+}
+.fsSelectedCheckboxTrue{}
+.fsSelectedCheckboxFalse{}
+
+    @keyframes growDown {
+        0% {
+            transform: scaleY(0)
+        }
+        80% {
+            transform: scaleY(1.1)
+        }
+        100% {
+            transform: scaleY(1)
+        }
+    }
+
+    .checkbox {
+        display: flex;
+        position: relative;
+        padding: 0 5px 0 0;
+        margin-top: 5px;
+        margin-bottom: 5px;
+        cursor: pointer;
+        -webkit-user-select: none;
+        -moz-user-select: none;
+        -ms-user-select: none;
+        user-select: none;
+        font-family: Arial, serif;
+        animation: growDown 300ms ease forwards;
+        align-items: center;
+    }
+
+    .checkbox .checkboxLabel {
+        align-self: start;
+        text-transform: capitalize;
+        display: flex;
+        line-height: 20px;
+        align-items: center;
+        margin-top: 2px;
+        width: -webkit-fill-available;
+        justify-content: space-between;
+        text-overflow: ellipsis;
+        overflow: hidden;
+    }
+
+    .checkbox input {
+        position: fixed;
+        opacity: 0;
+        cursor: pointer;
+        height: 0;
+        width: 0;
+    }
+
+    .checkmark {
+        min-height: 16px;
+        min-width: 16px;
+        background-color: #eee;
+        margin-right: 10px;
+    }
+
+    .checkbox:hover input ~ .checkmark {
+        background-color: #ccc;
+    }
+
+    .checkbox input:checked ~ .checkmark {
+        background-color: #000000;
+    }
+
+    .checkmark:after {
+        content: "";
+        position: absolute;
+        display: none;
+    }
+
+    .checkbox input:checked ~ .checkmark:after {
+        display: block;
+    }
+
+    .checkbox .checkmark:after {
+        left: 5px;
+        width: 4px;
+        height: 9px;
+        border: solid white;
+        border-width: 0 2px 2px 0;
+        -webkit-transform: rotate(45deg);
+        -ms-transform: rotate(45deg);
+        transform: rotate(45deg);
+    }
+:global(.modal-mobile-filters .fs-serp-filter-count, .modal-mobile-filters .fsSerpCheckmark) {
+        display: none;
     }

package/dist/components/CheckboxFilter/CheckboxFilter.d.ts

@@ -1,6 +1,6 @@
-import { Facet } from "@fast-simon/utilities";
-interface Props {
-    facet: Facet;
-}
-export declare function CheckboxFilter({ facet }: Props): import("react/jsx-runtime").JSX.Element;
-export {};
+import { Facet } from "@fast-simon/utilities";
+interface Props {
+    facet: Facet;
+}
+export declare function CheckboxFilter({ facet }: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/CheckboxFilter/CheckboxFilter.js

@@ -1,9 +1,9 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Checkbox } from "./Checkbox/Checkbox";
-export function CheckboxFilter({ facet }) {
-    const handleChange = (e) => {
-        console.log();
-    };
-    return (_jsx(Checkbox, Object.assign({ isChecked: true, ariaLabel: facet.name }, { children: _jsx("span", Object.assign({ className: "filters-option-text fs-serp-filter-text" }, { children: facet.name })) })));
-}
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Checkbox } from "./Checkbox/Checkbox";
+export function CheckboxFilter({ facet }) {
+    const handleChange = (e) => {
+        console.log();
+    };
+    return (_jsx(Checkbox, Object.assign({ isChecked: true, ariaLabel: facet.name }, { children: _jsx("span", Object.assign({ className: "filters-option-text fs-serp-filter-text" }, { children: facet.name })) })));
+}
 //# sourceMappingURL=CheckboxFilter.js.map

package/dist/components/CheckboxFilter/CheckboxFilter.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxFilter.js","sourceRoot":"","sources":["../../../src/components/CheckboxFilter/CheckboxFilter.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAC,QAAQ,EAAC,MAAM,qBAAqB,CAAC;AAM7C,MAAM,UAAU,cAAc,CAAC,EAAC,KAAK,EAAQ;IACzC,MAAM,YAAY,GAAG,CAAC,CAAM,EAAE,EAAE;QAC5B,OAAO,CAAC,GAAG,EAAE,CAAC;IAClB,CAAC,CAAA;IACD,OAAO,CACH,KAAC,QAAQ,kBAAC,SAAS,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,CAAC,IAAI,gBAC5C,6BAAM,SAAS,EAAC,yCAAyC,gBAAE,KAAK,CAAC,IAAI,IAAQ,IACtE,CAClB,CAAA;AAED,CAAC","sourcesContent":["import React from 'react';\r\nimport {Facet} from \"@fast-simon/utilities\";\r\nimport classes from './styles.module.css';\r\nimport {Checkbox} from \"./Checkbox/Checkbox\";\r\n\r\ninterface Props {\r\n    facet: Facet;\r\n}\r\n\r\nexport function CheckboxFilter({facet}: Props) {\r\n    const handleChange = (e: any) => {\r\n        console.log();\r\n    }\r\n    return (\r\n        <Checkbox isChecked={true} ariaLabel={facet.name}>\r\n            <span className=\"filters-option-text fs-serp-filter-text\">{facet.name}</span>\r\n        </Checkbox>\r\n)\r\n\r\n}"]}
+{"version":3,"file":"CheckboxFilter.js","sourceRoot":"","sources":["../../../src/components/CheckboxFilter/CheckboxFilter.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAC,QAAQ,EAAC,MAAM,qBAAqB,CAAC;AAM7C,MAAM,UAAU,cAAc,CAAC,EAAC,KAAK,EAAQ;IACzC,MAAM,YAAY,GAAG,CAAC,CAAM,EAAE,EAAE;QAC5B,OAAO,CAAC,GAAG,EAAE,CAAC;IAClB,CAAC,CAAA;IACD,OAAO,CACH,KAAC,QAAQ,kBAAC,SAAS,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,CAAC,IAAI,gBAC5C,6BAAM,SAAS,EAAC,yCAAyC,gBAAE,KAAK,CAAC,IAAI,IAAQ,IACtE,CAClB,CAAA;AAED,CAAC","sourcesContent":["import React from 'react';\nimport {Facet} from \"@fast-simon/utilities\";\nimport classes from './styles.module.css';\nimport {Checkbox} from \"./Checkbox/Checkbox\";\n\ninterface Props {\n    facet: Facet;\n}\n\nexport function CheckboxFilter({facet}: Props) {\n    const handleChange = (e: any) => {\n        console.log();\n    }\n    return (\n        <Checkbox isChecked={true} ariaLabel={facet.name}>\n            <span className=\"filters-option-text fs-serp-filter-text\">{facet.name}</span>\n        </Checkbox>\n)\n\n}"]}

package/dist/components/CheckboxFilter/styles.module.css

@@ -1,5 +1,5 @@
-.fs-switch-left-margin{
-    margin-left: 10px;
-}
-.fs-serp-filter-text {}
+.fs-switch-left-margin{
+    margin-left: 10px;
+}
+.fs-serp-filter-text {}
 .filters-option-text {}

package/dist/components/DragAndDrop/DndContextWrapper.d.ts

@@ -1,19 +1,19 @@
-import React, { ReactNode } from "react";
-import { EditorProduct } from "../../@types/editorProduct";
-export interface DndContextWrapperProps {
-    children: ReactNode;
-    onDragStart: ({ active }: {
-        active: any;
-    }) => void;
-    onDragEnd: ({ over, active }: {
-        over: any;
-        active: any;
-    }) => void;
-    activeId: string | null;
-    findActiveProduct: (activeId: string) => EditorProduct | undefined;
-    selectedProductIds: Record<string, number>;
-    ProductCardComponent: React.ComponentType<any>;
-    SelectCardComponent: React.ComponentType<any>;
-}
-declare const DndContextWrapper: ({ children, onDragStart, onDragEnd, activeId, selectedProductIds, findActiveProduct, ProductCardComponent, SelectCardComponent }: DndContextWrapperProps) => import("react/jsx-runtime").JSX.Element;
-export default DndContextWrapper;
+import React, { ReactNode } from "react";
+import { EditorProduct } from "../../@types/editorProduct";
+export interface DndContextWrapperProps {
+    children: ReactNode;
+    onDragStart: ({ active }: {
+        active: any;
+    }) => void;
+    onDragEnd: ({ over, active }: {
+        over: any;
+        active: any;
+    }) => void;
+    activeId: string | null;
+    findActiveProduct: (activeId: string) => EditorProduct | undefined;
+    selectedProductIds: Record<string, number>;
+    ProductCardComponent: React.ComponentType<any>;
+    SelectCardComponent: React.ComponentType<any>;
+}
+declare const DndContextWrapper: ({ children, onDragStart, onDragEnd, activeId, selectedProductIds, findActiveProduct, ProductCardComponent, SelectCardComponent }: DndContextWrapperProps) => import("react/jsx-runtime").JSX.Element;
+export default DndContextWrapper;

package/dist/components/DragAndDrop/DndContextWrapper.js

@@ -1,31 +1,31 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { closestCorners, defaultDropAnimationSideEffects, DndContext, DragOverlay, MouseSensor, useSensor, useSensors, } from "@dnd-kit/core";
-import { isEditorProduct } from "../../@types/editorProduct";
-const DndContextWrapper = ({ children, onDragStart, onDragEnd, activeId, selectedProductIds, findActiveProduct, ProductCardComponent, SelectCardComponent }) => {
-    const sensors = useSensors(useSensor(MouseSensor, {
-        activationConstraint: {
-            distance: 10,
-        },
-    }));
-    return (_jsx(_Fragment, { children: _jsxs(DndContext, Object.assign({ sensors: sensors, collisionDetection: closestCorners, onDragStart: onDragStart, onDragEnd: onDragEnd }, { children: [children, _jsx(DragOverlay, Object.assign({ style: {
-                        boxShadow: "0 25px 50px -12px rgb(0 0 0 / 0.25)",
-                        zIndex: 9999999,
-                    }, dropAnimation: {
-                        easing: "cubic-bezier(0.22, 1, 0.36, 1)",
-                        keyframes: (parameters) => [{}],
-                        sideEffects: defaultDropAnimationSideEffects({
-                            styles: {
-                                active: {
-                                    opacity: "0.5",
-                                },
-                            },
-                        }),
-                    } }, { children: activeId &&
-                        (Object.keys(selectedProductIds).length <= 1 &&
-                            isEditorProduct(findActiveProduct(activeId)) ? (_jsx(ProductCardComponent, { isSelected: false, onClick: () => { }, product: findActiveProduct(activeId) })) : (_jsx(SelectCardComponent, { numSelected: (Object.keys(selectedProductIds).length) +
-                                (activeId in selectedProductIds
-                                    ? 0
-                                    : 1) }))) }))] })) }));
-};
-export default DndContextWrapper;
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { closestCorners, defaultDropAnimationSideEffects, DndContext, DragOverlay, MouseSensor, useSensor, useSensors, } from "@dnd-kit/core";
+import { isEditorProduct } from "../../@types/editorProduct";
+const DndContextWrapper = ({ children, onDragStart, onDragEnd, activeId, selectedProductIds, findActiveProduct, ProductCardComponent, SelectCardComponent }) => {
+    const sensors = useSensors(useSensor(MouseSensor, {
+        activationConstraint: {
+            distance: 10,
+        },
+    }));
+    return (_jsx(_Fragment, { children: _jsxs(DndContext, Object.assign({ sensors: sensors, collisionDetection: closestCorners, onDragStart: onDragStart, onDragEnd: onDragEnd }, { children: [children, _jsx(DragOverlay, Object.assign({ style: {
+                        boxShadow: "0 25px 50px -12px rgb(0 0 0 / 0.25)",
+                        zIndex: 9999999,
+                    }, dropAnimation: {
+                        easing: "cubic-bezier(0.22, 1, 0.36, 1)",
+                        keyframes: (parameters) => [{}],
+                        sideEffects: defaultDropAnimationSideEffects({
+                            styles: {
+                                active: {
+                                    opacity: "0.5",
+                                },
+                            },
+                        }),
+                    } }, { children: activeId &&
+                        (Object.keys(selectedProductIds).length <= 1 &&
+                            isEditorProduct(findActiveProduct(activeId)) ? (_jsx(ProductCardComponent, { isSelected: false, onClick: () => { }, product: findActiveProduct(activeId) })) : (_jsx(SelectCardComponent, { numSelected: (Object.keys(selectedProductIds).length) +
+                                (activeId in selectedProductIds
+                                    ? 0
+                                    : 1) }))) }))] })) }));
+};
+export default DndContextWrapper;
 //# sourceMappingURL=DndContextWrapper.js.map

package/dist/components/DragAndDrop/DndContextWrapper.js.map

@@ -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;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"]}
+{"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\";\nimport {\n  closestCorners,\n  defaultDropAnimationSideEffects,\n  DndContext,\n  DragOverlay,\n  MouseSensor,\n  useSensor,\n  useSensors,\n} from \"@dnd-kit/core\";\nimport { EditorProduct } from \"../../@types/editorProduct\";\nimport { isEditorProduct } from \"../../@types/editorProduct\";\n\nexport interface DndContextWrapperProps {\n  children: ReactNode;\n  onDragStart: ({active}: {active: any}) => void;\n  onDragEnd: ({over, active}: {over: any, active: any}) => void;\n  activeId: string | null;\n  findActiveProduct: (activeId: string) => EditorProduct | undefined;\n  selectedProductIds: Record<string, number>;\n  ProductCardComponent: React.ComponentType<any>;\n  SelectCardComponent: React.ComponentType<any>;\n}\n\nconst DndContextWrapper = ({\n                               children,\n                               onDragStart,\n                               onDragEnd,\n                               activeId,\n                               selectedProductIds,\n                               findActiveProduct,\n                               ProductCardComponent,\n                               SelectCardComponent\n} : DndContextWrapperProps) => {\n\n    const sensors = useSensors(\n      useSensor(MouseSensor, {\n        activationConstraint: {\n          distance: 10,\n        },\n      }),\n    );\n\n  return (\n      <>\n        <DndContext\n            sensors={sensors}\n            collisionDetection={closestCorners}\n            onDragStart={onDragStart}\n            onDragEnd={onDragEnd}\n          >\n            {children}\n            <DragOverlay\n              style={{\n                boxShadow: \"0 25px 50px -12px rgb(0 0 0 / 0.25)\",\n                zIndex: 9999999,\n              }}\n              dropAnimation={{\n                easing: \"cubic-bezier(0.22, 1, 0.36, 1)\",\n                keyframes: (parameters) => [{}],\n                sideEffects: defaultDropAnimationSideEffects({\n                  styles: {\n                    active: {\n                      opacity: \"0.5\",\n                    },\n                  },\n                }),\n              }}\n            >\n              {activeId &&\n                (Object.keys(selectedProductIds).length <= 1 &&\n                isEditorProduct(findActiveProduct(activeId)) ? (\n                    <ProductCardComponent\n                        isSelected={false}\n                        onClick={() => {}}\n                        product={findActiveProduct(activeId)! as EditorProduct}\n                      />\n                ) : (\n                     <SelectCardComponent\n                        numSelected={\n                          (Object.keys(selectedProductIds).length) +\n                          (activeId in selectedProductIds\n                            ? 0\n                            : 1)\n                        }\n                  />\n                ))}\n            </DragOverlay>\n          </DndContext>\n      </>\n  );\n\n};\n\nexport default DndContextWrapper;\n"]}

package/dist/components/DragAndDrop/Droppable.d.ts

@@ -1,7 +1,7 @@
-import { ReactNode } from "react";
-interface DroppableProps {
-    id: string;
-    children: ReactNode;
-}
-declare const Droppable: ({ id, children }: DroppableProps) => import("react/jsx-runtime").JSX.Element;
-export default Droppable;
+import { ReactNode } from "react";
+interface DroppableProps {
+    id: string;
+    children: ReactNode;
+}
+declare const Droppable: ({ id, children }: DroppableProps) => import("react/jsx-runtime").JSX.Element;
+export default Droppable;

package/dist/components/DragAndDrop/Droppable.js

@@ -1,10 +1,10 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useDroppable } from "@dnd-kit/core";
-const Droppable = ({ id, children }) => {
-    const { setNodeRef } = useDroppable({
-        id: id,
-    });
-    return (_jsx("div", Object.assign({ ref: setNodeRef, style: { width: '100%', height: '100%', position: 'relative' } }, { children: children })));
-};
-export default Droppable;
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useDroppable } from "@dnd-kit/core";
+const Droppable = ({ id, children }) => {
+    const { setNodeRef } = useDroppable({
+        id: id,
+    });
+    return (_jsx("div", Object.assign({ ref: setNodeRef, style: { width: '100%', height: '100%', position: 'relative' } }, { children: children })));
+};
+export default Droppable;
 //# sourceMappingURL=Droppable.js.map

package/dist/components/DragAndDrop/Droppable.js.map

@@ -1 +1 @@
-{"version":3,"file":"Droppable.js","sourceRoot":"","sources":["../../../src/components/DragAndDrop/Droppable.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,YAAY,EAAC,MAAM,eAAe,CAAC;AAQ3C,MAAM,SAAS,GAAG,CAAC,EAAC,EAAE,EAAE,QAAQ,EAAiB,EAAE,EAAE;IACjD,MAAM,EAAC,UAAU,EAAC,GAAG,YAAY,CAAC;QAC9B,EAAE,EAAE,EAAE;KACT,CAAC,CAAC;IAEH,OAAO,CACH,4BAAK,GAAG,EAAE,UAAU,EAAE,KAAK,EAAE,EAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,UAAU,EAAC,gBAC7E,QAAQ,IACP,CACT,CAAC;AACN,CAAC,CAAA;AAED,eAAe,SAAS,CAAA","sourcesContent":["import {useDroppable} from \"@dnd-kit/core\";\r\nimport { ReactNode } from \"react\";\r\n\r\ninterface DroppableProps {\r\n    id: string;\r\n    children: ReactNode;\r\n}\r\n\r\nconst Droppable = ({id, children}: DroppableProps) => {\r\n    const {setNodeRef} = useDroppable({\r\n        id: id,\r\n    });\r\n\r\n    return (\r\n        <div ref={setNodeRef} style={{width: '100%', height: '100%', position: 'relative'}}>\r\n            {children}\r\n        </div>\r\n    );\r\n}\r\n\r\nexport default Droppable"]}
+{"version":3,"file":"Droppable.js","sourceRoot":"","sources":["../../../src/components/DragAndDrop/Droppable.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,YAAY,EAAC,MAAM,eAAe,CAAC;AAQ3C,MAAM,SAAS,GAAG,CAAC,EAAC,EAAE,EAAE,QAAQ,EAAiB,EAAE,EAAE;IACjD,MAAM,EAAC,UAAU,EAAC,GAAG,YAAY,CAAC;QAC9B,EAAE,EAAE,EAAE;KACT,CAAC,CAAC;IAEH,OAAO,CACH,4BAAK,GAAG,EAAE,UAAU,EAAE,KAAK,EAAE,EAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,UAAU,EAAC,gBAC7E,QAAQ,IACP,CACT,CAAC;AACN,CAAC,CAAA;AAED,eAAe,SAAS,CAAA","sourcesContent":["import {useDroppable} from \"@dnd-kit/core\";\nimport { ReactNode } from \"react\";\n\ninterface DroppableProps {\n    id: string;\n    children: ReactNode;\n}\n\nconst Droppable = ({id, children}: DroppableProps) => {\n    const {setNodeRef} = useDroppable({\n        id: id,\n    });\n\n    return (\n        <div ref={setNodeRef} style={{width: '100%', height: '100%', position: 'relative'}}>\n            {children}\n        </div>\n    );\n}\n\nexport default Droppable"]}

package/dist/components/DragAndDrop/SortableItem.d.ts

@@ -1,13 +1,13 @@
-import { ReactNode } from "react";
-import { Narrow } from "@fast-simon/utilities";
-interface Props {
-    id: string;
-    children: ReactNode;
-    narrow: Narrow;
-    searchWithinResultsQuery?: string;
-    style?: Record<string, any>;
-    cssClass?: string | undefined;
-    index?: string;
-}
-export declare function SortableItem({ id, children, searchWithinResultsQuery, style, narrow, cssClass, index, }: Props): import("react/jsx-runtime").JSX.Element;
-export {};
+import { ReactNode } from "react";
+import { Narrow } from "@fast-simon/utilities";
+interface Props {
+    id: string;
+    children: ReactNode;
+    narrow: Narrow;
+    searchWithinResultsQuery?: string;
+    style?: Record<string, any>;
+    cssClass?: string | undefined;
+    index?: string;
+}
+export declare function SortableItem({ id, children, searchWithinResultsQuery, style, narrow, cssClass, index, }: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/DragAndDrop/SortableItem.js

@@ -1,39 +1,39 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useSortable } from "@dnd-kit/sortable";
-import { CSS } from "@dnd-kit/utilities";
-import classes from "./styles.module.css";
-import clsx from "clsx";
-export function SortableItem({ id, children, searchWithinResultsQuery, style, narrow, cssClass, index, }) {
-    var _a;
-    const { attributes, listeners, setNodeRef, transform, transition, isDragging, isOver, isSorting, activeIndex, overIndex, active, over, } = useSortable({
-        id,
-        animateLayoutChanges: () => true,
-        disabled: !!searchWithinResultsQuery || !!Object.keys(narrow).length,
-    });
-    const activeId = active === null || active === void 0 ? void 0 : active.id;
-    const overId = over === null || over === void 0 ? void 0 : over.id;
-    const noOverlay = activeId === overId ||
-        (overId === null || overId === void 0 ? void 0 : overId.includes("_")) ||
-        overIndex === -1 ||
-        activeId.startsWith("related");
-    let isAfter = true;
-    if (overIndex < activeIndex || ((_a = active === null || active === void 0 ? void 0 : active.id) === null || _a === void 0 ? void 0 : _a.includes("_"))) {
-        isAfter = false;
-    }
-    let opacity = isDragging ? 0.5 : 1;
-    let zIndex = isDragging ? 10 : 0;
-    const combinedStyle = {
-        transition: transition,
-        transform: isSorting ? undefined : CSS.Translate.toString(transform),
-        zIndex: zIndex,
-        opacity: opacity,
-        width: "100%",
-        height: "100%",
-        outlineOffset: "2px",
-        borderRadius: "8px",
-        border: "1px solid #e0e0e0",
-        display: "flex",
-    };
-    return (_jsx("div", Object.assign({ "product-id": id, "product-index": index, className: cssClass, style: Object.assign({ display: "flex", position: "relative", height: "100%", width: "100%" }, style) }, { children: _jsx("div", Object.assign({ style: combinedStyle, className: clsx(isOver && !isDragging && !noOverlay && classes.over, isAfter ? classes.after : classes.before), ref: setNodeRef }, attributes, listeners, { children: children })) })));
-}
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useSortable } from "@dnd-kit/sortable";
+import { CSS } from "@dnd-kit/utilities";
+import classes from "./styles.module.css";
+import clsx from "clsx";
+export function SortableItem({ id, children, searchWithinResultsQuery, style, narrow, cssClass, index, }) {
+    var _a;
+    const { attributes, listeners, setNodeRef, transform, transition, isDragging, isOver, isSorting, activeIndex, overIndex, active, over, } = useSortable({
+        id,
+        animateLayoutChanges: () => true,
+        disabled: !!searchWithinResultsQuery || !!Object.keys(narrow).length,
+    });
+    const activeId = active === null || active === void 0 ? void 0 : active.id;
+    const overId = over === null || over === void 0 ? void 0 : over.id;
+    const noOverlay = activeId === overId ||
+        (overId === null || overId === void 0 ? void 0 : overId.includes("_")) ||
+        overIndex === -1 ||
+        activeId.startsWith("related");
+    let isAfter = true;
+    if (overIndex < activeIndex || ((_a = active === null || active === void 0 ? void 0 : active.id) === null || _a === void 0 ? void 0 : _a.includes("_"))) {
+        isAfter = false;
+    }
+    let opacity = isDragging ? 0.5 : 1;
+    let zIndex = isDragging ? 10 : 0;
+    const combinedStyle = {
+        transition: transition,
+        transform: isSorting ? undefined : CSS.Translate.toString(transform),
+        zIndex: zIndex,
+        opacity: opacity,
+        width: "100%",
+        height: "100%",
+        outlineOffset: "2px",
+        borderRadius: "8px",
+        border: "1px solid #e0e0e0",
+        display: "flex",
+    };
+    return (_jsx("div", Object.assign({ "product-id": id, "product-index": index, className: cssClass, style: Object.assign({ display: "flex", position: "relative", height: "100%", width: "100%" }, style) }, { children: _jsx("div", Object.assign({ style: combinedStyle, className: clsx(isOver && !isDragging && !noOverlay && classes.over, isAfter ? classes.after : classes.before), ref: setNodeRef }, attributes, listeners, { children: children })) })));
+}
 //# sourceMappingURL=SortableItem.js.map