@hybridcore/ui 1.6.19 → 1.6.20

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

@@ -1,119 +1,133 @@
-import { jsx as e, jsxs as i, Fragment as f } from "react/jsx-runtime";
-import { EditOutlined as C, DeleteOutline as A, AddLocationOutlined as G, DrawOutlined as b, LayersOutlined as p } from "@mui/icons-material";
-import { Coordinate as D } from "./coordinate/index.js";
-import { Edit as P } from "./edit/index.js";
-import { Geometry as S } from "./geometry/index.js";
-import { Kml as O } from "./kml/index.js";
-import { Wkt as I } from "./wkt/index.js";
-import { useGeometryPickerLogic as E } from "./logic.js";
-import { GeometryPickerEndAdornment as M, GeometryPickerEndAdornmentButton as y, GeometryPickerRoot as x, GeometryPickerTopLabel as T, GeometryPickerContainer as g, GeometryPickerActions as L, GeometryPickerActionButton as c, GeometryPickerFormControl as W, GeometryPickerInputLabel as K, GeometryPickerInputStandard as v, GeometryPickerInputOutlined as w, GeometryPickerInputFilled as z, GeometryPickerDialog as B, GeometryPickerDialogTitle as R, GeometryPickerDialogContent as F } from "./styled.js";
-const X = (s) => {
-  const { label: r, mapboxAccessToken: d, value: n = "", defaultExtent: u } = s, { refs: h, state: t, actions: o } = E(s), { ownerState: k, variant: l, labelPosition: a } = t, m = /* @__PURE__ */ e(M, { position: "end", children: n !== "" && /* @__PURE__ */ i(f, { children: [
-    /* @__PURE__ */ e(y, { size: "small", onClick: o.onEdit, children: /* @__PURE__ */ e(C, { fontSize: "small" }) }),
-    /* @__PURE__ */ e(y, { size: "small", onClick: o.onDelete, children: /* @__PURE__ */ e(A, { fontSize: "small" }) })
-  ] }) });
-  return /* @__PURE__ */ i(x, { ref: h.rootRef, sx: t.sx, children: [
-    a === "top" && r !== void 0 && /* @__PURE__ */ e(T, { children: r }),
-    /* @__PURE__ */ i(g, { children: [
-      /* @__PURE__ */ i(L, { ownerState: k, children: [
-        k.disableAddCoordinate === !1 && /* @__PURE__ */ e(
-          c,
-          {
-            color: "inherit",
-            startIcon: /* @__PURE__ */ e(G, {}),
-            onClick: o.onAddCoordinate,
-            children: "Add Coordinate"
-          }
-        ),
-        /* @__PURE__ */ e(
-          c,
-          {
-            color: "inherit",
-            startIcon: /* @__PURE__ */ e(b, {}),
-            onClick: o.onDraw,
-            children: "Draw"
-          }
-        ),
-        /* @__PURE__ */ e(
-          c,
-          {
-            color: "inherit",
-            startIcon: /* @__PURE__ */ e(p, {}),
-            onClick: o.onAddKml,
-            children: "Add KML"
-          }
-        ),
-        /* @__PURE__ */ e(
-          c,
-          {
-            color: "inherit",
-            startIcon: /* @__PURE__ */ e(p, {}),
-            onClick: o.onAddWkt,
-            children: "Add WKT"
-          }
-        )
-      ] }),
-      /* @__PURE__ */ i(
-        W,
+import { jsx as e, jsxs as n, Fragment as G } from "react/jsx-runtime";
+import { ContentCopyOutlined as b, EditOutlined as A, DeleteOutline as P, AddLocationOutlined as D, DrawOutlined as O, LayersOutlined as h } from "@mui/icons-material";
+import { Tooltip as p } from "@mui/material";
+import { Coordinate as S } from "./coordinate/index.js";
+import { Edit as E } from "./edit/index.js";
+import { Geometry as I } from "./geometry/index.js";
+import { Kml as T } from "./kml/index.js";
+import { Wkt as M } from "./wkt/index.js";
+import { useGeometryPickerLogic as x } from "./logic.js";
+import { GeometryPickerEndAdornment as g, GeometryPickerEndAdornmentButton as u, GeometryPickerActions as L, GeometryPickerActionButton as d, GeometryPickerRoot as W, GeometryPickerHeader as z, GeometryPickerTopLabel as K, GeometryPickerContainer as v, GeometryPickerFormControl as R, GeometryPickerInputLabel as w, GeometryPickerInputStandard as B, GeometryPickerInputOutlined as F, GeometryPickerInputFilled as j, GeometryPickerDialog as N, GeometryPickerDialogTitle as H, GeometryPickerDialogContent as Y } from "./styled.js";
+const oe = (y) => {
+  const { label: r, mapboxAccessToken: a, value: i = "", defaultExtent: k } = y, { refs: f, state: t, actions: o } = x(y), { ownerState: m, variant: l, labelPosition: c } = t, s = /* @__PURE__ */ e(g, { position: "end", children: i !== "" && /* @__PURE__ */ n(G, { children: [
+    /* @__PURE__ */ e(
+      p,
+      {
+        title: t.copied ? "Copied to clipboard" : "Copy",
+        open: t.copyTooltipOpen,
+        onOpen: o.openCopyTooltip,
+        onClose: o.closeCopyTooltip,
+        children: /* @__PURE__ */ e(u, { size: "small", onClick: o.onCopy, children: /* @__PURE__ */ e(b, { fontSize: "small" }) })
+      }
+    ),
+    /* @__PURE__ */ e(p, { title: "Edit", children: /* @__PURE__ */ e(u, { size: "small", onClick: o.onEdit, children: /* @__PURE__ */ e(A, { fontSize: "small" }) }) }),
+    /* @__PURE__ */ e(p, { title: "Remove", children: /* @__PURE__ */ e(u, { size: "small", onClick: o.onDelete, children: /* @__PURE__ */ e(P, { fontSize: "small" }) }) })
+  ] }) }), C = /* @__PURE__ */ n(L, { ownerState: m, children: [
+    m.disableAddCoordinate === !1 && /* @__PURE__ */ e(
+      d,
+      {
+        color: "inherit",
+        startIcon: /* @__PURE__ */ e(D, {}),
+        onClick: o.onAddCoordinate,
+        children: "Add Coordinate"
+      }
+    ),
+    /* @__PURE__ */ e(
+      d,
+      {
+        color: "inherit",
+        startIcon: /* @__PURE__ */ e(O, {}),
+        onClick: o.onDraw,
+        children: "Draw"
+      }
+    ),
+    /* @__PURE__ */ e(
+      d,
+      {
+        color: "inherit",
+        startIcon: /* @__PURE__ */ e(h, {}),
+        onClick: o.onAddKml,
+        children: "Add KML"
+      }
+    ),
+    /* @__PURE__ */ e(
+      d,
+      {
+        color: "inherit",
+        startIcon: /* @__PURE__ */ e(h, {}),
+        onClick: o.onAddWkt,
+        children: "Add WKT"
+      }
+    )
+  ] });
+  return /* @__PURE__ */ n(W, { ref: f.rootRef, sx: t.sx, children: [
+    c === "top" && /* @__PURE__ */ n(z, { children: [
+      r !== void 0 && /* @__PURE__ */ e(K, { children: r }),
+      C
+    ] }),
+    /* @__PURE__ */ n(v, { ownerState: m, children: [
+      c !== "top" && C,
+      /* @__PURE__ */ n(
+        R,
         {
           fullWidth: !0,
           variant: l,
           contentEditable: !1,
           onClick: o.onClick,
           children: [
-            a === "default" && /* @__PURE__ */ e(K, { shrink: !!n, children: r }),
-            l === "standard" && /* @__PURE__ */ e(v, { value: n, readOnly: !0, endAdornment: m }),
+            c === "default" && /* @__PURE__ */ e(w, { shrink: !!i, children: r }),
+            l === "standard" && /* @__PURE__ */ e(B, { value: i, readOnly: !0, endAdornment: s }),
             l === "outlined" && /* @__PURE__ */ e(
-              w,
+              F,
               {
-                label: a === "default" ? r : void 0,
-                value: n,
+                label: c === "default" ? r : void 0,
+                value: i,
                 readOnly: !0,
-                endAdornment: m
+                endAdornment: s
               }
             ),
-            l === "filled" && /* @__PURE__ */ e(z, { value: n, readOnly: !0, endAdornment: m })
+            l === "filled" && /* @__PURE__ */ e(j, { value: i, readOnly: !0, endAdornment: s })
           ]
         }
       )
     ] }),
-    /* @__PURE__ */ i(
-      B,
+    /* @__PURE__ */ n(
+      N,
       {
         open: t.modal.isOpen,
         onClose: o.closeModal,
         fullWidth: !0,
         maxWidth: "md",
         children: [
-          /* @__PURE__ */ e(R, { children: t.content.title }),
-          /* @__PURE__ */ i(F, { children: [
+          /* @__PURE__ */ e(H, { children: t.content.title }),
+          /* @__PURE__ */ n(Y, { children: [
             t.content.action === "ADD" && t.content.type === "COORDINATE" && /* @__PURE__ */ e(
-              D,
+              S,
               {
-                mapboxAccessToken: d,
-                defaultExtent: u,
+                mapboxAccessToken: a,
+                defaultExtent: k,
                 onCancel: o.closeModal,
                 onSubmit: o.onSubmit
               }
             ),
             t.content.action === "ADD" && t.content.type === "GEOMETRY" && /* @__PURE__ */ e(
-              S,
+              I,
               {
                 mapId: "map-geo-picker-001",
-                mapboxAccessToken: d,
-                defaultExtent: u,
+                mapboxAccessToken: a,
+                defaultExtent: k,
                 onCancel: o.closeModal,
                 onSubmit: o.onSubmit
               }
             ),
-            t.content.action === "ADD" && t.content.type === "KML" && /* @__PURE__ */ e(O, { onCancel: o.closeModal, onSubmit: o.onSubmit }),
-            t.content.action === "ADD" && t.content.type === "WKT" && /* @__PURE__ */ e(I, { onCancel: o.closeModal, onSubmit: o.onSubmit }),
-            t.content.action === "EDIT" && !!n && /* @__PURE__ */ e(
-              P,
+            t.content.action === "ADD" && t.content.type === "KML" && /* @__PURE__ */ e(T, { onCancel: o.closeModal, onSubmit: o.onSubmit }),
+            t.content.action === "ADD" && t.content.type === "WKT" && /* @__PURE__ */ e(M, { onCancel: o.closeModal, onSubmit: o.onSubmit }),
+            t.content.action === "EDIT" && !!i && /* @__PURE__ */ e(
+              E,
               {
                 mapId: "map-geo-edit-001",
-                value: n,
-                mapboxAccessToken: d,
+                value: i,
+                mapboxAccessToken: a,
                 onCancel: o.closeModal,
                 onSubmit: o.onSubmit
               }
@@ -125,5 +139,5 @@ const X = (s) => {
   ] });
 };
 export {
-  X as GeometryPicker
+  oe as GeometryPicker
 };

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

@@ -1,62 +1,79 @@
-import { useThemeProps as C } from "@mui/material";
-import { useRef as P, useState as K } from "react";
-import E from "../../hooks/useToggle.js";
-const k = (f) => {
-  const c = C({ props: f, name: "HCGeometryPicker" }), {
-    value: a = "",
-    disableAddCoordinate: p = !1,
-    variant: r = "outlined",
-    labelPosition: l = "top",
-    onChange: e
-  } = c, m = P(null), t = E(!1), [i, n] = K({
+import { useThemeProps as x } from "@mui/material";
+import { useRef as C, useState as p, useEffect as G } from "react";
+import L from "../../hooks/useToggle.js";
+const H = (g) => {
+  const l = x({ props: g, name: "HCGeometryPicker" }), {
+    value: e = "",
+    disableAddCoordinate: f = !1,
+    variant: d = "outlined",
+    labelPosition: u = "top",
+    onChange: s
+  } = l, P = C(null), t = L(!1), [m, D] = p(!1), [E, a] = p(!1), i = C(), [c, n] = p({
     title: "",
     type: "COORDINATE",
     action: "ADD"
-  }), d = () => {
+  }), T = () => {
     n({ title: "Add Coordinate", type: "COORDINATE", action: "ADD" }), t.action.open();
-  }, A = () => {
+  }, K = () => {
     n({ title: "Add KML", type: "KML", action: "ADD" }), t.action.open();
-  }, u = () => {
+  }, O = () => {
     n({ title: "Add WKT", type: "WKT", action: "ADD" }), t.action.open();
-  }, s = (o) => {
+  }, r = (o) => {
     o != null && o.stopPropagation && o.stopPropagation(), n({ title: "Edit", type: "WKT", action: "EDIT" }), t.action.open();
-  }, D = (o) => {
-    o != null && o.stopPropagation && o.stopPropagation(), n({ title: "Draw Geometry", type: "GEOMETRY", action: "ADD" }), t.action.open();
   }, y = (o) => {
-    t.action.close(), e && e(o), i.action === "ADD" && (i.type === "KML" || i.type === "WKT") && s();
-  }, T = () => {
-    a !== void 0 && a !== "" ? s() : p === !1 ? d() : D();
-  }, g = (o) => {
-    o.stopPropagation(), e && e("");
+    o != null && o.stopPropagation && o.stopPropagation(), n({ title: "Draw Geometry", type: "GEOMETRY", action: "ADD" }), t.action.open();
+  }, R = (o) => {
+    t.action.close(), s && s(o), c.action === "ADD" && (c.type === "KML" || c.type === "WKT") && r();
+  }, w = () => {
+    e !== void 0 && e !== "" ? r() : f === !1 ? T() : y();
+  }, M = (o) => {
+    o.stopPropagation(), s && s("");
+  }, W = (o) => {
+    var A;
+    o != null && o.stopPropagation && o.stopPropagation(), e && ((A = navigator.clipboard) == null || A.writeText(e), D(!0), a(!0), i.current && clearTimeout(i.current), i.current = setTimeout(() => {
+      D(!1), a(!1);
+    }, 2e3));
+  }, b = () => a(!0), k = () => {
+    m || a(!1);
   };
-  return {
-    refs: { rootRef: m },
+  return G(
+    () => () => {
+      i.current && clearTimeout(i.current);
+    },
+    []
+  ), {
+    refs: { rootRef: P },
     state: {
       ownerState: {
-        variant: r,
-        labelPosition: l,
-        hasValue: a !== "",
-        disableAddCoordinate: p
+        variant: d,
+        labelPosition: u,
+        hasValue: e !== "",
+        disableAddCoordinate: f
       },
-      content: i,
+      content: c,
       modal: t.state,
-      variant: r,
-      labelPosition: l,
-      sx: c.sx
+      variant: d,
+      labelPosition: u,
+      copied: m,
+      copyTooltipOpen: E,
+      sx: l.sx
     },
     actions: {
-      onAddCoordinate: d,
-      onAddKml: A,
-      onAddWkt: u,
-      onSubmit: y,
-      onClick: T,
-      onDelete: g,
-      onEdit: s,
-      onDraw: D,
+      onAddCoordinate: T,
+      onAddKml: K,
+      onAddWkt: O,
+      onSubmit: R,
+      onClick: w,
+      onCopy: W,
+      openCopyTooltip: b,
+      closeCopyTooltip: k,
+      onDelete: M,
+      onEdit: r,
+      onDraw: y,
       closeModal: t.action.close
     }
   };
 };
 export {
-  k as useGeometryPickerLogic
+  H as useGeometryPickerLogic
 };