Update toggle kit

This commit is contained in:
Nate Kelley 2025-09-09 21:43:08 -06:00 committed by Wells Bunker
parent 3b90c44ecc
commit 68eaacea67
No known key found for this signature in database
GPG Key ID: DB16D6F2679B78FC
3 changed files with 11 additions and 9 deletions

View File

@ -1,8 +1,6 @@
import { useToggleButton, useToggleButtonState } from '@platejs/toggle/react';
import type { PlateElementProps } from 'platejs/react';
import { PlateElement } from 'platejs/react';
import * as React from 'react';
import { Button } from '@/components/ui/buttons';
import { ChevronRight } from '@/components/ui/icons';
import { cn } from '@/lib/classMerge';
@ -15,16 +13,17 @@ export function ToggleElement(props: PlateElementProps) {
return (
<PlateElement {...props} className="pl-6">
<Button
size="small"
variant="ghost"
className="text-muted-foreground hover:bg-accent absolute top-0 -left-0.5 size-6 cursor-pointer items-center justify-center rounded-md p-px transition-colors select-none [&_svg]:size-4"
className="absolute top-0 -left-0.5 size-6 cursor-pointer items-center justify-center rounded-md p-px text-muted-foreground transition-colors select-none hover:bg-accent [&_svg]:size-4"
contentEditable={false}
{...buttonProps}
prefix={
<div className={cn('transition-transform duration-75', open ? 'rotate-90' : 'rotate-0')}>
<div className={cn('transition-transform duration-100', open ? 'rotate-90' : 'rotate-0')}>
<ChevronRight />
</div>
}
></Button>
/>
{props.children}
</PlateElement>
);

View File

@ -1,5 +1,8 @@
import { BaseTogglePlugin } from '@platejs/toggle';
'use client';
import { ToggleElementStatic } from '../elements/ToggleNodeStatic';
import { TogglePlugin } from '@platejs/toggle/react';
export const BaseToggleKit = [BaseTogglePlugin.withComponent(ToggleElementStatic)];
import { ToggleElement } from '@/components/ui/report/elements/ToggleNode';
import { IndentKit } from './indent-kit';
export const ToggleKit = [...IndentKit, TogglePlugin.withComponent(ToggleElement)];