@hybridcore/ui 1.3.5 → 1.3.7

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

@@ -3,33 +3,33 @@ 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,
+  ontologyId: g,
   appRoles: f,
   templateKeys: e,
   templateType: o,
   securityLevels: l,
-  value: g,
-  minLevel: i = 99,
+  value: S,
+  minLevel: t = 99,
   minLevelId: c,
-  minLevelRoles: t,
-  showError: h,
-  variant: d = "standard",
-  onChange: S
+  minLevelRoles: i,
+  showError: d,
+  variant: h = "outlined",
+  onChange: b
 }) => {
-  const b = C(() => {
-    if (t && t.length > 0) {
-      for (let r of t)
+  const s = C(() => {
+    if (i && i.length > 0) {
+      for (let r of i)
         if (a(r, "SUPER_ADMIN", f))
-          return i;
+          return t;
     }
     if (e && e.length > 0 && o) {
       for (let r of e)
         if (a(
-          `${s}.${o}.${r}`,
+          `${g}.${o}.${r}`,
           "SUPER_ADMIN",
           f
         ))
-          return i;
+          return t;
     }
     if (c && l.length > 0) {
       const r = l.find(
@@ -37,26 +37,25 @@ const p = ({
       );
       if (r) return r.level;
     }
-    return i;
+    return t;
   }, [
-    i,
+    t,
     c,
     l,
-    t,
+    i,
     e,
     o
   ]), x = (r) => {
-    S(r.target.value);
+    b(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 } },
+        variant: h,
+        error: d,
+        sx: { ...h === "outlined" && { mt: 1 } },
         children: [
           /* @__PURE__ */ n(F, { id: "security-level-label", children: "Security Level *" }),
           /* @__PURE__ */ n(
@@ -65,15 +64,15 @@ const p = ({
               label: "Security Level *",
               labelId: "security-level-label",
               id: "demo-simple-select",
-              value: g,
+              value: S,
               onChange: x,
-              children: l.filter((r) => r.level <= b).map((r, u) => /* @__PURE__ */ n($, { value: r.id, children: r.name }, u))
+              children: l.filter((r) => r.level <= s).map((r, u) => /* @__PURE__ */ n($, { value: r.id, children: r.name }, u))
             }
           )
         ]
       }
     ),
-    h && /* @__PURE__ */ n(j, { error: !0, children: "This field is required!" })
+    d && /* @__PURE__ */ n(j, { error: !0, children: "This field is required!" })
   ] });
 };
 export {

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

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

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

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

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

@@ -1,14 +1,22 @@
-import { styled as t, Box as n, Button as a } from "@mui/material";
-const e = t(n)(({ theme: o }) => ({
+import { styled as n, Box as i, Button as a } from "@mui/material";
+const s = n(i)(({ theme: o }) => ({
   position: "relative",
   paddingTop: o.spacing(1),
   width: "100%"
-})), r = t(n)({
-  position: "absolute",
-  top: 0,
-  right: 0,
-  zIndex: 9
-}), d = t(a)(({ theme: o, variant: i }) => ({
+})), p = n(i)(
+  ({ variant: o = "standard", theme: t }) => ({
+    position: "absolute",
+    top: 0,
+    right: 0,
+    zIndex: 9,
+    ...o === "outlined" && {
+      padding: t.spacing(0.25),
+      top: t.spacing(-0.75),
+      right: t.spacing(1),
+      background: t.palette.background.default
+    }
+  })
+), r = n(a)(({ theme: o, variant: t }) => ({
   fontSize: 10,
   padding: "3px 8px",
   minWidth: "auto",
@@ -22,13 +30,13 @@ const e = t(n)(({ theme: o }) => ({
       fontSize: 14
     }
   },
-  ...i === "contained" && {
+  ...t === "contained" && {
     "&:hover": {
       backgroundColor: o.palette.grey[300],
       boxShadow: o.shadows[1]
     }
   }
-})), p = t(n)({
+})), g = n(i)({
   position: "absolute",
   top: 0,
   left: 0,
@@ -41,8 +49,8 @@ const e = t(n)(({ theme: o }) => ({
   }
 });
 export {
-  r as Actions,
-  d as Button,
-  e as Container,
-  p as Modal
+  p as Actions,
+  r as Button,
+  s as Container,
+  g as Modal
 };