40 lines
No EOL
1.1 KiB
Svelte
40 lines
No EOL
1.1 KiB
Svelte
<script lang="ts" module>
|
|
export type BadgeStyle = 'outline' | 'dash' | 'soft' | 'ghost';
|
|
</script>
|
|
|
|
<script lang="ts">
|
|
import type { DaisyColor, DaisySize } from '$lib/types';
|
|
import type { Snippet } from 'svelte';
|
|
|
|
type Props = {
|
|
children: Snippet;
|
|
color?: DaisyColor;
|
|
size?: DaisySize | 'xl';
|
|
style?: BadgeStyle;
|
|
};
|
|
|
|
let { children, color, size, style }: Props = $props();
|
|
</script>
|
|
|
|
<span
|
|
class="badge"
|
|
class:badge-primary={color === 'primary'}
|
|
class:badge-secondary={color === 'secondary'}
|
|
class:badge-accent={color === 'accent'}
|
|
class:badge-neutral={color === 'neutral'}
|
|
class:badge-info={color === 'info'}
|
|
class:badge-success={color === 'success'}
|
|
class:badge-warning={color === 'warning'}
|
|
class:badge-error={color === 'error'}
|
|
class:badge-xs={size === 'xs'}
|
|
class:badge-sm={size === 'sm'}
|
|
class:badge-md={size === 'md'}
|
|
class:badge-lg={size === 'lg'}
|
|
class:badge-xl={size === 'xl'}
|
|
class:badge-outline={style === 'outline'}
|
|
class:badge-dash={style === 'dash'}
|
|
class:badge-soft={style === 'soft'}
|
|
class:badge-ghost={style === 'ghost'}
|
|
>
|
|
{@render children?.()}
|
|
</span> |