Files
ui/test/components/__snapshots__/Badge.spec.ts.snap
2024-12-19 13:00:31 +01:00

134 lines
9.2 KiB
Plaintext
Raw Blame History

This file contains invisible Unicode characters
This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`Badge > renders with as correctly 1`] = `
"<div class="font-medium inline-flex items-center text-xs px-2 py-1 gap-1 rounded-[calc(var(--ui-radius)*1.5)] bg-[var(--ui-primary)] text-[var(--ui-bg)]">
<!--v-if--><span class="truncate">Badge</span>
<!--v-if-->
</div>"
`;
exports[`Badge > renders with avatar and leadingIcon correctly 1`] = `
"<span class="font-medium inline-flex items-center text-xs px-2 py-1 gap-1 rounded-[calc(var(--ui-radius)*1.5)] bg-[var(--ui-primary)] text-[var(--ui-bg)]"><span class="iconify i-lucide:arrow-left shrink-0 size-4" aria-hidden="true"></span>
<!--v-if-->
<!--v-if--></span>"
`;
exports[`Badge > renders with avatar and trailingIcon correctly 1`] = `
"<span class="font-medium inline-flex items-center text-xs px-2 py-1 gap-1 rounded-[calc(var(--ui-radius)*1.5)] bg-[var(--ui-primary)] text-[var(--ui-bg)]"><span class="inline-flex items-center justify-center select-none overflow-hidden rounded-full align-middle bg-[var(--ui-bg-elevated)] size-4 text-[8px] shrink-0"><img role="img" src="https://github.com/benjamincanac.png" width="16" height="16" class="h-full w-full rounded-[inherit] object-cover" style="display: none;"><span class="font-medium leading-none text-[var(--ui-text-muted)] truncate"> </span></span>
<!--v-if--><span class="iconify i-lucide:arrow-right shrink-0 size-4" aria-hidden="true"></span></span>"
`;
exports[`Badge > renders with avatar correctly 1`] = `
"<span class="font-medium inline-flex items-center text-xs px-2 py-1 gap-1 rounded-[calc(var(--ui-radius)*1.5)] bg-[var(--ui-primary)] text-[var(--ui-bg)]"><span class="inline-flex items-center justify-center select-none overflow-hidden rounded-full align-middle bg-[var(--ui-bg-elevated)] size-4 text-[8px] shrink-0"><img role="img" src="https://github.com/benjamincanac.png" width="16" height="16" class="h-full w-full rounded-[inherit] object-cover" style="display: none;"><span class="font-medium leading-none text-[var(--ui-text-muted)] truncate"> </span></span>
<!--v-if-->
<!--v-if--></span>"
`;
exports[`Badge > renders with class correctly 1`] = `
"<span class="inline-flex items-center text-xs px-2 py-1 gap-1 bg-[var(--ui-primary)] text-[var(--ui-bg)] rounded-full font-bold"><!--v-if--><span class="truncate">Badge</span>
<!--v-if--></span>"
`;
exports[`Badge > renders with default slot correctly 1`] = `"<span class="font-medium inline-flex items-center text-xs px-2 py-1 gap-1 rounded-[calc(var(--ui-radius)*1.5)] bg-[var(--ui-primary)] text-[var(--ui-bg)]"><!--v-if-->Default slot<!--v-if--></span>"`;
exports[`Badge > renders with icon correctly 1`] = `
"<span class="font-medium inline-flex items-center text-xs px-2 py-1 gap-1 rounded-[calc(var(--ui-radius)*1.5)] bg-[var(--ui-primary)] text-[var(--ui-bg)]"><span class="iconify i-lucide:rocket shrink-0 size-4" aria-hidden="true"></span>
<!--v-if-->
<!--v-if--></span>"
`;
exports[`Badge > renders with label correctly 1`] = `
"<span class="font-medium inline-flex items-center text-xs px-2 py-1 gap-1 rounded-[calc(var(--ui-radius)*1.5)] bg-[var(--ui-primary)] text-[var(--ui-bg)]"><!--v-if--><span class="truncate">Badge</span>
<!--v-if--></span>"
`;
exports[`Badge > renders with leading and icon correctly 1`] = `
"<span class="font-medium inline-flex items-center text-xs px-2 py-1 gap-1 rounded-[calc(var(--ui-radius)*1.5)] bg-[var(--ui-primary)] text-[var(--ui-bg)]"><span class="iconify i-lucide:arrow-left shrink-0 size-4" aria-hidden="true"></span>
<!--v-if-->
<!--v-if--></span>"
`;
exports[`Badge > renders with leading slot correctly 1`] = `"<span class="font-medium inline-flex items-center text-xs px-2 py-1 gap-1 rounded-[calc(var(--ui-radius)*1.5)] bg-[var(--ui-primary)] text-[var(--ui-bg)]">Leading slot<!--v-if--><!--v-if--></span>"`;
exports[`Badge > renders with leadingIcon correctly 1`] = `
"<span class="font-medium inline-flex items-center text-xs px-2 py-1 gap-1 rounded-[calc(var(--ui-radius)*1.5)] bg-[var(--ui-primary)] text-[var(--ui-bg)]"><span class="iconify i-lucide:arrow-left shrink-0 size-4" aria-hidden="true"></span>
<!--v-if-->
<!--v-if--></span>"
`;
exports[`Badge > renders with neutral variant outline correctly 1`] = `
"<span class="font-medium inline-flex items-center text-xs px-2 py-1 gap-1 rounded-[calc(var(--ui-radius)*1.5)] ring ring-inset ring-[var(--ui-border-accented)] text-[var(--ui-text)] bg-[var(--ui-bg)]"><!--v-if--><span class="truncate">Badge</span>
<!--v-if--></span>"
`;
exports[`Badge > renders with neutral variant soft correctly 1`] = `
"<span class="font-medium inline-flex items-center text-xs px-2 py-1 gap-1 rounded-[calc(var(--ui-radius)*1.5)] text-[var(--ui-text)] bg-[var(--ui-bg-elevated)]"><!--v-if--><span class="truncate">Badge</span>
<!--v-if--></span>"
`;
exports[`Badge > renders with neutral variant solid correctly 1`] = `
"<span class="font-medium inline-flex items-center text-xs px-2 py-1 gap-1 rounded-[calc(var(--ui-radius)*1.5)] text-[var(--ui-bg)] bg-[var(--ui-bg-inverted)]"><!--v-if--><span class="truncate">Badge</span>
<!--v-if--></span>"
`;
exports[`Badge > renders with neutral variant subtle correctly 1`] = `
"<span class="font-medium inline-flex items-center text-xs px-2 py-1 gap-1 rounded-[calc(var(--ui-radius)*1.5)] ring ring-inset ring-[var(--ui-border-accented)] text-[var(--ui-text)] bg-[var(--ui-bg-elevated)]"><!--v-if--><span class="truncate">Badge</span>
<!--v-if--></span>"
`;
exports[`Badge > renders with primary variant outline correctly 1`] = `
"<span class="font-medium inline-flex items-center text-xs px-2 py-1 gap-1 rounded-[calc(var(--ui-radius)*1.5)] text-[var(--ui-primary)] ring ring-inset ring-[var(--ui-primary)]/50"><!--v-if--><span class="truncate">Badge</span>
<!--v-if--></span>"
`;
exports[`Badge > renders with primary variant soft correctly 1`] = `
"<span class="font-medium inline-flex items-center text-xs px-2 py-1 gap-1 rounded-[calc(var(--ui-radius)*1.5)] bg-[var(--ui-primary)]/10 text-[var(--ui-primary)]"><!--v-if--><span class="truncate">Badge</span>
<!--v-if--></span>"
`;
exports[`Badge > renders with primary variant solid correctly 1`] = `
"<span class="font-medium inline-flex items-center text-xs px-2 py-1 gap-1 rounded-[calc(var(--ui-radius)*1.5)] bg-[var(--ui-primary)] text-[var(--ui-bg)]"><!--v-if--><span class="truncate">Badge</span>
<!--v-if--></span>"
`;
exports[`Badge > renders with primary variant subtle correctly 1`] = `
"<span class="font-medium inline-flex items-center text-xs px-2 py-1 gap-1 rounded-[calc(var(--ui-radius)*1.5)] bg-[var(--ui-primary)]/10 text-[var(--ui-primary)] ring ring-inset ring-[var(--ui-primary)]/25"><!--v-if--><span class="truncate">Badge</span>
<!--v-if--></span>"
`;
exports[`Badge > renders with size lg correctly 1`] = `
"<span class="font-medium inline-flex items-center text-sm px-2 py-1 gap-1.5 rounded-[calc(var(--ui-radius)*1.5)] bg-[var(--ui-primary)] text-[var(--ui-bg)]"><!--v-if--><span class="truncate">Badge</span>
<!--v-if--></span>"
`;
exports[`Badge > renders with size md correctly 1`] = `
"<span class="font-medium inline-flex items-center text-xs px-2 py-1 gap-1 rounded-[calc(var(--ui-radius)*1.5)] bg-[var(--ui-primary)] text-[var(--ui-bg)]"><!--v-if--><span class="truncate">Badge</span>
<!--v-if--></span>"
`;
exports[`Badge > renders with size sm correctly 1`] = `
"<span class="font-medium inline-flex items-center text-[10px]/3 px-1.5 py-1 gap-1 rounded-[calc(var(--ui-radius))] bg-[var(--ui-primary)] text-[var(--ui-bg)]"><!--v-if--><span class="truncate">Badge</span>
<!--v-if--></span>"
`;
exports[`Badge > renders with size xl correctly 1`] = `
"<span class="font-medium inline-flex items-center text-base px-2.5 py-1 gap-1.5 rounded-[calc(var(--ui-radius)*1.5)] bg-[var(--ui-primary)] text-[var(--ui-bg)]"><!--v-if--><span class="truncate">Badge</span>
<!--v-if--></span>"
`;
exports[`Badge > renders with size xs correctly 1`] = `
"<span class="font-medium inline-flex items-center text-[8px]/3 px-1 py-0.5 gap-1 rounded-[calc(var(--ui-radius))] bg-[var(--ui-primary)] text-[var(--ui-bg)]"><!--v-if--><span class="truncate">Badge</span>
<!--v-if--></span>"
`;
exports[`Badge > renders with trailing and icon correctly 1`] = `"<span class="font-medium inline-flex items-center text-xs px-2 py-1 gap-1 rounded-[calc(var(--ui-radius)*1.5)] bg-[var(--ui-primary)] text-[var(--ui-bg)]"><!--v-if--><!--v-if--><span class="iconify i-lucide:arrow-right shrink-0 size-4" aria-hidden="true"></span></span>"`;
exports[`Badge > renders with trailing slot correctly 1`] = `"<span class="font-medium inline-flex items-center text-xs px-2 py-1 gap-1 rounded-[calc(var(--ui-radius)*1.5)] bg-[var(--ui-primary)] text-[var(--ui-bg)]"><!--v-if--><!--v-if-->Trailing slot</span>"`;
exports[`Badge > renders with trailingIcon correctly 1`] = `"<span class="font-medium inline-flex items-center text-xs px-2 py-1 gap-1 rounded-[calc(var(--ui-radius)*1.5)] bg-[var(--ui-primary)] text-[var(--ui-bg)]"><!--v-if--><!--v-if--><span class="iconify i-lucide:arrow-right shrink-0 size-4" aria-hidden="true"></span></span>"`;
exports[`Badge > renders with ui correctly 1`] = `
"<span class="font-medium inline-flex items-center text-xs px-2 py-1 gap-1 rounded-[calc(var(--ui-radius)*1.5)] bg-[var(--ui-primary)] text-[var(--ui-bg)]"><!--v-if--><span class="truncate font-bold">Badge</span>
<!--v-if--></span>"
`;