synapse-react-client/dist/components/ResizableContainer/ResizableContainer.js

[](https://badge.fury.io/js/synapse-react-client) [](https://github.com/prettier/prettie

import { jsxs as p, jsx as e } from "react/jsx-runtime";
import { Box as i } from "@mui/material";
function d({ onMouseDown: o, sx: t }) {
  return /* @__PURE__ */ e(
    i,
    {
      onMouseDown: o,
      sx: {
        position: "absolute",
        bottom: 0,
        right: 0,
        width: 20,
        height: 20,
        cursor: "se-resize",
        // Add a simple diagonal lines to indicate resize handle
        "&::before": {
          content: '""',
          position: "absolute",
          right: 7,
          bottom: 7,
          width: 5,
          height: 5,
          borderRight: "2px solid #999",
          borderBottom: "2px solid #999"
        },
        ...t
      }
    }
  );
}
function l({
  children: o,
  width: t,
  height: r,
  onResizeStart: s,
  showResizeHandle: n = !0,
  resizeHandleSx: h,
  sx: x
}) {
  return /* @__PURE__ */ p(
    i,
    {
      sx: {
        position: "relative",
        width: `${t}px`,
        height: `${r}px`,
        ...x
      },
      children: [
        o,
        n && /* @__PURE__ */ e(d, { onMouseDown: s, sx: h })
      ]
    }
  );
}
export {
  l as ResizableContainer,
  d as ResizeHandle
};
//# sourceMappingURL=ResizableContainer.js.map