@premieroctet/next-admin
Version:
Next-Admin provides a customizable and turnkey admin dashboard for applications built with Next.js and powered by the Prisma ORM. It aims to simplify the development process by providing a turnkey admin system that can be easily integrated into your proje
55 lines (54 loc) • 2.83 kB
JavaScript
import { jsx } from "react/jsx-runtime";
import external_clsx_default from "clsx";
import { cloneElement, forwardRef } from "react";
import { useSlate } from "slate-react";
import { isBlockActive, isMark, isMarkActive, toggleBlock, toggleMark } from "./utils.mjs";
import { getClonableElement } from "../../../utils/react19-compat.mjs";
const Button = /*#__PURE__*/ forwardRef(({ className, format, icon, ...props }, ref)=>{
const editor = useSlate();
let active;
let handleMouseDown;
if (isMark(format)) {
active = isMarkActive(editor, format);
handleMouseDown = (event)=>{
event.preventDefault();
toggleMark(editor, format);
};
} else {
active = isBlockActive(editor, format);
handleMouseDown = (event)=>{
event.preventDefault();
toggleBlock(editor, format);
};
}
return /*#__PURE__*/ jsx("button", {
...props,
ref: ref,
className: external_clsx_default("pointer focus:ring-nextadmin-border-default dark:focus:ring-dark-nextadmin-border-strong rounded-md p-1.5 focus:outline-none focus:ring-2", {
"bg-nextadmin-background-emphasis hover:bg-nextadmin-background-muted focus:bg-nextadmin-background-muted dark:bg-dark-nextadmin-background-subtle dark:hover:bg-dark-nextadmin-background-muted dark:focus:bg-dark-nextadmin-background-muted": active,
"bg-nextadmin-background-default dark:bg-dark-nextadmin-background-default hover:bg-gray-100 focus:bg-gray-100": !active
}, "disabled:cursor-not-allowed disabled:opacity-50", className),
onMouseDown: handleMouseDown,
onClick: (event)=>event.preventDefault(),
children: /*#__PURE__*/ cloneElement(getClonableElement(icon), {
className: "fill-nextadmin-content-emphasis dark:fill-dark-nextadmin-content-emphasis"
})
});
});
const EditorContainer = /*#__PURE__*/ forwardRef(({ className, children }, ref)=>/*#__PURE__*/ jsx("div", {
ref: ref,
className: className,
children: children
}));
const Separator = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx("div", {
...props,
ref: ref,
className: external_clsx_default("border-nextadmin-border-default dark:border-dark-nextadmin-border-default my-1 rounded-md border-x-[0.5px]", className)
}));
const Toolbar = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx("div", {
...props,
ref: ref,
"data-test-id": "menu",
className: external_clsx_default("ring-nextadmin-border-default dark:ring-dark-nextadmin-border-strong !last:border-r-0 flex flex-row gap-1 rounded-t-md border-b-0 p-1.5 ring-1", className)
}));
export { Button, EditorContainer, Separator, Toolbar };