import { FileText, Lock } from "lucide-react";
import type { KeyboardEventHandler, MouseEventHandler, ReactNode } from "react";
export type PageMentionPresentationKind = "accessible" | "pending" | "restricted";
export interface PageMentionPresentationProps {
pageId?: string | null;
label?: string | null;
icon?: ReactNode;
href?: string | null;
kind?: PageMentionPresentationKind;
ariaLabel?: string;
onClick?: MouseEventHandler;
onKeyDown?: KeyboardEventHandler;
tabIndex?: number;
}
export function PageMentionContent({
icon,
label,
restricted,
}: {
icon?: ReactNode;
label: string;
restricted?: boolean;
}) {
return (
<>
{icon ?? (restricted ? : )}
{label}
>
);
}
export function PageMentionPresentation({
pageId,
label,
icon,
href,
kind = "accessible",
ariaLabel,
onClick,
onKeyDown,
tabIndex,
}: PageMentionPresentationProps) {
const resolvedKind = pageId ? kind : "restricted";
const resolvedLabel = label?.trim() || (resolvedKind === "restricted" ? "Restricted" : "Untitled");
const className = [
"tiptap-page-mention",
resolvedKind === "pending" ? "tiptap-page-mention--pending" : "",
resolvedKind === "restricted" ? "tiptap-page-mention--restricted" : "",
]
.filter(Boolean)
.join(" ");
const commonProps = {
className,
"data-page-id": pageId || undefined,
"data-page-mention": "",
"aria-label": ariaLabel,
"aria-disabled": resolvedKind === "accessible" ? undefined : true,
onClick,
onKeyDown,
tabIndex,
};
const content = ;
if (href && resolvedKind === "accessible") {
return (
{content}
);
}
return (
{content}
);
}