@rfdtech/components 1.21.0 → 1.22.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (81) hide show
  1. package/README.md +143 -43
  2. package/dist/adapters/context-adapter.d.ts +18 -0
  3. package/dist/adapters/context-adapter.d.ts.map +1 -0
  4. package/dist/adapters/next-adapter.d.ts +23 -0
  5. package/dist/adapters/next-adapter.d.ts.map +1 -0
  6. package/dist/adapters/react-router-adapter.d.ts +9 -0
  7. package/dist/adapters/react-router-adapter.d.ts.map +1 -0
  8. package/dist/adapters/registry.d.ts +19 -0
  9. package/dist/adapters/registry.d.ts.map +1 -0
  10. package/dist/components/app-header/AppHeader.d.ts +3 -2
  11. package/dist/components/app-header/AppHeader.d.ts.map +1 -1
  12. package/dist/components/app-header/AppHeaderProfile.d.ts.map +1 -1
  13. package/dist/components/app-header/index.d.ts +2 -2
  14. package/dist/components/app-header/index.d.ts.map +1 -1
  15. package/dist/components/app-layout/AppLayout.d.ts +6 -0
  16. package/dist/components/app-layout/AppLayout.d.ts.map +1 -1
  17. package/dist/components/app-layout/AppLayoutInner.d.ts +1 -0
  18. package/dist/components/app-layout/AppLayoutInner.d.ts.map +1 -1
  19. package/dist/components/metric-card/MetricCard.d.ts.map +1 -1
  20. package/dist/components/metric-card/index.d.ts +1 -1
  21. package/dist/components/metric-card/index.d.ts.map +1 -1
  22. package/dist/components/sidebar/Sidebar.d.ts +2 -2
  23. package/dist/components/sidebar/Sidebar.d.ts.map +1 -1
  24. package/dist/components/sidebar/index.d.ts.map +1 -1
  25. package/dist/components/stepper/Stepper.d.ts +12 -0
  26. package/dist/components/stepper/Stepper.d.ts.map +1 -0
  27. package/dist/components/stepper/Stepper.test.d.ts +2 -0
  28. package/dist/components/stepper/Stepper.test.d.ts.map +1 -0
  29. package/dist/components/stepper/StepperContext.d.ts +4 -0
  30. package/dist/components/stepper/StepperContext.d.ts.map +1 -0
  31. package/dist/components/stepper/index.d.ts +3 -0
  32. package/dist/components/stepper/index.d.ts.map +1 -0
  33. package/dist/components/table/Table.d.ts +3 -6
  34. package/dist/components/table/Table.d.ts.map +1 -1
  35. package/dist/components/table/TableHeader.d.ts +3 -10
  36. package/dist/components/table/TableHeader.d.ts.map +1 -1
  37. package/dist/components/table/TablePagination.d.ts.map +1 -1
  38. package/dist/components/table/index.d.ts +1 -1
  39. package/dist/components/table/index.d.ts.map +1 -1
  40. package/dist/components/tabs/Tabs.d.ts.map +1 -1
  41. package/dist/components/tabs/hooks/useTabsLineIndicator.d.ts.map +1 -1
  42. package/dist/components/timeline/Timeline.d.ts +8 -0
  43. package/dist/components/timeline/Timeline.d.ts.map +1 -0
  44. package/dist/components/timeline/Timeline.test.d.ts +2 -0
  45. package/dist/components/timeline/Timeline.test.d.ts.map +1 -0
  46. package/dist/components/timeline/index.d.ts +3 -0
  47. package/dist/components/timeline/index.d.ts.map +1 -0
  48. package/dist/contexts/router-adapter-context.d.ts +27 -0
  49. package/dist/contexts/router-adapter-context.d.ts.map +1 -0
  50. package/dist/hooks/useTableFilter.d.ts.map +1 -1
  51. package/dist/hooks/useTablePagination.d.ts.map +1 -1
  52. package/dist/hooks/useTableState.d.ts +1 -1
  53. package/dist/hooks/useTableState.d.ts.map +1 -1
  54. package/dist/index.cjs +49 -47
  55. package/dist/index.css +1 -1
  56. package/dist/index.d.ts +3 -0
  57. package/dist/index.d.ts.map +1 -1
  58. package/dist/index.js +9975 -9356
  59. package/dist/next-index.d.ts +44 -0
  60. package/dist/next-index.d.ts.map +1 -0
  61. package/dist/next.cjs +272 -0
  62. package/dist/next.css +1 -0
  63. package/dist/next.d.ts +29 -0
  64. package/dist/next.js +51481 -0
  65. package/dist/types/app-header.d.ts +23 -2
  66. package/dist/types/app-header.d.ts.map +1 -1
  67. package/dist/types/metric-card.d.ts +3 -0
  68. package/dist/types/metric-card.d.ts.map +1 -1
  69. package/dist/types/router-adapter.d.ts +46 -0
  70. package/dist/types/router-adapter.d.ts.map +1 -0
  71. package/dist/types/sidebar.d.ts +11 -0
  72. package/dist/types/sidebar.d.ts.map +1 -1
  73. package/dist/types/stepper.d.ts +45 -0
  74. package/dist/types/stepper.d.ts.map +1 -0
  75. package/dist/types/table.d.ts +69 -0
  76. package/dist/types/table.d.ts.map +1 -1
  77. package/dist/types/tabs.d.ts +1 -1
  78. package/dist/types/tabs.d.ts.map +1 -1
  79. package/dist/types/timeline.d.ts +52 -0
  80. package/dist/types/timeline.d.ts.map +1 -0
  81. package/package.json +19 -2
package/README.md CHANGED
@@ -26,7 +26,7 @@ Add this once to your app entry (`main.tsx` or `App.tsx`):
26
26
  import "@rfdtech/components/style.css";
27
27
  ```
28
28
 
29
- Components load CSS automatically from the JS bundle (the JS bundle includes `import './index.css'`), but the explicit import above ensures reliable production styling. After upgrading, clear Vite's dependency cache if styles look stale: `rm -rf node_modules/.vite`.
29
+ Components load CSS automatically from the JS bundle (the JS bundle includes `import './index.css'`), but the explicit import above ensures reliable production styling. After upgrading, clear Vite's dependency cache if styles look stale: `rm -rf node_modules/.vite`. alright
30
30
 
31
31
  ### 3. Wrap with ThemeProvider
32
32
 
@@ -53,7 +53,7 @@ If your project uses Tailwind v4, all `--gsl-*` design tokens are automatically
53
53
  The `@theme` block ships inside `style.css`. The consumer's Tailwind build processes it and generates these utility classes:
54
54
 
55
55
  | Utility | Resolves to |
56
- |---------|-------------|
56
+ | --------- | ------------- |
57
57
  | `bg-primary` / `text-primary` | `var(--gsl-primary)` |
58
58
  | `bg-primary-foreground` / `text-primary-foreground` | `var(--gsl-on-primary)` |
59
59
  | `bg-background` / `text-foreground` | `var(--gsl-page-bg)` / `var(--gsl-text)` |
@@ -72,23 +72,89 @@ The `@theme` block ships inside `style.css`. The consumer's Tailwind build proce
72
72
 
73
73
  **Non-Tailwind consumers** are unaffected. Browsers silently ignore `@theme` as an unknown at-rule. All `--gsl-*` tokens continue to work as CSS custom properties.
74
74
 
75
- ### 5. Customize tokens
75
+ ### 6. Next.js App Router
76
76
 
77
- Override any `--gsl-*` token on any ancestor:
77
+ The library ships a `/next` subpath for Next.js App Router. All components and hooks work with Next.js by wrapping your app in `RouterAdapterProvider`:
78
78
 
79
- ```css
80
- .my-app {
79
+ ```tsx
80
+ // app/providers.tsx
81
+ "use client";
82
+ import { RouterAdapterProvider, useNextRouterAdapter } from "@rfdtech/components/next";
83
+
84
+ export function Providers({ children }) {
85
+ const adapter = useNextRouterAdapter();
86
+ return <RouterAdapterProvider value={adapter}>{children}</RouterAdapterProvider>;
87
+ }
88
+ ```
89
+
90
+ Then use components from `@rfdtech/components/next`:
91
+
92
+ ```tsx
93
+ import { useTableState, SidebarLink } from "@rfdtech/components/next";
94
+ ```
95
+
96
+ See the [RouterAdapter](/docs/router-adapter) docs page for full setup.
97
+
98
+ ### 7. Customize tokens
99
+
100
+ GSL components read `--gsl-*` CSS variables. Override any of them by
101
+ declaring a new value on the same selectors the library uses.
102
+
103
+ **Step 1 — Import the library CSS** so its defaults are loaded:
104
+
105
+ ```ts title="src/main.tsx"
106
+ import "@rfdtech/components/style.css";
107
+ ```
108
+
109
+ **Step 2 — Create a theme override file** and import it AFTER the
110
+ library CSS. CSS source order matters: later rules with the same
111
+ specificity win.
112
+
113
+ ```ts title="src/main.tsx"
114
+ import "@rfdtech/components/style.css";
115
+ import "./styles/theme.css"; // imported after
116
+ ```
117
+
118
+ **Step 3 — Override the tokens.** The library writes its defaults on
119
+ these selectors:
120
+
121
+ | Selector | When it matches |
122
+ |----------|-----------------|
123
+ | `:root` | No theme attribute is set (no `ThemeProvider` mounted) |
124
+ | `:root[data-gsl-theme="light"]` | Light mode on `<html>` — `ThemeProvider` writes the attribute here |
125
+ | `:root[data-gsl-theme="dark"]` | Dark mode on `<html>` |
126
+ | `.gsl-theme` | A consumer wrapper `<div class="gsl-theme">` |
127
+ | `.gsl-theme[data-gsl-theme="light"]` | Wrapper + light attribute |
128
+ | `.gsl-theme[data-gsl-theme="dark"]` | Wrapper + dark attribute |
129
+
130
+ A bare `:root { ... }` only matches the first row, so the library's
131
+ default keeps winning on rows 2–6 once `ThemeProvider` mounts. To
132
+ cover all of them, list every selector in one rule and hardcode the
133
+ values (don't chain `var(--something)` — just write the color):
134
+
135
+ ```css title="src/styles/theme.css"
136
+ :root,
137
+ :root[data-gsl-theme="light"],
138
+ .gsl-theme[data-gsl-theme="light"],
139
+ :root[data-gsl-theme="dark"],
140
+ .gsl-theme[data-gsl-theme="dark"] {
81
141
  --gsl-primary: #1d4ed8;
82
142
  --gsl-primary-light: #eff6ff;
143
+ --gsl-focus: #1d4ed8;
144
+ --gsl-on-primary: #ffffff;
83
145
  }
84
146
  ```
85
147
 
148
+ That one block overrides the primary color in light mode, dark mode,
149
+ and the unthemed fallback. The same shape works for any other
150
+ `--gsl-*` token — list every selector, hardcode the value.
151
+
86
152
  ## Design tokens
87
153
 
88
154
  Quick reference of commonly used tokens and their light-mode defaults:
89
155
 
90
156
  | Token | Light default | Use |
91
- |-------|---------------|-----|
157
+ | ------- | --------------- | ----- |
92
158
  | `--gsl-primary` | `#dc2626` | Buttons, focus rings, accents |
93
159
  | `--gsl-primary-light` | `#fef2f2` | Selected rows, hover fills |
94
160
  | `--gsl-bg` | `#ffffff` | Surfaces |
@@ -104,7 +170,6 @@ Quick reference of commonly used tokens and their light-mode defaults:
104
170
 
105
171
  See the [Theme](/docs/theme) docs page for the full token reference (radius, shadows, z-index, fonts) and controlled mode.
106
172
 
107
-
108
173
  ## Hooks
109
174
 
110
175
  Shared hooks for URL-driven overlay state and router integration. See the [Hooks](/docs/hooks) docs page for full API reference.
@@ -130,7 +195,6 @@ openWith({ userId: "42" });
130
195
 
131
196
  Exports: `useSearchParamOverlay`, `useDialogSearchParam`, `useModalSearchParam`, `createSearchParamAdapter`, `createBrowserSearchParamAdapter`, `readOverlayData`, `writeOverlayData`, `clearOverlayData`, `getDataPrefix`. Types: `SearchParamOverlayState`, `SearchParamOverlayData`, `SearchParamAdapter`, `UseSearchParamOverlayOptions`, `UseSearchParamOverlayReturn`.
132
197
 
133
-
134
198
  ## AppHeader
135
199
 
136
200
  Compound header bar with `AppHeader`, `AppHeaderSearch`, `AppHeaderActions`, `AppHeaderNotifications`, and `AppHeaderProfile`. Nest search on the left and group switcher, notifications, and profile inside `AppHeaderActions` on the right.
@@ -168,7 +232,6 @@ import {
168
232
 
169
233
  Props: `AppHeader` — `className`, `children`. `AppHeaderActions` — `className`, `children`. Exported types: `AppHeaderProps`, `AppHeaderActionsProps`, `AppHeaderSearchProps`, `AppHeaderSearchDataGroup`, `AppHeaderSearchItem`, `AppHeaderNotificationsProps`, `AppHeaderProfileProps`, `AppUser`.
170
234
 
171
-
172
235
  ## AppLayout
173
236
 
174
237
  Application layout container that auto-positions `AppHeader`, `AppSidebar`, and `AppBody` by component type. Sidebar on the left, header sticky at the top, main content filling the rest. See the [AppLayout](/docs/app-layout) docs page for props and exported types.
@@ -189,7 +252,6 @@ import { AppLayout, AppSidebar, AppBody } from "@rfdtech/components";
189
252
 
190
253
  Props: `AppLayout` — `children`, `className`. `AppSidebar` — `children`, `className`. `AppBody` — `children`, `className`. Exported types: `AppLayoutProps`, `AppSidebarProps`, `AppBodyProps`.
191
254
 
192
-
193
255
  ## AppSwitcher
194
256
 
195
257
  Google Apps–style 9-dot launcher for switching between GSL systems. Drop it into your header to let users jump between products. Pass `apps` directly from your own data layer; use `loading` while data is being fetched.
@@ -215,7 +277,6 @@ Props: `apps`, `loading`, `loadingLabel`, `columns`, `open`, `onOpenChange`, `on
215
277
 
216
278
  Also exported: `AppSwitcherItem`, `GridIcon`, `SystemAppIcon`, `useAppSwitcher`.
217
279
 
218
-
219
280
  ## Badge
220
281
 
221
282
  Compact inline label for status, counts, and metadata with semantic color variants. See the [Badge](/docs/badge) docs page for props and exported types.
@@ -233,7 +294,6 @@ import { Badge } from "@rfdtech/components";
233
294
 
234
295
  Props: `variant`, `size`, `classNames`, `className`, and standard `span` attributes. Exported types: `BadgeProps`, `BadgeClassNames`, `BadgeVariant`, `BadgeSize`.
235
296
 
236
-
237
297
  ## Breadcrumb
238
298
 
239
299
  Compound breadcrumb primitives for hierarchical page trails. See the [Breadcrumb](/docs/breadcrumb) docs page for props and exported types.
@@ -263,7 +323,6 @@ import {
263
323
 
264
324
  Exported parts: `Breadcrumb`, `BreadcrumbList`, `BreadcrumbItem`, `BreadcrumbLink`, `BreadcrumbPage`, `BreadcrumbSeparator`, `BreadcrumbEllipsis`. Exported types: `BreadcrumbProps`, `BreadcrumbLinkProps`, `BreadcrumbPageProps`, and related `*ClassNames` interfaces.
265
325
 
266
-
267
326
  ## BulkImportModal
268
327
 
269
328
  Four-step modal wizard for importing spreadsheet data (.xlsx, .xls, .csv). Parsing and validation run entirely in the browser.
@@ -307,7 +366,7 @@ The first worksheet is used for multi-sheet workbooks. Discarded rows are exclud
307
366
  ### Props
308
367
 
309
368
  | Prop | Type | Default | Description |
310
- |------|------|---------|-------------|
369
+ | ------ | ------ | --------- | ------------- |
311
370
  | `open` | `boolean` | required | Controlled open state |
312
371
  | `onOpenChange` | `(open: boolean) => void` | required | Open state callback |
313
372
  | `fields` | `BulkImportField[]` | required | Target field schema for column matching |
@@ -418,7 +477,6 @@ To change the gutter size, override `--gsl-bulk-import-gutter` on `.gsl-bulk-imp
418
477
  }
419
478
  ```
420
479
 
421
-
422
480
  ## Button
423
481
 
424
482
  Shared button with primary, secondary, outline, and ghost variants, plus loading and disabled states. See the [Button](/docs/button) docs page for props and exported types.
@@ -446,7 +504,6 @@ import { Button } from "@rfdtech/components";
446
504
 
447
505
  Props: `variant`, `size`, `loading`, `loadingLabel`, `classNames`, and standard `button` attributes. Exported types: `ButtonProps`, `ButtonClassNames`, `ButtonVariant`, `ButtonSize`.
448
506
 
449
-
450
507
  ## Card
451
508
 
452
509
  Surface card wrapper with optional header and design tokens for padding and background. Uses `--gsl-surface-card` for background and `--gsl-card-padding` for inner spacing. See the [Card](/docs/card) docs page for props and exported types.
@@ -461,7 +518,6 @@ import { Card } from "@rfdtech/components";
461
518
 
462
519
  Props: `header`, `children`, `classNames`, `className`, plus standard `div` attributes. Exported types: `CardProps`, `CardClassNames`.
463
520
 
464
-
465
521
  ## Checkbox
466
522
 
467
523
  Accessible checkbox with optional label and part-level `classNames`. See the [Checkbox](/docs/checkbox) docs page for props and exported types.
@@ -484,7 +540,6 @@ import { Checkbox } from "@rfdtech/components";
484
540
 
485
541
  Props: `checked`, `defaultChecked`, `onCheckedChange`, `label`, `disabled`, `required`, `name`, `value`, `id`, `aria-label`, `classNames`, `className`. Exported types: `CheckboxProps`, `CheckboxClassNames`.
486
542
 
487
-
488
543
  ## CountrySelector
489
544
 
490
545
  Country selector dropdown with flag emoji, country name, search filtering, and keyboard navigation. Built on `@radix-ui/react-popover`. See the [CountrySelector](/docs/country-selector) docs page for props and exported types.
@@ -499,7 +554,6 @@ import { CountrySelector } from "@rfdtech/components";
499
554
 
500
555
  Props: `value`, `defaultValue`, `onChange`, `placeholder`, `invalid`, `disabled`, `classNames`, `className`. Exported types: `CountrySelectorProps`, `CountrySelectorClassNames`.
501
556
 
502
-
503
557
  ## DateRangeSelector
504
558
 
505
559
  Date range picker with a single trigger showing the selected range, a calendar popover for two-click range selection, and auto-swap to keep start before end. See the [DateRangeSelector](/docs/date-range-selector) docs page for props and exported types.
@@ -516,7 +570,6 @@ import { DateRangeSelector } from "@rfdtech/components";
516
570
 
517
571
  Props: `value`, `defaultValue`, `onChange`, `placeholder`, `formatOptions`, `invalid`, `disabled`, `min`, `max`, `classNames`, `className`. Exported types: `DateRangeSelectorProps`, `DateRangeSelectorClassNames`, `DateRangeValue`.
518
572
 
519
-
520
573
  ## DateSelector
521
574
 
522
575
  Date picker for choosing a single date from a calendar grid. Built on `@radix-ui/react-popover`. See the [DateSelector](/docs/date-selector) docs page for props and exported types.
@@ -535,7 +588,6 @@ import { DateSelector } from "@rfdtech/components";
535
588
 
536
589
  Props: `value`, `defaultValue`, `onChange`, `placeholder`, `formatOptions`, `invalid`, `disabled`, `min`, `max`, `classNames`, `className`. Exported types: `DateSelectorProps`, `DateSelectorClassNames`.
537
590
 
538
-
539
591
  ## Command
540
592
 
541
593
  Compound command menu primitives for searchable, keyboard-navigable action lists. Supports inline pickers and modal palettes via `CommandDialog`. See the [Command](/docs/command) docs page for props and exported types.
@@ -583,7 +635,6 @@ const { open, onOpenChange, openWith } = useDialogSearchParam("command-menu");
583
635
 
584
636
  Exports: `Command`, `CommandDialog`, `CommandInput`, `CommandList`, `CommandEmpty`, `CommandGroup`, `CommandItem`, `CommandSeparator`, `CommandLoading`, `CommandShortcut`, `useCommandShortcut`. Exported types: `CommandProps`, `CommandDialogProps`, `CommandItemProps`, `CommandShortcutProps`, `UseCommandShortcutOptions`, and related `*ClassNames` types.
585
637
 
586
-
587
638
  ## RadioGroup
588
639
 
589
640
  Single-choice radio group with optional labels and descriptions on each `Radio` item. Use `variant="card"` for bordered choice cards. See the [RadioGroup](/docs/radio-group) docs page for props and exported types.
@@ -607,7 +658,6 @@ import { Radio, RadioGroup } from "@rfdtech/components";
607
658
 
608
659
  Props: `RadioGroup` — `value`, `defaultValue`, `onValueChange`, `name`, `disabled`, `required`, `orientation`, `variant`, `classNames`, `className`, `children`. `Radio` — `value`, `label`, `description`, `disabled`, `id`, `aria-label`, `classNames`, `className`. Exported types: `RadioGroupProps`, `RadioProps`, `RadioGroupClassNames`, `RadioClassNames`, `RadioGroupVariant`.
609
660
 
610
-
611
661
  ## Dropdown
612
662
 
613
663
  Select-style dropdown for choosing one option from a list. See the [Dropdown](/docs/dropdown) docs page for props and exported types.
@@ -630,7 +680,6 @@ import { Dropdown } from "@rfdtech/components";
630
680
 
631
681
  Props: `value`, `onValueChange`, `options`, `placeholder`, `clearable`, `disabled`, `aria-label`, `classNames`, `className`. Exported types: `DropdownProps`, `DropdownOption`, `DropdownClassNames`.
632
682
 
633
-
634
683
  ## Form
635
684
 
636
685
  Field, Input, and Textarea primitives for accessible form layouts. See the [Form](/docs/form) docs page for props and exported types.
@@ -656,7 +705,6 @@ import {
656
705
 
657
706
  Exports: `Field`, `FieldLabel`, `FieldDescription`, `FieldError`, `FieldControl`, `Input`, `Textarea`. Types: `FieldProps`, `FieldClassNames`, `InputProps`, `TextareaProps`.
658
707
 
659
-
660
708
  ## FormField
661
709
 
662
710
  react-hook-form adapters with Zod validation support. See the [FormField](/docs/form-field) docs page for props and exported types.
@@ -713,7 +761,6 @@ const form = useForm<FormValues>({
713
761
 
714
762
  Exports: `Form`, `FormField`, `useFormField`. Types: `FormProps`, `FormFieldProps`, `UseFormFieldReturn`.
715
763
 
716
-
717
764
  ## Dialog
718
765
 
719
766
  Compound dialog primitives for modal overlays. See the [Dialog](/docs/dialog) docs page for props and exported types.
@@ -753,7 +800,6 @@ const { open, data, onOpenChange, openWith } = useDialogSearchParam<{
753
800
 
754
801
  Props: `Dialog` — `open`, `defaultOpen`, `onOpenChange`. `DialogContent` — `showCloseButton`, `classNames`, `className`. Styled parts also support part-level `classNames`. Exported types: `DialogOverlayProps`, `DialogContentProps`, `DialogTitleProps`, `DialogDescriptionProps`, and related `*ClassNames` interfaces.
755
802
 
756
-
757
803
  ## Draggable
758
804
 
759
805
  Repositionable panel primitive with optional handle and bounded pointer dragging. See the [Draggable](/docs/draggable) docs page for props and exported types.
@@ -771,7 +817,6 @@ import { Draggable, DraggableHandle } from "@rfdtech/components";
771
817
 
772
818
  Exports: `Draggable`, `DraggableHandle`, `useDraggable`, `clampPosition`. Types: `DraggableProps`, `DraggableHandleProps`, `DraggablePosition`, `DraggableBounds`, `DraggableAxis`, `UseDraggableOptions`, `UseDraggableReturn`.
773
819
 
774
-
775
820
  ## MetricCard
776
821
 
777
822
  Compact dashboard card for displaying a metric value, label, trend indicator, and optional icon or description. Variants (`default`, `primary`, `success`, `warning`, `error`) only affect the trend color — background and text stay neutral. Use the `color` prop for custom accent colors.
@@ -792,7 +837,6 @@ import { MetricCard } from "@rfdtech/components";
792
837
 
793
838
  Props: `label`, `value`, `icon`, `description`, `trend`, `trendValue`, `variant`, `color`, `classNames`, `className`, plus standard `div` attributes. Exported types: `MetricCardProps`, `MetricCardClassNames`, `MetricCardVariant`, `MetricTrend`.
794
839
 
795
-
796
840
  ## Modal
797
841
 
798
842
  Centered modal with four size variants (`sm`, `md`, `lg`, `xl`), popover-style border, and optional close-prevention. Size tokens are independently customizable via `--gsl-modal-max-width-*`. See the [Modal](/docs/modal) docs page for props and exported types.
@@ -836,7 +880,6 @@ const { open, onOpenChange, openWith } = useModalSearchParam("review-changes");
836
880
 
837
881
  Props: `Modal` — `open`, `defaultOpen`, `onOpenChange`. `ModalContent` — `showCloseButton`, `size`, `preventClose`, `preventCloseTitle`, `preventCloseDescription`, `onOpenChange`, `classNames`, `className`. Layout parts (`ModalHeader`, `ModalBody`, `ModalFooter`) support part-level `classNames`. Exported types: `ModalSize`, `ModalOverlayProps`, `ModalContentProps`, `ModalHeaderProps`, `ModalTitleProps`, `ModalDescriptionProps`, `ModalBodyProps`, `ModalFooterProps`, and related `*ClassNames` interfaces.
838
882
 
839
-
840
883
  ## NetworkOperator
841
884
 
842
885
  Network operator selector with operator image thumbnails (MTN, Vodafone, AirtelTigo, Glo), search filtering, and keyboard navigation. Built on `@radix-ui/react-popover`. See the [NetworkOperator](/docs/network-operator) docs page for props and exported types.
@@ -851,7 +894,6 @@ import { NetworkOperator } from "@rfdtech/components";
851
894
 
852
895
  Props: `value`, `defaultValue`, `onChange`, `options`, `placeholder`, `invalid`, `disabled`, `classNames`, `className`. Exported types: `NetworkOperatorProps`, `NetworkOperatorOption`, `NetworkOperatorClassNames`.
853
896
 
854
-
855
897
  ## OtpInput
856
898
 
857
899
  One-time password input with configurable digit length, paste support, keyboard navigation (arrow keys, backspace), auto-focus advancement, and `onComplete` callback. See the [OtpInput](/docs/otp-input) docs page for props and exported types.
@@ -866,7 +908,6 @@ import { OtpInput } from "@rfdtech/components";
866
908
 
867
909
  Props: `length`, `value`, `onChange`, `onComplete`, `invalid`, `disabled`, `name`, `classNames`, `className`. Exported types: `OtpInputProps`, `OtpInputClassNames`.
868
910
 
869
-
870
911
  ## PhoneNumberInput
871
912
 
872
913
  Phone number input with a country code selector (flag + dial code prefix) that auto-detects the country from the number prefix as the user types. Built on `@radix-ui/react-popover`. See the [PhoneNumberInput](/docs/phone-number-input) docs page for props and exported types.
@@ -881,7 +922,6 @@ import { PhoneNumberInput } from "@rfdtech/components";
881
922
 
882
923
  Props: `value`, `defaultValue`, `onChange`, `invalid`, `disabled`, `classNames`, `className`. Exported types: `PhoneNumberInputProps`, `PhoneNumberInputClassNames`.
883
924
 
884
-
885
925
  ## Popover
886
926
 
887
927
  Compound popover primitives for floating panels. See the [Popover](/docs/popover) docs page for props and exported types.
@@ -927,7 +967,6 @@ import {
927
967
 
928
968
  Exports: `Popover`, `PopoverTrigger`, `PopoverContent`, `PopoverPortal`, `PopoverAnchor`, `PopoverClose`. Exported types: `PopoverContentProps`, `PopoverContentClassNames`.
929
969
 
930
-
931
970
  ## ProgressBar
932
971
 
933
972
  Accessible progress indicator for task completion and loading states. See the [ProgressBar](/docs/progress-bar) docs page for props and exported types.
@@ -942,10 +981,22 @@ import { ProgressBar } from "@rfdtech/components";
942
981
 
943
982
  Props: `value`, `max`, `variant`, `size`, `indeterminate`, `label`, `showValue`, `classNames`, `className`, and standard `div` attributes. Exported types: `ProgressBarProps`, `ProgressBarClassNames`, `ProgressBarVariant`, `ProgressBarSize`.
944
983
 
984
+ ## RouterAdapter
985
+
986
+ Framework-agnostic router abstraction for Next.js and react-router compatibility.
987
+
988
+ Seven files that previously imported `react-router-dom` directly (`useTableFilter`, `useTablePagination`, `useTableState`, `TableSearch`, `TableFilter`, `TablePagination`, `SidebarLink`, `AppLayoutInner`) now consume `RouterAdapter` from context. The library ships two entry points:
989
+
990
+ - `@rfdtech/components` — default, backward compatible (react-router-dom)
991
+ - `@rfdtech/components/next` — Next.js App Router support via `<RouterAdapterProvider>`
992
+
993
+ See the [RouterAdapter](/docs/router-adapter) docs page for setup instructions.
994
+
995
+ Exports: `RouterAdapterProvider`, `setRouterAdapter`, `getRouterAdapter`. Types: `RouterAdapterValue`, `RouterSearchParams`, `RouterLinkComponent`.
945
996
 
946
997
  ## Sidebar
947
998
 
948
- Compound sidebar primitives for app shells and section navigation. Desktop uses a sticky card-style rail with optional collapse; mobile uses an offcanvas drawer with trigger and overlay. See the [Sidebar](/docs/sidebar) docs page for props and exported types.
999
+ Compound sidebar primitives for app shells and section navigation. Desktop uses a sticky card-style rail with optional collapse; mobile uses an offcanvas drawer with trigger and overlay. `SidebarGroup` supports a `collapsible` flag that turns the group label into a button toggle with an animated open/close for the group's content. See the [Sidebar](/docs/sidebar) docs page for props and exported types.
949
1000
 
950
1001
  ```tsx
951
1002
  import {
@@ -992,7 +1043,6 @@ import {
992
1043
 
993
1044
  Exports: `SidebarProvider`, `useSidebar`, `Sidebar`, `SidebarBadge`, `SidebarCollapse`, `SidebarTrigger`, `SidebarOverlay`, `SidebarHeader`, `SidebarContent`, `SidebarFooter`, `SidebarNav`, `SidebarGroup`, `SidebarGroupLabel`, `SidebarItem`, `SidebarLink`. Exported types: `SidebarProviderProps`, `SidebarProps`, `SidebarLinkProps`, `SidebarBadgeProps`, `SidebarCollapseProps`, and related `*ClassNames` types.
994
1045
 
995
-
996
1046
  ## Sheet
997
1047
 
998
1048
  Compound sheet primitives for edge-sliding panels. See the [Sheet](/docs/sheet) docs page for props and exported types.
@@ -1035,7 +1085,6 @@ import {
1035
1085
 
1036
1086
  Props: `Sheet` — `open`, `defaultOpen`, `onOpenChange`. `SheetContent` — `side`, `showCloseButton`, `classNames`, `className`. Layout parts support part-level `classNames`. Exported types: `SheetSide`, `SheetOverlayProps`, `SheetContentProps`, `SheetHeaderProps`, `SheetTitleProps`, `SheetDescriptionProps`, `SheetBodyProps`, `SheetFooterProps`, and related `*ClassNames` interfaces.
1037
1087
 
1038
-
1039
1088
  ## Sortable
1040
1089
 
1041
1090
  Reorderable list primitive with optional drag handles and keyboard support. See the [Sortable](/docs/sortable) docs page for props and exported types.
@@ -1065,6 +1114,33 @@ const [items, setItems] = useState(["alpha", "beta", "gamma"]);
1065
1114
 
1066
1115
  Exports: `Sortable`, `SortableList`, `SortableItem`, `SortableHandle`, `reorderItems`. Types: `SortableProps`, `SortableListProps`, `SortableItemProps`, `SortableHandleProps`, `SortableId`, `SortableStrategy`, `SortableClassNames`.
1067
1116
 
1117
+ ## Stepper
1118
+
1119
+ Horizontal step indicator for multi-step flows. `Stepper` holds the active step value and derives each `Step`'s `complete` / `active` / `upcoming` state. Each step renders a numbered circle that flips to a check when done, with a connector line that fills between completed steps. Add a `StepLabel` for the step's text. See the [Stepper](/docs/stepper) docs page for props and exported types.
1120
+
1121
+ ```tsx
1122
+ import { useState } from "react";
1123
+ import { Step, StepLabel, Stepper } from "@rfdtech/components";
1124
+
1125
+ const [step, setStep] = useState(3);
1126
+
1127
+ <Stepper value={step} clickable onValueChange={setStep}>
1128
+ <Step value={1}>
1129
+ <StepLabel>Upload Document</StepLabel>
1130
+ </Step>
1131
+ <Step value={2}>
1132
+ <StepLabel>Select header row</StepLabel>
1133
+ </Step>
1134
+ <Step value={3}>
1135
+ <StepLabel>Match Columns</StepLabel>
1136
+ </Step>
1137
+ <Step value={4}>
1138
+ <StepLabel>Validate data</StepLabel>
1139
+ </Step>
1140
+ </Stepper>
1141
+ ```
1142
+
1143
+ Exports: `Stepper`, `Step`, `StepLabel`. Also available as `Stepper.Step`, `Stepper.StepLabel` for compound-style imports. Props: `Stepper` — `value`, `clickable`, `onValueChange`, `classNames`, `className`, `children`. `Step` — `value`, `disabled`, `classNames`, `className`, `children`. `StepLabel` — `classNames`, `className`, `children`. Exported types: `StepperProps`, `StepProps`, `StepLabelProps`, `StepperClassNames`, `StepClassNames`, `StepLabelClassNames`, `StepperContextValue`, `StepState`, `StepInternalProps`. Retheme via `--gsl-stepper-accent` (defaults to `--gsl-primary`) and related `--gsl-stepper-*` custom properties.
1068
1144
 
1069
1145
  ## Table
1070
1146
 
@@ -1113,7 +1189,6 @@ const [selected, setSelected] = useState<Set<string | number>>(new Set());
1113
1189
 
1114
1190
  Props: `paramPrefix`, `classNames`, `className`. Exports: `Table`, `TableHeader`, `TableSearch`, `TableFilter`, `TableContent`, `TableBulkActions`, `TableFooter`, `TablePagination`. Types: `TableProps`, `TableHeaderProps`, `TableContentProps`, `TableFooterProps`, `TableSearchProps`, `TableFilterProps`, `TableBulkActionsProps`, `TableBulkAction`, `TableBulkActionsClassNames`, `TableClassNames`, `PaginationControlsProps`, `TableColumn`.
1115
1191
 
1116
-
1117
1192
  ## Tabs
1118
1193
 
1119
1194
  Compound tabs primitives for switching between related panels. See the [Tabs](/docs/tabs) docs page for props and exported types.
@@ -1131,8 +1206,36 @@ import { Tabs, TabsContent, TabsList, TabsTrigger } from "@rfdtech/components";
1131
1206
  </Tabs>
1132
1207
  ```
1133
1208
 
1134
- Exports: `Tabs`, `TabsList`, `TabsTrigger`, `TabsContent`. Props: `Tabs` — `value`, `defaultValue`, `onValueChange`, `orientation`, `activationMode`, `variant`, `classNames`, `className`, `children`. `TabsTrigger` — `value`, `disabled`, `classNames`, `className`. Exported types: `TabsProps`, `TabsListProps`, `TabsTriggerProps`, `TabsContentProps`, `TabsVariant`, `TabsClassNames`, `TabsListClassNames`, `TabsTriggerClassNames`, `TabsContentClassNames`.
1209
+ Exports: `Tabs`, `TabsList`, `TabsTrigger`, `TabsContent`. Props: `Tabs` — `value`, `defaultValue`, `onValueChange`, `orientation`, `activationMode`, `variant` (`"default"`, `"line"`, `"pill"`), `classNames`, `className`, `children`. `TabsTrigger` — `value`, `disabled`, `classNames`, `className`. Exported types: `TabsProps`, `TabsListProps`, `TabsTriggerProps`, `TabsContentProps`, `TabsVariant`, `TabsClassNames`, `TabsListClassNames`, `TabsTriggerClassNames`, `TabsContentClassNames`.
1210
+
1211
+ ## Timeline
1135
1212
 
1213
+ Composable vertical timeline with `Timeline` and `TimelineItem` primitives. Dot color variants for past, current, warning, and error events with optional `color` override. Sub-components `TimelineTitle`, `TimelineData`, and `TimelineFooter` provide styled content slots. Connector animations with staggered draw-in. See the [Timeline](/docs/timeline) docs page for props and exported types.
1214
+
1215
+ ```tsx
1216
+ import {
1217
+ Timeline,
1218
+ TimelineData,
1219
+ TimelineFooter,
1220
+ TimelineItem,
1221
+ TimelineTitle,
1222
+ } from "@rfdtech/components";
1223
+ import { Check, AlertTriangle } from "lucide-react";
1224
+
1225
+ <Timeline>
1226
+ <TimelineItem status="complete" icon={<Check size={10} strokeWidth={3} />}>
1227
+ <TimelineTitle>Case reported</TimelineTitle>
1228
+ <TimelineData>12 Jun 2026</TimelineData>
1229
+ <TimelineFooter>HR Officer intake</TimelineFooter>
1230
+ </TimelineItem>
1231
+ <TimelineItem status="warning" icon={<AlertTriangle size={10} strokeWidth={3} />}>
1232
+ <TimelineTitle>Response overdue</TimelineTitle>
1233
+ <TimelineData>Since 3 Jul 2026</TimelineData>
1234
+ </TimelineItem>
1235
+ </Timeline>
1236
+ ```
1237
+
1238
+ Exports: `Timeline`, `TimelineItem`, `TimelineTitle`, `TimelineData`, `TimelineFooter`. Exported types: `TimelineProps`, `TimelineItemProps`, `TimelineTitleProps`, `TimelineDataProps`, `TimelineFooterProps`, `TimelineClassNames`, `TimelineItemClassNames`, `TimelineTitleClassNames`, `TimelineDataClassNames`, `TimelineFooterClassNames`, `TimelineItemMode`.
1136
1239
 
1137
1240
  ## Toast
1138
1241
 
@@ -1159,7 +1262,6 @@ toast({
1159
1262
 
1160
1263
  Exports: `ToastProvider`, `Toaster`, `useToast`. Types: `ToastOptions`, `ToastVariant`, `ToastProviderProps`, `ToasterProps`, `UseToastReturn`, `ToastClassNames`, `ToastAction`, `ToastReturn`.
1161
1264
 
1162
-
1163
1265
  ## Tooltip
1164
1266
 
1165
1267
  Pure-CSS hover tooltip with directional arrow (top, right, bottom, left). Used internally by SidebarLink on the collapsed icon rail. See the [Tooltip](/docs/tooltip) docs page for props and exported types.
@@ -1176,7 +1278,6 @@ import { Tooltip } from "@rfdtech/components";
1176
1278
 
1177
1279
  Props: `content`, `side`, `classNames`, `className`. Exported types: `TooltipProps`, `TooltipClassNames`.
1178
1280
 
1179
-
1180
1281
  ## UploadField
1181
1282
 
1182
1283
  File upload with dashed-border dropzone, cloud upload icon, auto-generated file type/size support text, file cards with type icons, and a primary action button. See the [UploadField](/docs/upload-field) docs page for props and exported types.
@@ -1197,7 +1298,6 @@ Props: `accept`, `multiple`, `maxSize`, `value`, `onChange`, `invalid`, `disable
1197
1298
 
1198
1299
  Props: `accept`, `multiple`, `maxSize`, `value`, `onChange`, `invalid`, `disabled`, `placeholder`, `classNames`, `className`. Exported types: `UploadFieldProps`, `UploadFieldClassNames`.
1199
1300
 
1200
-
1201
1301
  ## Development
1202
1302
 
1203
1303
  ```bash
package/dist/adapters/context-adapter.d.ts ADDED
@@ -0,0 +1,18 @@
1
+ import type { RouterAdapterValue } from "../types/router-adapter";
2
+ /**
3
+ * Router adapter that reads from `RouterAdapterContext` only.
4
+ * Throws if no provider is present.
5
+ *
6
+ * This adapter has zero dependency on `react-router-dom`.
7
+ * It is used by the `@rfdtech/components/next` entry point.
8
+ *
9
+ * Consumers must wrap their app in `<RouterAdapterProvider>`:
10
+ *
11
+ * ```tsx
12
+ * <RouterAdapterProvider value={adapter}>
13
+ * <App />
14
+ * </RouterAdapterProvider>
15
+ * ```
16
+ */
17
+ export declare function useContextRouterAdapter(): RouterAdapterValue;
18
+ //# sourceMappingURL=context-adapter.d.ts.map
package/dist/adapters/context-adapter.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"context-adapter.d.ts","sourceRoot":"","sources":["../../src/adapters/context-adapter.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAElE;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,uBAAuB,IAAI,kBAAkB,CAY5D"}
package/dist/adapters/next-adapter.d.ts ADDED
@@ -0,0 +1,23 @@
1
+ import type { RouterAdapterValue } from "../types/router-adapter";
2
+ /**
3
+ * Create a `RouterAdapterValue` for Next.js App Router.
4
+ *
5
+ * Consumers import this hook and pass the result to `<RouterAdapterProvider>`:
6
+ *
7
+ * ```tsx
8
+ * // app/providers.tsx
9
+ * 'use client';
10
+ * import { RouterAdapterProvider, useNextRouterAdapter } from '@rfdtech/components/next';
11
+ *
12
+ * export function Providers({ children }) {
13
+ * const adapter = useNextRouterAdapter();
14
+ * return (
15
+ * <RouterAdapterProvider value={adapter}>
16
+ * {children}
17
+ * </RouterAdapterProvider>
18
+ * );
19
+ * }
20
+ * ```
21
+ */
22
+ export declare function useNextRouterAdapter(): RouterAdapterValue;
23
+ //# sourceMappingURL=next-adapter.d.ts.map
package/dist/adapters/next-adapter.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"next-adapter.d.ts","sourceRoot":"","sources":["../../src/adapters/next-adapter.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EACX,kBAAkB,EAElB,MAAM,yBAAyB,CAAC;AAUjC;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,oBAAoB,IAAI,kBAAkB,CA8CzD"}
package/dist/adapters/react-router-adapter.d.ts ADDED
@@ -0,0 +1,9 @@
1
+ import type { RouterAdapterValue } from "../types/router-adapter";
2
+ /**
3
+ * Default router adapter backed by react-router-dom's `useSearchParams`
4
+ * and `Link`. This is the standard adapter for Vite / react-router consumers.
5
+ *
6
+ * Injected into the registry by `src/index.ts`.
7
+ */
8
+ export declare function useReactRouterAdapter(): RouterAdapterValue;
9
+ //# sourceMappingURL=react-router-adapter.d.ts.map
package/dist/adapters/react-router-adapter.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"react-router-adapter.d.ts","sourceRoot":"","sources":["../../src/adapters/react-router-adapter.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAElE;;;;;GAKG;AACH,wBAAgB,qBAAqB,IAAI,kBAAkB,CAW1D"}
package/dist/adapters/registry.d.ts ADDED
@@ -0,0 +1,19 @@
1
+ import type { RouterAdapterValue } from "../types/router-adapter";
2
+ /**
3
+ * Inject the router adapter factory. Called once by the entry point
4
+ * (`src/index.ts` or `src/next-index.ts`) at module load time.
5
+ *
6
+ * - Default entry injects `useReactRouterAdapter` (react-router-dom)
7
+ * - Next.js entry injects `useContextRouterAdapter` (context-only)
8
+ */
9
+ export declare function setRouterAdapter(fn: () => RouterAdapterValue): void;
10
+ /**
11
+ * Called by every hook/component that needs router primitives.
12
+ * Returns the search params + Link component for the current framework.
13
+ *
14
+ * This MUST be called at the top of a hook or component function
15
+ * (like any hook) — the returned adapter function internally
16
+ * calls hooks.
17
+ */
18
+ export declare function getRouterAdapter(): RouterAdapterValue;
19
+ //# sourceMappingURL=registry.d.ts.map
package/dist/adapters/registry.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"registry.d.ts","sourceRoot":"","sources":["../../src/adapters/registry.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAIlE;;;;;;GAMG;AACH,wBAAgB,gBAAgB,CAAC,EAAE,EAAE,MAAM,kBAAkB,GAAG,IAAI,CAEnE;AAED;;;;;;;GAOG;AACH,wBAAgB,gBAAgB,IAAI,kBAAkB,CAWrD"}
package/dist/components/app-header/AppHeader.d.ts CHANGED
@@ -1,5 +1,6 @@
1
- import type { AppHeaderProps, AppHeaderActionsProps } from "../../types/app-header";
1
+ import type { AppHeaderProps, AppHeaderActionsProps, AppHeaderBrandingProps } from "../../types/app-header";
2
2
  import "./styles/app-header.css";
3
- export declare const AppHeader: ({ className, children, ...props }: AppHeaderProps) => import("react").JSX.Element;
3
+ export declare const AppHeader: ({ className, children, variant, ...props }: AppHeaderProps) => import("react").JSX.Element;
4
4
  export declare const AppHeaderActions: ({ className, children, ...props }: AppHeaderActionsProps) => import("react").JSX.Element;
5
+ export declare const AppHeaderBranding: ({ className, logo, title, subtitle, children, }: AppHeaderBrandingProps) => import("react").JSX.Element;
5
6
  //# sourceMappingURL=AppHeader.d.ts.map
package/dist/components/app-header/AppHeader.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"AppHeader.d.ts","sourceRoot":"","sources":["../../../src/components/app-header/AppHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,qBAAqB,EAAE,MAAM,wBAAwB,CAAC;AAEpF,OAAO,yBAAyB,CAAC;AAEjC,eAAO,MAAM,SAAS,GAAI,mCAAmC,cAAc,gCAE1E,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,mCAAmC,qBAAqB,gCAMxF,CAAC"}
1
+ {"version":3,"file":"AppHeader.d.ts","sourceRoot":"","sources":["../../../src/components/app-header/AppHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,cAAc,EACd,qBAAqB,EACrB,sBAAsB,EACvB,MAAM,wBAAwB,CAAC;AAEhC,OAAO,yBAAyB,CAAC;AAEjC,eAAO,MAAM,SAAS,GAAI,4CAKvB,cAAc,gCAahB,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,mCAAmC,qBAAqB,gCAMxF,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAI,iDAM/B,sBAAsB,gCAqBxB,CAAC"}
package/dist/components/app-header/AppHeaderProfile.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"AppHeaderProfile.d.ts","sourceRoot":"","sources":["../../../src/components/app-header/AppHeaderProfile.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,wBAAwB,CAAC;AAMpE,eAAO,MAAM,gBAAgB,kHAgE3B,CAAC"}
1
+ {"version":3,"file":"AppHeaderProfile.d.ts","sourceRoot":"","sources":["../../../src/components/app-header/AppHeaderProfile.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,wBAAwB,CAAC;AAMpE,eAAO,MAAM,gBAAgB,kHA4E3B,CAAC"}
package/dist/components/app-header/index.d.ts CHANGED
@@ -1,6 +1,6 @@
1
- export { AppHeader, AppHeaderActions } from "./AppHeader";
1
+ export { AppHeader, AppHeaderActions, AppHeaderBranding } from "./AppHeader";
2
2
  export { AppHeaderSearch } from "./AppHeaderSearch";
3
3
  export { AppHeaderNotifications } from "./AppHeaderNotifications";
4
4
  export { AppHeaderProfile } from "./AppHeaderProfile";
5
- export type { AppHeaderProps, AppHeaderActionsProps, AppHeaderSearchProps, AppHeaderSearchDataGroup, AppHeaderSearchItem, AppHeaderNotificationsProps, AppHeaderProfileProps, AppUser, } from "../../types/app-header";
5
+ export type { AppHeaderProps, AppHeaderActionsProps, AppHeaderBrandingProps, AppHeaderSearchProps, AppHeaderSearchDataGroup, AppHeaderSearchItem, AppHeaderNotificationsProps, AppHeaderProfileProps, AppUser, } from "../../types/app-header";
6
6
  //# sourceMappingURL=index.d.ts.map
package/dist/components/app-header/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/app-header/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC1D,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,YAAY,EACV,cAAc,EACd,qBAAqB,EACrB,oBAAoB,EACpB,wBAAwB,EACxB,mBAAmB,EACnB,2BAA2B,EAC3B,qBAAqB,EACrB,OAAO,GACR,MAAM,wBAAwB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/app-header/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,MAAM,aAAa,CAAC;AAC7E,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,YAAY,EACV,cAAc,EACd,qBAAqB,EACrB,sBAAsB,EACtB,oBAAoB,EACpB,wBAAwB,EACxB,mBAAmB,EACnB,2BAA2B,EAC3B,qBAAqB,EACrB,OAAO,GACR,MAAM,wBAAwB,CAAC"}
package/dist/components/app-layout/AppLayout.d.ts CHANGED
@@ -2,6 +2,12 @@ import { type ReactNode } from "react";
2
2
  export interface AppLayoutProps {
3
3
  children?: ReactNode;
4
4
  className?: string;
5
+ /**
6
+ * Layout arrangement.
7
+ * - `"default"`: sidebar spans full height on the left, header sits above the content only.
8
+ * - `"stacked"`: header spans the full width on top, with sidebar and content side by side below it.
9
+ */
10
+ variant?: "default" | "stacked";
5
11
  }
6
12
  /**
7
13
  * Application layout that internally wraps children with BreadcrumbProvider
package/dist/components/app-layout/AppLayout.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"AppLayout.d.ts","sourceRoot":"","sources":["../../../src/components/app-layout/AppLayout.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAKf,MAAM,WAAW,cAAc;IAC7B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;GAIG;AACH,eAAO,MAAM,SAAS,2GAYrB,CAAC"}
1
+ {"version":3,"file":"AppLayout.d.ts","sourceRoot":"","sources":["../../../src/components/app-layout/AppLayout.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAKf,MAAM,WAAW,cAAc;IAC7B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;CACjC;AAED;;;;GAIG;AACH,eAAO,MAAM,SAAS,2GAYrB,CAAC"}
package/dist/components/app-layout/AppLayoutInner.d.ts CHANGED
@@ -3,6 +3,7 @@ import "./styles/app-layout.css";
3
3
  export interface AppLayoutInnerProps {
4
4
  children?: ReactNode;
5
5
  className?: string;
6
+ variant?: "default" | "stacked";
6
7
  }
7
8
  export declare const AppLayoutInner: import("react").ForwardRefExoticComponent<AppLayoutInnerProps & import("react").RefAttributes<HTMLDivElement>>;
8
9
  //# sourceMappingURL=AppLayoutInner.d.ts.map
package/dist/components/app-layout/AppLayoutInner.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"AppLayoutInner.d.ts","sourceRoot":"","sources":["../../../src/components/app-layout/AppLayoutInner.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAKf,OAAO,yBAAyB,CAAC;AAEjC,MAAM,WAAW,mBAAmB;IAClC,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,cAAc,gHAmE1B,CAAC"}
1
+ {"version":3,"file":"AppLayoutInner.d.ts","sourceRoot":"","sources":["../../../src/components/app-layout/AppLayoutInner.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAWf,OAAO,yBAAyB,CAAC;AAEjC,MAAM,WAAW,mBAAmB;IAClC,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;CACjC;AAED,eAAO,MAAM,cAAc,gHA2G1B,CAAC"}
package/dist/components/metric-card/MetricCard.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"MetricCard.d.ts","sourceRoot":"","sources":["../../../src/components/metric-card/MetricCard.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAe,MAAM,yBAAyB,CAAC;AAE5E,OAAO,0BAA0B,CAAC;AAuClC,eAAO,MAAM,UAAU,4GAwHtB,CAAC"}
1
+ {"version":3,"file":"MetricCard.d.ts","sourceRoot":"","sources":["../../../src/components/metric-card/MetricCard.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAe,MAAM,yBAAyB,CAAC;AAE5E,OAAO,0BAA0B,CAAC;AA8ClC,eAAO,MAAM,UAAU,4GA0ItB,CAAC"}
package/dist/components/metric-card/index.d.ts CHANGED
@@ -1,3 +1,3 @@
1
1
  export { MetricCard } from "./MetricCard";
2
- export type { MetricCardProps, MetricCardClassNames, MetricTrend, } from "../../types/metric-card";
2
+ export type { MetricCardProps, MetricCardClassNames, MetricTrend, MetricCardVariant, } from "../../types/metric-card";
3
3
  //# sourceMappingURL=index.d.ts.map