mirror of
https://github.com/ArthurDanjou/ui.git
synced 2026-01-14 20:19:34 +01:00
270 lines
16 KiB
Plaintext
270 lines
16 KiB
Plaintext
// 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 text-white dark:text-gray-900 ring ring-inset ring-gray-300 dark:ring-gray-700 focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-500 dark:focus-visible:outline-primary-400 size-4" id="19" role="checkbox" type="button" aria-checked="false" aria-required="false" data-state="unchecked">
|
|
<!---->
|
|
</button>
|
|
<!---->
|
|
</div>
|
|
<!--v-if-->
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Checkbox > renders with color black 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 text-white dark:text-gray-900 ring ring-inset ring-gray-300 dark:ring-gray-700 focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-900 dark:focus-visible:outline-white size-4" id="18" role="checkbox" type="button" aria-checked="false" aria-required="false" data-state="unchecked">
|
|
<!---->
|
|
</button>
|
|
<!---->
|
|
</div>
|
|
<!--v-if-->
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Checkbox > renders with color green 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 text-white dark:text-gray-900 ring ring-inset ring-gray-300 dark:ring-gray-700 focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-green-500 dark:focus-visible:outline-green-400 size-4" id="16" role="checkbox" type="button" aria-checked="false" aria-required="false" data-state="unchecked">
|
|
<!---->
|
|
</button>
|
|
<!---->
|
|
</div>
|
|
<!--v-if-->
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Checkbox > renders with color primary 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 text-white dark:text-gray-900 ring ring-inset ring-gray-300 dark:ring-gray-700 focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-500 dark:focus-visible:outline-primary-400 size-4" id="15" role="checkbox" type="button" aria-checked="false" aria-required="false" data-state="unchecked">
|
|
<!---->
|
|
</button>
|
|
<!---->
|
|
</div>
|
|
<!--v-if-->
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Checkbox > renders with color red 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 text-white dark:text-gray-900 ring ring-inset ring-gray-300 dark:ring-gray-700 focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-red-500 dark:focus-visible:outline-red-400 size-4" id="17" role="checkbox" type="button" aria-checked="false" aria-required="false" data-state="unchecked">
|
|
<!---->
|
|
</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 text-white dark:text-gray-900 ring-inset focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-500 dark:focus-visible:outline-primary-400 size-4 ring-2 ring-primary-500 dark:ring-primary-400 bg-primary-500 dark:bg-primary-400" id="0" role="checkbox" type="button" aria-checked="true" aria-required="false" data-state="checked"><span class="iconify i-heroicons:check-20-solid shrink-0 size-full" aria-hidden="true" style="pointer-events: none;" data-state="checked"></span></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 text-white dark:text-gray-900 ring ring-inset ring-gray-300 dark:ring-gray-700 focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-500 dark:focus-visible:outline-primary-400 size-4" id="9" role="checkbox" type="button" aria-checked="false" aria-required="false" data-state="unchecked">
|
|
<!---->
|
|
</button>
|
|
<!---->
|
|
</div>
|
|
<div class="ms-2 text-sm"><label for="9" class="block font-medium text-gray-700 dark:text-gray-200">Label</label>
|
|
<p class="text-gray-500 dark:text-gray-400">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 text-white dark:text-gray-900 ring ring-inset ring-gray-300 dark:ring-gray-700 focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-500 dark:focus-visible:outline-primary-400 size-4" id="22" role="checkbox" type="button" aria-checked="false" aria-required="false" data-state="unchecked">
|
|
<!---->
|
|
</button>
|
|
<!---->
|
|
</div>
|
|
<div class="ms-2 text-sm"><label for="22" class="block font-medium text-gray-700 dark:text-gray-200">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 text-white dark:text-gray-900 ring ring-inset ring-gray-300 dark:ring-gray-700 focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-500 dark:focus-visible:outline-primary-400 size-4 cursor-not-allowed opacity-75" id="3" 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 text-white dark:text-gray-900 ring ring-inset ring-gray-300 dark:ring-gray-700 focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-500 dark:focus-visible:outline-primary-400 size-4" id="4" 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 text-white dark:text-gray-900 ring ring-inset ring-gray-300 dark:ring-gray-700 focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-500 dark:focus-visible:outline-primary-400 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 text-white dark:text-gray-900 ring-inset focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-500 dark:focus-visible:outline-primary-400 size-4 ring-2 ring-primary-500 dark:ring-primary-400 bg-primary-500 dark:bg-primary-400" id="5" role="checkbox" type="button" aria-checked="mixed" aria-required="false" data-state="indeterminate"><span class="iconify i-heroicons:minus-20-solid shrink-0 size-full" aria-hidden="true" style="pointer-events: none;" data-state="indeterminate"></span></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 text-white dark:text-gray-900 ring-inset focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-500 dark:focus-visible:outline-primary-400 size-4 ring-2 ring-primary-500 dark:ring-primary-400 bg-primary-500 dark:bg-primary-400" id="6" role="checkbox" type="button" aria-checked="mixed" aria-required="false" data-state="indeterminate"><span class="iconify i-heroicons:minus-20-solid shrink-0 size-full" aria-hidden="true" style="pointer-events: none;" data-state="indeterminate"></span></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 text-white dark:text-gray-900 ring ring-inset ring-gray-300 dark:ring-gray-700 focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-500 dark:focus-visible:outline-primary-400 size-4" id="7" role="checkbox" type="button" aria-checked="false" aria-required="false" data-state="unchecked">
|
|
<!---->
|
|
</button>
|
|
<!---->
|
|
</div>
|
|
<div class="ms-2 text-sm"><label for="7" class="block font-medium text-gray-700 dark:text-gray-200">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 text-white dark:text-gray-900 ring ring-inset ring-gray-300 dark:ring-gray-700 focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-500 dark:focus-visible:outline-primary-400 size-4" id="21" role="checkbox" type="button" aria-checked="false" aria-required="false" data-state="unchecked">
|
|
<!---->
|
|
</button>
|
|
<!---->
|
|
</div>
|
|
<div class="ms-2 text-sm"><label for="21" class="block font-medium text-gray-700 dark:text-gray-200">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 text-white dark:text-gray-900 ring ring-inset ring-gray-300 dark:ring-gray-700 focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-500 dark:focus-visible:outline-primary-400 size-4" id="1" 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 text-white dark:text-gray-900 ring ring-inset ring-gray-300 dark:ring-gray-700 focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-500 dark:focus-visible:outline-primary-400 size-4" id="8" role="checkbox" type="button" aria-checked="false" aria-required="false" data-state="unchecked">
|
|
<!---->
|
|
</button>
|
|
<!---->
|
|
</div>
|
|
<div class="ms-2 text-sm"><label for="8" class="block font-medium text-gray-700 dark:text-gray-200 after:content-['*'] after:ms-0.5 after:text-red-500 dark:after:text-red-400">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 text-white dark:text-gray-900 ring ring-inset ring-gray-300 dark:ring-gray-700 focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-500 dark:focus-visible:outline-primary-400 size-4.5" id="13" 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 text-white dark:text-gray-900 ring ring-inset ring-gray-300 dark:ring-gray-700 focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-500 dark:focus-visible:outline-primary-400 size-4" id="12" 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 text-white dark:text-gray-900 ring ring-inset ring-gray-300 dark:ring-gray-700 focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-500 dark:focus-visible:outline-primary-400 size-3.5" id="11" 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 text-white dark:text-gray-900 ring ring-inset ring-gray-300 dark:ring-gray-700 focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-500 dark:focus-visible:outline-primary-400 size-5" id="14" 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 text-white dark:text-gray-900 ring ring-inset ring-gray-300 dark:ring-gray-700 focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-500 dark:focus-visible:outline-primary-400 size-3" id="10" 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 text-white dark:text-gray-900 ring ring-inset ring-gray-300 dark:ring-gray-700 focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-500 dark:focus-visible:outline-primary-400 size-4" id="20" 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 text-white dark:text-gray-900 ring ring-inset ring-gray-300 dark:ring-gray-700 focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-500 dark:focus-visible:outline-primary-400 size-4" id="2" role="checkbox" type="button" aria-checked="false" aria-required="false" data-state="unchecked">
|
|
<!---->
|
|
</button>
|
|
<!---->
|
|
</div>
|
|
<!--v-if-->
|
|
</div>"
|
|
`;
|