update the type

This commit is contained in:
Nate Kelley 2025-07-28 16:00:00 -06:00
parent fd8bce7b53
commit 9b9e8e6e76
No known key found for this signature in database
GPG Key ID: FD90372AB8D98B4F
3 changed files with 13 additions and 13 deletions

View File

@ -54,7 +54,7 @@
"@platejs/list": "^49.2.0", "@platejs/list": "^49.2.0",
"@platejs/resizable": "^49.0.0", "@platejs/resizable": "^49.0.0",
"@platejs/selection": "^49.1.12", "@platejs/selection": "^49.1.12",
"@posthog/nextjs-config": "^1.0.2", "@posthog/nextjs-config": "^1.1.0",
"@radix-ui/react-avatar": "^1.1.10", "@radix-ui/react-avatar": "^1.1.10",
"@radix-ui/react-checkbox": "^1.3.2", "@radix-ui/react-checkbox": "^1.3.2",
"@radix-ui/react-collapsible": "^1.1.11", "@radix-ui/react-collapsible": "^1.1.11",

View File

@ -136,15 +136,7 @@ LIMIT 5;`
], ],
type: 'ul' type: 'ul'
}, },
{
children: [
{
children: [{ text: 'Multiple heading levels' }],
type: 'li'
}
],
type: 'ul'
},
{ {
children: [ children: [
{ {

View File

@ -4,19 +4,26 @@ import * as React from 'react';
import { useCalloutEmojiPicker } from '@platejs/callout/react'; import { useCalloutEmojiPicker } from '@platejs/callout/react';
import { useEmojiDropdownMenuState } from '@platejs/emoji/react'; import { useEmojiDropdownMenuState } from '@platejs/emoji/react';
import type { TElement } from 'platejs';
import { PlateElement } from 'platejs/react'; import { PlateElement } from 'platejs/react';
import type { PlateElementProps } from 'platejs/react';
import { Button } from '@/components/ui/buttons'; import { Button } from '@/components/ui/buttons';
import { cn } from '@/lib/utils'; import { cn } from '@/lib/utils';
import { EmojiPicker, EmojiPopover } from './EmojiToolbarButton'; import { EmojiPicker, EmojiPopover } from './EmojiToolbarButton';
// Define the custom element type with your specific properties
interface TCalloutElement extends TElement {
backgroundColor?: string;
icon?: string;
}
export function CalloutElement({ export function CalloutElement({
attributes, attributes,
children, children,
className,
...props ...props
}: React.ComponentProps<typeof PlateElement>) { }: PlateElementProps<TCalloutElement>) {
const { emojiPickerState, isOpen, setIsOpen } = useEmojiDropdownMenuState({ const { emojiPickerState, isOpen, setIsOpen } = useEmojiDropdownMenuState({
closeOnSelect: true closeOnSelect: true
}); });
@ -28,8 +35,9 @@ export function CalloutElement({
return ( return (
<PlateElement <PlateElement
className={cn('bg-muted my-1 flex rounded-sm p-4 pl-3', className)} className={cn('bg-muted my-1 flex rounded-sm p-4 pl-3', attributes.className)}
style={{ style={{
...attributes.style,
backgroundColor: props.element.backgroundColor backgroundColor: props.element.backgroundColor
}} }}
attributes={{ attributes={{