@hybridcore/ui 1.6.0 → 1.6.2

package/dist/components/raster-grid-map/components/controls/index.js

@@ -1,12 +1,10 @@
 import { jsxs as i, jsx as o } from "react/jsx-runtime";
 import { Container as t, Button as r } from "./styled.js";
 import { I as s, a as l } from "../../../../IconPlus-yPkff_Vj.js";
-function m({ mapRef: n }) {
-  return n ? /* @__PURE__ */ i(t, { children: [
-    /* @__PURE__ */ o(r, { onClick: n.zoomIn, children: /* @__PURE__ */ o(s, { size: 18 }) }),
-    /* @__PURE__ */ o(r, { onClick: n.zoomOut, children: /* @__PURE__ */ o(l, { size: 18 }) })
-  ] }) : null;
-}
+const m = ({ mapRef: n }) => n ? /* @__PURE__ */ i(t, { children: [
+  /* @__PURE__ */ o(r, { onClick: n.zoomIn, children: /* @__PURE__ */ o(s, { size: 18 }) }),
+  /* @__PURE__ */ o(r, { onClick: n.zoomOut, children: /* @__PURE__ */ o(l, { size: 18 }) })
+] }) : null;
 export {
   m as Controls
 };

package/dist/components/raster-grid-map/components/legend/index.js

@@ -3,12 +3,10 @@ import { Typography as l } from "@mui/material";
 import { FlexCol as e } from "../../../flex-col/index.js";
 import { FlexRow as p } from "../../../flex-row/index.js";
 import { Container as t, ColorBox as x } from "./styled.js";
-function a({ heatScale: m }) {
-  return !m || m.bins.length === 0 ? null : /* @__PURE__ */ o(t, { children: /* @__PURE__ */ o(e, { children: m.bins.map((r, n) => /* @__PURE__ */ i(p, { gap: 0.5, children: [
-    /* @__PURE__ */ o(x, { bgcolor: r.color }),
-    /* @__PURE__ */ o(l, { variant: "overline", children: r.min !== r.max ? r.min + "-" + r.max : r.min })
-  ] }, n)) }) });
-}
+const a = ({ heatScale: m }) => !m || m.bins.length === 0 ? null : /* @__PURE__ */ o(t, { children: /* @__PURE__ */ o(e, { children: m.bins.map((r, n) => /* @__PURE__ */ i(p, { gap: 0.5, children: [
+  /* @__PURE__ */ o(x, { bgcolor: r.color }),
+  /* @__PURE__ */ o(l, { variant: "overline", children: r.min !== r.max ? r.min + "-" + r.max : r.min })
+] }, n)) }) });
 export {
   a as Legend
 };

package/dist/components/raster-grid-map/index.js

@@ -2,15 +2,15 @@ import { jsxs as n, jsx as e } from "react/jsx-runtime";
 import { Typography as d } from "@mui/material";
 import { useEffect as l } from "react";
 import { u as h } from "../../index.esm-BLLrbTzY.js";
-import { M as u } from "../../index-kCJ_Zvl8.js";
+import { Map as u } from "../map/index.js";
 import { Controls as R } from "./components/controls/index.js";
 import { Legend as M } from "./components/legend/index.js";
 import { useRasterGridMapLogic as g } from "./logic.js";
 import { RasterGridMapRoot as z, RasterGridMapHeader as G, RasterGridMapContent as x } from "./styled.js";
-function D(o) {
-  const { refs: r, state: m, actions: i, ownerState: t, sx: f, other: p } = g(o), { width: a, height: s, ref: c } = h();
+const D = (o) => {
+  const { refs: r, state: m, actions: i, ownerState: t, sx: p, other: f } = g(o), { width: a, height: s, ref: c } = h();
   return l(() => (a && s && i.onMapResize(), () => {
-  }), [a, s]), /* @__PURE__ */ n(z, { ownerState: t, sx: f, ref: c, ...p, children: [
+  }), [a, s]), /* @__PURE__ */ n(z, { ownerState: t, sx: p, ref: c, ...f, children: [
     /* @__PURE__ */ e(G, { ownerState: t, children: /* @__PURE__ */ e(d, { variant: "h3", children: o.title }) }),
     /* @__PURE__ */ n(x, { ownerState: t, children: [
       /* @__PURE__ */ e(
@@ -32,7 +32,7 @@ function D(o) {
       /* @__PURE__ */ e(R, { mapRef: r.mapRef.current })
     ] })
   ] });
-}
+};
 export {
   D as RasterGridMap
 };

package/dist/components/scroll-drag/index.js

@@ -0,0 +1,22 @@
+import { jsx as s } from "react/jsx-runtime";
+import e from "react";
+import { useScrollDragLogic as c } from "./logic.js";
+import { ScrollDragRoot as t } from "./styled.js";
+const M = (o) => {
+  const { refs: n, actions: r } = c(o);
+  return /* @__PURE__ */ s(
+    t,
+    {
+      ref: n.container,
+      onMouseDown: r.onMouseDown,
+      onMouseUp: r.onMouseUp,
+      onMouseMove: r.onMouseMove,
+      sx: o.sx,
+      className: "scroll-drag",
+      children: e.Children.map(o.children, (l) => e.Children.only(l))
+    }
+  );
+};
+export {
+  M as ScrollDrag
+};

package/dist/components/scroll-drag/logic.js

@@ -0,0 +1,39 @@
+import { useThemeProps as g } from "@mui/material";
+import { useRef as o } from "react";
+const w = (l) => {
+  const s = { ...g({ props: l, name: "HCScrollDrag" }) }, r = o(null), n = o({
+    isScrolling: !1,
+    clientX: 0,
+    clientY: 0,
+    scrollX: 0,
+    scrollY: 0,
+    maxX: 0,
+    maxY: 0
+  });
+  return {
+    refs: { container: r },
+    state: { ownerState: s },
+    actions: { onMouseDown: (c) => {
+      r.current && (n.current = {
+        ...n.current,
+        isScrolling: !0,
+        clientX: c.clientX,
+        clientY: c.clientY,
+        maxX: r.current.scrollWidth - r.current.clientWidth,
+        maxY: r.current.scrollHeight - r.current.clientHeight
+      }, r.current.style.cursor = "grabbing");
+    }, onMouseUp: () => {
+      r.current && (n.current = { ...n.current, isScrolling: !1 }, r.current.style.cursor = "grab");
+    }, onMouseMove: (c) => {
+      if (!r.current) return;
+      const { clientX: i, scrollX: u, clientY: a, scrollY: X, maxX: Y, maxY: f } = n.current;
+      if (n.current.isScrolling) {
+        const t = u - c.clientX + i, e = X - c.clientY + a;
+        t >= 0 && t <= Y && (r.current.scrollLeft = t, n.current.scrollX = t), e >= 0 && e <= f && (r.current.scrollTop = e, n.current.scrollY = e), n.current.clientX = c.clientX, n.current.clientY = c.clientY;
+      }
+    } }
+  };
+};
+export {
+  w as useScrollDragLogic
+};

package/dist/components/scroll-drag/styled.js

@@ -0,0 +1,17 @@
+import { styled as o, Box as r } from "@mui/material";
+const e = o(r, {
+  name: "HCScrollDrag",
+  slot: "root"
+})({
+  position: "relative",
+  height: "100%",
+  width: "100%",
+  overflow: "auto",
+  cursor: "grab",
+  "& *": {
+    userSelect: "none"
+  }
+});
+export {
+  e as ScrollDragRoot
+};

package/dist/components/search-input/logic.js

@@ -1,43 +1,45 @@
-import { useThemeProps as g } from "@mui/material";
-import { useState as C } from "react";
-const D = (r) => {
-  const i = g({ props: r, name: "HCSearchInput" }), {
-    defaultValue: t = "",
-    label: u = "Search",
-    placeholder: c,
-    disableLabel: h = !1,
-    fullWidth: d = !1,
-    variant: f = "outlined",
-    size: m = "small",
-    iconSize: p = "medium",
-    sx: S,
-    onChange: n,
-    onSubmit: a
-  } = i, [o, l] = C(t), b = (e) => {
-    l(e.target.value), n && n(e.target.value);
-  }, s = (e) => {
-    a && a(o);
+import { useThemeProps as V } from "@mui/material";
+import { useState as x } from "react";
+const L = (u) => {
+  const d = V({ props: u, name: "HCSearchInput" }), {
+    defaultValue: o = "",
+    value: l,
+    label: f = "Search",
+    placeholder: h,
+    disableLabel: m = !1,
+    fullWidth: p = !1,
+    variant: S = "outlined",
+    size: v = "small",
+    iconSize: C = "medium",
+    sx: b,
+    onChange: e,
+    onSubmit: n
+  } = d, a = l !== void 0, [g, s] = x(o), r = a ? l : g, w = (t) => {
+    const c = t.target.value;
+    a || s(c), e && e(c);
+  }, i = (t) => {
+    n && n(r);
   };
   return {
     refs: {},
     state: { ownerState: {
-      defaultValue: t,
-      label: u,
-      placeholder: c,
-      disableLabel: h,
-      fullWidth: d,
-      variant: f,
-      size: m,
-      iconSize: p,
-      sx: S
-    }, value: o },
-    actions: { handleChange: b, handleSubmit: s, handleKeyDown: (e) => {
-      e.key === "Enter" && s();
+      defaultValue: o,
+      label: f,
+      placeholder: h,
+      disableLabel: m,
+      fullWidth: p,
+      variant: S,
+      size: v,
+      iconSize: C,
+      sx: b
+    }, value: r },
+    actions: { handleChange: w, handleSubmit: i, handleKeyDown: (t) => {
+      t.key === "Enter" && i();
     }, handleClear: () => {
-      l(""), a && a("");
+      a || s(""), e && e(""), n && n("");
     } }
   };
 };
 export {
-  D as useSearchInputLogic
+  L as useSearchInputLogic
 };

package/dist/components/simple-pivot-table/index.js

@@ -1,14 +1,14 @@
 import { jsxs as l, jsx as e } from "react/jsx-runtime";
-import { Typography as r, Divider as s, TableContainer as S, Table as u, TableBody as x, TableRow as y, TableCell as b } from "@mui/material";
+import { Typography as r, Divider as p, TableContainer as S, Table as x, TableBody as y, TableRow as u, TableCell as b } from "@mui/material";
 import { useSimplePivotTableLogic as P } from "./logic.js";
 import { SimplePivotTableRoot as C, SimplePivotTableHeader as F, SimplePivotTableContent as N, SimplePivotTableFooter as j } from "./styled.js";
-function z(n) {
+const z = (n) => {
   const {
     title: d,
     dimensions: m,
     values: c,
-    data: h,
-    aggregations: p,
+    data: s,
+    aggregations: h,
     formatCell: v,
     ownerState: a,
     sx: T,
@@ -18,8 +18,8 @@ function z(n) {
     description: n.description,
     dimensions: m,
     values: c,
-    data: h,
-    aggregations: p
+    data: s,
+    aggregations: h
   };
   return /* @__PURE__ */ l(
     C,
@@ -30,9 +30,9 @@ function z(n) {
       ...g,
       children: [
         /* @__PURE__ */ e(F, { ownerState: a, children: /* @__PURE__ */ e(r, { sx: { paddingLeft: "0.5rem" }, variant: "h3", children: d }) }),
-        /* @__PURE__ */ e(s, {}),
-        /* @__PURE__ */ e(N, { ownerState: a, children: /* @__PURE__ */ e(S, { children: /* @__PURE__ */ e(u, { size: "small", children: /* @__PURE__ */ e(x, { children: h.map((i, o) => /* @__PURE__ */ l(
-          y,
+        /* @__PURE__ */ e(p, {}),
+        /* @__PURE__ */ e(N, { ownerState: a, children: /* @__PURE__ */ e(S, { children: /* @__PURE__ */ e(x, { size: "small", children: /* @__PURE__ */ e(y, { children: s.map((i, o) => /* @__PURE__ */ l(
+          u,
           {
             hover: !0,
             sx: { "&:last-child td": { borderBottom: 0 } },
@@ -51,8 +51,8 @@ function z(n) {
           },
           o
         )) }) }) }) }),
-        /* @__PURE__ */ e(s, {}),
-        /* @__PURE__ */ e(j, { ownerState: a, children: p.map(({ label: i, value: o }) => /* @__PURE__ */ l(r, { variant: "caption", color: "text.disabled", children: [
+        /* @__PURE__ */ e(p, {}),
+        /* @__PURE__ */ e(j, { ownerState: a, children: h.map(({ label: i, value: o }) => /* @__PURE__ */ l(r, { variant: "caption", color: "text.disabled", children: [
           i,
           ": ",
           o
@@ -60,7 +60,7 @@ function z(n) {
       ]
     }
   );
-}
+};
 export {
   z as SimplePivotTable
 };