diff --git a/.changeset/quiet-controls-flat.md b/.changeset/quiet-controls-flat.md
new file mode 100644
index 000000000..7850d4bdc
--- /dev/null
+++ b/.changeset/quiet-controls-flat.md
@@ -0,0 +1,5 @@
+---
+"@tailor-platform/app-shell": patch
+---
+
+Remove the shadow from Button `secondary` and from the text controls (Input, Textarea, Field.Control, DateField, Select, Combobox, Autocomplete).
diff --git a/packages/core/__snapshots__/src__components__ai-chat__ai-chat.test.tsx.snap b/packages/core/__snapshots__/src__components__ai-chat__ai-chat.test.tsx.snap
index bce0f5fed..6e356632a 100644
--- a/packages/core/__snapshots__/src__components__ai-chat__ai-chat.test.tsx.snap
+++ b/packages/core/__snapshots__/src__components__ai-chat__ai-chat.test.tsx.snap
@@ -1,5 +1,5 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`AIChat > snapshots > default 1`] = `"<div data-slot="ai-chat" class="astw:flex astw:h-full astw:min-h-0 astw:flex-1 astw:flex-col"><div data-slot="ai-chat-conversation" class="astw:relative astw:min-h-0 astw:flex-1"><div role="log" class="astw:h-full astw:overflow-y-auto"><div class="astw:flex astw:min-h-full astw:flex-col"><div class="astw:flex astw:flex-1 astw:flex-col astw:gap-3 astw:px-3 astw:py-3"><div data-slot="ai-chat-message" data-from="assistant" class="astw:flex astw:w-full astw:flex-col astw:gap-2"><div data-slot="ai-chat-message-content" class="astw:flex astw:min-w-0 astw:max-w-full astw:flex-col astw:gap-2 astw:text-sm astw:leading-relaxed astw:w-full astw:px-3 astw:py-2 astw:text-foreground"><div data-slot="ai-chat-response" class="astw:space-y-2"><p class="astw:whitespace-pre-wrap">Hello there.</p></div></div></div></div></div></div></div><form data-slot="ai-chat-composer" class="astw:flex astw:shrink-0 astw:flex-col astw:gap-2 astw:p-3 astw:pt-0"><textarea id="base-ui-_r_0_" data-slot="textarea" aria-label="Message" rows="2" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:shadow-xs astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:min-h-16 astw:py-2 astw:resize-y astw:data-invalid:border-destructive astw:data-invalid:ring-destructive/20 astw:dark:data-invalid:ring-destructive/40 astw:aria-invalid:border-destructive astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40"></textarea><div class="astw:flex astw:items-center astw:justify-between astw:gap-2"><div class="astw:flex astw:min-w-0 astw:items-center astw:gap-2"></div><div class="astw:shrink-0"><button type="submit" data-slot="button" class="astw:inline-flex astw:cursor-pointer astw:items-center astw:justify-center astw:gap-2 astw:whitespace-nowrap astw:rounded-md astw:text-sm astw:font-medium astw:transition-all astw:disabled:pointer-events-none astw:disabled:opacity-50 astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:shrink-0 astw:[&amp;_svg]:shrink-0 astw:outline-none astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40 astw:aria-invalid:border-destructive astw:bg-primary astw:text-primary-foreground astw:shadow-xs astw:hover:bg-primary/90 astw:h-9 astw:px-4 astw:py-2 astw:has-[>svg]:px-3" disabled=""><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-up astw:size-4" aria-hidden="true"><path d="m5 12 7-7 7 7"></path><path d="M12 19V5"></path></svg>Send</button></div></div></form></div>"`;
+exports[`AIChat > snapshots > default 1`] = `"<div data-slot="ai-chat" class="astw:flex astw:h-full astw:min-h-0 astw:flex-1 astw:flex-col"><div data-slot="ai-chat-conversation" class="astw:relative astw:min-h-0 astw:flex-1"><div role="log" class="astw:h-full astw:overflow-y-auto"><div class="astw:flex astw:min-h-full astw:flex-col"><div class="astw:flex astw:flex-1 astw:flex-col astw:gap-3 astw:px-3 astw:py-3"><div data-slot="ai-chat-message" data-from="assistant" class="astw:flex astw:w-full astw:flex-col astw:gap-2"><div data-slot="ai-chat-message-content" class="astw:flex astw:min-w-0 astw:max-w-full astw:flex-col astw:gap-2 astw:text-sm astw:leading-relaxed astw:w-full astw:px-3 astw:py-2 astw:text-foreground"><div data-slot="ai-chat-response" class="astw:space-y-2"><p class="astw:whitespace-pre-wrap">Hello there.</p></div></div></div></div></div></div></div><form data-slot="ai-chat-composer" class="astw:flex astw:shrink-0 astw:flex-col astw:gap-2 astw:p-3 astw:pt-0"><textarea id="base-ui-_r_0_" data-slot="textarea" aria-label="Message" rows="2" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:min-h-16 astw:py-2 astw:resize-y astw:data-invalid:border-destructive astw:data-invalid:ring-destructive/20 astw:dark:data-invalid:ring-destructive/40 astw:aria-invalid:border-destructive astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40"></textarea><div class="astw:flex astw:items-center astw:justify-between astw:gap-2"><div class="astw:flex astw:min-w-0 astw:items-center astw:gap-2"></div><div class="astw:shrink-0"><button type="submit" data-slot="button" class="astw:inline-flex astw:cursor-pointer astw:items-center astw:justify-center astw:gap-2 astw:whitespace-nowrap astw:rounded-md astw:text-sm astw:font-medium astw:transition-all astw:disabled:pointer-events-none astw:disabled:opacity-50 astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:shrink-0 astw:[&amp;_svg]:shrink-0 astw:outline-none astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40 astw:aria-invalid:border-destructive astw:bg-primary astw:text-primary-foreground astw:shadow-xs astw:hover:bg-primary/90 astw:h-9 astw:px-4 astw:py-2 astw:has-[>svg]:px-3" disabled=""><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-up astw:size-4" aria-hidden="true"><path d="m5 12 7-7 7 7"></path><path d="M12 19V5"></path></svg>Send</button></div></div></form></div>"`;
 
-exports[`AIChat > snapshots > with header 1`] = `"<div data-slot="ai-chat" class="astw:flex astw:h-full astw:min-h-0 astw:flex-1 astw:flex-col"><div data-slot="ai-chat-header" class="astw:flex astw:h-12 astw:shrink-0 astw:items-center astw:justify-between astw:gap-2 astw:border-b astw:border-border astw:px-3"><div class="astw:flex astw:min-w-0 astw:items-center astw:gap-1.5 astw:text-sm astw:font-semibold astw:text-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles astw:size-4 astw:shrink-0 astw:text-primary" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg><span class="astw:truncate">Assistant</span></div><div class="astw:flex astw:shrink-0 astw:items-center astw:gap-0.5"><button type="button" data-slot="ai-chat-action" class="astw:inline-flex astw:cursor-pointer astw:items-center astw:justify-center astw:gap-2 astw:whitespace-nowrap astw:rounded-md astw:text-sm astw:font-medium astw:transition-all astw:disabled:pointer-events-none astw:disabled:opacity-50 astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0 astw:outline-none astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40 astw:aria-invalid:border-destructive astw:hover:bg-accent astw:dark:hover:bg-accent/50 astw:size-7 astw:shrink-0 astw:text-muted-foreground astw:hover:text-foreground" aria-label="Clear conversation" id="base-ui-_r_2_" data-base-ui-tooltip-trigger=""><span aria-hidden="true">x</span></button></div></div><div data-slot="ai-chat-conversation" class="astw:relative astw:min-h-0 astw:flex-1"><div role="log" class="astw:h-full astw:overflow-y-auto"><div class="astw:flex astw:min-h-full astw:flex-col"><div class="astw:flex astw:flex-1 astw:flex-col astw:gap-3 astw:px-3 astw:py-3"><div></div></div></div></div></div><form data-slot="ai-chat-composer" class="astw:flex astw:shrink-0 astw:flex-col astw:gap-2 astw:p-3 astw:pt-0"><textarea id="base-ui-_r_3_" data-slot="textarea" aria-label="Message" rows="2" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:shadow-xs astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:min-h-16 astw:py-2 astw:resize-y astw:data-invalid:border-destructive astw:data-invalid:ring-destructive/20 astw:dark:data-invalid:ring-destructive/40 astw:aria-invalid:border-destructive astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40"></textarea><div class="astw:flex astw:items-center astw:justify-between astw:gap-2"><div class="astw:flex astw:min-w-0 astw:items-center astw:gap-2"></div><div class="astw:shrink-0"><button type="submit" data-slot="button" class="astw:inline-flex astw:cursor-pointer astw:items-center astw:justify-center astw:gap-2 astw:whitespace-nowrap astw:rounded-md astw:text-sm astw:font-medium astw:transition-all astw:disabled:pointer-events-none astw:disabled:opacity-50 astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:shrink-0 astw:[&amp;_svg]:shrink-0 astw:outline-none astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40 astw:aria-invalid:border-destructive astw:bg-primary astw:text-primary-foreground astw:shadow-xs astw:hover:bg-primary/90 astw:h-9 astw:px-4 astw:py-2 astw:has-[>svg]:px-3" disabled=""><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-up astw:size-4" aria-hidden="true"><path d="m5 12 7-7 7 7"></path><path d="M12 19V5"></path></svg>Send</button></div></div></form></div>"`;
+exports[`AIChat > snapshots > with header 1`] = `"<div data-slot="ai-chat" class="astw:flex astw:h-full astw:min-h-0 astw:flex-1 astw:flex-col"><div data-slot="ai-chat-header" class="astw:flex astw:h-12 astw:shrink-0 astw:items-center astw:justify-between astw:gap-2 astw:border-b astw:border-border astw:px-3"><div class="astw:flex astw:min-w-0 astw:items-center astw:gap-1.5 astw:text-sm astw:font-semibold astw:text-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles astw:size-4 astw:shrink-0 astw:text-primary" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg><span class="astw:truncate">Assistant</span></div><div class="astw:flex astw:shrink-0 astw:items-center astw:gap-0.5"><button type="button" data-slot="ai-chat-action" class="astw:inline-flex astw:cursor-pointer astw:items-center astw:justify-center astw:gap-2 astw:whitespace-nowrap astw:rounded-md astw:text-sm astw:font-medium astw:transition-all astw:disabled:pointer-events-none astw:disabled:opacity-50 astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0 astw:outline-none astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40 astw:aria-invalid:border-destructive astw:hover:bg-accent astw:dark:hover:bg-accent/50 astw:size-7 astw:shrink-0 astw:text-muted-foreground astw:hover:text-foreground" aria-label="Clear conversation" id="base-ui-_r_2_" data-base-ui-tooltip-trigger=""><span aria-hidden="true">x</span></button></div></div><div data-slot="ai-chat-conversation" class="astw:relative astw:min-h-0 astw:flex-1"><div role="log" class="astw:h-full astw:overflow-y-auto"><div class="astw:flex astw:min-h-full astw:flex-col"><div class="astw:flex astw:flex-1 astw:flex-col astw:gap-3 astw:px-3 astw:py-3"><div></div></div></div></div></div><form data-slot="ai-chat-composer" class="astw:flex astw:shrink-0 astw:flex-col astw:gap-2 astw:p-3 astw:pt-0"><textarea id="base-ui-_r_3_" data-slot="textarea" aria-label="Message" rows="2" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:min-h-16 astw:py-2 astw:resize-y astw:data-invalid:border-destructive astw:data-invalid:ring-destructive/20 astw:dark:data-invalid:ring-destructive/40 astw:aria-invalid:border-destructive astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40"></textarea><div class="astw:flex astw:items-center astw:justify-between astw:gap-2"><div class="astw:flex astw:min-w-0 astw:items-center astw:gap-2"></div><div class="astw:shrink-0"><button type="submit" data-slot="button" class="astw:inline-flex astw:cursor-pointer astw:items-center astw:justify-center astw:gap-2 astw:whitespace-nowrap astw:rounded-md astw:text-sm astw:font-medium astw:transition-all astw:disabled:pointer-events-none astw:disabled:opacity-50 astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:shrink-0 astw:[&amp;_svg]:shrink-0 astw:outline-none astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40 astw:aria-invalid:border-destructive astw:bg-primary astw:text-primary-foreground astw:shadow-xs astw:hover:bg-primary/90 astw:h-9 astw:px-4 astw:py-2 astw:has-[>svg]:px-3" disabled=""><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-up astw:size-4" aria-hidden="true"><path d="m5 12 7-7 7 7"></path><path d="M12 19V5"></path></svg>Send</button></div></div></form></div>"`;
diff --git a/packages/core/__snapshots__/src__components__autocomplete__autocomplete-standalone.test.tsx.snap b/packages/core/__snapshots__/src__components__autocomplete__autocomplete-standalone.test.tsx.snap
index bcd0f9f7c..0d86b8c04 100644
--- a/packages/core/__snapshots__/src__components__autocomplete__autocomplete-standalone.test.tsx.snap
+++ b/packages/core/__snapshots__/src__components__autocomplete__autocomplete-standalone.test.tsx.snap
@@ -1,7 +1,7 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`Autocomplete (standalone) > snapshots > default with string items 1`] = `"<div><div data-slot="autocomplete-input-group" class="astw:relative astw:flex astw:items-center"><input autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none" role="combobox" aria-expanded="false" aria-haspopup="listbox" aria-autocomplete="list" id="base-ui-_r_0_" data-slot="autocomplete-input" placeholder="Type a fruit" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:shadow-xs astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50" value=""><button type="button" tabindex="-1" aria-expanded="false" aria-haspopup="listbox" data-slot="autocomplete-trigger" class="astw:absolute astw:inset-y-0 astw:right-0 astw:flex astw:items-center astw:px-2 astw:text-muted-foreground astw:outline-none astw:hover:text-foreground astw:disabled:pointer-events-none astw:disabled:opacity-50"><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button></div><input id="base-ui-_r_0_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div>"`;
+exports[`Autocomplete (standalone) > snapshots > default with string items 1`] = `"<div><div data-slot="autocomplete-input-group" class="astw:relative astw:flex astw:items-center"><input autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none" role="combobox" aria-expanded="false" aria-haspopup="listbox" aria-autocomplete="list" id="base-ui-_r_0_" data-slot="autocomplete-input" placeholder="Type a fruit" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50" value=""><button type="button" tabindex="-1" aria-expanded="false" aria-haspopup="listbox" data-slot="autocomplete-trigger" class="astw:absolute astw:inset-y-0 astw:right-0 astw:flex astw:items-center astw:px-2 astw:text-muted-foreground astw:outline-none astw:hover:text-foreground astw:disabled:pointer-events-none astw:disabled:opacity-50"><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button></div><input id="base-ui-_r_0_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div>"`;
 
-exports[`Autocomplete (standalone) > snapshots > with custom className 1`] = `"<div class="custom-class"><div data-slot="autocomplete-input-group" class="astw:relative astw:flex astw:items-center"><input autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none" role="combobox" aria-expanded="false" aria-haspopup="listbox" aria-autocomplete="list" id="base-ui-_r_4_" data-slot="autocomplete-input" placeholder="Styled" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:shadow-xs astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50" value=""><button type="button" tabindex="-1" aria-expanded="false" aria-haspopup="listbox" data-slot="autocomplete-trigger" class="astw:absolute astw:inset-y-0 astw:right-0 astw:flex astw:items-center astw:px-2 astw:text-muted-foreground astw:outline-none astw:hover:text-foreground astw:disabled:pointer-events-none astw:disabled:opacity-50"><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button></div><input id="base-ui-_r_4_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div>"`;
+exports[`Autocomplete (standalone) > snapshots > with custom className 1`] = `"<div class="custom-class"><div data-slot="autocomplete-input-group" class="astw:relative astw:flex astw:items-center"><input autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none" role="combobox" aria-expanded="false" aria-haspopup="listbox" aria-autocomplete="list" id="base-ui-_r_4_" data-slot="autocomplete-input" placeholder="Styled" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50" value=""><button type="button" tabindex="-1" aria-expanded="false" aria-haspopup="listbox" data-slot="autocomplete-trigger" class="astw:absolute astw:inset-y-0 astw:right-0 astw:flex astw:items-center astw:px-2 astw:text-muted-foreground astw:outline-none astw:hover:text-foreground astw:disabled:pointer-events-none astw:disabled:opacity-50"><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button></div><input id="base-ui-_r_4_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div>"`;
 
-exports[`Autocomplete (standalone) > snapshots > with custom mapItem 1`] = `"<div><div data-slot="autocomplete-input-group" class="astw:relative astw:flex astw:items-center"><input autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none" role="combobox" aria-expanded="false" aria-haspopup="listbox" aria-autocomplete="list" id="base-ui-_r_8_" data-slot="autocomplete-input" placeholder="Pick" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:shadow-xs astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50" value=""><button type="button" tabindex="-1" aria-expanded="false" aria-haspopup="listbox" data-slot="autocomplete-trigger" class="astw:absolute astw:inset-y-0 astw:right-0 astw:flex astw:items-center astw:px-2 astw:text-muted-foreground astw:outline-none astw:hover:text-foreground astw:disabled:pointer-events-none astw:disabled:opacity-50"><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button></div><input id="base-ui-_r_8_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div>"`;
+exports[`Autocomplete (standalone) > snapshots > with custom mapItem 1`] = `"<div><div data-slot="autocomplete-input-group" class="astw:relative astw:flex astw:items-center"><input autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none" role="combobox" aria-expanded="false" aria-haspopup="listbox" aria-autocomplete="list" id="base-ui-_r_8_" data-slot="autocomplete-input" placeholder="Pick" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50" value=""><button type="button" tabindex="-1" aria-expanded="false" aria-haspopup="listbox" data-slot="autocomplete-trigger" class="astw:absolute astw:inset-y-0 astw:right-0 astw:flex astw:items-center astw:px-2 astw:text-muted-foreground astw:outline-none astw:hover:text-foreground astw:disabled:pointer-events-none astw:disabled:opacity-50"><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button></div><input id="base-ui-_r_8_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div>"`;
diff --git a/packages/core/__snapshots__/src__components__autocomplete__autocomplete.test.tsx.snap b/packages/core/__snapshots__/src__components__autocomplete__autocomplete.test.tsx.snap
index 2b80e7d21..f5ce574db 100644
--- a/packages/core/__snapshots__/src__components__autocomplete__autocomplete.test.tsx.snap
+++ b/packages/core/__snapshots__/src__components__autocomplete__autocomplete.test.tsx.snap
@@ -1,7 +1,7 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`Autocomplete.Parts > snapshots > closed autocomplete with placeholder 1`] = `"<div data-slot="autocomplete-input-group" class="astw:relative astw:flex astw:items-center"><input data-list-empty="" autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none" role="combobox" aria-expanded="false" aria-haspopup="listbox" aria-autocomplete="list" id="base-ui-_r_0_" data-slot="autocomplete-input" data-testid="input" placeholder="Type a fruit..." class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:shadow-xs astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50" value=""><button type="button" data-list-empty="" tabindex="-1" aria-expanded="false" aria-haspopup="listbox" data-slot="autocomplete-trigger" class="astw:absolute astw:inset-y-0 astw:right-0 astw:flex astw:items-center astw:px-2 astw:text-muted-foreground astw:outline-none astw:hover:text-foreground astw:disabled:pointer-events-none astw:disabled:opacity-50"><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button></div><input id="base-ui-_r_0_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value="">"`;
+exports[`Autocomplete.Parts > snapshots > closed autocomplete with placeholder 1`] = `"<div data-slot="autocomplete-input-group" class="astw:relative astw:flex astw:items-center"><input data-list-empty="" autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none" role="combobox" aria-expanded="false" aria-haspopup="listbox" aria-autocomplete="list" id="base-ui-_r_0_" data-slot="autocomplete-input" data-testid="input" placeholder="Type a fruit..." class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50" value=""><button type="button" data-list-empty="" tabindex="-1" aria-expanded="false" aria-haspopup="listbox" data-slot="autocomplete-trigger" class="astw:absolute astw:inset-y-0 astw:right-0 astw:flex astw:items-center astw:px-2 astw:text-muted-foreground astw:outline-none astw:hover:text-foreground astw:disabled:pointer-events-none astw:disabled:opacity-50"><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button></div><input id="base-ui-_r_0_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value="">"`;
 
-exports[`Autocomplete.Parts > snapshots > open autocomplete 1`] = `"<div data-base-ui-inert=""><div data-slot="autocomplete-input-group" class="astw:relative astw:flex astw:items-center"><span role="button" aria-label="Dismiss" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: absolute;"></span><input data-list-empty="" autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none" role="combobox" aria-expanded="true" aria-haspopup="listbox" aria-autocomplete="list" id="base-ui-_r_4_" data-slot="autocomplete-input" data-testid="input" placeholder="Type a fruit..." class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:shadow-xs astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50" value="a" data-popup-open="" data-pressed="" data-popup-side="bottom" aria-controls="_r_5_"><button type="button" data-visible="" tabindex="-1" data-slot="autocomplete-clear" class="astw:absolute astw:inset-y-0 astw:right-6 astw:flex astw:items-center astw:px-1 astw:text-muted-foreground astw:outline-none astw:hover:text-foreground" data-popup-open="" aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x astw:size-3.5" aria-hidden="true"><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg></button><button type="button" data-list-empty="" tabindex="-1" aria-expanded="true" aria-haspopup="listbox" data-slot="autocomplete-trigger" class="astw:absolute astw:inset-y-0 astw:right-0 astw:flex astw:items-center astw:px-2 astw:text-muted-foreground astw:outline-none astw:hover:text-foreground astw:disabled:pointer-events-none astw:disabled:opacity-50" data-popup-open="" data-pressed="" data-popup-side="bottom" aria-controls="_r_5_" aria-hidden="true"><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button></div><input id="base-ui-_r_4_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value="a"></div><div id="_r_8_" data-base-ui-portal="" style="position: relative; z-index: var(--z-popup);"><div data-open="" data-side="bottom" data-align="center" data-empty="" role="presentation" style="position: absolute; top: 0px; left: 0px; --available-width: -10px; --available-height: -10px; --anchor-width: 0px; --anchor-height: 0px; --transform-origin: 0px 0px; transform: translate(0px, 0px);" data-anchor-hidden=""><div data-open="" data-side="bottom" data-align="center" data-empty="" tabindex="-1" data-base-ui-focusable="" role="presentation" data-slot="autocomplete-content" class="astw:bg-popover astw:text-popover-foreground astw:data-open:animate-in astw:data-ending-style:animate-out astw:data-ending-style:fade-out-0 astw:data-open:fade-in-0 astw:data-ending-style:zoom-out-95 astw:data-open:zoom-in-95 astw:z-(--z-popup) astw:w-[var(--anchor-width)] astw:min-w-32 astw:origin-(--transform-origin) astw:overflow-hidden astw:rounded-md astw:border astw:border-border astw:shadow-md" data-anchor-hidden=""><div data-empty="" role="listbox" tabindex="-1" id="_r_5_" data-slot="autocomplete-list" class="astw:max-h-60 astw:overflow-y-auto astw:p-1"><div role="option" id="base-ui-_r_4_-0" data-slot="autocomplete-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:px-2 astw:text-sm astw:outline-hidden astw:select-none astw:data-highlighted:bg-accent astw:data-highlighted:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50">Apple</div><div role="option" id="base-ui-_r_4_-1" data-slot="autocomplete-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:px-2 astw:text-sm astw:outline-hidden astw:select-none astw:data-highlighted:bg-accent astw:data-highlighted:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50">Banana</div><div role="option" id="base-ui-_r_4_-2" data-slot="autocomplete-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:px-2 astw:text-sm astw:outline-hidden astw:select-none astw:data-highlighted:bg-accent astw:data-highlighted:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50">Cherry</div><div role="option" id="base-ui-_r_4_-3" data-slot="autocomplete-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:px-2 astw:text-sm astw:outline-hidden astw:select-none astw:data-highlighted:bg-accent astw:data-highlighted:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50">Date</div><div role="option" id="base-ui-_r_4_-4" data-slot="autocomplete-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:px-2 astw:text-sm astw:outline-hidden astw:select-none astw:data-highlighted:bg-accent astw:data-highlighted:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50">Elderberry</div><div role="status" aria-live="polite" aria-atomic="true" data-slot="autocomplete-empty" class="astw:px-4 astw:pt-2 astw:pb-4 astw:text-center astw:text-sm astw:text-muted-foreground astw:empty:hidden">No suggestions</div></div></div><span role="button" aria-label="Dismiss" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: absolute;"></span></div></div>"`;
+exports[`Autocomplete.Parts > snapshots > open autocomplete 1`] = `"<div data-base-ui-inert=""><div data-slot="autocomplete-input-group" class="astw:relative astw:flex astw:items-center"><span role="button" aria-label="Dismiss" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: absolute;"></span><input data-list-empty="" autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none" role="combobox" aria-expanded="true" aria-haspopup="listbox" aria-autocomplete="list" id="base-ui-_r_4_" data-slot="autocomplete-input" data-testid="input" placeholder="Type a fruit..." class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50" value="a" data-popup-open="" data-pressed="" data-popup-side="bottom" aria-controls="_r_5_"><button type="button" data-visible="" tabindex="-1" data-slot="autocomplete-clear" class="astw:absolute astw:inset-y-0 astw:right-6 astw:flex astw:items-center astw:px-1 astw:text-muted-foreground astw:outline-none astw:hover:text-foreground" data-popup-open="" aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x astw:size-3.5" aria-hidden="true"><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg></button><button type="button" data-list-empty="" tabindex="-1" aria-expanded="true" aria-haspopup="listbox" data-slot="autocomplete-trigger" class="astw:absolute astw:inset-y-0 astw:right-0 astw:flex astw:items-center astw:px-2 astw:text-muted-foreground astw:outline-none astw:hover:text-foreground astw:disabled:pointer-events-none astw:disabled:opacity-50" data-popup-open="" data-pressed="" data-popup-side="bottom" aria-controls="_r_5_" aria-hidden="true"><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button></div><input id="base-ui-_r_4_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value="a"></div><div id="_r_8_" data-base-ui-portal="" style="position: relative; z-index: var(--z-popup);"><div data-open="" data-side="bottom" data-align="center" data-empty="" role="presentation" style="position: absolute; top: 0px; left: 0px; --available-width: -10px; --available-height: -10px; --anchor-width: 0px; --anchor-height: 0px; --transform-origin: 0px 0px; transform: translate(0px, 0px);" data-anchor-hidden=""><div data-open="" data-side="bottom" data-align="center" data-empty="" tabindex="-1" data-base-ui-focusable="" role="presentation" data-slot="autocomplete-content" class="astw:bg-popover astw:text-popover-foreground astw:data-open:animate-in astw:data-ending-style:animate-out astw:data-ending-style:fade-out-0 astw:data-open:fade-in-0 astw:data-ending-style:zoom-out-95 astw:data-open:zoom-in-95 astw:z-(--z-popup) astw:w-[var(--anchor-width)] astw:min-w-32 astw:origin-(--transform-origin) astw:overflow-hidden astw:rounded-md astw:border astw:border-border astw:shadow-md" data-anchor-hidden=""><div data-empty="" role="listbox" tabindex="-1" id="_r_5_" data-slot="autocomplete-list" class="astw:max-h-60 astw:overflow-y-auto astw:p-1"><div role="option" id="base-ui-_r_4_-0" data-slot="autocomplete-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:px-2 astw:text-sm astw:outline-hidden astw:select-none astw:data-highlighted:bg-accent astw:data-highlighted:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50">Apple</div><div role="option" id="base-ui-_r_4_-1" data-slot="autocomplete-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:px-2 astw:text-sm astw:outline-hidden astw:select-none astw:data-highlighted:bg-accent astw:data-highlighted:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50">Banana</div><div role="option" id="base-ui-_r_4_-2" data-slot="autocomplete-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:px-2 astw:text-sm astw:outline-hidden astw:select-none astw:data-highlighted:bg-accent astw:data-highlighted:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50">Cherry</div><div role="option" id="base-ui-_r_4_-3" data-slot="autocomplete-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:px-2 astw:text-sm astw:outline-hidden astw:select-none astw:data-highlighted:bg-accent astw:data-highlighted:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50">Date</div><div role="option" id="base-ui-_r_4_-4" data-slot="autocomplete-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:px-2 astw:text-sm astw:outline-hidden astw:select-none astw:data-highlighted:bg-accent astw:data-highlighted:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50">Elderberry</div><div role="status" aria-live="polite" aria-atomic="true" data-slot="autocomplete-empty" class="astw:px-4 astw:pt-2 astw:pb-4 astw:text-center astw:text-sm astw:text-muted-foreground astw:empty:hidden">No suggestions</div></div></div><span role="button" aria-label="Dismiss" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: absolute;"></span></div></div>"`;
 
-exports[`Autocomplete.Parts > snapshots > with groups 1`] = `"<input data-list-empty="" autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none" role="combobox" aria-expanded="false" aria-haspopup="listbox" aria-autocomplete="list" id="base-ui-_r_9_" data-slot="autocomplete-input" placeholder="Search..." class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:shadow-xs astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50" value=""><input id="base-ui-_r_9_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value="">"`;
+exports[`Autocomplete.Parts > snapshots > with groups 1`] = `"<input data-list-empty="" autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none" role="combobox" aria-expanded="false" aria-haspopup="listbox" aria-autocomplete="list" id="base-ui-_r_9_" data-slot="autocomplete-input" placeholder="Search..." class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50" value=""><input id="base-ui-_r_9_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value="">"`;
diff --git a/packages/core/__snapshots__/src__components__button__button.test.tsx.snap b/packages/core/__snapshots__/src__components__button__button.test.tsx.snap
index c172b7310..6c6fb75f1 100644
--- a/packages/core/__snapshots__/src__components__button__button.test.tsx.snap
+++ b/packages/core/__snapshots__/src__components__button__button.test.tsx.snap
@@ -18,7 +18,7 @@ exports[`Button > snapshots > link variant 1`] = `"<button type="button" data-sl
 
 exports[`Button > snapshots > outline variant 1`] = `"<button type="button" data-slot="button" class="astw:inline-flex astw:cursor-pointer astw:items-center astw:justify-center astw:gap-2 astw:whitespace-nowrap astw:rounded-md astw:text-sm astw:font-medium astw:transition-all astw:disabled:pointer-events-none astw:disabled:opacity-50 astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:shrink-0 astw:[&amp;_svg]:shrink-0 astw:outline-none astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40 astw:aria-invalid:border-destructive astw:border astw:border-border astw:bg-background astw:shadow-xs astw:hover:bg-accent astw:hover:text-accent-foreground astw:dark:bg-input/30 astw:dark:border-input astw:dark:hover:bg-input/50 astw:h-9 astw:px-4 astw:py-2 astw:has-[>svg]:px-3">Outline</button>"`;
 
-exports[`Button > snapshots > secondary variant 1`] = `"<button type="button" data-slot="button" class="astw:inline-flex astw:cursor-pointer astw:items-center astw:justify-center astw:gap-2 astw:whitespace-nowrap astw:rounded-md astw:text-sm astw:font-medium astw:transition-all astw:disabled:pointer-events-none astw:disabled:opacity-50 astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:shrink-0 astw:[&amp;_svg]:shrink-0 astw:outline-none astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40 astw:aria-invalid:border-destructive astw:bg-secondary astw:text-secondary-foreground astw:shadow-xs astw:hover:bg-secondary/80 astw:h-9 astw:px-4 astw:py-2 astw:has-[>svg]:px-3">Secondary</button>"`;
+exports[`Button > snapshots > secondary variant 1`] = `"<button type="button" data-slot="button" class="astw:inline-flex astw:cursor-pointer astw:items-center astw:justify-center astw:gap-2 astw:whitespace-nowrap astw:rounded-md astw:text-sm astw:font-medium astw:transition-all astw:disabled:pointer-events-none astw:disabled:opacity-50 astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:shrink-0 astw:[&amp;_svg]:shrink-0 astw:outline-none astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40 astw:aria-invalid:border-destructive astw:bg-secondary astw:text-secondary-foreground astw:hover:bg-secondary/80 astw:h-9 astw:px-4 astw:py-2 astw:has-[>svg]:px-3">Secondary</button>"`;
 
 exports[`Button > snapshots > small size 1`] = `"<button type="button" data-slot="button" class="astw:inline-flex astw:cursor-pointer astw:items-center astw:justify-center astw:whitespace-nowrap astw:text-sm astw:font-medium astw:transition-all astw:disabled:pointer-events-none astw:disabled:opacity-50 astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:shrink-0 astw:[&amp;_svg]:shrink-0 astw:outline-none astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40 astw:aria-invalid:border-destructive astw:bg-primary astw:text-primary-foreground astw:shadow-xs astw:hover:bg-primary/90 astw:h-8 astw:rounded-md astw:gap-1.5 astw:px-3 astw:has-[>svg]:px-2.5">Small</button>"`;
 
diff --git a/packages/core/__snapshots__/src__components__combobox__combobox-standalone.test.tsx.snap b/packages/core/__snapshots__/src__components__combobox__combobox-standalone.test.tsx.snap
index 84d444202..b68aeaf97 100644
--- a/packages/core/__snapshots__/src__components__combobox__combobox-standalone.test.tsx.snap
+++ b/packages/core/__snapshots__/src__components__combobox__combobox-standalone.test.tsx.snap
@@ -1,9 +1,9 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`Combobox (standalone) > snapshots > default with string items 1`] = `"<div><div data-placeholder="" role="group" data-slot="combobox-input-group" class="astw:relative astw:flex astw:items-center"><input autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none" role="combobox" aria-expanded="false" aria-haspopup="listbox" aria-autocomplete="list" id="base-ui-_r_0_" data-slot="combobox-input" placeholder="Pick a fruit" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:shadow-xs astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50" value=""><button type="button" data-placeholder="" tabindex="-1" aria-expanded="false" aria-haspopup="listbox" data-slot="combobox-trigger" class="astw:absolute astw:inset-y-0 astw:right-0 astw:flex astw:items-center astw:px-2 astw:text-muted-foreground astw:outline-none astw:hover:text-foreground astw:disabled:pointer-events-none astw:disabled:opacity-50"><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button></div><input id="base-ui-_r_0_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div>"`;
+exports[`Combobox (standalone) > snapshots > default with string items 1`] = `"<div><div data-placeholder="" role="group" data-slot="combobox-input-group" class="astw:relative astw:flex astw:items-center"><input autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none" role="combobox" aria-expanded="false" aria-haspopup="listbox" aria-autocomplete="list" id="base-ui-_r_0_" data-slot="combobox-input" placeholder="Pick a fruit" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50" value=""><button type="button" data-placeholder="" tabindex="-1" aria-expanded="false" aria-haspopup="listbox" data-slot="combobox-trigger" class="astw:absolute astw:inset-y-0 astw:right-0 astw:flex astw:items-center astw:px-2 astw:text-muted-foreground astw:outline-none astw:hover:text-foreground astw:disabled:pointer-events-none astw:disabled:opacity-50"><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button></div><input id="base-ui-_r_0_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div>"`;
 
-exports[`Combobox (standalone) > snapshots > disabled 1`] = `"<div><div data-disabled="" data-placeholder="" role="group" data-slot="combobox-input-group" class="astw:relative astw:flex astw:items-center"><input data-disabled="" autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none" role="combobox" aria-expanded="false" aria-haspopup="listbox" aria-autocomplete="list" disabled="" id="base-ui-_r_4_" data-slot="combobox-input" placeholder="Disabled" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:shadow-xs astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50" value=""><button type="button" data-disabled="" data-placeholder="" tabindex="-1" disabled="" aria-expanded="false" aria-haspopup="listbox" data-slot="combobox-trigger" class="astw:absolute astw:inset-y-0 astw:right-0 astw:flex astw:items-center astw:px-2 astw:text-muted-foreground astw:outline-none astw:hover:text-foreground astw:disabled:pointer-events-none astw:disabled:opacity-50"><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button></div><input id="base-ui-_r_4_-hidden-input" disabled="" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div>"`;
+exports[`Combobox (standalone) > snapshots > disabled 1`] = `"<div><div data-disabled="" data-placeholder="" role="group" data-slot="combobox-input-group" class="astw:relative astw:flex astw:items-center"><input data-disabled="" autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none" role="combobox" aria-expanded="false" aria-haspopup="listbox" aria-autocomplete="list" disabled="" id="base-ui-_r_4_" data-slot="combobox-input" placeholder="Disabled" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50" value=""><button type="button" data-disabled="" data-placeholder="" tabindex="-1" disabled="" aria-expanded="false" aria-haspopup="listbox" data-slot="combobox-trigger" class="astw:absolute astw:inset-y-0 astw:right-0 astw:flex astw:items-center astw:px-2 astw:text-muted-foreground astw:outline-none astw:hover:text-foreground astw:disabled:pointer-events-none astw:disabled:opacity-50"><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button></div><input id="base-ui-_r_4_-hidden-input" disabled="" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div>"`;
 
-exports[`Combobox (standalone) > snapshots > multiple mode 1`] = `"<div><div data-placeholder="" role="group" data-slot="combobox-input-group" class="astw:relative astw:flex astw:items-center"><div data-slot="combobox-chips" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:flex astw:min-h-9 astw:w-full astw:flex-wrap astw:items-center astw:gap-1 astw:rounded-md astw:border astw:px-1.5 astw:py-1 astw:text-sm astw:shadow-xs astw:focus-within:border-ring astw:focus-within:ring-ring/50 astw:focus-within:ring-[3px] astw:[&amp;_[data-slot=combobox-input]]:border-0 astw:[&amp;_[data-slot=combobox-input]]:bg-transparent astw:[&amp;_[data-slot=combobox-input]]:shadow-none astw:[&amp;_[data-slot=combobox-input]]:ring-0 astw:[&amp;_[data-slot=combobox-input]]:h-auto astw:[&amp;_[data-slot=combobox-input]]:min-w-20 astw:[&amp;_[data-slot=combobox-input]]:flex-1 astw:[&amp;_[data-slot=combobox-input]]:px-1.5 astw:[&amp;_[data-slot=combobox-input]]:py-0 astw:[&amp;_[data-slot=combobox-input]]:focus-visible:border-transparent astw:[&amp;_[data-slot=combobox-input]]:focus-visible:ring-0"><input autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none" role="combobox" aria-expanded="false" aria-haspopup="listbox" aria-autocomplete="list" id="base-ui-_r_8_" data-slot="combobox-input" placeholder="Pick fruits" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:shadow-xs astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50" value=""></div></div><input id="base-ui-_r_8_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div>"`;
+exports[`Combobox (standalone) > snapshots > multiple mode 1`] = `"<div><div data-placeholder="" role="group" data-slot="combobox-input-group" class="astw:relative astw:flex astw:items-center"><div data-slot="combobox-chips" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:flex astw:min-h-9 astw:w-full astw:flex-wrap astw:items-center astw:gap-1 astw:rounded-md astw:border astw:px-1.5 astw:py-1 astw:text-sm astw:focus-within:border-ring astw:focus-within:ring-ring/50 astw:focus-within:ring-[3px] astw:[&amp;_[data-slot=combobox-input]]:border-0 astw:[&amp;_[data-slot=combobox-input]]:bg-transparent astw:[&amp;_[data-slot=combobox-input]]:shadow-none astw:[&amp;_[data-slot=combobox-input]]:ring-0 astw:[&amp;_[data-slot=combobox-input]]:h-auto astw:[&amp;_[data-slot=combobox-input]]:min-w-20 astw:[&amp;_[data-slot=combobox-input]]:flex-1 astw:[&amp;_[data-slot=combobox-input]]:px-1.5 astw:[&amp;_[data-slot=combobox-input]]:py-0 astw:[&amp;_[data-slot=combobox-input]]:focus-visible:border-transparent astw:[&amp;_[data-slot=combobox-input]]:focus-visible:ring-0"><input autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none" role="combobox" aria-expanded="false" aria-haspopup="listbox" aria-autocomplete="list" id="base-ui-_r_8_" data-slot="combobox-input" placeholder="Pick fruits" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50" value=""></div></div><input id="base-ui-_r_8_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div>"`;
 
-exports[`Combobox (standalone) > snapshots > with custom className 1`] = `"<div class="custom-class"><div data-placeholder="" role="group" data-slot="combobox-input-group" class="astw:relative astw:flex astw:items-center"><input autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none" role="combobox" aria-expanded="false" aria-haspopup="listbox" aria-autocomplete="list" id="base-ui-_r_b_" data-slot="combobox-input" placeholder="Styled" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:shadow-xs astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50" value=""><button type="button" data-placeholder="" tabindex="-1" aria-expanded="false" aria-haspopup="listbox" data-slot="combobox-trigger" class="astw:absolute astw:inset-y-0 astw:right-0 astw:flex astw:items-center astw:px-2 astw:text-muted-foreground astw:outline-none astw:hover:text-foreground astw:disabled:pointer-events-none astw:disabled:opacity-50"><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button></div><input id="base-ui-_r_b_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div>"`;
+exports[`Combobox (standalone) > snapshots > with custom className 1`] = `"<div class="custom-class"><div data-placeholder="" role="group" data-slot="combobox-input-group" class="astw:relative astw:flex astw:items-center"><input autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none" role="combobox" aria-expanded="false" aria-haspopup="listbox" aria-autocomplete="list" id="base-ui-_r_b_" data-slot="combobox-input" placeholder="Styled" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50" value=""><button type="button" data-placeholder="" tabindex="-1" aria-expanded="false" aria-haspopup="listbox" data-slot="combobox-trigger" class="astw:absolute astw:inset-y-0 astw:right-0 astw:flex astw:items-center astw:px-2 astw:text-muted-foreground astw:outline-none astw:hover:text-foreground astw:disabled:pointer-events-none astw:disabled:opacity-50"><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button></div><input id="base-ui-_r_b_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div>"`;
diff --git a/packages/core/__snapshots__/src__components__combobox__combobox.test.tsx.snap b/packages/core/__snapshots__/src__components__combobox__combobox.test.tsx.snap
index b8b397349..c606cf03d 100644
--- a/packages/core/__snapshots__/src__components__combobox__combobox.test.tsx.snap
+++ b/packages/core/__snapshots__/src__components__combobox__combobox.test.tsx.snap
@@ -1,9 +1,9 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`Combobox.Parts > snapshots > closed combobox with placeholder 1`] = `"<input data-list-empty="" autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none" role="combobox" aria-expanded="false" aria-haspopup="listbox" aria-autocomplete="list" id="base-ui-_r_0_" data-slot="combobox-input" data-testid="input" placeholder="Search fruits..." class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:shadow-xs astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50" value=""><input id="base-ui-_r_0_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value="">"`;
+exports[`Combobox.Parts > snapshots > closed combobox with placeholder 1`] = `"<input data-list-empty="" autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none" role="combobox" aria-expanded="false" aria-haspopup="listbox" aria-autocomplete="list" id="base-ui-_r_0_" data-slot="combobox-input" data-testid="input" placeholder="Search fruits..." class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50" value=""><input id="base-ui-_r_0_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value="">"`;
 
-exports[`Combobox.Parts > snapshots > open combobox 1`] = `"<div data-base-ui-inert=""><span role="button" aria-label="Dismiss" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: absolute;"></span><input data-list-empty="" autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none" role="combobox" aria-expanded="true" aria-haspopup="listbox" aria-autocomplete="list" id="base-ui-_r_3_" data-slot="combobox-input" data-testid="input" placeholder="Search fruits..." class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:shadow-xs astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50" value="a" data-popup-open="" data-pressed="" data-popup-side="bottom" aria-controls="_r_4_"><input id="base-ui-_r_3_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div><div id="_r_6_" data-base-ui-portal="" style="position: relative; z-index: var(--z-popup);"><div data-open="" data-side="bottom" data-align="center" data-empty="" role="presentation" style="position: absolute; top: 0px; left: 0px; --available-width: -10px; --available-height: -10px; --anchor-width: 0px; --anchor-height: 0px; --transform-origin: 0px 0px; transform: translate(0px, 0px);" data-anchor-hidden=""><div data-open="" data-side="bottom" data-align="center" data-empty="" tabindex="-1" data-base-ui-focusable="" role="presentation" data-slot="combobox-content" class="astw:bg-popover astw:text-popover-foreground astw:data-open:animate-in astw:data-ending-style:animate-out astw:data-ending-style:fade-out-0 astw:data-open:fade-in-0 astw:data-ending-style:zoom-out-95 astw:data-open:zoom-in-95 astw:z-(--z-popup) astw:w-[var(--anchor-width)] astw:min-w-32 astw:origin-(--transform-origin) astw:overflow-hidden astw:rounded-md astw:border astw:border-border astw:shadow-md" data-anchor-hidden=""><div data-empty="" role="listbox" tabindex="-1" id="_r_4_" data-slot="combobox-list" class="astw:max-h-60 astw:overflow-y-auto astw:p-1"><div role="option" id="base-ui-_r_3_-0" aria-selected="false" data-slot="combobox-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:pr-8 astw:pl-2 astw:text-sm astw:outline-hidden astw:select-none astw:data-highlighted:bg-accent astw:data-highlighted:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50"><span class="astw:absolute astw:right-2 astw:flex astw:size-3.5 astw:items-center astw:justify-center"></span>Apple</div><div role="option" id="base-ui-_r_3_-1" aria-selected="false" data-slot="combobox-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:pr-8 astw:pl-2 astw:text-sm astw:outline-hidden astw:select-none astw:data-highlighted:bg-accent astw:data-highlighted:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50"><span class="astw:absolute astw:right-2 astw:flex astw:size-3.5 astw:items-center astw:justify-center"></span>Banana</div><div role="option" id="base-ui-_r_3_-2" aria-selected="false" data-slot="combobox-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:pr-8 astw:pl-2 astw:text-sm astw:outline-hidden astw:select-none astw:data-highlighted:bg-accent astw:data-highlighted:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50"><span class="astw:absolute astw:right-2 astw:flex astw:size-3.5 astw:items-center astw:justify-center"></span>Cherry</div><div role="option" id="base-ui-_r_3_-3" aria-selected="false" data-slot="combobox-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:pr-8 astw:pl-2 astw:text-sm astw:outline-hidden astw:select-none astw:data-highlighted:bg-accent astw:data-highlighted:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50"><span class="astw:absolute astw:right-2 astw:flex astw:size-3.5 astw:items-center astw:justify-center"></span>Date</div><div role="option" id="base-ui-_r_3_-4" aria-selected="false" data-slot="combobox-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:pr-8 astw:pl-2 astw:text-sm astw:outline-hidden astw:select-none astw:data-highlighted:bg-accent astw:data-highlighted:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50"><span class="astw:absolute astw:right-2 astw:flex astw:size-3.5 astw:items-center astw:justify-center"></span>Elderberry</div><div role="status" aria-live="polite" aria-atomic="true" data-slot="combobox-empty" class="astw:px-4 astw:pt-2 astw:pb-4 astw:text-center astw:text-sm astw:text-muted-foreground astw:empty:hidden">No results found</div></div></div><span role="button" aria-label="Dismiss" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: absolute;"></span></div></div>"`;
+exports[`Combobox.Parts > snapshots > open combobox 1`] = `"<div data-base-ui-inert=""><span role="button" aria-label="Dismiss" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: absolute;"></span><input data-list-empty="" autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none" role="combobox" aria-expanded="true" aria-haspopup="listbox" aria-autocomplete="list" id="base-ui-_r_3_" data-slot="combobox-input" data-testid="input" placeholder="Search fruits..." class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50" value="a" data-popup-open="" data-pressed="" data-popup-side="bottom" aria-controls="_r_4_"><input id="base-ui-_r_3_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div><div id="_r_6_" data-base-ui-portal="" style="position: relative; z-index: var(--z-popup);"><div data-open="" data-side="bottom" data-align="center" data-empty="" role="presentation" style="position: absolute; top: 0px; left: 0px; --available-width: -10px; --available-height: -10px; --anchor-width: 0px; --anchor-height: 0px; --transform-origin: 0px 0px; transform: translate(0px, 0px);" data-anchor-hidden=""><div data-open="" data-side="bottom" data-align="center" data-empty="" tabindex="-1" data-base-ui-focusable="" role="presentation" data-slot="combobox-content" class="astw:bg-popover astw:text-popover-foreground astw:data-open:animate-in astw:data-ending-style:animate-out astw:data-ending-style:fade-out-0 astw:data-open:fade-in-0 astw:data-ending-style:zoom-out-95 astw:data-open:zoom-in-95 astw:z-(--z-popup) astw:w-[var(--anchor-width)] astw:min-w-32 astw:origin-(--transform-origin) astw:overflow-hidden astw:rounded-md astw:border astw:border-border astw:shadow-md" data-anchor-hidden=""><div data-empty="" role="listbox" tabindex="-1" id="_r_4_" data-slot="combobox-list" class="astw:max-h-60 astw:overflow-y-auto astw:p-1"><div role="option" id="base-ui-_r_3_-0" aria-selected="false" data-slot="combobox-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:pr-8 astw:pl-2 astw:text-sm astw:outline-hidden astw:select-none astw:data-highlighted:bg-accent astw:data-highlighted:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50"><span class="astw:absolute astw:right-2 astw:flex astw:size-3.5 astw:items-center astw:justify-center"></span>Apple</div><div role="option" id="base-ui-_r_3_-1" aria-selected="false" data-slot="combobox-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:pr-8 astw:pl-2 astw:text-sm astw:outline-hidden astw:select-none astw:data-highlighted:bg-accent astw:data-highlighted:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50"><span class="astw:absolute astw:right-2 astw:flex astw:size-3.5 astw:items-center astw:justify-center"></span>Banana</div><div role="option" id="base-ui-_r_3_-2" aria-selected="false" data-slot="combobox-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:pr-8 astw:pl-2 astw:text-sm astw:outline-hidden astw:select-none astw:data-highlighted:bg-accent astw:data-highlighted:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50"><span class="astw:absolute astw:right-2 astw:flex astw:size-3.5 astw:items-center astw:justify-center"></span>Cherry</div><div role="option" id="base-ui-_r_3_-3" aria-selected="false" data-slot="combobox-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:pr-8 astw:pl-2 astw:text-sm astw:outline-hidden astw:select-none astw:data-highlighted:bg-accent astw:data-highlighted:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50"><span class="astw:absolute astw:right-2 astw:flex astw:size-3.5 astw:items-center astw:justify-center"></span>Date</div><div role="option" id="base-ui-_r_3_-4" aria-selected="false" data-slot="combobox-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:pr-8 astw:pl-2 astw:text-sm astw:outline-hidden astw:select-none astw:data-highlighted:bg-accent astw:data-highlighted:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50"><span class="astw:absolute astw:right-2 astw:flex astw:size-3.5 astw:items-center astw:justify-center"></span>Elderberry</div><div role="status" aria-live="polite" aria-atomic="true" data-slot="combobox-empty" class="astw:px-4 astw:pt-2 astw:pb-4 astw:text-center astw:text-sm astw:text-muted-foreground astw:empty:hidden">No results found</div></div></div><span role="button" aria-label="Dismiss" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: absolute;"></span></div></div>"`;
 
-exports[`Combobox.Parts > snapshots > with InputGroup, Clear, and Trigger 1`] = `"<div data-list-empty="" data-placeholder="" role="group" data-slot="combobox-input-group" class="astw:relative astw:flex astw:items-center"><input data-list-empty="" autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none" role="combobox" aria-expanded="false" aria-haspopup="listbox" aria-autocomplete="list" id="base-ui-_r_7_" data-slot="combobox-input" placeholder="Search..." class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:shadow-xs astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50" value=""><button type="button" data-list-empty="" data-placeholder="" tabindex="-1" aria-expanded="false" aria-haspopup="listbox" data-slot="combobox-trigger" class="astw:absolute astw:inset-y-0 astw:right-0 astw:flex astw:items-center astw:px-2 astw:text-muted-foreground astw:outline-none astw:hover:text-foreground astw:disabled:pointer-events-none astw:disabled:opacity-50"><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button></div><input id="base-ui-_r_7_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value="">"`;
+exports[`Combobox.Parts > snapshots > with InputGroup, Clear, and Trigger 1`] = `"<div data-list-empty="" data-placeholder="" role="group" data-slot="combobox-input-group" class="astw:relative astw:flex astw:items-center"><input data-list-empty="" autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none" role="combobox" aria-expanded="false" aria-haspopup="listbox" aria-autocomplete="list" id="base-ui-_r_7_" data-slot="combobox-input" placeholder="Search..." class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50" value=""><button type="button" data-list-empty="" data-placeholder="" tabindex="-1" aria-expanded="false" aria-haspopup="listbox" data-slot="combobox-trigger" class="astw:absolute astw:inset-y-0 astw:right-0 astw:flex astw:items-center astw:px-2 astw:text-muted-foreground astw:outline-none astw:hover:text-foreground astw:disabled:pointer-events-none astw:disabled:opacity-50"><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button></div><input id="base-ui-_r_7_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value="">"`;
 
-exports[`Combobox.Parts > snapshots > with groups 1`] = `"<input data-list-empty="" autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none" role="combobox" aria-expanded="false" aria-haspopup="listbox" aria-autocomplete="list" id="base-ui-_r_b_" data-slot="combobox-input" placeholder="Search..." class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:shadow-xs astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50" value=""><input id="base-ui-_r_b_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value="">"`;
+exports[`Combobox.Parts > snapshots > with groups 1`] = `"<input data-list-empty="" autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none" role="combobox" aria-expanded="false" aria-haspopup="listbox" aria-autocomplete="list" id="base-ui-_r_b_" data-slot="combobox-input" placeholder="Search..." class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50" value=""><input id="base-ui-_r_b_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value="">"`;
diff --git a/packages/core/__snapshots__/src__components__date-field__date-field.test.tsx.snap b/packages/core/__snapshots__/src__components__date-field__date-field.test.tsx.snap
index ea542ba06..347fa9bd2 100644
--- a/packages/core/__snapshots__/src__components__date-field__date-field.test.tsx.snap
+++ b/packages/core/__snapshots__/src__components__date-field__date-field.test.tsx.snap
@@ -1,7 +1,7 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`snapshots > DateField 1`] = `"<div data-slot="date-field" class="astw:relative"><input id="base-ui-_r_0_" tabindex="-1" aria-hidden="true" class="astw:pointer-events-none astw:absolute astw:size-px astw:overflow-hidden astw:opacity-0" value=""><div role="group" data-slot="date-picker-group" aria-label="Invoice date" class="astw:border-input astw:w-full astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:shadow-xs astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:flex astw:h-9 astw:min-w-[142px] astw:items-center astw:gap-0 astw:py-0 astw:focus-within:border-ring astw:focus-within:ring-[3px] astw:focus-within:ring-ring/50 astw:data-[invalid]:border-destructive astw:data-[invalid]:ring-destructive/20 astw:data-[disabled]:cursor-not-allowed astw:data-[disabled]:opacity-50"><div data-slot="date-input" class="astw:flex astw:flex-1 astw:items-center astw:gap-px"><div role="spinbutton" data-slot="date-segment" data-type="month" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="month" aria-valuemin="1" aria-valuemax="12" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">mm</div><span aria-hidden="true" data-slot="date-segment" data-type="literal" class="astw:select-none astw:px-px astw:text-muted-foreground/60">/</span><div role="spinbutton" data-slot="date-segment" data-type="day" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="day" aria-valuemin="1" aria-valuemax="31" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">dd</div><span aria-hidden="true" data-slot="date-segment" data-type="literal" class="astw:select-none astw:px-px astw:text-muted-foreground/60">/</span><div role="spinbutton" data-slot="date-segment" data-type="year" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="year" aria-valuemin="1" aria-valuemax="9999" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">yyyy</div></div></div></div>"`;
+exports[`snapshots > DateField 1`] = `"<div data-slot="date-field" class="astw:relative"><input id="base-ui-_r_0_" tabindex="-1" aria-hidden="true" class="astw:pointer-events-none astw:absolute astw:size-px astw:overflow-hidden astw:opacity-0" value=""><div role="group" data-slot="date-picker-group" aria-label="Invoice date" class="astw:border-input astw:w-full astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:flex astw:h-9 astw:min-w-[142px] astw:items-center astw:gap-0 astw:py-0 astw:focus-within:border-ring astw:focus-within:ring-[3px] astw:focus-within:ring-ring/50 astw:data-[invalid]:border-destructive astw:data-[invalid]:ring-destructive/20 astw:data-[disabled]:cursor-not-allowed astw:data-[disabled]:opacity-50"><div data-slot="date-input" class="astw:flex astw:flex-1 astw:items-center astw:gap-px"><div role="spinbutton" data-slot="date-segment" data-type="month" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="month" aria-valuemin="1" aria-valuemax="12" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">mm</div><span aria-hidden="true" data-slot="date-segment" data-type="literal" class="astw:select-none astw:px-px astw:text-muted-foreground/60">/</span><div role="spinbutton" data-slot="date-segment" data-type="day" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="day" aria-valuemin="1" aria-valuemax="31" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">dd</div><span aria-hidden="true" data-slot="date-segment" data-type="literal" class="astw:select-none astw:px-px astw:text-muted-foreground/60">/</span><div role="spinbutton" data-slot="date-segment" data-type="year" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="year" aria-valuemin="1" aria-valuemax="9999" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">yyyy</div></div></div></div>"`;
 
-exports[`snapshots > DateField — manually labelled + described 1`] = `"<label id="date-label" for="date-input">Date</label><div data-slot="date-field" class="astw:relative"><input id="date-input" tabindex="-1" aria-hidden="true" class="astw:pointer-events-none astw:absolute astw:size-px astw:overflow-hidden astw:opacity-0" value=""><div role="group" data-slot="date-picker-group" aria-labelledby="date-label" aria-describedby="date-help date-error" data-invalid="true" class="astw:border-input astw:w-full astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:shadow-xs astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:flex astw:h-9 astw:min-w-[142px] astw:items-center astw:gap-0 astw:py-0 astw:focus-within:border-ring astw:focus-within:ring-[3px] astw:focus-within:ring-ring/50 astw:data-[invalid]:border-destructive astw:data-[invalid]:ring-destructive/20 astw:data-[disabled]:cursor-not-allowed astw:data-[disabled]:opacity-50"><div data-slot="date-input" class="astw:flex astw:flex-1 astw:items-center astw:gap-px"><div role="spinbutton" data-slot="date-segment" data-type="month" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="month" aria-invalid="true" aria-valuemin="1" aria-valuemax="12" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">mm</div><span aria-hidden="true" data-slot="date-segment" data-type="literal" class="astw:select-none astw:px-px astw:text-muted-foreground/60">/</span><div role="spinbutton" data-slot="date-segment" data-type="day" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="day" aria-invalid="true" aria-valuemin="1" aria-valuemax="31" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">dd</div><span aria-hidden="true" data-slot="date-segment" data-type="literal" class="astw:select-none astw:px-px astw:text-muted-foreground/60">/</span><div role="spinbutton" data-slot="date-segment" data-type="year" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="year" aria-invalid="true" aria-valuemin="1" aria-valuemax="9999" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">yyyy</div></div></div></div><p id="date-help">Pick a date</p><p id="date-error">Required</p>"`;
+exports[`snapshots > DateField — manually labelled + described 1`] = `"<label id="date-label" for="date-input">Date</label><div data-slot="date-field" class="astw:relative"><input id="date-input" tabindex="-1" aria-hidden="true" class="astw:pointer-events-none astw:absolute astw:size-px astw:overflow-hidden astw:opacity-0" value=""><div role="group" data-slot="date-picker-group" aria-labelledby="date-label" aria-describedby="date-help date-error" data-invalid="true" class="astw:border-input astw:w-full astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:flex astw:h-9 astw:min-w-[142px] astw:items-center astw:gap-0 astw:py-0 astw:focus-within:border-ring astw:focus-within:ring-[3px] astw:focus-within:ring-ring/50 astw:data-[invalid]:border-destructive astw:data-[invalid]:ring-destructive/20 astw:data-[disabled]:cursor-not-allowed astw:data-[disabled]:opacity-50"><div data-slot="date-input" class="astw:flex astw:flex-1 astw:items-center astw:gap-px"><div role="spinbutton" data-slot="date-segment" data-type="month" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="month" aria-invalid="true" aria-valuemin="1" aria-valuemax="12" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">mm</div><span aria-hidden="true" data-slot="date-segment" data-type="literal" class="astw:select-none astw:px-px astw:text-muted-foreground/60">/</span><div role="spinbutton" data-slot="date-segment" data-type="day" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="day" aria-invalid="true" aria-valuemin="1" aria-valuemax="31" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">dd</div><span aria-hidden="true" data-slot="date-segment" data-type="literal" class="astw:select-none astw:px-px astw:text-muted-foreground/60">/</span><div role="spinbutton" data-slot="date-segment" data-type="year" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="year" aria-invalid="true" aria-valuemin="1" aria-valuemax="9999" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">yyyy</div></div></div></div><p id="date-help">Pick a date</p><p id="date-error">Required</p>"`;
 
-exports[`snapshots > DatePicker — closed 1`] = `"<div data-slot="date-picker" class="astw:relative"><input id="base-ui-ID" tabindex="-1" aria-hidden="true" class="astw:pointer-events-none astw:absolute astw:size-px astw:overflow-hidden astw:opacity-0" value=""><div role="group" data-slot="date-picker-group" aria-label="Ship date" class="astw:border-input astw:w-full astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:shadow-xs astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:flex astw:h-9 astw:min-w-[142px] astw:items-center astw:gap-0 astw:py-0 astw:focus-within:border-ring astw:focus-within:ring-[3px] astw:focus-within:ring-ring/50 astw:data-[invalid]:border-destructive astw:data-[invalid]:ring-destructive/20 astw:data-[disabled]:cursor-not-allowed astw:data-[disabled]:opacity-50"><div data-slot="date-input" class="astw:flex astw:flex-1 astw:items-center astw:gap-px"><div role="spinbutton" data-slot="date-segment" data-type="month" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="month" aria-valuemin="1" aria-valuemax="12" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">mm</div><span aria-hidden="true" data-slot="date-segment" data-type="literal" class="astw:select-none astw:px-px astw:text-muted-foreground/60">/</span><div role="spinbutton" data-slot="date-segment" data-type="day" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="day" aria-valuemin="1" aria-valuemax="31" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">dd</div><span aria-hidden="true" data-slot="date-segment" data-type="literal" class="astw:select-none astw:px-px astw:text-muted-foreground/60">/</span><div role="spinbutton" data-slot="date-segment" data-type="year" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="year" aria-valuemin="1" aria-valuemax="9999" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">yyyy</div></div><button type="button" tabindex="0" data-base-ui-click-trigger="" id="base-ui-ID" aria-haspopup="dialog" aria-expanded="false" data-slot="date-picker-button" aria-label="Open calendar" class="astw:ml-1 astw:flex astw:size-7 astw:items-center astw:justify-center astw:rounded-sm astw:outline-none astw:text-muted-foreground astw:hover:text-foreground astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:opacity-50"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-calendar astw:size-4" aria-hidden="true"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg></button></div></div>"`;
+exports[`snapshots > DatePicker — closed 1`] = `"<div data-slot="date-picker" class="astw:relative"><input id="base-ui-ID" tabindex="-1" aria-hidden="true" class="astw:pointer-events-none astw:absolute astw:size-px astw:overflow-hidden astw:opacity-0" value=""><div role="group" data-slot="date-picker-group" aria-label="Ship date" class="astw:border-input astw:w-full astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:flex astw:h-9 astw:min-w-[142px] astw:items-center astw:gap-0 astw:py-0 astw:focus-within:border-ring astw:focus-within:ring-[3px] astw:focus-within:ring-ring/50 astw:data-[invalid]:border-destructive astw:data-[invalid]:ring-destructive/20 astw:data-[disabled]:cursor-not-allowed astw:data-[disabled]:opacity-50"><div data-slot="date-input" class="astw:flex astw:flex-1 astw:items-center astw:gap-px"><div role="spinbutton" data-slot="date-segment" data-type="month" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="month" aria-valuemin="1" aria-valuemax="12" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">mm</div><span aria-hidden="true" data-slot="date-segment" data-type="literal" class="astw:select-none astw:px-px astw:text-muted-foreground/60">/</span><div role="spinbutton" data-slot="date-segment" data-type="day" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="day" aria-valuemin="1" aria-valuemax="31" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">dd</div><span aria-hidden="true" data-slot="date-segment" data-type="literal" class="astw:select-none astw:px-px astw:text-muted-foreground/60">/</span><div role="spinbutton" data-slot="date-segment" data-type="year" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="year" aria-valuemin="1" aria-valuemax="9999" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">yyyy</div></div><button type="button" tabindex="0" data-base-ui-click-trigger="" id="base-ui-ID" aria-haspopup="dialog" aria-expanded="false" data-slot="date-picker-button" aria-label="Open calendar" class="astw:ml-1 astw:flex astw:size-7 astw:items-center astw:justify-center astw:rounded-sm astw:outline-none astw:text-muted-foreground astw:hover:text-foreground astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:opacity-50"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-calendar astw:size-4" aria-hidden="true"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg></button></div></div>"`;
diff --git a/packages/core/__snapshots__/src__components__date-field__date-range-picker.test.tsx.snap b/packages/core/__snapshots__/src__components__date-field__date-range-picker.test.tsx.snap
index 134c84193..9275ee2a2 100644
--- a/packages/core/__snapshots__/src__components__date-field__date-range-picker.test.tsx.snap
+++ b/packages/core/__snapshots__/src__components__date-field__date-range-picker.test.tsx.snap
@@ -1,3 +1,3 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`snapshots > DateRangePicker — closed 1`] = `"<div data-slot="date-range-picker" class="astw:relative"><input id="base-ui-ID" tabindex="-1" aria-hidden="true" class="astw:pointer-events-none astw:absolute astw:size-px astw:overflow-hidden astw:opacity-0" value=""><div role="group" data-slot="date-range-picker-group" aria-label="Billing period" class="astw:border-input astw:w-full astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:shadow-xs astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:flex astw:h-9 astw:items-center astw:gap-0 astw:py-0 astw:focus-within:border-ring astw:focus-within:ring-[3px] astw:focus-within:ring-ring/50 astw:data-[invalid]:border-destructive astw:data-[invalid]:ring-destructive/20 astw:data-[disabled]:cursor-not-allowed astw:data-[disabled]:opacity-50 astw:min-w-[272px]"><div data-slot="date-input" class="astw:flex astw:flex-1 astw:items-center astw:gap-px"><div role="spinbutton" data-slot="date-segment" data-type="month" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="start date month" aria-valuemin="1" aria-valuemax="12" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">mm</div><span aria-hidden="true" data-slot="date-segment" data-type="literal" class="astw:select-none astw:px-px astw:text-muted-foreground/60">/</span><div role="spinbutton" data-slot="date-segment" data-type="day" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="start date day" aria-valuemin="1" aria-valuemax="31" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">dd</div><span aria-hidden="true" data-slot="date-segment" data-type="literal" class="astw:select-none astw:px-px astw:text-muted-foreground/60">/</span><div role="spinbutton" data-slot="date-segment" data-type="year" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="start date year" aria-valuemin="1" aria-valuemax="9999" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">yyyy</div></div><span aria-hidden="true" data-slot="date-range-separator" class="astw:select-none astw:px-1 astw:text-muted-foreground">–</span><div data-slot="date-input" class="astw:flex astw:items-center astw:gap-px astw:flex-1"><div role="spinbutton" data-slot="date-segment" data-type="month" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="end date month" aria-valuemin="1" aria-valuemax="12" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">mm</div><span aria-hidden="true" data-slot="date-segment" data-type="literal" class="astw:select-none astw:px-px astw:text-muted-foreground/60">/</span><div role="spinbutton" data-slot="date-segment" data-type="day" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="end date day" aria-valuemin="1" aria-valuemax="31" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">dd</div><span aria-hidden="true" data-slot="date-segment" data-type="literal" class="astw:select-none astw:px-px astw:text-muted-foreground/60">/</span><div role="spinbutton" data-slot="date-segment" data-type="year" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="end date year" aria-valuemin="1" aria-valuemax="9999" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">yyyy</div></div><button type="button" tabindex="0" data-base-ui-click-trigger="" id="base-ui-ID" aria-haspopup="dialog" aria-expanded="false" data-slot="date-picker-button" aria-label="Open calendar" class="astw:ml-1 astw:flex astw:size-7 astw:items-center astw:justify-center astw:rounded-sm astw:outline-none astw:text-muted-foreground astw:hover:text-foreground astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:opacity-50"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-calendar astw:size-4" aria-hidden="true"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg></button></div></div>"`;
+exports[`snapshots > DateRangePicker — closed 1`] = `"<div data-slot="date-range-picker" class="astw:relative"><input id="base-ui-ID" tabindex="-1" aria-hidden="true" class="astw:pointer-events-none astw:absolute astw:size-px astw:overflow-hidden astw:opacity-0" value=""><div role="group" data-slot="date-range-picker-group" aria-label="Billing period" class="astw:border-input astw:w-full astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:flex astw:h-9 astw:items-center astw:gap-0 astw:py-0 astw:focus-within:border-ring astw:focus-within:ring-[3px] astw:focus-within:ring-ring/50 astw:data-[invalid]:border-destructive astw:data-[invalid]:ring-destructive/20 astw:data-[disabled]:cursor-not-allowed astw:data-[disabled]:opacity-50 astw:min-w-[272px]"><div data-slot="date-input" class="astw:flex astw:flex-1 astw:items-center astw:gap-px"><div role="spinbutton" data-slot="date-segment" data-type="month" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="start date month" aria-valuemin="1" aria-valuemax="12" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">mm</div><span aria-hidden="true" data-slot="date-segment" data-type="literal" class="astw:select-none astw:px-px astw:text-muted-foreground/60">/</span><div role="spinbutton" data-slot="date-segment" data-type="day" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="start date day" aria-valuemin="1" aria-valuemax="31" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">dd</div><span aria-hidden="true" data-slot="date-segment" data-type="literal" class="astw:select-none astw:px-px astw:text-muted-foreground/60">/</span><div role="spinbutton" data-slot="date-segment" data-type="year" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="start date year" aria-valuemin="1" aria-valuemax="9999" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">yyyy</div></div><span aria-hidden="true" data-slot="date-range-separator" class="astw:select-none astw:px-1 astw:text-muted-foreground">–</span><div data-slot="date-input" class="astw:flex astw:items-center astw:gap-px astw:flex-1"><div role="spinbutton" data-slot="date-segment" data-type="month" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="end date month" aria-valuemin="1" aria-valuemax="12" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">mm</div><span aria-hidden="true" data-slot="date-segment" data-type="literal" class="astw:select-none astw:px-px astw:text-muted-foreground/60">/</span><div role="spinbutton" data-slot="date-segment" data-type="day" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="end date day" aria-valuemin="1" aria-valuemax="31" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">dd</div><span aria-hidden="true" data-slot="date-segment" data-type="literal" class="astw:select-none astw:px-px astw:text-muted-foreground/60">/</span><div role="spinbutton" data-slot="date-segment" data-type="year" data-placeholder="true" contenteditable="false" tabindex="0" aria-label="end date year" aria-valuemin="1" aria-valuemax="9999" aria-valuetext="Empty" class="astw:rounded astw:px-0.5 astw:tabular-nums astw:caret-transparent astw:outline-none astw:focus:bg-primary astw:focus:text-primary-foreground astw:data-[placeholder]:text-muted-foreground">yyyy</div></div><button type="button" tabindex="0" data-base-ui-click-trigger="" id="base-ui-ID" aria-haspopup="dialog" aria-expanded="false" data-slot="date-picker-button" aria-label="Open calendar" class="astw:ml-1 astw:flex astw:size-7 astw:items-center astw:justify-center astw:rounded-sm astw:outline-none astw:text-muted-foreground astw:hover:text-foreground astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:opacity-50"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-calendar astw:size-4" aria-hidden="true"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg></button></div></div>"`;
diff --git a/packages/core/__snapshots__/src__components__field__field.test.tsx.snap b/packages/core/__snapshots__/src__components__field__field.test.tsx.snap
index d86f84a4d..02ebd05b9 100644
--- a/packages/core/__snapshots__/src__components__field__field.test.tsx.snap
+++ b/packages/core/__snapshots__/src__components__field__field.test.tsx.snap
@@ -1,11 +1,11 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`Field > snapshots > basic field with label and control 1`] = `"<div data-slot="field" class="astw:flex astw:flex-col astw:items-start astw:gap-1"><label id="base-ui-_r_1_" for="base-ui-_r_0_" data-slot="field-label" class="astw:text-sm astw:font-medium">Username</label><input id="base-ui-_r_0_" data-slot="field-control" placeholder="Enter username" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:shadow-xs astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:h-9 astw:py-1 astw:data-invalid:ring-destructive/20 astw:dark:data-invalid:ring-destructive/40 astw:data-invalid:border-destructive" name="username" aria-labelledby="base-ui-_r_1_"></div>"`;
+exports[`Field > snapshots > basic field with label and control 1`] = `"<div data-slot="field" class="astw:flex astw:flex-col astw:items-start astw:gap-1"><label id="base-ui-_r_1_" for="base-ui-_r_0_" data-slot="field-label" class="astw:text-sm astw:font-medium">Username</label><input id="base-ui-_r_0_" data-slot="field-control" placeholder="Enter username" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:h-9 astw:py-1 astw:data-invalid:ring-destructive/20 astw:dark:data-invalid:ring-destructive/40 astw:data-invalid:border-destructive" name="username" aria-labelledby="base-ui-_r_1_"></div>"`;
 
-exports[`Field > snapshots > disabled field 1`] = `"<div data-disabled="" data-slot="field" class="astw:flex astw:flex-col astw:items-start astw:gap-1"><label data-disabled="" id="base-ui-_r_c_" for="base-ui-_r_b_" data-slot="field-label" class="astw:text-sm astw:font-medium">Disabled</label><input data-disabled="" id="base-ui-_r_b_" disabled="" data-slot="field-control" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:shadow-xs astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:h-9 astw:py-1 astw:data-invalid:ring-destructive/20 astw:dark:data-invalid:ring-destructive/40 astw:data-invalid:border-destructive" name="disabled-field" aria-labelledby="base-ui-_r_c_"></div>"`;
+exports[`Field > snapshots > disabled field 1`] = `"<div data-disabled="" data-slot="field" class="astw:flex astw:flex-col astw:items-start astw:gap-1"><label data-disabled="" id="base-ui-_r_c_" for="base-ui-_r_b_" data-slot="field-label" class="astw:text-sm astw:font-medium">Disabled</label><input data-disabled="" id="base-ui-_r_b_" disabled="" data-slot="field-control" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:h-9 astw:py-1 astw:data-invalid:ring-destructive/20 astw:dark:data-invalid:ring-destructive/40 astw:data-invalid:border-destructive" name="disabled-field" aria-labelledby="base-ui-_r_c_"></div>"`;
 
-exports[`Field > snapshots > field with custom className 1`] = `"<div data-slot="field" class="astw:flex astw:flex-col astw:items-start astw:gap-1 custom-class"><label id="base-ui-_r_f_" for="base-ui-_r_e_" data-slot="field-label" class="astw:text-sm astw:font-medium label-class">Custom</label><input id="base-ui-_r_e_" data-slot="field-control" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:shadow-xs astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:h-9 astw:py-1 astw:data-invalid:ring-destructive/20 astw:dark:data-invalid:ring-destructive/40 astw:data-invalid:border-destructive control-class" name="custom" aria-labelledby="base-ui-_r_f_"></div>"`;
+exports[`Field > snapshots > field with custom className 1`] = `"<div data-slot="field" class="astw:flex astw:flex-col astw:items-start astw:gap-1 custom-class"><label id="base-ui-_r_f_" for="base-ui-_r_e_" data-slot="field-label" class="astw:text-sm astw:font-medium label-class">Custom</label><input id="base-ui-_r_e_" data-slot="field-control" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:h-9 astw:py-1 astw:data-invalid:ring-destructive/20 astw:dark:data-invalid:ring-destructive/40 astw:data-invalid:border-destructive control-class" name="custom" aria-labelledby="base-ui-_r_f_"></div>"`;
 
-exports[`Field > snapshots > field with description 1`] = `"<div data-slot="field" class="astw:flex astw:flex-col astw:items-start astw:gap-1"><label id="base-ui-_r_4_" for="base-ui-_r_3_" data-slot="field-label" class="astw:text-sm astw:font-medium">Email</label><input id="base-ui-_r_3_" data-slot="field-control" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:shadow-xs astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:h-9 astw:py-1 astw:data-invalid:ring-destructive/20 astw:dark:data-invalid:ring-destructive/40 astw:data-invalid:border-destructive" type="email" name="email" aria-labelledby="base-ui-_r_4_" aria-describedby="base-ui-_r_6_"><p id="base-ui-_r_6_" data-slot="field-description" class="astw:text-muted-foreground astw:text-sm">We will never share your email.</p></div>"`;
+exports[`Field > snapshots > field with description 1`] = `"<div data-slot="field" class="astw:flex astw:flex-col astw:items-start astw:gap-1"><label id="base-ui-_r_4_" for="base-ui-_r_3_" data-slot="field-label" class="astw:text-sm astw:font-medium">Email</label><input id="base-ui-_r_3_" data-slot="field-control" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:h-9 astw:py-1 astw:data-invalid:ring-destructive/20 astw:dark:data-invalid:ring-destructive/40 astw:data-invalid:border-destructive" type="email" name="email" aria-labelledby="base-ui-_r_4_" aria-describedby="base-ui-_r_6_"><p id="base-ui-_r_6_" data-slot="field-description" class="astw:text-muted-foreground astw:text-sm">We will never share your email.</p></div>"`;
 
-exports[`Field > snapshots > field with error 1`] = `"<div data-invalid="" data-slot="field" class="astw:flex astw:flex-col astw:items-start astw:gap-1"><label data-invalid="" id="base-ui-_r_8_" for="base-ui-_r_7_" data-slot="field-label" class="astw:text-sm astw:font-medium">Homepage</label><input data-invalid="" id="base-ui-_r_7_" data-slot="field-control" aria-invalid="true" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:shadow-xs astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:h-9 astw:py-1 astw:data-invalid:ring-destructive/20 astw:dark:data-invalid:ring-destructive/40 astw:data-invalid:border-destructive" type="url" name="url" aria-labelledby="base-ui-_r_8_" aria-describedby="base-ui-_r_a_"><div data-invalid="" id="base-ui-_r_a_" data-slot="field-error" class="astw:text-destructive astw:text-sm astw:font-medium">Please enter a valid URL.</div></div>"`;
+exports[`Field > snapshots > field with error 1`] = `"<div data-invalid="" data-slot="field" class="astw:flex astw:flex-col astw:items-start astw:gap-1"><label data-invalid="" id="base-ui-_r_8_" for="base-ui-_r_7_" data-slot="field-label" class="astw:text-sm astw:font-medium">Homepage</label><input data-invalid="" id="base-ui-_r_7_" data-slot="field-control" aria-invalid="true" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:h-9 astw:py-1 astw:data-invalid:ring-destructive/20 astw:dark:data-invalid:ring-destructive/40 astw:data-invalid:border-destructive" type="url" name="url" aria-labelledby="base-ui-_r_8_" aria-describedby="base-ui-_r_a_"><div data-invalid="" id="base-ui-_r_a_" data-slot="field-error" class="astw:text-destructive astw:text-sm astw:font-medium">Please enter a valid URL.</div></div>"`;
diff --git a/packages/core/__snapshots__/src__components__form__form.test.tsx.snap b/packages/core/__snapshots__/src__components__form__form.test.tsx.snap
index 50a1a6737..056e5737a 100644
--- a/packages/core/__snapshots__/src__components__form__form.test.tsx.snap
+++ b/packages/core/__snapshots__/src__components__form__form.test.tsx.snap
@@ -1,7 +1,7 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`Form > snapshots > basic form with a field 1`] = `"<form novalidate="" data-slot="form"><div data-slot="field" class="astw:flex astw:flex-col astw:items-start astw:gap-1"><label id="base-ui-_r_1_" for="base-ui-_r_0_" data-slot="field-label" class="astw:text-sm astw:font-medium">Homepage</label><input id="base-ui-_r_0_" data-slot="field-control" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:shadow-xs astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:h-9 astw:py-1 astw:data-invalid:ring-destructive/20 astw:dark:data-invalid:ring-destructive/40 astw:data-invalid:border-destructive" type="url" name="url" aria-labelledby="base-ui-_r_1_"></div><button type="submit">Submit</button></form>"`;
+exports[`Form > snapshots > basic form with a field 1`] = `"<form novalidate="" data-slot="form"><div data-slot="field" class="astw:flex astw:flex-col astw:items-start astw:gap-1"><label id="base-ui-_r_1_" for="base-ui-_r_0_" data-slot="field-label" class="astw:text-sm astw:font-medium">Homepage</label><input id="base-ui-_r_0_" data-slot="field-control" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:h-9 astw:py-1 astw:data-invalid:ring-destructive/20 astw:dark:data-invalid:ring-destructive/40 astw:data-invalid:border-destructive" type="url" name="url" aria-labelledby="base-ui-_r_1_"></div><button type="submit">Submit</button></form>"`;
 
 exports[`Form > snapshots > form with custom className 1`] = `"<form novalidate="" data-slot="form" class="custom-form"><div>Content</div></form>"`;
 
-exports[`Form > snapshots > form with noValidate 1`] = `"<form novalidate="" data-slot="form"><div data-slot="field" class="astw:flex astw:flex-col astw:items-start astw:gap-1"><input id="base-ui-_r_3_" data-slot="field-control" required="" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:shadow-xs astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:h-9 astw:py-1 astw:data-invalid:ring-destructive/20 astw:dark:data-invalid:ring-destructive/40 astw:data-invalid:border-destructive" type="email" name="email"></div></form>"`;
+exports[`Form > snapshots > form with noValidate 1`] = `"<form novalidate="" data-slot="form"><div data-slot="field" class="astw:flex astw:flex-col astw:items-start astw:gap-1"><input id="base-ui-_r_3_" data-slot="field-control" required="" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:h-9 astw:py-1 astw:data-invalid:ring-destructive/20 astw:dark:data-invalid:ring-destructive/40 astw:data-invalid:border-destructive" type="email" name="email"></div></form>"`;
diff --git a/packages/core/__snapshots__/src__components__input__input.test.tsx.snap b/packages/core/__snapshots__/src__components__input__input.test.tsx.snap
index 0f907a1f2..9cf20ba50 100644
--- a/packages/core/__snapshots__/src__components__input__input.test.tsx.snap
+++ b/packages/core/__snapshots__/src__components__input__input.test.tsx.snap
@@ -1,13 +1,13 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`Input > snapshots > default text input 1`] = `"<input data-slot="input" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:shadow-xs astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:h-9 astw:py-1 astw:file:text-foreground astw:file:inline-flex astw:file:h-7 astw:file:border-0 astw:file:bg-transparent astw:file:text-sm astw:file:font-medium astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40 astw:aria-invalid:border-destructive" placeholder="Enter text" type="text">"`;
+exports[`Input > snapshots > default text input 1`] = `"<input data-slot="input" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:h-9 astw:py-1 astw:file:text-foreground astw:file:inline-flex astw:file:h-7 astw:file:border-0 astw:file:bg-transparent astw:file:text-sm astw:file:font-medium astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40 astw:aria-invalid:border-destructive" placeholder="Enter text" type="text">"`;
 
-exports[`Input > snapshots > disabled input 1`] = `"<input data-slot="input" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:shadow-xs astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:h-9 astw:py-1 astw:file:text-foreground astw:file:inline-flex astw:file:h-7 astw:file:border-0 astw:file:bg-transparent astw:file:text-sm astw:file:font-medium astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40 astw:aria-invalid:border-destructive" disabled="" placeholder="Disabled">"`;
+exports[`Input > snapshots > disabled input 1`] = `"<input data-slot="input" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:h-9 astw:py-1 astw:file:text-foreground astw:file:inline-flex astw:file:h-7 astw:file:border-0 astw:file:bg-transparent astw:file:text-sm astw:file:font-medium astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40 astw:aria-invalid:border-destructive" disabled="" placeholder="Disabled">"`;
 
-exports[`Input > snapshots > email input 1`] = `"<input data-slot="input" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:shadow-xs astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:h-9 astw:py-1 astw:file:text-foreground astw:file:inline-flex astw:file:h-7 astw:file:border-0 astw:file:bg-transparent astw:file:text-sm astw:file:font-medium astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40 astw:aria-invalid:border-destructive" placeholder="Email" type="email">"`;
+exports[`Input > snapshots > email input 1`] = `"<input data-slot="input" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:h-9 astw:py-1 astw:file:text-foreground astw:file:inline-flex astw:file:h-7 astw:file:border-0 astw:file:bg-transparent astw:file:text-sm astw:file:font-medium astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40 astw:aria-invalid:border-destructive" placeholder="Email" type="email">"`;
 
-exports[`Input > snapshots > file input 1`] = `"<input data-slot="input" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:shadow-xs astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:h-9 astw:py-1 astw:file:text-foreground astw:file:inline-flex astw:file:h-7 astw:file:border-0 astw:file:bg-transparent astw:file:text-sm astw:file:font-medium astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40 astw:aria-invalid:border-destructive" type="file">"`;
+exports[`Input > snapshots > file input 1`] = `"<input data-slot="input" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:h-9 astw:py-1 astw:file:text-foreground astw:file:inline-flex astw:file:h-7 astw:file:border-0 astw:file:bg-transparent astw:file:text-sm astw:file:font-medium astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40 astw:aria-invalid:border-destructive" type="file">"`;
 
-exports[`Input > snapshots > password input 1`] = `"<input data-slot="input" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:shadow-xs astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:h-9 astw:py-1 astw:file:text-foreground astw:file:inline-flex astw:file:h-7 astw:file:border-0 astw:file:bg-transparent astw:file:text-sm astw:file:font-medium astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40 astw:aria-invalid:border-destructive" type="password">"`;
+exports[`Input > snapshots > password input 1`] = `"<input data-slot="input" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:h-9 astw:py-1 astw:file:text-foreground astw:file:inline-flex astw:file:h-7 astw:file:border-0 astw:file:bg-transparent astw:file:text-sm astw:file:font-medium astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40 astw:aria-invalid:border-destructive" type="password">"`;
 
-exports[`Input > snapshots > with custom className 1`] = `"<input data-slot="input" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:shadow-xs astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:h-9 astw:py-1 astw:file:text-foreground astw:file:inline-flex astw:file:h-7 astw:file:border-0 astw:file:bg-transparent astw:file:text-sm astw:file:font-medium astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40 astw:aria-invalid:border-destructive custom-class">"`;
+exports[`Input > snapshots > with custom className 1`] = `"<input data-slot="input" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:h-9 astw:py-1 astw:file:text-foreground astw:file:inline-flex astw:file:h-7 astw:file:border-0 astw:file:bg-transparent astw:file:text-sm astw:file:font-medium astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40 astw:aria-invalid:border-destructive custom-class">"`;
diff --git a/packages/core/__snapshots__/src__components__select__select-standalone.test.tsx.snap b/packages/core/__snapshots__/src__components__select__select-standalone.test.tsx.snap
index bca102bb1..53f2eb55a 100644
--- a/packages/core/__snapshots__/src__components__select__select-standalone.test.tsx.snap
+++ b/packages/core/__snapshots__/src__components__select__select-standalone.test.tsx.snap
@@ -1,9 +1,9 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`Select (standalone) > snapshots > default with string items 1`] = `"<div><button type="button" data-placeholder="" tabindex="0" id="base-ui-_r_0_" role="combobox" aria-expanded="false" aria-haspopup="listbox" data-slot="select-trigger" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:flex astw:h-9 astw:w-full astw:items-center astw:justify-between astw:gap-2 astw:rounded-md astw:border astw:px-3 astw:py-2 astw:text-sm astw:shadow-xs astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:placeholder:text-muted-foreground astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0"><span data-placeholder="" data-slot="select-value">Pick a fruit</span><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4 astw:opacity-50" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button><input id="base-ui-_r_0_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div>"`;
+exports[`Select (standalone) > snapshots > default with string items 1`] = `"<div><button type="button" data-placeholder="" tabindex="0" id="base-ui-_r_0_" role="combobox" aria-expanded="false" aria-haspopup="listbox" data-slot="select-trigger" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:flex astw:h-9 astw:w-full astw:items-center astw:justify-between astw:gap-2 astw:rounded-md astw:border astw:px-3 astw:py-2 astw:text-sm astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:placeholder:text-muted-foreground astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0"><span data-placeholder="" data-slot="select-value">Pick a fruit</span><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4 astw:opacity-50" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button><input id="base-ui-_r_0_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div>"`;
 
-exports[`Select (standalone) > snapshots > disabled 1`] = `"<div><button type="button" data-disabled="" data-placeholder="" tabindex="-1" disabled="" id="base-ui-_r_3_" role="combobox" aria-expanded="false" aria-haspopup="listbox" data-slot="select-trigger" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:flex astw:h-9 astw:w-full astw:items-center astw:justify-between astw:gap-2 astw:rounded-md astw:border astw:px-3 astw:py-2 astw:text-sm astw:shadow-xs astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:placeholder:text-muted-foreground astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0"><span data-placeholder="" data-slot="select-value">Disabled</span><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4 astw:opacity-50" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button><input id="base-ui-_r_3_-hidden-input" disabled="" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div>"`;
+exports[`Select (standalone) > snapshots > disabled 1`] = `"<div><button type="button" data-disabled="" data-placeholder="" tabindex="-1" disabled="" id="base-ui-_r_3_" role="combobox" aria-expanded="false" aria-haspopup="listbox" data-slot="select-trigger" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:flex astw:h-9 astw:w-full astw:items-center astw:justify-between astw:gap-2 astw:rounded-md astw:border astw:px-3 astw:py-2 astw:text-sm astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:placeholder:text-muted-foreground astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0"><span data-placeholder="" data-slot="select-value">Disabled</span><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4 astw:opacity-50" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button><input id="base-ui-_r_3_-hidden-input" disabled="" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div>"`;
 
-exports[`Select (standalone) > snapshots > multiple mode 1`] = `"<div><button type="button" data-placeholder="" tabindex="0" id="base-ui-_r_9_" role="combobox" aria-expanded="false" aria-haspopup="listbox" data-slot="select-trigger" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:flex astw:h-9 astw:w-full astw:items-center astw:justify-between astw:gap-2 astw:rounded-md astw:border astw:px-3 astw:py-2 astw:text-sm astw:shadow-xs astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:placeholder:text-muted-foreground astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0"><span data-placeholder="" data-slot="select-value">Pick fruits</span><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4 astw:opacity-50" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button><input id="base-ui-_r_9_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div>"`;
+exports[`Select (standalone) > snapshots > multiple mode 1`] = `"<div><button type="button" data-placeholder="" tabindex="0" id="base-ui-_r_9_" role="combobox" aria-expanded="false" aria-haspopup="listbox" data-slot="select-trigger" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:flex astw:h-9 astw:w-full astw:items-center astw:justify-between astw:gap-2 astw:rounded-md astw:border astw:px-3 astw:py-2 astw:text-sm astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:placeholder:text-muted-foreground astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0"><span data-placeholder="" data-slot="select-value">Pick fruits</span><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4 astw:opacity-50" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button><input id="base-ui-_r_9_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div>"`;
 
-exports[`Select (standalone) > snapshots > with custom mapItem 1`] = `"<div><button type="button" data-placeholder="" tabindex="0" id="base-ui-_r_6_" role="combobox" aria-expanded="false" aria-haspopup="listbox" data-slot="select-trigger" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:flex astw:h-9 astw:w-full astw:items-center astw:justify-between astw:gap-2 astw:rounded-md astw:border astw:px-3 astw:py-2 astw:text-sm astw:shadow-xs astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:placeholder:text-muted-foreground astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0"><span data-placeholder="" data-slot="select-value">Pick</span><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4 astw:opacity-50" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button><input id="base-ui-_r_6_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div>"`;
+exports[`Select (standalone) > snapshots > with custom mapItem 1`] = `"<div><button type="button" data-placeholder="" tabindex="0" id="base-ui-_r_6_" role="combobox" aria-expanded="false" aria-haspopup="listbox" data-slot="select-trigger" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:flex astw:h-9 astw:w-full astw:items-center astw:justify-between astw:gap-2 astw:rounded-md astw:border astw:px-3 astw:py-2 astw:text-sm astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:placeholder:text-muted-foreground astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0"><span data-placeholder="" data-slot="select-value">Pick</span><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4 astw:opacity-50" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button><input id="base-ui-_r_6_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div>"`;
diff --git a/packages/core/__snapshots__/src__components__select__select.test.tsx.snap b/packages/core/__snapshots__/src__components__select__select.test.tsx.snap
index 2e3872057..1f515f07d 100644
--- a/packages/core/__snapshots__/src__components__select__select.test.tsx.snap
+++ b/packages/core/__snapshots__/src__components__select__select.test.tsx.snap
@@ -1,11 +1,11 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`Select > snapshots > closed select with placeholder 1`] = `"<button type="button" data-placeholder="" tabindex="0" id="base-ui-_r_0_" role="combobox" aria-expanded="false" aria-haspopup="listbox" data-slot="select-trigger" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:flex astw:h-9 astw:w-full astw:items-center astw:justify-between astw:gap-2 astw:rounded-md astw:border astw:px-3 astw:py-2 astw:text-sm astw:shadow-xs astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:placeholder:text-muted-foreground astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0"><span data-placeholder="" data-slot="select-value">Pick one</span><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4 astw:opacity-50" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button><input id="base-ui-_r_0_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value="">"`;
+exports[`Select > snapshots > closed select with placeholder 1`] = `"<button type="button" data-placeholder="" tabindex="0" id="base-ui-_r_0_" role="combobox" aria-expanded="false" aria-haspopup="listbox" data-slot="select-trigger" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:flex astw:h-9 astw:w-full astw:items-center astw:justify-between astw:gap-2 astw:rounded-md astw:border astw:px-3 astw:py-2 astw:text-sm astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:placeholder:text-muted-foreground astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0"><span data-placeholder="" data-slot="select-value">Pick one</span><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4 astw:opacity-50" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button><input id="base-ui-_r_0_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value="">"`;
 
-exports[`Select > snapshots > disabled item 1`] = `"<div data-base-ui-inert=""><button type="button" data-placeholder="" tabindex="0" id="base-ui-_r_g_" role="combobox" aria-expanded="true" aria-haspopup="listbox" data-slot="select-trigger" data-testid="trigger" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:flex astw:h-9 astw:w-full astw:items-center astw:justify-between astw:gap-2 astw:rounded-md astw:border astw:px-3 astw:py-2 astw:text-sm astw:shadow-xs astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:placeholder:text-muted-foreground astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0" data-popup-open="" data-pressed="" data-popup-side="bottom" aria-controls="base-ui-_r_g_-list"><span data-placeholder="" data-slot="select-value">Pick</span><span aria-hidden="true" data-popup-open=""><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4 astw:opacity-50" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button><span data-type="outside" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" aria-hidden="true" tabindex="0" data-base-ui-focus-guard=""></span><span aria-owns="_r_j_" style="clip-path: inset(50%); position: fixed; top: 0px; left: 0px;"></span><span data-type="outside" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" aria-hidden="true" tabindex="0" data-base-ui-focus-guard=""></span><input id="base-ui-_r_g_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div><div id="_r_j_" data-base-ui-portal="" style="position: relative; z-index: var(--z-popup);"><div role="presentation" data-base-ui-inert="" style="position: fixed; inset: 0; user-select: none; clip-path: polygon(0% 0%,100% 0%,100% 100%,0% 100%,0% 0%,0px 0px,0px 0px,0px 0px,0px 0px,0px 0px);"></div><div data-open="" data-side="bottom" data-align="center" role="presentation" style="position: absolute; --available-width: -10px; --available-height: -10px; --anchor-width: 0px; --anchor-height: 0px; --transform-origin: 0px 0px; left: 0px; top: 0px; transform: translate(0px, 0px);" data-anchor-hidden=""><span data-type="inside" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" aria-hidden="true" tabindex="0" data-base-ui-focus-guard=""></span><div data-open="" data-side="bottom" data-align="center" tabindex="-1" data-base-ui-focusable="" role="listbox" id="base-ui-_r_g_-list" style="height: 100%;" class="astw:bg-popover astw:text-popover-foreground astw:data-open:animate-in astw:data-ending-style:animate-out astw:data-ending-style:fade-out-0 astw:data-open:fade-in-0 astw:data-ending-style:zoom-out-95 astw:data-open:zoom-in-95 astw:z-(--z-popup) astw:w-[var(--anchor-width)] astw:min-w-32 astw:origin-(--transform-origin) astw:overflow-hidden astw:rounded-md astw:border astw:border-border astw:shadow-md" data-slot="select-content"><div role="option" aria-selected="false" tabindex="-1" data-slot="select-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:pr-8 astw:pl-2 astw:text-sm astw:outline-hidden astw:select-none astw:focus:bg-accent astw:focus:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50 astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0"><span class="astw:absolute astw:right-2 astw:flex astw:size-3.5 astw:items-center astw:justify-center"></span><div>Apple</div></div><div data-disabled="" role="option" aria-disabled="true" aria-selected="false" tabindex="-1" data-slot="select-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:pr-8 astw:pl-2 astw:text-sm astw:outline-hidden astw:select-none astw:focus:bg-accent astw:focus:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50 astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0"><span class="astw:absolute astw:right-2 astw:flex astw:size-3.5 astw:items-center astw:justify-center"></span><div>Banana</div></div></div><span data-type="inside" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" aria-hidden="true" tabindex="0" data-base-ui-focus-guard=""></span></div></div>"`;
+exports[`Select > snapshots > disabled item 1`] = `"<div data-base-ui-inert=""><button type="button" data-placeholder="" tabindex="0" id="base-ui-_r_g_" role="combobox" aria-expanded="true" aria-haspopup="listbox" data-slot="select-trigger" data-testid="trigger" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:flex astw:h-9 astw:w-full astw:items-center astw:justify-between astw:gap-2 astw:rounded-md astw:border astw:px-3 astw:py-2 astw:text-sm astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:placeholder:text-muted-foreground astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0" data-popup-open="" data-pressed="" data-popup-side="bottom" aria-controls="base-ui-_r_g_-list"><span data-placeholder="" data-slot="select-value">Pick</span><span aria-hidden="true" data-popup-open=""><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4 astw:opacity-50" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button><span data-type="outside" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" aria-hidden="true" tabindex="0" data-base-ui-focus-guard=""></span><span aria-owns="_r_j_" style="clip-path: inset(50%); position: fixed; top: 0px; left: 0px;"></span><span data-type="outside" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" aria-hidden="true" tabindex="0" data-base-ui-focus-guard=""></span><input id="base-ui-_r_g_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div><div id="_r_j_" data-base-ui-portal="" style="position: relative; z-index: var(--z-popup);"><div role="presentation" data-base-ui-inert="" style="position: fixed; inset: 0; user-select: none; clip-path: polygon(0% 0%,100% 0%,100% 100%,0% 100%,0% 0%,0px 0px,0px 0px,0px 0px,0px 0px,0px 0px);"></div><div data-open="" data-side="bottom" data-align="center" role="presentation" style="position: absolute; --available-width: -10px; --available-height: -10px; --anchor-width: 0px; --anchor-height: 0px; --transform-origin: 0px 0px; left: 0px; top: 0px; transform: translate(0px, 0px);" data-anchor-hidden=""><span data-type="inside" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" aria-hidden="true" tabindex="0" data-base-ui-focus-guard=""></span><div data-open="" data-side="bottom" data-align="center" tabindex="-1" data-base-ui-focusable="" role="listbox" id="base-ui-_r_g_-list" style="height: 100%;" class="astw:bg-popover astw:text-popover-foreground astw:data-open:animate-in astw:data-ending-style:animate-out astw:data-ending-style:fade-out-0 astw:data-open:fade-in-0 astw:data-ending-style:zoom-out-95 astw:data-open:zoom-in-95 astw:z-(--z-popup) astw:w-[var(--anchor-width)] astw:min-w-32 astw:origin-(--transform-origin) astw:overflow-hidden astw:rounded-md astw:border astw:border-border astw:shadow-md" data-slot="select-content"><div role="option" aria-selected="false" tabindex="-1" data-slot="select-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:pr-8 astw:pl-2 astw:text-sm astw:outline-hidden astw:select-none astw:focus:bg-accent astw:focus:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50 astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0"><span class="astw:absolute astw:right-2 astw:flex astw:size-3.5 astw:items-center astw:justify-center"></span><div>Apple</div></div><div data-disabled="" role="option" aria-disabled="true" aria-selected="false" tabindex="-1" data-slot="select-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:pr-8 astw:pl-2 astw:text-sm astw:outline-hidden astw:select-none astw:focus:bg-accent astw:focus:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50 astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0"><span class="astw:absolute astw:right-2 astw:flex astw:size-3.5 astw:items-center astw:justify-center"></span><div>Banana</div></div></div><span data-type="inside" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" aria-hidden="true" tabindex="0" data-base-ui-focus-guard=""></span></div></div>"`;
 
-exports[`Select > snapshots > disabled select 1`] = `"<button type="button" data-disabled="" data-placeholder="" tabindex="-1" disabled="" id="base-ui-_r_d_" role="combobox" aria-expanded="false" aria-haspopup="listbox" data-slot="select-trigger" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:flex astw:h-9 astw:w-full astw:items-center astw:justify-between astw:gap-2 astw:rounded-md astw:border astw:px-3 astw:py-2 astw:text-sm astw:shadow-xs astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:placeholder:text-muted-foreground astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0"><span data-placeholder="" data-slot="select-value">Disabled</span><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4 astw:opacity-50" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button><input id="base-ui-_r_d_-hidden-input" disabled="" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value="">"`;
+exports[`Select > snapshots > disabled select 1`] = `"<button type="button" data-disabled="" data-placeholder="" tabindex="-1" disabled="" id="base-ui-_r_d_" role="combobox" aria-expanded="false" aria-haspopup="listbox" data-slot="select-trigger" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:flex astw:h-9 astw:w-full astw:items-center astw:justify-between astw:gap-2 astw:rounded-md astw:border astw:px-3 astw:py-2 astw:text-sm astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:placeholder:text-muted-foreground astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0"><span data-placeholder="" data-slot="select-value">Disabled</span><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4 astw:opacity-50" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button><input id="base-ui-_r_d_-hidden-input" disabled="" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value="">"`;
 
-exports[`Select > snapshots > open select 1`] = `"<div data-base-ui-inert=""><button type="button" data-placeholder="" tabindex="0" id="base-ui-_r_3_" role="combobox" aria-expanded="true" aria-haspopup="listbox" data-slot="select-trigger" data-testid="trigger" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:flex astw:h-9 astw:w-full astw:items-center astw:justify-between astw:gap-2 astw:rounded-md astw:border astw:px-3 astw:py-2 astw:text-sm astw:shadow-xs astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:placeholder:text-muted-foreground astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0" data-popup-open="" data-pressed="" data-popup-side="bottom" aria-controls="base-ui-_r_3_-list"><span data-placeholder="" data-slot="select-value">Pick one</span><span aria-hidden="true" data-popup-open=""><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4 astw:opacity-50" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button><span data-type="outside" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" aria-hidden="true" tabindex="0" data-base-ui-focus-guard=""></span><span aria-owns="_r_6_" style="clip-path: inset(50%); position: fixed; top: 0px; left: 0px;"></span><span data-type="outside" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" aria-hidden="true" tabindex="0" data-base-ui-focus-guard=""></span><input id="base-ui-_r_3_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div><div id="_r_6_" data-base-ui-portal="" style="position: relative; z-index: var(--z-popup);"><div role="presentation" data-base-ui-inert="" style="position: fixed; inset: 0; user-select: none; clip-path: polygon(0% 0%,100% 0%,100% 100%,0% 100%,0% 0%,0px 0px,0px 0px,0px 0px,0px 0px,0px 0px);"></div><div data-open="" data-side="bottom" data-align="center" role="presentation" style="position: absolute; --available-width: -10px; --available-height: -10px; --anchor-width: 0px; --anchor-height: 0px; --transform-origin: 0px 0px; left: 0px; top: 0px; transform: translate(0px, 0px);" data-anchor-hidden=""><span data-type="inside" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" aria-hidden="true" tabindex="0" data-base-ui-focus-guard=""></span><div data-open="" data-side="bottom" data-align="center" tabindex="-1" data-base-ui-focusable="" role="listbox" id="base-ui-_r_3_-list" style="height: 100%;" class="astw:bg-popover astw:text-popover-foreground astw:data-open:animate-in astw:data-ending-style:animate-out astw:data-ending-style:fade-out-0 astw:data-open:fade-in-0 astw:data-ending-style:zoom-out-95 astw:data-open:zoom-in-95 astw:z-(--z-popup) astw:w-[var(--anchor-width)] astw:min-w-32 astw:origin-(--transform-origin) astw:overflow-hidden astw:rounded-md astw:border astw:border-border astw:shadow-md" data-slot="select-content"><div role="option" aria-selected="false" tabindex="-1" data-slot="select-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:pr-8 astw:pl-2 astw:text-sm astw:outline-hidden astw:select-none astw:focus:bg-accent astw:focus:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50 astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0"><span class="astw:absolute astw:right-2 astw:flex astw:size-3.5 astw:items-center astw:justify-center"></span><div>Apple</div></div><div role="option" aria-selected="false" tabindex="-1" data-slot="select-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:pr-8 astw:pl-2 astw:text-sm astw:outline-hidden astw:select-none astw:focus:bg-accent astw:focus:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50 astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0"><span class="astw:absolute astw:right-2 astw:flex astw:size-3.5 astw:items-center astw:justify-center"></span><div>Banana</div></div></div><span data-type="inside" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" aria-hidden="true" tabindex="0" data-base-ui-focus-guard=""></span></div></div>"`;
+exports[`Select > snapshots > open select 1`] = `"<div data-base-ui-inert=""><button type="button" data-placeholder="" tabindex="0" id="base-ui-_r_3_" role="combobox" aria-expanded="true" aria-haspopup="listbox" data-slot="select-trigger" data-testid="trigger" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:flex astw:h-9 astw:w-full astw:items-center astw:justify-between astw:gap-2 astw:rounded-md astw:border astw:px-3 astw:py-2 astw:text-sm astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:placeholder:text-muted-foreground astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0" data-popup-open="" data-pressed="" data-popup-side="bottom" aria-controls="base-ui-_r_3_-list"><span data-placeholder="" data-slot="select-value">Pick one</span><span aria-hidden="true" data-popup-open=""><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4 astw:opacity-50" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button><span data-type="outside" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" aria-hidden="true" tabindex="0" data-base-ui-focus-guard=""></span><span aria-owns="_r_6_" style="clip-path: inset(50%); position: fixed; top: 0px; left: 0px;"></span><span data-type="outside" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" aria-hidden="true" tabindex="0" data-base-ui-focus-guard=""></span><input id="base-ui-_r_3_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div><div id="_r_6_" data-base-ui-portal="" style="position: relative; z-index: var(--z-popup);"><div role="presentation" data-base-ui-inert="" style="position: fixed; inset: 0; user-select: none; clip-path: polygon(0% 0%,100% 0%,100% 100%,0% 100%,0% 0%,0px 0px,0px 0px,0px 0px,0px 0px,0px 0px);"></div><div data-open="" data-side="bottom" data-align="center" role="presentation" style="position: absolute; --available-width: -10px; --available-height: -10px; --anchor-width: 0px; --anchor-height: 0px; --transform-origin: 0px 0px; left: 0px; top: 0px; transform: translate(0px, 0px);" data-anchor-hidden=""><span data-type="inside" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" aria-hidden="true" tabindex="0" data-base-ui-focus-guard=""></span><div data-open="" data-side="bottom" data-align="center" tabindex="-1" data-base-ui-focusable="" role="listbox" id="base-ui-_r_3_-list" style="height: 100%;" class="astw:bg-popover astw:text-popover-foreground astw:data-open:animate-in astw:data-ending-style:animate-out astw:data-ending-style:fade-out-0 astw:data-open:fade-in-0 astw:data-ending-style:zoom-out-95 astw:data-open:zoom-in-95 astw:z-(--z-popup) astw:w-[var(--anchor-width)] astw:min-w-32 astw:origin-(--transform-origin) astw:overflow-hidden astw:rounded-md astw:border astw:border-border astw:shadow-md" data-slot="select-content"><div role="option" aria-selected="false" tabindex="-1" data-slot="select-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:pr-8 astw:pl-2 astw:text-sm astw:outline-hidden astw:select-none astw:focus:bg-accent astw:focus:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50 astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0"><span class="astw:absolute astw:right-2 astw:flex astw:size-3.5 astw:items-center astw:justify-center"></span><div>Apple</div></div><div role="option" aria-selected="false" tabindex="-1" data-slot="select-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:pr-8 astw:pl-2 astw:text-sm astw:outline-hidden astw:select-none astw:focus:bg-accent astw:focus:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50 astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0"><span class="astw:absolute astw:right-2 astw:flex astw:size-3.5 astw:items-center astw:justify-center"></span><div>Banana</div></div></div><span data-type="inside" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" aria-hidden="true" tabindex="0" data-base-ui-focus-guard=""></span></div></div>"`;
 
-exports[`Select > snapshots > with groups and separator 1`] = `"<div data-base-ui-inert=""><button type="button" data-placeholder="" tabindex="0" id="base-ui-_r_7_" role="combobox" aria-expanded="true" aria-haspopup="listbox" data-slot="select-trigger" data-testid="trigger" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:flex astw:h-9 astw:w-full astw:items-center astw:justify-between astw:gap-2 astw:rounded-md astw:border astw:px-3 astw:py-2 astw:text-sm astw:shadow-xs astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:placeholder:text-muted-foreground astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0" data-popup-open="" data-pressed="" data-popup-side="bottom" aria-controls="base-ui-_r_7_-list"><span data-placeholder="" data-slot="select-value">Pick</span><span aria-hidden="true" data-popup-open=""><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4 astw:opacity-50" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button><span data-type="outside" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" aria-hidden="true" tabindex="0" data-base-ui-focus-guard=""></span><span aria-owns="_r_a_" style="clip-path: inset(50%); position: fixed; top: 0px; left: 0px;"></span><span data-type="outside" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" aria-hidden="true" tabindex="0" data-base-ui-focus-guard=""></span><input id="base-ui-_r_7_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div><div id="_r_a_" data-base-ui-portal="" style="position: relative; z-index: var(--z-popup);"><div role="presentation" data-base-ui-inert="" style="position: fixed; inset: 0; user-select: none; clip-path: polygon(0% 0%,100% 0%,100% 100%,0% 100%,0% 0%,0px 0px,0px 0px,0px 0px,0px 0px,0px 0px);"></div><div data-open="" data-side="bottom" data-align="center" role="presentation" style="position: absolute; --available-width: -10px; --available-height: -10px; --anchor-width: 0px; --anchor-height: 0px; --transform-origin: 0px 0px; left: 0px; top: 0px; transform: translate(0px, 0px);" data-anchor-hidden=""><span data-type="inside" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" aria-hidden="true" tabindex="0" data-base-ui-focus-guard=""></span><div data-open="" data-side="bottom" data-align="center" tabindex="-1" data-base-ui-focusable="" role="listbox" id="base-ui-_r_7_-list" style="height: 100%;" class="astw:bg-popover astw:text-popover-foreground astw:data-open:animate-in astw:data-ending-style:animate-out astw:data-ending-style:fade-out-0 astw:data-open:fade-in-0 astw:data-ending-style:zoom-out-95 astw:data-open:zoom-in-95 astw:z-(--z-popup) astw:w-[var(--anchor-width)] astw:min-w-32 astw:origin-(--transform-origin) astw:overflow-hidden astw:rounded-md astw:border astw:border-border astw:shadow-md" data-slot="select-content"><div role="group" data-slot="select-group" aria-labelledby="base-ui-_r_b_"><div id="base-ui-_r_b_" aria-hidden="true" data-slot="select-group-label" class="astw:text-muted-foreground astw:px-2 astw:py-1.5 astw:text-xs astw:font-medium">Fruits</div><div role="option" aria-selected="false" tabindex="-1" data-slot="select-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:pr-8 astw:pl-2 astw:text-sm astw:outline-hidden astw:select-none astw:focus:bg-accent astw:focus:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50 astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0"><span class="astw:absolute astw:right-2 astw:flex astw:size-3.5 astw:items-center astw:justify-center"></span><div>Apple</div></div></div><div data-slot="select-separator" class="astw:bg-muted astw:-mx-1 astw:my-1 astw:h-px"></div><div role="group" data-slot="select-group" aria-labelledby="base-ui-_r_c_"><div id="base-ui-_r_c_" aria-hidden="true" data-slot="select-group-label" class="astw:text-muted-foreground astw:px-2 astw:py-1.5 astw:text-xs astw:font-medium">Vegetables</div><div role="option" aria-selected="false" tabindex="-1" data-slot="select-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:pr-8 astw:pl-2 astw:text-sm astw:outline-hidden astw:select-none astw:focus:bg-accent astw:focus:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50 astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0"><span class="astw:absolute astw:right-2 astw:flex astw:size-3.5 astw:items-center astw:justify-center"></span><div>Carrot</div></div></div></div><span data-type="inside" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" aria-hidden="true" tabindex="0" data-base-ui-focus-guard=""></span></div></div>"`;
+exports[`Select > snapshots > with groups and separator 1`] = `"<div data-base-ui-inert=""><button type="button" data-placeholder="" tabindex="0" id="base-ui-_r_7_" role="combobox" aria-expanded="true" aria-haspopup="listbox" data-slot="select-trigger" data-testid="trigger" class="astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:flex astw:h-9 astw:w-full astw:items-center astw:justify-between astw:gap-2 astw:rounded-md astw:border astw:px-3 astw:py-2 astw:text-sm astw:outline-none astw:transition-colors astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:placeholder:text-muted-foreground astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0" data-popup-open="" data-pressed="" data-popup-side="bottom" aria-controls="base-ui-_r_7_-list"><span data-placeholder="" data-slot="select-value">Pick</span><span aria-hidden="true" data-popup-open=""><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down astw:size-4 astw:opacity-50" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></span></button><span data-type="outside" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" aria-hidden="true" tabindex="0" data-base-ui-focus-guard=""></span><span aria-owns="_r_a_" style="clip-path: inset(50%); position: fixed; top: 0px; left: 0px;"></span><span data-type="outside" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" aria-hidden="true" tabindex="0" data-base-ui-focus-guard=""></span><input id="base-ui-_r_7_-hidden-input" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" tabindex="-1" aria-hidden="true" value=""></div><div id="_r_a_" data-base-ui-portal="" style="position: relative; z-index: var(--z-popup);"><div role="presentation" data-base-ui-inert="" style="position: fixed; inset: 0; user-select: none; clip-path: polygon(0% 0%,100% 0%,100% 100%,0% 100%,0% 0%,0px 0px,0px 0px,0px 0px,0px 0px,0px 0px);"></div><div data-open="" data-side="bottom" data-align="center" role="presentation" style="position: absolute; --available-width: -10px; --available-height: -10px; --anchor-width: 0px; --anchor-height: 0px; --transform-origin: 0px 0px; left: 0px; top: 0px; transform: translate(0px, 0px);" data-anchor-hidden=""><span data-type="inside" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" aria-hidden="true" tabindex="0" data-base-ui-focus-guard=""></span><div data-open="" data-side="bottom" data-align="center" tabindex="-1" data-base-ui-focusable="" role="listbox" id="base-ui-_r_7_-list" style="height: 100%;" class="astw:bg-popover astw:text-popover-foreground astw:data-open:animate-in astw:data-ending-style:animate-out astw:data-ending-style:fade-out-0 astw:data-open:fade-in-0 astw:data-ending-style:zoom-out-95 astw:data-open:zoom-in-95 astw:z-(--z-popup) astw:w-[var(--anchor-width)] astw:min-w-32 astw:origin-(--transform-origin) astw:overflow-hidden astw:rounded-md astw:border astw:border-border astw:shadow-md" data-slot="select-content"><div role="group" data-slot="select-group" aria-labelledby="base-ui-_r_b_"><div id="base-ui-_r_b_" aria-hidden="true" data-slot="select-group-label" class="astw:text-muted-foreground astw:px-2 astw:py-1.5 astw:text-xs astw:font-medium">Fruits</div><div role="option" aria-selected="false" tabindex="-1" data-slot="select-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:pr-8 astw:pl-2 astw:text-sm astw:outline-hidden astw:select-none astw:focus:bg-accent astw:focus:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50 astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0"><span class="astw:absolute astw:right-2 astw:flex astw:size-3.5 astw:items-center astw:justify-center"></span><div>Apple</div></div></div><div data-slot="select-separator" class="astw:bg-muted astw:-mx-1 astw:my-1 astw:h-px"></div><div role="group" data-slot="select-group" aria-labelledby="base-ui-_r_c_"><div id="base-ui-_r_c_" aria-hidden="true" data-slot="select-group-label" class="astw:text-muted-foreground astw:px-2 astw:py-1.5 astw:text-xs astw:font-medium">Vegetables</div><div role="option" aria-selected="false" tabindex="-1" data-slot="select-item" class="astw:relative astw:flex astw:w-full astw:cursor-default astw:items-center astw:gap-2 astw:rounded-sm astw:py-1.5 astw:pr-8 astw:pl-2 astw:text-sm astw:outline-hidden astw:select-none astw:focus:bg-accent astw:focus:text-accent-foreground astw:data-disabled:pointer-events-none astw:data-disabled:opacity-50 astw:[&amp;_svg]:pointer-events-none astw:[&amp;_svg:not([class*='size-'])]:size-4 astw:[&amp;_svg]:shrink-0"><span class="astw:absolute astw:right-2 astw:flex astw:size-3.5 astw:items-center astw:justify-center"></span><div>Carrot</div></div></div></div><span data-type="inside" style="clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px; position: fixed; top: 0px; left: 0px;" aria-hidden="true" tabindex="0" data-base-ui-focus-guard=""></span></div></div>"`;
diff --git a/packages/core/__snapshots__/src__components__textarea__textarea.test.tsx.snap b/packages/core/__snapshots__/src__components__textarea__textarea.test.tsx.snap
index 47cb882d8..5f28aadd3 100644
--- a/packages/core/__snapshots__/src__components__textarea__textarea.test.tsx.snap
+++ b/packages/core/__snapshots__/src__components__textarea__textarea.test.tsx.snap
@@ -1,9 +1,9 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`Textarea > snapshots > default 1`] = `"<textarea id="base-ui-_r_0_" data-slot="textarea" placeholder="Add a note" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:shadow-xs astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:min-h-16 astw:py-2 astw:resize-y astw:data-invalid:border-destructive astw:data-invalid:ring-destructive/20 astw:dark:data-invalid:ring-destructive/40 astw:aria-invalid:border-destructive astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40"></textarea>"`;
+exports[`Textarea > snapshots > default 1`] = `"<textarea id="base-ui-_r_0_" data-slot="textarea" placeholder="Add a note" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:min-h-16 astw:py-2 astw:resize-y astw:data-invalid:border-destructive astw:data-invalid:ring-destructive/20 astw:dark:data-invalid:ring-destructive/40 astw:aria-invalid:border-destructive astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40"></textarea>"`;
 
-exports[`Textarea > snapshots > disabled 1`] = `"<textarea data-disabled="" id="base-ui-_r_2_" disabled="" data-slot="textarea" placeholder="Disabled" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:shadow-xs astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:min-h-16 astw:py-2 astw:resize-y astw:data-invalid:border-destructive astw:data-invalid:ring-destructive/20 astw:dark:data-invalid:ring-destructive/40 astw:aria-invalid:border-destructive astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40"></textarea>"`;
+exports[`Textarea > snapshots > disabled 1`] = `"<textarea data-disabled="" id="base-ui-_r_2_" disabled="" data-slot="textarea" placeholder="Disabled" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:min-h-16 astw:py-2 astw:resize-y astw:data-invalid:border-destructive astw:data-invalid:ring-destructive/20 astw:dark:data-invalid:ring-destructive/40 astw:aria-invalid:border-destructive astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40"></textarea>"`;
 
-exports[`Textarea > snapshots > with custom className 1`] = `"<textarea id="base-ui-_r_3_" data-slot="textarea" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:shadow-xs astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:min-h-16 astw:py-2 astw:resize-y astw:data-invalid:border-destructive astw:data-invalid:ring-destructive/20 astw:dark:data-invalid:ring-destructive/40 astw:aria-invalid:border-destructive astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40 custom-class"></textarea>"`;
+exports[`Textarea > snapshots > with custom className 1`] = `"<textarea id="base-ui-_r_3_" data-slot="textarea" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:min-h-16 astw:py-2 astw:resize-y astw:data-invalid:border-destructive astw:data-invalid:ring-destructive/20 astw:dark:data-invalid:ring-destructive/40 astw:aria-invalid:border-destructive astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40 custom-class"></textarea>"`;
 
-exports[`Textarea > snapshots > with rows 1`] = `"<textarea id="base-ui-_r_1_" data-slot="textarea" rows="6" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:shadow-xs astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:min-h-16 astw:py-2 astw:resize-y astw:data-invalid:border-destructive astw:data-invalid:ring-destructive/20 astw:dark:data-invalid:ring-destructive/40 astw:aria-invalid:border-destructive astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40"></textarea>"`;
+exports[`Textarea > snapshots > with rows 1`] = `"<textarea id="base-ui-_r_1_" data-slot="textarea" rows="6" class="astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:outline-none astw:md:text-sm astw:dark:bg-input/30 astw:transition-[color,box-shadow] astw:selection:bg-primary astw:selection:text-primary-foreground astw:placeholder:text-muted-foreground astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px] astw:disabled:pointer-events-none astw:disabled:cursor-not-allowed astw:disabled:opacity-50 astw:min-h-16 astw:py-2 astw:resize-y astw:data-invalid:border-destructive astw:data-invalid:ring-destructive/20 astw:dark:data-invalid:ring-destructive/40 astw:aria-invalid:border-destructive astw:aria-invalid:ring-destructive/20 astw:dark:aria-invalid:ring-destructive/40"></textarea>"`;
diff --git a/packages/core/src/components/autocomplete/autocomplete.tsx b/packages/core/src/components/autocomplete/autocomplete.tsx
index 4608d3346..855c6ba0d 100644
--- a/packages/core/src/components/autocomplete/autocomplete.tsx
+++ b/packages/core/src/components/autocomplete/autocomplete.tsx
@@ -55,7 +55,7 @@ function AutocompleteInput({
     <BaseAutocomplete.Input
       data-slot="autocomplete-input"
       className={cn(
-        "astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:shadow-xs astw:outline-none astw:transition-colors",
+        "astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:outline-none astw:transition-colors",
         "astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px]",
         "astw:disabled:cursor-not-allowed astw:disabled:opacity-50",
         className,
diff --git a/packages/core/src/components/button/button.tsx b/packages/core/src/components/button/button.tsx
index a99167cb7..f1c97efdc 100644
--- a/packages/core/src/components/button/button.tsx
+++ b/packages/core/src/components/button/button.tsx
@@ -17,8 +17,7 @@ const buttonVariants = cva(
           "astw:bg-destructive astw:text-white astw:shadow-xs astw:hover:bg-destructive/90 astw:focus-visible:ring-destructive/20 astw:dark:focus-visible:ring-destructive/40 astw:dark:bg-destructive/60",
         outline:
           "astw:border astw:border-border astw:bg-background astw:shadow-xs astw:hover:bg-accent astw:hover:text-accent-foreground astw:dark:bg-input/30 astw:dark:border-input astw:dark:hover:bg-input/50",
-        secondary:
-          "astw:bg-secondary astw:text-secondary-foreground astw:shadow-xs astw:hover:bg-secondary/80",
+        secondary: "astw:bg-secondary astw:text-secondary-foreground astw:hover:bg-secondary/80",
         ghost:
           "astw:hover:bg-accent astw:hover:text-accent-foreground astw:dark:hover:bg-accent/50",
         link: "astw:text-primary astw:underline-offset-4 astw:hover:underline",
diff --git a/packages/core/src/components/combobox/combobox.tsx b/packages/core/src/components/combobox/combobox.tsx
index cffc6edb5..479cb8208 100644
--- a/packages/core/src/components/combobox/combobox.tsx
+++ b/packages/core/src/components/combobox/combobox.tsx
@@ -57,7 +57,7 @@ function ComboboxInput({
       ref={mergeRefs(ref, forwardedRef)}
       data-slot="combobox-input"
       className={cn(
-        "astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:shadow-xs astw:outline-none astw:transition-colors",
+        "astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:placeholder:text-muted-foreground astw:flex astw:h-9 astw:w-full astw:rounded-md astw:border astw:px-3 astw:py-1 astw:text-sm astw:outline-none astw:transition-colors",
         "astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px]",
         "astw:disabled:cursor-not-allowed astw:disabled:opacity-50",
         className,
@@ -244,7 +244,7 @@ function ComboboxChips({ className, ...props }: React.ComponentProps<typeof Base
     <BaseCombobox.Chips
       data-slot="combobox-chips"
       className={cn(
-        "astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:flex astw:min-h-9 astw:w-full astw:flex-wrap astw:items-center astw:gap-1 astw:rounded-md astw:border astw:px-1.5 astw:py-1 astw:text-sm astw:shadow-xs",
+        "astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:flex astw:min-h-9 astw:w-full astw:flex-wrap astw:items-center astw:gap-1 astw:rounded-md astw:border astw:px-1.5 astw:py-1 astw:text-sm",
         "astw:focus-within:border-ring astw:focus-within:ring-ring/50 astw:focus-within:ring-[3px]",
         // Strip standalone styles from nested Input
         "astw:[&_[data-slot=combobox-input]]:border-0 astw:[&_[data-slot=combobox-input]]:bg-transparent astw:[&_[data-slot=combobox-input]]:shadow-none astw:[&_[data-slot=combobox-input]]:ring-0",
diff --git a/packages/core/src/components/select/select.tsx b/packages/core/src/components/select/select.tsx
index 8d2780c9a..b1b84c3cc 100644
--- a/packages/core/src/components/select/select.tsx
+++ b/packages/core/src/components/select/select.tsx
@@ -59,7 +59,7 @@ function SelectTrigger({
       ref={mergeRefs(ref, forwardedRef)}
       data-slot="select-trigger"
       className={cn(
-        "astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:flex astw:h-9 astw:w-full astw:items-center astw:justify-between astw:gap-2 astw:rounded-md astw:border astw:px-3 astw:py-2 astw:text-sm astw:shadow-xs astw:outline-none astw:transition-colors",
+        "astw:border-input astw:bg-transparent astw:dark:bg-input/30 astw:text-foreground astw:flex astw:h-9 astw:w-full astw:items-center astw:justify-between astw:gap-2 astw:rounded-md astw:border astw:px-3 astw:py-2 astw:text-sm astw:outline-none astw:transition-colors",
         "astw:focus-visible:border-ring astw:focus-visible:ring-ring/50 astw:focus-visible:ring-[3px]",
         "astw:disabled:cursor-not-allowed astw:disabled:opacity-50",
         "astw:placeholder:text-muted-foreground",
diff --git a/packages/core/src/lib/input-classes.ts b/packages/core/src/lib/input-classes.ts
index 555f374ba..d89e40dbd 100644
--- a/packages/core/src/lib/input-classes.ts
+++ b/packages/core/src/lib/input-classes.ts
@@ -11,7 +11,7 @@
  * utilities).
  */
 const controlBaseClasses = [
-  "astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:shadow-xs astw:outline-none astw:md:text-sm",
+  "astw:border-input astw:flex astw:w-full astw:min-w-0 astw:rounded-md astw:border astw:bg-transparent astw:px-3 astw:text-base astw:outline-none astw:md:text-sm",
   "astw:dark:bg-input/30 astw:transition-[color,box-shadow]",
   "astw:selection:bg-primary astw:selection:text-primary-foreground",
   "astw:placeholder:text-muted-foreground",