@cueplusplus/ui 0.20.0 → 0.21.0

package/dist/index.d.ts

@@ -105,7 +105,9 @@ import { Accordion, AccordionHeaderProps, AccordionItemProps, AccordionPanelProp
 import { SpaceStep, Stack, StackAlign, StackJustify, StackProps } from "./layout/stack.js";
 import { Bento, BentoColumns, BentoMinHeight, BentoRootProps, BentoRowSpan, BentoRows, BentoSpan, BentoTileProps } from "./layout/bento.js";
 import { Breadcrumb, BreadcrumbItem, BreadcrumbProps } from "./layout/breadcrumb.js";
+import { PaneSeam, PaneSeamEdge, PaneSeamOrientation, PaneSeamProps } from "./layout/pane-seam.js";
 import { Reveal, RevealProps } from "./layout/reveal.js";
+import { SplitPane, SplitPaneLayout, SplitPaneProps } from "./layout/split-pane.js";
 import { Card, CardContentProps, CardDescriptionProps, CardFooterProps, CardHeaderProps, CardRootProps, CardTitleProps } from "./layout/card.js";
 import { Collapsible, CollapsiblePanelProps, CollapsibleRootProps, CollapsibleTriggerProps, Disclosure, DisclosureProps } from "./layout/collapsible.js";
 import { DescriptionList, DescriptionListDetailProps, DescriptionListLayout, DescriptionListRootProps, DescriptionListTermProps } from "./layout/description-list.js";
@@ -152,4 +154,4 @@ import { StillProvider, StillProviderProps, useStill } from "./system/still.js";
 import { FrameClockOptions, useFrameClock } from "./system/frame-clock.js";
 import { FontScope, FontScopeProps } from "./system/font-scope.js";
 import { DEFAULT_PAINT, DEFAULT_STYLE_SET, DensityEntry, DensityLevel, FontEntry, FontName, Mode, PAINTS, Paint, STYLE_SETS, StyleSet, ThemeManifest, ThemeName } from "./system/index.js";
-export { AGENT_COLOR_PROPERTY, AGENT_HUES, AGENT_ROOT_COLOR, Accordion, type AccordionHeaderProps, type AccordionItemProps, type AccordionPanelProps, type AccordionRootProps, type AccordionTriggerProps, type AgentColorOptions, AgentPile, type AgentPileEntry, type AgentPileProps, type AgentPileSize, AlertDialog, type AlertDialogActionProps, type AlertDialogCancelProps, type AlertDialogContentProps, type AlertDialogDescriptionProps, type AlertDialogFooterProps, type AlertDialogRootProps, type AlertDialogTitleProps, type AlertDialogTriggerProps, AnnouncementBar, type AnnouncementBarAction, type AnnouncementBarProps, AppBar, type AppBarActionsProps, type AppBarBrandProps, type AppBarLinkProps, type AppBarNavProps, type AppBarRegister, type AppBarRootProps, type AppBarSeparatorProps, AppShell, type AppShellAsideProps, type AppShellBarProps, type AppShellBodyProps, type AppShellContentProps, type AppShellNavTriggerProps, type AppShellRootProps, type AppShellScrollerProps, type AppShellSidebarProps, AppWindowFrame, type AppWindowFrameProps, type AskAnswer, AskBox, type AskBoxProps, type AskDanger, type AskKind, type AskOption, AudienceIcon, Autocomplete, type AutocompleteProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, type AvatarSize, Band, type BandProps, type BandSeparation, type BandWidth, type BarOverflow, Bento, type BentoColumns, type BentoMinHeight, type BentoRootProps, type BentoRowSpan, type BentoRows, type BentoSpan, type BentoTileProps, type BrandAssetProps, type BrandSize, type BrandTone, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, Button, ButtonGroup, type ButtonGroupOrientation, type ButtonGroupProps, type ButtonProps, Card, type CardContentProps, type CardDescriptionProps, type CardFooterProps, type CardHeaderProps, type CardRootProps, type CardTitleProps, CatalogueIcon, ChannelBetaIcon, ChannelReleasedIcon, Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, Chip, type ChipProps, CliToolIcon, CodeBlock, type CodeBlockProps, Collapsible, type CollapsiblePanelProps, type CollapsibleRootProps, type CollapsibleTriggerProps, Combobox, type ComboboxOption, type ComboboxProps, CommandPalette, type CommandPaletteItem, type CommandPaletteProps, Composer, type ComposerProps, type ComposerSubmitKey, Container, type ContainerProps, type ContainerWidth, ContextMenu, type ContextMenuContentProps, type ContextMenuRootProps, type ContextMenuTriggerProps, type ControlSize, type ControlVariantProps, CopyButton, type CopyButtonProps, CueLogotype, type CueLogotypeProps, CueMark, type CueMarkProps, CuePortalFrame, type CuePortalFrameProps, DEFAULT_PAINT, DEFAULT_STORAGE_KEY, DEFAULT_STYLE_SET, DataRow, type DataRowDisclosure, type DataRowRootProps, type DataRowSlotProps, DataTree, type DataTreeItem, type DataTreeProps, type DataTreeRowState, DelegationCard, type DelegationCardProps, type DelegationDirection, type DelegationStatus, Density, type DensityEntry, type DensityLevel, type DensityProps, DescriptionList, type DescriptionListDetailProps, type DescriptionListLayout, type DescriptionListRootProps, type DescriptionListTermProps, Dialog, type DialogCloseProps, type DialogContentProps, type DialogDescriptionProps, type DialogFooterProps, type DialogRootProps, type DialogTitleProps, type DialogTriggerProps, Disclosure, type DisclosureProps, Drawer, type DrawerCloseProps, type DrawerContentProps, type DrawerDescriptionProps, type DrawerFooterProps, type DrawerRootProps, type DrawerSwipeDirection, type DrawerTitleProps, type DrawerTriggerProps, DropdownMenu, type DropdownMenuCheckboxItemProps, type DropdownMenuContentProps, type DropdownMenuGroupProps, type DropdownMenuItemProps, type DropdownMenuLabelProps, type DropdownMenuRootProps, type DropdownMenuSeparatorProps, type DropdownMenuTriggerProps, EmptyState, type EmptyStateProps, EnvVarInput, type EnvVarInputProps, Eyebrow, type EyebrowProps, Field, FieldDescription, type FieldDescriptionProps, FieldError, type FieldErrorProps, type FieldIssue, FieldLabel, type FieldLabelProps, type FieldProps, type FilePartition, type FilePartitionOptions, type FileRejectReason, type FileRejection, FileUpload, type FileUploadProps, FolderIcon, type FontEntry, type FontFamilies, type FontName, FontScope, type FontScopeProps, Footer, type FooterProps, type FormControlSize, type FrameClockOptions, Frames, type FramesHeight, type FramesItemProps, type FramesLayout, type FramesRootProps, GlossObject, type GlossObjectProps, Grid, type GridColumns, type GridProps, GroupBar, type GroupBarItem, type GroupBarProps, type GroupBarTone, Halftone, type HalftoneProps, Hero, type HeroProps, HoverCard, type HoverCardContentProps, type HoverCardRootProps, type HoverCardTriggerProps, IconButton, type IconButtonProps, InfoTip, type InfoTipProps, Input, InputGroup, type InputGroupProps, type InputProps, Inspector, type InspectorFooterProps, type InspectorRootProps, type InspectorRowProps, type InspectorSectionProps, Item, type ItemProps, Kbd, type KbdProps, Keyword, type KeywordProps, Ledger, type LedgerEmptyProps, type LedgerGroupProps, type LedgerRootProps, type LedgerTierProps, Link, type LinkProps, LogoStrip, type LogoStripProps, McpServerIcon, Menubar, type MenubarContentProps, type MenubarMenuProps, type MenubarRootProps, type MenubarTriggerProps, Message, MessageList, type MessageListProps, type MessageProps, type MessageRole, Meter, type MeterProps, type MeterProvenance, type MeterTone, type Mode, Motif, type MotifProps, type MotifVariant, MultiSelect, type MultiSelectProps, NavigationMenu, type NavigationMenuContentProps, type NavigationMenuItemProps, type NavigationMenuLinkProps, type NavigationMenuListProps, type NavigationMenuRootProps, type NavigationMenuTriggerProps, type NavigationMenuViewportProps, NumberField, type NumberFieldProps, OTPField, type OTPFieldProps, OVERLAY_SIDE_OFFSET, PAINTS, PageShell, type PageShellProps, type PageWidth, Pagination, type PaginationEntry, type PaginationProps, type Paint, Panel, PanelHeader, type PanelHeaderProps, type PanelProps, ParticleLogo, type ParticleLogoProps, ParticleMark, type ParticleMarkProps, PasswordInput, type PasswordInputProps, type PersistedPreferences, Plussie, type PlussieExpression, type PlussieProps, Popover, type PopoverCloseProps, type PopoverContentProps, type PopoverDescriptionProps, type PopoverRootProps, type PopoverTitleProps, type PopoverTriggerProps, type PrepaintDefaults, type PrepaintOptions, Preview, type PreviewAxis, type PreviewGround, type PreviewPresentation, type PreviewProps, type PreviewResizeOptions, Progress, type ProgressProps, Radio, RadioGroup, type RadioGroupProps, type RadioProps, Rating, type RatingProps, type RatingSize, type ResolvedMode, Reveal, type RevealProps, Ribbon, type RibbonProps, Row, type RowProps, STYLE_SETS, ScrollArea, type ScrollAreaOrientation, type ScrollAreaProps, type ScrollEdges, ScrollableTabsList, type ScrollableTabsListProps, ScrubInput, type ScrubInputProps, SeamCell, type SeamCellProps, SeamGrid, type SeamGridProps, type SeamGround, SeamList, type SeamListProps, SearchInput, type SearchInputProps, SectionHeader, type SectionHeaderProps, SegmentedControl, type SegmentedControlItem, type SegmentedControlProps, type SegmentedControlSize, Select, type SelectOption, type SelectProps, Separator, type SeparatorProps, Sheet, type SheetCloseProps, type SheetContentProps, type SheetDescriptionProps, type SheetFooterProps, type SheetRootProps, type SheetTitleProps, type SheetTriggerProps, Sidebar, type SidebarItemProps, type SidebarRailProps, type SidebarRootProps, type SidebarSectionProps, Skeleton, type SkeletonProps, SkillIcon, Slider, type SliderProps, type SpaceStep, Sparkline, type SparklineProps, Spinner, type SpinnerProps, Stack, type StackAlign, StackIcon, type StackJustify, type StackProps, StacksMatrixIcon, Stat, StatBand, type StatBandProps, type StatBandStat, type StatProps, type StatTone, StatusBar, type StatusBarGroupProps, type StatusBarItemProps, type StatusBarProminence, type StatusBarProps, type StatusBarTone, StatusDot, type StatusDotProps, type StatusTone, Stepper, type StepperProps, type StepperState, type StepperStep, StillProvider, type StillProviderProps, type StyleSet, Switch, type SwitchProps, TAB_FADE_PX, TREE_GUIDE_GLYPHS, Table, type TableCaptionProps, type TableCellProps, type TableGroupRowProps, type TableHeadProps, type TableRootProps, type TableRowProps, TableScrollRegion, type TableScrollRegionProps, type TableSectionProps, Tabs, type TabsListProps, type TabsPanelProps, type TabsRootProps, type TabsTabProps, TagsInput, type TagsInputProps, TerminalFrame, type TerminalFrameLine, type TerminalFrameProps, type TerminalLine, type TerminalLineTone, type TerminalScript, type TerminalStep, TextScramble, type TextScrambleProps, Textarea, type TextareaProps, type ThemeContextValue, type ThemeManifest, type ThemeName, ThemeProvider, type ThemeProviderProps, type ThemeRegistry, Timeline, type TimelineContentProps, type TimelineItemProps, type TimelineMarkerProps, type TimelineRootProps, TitleBar, type TitleBarProps, Toast, type ToastManager, type ToastOptions, type ToastProviderProps, type ToastTone, type ToastViewportProps, Toggle, ToggleGroup, type ToggleGroupProps, type ToggleProps, type TokenOverrides, Toolbar, type ToolbarButtonProps, type ToolbarGroupProps, type ToolbarRootProps, type ToolbarSeparatorProps, Tooltip, type TooltipContentProps, type TooltipProviderProps, type TooltipRootProps, type TooltipTriggerProps, Tree, type TreeGuide, type TreeItem, type TreeProps, type TreeRow, type TreeVisibility, TreeVisibilityToggle, type TreeVisibilityToggleProps, TwoStepButton, type TwoStepButtonProps, type TwoStepTone, type UploadFile, type UploadStatus, UsageChart, type UsageChartPoint, type UsageChartProps, type UsageChartTone, activateRowFromClick, activateRowFromKeyDown, agentColor, agentColorStyle, bareControlClasses, buttonVariants, chipVariants, computeScrollEdges, controlClasses, controlGroupFocusClasses, controlSurface, controlVariants, edgeFadeMask, envReference, flattenTree, isSafeTokenValue, itemVariants, linkVariants, menuItemClasses, menuLabelClasses, menuPopupClasses, menuSeparatorClasses, overlayDescriptionClasses, overlayFooterClasses, overlayModalTransitionClasses, overlayPopupTransitionClasses, overlayPositionerClasses, overlaySurfaceClasses, overlayTextClasses, overlayTitleClasses, paginationRange, parseEnvReference, partitionFiles, prepaintScript, rowVariants, scrimClasses, useControlHeight, useCuePortalProps, useDensities, useDensity, useFonts, useFrameClock, useSidebar, useStill, useTheme, useThemes, useToast };
+export { AGENT_COLOR_PROPERTY, AGENT_HUES, AGENT_ROOT_COLOR, Accordion, type AccordionHeaderProps, type AccordionItemProps, type AccordionPanelProps, type AccordionRootProps, type AccordionTriggerProps, type AgentColorOptions, AgentPile, type AgentPileEntry, type AgentPileProps, type AgentPileSize, AlertDialog, type AlertDialogActionProps, type AlertDialogCancelProps, type AlertDialogContentProps, type AlertDialogDescriptionProps, type AlertDialogFooterProps, type AlertDialogRootProps, type AlertDialogTitleProps, type AlertDialogTriggerProps, AnnouncementBar, type AnnouncementBarAction, type AnnouncementBarProps, AppBar, type AppBarActionsProps, type AppBarBrandProps, type AppBarLinkProps, type AppBarNavProps, type AppBarRegister, type AppBarRootProps, type AppBarSeparatorProps, AppShell, type AppShellAsideProps, type AppShellBarProps, type AppShellBodyProps, type AppShellContentProps, type AppShellNavTriggerProps, type AppShellRootProps, type AppShellScrollerProps, type AppShellSidebarProps, AppWindowFrame, type AppWindowFrameProps, type AskAnswer, AskBox, type AskBoxProps, type AskDanger, type AskKind, type AskOption, AudienceIcon, Autocomplete, type AutocompleteProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, type AvatarSize, Band, type BandProps, type BandSeparation, type BandWidth, type BarOverflow, Bento, type BentoColumns, type BentoMinHeight, type BentoRootProps, type BentoRowSpan, type BentoRows, type BentoSpan, type BentoTileProps, type BrandAssetProps, type BrandSize, type BrandTone, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, Button, ButtonGroup, type ButtonGroupOrientation, type ButtonGroupProps, type ButtonProps, Card, type CardContentProps, type CardDescriptionProps, type CardFooterProps, type CardHeaderProps, type CardRootProps, type CardTitleProps, CatalogueIcon, ChannelBetaIcon, ChannelReleasedIcon, Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, Chip, type ChipProps, CliToolIcon, CodeBlock, type CodeBlockProps, Collapsible, type CollapsiblePanelProps, type CollapsibleRootProps, type CollapsibleTriggerProps, Combobox, type ComboboxOption, type ComboboxProps, CommandPalette, type CommandPaletteItem, type CommandPaletteProps, Composer, type ComposerProps, type ComposerSubmitKey, Container, type ContainerProps, type ContainerWidth, ContextMenu, type ContextMenuContentProps, type ContextMenuRootProps, type ContextMenuTriggerProps, type ControlSize, type ControlVariantProps, CopyButton, type CopyButtonProps, CueLogotype, type CueLogotypeProps, CueMark, type CueMarkProps, CuePortalFrame, type CuePortalFrameProps, DEFAULT_PAINT, DEFAULT_STORAGE_KEY, DEFAULT_STYLE_SET, DataRow, type DataRowDisclosure, type DataRowRootProps, type DataRowSlotProps, DataTree, type DataTreeItem, type DataTreeProps, type DataTreeRowState, DelegationCard, type DelegationCardProps, type DelegationDirection, type DelegationStatus, Density, type DensityEntry, type DensityLevel, type DensityProps, DescriptionList, type DescriptionListDetailProps, type DescriptionListLayout, type DescriptionListRootProps, type DescriptionListTermProps, Dialog, type DialogCloseProps, type DialogContentProps, type DialogDescriptionProps, type DialogFooterProps, type DialogRootProps, type DialogTitleProps, type DialogTriggerProps, Disclosure, type DisclosureProps, Drawer, type DrawerCloseProps, type DrawerContentProps, type DrawerDescriptionProps, type DrawerFooterProps, type DrawerRootProps, type DrawerSwipeDirection, type DrawerTitleProps, type DrawerTriggerProps, DropdownMenu, type DropdownMenuCheckboxItemProps, type DropdownMenuContentProps, type DropdownMenuGroupProps, type DropdownMenuItemProps, type DropdownMenuLabelProps, type DropdownMenuRootProps, type DropdownMenuSeparatorProps, type DropdownMenuTriggerProps, EmptyState, type EmptyStateProps, EnvVarInput, type EnvVarInputProps, Eyebrow, type EyebrowProps, Field, FieldDescription, type FieldDescriptionProps, FieldError, type FieldErrorProps, type FieldIssue, FieldLabel, type FieldLabelProps, type FieldProps, type FilePartition, type FilePartitionOptions, type FileRejectReason, type FileRejection, FileUpload, type FileUploadProps, FolderIcon, type FontEntry, type FontFamilies, type FontName, FontScope, type FontScopeProps, Footer, type FooterProps, type FormControlSize, type FrameClockOptions, Frames, type FramesHeight, type FramesItemProps, type FramesLayout, type FramesRootProps, GlossObject, type GlossObjectProps, Grid, type GridColumns, type GridProps, GroupBar, type GroupBarItem, type GroupBarProps, type GroupBarTone, Halftone, type HalftoneProps, Hero, type HeroProps, HoverCard, type HoverCardContentProps, type HoverCardRootProps, type HoverCardTriggerProps, IconButton, type IconButtonProps, InfoTip, type InfoTipProps, Input, InputGroup, type InputGroupProps, type InputProps, Inspector, type InspectorFooterProps, type InspectorRootProps, type InspectorRowProps, type InspectorSectionProps, Item, type ItemProps, Kbd, type KbdProps, Keyword, type KeywordProps, Ledger, type LedgerEmptyProps, type LedgerGroupProps, type LedgerRootProps, type LedgerTierProps, Link, type LinkProps, LogoStrip, type LogoStripProps, McpServerIcon, Menubar, type MenubarContentProps, type MenubarMenuProps, type MenubarRootProps, type MenubarTriggerProps, Message, MessageList, type MessageListProps, type MessageProps, type MessageRole, Meter, type MeterProps, type MeterProvenance, type MeterTone, type Mode, Motif, type MotifProps, type MotifVariant, MultiSelect, type MultiSelectProps, NavigationMenu, type NavigationMenuContentProps, type NavigationMenuItemProps, type NavigationMenuLinkProps, type NavigationMenuListProps, type NavigationMenuRootProps, type NavigationMenuTriggerProps, type NavigationMenuViewportProps, NumberField, type NumberFieldProps, OTPField, type OTPFieldProps, OVERLAY_SIDE_OFFSET, PAINTS, PageShell, type PageShellProps, type PageWidth, Pagination, type PaginationEntry, type PaginationProps, type Paint, PaneSeam, type PaneSeamEdge, type PaneSeamOrientation, type PaneSeamProps, Panel, PanelHeader, type PanelHeaderProps, type PanelProps, ParticleLogo, type ParticleLogoProps, ParticleMark, type ParticleMarkProps, PasswordInput, type PasswordInputProps, type PersistedPreferences, Plussie, type PlussieExpression, type PlussieProps, Popover, type PopoverCloseProps, type PopoverContentProps, type PopoverDescriptionProps, type PopoverRootProps, type PopoverTitleProps, type PopoverTriggerProps, type PrepaintDefaults, type PrepaintOptions, Preview, type PreviewAxis, type PreviewGround, type PreviewPresentation, type PreviewProps, type PreviewResizeOptions, Progress, type ProgressProps, Radio, RadioGroup, type RadioGroupProps, type RadioProps, Rating, type RatingProps, type RatingSize, type ResolvedMode, Reveal, type RevealProps, Ribbon, type RibbonProps, Row, type RowProps, STYLE_SETS, ScrollArea, type ScrollAreaOrientation, type ScrollAreaProps, type ScrollEdges, ScrollableTabsList, type ScrollableTabsListProps, ScrubInput, type ScrubInputProps, SeamCell, type SeamCellProps, SeamGrid, type SeamGridProps, type SeamGround, SeamList, type SeamListProps, SearchInput, type SearchInputProps, SectionHeader, type SectionHeaderProps, SegmentedControl, type SegmentedControlItem, type SegmentedControlProps, type SegmentedControlSize, Select, type SelectOption, type SelectProps, Separator, type SeparatorProps, Sheet, type SheetCloseProps, type SheetContentProps, type SheetDescriptionProps, type SheetFooterProps, type SheetRootProps, type SheetTitleProps, type SheetTriggerProps, Sidebar, type SidebarItemProps, type SidebarRailProps, type SidebarRootProps, type SidebarSectionProps, Skeleton, type SkeletonProps, SkillIcon, Slider, type SliderProps, type SpaceStep, Sparkline, type SparklineProps, Spinner, type SpinnerProps, SplitPane, type SplitPaneLayout, type SplitPaneProps, Stack, type StackAlign, StackIcon, type StackJustify, type StackProps, StacksMatrixIcon, Stat, StatBand, type StatBandProps, type StatBandStat, type StatProps, type StatTone, StatusBar, type StatusBarGroupProps, type StatusBarItemProps, type StatusBarProminence, type StatusBarProps, type StatusBarTone, StatusDot, type StatusDotProps, type StatusTone, Stepper, type StepperProps, type StepperState, type StepperStep, StillProvider, type StillProviderProps, type StyleSet, Switch, type SwitchProps, TAB_FADE_PX, TREE_GUIDE_GLYPHS, Table, type TableCaptionProps, type TableCellProps, type TableGroupRowProps, type TableHeadProps, type TableRootProps, type TableRowProps, TableScrollRegion, type TableScrollRegionProps, type TableSectionProps, Tabs, type TabsListProps, type TabsPanelProps, type TabsRootProps, type TabsTabProps, TagsInput, type TagsInputProps, TerminalFrame, type TerminalFrameLine, type TerminalFrameProps, type TerminalLine, type TerminalLineTone, type TerminalScript, type TerminalStep, TextScramble, type TextScrambleProps, Textarea, type TextareaProps, type ThemeContextValue, type ThemeManifest, type ThemeName, ThemeProvider, type ThemeProviderProps, type ThemeRegistry, Timeline, type TimelineContentProps, type TimelineItemProps, type TimelineMarkerProps, type TimelineRootProps, TitleBar, type TitleBarProps, Toast, type ToastManager, type ToastOptions, type ToastProviderProps, type ToastTone, type ToastViewportProps, Toggle, ToggleGroup, type ToggleGroupProps, type ToggleProps, type TokenOverrides, Toolbar, type ToolbarButtonProps, type ToolbarGroupProps, type ToolbarRootProps, type ToolbarSeparatorProps, Tooltip, type TooltipContentProps, type TooltipProviderProps, type TooltipRootProps, type TooltipTriggerProps, Tree, type TreeGuide, type TreeItem, type TreeProps, type TreeRow, type TreeVisibility, TreeVisibilityToggle, type TreeVisibilityToggleProps, TwoStepButton, type TwoStepButtonProps, type TwoStepTone, type UploadFile, type UploadStatus, UsageChart, type UsageChartPoint, type UsageChartProps, type UsageChartTone, activateRowFromClick, activateRowFromKeyDown, agentColor, agentColorStyle, bareControlClasses, buttonVariants, chipVariants, computeScrollEdges, controlClasses, controlGroupFocusClasses, controlSurface, controlVariants, edgeFadeMask, envReference, flattenTree, isSafeTokenValue, itemVariants, linkVariants, menuItemClasses, menuLabelClasses, menuPopupClasses, menuSeparatorClasses, overlayDescriptionClasses, overlayFooterClasses, overlayModalTransitionClasses, overlayPopupTransitionClasses, overlayPositionerClasses, overlaySurfaceClasses, overlayTextClasses, overlayTitleClasses, paginationRange, parseEnvReference, partitionFiles, prepaintScript, rowVariants, scrimClasses, useControlHeight, useCuePortalProps, useDensities, useDensity, useFonts, useFrameClock, useSidebar, useStill, useTheme, useThemes, useToast };

package/dist/index.js

@@ -105,7 +105,9 @@ import { Accordion } from "./layout/accordion.js";
 import { Stack } from "./layout/stack.js";
 import { Bento } from "./layout/bento.js";
 import { Breadcrumb } from "./layout/breadcrumb.js";
+import { PaneSeam } from "./layout/pane-seam.js";
 import { Reveal } from "./layout/reveal.js";
+import { SplitPane } from "./layout/split-pane.js";
 import { Card } from "./layout/card.js";
 import { Collapsible, Disclosure } from "./layout/collapsible.js";
 import { DescriptionList } from "./layout/description-list.js";
@@ -137,4 +139,4 @@ import { useTheme } from "./system/use-theme.js";
 import { useFrameClock } from "./system/frame-clock.js";
 import { FontScope } from "./system/font-scope.js";
 import { DEFAULT_PAINT, DEFAULT_STYLE_SET, PAINTS, STYLE_SETS } from "./system/index.js";
-export { AGENT_COLOR_PROPERTY, AGENT_HUES, AGENT_ROOT_COLOR, Accordion, AgentPile, AlertDialog, AnnouncementBar, AppBar, AppShell, AppWindowFrame, AskBox, AudienceIcon, Autocomplete, Avatar, AvatarGroup, Band, Bento, Breadcrumb, Button, ButtonGroup, Card, CatalogueIcon, ChannelBetaIcon, ChannelReleasedIcon, Checkbox, CheckboxGroup, Chip, CliToolIcon, CodeBlock, Collapsible, Combobox, CommandPalette, Composer, Container, ContextMenu, CopyButton, CueLogotype, CueMark, CuePortalFrame, DEFAULT_PAINT, DEFAULT_STORAGE_KEY, DEFAULT_STYLE_SET, DataRow, DataTree, DelegationCard, Density, DescriptionList, Dialog, Disclosure, Drawer, DropdownMenu, EmptyState, EnvVarInput, Eyebrow, Field, FieldDescription, FieldError, FieldLabel, FileUpload, FolderIcon, FontScope, Footer, Frames, GlossObject, Grid, GroupBar, Halftone, Hero, HoverCard, IconButton, InfoTip, Input, InputGroup, Inspector, Item, Kbd, Keyword, Ledger, Link, LogoStrip, McpServerIcon, Menubar, Message, MessageList, Meter, Motif, MultiSelect, NavigationMenu, NumberField, OTPField, OVERLAY_SIDE_OFFSET, PAINTS, PageShell, Pagination, Panel, PanelHeader, ParticleLogo, ParticleMark, PasswordInput, Plussie, Popover, Preview, Progress, Radio, RadioGroup, Rating, Reveal, Ribbon, Row, STYLE_SETS, ScrollArea, ScrollableTabsList, ScrubInput, SeamCell, SeamGrid, SeamList, SearchInput, SectionHeader, SegmentedControl, Select, Separator, Sheet, Sidebar, Skeleton, SkillIcon, Slider, Sparkline, Spinner, Stack, StackIcon, StacksMatrixIcon, Stat, StatBand, StatusBar, StatusDot, Stepper, StillProvider, Switch, TAB_FADE_PX, TREE_GUIDE_GLYPHS, Table, TableScrollRegion, Tabs, TagsInput, TerminalFrame, TextScramble, Textarea, ThemeProvider, Timeline, TitleBar, Toast, Toggle, ToggleGroup, Toolbar, Tooltip, Tree, TreeVisibilityToggle, TwoStepButton, UsageChart, activateRowFromClick, activateRowFromKeyDown, agentColor, agentColorStyle, bareControlClasses, buttonVariants, chipVariants, computeScrollEdges, controlClasses, controlGroupFocusClasses, controlSurface, controlVariants, edgeFadeMask, envReference, flattenTree, isSafeTokenValue, itemVariants, linkVariants, menuItemClasses, menuLabelClasses, menuPopupClasses, menuSeparatorClasses, overlayDescriptionClasses, overlayFooterClasses, overlayModalTransitionClasses, overlayPopupTransitionClasses, overlayPositionerClasses, overlaySurfaceClasses, overlayTextClasses, overlayTitleClasses, paginationRange, parseEnvReference, partitionFiles, prepaintScript, rowVariants, scrimClasses, useControlHeight, useCuePortalProps, useDensities, useDensity, useFonts, useFrameClock, useSidebar, useStill, useTheme, useThemes, useToast };
+export { AGENT_COLOR_PROPERTY, AGENT_HUES, AGENT_ROOT_COLOR, Accordion, AgentPile, AlertDialog, AnnouncementBar, AppBar, AppShell, AppWindowFrame, AskBox, AudienceIcon, Autocomplete, Avatar, AvatarGroup, Band, Bento, Breadcrumb, Button, ButtonGroup, Card, CatalogueIcon, ChannelBetaIcon, ChannelReleasedIcon, Checkbox, CheckboxGroup, Chip, CliToolIcon, CodeBlock, Collapsible, Combobox, CommandPalette, Composer, Container, ContextMenu, CopyButton, CueLogotype, CueMark, CuePortalFrame, DEFAULT_PAINT, DEFAULT_STORAGE_KEY, DEFAULT_STYLE_SET, DataRow, DataTree, DelegationCard, Density, DescriptionList, Dialog, Disclosure, Drawer, DropdownMenu, EmptyState, EnvVarInput, Eyebrow, Field, FieldDescription, FieldError, FieldLabel, FileUpload, FolderIcon, FontScope, Footer, Frames, GlossObject, Grid, GroupBar, Halftone, Hero, HoverCard, IconButton, InfoTip, Input, InputGroup, Inspector, Item, Kbd, Keyword, Ledger, Link, LogoStrip, McpServerIcon, Menubar, Message, MessageList, Meter, Motif, MultiSelect, NavigationMenu, NumberField, OTPField, OVERLAY_SIDE_OFFSET, PAINTS, PageShell, Pagination, PaneSeam, Panel, PanelHeader, ParticleLogo, ParticleMark, PasswordInput, Plussie, Popover, Preview, Progress, Radio, RadioGroup, Rating, Reveal, Ribbon, Row, STYLE_SETS, ScrollArea, ScrollableTabsList, ScrubInput, SeamCell, SeamGrid, SeamList, SearchInput, SectionHeader, SegmentedControl, Select, Separator, Sheet, Sidebar, Skeleton, SkillIcon, Slider, Sparkline, Spinner, SplitPane, Stack, StackIcon, StacksMatrixIcon, Stat, StatBand, StatusBar, StatusDot, Stepper, StillProvider, Switch, TAB_FADE_PX, TREE_GUIDE_GLYPHS, Table, TableScrollRegion, Tabs, TagsInput, TerminalFrame, TextScramble, Textarea, ThemeProvider, Timeline, TitleBar, Toast, Toggle, ToggleGroup, Toolbar, Tooltip, Tree, TreeVisibilityToggle, TwoStepButton, UsageChart, activateRowFromClick, activateRowFromKeyDown, agentColor, agentColorStyle, bareControlClasses, buttonVariants, chipVariants, computeScrollEdges, controlClasses, controlGroupFocusClasses, controlSurface, controlVariants, edgeFadeMask, envReference, flattenTree, isSafeTokenValue, itemVariants, linkVariants, menuItemClasses, menuLabelClasses, menuPopupClasses, menuSeparatorClasses, overlayDescriptionClasses, overlayFooterClasses, overlayModalTransitionClasses, overlayPopupTransitionClasses, overlayPositionerClasses, overlaySurfaceClasses, overlayTextClasses, overlayTitleClasses, paginationRange, parseEnvReference, partitionFiles, prepaintScript, rowVariants, scrimClasses, useControlHeight, useCuePortalProps, useDensities, useDensity, useFonts, useFrameClock, useSidebar, useStill, useTheme, useThemes, useToast };

package/dist/instruments/_ledger-disclosure.js

@@ -88,7 +88,7 @@ function LedgerDisclosure({ headingLevel, headingSlot, headingClassName, toggleS
 			children: [/* @__PURE__ */ jsx(ChevronRightGlyph, {
 				"aria-hidden": "true",
 				"data-slot": `${toggleSlot}-glyph`,
-				className: cn("size-icon-sm shrink-0 self-center transition-transform duration-150 motion-reduce:transition-none", expanded ? "rotate-90" : null)
+				className: cn("size-icon-sm shrink-0 self-center transition-transform duration-fast motion-reduce:transition-none", expanded ? "rotate-90" : null)
 			}), label]
 		})
 	}), /* @__PURE__ */ jsx("div", {

package/dist/instruments/data-tree.js

@@ -286,7 +286,7 @@ const DataTree = React.forwardRef(function DataTree({ className, items, expanded
 						setExpanded(item.id, !row.expanded);
 					},
 					className: "flex size-icon-sm shrink-0 cursor-pointer items-center justify-center text-fg-subtle",
-					children: /* @__PURE__ */ jsx(ChevronRightGlyph, { className: cn("size-icon-sm transition-transform duration-150 motion-reduce:transition-none", row.expanded ? "rotate-90" : null) })
+					children: /* @__PURE__ */ jsx(ChevronRightGlyph, { className: cn("size-icon-sm transition-transform duration-fast motion-reduce:transition-none", row.expanded ? "rotate-90" : null) })
 				}) : /* @__PURE__ */ jsx("span", {
 					"aria-hidden": "true",
 					className: "size-icon-sm shrink-0"

package/dist/instruments/meter.js

@@ -80,7 +80,7 @@ const Meter = React.forwardRef(function Meter({ className, percent, tone = "ok",
 		...elementProps,
 		children: [hasLevel ? /* @__PURE__ */ jsx("div", {
 			"data-slot": "meter-fill",
-			className: cn("absolute inset-y-0 left-0 bg-current transition-[width] duration-150 ease-out motion-reduce:transition-none", overPace ? "animate-pulse motion-reduce:animate-none" : null),
+			className: cn("absolute inset-y-0 left-0 bg-current transition-[width] duration-fast ease-out motion-reduce:transition-none", overPace ? "animate-pulse motion-reduce:animate-none" : null),
 			style: {
 				width: `${pct}%`,
 				backgroundImage: provenance === "estimated" ? ESTIMATED_HATCH : void 0

package/dist/instruments/seam-grid.js

@@ -72,7 +72,7 @@ const SeamCell = React.forwardRef(function SeamCell({ className, ground = "surfa
 		ref,
 		"data-slot": "seam-cell",
 		"data-ground": ground,
-		className: cn("min-w-0", GROUNDS[ground], flush ? null : "p-(--cue-space-5)", interactive ? "cursor-pointer transition-colors duration-150 hover:bg-surface-2 motion-reduce:transition-none" : null, className),
+		className: cn("min-w-0", GROUNDS[ground], flush ? null : "p-(--cue-space-5)", interactive ? "cursor-pointer transition-colors duration-fast hover:bg-surface-2 motion-reduce:transition-none" : null, className),
 		...elementProps
 	});
 });

package/dist/layout/_collapse.js

@@ -30,7 +30,7 @@ import { QUIET_INK } from "../system/_style-quiet-ink.js";
 * size and leading and the hover ground, and lane R6.Z its weight (falling back
 * through the label weight to the `400` it drew), the same way.
 */
-const collapseTriggerClasses = `group/collapse flex ${COLLAPSE_HEIGHT} w-full cursor-pointer items-center ${COLLAPSE_GAP} ${COLLAPSE_PAD} ${COLLAPSE_RADIUS} text-left ${CONTROL_FACE} ${COLLAPSE_SIZE} ${COLLAPSE_LEADING} ${QUIET_INK} ${COLLAPSE_WEIGHT} transition-colors duration-150 outline-none select-none ${COLLAPSE_HOVER_INK} ${COLLAPSE_HOVER_GROUND} ${COLLAPSE_FOCUS_RING} ${COLLAPSE_OPEN_INK} data-[disabled]:pointer-events-none data-[disabled]:opacity-40`;
+const collapseTriggerClasses = `group/collapse flex ${COLLAPSE_HEIGHT} w-full cursor-pointer items-center ${COLLAPSE_GAP} ${COLLAPSE_PAD} ${COLLAPSE_RADIUS} text-left ${CONTROL_FACE} ${COLLAPSE_SIZE} ${COLLAPSE_LEADING} ${QUIET_INK} ${COLLAPSE_WEIGHT} transition-colors duration-fast outline-none select-none ${COLLAPSE_HOVER_INK} ${COLLAPSE_HOVER_GROUND} ${COLLAPSE_FOCUS_RING} ${COLLAPSE_OPEN_INK} data-[disabled]:pointer-events-none data-[disabled]:opacity-40`;
 /** The label between the summary row's gutters — truncates, never wraps. */
 const collapseLabelClasses = "min-w-0 flex-1 truncate";
 /**
@@ -39,7 +39,7 @@ const collapseLabelClasses = "min-w-0 flex-1 truncate";
 * Its size and ink read the style set (round 6, lane R6.Z), falling back to
 * the `icon-sm` and `fg-subtle` it drew.
 */
-const collapseCaretClasses = `${COLLAPSE_CARET_SIZE} shrink-0 ${COLLAPSE_CARET_INK} ${COLLAPSE_CARET_OPACITY} transition-transform duration-150 ease-out group-data-[panel-open]/collapse:rotate-90 motion-reduce:transition-none`;
+const collapseCaretClasses = `${COLLAPSE_CARET_SIZE} shrink-0 ${COLLAPSE_CARET_INK} ${COLLAPSE_CARET_OPACITY} transition-transform duration-fast ease-out group-data-[panel-open]/collapse:rotate-90 motion-reduce:transition-none`;
 /**
 * Enter/exit for a panel, animated from the height Base UI measures for us.
 *
@@ -48,7 +48,7 @@ const collapseCaretClasses = `${COLLAPSE_CARET_SIZE} shrink-0 ${COLLAPSE_CARET_I
 * make the panel jump at both ends. The body lives one element in — see
 * {@link collapsePanelBodyClasses}.
 */
-const PANEL_MOTION = "overflow-hidden transition-[height] duration-150 ease-out motion-reduce:transition-none data-[starting-style]:h-0 data-[ending-style]:h-0";
+const PANEL_MOTION = "overflow-hidden transition-[height] duration-fast ease-out motion-reduce:transition-none data-[starting-style]:h-0 data-[ending-style]:h-0";
 /** {@link PANEL_MOTION} against the accordion's measured height. */
 const accordionPanelClasses = `${PANEL_MOTION} h-(--accordion-panel-height)`;
 /** {@link PANEL_MOTION} against the collapsible's measured height. */

package/dist/layout/bento.js

@@ -58,7 +58,7 @@ const MIN_HEIGHT_CLASSES = {
 /** The tile surface, shared by both variants so a link tile is not a second look. */
 const TILE_CLASS = "flex flex-col gap-(--cue-space-3) overflow-hidden rounded-surface border border-border bg-surface-1 p-(--cue-space-5)";
 /** What a link tile adds: the hover tint and the focus ring the whole surface takes. */
-const LINK_TILE_CLASS = `no-underline transition-colors duration-150 outline-none hover:bg-surface-2 ${FOCUS_RING_OFFSET_2}`;
+const LINK_TILE_CLASS = `no-underline transition-colors duration-fast outline-none hover:bg-surface-2 ${FOCUS_RING_OFFSET_2}`;
 /** The host elements a link tile may not contain, plus anything carrying `tabIndex`. */
 const INTERACTIVE_TAGS = /* @__PURE__ */ new Set([
 	"a",

package/dist/layout/breadcrumb.js

@@ -11,7 +11,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 * face, hover ink and the trail's gap read the style set (round 6, spec §11,
 * lane R6.Z: `_style-crumb.ts`), each falling back to what it drew.
 */
-const CRUMB_LINK_CLASSES = `cursor-pointer rounded-control border-0 bg-transparent p-0 ${CRUMB_FACE} ${CRUMB_SIZE} ${CRUMB_INK} no-underline transition-colors duration-150 outline-none ${CRUMB_HOVER_INK} ${FOCUS_RING_OFFSET_2}`;
+const CRUMB_LINK_CLASSES = `cursor-pointer rounded-control border-0 bg-transparent p-0 ${CRUMB_FACE} ${CRUMB_SIZE} ${CRUMB_INK} no-underline transition-colors duration-fast outline-none ${CRUMB_HOVER_INK} ${FOCUS_RING_OFFSET_2}`;
 /**
 * Where you are, and how to get back.
 *

package/dist/layout/carousel.js

@@ -203,7 +203,7 @@ const Carousel = {
 				"aria-label": dotLabel(index),
 				"aria-current": index === selectedIndex ? "true" : void 0,
 				onClick: () => scrollTo(index),
-				className: cn(`size-[0.25rem] cursor-pointer rounded-full border-0 p-0 transition-colors duration-150 outline-none ${FOCUS_RING_OFFSET_2} motion-reduce:transition-none`, index === selectedIndex ? "bg-accent" : "bg-border-strong")
+				className: cn(`size-[0.25rem] cursor-pointer rounded-full border-0 p-0 transition-colors duration-fast outline-none ${FOCUS_RING_OFFSET_2} motion-reduce:transition-none`, index === selectedIndex ? "bg-accent" : "bg-border-strong")
 			}, index))
 		});
 	})

package/dist/layout/collapsible.js

@@ -99,7 +99,7 @@ const Disclosure = React.forwardRef(function Disclosure({ className, label = "ad
 		children: [/* @__PURE__ */ jsxs(Collapsible.Trigger, {
 			ref,
 			"data-slot": "disclosure-trigger",
-			className: cn(`group/disclosure inline-flex cursor-pointer items-center gap-(--cue-space-2) self-start border-0 bg-transparent p-0 py-(--cue-space-2) text-(length:--cue-text-label) ${DISCLOSURE_INK} ${DISCLOSURE_WEIGHT} transition-colors duration-150 outline-none select-none ${DISCLOSURE_HOVER_INK} ${FOCUS_RING_OFFSET_2}`, LABEL_FACE, LABEL_TRACKING, LABEL_CASE, className),
+			className: cn(`group/disclosure inline-flex cursor-pointer items-center gap-(--cue-space-2) self-start border-0 bg-transparent p-0 py-(--cue-space-2) text-(length:--cue-text-label) ${DISCLOSURE_INK} ${DISCLOSURE_WEIGHT} transition-colors duration-fast outline-none select-none ${DISCLOSURE_HOVER_INK} ${FOCUS_RING_OFFSET_2}`, LABEL_FACE, LABEL_TRACKING, LABEL_CASE, className),
 			...elementProps,
 			children: [
 				/* @__PURE__ */ jsx("span", {

package/dist/layout/index.d.ts

@@ -5,7 +5,9 @@ import { Accordion, AccordionHeaderProps, AccordionItemProps, AccordionPanelProp
 import { SpaceStep, Stack, StackAlign, StackJustify, StackProps } from "./stack.js";
 import { Bento, BentoColumns, BentoMinHeight, BentoRootProps, BentoRowSpan, BentoRows, BentoSpan, BentoTileProps } from "./bento.js";
 import { Breadcrumb, BreadcrumbItem, BreadcrumbProps } from "./breadcrumb.js";
+import { PaneSeam, PaneSeamEdge, PaneSeamOrientation, PaneSeamProps } from "./pane-seam.js";
 import { Reveal, RevealProps } from "./reveal.js";
+import { SplitPane, SplitPaneLayout, SplitPaneProps } from "./split-pane.js";
 import { Card, CardContentProps, CardDescriptionProps, CardFooterProps, CardHeaderProps, CardRootProps, CardTitleProps } from "./card.js";
 import { Collapsible, CollapsiblePanelProps, CollapsibleRootProps, CollapsibleTriggerProps, Disclosure, DisclosureProps } from "./collapsible.js";
 import { DescriptionList, DescriptionListDetailProps, DescriptionListLayout, DescriptionListRootProps, DescriptionListTermProps } from "./description-list.js";
@@ -17,4 +19,4 @@ import { Pagination, PaginationEntry, PaginationProps, paginationRange } from ".
 import { Preview, PreviewAxis, PreviewPresentation, PreviewProps, PreviewResizeOptions } from "./preview.js";
 import { Stepper, StepperProps, StepperState, StepperStep } from "./stepper.js";
 import { Timeline, TimelineContentProps, TimelineItemProps, TimelineMarkerProps, TimelineRootProps } from "./timeline.js";
-export { Accordion, type AccordionHeaderProps, type AccordionItemProps, type AccordionPanelProps, type AccordionRootProps, type AccordionTriggerProps, Bento, type BentoColumns, type BentoMinHeight, type BentoRootProps, type BentoRowSpan, type BentoRows, type BentoSpan, type BentoTileProps, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, Card, type CardContentProps, type CardDescriptionProps, type CardFooterProps, type CardHeaderProps, type CardRootProps, type CardTitleProps, Collapsible, type CollapsiblePanelProps, type CollapsibleRootProps, type CollapsibleTriggerProps, Container, type ContainerProps, type ContainerWidth, DescriptionList, type DescriptionListDetailProps, type DescriptionListLayout, type DescriptionListRootProps, type DescriptionListTermProps, Disclosure, type DisclosureProps, Frames, type FramesHeight, type FramesItemProps, type FramesLayout, type FramesRootProps, Grid, type GridColumns, type GridProps, Item, type ItemProps, Link, type LinkProps, Pagination, type PaginationEntry, type PaginationProps, Preview, type PreviewAxis, type PreviewGround, type PreviewPresentation, type PreviewProps, type PreviewResizeOptions, Reveal, type RevealProps, Sidebar, type SidebarItemProps, type SidebarRailProps, type SidebarRootProps, type SidebarSectionProps, type SpaceStep, Stack, type StackAlign, type StackJustify, type StackProps, Stepper, type StepperProps, type StepperState, type StepperStep, Timeline, type TimelineContentProps, type TimelineItemProps, type TimelineMarkerProps, type TimelineRootProps, itemVariants, linkVariants, paginationRange, useSidebar };
+export { Accordion, type AccordionHeaderProps, type AccordionItemProps, type AccordionPanelProps, type AccordionRootProps, type AccordionTriggerProps, Bento, type BentoColumns, type BentoMinHeight, type BentoRootProps, type BentoRowSpan, type BentoRows, type BentoSpan, type BentoTileProps, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, Card, type CardContentProps, type CardDescriptionProps, type CardFooterProps, type CardHeaderProps, type CardRootProps, type CardTitleProps, Collapsible, type CollapsiblePanelProps, type CollapsibleRootProps, type CollapsibleTriggerProps, Container, type ContainerProps, type ContainerWidth, DescriptionList, type DescriptionListDetailProps, type DescriptionListLayout, type DescriptionListRootProps, type DescriptionListTermProps, Disclosure, type DisclosureProps, Frames, type FramesHeight, type FramesItemProps, type FramesLayout, type FramesRootProps, Grid, type GridColumns, type GridProps, Item, type ItemProps, Link, type LinkProps, Pagination, type PaginationEntry, type PaginationProps, PaneSeam, type PaneSeamEdge, type PaneSeamOrientation, type PaneSeamProps, Preview, type PreviewAxis, type PreviewGround, type PreviewPresentation, type PreviewProps, type PreviewResizeOptions, Reveal, type RevealProps, Sidebar, type SidebarItemProps, type SidebarRailProps, type SidebarRootProps, type SidebarSectionProps, type SpaceStep, SplitPane, type SplitPaneLayout, type SplitPaneProps, Stack, type StackAlign, type StackJustify, type StackProps, Stepper, type StepperProps, type StepperState, type StepperStep, Timeline, type TimelineContentProps, type TimelineItemProps, type TimelineMarkerProps, type TimelineRootProps, itemVariants, linkVariants, paginationRange, useSidebar };

package/dist/layout/index.js

@@ -5,7 +5,9 @@ import { Accordion } from "./accordion.js";
 import { Stack } from "./stack.js";
 import { Bento } from "./bento.js";
 import { Breadcrumb } from "./breadcrumb.js";
+import { PaneSeam } from "./pane-seam.js";
 import { Reveal } from "./reveal.js";
+import { SplitPane } from "./split-pane.js";
 import { Card } from "./card.js";
 import { Collapsible, Disclosure } from "./collapsible.js";
 import { DescriptionList } from "./description-list.js";
@@ -16,4 +18,4 @@ import { Pagination, paginationRange } from "./pagination.js";
 import { Preview } from "./preview.js";
 import { Stepper } from "./stepper.js";
 import { Timeline } from "./timeline.js";
-export { Accordion, Bento, Breadcrumb, Card, Collapsible, Container, DescriptionList, Disclosure, Frames, Grid, Item, Link, Pagination, Preview, Reveal, Sidebar, Stack, Stepper, Timeline, itemVariants, linkVariants, paginationRange, useSidebar };
+export { Accordion, Bento, Breadcrumb, Card, Collapsible, Container, DescriptionList, Disclosure, Frames, Grid, Item, Link, Pagination, PaneSeam, Preview, Reveal, Sidebar, SplitPane, Stack, Stepper, Timeline, itemVariants, linkVariants, paginationRange, useSidebar };

package/dist/layout/item.js

@@ -24,7 +24,7 @@ const itemVariants = cva("flex w-full items-center gap-(--cue-space-4) rounded-c
 			soft: "bg-surface-2"
 		},
 		interactive: {
-			true: `cursor-pointer transition-colors duration-150 outline-none hover:bg-surface-2 ${FOCUS_RING} disabled:pointer-events-none disabled:opacity-40`,
+			true: `cursor-pointer transition-colors duration-fast outline-none hover:bg-surface-2 ${FOCUS_RING} disabled:pointer-events-none disabled:opacity-40`,
 			false: ""
 		}
 	},

package/dist/layout/link.js

@@ -38,7 +38,7 @@ import { useRender } from "@base-ui/react/use-render";
 * @example
 * <a className={linkVariants({ variant: "underline" })} href="/docs">Docs</a>
 */
-const linkVariants = cva(`cursor-pointer rounded-control ${CONTROL_FACE} ${LINK_WEIGHT} transition-colors duration-150 outline-none ${HOVER_INK} ${LINK_FOCUS_RING}`, {
+const linkVariants = cva(`cursor-pointer rounded-control ${CONTROL_FACE} ${LINK_WEIGHT} transition-colors duration-fast outline-none ${HOVER_INK} ${LINK_FOCUS_RING}`, {
 	variants: { variant: {
 		plain: `no-underline ${LINK_INK}`,
 		underline: `underline ${INLINE_LINK_INK} ${LINK_RULE} ${LINK_OFFSET} ${HOVER_RULE}`

package/dist/layout/pagination.js

@@ -62,7 +62,7 @@ function paginationRange(page, pageCount, siblingCount = 1) {
 		return typeof before === "number" && typeof after === "number" && after - before === 2 ? before + 1 : entry;
 	});
 }
-const PAGE_BUTTON_CLASSES = `inline-flex h-control-sm min-w-control-sm cursor-pointer items-center justify-center rounded-control border-0 bg-transparent px-(--cue-space-2) ${CONTROL_FACE} font-[number:var(--cue-style-control-weight,inherit)] text-(length:--cue-text-ui) tabular-nums ${GHOST_INK} transition-colors duration-150 outline-none select-none hover:bg-surface-2 hover:text-fg ${FOCUS_RING_INSET}`;
+const PAGE_BUTTON_CLASSES = `inline-flex h-control-sm min-w-control-sm cursor-pointer items-center justify-center rounded-control border-0 bg-transparent px-(--cue-space-2) ${CONTROL_FACE} font-[number:var(--cue-style-control-weight,inherit)] text-(length:--cue-text-ui) tabular-nums ${GHOST_INK} transition-colors duration-fast outline-none select-none hover:bg-surface-2 hover:text-fg ${FOCUS_RING_INSET}`;
 /**
 * The pager: previous, a window of page numbers, next.
 *

package/dist/layout/pane-seam.d.ts

@@ -0,0 +1,75 @@
+import * as React from "react";
+//#region src/layout/pane-seam.d.ts
+/** Which way the seam runs: between side-by-side panes, or between stacked ones. */
+type PaneSeamOrientation = "vertical" | "horizontal";
+/** Which side of the seam the pane it resizes sits on. */
+type PaneSeamEdge = "start" | "end";
+interface PaneSeamProps extends Omit<React.ComponentPropsWithoutRef<"div">, "children" | "defaultValue" | "onChange"> {
+  /**
+   * The name a screen reader lists the seam by: `Resize the inspector`. Required,
+   * because a separator nobody can name is one a keyboard user cannot find.
+   */
+  label: string;
+  /** The pane's size in pixels, when the caller holds it. */
+  value?: number;
+  /** The size to start from when nothing controls it. Defaults to `min`. */
+  defaultValue?: number;
+  /** Called with every new size, already clamped to `min` and `max`. */
+  onValueChange?: (value: number) => void;
+  /** The smallest the pane may become, in pixels. */
+  min: number;
+  /** The largest the pane may become, in pixels. */
+  max: number;
+  /** How far one arrow press moves the seam, in pixels. Defaults to 16. */
+  step?: number;
+  /** How far Shift with an arrow moves it, in pixels. Defaults to 64. */
+  largeStep?: number;
+  /**
+   * `vertical`, the default, divides side-by-side panes and resizes a width;
+   * `horizontal` divides stacked panes and resizes a height.
+   */
+  orientation?: PaneSeamOrientation;
+  /**
+   * Where the pane sits: `start`, the default, before the seam (left, or top),
+   * or `end`, after it. Moving the seam away from the pane grows it. A vertical
+   * seam reads the document's direction, so `start` is the right-hand pane
+   * under `dir="rtl"`.
+   */
+  edge?: PaneSeamEdge;
+}
+/**
+ * One accessible seam that resizes one pane, with no dependency (cue-ui-55).
+ *
+ * `Resizable` divides a frame between panel groups on `react-resizable-panels`,
+ * an optional peer. Most consoles need one thing less: a side pane whose edge a
+ * reader can drag, and move from the keyboard. This is that edge, and nothing
+ * else. It owns a number, not a layout: apply `value` to the pane's width (or
+ * height) and the seam supplies the rest.
+ *
+ * The rest is the part a hand-written separator forgets. It is a focusable
+ * `role="separator"` that says its size and its bounds (`aria-valuenow`,
+ * `-valuemin`, `-valuemax`), so the width is spoken as well as draggable. The
+ * arrows move it by `step`, Shift by `largeStep`, and Home and End jump to the
+ * bounds. Every value is clamped, so the pane can never squeeze its neighbour
+ * out of use.
+ *
+ * @example
+ * const [width, setWidth] = React.useState(320);
+ * const inspector = { width };
+ *
+ * <div className="flex">
+ *   <main className="min-w-0 flex-1">…</main>
+ *   <PaneSeam
+ *     label="Resize the inspector"
+ *     edge="end"
+ *     min={240}
+ *     max={640}
+ *     value={width}
+ *     onValueChange={setWidth}
+ *   />
+ *   <aside style={inspector}>…</aside>
+ * </div>
+ */
+declare const PaneSeam: React.ForwardRefExoticComponent<PaneSeamProps & React.RefAttributes<HTMLDivElement>>;
+//#endregion
+export { PaneSeam, PaneSeamEdge, PaneSeamOrientation, PaneSeamProps };

package/dist/layout/pane-seam.js

@@ -0,0 +1,127 @@
+"use client";
+import { cn } from "../lib/cn.js";
+import { FOCUS_RING_INSET_2 } from "../system/_focus-ring.js";
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/layout/pane-seam.tsx
+const clamp = (value, min, max) => Math.min(max, Math.max(min, value));
+/**
+* One accessible seam that resizes one pane, with no dependency (cue-ui-55).
+*
+* `Resizable` divides a frame between panel groups on `react-resizable-panels`,
+* an optional peer. Most consoles need one thing less: a side pane whose edge a
+* reader can drag, and move from the keyboard. This is that edge, and nothing
+* else. It owns a number, not a layout: apply `value` to the pane's width (or
+* height) and the seam supplies the rest.
+*
+* The rest is the part a hand-written separator forgets. It is a focusable
+* `role="separator"` that says its size and its bounds (`aria-valuenow`,
+* `-valuemin`, `-valuemax`), so the width is spoken as well as draggable. The
+* arrows move it by `step`, Shift by `largeStep`, and Home and End jump to the
+* bounds. Every value is clamped, so the pane can never squeeze its neighbour
+* out of use.
+*
+* @example
+* const [width, setWidth] = React.useState(320);
+* const inspector = { width };
+*
+* <div className="flex">
+*   <main className="min-w-0 flex-1">…</main>
+*   <PaneSeam
+*     label="Resize the inspector"
+*     edge="end"
+*     min={240}
+*     max={640}
+*     value={width}
+*     onValueChange={setWidth}
+*   />
+*   <aside style={inspector}>…</aside>
+* </div>
+*/
+const PaneSeam = React.forwardRef(function PaneSeam({ label, value, defaultValue, onValueChange, min, max, step = 16, largeStep = 64, orientation = "vertical", edge = "start", className, onKeyDown, onPointerDown, onPointerMove, onPointerUp, onPointerCancel, ...elementProps }, ref) {
+	const [own, setOwn] = React.useState(() => clamp(defaultValue ?? min, min, max));
+	const current = clamp(value ?? own, min, max);
+	const drag = React.useRef(null);
+	const [dragging, setDragging] = React.useState(false);
+	const commit = (next) => {
+		const clamped = clamp(Math.round(next), min, max);
+		if (clamped === current) return;
+		if (value === void 0) setOwn(clamped);
+		onValueChange?.(clamped);
+	};
+	/**
+	* Which physical direction grows the pane: +1 is right (or down), -1 left (or
+	* up). Read at the moment of input, from the nearest `dir`, so a seam moved
+	* into a right-to-left subtree follows it.
+	*/
+	const growth = (element) => {
+		const away = edge === "start" ? 1 : -1;
+		if (orientation === "horizontal") return away;
+		return element.closest("[dir]")?.getAttribute("dir") === "rtl" ? -away : away;
+	};
+	return /* @__PURE__ */ jsx("div", {
+		ref,
+		role: "separator",
+		tabIndex: 0,
+		"aria-label": label,
+		"aria-orientation": orientation,
+		"aria-valuenow": current,
+		"aria-valuemin": min,
+		"aria-valuemax": max,
+		"data-slot": "pane-seam",
+		"data-orientation": orientation,
+		"data-edge": edge,
+		"data-dragging": dragging || void 0,
+		className: cn(`relative shrink-0 touch-none bg-border transition-colors duration-fast outline-none select-none hover:bg-accent data-dragging:bg-accent focus-visible:bg-accent ${FOCUS_RING_INSET_2} motion-reduce:transition-none`, orientation === "vertical" ? "min-h-8 w-[0.25rem] cursor-col-resize self-stretch" : "h-[0.25rem] w-full cursor-row-resize", className),
+		onKeyDown: (event) => {
+			onKeyDown?.(event);
+			if (event.defaultPrevented) return;
+			const by = event.shiftKey ? largeStep : step;
+			const forward = orientation === "vertical" ? "ArrowRight" : "ArrowDown";
+			const back = orientation === "vertical" ? "ArrowLeft" : "ArrowUp";
+			let next;
+			if (event.key === forward) next = current + by * growth(event.currentTarget);
+			else if (event.key === back) next = current - by * growth(event.currentTarget);
+			else if (event.key === "Home") next = min;
+			else if (event.key === "End") next = max;
+			if (next === void 0) return;
+			event.preventDefault();
+			commit(next);
+		},
+		onPointerDown: (event) => {
+			onPointerDown?.(event);
+			if (event.defaultPrevented || event.button !== 0) return;
+			event.preventDefault();
+			event.currentTarget.setPointerCapture?.(event.pointerId);
+			drag.current = {
+				pointer: event.pointerId,
+				from: orientation === "vertical" ? event.clientX : event.clientY,
+				size: current,
+				grow: growth(event.currentTarget)
+			};
+			setDragging(true);
+		},
+		onPointerMove: (event) => {
+			onPointerMove?.(event);
+			const held = drag.current;
+			if (held === null || held.pointer !== event.pointerId) return;
+			const at = orientation === "vertical" ? event.clientX : event.clientY;
+			commit(held.size + (at - held.from) * held.grow);
+		},
+		onPointerUp: (event) => {
+			onPointerUp?.(event);
+			if (drag.current?.pointer !== event.pointerId) return;
+			drag.current = null;
+			setDragging(false);
+			event.currentTarget.releasePointerCapture?.(event.pointerId);
+		},
+		onPointerCancel: (event) => {
+			onPointerCancel?.(event);
+			drag.current = null;
+			setDragging(false);
+		},
+		...elementProps
+	});
+});
+//#endregion
+export { PaneSeam };

package/dist/layout/resizable.d.ts

@@ -20,7 +20,8 @@ interface ResizableHandleProps extends React.ComponentProps<typeof Separator> {
  *
  * `react-resizable-panels` is an **optional peer**: import this from
  * `@cueplusplus/ui/layout/resizable`, never from the core barrel, so an app
- * with no split view never installs one.
+ * with no split view never installs one. For one seam beside one pane,
+ * `PaneSeam` in the core barrel needs no peer at all.
  *
  * @example
  * <Resizable.Group orientation="horizontal">

package/dist/layout/resizable.js

@@ -18,7 +18,8 @@ const ResizableOrientationContext = React.createContext("horizontal");
 *
 * `react-resizable-panels` is an **optional peer**: import this from
 * `@cueplusplus/ui/layout/resizable`, never from the core barrel, so an app
-* with no split view never installs one.
+* with no split view never installs one. For one seam beside one pane,
+* `PaneSeam` in the core barrel needs no peer at all.
 *
 * @example
 * <Resizable.Group orientation="horizontal">
@@ -55,7 +56,7 @@ const Resizable = {
 		return /* @__PURE__ */ jsxs(Separator, {
 			elementRef: elementRef ?? ref,
 			"data-slot": "resizable-handle",
-			className: cn(`relative flex items-center justify-center bg-border transition-colors duration-150 outline-none data-[separator=hover]:bg-accent data-[separator=active]:bg-accent data-[separator=focus]:bg-accent ${FOCUS_RING_INSET_2} data-[separator=disabled]:opacity-40 motion-reduce:transition-none`, orientation === "vertical" ? "h-[0.25rem] w-full" : "w-[0.25rem] self-stretch", className),
+			className: cn(`relative flex items-center justify-center bg-border transition-colors duration-fast outline-none data-[separator=hover]:bg-accent data-[separator=active]:bg-accent data-[separator=focus]:bg-accent ${FOCUS_RING_INSET_2} data-[separator=disabled]:opacity-40 motion-reduce:transition-none`, orientation === "vertical" ? "h-[0.25rem] w-full" : "w-[0.25rem] self-stretch", className),
 			...elementProps,
 			children: [withGrip ? /* @__PURE__ */ jsx("span", {
 				"data-slot": "resizable-grip",

package/dist/layout/reveal.js

@@ -23,9 +23,10 @@ const EASE_OUT = "cubic-bezier(0, 0, 0.58, 1)";
 *   <div data-reveal-item>Reason</div>
 * </Reveal>
 */
-const Reveal = React.forwardRef(function Reveal({ distance = 28, rootMargin = "-12% 0px", duration = 500, stagger = 0, className, children, ...props }, ref) {
+const Reveal = React.forwardRef(function Reveal({ distance = 28, rootMargin = "-12% 0px", duration = 500, stagger = 0, className, style, children, ...props }, ref) {
 	const box = React.useRef(null);
 	const still = useStill();
+	const [mounted, setMounted] = React.useState(false);
 	const entered = React.useRef(false);
 	const targets = React.useCallback(() => {
 		const element = box.current;
@@ -33,11 +34,11 @@ const Reveal = React.forwardRef(function Reveal({ distance = 28, rootMargin = "-
 		return stagger > 0 ? [...element.querySelectorAll("[data-reveal-item]")] : [element];
 	}, [stagger]);
 	React.useLayoutEffect(() => {
-		if (still || entered.current) return;
-		for (const target of targets()) {
+		if (!still && !entered.current) for (const target of targets()) {
 			target.style.opacity = "0";
 			target.style.transform = `translateY(${distance}px)`;
 		}
+		setMounted(true);
 	}, [
 		still,
 		distance,
@@ -97,7 +98,12 @@ const Reveal = React.forwardRef(function Reveal({ distance = 28, rootMargin = "-
 			else if (ref !== null) ref.current = node;
 		},
 		"data-slot": "reveal",
-		className: cn(className),
+		"data-reveal-stagger": stagger > 0 ? "" : void 0,
+		className: cn(!still && !mounted && "cue-reveal-pending", className),
+		style: !still && !mounted ? {
+			...style,
+			"--cue-reveal-distance": `${distance}px`
+		} : style,
 		...props,
 		children
 	});

package/dist/layout/sidebar.js

@@ -100,7 +100,7 @@ const SidebarRoot = React.forwardRef(function SidebarRoot({ className, landmark
 			ref,
 			"data-slot": "sidebar",
 			"data-collapsed": collapsed ? "" : void 0,
-			className: cn("group/sidebar relative flex h-full min-h-0 shrink-0 flex-col border-r border-border bg-surface-1 transition-[width] duration-150 ease-out motion-reduce:transition-none", "[counter-reset:cue-rail]", className),
+			className: cn("group/sidebar relative flex h-full min-h-0 shrink-0 flex-col border-r border-border bg-surface-1 transition-[width] duration-fast ease-out motion-reduce:transition-none", "[counter-reset:cue-rail]", className),
 			style: {
 				width: collapsed ? collapsedWidth : width,
 				...style
@@ -161,7 +161,7 @@ const Sidebar = {
 				"data-slot": "sidebar-item",
 				"data-active": active ? "" : void 0,
 				"aria-current": active ? "page" : void 0,
-				className: cn(`relative flex h-control-md w-full cursor-pointer items-center gap-(--cue-space-3) rounded-control border-0 bg-transparent px-(--cue-space-3) text-left font-mono text-(length:--cue-text-ui) no-underline transition-colors duration-150 outline-none select-none hover:bg-surface-2 hover:text-fg ${FOCUS_RING_INSET} ${NAV_ITEM} ${RAIL_COUNTER} disabled:pointer-events-none disabled:opacity-40`, className),
+				className: cn(`relative flex h-control-md w-full cursor-pointer items-center gap-(--cue-space-3) rounded-control border-0 bg-transparent px-(--cue-space-3) text-left font-mono text-(length:--cue-text-ui) no-underline transition-colors duration-fast outline-none select-none hover:bg-surface-2 hover:text-fg ${FOCUS_RING_INSET} ${NAV_ITEM} ${RAIL_COUNTER} disabled:pointer-events-none disabled:opacity-40`, className),
 				children: /* @__PURE__ */ jsxs(Fragment, { children: [
 					Icon === void 0 ? null : /* @__PURE__ */ jsx(Icon, {
 						"aria-hidden": "true",
@@ -193,7 +193,7 @@ const Sidebar = {
 				onClick?.(event);
 				if (!event.defaultPrevented) toggle();
 			},
-			className: cn(`absolute inset-y-0 right-0 w-[0.25rem] translate-x-1/2 cursor-ew-resize border-0 bg-transparent p-0 transition-colors duration-150 outline-none hover:bg-accent ${FOCUS_RING_INSET_2} motion-reduce:transition-none`, className),
+			className: cn(`absolute inset-y-0 right-0 w-[0.25rem] translate-x-1/2 cursor-ew-resize border-0 bg-transparent p-0 transition-colors duration-fast outline-none hover:bg-accent ${FOCUS_RING_INSET_2} motion-reduce:transition-none`, className),
 			...elementProps
 		});
 	})