@sckyzo/cosmos-react 0.1.0 → 0.2.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.
package/dist/index.d.cts CHANGED
@@ -53,7 +53,13 @@ declare const Divider: (({ inset, align, emphasis, insetBg, className, ...rest }
53
53
  type MediaObjectAlign = 'start' | 'center' | 'bottom' | 'stretch';
54
54
  type MediaObjectPosition = 'left' | 'right';
55
55
  type MediaObjectProps = HTMLAttributes<HTMLDivElement> & {
56
+ /**
57
+ * Where the media sits against the body: `start` (top), `center`, `bottom`,
58
+ * or `stretch` (the media slot takes the body's height; size the media
59
+ * `h-full`). Default `start`.
60
+ */
56
61
  align?: MediaObjectAlign;
62
+ /** Side of the body the media sits on. `right` reverses the row. Default `left`. */
57
63
  mediaPosition?: MediaObjectPosition;
58
64
  /** Gap between the media and the body. Default `gap-x-4` (16px). */
59
65
  gapClassName?: string;
@@ -61,7 +67,13 @@ type MediaObjectProps = HTMLAttributes<HTMLDivElement> & {
61
67
  type MediaObjectImageProps = HTMLAttributes<HTMLDivElement>;
62
68
  type MediaObjectBodyProps = HTMLAttributes<HTMLDivElement>;
63
69
  declare const MediaObject: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & {
70
+ /**
71
+ * Where the media sits against the body: `start` (top), `center`, `bottom`,
72
+ * or `stretch` (the media slot takes the body's height; size the media
73
+ * `h-full`). Default `start`.
74
+ */
64
75
  align?: MediaObjectAlign;
76
+ /** Side of the body the media sits on. `right` reverses the row. Default `left`. */
65
77
  mediaPosition?: MediaObjectPosition;
66
78
  /** Gap between the media and the body. Default `gap-x-4` (16px). */
67
79
  gapClassName?: string;
@@ -121,6 +133,12 @@ type SidebarProps = {
121
133
  children: ReactNode;
122
134
  /** Footer content (sticks to bottom — e.g. user profile + collapse btn). */
123
135
  footer?: ReactNode;
136
+ /**
137
+ * Renders a collapse button at the very bottom, under `footer`, and fires
138
+ * with the next state when it is clicked. Leave it out when the control
139
+ * lives elsewhere (e.g. the Topbar hamburger).
140
+ */
141
+ onCollapsedChange?: (collapsed: boolean) => void;
124
142
  /** Optional className override. */
125
143
  className?: string;
126
144
  };
@@ -132,7 +150,7 @@ type SidebarProps = {
132
150
  * is automatically threaded to every subcomponent via React context, so
133
151
  * children don't need to receive it as a prop.
134
152
  */
135
- declare const SidebarRoot: ({ collapsed, width, collapsedWidth, children, footer, className, }: SidebarProps) => react.JSX.Element;
153
+ declare const SidebarRoot: ({ collapsed, width, collapsedWidth, children, footer, onCollapsedChange, className, }: SidebarProps) => react.JSX.Element;
136
154
  type SidebarBrandProps = {
137
155
  /** Logo node — typically a small icon, lucide component, or img. */
138
156
  logo?: ReactNode;
@@ -157,7 +175,7 @@ type SidebarItemProps = {
157
175
  label: string;
158
176
  /** Whether the item is active (highlighted). */
159
177
  active?: boolean;
160
- /** Link target — renders an <a> if set, otherwise a <button>. */
178
+ /** Link target — renders an `<a>` if set, otherwise a `<button>`. */
161
179
  href?: string;
162
180
  /** Click handler (if not using href). */
163
181
  onClick?: () => void;
@@ -165,10 +183,13 @@ type SidebarItemProps = {
165
183
  badge?: ReactNode;
166
184
  /** Override the inherited collapsed state. */
167
185
  collapsed?: boolean;
168
- /** Indentation depth (for nested items inside groups). Default: 0. */
186
+ /**
187
+ * Indentation depth. Defaults to the nesting level: 0 at the top, one more
188
+ * inside each Sidebar.SubMenu.
189
+ */
169
190
  depth?: number;
170
191
  };
171
- declare const SidebarItem: ({ icon: Icon, label, active, href, onClick, badge, collapsed: collapsedProp, depth, }: SidebarItemProps) => react.JSX.Element;
192
+ declare const SidebarItem: ({ icon: Icon, label, active, href, onClick, badge, collapsed: collapsedProp, depth: depthProp, }: SidebarItemProps) => react.JSX.Element;
172
193
  type SidebarSubMenuProps = {
173
194
  icon: ComponentType<{
174
195
  className?: string;
@@ -182,7 +203,7 @@ type SidebarSubMenuProps = {
182
203
  active?: boolean;
183
204
  /** Optional badge shown right of label (hidden when collapsed). */
184
205
  badge?: ReactNode;
185
- /** Nested items — typically `Sidebar.Item` with `depth={1}`. */
206
+ /** Nested items: Sidebar.Item, or another Sidebar.SubMenu for a deeper level. */
186
207
  children: ReactNode;
187
208
  };
188
209
  declare const SidebarSubMenu: ({ icon: Icon, label, defaultOpen, collapsed: collapsedProp, active, badge, children, }: SidebarSubMenuProps) => react.JSX.Element;
@@ -233,6 +254,12 @@ type ShellProps = {
233
254
  sidebarCollapsed?: boolean;
234
255
  /** Fired whenever the collapsed state toggles. */
235
256
  onSidebarToggle?: (collapsed: boolean) => void;
257
+ /**
258
+ * Where the collapse control lives. `topbar` (default): the Topbar's
259
+ * hamburger. `sidebar`: a button at the bottom of the Sidebar, and the
260
+ * Topbar shows no hamburger.
261
+ */
262
+ collapseControl?: 'topbar' | 'sidebar';
236
263
  /** Optional className override on the root element. */
237
264
  className?: string;
238
265
  };
@@ -252,7 +279,7 @@ type ShellProps = {
252
279
  * …
253
280
  * </Shell>
254
281
  */
255
- declare const Shell: ({ topbar, sidebar, children, secondary, secondaryWidthClassName, defaultSidebarCollapsed, sidebarCollapsed: controlledCollapsed, onSidebarToggle, className, }: ShellProps) => react.JSX.Element;
282
+ declare const Shell: ({ topbar, sidebar, children, secondary, secondaryWidthClassName, defaultSidebarCollapsed, sidebarCollapsed: controlledCollapsed, onSidebarToggle, collapseControl, className, }: ShellProps) => react.JSX.Element;
256
283
 
257
284
  type PageBreadcrumbItem = {
258
285
  label: string;
@@ -331,21 +358,6 @@ type SectionCardProps = {
331
358
  */
332
359
  declare const SectionCard: ({ title, desc, icon: Icon, iconTone, iconColor, iconBg, children, className, }: SectionCardProps) => react.JSX.Element;
333
360
 
334
- type PageCardProps = {
335
- children: ReactNode;
336
- className?: string;
337
- };
338
- /**
339
- * PageCard — full-page outer card.
340
- *
341
- * Replaces multiple SectionCards stacked: a single rounded-2xl bordered card
342
- * that wraps ALL page content. Use for settings, profiles, forms — anything
343
- * that's hard to read full-width.
344
- *
345
- * Combine with `<ContentNarrow>` inside for a centered constrained column.
346
- */
347
- declare const PageCard: ({ children, className }: PageCardProps) => react.JSX.Element;
348
-
349
361
  type ContentNarrowProps = {
350
362
  children: ReactNode;
351
363
  /** Max width in px. Default: 680 */
@@ -355,7 +367,7 @@ type ContentNarrowProps = {
355
367
  /**
356
368
  * ContentNarrow — centered constrained-width wrapper.
357
369
  *
358
- * Use inside PageCard or anywhere you want a readable column of content
370
+ * Use inside a Card or anywhere you want a readable column of content
359
371
  * (settings forms, prose, profile pages…). Default width is 680px.
360
372
  */
361
373
  declare const ContentNarrow: ({ children, maxWidth, className }: ContentNarrowProps) => react.JSX.Element;
@@ -520,7 +532,8 @@ type StackedListItemProps = LiHTMLAttributes<HTMLLIElement> & {
520
532
  /**
521
533
  * If set, the entire row becomes a navigable link via a full-row overlay
522
534
  * (TUI pattern: `<a><span class="absolute inset-x-0 -top-px bottom-0"></span></a>`).
523
- * The overlay sits above the title text — other inner anchors stay on top via z-index.
535
+ * `trailing` is lifted above the overlay so its actions stay clickable; give
536
+ * any other interactive element (in `subtitle` or `meta`) `position: relative`.
524
537
  */
525
538
  href?: string;
526
539
  /** When `href` is set, also append a chevron-right icon to indicate navigation. */
@@ -543,7 +556,8 @@ declare const StackedList: react.ForwardRefExoticComponent<Omit<HTMLAttributes<H
543
556
  /**
544
557
  * If set, the entire row becomes a navigable link via a full-row overlay
545
558
  * (TUI pattern: `<a><span class="absolute inset-x-0 -top-px bottom-0"></span></a>`).
546
- * The overlay sits above the title text — other inner anchors stay on top via z-index.
559
+ * `trailing` is lifted above the overlay so its actions stay clickable; give
560
+ * any other interactive element (in `subtitle` or `meta`) `position: relative`.
547
561
  */
548
562
  href?: string;
549
563
  /** When `href` is set, also append a chevron-right icon to indicate navigation. */
@@ -561,7 +575,10 @@ type ContentStackedListItemProps = LiHTMLAttributes<HTMLLIElement> & {
561
575
  href?: string;
562
576
  /** Optional inline badge rendered next to the title (pattern 5). */
563
577
  badge?: ReactNode;
564
- /** Inline meta items separated by a dot. Pass an array of ReactNodes. */
578
+ /**
579
+ * Inline meta items separated by a dot. Pass an array of ReactNodes. Each item
580
+ * stays on one line; the last one truncates when the row runs out of room.
581
+ */
565
582
  meta?: ReactNode[];
566
583
  /** Right-aligned slot — typically an AvatarGroup (pattern 3) or a button + actions menu (pattern 5). */
567
584
  trailing?: ReactNode;
@@ -576,7 +593,10 @@ declare const ContentStackedList: react.ForwardRefExoticComponent<Omit<HTMLAttri
576
593
  href?: string;
577
594
  /** Optional inline badge rendered next to the title (pattern 5). */
578
595
  badge?: ReactNode;
579
- /** Inline meta items separated by a dot. Pass an array of ReactNodes. */
596
+ /**
597
+ * Inline meta items separated by a dot. Pass an array of ReactNodes. Each item
598
+ * stays on one line; the last one truncates when the row runs out of room.
599
+ */
580
600
  meta?: ReactNode[];
581
601
  /** Right-aligned slot — typically an AvatarGroup (pattern 3) or a button + actions menu (pattern 5). */
582
602
  trailing?: ReactNode;
@@ -587,6 +607,11 @@ type StackedListInCardProps = Omit<HTMLAttributes<HTMLDivElement>, 'children'> &
587
607
  /** Children must be `<StackedList.Item>` elements. */
588
608
  children: ReactNode;
589
609
  };
610
+ /**
611
+ * A `StackedList` on a card surface (ring, shadow, rounded from `sm` up). Each
612
+ * `StackedList.Item` child gets horizontal padding so its content clears the
613
+ * card edge; other children render unchanged.
614
+ */
590
615
  declare const StackedListInCard: react.ForwardRefExoticComponent<Omit<HTMLAttributes<HTMLDivElement>, "children"> & {
591
616
  /** Children must be `<StackedList.Item>` elements. */
592
617
  children: ReactNode;
@@ -609,7 +634,7 @@ type NarrowStackedListItemProps = LiHTMLAttributes<HTMLLIElement> & {
609
634
  subtitle?: ReactNode;
610
635
  /** Optional right-of-title timestamp (Pattern 13). When set, an extra layout row is used. */
611
636
  timestamp?: ReactNode;
612
- /** Optional second body line (Pattern 13). Auto line-clamped to 2. */
637
+ /** Optional second body line (Pattern 13). Auto line-clamped to 2. Replaces `subtitle`. */
613
638
  description?: ReactNode;
614
639
  /** Optional right-aligned trailing slot — action button, link (Pattern 12). */
615
640
  trailing?: ReactNode;
@@ -631,7 +656,7 @@ declare const NarrowStackedList: react.ForwardRefExoticComponent<Omit<HTMLAttrib
631
656
  subtitle?: ReactNode;
632
657
  /** Optional right-of-title timestamp (Pattern 13). When set, an extra layout row is used. */
633
658
  timestamp?: ReactNode;
634
- /** Optional second body line (Pattern 13). Auto line-clamped to 2. */
659
+ /** Optional second body line (Pattern 13). Auto line-clamped to 2. Replaces `subtitle`. */
635
660
  description?: ReactNode;
636
661
  /** Optional right-aligned trailing slot — action button, link (Pattern 12). */
637
662
  trailing?: ReactNode;
@@ -652,12 +677,12 @@ type SimpleRowProps = {
652
677
  *
653
678
  * Use inside a SectionCard with `divide-y` for visually separated rows:
654
679
  *
655
- * <SectionCard title="Metadata">
656
- * <div className="divide-y divide-[var(--color-border)]">
657
- * <SimpleRow label="ID" value="rack-01-a" mono />
658
- * <SimpleRow label="Status" value={<StatusBadge status="OK" />} />
659
- * </div>
660
- * </SectionCard>
680
+ * <SectionCard title="Metadata">
681
+ * <div className="divide-y divide-[var(--color-border)]">
682
+ * <SimpleRow label="ID" value="rack-01-a" mono />
683
+ * <SimpleRow label="Status" value={<StatusBadge status="OK" />} />
684
+ * </div>
685
+ * </SectionCard>
661
686
  */
662
687
  declare const SimpleRow: ({ label, value, mono, className }: SimpleRowProps) => react.JSX.Element;
663
688
 
@@ -672,7 +697,7 @@ type ClickableRowProps = {
672
697
  subtitle?: string;
673
698
  /** Click handler — renders a button */
674
699
  onClick?: () => void;
675
- /** Or provide an href to render an <a> instead */
700
+ /** Or provide an href to render an `<a>` instead */
676
701
  href?: string;
677
702
  className?: string;
678
703
  };
@@ -741,7 +766,10 @@ declare const ActivityFeed: react.ForwardRefExoticComponent<Omit<HTMLAttributes<
741
766
 
742
767
  type GridListCols = 1 | 2 | 3 | 4;
743
768
  type GridListProps = Omit<HTMLAttributes<HTMLUListElement>, 'children'> & {
744
- /** Number of columns at the widest viewport. Responsive defaults below. */
769
+ /**
770
+ * Maximum number of columns. The grid starts at one column on phones and adds
771
+ * one at `sm`, `lg` and `xl` until it reaches this count.
772
+ */
745
773
  cols?: GridListCols;
746
774
  /** Gap class (Tailwind). Default `gap-6` (24px). */
747
775
  gapClassName?: string;
@@ -754,7 +782,10 @@ type GridListFooterActionProps = AnchorHTMLAttributes<HTMLAnchorElement> & {
754
782
  index?: number;
755
783
  };
756
784
  declare const GridList: react.ForwardRefExoticComponent<Omit<HTMLAttributes<HTMLUListElement>, "children"> & {
757
- /** Number of columns at the widest viewport. Responsive defaults below. */
785
+ /**
786
+ * Maximum number of columns. The grid starts at one column on phones and adds
787
+ * one at `sm`, `lg` and `xl` until it reaches this count.
788
+ */
758
789
  cols?: GridListCols;
759
790
  /** Gap class (Tailwind). Default `gap-6` (24px). */
760
791
  gapClassName?: string;
@@ -800,6 +831,11 @@ declare const Breadcrumb: ({ items, separator, className }: BreadcrumbProps) =>
800
831
 
801
832
  type NavbarTheme = 'light' | 'dark';
802
833
  type NavbarProps = HTMLAttributes<HTMLElement> & {
834
+ /**
835
+ * `light` follows the page theme (white, gray-800 in the dark themes);
836
+ * `dark` stays dark in every theme. Also the default theme of the parts.
837
+ * Default `light`.
838
+ */
803
839
  theme?: NavbarTheme;
804
840
  /** Constrain inner content to a max width container. Default `7xl`. */
805
841
  maxWidth?: 'none' | '7xl';
@@ -809,13 +845,19 @@ type NavbarProps = HTMLAttributes<HTMLElement> & {
809
845
  };
810
846
  type NavbarItemProps = AnchorHTMLAttributes<HTMLAnchorElement> & {
811
847
  active?: boolean;
812
- /** Resolve theme from the parent `<Navbar>` data attribute. Defaults to `light`. */
848
+ /** Defaults to the theme of the parent `<Navbar>`. */
813
849
  theme?: NavbarTheme;
814
850
  };
815
851
  type NavbarMobileMenuButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {
852
+ /** Defaults to the theme of the parent `<Navbar>`. */
816
853
  theme?: NavbarTheme;
817
854
  };
818
855
  declare const Navbar: react.ForwardRefExoticComponent<HTMLAttributes<HTMLElement> & {
856
+ /**
857
+ * `light` follows the page theme (white, gray-800 in the dark themes);
858
+ * `dark` stays dark in every theme. Also the default theme of the parts.
859
+ * Default `light`.
860
+ */
819
861
  theme?: NavbarTheme;
820
862
  /** Constrain inner content to a max width container. Default `7xl`. */
821
863
  maxWidth?: "none" | "7xl";
@@ -1027,7 +1069,7 @@ type AvatarProps = {
1027
1069
  declare const Avatar: ({ src, alt, name, size, className }: AvatarProps) => react.JSX.Element;
1028
1070
 
1029
1071
  type TooltipPosition = 'top' | 'bottom' | 'left' | 'right';
1030
- type TooltipVariant = 'dark' | 'white' | 'brand';
1072
+ type TooltipVariant = 'dark' | 'white' | 'brand' | 'success' | 'warning' | 'danger';
1031
1073
  type TooltipProps = {
1032
1074
  content: ReactNode;
1033
1075
  children: ReactNode;
@@ -1035,8 +1077,21 @@ type TooltipProps = {
1035
1077
  variant?: TooltipVariant;
1036
1078
  /** Tailwind max-width class — default `max-w-xs` (320px) */
1037
1079
  maxWidth?: string;
1080
+ /** Keys shown after the content, e.g. `['⌘', 'S']`. */
1081
+ shortcut?: string[];
1082
+ /** Bold first line; `content` then reads as its explanation. */
1083
+ title?: ReactNode;
1084
+ /** Draw the small arrow pointing at the trigger. Default `true`. */
1085
+ arrow?: boolean;
1086
+ /** Milliseconds to wait before showing on hover or focus. Default `0`. */
1087
+ delay?: number;
1038
1088
  };
1039
- declare const Tooltip: ({ content, children, position, variant, maxWidth, }: TooltipProps) => react.JSX.Element;
1089
+ /**
1090
+ * Tooltip — shows `content` next to its trigger on hover and on keyboard
1091
+ * focus; Escape hides it. When the trigger is an element (a button, a link),
1092
+ * it gets `aria-describedby` pointing at the tooltip.
1093
+ */
1094
+ declare const Tooltip: ({ content, children, position, variant, maxWidth, shortcut, title, arrow, delay, }: TooltipProps) => react.JSX.Element;
1040
1095
  declare const TooltipHelp: ({ text, position, variant, }: {
1041
1096
  text: string;
1042
1097
  position?: TooltipPosition;
@@ -1183,11 +1238,26 @@ declare const Drawer: (({ open, onClose, side, size, withBackdrop, closeOutside,
1183
1238
  };
1184
1239
 
1185
1240
  type TabsOrientation = 'horizontal' | 'vertical';
1241
+ type TabsVariant =
1242
+ /** Accent line under the active tab, on a thin line under the list. */
1243
+ 'underline'
1244
+ /**
1245
+ * File-folder tabs. The active tab is raised and joins the panel, which is
1246
+ * drawn as a bordered surface; inactive tabs sit recessed behind it, on the
1247
+ * panel's edge. Works in both orientations.
1248
+ */
1249
+ | 'folder';
1186
1250
  type TabsProps = {
1187
1251
  value: string;
1188
1252
  onChange: (value: string) => void;
1189
1253
  /** Layout direction. `horizontal` (default) puts the tab list on top; `vertical` puts it on the left. */
1190
1254
  orientation?: TabsOrientation;
1255
+ /**
1256
+ * Visual style. `underline` (default) marks the active tab with an accent
1257
+ * line. `folder` draws file-folder tabs attached to their panel, which then
1258
+ * gets its own border, background and padding.
1259
+ */
1260
+ variant?: TabsVariant;
1191
1261
  children: ReactNode;
1192
1262
  className?: string;
1193
1263
  };
@@ -1199,7 +1269,7 @@ type TabProps = {
1199
1269
  disabled?: boolean;
1200
1270
  className?: string;
1201
1271
  };
1202
- declare const Tabs: (({ value, onChange, orientation, children, className }: TabsProps) => react.JSX.Element) & {
1272
+ declare const Tabs: (({ value, onChange, orientation, variant, children, className, }: TabsProps) => react.JSX.Element) & {
1203
1273
  List: ({ children, className }: {
1204
1274
  children: ReactNode;
1205
1275
  className?: string;
@@ -1215,11 +1285,18 @@ declare const Tabs: (({ value, onChange, orientation, children, className }: Tab
1215
1285
  type CodeBlockProps = {
1216
1286
  code: string;
1217
1287
  language?: string;
1288
+ /**
1289
+ * Turns `code` into highlighted nodes, rendered inside the block's `<code>`.
1290
+ * Cosmos ships no highlighter: plug one in (the story wires Shiki to the
1291
+ * `--color-code-*` theme tokens). Without it the code is plain text. The
1292
+ * copy button always copies `code`.
1293
+ */
1294
+ highlight?: (code: string, language?: string) => ReactNode;
1218
1295
  /** Show the copy button (top-right, hover-revealed). Default `true`. */
1219
1296
  showCopy?: boolean;
1220
1297
  className?: string;
1221
1298
  };
1222
- declare const CodeBlock: ({ code, language, showCopy, className }: CodeBlockProps) => react.JSX.Element;
1299
+ declare const CodeBlock: ({ code, language, highlight, showCopy, className, }: CodeBlockProps) => react.JSX.Element;
1223
1300
 
1224
1301
  type PageActionVariant = 'outline' | 'primary' | 'brand-outline' | 'danger-outline';
1225
1302
  type PageActionButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {
@@ -2820,17 +2897,24 @@ type TimelineItem = {
2820
2897
  description?: ReactNode;
2821
2898
  /** Time label — e.g. "5m ago", "2026-05-07 14:32". */
2822
2899
  time?: ReactNode;
2823
- /** Lucide icon — used by `dot` and `stepper` variants. */
2900
+ /** Lucide icon — used by `dot`, `stepper` and `alternating` variants. */
2824
2901
  icon?: ElementType;
2825
2902
  /** Initials/name for `avatar` variant. */
2826
2903
  avatarName?: string;
2827
2904
  /** Optional image URL for `avatar` variant. */
2828
2905
  avatarSrc?: string;
2829
2906
  /**
2830
- * Visual tone for `stepper` variant (icon circle background).
2831
- * Defaults to `brand`.
2907
+ * Visual tone for `stepper` and `alternating` variants (icon circle
2908
+ * background). Defaults to `brand`.
2832
2909
  */
2833
2910
  tone?: TimelineTone;
2911
+ /** Extra line under the description, e.g. "by Sarah Chen". */
2912
+ meta?: ReactNode;
2913
+ /**
2914
+ * Section label, e.g. "Today". Consecutive items with the same `group` get
2915
+ * one header above them.
2916
+ */
2917
+ group?: string;
2834
2918
  };
2835
2919
  type TimelineTone = 'brand' | 'success' | 'warning' | 'danger' | 'neutral';
2836
2920
  type TimelineVariant =
@@ -2845,7 +2929,13 @@ type TimelineVariant =
2845
2929
  */
2846
2930
  | 'stepper'
2847
2931
  /** Each entry rendered as a stand-alone card (no connector line). */
2848
- | 'card';
2932
+ | 'card'
2933
+ /**
2934
+ * Cards alternating left and right of a centred line, with a `stepper`
2935
+ * icon circle on the line and the time on the other side. Below `md`, one
2936
+ * column with the line on the left.
2937
+ */
2938
+ | 'alternating';
2849
2939
  type TimelineProps = {
2850
2940
  items: TimelineItem[];
2851
2941
  variant?: TimelineVariant;
@@ -2867,7 +2957,48 @@ type MiniCalendarProps = {
2867
2957
  */
2868
2958
  declare const MiniCalendar: ({ today, selected, onSelect, eventDays, className, }: MiniCalendarProps) => react.JSX.Element;
2869
2959
 
2960
+ type EventCalendarTone = 'brand' | 'success' | 'warning' | 'danger' | 'info' | 'violet';
2961
+ type CalendarEvent = {
2962
+ id: string;
2963
+ title: string;
2964
+ /** First day of the event. Only the date is used, not the time. */
2965
+ start: Date;
2966
+ /** Last day, inclusive. Omit for a one-day event. */
2967
+ end?: Date;
2968
+ /** Dot and chip colour. Defaults to `brand`. */
2969
+ tone?: EventCalendarTone;
2970
+ };
2971
+ type EventCalendarProps = {
2972
+ events: CalendarEvent[];
2973
+ /** Month to show (any day in it). Set it with `onMonthChange` to control the calendar. */
2974
+ month?: Date;
2975
+ /** First month shown when `month` is not set. Defaults to the month of `today`. */
2976
+ defaultMonth?: Date;
2977
+ /** Fires with the first day of the month reached by previous / next / Today. */
2978
+ onMonthChange?: (month: Date) => void;
2979
+ /** Day highlighted as today, and where the Today button goes. Defaults to now. */
2980
+ today?: Date;
2981
+ /** Makes each event chip a button. */
2982
+ onEventClick?: (event: CalendarEvent) => void;
2983
+ /** Makes each day number a button. */
2984
+ onDayClick?: (date: Date) => void;
2985
+ className?: string;
2986
+ };
2987
+ /**
2988
+ * EventCalendar — month view of events, with ISO weeks (Monday first).
2989
+ *
2990
+ * Each day shows up to three event chips (a tone dot and the title) and a
2991
+ * "+N more" button that lists the whole day. An event with an `end` repeats on
2992
+ * every day it covers. Below `sm` the chips shrink to their dots.
2993
+ *
2994
+ * Uncontrolled by default; pass `month` with `onMonthChange` to drive it from
2995
+ * outside (a side MiniCalendar, or loading events per month).
2996
+ */
2997
+ declare const EventCalendar: ({ events, month, defaultMonth, onMonthChange, today, onEventClick, onDayClick, className, }: EventCalendarProps) => react.JSX.Element;
2998
+
2870
2999
  type SortDirection = 'asc' | 'desc';
3000
+ /** Row height of a `DataTable`: the standard rows, or taller `comfortable` ones. */
3001
+ type DataTableDensity = 'default' | 'comfortable';
2871
3002
  type ColumnDef<T> = {
2872
3003
  /** Stable key — used for sort/filter identity. */
2873
3004
  key: string;
@@ -2900,6 +3031,12 @@ type DataTableProps<T> = {
2900
3031
  onRetry?: () => void;
2901
3032
  emptyTitle?: string;
2902
3033
  emptyDescription?: string;
3034
+ /**
3035
+ * Row height. `default` keeps the standard rows. `comfortable` pads the
3036
+ * header and body cells more, for rows that carry two lines (a name over an
3037
+ * email, an avatar) or need more room. Cell content stays vertically centred.
3038
+ */
3039
+ density?: DataTableDensity;
2903
3040
  /** Show a checkbox column and enable row selection. */
2904
3041
  selectable?: boolean;
2905
3042
  /** Controlled selection set (row keys). */
@@ -2921,7 +3058,7 @@ type DataTableProps<T> = {
2921
3058
  * empty states, optional row selection with bulk actions, and an optional
2922
3059
  * global search bar.
2923
3060
  */
2924
- declare const DataTable: <T>({ rows, columns, rowKey, renderRowAction, pageSize, loading, error, onRetry, emptyTitle, emptyDescription, selectable, selection: selectionProp, defaultSelection, onSelectionChange, bulkActions, searchValue: searchValueProp, defaultSearchValue, onSearchChange, searchPlaceholder, className, }: DataTableProps<T>) => react.JSX.Element;
3061
+ declare const DataTable: <T>({ rows, columns, rowKey, renderRowAction, pageSize, loading, error, onRetry, emptyTitle, emptyDescription, density, selectable, selection: selectionProp, defaultSelection, onSelectionChange, bulkActions, searchValue: searchValueProp, defaultSearchValue, onSearchChange, searchPlaceholder, className, }: DataTableProps<T>) => react.JSX.Element;
2925
3062
 
2926
3063
  type ColumnHeaderProps = {
2927
3064
  label: ReactNode;
@@ -2936,9 +3073,11 @@ type ColumnHeaderProps = {
2936
3073
  filterSelected?: Set<string>;
2937
3074
  onFilterToggle?: (v: string) => void;
2938
3075
  onFilterClear?: () => void;
3076
+ /** Cell padding, matching the `density` of the table it heads. Default `default`. */
3077
+ density?: DataTableDensity;
2939
3078
  className?: string;
2940
3079
  };
2941
- declare const ColumnHeader: ({ label, align, sortable, filterable, sortDir, onSortToggle, filterValues, filterSelected, onFilterToggle, onFilterClear, className, }: ColumnHeaderProps) => react.JSX.Element;
3080
+ declare const ColumnHeader: ({ label, align, sortable, filterable, sortDir, onSortToggle, filterValues, filterSelected, onFilterToggle, onFilterClear, density, className, }: ColumnHeaderProps) => react.JSX.Element;
2942
3081
 
2943
3082
  type ColumnFilterDropdownProps = {
2944
3083
  values: string[];
@@ -3021,17 +3160,18 @@ type ErrorPageProps = {
3021
3160
  * `code`/`title` per scenario.
3022
3161
  *
3023
3162
  * Example (404):
3024
- * <ErrorPage
3025
- * code={404}
3026
- * title="Page not found"
3027
- * description="Sorry, the page you're looking for doesn't exist."
3028
- * actions={
3029
- * <>
3030
- * <Button as="a" href="/">Go home</Button>
3031
- * <Button variant="secondary" onClick={() => history.back()}>Back</Button>
3032
- * </>
3033
- * }
3034
- * />
3163
+ *
3164
+ * <ErrorPage
3165
+ * code={404}
3166
+ * title="Page not found"
3167
+ * description="Sorry, the page you're looking for doesn't exist."
3168
+ * actions={
3169
+ * <>
3170
+ * <Button as="a" href="/">Go home</Button>
3171
+ * <Button variant="secondary" onClick={() => history.back()}>Back</Button>
3172
+ * </>
3173
+ * }
3174
+ * />
3035
3175
  */
3036
3176
  declare const ErrorPage: ({ code, title, description, illustration, actions, className, }: ErrorPageProps) => react.JSX.Element;
3037
3177
 
@@ -3316,6 +3456,10 @@ declare const OptionPicker: ({ options, value, onChange, cols, className, }: Opt
3316
3456
  type CosmosTheme = 'light' | 'sand' | 'dark' | 'deep-blue';
3317
3457
  /** A Cosmos accent: the `data-accent` attribute on `<html>`, none for `blue`. */
3318
3458
  type CosmosAccent = 'blue' | 'indigo' | 'violet' | 'purple' | 'rose' | 'teal' | 'cyan' | 'graphite' | 'red' | 'orange' | 'amber' | 'green';
3459
+ /** A Cosmos font: the `data-font` attribute on `<html>`, none for `outfit`. */
3460
+ type CosmosFont = 'outfit' | 'inter' | 'plex' | 'montserrat' | 'open-sans' | 'system';
3461
+ /** A Cosmos text size: the `data-text-size` attribute on `<html>`, none for `md`. */
3462
+ type CosmosTextSize = 'sm' | 'md' | 'lg' | 'xl';
3319
3463
  type CosmosThemeMeta = PaletteMeta & {
3320
3464
  id: CosmosTheme;
3321
3465
  dark: boolean;
@@ -3323,9 +3467,27 @@ type CosmosThemeMeta = PaletteMeta & {
3323
3467
  type CosmosAccentMeta = AccentColor & {
3324
3468
  id: CosmosAccent;
3325
3469
  };
3470
+ /** `family` is the CSS font stack the theme sets for this font. */
3471
+ type CosmosFontMeta = {
3472
+ id: CosmosFont;
3473
+ label: string;
3474
+ family: string;
3475
+ };
3476
+ /** `scale` is the factor the theme applies to every text size. */
3477
+ type CosmosTextSizeMeta = {
3478
+ id: CosmosTextSize;
3479
+ label: string;
3480
+ scale: number;
3481
+ };
3482
+ /**
3483
+ * The page's appearance. `font` and `textSize` are optional: leave them out
3484
+ * and `applyAppearance` doesn't touch their attributes.
3485
+ */
3326
3486
  type CosmosAppearance = {
3327
3487
  theme: CosmosTheme;
3328
3488
  accent: CosmosAccent;
3489
+ font?: CosmosFont;
3490
+ textSize?: CosmosTextSize;
3329
3491
  };
3330
3492
  /** The four themes shipped by `@sckyzo/cosmos-theme`, ready for `<PalettePicker>`. */
3331
3493
  declare const COSMOS_THEMES: CosmosThemeMeta[];
@@ -3335,13 +3497,23 @@ declare const COSMOS_THEMES: CosmosThemeMeta[];
3335
3497
  * they come last.
3336
3498
  */
3337
3499
  declare const COSMOS_ACCENTS: CosmosAccentMeta[];
3500
+ /**
3501
+ * The fonts of `@sckyzo/cosmos-theme`. Outfit loads from
3502
+ * `@sckyzo/cosmos-theme/fonts`, each other one from `fonts/<id>`; `system`
3503
+ * loads nothing. Only offer the fonts whose CSS the app imports.
3504
+ */
3505
+ declare const COSMOS_FONTS: CosmosFontMeta[];
3506
+ /** The four text sizes of `@sckyzo/cosmos-theme`, smallest first. */
3507
+ declare const COSMOS_TEXT_SIZES: CosmosTextSizeMeta[];
3338
3508
  /** `true` for the themes that enable Tailwind's `dark:` variant. */
3339
3509
  declare const isDarkTheme: (theme: CosmosTheme) => boolean;
3340
3510
  /**
3341
- * Apply a theme and an accent to `root` (default `<html>`): swaps the theme
3342
- * class and sets `data-accent`, removing it for `blue`. No-op during SSR.
3511
+ * Apply an appearance to `root` (default `<html>`): swaps the theme class and
3512
+ * sets `data-accent`, `data-font` and `data-text-size`, removing each one for
3513
+ * its default (blue, Outfit, `md`). A `font` or `textSize` left out keeps its
3514
+ * attribute as it is. No-op during SSR.
3343
3515
  */
3344
- declare const applyAppearance: ({ theme, accent }: CosmosAppearance, root?: HTMLElement) => void;
3516
+ declare const applyAppearance: ({ theme, accent, font, textSize }: CosmosAppearance, root?: HTMLElement) => void;
3345
3517
 
3346
3518
  type AppearanceSettingsProps = {
3347
3519
  /** Selected theme. */
@@ -3360,14 +3532,34 @@ type AppearanceSettingsProps = {
3360
3532
  accents?: CosmosAccentMeta[];
3361
3533
  /** Columns of the theme grid. Default 4; use 2 in narrow containers. */
3362
3534
  themeColumns?: number;
3535
+ /** Selected font. Default `'outfit'`. */
3536
+ font?: CosmosFont;
3537
+ /** Shows the font group. */
3538
+ onFontChange?: (font: CosmosFont) => void;
3539
+ /** Selected text size. Default `'md'`. */
3540
+ textSize?: CosmosTextSize;
3541
+ /** Shows the text size group. */
3542
+ onTextSizeChange?: (textSize: CosmosTextSize) => void;
3543
+ /** Heading of the font group. Default `'Font'`. */
3544
+ fontLabel?: string;
3545
+ /** Heading of the text size group. Default `'Text size'`. */
3546
+ textSizeLabel?: string;
3547
+ /**
3548
+ * Fonts to offer. Default: all of `COSMOS_FONTS`. Offer only the fonts whose
3549
+ * CSS the app imports (`@sckyzo/cosmos-theme/fonts/<id>`).
3550
+ */
3551
+ fonts?: CosmosFontMeta[];
3552
+ /** Text sizes to offer. Default: all of `COSMOS_TEXT_SIZES`. */
3553
+ textSizes?: CosmosTextSizeMeta[];
3363
3554
  className?: string;
3364
3555
  };
3365
3556
  /**
3366
3557
  * AppearanceSettings — theme and accent pickers for the Cosmos themes, built
3367
- * on `<PalettePicker>` and `<AccentPicker>`. Controlled: pass the result to
3558
+ * on `<PalettePicker>` and `<AccentPicker>`, plus font and text size pickers
3559
+ * when their `on…Change` handlers are set. Controlled: pass the result to
3368
3560
  * `applyAppearance` (or your own theme switcher) to update the page.
3369
3561
  */
3370
- declare const AppearanceSettings: ({ theme, accent, onThemeChange, onAccentChange, themeLabel, accentLabel, themes, accents, themeColumns, className, }: AppearanceSettingsProps) => react.JSX.Element;
3562
+ declare const AppearanceSettings: ({ theme, accent, onThemeChange, onAccentChange, themeLabel, accentLabel, themes, accents, themeColumns, font, onFontChange, textSize, onTextSizeChange, fontLabel, textSizeLabel, fonts, textSizes, className, }: AppearanceSettingsProps) => react.JSX.Element;
3371
3563
 
3372
3564
  type AppearanceMenuSize = 'sm' | 'md';
3373
3565
  type AppearanceMenuProps = Omit<AppearanceSettingsProps, 'className'> & {
@@ -3455,4 +3647,4 @@ type FigureProps = Omit<ImgHTMLAttributes<HTMLImageElement>, 'children'> & {
3455
3647
  */
3456
3648
  declare const Figure: ({ src, alt, caption, align, size, radius, shadow, className, wrapperClassName, ...rest }: FigureProps) => react.JSX.Element;
3457
3649
 
3458
- export { type AccentColor, AccentPicker, type AccentPickerProps, Accordion, type AccordionContentProps, type AccordionItemProps, type AccordionProps, type AccordionTriggerProps, ActionPanel, type ActionPanelLayout, type ActionPanelProps, type ActiveFilter, ActiveFiltersBar, type ActiveFiltersBarProps, ActivityFeed, type ActivityFeedIntent, type ActivityFeedItemProps, type ActivityFeedProps, AlertBanner, type AlertBannerProps, type AlertVariant, AnnouncementBar, type AnnouncementBarIntent, type AnnouncementBarProps, AppearanceMenu, type AppearanceMenuProps, type AppearanceMenuSize, AppearanceSettings, type AppearanceSettingsProps, AuthLayout, type AuthLayoutProps, Avatar, type AvatarProps, type AvatarSize, AvatarUploader, type AvatarUploaderProps, type AvatarUploaderSize, BackToTopFab, type BackToTopFabIntent, type BackToTopFabPosition, type BackToTopFabProps, Backdrop, type BackdropProps, Badge, type BadgeAppearance, type BadgeProps, type BadgeSize, type BadgeVariant, Blockquote, type BlockquoteAlign, type BlockquoteProps, type BlockquoteSize, type BlockquoteVariant, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, type BreadcrumbSeparator, Button, ButtonGroup, type ButtonGroupOrientation, type ButtonGroupProps, type ButtonProps, type ButtonShape, type ButtonSize, type ButtonVariant, COSMOS_ACCENTS, COSMOS_THEMES, Calendar, type CalendarProps, Card, type CardImageProps, type CardProps, Carousel, type CarouselControlsProps, type CarouselIndicatorsProps, type CarouselOptions, type CarouselProps, CarouselRoot, type CarouselSlideProps, type CarouselViewportProps, Checkbox, CheckboxGroup, type CheckboxGroupOption, type CheckboxGroupProps, type CheckboxProps, type CheckboxSize, ClickableRow, type ClickableRowProps, Clipboard, type ClipboardProps, type ClipboardSize, type ClipboardVariant, CodeBlock, type CodeBlockProps, ColBox, type ColBoxProps, ColorSwatch, type ColorSwatchProps, type ColumnDef, ColumnFilterDropdown, type ColumnFilterDropdownProps, ColumnHeader, type ColumnHeaderProps, Combobox, type ComboboxOption, type ComboboxProps, CommandPalette, type CommandPaletteFooterProps, type CommandPaletteGroupProps, type CommandPaletteInputProps, type CommandPaletteItemProps, type CommandPaletteListProps, type CommandPaletteProps, ConfirmationModal, type ConfirmationModalProps, ContentNarrow, type ContentNarrowProps, ContentStackedList, type ContentStackedListItemProps, type ContentStackedListProps, CookieBanner, type CookieBannerPosition, type CookieBannerProps, type CosmosAccent, type CosmosAccentMeta, type CosmosAppearance, type CosmosTheme, type CosmosThemeMeta, type CosmosToasterProps, DataTable, type DataTableProps, DatePicker, type DatePickerMode, type DatePickerProps, type DateRange, DescriptionList, type DescriptionListItemProps, type DescriptionListProps, Divider, type DividerAlign, type DividerIconProps, type DividerProps, type DividerRowProps, Drawer, type DrawerHeaderProps, type DrawerProps, type DrawerSide, type DrawerSize, Dropdown, type DropdownDivider, type DropdownItem, type DropdownOption, type DropdownProps, Dropzone, type DropzoneProps, EmptyState, type EmptyStateProps, ErrorPage, type ErrorPageProps, ErrorState, type ErrorStateProps, Figure, type FigureAlign, type FigureProps, type FigureRadius, type FigureSize, FileInput, type FileInputProps, type FilterOption, FilterPills, type FilterPillsProps, FormFooter, type FormFooterAlign, type FormFooterProps, FormRow, type FormRowProps, GridList, type GridListCardProps, type GridListCols, type GridListFooterActionProps, type GridListFooterProps, type GridListProps, HealthBadge, type HealthBadgeProps, HealthDot, type HealthDotProps, type HealthStatus, HelpOverlay, type HelpOverlayProps, type HelpOverlaySectionProps, type HelpOverlayShortcutProps, IconBox, type IconBoxProps, type IconBoxSize, ImageGrid, type ImageGridColumns, type ImageGridGap, type ImageGridProps, Input, type InputProps, IntegrationCard, type IntegrationCardProps, type IntegrationStatus, Kbd, type KbdProps, type KbdSize, KpiCard, type KpiCardProps, Link, type LinkProps, type LinkVariant, List, type ListItemProps, type ListMarker, type ListOrientation, type ListProps, type ListSpacing, type ListVariant, LoadingState, type LoadingStateProps, MediaObject, type MediaObjectAlign, type MediaObjectBodyProps, type MediaObjectImageProps, type MediaObjectPosition, type MediaObjectProps, MiniCalendar, type MiniCalendarProps, Modal, type ModalAlertIntent, type ModalAlertLayout, type ModalAlertProps, type ModalHeaderProps, type ModalProps, type ModalSize, NarrowStackedList, type NarrowStackedListHeaderProps, type NarrowStackedListItemProps, type NarrowStackedListProps, Navbar, type NavbarItemProps, type NavbarMobileMenuButtonProps, type NavbarProps, type NavbarTheme, NotificationCard, type NotificationCardCondensedProps, type NotificationCardSimpleProps, type NotificationIntent, type NotificationSeverity, NotificationsPanel, type NotificationsPanelContentProps, type NotificationsPanelCountersProps, type NotificationsPanelEmptyProps, type NotificationsPanelFooterProps, type NotificationsPanelHeaderActionProps, type NotificationsPanelHeaderProps, type NotificationsPanelItemProps, type NotificationsPanelListProps, type NotificationsPanelProps, type NotificationsPanelTriggerProps, NumberInput, type NumberInputProps, OptionCard, type OptionCardProps, type OptionItem, OptionPicker, type OptionPickerProps, OtpInput, type OtpInputProps, PageActionButton, type PageActionButtonProps, PageActionIconButton, type PageActionIconButtonProps, type PageActionVariant, PageBreadcrumb, type PageBreadcrumbItem, type PageBreadcrumbProps, PageCard, type PageCardProps, PageHeader, type PageHeaderMetaItemProps, type PageHeaderProps, Pagination, type PaginationProps, type PaginationSize, type PaginationVariant, PaletteCard, type PaletteCardProps, type PaletteMeta, PalettePicker, type PalettePickerProps, type PalettePreview, PasswordInput, type PasswordInputProps, PasswordPolicyChecker, type PasswordPolicyCheckerProps, type PasswordRule, Popover, type PopoverAlign, type PopoverContentProps, type PopoverPosition, type PopoverProps, type PopoverTriggerProps, ProgressBar, type ProgressBarIntent, type ProgressBarLabel, type ProgressBarProps, type ProgressBarSize, REFRESH_OPTIONS, Radio, RadioGroup, type RadioGroupOption, type RadioGroupProps, type RadioProps, type RadioSize, RefreshButton, type RefreshButtonProps, type RefreshOption, ResetPasswordForm, type ResetPasswordFormProps, Ribbon, type RibbonIntent, type RibbonPosition, type RibbonProps, type RibbonShape, RowActionButton, type RowActionButtonProps, STATUS_COLOR, STATUS_PILL, type SaveState, SearchInput, type SearchInputProps, SectionCard, type SectionCardProps, SectionLabel, type SectionLabelProps, type SegmentOption, SegmentedControl, type SegmentedControlProps, Select, SelectInput, type SelectInputOption, type SelectInputProps, type SelectOption, type SelectProps, Shell, type ShellProps, Sidebar, type SidebarGroupProps, type SidebarItemProps, type SidebarProps, type SidebarSectionProps, SignInForm, type SignInFormProps, type SignInFormValues, SignUpForm, type SignUpFormProps, type SignUpFormValues, SimpleRow, type SimpleRowProps, Sk, type SkProps, SkeletonList, type SkeletonListProps, SkeletonTable, type SkeletonTableProps, SkeletonText, type SkeletonTextProps, SocialAuthButtons, type SocialAuthButtonsLayout, type SocialAuthButtonsProps, type SocialProvider, type SortDirection, Spinner, type SpinnerProps, type SpinnerSize, StackedList, StackedListInCard, type StackedListInCardProps, type StackedListItemProps, type StackedListProps, StatefulSaveButton, type StatefulSaveButtonProps, StatusBadge, type StatusBadgeProps, StatusRow, type StatusRowProps, type StepStatus, Stepper, StepperInput, type StepperInputProps, type StepperOrientation, type StepperProps, StepperRoot, type StepperSize, type StepperStepProps, type StepperVariant, StickyScrollNav, type StickyScrollNavProps, type StickyScrollNavSection, type TabProps, Tabs, type TabsOrientation, type TabsProps, Textarea, type TextareaProps, type TextareaResize, type ThemeMode, ThemeToggle, type ThemeToggleProps, type ThemeToggleSize, ThemeToggleTri, type ThemeToggleTriProps, type ThemeToggleTriSize, TimePicker, type TimePickerProps, Timeline, type TimelineItem, type TimelineProps, type TimelineTone, type TimelineVariant, Toaster, Toggle, type ToggleProps, Tooltip, TooltipHelp, type TooltipPosition, type TooltipProps, type TooltipVariant, Topbar, type TopbarProps, TwoStepVerificationForm, type TwoStepVerificationFormProps, UnsavedIndicator, type UnsavedIndicatorProps, UserMenu, type UserMenuContentProps, type UserMenuHeaderProps, type UserMenuItemProps, type UserMenuItemVariant, type UserMenuProps, type UserMenuTriggerProps, VerticalNavigation, type VerticalNavigationItemProps, type VerticalNavigationProps, type VerticalNavigationSectionProps, VideoEmbed, type VideoEmbedAspect, type VideoEmbedProps, ZoomBar, type ZoomBarProps, applyAppearance, defaultPasswordRules, isDarkTheme, useAutoRefresh };
3650
+ export { type AccentColor, AccentPicker, type AccentPickerProps, Accordion, type AccordionContentProps, type AccordionItemProps, type AccordionProps, type AccordionTriggerProps, ActionPanel, type ActionPanelLayout, type ActionPanelProps, type ActiveFilter, ActiveFiltersBar, type ActiveFiltersBarProps, ActivityFeed, type ActivityFeedIntent, type ActivityFeedItemProps, type ActivityFeedProps, AlertBanner, type AlertBannerProps, type AlertVariant, AnnouncementBar, type AnnouncementBarIntent, type AnnouncementBarProps, AppearanceMenu, type AppearanceMenuProps, type AppearanceMenuSize, AppearanceSettings, type AppearanceSettingsProps, AuthLayout, type AuthLayoutProps, Avatar, type AvatarProps, type AvatarSize, AvatarUploader, type AvatarUploaderProps, type AvatarUploaderSize, BackToTopFab, type BackToTopFabIntent, type BackToTopFabPosition, type BackToTopFabProps, Backdrop, type BackdropProps, Badge, type BadgeAppearance, type BadgeProps, type BadgeSize, type BadgeVariant, Blockquote, type BlockquoteAlign, type BlockquoteProps, type BlockquoteSize, type BlockquoteVariant, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, type BreadcrumbSeparator, Button, ButtonGroup, type ButtonGroupOrientation, type ButtonGroupProps, type ButtonProps, type ButtonShape, type ButtonSize, type ButtonVariant, COSMOS_ACCENTS, COSMOS_FONTS, COSMOS_TEXT_SIZES, COSMOS_THEMES, Calendar, type CalendarEvent, type CalendarProps, Card, type CardImageProps, type CardProps, Carousel, type CarouselControlsProps, type CarouselIndicatorsProps, type CarouselOptions, type CarouselProps, CarouselRoot, type CarouselSlideProps, type CarouselViewportProps, Checkbox, CheckboxGroup, type CheckboxGroupOption, type CheckboxGroupProps, type CheckboxProps, type CheckboxSize, ClickableRow, type ClickableRowProps, Clipboard, type ClipboardProps, type ClipboardSize, type ClipboardVariant, CodeBlock, type CodeBlockProps, ColBox, type ColBoxProps, ColorSwatch, type ColorSwatchProps, type ColumnDef, ColumnFilterDropdown, type ColumnFilterDropdownProps, ColumnHeader, type ColumnHeaderProps, Combobox, type ComboboxOption, type ComboboxProps, CommandPalette, type CommandPaletteFooterProps, type CommandPaletteGroupProps, type CommandPaletteInputProps, type CommandPaletteItemProps, type CommandPaletteListProps, type CommandPaletteProps, ConfirmationModal, type ConfirmationModalProps, ContentNarrow, type ContentNarrowProps, ContentStackedList, type ContentStackedListItemProps, type ContentStackedListProps, CookieBanner, type CookieBannerPosition, type CookieBannerProps, type CosmosAccent, type CosmosAccentMeta, type CosmosAppearance, type CosmosFont, type CosmosFontMeta, type CosmosTextSize, type CosmosTextSizeMeta, type CosmosTheme, type CosmosThemeMeta, type CosmosToasterProps, DataTable, type DataTableDensity, type DataTableProps, DatePicker, type DatePickerMode, type DatePickerProps, type DateRange, DescriptionList, type DescriptionListItemProps, type DescriptionListProps, Divider, type DividerAlign, type DividerIconProps, type DividerProps, type DividerRowProps, Drawer, type DrawerHeaderProps, type DrawerProps, type DrawerSide, type DrawerSize, Dropdown, type DropdownDivider, type DropdownItem, type DropdownOption, type DropdownProps, Dropzone, type DropzoneProps, EmptyState, type EmptyStateProps, ErrorPage, type ErrorPageProps, ErrorState, type ErrorStateProps, EventCalendar, type EventCalendarProps, type EventCalendarTone, Figure, type FigureAlign, type FigureProps, type FigureRadius, type FigureSize, FileInput, type FileInputProps, type FilterOption, FilterPills, type FilterPillsProps, FormFooter, type FormFooterAlign, type FormFooterProps, FormRow, type FormRowProps, GridList, type GridListCardProps, type GridListCols, type GridListFooterActionProps, type GridListFooterProps, type GridListProps, HealthBadge, type HealthBadgeProps, HealthDot, type HealthDotProps, type HealthStatus, HelpOverlay, type HelpOverlayProps, type HelpOverlaySectionProps, type HelpOverlayShortcutProps, IconBox, type IconBoxProps, type IconBoxSize, ImageGrid, type ImageGridColumns, type ImageGridGap, type ImageGridProps, Input, type InputProps, IntegrationCard, type IntegrationCardProps, type IntegrationStatus, Kbd, type KbdProps, type KbdSize, KpiCard, type KpiCardProps, Link, type LinkProps, type LinkVariant, List, type ListItemProps, type ListMarker, type ListOrientation, type ListProps, type ListSpacing, type ListVariant, LoadingState, type LoadingStateProps, MediaObject, type MediaObjectAlign, type MediaObjectBodyProps, type MediaObjectImageProps, type MediaObjectPosition, type MediaObjectProps, MiniCalendar, type MiniCalendarProps, Modal, type ModalAlertIntent, type ModalAlertLayout, type ModalAlertProps, type ModalHeaderProps, type ModalProps, type ModalSize, NarrowStackedList, type NarrowStackedListHeaderProps, type NarrowStackedListItemProps, type NarrowStackedListProps, Navbar, type NavbarItemProps, type NavbarMobileMenuButtonProps, type NavbarProps, type NavbarTheme, NotificationCard, type NotificationCardCondensedProps, type NotificationCardSimpleProps, type NotificationIntent, type NotificationSeverity, NotificationsPanel, type NotificationsPanelContentProps, type NotificationsPanelCountersProps, type NotificationsPanelEmptyProps, type NotificationsPanelFooterProps, type NotificationsPanelHeaderActionProps, type NotificationsPanelHeaderProps, type NotificationsPanelItemProps, type NotificationsPanelListProps, type NotificationsPanelProps, type NotificationsPanelTriggerProps, NumberInput, type NumberInputProps, OptionCard, type OptionCardProps, type OptionItem, OptionPicker, type OptionPickerProps, OtpInput, type OtpInputProps, PageActionButton, type PageActionButtonProps, PageActionIconButton, type PageActionIconButtonProps, type PageActionVariant, PageBreadcrumb, type PageBreadcrumbItem, type PageBreadcrumbProps, PageHeader, type PageHeaderMetaItemProps, type PageHeaderProps, Pagination, type PaginationProps, type PaginationSize, type PaginationVariant, PaletteCard, type PaletteCardProps, type PaletteMeta, PalettePicker, type PalettePickerProps, type PalettePreview, PasswordInput, type PasswordInputProps, PasswordPolicyChecker, type PasswordPolicyCheckerProps, type PasswordRule, Popover, type PopoverAlign, type PopoverContentProps, type PopoverPosition, type PopoverProps, type PopoverTriggerProps, ProgressBar, type ProgressBarIntent, type ProgressBarLabel, type ProgressBarProps, type ProgressBarSize, REFRESH_OPTIONS, Radio, RadioGroup, type RadioGroupOption, type RadioGroupProps, type RadioProps, type RadioSize, RefreshButton, type RefreshButtonProps, type RefreshOption, ResetPasswordForm, type ResetPasswordFormProps, Ribbon, type RibbonIntent, type RibbonPosition, type RibbonProps, type RibbonShape, RowActionButton, type RowActionButtonProps, STATUS_COLOR, STATUS_PILL, type SaveState, SearchInput, type SearchInputProps, SectionCard, type SectionCardProps, SectionLabel, type SectionLabelProps, type SegmentOption, SegmentedControl, type SegmentedControlProps, Select, SelectInput, type SelectInputOption, type SelectInputProps, type SelectOption, type SelectProps, Shell, type ShellProps, Sidebar, type SidebarGroupProps, type SidebarItemProps, type SidebarProps, type SidebarSectionProps, SignInForm, type SignInFormProps, type SignInFormValues, SignUpForm, type SignUpFormProps, type SignUpFormValues, SimpleRow, type SimpleRowProps, Sk, type SkProps, SkeletonList, type SkeletonListProps, SkeletonTable, type SkeletonTableProps, SkeletonText, type SkeletonTextProps, SocialAuthButtons, type SocialAuthButtonsLayout, type SocialAuthButtonsProps, type SocialProvider, type SortDirection, Spinner, type SpinnerProps, type SpinnerSize, StackedList, StackedListInCard, type StackedListInCardProps, type StackedListItemProps, type StackedListProps, StatefulSaveButton, type StatefulSaveButtonProps, StatusBadge, type StatusBadgeProps, StatusRow, type StatusRowProps, type StepStatus, Stepper, StepperInput, type StepperInputProps, type StepperOrientation, type StepperProps, StepperRoot, type StepperSize, type StepperStepProps, type StepperVariant, StickyScrollNav, type StickyScrollNavProps, type StickyScrollNavSection, type TabProps, Tabs, type TabsOrientation, type TabsProps, type TabsVariant, Textarea, type TextareaProps, type TextareaResize, type ThemeMode, ThemeToggle, type ThemeToggleProps, type ThemeToggleSize, ThemeToggleTri, type ThemeToggleTriProps, type ThemeToggleTriSize, TimePicker, type TimePickerProps, Timeline, type TimelineItem, type TimelineProps, type TimelineTone, type TimelineVariant, Toaster, Toggle, type ToggleProps, Tooltip, TooltipHelp, type TooltipPosition, type TooltipProps, type TooltipVariant, Topbar, type TopbarProps, TwoStepVerificationForm, type TwoStepVerificationFormProps, UnsavedIndicator, type UnsavedIndicatorProps, UserMenu, type UserMenuContentProps, type UserMenuHeaderProps, type UserMenuItemProps, type UserMenuItemVariant, type UserMenuProps, type UserMenuTriggerProps, VerticalNavigation, type VerticalNavigationItemProps, type VerticalNavigationProps, type VerticalNavigationSectionProps, VideoEmbed, type VideoEmbedAspect, type VideoEmbedProps, ZoomBar, type ZoomBarProps, applyAppearance, defaultPasswordRules, isDarkTheme, useAutoRefresh };