@brizy/ui
Version:
React elements in Brizy style
35 lines (34 loc) • 2.38 kB
JavaScript
import React, { forwardRef } from "react";
import { useTranslation } from "../utils/localization/useTranslation";
export const Toolbar = forwardRef((_, ref) => {
const { t } = useTranslation();
return (React.createElement("div", { ref: ref },
React.createElement("span", { className: "ql-formats" },
React.createElement("select", { className: "ql-header", defaultValue: "0" },
React.createElement("option", { value: "0" }, t("Paragraph")),
React.createElement("option", { value: "1" }, t("Heading 1")),
React.createElement("option", { value: "2" }, t("Heading 2")),
React.createElement("option", { value: "3" }, t("Heading 3")),
React.createElement("option", { value: "4" }, t("Heading 4")),
React.createElement("option", { value: "5" }, t("Heading 5")),
React.createElement("option", { value: "6" }, t("Heading 6"))),
React.createElement("button", { className: "ql-blockquote" })),
React.createElement("span", { className: "ql-formats" },
React.createElement("button", { className: "ql-bold" }),
React.createElement("button", { className: "ql-italic" }),
React.createElement("button", { className: "ql-underline" })),
React.createElement("span", { className: "ql-formats" },
React.createElement("button", { type: "button", className: "ql-list", value: "bullet" }),
React.createElement("button", { type: "button", className: "ql-list", value: "ordered" }),
React.createElement("button", { type: "button", className: "ql-indent", value: "-1" }),
React.createElement("button", { type: "button", className: "ql-indent", value: "+1" })),
React.createElement("span", { className: "ql-formats" },
React.createElement("select", { className: "ql-align" }),
React.createElement("select", { className: "ql-color" }),
React.createElement("select", { className: "ql-background" })),
React.createElement("span", { className: "ql-formats" },
React.createElement("button", { className: "ql-link" }),
React.createElement("button", { className: "ql-video" }),
React.createElement("button", { className: "ql-clean" }))));
});
Toolbar.displayName = "Toolbar";