@urbicon-ui/blocks 6.2.0 → 6.3.3

package/dist/primitives/Menu/Menu.svelte

@@ -1,7 +1,7 @@
 <script lang="ts" generics="TItem extends MenuItemType = MenuItemType">
   import { useBlocksI18n } from '../..';
-  import { getBlocksConfig, mergeSlotClasses, resolvePresetSlotClasses } from '../../provider';
-  import { Button, menuVariants } from '..';
+  import { getBlocksConfig, resolveSlotClasses } from '../../provider';
+  import { Button, menuVariants, type MenuVariants } from '..';
   import { resolveIcon } from '../../icons';
   import ChevronDownIconDefault from '../../icons/ChevronDownIcon.svelte';
   import { getTierContext } from '../../utils/tier-context';
@@ -52,13 +52,6 @@
 
   const blocksConfig = getBlocksConfig();
   const unstyled = $derived(unstyledProp || blocksConfig?.unstyled || false);
-  const slotClasses = $derived(
-    mergeSlotClasses(
-      blocksConfig?.defaults?.Menu?.slotClasses,
-      resolvePresetSlotClasses(blocksConfig?.presets, 'Menu', preset),
-      slotClassesProp
-    )
-  );
 
   const propsId = $props.id();
   const rootId = $derived(idProp ?? `menu-${propsId}`);
@@ -230,20 +223,27 @@
     return 'md';
   }
 
-  const styles = $derived(
-    menuVariants({
-      open,
-      itemSize: itemSizeForDepth(0),
-      syncWidth,
-      placement,
-      chevronAnimation,
-      usePortal,
-      // Drives the floating panel's corner radius via the `tier` axis on
-      // menuVariants — keeps the panel visually attached to its trigger
-      // (e.g. pill trigger → rounded-lg panel instead of near-flat
-      // rounded-contain).
-      tier: effectiveTier
-    })
+  // Variant props feed both the tv() style computation and the slot-class
+  // cascade — extracted into one derived so `resolveSlotClasses` can match
+  // conditional `overrides` against the menu's active variants.
+  const variantProps: MenuVariants = $derived({
+    open,
+    itemSize: itemSizeForDepth(0),
+    syncWidth,
+    placement,
+    chevronAnimation,
+    usePortal,
+    // Drives the floating panel's corner radius via the `tier` axis on
+    // menuVariants — keeps the panel visually attached to its trigger
+    // (e.g. pill trigger → rounded-lg panel instead of near-flat
+    // rounded-contain).
+    tier: effectiveTier
+  });
+
+  const styles = $derived(menuVariants(variantProps));
+
+  const slotClasses = $derived(
+    resolveSlotClasses(blocksConfig, 'Menu', preset, variantProps, slotClassesProp)
   );
 
   const ctx: MenuContext = {

package/dist/primitives/Menu/Menu.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { MenuItemType, MenuProps } from './index';
+import type { MenuItemType, MenuProps } from './index.js';
 declare function $$render<TItem extends MenuItemType = MenuItemType>(): {
     props: MenuProps<TItem>;
     exports: {};

package/dist/primitives/Menu/MenuSubmenu.svelte.d.ts

@@ -1,5 +1,5 @@
 import type { Snippet } from 'svelte';
-import type { MenuItemType } from './index';
+import type { MenuItemType } from './index.js';
 type $$ComponentProps = {
     /** Stable id for sub-menu bookkeeping. */
     id: string;

package/dist/primitives/Menu/index.d.ts

@@ -1,10 +1,11 @@
 import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
-import type { MintProp } from '../../mint';
-import type { ButtonVariants, MenuVariants } from '..';
-import type { AnimationProps } from '../../utils';
-import type { Placement } from '../../utils/floating';
-import type { InteractiveTier } from '../../utils/tier-context';
+import type { MintProp } from '../../mint/index.js';
+import type { ButtonVariants, MenuVariants } from '../index.js';
+import type { AnimationProps } from '../../utils/index.js';
+import type { Placement } from '../../utils/floating.js';
+import type { InteractiveTier } from '../../utils/tier-context.js';
+import type { MenuSlots } from './menu.variants.js';
 /**
  * @description Action menu (`role="menu"`) triggered by a button. Items are
  * verbs the user can invoke — Edit, Delete, Share, Export — and dispatch an
@@ -69,8 +70,10 @@ export interface MenuSpecificProps<TItem extends MenuItemType = MenuItemType> {
     unstyled?: boolean;
     /**
      * Per-slot class overrides merged with tailwind-variants styles.
+     * Slots: base | trigger | triggerText | chevron | content | header | section |
+     * divider | items | item | indicator | submenu | footer
      */
-    slotClasses?: Partial<Record<'base' | 'trigger' | 'triggerText' | 'chevron' | 'content' | 'header' | 'section' | 'divider' | 'items' | 'item' | 'indicator' | 'submenu' | 'footer', string>>;
+    slotClasses?: Partial<Record<MenuSlots, string>>;
     /**
      * Apply a named preset registered via `<BlocksProvider presets={{ Menu: {...} }}>`.
      * Prefer this over `class` overrides when the requested look falls outside the
@@ -275,5 +278,5 @@ export { default as MenuDivider } from './MenuDivider.svelte';
 export { default as MenuItem } from './MenuItem.svelte';
 export { default as MenuSection } from './MenuSection.svelte';
 export { default as MenuSubmenu } from './MenuSubmenu.svelte';
-export type { MenuContext, MenuRegistryItem } from './menu.context';
-export { type MenuIconVariants, type MenuVariants, menuIconVariants, menuVariants } from './menu.variants';
+export type { MenuContext, MenuRegistryItem } from './menu.context.js';
+export { type MenuIconVariants, type MenuVariants, menuIconVariants, menuVariants } from './menu.variants.js';

package/dist/primitives/Menu/index.js

@@ -3,4 +3,4 @@ export { default as MenuDivider } from './MenuDivider.svelte';
 export { default as MenuItem } from './MenuItem.svelte';
 export { default as MenuSection } from './MenuSection.svelte';
 export { default as MenuSubmenu } from './MenuSubmenu.svelte';
-export { menuIconVariants, menuVariants } from './menu.variants';
+export { menuIconVariants, menuVariants } from './menu.variants.js';

package/dist/primitives/Menu/menu.context.d.ts

@@ -1,5 +1,5 @@
-import type { ButtonVariants } from '../Button/button.variants';
-import type { MenuVariants } from './menu.variants';
+import type { ButtonVariants } from '../Button/button.variants.js';
+import type { MenuVariants } from './menu.variants.js';
 /**
  * Registration entry for a declarative MenuItem.
  * Used internally to support sub-menu nesting bookkeeping.
@@ -15,11 +15,11 @@ export type MenuContext = {
     rootId: string;
     size: MenuVariants['itemSize'];
     intent: ButtonVariants['intent'];
-    mint: import('../../mint').MintProp | undefined;
+    mint: import('../../mint/index.js').MintProp | undefined;
     disabled: boolean;
     unstyled?: boolean;
     slotClasses?: Partial<Record<'base' | 'trigger' | 'triggerText' | 'chevron' | 'content' | 'header' | 'section' | 'divider' | 'items' | 'item' | 'indicator' | 'submenu' | 'footer', string>>;
-    styles: ReturnType<typeof import('./menu.variants').menuVariants>;
+    styles: ReturnType<typeof import('./menu.variants.js').menuVariants>;
     /**
      * Called by an item after its `onSelect` callback has fired. Closes the
      * menu and restores focus to the trigger unless `keepOpen` is true.

package/dist/primitives/Menu/menu.context.js

@@ -1,5 +1,5 @@
 import { createContext } from 'svelte';
-import { createOptionalContext } from '../../utils/optional-context';
+import { createOptionalContext } from '../../utils/optional-context.js';
 const [getMenuContext, setMenuContext] = createContext();
 export { getMenuContext, setMenuContext };
 // MenuParentId is *optional* — only MenuSubmenu sets it. Top-level

package/dist/primitives/Menu/menu.variants.d.ts

@@ -1,5 +1,5 @@
-import { type VariantProps } from '../../utils/variants';
-export declare const menuVariants: (props?: import("../../utils/variants").TVProps<{
+import { type SlotNames, type VariantProps } from '../../utils/variants.js';
+export declare const menuVariants: (props?: import("../../utils/variants.js").TVProps<{
     open: {
         true: {
             base: string;
@@ -234,7 +234,7 @@ export declare const menuVariants: (props?: import("../../utils/variants").TVPro
         className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
     }) | undefined) => string;
 };
-export declare const menuIconVariants: (props?: import("../../utils/variants").TVProps<{
+export declare const menuIconVariants: (props?: import("../../utils/variants.js").TVProps<{
     type: {
         chevron: string;
         checkmark: string;
@@ -242,3 +242,5 @@ export declare const menuIconVariants: (props?: import("../../utils/variants").T
 }> | undefined) => string;
 export type MenuVariants = VariantProps<typeof menuVariants>;
 export type MenuIconVariants = VariantProps<typeof menuIconVariants>;
+/** Slot names derived from the tv() config — single source of truth for slotClasses. */
+export type MenuSlots = SlotNames<typeof menuVariants>;

package/dist/primitives/Menu/menu.variants.js

@@ -1,4 +1,4 @@
-import { tv } from '../../utils/variants';
+import { tv } from '../../utils/variants.js';
 export const menuVariants = tv({
     slots: {
         base: ['relative inline-block'],

package/dist/primitives/Pagination/Pagination.svelte

@@ -1,8 +1,9 @@
 <script lang="ts">
   import PaginationItem from './PaginationItem.svelte';
   import { useBlocksI18n } from '../..';
-  import { getBlocksConfig, mergeSlotClasses, resolvePresetSlotClasses } from '../../provider';
+  import { getBlocksConfig, resolveSlotClasses } from '../../provider';
   import { paginationVariants } from '..';
+  import type { PaginationVariants } from './pagination.variants';
   import { MediaQuery } from 'svelte/reactivity';
   import { computeEllipsisState, computeVisiblePageNumbers } from './pagination.engine';
   import type { PaginationProps } from '.';
@@ -49,21 +50,18 @@
 
   const blocksConfig = getBlocksConfig();
   const unstyled = $derived(unstyledProp || blocksConfig?.unstyled || false);
-  const slotClasses = $derived(
-    mergeSlotClasses(
-      blocksConfig?.defaults?.Pagination?.slotClasses,
-      resolvePresetSlotClasses(blocksConfig?.presets, 'Pagination', preset),
-      slotClassesProp
-    )
-  );
 
-  const styles = $derived(
-    paginationVariants({
-      layout,
-      size,
-      disabled,
-      loading
-    })
+  const variantProps: PaginationVariants = $derived({
+    layout,
+    size,
+    disabled,
+    loading
+  });
+
+  const styles = $derived(paginationVariants(variantProps));
+
+  const slotClasses = $derived(
+    resolveSlotClasses(blocksConfig, 'Pagination', preset, variantProps, slotClassesProp)
   );
 
   // Calculate pagination info for table layout
@@ -264,7 +262,11 @@
     </div>
   {:else}
     <!-- Default Layout: Full pagination -->
-    <div class={styles.controls()}>
+    <div
+      class={unstyled
+        ? (slotClasses?.controls ?? '')
+        : styles.controls({ class: slotClasses?.controls })}
+    >
       {#if showFirstLast && !isFirstPage && showStartEllipsis}
         <PaginationItem
           {size}

package/dist/primitives/Pagination/Pagination.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { PaginationProps } from '.';
+import type { PaginationProps } from './index.js';
 declare const Pagination: import("svelte").Component<PaginationProps, {}, "">;
 type Pagination = ReturnType<typeof Pagination>;
 export default Pagination;

package/dist/primitives/Pagination/PaginationItem.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { PaginationItemProps } from '.';
+import type { PaginationItemProps } from './index.js';
 declare const PaginationItem: import("svelte").Component<PaginationItemProps, {}, "">;
 type PaginationItem = ReturnType<typeof PaginationItem>;
 export default PaginationItem;

package/dist/primitives/Pagination/index.d.ts

@@ -1,8 +1,8 @@
 import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
-import type { MintProp } from '../../mint';
-import type { InteractiveTier } from '../../utils/tier-context';
-import type { PaginationVariants } from './pagination.variants';
+import type { MintProp } from '../../mint/index.js';
+import type { InteractiveTier } from '../../utils/tier-context.js';
+import type { PaginationSlots, PaginationVariants } from './pagination.variants.js';
 export interface PaginationPageItem {
     label: string;
     value: number;
@@ -90,7 +90,7 @@ export interface PaginationProps extends Omit<PaginationVariants, 'disabled' | '
     /** Strip all default tailwind-variants classes for a fully custom build. */
     unstyled?: boolean;
     /** Per-slot class overrides merged with (or replacing, when unstyled) tv styles. Slots: base, info, controls, ellipsis. */
-    slotClasses?: Partial<Record<'base' | 'info' | 'controls' | 'ellipsis', string>>;
+    slotClasses?: Partial<Record<PaginationSlots, string>>;
     /**
      * Apply a named preset registered via `<BlocksProvider presets={{ Pagination: {...} }}>`.
      * Prefer this over `class` overrides when the requested look falls outside the
@@ -141,4 +141,4 @@ export interface PaginationItemProps extends Omit<HTMLAttributes<HTMLButtonEleme
 }
 export { default as Pagination } from './Pagination.svelte';
 export { default as PaginationItem } from './PaginationItem.svelte';
-export { type PaginationVariants, paginationVariants } from './pagination.variants';
+export { type PaginationVariants, paginationVariants } from './pagination.variants.js';

package/dist/primitives/Pagination/index.js

@@ -1,3 +1,3 @@
 export { default as Pagination } from './Pagination.svelte';
 export { default as PaginationItem } from './PaginationItem.svelte';
-export { paginationVariants } from './pagination.variants';
+export { paginationVariants } from './pagination.variants.js';

package/dist/primitives/Pagination/pagination.variants.d.ts

@@ -1,5 +1,5 @@
-import { type VariantProps } from '../../utils/variants';
-export declare const paginationVariants: (props?: import("../../utils/variants").TVProps<{
+import { type SlotNames, type VariantProps } from '../../utils/variants.js';
+export declare const paginationVariants: (props?: import("../../utils/variants.js").TVProps<{
     layout: {
         default: {
             base: string;
@@ -79,3 +79,5 @@ export declare const paginationVariants: (props?: import("../../utils/variants")
     }) | undefined) => string;
 };
 export type PaginationVariants = VariantProps<typeof paginationVariants>;
+/** Slot names derived from the tv() config — single source of truth for slotClasses. */
+export type PaginationSlots = SlotNames<typeof paginationVariants>;

package/dist/primitives/Pagination/pagination.variants.js

@@ -1,4 +1,4 @@
-import { tv } from '../../utils/variants';
+import { tv } from '../../utils/variants.js';
 export const paginationVariants = tv({
     slots: {
         base: ['flex items-center w-full', 'gap-1'],

package/dist/primitives/Popover/Popover.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import { untrack } from 'svelte';
-  import { getBlocksConfig, mergeSlotClasses, resolvePresetSlotClasses } from '../../provider';
+  import { getBlocksConfig, resolveSlotClasses } from '../../provider';
   import {
     autoUpdate,
     computePosition,
@@ -51,11 +51,7 @@
   const blocksConfig = getBlocksConfig();
   const unstyled = $derived(unstyledProp || blocksConfig?.unstyled || false);
   const slotClasses = $derived(
-    mergeSlotClasses(
-      blocksConfig?.defaults?.Popover?.slotClasses,
-      resolvePresetSlotClasses(blocksConfig?.presets, 'Popover', preset),
-      slotClassesProp
-    )
+    resolveSlotClasses(blocksConfig, 'Popover', preset, { size }, slotClassesProp)
   );
 
   let internalTriggerElement = $state<HTMLElement | null>(null);

package/dist/primitives/Popover/Popover.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { PopoverProps } from './index';
+import type { PopoverProps } from './index.js';
 declare const Popover: import("svelte").Component<PopoverProps, {}, "triggerElement" | "open">;
 type Popover = ReturnType<typeof Popover>;
 export default Popover;

package/dist/primitives/Popover/index.d.ts

@@ -1,7 +1,7 @@
 import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
-import type { Placement } from '../../utils/floating';
-import type { PopoverVariants } from './popover.variants';
+import type { Placement } from '../../utils/floating.js';
+import type { PopoverVariants } from './popover.variants.js';
 /**
  * @description Floating panel anchored to a trigger element. Uses the native Popover API
  * for top-layer rendering, light dismiss, and Escape handling. Floating UI provides
@@ -111,4 +111,4 @@ export interface PopoverProps extends PopoverVariants, Omit<HTMLAttributes<HTMLD
     preset?: string;
 }
 export { default as Popover } from './Popover.svelte';
-export { type PopoverVariants, popoverVariants } from './popover.variants';
+export { type PopoverVariants, popoverVariants } from './popover.variants.js';

package/dist/primitives/Popover/index.js

@@ -1,2 +1,2 @@
 export { default as Popover } from './Popover.svelte';
-export { popoverVariants } from './popover.variants';
+export { popoverVariants } from './popover.variants.js';

package/dist/primitives/Popover/popover.variants.d.ts

@@ -1,5 +1,5 @@
-import { type VariantProps } from '../../utils/variants';
-export declare const popoverVariants: (props?: import("../../utils/variants").TVProps<{
+import { type VariantProps } from '../../utils/variants.js';
+export declare const popoverVariants: (props?: import("../../utils/variants.js").TVProps<{
     size: {
         sm: string;
         md: string;

package/dist/primitives/Popover/popover.variants.js

@@ -1,4 +1,4 @@
-import { tv } from '../../utils/variants';
+import { tv } from '../../utils/variants.js';
 export const popoverVariants = tv({
     // tier: contain — floating panel surface.
     base: [

package/dist/primitives/Progress/Progress.svelte

@@ -1,8 +1,8 @@
 <script lang="ts">
-  import { getBlocksConfig, mergeSlotClasses, resolvePresetSlotClasses } from '../../provider';
+  import { getBlocksConfig, resolveSlotClasses } from '../../provider';
   import { useBlocksI18n } from '../..';
   import type { ProgressProps } from './index';
-  import { progressVariants } from './progress.variants';
+  import { progressVariants, type ProgressVariants } from './progress.variants';
 
   const bt = useBlocksI18n();
 
@@ -30,13 +30,6 @@
 
   const blocksConfig = getBlocksConfig();
   const unstyled = $derived(unstyledProp || blocksConfig?.unstyled || false);
-  const slotClasses = $derived(
-    mergeSlotClasses(
-      blocksConfig?.defaults?.Progress?.slotClasses,
-      resolvePresetSlotClasses(blocksConfig?.presets, 'Progress', preset),
-      slotClassesProp
-    )
-  );
 
   const isIndeterminate = $derived(indeterminateProp || value === undefined);
   const clampedValue = $derived(value !== undefined ? Math.min(Math.max(value, min), max) : 0);
@@ -47,14 +40,21 @@
     formatValue ? formatValue(clampedValue, max) : defaultFormat(clampedValue, max)
   );
 
-  const styles = $derived(
-    progressVariants({
-      intent,
-      size,
-      indeterminate: isIndeterminate || undefined,
-      striped: striped || undefined,
-      animated: animated || undefined
-    })
+  // Variant props feed both the tv() style computation and the slot-class
+  // cascade — extracted into one derived so `resolveSlotClasses` can match
+  // conditional `overrides` against the progress bar's active variants.
+  const variantProps: ProgressVariants = $derived({
+    intent,
+    size,
+    indeterminate: isIndeterminate || undefined,
+    striped: striped || undefined,
+    animated: animated || undefined
+  });
+
+  const styles = $derived(progressVariants(variantProps));
+
+  const slotClasses = $derived(
+    resolveSlotClasses(blocksConfig, 'Progress', preset, variantProps, slotClassesProp)
   );
 
   const circularRadius = $derived((circularSize - strokeWidth) / 2);

package/dist/primitives/Progress/Progress.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { ProgressProps } from './index';
+import type { ProgressProps } from './index.js';
 declare const Progress: import("svelte").Component<ProgressProps, {}, "">;
 type Progress = ReturnType<typeof Progress>;
 export default Progress;

package/dist/primitives/Progress/index.d.ts

@@ -1,5 +1,5 @@
 import type { HTMLAttributes } from 'svelte/elements';
-import type { ProgressVariants } from './progress.variants';
+import type { ProgressSlots, ProgressVariants } from './progress.variants.js';
 /**
  * @description Progress indicator for determinate and indeterminate loading states.
  * Supports linear bar and circular ring variants with semantic intents and animation.
@@ -45,8 +45,13 @@ export interface ProgressProps extends ProgressVariants, Omit<HTMLAttributes<HTM
     class?: string;
     /** Remove all default tv() classes. */
     unstyled?: boolean;
-    /** Per-slot class overrides merged with tv() styles. */
-    slotClasses?: Partial<Record<'wrapper' | 'header' | 'label' | 'valueText' | 'track' | 'fill' | 'circularWrapper' | 'circularTrack' | 'circularFill' | 'circularLabel', string>>;
+    /**
+     * Per-slot class overrides merged with tv() styles. Slots: wrapper (linear
+     * root — what `class` targets in linear shape) | header | label | valueText |
+     * track | fill | circularWrapper (circular root — what `class` targets in
+     * circular shape) | circularTrack | circularFill | circularLabel.
+     */
+    slotClasses?: Partial<Record<ProgressSlots, string>>;
     /**
      * Apply a named preset registered via `<BlocksProvider presets={{ Progress: {...} }}>`.
      * Prefer this over `class` overrides when the requested look falls outside the
@@ -56,4 +61,4 @@ export interface ProgressProps extends ProgressVariants, Omit<HTMLAttributes<HTM
     preset?: string;
 }
 export { default as Progress } from './Progress.svelte';
-export { type ProgressVariants, progressVariants } from './progress.variants';
+export { type ProgressVariants, progressVariants } from './progress.variants.js';

package/dist/primitives/Progress/index.js

@@ -1,2 +1,2 @@
 export { default as Progress } from './Progress.svelte';
-export { progressVariants } from './progress.variants';
+export { progressVariants } from './progress.variants.js';

package/dist/primitives/Progress/progress.variants.d.ts

@@ -1,5 +1,5 @@
-import { type VariantProps } from '../../utils/variants';
-export declare const progressVariants: (props?: import("../../utils/variants").TVProps<{
+import { type SlotNames, type VariantProps } from '../../utils/variants.js';
+export declare const progressVariants: (props?: import("../../utils/variants.js").TVProps<{
     intent: {
         primary: {
             fill: string;
@@ -164,3 +164,5 @@ export declare const progressVariants: (props?: import("../../utils/variants").T
     }) | undefined) => string;
 };
 export type ProgressVariants = VariantProps<typeof progressVariants>;
+/** Slot names derived from the `tv()` config above — single source of truth for `slotClasses`. */
+export type ProgressSlots = SlotNames<typeof progressVariants>;

package/dist/primitives/Progress/progress.variants.js

@@ -1,4 +1,4 @@
-import { tv } from '../../utils/variants';
+import { tv } from '../../utils/variants.js';
 export const progressVariants = tv({
     slots: {
         wrapper: ['flex flex-col gap-1.5 w-full'],

package/dist/primitives/RadioGroup/RadioGroup.svelte

@@ -1,9 +1,9 @@
 <script lang="ts">
-  import { getBlocksConfig, mergeSlotClasses, resolvePresetSlotClasses } from '../../provider';
+  import { getBlocksConfig, resolveSlotClasses } from '../../provider';
   import { getTierContext, useFormField } from '../../utils';
   import type { RadioGroupProps } from './index';
   import { setRadioGroupContext } from './radioGroup.context';
-  import { radioGroupVariants } from './radioGroup.variants';
+  import { radioGroupVariants, type RadioGroupVariants } from './radioGroup.variants';
 
   let {
     children,
@@ -40,13 +40,6 @@
 
   const blocksConfig = getBlocksConfig();
   const unstyled = $derived(unstyledProp || blocksConfig?.unstyled || false);
-  const slotClasses = $derived(
-    mergeSlotClasses(
-      blocksConfig?.defaults?.RadioGroup?.slotClasses,
-      resolvePresetSlotClasses(blocksConfig?.presets, 'RadioGroup', preset),
-      slotClassesProp
-    )
-  );
 
   const groupId = $derived(id || `radiogroup-${propsId}`);
   const labelId = $derived(label ? `${groupId}-label` : undefined);
@@ -59,13 +52,20 @@
     disabled
   }));
 
-  const styles = $derived(
-    radioGroupVariants({
-      orientation,
-      required: required || undefined,
-      error: !!error || undefined,
-      disabled: disabled || undefined
-    })
+  // Variant props feed both the tv() style computation and the slot-class
+  // cascade — extracted into one derived so `resolveSlotClasses` can match
+  // conditional `overrides` against the group's active variants.
+  const variantProps: RadioGroupVariants = $derived({
+    orientation,
+    required: required || undefined,
+    error: !!error || undefined,
+    disabled: disabled || undefined
+  });
+
+  const styles = $derived(radioGroupVariants(variantProps));
+
+  const slotClasses = $derived(
+    resolveSlotClasses(blocksConfig, 'RadioGroup', preset, variantProps, slotClassesProp)
   );
 
   function select(itemValue: string) {

package/dist/primitives/RadioGroup/RadioGroup.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { RadioGroupProps } from './index';
+import type { RadioGroupProps } from './index.js';
 declare const RadioGroup: import("svelte").Component<RadioGroupProps, {}, "value">;
 type RadioGroup = ReturnType<typeof RadioGroup>;
 export default RadioGroup;

package/dist/primitives/RadioGroup/RadioItem.svelte

@@ -1,9 +1,9 @@
 <script lang="ts">
   import { mintRegistry } from '../..';
-  import { getBlocksConfig, mergeSlotClasses, resolvePresetSlotClasses } from '../../provider';
+  import { getBlocksConfig, resolveSlotClasses } from '../../provider';
   import type { RadioItemProps } from './index';
   import { getRadioGroupContext } from './radioGroup.context';
-  import { radioItemVariants } from './radioGroup.variants';
+  import { radioItemVariants, type RadioItemVariants } from './radioGroup.variants';
 
   let {
     value,
@@ -23,13 +23,6 @@
 
   const blocksConfig = getBlocksConfig();
   const unstyled = $derived(unstyledProp || blocksConfig?.unstyled || false);
-  const slotClasses = $derived(
-    mergeSlotClasses(
-      blocksConfig?.defaults?.RadioItem?.slotClasses,
-      resolvePresetSlotClasses(blocksConfig?.presets, 'RadioItem', preset),
-      slotClassesProp
-    )
-  );
 
   const ctx = getRadioGroupContext();
 
@@ -37,16 +30,23 @@
   const isDisabled = $derived(ctx.disabled || disabledProp);
   const dataState = $derived(isChecked ? 'checked' : 'unchecked');
 
-  const styles = $derived(
-    radioItemVariants({
-      size: ctx.size,
-      intent: ctx.intent,
-      variant: ctx.variant,
-      tier: ctx.tier,
-      checked: isChecked,
-      disabled: isDisabled || undefined,
-      error: ctx.error || undefined
-    })
+  // Variant props feed both the tv() style computation and the slot-class
+  // cascade — extracted into one derived so `resolveSlotClasses` can match
+  // conditional `overrides` against the item's active variants.
+  const variantProps: RadioItemVariants = $derived({
+    size: ctx.size,
+    intent: ctx.intent,
+    variant: ctx.variant,
+    tier: ctx.tier,
+    checked: isChecked,
+    disabled: isDisabled || undefined,
+    error: ctx.error || undefined
+  });
+
+  const styles = $derived(radioItemVariants(variantProps));
+
+  const slotClasses = $derived(
+    resolveSlotClasses(blocksConfig, 'RadioItem', preset, variantProps, slotClassesProp)
   );
 
   let controlElement = $state<HTMLElement>();

package/dist/primitives/RadioGroup/RadioItem.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { RadioItemProps } from './index';
+import type { RadioItemProps } from './index.js';
 declare const RadioItem: import("svelte").Component<RadioItemProps, {}, "">;
 type RadioItem = ReturnType<typeof RadioItem>;
 export default RadioItem;