@urbicon-ui/blocks 6.2.0 → 6.3.3

package/dist/components/Guide/GuideArticle.svelte.d.ts

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

package/dist/components/Guide/GuideBeacon.svelte

@@ -1,8 +1,8 @@
 <script lang="ts">
   import { useBlocksI18n } from '../../i18n';
-  import { getBlocksConfig, mergeSlotClasses, resolvePresetSlotClasses } from '../../provider';
+  import { getBlocksConfig, resolveSlotClasses } from '../../provider';
   import { getGuideContext } from './guide.context';
-  import { guideBeaconVariants } from './guide.variants';
+  import { guideBeaconVariants, type GuideBeaconVariants } from './guide.variants';
   import type { GuideBeaconProps } from './index';
 
   const bt = useBlocksI18n();
@@ -30,14 +30,11 @@
 
   const blocksConfig = getBlocksConfig();
   const unstyled = $derived(unstyledProp || blocksConfig?.unstyled || false);
+  const variantProps: GuideBeaconVariants = $derived({ size });
+  const styles = $derived(guideBeaconVariants(variantProps));
   const slotClasses = $derived(
-    mergeSlotClasses(
-      blocksConfig?.defaults?.GuideBeacon?.slotClasses,
-      resolvePresetSlotClasses(blocksConfig?.presets, 'GuideBeacon', preset),
-      slotClassesProp
-    )
+    resolveSlotClasses(blocksConfig, 'GuideBeacon', preset, variantProps, slotClassesProp)
   );
-  const styles = $derived(guideBeaconVariants({ size }));
 
   // Hide once the tour has been seen (gentle, never nags) and while it is running (the
   // tour's own scrim takes over). Both reactive: `hasSeen` reads the controller's seen set,

package/dist/components/Guide/GuideBeacon.svelte.d.ts

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

package/dist/components/Guide/GuideHint.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
   import { useBlocksI18n } from '../../i18n';
   import { CloseIcon } from '../../icons';
-  import { getBlocksConfig, mergeSlotClasses, resolvePresetSlotClasses } from '../../provider';
+  import { getBlocksConfig, resolveSlotClasses } from '../../provider';
   import {
     computePosition,
     autoUpdate,
@@ -12,7 +12,7 @@
   } from '../../utils/floating';
   import { observeTargetResolution } from '../../utils/observe-target';
   import { getGuideContext } from './guide.context';
-  import { guideHintVariants } from './guide.variants';
+  import { guideHintVariants, type GuideHintVariants } from './guide.variants';
   import type { GuideHintProps } from './index';
 
   const bt = useBlocksI18n();
@@ -45,14 +45,11 @@
 
   const blocksConfig = getBlocksConfig();
   const unstyled = $derived(unstyledProp || blocksConfig?.unstyled || false);
+  const variantProps: GuideHintVariants = $derived({});
+  const styles = $derived(guideHintVariants(variantProps));
   const slotClasses = $derived(
-    mergeSlotClasses(
-      blocksConfig?.defaults?.GuideHint?.slotClasses,
-      resolvePresetSlotClasses(blocksConfig?.presets, 'GuideHint', preset),
-      slotClassesProp
-    )
+    resolveSlotClasses(blocksConfig, 'GuideHint', preset, variantProps, slotClassesProp)
   );
-  const styles = $derived(guideHintVariants());
 
   const seenId = $derived(seenIdProp ?? topicId);
 

package/dist/components/Guide/GuideHint.svelte.d.ts

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

package/dist/components/Guide/GuideMarker.svelte

@@ -1,9 +1,9 @@
 <script lang="ts">
   import { useBlocksI18n } from '../../i18n';
   import { InfoCircleIcon } from '../../icons';
-  import { getBlocksConfig, mergeSlotClasses, resolvePresetSlotClasses } from '../../provider';
+  import { getBlocksConfig, resolveSlotClasses } from '../../provider';
   import { getGuideContext } from './guide.context';
-  import { guideMarkerVariants } from './guide.variants';
+  import { guideMarkerVariants, type GuideMarkerVariants } from './guide.variants';
   import type { GuideMarkerProps } from './index';
 
   const bt = useBlocksI18n();
@@ -32,14 +32,11 @@
 
   const blocksConfig = getBlocksConfig();
   const unstyled = $derived(unstyledProp || blocksConfig?.unstyled || false);
+  const variantProps: GuideMarkerVariants = $derived({ size });
+  const styles = $derived(guideMarkerVariants(variantProps));
   const slotClasses = $derived(
-    mergeSlotClasses(
-      blocksConfig?.defaults?.GuideMarker?.slotClasses,
-      resolvePresetSlotClasses(blocksConfig?.presets, 'GuideMarker', preset),
-      slotClassesProp
-    )
+    resolveSlotClasses(blocksConfig, 'GuideMarker', preset, variantProps, slotClassesProp)
   );
-  const styles = $derived(guideMarkerVariants({ size }));
 
   // A Marker is the UI→Guide affordance; it is live unless the resolved direction
   // is 'to-ui' only. With no `for` there is no topic to gate on (the prop wins).

package/dist/components/Guide/GuideMarker.svelte.d.ts

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

package/dist/components/Guide/GuideMention.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
-  import { getBlocksConfig, mergeSlotClasses, resolvePresetSlotClasses } from '../../provider';
+  import { getBlocksConfig, resolveSlotClasses } from '../../provider';
   import { getGuideContext } from './guide.context';
-  import { guideMentionVariants } from './guide.variants';
+  import { guideMentionVariants, type GuideMentionVariants } from './guide.variants';
   import type { GuideMentionProps } from './index';
 
   let {
@@ -26,14 +26,11 @@
 
   const blocksConfig = getBlocksConfig();
   const unstyled = $derived(unstyledProp || blocksConfig?.unstyled || false);
+  const variantProps: GuideMentionVariants = $derived({});
+  const styles = $derived(guideMentionVariants(variantProps));
   const slotClasses = $derived(
-    mergeSlotClasses(
-      blocksConfig?.defaults?.GuideMention?.slotClasses,
-      resolvePresetSlotClasses(blocksConfig?.presets, 'GuideMention', preset),
-      slotClassesProp
-    )
+    resolveSlotClasses(blocksConfig, 'GuideMention', preset, variantProps, slotClassesProp)
   );
-  const styles = $derived(guideMentionVariants());
 
   // A Mention is the Guide→UI affordance; it is interactive unless the resolved
   // direction is 'to-guide' only (then it degrades to plain inline text).

package/dist/components/Guide/GuideMention.svelte.d.ts

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

package/dist/components/Guide/GuidePanel.svelte

@@ -3,10 +3,10 @@
   import { SvelteMap } from 'svelte/reactivity';
   import { useBlocksI18n } from '../../i18n';
   import { CloseIcon, ChevronLeftIcon, ChevronRightIcon } from '../../icons';
-  import { getBlocksConfig, mergeSlotClasses, resolvePresetSlotClasses } from '../../provider';
+  import { getBlocksConfig, resolveSlotClasses } from '../../provider';
   import { getGuideContext } from './guide.context';
   import { setGuidePanelContext } from './guide-panel.context';
-  import { guidePanelVariants } from './guide.variants';
+  import { guidePanelVariants, type GuidePanelVariants } from './guide.variants';
   import type { GuidePanelProps } from './index';
 
   const bt = useBlocksI18n();
@@ -54,14 +54,11 @@
 
   const blocksConfig = getBlocksConfig();
   const unstyled = $derived(unstyledProp || blocksConfig?.unstyled || false);
+  const variantProps: GuidePanelVariants = $derived({ placement, size });
+  const styles = $derived(guidePanelVariants(variantProps));
   const slotClasses = $derived(
-    mergeSlotClasses(
-      blocksConfig?.defaults?.GuidePanel?.slotClasses,
-      resolvePresetSlotClasses(blocksConfig?.presets, 'GuidePanel', preset),
-      slotClassesProp
-    )
+    resolveSlotClasses(blocksConfig, 'GuidePanel', preset, variantProps, slotClassesProp)
   );
-  const styles = $derived(guidePanelVariants({ placement, size }));
 
   const open = $derived(guide?.panelOpen ?? false);
   const activeArticle = $derived(guide?.activeArticle ?? null);

package/dist/components/Guide/GuidePanel.svelte.d.ts

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

package/dist/components/Guide/GuideProvider.svelte.d.ts

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

package/dist/components/Guide/guide-panel.context.js

@@ -1,3 +1,3 @@
-import { createOptionalContext } from '../../utils';
+import { createOptionalContext } from '../../utils/index.js';
 const [getGuidePanelContext, setGuidePanelContext] = createOptionalContext();
 export { getGuidePanelContext, setGuidePanelContext };

package/dist/components/Guide/guide.context.d.ts

@@ -1,4 +1,4 @@
-import { type GuideController } from '../../utils';
+import { type GuideController } from '../../utils/index.js';
 /**
  * Optional context for the Guide system. Surfaces read the controller via
  * {@link getGuideContext}; it returns `undefined` when no `GuideProvider` is

package/dist/components/Guide/guide.context.js

@@ -1,4 +1,4 @@
-import { createOptionalContext } from '../../utils';
+import { createOptionalContext } from '../../utils/index.js';
 /**
  * Optional context for the Guide system. Surfaces read the controller via
  * {@link getGuideContext}; it returns `undefined` when no `GuideProvider` is

package/dist/components/Guide/guide.variants.d.ts

@@ -1,11 +1,11 @@
-import { type VariantProps } from '../../utils/variants';
+import { type SlotNames, type VariantProps } from '../../utils/variants.js';
 /**
  * Styling for the non-modal `GuidePanel` (D1). Mirrors the `Drawer` look
  * (surface-overlay, hairline border, lg shadow) but sits at `--z-sidebar`
  * (1350) and slides in without a backdrop, so the app stays interactive
  * behind it — required for the Mention→UI link (Direction B).
  */
-export declare const guidePanelVariants: (props?: import("../../utils/variants").TVProps<{
+export declare const guidePanelVariants: (props?: import("../../utils/variants.js").TVProps<{
     placement: {
         left: {
             panel: string;
@@ -94,7 +94,7 @@ export declare const guidePanelVariants: (props?: import("../../utils/variants")
  * Styling for a `GuideArticle` body. Light prose defaults; consumers style
  * their own content via the article snippet and `slotClasses`.
  */
-export declare const guideArticleVariants: (props?: import("../../utils/variants").TVProps<{}> | undefined) => {
+export declare const guideArticleVariants: (props?: import("../../utils/variants.js").TVProps<{}> | undefined) => {
     article: (props?: ({} & {
         class?: 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;
         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;
@@ -105,7 +105,7 @@ export declare const guideArticleVariants: (props?: import("../../utils/variants
  * icon button — intentionally low-key (tertiary text, primary on
  * hover/focus) so it reads as an affordance, not a status `Badge`.
  */
-export declare const guideMarkerVariants: (props?: import("../../utils/variants").TVProps<{
+export declare const guideMarkerVariants: (props?: import("../../utils/variants.js").TVProps<{
     size: {
         sm: {
             icon: string;
@@ -134,7 +134,7 @@ export declare const guideMarkerVariants: (props?: import("../../utils/variants"
  * goes solid on hover/focus. Resets the native button box so it flows with the
  * surrounding text and wraps naturally.
  */
-export declare const guideMentionVariants: (props?: import("../../utils/variants").TVProps<{}> | undefined) => {
+export declare const guideMentionVariants: (props?: import("../../utils/variants.js").TVProps<{}> | undefined) => {
     mention: (props?: ({} & {
         class?: 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;
         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;
@@ -147,7 +147,7 @@ export declare const guideMentionVariants: (props?: import("../../utils/variants
  * box) from being clipped by the UA `[popover]` default. Position + inset are
  * set inline in the component, as for `Tooltip`.
  */
-export declare const guideHintVariants: (props?: import("../../utils/variants").TVProps<{}> | undefined) => {
+export declare const guideHintVariants: (props?: import("../../utils/variants.js").TVProps<{}> | undefined) => {
     hint: (props?: ({} & {
         class?: 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;
         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;
@@ -178,7 +178,7 @@ export declare const guideHintVariants: (props?: import("../../utils/variants").
  * but is a focusable `role="dialog"` with a step footer. Position + inset are set
  * inline in the component, as for `GuideHint`/`Tooltip`.
  */
-export declare const guideTourVariants: (props?: import("../../utils/variants").TVProps<{}> | undefined) => {
+export declare const guideTourVariants: (props?: import("../../utils/variants.js").TVProps<{}> | undefined) => {
     container: (props?: ({} & {
         class?: 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;
         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;
@@ -238,7 +238,7 @@ export declare const guideTourVariants: (props?: import("../../utils/variants").
  * `dot`; the consumer positions it (inline, or absolutely over a feature corner).
  * The pulse is pure CSS and halts under `prefers-reduced-motion` (static dot).
  */
-export declare const guideBeaconVariants: (props?: import("../../utils/variants").TVProps<{
+export declare const guideBeaconVariants: (props?: import("../../utils/variants.js").TVProps<{
     size: {
         sm: {
             beacon: string;
@@ -276,3 +276,11 @@ export type GuideArticleVariants = VariantProps<typeof guideArticleVariants>;
 export type GuideMarkerVariants = VariantProps<typeof guideMarkerVariants>;
 export type GuideMentionVariants = VariantProps<typeof guideMentionVariants>;
 export type GuideHintVariants = VariantProps<typeof guideHintVariants>;
+/** Slot names derived from each `tv()` config — single source of truth for `slotClasses`. */
+export type GuidePanelSlots = SlotNames<typeof guidePanelVariants>;
+export type GuideTourSlots = SlotNames<typeof guideTourVariants>;
+export type GuideBeaconSlots = SlotNames<typeof guideBeaconVariants>;
+export type GuideArticleSlots = SlotNames<typeof guideArticleVariants>;
+export type GuideMarkerSlots = SlotNames<typeof guideMarkerVariants>;
+export type GuideMentionSlots = SlotNames<typeof guideMentionVariants>;
+export type GuideHintSlots = SlotNames<typeof guideHintVariants>;

package/dist/components/Guide/guide.variants.js

@@ -1,4 +1,4 @@
-import { tv } from '../../utils/variants';
+import { tv } from '../../utils/variants.js';
 /**
  * Styling for the non-modal `GuidePanel` (D1). Mirrors the `Drawer` look
  * (surface-overlay, hairline border, lg shadow) but sits at `--z-sidebar`

package/dist/components/Guide/index.d.ts

@@ -1,6 +1,6 @@
 import type { Snippet } from 'svelte';
-import type { GuideController, GuideDirection, GuideStorageAdapter, GuideTour, Placement } from '../../utils';
-import type { GuideBeaconVariants, GuideMarkerVariants, GuidePanelVariants } from './guide.variants';
+import type { GuideController, GuideDirection, GuideStorageAdapter, GuideTour, Placement } from '../../utils/index.js';
+import type { GuideArticleSlots, GuideBeaconSlots, GuideBeaconVariants, GuideHintSlots, GuideMarkerSlots, GuideMarkerVariants, GuideMentionSlots, GuidePanelSlots, GuidePanelVariants, GuideTourSlots } from './guide.variants.js';
 /**
  * @description Root provider for the Guide help system. Instantiates a `GuideController`
  * and shares it via context with all Guide surfaces (Panel, Marker, Mention, Hint, Tour).
@@ -85,7 +85,7 @@ export interface GuidePanelProps {
     /** Strip all default styles. @default false */
     unstyled?: boolean;
     /** Per-slot class overrides. */
-    slotClasses?: Partial<Record<'panel' | 'header' | 'backButton' | 'title' | 'closeButton' | 'body' | 'list' | 'listItem' | 'footer', string>>;
+    slotClasses?: Partial<Record<GuidePanelSlots, string>>;
     /** Apply a named preset registered via `<BlocksProvider presets={{ GuidePanel: {...} }}>`. */
     preset?: string;
 }
@@ -118,7 +118,7 @@ export interface GuideArticleProps {
     /** Strip all default styles. @default false */
     unstyled?: boolean;
     /** Per-slot class overrides. */
-    slotClasses?: Partial<Record<'article', string>>;
+    slotClasses?: Partial<Record<GuideArticleSlots, string>>;
     /** Apply a named preset registered via `<BlocksProvider presets={{ GuideArticle: {...} }}>`. */
     preset?: string;
 }
@@ -169,7 +169,7 @@ export interface GuideMarkerProps {
     /** Strip all default styles. @default false */
     unstyled?: boolean;
     /** Per-slot class overrides. */
-    slotClasses?: Partial<Record<'marker' | 'icon', string>>;
+    slotClasses?: Partial<Record<GuideMarkerSlots, string>>;
     /** Apply a named preset registered via `<BlocksProvider presets={{ GuideMarker: {...} }}>`. */
     preset?: string;
 }
@@ -212,7 +212,7 @@ export interface GuideMentionProps {
     /** Strip all default styles. @default false */
     unstyled?: boolean;
     /** Per-slot class overrides. */
-    slotClasses?: Partial<Record<'mention', string>>;
+    slotClasses?: Partial<Record<GuideMentionSlots, string>>;
     /** Apply a named preset registered via `<BlocksProvider presets={{ GuideMention: {...} }}>`. */
     preset?: string;
 }
@@ -283,7 +283,7 @@ export interface GuideHintProps {
     /** Strip all default styles. @default false */
     unstyled?: boolean;
     /** Per-slot class overrides. */
-    slotClasses?: Partial<Record<'hint' | 'title' | 'body' | 'dismiss' | 'arrow', string>>;
+    slotClasses?: Partial<Record<GuideHintSlots, string>>;
     /** Apply a named preset registered via `<BlocksProvider presets={{ GuideHint: {...} }}>`. */
     preset?: string;
 }
@@ -342,8 +342,11 @@ export interface GuideProps {
     class?: string;
     /** Strip all default styles. @default false */
     unstyled?: boolean;
-    /** Per-slot class overrides. */
-    slotClasses?: Partial<Record<'container' | 'scrim' | 'bubble' | 'arrow' | 'title' | 'body' | 'progress' | 'dots' | 'dot' | 'dotActive' | 'stepText' | 'footer' | 'spacer' | 'skip' | 'prev' | 'next', string>>;
+    /**
+     * Per-slot class overrides. Beyond the tour's own `tv()` slots, `skip` / `prev` / `next`
+     * forward to the footer's nested `<Button>`s (which own their internal markup).
+     */
+    slotClasses?: Partial<Record<GuideTourSlots | 'skip' | 'prev' | 'next', string>>;
     /** Apply a named preset registered via `<BlocksProvider presets={{ Guide: {...} }}>`. */
     preset?: string;
 }
@@ -394,7 +397,7 @@ export interface GuideBeaconProps {
     /** Strip all default styles. @default false */
     unstyled?: boolean;
     /** Per-slot class overrides. */
-    slotClasses?: Partial<Record<'beacon' | 'ping' | 'dot', string>>;
+    slotClasses?: Partial<Record<GuideBeaconSlots, string>>;
     /** Apply a named preset registered via `<BlocksProvider presets={{ GuideBeacon: {...} }}>`. */
     preset?: string;
 }
@@ -406,4 +409,4 @@ export { default as GuideMarker } from './GuideMarker.svelte';
 export { default as GuideMention } from './GuideMention.svelte';
 export { default as GuidePanel } from './GuidePanel.svelte';
 export { default as GuideProvider } from './GuideProvider.svelte';
-export { type GuideArticleVariants, type GuideBeaconVariants, type GuideHintVariants, type GuideMarkerVariants, type GuideMentionVariants, type GuidePanelVariants, type GuideTourVariants, guideArticleVariants, guideBeaconVariants, guideHintVariants, guideMarkerVariants, guideMentionVariants, guidePanelVariants, guideTourVariants } from './guide.variants';
+export { type GuideArticleVariants, type GuideBeaconVariants, type GuideHintVariants, type GuideMarkerVariants, type GuideMentionVariants, type GuidePanelVariants, type GuideTourVariants, guideArticleVariants, guideBeaconVariants, guideHintVariants, guideMarkerVariants, guideMentionVariants, guidePanelVariants, guideTourVariants } from './guide.variants.js';

package/dist/components/Guide/index.js

@@ -6,7 +6,7 @@ export { default as GuideMarker } from './GuideMarker.svelte';
 export { default as GuideMention } from './GuideMention.svelte';
 export { default as GuidePanel } from './GuidePanel.svelte';
 export { default as GuideProvider } from './GuideProvider.svelte';
-export { guideArticleVariants, guideBeaconVariants, guideHintVariants, guideMarkerVariants, guideMentionVariants, guidePanelVariants, guideTourVariants } from './guide.variants';
+export { guideArticleVariants, guideBeaconVariants, guideHintVariants, guideMarkerVariants, guideMentionVariants, guidePanelVariants, guideTourVariants } from './guide.variants.js';
 // Note: getGuideContext/setGuideContext are intentionally NOT re-exported here.
 // They are an internal wiring seam — surfaces import them directly from
 // './guide.context' (mirrors Tab/Icon, which keep their context helpers private).

package/dist/components/LineChart/LineChart.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-  import { getBlocksConfig, mergeSlotClasses, resolvePresetSlotClasses } from '../../provider';
+  import { getBlocksConfig, resolveSlotClasses } from '../../provider';
   import type { LineChartProps } from './index';
   import type { ChartSeries } from '../../internal/charts/types';
   import { chartSlotResolver } from '../../internal/charts/variants';
@@ -37,11 +37,7 @@
   const blocksConfig = getBlocksConfig();
   const unstyled = $derived(unstyledProp || blocksConfig?.unstyled || false);
   const slotClasses = $derived(
-    mergeSlotClasses(
-      blocksConfig?.defaults?.LineChart?.slotClasses,
-      resolvePresetSlotClasses(blocksConfig?.presets, 'LineChart', preset),
-      slotClassesProp
-    )
+    resolveSlotClasses(blocksConfig, 'LineChart', preset, {}, slotClassesProp)
   );
   const slot = $derived(chartSlotResolver(unstyled, slotClasses));
 

package/dist/components/LineChart/LineChart.svelte.d.ts

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

package/dist/components/LineChart/index.d.ts

@@ -1,5 +1,5 @@
 import type { HTMLAttributes } from 'svelte/elements';
-import type { CartesianDatum, ChartMargin, ChartSeries, ChartSlotClasses } from '../../internal/charts/types';
+import type { CartesianDatum, ChartMargin, ChartSeries, ChartSlotClasses } from '../../internal/charts/types.js';
 /**
  * @description Line chart for trends over an ordered category axis. One path
  * per series on the design-token palette; zero-dependency SVG, responsive,

package/dist/components/LocaleSwitcher/LocaleSwitcher.svelte.d.ts

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

package/dist/components/LocaleSwitcher/index.d.ts

@@ -1,5 +1,5 @@
 import type { Locale } from '@urbicon-ui/i18n';
-import type { SelectSingleProps } from '../..';
+import type { SelectSingleProps } from '../../index.js';
 /**
  * Props interface for LocaleSwitcher component
  *

package/dist/components/Planner/Planner.svelte

@@ -1,6 +1,6 @@
 <script lang="ts" generics="T = unknown">
   import { useBlocksI18n } from '../..';
-  import { getBlocksConfig, mergeSlotClasses, resolvePresetSlotClasses } from '../../provider';
+  import { getBlocksConfig, resolveSlotClasses } from '../../provider';
   import { stripTime } from '../../date';
   import {
     DateGridController,
@@ -14,7 +14,7 @@
   } from '../../internal/date-grid';
   import { bucketItemsByDate } from './planner.bucket';
   import { setPlannerContext } from './planner.context';
-  import { plannerVariants } from './planner.variants';
+  import { plannerVariants, type PlannerVariants } from './planner.variants';
   import type {
     PlannerCellContext,
     PlannerContext,
@@ -70,16 +70,13 @@
   // --- BlocksConfig integration ---
   const blocksConfig = getBlocksConfig();
   const unstyled = $derived(unstyledProp || blocksConfig?.unstyled || false);
-  const slotClasses = $derived(
-    mergeSlotClasses(
-      blocksConfig?.defaults?.Planner?.slotClasses,
-      resolvePresetSlotClasses(blocksConfig?.presets, 'Planner', preset),
-      slotClassesProp
-    )
-  );
 
   // --- Styling: one tv() instance, resolved per slot ---
-  const styles = $derived(plannerVariants({ view, variant, size }));
+  const variantProps: PlannerVariants = $derived({ view, variant, size });
+  const styles = $derived(plannerVariants(variantProps));
+  const slotClasses = $derived(
+    resolveSlotClasses(blocksConfig, 'Planner', preset, variantProps, slotClassesProp)
+  );
   function slot(name: PlannerSlotName, extra?: string): string {
     const overrides = [slotClasses?.[name], extra].filter(Boolean).join(' ');
     if (unstyled) return overrides;

package/dist/components/Planner/Planner.svelte.d.ts

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

package/dist/components/Planner/index.d.ts

@@ -1,7 +1,7 @@
 import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
-import type { PlannerCellContext, PlannerDayContext, PlannerHeaderContext, PlannerRange, PlannerSlotName, PlannerView } from './planner.types';
-import type { PlannerVariants } from './planner.variants';
+import type { PlannerCellContext, PlannerDayContext, PlannerHeaderContext, PlannerRange, PlannerView } from './planner.types.js';
+import type { PlannerSlots, PlannerVariants } from './planner.variants.js';
 /**
  * @description Date-indexed planning board — a week, month or custom-range grid
  * whose cells hold YOUR domain content (meals, shifts, bookings, content slots)
@@ -98,13 +98,13 @@ export interface PlannerProps<T = unknown> extends Omit<PlannerVariants, 'view'>
     class?: string;
     /** Remove all default tv() classes — only user-provided classes apply. @default false */
     unstyled?: boolean;
-    /** Per-slot class overrides merged with tv() styles. */
-    slotClasses?: Partial<Record<PlannerSlotName, string>>;
+    /** Per-slot class overrides merged with tv() styles. Slots: base | header | headerTitle | nav | navButton | grid | weekdayHeader | weekday | weekNumber | week | cell | cellHeader | cellWeekday | cellDate | cellItems | empty */
+    slotClasses?: Partial<Record<PlannerSlots, string>>;
     /** Apply a named preset registered via `<BlocksProvider presets={{ Planner: {...} }}>`. */
     preset?: string;
 }
 export { default as Planner } from './Planner.svelte';
 export { default as PlannerHeader } from './PlannerHeader.svelte';
-export { bucketItemsByDate, type GetItemDate, toDateKey } from './planner.bucket';
-export type { PlannerCellContext, PlannerDayContext, PlannerHeaderContext, PlannerRange, PlannerSlotName, PlannerView } from './planner.types';
-export { type PlannerVariants, plannerVariants } from './planner.variants';
+export { bucketItemsByDate, type GetItemDate, toDateKey } from './planner.bucket.js';
+export type { PlannerCellContext, PlannerDayContext, PlannerHeaderContext, PlannerRange, PlannerSlotName, PlannerView } from './planner.types.js';
+export { type PlannerVariants, plannerVariants } from './planner.variants.js';

package/dist/components/Planner/index.js

@@ -1,4 +1,4 @@
 export { default as Planner } from './Planner.svelte';
 export { default as PlannerHeader } from './PlannerHeader.svelte';
-export { bucketItemsByDate, toDateKey } from './planner.bucket';
-export { plannerVariants } from './planner.variants';
+export { bucketItemsByDate, toDateKey } from './planner.bucket.js';
+export { plannerVariants } from './planner.variants.js';

package/dist/components/Planner/planner.bucket.js

@@ -6,7 +6,7 @@
  * Svelte-free and side-effect-free so it unit-tests without a DOM and stays the
  * one place the date→key normalisation lives.
  */
-import { toIso } from '../../date';
+import { toIso } from '../../date/index.js';
 /**
  * Derive the local `YYYY-MM-DD` bucket key for an item's date.
  *

package/dist/components/Planner/planner.context.d.ts

@@ -1,4 +1,4 @@
-import type { PlannerContext } from './planner.types';
+import type { PlannerContext } from './planner.types.js';
 declare const setPlannerContext: (value: PlannerContext | undefined) => PlannerContext | undefined;
 export { setPlannerContext };
 /** Read the Planner context. Throws if used outside a `<Planner>`. */

package/dist/components/Planner/planner.context.js

@@ -1,4 +1,4 @@
-import { createOptionalContext } from '../../utils/optional-context';
+import { createOptionalContext } from '../../utils/optional-context.js';
 // Optional context so the getter can throw a descriptive error rather than
 // Svelte's generic missing_context.
 const [getPlannerContextRaw, setPlannerContext] = createOptionalContext();

package/dist/components/Planner/planner.variants.d.ts

@@ -1,4 +1,4 @@
-import { type VariantProps } from '../../utils/variants';
+import { type SlotNames, type VariantProps } from '../../utils/variants.js';
 /**
  * Planner styling — the visible chrome layered over the headless `DateGridScaffold`.
  *
@@ -7,7 +7,7 @@ import { type VariantProps } from '../../utils/variants';
  * classes in the markup rather than as boolean variants, to keep the variant
  * matrix to the three axes that actually change layout: `view`, `variant`, `size`.
  */
-export declare const plannerVariants: (props?: import("../../utils/variants").TVProps<{
+export declare const plannerVariants: (props?: import("../../utils/variants.js").TVProps<{
     view: {
         week: {
             cell: string;
@@ -199,3 +199,5 @@ export declare const plannerVariants: (props?: import("../../utils/variants").TV
     }) | undefined) => string;
 };
 export type PlannerVariants = VariantProps<typeof plannerVariants>;
+/** Slot names derived from the tv() config — single source of truth for slotClasses. */
+export type PlannerSlots = SlotNames<typeof plannerVariants>;

package/dist/components/Planner/planner.variants.js

@@ -1,4 +1,4 @@
-import { tv } from '../../utils/variants';
+import { tv } from '../../utils/variants.js';
 /**
  * Planner styling — the visible chrome layered over the headless `DateGridScaffold`.
  *