2025-02-05 00:07:38 +05:30

56 lines
1.5 KiB
TypeScript

import React from 'react';
type Props = {
header: React.JSX.Element;
content: React.JSX.Element;
};
type ClsHeaderSkeletonProps = {
name: string;
};
export const ClsHeaderSkeleton: React.FC<ClsHeaderSkeletonProps> = ({ name }) => {
return (
<p className="text-xs">
<span className="text-red-500">class</span>
<span className="text-purple-400 pl-1">{name}</span>
</p>
);
};
type MethodHeaderSkeletonProps = {
name: string;
};
export const MethodHeaderSkeleton: React.FC<MethodHeaderSkeletonProps> = ({ name }) => {
return (
<p className="text-xs">
<span className="text-red-500">def</span>
<span className="text-sky-400 pl-1">{name}</span>
</p>
);
};
type DefaultContentProps = {
name?: string;
description: string;
docTeaser?: string;
};
export const DefaultContent: React.FC<DefaultContentProps> = ({ name, description, docTeaser }) => {
return (
<>
<p className="text-xs">
{name && <span className="bg-gray-500 px-1 rounded-[2px] text-gray-100">{name}</span>}
<span className="text-gray-400 pl-1">{description}</span>
</p>
<p className="text-gray-500 text-xs mt-4 whitespace-pre-line">{docTeaser}</p>
</>
);
};
export const ToolbarSkeleton: React.FC<Props> = ({ header, content }) => {
return (
<div className="bg-slate-500/10 border rounded max-w-96">
<div className="bg-slate-500/10 border-b-[0.5px] px-2 py-2">{header}</div>
<div className="px-2 py-4">{content}</div>
</div>
);
};