@urbicon-ui/blocks 6.22.0 → 6.23.0

package/dist/i18n/index.d.ts

@@ -379,195 +379,7 @@ declare const blocksTranslations: {
         };
     };
 };
-export declare const blocksI18n: import("@urbicon-ui/i18n").PackageI18n<{
-    readonly accessibility: {
-        readonly avatar: "Avatar";
-        readonly breadcrumb: "Breadcrumb";
-        readonly breadcrumbExpand: "Show all breadcrumb items";
-        readonly clearInput: "Clear input";
-        readonly clearSearch: "Clear search";
-        readonly clearSelection: "Clear selection";
-        readonly closeDialog: "Close dialog";
-        readonly closeDrawer: "Close drawer";
-        readonly dismiss: "Dismiss";
-        readonly fileUpload: "File upload";
-        readonly loading: "Loading";
-        readonly maximum: "Maximum";
-        readonly minimum: "Minimum";
-        readonly pagination: "Page navigation";
-        readonly progress: "Progress";
-        readonly slider: "Slider";
-        readonly toggle: "Toggle";
-        readonly toggleOptions: "Toggle options";
-        readonly removableBadge: "Removable badge";
-        readonly removeBadge: "Remove badge";
-        readonly removeFile: "Remove {{name}}";
-        readonly removeTag: "Remove {{label}}";
-    };
-    readonly button: {
-        readonly close: "Close";
-        readonly apply: "Apply";
-        readonly cancel: "Cancel";
-        readonly confirm: "Confirm";
-    };
-    readonly menu: {
-        readonly placeholder: "Select an option...";
-    };
-    readonly common: {
-        readonly loading: "Loading...";
-    };
-    readonly languages: {
-        readonly de: "Deutsch";
-        readonly en: "English";
-        readonly es: "Español";
-        readonly fr: "Français";
-        readonly it: "Italiano";
-        readonly nl: "Nederlands";
-    };
-    readonly localeSwitcher: {
-        readonly ariaLabel: "Language selection";
-        readonly placeholder: "Select language...";
-    };
-    readonly pagination: {
-        readonly next: "Next";
-        readonly first: "First";
-        readonly last: "Last";
-        readonly page: "Page";
-        readonly previous: "Previous";
-        readonly pageInfo: "{{label}} {{current}} of {{total}}";
-        readonly rangeInfo: "{{start}}–{{end}} of {{total}}";
-    };
-    readonly calendar: {
-        readonly recurring: "Recurring event";
-        readonly previousMonth: "Previous month";
-        readonly nextMonth: "Next month";
-        readonly previousWeek: "Previous week";
-        readonly nextWeek: "Next week";
-        readonly previousDay: "Previous day";
-        readonly nextDay: "Next day";
-        readonly previousYear: "Previous year";
-        readonly nextYear: "Next year";
-        readonly today: "Today";
-        readonly calendarGrid: "Calendar";
-        readonly weekdays: "Weekdays";
-        readonly weekNumber: "Week number";
-        readonly events: "Events";
-        readonly noEvents: "No events";
-        readonly showMore: "{{count}} more";
-        readonly legend: "Legend";
-        readonly yearView: "Year overview";
-        readonly weekView: "Week view";
-        readonly viewMonth: "Month";
-        readonly viewYear: "Year";
-        readonly viewWeek: "Week";
-        readonly viewDay: "Day";
-        readonly multiDayLabel: "Day {{current}} of {{total}}";
-        readonly agendaView: "Agenda view";
-        readonly viewAgenda: "Agenda";
-        readonly viewSwitcher: "View mode";
-    };
-    readonly planner: {
-        readonly previousWeek: "Previous week";
-        readonly nextWeek: "Next week";
-        readonly previousMonth: "Previous month";
-        readonly nextMonth: "Next month";
-        readonly previousRange: "Previous range";
-        readonly nextRange: "Next range";
-        readonly today: "Today";
-        readonly grid: "Planner";
-        readonly itemCount: "{{count}} items";
-    };
-    readonly commandPalette: {
-        readonly noResults: "No results found.";
-        readonly search: "Search...";
-        readonly hints: {
-            readonly navigate: "Navigate";
-            readonly select: "Select";
-            readonly close: "Close";
-        };
-    };
-    readonly compositionBar: {
-        readonly total: "Total";
-        readonly summary: "Composition: {{total}} ({{count}} shares) — {{parts}}";
-        readonly share: "Share";
-        readonly value: "Value";
-        readonly percent: "Percent";
-        readonly remaining: "remaining";
-    };
-    readonly guide: {
-        readonly next: "Next";
-        readonly previous: "Back";
-        readonly skip: "Skip tour";
-        readonly done: "Done";
-        readonly step: "Step {{current}} of {{total}}";
-        readonly tour: "Guided tour";
-        readonly close: "Close";
-        readonly openHelp: "Help";
-        readonly backToList: "All topics";
-        readonly info: "More information";
-        readonly infoAbout: "More information about {{label}}";
-        readonly dismiss: "Dismiss hint";
-        readonly startTour: "Start the guided tour";
-        readonly actionRequired: "Complete the highlighted action to continue";
-        readonly filterPlaceholder: "Filter topics…";
-        readonly noResults: "No matching topics";
-    };
-    readonly journeyTimeline: {
-        readonly label: "Journey";
-        readonly status: {
-            readonly complete: "Completed";
-            readonly active: "In progress";
-            readonly pending: "Pending";
-            readonly attention: "Needs attention";
-            readonly blocked: "Blocked";
-            readonly skipped: "Skipped";
-        };
-    };
-    readonly datepicker: {
-        readonly placeholder: "Select a date...";
-        readonly rangePlaceholder: "Select a date range...";
-        readonly openCalendar: "Open calendar";
-        readonly invalidDate: "Invalid date";
-        readonly outOfRange: "Date is outside the allowed range";
-        readonly invalidRange: "Invalid date range";
-    };
-    readonly fileUpload: {
-        readonly exists: "File already added";
-        readonly invalidType: "File type {{type}} is not allowed";
-        readonly tooLarge: "File exceeds {{size}} limit";
-        readonly tooMany: "Maximum {{count}} files allowed";
-        readonly tooSmall: "File must be at least {{size}}";
-    };
-    readonly sankey: {
-        readonly summary: "Sankey diagram: {{nodes}} nodes, {{links}} links — {{flows}}";
-        readonly source: "Source";
-        readonly target: "Target";
-        readonly value: "Value";
-    };
-    readonly slider: {
-        readonly rangeStatus: {
-            readonly insideRecommended: "In recommended range";
-            readonly insideValid: "In valid range";
-            readonly insideValidOnly: "Outside recommended range, but valid";
-            readonly outsideValid: "Outside valid range";
-        };
-    };
-    readonly themeSwitcher: {
-        readonly lightMode: "Light mode";
-        readonly darkMode: "Dark mode";
-        readonly systemTheme: "System theme";
-    };
-    readonly chart: {
-        readonly category: "Category";
-        readonly series: "Series {{index}}";
-        readonly segment: "Segment";
-        readonly value: "Value";
-        readonly share: "Share";
-    };
-    readonly stepper: {
-        readonly optional: "Optional";
-    };
-}>;
+export declare const blocksI18n: import("@urbicon-ui/i18n").PackageI18n<import("@urbicon-ui/i18n").Translations>;
 /**
  * Context-scoped translation hook for the blocks package. Call during component
  * initialisation, then use the returned `t` (conventionally aliased `bt`):
@@ -580,195 +392,7 @@ export declare const blocksI18n: import("@urbicon-ui/i18n").PackageI18n<{
  * Resolves against the nearest `<I18nProvider>`'s locale (or the base locale
  * when none is mounted) and re-renders reactively on locale change.
  */
-export declare const useBlocksI18n: () => import("@urbicon-ui/i18n").TypedTranslationFunction<{
-    readonly accessibility: {
-        readonly avatar: "Avatar";
-        readonly breadcrumb: "Breadcrumb";
-        readonly breadcrumbExpand: "Show all breadcrumb items";
-        readonly clearInput: "Clear input";
-        readonly clearSearch: "Clear search";
-        readonly clearSelection: "Clear selection";
-        readonly closeDialog: "Close dialog";
-        readonly closeDrawer: "Close drawer";
-        readonly dismiss: "Dismiss";
-        readonly fileUpload: "File upload";
-        readonly loading: "Loading";
-        readonly maximum: "Maximum";
-        readonly minimum: "Minimum";
-        readonly pagination: "Page navigation";
-        readonly progress: "Progress";
-        readonly slider: "Slider";
-        readonly toggle: "Toggle";
-        readonly toggleOptions: "Toggle options";
-        readonly removableBadge: "Removable badge";
-        readonly removeBadge: "Remove badge";
-        readonly removeFile: "Remove {{name}}";
-        readonly removeTag: "Remove {{label}}";
-    };
-    readonly button: {
-        readonly close: "Close";
-        readonly apply: "Apply";
-        readonly cancel: "Cancel";
-        readonly confirm: "Confirm";
-    };
-    readonly menu: {
-        readonly placeholder: "Select an option...";
-    };
-    readonly common: {
-        readonly loading: "Loading...";
-    };
-    readonly languages: {
-        readonly de: "Deutsch";
-        readonly en: "English";
-        readonly es: "Español";
-        readonly fr: "Français";
-        readonly it: "Italiano";
-        readonly nl: "Nederlands";
-    };
-    readonly localeSwitcher: {
-        readonly ariaLabel: "Language selection";
-        readonly placeholder: "Select language...";
-    };
-    readonly pagination: {
-        readonly next: "Next";
-        readonly first: "First";
-        readonly last: "Last";
-        readonly page: "Page";
-        readonly previous: "Previous";
-        readonly pageInfo: "{{label}} {{current}} of {{total}}";
-        readonly rangeInfo: "{{start}}–{{end}} of {{total}}";
-    };
-    readonly calendar: {
-        readonly recurring: "Recurring event";
-        readonly previousMonth: "Previous month";
-        readonly nextMonth: "Next month";
-        readonly previousWeek: "Previous week";
-        readonly nextWeek: "Next week";
-        readonly previousDay: "Previous day";
-        readonly nextDay: "Next day";
-        readonly previousYear: "Previous year";
-        readonly nextYear: "Next year";
-        readonly today: "Today";
-        readonly calendarGrid: "Calendar";
-        readonly weekdays: "Weekdays";
-        readonly weekNumber: "Week number";
-        readonly events: "Events";
-        readonly noEvents: "No events";
-        readonly showMore: "{{count}} more";
-        readonly legend: "Legend";
-        readonly yearView: "Year overview";
-        readonly weekView: "Week view";
-        readonly viewMonth: "Month";
-        readonly viewYear: "Year";
-        readonly viewWeek: "Week";
-        readonly viewDay: "Day";
-        readonly multiDayLabel: "Day {{current}} of {{total}}";
-        readonly agendaView: "Agenda view";
-        readonly viewAgenda: "Agenda";
-        readonly viewSwitcher: "View mode";
-    };
-    readonly planner: {
-        readonly previousWeek: "Previous week";
-        readonly nextWeek: "Next week";
-        readonly previousMonth: "Previous month";
-        readonly nextMonth: "Next month";
-        readonly previousRange: "Previous range";
-        readonly nextRange: "Next range";
-        readonly today: "Today";
-        readonly grid: "Planner";
-        readonly itemCount: "{{count}} items";
-    };
-    readonly commandPalette: {
-        readonly noResults: "No results found.";
-        readonly search: "Search...";
-        readonly hints: {
-            readonly navigate: "Navigate";
-            readonly select: "Select";
-            readonly close: "Close";
-        };
-    };
-    readonly compositionBar: {
-        readonly total: "Total";
-        readonly summary: "Composition: {{total}} ({{count}} shares) — {{parts}}";
-        readonly share: "Share";
-        readonly value: "Value";
-        readonly percent: "Percent";
-        readonly remaining: "remaining";
-    };
-    readonly guide: {
-        readonly next: "Next";
-        readonly previous: "Back";
-        readonly skip: "Skip tour";
-        readonly done: "Done";
-        readonly step: "Step {{current}} of {{total}}";
-        readonly tour: "Guided tour";
-        readonly close: "Close";
-        readonly openHelp: "Help";
-        readonly backToList: "All topics";
-        readonly info: "More information";
-        readonly infoAbout: "More information about {{label}}";
-        readonly dismiss: "Dismiss hint";
-        readonly startTour: "Start the guided tour";
-        readonly actionRequired: "Complete the highlighted action to continue";
-        readonly filterPlaceholder: "Filter topics…";
-        readonly noResults: "No matching topics";
-    };
-    readonly journeyTimeline: {
-        readonly label: "Journey";
-        readonly status: {
-            readonly complete: "Completed";
-            readonly active: "In progress";
-            readonly pending: "Pending";
-            readonly attention: "Needs attention";
-            readonly blocked: "Blocked";
-            readonly skipped: "Skipped";
-        };
-    };
-    readonly datepicker: {
-        readonly placeholder: "Select a date...";
-        readonly rangePlaceholder: "Select a date range...";
-        readonly openCalendar: "Open calendar";
-        readonly invalidDate: "Invalid date";
-        readonly outOfRange: "Date is outside the allowed range";
-        readonly invalidRange: "Invalid date range";
-    };
-    readonly fileUpload: {
-        readonly exists: "File already added";
-        readonly invalidType: "File type {{type}} is not allowed";
-        readonly tooLarge: "File exceeds {{size}} limit";
-        readonly tooMany: "Maximum {{count}} files allowed";
-        readonly tooSmall: "File must be at least {{size}}";
-    };
-    readonly sankey: {
-        readonly summary: "Sankey diagram: {{nodes}} nodes, {{links}} links — {{flows}}";
-        readonly source: "Source";
-        readonly target: "Target";
-        readonly value: "Value";
-    };
-    readonly slider: {
-        readonly rangeStatus: {
-            readonly insideRecommended: "In recommended range";
-            readonly insideValid: "In valid range";
-            readonly insideValidOnly: "Outside recommended range, but valid";
-            readonly outsideValid: "Outside valid range";
-        };
-    };
-    readonly themeSwitcher: {
-        readonly lightMode: "Light mode";
-        readonly darkMode: "Dark mode";
-        readonly systemTheme: "System theme";
-    };
-    readonly chart: {
-        readonly category: "Category";
-        readonly series: "Series {{index}}";
-        readonly segment: "Segment";
-        readonly value: "Value";
-        readonly share: "Share";
-    };
-    readonly stepper: {
-        readonly optional: "Optional";
-    };
-}>;
+export declare const useBlocksI18n: any;
 export declare const hasBlocksTranslation: (key: string) => boolean, getBlocksLocales: () => import("@urbicon-ui/i18n").Locale[];
 export type BlocksTranslationKey = keyof typeof enTranslations;
 export { blocksTranslations };

package/dist/primitives/Alert/alert.variants.d.ts

@@ -1,53 +1,53 @@
 import { type SlotNames, type VariantProps } from '../../utils/variants.js';
 export declare const alertVariants: ((props?: {
-    intent?: "info" | "primary" | "success" | "warning" | "danger" | "neutral" | undefined;
+    intent?: "primary" | "info" | "success" | "warning" | "danger" | "neutral" | undefined;
     variant?: "inline" | "filled" | "soft" | undefined;
     size?: "sm" | "md" | "lg" | undefined;
 } | undefined) => {
     base: (props?: ({
-        intent?: "info" | "primary" | "success" | "warning" | "danger" | "neutral" | undefined;
+        intent?: "primary" | "info" | "success" | "warning" | "danger" | "neutral" | undefined;
         variant?: "inline" | "filled" | "soft" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
     } & {
         class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
     }) | undefined) => string;
     icon: (props?: ({
-        intent?: "info" | "primary" | "success" | "warning" | "danger" | "neutral" | undefined;
+        intent?: "primary" | "info" | "success" | "warning" | "danger" | "neutral" | undefined;
         variant?: "inline" | "filled" | "soft" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
     } & {
         class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
     }) | undefined) => string;
     content: (props?: ({
-        intent?: "info" | "primary" | "success" | "warning" | "danger" | "neutral" | undefined;
+        intent?: "primary" | "info" | "success" | "warning" | "danger" | "neutral" | undefined;
         variant?: "inline" | "filled" | "soft" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
     } & {
         class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
     }) | undefined) => string;
     title: (props?: ({
-        intent?: "info" | "primary" | "success" | "warning" | "danger" | "neutral" | undefined;
+        intent?: "primary" | "info" | "success" | "warning" | "danger" | "neutral" | undefined;
         variant?: "inline" | "filled" | "soft" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
     } & {
         class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
     }) | undefined) => string;
     description: (props?: ({
-        intent?: "info" | "primary" | "success" | "warning" | "danger" | "neutral" | undefined;
+        intent?: "primary" | "info" | "success" | "warning" | "danger" | "neutral" | undefined;
         variant?: "inline" | "filled" | "soft" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
     } & {
         class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
     }) | undefined) => string;
     actions: (props?: ({
-        intent?: "info" | "primary" | "success" | "warning" | "danger" | "neutral" | undefined;
+        intent?: "primary" | "info" | "success" | "warning" | "danger" | "neutral" | undefined;
         variant?: "inline" | "filled" | "soft" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
     } & {
         class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
     }) | undefined) => string;
     dismissButton: (props?: ({
-        intent?: "info" | "primary" | "success" | "warning" | "danger" | "neutral" | undefined;
+        intent?: "primary" | "info" | "success" | "warning" | "danger" | "neutral" | undefined;
         variant?: "inline" | "filled" | "soft" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
     } & {

package/dist/primitives/ButtonGroup/ButtonGroup.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
   import { buttonGroupVariants, type ButtonGroupVariants } from '..';
   import { getBlocksConfig, resolveSlotClasses } from '../../provider';
+  import { edgeEnabledIndex, nextEnabledIndex } from '../../utils';
   import { getTierContext, setTierContext } from '../../utils/tier-context';
   import type { ButtonGroupContext, ButtonGroupProps } from './index';
   import { setButtonGroupContext } from './buttonGroup.context';
@@ -65,7 +66,15 @@
     }
   });
 
+  // Child Button values in registration (= document) order. Buttons register
+  // during their render pass (before any effect runs), so this is fully
+  // populated in DOM order by the time roving reads it — it lets the radiogroup
+  // map the reactive selection back to a radio's position without the shared
+  // <Button> exposing its value in the DOM.
+  const buttonOrder: string[] = [];
+
   function registerButton(buttonValue: string | undefined) {
+    if (buttonValue && !buttonOrder.includes(buttonValue)) buttonOrder.push(buttonValue);
     return {
       get isSelected() {
         return buttonValue ? selectedValues.has(buttonValue) : false;
@@ -91,8 +100,14 @@
         onSelectionChange?.(value, Array.from(selectedValues));
       },
       getButtonProps() {
-        if (selection === 'none') return {};
-        const checked = buttonValue ? selectedValues.has(buttonValue) : false;
+        // A value-less Button is an action button, not a selection option, so it
+        // gets no radio/checkbox role. This also keeps `rovingRadios()` (which
+        // collects `[role="radio"]`) index-aligned with `buttonOrder` (gated on
+        // `buttonValue`): a value-less radio would otherwise sit in the roving
+        // array but not the order registry, drifting the two index spaces and
+        // misplacing the tab stop / arrow-nav origin.
+        if (selection === 'none' || !buttonValue) return {};
+        const checked = selectedValues.has(buttonValue);
         return {
           role: selection === 'single' ? ('radio' as const) : ('checkbox' as const),
           'aria-checked': checked
@@ -132,17 +147,119 @@
     registerButton
   });
 
+  let containerElement = $state<HTMLDivElement>();
+
+  // Single-select is a WAI-ARIA radiogroup: ONE tab stop, arrow keys move the
+  // selection (roving tabindex). Tab/SegmentGroup drive this from a value→element
+  // registry their own item components populate; ButtonGroup's items are shared
+  // <Button>s (outside this component), so the radiogroup owns the roving from
+  // the container instead — it queries the radio *elements* from the DOM (for
+  // focus + disabled state), reads the *selected* one from reactive state (see
+  // selectedRadioIndex), reuses the shared index math (utils/roving), skips
+  // disabled radios, and drives selection by clicking the target radio (Button's
+  // own click handler does the rest). `multiple`/`none` keep every button
+  // natively tabbable (checkbox-group / plain toolbar convention — not roved).
+  function rovingRadios(): HTMLButtonElement[] {
+    return containerElement
+      ? Array.from(containerElement.querySelectorAll<HTMLButtonElement>('[role="radio"]'))
+      : [];
+  }
+
+  // Position of the selected radio, read from the reactive selection (not the
+  // DOM's aria-checked) so it is correct even on the first paint — a parent
+  // effect can run before the child <Button>s commit their aria, so the DOM
+  // isn't a reliable source there. `buttonOrder` is in document order, matching
+  // the radios queried above.
+  function selectedRadioIndex(): number {
+    for (let i = 0; i < buttonOrder.length; i++) {
+      if (selectedValues.has(buttonOrder[i])) return i;
+    }
+    return -1;
+  }
+
+  $effect(() => {
+    if (selection !== 'single' || !containerElement) return;
+    const radios = rovingRadios();
+    if (radios.length === 0) return;
+
+    const checkedIndex = selectedRadioIndex();
+    // Nothing selected yet → the first enabled radio holds the tab stop, so the
+    // group stays reachable with Tab (standard radiogroup entry behaviour).
+    const activeIndex =
+      checkedIndex >= 0
+        ? checkedIndex
+        : edgeEnabledIndex(radios.length, 1, (i) => radios[i].disabled);
+
+    radios.forEach((radio, i) => {
+      radio.tabIndex = i === activeIndex ? 0 : -1;
+    });
+
+    // Restore native tabbability when the group stops roving (selection flips away
+    // from single, or it unmounts) — otherwise the imposed -1 would strand the
+    // buttons out of the tab order.
+    return () => {
+      for (const radio of radios) radio.removeAttribute('tabindex');
+    };
+  });
+
+  // A disabled radio renders a `<button disabled>`, which can't hold focus, so
+  // arrow navigation must step over it — otherwise selection strands on an
+  // unfocusable radio (aria-checked set, focus stuck on the previous one). The
+  // index math lives in the shared roving helpers (utils/roving).
+  function handleKeyDown(event: KeyboardEvent) {
+    if (disabled || selection !== 'single') return;
+
+    const radios = rovingRadios();
+    if (radios.length === 0) return;
+
+    const currentIndex = selectedRadioIndex();
+    const isDisabled = (i: number) => radios[i].disabled;
+    let newIndex: number;
+
+    switch (event.key) {
+      case 'ArrowRight':
+      case 'ArrowDown':
+        event.preventDefault();
+        newIndex = nextEnabledIndex(radios.length, currentIndex, 1, isDisabled);
+        break;
+      case 'ArrowLeft':
+      case 'ArrowUp':
+        event.preventDefault();
+        newIndex = nextEnabledIndex(radios.length, currentIndex, -1, isDisabled);
+        break;
+      case 'Home':
+        event.preventDefault();
+        newIndex = edgeEnabledIndex(radios.length, 1, isDisabled);
+        break;
+      case 'End':
+        event.preventDefault();
+        newIndex = edgeEnabledIndex(radios.length, -1, isDisabled);
+        break;
+      default:
+        return;
+    }
+
+    if (newIndex !== currentIndex && newIndex >= 0) {
+      const target = radios[newIndex];
+      target.click(); // Button's own click handler performs the selection
+      target.focus();
+    }
+  }
+
   const ariaRole = $derived(selection === 'single' ? 'radiogroup' : 'group');
 </script>
 
 <div
+  bind:this={containerElement}
   role={ariaRole}
   class={unstyled
     ? [slotClasses?.base, className].filter(Boolean).join(' ')
     : styles.base({ class: [slotClasses?.base, className] })}
   aria-label={ariaLabel}
   aria-labelledby={ariaLabelledBy}
-  aria-disabled={disabled}
+  aria-orientation={orientation}
+  aria-disabled={disabled || undefined}
+  onkeydown={handleKeyDown}
   {...restProps}
 >
   {@render children?.()}

package/dist/primitives/Card/card.variants.js

@@ -66,10 +66,10 @@ export const cardVariants = tv({
                 footer: 'pt-5'
             }
         },
-        // Opt-in slot separators. Default `false` (Lighter): header/footer
+        // Opt-in slot separators. Default `false`: header/footer
         // sit flush against the body, the slots are separated by spacing
         // only. Set `dividers={true}` for traditional card-with-header look.
-        // Uses `border-hairline` (Lighter token) — leiser als border-subtle.
+        // Uses `border-hairline` — leiser als border-subtle.
         dividers: {
             true: {
                 header: 'border-b border-border-hairline',

package/dist/primitives/Checkbox/Checkbox.svelte

@@ -32,6 +32,7 @@
     unstyled: unstyledProp = false,
     slotClasses: slotClassesProp = {},
     preset,
+    'aria-describedby': ariaDescribedby,
     ...restProps
   }: CheckboxProps = $props();
 
@@ -51,6 +52,14 @@
     disabled
   }));
 
+  // Consumer-supplied `aria-describedby` (e.g. an external hint rendered
+  // outside the component) merges with the internal error/helper chain instead
+  // of replacing it — internal descriptions first, the consumer's supplemental
+  // one last (mirrors the Input role model, XC-2).
+  const describedBy = $derived(
+    [ff.describedBy, ariaDescribedby].filter(Boolean).join(' ') || undefined
+  );
+
   const blocksConfig = getBlocksConfig();
   const unstyled = $derived(unstyledProp || blocksConfig?.unstyled || false);
 
@@ -128,7 +137,7 @@
       class="peer sr-only"
       aria-checked={indeterminate ? 'mixed' : undefined}
       aria-invalid={ff.invalid ? 'true' : undefined}
-      aria-describedby={ff.describedBy}
+      aria-describedby={describedBy}
       onchange={handleChange}
       {...restProps}
     />