a774ac673a
Some checks failed
Deploy analytics worker / Deploy analytics worker to ${{ (github.ref == 'refs/heads/production' && 'production') || (github.ref == 'refs/heads/main' && 'staging') || 'preview' }} (push) Failing after 1s
i18n upload strings / Upload latest strings (push) Failing after 1s
Deploy bemo / Deploy bemo to ${{ (github.ref == 'refs/heads/bemo-production' && 'production') || (github.ref == 'refs/heads/main' && 'staging') || 'preview' }} (push) Failing after 1s
Deploy grafana resources / ${{ github.event_name == 'push' && 'Deploy grafana resources' || 'Validate grafana resources (dry run)' }} (push) Failing after 0s
End to end tests (dotcom) / Check for relevant changes (push) Failing after 0s
End to end tests (examples) / Check for relevant changes (push) Failing after 0s
End to end tests (mermaid readability) / Check for relevant changes (push) Failing after 1s
End to end tests (perf) / Check for relevant changes (push) Failing after 0s
Publish editor extensions / Publish editor extensions (push) Failing after 1s
Publish SDK packages / Remove the publish-packages label (push) Has been skipped
Checks / Tests & checks (push) Has been cancelled
Checks / Build all projects (push) Has been cancelled
Deploy templates / Deploy templates (push) Has been cancelled
End to end tests (dotcom) / End to end tests (dotcom) (push) Has been cancelled
End to end tests (mermaid readability) / End to end tests (mermaid readability) (push) Has been cancelled
End to end tests (perf) / End to end tests (perf) (push) Has been cancelled
Deploy .com / Deploy dotcom to ${{ (github.ref == 'refs/heads/production' && 'production') || (github.ref == 'refs/heads/main' && 'staging') || 'preview' }} (push) Has been cancelled
End to end tests (examples) / End to end tests (examples) (push) Has been cancelled
Publish SDK packages / Publish SDK packages (push) Has been cancelled
Publish SDK packages / Tell user released version (push) Has been cancelled
Publish SDK packages / Publishes code templates to separate repositories (push) Has been cancelled
Publish SDK packages / Deploys the template demos with the new SDK version (push) Has been cancelled
45 lines
1.4 KiB
TypeScript
45 lines
1.4 KiB
TypeScript
import {
|
|
ExclamationCircleIcon,
|
|
ExclamationTriangleIcon,
|
|
InformationCircleIcon,
|
|
} from '@heroicons/react/20/solid'
|
|
import { cn } from '@/utils/cn'
|
|
|
|
export function Callout({
|
|
type = 'info',
|
|
children,
|
|
}: {
|
|
type?: 'info' | 'warning' | 'critical' | 'quote'
|
|
children: React.ReactNode
|
|
}) {
|
|
return (
|
|
<div
|
|
className={cn(
|
|
'py-1 -mx-5 md:mx-0',
|
|
type === 'info' && 'md:px-1 md:rounded-2xl bg-blue-50 dark:bg-blue-950/75',
|
|
type === 'warning' && 'md:px-1 md:rounded-2xl bg-amber-50 dark:bg-amber-900/50',
|
|
type === 'critical' && 'md:px-1 md:rounded-2xl bg-rose-50 dark:bg-rose-950/50'
|
|
)}
|
|
>
|
|
<div
|
|
className={cn(
|
|
'flex flex-col sm:flex-row gap-4 w-full p-5 ',
|
|
type === 'quote' && 'border-right border-zinc-400 dark:border-zinc-700 border-l-4',
|
|
type === 'info' && 'md:rounded-xl shadow dark:bg-blue-900/25',
|
|
type === 'warning' && 'md:rounded-xl shadow dark:bg-amber-900/25',
|
|
type === 'critical' && 'md:rounded-xl shadow dark:bg-rose-900/25'
|
|
)}
|
|
>
|
|
{type === 'info' && <InformationCircleIcon className="size-5 shrink-0 text-blue-500" />}
|
|
{type === 'warning' && (
|
|
<ExclamationTriangleIcon className="size-5 shrink-0 text-amber-500 dark:text-amber-400" />
|
|
)}
|
|
{type === 'critical' && (
|
|
<ExclamationCircleIcon className="size-5 shrink-0 text-rose-500 dark:text-rose-400" />
|
|
)}
|
|
<div className="-mt-0.5 [&>*:first-child]:mt-0 [&>*:last-child]:mb-0">{children}</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|