@glodon-aiot/react-components/dist/es/GOSImageMap/DrawableImageMap.mjs

aiot react components

var f = Object.defineProperty;
var i = Object.getOwnPropertySymbols;
var n = Object.prototype.hasOwnProperty, p = Object.prototype.propertyIsEnumerable;
var s = (e, a, t) => a in e ? f(e, a, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[a] = t, l = (e, a) => {
  for (var t in a || (a = {}))
    n.call(a, t) && s(e, t, a[t]);
  if (i)
    for (var t of i(a))
      p.call(a, t) && s(e, t, a[t]);
  return e;
};
var c = (e, a) => {
  var t = {};
  for (var r in e)
    n.call(e, r) && a.indexOf(r) < 0 && (t[r] = e[r]);
  if (e != null && i)
    for (var r of i(e))
      a.indexOf(r) < 0 && p.call(e, r) && (t[r] = e[r]);
  return t;
};
import { jsxs as w, jsx as h } from "react/jsx-runtime";
import { useImmer as S } from "use-immer";
import x from "./ImageMap.mjs";
import I from "../Drawable/Drawable.mjs";
function k(e) {
  const m = e, {
    url: a
  } = m, t = c(m, [
    "url"
  ]), [r, u] = S({
    scale: 1,
    width: 0,
    height: 0
  });
  return a ? /* @__PURE__ */ w("div", {
    className: "relative bg-pink-500 bg-opacity-40",
    children: [/* @__PURE__ */ h(x, {
      url: a,
      onScaleChange: (g, b, d) => {
        u((o) => {
          o.scale = g, o.width = b, o.height = d;
        });
      }
    }), /* @__PURE__ */ h(I, l(l({}, t), r))]
  }) : null;
}
export {
  k as default
};