@hybridcore/ui 1.3.6 → 1.4.0

package/dist/components/{data-management/instance-form → instance-form}/index.js

@@ -1,42 +1,42 @@
-import { jsx as a, jsxs as f, Fragment as P } from "react/jsx-runtime";
+import { jsx as a, jsxs as h, Fragment as D } from "react/jsx-runtime";
 import m from "react";
-import W from "lodash";
-import { useForm as M, Controller as s } from "react-hook-form";
-import { getNestedChildrenFromMap as N } from "../../../utils/ontology.js";
-import { i as G, d as K } from "../../../utils-Bq0ye5vf.js";
-import { ConditionalWrapper as O } from "../../conditional-wrapper/index.js";
-import { Container as U } from "../../container/index.js";
-import { TextField as h, FormGroup as j, FormControl as q, InputLabel as H, Select as Y, MenuItem as J, FormControlLabel as L, Checkbox as S, Box as T, Button as g } from "@mui/material";
-import { TreeSelect as $ } from "../../tree-select/index.js";
-import Q from "./components/policy-list/index.js";
-import X from "./components/variables/index.js";
-import { DisseminationList as z } from "../../data-security-selectors/dissemination-list/index.js";
-import { SecurityLevel as Z } from "../../data-security-selectors/security-level/index.js";
-const ee = {
+import P from "lodash";
+import { useForm as W, Controller as s } from "react-hook-form";
+import { getNestedChildrenFromMap as M } from "../../utils/ontology.js";
+import { i as N, d as G } from "../../utils-Bq0ye5vf.js";
+import { ConditionalWrapper as K } from "../conditional-wrapper/index.js";
+import { Container as O } from "../container/index.js";
+import { TextField as v, FormGroup as U, FormControl as j, InputLabel as q, Select as H, MenuItem as Y, FormControlLabel as L, Checkbox as V, Box as p, Button as y } from "@mui/material";
+import { TreeSelect as J } from "../tree-select/index.js";
+import $ from "./components/policy-list/index.js";
+import Q from "./components/variables/index.js";
+import { DisseminationList as X } from "../data-security-selectors/dissemination-list/index.js";
+import { SecurityLevel as z } from "../data-security-selectors/security-level/index.js";
+const Z = {
   alg: "A256GCM",
   ext: !0,
   k: "_El6rHQxC5E7NdO5DiMDITjF7f65wrlaJmFVagVE9Ic",
   key_ops: ["encrypt", "decrypt"],
   kty: "oct"
-}, te = [
+}, ee = [
   "IMAGE",
   "VIDEO",
   "TEXT",
   "BINARY",
   "OTHER"
 ];
-function ae(e, F) {
+function te(e, S) {
   const {
     register: C,
     handleSubmit: E,
     control: d,
-    formState: { errors: V },
+    formState: { errors: F },
     getValues: x,
-    setValue: p,
+    setValue: b,
     reset: k
-  } = M({
+  } = W({
     defaultValues: e.defaultValues
-  }), [R, _] = m.useState([]), [v, I] = m.useState(), [ne, w] = m.useState(0), B = m.useMemo(() => {
+  }), [R, _] = m.useState([]), [g, I] = m.useState(), [ae, w] = m.useState(0), A = m.useMemo(() => {
     const t = [];
     return e.mappedTemplates.forEach((n) => {
       n.creatable || t.push(String(n.id));
@@ -44,131 +44,131 @@ function ae(e, F) {
   }, [e.mappedTemplates]);
   m.useEffect(() => {
     (async () => {
-      let t = { ...e.defaultValues };
-      const n = e.mappedTemplates.get(t.templateId);
+      const t = { ...e.defaultValues }, n = e.mappedTemplates.get(t.templateId);
       if (n) {
-        const l = n.properties.filter(
-          (r) => r.privacyPreservationMethod === "ENCRYPTION"
+        const i = n.properties.filter(
+          (l) => l.privacyPreservationMethod === "ENCRYPTION"
         );
-        if (l.length > 0)
-          for (let r = 0; r < l.length; r++) {
-            const i = l[r], o = W.get(t, `variables.${i.propertyId}`);
+        if (i.length > 0)
+          for (let l = 0; l < i.length; l++) {
+            const r = i[l], o = P.get(t, `variables.${r.propertyId}`);
             if (o && e.keyAuth) {
-              const c = await G(ee), u = await K(c, o);
-              u.data && (p(`variables.${i.propertyId}`, u.data), w((b) => b + 1));
+              const c = await N(Z), u = await G(c, o);
+              u.data && (b(`variables.${r.propertyId}`, u.data), w((f) => f + 1));
             }
           }
       }
     })();
   }, [e.defaultValues, e.mappedTemplates, e.keyAuth]);
-  const y = () => {
+  const T = () => {
     const t = x("templateId");
-    v && I(void 0);
-    const n = N(e.mappedTemplates);
+    g && I(void 0);
+    const n = M(e.mappedTemplates);
     _(n);
-    for (let l of e.mappedTemplates.values())
-      if (l.id === t) {
-        I(l);
+    for (const i of e.mappedTemplates.values())
+      if (i.id === t) {
+        I(i);
         break;
       }
   };
-  m.useImperativeHandle(F, () => ({
+  m.useImperativeHandle(S, () => ({
     resetForm() {
       k({
         title: "",
         description: "",
         templateId: 0,
         variables: {}
-      }), y();
+      }), T();
     },
     setFormValue(t, n) {
-      p(t, n);
+      b(t, n);
     },
     getFormValue(t) {
       return x(t);
     }
-  })), m.useEffect(() => (y(), () => {
+  })), m.useEffect(() => (T(), () => {
   }), [e.mappedTemplates]), m.useEffect(() => {
-    e.onSelectedTemplateChange && e.onSelectedTemplateChange(v);
-  }, [v]);
-  const A = () => {
+    e.onSelectedTemplateChange && e.onSelectedTemplateChange(g);
+  }, [g]);
+  const B = () => {
     if (e.onCancel) {
       e.onCancel();
       return;
     }
   };
   return /* @__PURE__ */ a(
-    O,
+    K,
     {
       condition: e.variant === void 0 || e.variant === "inline",
       wrapper: (t) => /* @__PURE__ */ a(
-        U,
+        O,
         {
           disableHeader: !0,
           sx: { position: "relative", overflow: "visible" },
           children: t
         }
       ),
-      children: /* @__PURE__ */ f("form", { onSubmit: E(e.onSubmit), children: [
+      children: /* @__PURE__ */ h("form", { onSubmit: E(e.onSubmit), children: [
         /* @__PURE__ */ a(
-          h,
+          v,
           {
             label: "Title *",
-            variant: "standard",
+            variant: e.inputVariant,
             fullWidth: !0,
             sx: { mb: 2 },
             ...C("title", { required: !0 }),
-            ...V.title && {
+            ...F.title && {
               helperText: "This field is required!",
               error: !0
             }
           }
         ),
         /* @__PURE__ */ a(
-          h,
+          v,
           {
             label: "Description",
-            variant: "standard",
+            variant: e.inputVariant,
             fullWidth: !0,
             multiline: !0,
             sx: { mb: 2 },
             ...C("description")
           }
         ),
-        /* @__PURE__ */ a(j, { sx: { mb: 2 }, children: /* @__PURE__ */ a(
+        /* @__PURE__ */ a(U, { sx: { mb: 2 }, children: /* @__PURE__ */ a(
           s,
           {
             name: "templateId",
             control: d,
             render: ({ field: { value: t, onChange: n } }) => {
               if (e.disableTemplateChange) {
-                const l = e.mappedTemplates.get(t);
+                const i = t ? e.mappedTemplates.get(t) : void 0;
                 return /* @__PURE__ */ a(
-                  h,
+                  v,
                   {
                     label: "Template",
-                    variant: "standard",
+                    variant: e.inputVariant,
                     fullWidth: !0,
                     disabled: !0,
-                    value: l == null ? void 0 : l.name,
+                    value: i == null ? void 0 : i.name,
                     InputLabelProps: { shrink: !0 }
                   }
                 );
               }
               return /* @__PURE__ */ a(
-                $,
+                J,
                 {
                   label: "Template",
                   data: R,
                   selected: t === 0 ? "" : [String(t)],
-                  disabled: B,
-                  onChange: (l, r) => {
-                    const i = {
+                  disabled: A,
+                  variant: e.inputVariant,
+                  onChange: (i, l) => {
+                    const r = {
                       target: {
-                        value: r ? Number(l) : 0
+                        value: l ? Number(i) : 0
                       }
                     };
-                    n(i), y();
+                    n(r), T();
                   }
                 }
               );
@@ -180,26 +180,29 @@ function ae(e, F) {
           {
             name: "aliasList",
             control: d,
-            render: ({ field: { value: t, onChange: n, ...l } }) => /* @__PURE__ */ a(
-              h,
-              {
-                label: "Alias List",
-                variant: "standard",
-                fullWidth: !0,
-                value: t,
-                sx: { mb: 2 },
-                helperText: "Add list values with the comma (,) separated string",
-                onChange: (i) => {
-                  const u = {
-                    target: {
-                      value: i.target.value.split(",").map((b) => b.trimStart())
-                    }
-                  };
-                  n(u);
-                },
-                ...l
-              }
-            )
+            render: ({ field: { value: t, onChange: n, ...i } }) => {
+              const l = (r) => {
+                const u = {
+                  target: {
+                    value: r.target.value.split(",").map((f) => f.trimStart())
+                  }
+                };
+                n(u);
+              };
+              return /* @__PURE__ */ a(
+                v,
+                {
+                  label: "Alias List",
+                  variant: e.inputVariant,
+                  fullWidth: !0,
+                  value: t,
+                  sx: { mb: 2 },
+                  helperText: "Add list values with the comma (,) separated string",
+                  onChange: l,
+                  ...i
+                }
+              );
+            }
           }
         ),
         "appliedPolicies" in e.defaultValues && /* @__PURE__ */ a(
@@ -208,10 +211,10 @@ function ae(e, F) {
             name: "appliedPolicies",
             control: d,
             render: ({ field: { value: t, onChange: n } }) => /* @__PURE__ */ a(
-              Q,
+              $,
               {
                 policyList: e.policyList,
-                value: t,
+                value: t || void 0,
                 onChange: n
               }
             )
@@ -223,46 +226,50 @@ function ae(e, F) {
             name: "variables",
             control: d,
             render: ({ field: { value: t, onChange: n } }) => /* @__PURE__ */ a(
-              X,
+              Q,
               {
-                template: v,
+                template: g,
                 value: t,
-                mapboxAccessToken: "",
+                mapboxAccessToken: e.mapboxAccessToken,
+                variant: e.inputVariant,
                 onChange: n
               }
             )
           }
         ),
-        "fileInBase64" in e.defaultValues && /* @__PURE__ */ f(P, { children: [
+        "fileInBase64" in e.defaultValues && /* @__PURE__ */ h(D, { children: [
           /* @__PURE__ */ a(
             s,
             {
               name: "fileInBase64",
               control: d,
-              render: ({ field: { value: t, onChange: n, ...l } }) => /* @__PURE__ */ a(
-                h,
-                {
-                  type: "file",
-                  label: "File to Upload",
-                  variant: "standard",
-                  fullWidth: !0,
-                  sx: { mb: 2 },
-                  helperText: "Select a file to upload",
-                  InputLabelProps: { shrink: !0 },
-                  onChange: (i) => {
-                    if (i.target.files) {
-                      const o = new FileReader();
-                      o.onload = async (u) => {
-                        const D = u.target.result.split("base64,")[1];
-                        n(D);
-                      };
-                      const c = i.target.files[0];
-                      p("originalFileName", c.name), p("contentType", c.type), o.readAsDataURL(c);
-                    }
-                  },
-                  ...l
-                }
-              )
+              render: ({ field: { onChange: t, ...n } }) => {
+                const i = (l) => {
+                  if (l.target.files) {
+                    const r = new FileReader();
+                    r.onload = async (c) => {
+                      const f = c.target.result.split("base64,")[1];
+                      t(f);
+                    };
+                    const o = l.target.files[0];
+                    b("originalFileName", o.name), b("contentType", o.type), r.readAsDataURL(o);
+                  }
+                };
+                return /* @__PURE__ */ a(
+                  v,
+                  {
+                    type: "file",
+                    label: "File to Upload",
+                    variant: e.inputVariant,
+                    fullWidth: !0,
+                    sx: { mb: 2 },
+                    helperText: "Select a file to upload",
+                    InputLabelProps: { shrink: !0 },
+                    onChange: i,
+                    ...n
+                  }
+                );
+              }
             }
           ),
           /* @__PURE__ */ a(
@@ -270,25 +277,35 @@ function ae(e, F) {
             {
               name: "type",
               control: d,
-              render: ({ field: { value: t, onChange: n } }) => /* @__PURE__ */ f(
-                q,
-                {
-                  fullWidth: !0,
-                  sx: {
-                    mb: 2
-                  },
-                  variant: "standard",
-                  children: [
-                    /* @__PURE__ */ a(H, { children: "Type" }),
-                    /* @__PURE__ */ a(Y, { value: t, onChange: (r) => {
-                      const {
-                        target: { value: i }
-                      } = r;
-                      n(i);
-                    }, children: te.map((r) => /* @__PURE__ */ a(J, { value: r, children: r }, r)) })
-                  ]
-                }
-              )
+              render: ({ field: { value: t, onChange: n } }) => {
+                const i = (l) => {
+                  const {
+                    target: { value: r }
+                  } = l;
+                  n(r);
+                };
+                return /* @__PURE__ */ h(
+                  j,
+                  {
+                    fullWidth: !0,
+                    sx: {
+                      mb: 2
+                    },
+                    variant: e.inputVariant,
+                    children: [
+                      /* @__PURE__ */ a(q, { children: "Type" }),
+                      /* @__PURE__ */ a(
+                        H,
+                        {
+                          value: t ? [t] : "",
+                          onChange: i,
+                          children: ee.map((l) => /* @__PURE__ */ a(Y, { value: l, children: l }, l))
+                        }
+                      )
+                    ]
+                  }
+                );
+              }
             }
           ),
           /* @__PURE__ */ a(
@@ -299,7 +316,7 @@ function ae(e, F) {
                 {
                   name: "redacted",
                   control: d,
-                  render: ({ field: { value: t, ...n } }) => /* @__PURE__ */ a(S, { checked: !!t, ...n })
+                  render: ({ field: { value: t, ...n } }) => /* @__PURE__ */ a(V, { checked: !!t, ...n })
                 }
               ),
               label: "Redacted",
@@ -314,7 +331,7 @@ function ae(e, F) {
                 {
                   name: "contentEncrypted",
                   control: d,
-                  render: ({ field: { value: t, ...n } }) => /* @__PURE__ */ a(S, { checked: !!t, ...n })
+                  render: ({ field: { value: t, ...n } }) => /* @__PURE__ */ a(V, { checked: !!t, ...n })
                 }
               ),
               label: "Content Encrypted",
@@ -330,23 +347,24 @@ function ae(e, F) {
               required: !0
             },
             control: d,
-            render: ({ field: { value: t, onChange: n }, fieldState: l }) => {
-              const r = t || [], i = (o) => {
+            render: ({ field: { value: t, onChange: n }, fieldState: i }) => {
+              const l = t || [], r = (o) => {
                 n(o);
               };
               return /* @__PURE__ */ a(
-                z,
+                X,
                 {
-                  selectedIds: r,
+                  selectedIds: l,
                   memberedGroups: e.memberedGroups,
-                  showError: !!l.error,
-                  onChange: i
+                  showError: !!i.error,
+                  variant: e.inputVariant,
+                  onChange: r
                 }
               );
             }
           }
         ),
-        /* @__PURE__ */ a(T, { mt: 2, children: /* @__PURE__ */ a(
+        /* @__PURE__ */ a(p, { mt: 2, children: /* @__PURE__ */ a(
           s,
           {
             name: "securityLevelId",
@@ -354,43 +372,44 @@ function ae(e, F) {
               required: !0
             },
             control: d,
-            render: ({ field: { value: t, onChange: n }, fieldState: l }) => {
-              var i, o;
-              const r = (c) => {
+            render: ({ field: { value: t, onChange: n }, fieldState: i }) => {
+              var r, o;
+              const l = (c) => {
                 n(c);
               };
               return /* @__PURE__ */ a(
-                Z,
+                z,
                 {
-                  value: t,
+                  value: t || 0,
                   ontologyId: e.ontologyId,
                   appRoles: e.appRoles,
                   securityLevels: e.securityLevels,
                   minLevelId: e.minSecurityLevel,
-                  templateKeys: (i = e.securityLevelConfig) == null ? void 0 : i.templateKeys,
+                  templateKeys: (r = e.securityLevelConfig) == null ? void 0 : r.templateKeys,
                   templateType: (o = e.securityLevelConfig) == null ? void 0 : o.templateType,
-                  showError: !!l.error,
-                  onChange: r
+                  showError: !!i.error,
+                  variant: e.inputVariant,
+                  onChange: l
                 }
               );
             }
           }
         ) }),
-        /* @__PURE__ */ f(T, { display: "flex", justifyContent: "space-between", mt: 3, children: [
+        /* @__PURE__ */ h(p, { display: "flex", justifyContent: "space-between", mt: 3, children: [
           /* @__PURE__ */ a(
-            g,
+            y,
             {
               color: "primary",
               variant: "text",
               disabled: e.loading,
               sx: { textTransform: "none" },
-              onClick: A,
+              onClick: B,
               children: "Cancel"
             }
           ),
-          /* @__PURE__ */ f(T, { children: [
+          /* @__PURE__ */ h(p, { children: [
             e.onRemove !== void 0 && /* @__PURE__ */ a(
-              g,
+              y,
               {
                 type: "button",
                 color: "error",
@@ -402,7 +421,7 @@ function ae(e, F) {
               }
             ),
             e.saveButtons ? e.saveButtons.map((t, n) => /* @__PURE__ */ a(
-              g,
+              y,
               {
                 type: "submit",
                 color: "primary",
@@ -415,7 +434,7 @@ function ae(e, F) {
               },
               n
             )) : /* @__PURE__ */ a(
-              g,
+              y,
               {
                 type: "submit",
                 color: "primary",
@@ -431,7 +450,7 @@ function ae(e, F) {
     }
   );
 }
-const ge = m.forwardRef(ae);
+const ge = m.forwardRef(te);
 export {
   ge as InstanceForm
 };

package/dist/components/instance-hierarchy-table/index.js

@@ -0,0 +1,58 @@
+import { jsx as r, Fragment as c, jsxs as m } from "react/jsx-runtime";
+import { Accordion as d, AccordionSummary as u, AccordionDetails as g } from "./styled.js";
+import { Typography as l, Chip as f } from "@mui/material";
+import { ChevronRight as y } from "@mui/icons-material";
+import { getPageIcon as I, getTemplateHierarchy as x } from "../../utils/ontology.js";
+import { InstanceTable as b } from "../instance-table/index.js";
+const W = ({
+  data: n,
+  templates: i,
+  ...s
+}) => {
+  const h = (t) => t ? x(i, t).map((e) => e.name).join(" / ") : " ";
+  return !n || !n.results ? /* @__PURE__ */ r(c, {}) : n.results.map((t, o) => {
+    const e = i.get(t.templateId);
+    if (!e) return /* @__PURE__ */ r(c, {});
+    const a = I(i, e.id);
+    return /* @__PURE__ */ m(
+      d,
+      {
+        defaultExpanded: !0,
+        disableGutters: !0,
+        elevation: 0,
+        square: !0,
+        children: [
+          /* @__PURE__ */ m(u, { expandIcon: /* @__PURE__ */ r(y, {}), children: [
+            /* @__PURE__ */ r("img", { src: a, height: 22, style: { maxWidth: 22 } }),
+            /* @__PURE__ */ r(l, { fontWeight: "500", ml: 2, children: e.name }),
+            /* @__PURE__ */ r(
+              f,
+              {
+                color: "primary",
+                label: t.totalInstanceCount,
+                size: "small",
+                sx: { height: 20, ml: 1 }
+              }
+            ),
+            /* @__PURE__ */ r(l, { variant: "caption", ml: 2, children: h(e) })
+          ] }),
+          /* @__PURE__ */ r(g, { children: /* @__PURE__ */ r(
+            b,
+            {
+              data: t.instances.map((p) => ({
+                ...p,
+                templateId: e.id
+              })),
+              template: { ...e, icon: a },
+              ...s
+            }
+          ) })
+        ]
+      },
+      o
+    );
+  });
+};
+export {
+  W as InstanceHierarchyTable
+};

package/dist/components/instance-hierarchy-table/styled.js

@@ -0,0 +1,29 @@
+import { styled as r } from "@mui/material";
+import { A as e, a as i, b as n } from "../../AccordionDetails-CGs6GZQK.js";
+const c = r(e)(({ theme: o }) => ({
+  borderBottom: `1px solid ${o.palette.divider}`,
+  "&:before": {
+    display: "none"
+  }
+})), t = r(i)(({ theme: o }) => ({
+  flexDirection: "row-reverse",
+  paddingLeft: 0,
+  "& .MuiAccordionSummary-expandIconWrapper.Mui-expanded": {
+    transform: "rotate(90deg)"
+  },
+  "& .MuiAccordionSummary-content": {
+    marginLeft: o.spacing(1),
+    alignItems: "center"
+  }
+})), p = r(n)(({ theme: o }) => ({
+  padding: o.spacing(2),
+  paddingTop: 0,
+  paddingBottom: 0,
+  borderTop: "1px solid rgba(0, 0, 0, .125)",
+  background: o.palette.grey[100]
+}));
+export {
+  c as Accordion,
+  p as AccordionDetails,
+  t as AccordionSummary
+};