import React from "react"; import { t } from "../i18n"; import { isDarwin, isWindows } from "../keys"; import { Dialog } from "./Dialog"; import { getShortcutKey } from "../utils"; import "./HelpDialog.scss"; const Header = () => (
{t("helpDialog.documentation")} {t("helpDialog.blog")} {t("helpDialog.github")}
); const Section = (props: { title: string; children: React.ReactNode }) => ( <>

{props.title}

{props.children} ); const Columns = (props: { children: React.ReactNode }) => (
{props.children}
); const Column = (props: { children: React.ReactNode }) => (
{props.children}
); const ShortcutIsland = (props: { caption: string; children: React.ReactNode; }) => (

{props.caption}

{props.children}
); const Shortcut = (props: { label: string; shortcuts: string[]; isOr: boolean; }) => { return (
{props.label}
{props.shortcuts.map((shortcut, index) => ( {shortcut} {props.isOr && index !== props.shortcuts.length - 1 && t("helpDialog.or")} ))}
); }; Shortcut.defaultProps = { isOr: true, }; const ShortcutKey = (props: { children: React.ReactNode }) => ( ); export const HelpDialog = ({ onClose }: { onClose?: () => void }) => { const handleClose = React.useCallback(() => { if (onClose) { onClose(); } }, [onClose]); return ( <>
); };