@urbicon-ui/blocks 6.37.2 → 6.39.0

package/dist/primitives/Input/input.variants.d.ts

@@ -1,9 +1,9 @@
 import { type SlotNames, type VariantProps } from '../../utils/variants.js';
 export declare const inputVariants: ((props?: {
     tier?: "commit" | "modify" | undefined;
-    variant?: "ghost" | "filled" | "outlined" | "underline" | undefined;
-    size?: "sm" | "md" | "lg" | "xs" | "xl" | undefined;
-    intent?: "default" | "success" | "warning" | "danger" | undefined;
+    variant?: "ghost" | "underline" | "filled" | "outlined" | undefined;
+    size?: "xs" | "sm" | "md" | "lg" | "xl" | undefined;
+    intent?: "success" | "warning" | "danger" | "default" | undefined;
     disabled?: boolean | undefined;
     readonly?: boolean | undefined;
     messageType?: "error" | "helper" | undefined;
@@ -15,9 +15,9 @@ export declare const inputVariants: ((props?: {
 } | undefined) => {
     wrapper: (props?: ({
         tier?: "commit" | "modify" | undefined;
-        variant?: "ghost" | "filled" | "outlined" | "underline" | undefined;
-        size?: "sm" | "md" | "lg" | "xs" | "xl" | undefined;
-        intent?: "default" | "success" | "warning" | "danger" | undefined;
+        variant?: "ghost" | "underline" | "filled" | "outlined" | undefined;
+        size?: "xs" | "sm" | "md" | "lg" | "xl" | undefined;
+        intent?: "success" | "warning" | "danger" | "default" | undefined;
         disabled?: boolean | undefined;
         readonly?: boolean | undefined;
         messageType?: "error" | "helper" | undefined;
@@ -31,9 +31,9 @@ export declare const inputVariants: ((props?: {
     }) | undefined) => string;
     container: (props?: ({
         tier?: "commit" | "modify" | undefined;
-        variant?: "ghost" | "filled" | "outlined" | "underline" | undefined;
-        size?: "sm" | "md" | "lg" | "xs" | "xl" | undefined;
-        intent?: "default" | "success" | "warning" | "danger" | undefined;
+        variant?: "ghost" | "underline" | "filled" | "outlined" | undefined;
+        size?: "xs" | "sm" | "md" | "lg" | "xl" | undefined;
+        intent?: "success" | "warning" | "danger" | "default" | undefined;
         disabled?: boolean | undefined;
         readonly?: boolean | undefined;
         messageType?: "error" | "helper" | undefined;
@@ -47,9 +47,9 @@ export declare const inputVariants: ((props?: {
     }) | undefined) => string;
     base: (props?: ({
         tier?: "commit" | "modify" | undefined;
-        variant?: "ghost" | "filled" | "outlined" | "underline" | undefined;
-        size?: "sm" | "md" | "lg" | "xs" | "xl" | undefined;
-        intent?: "default" | "success" | "warning" | "danger" | undefined;
+        variant?: "ghost" | "underline" | "filled" | "outlined" | undefined;
+        size?: "xs" | "sm" | "md" | "lg" | "xl" | undefined;
+        intent?: "success" | "warning" | "danger" | "default" | undefined;
         disabled?: boolean | undefined;
         readonly?: boolean | undefined;
         messageType?: "error" | "helper" | undefined;
@@ -63,9 +63,9 @@ export declare const inputVariants: ((props?: {
     }) | undefined) => string;
     label: (props?: ({
         tier?: "commit" | "modify" | undefined;
-        variant?: "ghost" | "filled" | "outlined" | "underline" | undefined;
-        size?: "sm" | "md" | "lg" | "xs" | "xl" | undefined;
-        intent?: "default" | "success" | "warning" | "danger" | undefined;
+        variant?: "ghost" | "underline" | "filled" | "outlined" | undefined;
+        size?: "xs" | "sm" | "md" | "lg" | "xl" | undefined;
+        intent?: "success" | "warning" | "danger" | "default" | undefined;
         disabled?: boolean | undefined;
         readonly?: boolean | undefined;
         messageType?: "error" | "helper" | undefined;
@@ -79,9 +79,9 @@ export declare const inputVariants: ((props?: {
     }) | undefined) => string;
     message: (props?: ({
         tier?: "commit" | "modify" | undefined;
-        variant?: "ghost" | "filled" | "outlined" | "underline" | undefined;
-        size?: "sm" | "md" | "lg" | "xs" | "xl" | undefined;
-        intent?: "default" | "success" | "warning" | "danger" | undefined;
+        variant?: "ghost" | "underline" | "filled" | "outlined" | undefined;
+        size?: "xs" | "sm" | "md" | "lg" | "xl" | undefined;
+        intent?: "success" | "warning" | "danger" | "default" | undefined;
         disabled?: boolean | undefined;
         readonly?: boolean | undefined;
         messageType?: "error" | "helper" | undefined;
@@ -95,9 +95,9 @@ export declare const inputVariants: ((props?: {
     }) | undefined) => string;
     iconContainer: (props?: ({
         tier?: "commit" | "modify" | undefined;
-        variant?: "ghost" | "filled" | "outlined" | "underline" | undefined;
-        size?: "sm" | "md" | "lg" | "xs" | "xl" | undefined;
-        intent?: "default" | "success" | "warning" | "danger" | undefined;
+        variant?: "ghost" | "underline" | "filled" | "outlined" | undefined;
+        size?: "xs" | "sm" | "md" | "lg" | "xl" | undefined;
+        intent?: "success" | "warning" | "danger" | "default" | undefined;
         disabled?: boolean | undefined;
         readonly?: boolean | undefined;
         messageType?: "error" | "helper" | undefined;
@@ -111,9 +111,9 @@ export declare const inputVariants: ((props?: {
     }) | undefined) => string;
     iconButton: (props?: ({
         tier?: "commit" | "modify" | undefined;
-        variant?: "ghost" | "filled" | "outlined" | "underline" | undefined;
-        size?: "sm" | "md" | "lg" | "xs" | "xl" | undefined;
-        intent?: "default" | "success" | "warning" | "danger" | undefined;
+        variant?: "ghost" | "underline" | "filled" | "outlined" | undefined;
+        size?: "xs" | "sm" | "md" | "lg" | "xl" | undefined;
+        intent?: "success" | "warning" | "danger" | "default" | undefined;
         disabled?: boolean | undefined;
         readonly?: boolean | undefined;
         messageType?: "error" | "helper" | undefined;
@@ -127,9 +127,9 @@ export declare const inputVariants: ((props?: {
     }) | undefined) => string;
     iconDecoration: (props?: ({
         tier?: "commit" | "modify" | undefined;
-        variant?: "ghost" | "filled" | "outlined" | "underline" | undefined;
-        size?: "sm" | "md" | "lg" | "xs" | "xl" | undefined;
-        intent?: "default" | "success" | "warning" | "danger" | undefined;
+        variant?: "ghost" | "underline" | "filled" | "outlined" | undefined;
+        size?: "xs" | "sm" | "md" | "lg" | "xl" | undefined;
+        intent?: "success" | "warning" | "danger" | "default" | undefined;
         disabled?: boolean | undefined;
         readonly?: boolean | undefined;
         messageType?: "error" | "helper" | undefined;

package/dist/primitives/JourneyTimeline/journey-timeline.variants.d.ts

@@ -2,7 +2,7 @@ import { type SlotNames, type VariantProps } from '../../utils/variants.js';
 export declare const journeyTimelineVariants: ((props?: {
     orientation?: "horizontal" | "vertical" | undefined;
     size?: "sm" | "md" | "lg" | undefined;
-    status?: "complete" | "active" | "pending" | "attention" | "blocked" | "skipped" | undefined;
+    status?: "blocked" | "attention" | "active" | "complete" | "pending" | "skipped" | undefined;
     focused?: boolean | undefined;
     interactive?: boolean | undefined;
     travelled?: boolean | undefined;
@@ -13,7 +13,7 @@ export declare const journeyTimelineVariants: ((props?: {
     base: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        status?: "complete" | "active" | "pending" | "attention" | "blocked" | "skipped" | undefined;
+        status?: "blocked" | "attention" | "active" | "complete" | "pending" | "skipped" | undefined;
         focused?: boolean | undefined;
         interactive?: boolean | undefined;
         travelled?: boolean | undefined;
@@ -26,7 +26,7 @@ export declare const journeyTimelineVariants: ((props?: {
     rail: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        status?: "complete" | "active" | "pending" | "attention" | "blocked" | "skipped" | undefined;
+        status?: "blocked" | "attention" | "active" | "complete" | "pending" | "skipped" | undefined;
         focused?: boolean | undefined;
         interactive?: boolean | undefined;
         travelled?: boolean | undefined;
@@ -39,7 +39,7 @@ export declare const journeyTimelineVariants: ((props?: {
     node: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        status?: "complete" | "active" | "pending" | "attention" | "blocked" | "skipped" | undefined;
+        status?: "blocked" | "attention" | "active" | "complete" | "pending" | "skipped" | undefined;
         focused?: boolean | undefined;
         interactive?: boolean | undefined;
         travelled?: boolean | undefined;
@@ -52,7 +52,7 @@ export declare const journeyTimelineVariants: ((props?: {
     metaColumn: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        status?: "complete" | "active" | "pending" | "attention" | "blocked" | "skipped" | undefined;
+        status?: "blocked" | "attention" | "active" | "complete" | "pending" | "skipped" | undefined;
         focused?: boolean | undefined;
         interactive?: boolean | undefined;
         travelled?: boolean | undefined;
@@ -65,7 +65,7 @@ export declare const journeyTimelineVariants: ((props?: {
     meta: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        status?: "complete" | "active" | "pending" | "attention" | "blocked" | "skipped" | undefined;
+        status?: "blocked" | "attention" | "active" | "complete" | "pending" | "skipped" | undefined;
         focused?: boolean | undefined;
         interactive?: boolean | undefined;
         travelled?: boolean | undefined;
@@ -78,7 +78,7 @@ export declare const journeyTimelineVariants: ((props?: {
     markerColumn: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        status?: "complete" | "active" | "pending" | "attention" | "blocked" | "skipped" | undefined;
+        status?: "blocked" | "attention" | "active" | "complete" | "pending" | "skipped" | undefined;
         focused?: boolean | undefined;
         interactive?: boolean | undefined;
         travelled?: boolean | undefined;
@@ -91,7 +91,7 @@ export declare const journeyTimelineVariants: ((props?: {
     marker: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        status?: "complete" | "active" | "pending" | "attention" | "blocked" | "skipped" | undefined;
+        status?: "blocked" | "attention" | "active" | "complete" | "pending" | "skipped" | undefined;
         focused?: boolean | undefined;
         interactive?: boolean | undefined;
         travelled?: boolean | undefined;
@@ -104,7 +104,7 @@ export declare const journeyTimelineVariants: ((props?: {
     connector: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        status?: "complete" | "active" | "pending" | "attention" | "blocked" | "skipped" | undefined;
+        status?: "blocked" | "attention" | "active" | "complete" | "pending" | "skipped" | undefined;
         focused?: boolean | undefined;
         interactive?: boolean | undefined;
         travelled?: boolean | undefined;
@@ -117,7 +117,7 @@ export declare const journeyTimelineVariants: ((props?: {
     content: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        status?: "complete" | "active" | "pending" | "attention" | "blocked" | "skipped" | undefined;
+        status?: "blocked" | "attention" | "active" | "complete" | "pending" | "skipped" | undefined;
         focused?: boolean | undefined;
         interactive?: boolean | undefined;
         travelled?: boolean | undefined;
@@ -130,7 +130,7 @@ export declare const journeyTimelineVariants: ((props?: {
     card: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        status?: "complete" | "active" | "pending" | "attention" | "blocked" | "skipped" | undefined;
+        status?: "blocked" | "attention" | "active" | "complete" | "pending" | "skipped" | undefined;
         focused?: boolean | undefined;
         interactive?: boolean | undefined;
         travelled?: boolean | undefined;
@@ -143,7 +143,7 @@ export declare const journeyTimelineVariants: ((props?: {
     header: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        status?: "complete" | "active" | "pending" | "attention" | "blocked" | "skipped" | undefined;
+        status?: "blocked" | "attention" | "active" | "complete" | "pending" | "skipped" | undefined;
         focused?: boolean | undefined;
         interactive?: boolean | undefined;
         travelled?: boolean | undefined;
@@ -156,7 +156,7 @@ export declare const journeyTimelineVariants: ((props?: {
     trigger: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        status?: "complete" | "active" | "pending" | "attention" | "blocked" | "skipped" | undefined;
+        status?: "blocked" | "attention" | "active" | "complete" | "pending" | "skipped" | undefined;
         focused?: boolean | undefined;
         interactive?: boolean | undefined;
         travelled?: boolean | undefined;
@@ -169,7 +169,7 @@ export declare const journeyTimelineVariants: ((props?: {
     trailing: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        status?: "complete" | "active" | "pending" | "attention" | "blocked" | "skipped" | undefined;
+        status?: "blocked" | "attention" | "active" | "complete" | "pending" | "skipped" | undefined;
         focused?: boolean | undefined;
         interactive?: boolean | undefined;
         travelled?: boolean | undefined;
@@ -182,7 +182,7 @@ export declare const journeyTimelineVariants: ((props?: {
     labelGroup: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        status?: "complete" | "active" | "pending" | "attention" | "blocked" | "skipped" | undefined;
+        status?: "blocked" | "attention" | "active" | "complete" | "pending" | "skipped" | undefined;
         focused?: boolean | undefined;
         interactive?: boolean | undefined;
         travelled?: boolean | undefined;
@@ -195,7 +195,7 @@ export declare const journeyTimelineVariants: ((props?: {
     title: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        status?: "complete" | "active" | "pending" | "attention" | "blocked" | "skipped" | undefined;
+        status?: "blocked" | "attention" | "active" | "complete" | "pending" | "skipped" | undefined;
         focused?: boolean | undefined;
         interactive?: boolean | undefined;
         travelled?: boolean | undefined;
@@ -208,7 +208,7 @@ export declare const journeyTimelineVariants: ((props?: {
     subtitle: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        status?: "complete" | "active" | "pending" | "attention" | "blocked" | "skipped" | undefined;
+        status?: "blocked" | "attention" | "active" | "complete" | "pending" | "skipped" | undefined;
         focused?: boolean | undefined;
         interactive?: boolean | undefined;
         travelled?: boolean | undefined;
@@ -221,7 +221,7 @@ export declare const journeyTimelineVariants: ((props?: {
     segment: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        status?: "complete" | "active" | "pending" | "attention" | "blocked" | "skipped" | undefined;
+        status?: "blocked" | "attention" | "active" | "complete" | "pending" | "skipped" | undefined;
         focused?: boolean | undefined;
         interactive?: boolean | undefined;
         travelled?: boolean | undefined;
@@ -234,7 +234,7 @@ export declare const journeyTimelineVariants: ((props?: {
     detail: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        status?: "complete" | "active" | "pending" | "attention" | "blocked" | "skipped" | undefined;
+        status?: "blocked" | "attention" | "active" | "complete" | "pending" | "skipped" | undefined;
         focused?: boolean | undefined;
         interactive?: boolean | undefined;
         travelled?: boolean | undefined;
@@ -247,7 +247,7 @@ export declare const journeyTimelineVariants: ((props?: {
     detailInner: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        status?: "complete" | "active" | "pending" | "attention" | "blocked" | "skipped" | undefined;
+        status?: "blocked" | "attention" | "active" | "complete" | "pending" | "skipped" | undefined;
         focused?: boolean | undefined;
         interactive?: boolean | undefined;
         travelled?: boolean | undefined;
@@ -260,7 +260,7 @@ export declare const journeyTimelineVariants: ((props?: {
     detailContent: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        status?: "complete" | "active" | "pending" | "attention" | "blocked" | "skipped" | undefined;
+        status?: "blocked" | "attention" | "active" | "complete" | "pending" | "skipped" | undefined;
         focused?: boolean | undefined;
         interactive?: boolean | undefined;
         travelled?: boolean | undefined;
@@ -273,7 +273,7 @@ export declare const journeyTimelineVariants: ((props?: {
     panel: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        status?: "complete" | "active" | "pending" | "attention" | "blocked" | "skipped" | undefined;
+        status?: "blocked" | "attention" | "active" | "complete" | "pending" | "skipped" | undefined;
         focused?: boolean | undefined;
         interactive?: boolean | undefined;
         travelled?: boolean | undefined;

package/dist/primitives/Kbd/Kbd.svelte

@@ -0,0 +1,44 @@
+<script lang="ts">
+  import { getBlocksConfig, resolveSlotClasses } from '../../provider';
+  import { kbdVariants } from './kbd.variants';
+  import type { KbdProps } from './index';
+
+  let {
+    keys,
+    separator = '+',
+    size = 'md',
+    children,
+    class: className = '',
+    unstyled: unstyledProp = false,
+    slotClasses: slotClassesProp = {},
+    preset,
+    ...restProps
+  }: KbdProps = $props();
+
+  const blocksConfig = getBlocksConfig();
+  const unstyled = $derived(unstyledProp || blocksConfig?.unstyled || false);
+  const slotClasses = $derived(
+    resolveSlotClasses(blocksConfig, 'Kbd', preset, { size }, slotClassesProp)
+  );
+
+  const styles = $derived(unstyled ? null : kbdVariants({ size }));
+
+  const keyList = $derived(keys === undefined ? [] : Array.isArray(keys) ? keys : [keys]);
+
+  const baseClass = $derived(
+    [styles?.base(), slotClasses?.base, className].filter(Boolean).join(' ')
+  );
+  const separatorClass = $derived(
+    [styles?.separator(), slotClasses?.separator].filter(Boolean).join(' ')
+  );
+</script>
+
+<kbd class={baseClass} {...restProps}>
+  {#if children}
+    {@render children()}
+  {:else}
+    {#each keyList as key, i (`${i}-${key}`)}
+      {#if i > 0}<span class={separatorClass}>{separator}</span>{/if}<span>{key}</span>
+    {/each}
+  {/if}
+</kbd>

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

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

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

@@ -0,0 +1,51 @@
+import type { Snippet } from 'svelte';
+import type { HTMLAttributes } from 'svelte/elements';
+import type { KbdSlots, KbdVariants } from './kbd.variants.js';
+/**
+ * @description Keyboard-key hint. Renders one or more keys as a compact, physical-looking
+ * keycap — the canonical way to show shortcuts (⌘K, Ctrl + S) in menus, tooltips, command
+ * palettes and docs. Pure display; emits a semantic `<kbd>` element.
+ *
+ * @tag display
+ * @related CommandPalette
+ * @related Tooltip
+ * @stability beta
+ *
+ * @example
+ * ```svelte
+ * <Kbd keys="⌘K" />
+ * ```
+ *
+ * @example
+ * ```svelte
+ * <Kbd keys={['Ctrl', 'K']} />
+ * ```
+ */
+export interface KbdProps extends KbdVariants, Omit<HTMLAttributes<HTMLElement>, 'children' | 'class'> {
+    /**
+     * The key(s) to display. A single string renders one label; an array renders each
+     * entry joined by `separator` (e.g. `['Ctrl', 'K']` → `Ctrl + K`). Ignored when
+     * `children` is provided.
+     */
+    keys?: string | string[];
+    /** Separator rendered between multiple `keys`. @default '+' */
+    separator?: string;
+    /** Keycap size — sm, md (default), lg. */
+    size?: 'sm' | 'md' | 'lg';
+    /** Custom content; overrides `keys`. */
+    children?: Snippet;
+    /** Additional CSS class merged onto the root `<kbd>`. */
+    class?: string;
+    /** Strip all default styles; combine with slotClasses to rebuild from scratch. */
+    unstyled?: boolean;
+    /** Per-slot class overrides. Slots: base | separator */
+    slotClasses?: Partial<Record<KbdSlots, string>>;
+    /**
+     * Apply a named preset registered via `<BlocksProvider presets={{ Kbd: {...} }}>`.
+     * Prefer this over `class` overrides when the requested look falls outside the
+     * semantic palette — presets keep dark-mode logic coherent and reusable.
+     */
+    preset?: string;
+}
+export { default as Kbd } from './Kbd.svelte';
+export { type KbdVariants, kbdVariants } from './kbd.variants.js';

package/dist/primitives/Kbd/index.js

@@ -0,0 +1,2 @@
+export { default as Kbd } from './Kbd.svelte';
+export { kbdVariants } from './kbd.variants.js';

package/dist/primitives/Kbd/kbd.variants.d.ts

@@ -0,0 +1,20 @@
+import { type SlotNames, type VariantProps } from '../../utils/variants.js';
+export declare const kbdVariants: ((props?: {
+    size?: "sm" | "md" | "lg" | undefined;
+} | undefined) => {
+    base: (props?: ({
+        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;
+    separator: (props?: ({
+        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;
+}) & {
+    readonly config: import("../../utils/variants.js").TVConfig;
+};
+export type KbdVariants = VariantProps<typeof kbdVariants>;
+/** Slot names derived from the `tv()` config above — single source of truth for `slotClasses`. */
+export type KbdSlots = SlotNames<typeof kbdVariants>;

package/dist/primitives/Kbd/kbd.variants.js

@@ -0,0 +1,27 @@
+import { tv } from '../../utils/variants.js';
+// Keyboard-key hint. Centralizes the ad-hoc `<kbd>` styling scattered across the
+// docs and the CommandPalette `kbd` slot (commandPalette.variants.ts) into one
+// primitive with a physical-keycap look. Pure display — the root is a semantic
+// `<kbd>` element; multiple `keys` are joined by a muted separator inside the
+// single cap, mirroring how the command palette renders `⌘K`.
+export const kbdVariants = tv({
+    slots: {
+        base: [
+            'inline-flex select-none items-center justify-center gap-1 align-middle whitespace-nowrap',
+            'font-mono font-medium text-text-secondary',
+            'border border-border-subtle bg-surface-elevated',
+            'shadow-[var(--blocks-shadow-xs)]'
+        ],
+        separator: ['font-normal text-text-tertiary']
+    },
+    variants: {
+        size: {
+            sm: { base: 'h-4 min-w-4 rounded px-1 text-3xs' },
+            md: { base: 'h-5 min-w-5 rounded-md px-1.5 text-2xs' },
+            lg: { base: 'h-6 min-w-6 rounded-md px-2 text-xs' }
+        }
+    },
+    defaultVariants: {
+        size: 'md'
+    }
+});

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

@@ -1,14 +1,14 @@
 import { type SlotNames, type VariantProps } from '../../utils/variants.js';
 export declare const progressVariants: ((props?: {
     intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
-    size?: "sm" | "md" | "lg" | "xs" | undefined;
+    size?: "xs" | "sm" | "md" | "lg" | undefined;
     indeterminate?: boolean | undefined;
     striped?: boolean | undefined;
     animated?: boolean | undefined;
 } | undefined) => {
     wrapper: (props?: ({
         intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
-        size?: "sm" | "md" | "lg" | "xs" | undefined;
+        size?: "xs" | "sm" | "md" | "lg" | undefined;
         indeterminate?: boolean | undefined;
         striped?: boolean | undefined;
         animated?: boolean | undefined;
@@ -17,7 +17,7 @@ export declare const progressVariants: ((props?: {
     }) | undefined) => string;
     header: (props?: ({
         intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
-        size?: "sm" | "md" | "lg" | "xs" | undefined;
+        size?: "xs" | "sm" | "md" | "lg" | undefined;
         indeterminate?: boolean | undefined;
         striped?: boolean | undefined;
         animated?: boolean | undefined;
@@ -26,7 +26,7 @@ export declare const progressVariants: ((props?: {
     }) | undefined) => string;
     label: (props?: ({
         intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
-        size?: "sm" | "md" | "lg" | "xs" | undefined;
+        size?: "xs" | "sm" | "md" | "lg" | undefined;
         indeterminate?: boolean | undefined;
         striped?: boolean | undefined;
         animated?: boolean | undefined;
@@ -35,7 +35,7 @@ export declare const progressVariants: ((props?: {
     }) | undefined) => string;
     valueText: (props?: ({
         intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
-        size?: "sm" | "md" | "lg" | "xs" | undefined;
+        size?: "xs" | "sm" | "md" | "lg" | undefined;
         indeterminate?: boolean | undefined;
         striped?: boolean | undefined;
         animated?: boolean | undefined;
@@ -44,7 +44,7 @@ export declare const progressVariants: ((props?: {
     }) | undefined) => string;
     track: (props?: ({
         intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
-        size?: "sm" | "md" | "lg" | "xs" | undefined;
+        size?: "xs" | "sm" | "md" | "lg" | undefined;
         indeterminate?: boolean | undefined;
         striped?: boolean | undefined;
         animated?: boolean | undefined;
@@ -53,7 +53,7 @@ export declare const progressVariants: ((props?: {
     }) | undefined) => string;
     fill: (props?: ({
         intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
-        size?: "sm" | "md" | "lg" | "xs" | undefined;
+        size?: "xs" | "sm" | "md" | "lg" | undefined;
         indeterminate?: boolean | undefined;
         striped?: boolean | undefined;
         animated?: boolean | undefined;
@@ -62,7 +62,7 @@ export declare const progressVariants: ((props?: {
     }) | undefined) => string;
     circularWrapper: (props?: ({
         intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
-        size?: "sm" | "md" | "lg" | "xs" | undefined;
+        size?: "xs" | "sm" | "md" | "lg" | undefined;
         indeterminate?: boolean | undefined;
         striped?: boolean | undefined;
         animated?: boolean | undefined;
@@ -71,7 +71,7 @@ export declare const progressVariants: ((props?: {
     }) | undefined) => string;
     circularTrack: (props?: ({
         intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
-        size?: "sm" | "md" | "lg" | "xs" | undefined;
+        size?: "xs" | "sm" | "md" | "lg" | undefined;
         indeterminate?: boolean | undefined;
         striped?: boolean | undefined;
         animated?: boolean | undefined;
@@ -80,7 +80,7 @@ export declare const progressVariants: ((props?: {
     }) | undefined) => string;
     circularFill: (props?: ({
         intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
-        size?: "sm" | "md" | "lg" | "xs" | undefined;
+        size?: "xs" | "sm" | "md" | "lg" | undefined;
         indeterminate?: boolean | undefined;
         striped?: boolean | undefined;
         animated?: boolean | undefined;
@@ -89,7 +89,7 @@ export declare const progressVariants: ((props?: {
     }) | undefined) => string;
     circularLabel: (props?: ({
         intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
-        size?: "sm" | "md" | "lg" | "xs" | undefined;
+        size?: "xs" | "sm" | "md" | "lg" | undefined;
         indeterminate?: boolean | undefined;
         striped?: boolean | undefined;
         animated?: boolean | undefined;

package/dist/primitives/RadioGroup/radioGroup.variants.d.ts

@@ -42,7 +42,7 @@ export declare const radioGroupVariants: ((props?: {
 };
 export declare const radioItemVariants: ((props?: {
     tier?: "commit" | "modify" | undefined;
-    size?: "sm" | "md" | "lg" | "xs" | undefined;
+    size?: "xs" | "sm" | "md" | "lg" | undefined;
     intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
     variant?: "ghost" | "filled" | "outlined" | undefined;
     checked?: boolean | undefined;
@@ -51,7 +51,7 @@ export declare const radioItemVariants: ((props?: {
 } | undefined) => {
     item: (props?: ({
         tier?: "commit" | "modify" | undefined;
-        size?: "sm" | "md" | "lg" | "xs" | undefined;
+        size?: "xs" | "sm" | "md" | "lg" | undefined;
         intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
         variant?: "ghost" | "filled" | "outlined" | undefined;
         checked?: boolean | undefined;
@@ -62,7 +62,7 @@ export declare const radioItemVariants: ((props?: {
     }) | undefined) => string;
     indicator: (props?: ({
         tier?: "commit" | "modify" | undefined;
-        size?: "sm" | "md" | "lg" | "xs" | undefined;
+        size?: "xs" | "sm" | "md" | "lg" | undefined;
         intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
         variant?: "ghost" | "filled" | "outlined" | undefined;
         checked?: boolean | undefined;
@@ -73,7 +73,7 @@ export declare const radioItemVariants: ((props?: {
     }) | undefined) => string;
     dot: (props?: ({
         tier?: "commit" | "modify" | undefined;
-        size?: "sm" | "md" | "lg" | "xs" | undefined;
+        size?: "xs" | "sm" | "md" | "lg" | undefined;
         intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
         variant?: "ghost" | "filled" | "outlined" | undefined;
         checked?: boolean | undefined;
@@ -84,7 +84,7 @@ export declare const radioItemVariants: ((props?: {
     }) | undefined) => string;
     label: (props?: ({
         tier?: "commit" | "modify" | undefined;
-        size?: "sm" | "md" | "lg" | "xs" | undefined;
+        size?: "xs" | "sm" | "md" | "lg" | undefined;
         intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
         variant?: "ghost" | "filled" | "outlined" | undefined;
         checked?: boolean | undefined;
@@ -95,7 +95,7 @@ export declare const radioItemVariants: ((props?: {
     }) | undefined) => string;
     description: (props?: ({
         tier?: "commit" | "modify" | undefined;
-        size?: "sm" | "md" | "lg" | "xs" | undefined;
+        size?: "xs" | "sm" | "md" | "lg" | undefined;
         intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
         variant?: "ghost" | "filled" | "outlined" | undefined;
         checked?: boolean | undefined;