@wow-two-beta/ui 0.0.6 → 0.0.8

package/dist/forms/radioGroup/index.d.ts

@@ -0,0 +1,2 @@
+export { RadioGroup, type RadioGroupProps } from './RadioGroup';
+//# sourceMappingURL=index.d.ts.map

package/dist/forms/radioGroup/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/forms/radioGroup/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,cAAc,CAAC"}

package/dist/forms/switchField/SwitchField.d.ts

@@ -0,0 +1,15 @@
+import { type ReactNode } from 'react';
+import { type SwitchProps } from '../switch/Switch';
+export interface SwitchFieldProps extends Omit<SwitchProps, 'children'> {
+    label: ReactNode;
+    description?: ReactNode;
+    /** Place the switch on the left (default) or right of the label. */
+    side?: 'left' | 'right';
+    wrapperClassName?: string;
+}
+/**
+ * Switch + label + optional description in a single clickable `<label>`.
+ * `side="right"` is the common settings-row pattern (label left, switch right).
+ */
+export declare const SwitchField: import("react").ForwardRefExoticComponent<SwitchFieldProps & import("react").RefAttributes<HTMLInputElement>>;
+//# sourceMappingURL=SwitchField.d.ts.map

package/dist/forms/switchField/SwitchField.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SwitchField.d.ts","sourceRoot":"","sources":["../../../src/forms/switchField/SwitchField.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGnD,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAE5D,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,WAAW,EAAE,UAAU,CAAC;IACrE,KAAK,EAAE,SAAS,CAAC;IACjB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,oEAAoE;IACpE,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACxB,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED;;;GAGG;AACH,eAAO,MAAM,WAAW,+GAwBvB,CAAC"}

package/dist/forms/switchField/index.d.ts

@@ -0,0 +1,2 @@
+export { SwitchField, type SwitchFieldProps } from './SwitchField';
+//# sourceMappingURL=index.d.ts.map

package/dist/forms/switchField/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/forms/switchField/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,eAAe,CAAC"}

package/dist/hooks/index.d.ts

@@ -8,4 +8,5 @@ export { useFocusTrap } from './useFocusTrap';
 export { useScrollLock } from './useScrollLock';
 export { useResizeObserver } from './useResizeObserver';
 export { useMediaQuery } from './useMediaQuery';
+export { useClipboard, type UseClipboardOptions, type ClipboardControls } from './useClipboard';
 //# sourceMappingURL=index.d.ts.map

package/dist/hooks/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AACzE,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AACzE,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,YAAY,EAAE,KAAK,mBAAmB,EAAE,KAAK,iBAAiB,EAAE,MAAM,gBAAgB,CAAC"}

package/dist/hooks/index.js

@@ -1,6 +1,5 @@
-export { useControlled, useDisclosure, useEscape, useEventListener, useFocusTrap, useMediaQuery, useOutsideClick, useResizeObserver } from '../chunk-6NYTRHP7.js';
-export { useScrollLock } from '../chunk-77WSI427.js';
-export { useId } from '../chunk-JTJEI6MF.js';
+export { useClipboard, useControlled, useDisclosure, useEscape, useEventListener, useFocusTrap, useMediaQuery, useOutsideClick, useResizeObserver } from '../chunk-4P2TFUVW.js';
+export { useId, useScrollLock } from '../chunk-KDXJQNB6.js';
 import '../chunk-PZ5AY32C.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/hooks/useClipboard.d.ts

@@ -0,0 +1,21 @@
+export interface UseClipboardOptions {
+    /** Reset `copied` back to false after this many ms. Default 2000. Set 0 to keep state until explicitly reset. */
+    resetAfter?: number;
+}
+export interface ClipboardControls {
+    /** True for `resetAfter` ms after a successful copy. */
+    copied: boolean;
+    /** Last error from `navigator.clipboard.writeText`, if any. */
+    error: Error | null;
+    /** Write `text` to the system clipboard. Returns the promise. */
+    copy: (text: string) => Promise<void>;
+    /** Force-clear the `copied` flag. */
+    reset: () => void;
+}
+/**
+ * Wraps `navigator.clipboard.writeText` with a transient `copied` flag for
+ * post-action UI (icon swap, "Copied!" tooltip). Pass `resetAfter: 0` to
+ * keep `copied` true until you call `reset()`.
+ */
+export declare function useClipboard({ resetAfter }?: UseClipboardOptions): ClipboardControls;
+//# sourceMappingURL=useClipboard.d.ts.map

package/dist/hooks/useClipboard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useClipboard.d.ts","sourceRoot":"","sources":["../../src/hooks/useClipboard.ts"],"names":[],"mappings":"AAEA,MAAM,WAAW,mBAAmB;IAClC,iHAAiH;IACjH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,iBAAiB;IAChC,wDAAwD;IACxD,MAAM,EAAE,OAAO,CAAC;IAChB,+DAA+D;IAC/D,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IACpB,iEAAiE;IACjE,IAAI,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACtC,qCAAqC;IACrC,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED;;;;GAIG;AACH,wBAAgB,YAAY,CAAC,EAAE,UAAiB,EAAE,GAAE,mBAAwB,GAAG,iBAAiB,CAqC/F"}

package/dist/index.css

@@ -5,13 +5,19 @@
 
 /* ---------------------------------------------------------------------------
  * Theme tokens — single source of truth for colors, radii, motion.
+ *
+ * Two layers live here:
+ *   1. RAW SCALES (`--color-brand-*`, `--color-success-*`, …) — full palettes
+ *      kept as escape hatches. Use directly when you need a specific shade.
+ *   2. SEMANTIC TOKENS (`--color-background`, `--color-primary`, …) — the
+ *      24-token surface every atom should consume. These flip in `.dark { }`
+ *      below; consumers can override either layer in their own CSS.
+ *
  * Tailwind v4 emits each `--*` here as a CSS variable AND uses it to generate
- * utility classes (e.g. `--color-brand-500` → `bg-brand-500 text-brand-500 …`).
- * Override any of these in consumer CSS by re-defining the variable; for dark
- * mode, override inside `.dark { … }`.
+ * utility classes (e.g. `--color-primary` → `bg-primary text-primary border-primary …`).
  * ------------------------------------------------------------------------- */
 @theme {
-  /* Brand — custom blue scale */
+  /* ---------- raw color scales ---------- */
   --color-brand-50: #eff6ff;
   --color-brand-100: #dbeafe;
   --color-brand-200: #bfdbfe;
@@ -24,7 +30,6 @@
   --color-brand-900: #1e3a8a;
   --color-brand-950: #172554;
 
-  /* Severity aliases — semantic names mapped onto Tailwind palettes */
   --color-success-50: #f0fdf4;
   --color-success-100: #dcfce7;
   --color-success-500: #22c55e;
@@ -53,6 +58,54 @@
   --color-info-700: #0e7490;
   --color-info-900: #164e63;
 
+  /* ---------- semantic tokens (light mode defaults) ---------- */
+
+  /* Surfaces */
+  --color-background: #ffffff;
+  --color-foreground: #18181b;
+  --color-muted: #f4f4f5;
+  --color-muted-foreground: #71717a;
+  --color-subtle-foreground: #a1a1aa;
+  --color-card: #ffffff;
+  --color-card-foreground: #18181b;
+  --color-popover: #ffffff;
+  --color-popover-foreground: #18181b;
+  --color-inverse: #18181b;
+  --color-inverse-foreground: #fafafa;
+
+  /* Borders & focus */
+  --color-border: #e4e4e7;
+  --color-border-strong: #d4d4d8;
+  --color-input: #d4d4d8;
+  --color-ring: #3b82f6;
+
+  /* Brand (primary) */
+  --color-primary: #2563eb;
+  --color-primary-foreground: #ffffff;
+  --color-primary-soft: #dbeafe;
+  --color-primary-soft-foreground: #1d4ed8;
+
+  /* Severity solids + softs */
+  --color-destructive: #dc2626;
+  --color-destructive-foreground: #ffffff;
+  --color-destructive-soft: #fef2f2;
+  --color-destructive-soft-foreground: #b91c1c;
+
+  --color-success: #16a34a;
+  --color-success-foreground: #ffffff;
+  --color-success-soft: #f0fdf4;
+  --color-success-soft-foreground: #15803d;
+
+  --color-warning: #f59e0b;
+  --color-warning-foreground: #78350f;
+  --color-warning-soft: #fffbeb;
+  --color-warning-soft-foreground: #b45309;
+
+  --color-info: #0891b2;
+  --color-info-foreground: #ffffff;
+  --color-info-soft: #ecfeff;
+  --color-info-soft-foreground: #0e7490;
+
   /* Radii — preserve our pre-v4 scale (some values shift in v4 defaults) */
   --radius-md: 0.5rem;
   --radius-lg: 0.75rem;
@@ -63,6 +116,60 @@
   --animate-indeterminate: indeterminate 1.4s ease-in-out infinite;
 }
 
+/* ---------- dark mode semantic overrides ----------
+ * Toggle by setting `class="dark"` on <html> or <body>.
+ * Raw scales stay constant; only semantic tokens flip.
+ * ------------------------------------------------ */
+.dark {
+  --color-background: #09090b;
+  --color-foreground: #fafafa;
+  --color-muted: #18181b;
+  --color-muted-foreground: #a1a1aa;
+  --color-subtle-foreground: #71717a;
+  --color-card: #18181b;
+  --color-card-foreground: #fafafa;
+  --color-popover: #18181b;
+  --color-popover-foreground: #fafafa;
+  --color-inverse: #fafafa;
+  --color-inverse-foreground: #09090b;
+
+  --color-border: #27272a;
+  --color-border-strong: #3f3f46;
+  --color-input: #3f3f46;
+  --color-ring: #60a5fa;
+
+  --color-primary: #3b82f6;
+  --color-primary-foreground: #ffffff;
+  --color-primary-soft: #1e3a8a;
+  --color-primary-soft-foreground: #dbeafe;
+
+  --color-destructive: #ef4444;
+  --color-destructive-foreground: #ffffff;
+  --color-destructive-soft: #7f1d1d;
+  --color-destructive-soft-foreground: #fee2e2;
+
+  --color-success: #22c55e;
+  --color-success-foreground: #ffffff;
+  --color-success-soft: #14532d;
+  --color-success-soft-foreground: #dcfce7;
+
+  --color-warning: #f59e0b;
+  --color-warning-foreground: #78350f;
+  --color-warning-soft: #78350f;
+  --color-warning-soft-foreground: #fef3c7;
+
+  --color-info: #06b6d4;
+  --color-info-foreground: #ffffff;
+  --color-info-soft: #164e63;
+  --color-info-soft-foreground: #cffafe;
+}
+
+/* Body defaults so consumers get sane page colors out of the box. */
+html, body {
+  background-color: var(--color-background);
+  color: var(--color-foreground);
+}
+
 @keyframes indeterminate {
   0% {
     transform: translateX(-100%);

package/dist/index.d.ts

@@ -7,4 +7,5 @@ export * from './display';
 export * from './feedback';
 export * from './forms';
 export * from './layout';
+export * from './nav';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,SAAS,CAAC;AACjC,OAAO,KAAK,KAAK,MAAM,SAAS,CAAC;AACjC,OAAO,KAAK,KAAK,MAAM,SAAS,CAAC;AACjC,OAAO,KAAK,UAAU,MAAM,cAAc,CAAC;AAG3C,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,SAAS,CAAC;AACjC,OAAO,KAAK,KAAK,MAAM,SAAS,CAAC;AACjC,OAAO,KAAK,KAAK,MAAM,SAAS,CAAC;AACjC,OAAO,KAAK,UAAU,MAAM,cAAc,CAAC;AAG3C,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,OAAO,CAAC"}

package/dist/index.js

@@ -1,16 +1,16 @@
-export { Checkbox, EmailInput, Fieldset, FormErrorMessage, FormHelperText, Label, Legend, NumberInput, PasswordInput, Radio, SearchInput, Slider, Switch, TelInput, TextInput, Textarea, UrlInput } from './chunk-NJZS7RIH.js';
-export { AspectRatio, Box, Center, Container, Flex, Grid, HStack, ScrollArea, Spacer, Stack, VStack, containerVariants, gridVariants, stackVariants } from './chunk-SYG6ZE42.js';
-export { hooks_exports as hooks } from './chunk-6NYTRHP7.js';
-export { primitives_exports as primitives } from './chunk-JCMV6IT4.js';
-import './chunk-Q27NAHVB.js';
-import './chunk-77WSI427.js';
-import './chunk-JTJEI6MF.js';
-export { Button, IconButton, Link, buttonVariants, iconButtonVariants, linkVariants } from './chunk-L2RYQWZZ.js';
+export { CharacterCount, Checkbox, CheckboxField, CheckboxGroup, ChoiceCard, CurrencyInput, EmailInput, Fieldset, FilePicker, FormErrorMessage, FormField, FormHelperText, InputAddon, InputGroup, Label, LabeledInput, Legend, MaskedInput, NumberInput, PasswordInput, PasswordStrength, PercentInput, PinInput, Radio, RadioField, RadioGroup, SearchInput, Slider, Switch, SwitchField, TelInput, TextInput, Textarea, UrlInput } from './chunk-X2LTOZ7F.js';
+export { AspectRatio, Box, Center, Cluster, Container, Flex, Frame, Grid, HStack, Inline, ScrollArea, Spacer, Stack, TwoColumn, VStack, containerVariants, gridVariants, stackVariants } from './chunk-NKGNOOXJ.js';
+export { Breadcrumb, NavItem, Pagination } from './chunk-L32PXXQL.js';
+export { Button, ButtonGroup, CopyButton, DisclosureButton, FAB, IconButton, Link, OverlayButton, SegmentedControl, ToggleButton, ToggleButtonGroup, buttonVariants, fabVariants, iconButtonVariants, linkVariants, overlayButtonVariants, toggleButtonVariants } from './chunk-D5CHR6RX.js';
+export { Avatar, AvatarGroup, Badge, BadgeOverlay, Card, Code, CountBadge, DescriptionList, EmptyState, Heading, Highlight, Image, InfoRow, Kbd, KeyboardShortcut, Mark, NotificationDot, Quote, SectionHeader, Separator, Snippet, Stat, Status, Tag, Text, Tooltip, avatarVariants, badgeVariants, codeVariants, headingVariants, tagVariants, textVariants } from './chunk-7SGLT2LM.js';
+export { primitives_exports as primitives } from './chunk-SL5YJADS.js';
+import './chunk-WEM32VIJ.js';
+export { hooks_exports as hooks } from './chunk-4P2TFUVW.js';
 import './chunk-33IOXQYO.js';
-export { Avatar, Badge, Code, Heading, Image, Kbd, Mark, Quote, Separator, Tag, Text, avatarVariants, badgeVariants, codeVariants, headingVariants, tagVariants, textVariants } from './chunk-MP4OTUFA.js';
-export { icons_exports as icons } from './chunk-TDX22OWF.js';
-export { AlertSimple, BannerSimple, ProgressBar, ProgressCircle, Skeleton, Spinner, ToastSimple, alertSimpleVariants, bannerSimpleVariants, progressFillVariants, progressTrackVariants, skeletonVariants, spinnerVariants, toastSimpleVariants } from './chunk-YLN7VMYU.js';
+import './chunk-KDXJQNB6.js';
+export { Alert, AlertSimple, Banner, BannerSimple, Callout, InlineSpinner, LoadingState, MeterBar, ProgressBar, ProgressCircle, ProgressSteps, Skeleton, Spinner, StatusIndicator, Toast, ToastSimple, TrendIndicator, alertSimpleVariants, bannerSimpleVariants, progressFillVariants, progressTrackVariants, skeletonVariants, spinnerVariants, toastSimpleVariants } from './chunk-RIW2V3N4.js';
 export { utils_exports as utils } from './chunk-BMBIZLO4.js';
+export { icons_exports as icons } from './chunk-TDX22OWF.js';
 import './chunk-DN7WBRIV.js';
 import './chunk-KZ4VFY2T.js';
 import './chunk-PZ5AY32C.js';

package/dist/layout/cluster/Cluster.d.ts

@@ -0,0 +1,13 @@
+import { type ComponentPropsWithoutRef } from 'react';
+export interface ClusterProps extends ComponentPropsWithoutRef<'div'> {
+    /** Gap between children. Default `4`. */
+    gap?: '2' | '3' | '4' | '6' | '8';
+    /** Justify on cross axis. Default `center`. */
+    justify?: 'start' | 'center' | 'end';
+}
+/**
+ * Centered wrapping row — for auth-page action clusters, hero CTAs, footer
+ * link groups. `Inline` left-aligns; `Cluster` centers by default.
+ */
+export declare const Cluster: import("react").ForwardRefExoticComponent<ClusterProps & import("react").RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=Cluster.d.ts.map

package/dist/layout/cluster/Cluster.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Cluster.d.ts","sourceRoot":"","sources":["../../../src/layout/cluster/Cluster.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,wBAAwB,EAAE,MAAM,OAAO,CAAC;AAGlE,MAAM,WAAW,YAAa,SAAQ,wBAAwB,CAAC,KAAK,CAAC;IACnE,yCAAyC;IACzC,GAAG,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;IAClC,+CAA+C;IAC/C,OAAO,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;CACtC;AAWD;;;GAGG;AACH,eAAO,MAAM,OAAO,yGAQnB,CAAC"}

package/dist/layout/cluster/index.d.ts

@@ -0,0 +1,2 @@
+export { Cluster, type ClusterProps } from './Cluster';
+//# sourceMappingURL=index.d.ts.map

package/dist/layout/cluster/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/layout/cluster/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,WAAW,CAAC"}

package/dist/layout/frame/Frame.d.ts

@@ -0,0 +1,17 @@
+import { type ComponentPropsWithoutRef } from 'react';
+export interface FrameProps extends ComponentPropsWithoutRef<'div'> {
+    /** Padding. Default `4`. */
+    padding?: '0' | '2' | '3' | '4' | '6' | '8';
+    /** Border radius. Default `md`. */
+    radius?: 'none' | 'sm' | 'md' | 'lg';
+    /** Surface background — `card` (raised) or `muted` (recessed). Default `card`. */
+    surface?: 'card' | 'muted' | 'transparent';
+    /** Show the border. Default `true`. */
+    bordered?: boolean;
+}
+/**
+ * Bordered shell with padding + radius — `Card` without slot semantics.
+ * Use when you want the visual but not the structured Header/Body/Footer.
+ */
+export declare const Frame: import("react").ForwardRefExoticComponent<FrameProps & import("react").RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=Frame.d.ts.map

package/dist/layout/frame/Frame.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Frame.d.ts","sourceRoot":"","sources":["../../../src/layout/frame/Frame.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,wBAAwB,EAAE,MAAM,OAAO,CAAC;AAGlE,MAAM,WAAW,UAAW,SAAQ,wBAAwB,CAAC,KAAK,CAAC;IACjE,4BAA4B;IAC5B,OAAO,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;IAC5C,mCAAmC;IACnC,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IACrC,kFAAkF;IAClF,OAAO,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,aAAa,CAAC;IAC3C,uCAAuC;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAcD;;;GAGG;AACH,eAAO,MAAM,KAAK,uGAcjB,CAAC"}

package/dist/layout/frame/index.d.ts

@@ -0,0 +1,2 @@
+export { Frame, type FrameProps } from './Frame';
+//# sourceMappingURL=index.d.ts.map

package/dist/layout/frame/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/layout/frame/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC"}

package/dist/layout/index.d.ts

@@ -9,4 +9,8 @@ export * from './aspectRatio';
 export * from './spacer';
 export * from './center';
 export * from './scrollArea';
+export * from './inline';
+export * from './cluster';
+export * from './frame';
+export * from './twoColumn';
 //# sourceMappingURL=index.d.ts.map

package/dist/layout/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/layout/index.ts"],"names":[],"mappings":"AAAA,cAAc,OAAO,CAAC;AACtB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,aAAa,CAAC;AAC5B,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/layout/index.ts"],"names":[],"mappings":"AAAA,cAAc,OAAO,CAAC;AACtB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,aAAa,CAAC;AAC5B,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,SAAS,CAAC;AACxB,cAAc,aAAa,CAAC"}

package/dist/layout/index.js

@@ -1,4 +1,4 @@
-export { AspectRatio, Box, Center, Container, Flex, Grid, HStack, ScrollArea, Spacer, Stack, VStack, containerVariants, gridVariants, stackVariants } from '../chunk-SYG6ZE42.js';
+export { AspectRatio, Box, Center, Cluster, Container, Flex, Frame, Grid, HStack, Inline, ScrollArea, Spacer, Stack, TwoColumn, VStack, containerVariants, gridVariants, stackVariants } from '../chunk-NKGNOOXJ.js';
 import '../chunk-BMBIZLO4.js';
 import '../chunk-DN7WBRIV.js';
 import '../chunk-KZ4VFY2T.js';

package/dist/layout/inline/Inline.d.ts

@@ -0,0 +1,13 @@
+import { type ComponentPropsWithoutRef } from 'react';
+export interface InlineProps extends ComponentPropsWithoutRef<'div'> {
+    /** Gap between children (Tailwind spacing). Default `2`. */
+    gap?: '0' | '1' | '2' | '3' | '4' | '6' | '8';
+    /** Vertical alignment. Default `center`. */
+    align?: 'start' | 'center' | 'end' | 'baseline';
+}
+/**
+ * Wrapping horizontal row with consistent gap. Use for chips/tag rows,
+ * inline button groups, breadcrumb-like sequences.
+ */
+export declare const Inline: import("react").ForwardRefExoticComponent<InlineProps & import("react").RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=Inline.d.ts.map

package/dist/layout/inline/Inline.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Inline.d.ts","sourceRoot":"","sources":["../../../src/layout/inline/Inline.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,wBAAwB,EAAE,MAAM,OAAO,CAAC;AAGlE,MAAM,WAAW,WAAY,SAAQ,wBAAwB,CAAC,KAAK,CAAC;IAClE,4DAA4D;IAC5D,GAAG,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;IAC9C,4CAA4C;IAC5C,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,UAAU,CAAC;CACjD;AAYD;;;GAGG;AACH,eAAO,MAAM,MAAM,wGAQlB,CAAC"}

package/dist/layout/inline/index.d.ts

@@ -0,0 +1,2 @@
+export { Inline, type InlineProps } from './Inline';
+//# sourceMappingURL=index.d.ts.map

package/dist/layout/inline/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/layout/inline/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC"}

package/dist/layout/twoColumn/TwoColumn.d.ts

@@ -0,0 +1,19 @@
+import { type ComponentPropsWithoutRef, type ReactNode } from 'react';
+export interface TwoColumnProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children'> {
+    /** Sidebar / aside content. */
+    aside: ReactNode;
+    /** Main content. */
+    children: ReactNode;
+    /** Aside width — Tailwind class string (e.g. `w-64`). Default `w-64`. */
+    asideWidth?: string;
+    /** Side the aside sits on. Default `left`. */
+    asideSide?: 'left' | 'right';
+    /** Gap between aside and main. Default `6`. */
+    gap?: '0' | '4' | '6' | '8' | '10';
+}
+/**
+ * Two-pane layout — fixed-width aside + flexible main. Sidebar+content,
+ * filter+results, table-of-contents+article patterns.
+ */
+export declare const TwoColumn: import("react").ForwardRefExoticComponent<TwoColumnProps & import("react").RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=TwoColumn.d.ts.map

package/dist/layout/twoColumn/TwoColumn.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TwoColumn.d.ts","sourceRoot":"","sources":["../../../src/layout/twoColumn/TwoColumn.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,wBAAwB,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGlF,MAAM,WAAW,cAAe,SAAQ,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC;IACvF,+BAA+B;IAC/B,KAAK,EAAE,SAAS,CAAC;IACjB,oBAAoB;IACpB,QAAQ,EAAE,SAAS,CAAC;IACpB,yEAAyE;IACzE,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,8CAA8C;IAC9C,SAAS,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC7B,+CAA+C;IAC/C,GAAG,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,CAAC;CACpC;AAMD;;;GAGG;AACH,eAAO,MAAM,SAAS,2GAmBrB,CAAC"}

package/dist/layout/twoColumn/index.d.ts

@@ -0,0 +1,2 @@
+export { TwoColumn, type TwoColumnProps } from './TwoColumn';
+//# sourceMappingURL=index.d.ts.map

package/dist/layout/twoColumn/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/layout/twoColumn/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,aAAa,CAAC"}

package/dist/nav/breadcrumb/Breadcrumb.d.ts

@@ -0,0 +1,18 @@
+import { type ComponentPropsWithoutRef, type ReactNode } from 'react';
+export interface BreadcrumbItem {
+    label: ReactNode;
+    /** Make this item a link. Last item is typically rendered as plain text. */
+    href?: string;
+}
+export interface BreadcrumbProps extends ComponentPropsWithoutRef<'nav'> {
+    items: BreadcrumbItem[];
+    /** Custom separator element. Default chevron-right icon. */
+    separator?: ReactNode;
+}
+/**
+ * Linear position trail — list of links + separators. The last item is
+ * always rendered as `aria-current="page"` and not a link. Use the L5
+ * collapsing version when the chain gets long.
+ */
+export declare const Breadcrumb: import("react").ForwardRefExoticComponent<BreadcrumbProps & import("react").RefAttributes<HTMLElement>>;
+//# sourceMappingURL=Breadcrumb.d.ts.map

package/dist/nav/breadcrumb/Breadcrumb.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Breadcrumb.d.ts","sourceRoot":"","sources":["../../../src/nav/breadcrumb/Breadcrumb.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAwB,KAAK,wBAAwB,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAK5F,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,SAAS,CAAC;IACjB,4EAA4E;IAC5E,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,eAAgB,SAAQ,wBAAwB,CAAC,KAAK,CAAC;IACtE,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,4DAA4D;IAC5D,SAAS,CAAC,EAAE,SAAS,CAAC;CACvB;AAED;;;;GAIG;AACH,eAAO,MAAM,UAAU,yGAoCtB,CAAC"}

package/dist/nav/breadcrumb/index.d.ts

@@ -0,0 +1,2 @@
+export { Breadcrumb, type BreadcrumbProps, type BreadcrumbItem } from './Breadcrumb';
+//# sourceMappingURL=index.d.ts.map

package/dist/nav/breadcrumb/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/nav/breadcrumb/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,KAAK,cAAc,EAAE,MAAM,cAAc,CAAC"}

package/dist/nav/index.d.ts

@@ -0,0 +1,4 @@
+export * from './breadcrumb';
+export * from './pagination';
+export * from './navItem';
+//# sourceMappingURL=index.d.ts.map

package/dist/nav/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/nav/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC"}

package/dist/nav/index.js

@@ -0,0 +1,12 @@
+export { Breadcrumb, NavItem, Pagination } from '../chunk-L32PXXQL.js';
+import '../chunk-SL5YJADS.js';
+import '../chunk-WEM32VIJ.js';
+import '../chunk-33IOXQYO.js';
+import '../chunk-KDXJQNB6.js';
+import '../chunk-BMBIZLO4.js';
+import '../chunk-TDX22OWF.js';
+import '../chunk-DN7WBRIV.js';
+import '../chunk-KZ4VFY2T.js';
+import '../chunk-PZ5AY32C.js';
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/nav/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}

package/dist/nav/navItem/NavItem.d.ts

@@ -0,0 +1,22 @@
+import { type AnchorHTMLAttributes, type ReactNode } from 'react';
+export interface NavItemProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
+    /** When true, render the child element instead of an `<a>` (router Link). */
+    asChild?: boolean;
+    /** Optional leading icon. */
+    icon?: ReactNode;
+    /** Visual label. */
+    children: ReactNode;
+    /** Trailing slot — typically a count badge or status dot. */
+    trailing?: ReactNode;
+    /** Mark active (visual + `aria-current="page"`). */
+    isActive?: boolean;
+    /** Visual size. Default `md`. */
+    size?: 'sm' | 'md' | 'lg';
+}
+/**
+ * Sidebar / nav row — icon + label + trailing slot + active state. Use as
+ * a clickable Link (default `<a>`) or pass `asChild` to forward to a router
+ * Link. Sets `aria-current="page"` when `isActive`.
+ */
+export declare const NavItem: import("react").ForwardRefExoticComponent<NavItemProps & import("react").RefAttributes<HTMLAnchorElement>>;
+//# sourceMappingURL=NavItem.d.ts.map

package/dist/nav/navItem/NavItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavItem.d.ts","sourceRoot":"","sources":["../../../src/nav/navItem/NavItem.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,oBAAoB,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAI9E,MAAM,WAAW,YAAa,SAAQ,oBAAoB,CAAC,iBAAiB,CAAC;IAC3E,6EAA6E;IAC7E,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,6BAA6B;IAC7B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,oBAAoB;IACpB,QAAQ,EAAE,SAAS,CAAC;IACpB,6DAA6D;IAC7D,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,oDAAoD;IACpD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iCAAiC;IACjC,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;CAC3B;AAQD;;;;GAIG;AACH,eAAO,MAAM,OAAO,4GAuBnB,CAAC"}

package/dist/nav/navItem/index.d.ts

@@ -0,0 +1,2 @@
+export { NavItem, type NavItemProps } from './NavItem';
+//# sourceMappingURL=index.d.ts.map

package/dist/nav/navItem/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/nav/navItem/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,WAAW,CAAC"}

package/dist/nav/pagination/Pagination.d.ts

@@ -0,0 +1,19 @@
+import { type ComponentPropsWithoutRef } from 'react';
+export interface PaginationProps extends Omit<ComponentPropsWithoutRef<'nav'>, 'onChange'> {
+    /** Total page count (1-based). */
+    total: number;
+    /** Current page (1-based). */
+    page: number;
+    /** Fires with the new page on click. */
+    onPageChange: (page: number) => void;
+    /** Number of page buttons surrounding the current. Default `1` (so 1 + current + 1 = 3). */
+    siblings?: number;
+    /** Hide first/last buttons (just show prev/next + numbers). */
+    hideFirstLast?: boolean;
+}
+/**
+ * Compact page-number row with prev/next + ellipses for skipped ranges.
+ * Stateless — consumer drives `page` and reacts to `onPageChange`.
+ */
+export declare const Pagination: import("react").ForwardRefExoticComponent<PaginationProps & import("react").RefAttributes<HTMLElement>>;
+//# sourceMappingURL=Pagination.d.ts.map

package/dist/nav/pagination/Pagination.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../../src/nav/pagination/Pagination.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,wBAAwB,EAAE,MAAM,OAAO,CAAC;AAKlE,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC;IACxF,kCAAkC;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,8BAA8B;IAC9B,IAAI,EAAE,MAAM,CAAC;IACb,wCAAwC;IACxC,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,4FAA4F;IAC5F,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,+DAA+D;IAC/D,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAkBD;;;GAGG;AACH,eAAO,MAAM,UAAU,yGAoDtB,CAAC"}

package/dist/nav/pagination/index.d.ts

@@ -0,0 +1,2 @@
+export { Pagination, type PaginationProps } from './Pagination';
+//# sourceMappingURL=index.d.ts.map

package/dist/nav/pagination/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/nav/pagination/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,cAAc,CAAC"}

package/dist/primitives/index.js

@@ -1,8 +1,7 @@
-export { AccessibleIcon, AnchoredPositioner, DirectionProvider, DismissableLayer, FocusScope, Portal, Presence, RovingFocusGroup, ScrollLockProvider, VisuallyHidden, createCollection, useDirection, useRovingFocusItem } from '../chunk-JCMV6IT4.js';
-export { FormControlProvider, useFormControl } from '../chunk-Q27NAHVB.js';
-import '../chunk-77WSI427.js';
-import '../chunk-JTJEI6MF.js';
+export { AccessibleIcon, AnchoredPositioner, DirectionProvider, DismissableLayer, FocusScope, Portal, Presence, RovingFocusGroup, ScrollLockProvider, VisuallyHidden, createCollection, useDirection, useRovingFocusItem } from '../chunk-SL5YJADS.js';
+export { FormControlProvider, useFormControl } from '../chunk-WEM32VIJ.js';
 export { Slot } from '../chunk-33IOXQYO.js';
+import '../chunk-KDXJQNB6.js';
 import '../chunk-DN7WBRIV.js';
 import '../chunk-KZ4VFY2T.js';
 import '../chunk-PZ5AY32C.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wow-two-beta/ui",
-  "version": "0.0.6",
+  "version": "0.0.8",
   "description": "Beta-forever React UI library for the wow-two ecosystem.",
   "license": "MIT",
   "repository": {
@@ -72,6 +72,10 @@
       "import": "./dist/layout/index.js",
       "types": "./dist/layout/index.d.ts"
     },
+    "./nav": {
+      "import": "./dist/nav/index.js",
+      "types": "./dist/nav/index.d.ts"
+    },
     "./styles.css": "./dist/index.css"
   },
   "scripts": {