@hybridcore/ui 1.5.49 → 1.5.51

package/dist/components/property-mapping/index.js

@@ -5,7 +5,7 @@ import { DataGrid as fe } from "@mui/x-data-grid";
 import { useState as G, useEffect as ue } from "react";
 import h from "lodash";
 import { d as ye } from "../../ol-lGwSyEIV.js";
-import { V as he } from "../../index-OtGK6phq.js";
+import { V as he } from "../../index-CCkupzf4.js";
 import { RangeSelector as me } from "../range-selector/index.js";
 const $e = ({
   open: F,

package/dist/index-CCkupzf4.js

@@ -0,0 +1,491 @@
+import { jsx as n, jsxs as u, Fragment as _ } from "react/jsx-runtime";
+import { KeyboardArrowUp as R, KeyboardArrowDown as U, Add as J, LockOutlined as Q } from "@mui/icons-material";
+import { Box as M, Typography as s, FormControl as X, FormLabel as Z, FormGroup as z, FormControlLabel as P, Checkbox as y, Button as Y, Chip as O, Dialog as p, DialogTitle as ee, DialogContent as ne, DialogActions as ae, InputAdornment as de, Tooltip as le } from "@mui/material";
+import H from "dayjs";
+import x from "lodash";
+import { useState as E } from "react";
+import ce from "./hooks/useToggle.js";
+import { ConditionalWrapper as o } from "./components/conditional-wrapper/index.js";
+import { DateTimePicker as te } from "./components/date-time-picker/index.js";
+import { GeometryPicker as ie } from "./components/geometry-picker/index.js";
+import { PhoneInput as me } from "./components/phone-input/index.js";
+import W from "./components/instance-form/components/TopLabelWrapper.js";
+import { B as h } from "./Box-SSMZuKnS.js";
+import { T as G } from "./TextField-CdKnj6de.js";
+import { F as he } from "./FormControlLabel-BNT5EI0b.js";
+import { C as ue } from "./Checkbox-B0P8LhCl.js";
+import { F as re, I as oe } from "./InputLabel-ClDXuWBr.js";
+import { S as se } from "./Select-DuyWoyoF.js";
+import { M as Ie } from "./MenuItem-Lcjh1XlV.js";
+import { Container as fe, Values as ge, MiniButton as we } from "./components/instance-form/components/composite-list/styled.js";
+function Ce({
+  property: r,
+  mapboxAccessToken: e,
+  value: l,
+  variant: w = "outlined",
+  labelPosition: c = "default",
+  size: I = "medium",
+  onChange: T
+}) {
+  var b, k, A;
+  const a = ce(!1), [f, v] = E(), [V, S] = E(!1), F = 10, B = (t) => {
+    v(x.get(t, r.propertyId));
+  }, N = () => {
+    T([...l || [], f]), v(""), a.action.close();
+  }, $ = (t) => () => {
+    if (l) {
+      const i = [...l];
+      i.splice(t, 1), T(i);
+    }
+  }, q = (t) => {
+    const { value: i, checked: C } = t.target;
+    let g = x.isArray(l) ? l : [];
+    C ? g.push(i) : g = g.filter((d) => d !== i), T(g);
+  };
+  if (((k = (b = r.dataTypeInfo) == null ? void 0 : b.innerType) == null ? void 0 : k.type) === "enum") {
+    const { enumValues: t } = r.dataTypeInfo.innerType;
+    return /* @__PURE__ */ n(
+      o,
+      {
+        condition: c === "left",
+        wrapper: (i) => /* @__PURE__ */ u(M, { display: "flex", alignItems: "center", children: [
+          /* @__PURE__ */ n(s, { width: "32%", children: r.name }),
+          /* @__PURE__ */ n(M, { width: "68%", children: i })
+        ] }),
+        children: /* @__PURE__ */ u(_, { children: [
+          /* @__PURE__ */ u(X, { fullWidth: !0, component: "fieldset", variant: w, children: [
+            c === "default" && /* @__PURE__ */ n(Z, { component: "legend", sx: { mb: 1 }, children: r.name }),
+            /* @__PURE__ */ n(z, { children: t && t.length > 0 ? t.slice(0, V ? 9999 : F).map((i, C) => /* @__PURE__ */ n(
+              P,
+              {
+                label: i,
+                control: /* @__PURE__ */ n(
+                  y,
+                  {
+                    name: r.propertyId,
+                    value: i,
+                    size: "small",
+                    checked: x.isArray(l) ? l.includes(i) : !1,
+                    onChange: q
+                  }
+                ),
+                componentsProps: {
+                  typography: {
+                    variant: "body2"
+                  }
+                }
+              },
+              C
+            )) : /* @__PURE__ */ n(s, { variant: "caption", mb: 1, children: "No enum values!" }) })
+          ] }),
+          x.isArray(t) && t.length > F && /* @__PURE__ */ u(
+            Y,
+            {
+              size: "small",
+              sx: { p: 0, textTransform: "none" },
+              endIcon: V ? /* @__PURE__ */ n(R, {}) : /* @__PURE__ */ n(U, {}),
+              onClick: () => S((i) => !i),
+              children: [
+                "Show ",
+                V ? "Less" : "More"
+              ]
+            }
+          )
+        ] })
+      }
+    );
+  }
+  return /* @__PURE__ */ u(_, { children: [
+    /* @__PURE__ */ n(
+      o,
+      {
+        condition: c === "left",
+        wrapper: (t) => /* @__PURE__ */ u(M, { display: "flex", alignItems: "center", children: [
+          /* @__PURE__ */ n(s, { width: "32%", children: r.name }),
+          /* @__PURE__ */ n(M, { width: "68%", children: t })
+        ] }),
+        children: /* @__PURE__ */ u(fe, { variant: w, children: [
+          c === "default" && /* @__PURE__ */ n(s, { children: r.name }),
+          /* @__PURE__ */ n(ge, { children: x.isArray(l) && l.map((t, i) => {
+            var C, g;
+            return /* @__PURE__ */ n(
+              O,
+              {
+                label: ((g = (C = r.dataTypeInfo) == null ? void 0 : C.innerType) == null ? void 0 : g.type) === "date" ? H(t).format("DD/MM/YYYY HH:mm:ss") : t,
+                size: I,
+                onDelete: $(i)
+              },
+              i
+            );
+          }) }),
+          /* @__PURE__ */ n(
+            we,
+            {
+              startIcon: /* @__PURE__ */ n(J, {}),
+              variant: "text",
+              onClick: a.action.open,
+              children: "Add"
+            }
+          )
+        ] })
+      }
+    ),
+    /* @__PURE__ */ u(
+      p,
+      {
+        open: a.state.isOpen,
+        onClose: a.action.close,
+        maxWidth: "sm",
+        fullWidth: !0,
+        children: [
+          /* @__PURE__ */ n(ee, { children: "Add List Value" }),
+          /* @__PURE__ */ n(ne, { children: (A = r.dataTypeInfo) != null && A.innerType ? /* @__PURE__ */ n(
+            xe,
+            {
+              mapboxAccessToken: e,
+              property: {
+                ...r,
+                name: "Value",
+                type: r.dataTypeInfo.innerType.type
+              },
+              value: f,
+              onChange: B
+            }
+          ) : null }),
+          /* @__PURE__ */ u(ae, { children: [
+            /* @__PURE__ */ n(
+              Y,
+              {
+                variant: "contained",
+                color: "inherit",
+                onClick: a.action.close,
+                children: "Cancel"
+              }
+            ),
+            /* @__PURE__ */ n(Y, { variant: "contained", color: "primary", onClick: N, children: "Ok" })
+          ] })
+        ]
+      }
+    )
+  ] });
+}
+function xe({
+  mapboxAccessToken: r,
+  property: e,
+  value: l,
+  variant: w = "standard",
+  labelPosition: c = "default",
+  size: I = "medium",
+  defaultExtent: T,
+  fieldOptions: a,
+  // keyAuth,
+  onChange: f
+}) {
+  var q, b, k, A, t, i, C, g;
+  const v = (d) => {
+    const D = d.target.value.split(",").map((j) => j.trimStart());
+    f({
+      [e.propertyId]: D
+    });
+  }, V = (d) => {
+    const { name: m, type: D, checked: j, value: K } = d.target;
+    let L = K;
+    e.type === "double" && (L = L.replace(",", "."), L = L.replace(/[^\d.-]+/g, "")), f({
+      [m]: D === "checkbox" ? j : L
+    });
+  }, S = (d) => {
+    f({
+      [e.propertyId]: d
+    });
+  }, F = (d) => {
+    f({
+      [e.propertyId]: d.target.value
+    });
+  }, B = (d) => (m) => {
+    f({
+      [d]: m
+    });
+  }, N = (d) => (m) => {
+    f({
+      [d]: m
+    });
+  }, $ = (d) => (m) => {
+    f({
+      [d]: m
+    });
+  };
+  if (a && a[e.propertyId] && a[e.propertyId].component)
+    return a[e.propertyId].component;
+  if ([
+    "string",
+    "integer",
+    "double",
+    "text",
+    "long",
+    "byte",
+    "bank-account"
+  ].includes(e.type))
+    return /* @__PURE__ */ n(
+      o,
+      {
+        condition: c === "left",
+        wrapper: (d) => /* @__PURE__ */ u(h, { display: "flex", alignItems: "center", children: [
+          /* @__PURE__ */ n(s, { width: "32%", children: e.name }),
+          /* @__PURE__ */ n(h, { width: "68%", children: d })
+        ] }),
+        children: /* @__PURE__ */ n(
+          o,
+          {
+            condition: c === "top",
+            wrapper: W(
+              e == null ? void 0 : e.name,
+              e == null ? void 0 : e.required,
+              (q = a == null ? void 0 : a[e == null ? void 0 : e.propertyId]) == null ? void 0 : q.description
+            ),
+            children: /* @__PURE__ */ n(
+              G,
+              {
+                label: c === "default" ? e.name : void 0,
+                placeholder: ((b = a == null ? void 0 : a[e.propertyId]) == null ? void 0 : b.placeholder) ?? "",
+                name: e.propertyId,
+                required: e.required,
+                value: l ?? e.defaultValue ?? "",
+                defaultValue: l,
+                onChange: V,
+                variant: w,
+                type: "text",
+                multiline: e.type === "text",
+                disabled: !e.editable,
+                fullWidth: !0,
+                InputProps: {
+                  size: I,
+                  ...a && a[e.propertyId] && {
+                    tabIndex: a[e.propertyId].order
+                  },
+                  ...e.privacyPreservationMethod === "ENCRYPTION" ? {
+                    endAdornment: /* @__PURE__ */ n(de, { position: "end", children: /* @__PURE__ */ n(le, { title: "Encrypted Field", children: /* @__PURE__ */ n(Q, {}) }) })
+                  } : {}
+                }
+              }
+            )
+          }
+        )
+      }
+    );
+  if (e.type === "date") {
+    const d = l !== void 0 ? H(l).format() : l;
+    return /* @__PURE__ */ n(
+      o,
+      {
+        condition: c === "left",
+        wrapper: (m) => /* @__PURE__ */ u(h, { display: "flex", alignItems: "center", children: [
+          /* @__PURE__ */ n(s, { width: "32%", children: e.name }),
+          /* @__PURE__ */ n(h, { width: "68%", children: m })
+        ] }),
+        children: /* @__PURE__ */ n(
+          o,
+          {
+            condition: c === "top",
+            wrapper: W(
+              e.name,
+              e == null ? void 0 : e.required,
+              (k = a == null ? void 0 : a[e == null ? void 0 : e.propertyId]) == null ? void 0 : k.description
+            ),
+            children: /* @__PURE__ */ n(
+              te,
+              {
+                label: c === "default" ? e.name : void 0,
+                value: d,
+                variant: w,
+                size: I,
+                name: e.propertyId,
+                onChange: S,
+                ...a && a[e.propertyId] && {
+                  minDate: a[e.propertyId].minDate
+                }
+              }
+            )
+          }
+        )
+      }
+    );
+  }
+  if (e.type === "list") {
+    let d = "";
+    return e.defaultValue && (d = x.isArray(e.defaultValue) ? l.join(", ") : e.defaultValue), l && (d = x.isArray(l) ? l.join(",") : l), /* @__PURE__ */ n(
+      o,
+      {
+        condition: c === "left",
+        wrapper: (m) => /* @__PURE__ */ u(h, { display: "flex", alignItems: "center", children: [
+          /* @__PURE__ */ n(s, { width: "32%", children: e.name }),
+          /* @__PURE__ */ n(h, { width: "68%", children: m })
+        ] }),
+        children: /* @__PURE__ */ n(
+          o,
+          {
+            condition: c === "top",
+            wrapper: W(
+              e.name,
+              e == null ? void 0 : e.required,
+              (A = a == null ? void 0 : a[e == null ? void 0 : e.propertyId]) == null ? void 0 : A.description
+            ),
+            children: /* @__PURE__ */ n(
+              G,
+              {
+                label: c === "default" ? e.name : void 0,
+                name: e.propertyId,
+                value: d,
+                onChange: v,
+                variant: w,
+                disabled: !e.editable,
+                required: e.required,
+                fullWidth: !0,
+                helperText: I === "small" ? null : "Add list values with the comma (,) separated string",
+                InputProps: {
+                  size: I,
+                  placeholder: I === "small" ? "Add list values with the comma (,) separated string" : "",
+                  ...a && a[e.propertyId] && {
+                    tabIndex: a[e.propertyId].order
+                  }
+                }
+              }
+            )
+          }
+        )
+      }
+    );
+  }
+  if (e.type === "boolean")
+    return /* @__PURE__ */ n(
+      o,
+      {
+        condition: c === "left",
+        wrapper: (d) => /* @__PURE__ */ u(h, { display: "flex", alignItems: "center", children: [
+          /* @__PURE__ */ n(s, { width: "32%", children: e.name }),
+          /* @__PURE__ */ n(h, { width: "68%", children: d })
+        ] }),
+        children: /* @__PURE__ */ n(
+          he,
+          {
+            control: /* @__PURE__ */ n(
+              ue,
+              {
+                name: e.propertyId,
+                checked: !!(l ?? e.defaultValue ?? !1),
+                onChange: V,
+                size: I
+              }
+            ),
+            label: c === "default" ? e.name : void 0
+          }
+        )
+      }
+    );
+  if (e.type === "enum") {
+    let d = [];
+    return (t = e.dataTypeInfo) != null && t.enumValues && (d = e.dataTypeInfo.enumValues), (C = (i = e.dataTypeInfo) == null ? void 0 : i.innerType) != null && C.enumValues && (d = e.dataTypeInfo.innerType.enumValues), /* @__PURE__ */ n(
+      o,
+      {
+        condition: c === "left",
+        wrapper: (m) => /* @__PURE__ */ u(h, { display: "flex", alignItems: "center", children: [
+          /* @__PURE__ */ n(s, { width: "32%", children: e.name }),
+          /* @__PURE__ */ n(h, { width: "68%", children: m })
+        ] }),
+        children: /* @__PURE__ */ n(
+          o,
+          {
+            condition: c === "top",
+            wrapper: W(
+              e.name,
+              e == null ? void 0 : e.required,
+              (g = a == null ? void 0 : a[e == null ? void 0 : e.propertyId]) == null ? void 0 : g.description
+            ),
+            children: /* @__PURE__ */ u(
+              re,
+              {
+                fullWidth: !0,
+                variant: w,
+                size: I,
+                required: e.required,
+                children: [
+                  c === "default" && /* @__PURE__ */ n(oe, { id: `${e.propertyId}-label`, children: e.name }),
+                  /* @__PURE__ */ n(
+                    se,
+                    {
+                      label: c === "default" ? e.name : void 0,
+                      name: e.name,
+                      labelId: `${e.propertyId}-label`,
+                      id: e.propertyId,
+                      value: l ?? "",
+                      onChange: F,
+                      inputProps: {
+                        ...a && a[e.propertyId] && {
+                          tabIndex: a[e.propertyId].order
+                        }
+                      },
+                      children: d.map((m, D) => /* @__PURE__ */ n(Ie, { value: m, children: m }, D))
+                    }
+                  )
+                ]
+              }
+            )
+          }
+        )
+      }
+    );
+  }
+  return e.type === "geometry" ? /* @__PURE__ */ n(
+    o,
+    {
+      condition: c === "left",
+      wrapper: (d) => /* @__PURE__ */ u(h, { display: "flex", alignItems: "center", children: [
+        /* @__PURE__ */ n(s, { width: "32%", children: e.name }),
+        /* @__PURE__ */ n(h, { width: "68%", children: d })
+      ] }),
+      children: /* @__PURE__ */ n(h, { sx: { width: "100%" }, children: /* @__PURE__ */ n(
+        ie,
+        {
+          mapboxAccessToken: r,
+          label: c === "default" ? e.name : void 0,
+          value: l ?? e.defaultValue ?? "",
+          defaultExtent: T,
+          variant: w,
+          onChange: B(e.propertyId)
+        }
+      ) })
+    }
+  ) : e.type === "phone-number" ? /* @__PURE__ */ n(
+    o,
+    {
+      condition: c === "left",
+      wrapper: (d) => /* @__PURE__ */ u(h, { display: "flex", alignItems: "center", children: [
+        /* @__PURE__ */ n(s, { width: "32%", children: e.name }),
+        /* @__PURE__ */ n(h, { width: "68%", children: d })
+      ] }),
+      children: /* @__PURE__ */ n(h, { sx: { width: "100%" }, children: /* @__PURE__ */ n(
+        me,
+        {
+          label: c === "default" ? e.name : void 0,
+          placeholder: "Enter phone number",
+          value: l ?? e.defaultValue ?? "",
+          onChange: N(e.propertyId)
+        }
+      ) })
+    }
+  ) : e.type === "composite-list" ? /* @__PURE__ */ n(h, { sx: { width: "100%" }, children: /* @__PURE__ */ n(
+    Ce,
+    {
+      property: e,
+      value: l ?? e.defaultValue ?? "",
+      variant: w,
+      labelPosition: c,
+      size: I,
+      mapboxAccessToken: r,
+      onChange: $(e.propertyId)
+    }
+  ) }) : /* @__PURE__ */ n(_, {});
+}
+export {
+  Ce as C,
+  xe as V
+};

package/dist/main.d.ts

@@ -205,7 +205,7 @@ declare interface DisseminationListProps {
      *
      */
     variant?: "standard" | "outlined" | "filled";
-    labelPosition?: "default" | "left";
+    labelPosition?: "default" | "left" | "top";
     /**
      *
      */
@@ -244,6 +244,8 @@ declare interface FieldOptions {
     disabled?: boolean;
     minDate?: Dayjs;
     helperText?: React.ReactNode;
+    placeholder?: string;
+    description?: string;
     component?: React.ReactNode;
     maxChar?: number;
     [key: string]: string | number | object | boolean;
@@ -314,7 +316,7 @@ K extends
      */
     variant?: "inline" | "dialog";
     inputVariant?: "standard" | "outlined" | "filled";
-    labelPosition?: "default" | "left";
+    labelPosition?: "default" | "left" | "top";
     /**
      *
      */
@@ -338,6 +340,10 @@ K extends
      *
      */
     loading: boolean;
+    /**
+     *
+     */
+    customSaveButtons?: React.ReactNode;
     /**
      *
      */
@@ -842,7 +848,7 @@ declare interface SecurityLevelProps {
      *
      */
     variant?: "standard" | "outlined" | "filled";
-    labelPosition?: "default" | "left";
+    labelPosition?: "default" | "left" | "top";
     /**
      *
      */

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@hybridcore/ui",
   "description": "Hybrid Core UI Library",
-  "version": "1.5.49",
+  "version": "1.5.51",
   "author": "Hybrid Core",
   "license": "ISC",
   "type": "module",