Monorepo for Tangled
Something went wrong. Try again.
Svelte
at icy/tmrrpn
123456789101112131415161718192021222324252627282930313233343536373839<script lang="ts"> import Card, { type CardVariants } from "./Card.svelte"; import type { Component, Snippet } from "svelte"; import type { SvelteHTMLElements } from "svelte/elements";
interface Props { message: string; icon?: Component<SvelteHTMLElements["svg"]>; border?: CardVariants["border"]; shadow?: CardVariants["shadow"]; background?: CardVariants["background"]; children?: Snippet; }
let { message, icon, border = true, shadow = false, background = false, children }: Props = $props();
const Icon = $derived(icon);</script>
<Card {border} {shadow} {background} padding="none" class="flex flex-col items-center justify-center gap-6 p-12 typography-paragraph-large text-foreground-subtle"> {#if Icon} <Icon class="size-16 text-foreground-disabled" aria-hidden="true" /> {/if} <span class="flex items-center gap-2">{message}{@render children?.()}</span></Card>