import { jsxs as m, jsx as t } from "react/jsx-runtime";
import { cn as d } from "../../utils/cn.js";
import s from "../../node_modules/.pnpm/lucide-react@0.453.0_react@18.3.1/node_modules/lucide-react/dist/esm/icons/chevron-up.js";
import h from "../../node_modules/.pnpm/lucide-react@0.453.0_react@18.3.1/node_modules/lucide-react/dist/esm/icons/zoom-in.js";
import c from "../../node_modules/.pnpm/lucide-react@0.453.0_react@18.3.1/node_modules/lucide-react/dist/esm/icons/chevron-left.js";
import u from "../../node_modules/.pnpm/lucide-react@0.453.0_react@18.3.1/node_modules/lucide-react/dist/esm/icons/rotate-ccw.js";
import b from "../../node_modules/.pnpm/lucide-react@0.453.0_react@18.3.1/node_modules/lucide-react/dist/esm/icons/chevron-right.js";
import f from "../../node_modules/.pnpm/lucide-react@0.453.0_react@18.3.1/node_modules/lucide-react/dist/esm/icons/chevron-down.js";
import p from "../../node_modules/.pnpm/lucide-react@0.453.0_react@18.3.1/node_modules/lucide-react/dist/esm/icons/zoom-out.js";
const o = ({
  children: a,
  className: n,
  ...l
}) => /* @__PURE__ */ t(
  "button",
  {
    className: d(
      "flex size-7 cursor-pointer touch-manipulation items-center justify-center rounded-md border border-stone-200 bg-white text-stone-900 transition-[transform] duration-100 hover:bg-stone-50 motion-safe:active:scale-95 dark:border-white/10 dark:bg-stone-900 dark:text-white dark:hover:bg-stone-800 [&_svg]:size-4",
      n
    ),
    type: "button",
    ...l,
    children: a
  }
), N = ({
  onZoomIn: a,
  onZoomOut: n,
  onReset: l,
  onPan: r,
  panStep: e,
  placement: i
}) => (
  // biome-ignore lint/a11y/useSemanticElements: TODO
  /* @__PURE__ */ m(
    "div",
    {
      "aria-label": "Diagram zoom and pan controls",
      className: d(
        "absolute z-10 grid grid-cols-3 gap-1",
        i === "top-left" && "top-2 left-2",
        i === "top-right" && "top-2 right-2",
        i === "bottom-left" && "bottom-2 left-2",
        i === "bottom-right" && "right-2 bottom-2"
      ),
      "data-component-part": "zoom-controls",
      role: "group",
      children: [
        /* @__PURE__ */ t("div", { "aria-hidden": "true", className: "pointer-events-none" }),
        /* @__PURE__ */ t(
          o,
          {
            "aria-label": "Pan up",
            onClick: () => r(0, e),
            title: "Pan up",
            children: /* @__PURE__ */ t(s, { "aria-hidden": "true" })
          }
        ),
        /* @__PURE__ */ t(o, { "aria-label": "Zoom in", onClick: a, title: "Zoom in", children: /* @__PURE__ */ t(h, { "aria-hidden": "true" }) }),
        /* @__PURE__ */ t(
          o,
          {
            "aria-label": "Pan left",
            onClick: () => r(e, 0),
            title: "Pan left",
            children: /* @__PURE__ */ t(c, { "aria-hidden": "true" })
          }
        ),
        /* @__PURE__ */ t(o, { "aria-label": "Reset view", onClick: l, title: "Reset view", children: /* @__PURE__ */ t(u, { "aria-hidden": "true" }) }),
        /* @__PURE__ */ t(
          o,
          {
            "aria-label": "Pan right",
            onClick: () => r(-e, 0),
            title: "Pan right",
            children: /* @__PURE__ */ t(b, { "aria-hidden": "true" })
          }
        ),
        /* @__PURE__ */ t("div", { "aria-hidden": "true", className: "pointer-events-none" }),
        /* @__PURE__ */ t(
          o,
          {
            "aria-label": "Pan down",
            onClick: () => r(0, -e),
            title: "Pan down",
            children: /* @__PURE__ */ t(f, { "aria-hidden": "true" })
          }
        ),
        /* @__PURE__ */ t(o, { "aria-label": "Zoom out", onClick: n, title: "Zoom out", children: /* @__PURE__ */ t(p, { "aria-hidden": "true" }) })
      ]
    }
  )
);
export {
  N as ZoomControls
};
