mirror of https://github.com/buster-so/buster.git
Add a placeholder for toggle
This commit is contained in:
parent
68eaacea67
commit
8729374d70
|
@ -1,6 +1,6 @@
|
|||
import { useToggleButton, useToggleButtonState } from '@platejs/toggle/react';
|
||||
import type { PlateElementProps } from 'platejs/react';
|
||||
import { PlateElement } from 'platejs/react';
|
||||
import { PlateElement, useElement, useElementSelector } from 'platejs/react';
|
||||
import { Button } from '@/components/ui/buttons';
|
||||
import { ChevronRight } from '@/components/ui/icons';
|
||||
import { cn } from '@/lib/classMerge';
|
||||
|
@ -9,6 +9,7 @@ export function ToggleElement(props: PlateElementProps) {
|
|||
const element = props.element;
|
||||
const state = useToggleButtonState(element.id as string);
|
||||
const { buttonProps, open } = useToggleButton(state);
|
||||
const hasContent = element.children.some((child) => child.text);
|
||||
|
||||
return (
|
||||
<PlateElement {...props} className="pl-6">
|
||||
|
@ -24,6 +25,14 @@ export function ToggleElement(props: PlateElementProps) {
|
|||
</div>
|
||||
}
|
||||
/>
|
||||
{!hasContent && (
|
||||
<span
|
||||
contentEditable={false}
|
||||
className="absolute top-0 left-6.5 select-none text-text-tertiary pointer-events-none"
|
||||
>
|
||||
Type here...
|
||||
</span>
|
||||
)}
|
||||
{props.children}
|
||||
</PlateElement>
|
||||
);
|
||||
|
|
Loading…
Reference in New Issue