arthur/ui
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/ui.git synced 2026-01-14 12:14:41 +01:00
Code Issues Packages Projects Releases Wiki Activity
Files
d4a943e631b5e16dc7863395f1dd906087228e1c
ui/test/components/__snapshots__/Checkbox-vue.spec.ts.snap
Daniel Roe d4a943e631 feat(module): add support for vue using unplugin (#2416) 
Co-authored-by: Benjamin Canac <canacb1@gmail.com>
2024-10-25 17:15:26 +02:00

235 lines
14 KiB
Plaintext
Raw Blame History

// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`Checkbox > renders with class correctly 1`] = `
"<div class="relative items-start inline-flex">
<div class="flex items-center h-5"><button class="shrink-0 flex items-center justify-center rounded-[var(--ui-radius)] text-[var(--ui-bg)] ring ring-inset ring-[var(--ui-border-accented)] focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)] size-4" id="v-0" role="checkbox" type="button" aria-checked="false" aria-required="false" data-state="unchecked">
<!---->
</button>
<!---->
</div>
<!--v-if-->
</div>"
`;
exports[`Checkbox > renders with color neutral correctly 1`] = `
"<div class="relative flex items-start">
<div class="flex items-center h-5"><button class="shrink-0 flex items-center justify-center rounded-[var(--ui-radius)] text-[var(--ui-bg)] ring-inset focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-border-inverted)] size-4 ring-2 ring-[var(--ui-border-inverted)] bg-[var(--ui-bg-inverted)]" id="v-0" role="checkbox" type="button" aria-checked="true" aria-required="false" data-state="checked"><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-full" data-state="checked" style="pointer-events: none;" width="1em" height="1em" viewBox="0 0 16 16"></svg></button>
<!---->
</div>
<!--v-if-->
</div>"
`;
exports[`Checkbox > renders with defaultValue correctly 1`] = `
"<div class="relative flex items-start">
<div class="flex items-center h-5"><button class="shrink-0 flex items-center justify-center rounded-[var(--ui-radius)] text-[var(--ui-bg)] ring-inset focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)] size-4 ring-2 ring-[var(--ui-primary)] bg-[var(--ui-primary)]" id="v-0" role="checkbox" type="button" aria-checked="true" aria-required="false" data-state="checked"><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-full" data-state="checked" style="pointer-events: none;" width="1em" height="1em" viewBox="0 0 16 16"></svg></button>
<!---->
</div>
<!--v-if-->
</div>"
`;
exports[`Checkbox > renders with description correctly 1`] = `
"<div class="relative flex items-start">
<div class="flex items-center h-5"><button class="shrink-0 flex items-center justify-center rounded-[var(--ui-radius)] text-[var(--ui-bg)] ring ring-inset ring-[var(--ui-border-accented)] focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)] size-4" id="v-0" role="checkbox" type="button" aria-checked="false" aria-required="false" data-state="unchecked">
<!---->
</button>
<!---->
</div>
<div class="ms-2 text-sm"><label for="v-0" class="block font-medium text-[var(--ui-text)]">Label</label>
<p class="text-[var(--ui-text-muted)]">Description</p>
</div>
</div>"
`;
exports[`Checkbox > renders with description slot correctly 1`] = `
"<div class="relative flex items-start">
<div class="flex items-center h-5"><button class="shrink-0 flex items-center justify-center rounded-[var(--ui-radius)] text-[var(--ui-bg)] ring ring-inset ring-[var(--ui-border-accented)] focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)] size-4" id="v-0" role="checkbox" type="button" aria-checked="false" aria-required="false" data-state="unchecked">
<!---->
</button>
<!---->
</div>
<div class="ms-2 text-sm"><label for="v-0" class="block font-medium text-[var(--ui-text)]">Description slot</label>
<!--v-if-->
</div>
</div>"
`;
exports[`Checkbox > renders with disabled correctly 1`] = `
"<div class="relative flex items-start">
<div class="flex items-center h-5"><button class="shrink-0 flex items-center justify-center rounded-[var(--ui-radius)] text-[var(--ui-bg)] ring ring-inset ring-[var(--ui-border-accented)] focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)] size-4 cursor-not-allowed opacity-75" id="v-0" role="checkbox" type="button" aria-checked="false" aria-required="false" data-state="unchecked" data-disabled="" disabled="">
<!---->
</button>
<!---->
</div>
<!--v-if-->
</div>"
`;
exports[`Checkbox > renders with icon correctly 1`] = `
"<div class="relative flex items-start">
<div class="flex items-center h-5"><button class="shrink-0 flex items-center justify-center rounded-[var(--ui-radius)] text-[var(--ui-bg)] ring ring-inset ring-[var(--ui-border-accented)] focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)] size-4" id="v-0" role="checkbox" type="button" aria-checked="false" aria-required="false" data-state="unchecked">
<!---->
</button>
<!---->
</div>
<!--v-if-->
</div>"
`;
exports[`Checkbox > renders with id correctly 1`] = `
"<div class="relative flex items-start">
<div class="flex items-center h-5"><button class="shrink-0 flex items-center justify-center rounded-[var(--ui-radius)] text-[var(--ui-bg)] ring ring-inset ring-[var(--ui-border-accented)] focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)] size-4" id="id" role="checkbox" type="button" aria-checked="false" aria-required="false" data-state="unchecked">
<!---->
</button>
<!---->
</div>
<!--v-if-->
</div>"
`;
exports[`Checkbox > renders with indeterminate correctly 1`] = `
"<div class="relative flex items-start">
<div class="flex items-center h-5"><button class="shrink-0 flex items-center justify-center rounded-[var(--ui-radius)] text-[var(--ui-bg)] ring-inset focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)] size-4 ring-2 ring-[var(--ui-primary)] bg-[var(--ui-primary)]" id="v-0" role="checkbox" type="button" aria-checked="mixed" aria-required="false" data-state="indeterminate"><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-full" data-state="indeterminate" style="pointer-events: none;" width="1em" height="1em" viewBox="0 0 16 16"></svg></button>
<!---->
</div>
<!--v-if-->
</div>"
`;
exports[`Checkbox > renders with indeterminateIcon correctly 1`] = `
"<div class="relative flex items-start">
<div class="flex items-center h-5"><button class="shrink-0 flex items-center justify-center rounded-[var(--ui-radius)] text-[var(--ui-bg)] ring-inset focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)] size-4 ring-2 ring-[var(--ui-primary)] bg-[var(--ui-primary)]" id="v-0" role="checkbox" type="button" aria-checked="mixed" aria-required="false" data-state="indeterminate"><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-full" data-state="indeterminate" style="pointer-events: none;" width="1em" height="1em" viewBox="0 0 16 16"></svg></button>
<!---->
</div>
<!--v-if-->
</div>"
`;
exports[`Checkbox > renders with label correctly 1`] = `
"<div class="relative flex items-start">
<div class="flex items-center h-5"><button class="shrink-0 flex items-center justify-center rounded-[var(--ui-radius)] text-[var(--ui-bg)] ring ring-inset ring-[var(--ui-border-accented)] focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)] size-4" id="v-0" role="checkbox" type="button" aria-checked="false" aria-required="false" data-state="unchecked">
<!---->
</button>
<!---->
</div>
<div class="ms-2 text-sm"><label for="v-0" class="block font-medium text-[var(--ui-text)]">Label</label>
<!--v-if-->
</div>
</div>"
`;
exports[`Checkbox > renders with label slot correctly 1`] = `
"<div class="relative flex items-start">
<div class="flex items-center h-5"><button class="shrink-0 flex items-center justify-center rounded-[var(--ui-radius)] text-[var(--ui-bg)] ring ring-inset ring-[var(--ui-border-accented)] focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)] size-4" id="v-0" role="checkbox" type="button" aria-checked="false" aria-required="false" data-state="unchecked">
<!---->
</button>
<!---->
</div>
<div class="ms-2 text-sm"><label for="v-0" class="block font-medium text-[var(--ui-text)]">Label slot</label>
<!--v-if-->
</div>
</div>"
`;
exports[`Checkbox > renders with name correctly 1`] = `
"<div class="relative flex items-start">
<div class="flex items-center h-5"><button class="shrink-0 flex items-center justify-center rounded-[var(--ui-radius)] text-[var(--ui-bg)] ring ring-inset ring-[var(--ui-border-accented)] focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)] size-4" id="v-0" role="checkbox" type="button" aria-checked="false" aria-required="false" data-state="unchecked">
<!---->
</button>
<!---->
</div>
<!--v-if-->
</div>"
`;
exports[`Checkbox > renders with required correctly 1`] = `
"<div class="relative flex items-start">
<div class="flex items-center h-5"><button class="shrink-0 flex items-center justify-center rounded-[var(--ui-radius)] text-[var(--ui-bg)] ring ring-inset ring-[var(--ui-border-accented)] focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)] size-4" id="v-0" role="checkbox" type="button" aria-checked="false" aria-required="false" data-state="unchecked">
<!---->
</button>
<!---->
</div>
<div class="ms-2 text-sm"><label for="v-0" class="block font-medium text-[var(--ui-text)] after:content-['*'] after:ms-0.5 after:text-[var(--ui-error)]">Label</label>
<!--v-if-->
</div>
</div>"
`;
exports[`Checkbox > renders with size lg correctly 1`] = `
"<div class="relative flex items-start">
<div class="flex items-center h-5"><button class="shrink-0 flex items-center justify-center rounded-[var(--ui-radius)] text-[var(--ui-bg)] ring ring-inset ring-[var(--ui-border-accented)] focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)] size-4.5" id="v-0" role="checkbox" type="button" aria-checked="false" aria-required="false" data-state="unchecked">
<!---->
</button>
<!---->
</div>
<!--v-if-->
</div>"
`;
exports[`Checkbox > renders with size md correctly 1`] = `
"<div class="relative flex items-start">
<div class="flex items-center h-5"><button class="shrink-0 flex items-center justify-center rounded-[var(--ui-radius)] text-[var(--ui-bg)] ring ring-inset ring-[var(--ui-border-accented)] focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)] size-4" id="v-0" role="checkbox" type="button" aria-checked="false" aria-required="false" data-state="unchecked">
<!---->
</button>
<!---->
</div>
<!--v-if-->
</div>"
`;
exports[`Checkbox > renders with size sm correctly 1`] = `
"<div class="relative flex items-start">
<div class="flex items-center h-4"><button class="shrink-0 flex items-center justify-center rounded-[var(--ui-radius)] text-[var(--ui-bg)] ring ring-inset ring-[var(--ui-border-accented)] focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)] size-3.5" id="v-0" role="checkbox" type="button" aria-checked="false" aria-required="false" data-state="unchecked">
<!---->
</button>
<!---->
</div>
<!--v-if-->
</div>"
`;
exports[`Checkbox > renders with size xl correctly 1`] = `
"<div class="relative flex items-start">
<div class="flex items-center h-6"><button class="shrink-0 flex items-center justify-center rounded-[var(--ui-radius)] text-[var(--ui-bg)] ring ring-inset ring-[var(--ui-border-accented)] focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)] size-5" id="v-0" role="checkbox" type="button" aria-checked="false" aria-required="false" data-state="unchecked">
<!---->
</button>
<!---->
</div>
<!--v-if-->
</div>"
`;
exports[`Checkbox > renders with size xs correctly 1`] = `
"<div class="relative flex items-start">
<div class="flex items-center h-4"><button class="shrink-0 flex items-center justify-center rounded-[var(--ui-radius)] text-[var(--ui-bg)] ring ring-inset ring-[var(--ui-border-accented)] focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)] size-3" id="v-0" role="checkbox" type="button" aria-checked="false" aria-required="false" data-state="unchecked">
<!---->
</button>
<!---->
</div>
<!--v-if-->
</div>"
`;
exports[`Checkbox > renders with ui correctly 1`] = `
"<div class="relative flex items-start">
<div class="flex items-center h-5"><button class="shrink-0 flex items-center justify-center rounded-[var(--ui-radius)] text-[var(--ui-bg)] ring ring-inset ring-[var(--ui-border-accented)] focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)] size-4" id="v-0" role="checkbox" type="button" aria-checked="false" aria-required="false" data-state="unchecked">
<!---->
</button>
<!---->
</div>
<!--v-if-->
</div>"
`;
exports[`Checkbox > renders with value correctly 1`] = `
"<div class="relative flex items-start">
<div class="flex items-center h-5"><button class="shrink-0 flex items-center justify-center rounded-[var(--ui-radius)] text-[var(--ui-bg)] ring ring-inset ring-[var(--ui-border-accented)] focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)] size-4" id="v-0" role="checkbox" type="button" aria-checked="false" aria-required="false" data-state="unchecked">
<!---->
</button>
<!---->
</div>
<!--v-if-->
</div>"
`;
Reference in New Issue View Git Blame Copy Permalink