fix(rich-input.tsx): replace default scrollbar with themed scrollbar in Summary Editor, fixed #2420

This commit is contained in:
LinuxKunaL
2025-10-17 01:22:42 +05:30
parent 4efdabd475
commit fd7b5e0dd4

View File

@ -47,6 +47,7 @@ import { Popover, PopoverContent } from "./popover";
import { Skeleton } from "./skeleton"; import { Skeleton } from "./skeleton";
import { Toggle } from "./toggle"; import { Toggle } from "./toggle";
import { Tooltip } from "./tooltip"; import { Tooltip } from "./tooltip";
import { ScrollArea } from "./scroll-area";
const InsertImageFormSchema = z.object({ const InsertImageFormSchema = z.object({
src: z.string(), src: z.string(),
@ -474,7 +475,7 @@ export const RichInput = forwardRef<Editor, RichInputProps>(
editorProps: { editorProps: {
attributes: { attributes: {
class: cn( class: cn(
"prose prose-sm prose-zinc max-h-[200px] max-w-none overflow-y-scroll dark:prose-invert focus:outline-none [&_*]:my-2", "prose prose-sm prose-zinc max-h-[200px] max-w-none dark:prose-invert focus:outline-none [&_*]:my-2",
editorClassName, editorClassName,
), ),
}, },
@ -497,15 +498,17 @@ export const RichInput = forwardRef<Editor, RichInputProps>(
<div> <div>
{!hideToolbar && <Toolbar editor={editor} />} {!hideToolbar && <Toolbar editor={editor} />}
<EditorContent <ScrollArea orientation="vertical" className="rounded-sm border px-3 py-2">
editor={editor} <EditorContent
className={cn( editor={editor}
"grid min-h-[160px] w-full rounded-sm border bg-transparent px-3 py-2 text-sm placeholder:opacity-80 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary disabled:cursor-not-allowed disabled:opacity-50", className={cn(
hideToolbar && "pt-2", "grid min-h-[160px] w-full bg-transparent text-sm placeholder:opacity-80 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary disabled:cursor-not-allowed disabled:opacity-50",
className, hideToolbar && "pt-2",
)} className,
{...props} )}
/> {...props}
/>
</ScrollArea>
{footer?.(editor)} {footer?.(editor)}
</div> </div>