@kismet-ux/constellation 1.3.0 → 1.4.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/form.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- export { C as Checkbox, a as CheckboxProps, D as DatePicker, L as Label, c as LabelProps, S as Select, e as SelectContent, g as SelectField, i as SelectGroup, j as SelectItem, m as SelectSeparator, o as SelectTrigger, p as SelectValue } from './index-h4thndEb.js';
1
+ export { C as Checkbox, a as CheckboxProps, D as DatePicker, L as Label, c as LabelProps, S as Select, e as SelectContent, g as SelectField, i as SelectGroup, j as SelectItem, m as SelectSeparator, o as SelectTrigger, p as SelectValue } from './index-6RTzMxvi.js';
2
2
  export { I as Input, a as InputBaseProps } from './input-CWHXOpeH.js';
3
3
  import 'react';
4
4
  import 'class-variance-authority';
@@ -95,7 +95,7 @@ declare function DatePicker({ value: valueProp, defaultValue, onChange, label, h
95
95
 
96
96
  declare const labelVariants: (props?: ({
97
97
  size?: "sm" | "md" | "lg" | null | undefined;
98
- theme?: "inherit" | "primary" | "secondary" | "success" | "destructive" | "warning" | "info" | "slate" | null | undefined;
98
+ theme?: "primary" | "secondary" | "destructive" | "warning" | "success" | "info" | "slate" | "inherit" | null | undefined;
99
99
  } & class_variance_authority_types.ClassProp) | undefined) => string;
100
100
 
101
101
  interface LabelProps extends React.LabelHTMLAttributes<HTMLLabelElement>, VariantProps<typeof labelVariants> {
@@ -3,7 +3,7 @@ import React__default from 'react';
3
3
  import { d as SidebarSection, S as SidebarNavItem, B as BreadcrumbItemData, c as NavUserProps } from './nav-user-CJIcWKyY.js';
4
4
  import { R as RowProps } from './row-CS9-talZ.js';
5
5
  import { I as Input } from './input-CWHXOpeH.js';
6
- import { b as TooltipContent, B as Button } from './tooltip-C25-bG7o.js';
6
+ import { b as TooltipContent, B as Button } from './tooltip-Bb0qqHZI.js';
7
7
  import { VariantProps } from 'class-variance-authority';
8
8
  import * as class_variance_authority_types from 'class-variance-authority/types';
9
9
 
@@ -114,8 +114,24 @@ declare function AppSidebarHeader({ breadcrumbs, user, userMenu, actions, }: App
114
114
 
115
115
  interface CollapseProps extends React.HTMLAttributes<HTMLDivElement> {
116
116
  open: boolean;
117
+ /** Transition length in ms. Also how long the unmount is deferred. */
117
118
  duration?: number;
119
+ /**
120
+ * Unmount children once the close animation finishes. Keeps focus traps,
121
+ * `autoFocus` and dismiss handlers out of the tree while the panel is shut.
122
+ * Set `false` to keep children mounted — cheaper for a panel toggled often,
123
+ * and required if they hold state you need to survive a close.
124
+ */
125
+ unmountOnClose?: boolean;
118
126
  }
127
+ /**
128
+ * A panel that animates its own height, so content below slides rather than
129
+ * jumping.
130
+ *
131
+ * Uses `grid-template-rows: 0fr → 1fr` rather than animating `max-height`: it
132
+ * interpolates to the panel's real height, so there is no magic number to
133
+ * guess and no pause at the end when the guess was too generous.
134
+ */
119
135
  declare const Collapse: React.ForwardRefExoticComponent<CollapseProps & React.RefAttributes<HTMLDivElement>>;
120
136
 
121
137
  declare const Column: React.FC<ColumnProps>;
@@ -127,7 +143,7 @@ declare const Grid: React.ForwardRefExoticComponent<GridProps & React.RefAttribu
127
143
  declare const Row: React.FC<RowProps>;
128
144
 
129
145
  declare const sidebarMenuButtonVariants: (props?: ({
130
- variant?: "default" | "outline" | null | undefined;
146
+ variant?: "outline" | "default" | null | undefined;
131
147
  size?: "sm" | "md" | "lg" | null | undefined;
132
148
  } & class_variance_authority_types.ClassProp) | undefined) => string;
133
149
 
@@ -2,7 +2,7 @@ import { VariantProps } from 'class-variance-authority';
2
2
  import * as React from 'react';
3
3
  import React__default, { ReactNode } from 'react';
4
4
  import * as class_variance_authority_types from 'class-variance-authority/types';
5
- import './tooltip-C25-bG7o.js';
5
+ import './tooltip-Bb0qqHZI.js';
6
6
  import { e as TypographyVariant } from './typography-DOZHFR5A.js';
7
7
 
8
8
  type AlertTheme = 'default' | 'primary' | 'secondary' | 'success' | 'destructive' | 'warning' | 'info' | 'slate';
@@ -45,7 +45,7 @@ type SortContextValue = {
45
45
  };
46
46
 
47
47
  declare const alertVariants: (props?: ({
48
- theme?: "default" | "primary" | "secondary" | "success" | "destructive" | "warning" | "info" | "slate" | null | undefined;
48
+ theme?: "primary" | "secondary" | "destructive" | "warning" | "success" | "info" | "slate" | "default" | null | undefined;
49
49
  } & class_variance_authority_types.ClassProp) | undefined) => string;
50
50
 
51
51
  interface AlertProps extends VariantProps<typeof alertVariants> {
@@ -82,10 +82,10 @@ type AvatarFallbackProps = React.HTMLAttributes<HTMLSpanElement>;
82
82
  declare const AvatarFallback: React.ForwardRefExoticComponent<AvatarFallbackProps & React.RefAttributes<HTMLSpanElement>>;
83
83
 
84
84
  declare const chipVariants: (props?: ({
85
- theme?: "inherit" | "primary" | "secondary" | "success" | "destructive" | "warning" | "info" | "slate" | null | undefined;
85
+ theme?: "primary" | "secondary" | "destructive" | "warning" | "success" | "info" | "slate" | "inherit" | null | undefined;
86
86
  variant?: "soft" | "outline" | "solid" | null | undefined;
87
- size?: "sm" | "md" | "2xs" | "xs" | null | undefined;
88
- shape?: "rounded" | "pill" | null | undefined;
87
+ size?: "2xs" | "xs" | "sm" | "md" | null | undefined;
88
+ shape?: "pill" | "rounded" | null | undefined;
89
89
  dashed?: boolean | null | undefined;
90
90
  mono?: boolean | null | undefined;
91
91
  uppercase?: boolean | null | undefined;
@@ -111,7 +111,7 @@ interface ChipProps extends React.HTMLAttributes<HTMLSpanElement>, VariantProps<
111
111
  declare const Chip: React.ForwardRefExoticComponent<ChipProps & React.RefAttributes<HTMLSpanElement>>;
112
112
 
113
113
  declare const codeBlockVariants: (props?: ({
114
- theme?: "default" | "primary" | "secondary" | "success" | "destructive" | "warning" | "info" | "slate" | null | undefined;
114
+ theme?: "primary" | "secondary" | "destructive" | "warning" | "success" | "info" | "slate" | "default" | null | undefined;
115
115
  size?: "sm" | "md" | "lg" | null | undefined;
116
116
  } & class_variance_authority_types.ClassProp) | undefined) => string;
117
117
 
@@ -184,7 +184,7 @@ declare function DialogPortal({ children }: {
184
184
  }): React.JSX.Element;
185
185
 
186
186
  declare const emptyStateVariants: (props?: ({
187
- theme?: "default" | "primary" | "secondary" | "success" | "destructive" | "warning" | "info" | "slate" | null | undefined;
187
+ theme?: "primary" | "secondary" | "destructive" | "warning" | "success" | "info" | "slate" | "default" | null | undefined;
188
188
  size?: "sm" | "md" | "lg" | null | undefined;
189
189
  } & class_variance_authority_types.ClassProp) | undefined) => string;
190
190
 
@@ -201,9 +201,9 @@ interface EmptyStateProps extends React.HTMLAttributes<HTMLDivElement>, VariantP
201
201
  declare const EmptyState: React.ForwardRefExoticComponent<EmptyStateProps & React.RefAttributes<HTMLDivElement>>;
202
202
 
203
203
  declare const iconVariants: (props?: ({
204
- variant?: "outlined" | "contained" | "ghost" | "plain" | null | undefined;
205
- theme?: "inherit" | "primary" | "secondary" | "success" | "destructive" | "warning" | "info" | "slate" | null | undefined;
206
- size?: "sm" | "md" | "lg" | "xs" | null | undefined;
204
+ variant?: "contained" | "outlined" | "ghost" | "plain" | null | undefined;
205
+ theme?: "primary" | "secondary" | "destructive" | "warning" | "success" | "info" | "slate" | "inherit" | null | undefined;
206
+ size?: "xs" | "sm" | "md" | "lg" | null | undefined;
207
207
  rounded?: boolean | "extra" | null | undefined;
208
208
  } & class_variance_authority_types.ClassProp) | undefined) => string;
209
209
 
@@ -253,7 +253,7 @@ interface ListProps extends React.HTMLAttributes<HTMLUListElement | HTMLOListEle
253
253
  size?: 'xs' | 'sm' | 'md' | 'lg';
254
254
  muted?: boolean;
255
255
  }
256
- declare const List: React.ForwardRefExoticComponent<ListProps & React.RefAttributes<HTMLOListElement | HTMLUListElement>>;
256
+ declare const List: React.ForwardRefExoticComponent<ListProps & React.RefAttributes<HTMLUListElement | HTMLOListElement>>;
257
257
  interface ListItemProps extends React.LiHTMLAttributes<HTMLLIElement> {
258
258
  icon?: React.ReactNode;
259
259
  }
@@ -262,8 +262,8 @@ declare const ListItem: React.ForwardRefExoticComponent<ListItemProps & React.Re
262
262
  declare const Pagination: React.ForwardRefExoticComponent<PaginationProps & React.RefAttributes<HTMLElement>>;
263
263
 
264
264
  declare const progressBarVariants: (props?: ({
265
- theme?: "inherit" | "primary" | "secondary" | "success" | "destructive" | "warning" | "info" | "slate" | null | undefined;
266
- size?: "sm" | "md" | "lg" | "xs" | null | undefined;
265
+ theme?: "primary" | "secondary" | "destructive" | "warning" | "success" | "info" | "slate" | "inherit" | null | undefined;
266
+ size?: "xs" | "sm" | "md" | "lg" | null | undefined;
267
267
  rounded?: boolean | null | undefined;
268
268
  animated?: boolean | null | undefined;
269
269
  indeterminate?: boolean | null | undefined;
@@ -314,7 +314,7 @@ interface StatCardProps extends React.ComponentPropsWithoutRef<'div'> {
314
314
  declare const StatCard: React.ForwardRefExoticComponent<StatCardProps & React.RefAttributes<HTMLDivElement>>;
315
315
 
316
316
  declare const statusDotVariants: (props?: ({
317
- theme?: "inherit" | "primary" | "secondary" | "success" | "destructive" | "warning" | "info" | "slate" | null | undefined;
317
+ theme?: "primary" | "secondary" | "destructive" | "warning" | "success" | "info" | "slate" | "inherit" | null | undefined;
318
318
  size?: "sm" | "md" | "lg" | null | undefined;
319
319
  glow?: boolean | null | undefined;
320
320
  pulse?: boolean | null | undefined;
@@ -340,7 +340,7 @@ interface StatusDotProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, 'co
340
340
  declare const StatusDot: React.ForwardRefExoticComponent<StatusDotProps & React.RefAttributes<HTMLSpanElement>>;
341
341
 
342
342
  declare const stepProgressVariants: (props?: ({
343
- theme?: "inherit" | "primary" | "secondary" | "success" | "destructive" | "warning" | "info" | "slate" | null | undefined;
343
+ theme?: "primary" | "secondary" | "destructive" | "warning" | "success" | "info" | "slate" | "inherit" | null | undefined;
344
344
  size?: "sm" | "md" | "lg" | null | undefined;
345
345
  orientation?: "horizontal" | "vertical" | null | undefined;
346
346
  stretch?: boolean | null | undefined;
@@ -363,7 +363,7 @@ interface StepProgressProps extends Omit<React.HTMLAttributes<HTMLOListElement>,
363
363
  declare const StepProgress: React.ForwardRefExoticComponent<StepProgressProps & React.RefAttributes<HTMLOListElement>>;
364
364
 
365
365
  declare const switchVariants: (props?: ({
366
- theme?: "inherit" | "primary" | "secondary" | "success" | "destructive" | "warning" | "info" | "slate" | null | undefined;
366
+ theme?: "primary" | "secondary" | "destructive" | "warning" | "success" | "info" | "slate" | "inherit" | null | undefined;
367
367
  size?: "sm" | "md" | "lg" | null | undefined;
368
368
  } & class_variance_authority_types.ClassProp) | undefined) => string;
369
369
 
@@ -456,9 +456,9 @@ interface TableToolbarProps extends Omit<React.HTMLAttributes<HTMLDivElement>, '
456
456
  declare const TableToolbar: React.ForwardRefExoticComponent<TableToolbarProps & React.RefAttributes<HTMLDivElement>>;
457
457
 
458
458
  declare const toggleVariants: (props?: ({
459
- variant?: "outlined" | "contained" | "ghost" | null | undefined;
460
- theme?: "inherit" | "primary" | "secondary" | "success" | "destructive" | "warning" | "info" | "slate" | null | undefined;
461
- size?: "sm" | "md" | "lg" | "xs" | null | undefined;
459
+ variant?: "contained" | "outlined" | "ghost" | null | undefined;
460
+ theme?: "primary" | "secondary" | "destructive" | "warning" | "success" | "info" | "slate" | "inherit" | null | undefined;
461
+ size?: "xs" | "sm" | "md" | "lg" | null | undefined;
462
462
  iconOnly?: boolean | null | undefined;
463
463
  rounded?: boolean | "extra" | null | undefined;
464
464
  } & class_variance_authority_types.ClassProp) | undefined) => string;
package/dist/index.d.ts CHANGED
@@ -1,10 +1,10 @@
1
1
  export { Logo, LogoProps } from './brand.js';
2
- export { C as Checkbox, a as CheckboxProps, D as DatePicker, b as DatePickerProps, F as FormTheme, L as Label, c as LabelProps, S as Select, d as SelectAlign, e as SelectContent, f as SelectContentProps, g as SelectField, h as SelectFieldProps, i as SelectGroup, j as SelectItem, k as SelectPosition, l as SelectProps, m as SelectSeparator, n as SelectSide, o as SelectTrigger, p as SelectValue } from './index-h4thndEb.js';
2
+ export { C as Checkbox, a as CheckboxProps, D as DatePicker, b as DatePickerProps, F as FormTheme, L as Label, c as LabelProps, S as Select, d as SelectAlign, e as SelectContent, f as SelectContentProps, g as SelectField, h as SelectFieldProps, i as SelectGroup, j as SelectItem, k as SelectPosition, l as SelectProps, m as SelectSeparator, n as SelectSide, o as SelectTrigger, p as SelectValue } from './index-6RTzMxvi.js';
3
3
  export { I as Input, a as InputBaseProps } from './input-CWHXOpeH.js';
4
- import { S as SidebarContextValue } from './index-BwTP9oMP.js';
5
- export { A as AppContent, a as AppFooter, b as AppFooterProps, c as AppShell, d as AppShellProps, e as AppSidebar, f as AppSidebarHeader, g as AppSidebarHeaderProps, h as AppSidebarProps, C as Collapse, i as CollapseProps, j as Column, k as ColumnProps, l as Container, m as ContainerProps, G as Grid, n as GridColumns, o as GridProps, R as Row, p as Sidebar, q as SidebarContent, r as SidebarFooter, s as SidebarGroup, t as SidebarGroupAction, u as SidebarGroupContent, v as SidebarGroupLabel, w as SidebarHeader, x as SidebarInput, y as SidebarInset, z as SidebarMenu, B as SidebarMenuAction, D as SidebarMenuBadge, E as SidebarMenuButton, F as SidebarMenuItem, H as SidebarMenuSkeleton, I as SidebarMenuSub, J as SidebarMenuSubButton, K as SidebarMenuSubItem, L as SidebarProvider, M as SidebarRail, N as SidebarTrigger, O as SidebarVariant, P as Skeleton } from './index-BwTP9oMP.js';
6
- import { A as AlertContextValue, S as SortState } from './index-DCtv8Gm1.js';
7
- export { a as Alert, b as AlertBanner, c as AlertBannerProps, d as AlertDescription, e as AlertMessage, f as AlertProps, g as AlertProvider, h as AlertTheme, i as AlertTitle, j as Avatar, k as AvatarFallback, l as AvatarFallbackProps, m as AvatarImage, n as AvatarImageProps, o as AvatarProps, C as Chip, p as ChipProps, q as CodeBlock, r as CodeBlockProps, D as DevIndicator, s as DevIndicatorProps, t as Dialog, u as DialogClose, v as DialogCloseProps, w as DialogContent, x as DialogContentProps, y as DialogDescription, z as DialogFooter, B as DialogHeader, E as DialogOverlay, F as DialogPortal, G as DialogProps, H as DialogTitle, I as DialogTrigger, J as DialogTriggerProps, K as EmptyState, L as EmptyStateProps, M as Icon, N as IconProps, O as List, P as ListItem, Q as ListItemProps, R as ListProps, T as Pagination, U as PaginationProps, V as ProgressBar, W as ProgressBarProps, X as PushAlertInput, Y as Separator, Z as SeparatorProps, _ as SortContextValue, $ as SortDirection, a0 as StatCard, a1 as StatCardDirection, a2 as StatCardProps, a3 as StatCardSize, a4 as StatCardTheme, a5 as StatCardVariant, a6 as StatusDot, a7 as StatusDotProps, a8 as Step, a9 as StepProgress, aa as StepProgressProps, ab as Switch, ac as SwitchProps, ad as Table, ae as TableActionCell, af as TableActionCellProps, ag as TableActionItem, ah as TableBody, ai as TableBodyProps, aj as TableCard, ak as TableCell, al as TableFooter, am as TableHead, an as TableHeader, ao as TableRow, ap as TableSortableHeader, aq as TableSortableHeaderProps, ar as TableToolbar, as as TableToolbarProps, at as Toggle, au as ToggleGroup, av as ToggleGroupProps, aw as ToggleProps, ax as TrendDirection, ay as persistAlert, az as statusDotVariants } from './index-DCtv8Gm1.js';
4
+ import { S as SidebarContextValue } from './index-BLcVtjt9.js';
5
+ export { A as AppContent, a as AppFooter, b as AppFooterProps, c as AppShell, d as AppShellProps, e as AppSidebar, f as AppSidebarHeader, g as AppSidebarHeaderProps, h as AppSidebarProps, C as Collapse, i as CollapseProps, j as Column, k as ColumnProps, l as Container, m as ContainerProps, G as Grid, n as GridColumns, o as GridProps, R as Row, p as Sidebar, q as SidebarContent, r as SidebarFooter, s as SidebarGroup, t as SidebarGroupAction, u as SidebarGroupContent, v as SidebarGroupLabel, w as SidebarHeader, x as SidebarInput, y as SidebarInset, z as SidebarMenu, B as SidebarMenuAction, D as SidebarMenuBadge, E as SidebarMenuButton, F as SidebarMenuItem, H as SidebarMenuSkeleton, I as SidebarMenuSub, J as SidebarMenuSubButton, K as SidebarMenuSubItem, L as SidebarProvider, M as SidebarRail, N as SidebarTrigger, O as SidebarVariant, P as Skeleton } from './index-BLcVtjt9.js';
6
+ import { A as AlertContextValue, S as SortState } from './index-CSnovrxl.js';
7
+ export { a as Alert, b as AlertBanner, c as AlertBannerProps, d as AlertDescription, e as AlertMessage, f as AlertProps, g as AlertProvider, h as AlertTheme, i as AlertTitle, j as Avatar, k as AvatarFallback, l as AvatarFallbackProps, m as AvatarImage, n as AvatarImageProps, o as AvatarProps, C as Chip, p as ChipProps, q as CodeBlock, r as CodeBlockProps, D as DevIndicator, s as DevIndicatorProps, t as Dialog, u as DialogClose, v as DialogCloseProps, w as DialogContent, x as DialogContentProps, y as DialogDescription, z as DialogFooter, B as DialogHeader, E as DialogOverlay, F as DialogPortal, G as DialogProps, H as DialogTitle, I as DialogTrigger, J as DialogTriggerProps, K as EmptyState, L as EmptyStateProps, M as Icon, N as IconProps, O as List, P as ListItem, Q as ListItemProps, R as ListProps, T as Pagination, U as PaginationProps, V as ProgressBar, W as ProgressBarProps, X as PushAlertInput, Y as Separator, Z as SeparatorProps, _ as SortContextValue, $ as SortDirection, a0 as StatCard, a1 as StatCardDirection, a2 as StatCardProps, a3 as StatCardSize, a4 as StatCardTheme, a5 as StatCardVariant, a6 as StatusDot, a7 as StatusDotProps, a8 as Step, a9 as StepProgress, aa as StepProgressProps, ab as Switch, ac as SwitchProps, ad as Table, ae as TableActionCell, af as TableActionCellProps, ag as TableActionItem, ah as TableBody, ai as TableBodyProps, aj as TableCard, ak as TableCell, al as TableFooter, am as TableHead, an as TableHeader, ao as TableRow, ap as TableSortableHeader, aq as TableSortableHeaderProps, ar as TableToolbar, as as TableToolbarProps, at as Toggle, au as ToggleGroup, av as ToggleGroupProps, aw as ToggleProps, ax as TrendDirection, ay as persistAlert, az as statusDotVariants } from './index-CSnovrxl.js';
8
8
  export { R as RowProps } from './row-CS9-talZ.js';
9
9
  export { Breadcrumbs, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuContentProps, DropdownMenuGroup, DropdownMenuItem, DropdownMenuItemProps, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuProps, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, DropdownMenuTriggerProps, Link, LinkProps, RouterAdapter, RouterProvider, Sheet, SheetBody, SheetClose, SheetCloseProps, SheetContent, SheetContentProps, SheetDescription, SheetFooter, SheetHeader, SheetProps, SheetTitle, SheetTrigger, SheetTriggerProps, useRouterAdapter } from './navigation.js';
10
10
  export { B as BreadcrumbItemData, N as NavGroup, a as NavItem, b as NavUser, c as NavUserProps, S as SidebarNavItem, d as SidebarSection } from './nav-user-CJIcWKyY.js';
@@ -12,7 +12,7 @@ export { AppearanceTabs, AppearanceToggleDropdown } from './settings.js';
12
12
  export { a as User, b as UserMenuContent, U as UserMenuContentProps, c as UserMenuItem } from './user-menu-content-D0Ldzigm.js';
13
13
  export { Heading, TruncatedText, TruncatedTextProps } from './typography.js';
14
14
  export { T as Typography, a as TypographyAlign, b as TypographyProps, c as TypographyTheme, d as TypographyTransform, e as TypographyVariant, f as TypographyWeight } from './typography-DOZHFR5A.js';
15
- export { B as Button, a as ButtonProps, T as Tooltip, b as TooltipContent, c as TooltipContentProps, d as TooltipProps, e as TooltipProvider, f as TooltipTrigger, g as TooltipTriggerProps } from './tooltip-C25-bG7o.js';
15
+ export { B as Button, a as ButtonProps, T as Tooltip, b as TooltipContent, c as TooltipContentProps, d as TooltipProps, e as TooltipProvider, f as TooltipTrigger, g as TooltipTriggerProps } from './tooltip-Bb0qqHZI.js';
16
16
  export { UserInfo } from './user.js';
17
17
  export { getCsrfToken } from './utils.js';
18
18
  import 'react';
@@ -1,8 +1,24 @@
1
1
  import * as React from 'react';
2
2
  export interface CollapseProps extends React.HTMLAttributes<HTMLDivElement> {
3
3
  open: boolean;
4
+ /** Transition length in ms. Also how long the unmount is deferred. */
4
5
  duration?: number;
6
+ /**
7
+ * Unmount children once the close animation finishes. Keeps focus traps,
8
+ * `autoFocus` and dismiss handlers out of the tree while the panel is shut.
9
+ * Set `false` to keep children mounted — cheaper for a panel toggled often,
10
+ * and required if they hold state you need to survive a close.
11
+ */
12
+ unmountOnClose?: boolean;
5
13
  }
14
+ /**
15
+ * A panel that animates its own height, so content below slides rather than
16
+ * jumping.
17
+ *
18
+ * Uses `grid-template-rows: 0fr → 1fr` rather than animating `max-height`: it
19
+ * interpolates to the panel's real height, so there is no magic number to
20
+ * guess and no pause at the end when the guess was too generous.
21
+ */
6
22
  declare const Collapse: React.ForwardRefExoticComponent<CollapseProps & React.RefAttributes<HTMLDivElement>>;
7
23
  export { Collapse };
8
24
  //# sourceMappingURL=collapse.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"collapse.d.ts","sourceRoot":"","sources":["../../../src/layout/Collapse/collapse.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,MAAM,WAAW,aAAc,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACzE,IAAI,EAAE,OAAO,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,QAAA,MAAM,QAAQ,sFAmBb,CAAC;AAGF,OAAO,EAAE,QAAQ,EAAE,CAAC"}
1
+ {"version":3,"file":"collapse.d.ts","sourceRoot":"","sources":["../../../src/layout/Collapse/collapse.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,MAAM,WAAW,aAAc,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACzE,IAAI,EAAE,OAAO,CAAC;IACd,sEAAsE;IACtE,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;;;OAKG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAID;;;;;;;GAOG;AACH,QAAA,MAAM,QAAQ,sFA2Db,CAAC;AAGF,OAAO,EAAE,QAAQ,EAAE,CAAC"}
@@ -3,10 +3,56 @@ import cn from 'clsx';
3
3
  import * as React from 'react';
4
4
  import s from './collapse.module.scss.js';
5
5
 
6
- const Collapse = React.forwardRef(({ open, duration, className, children, style, ...props }, ref) => {
7
- return (jsx("div", { ref: ref, "data-slot": 'collapse', className: cn(s['collapse'], open && s['collapse--open'], className), style: duration
6
+ const DEFAULT_DURATION = 300;
7
+ /**
8
+ * A panel that animates its own height, so content below slides rather than
9
+ * jumping.
10
+ *
11
+ * Uses `grid-template-rows: 0fr → 1fr` rather than animating `max-height`: it
12
+ * interpolates to the panel's real height, so there is no magic number to
13
+ * guess and no pause at the end when the guess was too generous.
14
+ */
15
+ const Collapse = React.forwardRef(({ open, duration, unmountOnClose = false, className, children, style, ...props }, ref) => {
16
+ const ms = duration ?? DEFAULT_DURATION;
17
+ const [mounted, setMounted] = React.useState(open);
18
+ const [expanded, setExpanded] = React.useState(open);
19
+ const frame = React.useRef(0);
20
+ const timer = React.useRef(undefined);
21
+ /*
22
+ * Hold the last real children so the panel has something to shrink.
23
+ * Callers routinely clear the state that fed the panel the moment they
24
+ * close it, which empties the box instantly and leaves nothing to animate
25
+ * — the open looks smooth and the close looks like a cut.
26
+ */
27
+ const lastChildren = React.useRef(children);
28
+ if (children != null && children !== false)
29
+ lastChildren.current = children;
30
+ const rendered = open ? children : lastChildren.current;
31
+ React.useEffect(() => {
32
+ cancelAnimationFrame(frame.current);
33
+ clearTimeout(timer.current);
34
+ if (open) {
35
+ setMounted(true);
36
+ // Two frames: one to put 0fr on screen, one to transition away from it.
37
+ // A single frame can be batched with the mount and the panel snaps open.
38
+ frame.current = requestAnimationFrame(() => {
39
+ frame.current = requestAnimationFrame(() => setExpanded(true));
40
+ });
41
+ }
42
+ else {
43
+ setExpanded(false);
44
+ if (unmountOnClose) {
45
+ timer.current = setTimeout(() => setMounted(false), ms);
46
+ }
47
+ }
48
+ return () => {
49
+ cancelAnimationFrame(frame.current);
50
+ clearTimeout(timer.current);
51
+ };
52
+ }, [open, unmountOnClose, ms]);
53
+ return (jsx("div", { ref: ref, "data-slot": 'collapse', className: cn(s['collapse'], expanded && s['collapse--open'], className), style: duration
8
54
  ? { ...style, '--collapse-duration': `${duration}ms` }
9
- : style, "aria-hidden": !open, ...props, children: jsx("div", { className: s['collapse-inner'], children: children }) }));
55
+ : style, "aria-hidden": !open, ...props, children: jsx("div", { className: s['collapse-inner'], children: mounted ? rendered : null }) }));
10
56
  });
11
57
  Collapse.displayName = 'Collapse';
12
58
 
@@ -1 +1 @@
1
- {"version":3,"file":"collapse.js","sources":["../../../src/layout/Collapse/collapse.tsx"],"sourcesContent":["import cn from 'clsx';\nimport * as React from 'react';\nimport s from './collapse.module.scss';\n\nexport interface CollapseProps extends React.HTMLAttributes<HTMLDivElement> {\n open: boolean;\n duration?: number;\n}\n\nconst Collapse = React.forwardRef<HTMLDivElement, CollapseProps>(\n ({ open, duration, className, children, style, ...props }, ref) => {\n return (\n <div\n ref={ref}\n data-slot={'collapse'}\n className={cn(s['collapse'], open && s['collapse--open'], className)}\n style={\n duration\n ? ({ ...style, '--collapse-duration': `${duration}ms` } as React.CSSProperties)\n : style\n }\n aria-hidden={!open}\n {...props}\n >\n <div className={s['collapse-inner']}>{children}</div>\n </div>\n );\n },\n);\nCollapse.displayName = 'Collapse';\n\nexport { Collapse };\n"],"names":["_jsx"],"mappings":";;;;;AASA,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CAC/B,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAI;AAChE,IAAA,QACEA,GAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,GAAG,EAAA,WAAA,EACG,UAAU,EACrB,SAAS,EAAE,EAAE,CAAC,CAAC,CAAC,UAAU,CAAC,EAAE,IAAI,IAAI,CAAC,CAAC,gBAAgB,CAAC,EAAE,SAAS,CAAC,EACpE,KAAK,EACH;cACK,EAAE,GAAG,KAAK,EAAE,qBAAqB,EAAE,CAAA,EAAG,QAAQ,CAAA,EAAA,CAAI;cACnD,KAAK,EAAA,aAAA,EAEE,CAAC,IAAI,EAAA,GACd,KAAK,YAETA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,gBAAgB,CAAC,EAAA,QAAA,EAAG,QAAQ,EAAA,CAAO,EAAA,CACjD;AAEV,CAAC;AAEH,QAAQ,CAAC,WAAW,GAAG,UAAU;;"}
1
+ {"version":3,"file":"collapse.js","sources":["../../../src/layout/Collapse/collapse.tsx"],"sourcesContent":["import cn from 'clsx';\nimport * as React from 'react';\nimport s from './collapse.module.scss';\n\nexport interface CollapseProps extends React.HTMLAttributes<HTMLDivElement> {\n open: boolean;\n /** Transition length in ms. Also how long the unmount is deferred. */\n duration?: number;\n /**\n * Unmount children once the close animation finishes. Keeps focus traps,\n * `autoFocus` and dismiss handlers out of the tree while the panel is shut.\n * Set `false` to keep children mounted — cheaper for a panel toggled often,\n * and required if they hold state you need to survive a close.\n */\n unmountOnClose?: boolean;\n}\n\nconst DEFAULT_DURATION = 300;\n\n/**\n * A panel that animates its own height, so content below slides rather than\n * jumping.\n *\n * Uses `grid-template-rows: 0fr → 1fr` rather than animating `max-height`: it\n * interpolates to the panel's real height, so there is no magic number to\n * guess and no pause at the end when the guess was too generous.\n */\nconst Collapse = React.forwardRef<HTMLDivElement, CollapseProps>(\n ({ open, duration, unmountOnClose = false, className, children, style, ...props }, ref) => {\n const ms = duration ?? DEFAULT_DURATION;\n const [mounted, setMounted] = React.useState(open);\n const [expanded, setExpanded] = React.useState(open);\n const frame = React.useRef(0);\n const timer = React.useRef<ReturnType<typeof setTimeout>>(undefined);\n\n /*\n * Hold the last real children so the panel has something to shrink.\n * Callers routinely clear the state that fed the panel the moment they\n * close it, which empties the box instantly and leaves nothing to animate\n * — the open looks smooth and the close looks like a cut.\n */\n const lastChildren = React.useRef(children);\n if (children != null && children !== false) lastChildren.current = children;\n const rendered = open ? children : lastChildren.current;\n\n React.useEffect(() => {\n cancelAnimationFrame(frame.current);\n clearTimeout(timer.current);\n\n if (open) {\n setMounted(true);\n // Two frames: one to put 0fr on screen, one to transition away from it.\n // A single frame can be batched with the mount and the panel snaps open.\n frame.current = requestAnimationFrame(() => {\n frame.current = requestAnimationFrame(() => setExpanded(true));\n });\n } else {\n setExpanded(false);\n if (unmountOnClose) {\n timer.current = setTimeout(() => setMounted(false), ms);\n }\n }\n\n return () => {\n cancelAnimationFrame(frame.current);\n clearTimeout(timer.current);\n };\n }, [open, unmountOnClose, ms]);\n\n return (\n <div\n ref={ref}\n data-slot={'collapse'}\n className={cn(s['collapse'], expanded && s['collapse--open'], className)}\n style={\n duration\n ? ({ ...style, '--collapse-duration': `${duration}ms` } as React.CSSProperties)\n : style\n }\n aria-hidden={!open}\n {...props}\n >\n <div className={s['collapse-inner']}>{mounted ? rendered : null}</div>\n </div>\n );\n },\n);\nCollapse.displayName = 'Collapse';\n\nexport { Collapse };\n"],"names":["_jsx"],"mappings":";;;;;AAiBA,MAAM,gBAAgB,GAAG,GAAG;AAE5B;;;;;;;AAOG;AACH,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CAC/B,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,cAAc,GAAG,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAI;AACxF,IAAA,MAAM,EAAE,GAAG,QAAQ,IAAI,gBAAgB;AACvC,IAAA,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC;AAClD,IAAA,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC;IACpD,MAAM,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;IAC7B,MAAM,KAAK,GAAG,KAAK,CAAC,MAAM,CAAgC,SAAS,CAAC;AAEpE;;;;;AAKG;IACH,MAAM,YAAY,GAAG,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC;AAC3C,IAAA,IAAI,QAAQ,IAAI,IAAI,IAAI,QAAQ,KAAK,KAAK;AAAE,QAAA,YAAY,CAAC,OAAO,GAAG,QAAQ;AAC3E,IAAA,MAAM,QAAQ,GAAG,IAAI,GAAG,QAAQ,GAAG,YAAY,CAAC,OAAO;AAEvD,IAAA,KAAK,CAAC,SAAS,CAAC,MAAK;AACnB,QAAA,oBAAoB,CAAC,KAAK,CAAC,OAAO,CAAC;AACnC,QAAA,YAAY,CAAC,KAAK,CAAC,OAAO,CAAC;QAE3B,IAAI,IAAI,EAAE;YACR,UAAU,CAAC,IAAI,CAAC;;;AAGhB,YAAA,KAAK,CAAC,OAAO,GAAG,qBAAqB,CAAC,MAAK;AACzC,gBAAA,KAAK,CAAC,OAAO,GAAG,qBAAqB,CAAC,MAAM,WAAW,CAAC,IAAI,CAAC,CAAC;AAChE,YAAA,CAAC,CAAC;QACJ;aAAO;YACL,WAAW,CAAC,KAAK,CAAC;YAClB,IAAI,cAAc,EAAE;AAClB,gBAAA,KAAK,CAAC,OAAO,GAAG,UAAU,CAAC,MAAM,UAAU,CAAC,KAAK,CAAC,EAAE,EAAE,CAAC;YACzD;QACF;AAEA,QAAA,OAAO,MAAK;AACV,YAAA,oBAAoB,CAAC,KAAK,CAAC,OAAO,CAAC;AACnC,YAAA,YAAY,CAAC,KAAK,CAAC,OAAO,CAAC;AAC7B,QAAA,CAAC;IACH,CAAC,EAAE,CAAC,IAAI,EAAE,cAAc,EAAE,EAAE,CAAC,CAAC;AAE9B,IAAA,QACEA,GAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,GAAG,EAAA,WAAA,EACG,UAAU,EACrB,SAAS,EAAE,EAAE,CAAC,CAAC,CAAC,UAAU,CAAC,EAAE,QAAQ,IAAI,CAAC,CAAC,gBAAgB,CAAC,EAAE,SAAS,CAAC,EACxE,KAAK,EACH;cACK,EAAE,GAAG,KAAK,EAAE,qBAAqB,EAAE,CAAA,EAAG,QAAQ,CAAA,EAAA,CAAI;AACrD,cAAE,KAAK,EAAA,aAAA,EAEE,CAAC,IAAI,EAAA,GACd,KAAK,EAAA,QAAA,EAETA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,gBAAgB,CAAC,EAAA,QAAA,EAAG,OAAO,GAAG,QAAQ,GAAG,IAAI,EAAA,CAAO,EAAA,CAClE;AAEV,CAAC;AAEH,QAAQ,CAAC,WAAW,GAAG,UAAU;;"}
package/dist/layout.d.ts CHANGED
@@ -1,10 +1,10 @@
1
- export { A as AppContent, a as AppFooter, b as AppFooterProps, c as AppShell, d as AppShellProps, e as AppSidebar, f as AppSidebarHeader, g as AppSidebarHeaderProps, h as AppSidebarProps, C as Collapse, i as CollapseProps, j as Column, k as ColumnProps, l as Container, G as Grid, R as Row, p as Sidebar, q as SidebarContent, r as SidebarFooter, s as SidebarGroup, t as SidebarGroupAction, u as SidebarGroupContent, v as SidebarGroupLabel, w as SidebarHeader, x as SidebarInput, y as SidebarInset, z as SidebarMenu, B as SidebarMenuAction, D as SidebarMenuBadge, E as SidebarMenuButton, F as SidebarMenuItem, H as SidebarMenuSkeleton, I as SidebarMenuSub, J as SidebarMenuSubButton, K as SidebarMenuSubItem, L as SidebarProvider, M as SidebarRail, N as SidebarTrigger, P as Skeleton } from './index-BwTP9oMP.js';
1
+ export { A as AppContent, a as AppFooter, b as AppFooterProps, c as AppShell, d as AppShellProps, e as AppSidebar, f as AppSidebarHeader, g as AppSidebarHeaderProps, h as AppSidebarProps, C as Collapse, i as CollapseProps, j as Column, k as ColumnProps, l as Container, G as Grid, R as Row, p as Sidebar, q as SidebarContent, r as SidebarFooter, s as SidebarGroup, t as SidebarGroupAction, u as SidebarGroupContent, v as SidebarGroupLabel, w as SidebarHeader, x as SidebarInput, y as SidebarInset, z as SidebarMenu, B as SidebarMenuAction, D as SidebarMenuBadge, E as SidebarMenuButton, F as SidebarMenuItem, H as SidebarMenuSkeleton, I as SidebarMenuSub, J as SidebarMenuSubButton, K as SidebarMenuSubItem, L as SidebarProvider, M as SidebarRail, N as SidebarTrigger, P as Skeleton } from './index-BLcVtjt9.js';
2
2
  export { R as RowProps } from './row-CS9-talZ.js';
3
3
  import 'react';
4
4
  import './nav-user-CJIcWKyY.js';
5
5
  import 'lucide-react';
6
6
  import './user-menu-content-D0Ldzigm.js';
7
7
  import './input-CWHXOpeH.js';
8
- import './tooltip-C25-bG7o.js';
8
+ import './tooltip-Bb0qqHZI.js';
9
9
  import 'class-variance-authority';
10
10
  import 'class-variance-authority/types';
@@ -62,7 +62,7 @@ declare function DropdownMenuSubContent({ className, ...props }: React.HTMLAttri
62
62
  declare const linkVariants: (props?: ({
63
63
  underline?: boolean | null | undefined;
64
64
  hover?: "default" | "none" | null | undefined;
65
- theme?: "inherit" | "primary" | "secondary" | "success" | "destructive" | "warning" | "info" | "slate" | null | undefined;
65
+ theme?: "primary" | "secondary" | "destructive" | "warning" | "success" | "info" | "slate" | "inherit" | null | undefined;
66
66
  } & class_variance_authority_types.ClassProp) | undefined) => string;
67
67
 
68
68
  interface LinkProps extends Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'onClick'>, VariantProps<typeof linkVariants> {
@@ -3,9 +3,9 @@ import * as React from 'react';
3
3
  import * as class_variance_authority_types from 'class-variance-authority/types';
4
4
 
5
5
  declare const buttonVariants: (props?: ({
6
- variant?: "outlined" | "contained" | "ghost" | null | undefined;
7
- theme?: "inherit" | "primary" | "secondary" | "success" | "destructive" | "warning" | "info" | "slate" | null | undefined;
8
- size?: "sm" | "md" | "lg" | "xs" | null | undefined;
6
+ variant?: "contained" | "outlined" | "ghost" | null | undefined;
7
+ theme?: "primary" | "secondary" | "destructive" | "warning" | "success" | "info" | "slate" | "inherit" | null | undefined;
8
+ size?: "xs" | "sm" | "md" | "lg" | null | undefined;
9
9
  iconOnly?: boolean | null | undefined;
10
10
  rounded?: boolean | "extra" | null | undefined;
11
11
  } & class_variance_authority_types.ClassProp) | undefined) => string;
package/dist/ui.d.ts CHANGED
@@ -1,5 +1,5 @@
1
- export { a as Alert, b as AlertBanner, c as AlertBannerProps, d as AlertDescription, f as AlertProps, g as AlertProvider, i as AlertTitle, j as Avatar, k as AvatarFallback, l as AvatarFallbackProps, m as AvatarImage, n as AvatarImageProps, o as AvatarProps, C as Chip, p as ChipProps, q as CodeBlock, r as CodeBlockProps, D as DevIndicator, s as DevIndicatorProps, t as Dialog, u as DialogClose, v as DialogCloseProps, w as DialogContent, x as DialogContentProps, y as DialogDescription, z as DialogFooter, B as DialogHeader, E as DialogOverlay, F as DialogPortal, G as DialogProps, H as DialogTitle, I as DialogTrigger, J as DialogTriggerProps, K as EmptyState, L as EmptyStateProps, M as Icon, N as IconProps, O as List, P as ListItem, Q as ListItemProps, R as ListProps, T as Pagination, V as ProgressBar, W as ProgressBarProps, Y as Separator, Z as SeparatorProps, a0 as StatCard, a1 as StatCardDirection, a2 as StatCardProps, a3 as StatCardSize, a4 as StatCardTheme, a5 as StatCardVariant, a6 as StatusDot, a7 as StatusDotProps, a8 as Step, a9 as StepProgress, aa as StepProgressProps, ab as Switch, ac as SwitchProps, ad as Table, ae as TableActionCell, af as TableActionCellProps, ag as TableActionItem, ah as TableBody, ai as TableBodyProps, aj as TableCard, ak as TableCell, al as TableFooter, am as TableHead, an as TableHeader, ao as TableRow, ap as TableSortableHeader, aq as TableSortableHeaderProps, ar as TableToolbar, as as TableToolbarProps, at as Toggle, au as ToggleGroup, av as ToggleGroupProps, aw as ToggleProps, ax as TrendDirection, ay as persistAlert, az as statusDotVariants } from './index-DCtv8Gm1.js';
2
- export { B as Button, a as ButtonProps, T as Tooltip, b as TooltipContent, c as TooltipContentProps, d as TooltipProps, e as TooltipProvider, f as TooltipTrigger, g as TooltipTriggerProps } from './tooltip-C25-bG7o.js';
1
+ export { a as Alert, b as AlertBanner, c as AlertBannerProps, d as AlertDescription, f as AlertProps, g as AlertProvider, i as AlertTitle, j as Avatar, k as AvatarFallback, l as AvatarFallbackProps, m as AvatarImage, n as AvatarImageProps, o as AvatarProps, C as Chip, p as ChipProps, q as CodeBlock, r as CodeBlockProps, D as DevIndicator, s as DevIndicatorProps, t as Dialog, u as DialogClose, v as DialogCloseProps, w as DialogContent, x as DialogContentProps, y as DialogDescription, z as DialogFooter, B as DialogHeader, E as DialogOverlay, F as DialogPortal, G as DialogProps, H as DialogTitle, I as DialogTrigger, J as DialogTriggerProps, K as EmptyState, L as EmptyStateProps, M as Icon, N as IconProps, O as List, P as ListItem, Q as ListItemProps, R as ListProps, T as Pagination, V as ProgressBar, W as ProgressBarProps, Y as Separator, Z as SeparatorProps, a0 as StatCard, a1 as StatCardDirection, a2 as StatCardProps, a3 as StatCardSize, a4 as StatCardTheme, a5 as StatCardVariant, a6 as StatusDot, a7 as StatusDotProps, a8 as Step, a9 as StepProgress, aa as StepProgressProps, ab as Switch, ac as SwitchProps, ad as Table, ae as TableActionCell, af as TableActionCellProps, ag as TableActionItem, ah as TableBody, ai as TableBodyProps, aj as TableCard, ak as TableCell, al as TableFooter, am as TableHead, an as TableHeader, ao as TableRow, ap as TableSortableHeader, aq as TableSortableHeaderProps, ar as TableToolbar, as as TableToolbarProps, at as Toggle, au as ToggleGroup, av as ToggleGroupProps, aw as ToggleProps, ax as TrendDirection, ay as persistAlert, az as statusDotVariants } from './index-CSnovrxl.js';
2
+ export { B as Button, a as ButtonProps, T as Tooltip, b as TooltipContent, c as TooltipContentProps, d as TooltipProps, e as TooltipProvider, f as TooltipTrigger, g as TooltipTriggerProps } from './tooltip-Bb0qqHZI.js';
3
3
  import 'class-variance-authority';
4
4
  import 'react';
5
5
  import 'class-variance-authority/types';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kismet-ux/constellation",
3
- "version": "1.3.0",
3
+ "version": "1.4.0",
4
4
  "type": "module",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",