@stll/ui 0.34.5 → 0.34.6

package/dist/components/application-rail.js

@@ -32,7 +32,7 @@ const ApplicationRailMenu = ({ className, ...props }) => /* @__PURE__ */ jsx("di
 	...props
 });
 const ApplicationRailButton = ({ className, ...props }) => /* @__PURE__ */ jsx("button", {
-	className: cn("text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground flex shrink-0 items-center justify-center rounded-md outline-hidden transition-colors focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-50", APPLICATION_RAIL_BUTTON_SIZE, className),
+	className: cn("text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground flex shrink-0 items-center justify-center rounded-md outline-hidden focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-50", APPLICATION_RAIL_BUTTON_SIZE, className),
 	"data-slot": "application-rail-button",
 	type: "button",
 	...props

package/dist/components/breadcrumb.js

@@ -23,7 +23,7 @@ const BreadcrumbItem = ({ className, ...props }) => /* @__PURE__ */ jsx("li", {
 });
 function BreadcrumbLink({ className, render, ...props }) {
 	const defaultProps = {
-		className: cn("hover:text-foreground transition-colors", className),
+		className: cn("hover:text-foreground", className),
 		"data-slot": "breadcrumb-link"
 	};
 	return useRender({

package/dist/components/button.d.ts

@@ -13,7 +13,7 @@ import { VariantProps } from "class-variance-authority";
  */
 declare const buttonAccessibleDisabledClass = "cursor-not-allowed opacity-64";
 declare const buttonVariants: (props?: ({
-  size?: "default" | "sm" | "lg" | "row" | "chip" | "icon" | "icon-lg" | "icon-sm" | "icon-xl" | "icon-xs" | "xl" | "xs" | null | undefined;
+  size?: "default" | "chip" | "icon" | "icon-lg" | "icon-sm" | "icon-xl" | "icon-xs" | "lg" | "row" | "sm" | "xl" | "xs" | null | undefined;
   variant?: "link" | "default" | "destructive" | "destructive-outline" | "destructive-ghost" | "ghost" | "muted" | "outline" | "secondary" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 type ButtonProps = {

package/dist/components/button.js

@@ -19,7 +19,7 @@ import { cva } from "class-variance-authority";
 * swaps the cursor so the control still reads as unavailable on hover.
 */
 const buttonAccessibleDisabledClass = "cursor-not-allowed opacity-64";
-const buttonVariants = cva("focus-visible:ring-ring focus-visible:ring-offset-background relative inline-flex shrink-0 cursor-pointer items-center justify-center gap-2 rounded-lg border text-base font-medium whitespace-nowrap transition-shadow outline-none before:pointer-events-none before:absolute before:inset-0 before:rounded-[calc(var(--radius-lg)-1px)] focus-visible:ring-2 focus-visible:ring-offset-1 disabled:pointer-events-none disabled:opacity-64 sm:text-sm pointer-coarse:after:absolute pointer-coarse:after:size-full pointer-coarse:after:min-h-11 pointer-coarse:after:min-w-11 [&_svg]:pointer-events-none [&_svg]:-mx-0.5 [&_svg]:shrink-0 [&_svg:not([class*='opacity-'])]:opacity-80 [&_svg:not([class*='size-'])]:size-4.5 sm:[&_svg:not([class*='size-'])]:size-4", {
+const buttonVariants = cva("focus-visible:ring-ring focus-visible:ring-offset-background relative inline-flex shrink-0 cursor-pointer items-center justify-center gap-2 rounded-lg border text-base font-medium whitespace-nowrap outline-none before:pointer-events-none before:absolute before:inset-0 before:rounded-[calc(var(--radius-lg)-1px)] focus-visible:ring-2 focus-visible:ring-offset-1 disabled:pointer-events-none disabled:opacity-64 sm:text-sm pointer-coarse:after:absolute pointer-coarse:after:size-full pointer-coarse:after:min-h-11 pointer-coarse:after:min-w-11 [&_svg]:pointer-events-none [&_svg]:-mx-0.5 [&_svg]:shrink-0 [&_svg:not([class*='opacity-'])]:opacity-80 [&_svg:not([class*='size-'])]:size-4.5 sm:[&_svg:not([class*='size-'])]:size-4", {
 	defaultVariants: {
 		size: "default",
 		variant: "default"

package/dist/components/checkbox.js

@@ -4,7 +4,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { Checkbox as Checkbox$1 } from "@base-ui/react/checkbox";
 //#region src/components/checkbox.tsx
 const Checkbox = ({ className, ...props }) => /* @__PURE__ */ jsx(Checkbox$1.Root, {
-	className: cn("border-input bg-background ring-ring focus-visible:ring-offset-background aria-invalid:border-destructive/36 focus-visible:aria-invalid:border-destructive/64 focus-visible:aria-invalid:ring-destructive/48 dark:not-data-checked:bg-input/32 dark:aria-invalid:ring-destructive/24 relative inline-flex size-4.5 shrink-0 items-center justify-center rounded-[4px] border shadow-xs/5 transition-shadow outline-none not-dark:bg-clip-padding before:pointer-events-none before:absolute before:inset-0 before:rounded-[3px] not-data-disabled:not-data-checked:not-aria-invalid:before:shadow-[0_1px_--theme(--color-black/4%)] focus-visible:ring-2 focus-visible:ring-offset-1 data-disabled:opacity-64 sm:size-4 dark:not-data-disabled:not-data-checked:not-aria-invalid:before:shadow-[0_-1px_--theme(--color-white/6%)] [[data-disabled],[data-checked],[aria-invalid]]:shadow-none", className),
+	className: cn("border-input bg-background ring-ring focus-visible:ring-offset-background aria-invalid:border-destructive/36 focus-visible:aria-invalid:border-destructive/64 focus-visible:aria-invalid:ring-destructive/48 dark:not-data-checked:bg-input/32 dark:aria-invalid:ring-destructive/24 relative inline-flex size-4.5 shrink-0 items-center justify-center rounded-[4px] border shadow-xs/5 outline-none not-dark:bg-clip-padding before:pointer-events-none before:absolute before:inset-0 before:rounded-[3px] not-data-disabled:not-data-checked:not-aria-invalid:before:shadow-[0_1px_--theme(--color-black/4%)] focus-visible:ring-2 focus-visible:ring-offset-1 data-disabled:opacity-64 sm:size-4 dark:not-data-disabled:not-data-checked:not-aria-invalid:before:shadow-[0_-1px_--theme(--color-white/6%)] [[data-disabled],[data-checked],[aria-invalid]]:shadow-none", className),
 	"data-slot": "checkbox",
 	...props,
 	children: /* @__PURE__ */ jsx(Checkbox$1.Indicator, {

package/dist/components/color-picker.js

@@ -125,7 +125,7 @@ const ColorSwatch = ({ cssColor, selected, label, isLight, onClick, presentation
 	const swatch = /* @__PURE__ */ jsx("button", {
 		"aria-label": label,
 		"aria-pressed": selected,
-		className: cn(presentation === "inline" ? "ring-offset-popover relative grid size-11 shrink-0 place-items-center rounded-full border ring-offset-2 transition-transform outline-none hover:scale-105 focus-visible:ring-2" : "hover:border-foreground relative flex size-6 items-center justify-center rounded-md border transition-[transform,border-color] hover:scale-115 sm:size-5", selectionClassName, isLight && !selected && "border-border"),
+		className: cn(presentation === "inline" ? "ring-offset-popover relative grid size-11 shrink-0 place-items-center rounded-full border ring-offset-2 transition-transform outline-none hover:scale-105 focus-visible:ring-2" : "hover:border-foreground relative flex size-6 items-center justify-center rounded-md border transition-transform hover:scale-115 sm:size-5", selectionClassName, isLight && !selected && "border-border"),
 		onClick,
 		style: { backgroundColor: cssColor },
 		type: "button",
@@ -248,7 +248,7 @@ const ColorPickerContent = ({ value, onSelect, onClear, presets, columns, defaul
 			onClear && /* @__PURE__ */ jsxs(Popover.Close, {
 				render: /* @__PURE__ */ jsx("button", {
 					"aria-label": "No color",
-					className: "text-muted-foreground hover:bg-accent hover:text-accent-foreground text-2xs flex h-6 w-full items-center gap-1.5 rounded px-1 transition-colors",
+					className: "text-muted-foreground hover:bg-accent hover:text-accent-foreground text-2xs flex h-6 w-full items-center gap-1.5 rounded px-1",
 					onClick: onClear,
 					type: "button"
 				}),
@@ -271,7 +271,7 @@ const ColorPickerContent = ({ value, onSelect, onClear, presets, columns, defaul
 				}, preset.value))
 			}),
 			!expanded ? /* @__PURE__ */ jsxs("button", {
-				className: "text-muted-foreground hover:text-foreground text-2xs flex items-center justify-center gap-1 py-0.5 transition-colors",
+				className: "text-muted-foreground hover:text-foreground text-2xs flex items-center justify-center gap-1 py-0.5",
 				onClick: () => setExpanded(true),
 				type: "button",
 				children: [moreLabel, /* @__PURE__ */ jsx(ChevronDownIcon, { className: "size-3" })]

package/dist/components/combobox.js

@@ -198,7 +198,7 @@ const ComboboxCollection = (props) => /* @__PURE__ */ jsx(Combobox$1.Collection,
 const ComboboxChips = ({ className, children, startAddon, ...props }) => {
 	const { chipsRef } = React$1.use(ComboboxContext);
 	return /* @__PURE__ */ jsxs(Combobox$1.Chips, {
-		className: cn("border-input bg-background ring-ring/24 focus-within:border-ring has-autofill:bg-foreground/4 has-aria-invalid:border-destructive/36 focus-within:has-aria-invalid:border-destructive/64 focus-within:has-aria-invalid:ring-destructive/16 dark:not-has-disabled:bg-input/32 dark:has-autofill:bg-foreground/8 dark:has-aria-invalid:ring-destructive/24 relative inline-flex min-h-9 w-full flex-wrap gap-1 rounded-lg border p-[calc(--spacing(1)-1px)] text-base shadow-xs/5 transition-shadow outline-none *:min-h-7 not-dark:bg-clip-padding before:pointer-events-none before:absolute before:inset-0 before:rounded-[calc(var(--radius-lg)-1px)] not-has-disabled:not-focus-within:not-aria-invalid:before:shadow-[0_1px_--theme(--color-black/4%)] focus-within:ring-[3px] has-disabled:pointer-events-none has-disabled:opacity-64 has-data-[size=lg]:min-h-10 has-data-[size=lg]:*:min-h-8 has-data-[size=sm]:min-h-8 has-data-[size=sm]:*:min-h-6 has-[:disabled,:focus-within,[aria-invalid]]:shadow-none sm:min-h-8 sm:text-sm sm:*:min-h-6 sm:has-data-[size=lg]:min-h-9 sm:has-data-[size=lg]:*:min-h-7 sm:has-data-[size=sm]:min-h-7 sm:has-data-[size=sm]:*:min-h-5 dark:not-has-disabled:not-focus-within:not-aria-invalid:before:shadow-[0_-1px_--theme(--color-white/6%)]", className),
+		className: cn("border-input bg-background ring-ring/24 focus-within:border-ring has-autofill:bg-foreground/4 has-aria-invalid:border-destructive/36 focus-within:has-aria-invalid:border-destructive/64 focus-within:has-aria-invalid:ring-destructive/16 dark:not-has-disabled:bg-input/32 dark:has-autofill:bg-foreground/8 dark:has-aria-invalid:ring-destructive/24 relative inline-flex min-h-9 w-full flex-wrap gap-1 rounded-lg border p-[calc(--spacing(1)-1px)] text-base shadow-xs/5 outline-none *:min-h-7 not-dark:bg-clip-padding before:pointer-events-none before:absolute before:inset-0 before:rounded-[calc(var(--radius-lg)-1px)] not-has-disabled:not-focus-within:not-aria-invalid:before:shadow-[0_1px_--theme(--color-black/4%)] focus-within:ring-[3px] has-disabled:pointer-events-none has-disabled:opacity-64 has-data-[size=lg]:min-h-10 has-data-[size=lg]:*:min-h-8 has-data-[size=sm]:min-h-8 has-data-[size=sm]:*:min-h-6 has-[:disabled,:focus-within,[aria-invalid]]:shadow-none sm:min-h-8 sm:text-sm sm:*:min-h-6 sm:has-data-[size=lg]:min-h-9 sm:has-data-[size=lg]:*:min-h-7 sm:has-data-[size=sm]:min-h-7 sm:has-data-[size=sm]:*:min-h-5 dark:not-has-disabled:not-focus-within:not-aria-invalid:before:shadow-[0_-1px_--theme(--color-white/6%)]", className),
 		"data-slot": "combobox-chips",
 		onMouseDown: containedHandler(chipsRef, (e) => {
 			const { target } = e;

package/dist/components/composer.d.ts

@@ -15,7 +15,7 @@ export declare const COMPOSER_CONTROL_BUTTON_SIZE: "icon-sm";
  *  radius is the docked bar's original `rounded-2xl`: at the compact row's
  *  stature it reads as a soft pill, which is the shape the composers were
  *  meant to unify on. */
-export declare const COMPOSER_BOX_CLASS = "bg-background rounded-2xl border transition-colors";
+export declare const COMPOSER_BOX_CLASS = "bg-background rounded-2xl border";
 /** The box's focus ring in its default (non-anonymized) treatment. */
 export declare const COMPOSER_BOX_FOCUS_CLASS = "focus-within:border-ring";
 /**
@@ -69,7 +69,7 @@ export declare const COMPOSER_SEND_BUTTON_CLASS = "bg-foreground text-background
  * law home's scope and jurisdiction): quiet text with a hover surface, so
  * the row stays subordinate to the box above it.
  */
-export declare const COMPOSER_PICKER_TRIGGER_CLASS = "text-muted-foreground hover:text-foreground hover:bg-accent inline-flex min-w-0 shrink items-center gap-1 rounded-md px-1.5 py-0.5 text-2xs transition-colors";
+export declare const COMPOSER_PICKER_TRIGGER_CLASS = "text-muted-foreground hover:text-foreground hover:bg-accent inline-flex min-w-0 shrink items-center gap-1 rounded-md px-1.5 py-0.5 text-2xs";
 type ComposerStatusRowProps = {
   /** Left cluster: matter picker, web-search / anonymize toggles, ... */
   start?: ReactNode | undefined;

package/dist/components/composer.js

@@ -19,7 +19,7 @@ const COMPOSER_CONTROL_BUTTON_SIZE = "icon-sm";
 *  radius is the docked bar's original `rounded-2xl`: at the compact row's
 *  stature it reads as a soft pill, which is the shape the composers were
 *  meant to unify on. */
-const COMPOSER_BOX_CLASS = "bg-background rounded-2xl border transition-colors";
+const COMPOSER_BOX_CLASS = "bg-background rounded-2xl border";
 /** The box's focus ring in its default (non-anonymized) treatment. */
 const COMPOSER_BOX_FOCUS_CLASS = "focus-within:border-ring";
 /**
@@ -73,7 +73,7 @@ const COMPOSER_SEND_BUTTON_CLASS = "bg-foreground text-background hover:bg-foreg
 * law home's scope and jurisdiction): quiet text with a hover surface, so
 * the row stays subordinate to the box above it.
 */
-const COMPOSER_PICKER_TRIGGER_CLASS = "text-muted-foreground hover:text-foreground hover:bg-accent inline-flex min-w-0 shrink items-center gap-1 rounded-md px-1.5 py-0.5 text-2xs transition-colors";
+const COMPOSER_PICKER_TRIGGER_CLASS = "text-muted-foreground hover:text-foreground hover:bg-accent inline-flex min-w-0 shrink items-center gap-1 rounded-md px-1.5 py-0.5 text-2xs";
 /**
 * The slim status row rendered beneath a composer box: a `text-xs` row with
 * a start cluster and an end slot pinned to the far edge. Shared by every

package/dist/components/date-picker-popover.js

@@ -334,7 +334,7 @@ const DatePickerPopoverContent = ({ id, labelledBy, value: rawValue, onChange, l
 			render: /* @__PURE__ */ jsx("button", {
 				"aria-label": !labelledBy && value ? displayLabel : void 0,
 				"aria-labelledby": labelledBy ? `${labelledBy} ${displayValueId}` : void 0,
-				className: cn("flex h-auto min-h-7 w-full min-w-0 items-center gap-1.5", "rounded-md px-1.5 text-sm", "hover:bg-muted transition-colors", (() => {
+				className: cn("flex h-auto min-h-7 w-full min-w-0 items-center gap-1.5", "rounded-md px-1.5 text-sm", "hover:bg-muted", (() => {
 					if (isOverdue) return "text-destructive";
 					if (value) return "text-foreground";
 					return "text-muted-foreground";
@@ -379,7 +379,7 @@ const DatePickerPopoverContent = ({ id, labelledBy, value: rawValue, onChange, l
 								children: /* @__PURE__ */ jsx(DirectionalIcon, { icon: ChevronLeftIcon })
 							}),
 							/* @__PURE__ */ jsx("button", {
-								className: cn("text-xs font-medium transition-colors", view !== "years" && "hover:bg-muted cursor-pointer rounded-md px-2 py-0.5", view === "years" && "cursor-default"),
+								className: cn("text-xs font-medium", view !== "years" && "hover:bg-muted cursor-pointer rounded-md px-2 py-0.5", view === "years" && "cursor-default"),
 								onClick: handleHeaderClick,
 								tabIndex: view === "years" ? -1 : 0,
 								type: "button",
@@ -422,7 +422,7 @@ const DatePickerPopoverContent = ({ id, labelledBy, value: rawValue, onChange, l
 								"aria-disabled": disabled || void 0,
 								"aria-label": formatDayLabel(day.date),
 								"aria-selected": isSelected || void 0,
-								className: cn("flex size-8 items-center justify-center", "rounded-full text-xs transition-colors", "focus-visible:ring-ring focus-visible:ring-1 focus-visible:outline-none", disabled ? "text-foreground-disabled cursor-not-allowed" : "hover:bg-muted cursor-pointer", !day.isCurrentMonth && !disabled && "text-foreground-disabled", day.isWeekend && day.isCurrentMonth && !disabled && !isSelected && "text-foreground-label", day.isToday && !isSelected && !disabled && "ring-foreground font-medium ring-1", isSelected && "bg-primary text-primary-foreground hover:bg-primary/90"),
+								className: cn("flex size-8 items-center justify-center", "rounded-full text-xs", "focus-visible:ring-ring focus-visible:ring-1 focus-visible:outline-none", disabled ? "text-foreground-disabled cursor-not-allowed" : "hover:bg-muted cursor-pointer", !day.isCurrentMonth && !disabled && "text-foreground-disabled", day.isWeekend && day.isCurrentMonth && !disabled && !isSelected && "text-foreground-label", day.isToday && !isSelected && !disabled && "ring-foreground font-medium ring-1", isSelected && "bg-primary text-primary-foreground hover:bg-primary/90"),
 								"data-date": day.date,
 								onClick: () => {
 									if (!disabled) onChange(day.date);
@@ -504,7 +504,7 @@ const MonthGrid = ({ locale, viewYear, currentMonth, currentYear, onSelect, toda
 				const isSelected = currentMonth !== null && currentYear !== null && month === currentMonth && viewYear === currentYear;
 				return /* @__PURE__ */ jsxs("button", {
 					"aria-selected": isSelected || void 0,
-					className: cn("rounded-md px-2 py-1.5 text-xs transition-colors", "hover:bg-muted cursor-pointer", "focus-visible:ring-ring focus-visible:ring-1 focus-visible:outline-none", month === todayMonth && viewYear === todayYear && !isSelected && "ring-foreground font-medium ring-1", isSelected && "bg-primary text-primary-foreground hover:bg-primary/90"),
+					className: cn("rounded-md px-2 py-1.5 text-xs", "hover:bg-muted cursor-pointer", "focus-visible:ring-ring focus-visible:ring-1 focus-visible:outline-none", month === todayMonth && viewYear === todayYear && !isSelected && "ring-foreground font-medium ring-1", isSelected && "bg-primary text-primary-foreground hover:bg-primary/90"),
 					onClick: () => onSelect(month),
 					role: "gridcell",
 					type: "button",
@@ -536,7 +536,7 @@ const YearGrid = ({ decadeBase, currentYear, onSelect, today }) => {
 				const isSelected = currentYear !== null && year === currentYear;
 				return /* @__PURE__ */ jsx("button", {
 					"aria-selected": isSelected || void 0,
-					className: cn("rounded-md px-2 py-1.5 text-xs transition-colors", "hover:bg-muted cursor-pointer", "focus-visible:ring-ring focus-visible:ring-1 focus-visible:outline-none", isOutside && !isSelected && "text-foreground-subtle", year === todayYear && !isSelected && "ring-foreground font-medium ring-1", isSelected && "bg-primary text-primary-foreground hover:bg-primary/90"),
+					className: cn("rounded-md px-2 py-1.5 text-xs", "hover:bg-muted cursor-pointer", "focus-visible:ring-ring focus-visible:ring-1 focus-visible:outline-none", isOutside && !isSelected && "text-foreground-subtle", year === todayYear && !isSelected && "ring-foreground font-medium ring-1", isSelected && "bg-primary text-primary-foreground hover:bg-primary/90"),
 					onClick: () => onSelect(year),
 					role: "gridcell",
 					type: "button",

package/dist/components/input-control.d.ts

@@ -9,7 +9,7 @@
  * two boxes drift apart the moment a caller sizes the wrapper: the text sits
  * at the top of the control while the icon stays centred.
  */
-export declare const INPUT_CONTROL_CLASS_NAME = "border-input bg-background text-foreground ring-ring/24 has-autofill:bg-foreground/4 has-focus-visible:border-ring has-aria-invalid:border-destructive/36 has-focus-visible:has-aria-invalid:border-destructive/64 has-focus-visible:has-aria-invalid:ring-destructive/16 dark:bg-input/32 dark:has-autofill:bg-foreground/8 dark:has-aria-invalid:ring-destructive/24 relative inline-flex w-full rounded-lg border text-base shadow-xs/5 transition-shadow not-dark:bg-clip-padding before:pointer-events-none before:absolute before:inset-0 before:rounded-[calc(var(--radius-lg)-1px)] not-has-disabled:not-has-focus-visible:not-has-aria-invalid:before:shadow-[0_1px_--theme(--color-black/4%)] has-focus-visible:ring-[3px] has-disabled:opacity-64 has-[:disabled,:focus-visible,[aria-invalid]]:shadow-none sm:text-sm dark:not-has-disabled:not-has-focus-visible:not-has-aria-invalid:before:shadow-[0_-1px_--theme(--color-white/6%)] pointer-coarse:min-h-11";
+export declare const INPUT_CONTROL_CLASS_NAME = "border-input bg-background text-foreground ring-ring/24 has-autofill:bg-foreground/4 has-focus-visible:border-ring has-aria-invalid:border-destructive/36 has-focus-visible:has-aria-invalid:border-destructive/64 has-focus-visible:has-aria-invalid:ring-destructive/16 dark:bg-input/32 dark:has-autofill:bg-foreground/8 dark:has-aria-invalid:ring-destructive/24 relative inline-flex w-full rounded-lg border text-base shadow-xs/5 not-dark:bg-clip-padding before:pointer-events-none before:absolute before:inset-0 before:rounded-[calc(var(--radius-lg)-1px)] not-has-disabled:not-has-focus-visible:not-has-aria-invalid:before:shadow-[0_1px_--theme(--color-black/4%)] has-focus-visible:ring-[3px] has-disabled:opacity-64 has-[:disabled,:focus-visible,[aria-invalid]]:shadow-none sm:text-sm dark:not-has-disabled:not-has-focus-visible:not-has-aria-invalid:before:shadow-[0_-1px_--theme(--color-white/6%)] pointer-coarse:min-h-11";
 export declare const INPUT_ELEMENT_CLASS_NAME = "placeholder:text-foreground-placeholder h-full min-h-8.5 w-full min-w-0 rounded-[inherit] px-[calc(--spacing(3)-1px)] leading-8.5 outline-none [transition:background-color_5000000s_ease-in-out_0s] sm:min-h-7.5 sm:leading-7.5";
 export declare const INPUT_SIZE_CLASS_NAMES: {
   readonly sm: "min-h-7.5 px-[calc(--spacing(2.5)-1px)] leading-7.5 sm:min-h-6.5 sm:leading-6.5";

package/dist/components/input-control.js

@@ -10,7 +10,7 @@ import { CONTROL_SIZE } from "../lib/control-size.js";
 * two boxes drift apart the moment a caller sizes the wrapper: the text sits
 * at the top of the control while the icon stays centred.
 */
-const INPUT_CONTROL_CLASS_NAME = "border-input bg-background text-foreground ring-ring/24 has-autofill:bg-foreground/4 has-focus-visible:border-ring has-aria-invalid:border-destructive/36 has-focus-visible:has-aria-invalid:border-destructive/64 has-focus-visible:has-aria-invalid:ring-destructive/16 dark:bg-input/32 dark:has-autofill:bg-foreground/8 dark:has-aria-invalid:ring-destructive/24 relative inline-flex w-full rounded-lg border text-base shadow-xs/5 transition-shadow not-dark:bg-clip-padding before:pointer-events-none before:absolute before:inset-0 before:rounded-[calc(var(--radius-lg)-1px)] not-has-disabled:not-has-focus-visible:not-has-aria-invalid:before:shadow-[0_1px_--theme(--color-black/4%)] has-focus-visible:ring-[3px] has-disabled:opacity-64 has-[:disabled,:focus-visible,[aria-invalid]]:shadow-none sm:text-sm dark:not-has-disabled:not-has-focus-visible:not-has-aria-invalid:before:shadow-[0_-1px_--theme(--color-white/6%)] pointer-coarse:min-h-11";
+const INPUT_CONTROL_CLASS_NAME = "border-input bg-background text-foreground ring-ring/24 has-autofill:bg-foreground/4 has-focus-visible:border-ring has-aria-invalid:border-destructive/36 has-focus-visible:has-aria-invalid:border-destructive/64 has-focus-visible:has-aria-invalid:ring-destructive/16 dark:bg-input/32 dark:has-autofill:bg-foreground/8 dark:has-aria-invalid:ring-destructive/24 relative inline-flex w-full rounded-lg border text-base shadow-xs/5 not-dark:bg-clip-padding before:pointer-events-none before:absolute before:inset-0 before:rounded-[calc(var(--radius-lg)-1px)] not-has-disabled:not-has-focus-visible:not-has-aria-invalid:before:shadow-[0_1px_--theme(--color-black/4%)] has-focus-visible:ring-[3px] has-disabled:opacity-64 has-[:disabled,:focus-visible,[aria-invalid]]:shadow-none sm:text-sm dark:not-has-disabled:not-has-focus-visible:not-has-aria-invalid:before:shadow-[0_-1px_--theme(--color-white/6%)] pointer-coarse:min-h-11";
 const INPUT_ELEMENT_CLASS_NAME = "placeholder:text-foreground-placeholder h-full min-h-8.5 w-full min-w-0 rounded-[inherit] px-[calc(--spacing(3)-1px)] leading-8.5 outline-none [transition:background-color_5000000s_ease-in-out_0s] sm:min-h-7.5 sm:leading-7.5";
 const INPUT_SIZE_CLASS_NAMES = {
 	[CONTROL_SIZE.sm]: "min-h-7.5 px-[calc(--spacing(2.5)-1px)] leading-7.5 sm:min-h-6.5 sm:leading-6.5",

package/dist/components/input-group.d.ts

@@ -5,7 +5,7 @@ import { VariantProps } from "class-variance-authority";
 //#region src/components/input-group.d.ts
 declare const InputGroup: ({ className, ...props }: React$1.ComponentProps<"div">) => React$1.JSX.Element;
 declare const inputGroupAddonVariants: (props?: ({
-  align?: "inline-start" | "block-end" | "block-start" | "inline-end" | null | undefined;
+  align?: "inline-end" | "inline-start" | "block-end" | "block-start" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 declare const InputGroupAddon: ({ className, align, ...props }: React$1.ComponentProps<"div"> & VariantProps<typeof inputGroupAddonVariants>) => React$1.JSX.Element;
 declare const InputGroupText: ({ className, ...props }: React$1.ComponentProps<"span">) => React$1.JSX.Element;

package/dist/components/input-group.js

@@ -6,7 +6,7 @@ import { jsx } from "react/jsx-runtime";
 import { cva } from "class-variance-authority";
 //#region src/components/input-group.tsx
 const InputGroup = ({ className, ...props }) => /* @__PURE__ */ jsx("div", {
-	className: cn("border-input bg-background text-foreground ring-ring/24 has-autofill:bg-foreground/4 has-[input:focus-visible,textarea:focus-visible]:border-ring has-[input[aria-invalid],textarea[aria-invalid]]:border-destructive/36 has-[input:focus-visible,textarea:focus-visible]:has-[input[aria-invalid],textarea[aria-invalid]]:border-destructive/64 has-[input:focus-visible,textarea:focus-visible]:has-[input[aria-invalid],textarea[aria-invalid]]:ring-destructive/16 dark:bg-input/32 dark:has-autofill:bg-foreground/8 dark:has-[input[aria-invalid],textarea[aria-invalid]]:ring-destructive/24 relative inline-flex w-full min-w-0 items-center rounded-lg border text-base shadow-xs/5 transition-shadow not-dark:bg-clip-padding before:pointer-events-none before:absolute before:inset-0 before:rounded-[calc(var(--radius-lg)-1px)] not-has-[input:disabled,textarea:disabled]:not-has-[input:focus-visible,textarea:focus-visible]:not-has-[input[aria-invalid],textarea[aria-invalid]]:before:shadow-[0_1px_--theme(--color-black/4%)] has-data-[align=block-end]:h-auto has-data-[align=block-end]:flex-col has-data-[align=block-start]:h-auto has-data-[align=block-start]:flex-col has-[input:disabled,textarea:disabled]:opacity-64 has-[input:disabled,textarea:disabled,input:focus-visible,textarea:focus-visible,input[aria-invalid],textarea[aria-invalid]]:shadow-none has-[input:focus-visible,textarea:focus-visible]:ring-[3px] has-[textarea]:h-auto sm:text-sm dark:not-has-[input:disabled,textarea:disabled]:not-has-[input:focus-visible,textarea:focus-visible]:not-has-[input[aria-invalid],textarea[aria-invalid]]:before:shadow-[0_-1px_--theme(--color-white/6%)] has-data-[align=inline-end]:**:[[data-size=sm]_input]:pe-1.5 has-data-[align=inline-start]:**:[[data-size=sm]_input]:ps-1.5 *:[[data-slot=input-control],[data-slot=textarea-control]]:contents *:[[data-slot=input-control],[data-slot=textarea-control]]:before:hidden has-data-[align=block-end]:**:[input]:pt-1.5 has-data-[align=block-start]:**:[input]:pb-1.5 has-data-[align=inline-end]:**:[input]:pe-2 has-data-[align=inline-start]:**:[input]:ps-2 has-[[data-align=block-start],[data-align=block-end]]:**:[input]:h-auto **:[textarea_button]:rounded-[calc(var(--radius-md)-1px)] **:[textarea]:min-h-20.5 **:[textarea]:resize-none **:[textarea]:py-[calc(--spacing(3)-1px)] **:[textarea]:max-sm:min-h-23.5", className),
+	className: cn("border-input bg-background text-foreground ring-ring/24 has-autofill:bg-foreground/4 has-[input:focus-visible,textarea:focus-visible]:border-ring has-[input[aria-invalid],textarea[aria-invalid]]:border-destructive/36 has-[input:focus-visible,textarea:focus-visible]:has-[input[aria-invalid],textarea[aria-invalid]]:border-destructive/64 has-[input:focus-visible,textarea:focus-visible]:has-[input[aria-invalid],textarea[aria-invalid]]:ring-destructive/16 dark:bg-input/32 dark:has-autofill:bg-foreground/8 dark:has-[input[aria-invalid],textarea[aria-invalid]]:ring-destructive/24 relative inline-flex w-full min-w-0 items-center rounded-lg border text-base shadow-xs/5 not-dark:bg-clip-padding before:pointer-events-none before:absolute before:inset-0 before:rounded-[calc(var(--radius-lg)-1px)] not-has-[input:disabled,textarea:disabled]:not-has-[input:focus-visible,textarea:focus-visible]:not-has-[input[aria-invalid],textarea[aria-invalid]]:before:shadow-[0_1px_--theme(--color-black/4%)] has-data-[align=block-end]:h-auto has-data-[align=block-end]:flex-col has-data-[align=block-start]:h-auto has-data-[align=block-start]:flex-col has-[input:disabled,textarea:disabled]:opacity-64 has-[input:disabled,textarea:disabled,input:focus-visible,textarea:focus-visible,input[aria-invalid],textarea[aria-invalid]]:shadow-none has-[input:focus-visible,textarea:focus-visible]:ring-[3px] has-[textarea]:h-auto sm:text-sm dark:not-has-[input:disabled,textarea:disabled]:not-has-[input:focus-visible,textarea:focus-visible]:not-has-[input[aria-invalid],textarea[aria-invalid]]:before:shadow-[0_-1px_--theme(--color-white/6%)] has-data-[align=inline-end]:**:[[data-size=sm]_input]:pe-1.5 has-data-[align=inline-start]:**:[[data-size=sm]_input]:ps-1.5 *:[[data-slot=input-control],[data-slot=textarea-control]]:contents *:[[data-slot=input-control],[data-slot=textarea-control]]:before:hidden has-data-[align=block-end]:**:[input]:pt-1.5 has-data-[align=block-start]:**:[input]:pb-1.5 has-data-[align=inline-end]:**:[input]:pe-2 has-data-[align=inline-start]:**:[input]:ps-2 has-[[data-align=block-start],[data-align=block-end]]:**:[input]:h-auto **:[textarea_button]:rounded-[calc(var(--radius-md)-1px)] **:[textarea]:min-h-20.5 **:[textarea]:resize-none **:[textarea]:py-[calc(--spacing(3)-1px)] **:[textarea]:max-sm:min-h-23.5", className),
 	"data-slot": "input-group",
 	role: "group",
 	...props

package/dist/components/input-otp.js

@@ -19,7 +19,7 @@ const InputOTPGroup = ({ className, ...props }) => /* @__PURE__ */ jsx("div", {
 const InputOTPSlot = ({ index, className, ...props }) => {
 	const { char, hasFakeCaret, isActive } = React$1.use(OTPInputContext).slots[index] ?? {};
 	return /* @__PURE__ */ jsxs("div", {
-		className: cn("border-input aria-invalid:border-destructive data-[active=true]:border-ring data-[active=true]:ring-ring/50 data-[active=true]:aria-invalid:border-destructive data-[active=true]:aria-invalid:ring-destructive/20 dark:bg-input/30 dark:data-[active=true]:aria-invalid:ring-destructive/40 relative flex h-9 w-9 items-center justify-center border-y border-e text-sm shadow-xs transition-[border-color,outline] outline-none first:rounded-s-md first:border-s last:rounded-e-md data-[active=true]:z-10 data-[active=true]:ring-[3px]", className),
+		className: cn("border-input aria-invalid:border-destructive data-[active=true]:border-ring data-[active=true]:ring-ring/50 data-[active=true]:aria-invalid:border-destructive data-[active=true]:aria-invalid:ring-destructive/20 dark:bg-input/30 dark:data-[active=true]:aria-invalid:ring-destructive/40 relative flex h-9 w-9 items-center justify-center border-y border-e text-sm shadow-xs outline-none first:rounded-s-md first:border-s last:rounded-e-md data-[active=true]:z-10 data-[active=true]:ring-[3px]", className),
 		"data-active": isActive,
 		"data-slot": "input-otp-slot",
 		...props,

package/dist/components/input.js

@@ -20,7 +20,7 @@ const Input = ({ className, size = CONTROL_SIZE.default, unstyled = false, nativ
 	};
 	const inputClassName = cn(INPUT_ELEMENT_CLASS_NAME, INPUT_SIZE_CLASS_NAMES[controlSize], props.type === "search" && "ps-8 [&::-webkit-search-cancel-button]:appearance-none [&::-webkit-search-decoration]:appearance-none [&::-webkit-search-results-button]:appearance-none [&::-webkit-search-results-decoration]:appearance-none");
 	return /* @__PURE__ */ jsxs("span", {
-		className: cn(!unstyled && "border-input bg-background text-foreground ring-ring/24 has-autofill:bg-foreground/4 has-focus-visible:border-ring has-aria-invalid:border-destructive/36 has-focus-visible:has-aria-invalid:border-destructive/64 has-focus-visible:has-aria-invalid:ring-destructive/16 dark:bg-input/32 dark:has-autofill:bg-foreground/8 dark:has-aria-invalid:ring-destructive/24 relative inline-flex w-full rounded-lg border text-base shadow-xs/5 transition-shadow not-dark:bg-clip-padding before:pointer-events-none before:absolute before:inset-0 before:rounded-[calc(var(--radius-lg)-1px)] not-has-disabled:not-has-focus-visible:not-has-aria-invalid:before:shadow-[0_1px_--theme(--color-black/4%)] has-focus-visible:ring-[3px] has-disabled:opacity-64 has-[:disabled,:focus-visible,[aria-invalid]]:shadow-none sm:text-sm dark:not-has-disabled:not-has-focus-visible:not-has-aria-invalid:before:shadow-[0_-1px_--theme(--color-white/6%)] pointer-coarse:min-h-11", className) || void 0,
+		className: cn(!unstyled && "border-input bg-background text-foreground ring-ring/24 has-autofill:bg-foreground/4 has-focus-visible:border-ring has-aria-invalid:border-destructive/36 has-focus-visible:has-aria-invalid:border-destructive/64 has-focus-visible:has-aria-invalid:ring-destructive/16 dark:bg-input/32 dark:has-autofill:bg-foreground/8 dark:has-aria-invalid:ring-destructive/24 relative inline-flex w-full rounded-lg border text-base shadow-xs/5 not-dark:bg-clip-padding before:pointer-events-none before:absolute before:inset-0 before:rounded-[calc(var(--radius-lg)-1px)] not-has-disabled:not-has-focus-visible:not-has-aria-invalid:before:shadow-[0_1px_--theme(--color-black/4%)] has-focus-visible:ring-[3px] has-disabled:opacity-64 has-[:disabled,:focus-visible,[aria-invalid]]:shadow-none sm:text-sm dark:not-has-disabled:not-has-focus-visible:not-has-aria-invalid:before:shadow-[0_-1px_--theme(--color-white/6%)] pointer-coarse:min-h-11", className) || void 0,
 		"data-size": size,
 		"data-slot": "input-control",
 		dir: contentDir.dir,

package/dist/components/landing.d.ts

@@ -25,9 +25,9 @@ type LandingGreetingProps = {
 };
 export declare const LandingGreeting: ({ icon, children }: LandingGreetingProps) => import("react").JSX.Element;
 /** A column's heading: an icon and an uppercase label, as a link or a trigger. */
-export declare const LANDING_SECTION_HEADING_CLASS = "text-muted-foreground hover:text-foreground focus-visible:ring-ring flex items-center gap-2 rounded-md px-1 text-xs font-semibold tracking-widest uppercase transition-colors outline-none focus-visible:ring-2";
+export declare const LANDING_SECTION_HEADING_CLASS = "text-muted-foreground hover:text-foreground focus-visible:ring-ring flex items-center gap-2 rounded-md px-1 text-xs font-semibold tracking-widest uppercase outline-none focus-visible:ring-2";
 /** A row of a column, as a link or a button. */
-export declare const LANDING_ROW_CLASS = "group hover:bg-accent/50 focus-visible:ring-ring rounded-md px-2 py-1.5 text-start transition-colors outline-none focus-visible:ring-2";
+export declare const LANDING_ROW_CLASS = "group hover:bg-accent/50 focus-visible:ring-ring rounded-md px-2 py-1.5 text-start outline-none focus-visible:ring-2";
 type LandingSectionProps = {
   children: ReactNode;
   heading: ReactNode;

package/dist/components/landing.js

@@ -40,9 +40,9 @@ const LandingGreeting = ({ icon, children }) => /* @__PURE__ */ jsxs("div", {
 	})]
 });
 /** A column's heading: an icon and an uppercase label, as a link or a trigger. */
-const LANDING_SECTION_HEADING_CLASS = "text-muted-foreground hover:text-foreground focus-visible:ring-ring flex items-center gap-2 rounded-md px-1 text-xs font-semibold tracking-widest uppercase transition-colors outline-none focus-visible:ring-2";
+const LANDING_SECTION_HEADING_CLASS = "text-muted-foreground hover:text-foreground focus-visible:ring-ring flex items-center gap-2 rounded-md px-1 text-xs font-semibold tracking-widest uppercase outline-none focus-visible:ring-2";
 /** A row of a column, as a link or a button. */
-const LANDING_ROW_CLASS = "group hover:bg-accent/50 focus-visible:ring-ring rounded-md px-2 py-1.5 text-start transition-colors outline-none focus-visible:ring-2";
+const LANDING_ROW_CLASS = "group hover:bg-accent/50 focus-visible:ring-ring rounded-md px-2 py-1.5 text-start outline-none focus-visible:ring-2";
 /** A column: its heading stays put, its rows scroll beneath it. */
 const LandingSection = ({ children, heading }) => /* @__PURE__ */ jsxs("section", {
 	className: "flex min-h-0 min-w-0 flex-col",
@@ -86,7 +86,7 @@ const LandingItemText = ({ icon, iconTone = "muted", meta, title }) => /* @__PUR
 	})]
 });
 const LandingRowIcon = ({ children, tone = "muted" }) => /* @__PURE__ */ jsx("span", {
-	className: cn("mt-0.5 flex size-4 shrink-0 items-center justify-center transition-colors", tone === "muted" && "text-foreground-muted group-hover:text-muted-foreground"),
+	className: cn("mt-0.5 flex size-4 shrink-0 items-center justify-center", tone === "muted" && "text-foreground-muted group-hover:text-muted-foreground"),
 	children
 });
 const LandingEmpty = ({ children }) => /* @__PURE__ */ jsx("div", {

package/dist/components/menu.js

@@ -58,9 +58,9 @@ const MenuCheckboxItem = ({ className, children, checked, variant = "default", .
 		className: "col-start-1",
 		children
 	}), /* @__PURE__ */ jsx(Menu$1.CheckboxItemIndicator, {
-		className: "focus-visible:ring-ring focus-visible:ring-offset-background data-checked:bg-primary data-unchecked:bg-input inline-flex h-[calc(var(--thumb-size)+2px)] w-[calc(var(--thumb-size)*2-2px)] shrink-0 items-center rounded-full p-px inset-shadow-[0_1px_--theme(--color-black/4%)] transition-[background-color,box-shadow] duration-200 outline-none [--thumb-size:--spacing(4)] focus-visible:ring-2 focus-visible:ring-offset-1 data-disabled:opacity-64 sm:[--thumb-size:--spacing(3)]",
+		className: "focus-visible:ring-ring focus-visible:ring-offset-background data-checked:bg-primary data-unchecked:bg-input inline-flex h-[calc(var(--thumb-size)+2px)] w-[calc(var(--thumb-size)*2-2px)] shrink-0 items-center rounded-full p-px inset-shadow-[0_1px_--theme(--color-black/4%)] outline-none [--thumb-size:--spacing(4)] focus-visible:ring-2 focus-visible:ring-offset-1 data-disabled:opacity-64 sm:[--thumb-size:--spacing(3)]",
 		keepMounted: true,
-		children: /* @__PURE__ */ jsx("span", { className: "bg-background pointer-events-none block aspect-square h-full origin-left rounded-(--thumb-size) shadow-sm/5 will-change-transform [transition:translate_.15s,border-radius_.15s,scale_.1s_.1s,transform-origin_.15s] in-[[data-slot=menu-checkbox-item]:active]:rounded-[var(--thumb-size)/calc(var(--thumb-size)*1.10)] in-[[data-slot=menu-checkbox-item]:active]:not-data-disabled:scale-x-110 in-[[data-slot=menu-checkbox-item][data-checked]]:origin-[var(--thumb-size)_50%] in-[[data-slot=menu-checkbox-item][data-checked]]:translate-x-[calc(var(--thumb-size)-4px)]" })
+		children: /* @__PURE__ */ jsx("span", { className: "bg-background pointer-events-none block aspect-square h-full origin-left rounded-(--thumb-size) shadow-sm/5 will-change-transform [transition:translate_.15s,scale_.1s_.1s,transform-origin_.15s] in-[[data-slot=menu-checkbox-item]:active]:rounded-[var(--thumb-size)/calc(var(--thumb-size)*1.10)] in-[[data-slot=menu-checkbox-item]:active]:not-data-disabled:scale-x-110 in-[[data-slot=menu-checkbox-item][data-checked]]:origin-[var(--thumb-size)_50%] in-[[data-slot=menu-checkbox-item][data-checked]]:translate-x-[calc(var(--thumb-size)-4px)]" })
 	})] }) : /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Menu$1.CheckboxItemIndicator, {
 		className: "col-start-1",
 		children: /* @__PURE__ */ jsxs("svg", {

package/dist/components/scroll-area.js

@@ -13,7 +13,7 @@ const ScrollArea = ({ axis = "both", className, children, scrollFade = false, sc
 	children: [
 		/* @__PURE__ */ jsx(ScrollArea$1.Viewport, {
 			ref: viewportRef,
-			className: cn("focus-visible:ring-ring focus-visible:ring-offset-background h-full overscroll-contain rounded-[inherit] transition-shadow outline-none focus-visible:ring-2 focus-visible:ring-offset-1 data-has-overflow-x:overscroll-x-contain", scrollFade && "mask-t-from-[calc(100%-min(var(--fade-size),var(--scroll-area-overflow-y-start)))] mask-r-from-[calc(100%-min(var(--fade-size),var(--scroll-area-overflow-x-end)))] mask-b-from-[calc(100%-min(var(--fade-size),var(--scroll-area-overflow-y-end)))] mask-l-from-[calc(100%-min(var(--fade-size),var(--scroll-area-overflow-x-start)))] [--fade-size:1.5rem]", scrollbarGutter && "data-has-overflow-x:pb-2.5 data-has-overflow-y:pe-2.5", AXIS_VIEWPORT_CLASS[axis]),
+			className: cn("focus-visible:ring-ring focus-visible:ring-offset-background h-full overscroll-contain rounded-[inherit] outline-none focus-visible:ring-2 focus-visible:ring-offset-1 data-has-overflow-x:overscroll-x-contain", scrollFade && "mask-t-from-[calc(100%-min(var(--fade-size),var(--scroll-area-overflow-y-start)))] mask-r-from-[calc(100%-min(var(--fade-size),var(--scroll-area-overflow-x-end)))] mask-b-from-[calc(100%-min(var(--fade-size),var(--scroll-area-overflow-y-end)))] mask-l-from-[calc(100%-min(var(--fade-size),var(--scroll-area-overflow-x-start)))] [--fade-size:1.5rem]", scrollbarGutter && "data-has-overflow-x:pb-2.5 data-has-overflow-y:pe-2.5", AXIS_VIEWPORT_CLASS[axis]),
 			"data-slot": "scroll-area-viewport",
 			children
 		}),

package/dist/components/select.js

@@ -31,7 +31,7 @@ const Select = ({ children, isItemEqualToValue, itemToStringLabel, itemToStringV
 	});
 };
 const SelectTrigger = ({ className, size = CONTROL_SIZE.default, children, ...props }) => /* @__PURE__ */ jsxs(Select$1.Trigger, {
-	className: cn("border-input bg-background text-foreground ring-ring/24 focus-visible:border-ring aria-invalid:border-destructive/36 focus-visible:aria-invalid:border-destructive/64 focus-visible:aria-invalid:ring-destructive/16 dark:bg-input/32 dark:aria-invalid:ring-destructive/24 relative inline-flex min-h-9 w-full min-w-36 items-center justify-center gap-2 rounded-lg border px-[calc(--spacing(3)-1px)] text-start text-base shadow-xs/5 transition-shadow outline-none select-none not-dark:bg-clip-padding before:pointer-events-none before:absolute before:inset-0 before:rounded-[calc(var(--radius-lg)-1px)] not-data-disabled:not-focus-visible:not-aria-invalid:not-data-pressed:before:shadow-[0_1px_--theme(--color-black/4%)] focus-visible:ring-[3px] data-disabled:pointer-events-none data-disabled:opacity-64 sm:min-h-8 sm:text-sm dark:not-data-disabled:not-focus-visible:not-aria-invalid:not-data-pressed:before:shadow-[0_-1px_--theme(--color-white/6%)] pointer-coarse:after:absolute pointer-coarse:after:size-full pointer-coarse:after:min-h-11 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='opacity-'])]:opacity-80 [&_svg:not([class*='size-'])]:size-4.5 sm:[&_svg:not([class*='size-'])]:size-4 [[data-disabled],:focus-visible,[aria-invalid],[data-pressed]]:shadow-none", SELECT_TRIGGER_SIZE_CLASS_NAMES[size], className),
+	className: cn("border-input bg-background text-foreground ring-ring/24 focus-visible:border-ring aria-invalid:border-destructive/36 focus-visible:aria-invalid:border-destructive/64 focus-visible:aria-invalid:ring-destructive/16 dark:bg-input/32 dark:aria-invalid:ring-destructive/24 relative inline-flex min-h-9 w-full min-w-36 items-center justify-center gap-2 rounded-lg border px-[calc(--spacing(3)-1px)] text-start text-base shadow-xs/5 outline-none select-none not-dark:bg-clip-padding before:pointer-events-none before:absolute before:inset-0 before:rounded-[calc(var(--radius-lg)-1px)] not-data-disabled:not-focus-visible:not-aria-invalid:not-data-pressed:before:shadow-[0_1px_--theme(--color-black/4%)] focus-visible:ring-[3px] data-disabled:pointer-events-none data-disabled:opacity-64 sm:min-h-8 sm:text-sm dark:not-data-disabled:not-focus-visible:not-aria-invalid:not-data-pressed:before:shadow-[0_-1px_--theme(--color-white/6%)] pointer-coarse:after:absolute pointer-coarse:after:size-full pointer-coarse:after:min-h-11 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='opacity-'])]:opacity-80 [&_svg:not([class*='size-'])]:size-4.5 sm:[&_svg:not([class*='size-'])]:size-4 [[data-disabled],:focus-visible,[aria-invalid],[data-pressed]]:shadow-none", SELECT_TRIGGER_SIZE_CLASS_NAMES[size], className),
 	"data-slot": "select-trigger",
 	...props,
 	children: [children, /* @__PURE__ */ jsx(Select$1.Icon, {

package/dist/components/sidebar.d.ts

@@ -83,7 +83,7 @@ declare const SidebarMenu: ({ className, ...props }: React.ComponentProps<"ul">)
 declare const SidebarMenuItem: ({ className, ...props }: React.ComponentProps<"li">) => import("react").JSX.Element;
 declare const sidebarMenuButtonVariants: (props?: ({
   variant?: "default" | "outline" | null | undefined;
-  size?: "default" | "sm" | "lg" | "rail" | null | undefined;
+  size?: "default" | "lg" | "sm" | "rail" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 declare const SidebarMenuButton: ({ asChild, isActive, variant, size, tooltip, className, ...props }: React.ComponentProps<"button"> & {
   asChild?: boolean;

package/dist/components/table.js

@@ -27,7 +27,7 @@ const TableFooter = ({ className, ...props }) => /* @__PURE__ */ jsx("tfoot", {
 	...props
 });
 const TableRow = ({ className, ...props }) => /* @__PURE__ */ jsx("tr", {
-	className: cn("hover:bg-muted/72 data-[state=selected]:bg-muted/72 border-b transition-colors in-data-[slot=frame]:hover:bg-transparent in-data-[slot=frame]:data-[state=selected]:bg-transparent", className),
+	className: cn("hover:bg-muted/72 data-[state=selected]:bg-muted/72 border-b in-data-[slot=frame]:hover:bg-transparent in-data-[slot=frame]:data-[state=selected]:bg-transparent", className),
 	"data-slot": "table-row",
 	...props
 });

package/dist/components/textarea.js

@@ -18,7 +18,7 @@ const Textarea = ({ className, size = CONTROL_SIZE.default, unstyled = false, di
 		onChange?.(event);
 	};
 	return /* @__PURE__ */ jsx("span", {
-		className: cn(!unstyled && "border-input bg-background text-foreground ring-ring/24 has-focus-visible:border-ring has-aria-invalid:border-destructive/36 has-focus-visible:has-aria-invalid:border-destructive/64 has-focus-visible:has-aria-invalid:ring-destructive/16 dark:bg-input/32 dark:has-aria-invalid:ring-destructive/24 relative inline-flex w-full rounded-lg border text-base shadow-xs/5 transition-shadow not-dark:bg-clip-padding before:pointer-events-none before:absolute before:inset-0 before:rounded-[calc(var(--radius-lg)-1px)] not-has-disabled:has-not-focus-visible:not-has-aria-invalid:before:shadow-[0_1px_--theme(--color-black/4%)] has-focus-visible:ring-[3px] has-disabled:opacity-64 has-[:disabled,:focus-visible,[aria-invalid]]:shadow-none sm:text-sm dark:not-has-disabled:has-not-focus-visible:not-has-aria-invalid:before:shadow-[0_-1px_--theme(--color-white/6%)]", className) || void 0,
+		className: cn(!unstyled && "border-input bg-background text-foreground ring-ring/24 has-focus-visible:border-ring has-aria-invalid:border-destructive/36 has-focus-visible:has-aria-invalid:border-destructive/64 has-focus-visible:has-aria-invalid:ring-destructive/16 dark:bg-input/32 dark:has-aria-invalid:ring-destructive/24 relative inline-flex w-full rounded-lg border text-base shadow-xs/5 not-dark:bg-clip-padding before:pointer-events-none before:absolute before:inset-0 before:rounded-[calc(var(--radius-lg)-1px)] not-has-disabled:has-not-focus-visible:not-has-aria-invalid:before:shadow-[0_1px_--theme(--color-black/4%)] has-focus-visible:ring-[3px] has-disabled:opacity-64 has-[:disabled,:focus-visible,[aria-invalid]]:shadow-none sm:text-sm dark:not-has-disabled:has-not-focus-visible:not-has-aria-invalid:before:shadow-[0_-1px_--theme(--color-white/6%)]", className) || void 0,
 		"data-size": size,
 		"data-slot": "textarea-control",
 		children: /* @__PURE__ */ jsx(Field.Control, { render: (defaultProps) => /* @__PURE__ */ jsx("textarea", {

package/dist/components/toast.js

@@ -99,7 +99,7 @@ const Toasts = ({ position }) => {
 								"data-slot": "toast-action",
 								children: toastItem.actionProps.children
 							}), /* @__PURE__ */ jsx(Toast.Close, {
-								className: "text-muted-foreground hover:text-foreground shrink-0 cursor-pointer rounded p-0.5 transition-colors select-none",
+								className: "text-muted-foreground hover:text-foreground shrink-0 cursor-pointer rounded p-0.5 select-none",
 								"data-slot": "toast-close",
 								"aria-label": "Close notification",
 								children: /* @__PURE__ */ jsx(XIcon, { className: "size-4" })

package/dist/inspector/chrome.js

@@ -56,7 +56,7 @@ const InspectorRailFooter = ({ className, ...props }) => /* @__PURE__ */ jsx("di
 	...props
 });
 const InspectorRailIconButton = ({ className, ...props }) => /* @__PURE__ */ jsx("button", {
-	className: cn("text-muted-foreground hover:bg-accent hover:text-foreground flex items-center justify-center rounded-md outline-hidden transition-colors focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-50", SIDE_RAIL_ICON_BUTTON_SIZE, className),
+	className: cn("text-muted-foreground hover:bg-accent hover:text-foreground flex items-center justify-center rounded-md outline-hidden focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-50", SIDE_RAIL_ICON_BUTTON_SIZE, className),
 	"data-slot": "inspector-rail-icon-button",
 	type: "button",
 	...props
@@ -69,7 +69,7 @@ const InspectorRailIconButton = ({ className, ...props }) => /* @__PURE__ */ jsx
 */
 const InspectorRailTab = ({ active = false, className, ...props }) => /* @__PURE__ */ jsx("button", {
 	"aria-current": active ? "true" : void 0,
-	className: cn("group/tab relative flex w-full shrink-0 items-center justify-center border-b transition-colors", TOOLBAR_ROW_HEIGHT, active ? "bg-background text-foreground before:bg-primary before:absolute before:inset-y-0 before:inset-s-0 before:w-0.5" : "text-muted-foreground hover:bg-accent hover:text-foreground", className),
+	className: cn("group/tab relative flex w-full shrink-0 items-center justify-center border-b", TOOLBAR_ROW_HEIGHT, active ? "bg-background text-foreground before:bg-primary before:absolute before:inset-y-0 before:inset-s-0 before:w-0.5" : "text-muted-foreground hover:bg-accent hover:text-foreground", className),
 	"data-active": active ? "" : void 0,
 	"data-slot": "inspector-rail-tab",
 	type: "button",

package/dist/inspector/dock.js

@@ -37,7 +37,7 @@ const InspectorDock = ({ children, className, mount = "shell-end", onResetWidth,
 					className: "bg-border group-hover:bg-primary group-active:bg-primary absolute inset-y-0 start-1/2 w-px -translate-x-1/2"
 				}), /* @__PURE__ */ jsx("span", {
 					"aria-hidden": "true",
-					className: "bg-background/80 text-foreground-placeholder ring-border/60 group-hover:bg-accent group-hover:text-foreground group-focus-visible:bg-accent group-focus-visible:text-foreground relative flex h-5 w-3 items-center justify-center rounded-full opacity-0 shadow-xs ring-1 backdrop-blur-sm transition-[color,background-color,opacity] group-hover:opacity-100 group-focus-visible:opacity-100 group-active:opacity-100",
+					className: "bg-background/80 text-foreground-placeholder ring-border/60 group-hover:bg-accent group-hover:text-foreground group-focus-visible:bg-accent group-focus-visible:text-foreground relative flex h-5 w-3 items-center justify-center rounded-full opacity-0 shadow-xs ring-1 backdrop-blur-sm transition-opacity group-hover:opacity-100 group-focus-visible:opacity-100 group-active:opacity-100",
 					"data-slot": "inspector-resize-grip",
 					children: /* @__PURE__ */ jsx(EllipsisIcon, { className: "size-3 rotate-90" })
 				})]

package/dist/inspector/facet-bar.js

@@ -157,7 +157,7 @@ const flashFacetChip = (el) => {
 		easing: "ease-in-out"
 	});
 };
-const CHIP_CLASS = "shrink-0 rounded-md px-1.5 py-1 text-xs font-medium whitespace-nowrap transition-colors";
+const CHIP_CLASS = "shrink-0 rounded-md px-1.5 py-1 text-xs font-medium whitespace-nowrap";
 const INACTIVE_CHIP_CLASS = "text-muted-foreground hover:bg-muted hover:text-foreground";
 const FacetChip = ({ label, value, isActive, disabled, activeBadge, onSelect }) => /* @__PURE__ */ jsxs(Tooltip, { children: [/* @__PURE__ */ jsx(TooltipTrigger, {
 	render: /* @__PURE__ */ jsx("button", {

package/dist/kanban/card-shell.js

@@ -44,7 +44,7 @@ const KanbanCardShell = ({ children, appearance = "standard", actions, actionsVi
 		"data-active": active ? "true" : void 0,
 		ref: dragRef,
 		children: /* @__PURE__ */ jsx("div", {
-			className: cn(CARD_CLASS, appearance === "proposal" && "border-dashed", "cursor-pointer transition-shadow hover:shadow-md", active && ACTIVE_CLASS, className),
+			className: cn(CARD_CLASS, appearance === "proposal" && "border-dashed", "cursor-pointer hover:shadow-md", active && ACTIVE_CLASS, className),
 			onClick: containedEventHandler(onOpen),
 			onKeyDown: (event) => {
 				if (event.key !== "Enter" && event.key !== " ") return;

package/dist/kanban/column-band-header.js

@@ -22,7 +22,7 @@ const KanbanColumnBandHeader = ({ title, swatch, meta, collapsed, compact = coll
 	children: [/* @__PURE__ */ jsx("button", {
 		"aria-expanded": !collapsed,
 		"aria-label": toggleLabel,
-		className: cn("hover:bg-muted/60 text-muted-foreground hover:text-foreground flex size-7 shrink-0 items-center justify-center rounded-md transition-[background-color]", KANBAN_CHROME_TOGGLE_COARSE_TARGET_CLASS),
+		className: cn("hover:bg-muted/60 text-muted-foreground hover:text-foreground flex size-7 shrink-0 items-center justify-center rounded-md", KANBAN_CHROME_TOGGLE_COARSE_TARGET_CLASS),
 		onClick: (event) => onCollapsedChange(!collapsed, { viaPointer: event.detail > 0 }),
 		title: toggleLabel,
 		type: "button",

package/dist/kanban/subgroup-board.js

@@ -359,7 +359,7 @@ const KanbanSubgroupBoard = ({ scrollRef, matrix, renderColumnHeader, renderLane
 								"data-kanban-lane-identity": "",
 								children: /* @__PURE__ */ jsxs("button", {
 									"aria-expanded": !collapsed,
-									className: cn("hover:bg-muted/60 flex items-center gap-2 rounded-lg px-2 text-start text-sm font-medium transition-[background-color]", "h-9", KANBAN_CHROME_TOGGLE_COARSE_TARGET_CLASS),
+									className: cn("hover:bg-muted/60 flex items-center gap-2 rounded-lg px-2 text-start text-sm font-medium", "h-9", KANBAN_CHROME_TOGGLE_COARSE_TARGET_CLASS),
 									onClick: () => setLaneCollapsed(group, count, !collapsed),
 									type: "button",
 									children: [

package/dist/kanban/virtual-cell.js

@@ -128,7 +128,7 @@ const KanbanVirtualCell = ({ rows, getRowKey, renderRow, pagination, sortable, c
 		})
 	}) : null;
 	const content = /* @__PURE__ */ jsxs("div", {
-		className: cn(KANBAN_CELL_SURFACE_CLASS, "min-h-20 rounded-xl p-2 transition-[background-color,outline-color]", rows.length === 0 ? "overflow-visible" : "max-h-[min(60vh,40rem)] overflow-y-auto overscroll-y-contain", active && accentVariants === void 0 && "bg-primary/5 ring-primary/50 ring-2", className),
+		className: cn(KANBAN_CELL_SURFACE_CLASS, "min-h-20 rounded-xl p-2", rows.length === 0 ? "overflow-visible" : "max-h-[min(60vh,40rem)] overflow-y-auto overscroll-y-contain", active && accentVariants === void 0 && "bg-primary/5 ring-primary/50 ring-2", className),
 		"data-kanban-cell": sortable?.dropTarget.id,
 		"data-kanban-cell-accent": accentVariants === void 0 ? void 0 : "true",
 		onScroll: handleScroll,

package/dist/lib/control-size.d.ts

@@ -5,6 +5,6 @@ declare const CONTROL_SIZE: Readonly<{
   readonly lg: "lg";
 }>;
 type ControlSize = (typeof CONTROL_SIZE)[keyof typeof CONTROL_SIZE];
-declare const CONTROL_SIZES: readonly ("default" | "sm" | "lg")[];
+declare const CONTROL_SIZES: readonly ("default" | "lg" | "sm")[];
 //#endregion
 export { CONTROL_SIZE, CONTROL_SIZES, type ControlSize };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stll/ui",
-  "version": "0.34.5",
+  "version": "0.34.6",
   "description": "Stella's design system: bidi-aware React primitives built on Base UI, the dockable inspector pane, and the Tailwind v4 theme they are styled with.",
   "keywords": [
     "base-ui",