@kismet-ux/constellation 1.12.0 → 1.13.0

package/dist/index.css

@@ -428,6 +428,36 @@ svg {
    */
   --size-0-5: 0.25rem;
   --size-1-5: 0.75rem;
+  /*
+   * ── Type steps ─────────────────────────────────────────────────────────
+   *
+   * The sizes `Typography` sets per variant, exposed so an app can align its
+   * OWN rules to the same scale instead of copying the numbers into a
+   * stylesheet where they immediately start to drift.
+   *
+   * A component should still reach for the variant — `<Typography
+   * variant={'caption'}>` says what the text IS, where a raw size only says
+   * how big. These are for the CSS an app cannot express as a component:
+   * a badge's label, a table cell, a chip's count.
+   *
+   * ⚠️ `caption` is the FLOOR, and deliberately: 12px is about as small as
+   * sustained UI text can be and still be read at arm's length on a phone.
+   * The scale does not offer anything below it, and an app that wants
+   * something smaller is telling you its density is wrong.
+   *
+   * Headings keep their responsive overrides in the component — those are a
+   * breakpoint's business rather than the scale's.
+   */
+  --font-size-caption: 0.75rem;
+  --font-size-body2: 0.875rem;
+  --font-size-body1: 1rem;
+  --font-size-subtitle1: 1.0625rem;
+  --font-size-h6: 1.35rem;
+  --font-size-h5: 1.5rem;
+  --font-size-h4: 1.65rem;
+  --font-size-h3: 1.85rem;
+  --font-size-h2: 2.25rem;
+  --font-size-h1: 2.75rem;
   /*
    * ── Measure ────────────────────────────────────────────────────────────
    *
@@ -705,6 +735,27 @@ main.no-padding {
   padding: 0;
 }
 
+/*
+ * ── Text and flex helpers ─────────────────────────────────────────────────
+ *
+ * The two that consumers kept writing for themselves. `--font-mono` is a token
+ * this library owns, so the utility that applies it belongs here rather than
+ * in every app that wants a figure to line up in a column; `Typography` still
+ * takes `mono` as a prop, and that is the better answer wherever the element
+ * is already a `Typography`. This is for the spans and cells that are not.
+ *
+ * `.grow` is `flex: 1` — the other half of `Column`'s `flex` prop, for a child
+ * that is not one of the layout primitives (a `Button` sharing a row, say).
+ */
+.mono {
+  font-family: var(--font-mono);
+  font-variant-numeric: tabular-nums;
+}
+
+.grow {
+  flex: 1;
+}
+
 .srOnly {
   border: 0;
   clip: rect(0, 0, 0, 0);
@@ -900,6 +951,43 @@ img {
   animation: pulse 1.5s ease-in-out infinite;
 }
 
+/*
+ * Two more of the arrive family, both lifted out of an app that had written
+ * them itself. They differ from `fade-in` only in axis and distance, which is
+ * the whole vocabulary: a row slides in from the lead edge, a flash drops in.
+ *
+ * ⚠️ Shorter than `fade-in` on purpose. These play on things that arrive in
+ * NUMBERS — a list re-ordering, a count changing — where 280ms each reads as
+ * the page lurching rather than as a row appearing.
+ */
+.row-in {
+  animation: row-in 180ms var(--easing-default) both;
+}
+
+@keyframes row-in {
+  from {
+    opacity: 0;
+    transform: translateX(-4px);
+  }
+  to {
+    opacity: 1;
+    transform: none;
+  }
+}
+.pulse-in {
+  animation: pulse-in 220ms var(--easing-default);
+}
+
+@keyframes pulse-in {
+  from {
+    opacity: 0;
+    transform: translateY(-3px);
+  }
+  to {
+    opacity: 1;
+    transform: none;
+  }
+}
 /**
  * Chrome has a bug with transitions on load since 2012!
  *

package/dist/index.d.ts

@@ -1,11 +1,11 @@
 export { Logo, LogoProps } from './brand.js';
-export { C as Checkbox, a as CheckboxProps, b as Combobox, c as ComboboxOption, d as ComboboxProps, D as DatePicker, e as DatePickerProps, F as FormTheme, L as Label, f as LabelProps, S as Select, g as SelectAlign, h as SelectContent, i as SelectContentProps, j as SelectField, k as SelectFieldProps, l as SelectGroup, m as SelectItem, n as SelectPosition, o as SelectProps, p as SelectSeparator, q as SelectSide, r as SelectTrigger, s as SelectValue, t as __Surface } from './index-CywSNvOU.js';
+export { C as Checkbox, a as CheckboxProps, b as Combobox, c as ComboboxOption, d as ComboboxProps, D as DatePicker, e as DatePickerProps, F as FormTheme, L as Label, f as LabelProps, S as Select, g as SelectAlign, h as SelectContent, i as SelectContentProps, j as SelectField, k as SelectFieldProps, l as SelectGroup, m as SelectItem, n as SelectPosition, o as SelectProps, p as SelectSeparator, q as SelectSide, r as SelectTrigger, s as SelectValue, t as __Surface } from './index-DhS2nQjt.js';
 export { I as Input, a as InputBaseProps } from './input-Cp5LET5i.js';
 import * as React from 'react';
-import { S as SidebarContextValue } from './index-DOKRFZ3I.js';
-export { A as AppContent, a as AppContentFooter, b as AppContentFooterProps, c as AppContentMain, d as AppContentMainProps, e as AppFooter, f as AppFooterProps, g as AppShell, h as AppShellProps, i as AppSidebar, j as AppSidebarHeader, k as AppSidebarHeaderProps, l as AppSidebarProps, C as Collapse, m as CollapseProps, n as Column, o as ColumnProps, p as Container, q as ContainerProps, G as Grid, r as GridColumns, s as GridProps, R as Row, t as Sidebar, u as SidebarContent, v as SidebarFooter, w as SidebarGroup, x as SidebarGroupAction, y as SidebarGroupContent, z as SidebarGroupLabel, B as SidebarHeader, D as SidebarInput, E as SidebarInset, F as SidebarMenu, H as SidebarMenuAction, I as SidebarMenuBadge, J as SidebarMenuButton, K as SidebarMenuItem, L as SidebarMenuSkeleton, M as SidebarMenuSub, N as SidebarMenuSubButton, O as SidebarMenuSubItem, P as SidebarProvider, Q as SidebarRail, T as SidebarTrigger, U as SidebarVariant, V as Skeleton } from './index-DOKRFZ3I.js';
-import { A as AlertContextValue, S as SortState } from './index-D81GIX01.js';
-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-D81GIX01.js';
+import { S as SidebarContextValue } from './index-DxbOGj5Y.js';
+export { A as AppContent, a as AppContentFooter, b as AppContentFooterProps, c as AppContentMain, d as AppContentMainProps, e as AppFooter, f as AppFooterProps, g as AppShell, h as AppShellProps, i as AppSidebar, j as AppSidebarHeader, k as AppSidebarHeaderProps, l as AppSidebarProps, C as Collapse, m as CollapseProps, n as Column, o as ColumnProps, p as Container, q as ContainerProps, G as Grid, r as GridColumns, s as GridProps, R as Row, t as Sidebar, u as SidebarContent, v as SidebarFooter, w as SidebarGroup, x as SidebarGroupAction, y as SidebarGroupContent, z as SidebarGroupLabel, B as SidebarHeader, D as SidebarInput, E as SidebarInset, F as SidebarMenu, H as SidebarMenuAction, I as SidebarMenuBadge, J as SidebarMenuButton, K as SidebarMenuItem, L as SidebarMenuSkeleton, M as SidebarMenuSub, N as SidebarMenuSubButton, O as SidebarMenuSubItem, P as SidebarProvider, Q as SidebarRail, T as SidebarTrigger, U as SidebarVariant, V as Skeleton } from './index-DxbOGj5Y.js';
+import { A as AlertContextValue, S as SortState } from './index-p7kVnzRy.js';
+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 ChipSelect, r as ChipSelectOption, s as ChipSelectProps, t as CodeBlock, u as CodeBlockProps, D as DevIndicator, v as DevIndicatorProps, w as Dialog, x as DialogClose, y as DialogCloseProps, z as DialogContent, B as DialogContentProps, E as DialogDescription, F as DialogFooter, G as DialogHeader, H as DialogOverlay, I as DialogPortal, J as DialogProps, K as DialogTitle, L as DialogTrigger, M as DialogTriggerProps, N as EmptyState, O as EmptyStateProps, P as Icon, Q as IconProps, R as List, T as ListItem, U as ListItemProps, V as ListProps, W as Pagination, X as PaginationProps, Y as ProgressBar, Z as ProgressBarProps, _ as PushAlertInput, $ as Separator, a0 as SeparatorProps, a1 as SortContextValue, a2 as SortDirection, a3 as StatCard, a4 as StatCardDirection, a5 as StatCardProps, a6 as StatCardSize, a7 as StatCardTheme, a8 as StatCardVariant, a9 as StatusDot, aa as StatusDotProps, ab as Step, ac as StepProgress, ad as StepProgressProps, ae as Switch, af as SwitchProps, ag as Table, ah as TableActionCell, ai as TableActionCellProps, aj as TableActionItem, ak as TableBody, al as TableBodyProps, am as TableCard, an as TableCell, ao as TableFooter, ap as TableHead, aq as TableHeader, ar as TableRow, as as TableSortableHeader, at as TableSortableHeaderProps, au as TableToolbar, av as TableToolbarProps, aw as Toggle, ax as ToggleGroup, ay as ToggleGroupProps, az as ToggleProps, aA as TrendDirection, aB as persistAlert, aC as statusDotVariants } from './index-p7kVnzRy.js';
 export { R as RowProps } from './row-CuhTBQhK.js';
 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';
 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-CilmWvtr.js';
@@ -13,7 +13,7 @@ export { AppearanceTabs, AppearanceToggleDropdown } from './settings.js';
 export { a as User, b as UserMenuContent, U as UserMenuContentProps, c as UserMenuItem } from './user-menu-content-D0Ldzigm.js';
 export { Heading, TruncatedText, TruncatedTextProps } from './typography.js';
 export { T as Typography, a as TypographyAlign, b as TypographyProps, c as TypographySize, d as TypographyTheme, e as TypographyTransform, f as TypographyVariant, g as TypographyWeight } from './typography-CTGVc_Gg.js';
-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-540OmbEG.js';
+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-DXoSckt9.js';
 export { UserInfo } from './user.js';
 export { CONSTELLATION_PORTAL_SELECTOR, getCsrfToken, isInConstellationPortal } from './utils.js';
 import 'class-variance-authority';

package/dist/index.js

@@ -46,6 +46,7 @@ export { AlertProvider } from './ui/Alert/alert-provider.js';
 export { Avatar, AvatarFallback, AvatarImage } from './ui/Avatar/avatar.js';
 export { Button } from './ui/Button/button.js';
 export { Chip } from './ui/Chip/chip.js';
+export { ChipSelect } from './ui/ChipSelect/chip-select.js';
 export { CodeBlock } from './ui/CodeBlock/code-block.js';
 export { DevIndicator } from './ui/DevIndicator/dev-indicator.js';
 export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger } from './ui/Dialog/dialog.js';

package/dist/index.js.map

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

package/dist/layout/AppSidebarHeader/app-sidebar-header.js

@@ -14,6 +14,7 @@ import '../../ui/Alert/alert.css';
 import '../../ui/Avatar/avatar.js';
 import '../../ui/Button/button.js';
 import '../../ui/Chip/chip.js';
+import '../../ui/ChipSelect/chip-select.js';
 import '../../ui/CodeBlock/code-block.js';
 import cn from 'clsx';
 import '../../ui/DevIndicator/dev-indicator.css';

package/dist/layout/AppSidebarHeader/app-sidebar-header.js.map

@@ -1 +1 @@
-{"version":3,"file":"app-sidebar-header.js","sources":["../../../src/layout/AppSidebarHeader/app-sidebar-header.tsx"],"sourcesContent":["import { useSidebar } from '@constellation/hooks';\nimport { Row } from '@constellation/layout/Row';\nimport { SidebarTrigger } from '@constellation/layout/Sidebar';\nimport { Breadcrumbs } from '@constellation/navigation/Breadcrumbs';\nimport { NavUser, type NavUserProps } from '@constellation/navigation/NavUser';\nimport { AppearanceToggleDropdown } from '@constellation/settings';\nimport { type BreadcrumbItemData } from '@constellation/types';\nimport cn from 'clsx';\nimport * as React from 'react';\nimport s from './app-sidebar-header.module.scss';\n\nexport interface AppSidebarHeaderProps extends React.HTMLAttributes<HTMLElement> {\n  breadcrumbs?: BreadcrumbItemData[];\n  /** Omit to hide the account menu (e.g. on signed-out chrome). */\n  user?: NavUserProps['user'];\n  userMenu?: Omit<NavUserProps, 'user'>;\n  /** Extra controls between the appearance toggle and the account menu. */\n  actions?: React.ReactNode;\n}\n\n/**\n * The header band of a content area.\n *\n * `className` and any other DOM props reach the `header` element. They used to\n * be dropped on the floor — the component took four named props and spread\n * nothing — so a caller passing `className` got no error and no class, and\n * spent the difference looking at its own stylesheet.\n */\nexport function AppSidebarHeader({\n  breadcrumbs = [],\n  user,\n  userMenu,\n  actions,\n  className,\n  ...props\n}: AppSidebarHeaderProps) {\n  const { state } = useSidebar();\n\n  return (\n    <Row\n      data-slot={'app-sidebar-header'}\n      el={'header'}\n      align={'center'}\n      gap={1}\n      justify={'space-between'}\n      className={cn(\n        s['app-sidebar-header'],\n        state === 'collapsed' && s['sidebar-header-collapsed'],\n        className,\n      )}\n      {...props}\n    >\n      <Row gap={1}>\n        <SidebarTrigger />\n        <Breadcrumbs breadcrumbs={breadcrumbs} />\n      </Row>\n      <Row gap={1} align={'center'}>\n        {actions}\n        <AppearanceToggleDropdown />\n        {user && <NavUser user={user} {...userMenu} />}\n      </Row>\n    </Row>\n  );\n}\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoBA;;;;;;;AAOG;SACa,gBAAgB,CAAC,EAC/B,WAAW,GAAG,EAAE,EAChB,IAAI,EACJ,QAAQ,EACR,OAAO,EACP,SAAS,EACT,GAAG,KAAK,EACc,EAAA;AACtB,IAAA,MAAM,EAAE,KAAK,EAAE,GAAG,UAAU,EAAE;IAE9B,QACEA,KAAC,GAAG,EAAA,EAAA,WAAA,EACS,oBAAoB,EAC/B,EAAE,EAAE,QAAQ,EACZ,KAAK,EAAE,QAAQ,EACf,GAAG,EAAE,CAAC,EACN,OAAO,EAAE,eAAe,EACxB,SAAS,EAAE,EAAE,CACX,CAAC,CAAC,oBAAoB,CAAC,EACvB,KAAK,KAAK,WAAW,IAAI,CAAC,CAAC,0BAA0B,CAAC,EACtD,SAAS,CACV,EAAA,GACG,KAAK,EAAA,QAAA,EAAA,CAETA,IAAA,CAAC,GAAG,EAAA,EAAC,GAAG,EAAE,CAAC,aACTC,GAAA,CAAC,cAAc,KAAG,EAClBA,GAAA,CAAC,WAAW,EAAA,EAAC,WAAW,EAAE,WAAW,EAAA,CAAI,IACrC,EACND,IAAA,CAAC,GAAG,EAAA,EAAC,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAA,QAAA,EAAA,CACzB,OAAO,EACRC,GAAA,CAAC,wBAAwB,EAAA,EAAA,CAAG,EAC3B,IAAI,IAAIA,GAAA,CAAC,OAAO,EAAA,EAAC,IAAI,EAAE,IAAI,EAAA,GAAM,QAAQ,EAAA,CAAI,CAAA,EAAA,CAC1C,CAAA,EAAA,CACF;AAEV;;"}
+{"version":3,"file":"app-sidebar-header.js","sources":["../../../src/layout/AppSidebarHeader/app-sidebar-header.tsx"],"sourcesContent":["import { useSidebar } from '@constellation/hooks';\nimport { Row } from '@constellation/layout/Row';\nimport { SidebarTrigger } from '@constellation/layout/Sidebar';\nimport { Breadcrumbs } from '@constellation/navigation/Breadcrumbs';\nimport { NavUser, type NavUserProps } from '@constellation/navigation/NavUser';\nimport { AppearanceToggleDropdown } from '@constellation/settings';\nimport { type BreadcrumbItemData } from '@constellation/types';\nimport cn from 'clsx';\nimport * as React from 'react';\nimport s from './app-sidebar-header.module.scss';\n\nexport interface AppSidebarHeaderProps extends React.HTMLAttributes<HTMLElement> {\n  breadcrumbs?: BreadcrumbItemData[];\n  /** Omit to hide the account menu (e.g. on signed-out chrome). */\n  user?: NavUserProps['user'];\n  userMenu?: Omit<NavUserProps, 'user'>;\n  /** Extra controls between the appearance toggle and the account menu. */\n  actions?: React.ReactNode;\n}\n\n/**\n * The header band of a content area.\n *\n * `className` and any other DOM props reach the `header` element. They used to\n * be dropped on the floor — the component took four named props and spread\n * nothing — so a caller passing `className` got no error and no class, and\n * spent the difference looking at its own stylesheet.\n */\nexport function AppSidebarHeader({\n  breadcrumbs = [],\n  user,\n  userMenu,\n  actions,\n  className,\n  ...props\n}: AppSidebarHeaderProps) {\n  const { state } = useSidebar();\n\n  return (\n    <Row\n      data-slot={'app-sidebar-header'}\n      el={'header'}\n      align={'center'}\n      gap={1}\n      justify={'space-between'}\n      className={cn(\n        s['app-sidebar-header'],\n        state === 'collapsed' && s['sidebar-header-collapsed'],\n        className,\n      )}\n      {...props}\n    >\n      <Row gap={1}>\n        <SidebarTrigger />\n        <Breadcrumbs breadcrumbs={breadcrumbs} />\n      </Row>\n      <Row gap={1} align={'center'}>\n        {actions}\n        <AppearanceToggleDropdown />\n        {user && <NavUser user={user} {...userMenu} />}\n      </Row>\n    </Row>\n  );\n}\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoBA;;;;;;;AAOG;SACa,gBAAgB,CAAC,EAC/B,WAAW,GAAG,EAAE,EAChB,IAAI,EACJ,QAAQ,EACR,OAAO,EACP,SAAS,EACT,GAAG,KAAK,EACc,EAAA;AACtB,IAAA,MAAM,EAAE,KAAK,EAAE,GAAG,UAAU,EAAE;IAE9B,QACEA,KAAC,GAAG,EAAA,EAAA,WAAA,EACS,oBAAoB,EAC/B,EAAE,EAAE,QAAQ,EACZ,KAAK,EAAE,QAAQ,EACf,GAAG,EAAE,CAAC,EACN,OAAO,EAAE,eAAe,EACxB,SAAS,EAAE,EAAE,CACX,CAAC,CAAC,oBAAoB,CAAC,EACvB,KAAK,KAAK,WAAW,IAAI,CAAC,CAAC,0BAA0B,CAAC,EACtD,SAAS,CACV,EAAA,GACG,KAAK,EAAA,QAAA,EAAA,CAETA,IAAA,CAAC,GAAG,EAAA,EAAC,GAAG,EAAE,CAAC,aACTC,GAAA,CAAC,cAAc,KAAG,EAClBA,GAAA,CAAC,WAAW,EAAA,EAAC,WAAW,EAAE,WAAW,EAAA,CAAI,IACrC,EACND,IAAA,CAAC,GAAG,EAAA,EAAC,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAA,QAAA,EAAA,CACzB,OAAO,EACRC,GAAA,CAAC,wBAAwB,EAAA,EAAA,CAAG,EAC3B,IAAI,IAAIA,GAAA,CAAC,OAAO,EAAA,EAAC,IAAI,EAAE,IAAI,EAAA,GAAM,QAAQ,EAAA,CAAI,CAAA,EAAA,CAC1C,CAAA,EAAA,CACF;AAEV;;"}

package/dist/layout.d.ts

@@ -1,10 +1,10 @@
-export { A as AppContent, a as AppContentFooter, b as AppContentFooterProps, c as AppContentMain, d as AppContentMainProps, e as AppFooter, f as AppFooterProps, g as AppShell, h as AppShellProps, i as AppSidebar, j as AppSidebarHeader, k as AppSidebarHeaderProps, l as AppSidebarProps, C as Collapse, m as CollapseProps, n as Column, o as ColumnProps, p as Container, G as Grid, R as Row, t as Sidebar, u as SidebarContent, v as SidebarFooter, w as SidebarGroup, x as SidebarGroupAction, y as SidebarGroupContent, z as SidebarGroupLabel, B as SidebarHeader, D as SidebarInput, E as SidebarInset, F as SidebarMenu, H as SidebarMenuAction, I as SidebarMenuBadge, J as SidebarMenuButton, K as SidebarMenuItem, L as SidebarMenuSkeleton, M as SidebarMenuSub, N as SidebarMenuSubButton, O as SidebarMenuSubItem, P as SidebarProvider, Q as SidebarRail, T as SidebarTrigger, V as Skeleton } from './index-DOKRFZ3I.js';
+export { A as AppContent, a as AppContentFooter, b as AppContentFooterProps, c as AppContentMain, d as AppContentMainProps, e as AppFooter, f as AppFooterProps, g as AppShell, h as AppShellProps, i as AppSidebar, j as AppSidebarHeader, k as AppSidebarHeaderProps, l as AppSidebarProps, C as Collapse, m as CollapseProps, n as Column, o as ColumnProps, p as Container, G as Grid, R as Row, t as Sidebar, u as SidebarContent, v as SidebarFooter, w as SidebarGroup, x as SidebarGroupAction, y as SidebarGroupContent, z as SidebarGroupLabel, B as SidebarHeader, D as SidebarInput, E as SidebarInset, F as SidebarMenu, H as SidebarMenuAction, I as SidebarMenuBadge, J as SidebarMenuButton, K as SidebarMenuItem, L as SidebarMenuSkeleton, M as SidebarMenuSub, N as SidebarMenuSubButton, O as SidebarMenuSubItem, P as SidebarProvider, Q as SidebarRail, T as SidebarTrigger, V as Skeleton } from './index-DxbOGj5Y.js';
 export { R as RowProps } from './row-CuhTBQhK.js';
 import 'react';
 import './nav-user-CilmWvtr.js';
 import 'lucide-react';
 import './user-menu-content-D0Ldzigm.js';
 import './input-Cp5LET5i.js';
-import './tooltip-540OmbEG.js';
+import './tooltip-DXoSckt9.js';
 import 'class-variance-authority';
 import 'class-variance-authority/types';

package/dist/navigation/Sheet/sheet.js

@@ -7,6 +7,7 @@ import '../../ui/Alert/alert.css';
 import '../../ui/Avatar/avatar.js';
 import { Button } from '../../ui/Button/button.js';
 import '../../ui/Chip/chip.js';
+import '../../ui/ChipSelect/chip-select.js';
 import '../../ui/CodeBlock/code-block.js';
 import cn from 'clsx';
 import '../../ui/DevIndicator/dev-indicator.css';

package/dist/navigation/Sheet/sheet.js.map

@@ -1 +1 @@
-{"version":3,"file":"sheet.js","sources":["../../../src/navigation/Sheet/sheet.tsx"],"sourcesContent":["import { Button } from '@constellation/ui';\nimport cn from 'clsx';\nimport { XIcon } from 'lucide-react';\nimport * as React from 'react';\nimport { createPortal } from 'react-dom';\nimport { Slot } from '../../internal/slot';\nimport { useAnimationState } from '../../internal/use-animation-state';\nimport { useFocusTrap } from '../../internal/use-focus-trap';\nimport { useScrollLock } from '../../internal/use-scroll-lock';\nimport s from './sheet.module.scss';\n\n// ── Context ──────────────────────────────────────────────\n\ntype SheetContextValue = {\n  open: boolean;\n  onOpenChange: (open: boolean) => void;\n  titleId: string;\n  descriptionId: string;\n};\n\nconst SheetContext = React.createContext<SheetContextValue | null>(null);\n\nfunction useSheet() {\n  const ctx = React.useContext(SheetContext);\n  if (!ctx) throw new Error('Sheet compound components must be used within <Sheet>');\n  return ctx;\n}\n\n// ── Root ─────────────────────────────────────────────────\n\nexport interface SheetProps {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  children?: React.ReactNode;\n}\n\nfunction Sheet({ open: controlledOpen, defaultOpen = false, onOpenChange, children }: SheetProps) {\n  const [internalOpen, setInternalOpen] = React.useState(defaultOpen);\n  const isControlled = controlledOpen !== undefined;\n  const open = isControlled ? controlledOpen : internalOpen;\n  const titleId = React.useId();\n  const descriptionId = React.useId();\n\n  const handleOpenChange = React.useCallback(\n    (next: boolean) => {\n      if (!isControlled) setInternalOpen(next);\n      onOpenChange?.(next);\n    },\n    [isControlled, onOpenChange],\n  );\n\n  return (\n    <SheetContext.Provider value={{ open, onOpenChange: handleOpenChange, titleId, descriptionId }}>\n      {children}\n    </SheetContext.Provider>\n  );\n}\n\n// ── Trigger ──────────────────────────────────────────────\n\nexport interface SheetTriggerProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  asChild?: boolean;\n}\n\nconst SheetTrigger = React.forwardRef<HTMLButtonElement, SheetTriggerProps>(\n  ({ asChild, onClick, children, ...props }, ref) => {\n    const { onOpenChange } = useSheet();\n    const Comp = asChild ? Slot : 'button';\n\n    const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n      onClick?.(e);\n      onOpenChange(true);\n    };\n\n    return (\n      <Comp ref={ref} data-slot={'sheet-trigger'} onClick={handleClick} {...props}>\n        {children}\n      </Comp>\n    );\n  },\n);\nSheetTrigger.displayName = 'SheetTrigger';\n\n// ── Close ────────────────────────────────────────────────\n\nexport interface SheetCloseProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  asChild?: boolean;\n}\n\nconst SheetClose = React.forwardRef<HTMLButtonElement, SheetCloseProps>(\n  ({ asChild, onClick, children, ...props }, ref) => {\n    const { onOpenChange } = useSheet();\n    const Comp = asChild ? Slot : 'button';\n\n    const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n      onClick?.(e);\n      onOpenChange(false);\n    };\n\n    return (\n      <Comp ref={ref} data-slot={'sheet-close'} onClick={handleClick} {...props}>\n        {children}\n      </Comp>\n    );\n  },\n);\nSheetClose.displayName = 'SheetClose';\n\n// ── Content ──────────────────────────────────────────────\n\nconst sideClassMap = {\n  right: s['content-right'],\n  left: s['content-left'],\n  top: s['content-top'],\n  bottom: s['content-bottom'],\n} as const;\n\ntype SheetSide = keyof typeof sideClassMap;\n\nexport type SheetContentProps = React.HTMLAttributes<HTMLDivElement> & {\n  side?: SheetSide;\n  /**\n   * How much room the panel gets. `sm` suits a confirm or a short form; `lg`\n   * is for a working surface — a queue of editable cards needs the width or\n   * its own content starts scrolling sideways.\n   */\n  size?: 'sm' | 'md' | 'lg';\n  /**\n   * Float the panel off the viewport edge instead of sitting flush to it.\n   * Reads as a card over the page rather than a second wall of it.\n   */\n  inset?: boolean;\n};\n\nconst SheetContent = React.forwardRef<HTMLDivElement, SheetContentProps>(\n  ({ className, children, side = 'right', size = 'md', inset = false, ...props }, ref) => {\n    const { open, onOpenChange, titleId, descriptionId } = useSheet();\n    const { mounted, state } = useAnimationState(open, 250);\n    const focusTrapRef = useFocusTrap(open);\n    useScrollLock(mounted);\n\n    React.useEffect(() => {\n      if (!open) return;\n\n      const handleKeyDown = (e: KeyboardEvent) => {\n        // A nested layer (an open Select, DatePicker or menu) marks Escape as\n        // handled with preventDefault. Escape should dismiss the topmost layer\n        // only, so the modal ignores an event something inside it already took.\n        if (e.key === 'Escape' && !e.defaultPrevented) {\n          onOpenChange(false);\n        }\n      };\n\n      document.addEventListener('keydown', handleKeyDown);\n      return () => document.removeEventListener('keydown', handleKeyDown);\n    }, [open, onOpenChange]);\n\n    if (!mounted || state === 'idle') return null;\n\n    return createPortal(\n      <div data-constellation-portal={''} ref={focusTrapRef}>\n        <div\n          data-slot={'sheet-overlay'}\n          data-state={state}\n          className={s.overlay}\n          onClick={() => onOpenChange(false)}\n          aria-hidden={'true'}\n        />\n        <div\n          ref={ref}\n          data-slot={'sheet-content'}\n          data-state={state}\n          role={'dialog'}\n          aria-modal={'true'}\n          aria-labelledby={titleId}\n          aria-describedby={descriptionId}\n          className={cn(\n            s['sheet-content'],\n            sideClassMap[side],\n            s[`size-${size}`],\n            inset && s['content-inset'],\n            className,\n          )}\n          onClick={e => e.stopPropagation()}\n          {...props}\n        >\n          {children}\n          <SheetClose className={s['close-button']} asChild>\n            <Button variant={'ghost'} theme={'inherit'} iconOnly size={'sm'}>\n              <XIcon />\n              <span className={'srOnly'}>Close</span>\n            </Button>\n          </SheetClose>\n        </div>\n      </div>,\n      document.body,\n    );\n  },\n);\nSheetContent.displayName = 'SheetContent';\n\n// ── Semantic sub-components ──────────────────────────────\n\nfunction SheetHeader({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot={'sheet-header'} className={cn(s.header, className)} {...props} />;\n}\n\nfunction SheetBody({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot={'sheet-body'} className={cn(s.body, className)} {...props} />;\n}\n\nfunction SheetFooter({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot={'sheet-footer'} className={cn(s.footer, className)} {...props} />;\n}\n\nfunction SheetTitle({ className, ...props }: React.ComponentProps<'h2'>) {\n  const { titleId } = useSheet();\n\n  return (\n    <h2 id={titleId} data-slot={'sheet-title'} className={cn(s.title, className)} {...props} />\n  );\n}\n\nfunction SheetDescription({ className, ...props }: React.ComponentProps<'p'>) {\n  const { descriptionId } = useSheet();\n\n  return (\n    <p\n      id={descriptionId}\n      data-slot={'sheet-description'}\n      className={cn(s.description, className)}\n      {...props}\n    />\n  );\n}\n\nexport {\n  Sheet,\n  SheetBody,\n  SheetClose,\n  SheetContent,\n  SheetDescription,\n  SheetFooter,\n  SheetHeader,\n  SheetTitle,\n  SheetTrigger,\n};\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
+{"version":3,"file":"sheet.js","sources":["../../../src/navigation/Sheet/sheet.tsx"],"sourcesContent":["import { Button } from '@constellation/ui';\nimport cn from 'clsx';\nimport { XIcon } from 'lucide-react';\nimport * as React from 'react';\nimport { createPortal } from 'react-dom';\nimport { Slot } from '../../internal/slot';\nimport { useAnimationState } from '../../internal/use-animation-state';\nimport { useFocusTrap } from '../../internal/use-focus-trap';\nimport { useScrollLock } from '../../internal/use-scroll-lock';\nimport s from './sheet.module.scss';\n\n// ── Context ──────────────────────────────────────────────\n\ntype SheetContextValue = {\n  open: boolean;\n  onOpenChange: (open: boolean) => void;\n  titleId: string;\n  descriptionId: string;\n};\n\nconst SheetContext = React.createContext<SheetContextValue | null>(null);\n\nfunction useSheet() {\n  const ctx = React.useContext(SheetContext);\n  if (!ctx) throw new Error('Sheet compound components must be used within <Sheet>');\n  return ctx;\n}\n\n// ── Root ─────────────────────────────────────────────────\n\nexport interface SheetProps {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  children?: React.ReactNode;\n}\n\nfunction Sheet({ open: controlledOpen, defaultOpen = false, onOpenChange, children }: SheetProps) {\n  const [internalOpen, setInternalOpen] = React.useState(defaultOpen);\n  const isControlled = controlledOpen !== undefined;\n  const open = isControlled ? controlledOpen : internalOpen;\n  const titleId = React.useId();\n  const descriptionId = React.useId();\n\n  const handleOpenChange = React.useCallback(\n    (next: boolean) => {\n      if (!isControlled) setInternalOpen(next);\n      onOpenChange?.(next);\n    },\n    [isControlled, onOpenChange],\n  );\n\n  return (\n    <SheetContext.Provider value={{ open, onOpenChange: handleOpenChange, titleId, descriptionId }}>\n      {children}\n    </SheetContext.Provider>\n  );\n}\n\n// ── Trigger ──────────────────────────────────────────────\n\nexport interface SheetTriggerProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  asChild?: boolean;\n}\n\nconst SheetTrigger = React.forwardRef<HTMLButtonElement, SheetTriggerProps>(\n  ({ asChild, onClick, children, ...props }, ref) => {\n    const { onOpenChange } = useSheet();\n    const Comp = asChild ? Slot : 'button';\n\n    const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n      onClick?.(e);\n      onOpenChange(true);\n    };\n\n    return (\n      <Comp ref={ref} data-slot={'sheet-trigger'} onClick={handleClick} {...props}>\n        {children}\n      </Comp>\n    );\n  },\n);\nSheetTrigger.displayName = 'SheetTrigger';\n\n// ── Close ────────────────────────────────────────────────\n\nexport interface SheetCloseProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  asChild?: boolean;\n}\n\nconst SheetClose = React.forwardRef<HTMLButtonElement, SheetCloseProps>(\n  ({ asChild, onClick, children, ...props }, ref) => {\n    const { onOpenChange } = useSheet();\n    const Comp = asChild ? Slot : 'button';\n\n    const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n      onClick?.(e);\n      onOpenChange(false);\n    };\n\n    return (\n      <Comp ref={ref} data-slot={'sheet-close'} onClick={handleClick} {...props}>\n        {children}\n      </Comp>\n    );\n  },\n);\nSheetClose.displayName = 'SheetClose';\n\n// ── Content ──────────────────────────────────────────────\n\nconst sideClassMap = {\n  right: s['content-right'],\n  left: s['content-left'],\n  top: s['content-top'],\n  bottom: s['content-bottom'],\n} as const;\n\ntype SheetSide = keyof typeof sideClassMap;\n\nexport type SheetContentProps = React.HTMLAttributes<HTMLDivElement> & {\n  side?: SheetSide;\n  /**\n   * How much room the panel gets. `sm` suits a confirm or a short form; `lg`\n   * is for a working surface — a queue of editable cards needs the width or\n   * its own content starts scrolling sideways.\n   */\n  size?: 'sm' | 'md' | 'lg';\n  /**\n   * Float the panel off the viewport edge instead of sitting flush to it.\n   * Reads as a card over the page rather than a second wall of it.\n   */\n  inset?: boolean;\n};\n\nconst SheetContent = React.forwardRef<HTMLDivElement, SheetContentProps>(\n  ({ className, children, side = 'right', size = 'md', inset = false, ...props }, ref) => {\n    const { open, onOpenChange, titleId, descriptionId } = useSheet();\n    const { mounted, state } = useAnimationState(open, 250);\n    const focusTrapRef = useFocusTrap(open);\n    useScrollLock(mounted);\n\n    React.useEffect(() => {\n      if (!open) return;\n\n      const handleKeyDown = (e: KeyboardEvent) => {\n        // A nested layer (an open Select, DatePicker or menu) marks Escape as\n        // handled with preventDefault. Escape should dismiss the topmost layer\n        // only, so the modal ignores an event something inside it already took.\n        if (e.key === 'Escape' && !e.defaultPrevented) {\n          onOpenChange(false);\n        }\n      };\n\n      document.addEventListener('keydown', handleKeyDown);\n      return () => document.removeEventListener('keydown', handleKeyDown);\n    }, [open, onOpenChange]);\n\n    if (!mounted || state === 'idle') return null;\n\n    return createPortal(\n      <div data-constellation-portal={''} ref={focusTrapRef}>\n        <div\n          data-slot={'sheet-overlay'}\n          data-state={state}\n          className={s.overlay}\n          onClick={() => onOpenChange(false)}\n          aria-hidden={'true'}\n        />\n        <div\n          ref={ref}\n          data-slot={'sheet-content'}\n          data-state={state}\n          role={'dialog'}\n          aria-modal={'true'}\n          aria-labelledby={titleId}\n          aria-describedby={descriptionId}\n          className={cn(\n            s['sheet-content'],\n            sideClassMap[side],\n            s[`size-${size}`],\n            inset && s['content-inset'],\n            className,\n          )}\n          onClick={e => e.stopPropagation()}\n          {...props}\n        >\n          {children}\n          <SheetClose className={s['close-button']} asChild>\n            <Button variant={'ghost'} theme={'inherit'} iconOnly size={'sm'}>\n              <XIcon />\n              <span className={'srOnly'}>Close</span>\n            </Button>\n          </SheetClose>\n        </div>\n      </div>,\n      document.body,\n    );\n  },\n);\nSheetContent.displayName = 'SheetContent';\n\n// ── Semantic sub-components ──────────────────────────────\n\nfunction SheetHeader({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot={'sheet-header'} className={cn(s.header, className)} {...props} />;\n}\n\nfunction SheetBody({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot={'sheet-body'} className={cn(s.body, className)} {...props} />;\n}\n\nfunction SheetFooter({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot={'sheet-footer'} className={cn(s.footer, className)} {...props} />;\n}\n\nfunction SheetTitle({ className, ...props }: React.ComponentProps<'h2'>) {\n  const { titleId } = useSheet();\n\n  return (\n    <h2 id={titleId} data-slot={'sheet-title'} className={cn(s.title, className)} {...props} />\n  );\n}\n\nfunction SheetDescription({ className, ...props }: React.ComponentProps<'p'>) {\n  const { descriptionId } = useSheet();\n\n  return (\n    <p\n      id={descriptionId}\n      data-slot={'sheet-description'}\n      className={cn(s.description, className)}\n      {...props}\n    />\n  );\n}\n\nexport {\n  Sheet,\n  SheetBody,\n  SheetClose,\n  SheetContent,\n  SheetDescription,\n  SheetFooter,\n  SheetHeader,\n  SheetTitle,\n  SheetTrigger,\n};\n"],"names":["_jsx","_jsxs"],"mappings":"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"}

package/dist/navigation.d.ts

@@ -62,7 +62,7 @@ declare function DropdownMenuSubContent({ className, ...props }: React.HTMLAttri
 declare const linkVariants: (props?: ({
     underline?: boolean | null | undefined;
     hover?: "default" | "none" | null | undefined;
-    theme?: "inherit" | "primary" | "secondary" | "info" | "success" | "warning" | "destructive" | "slate" | null | undefined;
+    theme?: "destructive" | "inherit" | "primary" | "secondary" | "warning" | "success" | "info" | "slate" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 
 interface LinkProps extends Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'onClick'>, VariantProps<typeof linkVariants> {

package/dist/settings/AppearanceTabs/appearance-tabs.js

@@ -10,6 +10,7 @@ import '../../ui/Alert/alert.css';
 import '../../ui/Avatar/avatar.js';
 import { Button } from '../../ui/Button/button.js';
 import '../../ui/Chip/chip.js';
+import '../../ui/ChipSelect/chip-select.js';
 import '../../ui/CodeBlock/code-block.js';
 import cn from 'clsx';
 import '../../ui/DevIndicator/dev-indicator.css';

package/dist/settings/AppearanceTabs/appearance-tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"appearance-tabs.js","sources":["../../../src/settings/AppearanceTabs/appearance-tabs.tsx"],"sourcesContent":["import { type Appearance, useAppearance } from '@constellation/hooks';\nimport { Button } from '@constellation/ui';\nimport cn from 'clsx';\nimport { type LucideIcon, MonitorIcon, MoonIcon, SunIcon } from 'lucide-react';\nimport * as React from 'react';\nimport s from './appearance-tabs.module.scss';\n\ntype AppearanceTabsProps = React.HTMLAttributes<HTMLDivElement> & {\n  iconOnly?: boolean;\n};\n\nexport function AppearanceTabs({\n  className = '',\n  iconOnly = false,\n  ...props\n}: AppearanceTabsProps) {\n  const { appearance, updateAppearance } = useAppearance();\n\n  const tabs: { value: Appearance; icon: LucideIcon; label: string }[] = [\n    { value: 'light', icon: SunIcon, label: 'Light' },\n    { value: 'dark', icon: MoonIcon, label: 'Dark' },\n    { value: 'system', icon: MonitorIcon, label: 'System' },\n  ];\n\n  return (\n    <div data-slot={'appearance-tabs'} className={cn(s['tabs-root'], className)} {...props}>\n      {tabs.map(({ value, icon: Icon, label }) => (\n        <Button\n          key={value}\n          variant={'ghost'}\n          theme={'inherit'}\n          rounded\n          onClick={() => updateAppearance(value)}\n          aria-label={label}\n          iconOnly={iconOnly}\n          aria-pressed={appearance === value}\n          className={cn(s['tab-button'], appearance === value && s['tab-button-active'])}\n          title={iconOnly ? label : undefined}\n        >\n          <Icon />\n          {!iconOnly && <span>{label}</span>}\n        </Button>\n      ))}\n    </div>\n  );\n}\n"],"names":["_jsx","_jsxs"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWM,SAAU,cAAc,CAAC,EAC7B,SAAS,GAAG,EAAE,EACd,QAAQ,GAAG,KAAK,EAChB,GAAG,KAAK,EACY,EAAA;IACpB,MAAM,EAAE,UAAU,EAAE,gBAAgB,EAAE,GAAG,aAAa,EAAE;AAExD,IAAA,MAAM,IAAI,GAA6D;QACrE,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE;QACjD,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE;QAChD,EAAE,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,WAAW,EAAE,KAAK,EAAE,QAAQ,EAAE;KACxD;IAED,QACEA,GAAA,CAAA,KAAA,EAAA,EAAA,WAAA,EAAgB,iBAAiB,EAAE,SAAS,EAAE,EAAE,CAAC,CAAC,CAAC,WAAW,CAAC,EAAE,SAAS,CAAC,EAAA,GAAM,KAAK,EAAA,QAAA,EACnF,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,MACrCC,IAAA,CAAC,MAAM,EAAA,EAEL,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,SAAS,EAChB,OAAO,EAAA,IAAA,EACP,OAAO,EAAE,MAAM,gBAAgB,CAAC,KAAK,CAAC,gBAC1B,KAAK,EACjB,QAAQ,EAAE,QAAQ,EAAA,cAAA,EACJ,UAAU,KAAK,KAAK,EAClC,SAAS,EAAE,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,EAAE,UAAU,KAAK,KAAK,IAAI,CAAC,CAAC,mBAAmB,CAAC,CAAC,EAC9E,KAAK,EAAE,QAAQ,GAAG,KAAK,GAAG,SAAS,EAAA,QAAA,EAAA,CAEnCD,GAAA,CAAC,IAAI,EAAA,EAAA,CAAG,EACP,CAAC,QAAQ,IAAIA,GAAA,CAAA,MAAA,EAAA,EAAA,QAAA,EAAO,KAAK,EAAA,CAAQ,CAAA,EAAA,EAZ7B,KAAK,CAaH,CACV,CAAC,EAAA,CACE;AAEV;;"}
+{"version":3,"file":"appearance-tabs.js","sources":["../../../src/settings/AppearanceTabs/appearance-tabs.tsx"],"sourcesContent":["import { type Appearance, useAppearance } from '@constellation/hooks';\nimport { Button } from '@constellation/ui';\nimport cn from 'clsx';\nimport { type LucideIcon, MonitorIcon, MoonIcon, SunIcon } from 'lucide-react';\nimport * as React from 'react';\nimport s from './appearance-tabs.module.scss';\n\ntype AppearanceTabsProps = React.HTMLAttributes<HTMLDivElement> & {\n  iconOnly?: boolean;\n};\n\nexport function AppearanceTabs({\n  className = '',\n  iconOnly = false,\n  ...props\n}: AppearanceTabsProps) {\n  const { appearance, updateAppearance } = useAppearance();\n\n  const tabs: { value: Appearance; icon: LucideIcon; label: string }[] = [\n    { value: 'light', icon: SunIcon, label: 'Light' },\n    { value: 'dark', icon: MoonIcon, label: 'Dark' },\n    { value: 'system', icon: MonitorIcon, label: 'System' },\n  ];\n\n  return (\n    <div data-slot={'appearance-tabs'} className={cn(s['tabs-root'], className)} {...props}>\n      {tabs.map(({ value, icon: Icon, label }) => (\n        <Button\n          key={value}\n          variant={'ghost'}\n          theme={'inherit'}\n          rounded\n          onClick={() => updateAppearance(value)}\n          aria-label={label}\n          iconOnly={iconOnly}\n          aria-pressed={appearance === value}\n          className={cn(s['tab-button'], appearance === value && s['tab-button-active'])}\n          title={iconOnly ? label : undefined}\n        >\n          <Icon />\n          {!iconOnly && <span>{label}</span>}\n        </Button>\n      ))}\n    </div>\n  );\n}\n"],"names":["_jsx","_jsxs"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWM,SAAU,cAAc,CAAC,EAC7B,SAAS,GAAG,EAAE,EACd,QAAQ,GAAG,KAAK,EAChB,GAAG,KAAK,EACY,EAAA;IACpB,MAAM,EAAE,UAAU,EAAE,gBAAgB,EAAE,GAAG,aAAa,EAAE;AAExD,IAAA,MAAM,IAAI,GAA6D;QACrE,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE;QACjD,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE;QAChD,EAAE,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,WAAW,EAAE,KAAK,EAAE,QAAQ,EAAE;KACxD;IAED,QACEA,GAAA,CAAA,KAAA,EAAA,EAAA,WAAA,EAAgB,iBAAiB,EAAE,SAAS,EAAE,EAAE,CAAC,CAAC,CAAC,WAAW,CAAC,EAAE,SAAS,CAAC,EAAA,GAAM,KAAK,EAAA,QAAA,EACnF,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,MACrCC,IAAA,CAAC,MAAM,EAAA,EAEL,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,SAAS,EAChB,OAAO,EAAA,IAAA,EACP,OAAO,EAAE,MAAM,gBAAgB,CAAC,KAAK,CAAC,gBAC1B,KAAK,EACjB,QAAQ,EAAE,QAAQ,EAAA,cAAA,EACJ,UAAU,KAAK,KAAK,EAClC,SAAS,EAAE,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,EAAE,UAAU,KAAK,KAAK,IAAI,CAAC,CAAC,mBAAmB,CAAC,CAAC,EAC9E,KAAK,EAAE,QAAQ,GAAG,KAAK,GAAG,SAAS,EAAA,QAAA,EAAA,CAEnCD,GAAA,CAAC,IAAI,EAAA,EAAA,CAAG,EACP,CAAC,QAAQ,IAAIA,GAAA,CAAA,MAAA,EAAA,EAAA,QAAA,EAAO,KAAK,EAAA,CAAQ,CAAA,EAAA,EAZ7B,KAAK,CAaH,CACV,CAAC,EAAA,CACE;AAEV;;"}

package/dist/tokens.css

@@ -251,6 +251,36 @@
    */
   --size-0-5: 0.25rem;
   --size-1-5: 0.75rem;
+  /*
+   * ── Type steps ─────────────────────────────────────────────────────────
+   *
+   * The sizes `Typography` sets per variant, exposed so an app can align its
+   * OWN rules to the same scale instead of copying the numbers into a
+   * stylesheet where they immediately start to drift.
+   *
+   * A component should still reach for the variant — `<Typography
+   * variant={'caption'}>` says what the text IS, where a raw size only says
+   * how big. These are for the CSS an app cannot express as a component:
+   * a badge's label, a table cell, a chip's count.
+   *
+   * ⚠️ `caption` is the FLOOR, and deliberately: 12px is about as small as
+   * sustained UI text can be and still be read at arm's length on a phone.
+   * The scale does not offer anything below it, and an app that wants
+   * something smaller is telling you its density is wrong.
+   *
+   * Headings keep their responsive overrides in the component — those are a
+   * breakpoint's business rather than the scale's.
+   */
+  --font-size-caption: 0.75rem;
+  --font-size-body2: 0.875rem;
+  --font-size-body1: 1rem;
+  --font-size-subtitle1: 1.0625rem;
+  --font-size-h6: 1.35rem;
+  --font-size-h5: 1.5rem;
+  --font-size-h4: 1.65rem;
+  --font-size-h3: 1.85rem;
+  --font-size-h2: 2.25rem;
+  --font-size-h1: 2.75rem;
   /*
    * ── Measure ────────────────────────────────────────────────────────────
    *

package/dist/tooltip-CZ7BC0g3.d.ts

@@ -0,0 +1,46 @@
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+
+declare const buttonVariants: (props?: ({
+    variant?: "ghost" | "outlined" | "contained" | null | undefined;
+    theme?: "primary" | "secondary" | "info" | "success" | "warning" | "destructive" | "slate" | "inherit" | null | undefined;
+    size?: "sm" | "md" | "lg" | "xs" | null | undefined;
+    iconOnly?: boolean | null | undefined;
+    fullWidth?: boolean | null | undefined;
+    rounded?: boolean | "extra" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+
+interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
+    /** A colour outside the theme scale; overrides the theme's colour roles. */
+    color?: string;
+    /** Ink for `contained` when `color` is set and the default contrast is wrong. */
+    onColor?: string;
+    asChild?: boolean;
+}
+declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
+
+declare function TooltipProvider({ children, delayDuration, }: {
+    children?: React.ReactNode;
+    delayDuration?: number;
+}): React.JSX.Element;
+interface TooltipProps {
+    children?: React.ReactNode;
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    delayDuration?: number;
+}
+declare function Tooltip({ children, open: controlledOpen, defaultOpen, onOpenChange, delayDuration, }: TooltipProps): React.JSX.Element;
+interface TooltipTriggerProps extends React.HTMLAttributes<HTMLElement> {
+    asChild?: boolean;
+}
+declare function TooltipTrigger({ asChild, children, onMouseEnter, onMouseLeave, onFocus, onBlur, ...props }: TooltipTriggerProps): React.JSX.Element;
+interface TooltipContentProps extends React.HTMLAttributes<HTMLDivElement> {
+    side?: 'top' | 'right' | 'bottom' | 'left';
+    sideOffset?: number;
+}
+declare function TooltipContent({ className, children, side, sideOffset, ...props }: TooltipContentProps): React.ReactPortal | null;
+
+export { Button as B, Tooltip as T, TooltipContent as b, TooltipProvider as e, TooltipTrigger as f };
+export type { ButtonProps as a, TooltipContentProps as c, TooltipProps as d, TooltipTriggerProps as g };

package/dist/tooltip-Cf_wdeef.d.ts

@@ -0,0 +1,46 @@
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+
+declare const buttonVariants: (props?: ({
+    variant?: "outlined" | "contained" | "ghost" | null | undefined;
+    theme?: "primary" | "secondary" | "info" | "success" | "warning" | "destructive" | "slate" | "inherit" | null | undefined;
+    size?: "sm" | "md" | "lg" | "xs" | null | undefined;
+    iconOnly?: boolean | null | undefined;
+    fullWidth?: boolean | null | undefined;
+    rounded?: boolean | "extra" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+
+interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
+    /** A colour outside the theme scale; overrides the theme's colour roles. */
+    color?: string;
+    /** Ink for `contained` when `color` is set and the default contrast is wrong. */
+    onColor?: string;
+    asChild?: boolean;
+}
+declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
+
+declare function TooltipProvider({ children, delayDuration, }: {
+    children?: React.ReactNode;
+    delayDuration?: number;
+}): React.JSX.Element;
+interface TooltipProps {
+    children?: React.ReactNode;
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    delayDuration?: number;
+}
+declare function Tooltip({ children, open: controlledOpen, defaultOpen, onOpenChange, delayDuration, }: TooltipProps): React.JSX.Element;
+interface TooltipTriggerProps extends React.HTMLAttributes<HTMLElement> {
+    asChild?: boolean;
+}
+declare function TooltipTrigger({ asChild, children, onMouseEnter, onMouseLeave, onFocus, onBlur, ...props }: TooltipTriggerProps): React.JSX.Element;
+interface TooltipContentProps extends React.HTMLAttributes<HTMLDivElement> {
+    side?: 'top' | 'right' | 'bottom' | 'left';
+    sideOffset?: number;
+}
+declare function TooltipContent({ className, children, side, sideOffset, ...props }: TooltipContentProps): React.ReactPortal | null;
+
+export { Button as B, Tooltip as T, TooltipContent as b, TooltipProvider as e, TooltipTrigger as f };
+export type { ButtonProps as a, TooltipContentProps as c, TooltipProps as d, TooltipTriggerProps as g };

package/dist/tooltip-D1Wex2bz.d.ts

@@ -0,0 +1,46 @@
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+
+declare const buttonVariants: (props?: ({
+    variant?: "outlined" | "ghost" | "contained" | null | undefined;
+    theme?: "inherit" | "primary" | "secondary" | "success" | "destructive" | "warning" | "info" | "slate" | null | undefined;
+    size?: "sm" | "md" | "lg" | "xs" | null | undefined;
+    iconOnly?: boolean | null | undefined;
+    fullWidth?: boolean | null | undefined;
+    rounded?: boolean | "extra" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+
+interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
+    /** A colour outside the theme scale; overrides the theme's colour roles. */
+    color?: string;
+    /** Ink for `contained` when `color` is set and the default contrast is wrong. */
+    onColor?: string;
+    asChild?: boolean;
+}
+declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
+
+declare function TooltipProvider({ children, delayDuration, }: {
+    children?: React.ReactNode;
+    delayDuration?: number;
+}): React.JSX.Element;
+interface TooltipProps {
+    children?: React.ReactNode;
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    delayDuration?: number;
+}
+declare function Tooltip({ children, open: controlledOpen, defaultOpen, onOpenChange, delayDuration, }: TooltipProps): React.JSX.Element;
+interface TooltipTriggerProps extends React.HTMLAttributes<HTMLElement> {
+    asChild?: boolean;
+}
+declare function TooltipTrigger({ asChild, children, onMouseEnter, onMouseLeave, onFocus, onBlur, ...props }: TooltipTriggerProps): React.JSX.Element;
+interface TooltipContentProps extends React.HTMLAttributes<HTMLDivElement> {
+    side?: 'top' | 'right' | 'bottom' | 'left';
+    sideOffset?: number;
+}
+declare function TooltipContent({ className, children, side, sideOffset, ...props }: TooltipContentProps): React.ReactPortal | null;
+
+export { Button as B, Tooltip as T, TooltipContent as b, TooltipProvider as e, TooltipTrigger as f };
+export type { ButtonProps as a, TooltipContentProps as c, TooltipProps as d, TooltipTriggerProps as g };

package/dist/typography/Typography/typography.css

@@ -28,7 +28,7 @@
 }
 .typography-module_typography__FAx__.typography-module_h1__Chrx6 {
   color: var(--text-heading);
-  --typography-font-size: 2.75rem;
+  --typography-font-size: var(--font-size-h1);
   line-height: 1.25;
 }
 @media (max-width: 768px) {
@@ -38,7 +38,7 @@
 }
 .typography-module_typography__FAx__.typography-module_h2__6Qpwf {
   color: var(--text-heading);
-  --typography-font-size: 2.25rem;
+  --typography-font-size: var(--font-size-h2);
   line-height: 1.25;
 }
 @media (max-width: 768px) {
@@ -58,7 +58,7 @@
 }
 .typography-module_typography__FAx__.typography-module_h4__TEi6l {
   color: var(--text-heading);
-  --typography-font-size: 1.85rem;
+  --typography-font-size: var(--font-size-h3);
   line-height: 1.25;
 }
 @media (max-width: 768px) {
@@ -68,7 +68,7 @@
 }
 .typography-module_typography__FAx__.typography-module_h5__pY2ZF {
   color: var(--text-heading);
-  --typography-font-size: 1.65rem;
+  --typography-font-size: var(--font-size-h4);
   font-weight: 500;
   line-height: 1.25;
 }
@@ -79,7 +79,7 @@
 }
 .typography-module_typography__FAx__.typography-module_h6__jzeAZ {
   color: var(--text-heading);
-  --typography-font-size: 1.5rem;
+  --typography-font-size: var(--font-size-h5);
   line-height: 1.25;
 }
 @media (max-width: 768px) {
@@ -88,34 +88,34 @@
   }
 }
 .typography-module_typography__FAx__.typography-module_subtitle1__kbXoE {
-  --typography-font-size: 1.0625rem;
+  --typography-font-size: var(--font-size-subtitle1);
   font-weight: 500;
 }
 .typography-module_typography__FAx__.typography-module_subtitle2__TesJV {
-  --typography-font-size: 0.875rem;
+  --typography-font-size: var(--font-size-body2);
   font-weight: 500;
 }
 .typography-module_typography__FAx__.typography-module_body1__XiHhz {
-  --typography-font-size: 1rem;
+  --typography-font-size: var(--font-size-body1);
 }
 .typography-module_typography__FAx__.typography-module_body2__321Bc {
   color: var(--text-secondary);
-  --typography-font-size: 0.875rem;
+  --typography-font-size: var(--font-size-body2);
 }
 .typography-module_typography__FAx__.typography-module_overline__NaSU- {
-  --typography-font-size: 0.875rem;
+  --typography-font-size: var(--font-size-body2);
   letter-spacing: 1px;
   text-transform: uppercase;
 }
 .typography-module_typography__FAx__.typography-module_caption__BAaLD {
-  --typography-font-size: 0.75rem;
+  --typography-font-size: var(--font-size-caption);
 }
 .typography-module_typography__FAx__.typography-module_code__MiYWd {
   background: var(--action-hover);
   border-radius: 5px;
   --typography-font: var(--font-mono);
   --typography-font-fallback: monospace;
-  --typography-font-size: 0.75rem;
+  --typography-font-size: var(--font-size-caption);
   padding: 4px var(--size-1);
 }
 .typography-module_typography__FAx__.typography-module_code-block__cdgeP {
@@ -130,7 +130,7 @@
   white-space: pre;
 }
 .typography-module_typography__FAx__.typography-module_tooltip__ZScRV {
-  --typography-font-size: 0.75rem;
+  --typography-font-size: var(--font-size-caption);
   font-weight: 200;
   text-transform: uppercase;
 }
@@ -159,7 +159,7 @@
   }
 }
 .typography-module_typography__FAx__.typography-module_table-cell-small__G0MyC {
-  --typography-font-size: 0.75rem;
+  --typography-font-size: var(--font-size-caption);
 }
 @media (min-width: 1360px) {
   .typography-module_typography__FAx__.typography-module_table-cell-small__G0MyC {