@layers-app/shared 0.1.5 → 0.2.1

package/dist/components/SearchFilters/components/DateFilter.js

@@ -0,0 +1,199 @@
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+import { useState as y } from "react";
+import { useTranslation as I } from "react-i18next";
+import { parseDate as w } from "../../../helpers/dates.js";
+import { Popover as m, Pill as j, Flex as A, Select as O, Button as T, Divider as D } from "@mantine/core";
+import { DatePicker as E } from "@mantine/dates";
+import { IconCalendarEvent as l, IconChevronDown as x, IconClockEdit as R } from "@tabler/icons-react";
+import { endOfDay as u, startOfDay as f, subDays as b, format as v } from "date-fns";
+import p from "../SearchFilters.module.css.js";
+const J = ({ setSelectedFilter: i, selectedFilter: s }) => {
+  const { t: a, i18n: F } = I("searchPage"), [o, d] = y([
+    null,
+    null
+  ]), [h, M] = y("updatedAt"), g = () => {
+    i(
+      (e) => ({
+        ...e,
+        range: null
+      })
+    ), d([null, null]);
+  }, P = (e) => {
+    if (s?.range?.createdAtFrom === e.createdAtFrom && s?.range?.createdAtTo === e.createdAtTo)
+      g();
+    else {
+      const c = e.createdAtFrom ? new window.Date(e.createdAtFrom) : null, S = e.createdAtTo ? new window.Date(e.createdAtTo) : null;
+      d([c, S]), i((z) => ({
+        ...z,
+        range: {
+          createdAtFrom: e.createdAtFrom || 0,
+          createdAtTo: e.createdAtTo || 0
+        }
+      }));
+    }
+  }, C = (e) => {
+    const r = [
+      w(e[0]),
+      w(e[1])
+    ];
+    d(r), i(
+      (c) => ({
+        ...c,
+        range: {
+          createdAtFrom: r[0]?.getTime() || 0,
+          createdAtTo: r[1]?.getTime() || 0
+        }
+      })
+    );
+  }, k = [
+    {
+      icon: /* @__PURE__ */ t(l, {}),
+      text: a("searchModal.filters.date.today"),
+      range: {
+        createdAtFrom: f(/* @__PURE__ */ new Date()).getTime(),
+        createdAtTo: u(/* @__PURE__ */ new Date()).getTime()
+      }
+    },
+    {
+      icon: /* @__PURE__ */ t(l, {}),
+      text: a("searchModal.filters.date.last7day"),
+      range: {
+        createdAtFrom: f(b(/* @__PURE__ */ new Date(), 7)).getTime(),
+        createdAtTo: u(/* @__PURE__ */ new Date()).getTime()
+      }
+    },
+    {
+      icon: /* @__PURE__ */ t(l, {}),
+      text: a("searchModal.filters.date.last30day"),
+      range: {
+        createdAtFrom: f(b(/* @__PURE__ */ new Date(), 30)).getTime(),
+        createdAtTo: u(/* @__PURE__ */ new Date()).getTime()
+      }
+    }
+  ];
+  return /* @__PURE__ */ n(
+    m,
+    {
+      transitionProps: { duration: 150, transition: "fade-down" },
+      withArrow: !0,
+      position: "bottom-start",
+      radius: "md",
+      children: [
+        /* @__PURE__ */ t(m.Target, { children: /* @__PURE__ */ n(
+          j,
+          {
+            classNames: {
+              root: p.filterPill,
+              label: p.filterPillLabel
+            },
+            styles: {
+              root: {
+                background: Object.keys(s?.range || {}).length ? "#228BE61F" : "transparent"
+              }
+            },
+            radius: "lg",
+            children: [
+              /* @__PURE__ */ t(l, { size: 16 }),
+              o[0] && o[1] ? `${v(o[0], "dd MMM yyyy")} — ${v(o[1], "dd MMM yyyy")}` : a("searchModal.filters.date.title"),
+              /* @__PURE__ */ t(x, { size: 16 })
+            ]
+          }
+        ) }),
+        /* @__PURE__ */ t(m.Dropdown, { p: 4, w: 270, children: /* @__PURE__ */ n(A, { gap: 0, direction: "column", justify: "start", children: [
+          /* @__PURE__ */ n(A, { justify: "space-between", w: "100%", children: [
+            /* @__PURE__ */ t(
+              O,
+              {
+                comboboxProps: { withinPortal: !1 },
+                w: 150,
+                classNames: {
+                  input: p.selectInput
+                },
+                styles: {
+                  root: {
+                    paddingInline: 0,
+                    paddingLeft: 3
+                  },
+                  input: {
+                    color: "gray",
+                    fontSize: 12
+                  }
+                },
+                defaultValue: h,
+                variant: "unstyled",
+                withCheckIcon: !1,
+                value: h,
+                leftSection: /* @__PURE__ */ t(R, { size: 12 }),
+                rightSection: /* @__PURE__ */ t(x, { size: 12 }),
+                fz: "xs",
+                px: 12,
+                c: "dimmed",
+                onChange: (e) => M((r) => e || r),
+                data: [
+                  {
+                    value: "createdAt",
+                    label: a("searchModal.filters.date.created")
+                  },
+                  {
+                    value: "updatedAt",
+                    label: a("searchModal.filters.date.edited")
+                  }
+                ]
+              }
+            ),
+            /* @__PURE__ */ t(
+              T,
+              {
+                px: 12,
+                w: "30%",
+                variant: "subtle",
+                style: { alignSelf: "flex-start" },
+                onClick: g,
+                children: a("clear")
+              }
+            )
+          ] }),
+          /* @__PURE__ */ t(D, { w: "100%" }),
+          k.map((e) => /* @__PURE__ */ t(
+            T,
+            {
+              h: 32,
+              fullWidth: !0,
+              leftSection: e.icon,
+              variant: "subtle",
+              fz: "sm",
+              color: "system",
+              onClick: () => P(e.range),
+              styles: {
+                section: {
+                  width: 16,
+                  height: 16
+                },
+                inner: {
+                  justifyContent: "flex-start"
+                }
+              },
+              children: e.text
+            },
+            e.text
+          )),
+          /* @__PURE__ */ t(D, { w: "100%" }),
+          /* @__PURE__ */ t(
+            E,
+            {
+              pt: 16,
+              type: "range",
+              value: o,
+              locale: F.language,
+              onChange: C,
+              allowSingleDateInRange: !0
+            }
+          )
+        ] }) })
+      ]
+    }
+  );
+};
+export {
+  J as DateFilter
+};

package/dist/components/SearchFilters/components/SearchHelp.d.ts

@@ -1,3 +1,4 @@
 export declare const openSearchHelpModal: () => void;
 export declare const closeSearchHelpModal: () => void;
-export declare const SearchHelpModal: import('react').MemoExoticComponent<() => import("react/jsx-runtime").JSX.Element>;
+export declare const SearchHelpModal: import("react").MemoExoticComponent<() => import("react/jsx-runtime").JSX.Element>;
+//# sourceMappingURL=SearchHelp.d.ts.map

package/dist/components/SearchFilters/components/SearchHelp.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchHelp.d.ts","sourceRoot":"","sources":["../../../../src/components/SearchFilters/components/SearchHelp.tsx"],"names":[],"mappings":"AAeA,eAAO,MAAM,mBAAmB,YAE/B,CAAC;AAEF,eAAO,MAAM,oBAAoB,YAEhC,CAAC;AA2FF,eAAO,MAAM,eAAe,oFA4B1B,CAAC"}

package/dist/components/SearchFilters/components/SearchHelp.js

@@ -0,0 +1,121 @@
+import { jsx as r, jsxs as t } from "react/jsx-runtime";
+import { memo as i } from "react";
+import { useTranslation as c } from "react-i18next";
+import { CustomKBD as n } from "../../CustomKBD/index.js";
+import { Modal as h, Stack as l, Text as s, Group as m } from "@mantine/core";
+import { create as x } from "zustand";
+const p = x(() => ({
+  opened: !1
+})), g = () => {
+  p.setState({ opened: !0 });
+}, M = () => {
+  p.setState({ opened: !1 });
+}, b = () => {
+  const { t: e } = c("searchPage"), a = [
+    {
+      symbol: '" "',
+      description: e("searchModal.help.exactPhrase"),
+      example: '"exact phrase"'
+    },
+    {
+      symbol: "*",
+      description: e("searchModal.help.wildcard"),
+      example: "report*",
+      w: 20
+    },
+    {
+      symbol: "?",
+      description: e("searchModal.help.singleCharacter"),
+      example: "file_?",
+      w: 20
+    },
+    {
+      symbol: "AND",
+      description: e("searchModal.help.andOperator"),
+      example: "task AND report"
+    },
+    {
+      symbol: "+",
+      description: e("searchModal.help.plusOperator"),
+      example: "task +report",
+      w: 20
+    },
+    {
+      symbol: "OR",
+      description: e("searchModal.help.orOperator"),
+      example: "task OR report",
+      w: 27
+    },
+    {
+      symbol: "/",
+      description: e("searchModal.help.slashOperator"),
+      example: "task /report",
+      w: 20
+    },
+    {
+      symbol: "NOT",
+      description: e("searchModal.help.notOperator"),
+      example: "task NOT report"
+    },
+    {
+      symbol: "-",
+      description: e("searchModal.help.minusOperator"),
+      example: "draft -report",
+      w: 20
+    },
+    {
+      symbol: "( )",
+      description: e("searchModal.help.parentheses"),
+      example: "(task OR project) AND report"
+    }
+  ];
+  return /* @__PURE__ */ t(l, { gap: "sm", children: [
+    /* @__PURE__ */ r(s, { size: "xs", c: "dimmed", children: e("searchModal.help.description") }),
+    /* @__PURE__ */ r(l, { gap: 0, pb: 12, px: 8, children: a.map((o, d) => /* @__PURE__ */ t(m, { h: 48, children: [
+      /* @__PURE__ */ r(
+        n,
+        {
+          bbw: 3,
+          br: 6,
+          miw: o.w,
+          fz: 12,
+          value: o.symbol,
+          c: "system"
+        }
+      ),
+      /* @__PURE__ */ r(s, { size: "sm", style: { flex: 1 }, children: o.description }),
+      /* @__PURE__ */ r(s, { size: "xs", children: o.example })
+    ] }, d)) })
+  ] });
+}, k = i(() => {
+  const { t: e } = c("searchPage"), a = p((o) => o.opened);
+  return /* @__PURE__ */ r(
+    h,
+    {
+      opened: a,
+      title: e("searchModal.help.title"),
+      onClose: M,
+      size: 531,
+      radius: "md",
+      centered: !0,
+      styles: {
+        title: {
+          fontSize: 14
+        },
+        header: {
+          fontSize: 14,
+          padding: "0px 12px 0px 12px"
+        },
+        body: {
+          padding: "0px 12px 0px 12px"
+        }
+      },
+      children: /* @__PURE__ */ r(b, {})
+    }
+  );
+});
+export {
+  k as SearchHelpModal,
+  M as closeSearchHelpModal,
+  g as openSearchHelpModal
+};

package/dist/components/SearchFilters/components/Sort.d.ts

@@ -5,3 +5,4 @@ interface IProps {
 }
 export declare const Sort: ({ setSelectedFilter, selectedFilter }: IProps) => import("react/jsx-runtime").JSX.Element;
 export {};
+//# sourceMappingURL=Sort.d.ts.map

package/dist/components/SearchFilters/components/Sort.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Sort.d.ts","sourceRoot":"","sources":["../../../../src/components/SearchFilters/components/Sort.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,cAAc,EAAa,MAAM,UAAU,CAAC;AAIrD,UAAU,MAAM;IACd,iBAAiB,EAAE,CAAC,KAAK,EAAE,CAAC,IAAI,EAAE,cAAc,KAAK,cAAc,KAAK,IAAI,CAAC;IAC7E,cAAc,CAAC,EAAE,cAAc,CAAC;CACjC;AAQD,eAAO,MAAM,IAAI,GAAI,uCAAuC,MAAM,4CAwIjE,CAAC"}

package/dist/components/SearchFilters/components/Sort.js

@@ -0,0 +1,110 @@
+import { jsx as t, jsxs as m } from "react/jsx-runtime";
+import { useRef as k, useEffect as b } from "react";
+import { useTranslation as C } from "react-i18next";
+import { Popover as d, Pill as P, Flex as g, Button as j } from "@mantine/core";
+import { useDisclosure as A } from "@mantine/hooks";
+import { IconArrowsSort as M, IconChevronDown as E } from "@tabler/icons-react";
+import v from "../SearchFilters.module.css.js";
+const K = ({ setSelectedFilter: p, selectedFilter: x }) => {
+  const { t: r } = C("searchPage"), [u, { close: o, open: w }] = A(!1), n = k(null), y = (e) => {
+    o(), p((s) => {
+      const a = s.sort?.[0], i = a ? Object.keys(a)[0] : null, S = i ? a[i].order : null;
+      return i === e.value && S === e.order ? { ...s, sort: [] } : { ...s, sort: [{ [e.value]: { order: e.order } }] };
+    });
+  };
+  b(() => {
+    const e = (s) => {
+      n.current && !n.current.contains(s.target) && o();
+    };
+    return document.addEventListener("mousedown", e), () => {
+      document.removeEventListener("mousedown", e);
+    };
+  }, [o]);
+  const f = [
+    {
+      value: "name",
+      text: r("searchModal.filters.sort.matches"),
+      order: "desc"
+    },
+    {
+      value: "createdAt",
+      text: r("searchModal.filters.sort.createdNew"),
+      order: "desc"
+    },
+    {
+      value: "createdAt",
+      text: r("searchModal.filters.sort.createdOld"),
+      order: "asc"
+    },
+    {
+      value: "updatedAt",
+      text: r("searchModal.filters.sort.editedNew"),
+      order: "desc"
+    },
+    {
+      value: "updatedAt",
+      text: r("searchModal.filters.sort.editedOld"),
+      order: "asc"
+    }
+  ], l = x?.sort?.[0], h = l ? Object.keys(l)[0] : null, O = l?.[h || ""] ?? null, c = f.find(
+    (e) => e.value === h && e.order === O?.order
+  );
+  return /* @__PURE__ */ t("div", { ref: n, style: { height: 22 }, children: /* @__PURE__ */ m(
+    d,
+    {
+      clickOutsideEvents: ["mouseup", "touchend"],
+      withArrow: !0,
+      position: "bottom-start",
+      radius: "md",
+      opened: u,
+      withinPortal: !1,
+      onClose: o,
+      transitionProps: { duration: 150, transition: "fade-down" },
+      closeOnClickOutside: !0,
+      children: [
+        /* @__PURE__ */ t(d.Target, { children: /* @__PURE__ */ m(
+          P,
+          {
+            onClick: u ? o : w,
+            classNames: {
+              root: v.filterPill,
+              label: v.filterPillLabel
+            },
+            styles: {
+              root: {
+                background: c ? "#228BE61F" : "transparent"
+              }
+            },
+            radius: "lg",
+            children: [
+              /* @__PURE__ */ t(M, { size: 14 }),
+              c ? c.text : r("searchModal.filters.sort.title"),
+              /* @__PURE__ */ t(E, { size: 16 })
+            ]
+          }
+        ) }),
+        /* @__PURE__ */ t(d.Dropdown, { p: 4, children: /* @__PURE__ */ t(g, { direction: "column", justify: "start", children: f.map((e) => /* @__PURE__ */ t(
+          j,
+          {
+            onClick: () => y(e),
+            h: 32,
+            fullWidth: !0,
+            fz: "sm",
+            variant: "subtle",
+            color: "system",
+            styles: {
+              inner: {
+                justifyContent: "flex-start"
+              }
+            },
+            children: e.text
+          },
+          e.text
+        )) }) })
+      ]
+    }
+  ) });
+};
+export {
+  K as Sort
+};

package/dist/components/SearchFilters/components/Type.d.ts

@@ -6,3 +6,4 @@ interface IProps {
 }
 export declare const Type: ({ setSelectedFilter, selectedFilter, allowedTypes, }: IProps) => import("react/jsx-runtime").JSX.Element;
 export {};
+//# sourceMappingURL=Type.d.ts.map

package/dist/components/SearchFilters/components/Type.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Type.d.ts","sourceRoot":"","sources":["../../../../src/components/SearchFilters/components/Type.tsx"],"names":[],"mappings":"AAeA,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAItD,UAAU,MAAM;IACd,iBAAiB,EAAE,CAAC,KAAK,EAAE,CAAC,IAAI,EAAE,cAAc,KAAK,cAAc,KAAK,IAAI,CAAC;IAC7E,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,YAAY,CAAC,EAAE,UAAU,EAAE,CAAC;CAC7B;AAQD,eAAO,MAAM,IAAI,GAAI,sDAIlB,MAAM,4CA+IR,CAAC"}

package/dist/components/SearchFilters/components/Type.js

@@ -0,0 +1,124 @@
+import { jsx as o, jsxs as c } from "react/jsx-runtime";
+import { useRef as x, useEffect as w } from "react";
+import { useTranslation as g } from "react-i18next";
+import { File01Icon as C, CheckmarkSquare03Icon as P, FlowIcon as k, Task02Icon as I, FolderCloudIcon as z } from "@hugeicons/core-free-icons";
+import { HugeiconsIcon as s } from "@hugeicons/react";
+import { Popover as u, Pill as E, Flex as M, FocusTrap as d, Button as O } from "@mantine/core";
+import { useDisclosure as T } from "@mantine/hooks";
+import { IconFileUnknown as b, IconChevronDown as j } from "@tabler/icons-react";
+import m from "../SearchFilters.module.css.js";
+const H = ({
+  setSelectedFilter: p,
+  selectedFilter: n,
+  allowedTypes: h
+}) => {
+  const { t: r } = g("searchPage"), l = x(null), [f, { close: i, open: y }] = T(!1), v = (e) => {
+    if (i(), n?.type === e) {
+      p((t) => ({
+        ...t,
+        type: n.type
+      }));
+      return;
+    }
+    p((t) => ({
+      ...t,
+      type: e
+    }));
+  };
+  w(() => {
+    const e = (t) => {
+      l.current && !l.current.contains(t.target) && i();
+    };
+    return document.addEventListener("mousedown", e), () => {
+      document.removeEventListener("mousedown", e);
+    };
+  }, [i]);
+  const a = [
+    {
+      value: "PAGE",
+      text: r("searchModal.filters.type.page"),
+      icon: /* @__PURE__ */ o(s, { icon: C, size: 16 })
+    },
+    {
+      value: "PROJECT",
+      text: r("searchModal.filters.type.project"),
+      icon: /* @__PURE__ */ o(s, { icon: P, size: 16 })
+    },
+    {
+      value: "FLOW",
+      text: r("searchModal.filters.type.flow"),
+      icon: /* @__PURE__ */ o(s, { icon: k, size: 16 })
+    },
+    {
+      value: "FORM",
+      text: r("searchModal.filters.type.forms"),
+      icon: /* @__PURE__ */ o(s, { icon: I, size: 16 })
+    },
+    {
+      value: "FOLDER",
+      text: r("searchModal.filters.type.cloud"),
+      icon: /* @__PURE__ */ o(s, { icon: z, size: 16 })
+    }
+  ];
+  return /* @__PURE__ */ o("div", { ref: l, style: { height: 22 }, children: /* @__PURE__ */ c(
+    u,
+    {
+      withArrow: !0,
+      position: "bottom-start",
+      radius: "md",
+      transitionProps: { duration: 150, transition: "fade-down" },
+      opened: f,
+      withinPortal: !1,
+      onClose: i,
+      closeOnClickOutside: !0,
+      children: [
+        /* @__PURE__ */ o(u.Target, { children: /* @__PURE__ */ c(
+          E,
+          {
+            onClick: f ? i : y,
+            classNames: {
+              root: m.filterPill,
+              label: m.filterPillLabel
+            },
+            styles: {
+              root: {
+                background: n?.type ? "#228BE61F" : "transparent"
+              }
+            },
+            children: [
+              n?.type ? a.find((e) => e.value === n.type)?.icon : /* @__PURE__ */ o(b, { size: 16 }),
+              n?.type ? a.find((e) => e.value === n.type)?.text : r("searchModal.filters.type.title"),
+              /* @__PURE__ */ o(j, { size: 16 })
+            ]
+          }
+        ) }),
+        /* @__PURE__ */ o(u.Dropdown, { p: 4, children: /* @__PURE__ */ c(M, { direction: "column", justify: "start", gap: 0, children: [
+          /* @__PURE__ */ o(d.InitialFocus, {}),
+          a.filter((e) => h?.includes(e.value)).map((e) => /* @__PURE__ */ o(d, { active: !0, children: /* @__PURE__ */ o(
+            O,
+            {
+              onClick: (t) => {
+                t.stopPropagation(), t.preventDefault(), console.log("called?"), v(e.value);
+              },
+              h: 32,
+              fullWidth: !0,
+              fz: "sm",
+              variant: "subtle",
+              color: "system",
+              leftSection: e.icon,
+              styles: {
+                inner: {
+                  justifyContent: "flex-start"
+                }
+              },
+              children: e.text
+            }
+          ) }, e.value))
+        ] }) })
+      ]
+    }
+  ) });
+};
+export {
+  H as Type
+};

package/dist/components/SearchFilters/types.d.ts

@@ -15,3 +15,4 @@ export type SelectedFilter = {
     type: FilterType;
 };
 export type setSelectedFilterType = (value: (prev: SelectedFilter) => SelectedFilter) => void;
+//# sourceMappingURL=types.d.ts.map

package/dist/components/SearchFilters/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/SearchFilters/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,SAAS,GAAG,KAAK,GAAG,MAAM,CAAC;AACvC,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,QAAQ,GAAG,IAAI,CAAC;AAChF,MAAM,MAAM,UAAU,GAAG;IACvB,CAAC,GAAG,EAAE,MAAM,GAAG;QAAE,KAAK,EAAE,SAAS,CAAA;KAAE,CAAC;CACrC,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG;IACxB,aAAa,EAAE,MAAM,CAAC;IACtB,WAAW,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC3B,IAAI,EAAE,UAAU,EAAE,CAAC;IACnB,KAAK,EAAE,WAAW,GAAG,IAAI,CAAC;IAC1B,IAAI,EAAE,UAAU,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG,CAClC,KAAK,EAAE,CAAC,IAAI,EAAE,cAAc,KAAK,cAAc,KAC5C,IAAI,CAAC"}

package/dist/components/SortableList/SortableList.d.ts

@@ -1,6 +1,7 @@
-import { ReactNode } from 'react';
-import { DragEndEvent, DragStartEvent, UniqueIdentifier } from '@dnd-kit/core';
+import type { ReactNode } from 'react';
+import type { DragEndEvent, DragStartEvent, UniqueIdentifier } from '@dnd-kit/core';
 import { SortableItem } from './components';
+import './SortableList.css';
 interface BaseItem {
     id: UniqueIdentifier;
 }
@@ -18,3 +19,4 @@ export declare namespace SortableList {
     var DragHandle: typeof import("./components").DragHandle;
 }
 export {};
+//# sourceMappingURL=SortableList.d.ts.map

package/dist/components/SortableList/SortableList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SortableList.d.ts","sourceRoot":"","sources":["../../../src/components/SortableList/SortableList.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AASvC,OAAO,KAAK,EACV,YAAY,EACZ,cAAc,EACd,gBAAgB,EACjB,MAAM,eAAe,CAAC;AASvB,OAAO,EAAc,YAAY,EAAE,MAAM,cAAc,CAAC;AAExD,OAAO,oBAAoB,CAAC;AAE5B,UAAU,QAAQ;IAChB,EAAE,EAAE,gBAAgB,CAAC;CACtB;AAED,UAAU,KAAK,CAAC,CAAC,SAAS,QAAQ;IAChC,KAAK,EAAE,CAAC,EAAE,CAAC;IACX,QAAQ,CAAC,KAAK,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC;IAC3B,UAAU,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/C,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,KAAK,IAAI,CAAC;IAC9C,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,IAAI,CAAC;IAC1C,GAAG,CAAC,EAAE,MAAM,CAAC;CACd;AAED,wBAAgB,YAAY,CAAC,CAAC,SAAS,QAAQ,EAAE,EAC/C,KAAK,EACL,QAAQ,EACR,UAAU,EACV,WAAW,EACX,SAAS,EACT,GAAO,GACR,EAAE,KAAK,CAAC,CAAC,CAAC,2CA4CV;yBAnDe,YAAY"}

package/dist/components/SortableList/SortableList.js

@@ -0,0 +1,44 @@
+import { jsx as o } from "react/jsx-runtime";
+import b, { useState as h } from "react";
+import { useSensors as x, useSensor as i, PointerSensor as y, KeyboardSensor as I, DndContext as v } from "@dnd-kit/core";
+import { sortableKeyboardCoordinates as C, SortableContext as E, rectSortingStrategy as H, arrayMove as K } from "@dnd-kit/sortable";
+import { useDisableWindowScrollDuringDrag as L } from "../../hooks/useDisableWindowScroll.js";
+/* empty css                 */
+import { SortableItem as _, DragHandle as j } from "./components/SortableItem/SortableItem.js";
+function s({
+  items: e,
+  onChange: l,
+  renderItem: c,
+  onDragStart: g,
+  onDragEnd: S,
+  gap: f = 8
+}) {
+  const m = x(
+    i(y),
+    i(I, {
+      coordinateGetter: C
+    })
+  ), [D, d] = h(!1);
+  return L(D), /* @__PURE__ */ o(
+    v,
+    {
+      sensors: m,
+      onDragStart: (r) => {
+        d(!0), g?.(r);
+      },
+      onDragEnd: (r) => {
+        const { active: t, over: n } = r;
+        if (d(!1), n && t.id !== n?.id) {
+          const p = e.findIndex(({ id: a }) => a === t.id), u = e.findIndex(({ id: a }) => a === n.id);
+          l(K(e, p, u)), S?.(r);
+        }
+      },
+      children: /* @__PURE__ */ o(E, { items: e, strategy: H, children: /* @__PURE__ */ o("ul", { className: "SortableList", role: "application", style: { gap: f }, children: e.map((r, t) => /* @__PURE__ */ o(b.Fragment, { children: c(r, t) }, r.id)) }) })
+    }
+  );
+}
+s.Item = _;
+s.DragHandle = j;
+export {
+  s as SortableList
+};

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

@@ -1,7 +1,8 @@
-import { PropsWithChildren } from 'react';
-import { UniqueIdentifier } from '@dnd-kit/core';
+import type { PropsWithChildren } from 'react';
+import type { UniqueIdentifier } from '@dnd-kit/core';
 import { ActionIconProps } from '@mantine/core';
 import { IconProps } from '@tabler/icons-react';
+import './SortableItem.css';
 interface Props {
     id: UniqueIdentifier;
 }
@@ -11,3 +12,4 @@ export declare function DragHandle({ iconProps, actionIconProps, }: {
     actionIconProps?: ActionIconProps;
 }): import("react/jsx-runtime").JSX.Element;
 export {};
+//# sourceMappingURL=SortableItem.d.ts.map

package/dist/components/SortableList/components/SortableItem/SortableItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SortableItem.d.ts","sourceRoot":"","sources":["../../../../../src/components/SortableList/components/SortableItem/SortableItem.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAiB,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE9D,OAAO,KAAK,EAEV,gBAAgB,EACjB,MAAM,eAAe,CAAC;AAGvB,OAAO,EAAc,eAAe,EAAE,MAAM,eAAe,CAAC;AAC5D,OAAO,EAAoB,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAElE,OAAO,oBAAoB,CAAC;AAE5B,UAAU,KAAK;IACb,EAAE,EAAE,gBAAgB,CAAC;CACtB;AAcD,wBAAgB,YAAY,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,EAAE,iBAAiB,CAAC,KAAK,CAAC,2CAsCtE;AAED,wBAAgB,UAAU,CAAC,EACzB,SAAS,EACT,eAAe,GAChB,EAAE;IACD,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,eAAe,CAAC,EAAE,eAAe,CAAC;CACnC,2CAwBA"}