@remotion/studio
Version:
APIs for interacting with the Remotion Studio
49 lines (48 loc) • 2.56 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.FullScreenToggle = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const remotion_1 = require("remotion");
const no_react_1 = require("remotion/no-react");
const use_keybinding_1 = require("../helpers/use-keybinding");
const canvas_ref_1 = require("../state/canvas-ref");
const ControlButton_1 = require("./ControlButton");
const accessibilityLabel = [
'Enter fullscreen preview',
(0, use_keybinding_1.areKeyboardShortcutsDisabled)() ? null : '(F)',
]
.filter(no_react_1.NoReactInternals.truthy)
.join(' ');
const FullScreenToggle = () => {
const keybindings = (0, use_keybinding_1.useKeybinding)();
const { setSize } = (0, react_1.useContext)(remotion_1.Internals.PreviewSizeContext);
const onClick = (0, react_1.useCallback)(() => {
var _a;
(_a = canvas_ref_1.drawRef.current) === null || _a === void 0 ? void 0 : _a.requestFullscreen();
if (document.fullscreenElement)
setSize(() => ({
size: 'auto',
translation: {
x: 0,
y: 0,
},
}));
}, [setSize]);
(0, react_1.useEffect)(() => {
const f = keybindings.registerKeybinding({
event: 'keydown',
key: 'f',
callback: onClick,
commandCtrlKey: false,
preventDefault: true,
triggerIfInputFieldFocused: false,
keepRegisteredWhenNotHighestContext: false,
});
return () => {
f.unregister();
};
}, [keybindings, onClick]);
return (jsx_runtime_1.jsx(ControlButton_1.ControlButton, { title: accessibilityLabel, "aria-label": accessibilityLabel, onClick: onClick, children: jsx_runtime_1.jsx("svg", { style: { width: 18, height: 18 }, viewBox: "0 0 448 512", fill: "#fff", children: jsx_runtime_1.jsx("path", { d: "M0 180V56c0-13.3 10.7-24 24-24h124c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12H64v84c0 6.6-5.4 12-12 12H12c-6.6 0-12-5.4-12-12zM288 44v40c0 6.6 5.4 12 12 12h84v84c0 6.6 5.4 12 12 12h40c6.6 0 12-5.4 12-12V56c0-13.3-10.7-24-24-24H300c-6.6 0-12 5.4-12 12zm148 276h-40c-6.6 0-12 5.4-12 12v84h-84c-6.6 0-12 5.4-12 12v40c0 6.6 5.4 12 12 12h124c13.3 0 24-10.7 24-24V332c0-6.6-5.4-12-12-12zM160 468v-40c0-6.6-5.4-12-12-12H64v-84c0-6.6-5.4-12-12-12H12c-6.6 0-12 5.4-12 12v124c0 13.3 10.7 24 24 24h124c6.6 0 12-5.4 12-12z" }) }) }));
};
exports.FullScreenToggle = FullScreenToggle;