Skip to content

Commit

Permalink
test: update vue snapshots
Browse files Browse the repository at this point in the history
  • Loading branch information
@benjamincanac
benjamincanac committed Dec 13, 2024
1 parent d9967f5 commit 2fc43d6
Show file tree
Hide file tree
Showing 3 changed files with 62 additions and 52 deletions.
60 changes: 35 additions & 25 deletions test/components/__snapshots__/Badge-vue.spec.ts.snap
View file
Original file line number Diff line number Diff line change
@@ -1,21 +1,21 @@
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html

exports[`Badge > renders with as correctly 1`] = `
"<div class="rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center text-xs px-2 py-1 gap-1 bg-[var(--ui-primary)] text-[var(--ui-bg)]">
"<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="rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center text-xs px-2 py-1 gap-1 bg-[var(--ui-primary)] text-[var(--ui-bg)]"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="shrink-0 size-4" width="1em" height="1em" viewBox="0 0 16 16"></svg><!--v-if--><!--v-if--></span>"`;
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)]"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="shrink-0 size-4" width="1em" height="1em" viewBox="0 0 16 16"></svg><!--v-if--><!--v-if--></span>"`;

exports[`Badge > renders with avatar and trailingIcon correctly 1`] = `
"<span class="rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center text-xs px-2 py-1 gap-1 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>
"<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--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="shrink-0 size-4" width="1em" height="1em" viewBox="0 0 16 16"></svg></span>"
`;
exports[`Badge > renders with avatar correctly 1`] = `
"<span class="rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center text-xs px-2 py-1 gap-1 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>
"<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>"
`;
Expand All @@ -25,83 +25,93 @@ exports[`Badge > renders with class correctly 1`] = `
<!--v-if--></span>"
`;
exports[`Badge > renders with default slot correctly 1`] = `"<span class="rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center text-xs px-2 py-1 gap-1 bg-[var(--ui-primary)] text-[var(--ui-bg)]"><!--v-if-->Default slot<!--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="rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center text-xs px-2 py-1 gap-1 bg-[var(--ui-primary)] text-[var(--ui-bg)]"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="shrink-0 size-4" width="1em" height="1em" viewBox="0 0 16 16"></svg><!--v-if--><!--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)]"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="shrink-0 size-4" width="1em" height="1em" viewBox="0 0 16 16"></svg><!--v-if--><!--v-if--></span>"`;
exports[`Badge > renders with label correctly 1`] = `
"<span class="rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center text-xs px-2 py-1 gap-1 bg-[var(--ui-primary)] text-[var(--ui-bg)]"><!--v-if--><span class="truncate">Badge</span>
"<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="rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center text-xs px-2 py-1 gap-1 bg-[var(--ui-primary)] text-[var(--ui-bg)]"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="shrink-0 size-4" width="1em" height="1em" viewBox="0 0 16 16"></svg><!--v-if--><!--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)]"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="shrink-0 size-4" width="1em" height="1em" viewBox="0 0 16 16"></svg><!--v-if--><!--v-if--></span>"`;
exports[`Badge > renders with leading slot correctly 1`] = `"<span class="rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center text-xs px-2 py-1 gap-1 bg-[var(--ui-primary)] text-[var(--ui-bg)]">Leading slot<!--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="rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center text-xs px-2 py-1 gap-1 bg-[var(--ui-primary)] text-[var(--ui-bg)]"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="shrink-0 size-4" width="1em" height="1em" viewBox="0 0 16 16"></svg><!--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)]"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="shrink-0 size-4" width="1em" height="1em" viewBox="0 0 16 16"></svg><!--v-if--><!--v-if--></span>"`;
exports[`Badge > renders with neutral variant outline correctly 1`] = `
"<span class="rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center text-xs px-2 py-1 gap-1 ring ring-inset ring-[var(--ui-border-accented)] text-[var(--ui-text)] bg-[var(--ui-bg)]"><!--v-if--><span class="truncate">Badge</span>
"<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="rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center text-xs px-2 py-1 gap-1 text-[var(--ui-text)] bg-[var(--ui-bg-elevated)]"><!--v-if--><span class="truncate">Badge</span>
"<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="rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center text-xs px-2 py-1 gap-1 text-[var(--ui-bg)] bg-[var(--ui-bg-inverted)]"><!--v-if--><span class="truncate">Badge</span>
"<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="rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center text-xs px-2 py-1 gap-1 ring ring-inset ring-[var(--ui-border-accented)] text-[var(--ui-text)] bg-[var(--ui-bg-elevated)]"><!--v-if--><span class="truncate">Badge</span>
"<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="rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center text-xs px-2 py-1 gap-1 text-[var(--ui-primary)] ring ring-inset ring-[var(--ui-primary)]/50"><!--v-if--><span class="truncate">Badge</span>
"<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="rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center text-xs px-2 py-1 gap-1 bg-[var(--ui-primary)]/10 text-[var(--ui-primary)]"><!--v-if--><span class="truncate">Badge</span>
"<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="rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center text-xs px-2 py-1 gap-1 bg-[var(--ui-primary)] text-[var(--ui-bg)]"><!--v-if--><span class="truncate">Badge</span>
"<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="rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center text-xs px-2 py-1 gap-1 bg-[var(--ui-primary)]/10 text-[var(--ui-primary)] ring ring-inset ring-[var(--ui-primary)]/25"><!--v-if--><span class="truncate">Badge</span>
"<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="rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center text-sm px-2 py-1 gap-1.5 bg-[var(--ui-primary)] text-[var(--ui-bg)]"><!--v-if--><span class="truncate">Badge</span>
"<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="rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center text-xs px-2 py-1 gap-1 bg-[var(--ui-primary)] text-[var(--ui-bg)]"><!--v-if--><span class="truncate">Badge</span>
"<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="rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center text-xs px-1.5 py-0.5 gap-1 bg-[var(--ui-primary)] text-[var(--ui-bg)]"><!--v-if--><span class="truncate">Badge</span>
"<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 trailing and icon correctly 1`] = `"<span class="rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center text-xs px-2 py-1 gap-1 bg-[var(--ui-primary)] text-[var(--ui-bg)]"><!--v-if--><!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="shrink-0 size-4" width="1em" height="1em" viewBox="0 0 16 16"></svg></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--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="shrink-0 size-4" width="1em" height="1em" viewBox="0 0 16 16"></svg></span>"`;
exports[`Badge > renders with trailing slot correctly 1`] = `"<span class="rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center text-xs px-2 py-1 gap-1 bg-[var(--ui-primary)] text-[var(--ui-bg)]"><!--v-if--><!--v-if-->Trailing slot</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="rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center text-xs px-2 py-1 gap-1 bg-[var(--ui-primary)] text-[var(--ui-bg)]"><!--v-if--><!--v-if--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="shrink-0 size-4" width="1em" height="1em" viewBox="0 0 16 16"></svg></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--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="shrink-0 size-4" width="1em" height="1em" viewBox="0 0 16 16"></svg></span>"`;
exports[`Badge > renders with ui correctly 1`] = `
"<span class="rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center text-xs px-2 py-1 gap-1 bg-[var(--ui-primary)] text-[var(--ui-bg)]"><!--v-if--><span class="truncate font-bold">Badge</span>
"<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>"
`;
Loading

0 comments on commit 2fc43d6

Please sign in to comment.