@hybridcore/ui 1.5.33 → 1.5.35

package/dist/components/phone-input/index.js

@@ -1,15 +1,15 @@
-import { jsxs as m, jsx as n } from "react/jsx-runtime";
+import { jsxs as m, jsx as r } from "react/jsx-runtime";
 import p from "react-phone-number-input";
 import { Typography as i } from "@mui/material";
 import { Container as a } from "./styled.js";
-import '../../assets/index.css';const l = ({
-  label: r,
+import '../../assets/index.css';const u = ({
+  label: n,
   value: o,
   placeholder: e,
   onChange: t
 }) => /* @__PURE__ */ m(a, { children: [
-  /* @__PURE__ */ n(i, { children: r }),
-  /* @__PURE__ */ n(
+  n && /* @__PURE__ */ r(i, { children: n }),
+  /* @__PURE__ */ r(
     p,
     {
       value: o,
@@ -21,5 +21,5 @@ import '../../assets/index.css';const l = ({
   )
 ] });
 export {
-  l as PhoneInput
+  u as PhoneInput
 };

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

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

package/dist/index-OtGK6phq.js

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

package/dist/main.d.ts

@@ -205,6 +205,7 @@ declare interface DisseminationListProps {
      *
      */
     variant?: "standard" | "outlined" | "filled";
+    labelPosition?: "default" | "left";
     /**
      *
      */
@@ -275,6 +276,7 @@ declare interface InstanceFormHandle {
      * @returns
      */
     resetForm: () => void;
+    submitForm: () => void;
     /**
      *
      * @param name
@@ -306,6 +308,7 @@ K extends
      */
     variant?: "inline" | "dialog";
     inputVariant?: "standard" | "outlined" | "filled";
+    labelPosition?: "default" | "left";
     /**
      *
      */
@@ -709,7 +712,7 @@ declare interface Props_5 {
     /**
      *
      */
-    label: string;
+    label?: string;
     /**
      *
      */
@@ -761,7 +764,7 @@ declare interface Props_8 extends StyleProps {
 }
 
 declare interface Props_9 {
-    label: string;
+    label?: string;
     value: string;
     placeholder?: string;
     onChange(value: string): void;
@@ -833,6 +836,7 @@ declare interface SecurityLevelProps {
      *
      */
     variant?: "standard" | "outlined" | "filled";
+    labelPosition?: "default" | "left";
     /**
      *
      */

package/package.json

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