tldraw
Version:
A tiny little drawing editor.
43 lines (42 loc) • 1.36 kB
JavaScript
import { jsx } from "react/jsx-runtime";
import { useEditor, useQuickReactor } from "@tldraw/editor";
import { useRef, useState } from "react";
import { useActions } from "../../context/actions.mjs";
import { TldrawUiMenuActionItem } from "../primitives/menus/TldrawUiMenuActionItem.mjs";
function BackToContent() {
const editor = useEditor();
const actions = useActions();
const [showBackToContent, setShowBackToContent] = useState(false);
const rIsShowing = useRef(false);
useQuickReactor(
"toggle showback to content",
() => {
const showBackToContentPrev = rIsShowing.current;
const shapeIds = editor.getCurrentPageShapeIds();
let showBackToContentNow = false;
if (shapeIds.size) {
showBackToContentNow = shapeIds.size === editor.getCulledShapes().size;
}
if (showBackToContentPrev !== showBackToContentNow) {
setShowBackToContent(showBackToContentNow);
rIsShowing.current = showBackToContentNow;
}
},
[editor]
);
if (!showBackToContent) return null;
return /* @__PURE__ */ jsx(
TldrawUiMenuActionItem,
{
actionId: "back-to-content",
onSelect: () => {
actions["back-to-content"].onSelect("helper-buttons");
setShowBackToContent(false);
}
}
);
}
export {
BackToContent
};
//# sourceMappingURL=BackToContent.mjs.map