@hybridcore/ui 1.0.2 → 1.1.2

package/dist/components/data-security-selectors/security-level/index.js

@@ -0,0 +1,81 @@
+import { jsxs as m, Fragment as A, jsx as n } from "react/jsx-runtime";
+import { useMemo as C } from "react";
+import { FormControl as D, InputLabel as F, Select as I, MenuItem as $, FormHelperText as j } from "@mui/material";
+import { hasDataAccess as a } from "../../access/helpers.js";
+const p = ({
+  ontologyId: s,
+  appRoles: f,
+  templateKeys: e,
+  templateType: o,
+  securityLevels: l,
+  value: g,
+  minLevel: i = 99,
+  minLevelId: c,
+  minLevelRoles: t,
+  showError: h,
+  variant: d = "standard",
+  onChange: S
+}) => {
+  const b = C(() => {
+    if (t && t.length > 0) {
+      for (let r of t)
+        if (a(r, "SUPER_ADMIN", f))
+          return i;
+    }
+    if (e && e.length > 0 && o) {
+      for (let r of e)
+        if (a(
+          `${s}.${o}.${r}`,
+          "SUPER_ADMIN",
+          f
+        ))
+          return i;
+    }
+    if (c && l.length > 0) {
+      const r = l.find(
+        (u) => u.id === c
+      );
+      if (r) return r.level;
+    }
+    return i;
+  }, [
+    i,
+    c,
+    l,
+    t,
+    e,
+    o
+  ]), x = (r) => {
+    S(r.target.value);
+  };
+  return /* @__PURE__ */ m(A, { children: [
+    /* @__PURE__ */ m(
+      D,
+      {
+        fullWidth: !0,
+        variant: d,
+        error: h,
+        size: d === "outlined" ? "small" : "medium",
+        sx: { ...d === "outlined" && { mt: 1 } },
+        children: [
+          /* @__PURE__ */ n(F, { id: "security-level-label", children: "Security Level *" }),
+          /* @__PURE__ */ n(
+            I,
+            {
+              label: "Security Level *",
+              labelId: "security-level-label",
+              id: "demo-simple-select",
+              value: g,
+              onChange: x,
+              children: l.filter((r) => r.level <= b).map((r, u) => /* @__PURE__ */ n($, { value: r.id, children: r.name }, u))
+            }
+          )
+        ]
+      }
+    ),
+    h && /* @__PURE__ */ n(j, { error: !0, children: "This field is required!" })
+  ] });
+};
+export {
+  p as SecurityLevel
+};

package/dist/components/date-time-picker/index.js

@@ -0,0 +1,103 @@
+import { jsxs as l, Fragment as w, jsx as e } from "react/jsx-runtime";
+import { useState as T, useMemo as y } from "react";
+import { Stack as d, IconButton as F, Menu as P, MenuItem as E } from "@mui/material";
+import { DatePicker as B } from "@mui/x-date-pickers";
+import h from "dayjs";
+import f from "lodash";
+import { PatternFormat as I } from "react-number-format";
+import { Schedule as Z } from "@mui/icons-material";
+import $ from "../../hooks/useMenuLogic.js";
+const K = ({
+  value: g,
+  name: Y,
+  minDate: D,
+  variant: M,
+  size: H = "small",
+  minuteStep: m = 30,
+  pattern: S = "##:##:##",
+  onChange: c
+}) => {
+  const r = $(), [o, p] = T(h(g)), v = y(() => {
+    let t = [];
+    for (let n = 0; n < 24; n++)
+      for (let i = 0; i < 60 / m; i++) {
+        const a = f.padStart(n.toString(), 2, "0"), s = f.padStart(
+          (i * m).toString(),
+          2,
+          "0"
+        ), k = `${a}:${s}`;
+        t.push(k);
+      }
+    return t;
+  }, [m]), x = (t) => {
+    t && (p(t), c(t.format("YYYY-MM-DDTHH:mm:ssZ")));
+  }, u = (t) => {
+    const [n, i, a] = t.target.value.split(":");
+    let s = h(o).set("hour", n ?? 0).set("m", i ?? 0).set("s", a ?? 0);
+    p(s), c(s.format("YYYY-MM-DDTHH:mm:ssZ"));
+  }, C = (t) => () => {
+    u({
+      target: {
+        value: t
+      }
+    }), r.action.close();
+  };
+  return /* @__PURE__ */ l(w, { children: [
+    /* @__PURE__ */ l(d, { direction: "row", spacing: 2, children: [
+      /* @__PURE__ */ e(
+        B,
+        {
+          value: o,
+          format: "DD/MM/YYYY",
+          minDate: D,
+          onChange: x,
+          slotProps: {
+            textField: {
+              variant: M,
+              size: H
+            }
+          }
+        }
+      ),
+      /* @__PURE__ */ l(d, { direction: "row", position: "relative", children: [
+        /* @__PURE__ */ e(
+          I,
+          {
+            format: S,
+            allowEmptyFormatting: !0,
+            value: o == null ? void 0 : o.format("HH:mm:ss"),
+            onChange: u,
+            style: {
+              border: 0,
+              borderBottom: "1px solid #333",
+              fontSize: 16,
+              width: 120
+            }
+          }
+        ),
+        /* @__PURE__ */ e(
+          F,
+          {
+            onClick: r.action.open,
+            sx: { position: "absolute", top: -4, right: 0 },
+            children: /* @__PURE__ */ e(Z, {})
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ e(
+      P,
+      {
+        id: "time-menu",
+        anchorEl: r.state.anchorEl,
+        open: r.state.isOpen,
+        onClose: r.action.close,
+        children: v.map((t) => /* @__PURE__ */ e(E, { onClick: C(t), children: t }, t))
+      }
+    ),
+    /* @__PURE__ */ e("input", { type: "hidden", name: Y, value: (o == null ? void 0 : o.format()) ?? "" })
+  ] });
+};
+export {
+  K as DateTimePicker
+};

package/dist/components/geometry-picker/coordinate/index.js

@@ -0,0 +1,93 @@
+import { jsxs as l, Fragment as p, jsx as o } from "react/jsx-runtime";
+import { Button as a, Box as f } from "@mui/material";
+import u from "../map/index.js";
+import C from "../parser/index.js";
+import { g as y, c as g } from "../../../ol-DXmSLlWv.js";
+import { useState as h } from "react";
+import { Add as P } from "@mui/icons-material";
+import { parse as v, convert as x } from "../../map/helpers/wkt.js";
+import T from "lodash";
+function M({
+  mapboxAccessToken: d,
+  value: c = "POINT(0 0)",
+  defaultExtent: r,
+  onCancel: m,
+  onSubmit: s
+}) {
+  const [t, n] = h(
+    r ? y(r) : c
+  );
+  return /* @__PURE__ */ l(p, { children: [
+    /* @__PURE__ */ o(
+      u,
+      {
+        id: "add-coordinate",
+        mapboxAccessToken: d,
+        drawingWKTData: t,
+        disableContextMenu: !0,
+        defaultExtent: r,
+        onDrawEnd: (e) => {
+          const i = g({ features: e });
+          n(i);
+        }
+      }
+    ),
+    /* @__PURE__ */ o(C, { value: t, onChange: (e) => {
+      n(e);
+    } }),
+    /* @__PURE__ */ o(
+      a,
+      {
+        startIcon: /* @__PURE__ */ o(P, {}),
+        fullWidth: !0,
+        sx: { textTransform: "none", mt: 1 },
+        onClick: () => {
+          let e = v(t);
+          if (T.isArray(e))
+            e = {
+              type: "GeometryCollection",
+              geometries: [
+                ...e,
+                {
+                  type: "Point",
+                  coordinates: [0, 0]
+                }
+              ]
+            };
+          else if (e.type === "Point")
+            e = {
+              type: "GeometryCollection",
+              geometries: [
+                e,
+                {
+                  type: "Point",
+                  coordinates: [0, 0]
+                }
+              ]
+            };
+          else if (e.type === "GeometryCollection")
+            e.geometries.push({
+              type: "Point",
+              coordinates: [0, 0]
+            });
+          else {
+            console.log("undefined value geojson type!");
+            return;
+          }
+          const i = x(e);
+          n(i);
+        },
+        children: "Add Coordinate"
+      }
+    ),
+    /* @__PURE__ */ l(f, { display: "flex", justifyContent: "space-between", mt: 3, children: [
+      /* @__PURE__ */ o(a, { color: "primary", onClick: m, children: "Cancel" }),
+      /* @__PURE__ */ o(a, { color: "primary", variant: "contained", onClick: () => {
+        s && s(t);
+      }, children: "Ok" })
+    ] })
+  ] });
+}
+export {
+  M as default
+};

package/dist/components/geometry-picker/edit/index.js

@@ -0,0 +1,71 @@
+import { jsxs as a, jsx as e, Fragment as x } from "react/jsx-runtime";
+import E, { useState as F, useEffect as T } from "react";
+import { Dialog as w, DialogContent as K, DialogActions as j, Button as c, Box as O } from "@mui/material";
+import C from "../map/index.js";
+import { c as P, a as R } from "../../../ol-DXmSLlWv.js";
+import { parse as S } from "../../map/helpers/wkt.js";
+import _ from "lodash";
+import { t as B } from "../../../Source-CnCcu5UP.js";
+function z({
+  value: g,
+  disableActions: y,
+  mapboxAccessToken: s,
+  variant: D = "inline",
+  mapId: f,
+  onCancel: l,
+  onSubmit: u,
+  onChange: d
+}) {
+  const r = E.useRef(null), [t, W] = F(g), m = () => {
+    u && u(t);
+  }, p = (n) => {
+    const o = P({ features: n });
+    W(o), d && d(o);
+  }, k = () => {
+    var o, h, v;
+    const n = S(t);
+    if (!_.isArray(n))
+      if (n.type === "Point") {
+        const i = B(n.coordinates, "EPSG:4326", "EPSG:3857");
+        (o = r.current) == null || o.setCenter(i), (h = r.current) == null || h.setZoomLevel(10);
+      } else {
+        const i = R(t);
+        i && ((v = r.current) == null || v.centerToFeature(i[0], [100, 100, 100, 100]));
+      }
+  };
+  return T(() => (k(), () => {
+  }), []), D === "dialog" ? /* @__PURE__ */ a(w, { open: !0, maxWidth: "sm", fullWidth: !0, onClose: l, children: [
+    /* @__PURE__ */ e(K, { children: /* @__PURE__ */ e(
+      C,
+      {
+        id: f,
+        ref: r,
+        drawingWKTData: t,
+        mapboxAccessToken: s,
+        onDrawEnd: p
+      }
+    ) }),
+    /* @__PURE__ */ a(j, { children: [
+      /* @__PURE__ */ e(c, { color: "inherit", variant: "contained", onClick: l, children: "Cancel" }),
+      /* @__PURE__ */ e(c, { variant: "contained", onClick: m, children: "Ok" })
+    ] })
+  ] }) : /* @__PURE__ */ a(x, { children: [
+    /* @__PURE__ */ e(
+      C,
+      {
+        id: f,
+        ref: r,
+        drawingWKTData: t,
+        mapboxAccessToken: s,
+        onDrawEnd: p
+      }
+    ),
+    !y && /* @__PURE__ */ a(O, { display: "flex", justifyContent: "space-between", mt: 3, children: [
+      /* @__PURE__ */ e(c, { color: "primary", onClick: l, children: "Cancel" }),
+      /* @__PURE__ */ e(c, { color: "primary", variant: "contained", onClick: m, children: "Ok" })
+    ] })
+  ] });
+}
+export {
+  z as default
+};

package/dist/components/geometry-picker/geometry/index.js

@@ -0,0 +1,160 @@
+import { jsxs as r, jsx as n, Fragment as M } from "react/jsx-runtime";
+import D, { useState as k } from "react";
+import { Dialog as R, DialogContent as K, Box as t, Typography as x, DialogActions as F, Button as d } from "@mui/material";
+import P from "../map/index.js";
+import b from "../parser/index.js";
+import { c as _ } from "../../../ol-DXmSLlWv.js";
+import { Button as l } from "../styled.js";
+import { HorizontalRule as j, ShowChart as O, CircleOutlined as I } from "@mui/icons-material";
+import L from "./map-overlay.js";
+function N({
+  mapId: u,
+  mapboxAccessToken: p,
+  value: S,
+  disableActions: T = !1,
+  variant: W = "inline",
+  defaultExtent: C,
+  onCancel: s,
+  onSubmit: m,
+  onChange: v
+}) {
+  const h = D.useRef(null), [i, f] = k(S), [e, B] = k(), y = () => {
+    m && i && m(i);
+  }, g = (o) => {
+    if (o.length > 0) {
+      const c = _({ features: o });
+      f(c);
+    } else f(void 0);
+  }, w = (o) => {
+    f(o);
+  }, a = (o) => () => {
+    var c;
+    B(o), (c = h.current) == null || c.addInteractions(o);
+  };
+  return D.useEffect(() => (i !== void 0 && v !== void 0 && v(i), () => {
+  }), [i]), W === "dialog" ? /* @__PURE__ */ r(R, { open: !0, maxWidth: "sm", fullWidth: !0, onClose: s, children: [
+    /* @__PURE__ */ r(K, { children: [
+      /* @__PURE__ */ r(t, { display: "flex", justifyContent: "space-between", children: [
+        /* @__PURE__ */ n(x, { variant: "subtitle2", children: "Draw On Map" }),
+        /* @__PURE__ */ r(t, { display: "flex", justifyContent: "flex-end", mb: 1, children: [
+          /* @__PURE__ */ n(
+            l,
+            {
+              color: "inherit",
+              startIcon: /* @__PURE__ */ n(j, {}),
+              onClick: a("LineString"),
+              ...e === "LineString" && { variant: "contained" },
+              children: "Draw Line"
+            }
+          ),
+          /* @__PURE__ */ n(
+            l,
+            {
+              color: "inherit",
+              startIcon: /* @__PURE__ */ n(O, {}),
+              onClick: a("Polygon"),
+              ...e === "Polygon" && { variant: "contained" },
+              children: "Draw Polygon"
+            }
+          ),
+          /* @__PURE__ */ n(
+            l,
+            {
+              color: "inherit",
+              startIcon: /* @__PURE__ */ n(I, {}),
+              onClick: a("Circle"),
+              ...e === "Circle" && { variant: "contained" },
+              children: "Draw Circle"
+            }
+          )
+        ] })
+      ] }),
+      /* @__PURE__ */ r(t, { position: "relative", children: [
+        /* @__PURE__ */ n(
+          P,
+          {
+            id: u,
+            ref: h,
+            mapboxAccessToken: p,
+            drawingWKTData: i,
+            defaultExtent: C,
+            onDrawEnd: g
+          }
+        ),
+        /* @__PURE__ */ n(L, { show: e === void 0 })
+      ] }),
+      i !== void 0 && /* @__PURE__ */ n(b, { value: i, onChange: w })
+    ] }),
+    /* @__PURE__ */ r(F, { children: [
+      /* @__PURE__ */ n(d, { color: "inherit", variant: "contained", onClick: s, children: "Cancel" }),
+      /* @__PURE__ */ n(d, { variant: "contained", onClick: y, children: "Ok" })
+    ] })
+  ] }) : /* @__PURE__ */ r(M, { children: [
+    /* @__PURE__ */ r(t, { display: "flex", justifyContent: "space-between", children: [
+      /* @__PURE__ */ n(x, { variant: "subtitle2", children: "Draw On Map" }),
+      /* @__PURE__ */ r(t, { display: "flex", justifyContent: "flex-end", mb: 1, children: [
+        /* @__PURE__ */ n(
+          l,
+          {
+            color: "inherit",
+            startIcon: /* @__PURE__ */ n(j, {}),
+            onClick: a("LineString"),
+            ...e === "LineString" && { variant: "contained" },
+            children: "Draw Line"
+          }
+        ),
+        /* @__PURE__ */ n(
+          l,
+          {
+            color: "inherit",
+            startIcon: /* @__PURE__ */ n(O, {}),
+            onClick: a("Polygon"),
+            ...e === "Polygon" && { variant: "contained" },
+            children: "Draw Polygon"
+          }
+        ),
+        /* @__PURE__ */ n(
+          l,
+          {
+            color: "inherit",
+            startIcon: /* @__PURE__ */ n(I, {}),
+            onClick: a("Circle"),
+            ...e === "Circle" && { variant: "contained" },
+            children: "Draw Circle"
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ r(t, { position: "relative", children: [
+      /* @__PURE__ */ n(
+        P,
+        {
+          id: u,
+          ref: h,
+          mapboxAccessToken: p,
+          drawingWKTData: i,
+          defaultExtent: C,
+          onDrawEnd: g
+        }
+      ),
+      /* @__PURE__ */ n(L, { show: e === void 0 })
+    ] }),
+    i !== void 0 && /* @__PURE__ */ n(b, { value: i, onChange: w }),
+    !T && /* @__PURE__ */ r(t, { display: "flex", justifyContent: "space-between", mt: 3, children: [
+      /* @__PURE__ */ n(d, { color: "primary", onClick: s, children: "Cancel" }),
+      /* @__PURE__ */ n(
+        d,
+        {
+          color: "primary",
+          variant: "contained",
+          onClick: y,
+          disabled: i === void 0,
+          children: "Ok"
+        }
+      )
+    ] })
+  ] });
+}
+export {
+  N as default
+};

package/dist/components/geometry-picker/geometry/map-overlay.js

@@ -0,0 +1,22 @@
+import { jsx as t, Fragment as o, jsxs as a } from "react/jsx-runtime";
+import { Box as e, Typography as i } from "@mui/material";
+const n = "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='544.605'%20height='568.76'%20viewBox='0%200%20544.605%20568.76'%3e%3cg%20id='Group_160607'%20data-name='Group%20160607'%20transform='translate(-1185.395%20-688.133)'%3e%3cpath%20id='Polygon_2'%20data-name='Polygon%202'%20d='M34.5,0,69,59H0Z'%20transform='translate(1661%20688.133)'%20fill='%23fff'/%3e%3cpath%20id='Path_84395'%20data-name='Path%2084395'%20d='M914.667,851.733s-51.2-206.933,182.4-264.533,308.266-52.267,317.867-145.067,0-121.6,0-121.6'%20transform='translate(278%20402.133)'%20fill='none'%20stroke='%23fff'%20stroke-linecap='round'%20stroke-width='5'/%3e%3c/g%3e%3c/svg%3e";
+function d({ show: r }) {
+  return r ? /* @__PURE__ */ a(e, { position: "absolute", top: 0, left: 0, right: 0, bottom: 0, children: [
+    /* @__PURE__ */ t(
+      e,
+      {
+        display: "flex",
+        height: "100%",
+        justifyContent: "center",
+        alignItems: "center",
+        sx: { backgroundColor: "rgba(0,0,0,0.85)" },
+        children: /* @__PURE__ */ t(i, { color: "white", children: "Select drawing type to start drawing" })
+      }
+    ),
+    /* @__PURE__ */ t(e, { position: "absolute", top: 10, right: 0, width: "50%", children: /* @__PURE__ */ t("img", { src: n, width: "75%", height: 220 }) })
+  ] }) : /* @__PURE__ */ t(o, {});
+}
+export {
+  d as default
+};

package/dist/components/geometry-picker/index.js

@@ -0,0 +1,140 @@
+import { jsxs as i, Fragment as m, jsx as o } from "react/jsx-runtime";
+import { AddLocationOutlined as u, DrawOutlined as C, LayersOutlined as a, EditOutlined as f, DeleteOutline as D } from "@mui/icons-material";
+import { Container as I, Actions as A, Button as l } from "./styled.js";
+import S from "./logic.js";
+import k from "./coordinate/index.js";
+import O from "./edit/index.js";
+import y from "./geometry/index.js";
+import b from "./kml/index.js";
+import g from "./wkt/index.js";
+import { IconButton as s, Dialog as E, DialogTitle as W, DialogContent as K } from "@mui/material";
+import { F as L, I as z, a as G } from "../../FormControl-BiAFm76F.js";
+import { I as w } from "../../Input-Bf5G3tFN.js";
+const J = ({
+  label: c,
+  mapboxAccessToken: r,
+  value: e = "",
+  disableAddCoordinate: p = !1,
+  defaultExtent: d,
+  onChange: h
+}) => {
+  const { state: t, action: n } = S({
+    label: c,
+    value: e,
+    mapboxAccessToken: r,
+    onChange: h
+  });
+  return /* @__PURE__ */ i(m, { children: [
+    /* @__PURE__ */ i(I, { children: [
+      /* @__PURE__ */ i(A, { children: [
+        p === !1 && /* @__PURE__ */ o(
+          l,
+          {
+            color: "inherit",
+            startIcon: /* @__PURE__ */ o(u, {}),
+            onClick: n.onAddCoordinate,
+            children: "Add Coordinate"
+          }
+        ),
+        /* @__PURE__ */ o(
+          l,
+          {
+            color: "inherit",
+            startIcon: /* @__PURE__ */ o(C, {}),
+            onClick: n.onDraw,
+            children: "Draw"
+          }
+        ),
+        /* @__PURE__ */ o(
+          l,
+          {
+            color: "inherit",
+            startIcon: /* @__PURE__ */ o(a, {}),
+            onClick: n.onAddKml,
+            children: "Add KML"
+          }
+        ),
+        /* @__PURE__ */ o(
+          l,
+          {
+            color: "inherit",
+            startIcon: /* @__PURE__ */ o(a, {}),
+            onClick: n.onAddWkt,
+            children: "Add WKT"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ i(
+        L,
+        {
+          fullWidth: !0,
+          variant: "standard",
+          contentEditable: !1,
+          onClick: n.onClick,
+          children: [
+            /* @__PURE__ */ o(z, { shrink: !0, children: c }),
+            /* @__PURE__ */ o(
+              w,
+              {
+                value: e,
+                readOnly: !0,
+                endAdornment: /* @__PURE__ */ o(G, { position: "end", children: e !== "" && /* @__PURE__ */ i(m, { children: [
+                  /* @__PURE__ */ o(s, { size: "small", onClick: n.onEdit, children: /* @__PURE__ */ o(f, { fontSize: "small" }) }),
+                  /* @__PURE__ */ o(s, { size: "small", onClick: n.onDelete, children: /* @__PURE__ */ o(D, { fontSize: "small" }) })
+                ] }) })
+              }
+            )
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ i(
+      E,
+      {
+        open: t.modal.isOpen,
+        onClose: n.modal.close,
+        fullWidth: !0,
+        maxWidth: "md",
+        children: [
+          /* @__PURE__ */ o(W, { children: t.content.title }),
+          /* @__PURE__ */ i(K, { children: [
+            t.content.action === "ADD" && t.content.type === "COORDINATE" && /* @__PURE__ */ o(
+              k,
+              {
+                mapboxAccessToken: r,
+                defaultExtent: d,
+                onCancel: n.modal.close,
+                onSubmit: n.onSubmit
+              }
+            ),
+            t.content.action === "ADD" && t.content.type === "GEOMETRY" && /* @__PURE__ */ o(
+              y,
+              {
+                mapId: "map-geo-picker-001",
+                mapboxAccessToken: r,
+                defaultExtent: d,
+                onCancel: n.modal.close,
+                onSubmit: n.onSubmit
+              }
+            ),
+            t.content.action === "ADD" && t.content.type === "KML" && /* @__PURE__ */ o(b, { onCancel: n.modal.close, onSubmit: n.onSubmit }),
+            t.content.action === "ADD" && t.content.type === "WKT" && /* @__PURE__ */ o(g, { onCancel: n.modal.close, onSubmit: n.onSubmit }),
+            t.content.action === "EDIT" && !!e && /* @__PURE__ */ o(
+              O,
+              {
+                mapId: "map-geo-edit-001",
+                value: e,
+                mapboxAccessToken: r,
+                onCancel: n.modal.close,
+                onSubmit: n.onSubmit
+              }
+            )
+          ] })
+        ]
+      }
+    )
+  ] });
+};
+export {
+  J as GeometryPicker
+};