import { j as jsxRuntimeExports } from "../../../../../_virtual/jsx-runtime.js";
import { forwardRef } from "react";
import { useSelectedBrickId, useContextMenuVisible } from "../../../../../use-editor.js";
import { useBrickManifest } from "../../shared/hooks/use-brick-manifest.js";
import { tx as D } from "../../../../style-system/dist/twind.js";
import EditableBrickTextNavBar from "./EditableBrickTextNavBar.js";
const EditableBrickNavBar = forwardRef(
  ({ brick, style, isContainerChild, show, ...rest }, ref) => {
    const selectedBrickId = useSelectedBrickId();
    const manifest = useBrickManifest(brick.type);
    const contextMenuVisible = useContextMenuVisible();
    const visible = show && manifest.isContainer && !selectedBrickId || show && !manifest.isContainer && !isContainerChild || selectedBrickId === brick.id;
    if (!visible || contextMenuVisible) {
      return null;
    }
    return /* @__PURE__ */ jsxRuntimeExports.jsx(
      "div",
      {
        ref,
        "data-ui": true,
        "data-ui-menu-bars-container": true,
        role: "navigation",
        className: D(
          "z-[99999] isolate text-base items-center gap-1",
          "transition-opacity duration-150 border rounded-lg",
          visible ? "opacity-100 flex" : "opacity-0 hidden",
          manifest.isContainer ? "border-orange-300" : "border-transparent"
        ),
        style,
        ...rest,
        children: /* @__PURE__ */ jsxRuntimeExports.jsx(EditableBrickTextNavBar, { brick })
      }
    );
  }
);
export {
  EditableBrickNavBar as default
};
//# sourceMappingURL=EditableBrickNavBar.js.map
